File tree Expand file tree Collapse file tree 3 files changed +46
-0
lines changed Expand file tree Collapse file tree 3 files changed +46
-0
lines changed Original file line number Diff line number Diff line change
1
+ ---
2
+ title : Two Buttons
3
+ order : 8
4
+ ---
5
+
6
+ Demonstrates two buttons with different tooltips on hover.
7
+
8
+ ``` jsx
9
+ import TwoButtonsDemo from ' ../examples/twoButtons' ;
10
+
11
+ export default () => < TwoButtonsDemo / > ;
12
+ ```
Original file line number Diff line number Diff line change
1
+ import { UniqueProvider } from '@rc-component/trigger' ;
2
+ import React from 'react' ;
3
+ import '../../assets/bootstrap.less' ;
4
+ import Tooltip from '../../src' ;
5
+
6
+ const TwoButtonsDemo = ( ) => (
7
+ < UniqueProvider >
8
+ < div style = { { margin : 100 } } >
9
+ < Tooltip
10
+ placement = "top"
11
+ trigger = { [ 'hover' ] }
12
+ overlay = "This is the first tooltip"
13
+ motion = { { motionName : 'rc-tooltip-zoom' } }
14
+ >
15
+ < button type = "button" > Button 1</ button >
16
+ </ Tooltip >
17
+ < Tooltip
18
+ placement = "top"
19
+ trigger = { [ 'hover' ] }
20
+ overlay = "This is the second tooltip"
21
+ motion = { { motionName : 'rc-tooltip-zoom' } }
22
+ >
23
+ < button type = "button" > Button 2</ button >
24
+ </ Tooltip >
25
+ </ div >
26
+ </ UniqueProvider >
27
+ ) ;
28
+
29
+ export default TwoButtonsDemo ;
Original file line number Diff line number Diff line change @@ -45,6 +45,11 @@ export interface TooltipProps
45
45
zIndex ?: number ;
46
46
styles ?: TooltipStyles ;
47
47
classNames ?: TooltipClassNames ;
48
+ /**
49
+ * Config Tooltip can reuse of the bg for transition usage.
50
+ * This is a experimental API, may be not stable.
51
+ */
52
+ unique ?: TriggerProps [ 'unique' ] ;
48
53
}
49
54
50
55
export interface TooltipStyles {
You can’t perform that action at this time.
0 commit comments