File tree Expand file tree Collapse file tree 4 files changed +11
-13
lines changed
packages/documentation/src Expand file tree Collapse file tree 4 files changed +11
-13
lines changed Original file line number Diff line number Diff line change @@ -5,8 +5,7 @@ and the initial hover delay will be used again. This feature is actually enabled
5
5
throughout the app but disabled for these demos to help show the default tooltip
6
6
behavior.
7
7
8
- To hook into the hover mode, all you need to do is use the
9
- ` TooltipHoverModeConfig ` component as a parent of all the elements that have
10
- tooltips. The component can either be at the root of your app, or a small
11
- section so that only a few tooltips are "linked together" with this hover mode
12
- flow.
8
+ To hook into the hover mode, all you need to do is use the ` HoverModeProvider `
9
+ component from #utils as a parent of all the elements that have tooltips. The
10
+ component can either be at the root of your app, or a small section so that only
11
+ a few tooltips are "linked together" with this hover mode flow.
Original file line number Diff line number Diff line change 1
1
import React , { ReactElement } from "react" ;
2
- import { TooltipHoverModeConfig , Tooltipped } from "@react-md/tooltip" ;
2
+ import { Tooltipped } from "@react-md/tooltip" ;
3
3
import { Button } from "@react-md/button" ;
4
+ import { HoverModeProvider } from "@react-md/utils" ;
4
5
5
6
import Container from "./Container" ;
6
7
7
8
export default function HoverMode ( ) : ReactElement {
8
9
return (
9
- < TooltipHoverModeConfig >
10
+ < HoverModeProvider >
10
11
< Container >
11
12
{ Array . from ( { length : 8 } ) . map ( ( _ , i ) => (
12
13
< Tooltipped
@@ -18,6 +19,6 @@ export default function HoverMode(): ReactElement {
18
19
</ Tooltipped >
19
20
) ) }
20
21
</ Container >
21
- </ TooltipHoverModeConfig >
22
+ </ HoverModeProvider >
22
23
) ;
23
24
}
Original file line number Diff line number Diff line change 1
1
import React , { ReactElement } from "react" ;
2
- import { TooltipHoverModeConfig } from "@react-md/tooltip " ;
2
+ import { HoverModeProvider } from "@react-md/utils " ;
3
3
4
4
import DemoPage from "../DemoPage" ;
5
5
@@ -69,9 +69,7 @@ const demos = [
69
69
...demo ,
70
70
// remove the global tooltip hover mode config from all demos since it'll
71
71
// manually be applied in a specific demo instead
72
- children : (
73
- < TooltipHoverModeConfig enabled = { false } > { children } </ TooltipHoverModeConfig >
74
- ) ,
72
+ children : < HoverModeProvider disabled > { children } </ HoverModeProvider > ,
75
73
} ) ) ;
76
74
77
75
export default function Tooltip ( ) : ReactElement {
Original file line number Diff line number Diff line change @@ -48,9 +48,9 @@ This component will initialize:
48
48
49
49
- ` AppSizeListener ` - see #utils
50
50
- ` InteractionModeListener ` - see #utils
51
+ - ` HoverModeProvider ` - see #utils
51
52
- ` StatesConfig ` - see #states
52
53
- ` NestedDialogContextProvider ` - see #dialog
53
- - ` TooltipHoverModeConfig ` - see #tooltip
54
54
55
55
The three most important Providers that are included are the ` AppSizeListener ` ,
56
56
` InteractionModeListener ` and ` StatesConfig ` . The ` AppSizeListener ` is in the
You can’t perform that action at this time.
0 commit comments