@fluentui/react-tooltip 0.0.0-nightly-20230427-0418.1 → 0.0.0-nightly-20230428-0419.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.
Files changed (29) hide show
  1. package/CHANGELOG.json +19 -19
  2. package/CHANGELOG.md +12 -12
  3. package/lib-commonjs/components/Tooltip/Tooltip.js +2 -2
  4. package/lib-commonjs/components/Tooltip/Tooltip.js.map +1 -1
  5. package/lib-commonjs/components/Tooltip/index.js +1 -1
  6. package/lib-commonjs/components/Tooltip/index.js.map +1 -1
  7. package/lib-commonjs/components/Tooltip/{useTooltipStyles.js → useTooltipStyles.styles.js} +2 -2
  8. package/lib-commonjs/components/Tooltip/useTooltipStyles.styles.js.map +1 -0
  9. package/package.json +9 -9
  10. package/dist/index.d.ts +0 -143
  11. package/lib/Tooltip.js +0 -2
  12. package/lib/Tooltip.js.map +0 -1
  13. package/lib/components/Tooltip/Tooltip.js +0 -18
  14. package/lib/components/Tooltip/Tooltip.js.map +0 -1
  15. package/lib/components/Tooltip/Tooltip.types.js +0 -2
  16. package/lib/components/Tooltip/Tooltip.types.js.map +0 -1
  17. package/lib/components/Tooltip/index.js +0 -6
  18. package/lib/components/Tooltip/index.js.map +0 -1
  19. package/lib/components/Tooltip/private/constants.js +0 -12
  20. package/lib/components/Tooltip/private/constants.js.map +0 -1
  21. package/lib/components/Tooltip/renderTooltip.js +0 -20
  22. package/lib/components/Tooltip/renderTooltip.js.map +0 -1
  23. package/lib/components/Tooltip/useTooltip.js +0 -196
  24. package/lib/components/Tooltip/useTooltip.js.map +0 -1
  25. package/lib/components/Tooltip/useTooltipStyles.js +0 -94
  26. package/lib/components/Tooltip/useTooltipStyles.js.map +0 -1
  27. package/lib/index.js +0 -2
  28. package/lib/index.js.map +0 -1
  29. package/lib-commonjs/components/Tooltip/useTooltipStyles.js.map +0 -1
package/CHANGELOG.json CHANGED
@@ -2,9 +2,9 @@
2
2
  "name": "@fluentui/react-tooltip",
3
3
  "entries": [
4
4
  {
5
- "date": "Thu, 27 Apr 2023 04:23:17 GMT",
6
- "tag": "@fluentui/react-tooltip_v0.0.0-nightly-20230427-0418.1",
7
- "version": "0.0.0-nightly-20230427-0418.1",
5
+ "date": "Fri, 28 Apr 2023 04:25:28 GMT",
6
+ "tag": "@fluentui/react-tooltip_v0.0.0-nightly-20230428-0419.1",
7
+ "version": "0.0.0-nightly-20230428-0419.1",
8
8
  "comments": {
9
9
  "prerelease": [
10
10
  {
@@ -16,50 +16,50 @@
16
16
  {
17
17
  "author": "beachball",
18
18
  "package": "@fluentui/react-tooltip",
19
- "comment": "Bump @fluentui/keyboard-keys to v0.0.0-nightly-20230427-0418.1",
20
- "commit": "a9e0a4f587386948c891437cdbe3b10437aa9485"
19
+ "comment": "Bump @fluentui/keyboard-keys to v0.0.0-nightly-20230428-0419.1",
20
+ "commit": "6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839"
21
21
  },
22
22
  {
23
23
  "author": "beachball",
24
24
  "package": "@fluentui/react-tooltip",
25
- "comment": "Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20230427-0418.1",
26
- "commit": "a9e0a4f587386948c891437cdbe3b10437aa9485"
25
+ "comment": "Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20230428-0419.1",
26
+ "commit": "6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839"
27
27
  },
28
28
  {
29
29
  "author": "beachball",
30
30
  "package": "@fluentui/react-tooltip",
31
- "comment": "Bump @fluentui/react-portal to v0.0.0-nightly-20230427-0418.1",
32
- "commit": "a9e0a4f587386948c891437cdbe3b10437aa9485"
31
+ "comment": "Bump @fluentui/react-portal to v0.0.0-nightly-20230428-0419.1",
32
+ "commit": "6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839"
33
33
  },
34
34
  {
35
35
  "author": "beachball",
36
36
  "package": "@fluentui/react-tooltip",
37
- "comment": "Bump @fluentui/react-positioning to v0.0.0-nightly-20230427-0418.1",
38
- "commit": "a9e0a4f587386948c891437cdbe3b10437aa9485"
37
+ "comment": "Bump @fluentui/react-positioning to v0.0.0-nightly-20230428-0419.1",
38
+ "commit": "6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839"
39
39
  },
40
40
  {
41
41
  "author": "beachball",
42
42
  "package": "@fluentui/react-tooltip",
43
- "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20230427-0418.1",
44
- "commit": "a9e0a4f587386948c891437cdbe3b10437aa9485"
43
+ "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20230428-0419.1",
44
+ "commit": "6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839"
45
45
  },
46
46
  {
47
47
  "author": "beachball",
48
48
  "package": "@fluentui/react-tooltip",
49
- "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20230427-0418.1",
50
- "commit": "a9e0a4f587386948c891437cdbe3b10437aa9485"
49
+ "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20230428-0419.1",
50
+ "commit": "6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839"
51
51
  },
52
52
  {
53
53
  "author": "beachball",
54
54
  "package": "@fluentui/react-tooltip",
55
- "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20230427-0418.1",
56
- "commit": "a9e0a4f587386948c891437cdbe3b10437aa9485"
55
+ "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20230428-0419.1",
56
+ "commit": "6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839"
57
57
  },
58
58
  {
59
59
  "author": "beachball",
60
60
  "package": "@fluentui/react-tooltip",
61
- "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230427-0418.1",
62
- "commit": "a9e0a4f587386948c891437cdbe3b10437aa9485"
61
+ "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230428-0419.1",
62
+ "commit": "6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839"
63
63
  }
64
64
  ]
65
65
  }
package/CHANGELOG.md CHANGED
@@ -1,25 +1,25 @@
1
1
  # Change Log - @fluentui/react-tooltip
2
2
 
3
- This log was last generated on Thu, 27 Apr 2023 04:23:17 GMT and should not be manually modified.
3
+ This log was last generated on Fri, 28 Apr 2023 04:25:28 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly-20230427-0418.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v0.0.0-nightly-20230427-0418.1)
7
+ ## [0.0.0-nightly-20230428-0419.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v0.0.0-nightly-20230428-0419.1)
8
8
 
9
- Thu, 27 Apr 2023 04:23:17 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.2.10..@fluentui/react-tooltip_v0.0.0-nightly-20230427-0418.1)
9
+ Fri, 28 Apr 2023 04:25:28 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.2.10..@fluentui/react-tooltip_v0.0.0-nightly-20230428-0419.1)
11
11
 
12
12
  ### Changes
13
13
 
14
14
  - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
15
- - Bump @fluentui/keyboard-keys to v0.0.0-nightly-20230427-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/a9e0a4f587386948c891437cdbe3b10437aa9485) by beachball)
16
- - Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20230427-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/a9e0a4f587386948c891437cdbe3b10437aa9485) by beachball)
17
- - Bump @fluentui/react-portal to v0.0.0-nightly-20230427-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/a9e0a4f587386948c891437cdbe3b10437aa9485) by beachball)
18
- - Bump @fluentui/react-positioning to v0.0.0-nightly-20230427-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/a9e0a4f587386948c891437cdbe3b10437aa9485) by beachball)
19
- - Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20230427-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/a9e0a4f587386948c891437cdbe3b10437aa9485) by beachball)
20
- - Bump @fluentui/react-theme to v0.0.0-nightly-20230427-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/a9e0a4f587386948c891437cdbe3b10437aa9485) by beachball)
21
- - Bump @fluentui/react-utilities to v0.0.0-nightly-20230427-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/a9e0a4f587386948c891437cdbe3b10437aa9485) by beachball)
22
- - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230427-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/a9e0a4f587386948c891437cdbe3b10437aa9485) by beachball)
15
+ - Bump @fluentui/keyboard-keys to v0.0.0-nightly-20230428-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839) by beachball)
16
+ - Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20230428-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839) by beachball)
17
+ - Bump @fluentui/react-portal to v0.0.0-nightly-20230428-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839) by beachball)
18
+ - Bump @fluentui/react-positioning to v0.0.0-nightly-20230428-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839) by beachball)
19
+ - Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20230428-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839) by beachball)
20
+ - Bump @fluentui/react-theme to v0.0.0-nightly-20230428-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839) by beachball)
21
+ - Bump @fluentui/react-utilities to v0.0.0-nightly-20230428-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839) by beachball)
22
+ - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230428-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/6d0e3c2fb45fde4cf5056d3d18d4c5bc5899a839) by beachball)
23
23
 
24
24
  ## [9.2.10](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v9.2.10)
25
25
 
@@ -11,10 +11,10 @@ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
11
11
  const _useTooltip = require("./useTooltip");
12
12
  const _renderTooltip = require("./renderTooltip");
13
13
  const _reactSharedContexts = require("@fluentui/react-shared-contexts");
14
- const _useTooltipStyles = require("./useTooltipStyles");
14
+ const _useTooltipStylesStyles = require("./useTooltipStyles.styles");
15
15
  const Tooltip = (props)=>{
16
16
  const state = (0, _useTooltip.useTooltip_unstable)(props);
17
- (0, _useTooltipStyles.useTooltipStyles_unstable)(state);
17
+ (0, _useTooltipStylesStyles.useTooltipStyles_unstable)(state);
18
18
  (0, _reactSharedContexts.useCustomStyleHook_unstable)('useTooltipStyles_unstable')(state);
19
19
  return (0, _renderTooltip.renderTooltip_unstable)(state);
20
20
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../lib/components/Tooltip/Tooltip.js"],"sourcesContent":["import * as React from 'react';\nimport { useTooltip_unstable } from './useTooltip';\nimport { renderTooltip_unstable } from './renderTooltip';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useTooltipStyles_unstable } from './useTooltipStyles';\n/**\n * A tooltip provides light weight contextual information on top of its target element.\n */\nexport const Tooltip = props => {\n const state = useTooltip_unstable(props);\n useTooltipStyles_unstable(state);\n useCustomStyleHook_unstable('useTooltipStyles_unstable')(state);\n return renderTooltip_unstable(state);\n};\nTooltip.displayName = 'Tooltip';\n// type casting here is required to ensure internal type FluentTriggerComponent is not leaked\nTooltip.isFluentTriggerComponent = true;\n//# sourceMappingURL=Tooltip.js.map"],"names":["Tooltip","props","state","useTooltip_unstable","useTooltipStyles_unstable","useCustomStyleHook_unstable","renderTooltip_unstable","displayName","isFluentTriggerComponent"],"mappings":";;;;+BAQaA;;aAAAA;;;6DARU;4BACa;+BACG;qCACK;kCACF;AAInC,MAAMA,UAAUC,CAAAA,QAAS;IAC9B,MAAMC,QAAQC,IAAAA,+BAAmB,EAACF;IAClCG,IAAAA,2CAAyB,EAACF;IAC1BG,IAAAA,gDAA2B,EAAC,6BAA6BH;IACzD,OAAOI,IAAAA,qCAAsB,EAACJ;AAChC;AACAF,QAAQO,WAAW,GAAG;AACtB,6FAA6F;AAC7FP,QAAQQ,wBAAwB,GAAG,IAAI,EACvC,mCAAmC"}
1
+ {"version":3,"sources":["../../../lib/components/Tooltip/Tooltip.js"],"sourcesContent":["import * as React from 'react';\nimport { useTooltip_unstable } from './useTooltip';\nimport { renderTooltip_unstable } from './renderTooltip';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useTooltipStyles_unstable } from './useTooltipStyles.styles';\n/**\n * A tooltip provides light weight contextual information on top of its target element.\n */\nexport const Tooltip = props => {\n const state = useTooltip_unstable(props);\n useTooltipStyles_unstable(state);\n useCustomStyleHook_unstable('useTooltipStyles_unstable')(state);\n return renderTooltip_unstable(state);\n};\nTooltip.displayName = 'Tooltip';\n// type casting here is required to ensure internal type FluentTriggerComponent is not leaked\nTooltip.isFluentTriggerComponent = true;\n//# sourceMappingURL=Tooltip.js.map"],"names":["Tooltip","props","state","useTooltip_unstable","useTooltipStyles_unstable","useCustomStyleHook_unstable","renderTooltip_unstable","displayName","isFluentTriggerComponent"],"mappings":";;;;+BAQaA;;aAAAA;;;6DARU;4BACa;+BACG;qCACK;wCACF;AAInC,MAAMA,UAAUC,CAAAA,QAAS;IAC9B,MAAMC,QAAQC,IAAAA,+BAAmB,EAACF;IAClCG,IAAAA,iDAAyB,EAACF;IAC1BG,IAAAA,gDAA2B,EAAC,6BAA6BH;IACzD,OAAOI,IAAAA,qCAAsB,EAACJ;AAChC;AACAF,QAAQO,WAAW,GAAG;AACtB,6FAA6F;AAC7FP,QAAQQ,wBAAwB,GAAG,IAAI,EACvC,mCAAmC"}
@@ -7,7 +7,7 @@ _exportStar(require("./Tooltip"), exports);
7
7
  _exportStar(require("./Tooltip.types"), exports);
