@fluentui/react-tooltip 0.0.0-nightlya372ad979820211103.1 → 0.0.0-nightlya54302c0b220211124.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +101 -24
- package/CHANGELOG.md +32 -14
- package/dist/react-tooltip.d.ts +2 -0
- package/lib/common/isConformant.js +1 -1
- package/lib/common/isConformant.js.map +1 -1
- package/lib/components/Tooltip/Tooltip.js +2 -2
- package/lib/components/Tooltip/Tooltip.js.map +1 -1
- package/lib/components/Tooltip/index.d.ts +1 -1
- package/lib/components/Tooltip/index.js +1 -1
- package/lib/components/Tooltip/index.js.map +1 -1
- package/lib/components/Tooltip/renderTooltip.js +6 -7
- package/lib/components/Tooltip/renderTooltip.js.map +1 -1
- package/lib/components/Tooltip/useTooltip.js +69 -79
- package/lib/components/Tooltip/useTooltip.js.map +1 -1
- package/lib/components/Tooltip/useTooltipStyles.d.ts +1 -0
- package/lib/components/Tooltip/useTooltipStyles.js +17 -8
- package/lib/components/Tooltip/useTooltipStyles.js.map +1 -1
- package/lib-commonjs/Tooltip.js +1 -1
- package/lib-commonjs/common/isConformant.js +3 -3
- package/lib-commonjs/common/isConformant.js.map +1 -1
- package/lib-commonjs/components/Tooltip/Tooltip.js +6 -6
- package/lib-commonjs/components/Tooltip/Tooltip.js.map +1 -1
- package/lib-commonjs/components/Tooltip/index.d.ts +1 -1
- package/lib-commonjs/components/Tooltip/index.js +2 -10
- package/lib-commonjs/components/Tooltip/index.js.map +1 -1
- package/lib-commonjs/components/Tooltip/renderTooltip.js +9 -11
- package/lib-commonjs/components/Tooltip/renderTooltip.js.map +1 -1
- package/lib-commonjs/components/Tooltip/useTooltip.js +73 -84
- package/lib-commonjs/components/Tooltip/useTooltip.js.map +1 -1
- package/lib-commonjs/components/Tooltip/useTooltipStyles.d.ts +1 -0
- package/lib-commonjs/components/Tooltip/useTooltipStyles.js +21 -11
- package/lib-commonjs/components/Tooltip/useTooltipStyles.js.map +1 -1
- package/lib-commonjs/index.js +1 -1
- package/package.json +10 -11
package/CHANGELOG.json
CHANGED
@@ -2,76 +2,153 @@
|
|
2
2
|
"name": "@fluentui/react-tooltip",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "Wed,
|
6
|
-
"tag": "@fluentui/react-tooltip_v0.0.0-
|
7
|
-
"version": "0.0.0-
|
5
|
+
"date": "Wed, 24 Nov 2021 04:12:46 GMT",
|
6
|
+
"tag": "@fluentui/react-tooltip_v0.0.0-nightlya54302c0b220211124.1",
|
7
|
+
"version": "0.0.0-nightlya54302c0b220211124.1",
|
8
8
|
"comments": {
|
9
9
|
"prerelease": [
|
10
10
|
{
|
11
|
-
"author": "
|
11
|
+
"author": "lingfangao@hotmail.com",
|
12
|
+
"package": "@fluentui/react-tooltip",
|
13
|
+
"commit": "58db204f28af1d68df7260ff580cf91f0adcfb66",
|
14
|
+
"comment": "Add transparent outline to arrow for HC"
|
15
|
+
},
|
16
|
+
{
|
17
|
+
"author": "beachball",
|
18
|
+
"package": "@fluentui/react-tooltip",
|
19
|
+
"comment": "Bump @fluentui/react-make-styles to v0.0.0-nightlya54302c0b220211124.1",
|
20
|
+
"commit": "e3c1bd15060ac276670338660c7965b877e333f4"
|
21
|
+
},
|
22
|
+
{
|
23
|
+
"author": "beachball",
|
12
24
|
"package": "@fluentui/react-tooltip",
|
13
|
-
"
|
14
|
-
"
|
25
|
+
"comment": "Bump @fluentui/react-portal to v0.0.0-nightlya54302c0b220211124.1",
|
26
|
+
"commit": "e3c1bd15060ac276670338660c7965b877e333f4"
|
15
27
|
},
|
28
|
+
{
|
29
|
+
"author": "beachball",
|
30
|
+
"package": "@fluentui/react-tooltip",
|
31
|
+
"comment": "Bump @fluentui/react-positioning to v0.0.0-nightlya54302c0b220211124.1",
|
32
|
+
"commit": "e3c1bd15060ac276670338660c7965b877e333f4"
|
33
|
+
},
|
34
|
+
{
|
35
|
+
"author": "beachball",
|
36
|
+
"package": "@fluentui/react-tooltip",
|
37
|
+
"comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightlya54302c0b220211124.1",
|
38
|
+
"commit": "e3c1bd15060ac276670338660c7965b877e333f4"
|
39
|
+
},
|
40
|
+
{
|
41
|
+
"author": "beachball",
|
42
|
+
"package": "@fluentui/react-tooltip",
|
43
|
+
"comment": "Bump @fluentui/react-theme to v0.0.0-nightlya54302c0b220211124.1",
|
44
|
+
"commit": "e3c1bd15060ac276670338660c7965b877e333f4"
|
45
|
+
},
|
46
|
+
{
|
47
|
+
"author": "beachball",
|
48
|
+
"package": "@fluentui/react-tooltip",
|
49
|
+
"comment": "Bump @fluentui/babel-make-styles to v0.0.0-nightlya54302c0b220211124.1",
|
50
|
+
"commit": "e3c1bd15060ac276670338660c7965b877e333f4"
|
51
|
+
},
|
52
|
+
{
|
53
|
+
"author": "beachball",
|
54
|
+
"package": "@fluentui/react-tooltip",
|
55
|
+
"comment": "Bump @fluentui/jest-serializer-make-styles to v0.0.0-nightlya54302c0b220211124.1",
|
56
|
+
"commit": "e3c1bd15060ac276670338660c7965b877e333f4"
|
57
|
+
},
|
58
|
+
{
|
59
|
+
"author": "beachball",
|
60
|
+
"package": "@fluentui/react-tooltip",
|
61
|
+
"comment": "Bump @fluentui/react-conformance-make-styles to v0.0.0-nightlya54302c0b220211124.1",
|
62
|
+
"commit": "e3c1bd15060ac276670338660c7965b877e333f4"
|
63
|
+
}
|
64
|
+
]
|
65
|
+
}
|
66
|
+
},
|
67
|
+
{
|
68
|
+
"date": "Fri, 12 Nov 2021 13:25:09 GMT",
|
69
|
+
"tag": "@fluentui/react-tooltip_v9.0.0-beta.4",
|
70
|
+
"version": "9.0.0-beta.4",
|
71
|
+
"comments": {
|
72
|
+
"none": [
|
73
|
+
{
|
74
|
+
"author": "lingfangao@hotmail.com",
|
75
|
+
"package": "@fluentui/react-tooltip",
|
76
|
+
"commit": "00f70581480b536e723fb69edf0ae617beac4807",
|
77
|
+
"comment": "Remove beta release tag"
|
78
|
+
}
|
79
|
+
],
|
80
|
+
"prerelease": [
|
16
81
|
{
|
17
82
|
"author": "gcox@microsoft.com",
|
18
83
|
"package": "@fluentui/react-tooltip",
|
19
84
|
"commit": "d5810cfc819dcb2126ffaa081bf117fcae83dc73",
|
20
85
|
"comment": "Updated stories to support codesandbox"
|
21
86
|
},
|
87
|
+
{
|
88
|
+
"author": "olfedias@microsoft.com",
|
89
|
+
"package": "@fluentui/react-tooltip",
|
90
|
+
"commit": "f078af73d95d0f2c380144a40127bd08e389aa2d",
|
91
|
+
"comment": "export static classes for components"
|
92
|
+
},
|
93
|
+
{
|
94
|
+
"author": "gcox@microsoft.com",
|
95
|
+
"package": "@fluentui/react-tooltip",
|
96
|
+
"commit": "c9bd5b5a02ae94a8239ce1b56cac2f0d0dbd3586",
|
97
|
+
"comment": "Updated beta and RC components to ES2019"
|
98
|
+
},
|
22
99
|
{
|
23
100
|
"author": "beachball",
|
24
101
|
"package": "@fluentui/react-tooltip",
|
25
|
-
"comment": "Bump @fluentui/react-make-styles to
|
26
|
-
"commit": "
|
102
|
+
"comment": "Bump @fluentui/react-make-styles to v9.0.0-beta.3",
|
103
|
+
"commit": "742342e52c65066f779232e4e1302fedf0dd460d"
|
27
104
|
},
|
28
105
|
{
|
29
106
|
"author": "beachball",
|
30
107
|
"package": "@fluentui/react-tooltip",
|
31
|
-
"comment": "Bump @fluentui/react-portal to
|
32
|
-
"commit": "
|
108
|
+
"comment": "Bump @fluentui/react-portal to v9.0.0-beta.4",
|
109
|
+
"commit": "742342e52c65066f779232e4e1302fedf0dd460d"
|
33
110
|
},
|
34
111
|
{
|
35
112
|
"author": "beachball",
|
36
113
|
"package": "@fluentui/react-tooltip",
|
37
|
-
"comment": "Bump @fluentui/react-positioning to
|
38
|
-
"commit": "
|
114
|
+
"comment": "Bump @fluentui/react-positioning to v9.0.0-beta.3",
|
115
|
+
"commit": "742342e52c65066f779232e4e1302fedf0dd460d"
|
39
116
|
},
|
40
117
|
{
|
41
118
|
"author": "beachball",
|
42
119
|
"package": "@fluentui/react-tooltip",
|
43
|
-
"comment": "Bump @fluentui/react-shared-contexts to
|
44
|
-
"commit": "
|
120
|
+
"comment": "Bump @fluentui/react-shared-contexts to v9.0.0-beta.3",
|
121
|
+
"commit": "742342e52c65066f779232e4e1302fedf0dd460d"
|
45
122
|
},
|
46
123
|
{
|
47
124
|
"author": "beachball",
|
48
125
|
"package": "@fluentui/react-tooltip",
|
49
|
-
"comment": "Bump @fluentui/react-theme to
|
50
|
-
"commit": "
|
126
|
+
"comment": "Bump @fluentui/react-theme to v9.0.0-beta.3",
|
127
|
+
"commit": "742342e52c65066f779232e4e1302fedf0dd460d"
|
51
128
|
},
|
52
129
|
{
|
53
130
|
"author": "beachball",
|
54
131
|
"package": "@fluentui/react-tooltip",
|
55
|
-
"comment": "Bump @fluentui/react-utilities to
|
56
|
-
"commit": "
|
132
|
+
"comment": "Bump @fluentui/react-utilities to v9.0.0-beta.3",
|
133
|
+
"commit": "742342e52c65066f779232e4e1302fedf0dd460d"
|
57
134
|
},
|
58
135
|
{
|
59
136
|
"author": "beachball",
|
60
137
|
"package": "@fluentui/react-tooltip",
|
61
|
-
"comment": "Bump @fluentui/babel-make-styles to
|
62
|
-
"commit": "
|
138
|
+
"comment": "Bump @fluentui/babel-make-styles to v9.0.0-beta.3",
|
139
|
+
"commit": "742342e52c65066f779232e4e1302fedf0dd460d"
|
63
140
|
},
|
64
141
|
{
|
65
142
|
"author": "beachball",
|
66
143
|
"package": "@fluentui/react-tooltip",
|
67
|
-
"comment": "Bump @fluentui/jest-serializer-make-styles to
|
68
|
-
"commit": "
|
144
|
+
"comment": "Bump @fluentui/jest-serializer-make-styles to v9.0.0-beta.3",
|
145
|
+
"commit": "742342e52c65066f779232e4e1302fedf0dd460d"
|
69
146
|
},
|
70
147
|
{
|
71
148
|
"author": "beachball",
|
72
149
|
"package": "@fluentui/react-tooltip",
|
73
|
-
"comment": "Bump @fluentui/react-conformance-make-styles to
|
74
|
-
"commit": "
|
150
|
+
"comment": "Bump @fluentui/react-conformance-make-styles to v9.0.0-beta.3",
|
151
|
+
"commit": "742342e52c65066f779232e4e1302fedf0dd460d"
|
75
152
|
}
|
76
153
|
]
|
77
154
|
}
|
package/CHANGELOG.md
CHANGED
@@ -1,27 +1,45 @@
|
|
1
1
|
# Change Log - @fluentui/react-tooltip
|
2
2
|
|
3
|
-
This log was last generated on Wed,
|
3
|
+
This log was last generated on Wed, 24 Nov 2021 04:12:46 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
-
## [0.0.0-
|
7
|
+
## [0.0.0-nightlya54302c0b220211124.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v0.0.0-nightlya54302c0b220211124.1)
|
8
8
|
|
9
|
-
Wed,
|
10
|
-
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.0.0-beta.
|
9
|
+
Wed, 24 Nov 2021 04:12:46 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.0.0-beta.4..@fluentui/react-tooltip_v0.0.0-nightlya54302c0b220211124.1)
|
11
|
+
|
12
|
+
### Changes
|
13
|
+
|
14
|
+
- Add transparent outline to arrow for HC ([PR #20541](https://github.com/microsoft/fluentui/pull/20541) by lingfangao@hotmail.com)
|
15
|
+
- Bump @fluentui/react-make-styles to v0.0.0-nightlya54302c0b220211124.1 ([commit](https://github.com/microsoft/fluentui/commit/e3c1bd15060ac276670338660c7965b877e333f4) by beachball)
|
16
|
+
- Bump @fluentui/react-portal to v0.0.0-nightlya54302c0b220211124.1 ([commit](https://github.com/microsoft/fluentui/commit/e3c1bd15060ac276670338660c7965b877e333f4) by beachball)
|
17
|
+
- Bump @fluentui/react-positioning to v0.0.0-nightlya54302c0b220211124.1 ([commit](https://github.com/microsoft/fluentui/commit/e3c1bd15060ac276670338660c7965b877e333f4) by beachball)
|
18
|
+
- Bump @fluentui/react-shared-contexts to v0.0.0-nightlya54302c0b220211124.1 ([commit](https://github.com/microsoft/fluentui/commit/e3c1bd15060ac276670338660c7965b877e333f4) by beachball)
|
19
|
+
- Bump @fluentui/react-theme to v0.0.0-nightlya54302c0b220211124.1 ([commit](https://github.com/microsoft/fluentui/commit/e3c1bd15060ac276670338660c7965b877e333f4) by beachball)
|
20
|
+
- Bump @fluentui/babel-make-styles to v0.0.0-nightlya54302c0b220211124.1 ([commit](https://github.com/microsoft/fluentui/commit/e3c1bd15060ac276670338660c7965b877e333f4) by beachball)
|
21
|
+
- Bump @fluentui/jest-serializer-make-styles to v0.0.0-nightlya54302c0b220211124.1 ([commit](https://github.com/microsoft/fluentui/commit/e3c1bd15060ac276670338660c7965b877e333f4) by beachball)
|
22
|
+
- Bump @fluentui/react-conformance-make-styles to v0.0.0-nightlya54302c0b220211124.1 ([commit](https://github.com/microsoft/fluentui/commit/e3c1bd15060ac276670338660c7965b877e333f4) by beachball)
|
23
|
+
|
24
|
+
## [9.0.0-beta.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v9.0.0-beta.4)
|
25
|
+
|
26
|
+
Fri, 12 Nov 2021 13:25:09 GMT
|
27
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.0.0-beta.3..@fluentui/react-tooltip_v9.0.0-beta.4)
|
11
28
|
|
12
29
|
### Changes
|
13
30
|
|
14
|
-
- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/ff9c0a60767a2dbd1afdc71659a5daee5f2068dd) by email not defined)
|
15
31
|
- Updated stories to support codesandbox ([PR #20373](https://github.com/microsoft/fluentui/pull/20373) by gcox@microsoft.com)
|
16
|
-
-
|
17
|
-
-
|
18
|
-
- Bump @fluentui/react-
|
19
|
-
- Bump @fluentui/react-
|
20
|
-
- Bump @fluentui/react-
|
21
|
-
- Bump @fluentui/react-
|
22
|
-
- Bump @fluentui/
|
23
|
-
- Bump @fluentui/
|
24
|
-
- Bump @fluentui/
|
32
|
+
- export static classes for components ([PR #20455](https://github.com/microsoft/fluentui/pull/20455) by olfedias@microsoft.com)
|
33
|
+
- Updated beta and RC components to ES2019 ([PR #20405](https://github.com/microsoft/fluentui/pull/20405) by gcox@microsoft.com)
|
34
|
+
- Bump @fluentui/react-make-styles to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
|
35
|
+
- Bump @fluentui/react-portal to v9.0.0-beta.4 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
|
36
|
+
- Bump @fluentui/react-positioning to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
|
37
|
+
- Bump @fluentui/react-shared-contexts to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
|
38
|
+
- Bump @fluentui/react-theme to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
|
39
|
+
- Bump @fluentui/react-utilities to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
|
40
|
+
- Bump @fluentui/babel-make-styles to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
|
41
|
+
- Bump @fluentui/jest-serializer-make-styles to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
|
42
|
+
- Bump @fluentui/react-conformance-make-styles to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
|
25
43
|
|
26
44
|
## [9.0.0-beta.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v9.0.0-beta.3)
|
27
45
|
|
package/dist/react-tooltip.d.ts
CHANGED
@@ -22,6 +22,8 @@ export declare const renderTooltip: (state: TooltipState) => JSX.Element;
|
|
22
22
|
*/
|
23
23
|
export declare const Tooltip: ForwardRefComponent<TooltipProps>;
|
24
24
|
|
25
|
+
export declare const tooltipClassName = "fui-Tooltip";
|
26
|
+
|
25
27
|
/**
|
26
28
|
* Properties and state for Tooltip
|
27
29
|
*/
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import { isConformant as baseIsConformant } from '@fluentui/react-conformance';
|
2
2
|
import makeStylesTests from '@fluentui/react-conformance-make-styles';
|
3
3
|
export function isConformant(testInfo) {
|
4
|
-
|
4
|
+
const defaultOptions = {
|
5
5
|
asPropHandlesRef: true,
|
6
6
|
componentPath: module.parent.filename.replace('.test', ''),
|
7
7
|
extraTests: makeStylesTests
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/common/isConformant.ts"],"names":[],"mappings":"AAAA,SAAS,YAAY,IAAI,gBAAzB,QAAiD,6BAAjD;AAEA,OAAO,eAAP,MAA4B,yCAA5B;AAEA,OAAM,SAAU,YAAV,CACJ,QADI,EACqF;AAEzF,
|
1
|
+
{"version":3,"sources":["../../src/common/isConformant.ts"],"names":[],"mappings":"AAAA,SAAS,YAAY,IAAI,gBAAzB,QAAiD,6BAAjD;AAEA,OAAO,eAAP,MAA4B,yCAA5B;AAEA,OAAM,SAAU,YAAV,CACJ,QADI,EACqF;AAEzF,QAAM,cAAc,GAAyC;AAC3D,IAAA,gBAAgB,EAAE,IADyC;AAE3D,IAAA,aAAa,EAAE,MAAO,CAAC,MAAR,CAAgB,QAAhB,CAAyB,OAAzB,CAAiC,OAAjC,EAA0C,EAA1C,CAF4C;AAG3D,IAAA,UAAU,EAAE;AAH+C,GAA7D;AAMA,EAAA,gBAAgB,CAAC,cAAD,EAAiB,QAAjB,CAAhB;AACD","sourceRoot":""}
|
@@ -6,8 +6,8 @@ import { useTooltipStyles } from './useTooltipStyles';
|
|
6
6
|
* A tooltip provides light weight contextual information on top of its target element.
|
7
7
|
*/
|
8
8
|
|
9
|
-
export
|
10
|
-
|
9
|
+
export const Tooltip = /*#__PURE__*/React.forwardRef((props, ref) => {
|
10
|
+
const state = useTooltip(props, ref);
|
11
11
|
useTooltipStyles(state);
|
12
12
|
return renderTooltip(state);
|
13
13
|
});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,UAAT,QAA2B,cAA3B;AACA,SAAS,aAAT,QAA8B,iBAA9B;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AAIA;;AAEG;;AACH,OAAO,
|
1
|
+
{"version":3,"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,UAAT,QAA2B,cAA3B;AACA,SAAS,aAAT,QAA8B,iBAA9B;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AAIA;;AAEG;;AACH,OAAO,MAAM,OAAO,gBAAsC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACxF,QAAM,KAAK,GAAG,UAAU,CAAC,KAAD,EAAQ,GAAR,CAAxB;AAEA,EAAA,gBAAgB,CAAC,KAAD,CAAhB;AACA,SAAO,aAAa,CAAC,KAAD,CAApB;AACD,CALyD,CAAnD;AAOP,OAAO,CAAC,WAAR,GAAsB,SAAtB","sourceRoot":""}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Tooltip/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Tooltip/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC"}
|
@@ -1,4 +1,3 @@
|
|
1
|
-
import { __assign } from "tslib";
|
2
1
|
import * as React from 'react';
|
3
2
|
import { Portal } from '@fluentui/react-portal';
|
4
3
|
import { getSlots } from '@fluentui/react-utilities';
|
@@ -6,12 +5,12 @@ import { getSlots } from '@fluentui/react-utilities';
|
|
6
5
|
* Render the final JSX of Tooltip
|
7
6
|
*/
|
8
7
|
|
9
|
-
export
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, state.root.children, state.shouldRenderTooltip && /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(slots.root,
|
8
|
+
export const renderTooltip = state => {
|
9
|
+
const {
|
10
|
+
slots,
|
11
|
+
slotProps
|
12
|
+
} = getSlots(state, ['root']);
|
13
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, state.root.children, state.shouldRenderTooltip && /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(slots.root, Object.assign({}, slotProps.root), state.withArrow && /*#__PURE__*/React.createElement("div", {
|
15
14
|
ref: state.arrowRef,
|
16
15
|
className: state.arrowClassName
|
17
16
|
}), state.content)));
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Tooltip/renderTooltip.tsx"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/Tooltip/renderTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,MAAT,QAAuB,wBAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,aAAa,GAAI,KAAD,IAAwB;AACnD,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAe,KAAf,EAAsB,CAAC,MAAD,CAAtB,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EACG,KAAK,CAAC,IAAN,CAAW,QADd,EAEG,KAAK,CAAC,mBAAN,iBACC,KAAA,CAAA,aAAA,CAAC,MAAD,EAAO,IAAP,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,EACG,KAAK,CAAC,SAAN,iBAAmB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,GAAG,EAAE,KAAK,CAAC,QAAhB;AAA0B,IAAA,SAAS,EAAE,KAAK,CAAC;AAA3C,GAAA,CADtB,EAEG,KAAK,CAAC,OAFT,CADF,CAHJ,CADF;AAaD,CAhBM","sourceRoot":""}
|
@@ -1,12 +1,11 @@
|
|
1
|
-
import { __assign } from "tslib";
|
2
1
|
import * as React from 'react';
|
3
2
|
import { mergeArrowOffset, resolvePositioningShorthand, usePopper } from '@fluentui/react-positioning';
|
4
3
|
import { TooltipContext, useFluent } from '@fluentui/react-shared-contexts';
|
5
4
|
import { applyTriggerPropsToChildren, getNativeElementProps, useControllableState, useId, useIsomorphicLayoutEffect, useIsSSR, useMergedRefs, useTimeout } from '@fluentui/react-utilities'; // Style values that are required for popper to properly position the tooltip
|
6
5
|
|
7
|
-
|
6
|
+
const tooltipBorderRadius = 4; // Update the root's borderRadius in useTooltipStyles.ts if this changes
|
8
7
|
|
9
|
-
|
8
|
+
const arrowHeight = 6; // Update the arrow's width/height in useTooltipStyles.ts if this changes
|
10
9
|
|
11
10
|
/**
|
12
11
|
* Create the state required to render Tooltip.
|
@@ -19,39 +18,32 @@ var arrowHeight = 6; // Update the arrow's width/height in useTooltipStyles.ts i
|
|
19
18
|
* @param defaultProps - (optional) default prop values provided by the implementing type
|
20
19
|
*/
|
21
20
|
|
22
|
-
export
|
21
|
+
export const useTooltip = (props, ref) => {
|
23
22
|
var _a, _b, _c, _d;
|
24
23
|
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
_h = props.hideDelay,
|
43
|
-
hideDelay = _h === void 0 ? 250 : _h;
|
44
|
-
|
45
|
-
var _j = useControllableState({
|
24
|
+
const context = React.useContext(TooltipContext);
|
25
|
+
const isServerSideRender = useIsSSR();
|
26
|
+
const {
|
27
|
+
targetDocument
|
28
|
+
} = useFluent();
|
29
|
+
const [setDelayTimeout, clearDelayTimeout] = useTimeout();
|
30
|
+
const {
|
31
|
+
content,
|
32
|
+
inverted,
|
33
|
+
withArrow,
|
34
|
+
positioning,
|
35
|
+
onVisibleChange,
|
36
|
+
triggerAriaAttribute = 'label',
|
37
|
+
showDelay = 250,
|
38
|
+
hideDelay = 250
|
39
|
+
} = props;
|
40
|
+
const [visible, setVisibleInternal] = useControllableState({
|
46
41
|
state: props.visible,
|
47
42
|
initialState: false
|
48
|
-
})
|
49
|
-
|
50
|
-
setVisibleInternal = _j[1];
|
51
|
-
|
52
|
-
var setVisible = React.useCallback(function (newVisible, ev) {
|
43
|
+
});
|
44
|
+
const setVisible = React.useCallback((newVisible, ev) => {
|
53
45
|
clearDelayTimeout();
|
54
|
-
setVisibleInternal(
|
46
|
+
setVisibleInternal(oldVisible => {
|
55
47
|
if (newVisible !== oldVisible) {
|
56
48
|
onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(ev, {
|
57
49
|
visible: newVisible
|
@@ -61,76 +53,74 @@ export var useTooltip = function (props, ref) {
|
|
61
53
|
return newVisible;
|
62
54
|
});
|
63
55
|
}, [clearDelayTimeout, setVisibleInternal, onVisibleChange]);
|
64
|
-
|
65
|
-
content
|
66
|
-
inverted
|
67
|
-
withArrow
|
68
|
-
positioning
|
69
|
-
showDelay
|
70
|
-
hideDelay
|
71
|
-
triggerAriaAttribute
|
72
|
-
visible
|
56
|
+
const state = {
|
57
|
+
content,
|
58
|
+
inverted,
|
59
|
+
withArrow,
|
60
|
+
positioning,
|
61
|
+
showDelay,
|
62
|
+
hideDelay,
|
63
|
+
triggerAriaAttribute,
|
64
|
+
visible,
|
73
65
|
shouldRenderTooltip: visible,
|
74
66
|
appearance: props.appearance,
|
75
67
|
// Slots
|
76
68
|
components: {
|
77
69
|
root: 'div'
|
78
70
|
},
|
79
|
-
root: getNativeElementProps('div',
|
80
|
-
role: 'tooltip'
|
81
|
-
|
82
|
-
ref
|
71
|
+
root: getNativeElementProps('div', {
|
72
|
+
role: 'tooltip',
|
73
|
+
...props,
|
74
|
+
ref,
|
83
75
|
id: useId('tooltip-', props.id)
|
84
|
-
})
|
76
|
+
})
|
85
77
|
};
|
86
|
-
|
87
|
-
var popperOptions = __assign({
|
78
|
+
const popperOptions = {
|
88
79
|
enabled: state.visible,
|
89
80
|
arrowPadding: 2 * tooltipBorderRadius,
|
90
81
|
position: 'above',
|
91
82
|
align: 'center',
|
92
|
-
offset: [0, 4]
|
93
|
-
|
83
|
+
offset: [0, 4],
|
84
|
+
...resolvePositioningShorthand(state.positioning)
|
85
|
+
};
|
94
86
|
|
95
87
|
if (state.withArrow) {
|
96
88
|
popperOptions.offset = mergeArrowOffset(popperOptions.offset, arrowHeight);
|
97
89
|
}
|
98
90
|
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
91
|
+
const {
|
92
|
+
targetRef,
|
93
|
+
containerRef,
|
94
|
+
arrowRef
|
95
|
+
} = usePopper(popperOptions);
|
104
96
|
state.root.ref = useMergedRefs(state.root.ref, containerRef);
|
105
97
|
state.arrowRef = arrowRef; // When this tooltip is visible, hide any other tooltips, and register it
|
106
98
|
// as the visibleTooltip with the TooltipContext.
|
107
99
|
// Also add a listener on document to hide the tooltip if Escape is pressed
|
108
100
|
|
109
|
-
useIsomorphicLayoutEffect(
|
101
|
+
useIsomorphicLayoutEffect(() => {
|
110
102
|
var _a;
|
111
103
|
|
112
104
|
if (visible) {
|
113
|
-
|
114
|
-
hide:
|
115
|
-
return setVisible(false);
|
116
|
-
}
|
105
|
+
const thisTooltip = {
|
106
|
+
hide: () => setVisible(false)
|
117
107
|
};
|
118
108
|
(_a = context.visibleTooltip) === null || _a === void 0 ? void 0 : _a.hide();
|
119
|
-
context.visibleTooltip =
|
109
|
+
context.visibleTooltip = thisTooltip;
|
120
110
|
|
121
|
-
|
111
|
+
const onDocumentKeyDown = ev => {
|
122
112
|
if (ev.key === 'Escape' || ev.key === 'Esc') {
|
123
|
-
|
113
|
+
thisTooltip.hide();
|
124
114
|
}
|
125
115
|
};
|
126
116
|
|
127
|
-
targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('keydown',
|
128
|
-
return
|
129
|
-
if (context.visibleTooltip ===
|
117
|
+
targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('keydown', onDocumentKeyDown);
|
118
|
+
return () => {
|
119
|
+
if (context.visibleTooltip === thisTooltip) {
|
130
120
|
context.visibleTooltip = undefined;
|
131
121
|
}
|
132
122
|
|
133
|
-
targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('keydown',
|
123
|
+
targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('keydown', onDocumentKeyDown);
|
134
124
|
};
|
135
125
|
}
|
136
126
|
}, [context, targetDocument, visible, setVisible]); // The focused element gets a blur event when the document loses focus
|
@@ -139,24 +129,24 @@ export var useTooltip = function (props, ref) {
|
|
139
129
|
// checking if the blurred element is still the document's activeElement.
|
140
130
|
// See https://github.com/microsoft/fluentui/issues/13541
|
141
131
|
|
142
|
-
|
132
|
+
const ignoreNextFocusEventRef = React.useRef(false); // Listener for onPointerEnter and onFocus on the trigger element
|
143
133
|
|
144
|
-
|
134
|
+
const onEnterTrigger = React.useCallback(ev => {
|
145
135
|
if (ev.type === 'focus' && ignoreNextFocusEventRef.current) {
|
146
136
|
ignoreNextFocusEventRef.current = false;
|
147
137
|
return;
|
148
138
|
} // Show immediately if another tooltip is already visible
|
149
139
|
|
150
140
|
|
151
|
-
|
152
|
-
setDelayTimeout(
|
141
|
+
const delay = context.visibleTooltip ? 0 : state.showDelay;
|
142
|
+
setDelayTimeout(() => {
|
153
143
|
setVisible(true, ev);
|
154
144
|
}, delay);
|
155
145
|
ev.persist(); // Persist the event since the setVisible call will happen asynchronously
|
156
146
|
}, [setDelayTimeout, setVisible, state.showDelay, context]); // Listener for onPointerLeave and onBlur on the trigger element
|
157
147
|
|
158
|
-
|
159
|
-
|
148
|
+
const onLeaveTrigger = React.useCallback(ev => {
|
149
|
+
let delay = state.hideDelay;
|
160
150
|
|
161
151
|
if (ev.type === 'blur') {
|
162
152
|
// Hide immediately when losing focus
|
@@ -164,7 +154,7 @@ export var useTooltip = function (props, ref) {
|
|
164
154
|
ignoreNextFocusEventRef.current = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) === ev.target;
|
165
155
|
}
|
166
156
|
|
167
|
-
setDelayTimeout(
|
157
|
+
setDelayTimeout(() => {
|
168
158
|
setVisible(false, ev);
|
169
159
|
}, delay);
|
170
160
|
ev.persist(); // Persist the event since the setVisible call will happen asynchronously
|
@@ -173,17 +163,17 @@ export var useTooltip = function (props, ref) {
|
|
173
163
|
|
174
164
|
state.root.onPointerEnter = useMergedCallbacks(state.root.onPointerEnter, clearDelayTimeout);
|
175
165
|
state.root.onPointerLeave = useMergedCallbacks(state.root.onPointerLeave, onLeaveTrigger);
|
176
|
-
|
166
|
+
const child = /*#__PURE__*/React.isValidElement(state.root.children) ? state.root.children : undefined; // The props to add to the trigger element (child)
|
177
167
|
|
178
|
-
|
168
|
+
const triggerProps = {
|
179
169
|
onPointerEnter: useMergedCallbacks((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.onPointerEnter, onEnterTrigger),
|
180
170
|
onPointerLeave: useMergedCallbacks((_b = child === null || child === void 0 ? void 0 : child.props) === null || _b === void 0 ? void 0 : _b.onPointerLeave, onLeaveTrigger),
|
181
171
|
onFocus: useMergedCallbacks((_c = child === null || child === void 0 ? void 0 : child.props) === null || _c === void 0 ? void 0 : _c.onFocus, onEnterTrigger),
|
182
172
|
onBlur: useMergedCallbacks((_d = child === null || child === void 0 ? void 0 : child.props) === null || _d === void 0 ? void 0 : _d.onBlur, onLeaveTrigger)
|
183
173
|
}; // If the target prop is not provided, attach targetRef to the trigger element's ref prop
|
184
174
|
|
185
|
-
|
186
|
-
|
175
|
+
const childWithRef = child;
|
176
|
+
const childTargetRef = useMergedRefs(childWithRef === null || childWithRef === void 0 ? void 0 : childWithRef.ref, targetRef);
|
187
177
|
|
188
178
|
if (popperOptions.target === undefined) {
|
189
179
|
triggerProps.ref = childTargetRef;
|
@@ -215,8 +205,8 @@ export var useTooltip = function (props, ref) {
|
|
215
205
|
* Combine up to two event callbacks into a single function that calls them in order
|
216
206
|
*/
|
217
207
|
|
218
|
-
|
219
|
-
return React.useCallback(
|
208
|
+
const useMergedCallbacks = (callback1, callback2) => {
|
209
|
+
return React.useCallback(ev => {
|
220
210
|
callback1 === null || callback1 === void 0 ? void 0 : callback1(ev);
|
221
211
|
callback2 === null || callback2 === void 0 ? void 0 : callback2(ev);
|
222
212
|
}, [callback1, callback2]);
|