8
8
  _exportStar(require("./renderTooltip"), exports);
9
9
  _exportStar(require("./useTooltip"), exports);
10
- _exportStar(require("./useTooltipStyles"), exports);
10
+ _exportStar(require("./useTooltipStyles.styles"), exports);
11
11
  //# sourceMappingURL=index.js.map
12
12
 
13
13
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../lib/components/Tooltip/index.js"],"sourcesContent":["export * from './Tooltip';\nexport * from './Tooltip.types';\nexport * from './renderTooltip';\nexport * from './useTooltip';\nexport * from './useTooltipStyles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
1
+ {"version":3,"sources":["../../../lib/components/Tooltip/index.js"],"sourcesContent":["export * from './Tooltip';\nexport * from './Tooltip.types';\nexport * from './renderTooltip';\nexport * from './useTooltip';\nexport * from './useTooltipStyles.styles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
@@ -204,6 +204,6 @@ const useTooltipStyles_unstable = (state)=>{
204
204
  state.content.className = (0, _react.mergeClasses)(tooltipClassNames.content, styles.root, state.appearance === 'inverted' && styles.inverted, state.visible && styles.visible, state.content.className);
205
205
  state.arrowClassName = styles.arrow;
206
206
  return state;
207
- }; //# sourceMappingURL=useTooltipStyles.js.map
207
+ }; //# sourceMappingURL=useTooltipStyles.styles.js.map
208
208
 
209
- //# sourceMappingURL=useTooltipStyles.js.map
209
+ //# sourceMappingURL=useTooltipStyles.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../lib/components/Tooltip/useTooltipStyles.styles.js"],"sourcesContent":["import { shorthands, __styles, mergeClasses } from '@griffel/react';\nimport { createArrowStyles } from '@fluentui/react-positioning';\nimport { tokens } from '@fluentui/react-theme';\nimport { arrowHeight } from './private/constants';\nexport const tooltipClassNames = {\n content: 'fui-Tooltip__content'\n};\n/**\n * Styles for the tooltip\n */\nconst useStyles = /*#__PURE__*/__styles({\n root: {\n mc9l5x: \"fjseox\",\n B7ck84d: \"f1ewtqcl\",\n B2u0y6b: \"f132xexn\",\n Bceei9c: \"f158kwzp\",\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fy9rknc\",\n Bg96gwp: \"fwrc4pm\",\n Bbmb7ep: [\"f1aa9q02\", \"f16jpd5f\"],\n Beyfa6y: [\"f16jpd5f\", \"f1aa9q02\"],\n B7oj6ja: [\"f1jar5jt\", \"fyu767a\"],\n Btl43ni: [\"fyu767a\", \"f1jar5jt\"],\n B4j52fo: \"f5ogflp\",\n Bekrc4i: [\"f1hqa2wf\", \"finvdd3\"],\n Bn0qgzm: \"f1f09k3d\",\n ibv6hh: [\"finvdd3\", \"f1hqa2wf\"],\n icvyot: \"fzkkow9\",\n vrafjx: [\"fcdblym\", \"fjik90z\"],\n oivjwe: \"fg706s2\",\n wvpqe5: [\"fjik90z\", \"fcdblym\"],\n g2u3we: \"fghlq4f\",\n h3c5rm: [\"f1gn591s\", \"fjscplz\"],\n B9xav0g: \"fb073pr\",\n zhjwy3: [\"fjscplz\", \"f1gn591s\"],\n z8tnut: \"f10ra9hq\",\n z189sj: [\"fd9xhir\", \"f1jlaasf\"],\n Byoj8tv: \"f1d7kygh\",\n uwmqm3: [\"f1jlaasf\", \"fd9xhir\"],\n De3pzq: \"fxugw4r\",\n sj55zd: \"f19n0e5\",\n Bhu2qc9: \"fxeb0a7\"\n },\n visible: {\n mc9l5x: \"ftgm304\"\n },\n inverted: {\n De3pzq: \"fg3r6xk\",\n sj55zd: \"fonrgv7\"\n },\n arrow: {\n qhf8xq: \"f1euv43f\",\n De3pzq: \"f1u2r49w\",\n Bcdw1i0: \"fd7fpy0\",\n Bj3rh1h: \"f1bsuimh\",\n a9b677: \"f1ekdpwm\",\n Bqenvij: \"f83vc9z\",\n Ftih45: \"f1wl9k8s\",\n B1puzpu: \"f1wkw4r9\",\n Brfgrao: \"f1j7ml58\",\n Bcvre1j: \"fyl8oag\",\n Ccq8qp: \"frdoeuz\",\n Baz25je: \"fb81m9q\",\n cmx5o7: \"f1ljr5q2\",\n B4f6apu: \"fyfemzf\",\n m598lv: \"focyt6c\",\n Bk5zm6e: \"fnhxbxj\",\n y0oebl: \"fdw6hkg\",\n qa3bma: \"f11yjt3y\",\n Bqjgrrk: \"f1172wan\",\n Budzafs: [\"f9e5op9\", \"f112wvtl\"],\n Hv9wc6: [\"ftj5xct\", \"fyavhwi\"],\n hl6cv3: \"f1773hnp\",\n Bh2vraf: \"f1n8855c\",\n yayu3t: \"f1v7783n\",\n wedwtw: \"fsw6im5\",\n rhl9o9: \"fh2hsk5\",\n Bu8t5uz: \"f159pzir\",\n B6q6orb: \"f11yvu4\",\n Bwwlvwl: \"fm1ycve\"\n }\n}, {\n d: [\".fjseox{display:none;}\", \".f1ewtqcl{box-sizing:border-box;}\", \".f132xexn{max-width:240px;}\", \".f158kwzp{cursor:default;}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".fwrc4pm{line-height:var(--lineHeightBase200);}\", \".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}\", \".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}\", \".f5ogflp{border-top-width:1px;}\", \".f1hqa2wf{border-right-width:1px;}\", \".finvdd3{border-left-width:1px;}\", \".f1f09k3d{border-bottom-width:1px;}\", \".fzkkow9{border-top-style:solid;}\", \".fcdblym{border-right-style:solid;}\", \".fjik90z{border-left-style:solid;}\", \".fg706s2{border-bottom-style:solid;}\", \".fghlq4f{border-top-color:var(--colorTransparentStroke);}\", \".f1gn591s{border-right-color:var(--colorTransparentStroke);}\", \".fjscplz{border-left-color:var(--colorTransparentStroke);}\", \".fb073pr{border-bottom-color:var(--colorTransparentStroke);}\", \".f10ra9hq{padding-top:4px;}\", \".fd9xhir{padding-right:11px;}\", \".f1jlaasf{padding-left:11px;}\", \".f1d7kygh{padding-bottom:6px;}\", \".fxugw4r{background-color:var(--colorNeutralBackground1);}\", \".f19n0e5{color:var(--colorNeutralForeground1);}\", \".fxeb0a7{-webkit-filter:drop-shadow(0 0 2px var(--colorNeutralShadowAmbient)) drop-shadow(0 4px 8px var(--colorNeutralShadowKey));filter:drop-shadow(0 0 2px var(--colorNeutralShadowAmbient)) drop-shadow(0 4px 8px var(--colorNeutralShadowKey));}\", \".ftgm304{display:block;}\", \".fg3r6xk{background-color:var(--colorNeutralBackgroundStatic);}\", \".fonrgv7{color:var(--colorNeutralForegroundStaticInverted);}\", \".f1euv43f{position:absolute;}\", \".f1u2r49w{background-color:inherit;}\", \".fd7fpy0{visibility:hidden;}\", \".f1bsuimh{z-index:-1;}\", \".f1ekdpwm{width:8.484px;}\", \".f83vc9z{height:8.484px;}\", \".f1wl9k8s::before{content:\\\"\\\";}\", \".f1wkw4r9::before{visibility:visible;}\", \".f1j7ml58::before{position:absolute;}\", \".fyl8oag::before{box-sizing:border-box;}\", \".frdoeuz::before{width:inherit;}\", \".fb81m9q::before{height:inherit;}\", \".f1ljr5q2::before{background-color:inherit;}\", \".fyfemzf::before{border-right-width:1px;}\", \".focyt6c::before{border-right-style:solid;}\", \".fnhxbxj::before{border-right-color:var(--colorTransparentStroke);}\", \".fdw6hkg::before{border-bottom-width:1px;}\", \".f11yjt3y::before{border-bottom-style:solid;}\", \".f1172wan::before{border-bottom-color:var(--colorTransparentStroke);}\", \".f9e5op9::before{border-bottom-right-radius:var(--borderRadiusSmall);}\", \".f112wvtl::before{border-bottom-left-radius:var(--borderRadiusSmall);}\", \".ftj5xct::before{-webkit-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);-moz-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);-ms-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);}\", \".fyavhwi::before{-webkit-transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);-moz-transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);-ms-transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);}\", \"[data-popper-placement^=\\\"top\\\"] .f1773hnp{bottom:-1px;}\", \"[data-popper-placement^=\\\"top\\\"] .f1n8855c{--angle:0;}\", \"[data-popper-placement^=\\\"right\\\"] .f1v7783n{left:-1px;}\", \"[data-popper-placement^=\\\"right\\\"] .fsw6im5{--angle:90deg;}\", \"[data-popper-placement^=\\\"bottom\\\"] .fh2hsk5{top:-1px;}\", \"[data-popper-placement^=\\\"bottom\\\"] .f159pzir{--angle:180deg;}\", \"[data-popper-placement^=\\\"left\\\"] .f11yvu4{right:-1px;}\", \"[data-popper-placement^=\\\"left\\\"] .fm1ycve{--angle:270deg;}\"]\n});\n/**\n * Apply styling to the Tooltip slots based on the state\n */\nexport const useTooltipStyles_unstable = state => {\n const styles = useStyles();\n state.content.className = mergeClasses(tooltipClassNames.content, styles.root, state.appearance === 'inverted' && styles.inverted, state.visible && styles.visible, state.content.className);\n state.arrowClassName = styles.arrow;\n return state;\n};\n//# sourceMappingURL=useTooltipStyles.styles.js.map"],"names":["tooltipClassNames","useTooltipStyles_unstable","content","useStyles","__styles","root","mc9l5x","B7ck84d","B2u0y6b","Bceei9c","Bahqtrf","Be2twd7","Bg96gwp","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","icvyot","vrafjx","oivjwe","wvpqe5","g2u3we","h3c5rm","B9xav0g","zhjwy3","z8tnut","z189sj","Byoj8tv","uwmqm3","De3pzq","sj55zd","Bhu2qc9","visible","inverted","arrow","qhf8xq","Bcdw1i0","Bj3rh1h","a9b677","Bqenvij","Ftih45","B1puzpu","Brfgrao","Bcvre1j","Ccq8qp","Baz25je","cmx5o7","B4f6apu","m598lv","Bk5zm6e","y0oebl","qa3bma","Bqjgrrk","Budzafs","Hv9wc6","hl6cv3","Bh2vraf","yayu3t","wedwtw","rhl9o9","Bu8t5uz","B6q6orb","Bwwlvwl","d","state","styles","className","mergeClasses","appearance","arrowClassName"],"mappings":";;;;;;;;;;;IAIaA,iBAAiB,MAAjBA;IAmFAC,yBAAyB,MAAzBA;;uBAvFsC;AAI5C,MAAMD,oBAAoB;IAC/BE,SAAS;AACX;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCC,MAAM;QACJC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;YAAC;YAAY;SAAW;QACjCC,SAAS;YAAC;YAAY;SAAW;QACjCC,SAAS;YAAC;YAAY;SAAU;QAChCC,SAAS;YAAC;YAAW;SAAW;QAChCC,SAAS;QACTC,SAAS;YAAC;YAAY;SAAU;QAChCC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,QAAQ;QACRC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,QAAQ;QACRC,QAAQ;QACRC,SAAS;IACX;IACAC,SAAS;QACP9B,QAAQ;IACV;IACA+B,UAAU;QACRJ,QAAQ;QACRC,QAAQ;IACV;IACAI,OAAO;QACLC,QAAQ;QACRN,QAAQ;QACRO,SAAS;QACTC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,SAAS;YAAC;YAAW;SAAW;QAChCC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;QAA0B;QAAqC;QAA+B;QAA8B;QAAgD;QAA+C;QAAmD;QAAoE;QAAmE;QAAiE;QAA+D;QAAmC;QAAsC;QAAoC;QAAuC;QAAqC;QAAuC;QAAsC;QAAwC;QAA6D;QAAgE;QAA8D;QAAgE;QAA+B;QAAiC;QAAiC;QAAkC;QAA8D;QAAmD;QAAwP;QAA4B;QAAmE;QAAgE;QAAiC;QAAwC;QAAgC;QAA0B;QAA6B;QAA6B;QAAoC;QAA0C;QAAyC;QAA4C;QAAoC;QAAqC;QAAgD;QAA6C;QAA+C;QAAuE;QAA8C;QAAiD;QAAyE;QAA0E;QAA0E;QAAmS;QAAuS;QAA4D;QAA0D;QAA4D;QAA+D;QAA2D;QAAkE;QAA2D;KAA8D;AACxrH;AAIO,MAAMlE,4BAA4BmE,CAAAA,QAAS;IAChD,MAAMC,SAASlE;IACfiE,MAAMlE,OAAO,CAACoE,SAAS,GAAGC,IAAAA,mBAAY,EAACvE,kBAAkBE,OAAO,EAAEmE,OAAOhE,IAAI,EAAE+D,MAAMI,UAAU,KAAK,cAAcH,OAAOhC,QAAQ,EAAE+B,MAAMhC,OAAO,IAAIiC,OAAOjC,OAAO,EAAEgC,MAAMlE,OAAO,CAACoE,SAAS;IAC3LF,MAAMK,cAAc,GAAGJ,OAAO/B,KAAK;IACnC,OAAO8B;AACT,GACA,mDAAmD"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-tooltip",
3
- "version": "0.0.0-nightly-20230427-0418.1",
3
+ "version": "0.0.0-nightly-20230428-0419.1",
4
4
  "description": "React components for building web experiences",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -27,18 +27,18 @@
27
27
  "devDependencies": {
28
28
  "@fluentui/eslint-plugin": "*",
29
29
  "@fluentui/react-conformance": "*",
30
- "@fluentui/react-conformance-griffel": "0.0.0-nightly-20230427-0418.1",
30
+ "@fluentui/react-conformance-griffel": "0.0.0-nightly-20230428-0419.1",
31
31
  "@fluentui/scripts-api-extractor": "*",
32
32
  "@fluentui/scripts-tasks": "*"
33
33
  },
34
34
  "dependencies": {
35
- "@fluentui/keyboard-keys": "0.0.0-nightly-20230427-0418.1",
36
- "@fluentui/react-jsx-runtime": "0.0.0-nightly-20230427-0418.1",
37
- "@fluentui/react-portal": "0.0.0-nightly-20230427-0418.1",
38
- "@fluentui/react-positioning": "0.0.0-nightly-20230427-0418.1",
39
- "@fluentui/react-shared-contexts": "0.0.0-nightly-20230427-0418.1",
40
- "@fluentui/react-theme": "0.0.0-nightly-20230427-0418.1",
41
- "@fluentui/react-utilities": "0.0.0-nightly-20230427-0418.1",
35
+ "@fluentui/keyboard-keys": "0.0.0-nightly-20230428-0419.1",
36
+ "@fluentui/react-jsx-runtime": "0.0.0-nightly-20230428-0419.1",
37
+ "@fluentui/react-portal": "0.0.0-nightly-20230428-0419.1",
38
+ "@fluentui/react-positioning": "0.0.0-nightly-20230428-0419.1",
39
+ "@fluentui/react-shared-contexts": "0.0.0-nightly-20230428-0419.1",
40
+ "@fluentui/react-theme": "0.0.0-nightly-20230428-0419.1",
41
+ "@fluentui/react-utilities": "0.0.0-nightly-20230428-0419.1",
42
42
  "@griffel/react": "^1.5.2",
43
43
  "@swc/helpers": "^0.4.14"
44
44
  },
package/dist/index.d.ts DELETED
@@ -1,143 +0,0 @@
1
- import type { ComponentProps } from '@fluentui/react-utilities';
2
- import type { ComponentState } from '@fluentui/react-utilities';
3
- import type { PortalProps } from '@fluentui/react-portal';
4
- import type { PositioningShorthand } from '@fluentui/react-positioning';
5
- import * as React_2 from 'react';
6
- import type { Slot } from '@fluentui/react-utilities';
7
- import type { SlotClassNames } from '@fluentui/react-utilities';
8
- import type { TriggerProps } from '@fluentui/react-utilities';
9
-
10
- /**
11
- * Data for the Tooltip's onVisibleChange event.
12
- */
13
- export declare type OnVisibleChangeData = {
14
- visible: boolean;
15
- };
16
-
17
- /**
18
- * Render the final JSX of Tooltip
19
- */
20
- export declare const renderTooltip_unstable: (state: TooltipState) => JSX.Element;
21
-
22
- /**
23
- * A tooltip provides light weight contextual information on top of its target element.
24
- */
25
- export declare const Tooltip: React_2.FC<TooltipProps>;
26
-
27
- export declare const tooltipClassNames: SlotClassNames<TooltipSlots>;
28
-
29
- /**
30
- * Properties for Tooltip
31
- */
32
- export declare type TooltipProps = ComponentProps<TooltipSlots> & TriggerProps<TooltipTriggerProps> & Pick<PortalProps, 'mountNode'> & {
33
- /**
34
- * The tooltip's visual appearance.
35
- * * `normal` - Uses the theme's background and text colors.
36
- * * `inverted` - Higher contrast variant that uses the theme's inverted colors.
37
- *
38
- * @default normal
39
- */
40
- appearance?: 'normal' | 'inverted';
41
- /**
42
- * Delay before the tooltip is hidden, in milliseconds.
43
- *
44
- * @default 250
45
- */
46
- hideDelay?: number;
47
- /**
48
- * Notification when the visibility of the tooltip is changing
49
- */
50
- onVisibleChange?: (event: React_2.PointerEvent<HTMLElement> | React_2.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => void;
51
- /**
52
- * Configure the positioning of the tooltip
53
- *
54
- * @default above
55
- */
56
- positioning?: PositioningShorthand;
57
- /**
58
- * (Required) Specifies whether this tooltip is acting as the description or label of its trigger element.
59
- *
60
- * * `label` - The tooltip sets the trigger's aria-label or aria-labelledby attribute. This is useful for buttons
61
- * displaying only an icon, for example.
62
- * * `description` - The tooltip sets the trigger's aria-description or aria-describedby attribute.
63
- * * `inaccessible` - No aria attributes are set on the trigger. This makes the tooltip's content inaccessible to
64
- * screen readers, and should only be used if the tooltip's text is available by some other means.
65
- */
66
- relationship: 'label' | 'description' | 'inaccessible';
67
- /**
68
- * Delay before the tooltip is shown, in milliseconds.
69
- *
70
- * @default 250
71
- */
72
- showDelay?: number;
73
- /**
74
- * Control the tooltip's visibility programatically.
75
- *
76
- * This can be used in conjunction with onVisibleChange to modify the tooltip's show and hide behavior.
77
- *
78
- * If not provided, the visibility will be controlled by the tooltip itself, based on hover and focus events on the
79
- * trigger (child) element.
80
- *
81
- * @default false
82
- */
83
- visible?: boolean;
84
- /**
85
- * Render an arrow pointing to the target element
86
- *
87
- * @default false
88
- */
89
- withArrow?: boolean;
90
- };
91
-
92
- /**
93
- * Slot properties for Tooltip
94
- */
95
- export declare type TooltipSlots = {
96
- /**
97
- * The text or JSX content of the tooltip.
98
- */
99
- content: NonNullable<Slot<'div'>>;
100
- };
101
-
102
- /**
103
- * State used in rendering Tooltip
104
- */
105
- export declare type TooltipState = ComponentState<TooltipSlots> & Pick<TooltipProps, 'mountNode' | 'relationship'> & Required<Pick<TooltipProps, 'appearance' | 'hideDelay' | 'positioning' | 'showDelay' | 'visible' | 'withArrow'>> & {
106
- children?: React_2.ReactElement | null;
107
- /**
108
- * Whether the tooltip should be rendered to the DOM.
109
- */
110
- shouldRenderTooltip?: boolean;
111
- /**
112
- * Ref to the arrow element
113
- */
114
- arrowRef?: React_2.Ref<HTMLDivElement>;
115
- /**
116
- * CSS class for the arrow element
117
- */
118
- arrowClassName?: string;
119
- };
120
-
121
- /**
122
- * The properties that are added to the child of the Tooltip
123
- */
124
- export declare type TooltipTriggerProps = {
125
- ref?: React_2.Ref<unknown>;
126
- } & Pick<React_2.HTMLAttributes<HTMLElement>, 'aria-describedby' | 'aria-label' | 'aria-labelledby' | 'onBlur' | 'onFocus' | 'onPointerEnter' | 'onPointerLeave'>;
127
-
128
- /**
129
- * Create the state required to render Tooltip.
130
- *
131
- * The returned state can be modified with hooks such as useTooltipStyles_unstable,
132
- * before being passed to renderTooltip_unstable.
133
- *
134
- * @param props - props from this instance of Tooltip
135
- */
136
- export declare const useTooltip_unstable: (props: TooltipProps) => TooltipState;
137
-
138
- /**
139
- * Apply styling to the Tooltip slots based on the state
140
- */
141
- export declare const useTooltipStyles_unstable: (state: TooltipState) => TooltipState;
142
-
143
- export { }
package/lib/Tooltip.js DELETED
@@ -1,2 +0,0 @@
1
- export * from './components/Tooltip/index';
2
- //# sourceMappingURL=Tooltip.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":[],"sources":["../src/Tooltip.ts"],"sourcesContent":["export * from './components/Tooltip/index';\n"],"mappings":"AAAA,cAAc"}
@@ -1,18 +0,0 @@
1
- import * as React from 'react';
2
- import { useTooltip_unstable } from './useTooltip';
3
- import { renderTooltip_unstable } from './renderTooltip';
4
- import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
5
- import { useTooltipStyles_unstable } from './useTooltipStyles';
6
- /**
7
- * A tooltip provides light weight contextual information on top of its target element.
8
- */
9
- export const Tooltip = props => {
10
- const state = useTooltip_unstable(props);
11
- useTooltipStyles_unstable(state);
12
- useCustomStyleHook_unstable('useTooltipStyles_unstable')(state);
13
- return renderTooltip_unstable(state);
14
- };
15
- Tooltip.displayName = 'Tooltip';
16
- // type casting here is required to ensure internal type FluentTriggerComponent is not leaked
17
- Tooltip.isFluentTriggerComponent = true;
18
- //# sourceMappingURL=Tooltip.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["React","useTooltip_unstable","renderTooltip_unstable","useCustomStyleHook_unstable","useTooltipStyles_unstable","Tooltip","props","state","displayName","isFluentTriggerComponent"],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTooltip_unstable } from './useTooltip';\nimport { renderTooltip_unstable } from './renderTooltip';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useTooltipStyles_unstable } from './useTooltipStyles';\nimport type { TooltipProps } from './Tooltip.types';\nimport type { FluentTriggerComponent } from '@fluentui/react-utilities';\n\n/**\n * A tooltip provides light weight contextual information on top of its target element.\n */\nexport const Tooltip: React.FC<TooltipProps> = props => {\n const state = useTooltip_unstable(props);\n\n useTooltipStyles_unstable(state);\n\n useCustomStyleHook_unstable('useTooltipStyles_unstable')(state);\n\n return renderTooltip_unstable(state);\n};\n\nTooltip.displayName = 'Tooltip';\n// type casting here is required to ensure internal type FluentTriggerComponent is not leaked\n(Tooltip as FluentTriggerComponent).isFluentTriggerComponent = true;\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,mBAAmB,QAAQ;AACpC,SAASC,sBAAsB,QAAQ;AACvC,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,yBAAyB,QAAQ;AAI1C;;;AAGA,OAAO,MAAMC,OAAA,GAAkCC,KAAA,IAAS;EACtD,MAAMC,KAAA,GAAQN,mBAAA,CAAoBK,KAAA;EAElCF,yBAAA,CAA0BG,KAAA;EAE1BJ,2BAAA,CAA4B,6BAA6BI,KAAA;EAEzD,OAAOL,sBAAA,CAAuBK,KAAA;AAChC;AAEAF,OAAA,CAAQG,WAAW,GAAG;AACtB;AACCH,OAAA,CAAmCI,wBAAwB,GAAG,IAAI"}
@@ -1,2 +0,0 @@
1
- import * as React from 'react';
2
- //# sourceMappingURL=Tooltip.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["React"],"sources":["../../../src/components/Tooltip/Tooltip.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { PositioningShorthand } from '@fluentui/react-positioning';\nimport type { ComponentProps, ComponentState, Slot, TriggerProps } from '@fluentui/react-utilities';\nimport type { PortalProps } from '@fluentui/react-portal';\n\n/**\n * Slot properties for Tooltip\n */\nexport type TooltipSlots = {\n /**\n * The text or JSX content of the tooltip.\n */\n content: NonNullable<Slot<'div'>>;\n};\n\n/**\n * The properties that are added to the child of the Tooltip\n */\nexport type TooltipChildProps = {\n ref?: React.Ref<unknown>;\n} & Pick<\n React.HTMLAttributes<HTMLElement>,\n 'aria-describedby' | 'aria-label' | 'aria-labelledby' | 'onBlur' | 'onFocus' | 'onPointerEnter' | 'onPointerLeave'\n>;\n\n/**\n * Data for the Tooltip's onVisibleChange event.\n */\nexport type OnVisibleChangeData = {\n visible: boolean;\n};\n\n/**\n * Properties for Tooltip\n */\nexport type TooltipProps = ComponentProps<TooltipSlots> &\n TriggerProps<TooltipChildProps> &\n Pick<PortalProps, 'mountNode'> & {\n /**\n * The tooltip's visual appearance.\n * * `normal` - Uses the theme's background and text colors.\n * * `inverted` - Higher contrast variant that uses the theme's inverted colors.\n *\n * @default normal\n */\n appearance?: 'normal' | 'inverted';\n /**\n * Delay before the tooltip is hidden, in milliseconds.\n *\n * @default 250\n */\n hideDelay?: number;\n\n /**\n * Notification when the visibility of the tooltip is changing\n */\n onVisibleChange?: (\n event: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined,\n data: OnVisibleChangeData,\n ) => void;\n\n /**\n * Configure the positioning of the tooltip\n *\n * @default above\n */\n positioning?: PositioningShorthand;\n\n /**\n * (Required) Specifies whether this tooltip is acting as the description or label of its trigger element.\n *\n * * `label` - The tooltip sets the trigger's aria-label or aria-labelledby attribute. This is useful for buttons\n * displaying only an icon, for example.\n * * `description` - The tooltip sets the trigger's aria-description or aria-describedby attribute.\n * * `inaccessible` - No aria attributes are set on the trigger. This makes the tooltip's content inaccessible to\n * screen readers, and should only be used if the tooltip's text is available by some other means.\n */\n relationship: 'label' | 'description' | 'inaccessible';\n\n /**\n * Delay before the tooltip is shown, in milliseconds.\n *\n * @default 250\n */\n showDelay?: number;\n\n /**\n * Control the tooltip's visibility programatically.\n *\n * This can be used in conjunction with onVisibleChange to modify the tooltip's show and hide behavior.\n *\n * If not provided, the visibility will be controlled by the tooltip itself, based on hover and focus events on the\n * trigger (child) element.\n *\n * @default false\n */\n visible?: boolean;\n\n /**\n * Render an arrow pointing to the target element\n *\n * @default false\n */\n withArrow?: boolean;\n };\n\n/**\n * State used in rendering Tooltip\n */\nexport type TooltipState = ComponentState<TooltipSlots> &\n Pick<TooltipProps, 'mountNode' | 'relationship'> &\n Required<Pick<TooltipProps, 'appearance' | 'hideDelay' | 'positioning' | 'showDelay' | 'visible' | 'withArrow'>> & {\n children?: React.ReactElement | null;\n\n /**\n * Whether the tooltip should be rendered to the DOM.\n */\n shouldRenderTooltip?: boolean;\n\n /**\n * Ref to the arrow element\n */\n arrowRef?: React.Ref<HTMLDivElement>;\n\n /**\n * CSS class for the arrow element\n */\n arrowClassName?: string;\n };\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW"}
@@ -1,6 +0,0 @@
1
- export * from './Tooltip';
2
- export * from './Tooltip.types';
3
- export * from './renderTooltip';
4
- export * from './useTooltip';
5
- export * from './useTooltipStyles';
6
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":[],"sources":["../../../src/components/Tooltip/index.ts"],"sourcesContent":["export * from './Tooltip';\nexport * from './Tooltip.types';\nexport * from './renderTooltip';\nexport * from './useTooltip';\nexport * from './useTooltipStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
@@ -1,12 +0,0 @@
1
- /**
2
- * The height of the tooltip's arrow in pixels.
3
- */export const arrowHeight = 6;
4
- /**
5
- * The default value of the tooltip's border radius (borderRadiusMedium).
6
- *
7
- * Unfortunately, Popper requires it to be specified as a variable instead of using CSS.
8
- * While we could use getComputedStyle, that adds a performance penalty for something that
9
- * will likely never change.
10
- */
11
- export const tooltipBorderRadius = 4;
12
- //# sourceMappingURL=constants.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["arrowHeight","tooltipBorderRadius"],"sources":["../../../../src/components/Tooltip/private/constants.ts"],"sourcesContent":["/**\n * The height of the tooltip's arrow in pixels.\n */\nexport const arrowHeight = 6;\n\n/**\n * The default value of the tooltip's border radius (borderRadiusMedium).\n *\n * Unfortunately, Popper requires it to be specified as a variable instead of using CSS.\n * While we could use getComputedStyle, that adds a performance penalty for something that\n * will likely never change.\n */\nexport const tooltipBorderRadius = 4;\n"],"mappings":"AAAA;;GAGA,OAAO,MAAMA,WAAA,GAAc;AAE3B;;;;;;;AAOA,OAAO,MAAMC,mBAAA,GAAsB"}
@@ -1,20 +0,0 @@
1
- /** @jsxRuntime classic */ /** @jsxFrag React.Fragment */ /** @jsx createElement */import * as React from 'react';
2
- import { Portal } from '@fluentui/react-portal';
3
- import { createElement } from '@fluentui/react-jsx-runtime';
4
- import { getSlotsNext } from '@fluentui/react-utilities';
5
- /**
6
- * Render the final JSX of Tooltip
7
- */
8
- export const renderTooltip_unstable = state => {
9
- const {
10
- slots,
11
- slotProps
12
- } = getSlotsNext(state);
13
- return /*#__PURE__*/createElement(React.Fragment, null, state.children, state.shouldRenderTooltip && /*#__PURE__*/createElement(Portal, {
14
- mountNode: state.mountNode
15
- }, /*#__PURE__*/createElement(slots.content, slotProps.content, state.withArrow && /*#__PURE__*/createElement("div", {
16
- ref: state.arrowRef,
17
- className: state.arrowClassName
18
- }), state.content.children)));
19
- };
20
- //# sourceMappingURL=renderTooltip.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["React","Portal","createElement","getSlotsNext","renderTooltip_unstable","state","slots","slotProps","Fragment","children","shouldRenderTooltip","mountNode","content","withArrow","ref","arrowRef","className","arrowClassName"],"sources":["../../../src/components/Tooltip/renderTooltip.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsxFrag React.Fragment */\n/** @jsx createElement */\n\nimport * as React from 'react';\nimport { Portal } from '@fluentui/react-portal';\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { TooltipSlots, TooltipState } from './Tooltip.types';\n\n/**\n * Render the final JSX of Tooltip\n */\nexport const renderTooltip_unstable = (state: TooltipState) => {\n const { slots, slotProps } = getSlotsNext<TooltipSlots>(state);\n\n return (\n <>\n {state.children}\n {state.shouldRenderTooltip && (\n <Portal mountNode={state.mountNode}>\n <slots.content {...slotProps.content}>\n {state.withArrow && <div ref={state.arrowRef} className={state.arrowClassName} />}\n {state.content.children}\n </slots.content>\n </Portal>\n )}\n </>\n );\n};\n"],"mappings":"AAAA,2BACA,+BACA,yBAEA,YAAYA,KAAA,MAAW;AACvB,SAASC,MAAM,QAAQ;AAEvB,SAASC,aAAa,QAAQ;AAE9B,SAASC,YAAY,QAAQ;AAG7B;;;AAGA,OAAO,MAAMC,sBAAA,GAA0BC,KAAA,IAAwB;EAC7D,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,YAAA,CAA2BE,KAAA;EAExD,oBACEH,aAjBJ,CADAF,KAAA,CAAAQ,QAA8B,QAmBvBH,KAAA,CAAMI,QAAQ,EACdJ,KAAA,CAAMK,mBAAmB,iBACxBR,aApBR,CAoBSD,MAAA;IAAOU,SAAA,EAAWN,KAAA,CAAMM;kBACvBT,aArBV,CAqBWI,KAAA,CAAMM,OAAO,EAAKL,SAAA,CAAUK,OAAO,EACjCP,KAAA,CAAMQ,SAAS,iBAAIX,aAtBhC,CAsBiC;IAAIY,GAAA,EAAKT,KAAA,CAAMU,QAAQ;IAAEC,SAAA,EAAWX,KAAA,CAAMY;MAC9DZ,KAAA,CAAMO,OAAO,CAACH,QAAQ;AAMnC"}
@@ -1,196 +0,0 @@
1
- import * as React from 'react';
2
- import { mergeArrowOffset, resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';
3
- import { useTooltipVisibility_unstable as useTooltipVisibility, useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
4
- import { applyTriggerPropsToChildren, resolveShorthand, useControllableState, useId, useIsomorphicLayoutEffect, useIsSSR, useMergedRefs, useTimeout, getTriggerChild, mergeCallbacks, useEventCallback } from '@fluentui/react-utilities';
5
- import { arrowHeight, tooltipBorderRadius } from './private/constants';
6
- import { Escape } from '@fluentui/keyboard-keys';
7
- /**
8
- * Create the state required to render Tooltip.
9
- *
10
- * The returned state can be modified with hooks such as useTooltipStyles_unstable,
11
- * before being passed to renderTooltip_unstable.
12
- *
13
- * @param props - props from this instance of Tooltip
14
- */
15
- export const useTooltip_unstable = props => {
16
- var _child_props, _child_props1, _child_props2, _child_props3;
17
- const context = useTooltipVisibility();
18
- const isServerSideRender = useIsSSR();
19
- const {
20
- targetDocument
21
- } = useFluent();
22
- const [setDelayTimeout, clearDelayTimeout] = useTimeout();
23
- const {
24
- appearance = 'normal',
25
- children,
26
- content,
27
- withArrow = false,
28
- positioning = 'above',
29
- onVisibleChange,
30
- relationship,
31
- showDelay = 250,
32
- hideDelay = 250,
33
- mountNode
34
- } = props;
35
- const [visible, setVisibleInternal] = useControllableState({
36
- state: props.visible,
37
- initialState: false
38
- });
39
- const setVisible = React.useCallback((newVisible, ev) => {
40
- clearDelayTimeout();
41
- setVisibleInternal(oldVisible => {
42
- if (newVisible !== oldVisible) {
43
- onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(ev, {
44
- visible: newVisible
45
- });
46
- }
47
- return newVisible;
48
- });
49
- }, [clearDelayTimeout, setVisibleInternal, onVisibleChange]);
50
- const state = {
51
- withArrow,
52
- positioning,
53
- showDelay,
54
- hideDelay,
55
- relationship,
56
- visible,
57
- shouldRenderTooltip: visible,
58
- appearance,
59
- mountNode,
60
- // Slots
61
- components: {
62
- content: 'div'
63
- },
64
- content: resolveShorthand(content, {
65
- defaultProps: {
66
- role: 'tooltip'
67
- },
68
- required: true
69
- })
70
- };
71
- state.content.id = useId('tooltip-', state.content.id);
72
- const positioningOptions = {
73
- enabled: state.visible,
74
- arrowPadding: 2 * tooltipBorderRadius,
75
- position: 'above',
76
- align: 'center',
77
- offset: 4,
78
- ...resolvePositioningShorthand(state.positioning)
79
- };
80
- if (state.withArrow) {
81
- positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeight);
82
- }
83
- const {
84
- targetRef,
85
- containerRef,
86
- arrowRef
87
- } = usePositioning(positioningOptions);
88
- state.content.ref = useMergedRefs(state.content.ref, containerRef);
89
- state.arrowRef = arrowRef;
90
- // When this tooltip is visible, hide any other tooltips, and register it
91
- // as the visibleTooltip with the TooltipContext.
92
- // Also add a listener on document to hide the tooltip if Escape is pressed
93
- useIsomorphicLayoutEffect(() => {
94
- if (visible) {
95
- var _context_visibleTooltip;
96
- const thisTooltip = {
97
- hide: () => setVisible(false)
98
- };
99
- (_context_visibleTooltip = context.visibleTooltip) === null || _context_visibleTooltip === void 0 ? void 0 : _context_visibleTooltip.hide();
100
- context.visibleTooltip = thisTooltip;
101
- const onDocumentKeyDown = ev => {
102
- if (ev.key === Escape) {
103
- thisTooltip.hide();
104
- // stop propagation to avoid conflicting with other elements that listen for `Escape`
105
- // e,g: Dialog, Popover, Menu
106
- ev.stopPropagation();
107
- }
108
- };
109
- targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('keydown', onDocumentKeyDown, {
110
- // As this event is added at targeted document,
111
- // we need to capture the event to be sure keydown handling from tooltip happens first
112
- capture: true
113
- });
114
- return () => {
115
- if (context.visibleTooltip === thisTooltip) {
116
- context.visibleTooltip = undefined;
117
- }
118
- targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('keydown', onDocumentKeyDown, {
119
- capture: true
120
- });
121
- };
122
- }
123
- }, [context, targetDocument, visible, setVisible]);
124
- // The focused element gets a blur event when the document loses focus
125
- // (e.g. switching tabs in the browser), but we don't want to show the
126
- // tooltip again when the document gets focus back. Handle this case by
127
- // checking if the blurred element is still the document's activeElement.
128
- // See https://github.com/microsoft/fluentui/issues/13541
129
- const ignoreNextFocusEventRef = React.useRef(false);
130
- // Listener for onPointerEnter and onFocus on the trigger element
131
- const onEnterTrigger = React.useCallback(ev => {
132
- if (ev.type === 'focus' && ignoreNextFocusEventRef.current) {
133
- ignoreNextFocusEventRef.current = false;
134
- return;
135
- }
136
- // Show immediately if another tooltip is already visible
137
- const delay = context.visibleTooltip ? 0 : state.showDelay;
138
- setDelayTimeout(() => {
139
- setVisible(true, ev);
140
- }, delay);
141
- ev.persist(); // Persist the event since the setVisible call will happen asynchronously
142
- }, [setDelayTimeout, setVisible, state.showDelay, context]);
143
- // Listener for onPointerLeave and onBlur on the trigger element
144
- const onLeaveTrigger = React.useCallback(ev => {
145
- let delay = state.hideDelay;
146
- if (ev.type === 'blur') {
147
- // Hide immediately when losing focus
148
- delay = 0;
149
- ignoreNextFocusEventRef.current = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) === ev.target;
150
- }
151
- setDelayTimeout(() => {
152
- setVisible(false, ev);
153
- }, delay);
154
- ev.persist(); // Persist the event since the setVisible call will happen asynchronously
155
- }, [setDelayTimeout, setVisible, state.hideDelay, targetDocument]);
156
- // Cancel the hide timer when the mouse or focus enters the tooltip, and restart it when the mouse or focus leaves.
157
- // This keeps the tooltip visible when the mouse is moved over it, or it has focus within.
158
- state.content.onPointerEnter = mergeCallbacks(state.content.onPointerEnter, clearDelayTimeout);
159
- state.content.onPointerLeave = mergeCallbacks(state.content.onPointerLeave, onLeaveTrigger);
160
- state.content.onFocus = mergeCallbacks(state.content.onFocus, clearDelayTimeout);
161
- state.content.onBlur = mergeCallbacks(state.content.onBlur, onLeaveTrigger);
162
- const child = getTriggerChild(children);
163
- const triggerAriaProps = {};
164
- if (relationship === 'label') {
165
- // aria-label only works if the content is a string. Otherwise, need to use aria-labelledby.
166
- if (typeof state.content.children === 'string') {
167
- triggerAriaProps['aria-label'] = state.content.children;
168
- } else {
169
- triggerAriaProps['aria-labelledby'] = state.content.id;
170
- // Always render the tooltip even if hidden, so that aria-labelledby refers to a valid element
171
- state.shouldRenderTooltip = true;
172
- }
173
- } else if (relationship === 'description') {
174
- triggerAriaProps['aria-describedby'] = state.content.id;
175
- // Always render the tooltip even if hidden, so that aria-describedby refers to a valid element
176
- state.shouldRenderTooltip = true;
177
- }
178
- // Don't render the Tooltip in SSR to avoid hydration errors
179
- if (isServerSideRender) {
180
- state.shouldRenderTooltip = false;
181
- }
182
- const childTargetRef = useMergedRefs(child === null || child === void 0 ? void 0 : child.ref, targetRef);
183
- // Apply the trigger props to the child, either by calling the render function, or cloning with the new props
184
- state.children = applyTriggerPropsToChildren(children, {
185
- ...triggerAriaProps,
186
- ...(child === null || child === void 0 ? void 0 : child.props),
187
- // If the target prop is not provided, attach targetRef to the trigger element's ref prop
188
- ref: positioningOptions.target === undefined ? childTargetRef : child === null || child === void 0 ? void 0 : child.ref,
189
- onPointerEnter: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props = child.props) === null || _child_props === void 0 ? void 0 : _child_props.onPointerEnter, onEnterTrigger)),
190
- onPointerLeave: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props1 = child.props) === null || _child_props1 === void 0 ? void 0 : _child_props1.onPointerLeave, onLeaveTrigger)),
191
- onFocus: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props2 = child.props) === null || _child_props2 === void 0 ? void 0 : _child_props2.onFocus, onEnterTrigger)),
192
- onBlur: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props3 = child.props) === null || _child_props3 === void 0 ? void 0 : _child_props3.onBlur, onLeaveTrigger))
193
- });
194
- return state;
195
- };
196
- //# sourceMappingURL=useTooltip.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["React","mergeArrowOffset","resolvePositioningShorthand","usePositioning","useTooltipVisibility_unstable","useTooltipVisibility","useFluent_unstable","useFluent","applyTriggerPropsToChildren","resolveShorthand","useControllableState","useId","useIsomorphicLayoutEffect","useIsSSR","useMergedRefs","useTimeout","getTriggerChild","mergeCallbacks","useEventCallback","arrowHeight","tooltipBorderRadius","Escape","useTooltip_unstable","props","_child_props","_child_props1","_child_props2","_child_props3","context","isServerSideRender","targetDocument","setDelayTimeout","clearDelayTimeout","appearance","children","content","withArrow","positioning","onVisibleChange","relationship","showDelay","hideDelay","mountNode","visible","setVisibleInternal","state","initialState","setVisible","useCallback","newVisible","ev","oldVisible","shouldRenderTooltip","components","defaultProps","role","required","id","positioningOptions","enabled","arrowPadding","position","align","offset","targetRef","containerRef","arrowRef","ref","_context_visibleTooltip","thisTooltip","hide","visibleTooltip","onDocumentKeyDown","key","stopPropagation","addEventListener","capture","undefined","removeEventListener","ignoreNextFocusEventRef","useRef","onEnterTrigger","type","current","delay","persist","onLeaveTrigger","activeElement","target","onPointerEnter","onPointerLeave","onFocus","onBlur","child","triggerAriaProps","childTargetRef"],"sources":["../../../src/components/Tooltip/useTooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { mergeArrowOffset, resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport {\n useTooltipVisibility_unstable as useTooltipVisibility,\n useFluent_unstable as useFluent,\n} from '@fluentui/react-shared-contexts';\nimport {\n applyTriggerPropsToChildren,\n resolveShorthand,\n useControllableState,\n useId,\n useIsomorphicLayoutEffect,\n useIsSSR,\n useMergedRefs,\n useTimeout,\n getTriggerChild,\n mergeCallbacks,\n useEventCallback,\n} from '@fluentui/react-utilities';\nimport type { TooltipProps, TooltipState, TooltipChildProps } from './Tooltip.types';\nimport { arrowHeight, tooltipBorderRadius } from './private/constants';\nimport { Escape } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render Tooltip.\n *\n * The returned state can be modified with hooks such as useTooltipStyles_unstable,\n * before being passed to renderTooltip_unstable.\n *\n * @param props - props from this instance of Tooltip\n */\nexport const useTooltip_unstable = (props: TooltipProps): TooltipState => {\n const context = useTooltipVisibility();\n const isServerSideRender = useIsSSR();\n const { targetDocument } = useFluent();\n const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n\n const {\n appearance = 'normal',\n children,\n content,\n withArrow = false,\n positioning = 'above',\n onVisibleChange,\n relationship,\n showDelay = 250,\n hideDelay = 250,\n mountNode,\n } = props;\n\n const [visible, setVisibleInternal] = useControllableState({ state: props.visible, initialState: false });\n const setVisible = React.useCallback(\n (newVisible: boolean, ev?: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n clearDelayTimeout();\n setVisibleInternal(oldVisible => {\n if (newVisible !== oldVisible) {\n onVisibleChange?.(ev, { visible: newVisible });\n }\n return newVisible;\n });\n },\n [clearDelayTimeout, setVisibleInternal, onVisibleChange],\n );\n\n const state: TooltipState = {\n withArrow,\n positioning,\n showDelay,\n hideDelay,\n relationship,\n visible,\n shouldRenderTooltip: visible,\n appearance,\n mountNode,\n // Slots\n components: {\n content: 'div',\n },\n content: resolveShorthand(content, {\n defaultProps: {\n role: 'tooltip',\n },\n required: true,\n }),\n };\n\n state.content.id = useId('tooltip-', state.content.id);\n\n const positioningOptions = {\n enabled: state.visible,\n arrowPadding: 2 * tooltipBorderRadius,\n position: 'above' as const,\n align: 'center' as const,\n offset: 4,\n ...resolvePositioningShorthand(state.positioning),\n };\n\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeight);\n }\n\n const {\n targetRef,\n containerRef,\n arrowRef,\n }: {\n targetRef: React.MutableRefObject<unknown>;\n containerRef: React.MutableRefObject<HTMLDivElement>;\n arrowRef: React.MutableRefObject<HTMLDivElement>;\n } = usePositioning(positioningOptions);\n\n state.content.ref = useMergedRefs(state.content.ref, containerRef);\n state.arrowRef = arrowRef;\n\n // When this tooltip is visible, hide any other tooltips, and register it\n // as the visibleTooltip with the TooltipContext.\n // Also add a listener on document to hide the tooltip if Escape is pressed\n useIsomorphicLayoutEffect(() => {\n if (visible) {\n const thisTooltip = { hide: () => setVisible(false) };\n\n context.visibleTooltip?.hide();\n context.visibleTooltip = thisTooltip;\n\n const onDocumentKeyDown = (ev: KeyboardEvent) => {\n if (ev.key === Escape) {\n thisTooltip.hide();\n // stop propagation to avoid conflicting with other elements that listen for `Escape`\n // e,g: Dialog, Popover, Menu\n ev.stopPropagation();\n }\n };\n\n targetDocument?.addEventListener('keydown', onDocumentKeyDown, {\n // As this event is added at targeted document,\n // we need to capture the event to be sure keydown handling from tooltip happens first\n capture: true,\n });\n\n return () => {\n if (context.visibleTooltip === thisTooltip) {\n context.visibleTooltip = undefined;\n }\n\n targetDocument?.removeEventListener('keydown', onDocumentKeyDown, { capture: true });\n };\n }\n }, [context, targetDocument, visible, setVisible]);\n\n // The focused element gets a blur event when the document loses focus\n // (e.g. switching tabs in the browser), but we don't want to show the\n // tooltip again when the document gets focus back. Handle this case by\n // checking if the blurred element is still the document's activeElement.\n // See https://github.com/microsoft/fluentui/issues/13541\n const ignoreNextFocusEventRef = React.useRef(false);\n\n // Listener for onPointerEnter and onFocus on the trigger element\n const onEnterTrigger = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n if (ev.type === 'focus' && ignoreNextFocusEventRef.current) {\n ignoreNextFocusEventRef.current = false;\n return;\n }\n\n // Show immediately if another tooltip is already visible\n const delay = context.visibleTooltip ? 0 : state.showDelay;\n\n setDelayTimeout(() => {\n setVisible(true, ev);\n }, delay);\n\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n },\n [setDelayTimeout, setVisible, state.showDelay, context],\n );\n\n // Listener for onPointerLeave and onBlur on the trigger element\n const onLeaveTrigger = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n let delay = state.hideDelay;\n\n if (ev.type === 'blur') {\n // Hide immediately when losing focus\n delay = 0;\n\n ignoreNextFocusEventRef.current = targetDocument?.activeElement === ev.target;\n }\n\n setDelayTimeout(() => {\n setVisible(false, ev);\n }, delay);\n\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n },\n [setDelayTimeout, setVisible, state.hideDelay, targetDocument],\n );\n\n // Cancel the hide timer when the mouse or focus enters the tooltip, and restart it when the mouse or focus leaves.\n // This keeps the tooltip visible when the mouse is moved over it, or it has focus within.\n state.content.onPointerEnter = mergeCallbacks(state.content.onPointerEnter, clearDelayTimeout);\n state.content.onPointerLeave = mergeCallbacks(state.content.onPointerLeave, onLeaveTrigger);\n state.content.onFocus = mergeCallbacks(state.content.onFocus, clearDelayTimeout);\n state.content.onBlur = mergeCallbacks(state.content.onBlur, onLeaveTrigger);\n\n const child = getTriggerChild(children);\n\n const triggerAriaProps: Pick<TooltipChildProps, 'aria-label' | 'aria-labelledby' | 'aria-describedby'> = {};\n\n if (relationship === 'label') {\n // aria-label only works if the content is a string. Otherwise, need to use aria-labelledby.\n if (typeof state.content.children === 'string') {\n triggerAriaProps['aria-label'] = state.content.children;\n } else {\n triggerAriaProps['aria-labelledby'] = state.content.id;\n // Always render the tooltip even if hidden, so that aria-labelledby refers to a valid element\n state.shouldRenderTooltip = true;\n }\n } else if (relationship === 'description') {\n triggerAriaProps['aria-describedby'] = state.content.id;\n // Always render the tooltip even if hidden, so that aria-describedby refers to a valid element\n state.shouldRenderTooltip = true;\n }\n\n // Don't render the Tooltip in SSR to avoid hydration errors\n if (isServerSideRender) {\n state.shouldRenderTooltip = false;\n }\n\n const childTargetRef = useMergedRefs(child?.ref, targetRef);\n\n // Apply the trigger props to the child, either by calling the render function, or cloning with the new props\n state.children = applyTriggerPropsToChildren(children, {\n ...triggerAriaProps,\n ...child?.props,\n // If the target prop is not provided, attach targetRef to the trigger element's ref prop\n ref: positioningOptions.target === undefined ? childTargetRef : child?.ref,\n onPointerEnter: useEventCallback(mergeCallbacks(child?.props?.onPointerEnter, onEnterTrigger)),\n onPointerLeave: useEventCallback(mergeCallbacks(child?.props?.onPointerLeave, onLeaveTrigger)),\n onFocus: useEventCallback(mergeCallbacks(child?.props?.onFocus, onEnterTrigger)),\n onBlur: useEventCallback(mergeCallbacks(child?.props?.onBlur, onLeaveTrigger)),\n });\n\n return state;\n};\n"],"mappings":"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"}
@@ -1,94 +0,0 @@
1
- import { shorthands, __styles, mergeClasses } from '@griffel/react';
2
- import { createArrowStyles } from '@fluentui/react-positioning';
3
- import { tokens } from '@fluentui/react-theme';
4
- import { arrowHeight } from './private/constants';
5
- export const tooltipClassNames = {
6
- content: 'fui-Tooltip__content'
7
- };
8
- /**
9
- * Styles for the tooltip
10
- */
11
- const useStyles = /*#__PURE__*/__styles({
12
- root: {
13
- mc9l5x: "fjseox",
14
- B7ck84d: "f1ewtqcl",
15
- B2u0y6b: "f132xexn",
16
- Bceei9c: "f158kwzp",
17
- Bahqtrf: "fk6fouc",
18
- Be2twd7: "fy9rknc",
19
- Bg96gwp: "fwrc4pm",
20
- Bbmb7ep: ["f1aa9q02", "f16jpd5f"],
21
- Beyfa6y: ["f16jpd5f", "f1aa9q02"],
22
- B7oj6ja: ["f1jar5jt", "fyu767a"],
23
- Btl43ni: ["fyu767a", "f1jar5jt"],
24
- B4j52fo: "f5ogflp",
25
- Bekrc4i: ["f1hqa2wf", "finvdd3"],
26
- Bn0qgzm: "f1f09k3d",
27
- ibv6hh: ["finvdd3", "f1hqa2wf"],
28
- icvyot: "fzkkow9",
29
- vrafjx: ["fcdblym", "fjik90z"],
30
- oivjwe: "fg706s2",
31
- wvpqe5: ["fjik90z", "fcdblym"],
32
- g2u3we: "fghlq4f",
33
- h3c5rm: ["f1gn591s", "fjscplz"],
34
- B9xav0g: "fb073pr",
35
- zhjwy3: ["fjscplz", "f1gn591s"],
36
- z8tnut: "f10ra9hq",
37
- z189sj: ["fd9xhir", "f1jlaasf"],
38
- Byoj8tv: "f1d7kygh",
39
- uwmqm3: ["f1jlaasf", "fd9xhir"],
40
- De3pzq: "fxugw4r",
41
- sj55zd: "f19n0e5",
42
- Bhu2qc9: "fxeb0a7"
43
- },
44
- visible: {
45
- mc9l5x: "ftgm304"
46
- },
47
- inverted: {
48
- De3pzq: "fg3r6xk",
49
- sj55zd: "fonrgv7"
50
- },
51
- arrow: {
52
- qhf8xq: "f1euv43f",
53
- De3pzq: "f1u2r49w",
54
- Bcdw1i0: "fd7fpy0",
55
- Bj3rh1h: "f1bsuimh",
56
- a9b677: "f1ekdpwm",
57
- Bqenvij: "f83vc9z",
58
- Ftih45: "f1wl9k8s",
59
- B1puzpu: "f1wkw4r9",
60
- Brfgrao: "f1j7ml58",
61
- Bcvre1j: "fyl8oag",
62
- Ccq8qp: "frdoeuz",
63
- Baz25je: "fb81m9q",
64
- cmx5o7: "f1ljr5q2",
65
- B4f6apu: "fyfemzf",
66
- m598lv: "focyt6c",
67
- Bk5zm6e: "fnhxbxj",
68
- y0oebl: "fdw6hkg",
69
- qa3bma: "f11yjt3y",
70
- Bqjgrrk: "f1172wan",
71
- Budzafs: ["f9e5op9", "f112wvtl"],
72
- Hv9wc6: ["ftj5xct", "fyavhwi"],
73
- hl6cv3: "f1773hnp",
74
- Bh2vraf: "f1n8855c",
75
- yayu3t: "f1v7783n",
76
- wedwtw: "fsw6im5",
77
- rhl9o9: "fh2hsk5",
78
- Bu8t5uz: "f159pzir",
79
- B6q6orb: "f11yvu4",
80
- Bwwlvwl: "fm1ycve"
81
- }
82
- }, {
83
- d: [".fjseox{display:none;}", ".f1ewtqcl{box-sizing:border-box;}", ".f132xexn{max-width:240px;}", ".f158kwzp{cursor:default;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}", ".f10ra9hq{padding-top:4px;}", ".fd9xhir{padding-right:11px;}", ".f1jlaasf{padding-left:11px;}", ".f1d7kygh{padding-bottom:6px;}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxeb0a7{-webkit-filter:drop-shadow(0 0 2px var(--colorNeutralShadowAmbient)) drop-shadow(0 4px 8px var(--colorNeutralShadowKey));filter:drop-shadow(0 0 2px var(--colorNeutralShadowAmbient)) drop-shadow(0 4px 8px var(--colorNeutralShadowKey));}", ".ftgm304{display:block;}", ".fg3r6xk{background-color:var(--colorNeutralBackgroundStatic);}", ".fonrgv7{color:var(--colorNeutralForegroundStaticInverted);}", ".f1euv43f{position:absolute;}", ".f1u2r49w{background-color:inherit;}", ".fd7fpy0{visibility:hidden;}", ".f1bsuimh{z-index:-1;}", ".f1ekdpwm{width:8.484px;}", ".f83vc9z{height:8.484px;}", ".f1wl9k8s::before{content:\"\";}", ".f1wkw4r9::before{visibility:visible;}", ".f1j7ml58::before{position:absolute;}", ".fyl8oag::before{box-sizing:border-box;}", ".frdoeuz::before{width:inherit;}", ".fb81m9q::before{height:inherit;}", ".f1ljr5q2::before{background-color:inherit;}", ".fyfemzf::before{border-right-width:1px;}", ".focyt6c::before{border-right-style:solid;}", ".fnhxbxj::before{border-right-color:var(--colorTransparentStroke);}", ".fdw6hkg::before{border-bottom-width:1px;}", ".f11yjt3y::before{border-bottom-style:solid;}", ".f1172wan::before{border-bottom-color:var(--colorTransparentStroke);}", ".f9e5op9::before{border-bottom-right-radius:var(--borderRadiusSmall);}", ".f112wvtl::before{border-bottom-left-radius:var(--borderRadiusSmall);}", ".ftj5xct::before{-webkit-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);-moz-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);-ms-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);}", ".fyavhwi::before{-webkit-transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);-moz-transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);-ms-transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);}", "[data-popper-placement^=\"top\"] .f1773hnp{bottom:-1px;}", "[data-popper-placement^=\"top\"] .f1n8855c{--angle:0;}", "[data-popper-placement^=\"right\"] .f1v7783n{left:-1px;}", "[data-popper-placement^=\"right\"] .fsw6im5{--angle:90deg;}", "[data-popper-placement^=\"bottom\"] .fh2hsk5{top:-1px;}", "[data-popper-placement^=\"bottom\"] .f159pzir{--angle:180deg;}", "[data-popper-placement^=\"left\"] .f11yvu4{right:-1px;}", "[data-popper-placement^=\"left\"] .fm1ycve{--angle:270deg;}"]
84
- });
85
- /**
86
- * Apply styling to the Tooltip slots based on the state
87
- */
88
- export const useTooltipStyles_unstable = state => {
89
- const styles = useStyles();
90
- state.content.className = mergeClasses(tooltipClassNames.content, styles.root, state.appearance === 'inverted' && styles.inverted, state.visible && styles.visible, state.content.className);
91
- state.arrowClassName = styles.arrow;
92
- return state;
93
- };
94
- //# sourceMappingURL=useTooltipStyles.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["shorthands","__styles","mergeClasses","createArrowStyles","tokens","arrowHeight","tooltipClassNames","content","useStyles","root","mc9l5x","B7ck84d","B2u0y6b","Bceei9c","Bahqtrf","Be2twd7","Bg96gwp","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","icvyot","vrafjx","oivjwe","wvpqe5","g2u3we","h3c5rm","B9xav0g","zhjwy3","z8tnut","z189sj","Byoj8tv","uwmqm3","De3pzq","sj55zd","Bhu2qc9","visible","inverted","arrow","qhf8xq","Bcdw1i0","Bj3rh1h","a9b677","Bqenvij","Ftih45","B1puzpu","Brfgrao","Bcvre1j","Ccq8qp","Baz25je","cmx5o7","B4f6apu","m598lv","Bk5zm6e","y0oebl","qa3bma","Bqjgrrk","Budzafs","Hv9wc6","hl6cv3","Bh2vraf","yayu3t","wedwtw","rhl9o9","Bu8t5uz","B6q6orb","Bwwlvwl","d","useTooltipStyles_unstable","state","styles","className","appearance","arrowClassName"],"sources":["../../../src/components/Tooltip/useTooltipStyles.ts"],"sourcesContent":["import { shorthands, makeStyles, mergeClasses } from '@griffel/react';\nimport { createArrowStyles } from '@fluentui/react-positioning';\nimport { tokens } from '@fluentui/react-theme';\nimport { arrowHeight } from './private/constants';\nimport type { TooltipSlots, TooltipState } from './Tooltip.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const tooltipClassNames: SlotClassNames<TooltipSlots> = {\n content: 'fui-Tooltip__content',\n};\n\n/**\n * Styles for the tooltip\n */\nconst useStyles = makeStyles({\n root: {\n display: 'none',\n boxSizing: 'border-box',\n maxWidth: '240px',\n cursor: 'default',\n fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase200,\n lineHeight: tokens.lineHeightBase200,\n\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke),\n ...shorthands.padding('4px', '11px', '6px', '11px'), // '5px 12px 7px 12px' minus the border width '1px'\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1,\n\n // TODO need to add versions of tokens.alias.shadow.shadow8, etc. that work with filter\n filter:\n `drop-shadow(0 0 2px ${tokens.colorNeutralShadowAmbient}) ` +\n `drop-shadow(0 4px 8px ${tokens.colorNeutralShadowKey})`,\n },\n\n visible: {\n display: 'block',\n },\n\n inverted: {\n backgroundColor: tokens.colorNeutralBackgroundStatic,\n color: tokens.colorNeutralForegroundStaticInverted,\n },\n\n arrow: createArrowStyles({ arrowHeight }),\n});\n\n/**\n * Apply styling to the Tooltip slots based on the state\n */\nexport const useTooltipStyles_unstable = (state: TooltipState): TooltipState => {\n const styles = useStyles();\n\n state.content.className = mergeClasses(\n tooltipClassNames.content,\n styles.root,\n state.appearance === 'inverted' && styles.inverted,\n state.visible && styles.visible,\n state.content.className,\n );\n\n state.arrowClassName = styles.arrow;\n\n return state;\n};\n"],"mappings":"AAAA,SAASA,UAAU,EAAAC,QAAA,EAAcC,YAAY,QAAQ;AACrD,SAASC,iBAAiB,QAAQ;AAClC,SAASC,MAAM,QAAQ;AACvB,SAASC,WAAW,QAAQ;AAI5B,OAAO,MAAMC,iBAAA,GAAkD;EAC7DC,OAAA,EAAS;AACX;AAEA;;;AAGA,MAAMC,SAAA,gBAAYP,QAAA;EAAAQ,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,OAAA;IAAA9B,MAAA;EAAA;EAAA+B,QAAA;IAAAJ,MAAA;IAAAC,MAAA;EAAA;EAAAI,KAAA;IAAAC,MAAA;IAAAN,MAAA;IAAAO,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,EAgClB;AAEA;;;AAGA,OAAO,MAAMC,yBAAA,GAA6BC,KAAA,IAAsC;EAC9E,MAAMC,MAAA,GAASlE,SAAA;EAEfiE,KAAA,CAAMlE,OAAO,CAACoE,SAAS,GAAGzE,YAAA,CACxBI,iBAAA,CAAkBC,OAAO,EACzBmE,MAAA,CAAOjE,IAAI,EACXgE,KAAA,CAAMG,UAAU,KAAK,cAAcF,MAAA,CAAOjC,QAAQ,EAClDgC,KAAA,CAAMjC,OAAO,IAAIkC,MAAA,CAAOlC,OAAO,EAC/BiC,KAAA,CAAMlE,OAAO,CAACoE,SAAS;EAGzBF,KAAA,CAAMI,cAAc,GAAGH,MAAA,CAAOhC,KAAK;EAEnC,OAAO+B,KAAA;AACT"}
package/lib/index.js DELETED
@@ -1,2 +0,0 @@
1
- export { Tooltip, renderTooltip_unstable, tooltipClassNames, useTooltipStyles_unstable, useTooltip_unstable } from './Tooltip';
2
- //# sourceMappingURL=index.js.map
package/lib/index.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"names":["Tooltip","renderTooltip_unstable","tooltipClassNames","useTooltipStyles_unstable","useTooltip_unstable"],"sources":["../src/index.ts"],"sourcesContent":["export {\n Tooltip,\n renderTooltip_unstable,\n tooltipClassNames,\n useTooltipStyles_unstable,\n useTooltip_unstable,\n} from './Tooltip';\nexport type {\n OnVisibleChangeData,\n TooltipProps,\n TooltipSlots,\n TooltipState,\n TooltipChildProps as TooltipTriggerProps,\n} from './Tooltip';\n"],"mappings":"AAAA,SACEA,OAAO,EACPC,sBAAsB,EACtBC,iBAAiB,EACjBC,yBAAyB,EACzBC,mBAAmB,QACd"}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../lib/components/Tooltip/useTooltipStyles.js"],"sourcesContent":["import { shorthands, __styles, mergeClasses } from '@griffel/react';\nimport { createArrowStyles } from '@fluentui/react-positioning';\nimport { tokens } from '@fluentui/react-theme';\nimport { arrowHeight } from './private/constants';\nexport const tooltipClassNames = {\n content: 'fui-Tooltip__content'\n};\n/**\n * Styles for the tooltip\n */\nconst useStyles = /*#__PURE__*/__styles({\n root: {\n mc9l5x: \"fjseox\",\n B7ck84d: \"f1ewtqcl\",\n B2u0y6b: \"f132xexn\",\n Bceei9c: \"f158kwzp\",\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fy9rknc\",\n Bg96gwp: \"fwrc4pm\",\n Bbmb7ep: [\"f1aa9q02\", \"f16jpd5f\"],\n Beyfa6y: [\"f16jpd5f\", \"f1aa9q02\"],\n B7oj6ja: [\"f1jar5jt\", \"fyu767a\"],\n Btl43ni: [\"fyu767a\", \"f1jar5jt\"],\n B4j52fo: \"f5ogflp\",\n Bekrc4i: [\"f1hqa2wf\", \"finvdd3\"],\n Bn0qgzm: \"f1f09k3d\",\n ibv6hh: [\"finvdd3\", \"f1hqa2wf\"],\n icvyot: \"fzkkow9\",\n vrafjx: [\"fcdblym\", \"fjik90z\"],\n oivjwe: \"fg706s2\",\n wvpqe5: [\"fjik90z\", \"fcdblym\"],\n g2u3we: \"fghlq4f\",\n h3c5rm: [\"f1gn591s\", \"fjscplz\"],\n B9xav0g: \"fb073pr\",\n zhjwy3: [\"fjscplz\", \"f1gn591s\"],\n z8tnut: \"f10ra9hq\",\n z189sj: [\"fd9xhir\", \"f1jlaasf\"],\n Byoj8tv: \"f1d7kygh\",\n uwmqm3: [\"f1jlaasf\", \"fd9xhir\"],\n De3pzq: \"fxugw4r\",\n sj55zd: \"f19n0e5\",\n Bhu2qc9: \"fxeb0a7\"\n },\n visible: {\n mc9l5x: \"ftgm304\"\n },\n inverted: {\n De3pzq: \"fg3r6xk\",\n sj55zd: \"fonrgv7\"\n },\n arrow: {\n qhf8xq: \"f1euv43f\",\n De3pzq: \"f1u2r49w\",\n Bcdw1i0: \"fd7fpy0\",\n Bj3rh1h: \"f1bsuimh\",\n a9b677: \"f1ekdpwm\",\n Bqenvij: \"f83vc9z\",\n Ftih45: \"f1wl9k8s\",\n B1puzpu: \"f1wkw4r9\",\n Brfgrao: \"f1j7ml58\",\n Bcvre1j: \"fyl8oag\",\n Ccq8qp: \"frdoeuz\",\n Baz25je: \"fb81m9q\",\n cmx5o7: \"f1ljr5q2\",\n B4f6apu: \"fyfemzf\",\n m598lv: \"focyt6c\",\n Bk5zm6e: \"fnhxbxj\",\n y0oebl: \"fdw6hkg\",\n qa3bma: \"f11yjt3y\",\n Bqjgrrk: \"f1172wan\",\n Budzafs: [\"f9e5op9\", \"f112wvtl\"],\n Hv9wc6: [\"ftj5xct\", \"fyavhwi\"],\n hl6cv3: \"f1773hnp\",\n Bh2vraf: \"f1n8855c\",\n yayu3t: \"f1v7783n\",\n wedwtw: \"fsw6im5\",\n rhl9o9: \"fh2hsk5\",\n Bu8t5uz: \"f159pzir\",\n B6q6orb: \"f11yvu4\",\n Bwwlvwl: \"fm1ycve\"\n }\n}, {\n d: [\".fjseox{display:none;}\", \".f1ewtqcl{box-sizing:border-box;}\", \".f132xexn{max-width:240px;}\", \".f158kwzp{cursor:default;}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".fwrc4pm{line-height:var(--lineHeightBase200);}\", \".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}\", \".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}\", \".f5ogflp{border-top-width:1px;}\", \".f1hqa2wf{border-right-width:1px;}\", \".finvdd3{border-left-width:1px;}\", \".f1f09k3d{border-bottom-width:1px;}\", \".fzkkow9{border-top-style:solid;}\", \".fcdblym{border-right-style:solid;}\", \".fjik90z{border-left-style:solid;}\", \".fg706s2{border-bottom-style:solid;}\", \".fghlq4f{border-top-color:var(--colorTransparentStroke);}\", \".f1gn591s{border-right-color:var(--colorTransparentStroke);}\", \".fjscplz{border-left-color:var(--colorTransparentStroke);}\", \".fb073pr{border-bottom-color:var(--colorTransparentStroke);}\", \".f10ra9hq{padding-top:4px;}\", \".fd9xhir{padding-right:11px;}\", \".f1jlaasf{padding-left:11px;}\", \".f1d7kygh{padding-bottom:6px;}\", \".fxugw4r{background-color:var(--colorNeutralBackground1);}\", \".f19n0e5{color:var(--colorNeutralForeground1);}\", \".fxeb0a7{-webkit-filter:drop-shadow(0 0 2px var(--colorNeutralShadowAmbient)) drop-shadow(0 4px 8px var(--colorNeutralShadowKey));filter:drop-shadow(0 0 2px var(--colorNeutralShadowAmbient)) drop-shadow(0 4px 8px var(--colorNeutralShadowKey));}\", \".ftgm304{display:block;}\", \".fg3r6xk{background-color:var(--colorNeutralBackgroundStatic);}\", \".fonrgv7{color:var(--colorNeutralForegroundStaticInverted);}\", \".f1euv43f{position:absolute;}\", \".f1u2r49w{background-color:inherit;}\", \".fd7fpy0{visibility:hidden;}\", \".f1bsuimh{z-index:-1;}\", \".f1ekdpwm{width:8.484px;}\", \".f83vc9z{height:8.484px;}\", \".f1wl9k8s::before{content:\\\"\\\";}\", \".f1wkw4r9::before{visibility:visible;}\", \".f1j7ml58::before{position:absolute;}\", \".fyl8oag::before{box-sizing:border-box;}\", \".frdoeuz::before{width:inherit;}\", \".fb81m9q::before{height:inherit;}\", \".f1ljr5q2::before{background-color:inherit;}\", \".fyfemzf::before{border-right-width:1px;}\", \".focyt6c::before{border-right-style:solid;}\", \".fnhxbxj::before{border-right-color:var(--colorTransparentStroke);}\", \".fdw6hkg::before{border-bottom-width:1px;}\", \".f11yjt3y::before{border-bottom-style:solid;}\", \".f1172wan::before{border-bottom-color:var(--colorTransparentStroke);}\", \".f9e5op9::before{border-bottom-right-radius:var(--borderRadiusSmall);}\", \".f112wvtl::before{border-bottom-left-radius:var(--borderRadiusSmall);}\", \".ftj5xct::before{-webkit-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);-moz-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);-ms-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);}\", \".fyavhwi::before{-webkit-transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);-moz-transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);-ms-transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);transform:rotate(var(--angle)) translate(0, 50%) rotate(-45deg);}\", \"[data-popper-placement^=\\\"top\\\"] .f1773hnp{bottom:-1px;}\", \"[data-popper-placement^=\\\"top\\\"] .f1n8855c{--angle:0;}\", \"[data-popper-placement^=\\\"right\\\"] .f1v7783n{left:-1px;}\", \"[data-popper-placement^=\\\"right\\\"] .fsw6im5{--angle:90deg;}\", \"[data-popper-placement^=\\\"bottom\\\"] .fh2hsk5{top:-1px;}\", \"[data-popper-placement^=\\\"bottom\\\"] .f159pzir{--angle:180deg;}\", \"[data-popper-placement^=\\\"left\\\"] .f11yvu4{right:-1px;}\", \"[data-popper-placement^=\\\"left\\\"] .fm1ycve{--angle:270deg;}\"]\n});\n/**\n * Apply styling to the Tooltip slots based on the state\n */\nexport const useTooltipStyles_unstable = state => {\n const styles = useStyles();\n state.content.className = mergeClasses(tooltipClassNames.content, styles.root, state.appearance === 'inverted' && styles.inverted, state.visible && styles.visible, state.content.className);\n state.arrowClassName = styles.arrow;\n return state;\n};\n//# sourceMappingURL=useTooltipStyles.js.map"],"names":["tooltipClassNames","useTooltipStyles_unstable","content","useStyles","__styles","root","mc9l5x","B7ck84d","B2u0y6b","Bceei9c","Bahqtrf","Be2twd7","Bg96gwp","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","icvyot","vrafjx","oivjwe","wvpqe5","g2u3we","h3c5rm","B9xav0g","zhjwy3","z8tnut","z189sj","Byoj8tv","uwmqm3","De3pzq","sj55zd","Bhu2qc9","visible","inverted","arrow","qhf8xq","Bcdw1i0","Bj3rh1h","a9b677","Bqenvij","Ftih45","B1puzpu","Brfgrao","Bcvre1j","Ccq8qp","Baz25je","cmx5o7","B4f6apu","m598lv","Bk5zm6e","y0oebl","qa3bma","Bqjgrrk","Budzafs","Hv9wc6","hl6cv3","Bh2vraf","yayu3t","wedwtw","rhl9o9","Bu8t5uz","B6q6orb","Bwwlvwl","d","state","styles","className","mergeClasses","appearance","arrowClassName"],"mappings":";;;;;;;;;;;IAIaA,iBAAiB,MAAjBA;IAmFAC,yBAAyB,MAAzBA;;uBAvFsC;AAI5C,MAAMD,oBAAoB;IAC/BE,SAAS;AACX;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCC,MAAM;QACJC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;YAAC;YAAY;SAAW;QACjCC,SAAS;YAAC;YAAY;SAAW;QACjCC,SAAS;YAAC;YAAY;SAAU;QAChCC,SAAS;YAAC;YAAW;SAAW;QAChCC,SAAS;QACTC,SAAS;YAAC;YAAY;SAAU;QAChCC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,QAAQ;QACRC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,QAAQ;QACRC,QAAQ;QACRC,SAAS;IACX;IACAC,SAAS;QACP9B,QAAQ;IACV;IACA+B,UAAU;QACRJ,QAAQ;QACRC,QAAQ;IACV;IACAI,OAAO;QACLC,QAAQ;QACRN,QAAQ;QACRO,SAAS;QACTC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,SAAS;YAAC;YAAW;SAAW;QAChCC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;QAA0B;QAAqC;QAA+B;QAA8B;QAAgD;QAA+C;QAAmD;QAAoE;QAAmE;QAAiE;QAA+D;QAAmC;QAAsC;QAAoC;QAAuC;QAAqC;QAAuC;QAAsC;QAAwC;QAA6D;QAAgE;QAA8D;QAAgE;QAA+B;QAAiC;QAAiC;QAAkC;QAA8D;QAAmD;QAAwP;QAA4B;QAAmE;QAAgE;QAAiC;QAAwC;QAAgC;QAA0B;QAA6B;QAA6B;QAAoC;QAA0C;QAAyC;QAA4C;QAAoC;QAAqC;QAAgD;QAA6C;QAA+C;QAAuE;QAA8C;QAAiD;QAAyE;QAA0E;QAA0E;QAAmS;QAAuS;QAA4D;QAA0D;QAA4D;QAA+D;QAA2D;QAAkE;QAA2D;KAA8D;AACxrH;AAIO,MAAMlE,4BAA4BmE,CAAAA,QAAS;IAChD,MAAMC,SAASlE;IACfiE,MAAMlE,OAAO,CAACoE,SAAS,GAAGC,IAAAA,mBAAY,EAACvE,kBAAkBE,OAAO,EAAEmE,OAAOhE,IAAI,EAAE+D,MAAMI,UAAU,KAAK,cAAcH,OAAOhC,QAAQ,EAAE+B,MAAMhC,OAAO,IAAIiC,OAAOjC,OAAO,EAAEgC,MAAMlE,OAAO,CAACoE,SAAS;IAC3LF,MAAMK,cAAc,GAAGJ,OAAO/B,KAAK;IACnC,OAAO8B;AACT,GACA,4CAA4C"}