@fluentui/react-utilities 9.3.0 → 9.4.0

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 (143) hide show
  1. package/CHANGELOG.json +45 -1
  2. package/CHANGELOG.md +20 -2
  3. package/dist/index.d.ts +18 -2
  4. package/lib/compose/getSlots.js +0 -8
  5. package/lib/compose/getSlots.js.map +1 -1
  6. package/lib/compose/isResolvedShorthand.js +0 -1
  7. package/lib/compose/isResolvedShorthand.js.map +1 -1
  8. package/lib/compose/resolveShorthand.js +2 -6
  9. package/lib/compose/resolveShorthand.js.map +1 -1
  10. package/lib/hooks/index.js +1 -0
  11. package/lib/hooks/index.js.map +1 -1
  12. package/lib/hooks/useControllableState.js +6 -12
  13. package/lib/hooks/useControllableState.js.map +1 -1
  14. package/lib/hooks/useEventCallback.js +0 -1
  15. package/lib/hooks/useEventCallback.js.map +1 -1
  16. package/lib/hooks/useFirstMount.js +0 -3
  17. package/lib/hooks/useFirstMount.js.map +1 -1
  18. package/lib/hooks/useForceUpdate.js +0 -1
  19. package/lib/hooks/useForceUpdate.js.map +1 -1
  20. package/lib/hooks/useId.js +0 -3
  21. package/lib/hooks/useId.js.map +1 -1
  22. package/lib/hooks/useIsomorphicLayoutEffect.js +0 -1
  23. package/lib/hooks/useIsomorphicLayoutEffect.js.map +1 -1
  24. package/lib/hooks/useMergedRefs.js +2 -3
  25. package/lib/hooks/useMergedRefs.js.map +1 -1
  26. package/lib/hooks/useOnClickOutside.js +8 -26
  27. package/lib/hooks/useOnClickOutside.js.map +1 -1
  28. package/lib/hooks/useOnScrollOutside.js +0 -4
  29. package/lib/hooks/useOnScrollOutside.js.map +1 -1
  30. package/lib/hooks/usePrevious.js +0 -1
  31. package/lib/hooks/usePrevious.js.map +1 -1
  32. package/lib/hooks/useScrollbarWidth.js +30 -0
  33. package/lib/hooks/useScrollbarWidth.js.map +1 -0
  34. package/lib/hooks/useTimeout.js +2 -3
  35. package/lib/hooks/useTimeout.js.map +1 -1
  36. package/lib/index.js +1 -1
  37. package/lib/index.js.map +1 -1
  38. package/lib/ssr/SSRContext.js +4 -11
  39. package/lib/ssr/SSRContext.js.map +1 -1
  40. package/lib/ssr/canUseDOM.js +2 -1
  41. package/lib/ssr/canUseDOM.js.map +1 -1
  42. package/lib/trigger/applyTriggerPropsToChildren.js +2 -6
  43. package/lib/trigger/applyTriggerPropsToChildren.js.map +1 -1
  44. package/lib/trigger/getTriggerChild.js +2 -3
  45. package/lib/trigger/getTriggerChild.js.map +1 -1
  46. package/lib/trigger/isFluentTrigger.js.map +1 -1
  47. package/lib/utils/getNativeElementProps.js +0 -2
  48. package/lib/utils/getNativeElementProps.js.map +1 -1
  49. package/lib/utils/getRTLSafeKey.js +0 -2
  50. package/lib/utils/getRTLSafeKey.js.map +1 -1
  51. package/lib/utils/getReactCallbackName.js +0 -3
  52. package/lib/utils/getReactCallbackName.js.map +1 -1
  53. package/lib/utils/isHTMLElement.js +2 -2
  54. package/lib/utils/isHTMLElement.js.map +1 -1
  55. package/lib/utils/isInteractiveHTMLElement.js +0 -4
  56. package/lib/utils/isInteractiveHTMLElement.js.map +1 -1
  57. package/lib/utils/mergeCallbacks.js.map +1 -1
  58. package/lib/utils/omit.js +0 -2
  59. package/lib/utils/omit.js.map +1 -1
  60. package/lib/utils/properties.js +7 -36
  61. package/lib/utils/properties.js.map +1 -1
  62. package/lib-amd/hooks/index.js +2 -1
  63. package/lib-amd/hooks/index.js.map +1 -1
  64. package/lib-amd/hooks/useScrollbarWidth.js +32 -0
  65. package/lib-amd/hooks/useScrollbarWidth.js.map +1 -0
  66. package/lib-amd/index.js +2 -1
  67. package/lib-amd/index.js.map +1 -1
  68. package/lib-amd/utils/isHTMLElement.js +4 -3
  69. package/lib-amd/utils/isHTMLElement.js.map +1 -1
  70. package/lib-amd/utils/isInteractiveHTMLElement.js.map +1 -1
  71. package/lib-commonjs/compose/getSlots.js +0 -12
  72. package/lib-commonjs/compose/getSlots.js.map +1 -1
  73. package/lib-commonjs/compose/index.js +0 -5
  74. package/lib-commonjs/compose/index.js.map +1 -1
  75. package/lib-commonjs/compose/isResolvedShorthand.js +0 -4
  76. package/lib-commonjs/compose/isResolvedShorthand.js.map +1 -1
  77. package/lib-commonjs/compose/resolveShorthand.js +2 -9
  78. package/lib-commonjs/compose/resolveShorthand.js.map +1 -1
  79. package/lib-commonjs/compose/types.js.map +1 -1
  80. package/lib-commonjs/hooks/index.js +1 -12
  81. package/lib-commonjs/hooks/index.js.map +1 -1
  82. package/lib-commonjs/hooks/useControllableState.js +6 -14
  83. package/lib-commonjs/hooks/useControllableState.js.map +1 -1
  84. package/lib-commonjs/hooks/useEventCallback.js +0 -5
  85. package/lib-commonjs/hooks/useEventCallback.js.map +1 -1
  86. package/lib-commonjs/hooks/useFirstMount.js +0 -6
  87. package/lib-commonjs/hooks/useFirstMount.js.map +1 -1
  88. package/lib-commonjs/hooks/useForceUpdate.js +0 -4
  89. package/lib-commonjs/hooks/useForceUpdate.js.map +1 -1
  90. package/lib-commonjs/hooks/useId.js +0 -8
  91. package/lib-commonjs/hooks/useId.js.map +1 -1
  92. package/lib-commonjs/hooks/useIsomorphicLayoutEffect.js +0 -4
  93. package/lib-commonjs/hooks/useIsomorphicLayoutEffect.js.map +1 -1
  94. package/lib-commonjs/hooks/useMergedRefs.js +2 -6
  95. package/lib-commonjs/hooks/useMergedRefs.js.map +1 -1
  96. package/lib-commonjs/hooks/useOnClickOutside.js +8 -30
  97. package/lib-commonjs/hooks/useOnClickOutside.js.map +1 -1
  98. package/lib-commonjs/hooks/useOnScrollOutside.js +0 -8
  99. package/lib-commonjs/hooks/useOnScrollOutside.js.map +1 -1
  100. package/lib-commonjs/hooks/usePrevious.js +0 -4
  101. package/lib-commonjs/hooks/usePrevious.js.map +1 -1
  102. package/lib-commonjs/hooks/useScrollbarWidth.js +37 -0
  103. package/lib-commonjs/hooks/useScrollbarWidth.js.map +1 -0
  104. package/lib-commonjs/hooks/useTimeout.js +2 -6
  105. package/lib-commonjs/hooks/useTimeout.js.map +1 -1
  106. package/lib-commonjs/index.js +7 -11
  107. package/lib-commonjs/index.js.map +1 -1
  108. package/lib-commonjs/ssr/SSRContext.js +4 -17
  109. package/lib-commonjs/ssr/SSRContext.js.map +1 -1
  110. package/lib-commonjs/ssr/canUseDOM.js +2 -3
  111. package/lib-commonjs/ssr/canUseDOM.js.map +1 -1
  112. package/lib-commonjs/ssr/index.js +0 -3
  113. package/lib-commonjs/ssr/index.js.map +1 -1
  114. package/lib-commonjs/trigger/applyTriggerPropsToChildren.js +2 -10
  115. package/lib-commonjs/trigger/applyTriggerPropsToChildren.js.map +1 -1
  116. package/lib-commonjs/trigger/getTriggerChild.js +2 -7
  117. package/lib-commonjs/trigger/getTriggerChild.js.map +1 -1
  118. package/lib-commonjs/trigger/index.js +0 -5
  119. package/lib-commonjs/trigger/index.js.map +1 -1
  120. package/lib-commonjs/trigger/isFluentTrigger.js +0 -2
  121. package/lib-commonjs/trigger/isFluentTrigger.js.map +1 -1
  122. package/lib-commonjs/trigger/types.js.map +1 -1
  123. package/lib-commonjs/utils/clamp.js +0 -2
  124. package/lib-commonjs/utils/clamp.js.map +1 -1
  125. package/lib-commonjs/utils/getNativeElementProps.js +0 -6
  126. package/lib-commonjs/utils/getNativeElementProps.js.map +1 -1
  127. package/lib-commonjs/utils/getRTLSafeKey.js +0 -4
  128. package/lib-commonjs/utils/getRTLSafeKey.js.map +1 -1
  129. package/lib-commonjs/utils/getReactCallbackName.js +0 -5
  130. package/lib-commonjs/utils/getReactCallbackName.js.map +1 -1
  131. package/lib-commonjs/utils/index.js +0 -9
  132. package/lib-commonjs/utils/index.js.map +1 -1
  133. package/lib-commonjs/utils/isHTMLElement.js +2 -4
  134. package/lib-commonjs/utils/isHTMLElement.js.map +1 -1
  135. package/lib-commonjs/utils/isInteractiveHTMLElement.js +0 -7
  136. package/lib-commonjs/utils/isInteractiveHTMLElement.js.map +1 -1
  137. package/lib-commonjs/utils/mergeCallbacks.js +0 -2
  138. package/lib-commonjs/utils/mergeCallbacks.js.map +1 -1
  139. package/lib-commonjs/utils/omit.js +0 -4
  140. package/lib-commonjs/utils/omit.js.map +1 -1
  141. package/lib-commonjs/utils/properties.js +7 -38
  142. package/lib-commonjs/utils/properties.js.map +1 -1
  143. package/package.json +2 -2
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.useMergedRefs = void 0;
7
-
8
7
  const React = /*#__PURE__*/require("react");
9
8
  /**
10
9
  * React hook to merge multiple React refs (either MutableRefObjects or ref callbacks) into a single ref callback that
@@ -12,13 +11,10 @@ const React = /*#__PURE__*/require("react");
12
11
  * @param refs - Refs to collectively update with one ref value.
13
12
  * @returns A function with an attached "current" prop, so that it can be treated like a RefObject.
14
13
  */
15
-
16
-
17
14
  function useMergedRefs(...refs) {
18
15
  const mergedCallback = React.useCallback(value => {
19
16
  // Update the "current" prop hanging on the function.
20
17
  mergedCallback.current = value;
21
-
22
18
  for (const ref of refs) {
23
19
  if (typeof ref === 'function') {
24
20
  ref(value);
@@ -27,10 +23,10 @@ function useMergedRefs(...refs) {
27
23
  ref.current = value;
28
24
  }
29
25
  }
30
- }, // eslint-disable-next-line react-hooks/exhaustive-deps -- already exhaustive
26
+ },
27
+ // eslint-disable-next-line react-hooks/exhaustive-deps -- already exhaustive
31
28
  [...refs]);
32
29
  return mergedCallback;
33
30
  }
34
-
35
31
  exports.useMergedRefs = useMergedRefs;
36
32
  //# sourceMappingURL=useMergedRefs.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-utilities/src/hooks/useMergedRefs.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;AAQA;;;;;AAKG;;;AACH,SAAgB,aAAhB,CAAiC,GAAG,IAApC,EAAsE;EACpE,MAAM,cAAc,GAA0B,KAAK,CAAC,WAAN,CAC3C,KAAD,IAAa;IACX;IACE,cAAwD,CAAC,OAAzD,GAAmE,KAAnE;;IAEF,KAAK,MAAM,GAAX,IAAkB,IAAlB,EAAwB;MACtB,IAAI,OAAO,GAAP,KAAe,UAAnB,EAA+B;QAC7B,GAAG,CAAC,KAAD,CAAH;MACD,CAFD,MAEO,IAAI,GAAJ,EAAS;QACd;QACE,GAA6C,CAAC,OAA9C,GAAwD,KAAxD;MACH;IACF;EACF,CAb2C,EAc5C;EACA,CAAC,GAAG,IAAJ,CAf4C,CAA9C;EAkBA,OAAO,cAAP;AACD;;AApBD,OAAA,CAAA,aAAA,GAAA,aAAA","sourcesContent":["import * as React from 'react';\n\n/**\n * A Ref function which can be treated like a ref object in that it has an attached\n * current property, which will be updated as the ref is evaluated.\n */\nexport type RefObjectFunction<T> = React.RefObject<T> & ((value: T) => void);\n\n/**\n * React hook to merge multiple React refs (either MutableRefObjects or ref callbacks) into a single ref callback that\n * updates all provided refs\n * @param refs - Refs to collectively update with one ref value.\n * @returns A function with an attached \"current\" prop, so that it can be treated like a RefObject.\n */\nexport function useMergedRefs<T>(...refs: (React.Ref<T> | undefined)[]): RefObjectFunction<T> {\n const mergedCallback: RefObjectFunction<T> = (React.useCallback(\n (value: T) => {\n // Update the \"current\" prop hanging on the function.\n ((mergedCallback as unknown) as React.MutableRefObject<T>).current = value;\n\n for (const ref of refs) {\n if (typeof ref === 'function') {\n ref(value);\n } else if (ref) {\n // work around the immutability of the React.Ref type\n ((ref as unknown) as React.MutableRefObject<T>).current = value;\n }\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps -- already exhaustive\n [...refs],\n ) as unknown) as RefObjectFunction<T>;\n\n return mergedCallback;\n}\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":";;;;;;AAAA;AAQA;;;;;;AAMA,SAAgBA,aAAa,CAAI,GAAGC,IAAkC;EACpE,MAAMC,cAAc,GAA0BC,KAAK,CAACC,WAAW,CAC5DC,KAAQ,IAAI;IACX;IACEH,cAAwD,CAACI,OAAO,GAAGD,KAAK;IAE1E,KAAK,MAAME,GAAG,IAAIN,IAAI,EAAE;MACtB,IAAI,OAAOM,GAAG,KAAK,UAAU,EAAE;QAC7BA,GAAG,CAACF,KAAK,CAAC;OACX,MAAM,IAAIE,GAAG,EAAE;QACd;QACEA,GAA6C,CAACD,OAAO,GAAGD,KAAK;;;EAGrE,CAAC;EACD;EACA,CAAC,GAAGJ,IAAI,CAAC,CAC0B;EAErC,OAAOC,cAAc;AACvB;AApBAM","names":["useMergedRefs","refs","mergedCallback","React","useCallback","value","current","ref","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-utilities/src/hooks/useMergedRefs.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * A Ref function which can be treated like a ref object in that it has an attached\n * current property, which will be updated as the ref is evaluated.\n */\nexport type RefObjectFunction<T> = React.RefObject<T> & ((value: T) => void);\n\n/**\n * React hook to merge multiple React refs (either MutableRefObjects or ref callbacks) into a single ref callback that\n * updates all provided refs\n * @param refs - Refs to collectively update with one ref value.\n * @returns A function with an attached \"current\" prop, so that it can be treated like a RefObject.\n */\nexport function useMergedRefs<T>(...refs: (React.Ref<T> | undefined)[]): RefObjectFunction<T> {\n const mergedCallback: RefObjectFunction<T> = (React.useCallback(\n (value: T) => {\n // Update the \"current\" prop hanging on the function.\n ((mergedCallback as unknown) as React.MutableRefObject<T>).current = value;\n\n for (const ref of refs) {\n if (typeof ref === 'function') {\n ref(value);\n } else if (ref) {\n // work around the immutability of the React.Ref type\n ((ref as unknown) as React.MutableRefObject<T>).current = value;\n }\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps -- already exhaustive\n [...refs],\n ) as unknown) as RefObjectFunction<T>;\n\n return mergedCallback;\n}\n"]}
@@ -4,16 +4,12 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.useOnClickOutside = void 0;
7
-
8
7
  const React = /*#__PURE__*/require("react");
9
-
10
8
  const useEventCallback_1 = /*#__PURE__*/require("./useEventCallback");
11
9
  /**
12
10
  * @internal
13
11
  * Utility to perform checks where a click/touch event was made outside a component
14
12
  */
15
-
16
-
17
13
  const useOnClickOutside = options => {
18
14
  const {
19
15
  refs,
@@ -26,9 +22,7 @@ const useOnClickOutside = options => {
26
22
  useIFrameFocus(!disabled, element, callback);
27
23
  const listener = useEventCallback_1.useEventCallback(ev => {
28
24
  const contains = containsProp || ((parent, child) => !!(parent === null || parent === void 0 ? void 0 : parent.contains(child)));
29
-
30
25
  const isOutside = refs.every(ref => !contains(ref.current || null, ev.target));
31
-
32
26
  if (isOutside && !disabled) {
33
27
  callback(ev);
34
28
  }
@@ -38,25 +32,21 @@ const useOnClickOutside = options => {
38
32
  // Note this depends on a deprecated but extremely well supported quirk of the web platform
39
33
  // https://github.com/facebook/react/issues/20074
40
34
  let currentEvent = getWindowEvent(window);
41
-
42
35
  const conditionalHandler = event => {
43
36
  // Skip if this event is the same as the one running when we added the handlers
44
37
  if (event === currentEvent) {
45
38
  currentEvent = undefined;
46
39
  return;
47
40
  }
48
-
49
41
  listener(event);
50
42
  };
51
-
52
43
  if (!disabled) {
53
44
  // use capture phase because React can update DOM before the event bubbles to the document
54
45
  element === null || element === void 0 ? void 0 : element.addEventListener('click', conditionalHandler, true);
55
46
  element === null || element === void 0 ? void 0 : element.addEventListener('touchstart', conditionalHandler, true);
56
47
  element === null || element === void 0 ? void 0 : element.addEventListener('contextmenu', conditionalHandler, true);
57
- } // Garbage collect this event after it's no longer useful to avoid memory leaks
58
-
59
-
48
+ }
49
+ // Garbage collect this event after it's no longer useful to avoid memory leaks
60
50
  timeoutId.current = window.setTimeout(() => {
61
51
  currentEvent = undefined;
62
52
  }, 1);
@@ -69,25 +59,19 @@ const useOnClickOutside = options => {
69
59
  };
70
60
  }, [listener, element, disabled]);
71
61
  };
72
-
73
62
  exports.useOnClickOutside = useOnClickOutside;
74
-
75
63
  const getWindowEvent = target => {
76
64
  var _a, _b, _c;
77
-
78
65
  if (target) {
79
66
  if (typeof target.window === 'object' && target.window === target) {
80
67
  // eslint-disable-next-line deprecation/deprecation
81
68
  return target.event;
82
- } // eslint-disable-next-line deprecation/deprecation
83
-
84
-
69
+ }
70
+ // eslint-disable-next-line deprecation/deprecation
85
71
  return (_c = (_b = (_a = target.ownerDocument) === null || _a === void 0 ? void 0 : _a.defaultView) === null || _b === void 0 ? void 0 : _b.event) !== null && _c !== void 0 ? _c : undefined;
86
72
  }
87
-
88
73
  return undefined;
89
74
  };
90
-
91
75
  const FUI_FRAME_EVENT = 'fuiframefocus';
92
76
  /**
93
77
  * Since click events do not propagate past iframes, we use focus to detect if a
@@ -103,32 +87,28 @@ const FUI_FRAME_EVENT = 'fuiframefocus';
103
87
  * @param targetDocument - the document to dispatch events and set timeouts
104
88
  * @param pollDuration - in milliseconds
105
89
  */
106
-
107
90
  const useIFrameFocus = (enableFrameFocusDispatch, targetDocument, callback, pollDuration = 1000) => {
108
91
  const timeoutRef = React.useRef();
109
92
  const listener = useEventCallback_1.useEventCallback(e => {
110
93
  if (callback) {
111
94
  callback(e);
112
95
  }
113
- }); // Adds listener to the custom iframe focus event
114
-
96
+ });
97
+ // Adds listener to the custom iframe focus event
115
98
  React.useEffect(() => {
116
99
  if (enableFrameFocusDispatch) {
117
100
  targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener(FUI_FRAME_EVENT, listener, true);
118
101
  }
119
-
120
102
  return () => {
121
103
  targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener(FUI_FRAME_EVENT, listener, true);
122
104
  };
123
- }, [targetDocument, enableFrameFocusDispatch, listener]); // Starts polling for the active element
124
-
105
+ }, [targetDocument, enableFrameFocusDispatch, listener]);
106
+ // Starts polling for the active element
125
107
  React.useEffect(() => {
126
108
  var _a;
127
-
128
109
  if (enableFrameFocusDispatch) {
129
110
  timeoutRef.current = (_a = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) === null || _a === void 0 ? void 0 : _a.setInterval(() => {
130
111
  const activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement;
131
-
132
112
  if ((activeElement === null || activeElement === void 0 ? void 0 : activeElement.tagName) === 'IFRAME' || (activeElement === null || activeElement === void 0 ? void 0 : activeElement.tagName) === 'WEBVIEW') {
133
113
  const event = new CustomEvent(FUI_FRAME_EVENT, {
134
114
  bubbles: true
@@ -137,10 +117,8 @@ const useIFrameFocus = (enableFrameFocusDispatch, targetDocument, callback, poll
137
117
  }
138
118
  }, pollDuration);
139
119
  }
140
-
141
120
  return () => {
142
121
  var _a;
143
-
144
122
  (_a = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) === null || _a === void 0 ? void 0 : _a.clearTimeout(timeoutRef.current);
145
123
  };
146
124
  }, [targetDocument, enableFrameFocusDispatch, pollDuration]);
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-utilities/src/hooks/useOnClickOutside.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useEventCallback } from './useEventCallback';\n\n/**\n * @internal\n */\nexport type UseOnClickOrScrollOutsideOptions = {\n /**\n * The element to listen for the click event\n */\n element: Document | undefined;\n /**\n * Refs to elements that check if the click is outside\n */\n refs: React.MutableRefObject<HTMLElement | undefined | null>[];\n\n /**\n * By default uses element.contains, but custom contain function can be provided\n * @param parentRef - provided parent ref\n * @param child - event target element\n */\n contains?(parent: HTMLElement | null, child: HTMLElement): boolean;\n\n /**\n * Disables event listeners\n */\n disabled?: boolean;\n\n /**\n * Called if the click is outside the element refs\n */\n callback: (ev: MouseEvent | TouchEvent) => void;\n};\n\n/**\n * @internal\n * Utility to perform checks where a click/touch event was made outside a component\n */\nexport const useOnClickOutside = (options: UseOnClickOrScrollOutsideOptions) => {\n const { refs, callback, element, disabled, contains: containsProp } = options;\n const timeoutId = React.useRef<number | undefined>(undefined);\n useIFrameFocus(!disabled, element, callback as (e: Event) => void);\n\n const listener = useEventCallback((ev: MouseEvent | TouchEvent) => {\n const contains: UseOnClickOrScrollOutsideOptions['contains'] =\n containsProp || ((parent, child) => !!parent?.contains(child));\n\n const isOutside = refs.every(ref => !contains(ref.current || null, ev.target as HTMLElement));\n if (isOutside && !disabled) {\n callback(ev);\n }\n });\n\n React.useEffect(() => {\n // Store the current event to avoid triggering handlers immediately\n // Note this depends on a deprecated but extremely well supported quirk of the web platform\n // https://github.com/facebook/react/issues/20074\n let currentEvent = getWindowEvent(window);\n\n const conditionalHandler = (event: MouseEvent | TouchEvent) => {\n // Skip if this event is the same as the one running when we added the handlers\n if (event === currentEvent) {\n currentEvent = undefined;\n return;\n }\n\n listener(event);\n };\n\n if (!disabled) {\n // use capture phase because React can update DOM before the event bubbles to the document\n element?.addEventListener('click', conditionalHandler, true);\n element?.addEventListener('touchstart', conditionalHandler, true);\n element?.addEventListener('contextmenu', conditionalHandler, true);\n }\n\n // Garbage collect this event after it's no longer useful to avoid memory leaks\n timeoutId.current = window.setTimeout(() => {\n currentEvent = undefined;\n }, 1);\n\n return () => {\n element?.removeEventListener('click', conditionalHandler, true);\n element?.removeEventListener('touchstart', conditionalHandler, true);\n element?.removeEventListener('contextmenu', conditionalHandler, true);\n\n clearTimeout(timeoutId.current);\n currentEvent = undefined;\n };\n }, [listener, element, disabled]);\n};\n\nconst getWindowEvent = (target: Node | Window): Event | undefined => {\n if (target) {\n if (typeof (target as Window).window === 'object' && (target as Window).window === target) {\n // eslint-disable-next-line deprecation/deprecation\n return target.event;\n }\n\n // eslint-disable-next-line deprecation/deprecation\n return (target as Node).ownerDocument?.defaultView?.event ?? undefined;\n }\n\n return undefined;\n};\n\nconst FUI_FRAME_EVENT = 'fuiframefocus';\n\n/**\n * Since click events do not propagate past iframes, we use focus to detect if a\n * click has happened inside an iframe, since the only ways of focusing inside an\n * iframe are:\n * - clicking inside\n * - tabbing inside\n *\n * Polls the value of `document.activeElement`. If it is an iframe, then dispatch\n * a custom DOM event. When the custom event is received call the provided callback\n *\n * @param enableFrameFocusDispatch - boolean flag to start dispatching events\n * @param targetDocument - the document to dispatch events and set timeouts\n * @param pollDuration - in milliseconds\n */\nconst useIFrameFocus = (\n enableFrameFocusDispatch: boolean,\n targetDocument: Document | undefined,\n callback: (e: Event) => void,\n pollDuration: number = 1000,\n) => {\n const timeoutRef = React.useRef<number>();\n\n const listener = useEventCallback((e: Event) => {\n if (callback) {\n callback(e);\n }\n });\n\n // Adds listener to the custom iframe focus event\n React.useEffect(() => {\n if (enableFrameFocusDispatch) {\n targetDocument?.addEventListener(FUI_FRAME_EVENT, listener, true);\n }\n return () => {\n targetDocument?.removeEventListener(FUI_FRAME_EVENT, listener, true);\n };\n }, [targetDocument, enableFrameFocusDispatch, listener]);\n\n // Starts polling for the active element\n React.useEffect(() => {\n if (enableFrameFocusDispatch) {\n timeoutRef.current = targetDocument?.defaultView?.setInterval(() => {\n const activeElement = targetDocument?.activeElement;\n if (activeElement?.tagName === 'IFRAME' || activeElement?.tagName === 'WEBVIEW') {\n const event = new CustomEvent(FUI_FRAME_EVENT, { bubbles: true });\n activeElement.dispatchEvent(event);\n }\n }, pollDuration);\n }\n return () => {\n targetDocument?.defaultView?.clearTimeout(timeoutRef.current);\n };\n }, [targetDocument, enableFrameFocusDispatch, pollDuration]);\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":"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","names":["useOnClickOutside","options","refs","callback","element","disabled","contains","containsProp","timeoutId","React","useRef","undefined","useIFrameFocus","listener","useEventCallback_1","ev","parent","child","isOutside","every","ref","current","target","useEffect","currentEvent","getWindowEvent","window","conditionalHandler","event","addEventListener","setTimeout","removeEventListener","clearTimeout","exports","ownerDocument","defaultView","FUI_FRAME_EVENT","enableFrameFocusDispatch","targetDocument","pollDuration","timeoutRef","e","setInterval","activeElement","tagName","CustomEvent","bubbles","dispatchEvent"],"sourceRoot":"../src/","sources":["packages/react-components/react-utilities/src/hooks/useOnClickOutside.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback } from './useEventCallback';\n\n/**\n * @internal\n */\nexport type UseOnClickOrScrollOutsideOptions = {\n /**\n * The element to listen for the click event\n */\n element: Document | undefined;\n /**\n * Refs to elements that check if the click is outside\n */\n refs: React.MutableRefObject<HTMLElement | undefined | null>[];\n\n /**\n * By default uses element.contains, but custom contain function can be provided\n * @param parentRef - provided parent ref\n * @param child - event target element\n */\n contains?(parent: HTMLElement | null, child: HTMLElement): boolean;\n\n /**\n * Disables event listeners\n */\n disabled?: boolean;\n\n /**\n * Called if the click is outside the element refs\n */\n callback: (ev: MouseEvent | TouchEvent) => void;\n};\n\n/**\n * @internal\n * Utility to perform checks where a click/touch event was made outside a component\n */\nexport const useOnClickOutside = (options: UseOnClickOrScrollOutsideOptions) => {\n const { refs, callback, element, disabled, contains: containsProp } = options;\n const timeoutId = React.useRef<number | undefined>(undefined);\n useIFrameFocus(!disabled, element, callback as (e: Event) => void);\n\n const listener = useEventCallback((ev: MouseEvent | TouchEvent) => {\n const contains: UseOnClickOrScrollOutsideOptions['contains'] =\n containsProp || ((parent, child) => !!parent?.contains(child));\n\n const isOutside = refs.every(ref => !contains(ref.current || null, ev.target as HTMLElement));\n if (isOutside && !disabled) {\n callback(ev);\n }\n });\n\n React.useEffect(() => {\n // Store the current event to avoid triggering handlers immediately\n // Note this depends on a deprecated but extremely well supported quirk of the web platform\n // https://github.com/facebook/react/issues/20074\n let currentEvent = getWindowEvent(window);\n\n const conditionalHandler = (event: MouseEvent | TouchEvent) => {\n // Skip if this event is the same as the one running when we added the handlers\n if (event === currentEvent) {\n currentEvent = undefined;\n return;\n }\n\n listener(event);\n };\n\n if (!disabled) {\n // use capture phase because React can update DOM before the event bubbles to the document\n element?.addEventListener('click', conditionalHandler, true);\n element?.addEventListener('touchstart', conditionalHandler, true);\n element?.addEventListener('contextmenu', conditionalHandler, true);\n }\n\n // Garbage collect this event after it's no longer useful to avoid memory leaks\n timeoutId.current = window.setTimeout(() => {\n currentEvent = undefined;\n }, 1);\n\n return () => {\n element?.removeEventListener('click', conditionalHandler, true);\n element?.removeEventListener('touchstart', conditionalHandler, true);\n element?.removeEventListener('contextmenu', conditionalHandler, true);\n\n clearTimeout(timeoutId.current);\n currentEvent = undefined;\n };\n }, [listener, element, disabled]);\n};\n\nconst getWindowEvent = (target: Node | Window): Event | undefined => {\n if (target) {\n if (typeof (target as Window).window === 'object' && (target as Window).window === target) {\n // eslint-disable-next-line deprecation/deprecation\n return target.event;\n }\n\n // eslint-disable-next-line deprecation/deprecation\n return (target as Node).ownerDocument?.defaultView?.event ?? undefined;\n }\n\n return undefined;\n};\n\nconst FUI_FRAME_EVENT = 'fuiframefocus';\n\n/**\n * Since click events do not propagate past iframes, we use focus to detect if a\n * click has happened inside an iframe, since the only ways of focusing inside an\n * iframe are:\n * - clicking inside\n * - tabbing inside\n *\n * Polls the value of `document.activeElement`. If it is an iframe, then dispatch\n * a custom DOM event. When the custom event is received call the provided callback\n *\n * @param enableFrameFocusDispatch - boolean flag to start dispatching events\n * @param targetDocument - the document to dispatch events and set timeouts\n * @param pollDuration - in milliseconds\n */\nconst useIFrameFocus = (\n enableFrameFocusDispatch: boolean,\n targetDocument: Document | undefined,\n callback: (e: Event) => void,\n pollDuration: number = 1000,\n) => {\n const timeoutRef = React.useRef<number>();\n\n const listener = useEventCallback((e: Event) => {\n if (callback) {\n callback(e);\n }\n });\n\n // Adds listener to the custom iframe focus event\n React.useEffect(() => {\n if (enableFrameFocusDispatch) {\n targetDocument?.addEventListener(FUI_FRAME_EVENT, listener, true);\n }\n return () => {\n targetDocument?.removeEventListener(FUI_FRAME_EVENT, listener, true);\n };\n }, [targetDocument, enableFrameFocusDispatch, listener]);\n\n // Starts polling for the active element\n React.useEffect(() => {\n if (enableFrameFocusDispatch) {\n timeoutRef.current = targetDocument?.defaultView?.setInterval(() => {\n const activeElement = targetDocument?.activeElement;\n if (activeElement?.tagName === 'IFRAME' || activeElement?.tagName === 'WEBVIEW') {\n const event = new CustomEvent(FUI_FRAME_EVENT, { bubbles: true });\n activeElement.dispatchEvent(event);\n }\n }, pollDuration);\n }\n return () => {\n targetDocument?.defaultView?.clearTimeout(timeoutRef.current);\n };\n }, [targetDocument, enableFrameFocusDispatch, pollDuration]);\n};\n"]}
@@ -4,16 +4,12 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.useOnScrollOutside = void 0;
7
-
8
7
  const React = /*#__PURE__*/require("react");
9
-
10
8
  const useEventCallback_1 = /*#__PURE__*/require("./useEventCallback");
11
9
  /**
12
10
  * @internal
13
11
  * Utility to perform checks where a click/touch event was made outside a component
14
12
  */
15
-
16
-
17
13
  const useOnScrollOutside = options => {
18
14
  const {
19
15
  refs,
@@ -24,9 +20,7 @@ const useOnScrollOutside = options => {
24
20
  } = options;
25
21
  const listener = useEventCallback_1.useEventCallback(ev => {
26
22
  const contains = containsProp || ((parent, child) => !!(parent === null || parent === void 0 ? void 0 : parent.contains(child)));
27
-
28
23
  const isOutside = refs.every(ref => !contains(ref.current || null, ev.target));
29
-
30
24
  if (isOutside && !disabled) {
31
25
  callback(ev);
32
26
  }
@@ -36,13 +30,11 @@ const useOnScrollOutside = options => {
36
30
  element === null || element === void 0 ? void 0 : element.addEventListener('wheel', listener);
37
31
  element === null || element === void 0 ? void 0 : element.addEventListener('touchmove', listener);
38
32
  }
39
-
40
33
  return () => {
41
34
  element === null || element === void 0 ? void 0 : element.removeEventListener('wheel', listener);
42
35
  element === null || element === void 0 ? void 0 : element.removeEventListener('touchmove', listener);
43
36
  };
44
37
  }, [listener, element, disabled]);
45
38
  };
46
-
47
39
  exports.useOnScrollOutside = useOnScrollOutside;
48
40
  //# sourceMappingURL=useOnScrollOutside.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-utilities/src/hooks/useOnScrollOutside.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;AAGA;;;AAGG;;;AACI,MAAM,kBAAkB,GAAI,OAAD,IAA8C;EAC9E,MAAM;IAAE,IAAF;IAAQ,QAAR;IAAkB,OAAlB;IAA2B,QAA3B;IAAqC,QAAQ,EAAE;EAA/C,IAAgE,OAAtE;EAEA,MAAM,QAAQ,GAAG,kBAAA,CAAA,gBAAA,CAAkB,EAAD,IAAgC;IAChE,MAAM,QAAQ,GACZ,YAAY,KAAK,CAAC,MAAD,EAAS,KAAT,KAAmB,CAAC,EAAC,MAAM,KAAA,IAAN,IAAA,MAAM,KAAA,KAAA,CAAN,GAAM,KAAA,CAAN,GAAA,MAAM,CAAE,QAAR,CAAiB,KAAjB,CAAD,CAAzB,CADd;;IAGA,MAAM,SAAS,GAAG,IAAI,CAAC,KAAL,CAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,OAAJ,IAAe,IAAhB,EAAsB,EAAE,CAAC,MAAzB,CAA3B,CAAlB;;IACA,IAAI,SAAS,IAAI,CAAC,QAAlB,EAA4B;MAC1B,QAAQ,CAAC,EAAD,CAAR;IACD;EACF,CARgB,CAAjB;EAUA,KAAK,CAAC,SAAN,CAAgB,MAAK;IACnB,IAAI,CAAC,QAAL,EAAe;MACb,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,gBAAT,CAA0B,OAA1B,EAAmC,QAAnC,CAAA;MACA,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,gBAAT,CAA0B,WAA1B,EAAuC,QAAvC,CAAA;IACD;;IAED,OAAO,MAAK;MACV,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,mBAAT,CAA6B,OAA7B,EAAsC,QAAtC,CAAA;MACA,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,mBAAT,CAA6B,WAA7B,EAA0C,QAA1C,CAAA;IACD,CAHD;EAID,CAVD,EAUG,CAAC,QAAD,EAAW,OAAX,EAAoB,QAApB,CAVH;AAWD,CAxBM;;AAAM,OAAA,CAAA,kBAAA,GAAkB,kBAAlB","sourcesContent":["import * as React from 'react';\nimport { useEventCallback } from './useEventCallback';\nimport type { UseOnClickOrScrollOutsideOptions } from './useOnClickOutside';\n\n/**\n * @internal\n * Utility to perform checks where a click/touch event was made outside a component\n */\nexport const useOnScrollOutside = (options: UseOnClickOrScrollOutsideOptions) => {\n const { refs, callback, element, disabled, contains: containsProp } = options;\n\n const listener = useEventCallback((ev: MouseEvent | TouchEvent) => {\n const contains: UseOnClickOrScrollOutsideOptions['contains'] =\n containsProp || ((parent, child) => !!parent?.contains(child));\n\n const isOutside = refs.every(ref => !contains(ref.current || null, ev.target as HTMLElement));\n if (isOutside && !disabled) {\n callback(ev);\n }\n });\n\n React.useEffect(() => {\n if (!disabled) {\n element?.addEventListener('wheel', listener);\n element?.addEventListener('touchmove', listener);\n }\n\n return () => {\n element?.removeEventListener('wheel', listener);\n element?.removeEventListener('touchmove', listener);\n };\n }, [listener, element, disabled]);\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":";;;;;;AAAA;AACA;AAGA;;;;AAIO,MAAMA,kBAAkB,GAAIC,OAAyC,IAAI;EAC9E,MAAM;IAAEC,IAAI;IAAEC,QAAQ;IAAEC,OAAO;IAAEC,QAAQ;IAAEC,QAAQ,EAAEC;EAAY,CAAE,GAAGN,OAAO;EAE7E,MAAMO,QAAQ,GAAGC,mCAAgB,CAAEC,EAA2B,IAAI;IAChE,MAAMJ,QAAQ,GACZC,YAAY,KAAK,CAACI,MAAM,EAAEC,KAAK,KAAK,CAAC,EAACD,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEL,QAAQ,CAACM,KAAK,CAAC,EAAC;IAEhE,MAAMC,SAAS,GAAGX,IAAI,CAACY,KAAK,CAACC,GAAG,IAAI,CAACT,QAAQ,CAACS,GAAG,CAACC,OAAO,IAAI,IAAI,EAAEN,EAAE,CAACO,MAAqB,CAAC,CAAC;IAC7F,IAAIJ,SAAS,IAAI,CAACR,QAAQ,EAAE;MAC1BF,QAAQ,CAACO,EAAE,CAAC;;EAEhB,CAAC,CAAC;EAEFQ,KAAK,CAACC,SAAS,CAAC,MAAK;IACnB,IAAI,CAACd,QAAQ,EAAE;MACbD,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEgB,gBAAgB,CAAC,OAAO,EAAEZ,QAAQ,CAAC;MAC5CJ,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEgB,gBAAgB,CAAC,WAAW,EAAEZ,QAAQ,CAAC;;IAGlD,OAAO,MAAK;MACVJ,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEiB,mBAAmB,CAAC,OAAO,EAAEb,QAAQ,CAAC;MAC/CJ,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEiB,mBAAmB,CAAC,WAAW,EAAEb,QAAQ,CAAC;IACrD,CAAC;EACH,CAAC,EAAE,CAACA,QAAQ,EAAEJ,OAAO,EAAEC,QAAQ,CAAC,CAAC;AACnC,CAAC;AAxBYiB,0BAAkB","names":["useOnScrollOutside","options","refs","callback","element","disabled","contains","containsProp","listener","useEventCallback_1","ev","parent","child","isOutside","every","ref","current","target","React","useEffect","addEventListener","removeEventListener","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-utilities/src/hooks/useOnScrollOutside.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback } from './useEventCallback';\nimport type { UseOnClickOrScrollOutsideOptions } from './useOnClickOutside';\n\n/**\n * @internal\n * Utility to perform checks where a click/touch event was made outside a component\n */\nexport const useOnScrollOutside = (options: UseOnClickOrScrollOutsideOptions) => {\n const { refs, callback, element, disabled, contains: containsProp } = options;\n\n const listener = useEventCallback((ev: MouseEvent | TouchEvent) => {\n const contains: UseOnClickOrScrollOutsideOptions['contains'] =\n containsProp || ((parent, child) => !!parent?.contains(child));\n\n const isOutside = refs.every(ref => !contains(ref.current || null, ev.target as HTMLElement));\n if (isOutside && !disabled) {\n callback(ev);\n }\n });\n\n React.useEffect(() => {\n if (!disabled) {\n element?.addEventListener('wheel', listener);\n element?.addEventListener('touchmove', listener);\n }\n\n return () => {\n element?.removeEventListener('wheel', listener);\n element?.removeEventListener('touchmove', listener);\n };\n }, [listener, element, disabled]);\n};\n"]}
@@ -4,13 +4,10 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.usePrevious = void 0;
7
-
8
7
  const React = /*#__PURE__*/require("react");
9
8
  /**
10
9
  * @internal
11
10
  */
12
-
13
-
14
11
  const usePrevious = value => {
15
12
  const ref = React.useRef(null);
16
13
  React.useEffect(() => {
@@ -18,6 +15,5 @@ const usePrevious = value => {
18
15
  }, [value]);
19
16
  return ref.current;
20
17
  };
21
-
22
18
  exports.usePrevious = usePrevious;
23
19
  //# sourceMappingURL=usePrevious.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-utilities/src/hooks/usePrevious.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;AAEA;;AAEG;;;AACI,MAAM,WAAW,GAAyB,KAAtB,IAA0C;EACnE,MAAM,GAAG,GAAG,KAAK,CAAC,MAAN,CAA+B,IAA/B,CAAZ;EACA,KAAK,CAAC,SAAN,CAAgB,MAAK;IACnB,GAAG,CAAC,OAAJ,GAAc,KAAd;EACD,CAFD,EAEG,CAAC,KAAD,CAFH;EAGA,OAAO,GAAG,CAAC,OAAX;AACD,CANM;;AAAM,OAAA,CAAA,WAAA,GAAW,WAAX","sourcesContent":["import * as React from 'react';\n\n/**\n * @internal\n */\nexport const usePrevious = <ValueType = unknown>(value: ValueType) => {\n const ref = React.useRef<ValueType | null>(null);\n React.useEffect(() => {\n ref.current = value;\n }, [value]);\n return ref.current;\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":";;;;;;AAAA;AAEA;;;AAGO,MAAMA,WAAW,GAAyBC,KAAgB,IAAI;EACnE,MAAMC,GAAG,GAAGC,KAAK,CAACC,MAAM,CAAmB,IAAI,CAAC;EAChDD,KAAK,CAACE,SAAS,CAAC,MAAK;IACnBH,GAAG,CAACI,OAAO,GAAGL,KAAK;EACrB,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EACX,OAAOC,GAAG,CAACI,OAAO;AACpB,CAAC;AANYC,mBAAW","names":["usePrevious","value","ref","React","useRef","useEffect","current","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-utilities/src/hooks/usePrevious.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * @internal\n */\nexport const usePrevious = <ValueType = unknown>(value: ValueType) => {\n const ref = React.useRef<ValueType | null>(null);\n React.useEffect(() => {\n ref.current = value;\n }, [value]);\n return ref.current;\n};\n"]}
@@ -0,0 +1,37 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useScrollbarWidth = void 0;
7
+ const React = /*#__PURE__*/require("react");
8
+ const cache = /*#__PURE__*/new WeakMap();
9
+ /**
10
+ * @returns The width in pixels of the scrollbar in the user agent
11
+ */
12
+ function useScrollbarWidth(options) {
13
+ const {
14
+ targetDocument,
15
+ force
16
+ } = options;
17
+ return React.useMemo(() => {
18
+ if (!targetDocument) {
19
+ return 0;
20
+ }
21
+ if (!force && cache.has(targetDocument)) {
22
+ return cache.get(targetDocument);
23
+ }
24
+ const outer = targetDocument.createElement('div');
25
+ outer.style.visibility = 'hidden';
26
+ outer.style.overflow = 'scroll';
27
+ const inner = targetDocument.createElement('div');
28
+ outer.appendChild(inner);
29
+ targetDocument.body.appendChild(outer);
30
+ const scrollbarWidth = outer.offsetWidth - inner.offsetWidth;
31
+ outer.remove();
32
+ cache.set(targetDocument, scrollbarWidth);
33
+ return scrollbarWidth;
34
+ }, [targetDocument, force]);
35
+ }
36
+ exports.useScrollbarWidth = useScrollbarWidth;
37
+ //# sourceMappingURL=useScrollbarWidth.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"mappings":";;;;;;AAAA;AAEA,MAAMA,KAAK,gBAAG,IAAIC,OAAO,EAAoB;AAc7C;;;AAGA,SAAgBC,iBAAiB,CAACC,OAAiC;EACjE,MAAM;IAAEC,cAAc;IAAEC;EAAK,CAAE,GAAGF,OAAO;EACzC,OAAOG,KAAK,CAACC,OAAO,CAAC,MAAK;IACxB,IAAI,CAACH,cAAc,EAAE;MACnB,OAAO,CAAC;;IAGV,IAAI,CAACC,KAAK,IAAIL,KAAK,CAACQ,GAAG,CAACJ,cAAc,CAAC,EAAE;MACvC,OAAOJ,KAAK,CAACS,GAAG,CAACL,cAAc,CAAC;;IAGlC,MAAMM,KAAK,GAAGN,cAAc,CAACO,aAAa,CAAC,KAAK,CAAC;IACjDD,KAAK,CAACE,KAAK,CAACC,UAAU,GAAG,QAAQ;IACjCH,KAAK,CAACE,KAAK,CAACE,QAAQ,GAAG,QAAQ;IAE/B,MAAMC,KAAK,GAAGX,cAAc,CAACO,aAAa,CAAC,KAAK,CAAC;IACjDD,KAAK,CAACM,WAAW,CAACD,KAAK,CAAC;IAExBX,cAAc,CAACa,IAAI,CAACD,WAAW,CAACN,KAAK,CAAC;IACtC,MAAMQ,cAAc,GAAGR,KAAK,CAACS,WAAW,GAAGJ,KAAK,CAACI,WAAW;IAC5DT,KAAK,CAACU,MAAM,EAAE;IACdpB,KAAK,CAACqB,GAAG,CAACjB,cAAc,EAAEc,cAAc,CAAC;IACzC,OAAOA,cAAc;EACvB,CAAC,EAAE,CAACd,cAAc,EAAEC,KAAK,CAAC,CAAC;AAC7B;AAxBAiB","names":["cache","WeakMap","useScrollbarWidth","options","targetDocument","force","React","useMemo","has","get","outer","createElement","style","visibility","overflow","inner","appendChild","body","scrollbarWidth","offsetWidth","remove","set","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-utilities/src/hooks/useScrollbarWidth.ts"],"sourcesContent":["import * as React from 'react';\n\nconst cache = new WeakMap<Document, number>();\n\ninterface UseScrollbarWidthOptions {\n /**\n * Reference document to measure the scrollbar width\n */\n targetDocument: Document | null | undefined;\n\n /**\n * Does not use the cache and recalculates the scrollbar width\n */\n force?: boolean;\n}\n\n/**\n * @returns The width in pixels of the scrollbar in the user agent\n */\nexport function useScrollbarWidth(options: UseScrollbarWidthOptions) {\n const { targetDocument, force } = options;\n return React.useMemo(() => {\n if (!targetDocument) {\n return 0;\n }\n\n if (!force && cache.has(targetDocument)) {\n return cache.get(targetDocument);\n }\n\n const outer = targetDocument.createElement('div');\n outer.style.visibility = 'hidden';\n outer.style.overflow = 'scroll';\n\n const inner = targetDocument.createElement('div');\n outer.appendChild(inner);\n\n targetDocument.body.appendChild(outer);\n const scrollbarWidth = outer.offsetWidth - inner.offsetWidth;\n outer.remove();\n cache.set(targetDocument, scrollbarWidth);\n return scrollbarWidth;\n }, [targetDocument, force]);\n}\n"]}
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.useTimeout = void 0;
7
-
8
7
  const React = /*#__PURE__*/require("react");
9
8
  /**
10
9
  * @internal
@@ -14,8 +13,6 @@ const React = /*#__PURE__*/require("react");
14
13
  *
15
14
  * @returns A pair of [setTimeout, clearTimeout] that are stable between renders.
16
15
  */
17
-
18
-
19
16
  function useTimeout() {
20
17
  const [timeout] = React.useState(() => ({
21
18
  id: undefined,
@@ -29,11 +26,10 @@ function useTimeout() {
29
26
  timeout.id = undefined;
30
27
  }
31
28
  }
32
- })); // Clean up the timeout when the component is unloaded
33
-
29
+ }));
30
+ // Clean up the timeout when the component is unloaded
34
31
  React.useEffect(() => timeout.clear, [timeout]);
35
32
  return [timeout.set, timeout.clear];
36
33
  }
37
-
38
34
  exports.useTimeout = useTimeout;
39
35
  //# sourceMappingURL=useTimeout.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-utilities/src/hooks/useTimeout.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;AAEA;;;;;;;AAOG;;;AACH,SAAgB,UAAhB,GAA0B;EACxB,MAAM,CAAC,OAAD,IAAY,KAAK,CAAC,QAAN,CAAe,OAAO;IACtC,EAAE,EAAE,SADkC;IAEtC,GAAG,EAAE,CAAC,EAAD,EAAiB,KAAjB,KAAkC;MACrC,OAAO,CAAC,KAAR;MACA,OAAO,CAAC,EAAR,GAAa,UAAU,CAAC,EAAD,EAAK,KAAL,CAAvB;IACD,CALqC;IAMtC,KAAK,EAAE,MAAK;MACV,IAAI,OAAO,CAAC,EAAR,KAAe,SAAnB,EAA8B;QAC5B,YAAY,CAAC,OAAO,CAAC,EAAT,CAAZ;QACA,OAAO,CAAC,EAAR,GAAa,SAAb;MACD;IACF;EAXqC,CAAP,CAAf,CAAlB,CADwB,CAexB;;EACA,KAAK,CAAC,SAAN,CAAgB,MAAM,OAAO,CAAC,KAA9B,EAAqC,CAAC,OAAD,CAArC;EAEA,OAAO,CAAC,OAAO,CAAC,GAAT,EAAc,OAAO,CAAC,KAAtB,CAAP;AACD;;AAnBD,OAAA,CAAA,UAAA,GAAA,UAAA","sourcesContent":["import * as React from 'react';\n\n/**\n * @internal\n * Helper to manage a browser timeout.\n * Ensures that the timeout isn't set multiple times at once,\n * and is cleaned up when the component is unloaded.\n *\n * @returns A pair of [setTimeout, clearTimeout] that are stable between renders.\n */\nexport function useTimeout() {\n const [timeout] = React.useState(() => ({\n id: undefined as ReturnType<typeof setTimeout> | undefined,\n set: (fn: () => void, delay: number) => {\n timeout.clear();\n timeout.id = setTimeout(fn, delay);\n },\n clear: () => {\n if (timeout.id !== undefined) {\n clearTimeout(timeout.id);\n timeout.id = undefined;\n }\n },\n }));\n\n // Clean up the timeout when the component is unloaded\n React.useEffect(() => timeout.clear, [timeout]);\n\n return [timeout.set, timeout.clear] as const;\n}\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":";;;;;;AAAA;AAEA;;;;;;;;AAQA,SAAgBA,UAAU;EACxB,MAAM,CAACC,OAAO,CAAC,GAAGC,KAAK,CAACC,QAAQ,CAAC,OAAO;IACtCC,EAAE,EAAEC,SAAsD;IAC1DC,GAAG,EAAE,CAACC,EAAc,EAAEC,KAAa,KAAI;MACrCP,OAAO,CAACQ,KAAK,EAAE;MACfR,OAAO,CAACG,EAAE,GAAGM,UAAU,CAACH,EAAE,EAAEC,KAAK,CAAC;IACpC,CAAC;IACDC,KAAK,EAAE,MAAK;MACV,IAAIR,OAAO,CAACG,EAAE,KAAKC,SAAS,EAAE;QAC5BM,YAAY,CAACV,OAAO,CAACG,EAAE,CAAC;QACxBH,OAAO,CAACG,EAAE,GAAGC,SAAS;;IAE1B;GACD,CAAC,CAAC;EAEH;EACAH,KAAK,CAACU,SAAS,CAAC,MAAMX,OAAO,CAACQ,KAAK,EAAE,CAACR,OAAO,CAAC,CAAC;EAE/C,OAAO,CAACA,OAAO,CAACK,GAAG,EAAEL,OAAO,CAACQ,KAAK,CAAU;AAC9C;AAnBAI","names":["useTimeout","timeout","React","useState","id","undefined","set","fn","delay","clear","setTimeout","clearTimeout","useEffect","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-utilities/src/hooks/useTimeout.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * @internal\n * Helper to manage a browser timeout.\n * Ensures that the timeout isn't set multiple times at once,\n * and is cleaned up when the component is unloaded.\n *\n * @returns A pair of [setTimeout, clearTimeout] that are stable between renders.\n */\nexport function useTimeout() {\n const [timeout] = React.useState(() => ({\n id: undefined as ReturnType<typeof setTimeout> | undefined,\n set: (fn: () => void, delay: number) => {\n timeout.clear();\n timeout.id = setTimeout(fn, delay);\n },\n clear: () => {\n if (timeout.id !== undefined) {\n clearTimeout(timeout.id);\n timeout.id = undefined;\n }\n },\n }));\n\n // Clean up the timeout when the component is unloaded\n React.useEffect(() => timeout.clear, [timeout]);\n\n return [timeout.set, timeout.clear] as const;\n}\n"]}
@@ -3,10 +3,8 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.isFluentTrigger = exports.getTriggerChild = exports.applyTriggerPropsToChildren = exports.isInteractiveHTMLElement = exports.isHTMLElement = exports.mergeCallbacks = exports.getRTLSafeKey = exports.getPartitionedNativeProps = exports.getNativeElementProps = exports.clamp = exports.SSRProvider = exports.useIsSSR = exports.canUseDOM = exports.useTimeout = exports.usePrevious = exports.useOnScrollOutside = exports.useOnClickOutside = exports.useMergedRefs = exports.useIsomorphicLayoutEffect = exports.useId = exports.useForceUpdate = exports.useFirstMount = exports.useEventCallback = exports.useControllableState = exports.resetIdsForTests = exports.isResolvedShorthand = exports.resolveShorthand = exports.getSlots = void 0;
7
-
6
+ exports.isFluentTrigger = exports.getTriggerChild = exports.applyTriggerPropsToChildren = exports.isInteractiveHTMLElement = exports.isHTMLElement = exports.mergeCallbacks = exports.getRTLSafeKey = exports.getPartitionedNativeProps = exports.getNativeElementProps = exports.clamp = exports.SSRProvider = exports.useIsSSR = exports.canUseDOM = exports.useTimeout = exports.useScrollbarWidth = exports.usePrevious = exports.useOnScrollOutside = exports.useOnClickOutside = exports.useMergedRefs = exports.useIsomorphicLayoutEffect = exports.useId = exports.useForceUpdate = exports.useFirstMount = exports.useEventCallback = exports.useControllableState = exports.resetIdsForTests = exports.isResolvedShorthand = exports.resolveShorthand = exports.getSlots = void 0;
8
7
  var index_1 = /*#__PURE__*/require("./compose/index");
9
-
10
8
  Object.defineProperty(exports, "getSlots", {
11
9
  enumerable: true,
12
10
  get: function () {
@@ -25,9 +23,7 @@ Object.defineProperty(exports, "isResolvedShorthand", {
25
23
  return index_1.isResolvedShorthand;
26
24
  }
27
25
  });
28
-
29
26
  var index_2 = /*#__PURE__*/require("./hooks/index");
30
-
31
27
  Object.defineProperty(exports, "resetIdsForTests", {
32
28
  enumerable: true,
33
29
  get: function () {
@@ -94,15 +90,19 @@ Object.defineProperty(exports, "usePrevious", {
94
90
  return index_2.usePrevious;
95
91
  }
96
92
  });
93
+ Object.defineProperty(exports, "useScrollbarWidth", {
94
+ enumerable: true,
95
+ get: function () {
96
+ return index_2.useScrollbarWidth;
97
+ }
98
+ });
97
99
  Object.defineProperty(exports, "useTimeout", {
98
100
  enumerable: true,
99
101
  get: function () {
100
102
  return index_2.useTimeout;
101
103
  }
102
104
  });
103
-
104
105
  var index_3 = /*#__PURE__*/require("./ssr/index");
105
-
106
106
  Object.defineProperty(exports, "canUseDOM", {
107
107
  enumerable: true,
108
108
  get: function () {
@@ -121,9 +121,7 @@ Object.defineProperty(exports, "SSRProvider", {
121
121
  return index_3.SSRProvider;
122
122
  }
123
123
  });
124
-
125
124
  var index_4 = /*#__PURE__*/require("./utils/index");
126
-
127
125
  Object.defineProperty(exports, "clamp", {
128
126
  enumerable: true,
129
127
  get: function () {
@@ -166,9 +164,7 @@ Object.defineProperty(exports, "isInteractiveHTMLElement", {
166
164
  return index_4.isInteractiveHTMLElement;
167
165
  }
168
166
  });
169
-
170
167
  var index_5 = /*#__PURE__*/require("./trigger/index");
171
-
172
168
  Object.defineProperty(exports, "applyTriggerPropsToChildren", {
173
169
  enumerable: true,
174
170
  get: function () {
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-utilities/src/index.ts"],"names":[],"mappings":"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","sourcesContent":["export { getSlots, resolveShorthand, isResolvedShorthand } from './compose/index';\nexport type {\n ExtractSlotProps,\n ComponentProps,\n ComponentState,\n ForwardRefComponent,\n ResolveShorthandFunction,\n ResolveShorthandOptions,\n Slot,\n Slots,\n SlotClassNames,\n SlotPropsRecord,\n SlotRenderFunction,\n SlotShorthandValue,\n} from './compose/index';\n\nexport {\n resetIdsForTests,\n useControllableState,\n useEventCallback,\n useFirstMount,\n useForceUpdate,\n useId,\n useIsomorphicLayoutEffect,\n useMergedRefs,\n useOnClickOutside,\n useOnScrollOutside,\n usePrevious,\n useTimeout,\n} from './hooks/index';\nexport type { RefObjectFunction, UseControllableStateOptions, UseOnClickOrScrollOutsideOptions } from './hooks/index';\n\nexport { canUseDOM, useIsSSR, SSRProvider } from './ssr/index';\n\nexport {\n clamp,\n getNativeElementProps,\n getPartitionedNativeProps,\n getRTLSafeKey,\n mergeCallbacks,\n isHTMLElement,\n isInteractiveHTMLElement,\n} from './utils/index';\n\nexport { applyTriggerPropsToChildren, getTriggerChild, isFluentTrigger } from './trigger/index';\n\nexport type { FluentTriggerComponent, TriggerProps } from './trigger/index';\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":";;;;;;AAAA;AAASA;EAAAC;EAAAC;IAAA,uBAAQ;EAAA;AAAA;AAAEF;EAAAC;EAAAC;IAAA,+BAAgB;EAAA;AAAA;AAAEF;EAAAC;EAAAC;IAAA,kCAAmB;EAAA;AAAA;AAgBxD;AACEF;EAAAC;EAAAC;IAAA,+BAAgB;EAAA;AAAA;AAChBF;EAAAC;EAAAC;IAAA,mCAAoB;EAAA;AAAA;AACpBF;EAAAC;EAAAC;IAAA,+BAAgB;EAAA;AAAA;AAChBF;EAAAC;EAAAC;IAAA,4BAAa;EAAA;AAAA;AACbF;EAAAC;EAAAC;IAAA,6BAAc;EAAA;AAAA;AACdF;EAAAC;EAAAC;IAAA,oBAAK;EAAA;AAAA;AACLF;EAAAC;EAAAC;IAAA,wCAAyB;EAAA;AAAA;AACzBF;EAAAC;EAAAC;IAAA,4BAAa;EAAA;AAAA;AACbF;EAAAC;EAAAC;IAAA,gCAAiB;EAAA;AAAA;AACjBF;EAAAC;EAAAC;IAAA,iCAAkB;EAAA;AAAA;AAClBF;EAAAC;EAAAC;IAAA,0BAAW;EAAA;AAAA;AACXF;EAAAC;EAAAC;IAAA,gCAAiB;EAAA;AAAA;AACjBF;EAAAC;EAAAC;IAAA,yBAAU;EAAA;AAAA;AAIZ;AAASF;EAAAC;EAAAC;IAAA,wBAAS;EAAA;AAAA;AAAEF;EAAAC;EAAAC;IAAA,uBAAQ;EAAA;AAAA;AAAEF;EAAAC;EAAAC;IAAA,0BAAW;EAAA;AAAA;AAEzC;AACEF;EAAAC;EAAAC;IAAA,oBAAK;EAAA;AAAA;AACLF;EAAAC;EAAAC;IAAA,oCAAqB;EAAA;AAAA;AACrBF;EAAAC;EAAAC;IAAA,wCAAyB;EAAA;AAAA;AACzBF;EAAAC;EAAAC;IAAA,4BAAa;EAAA;AAAA;AACbF;EAAAC;EAAAC;IAAA,6BAAc;EAAA;AAAA;AACdF;EAAAC;EAAAC;IAAA,4BAAa;EAAA;AAAA;AACbF;EAAAC;EAAAC;IAAA,uCAAwB;EAAA;AAAA;AAG1B;AAASF;EAAAC;EAAAC;IAAA,0CAA2B;EAAA;AAAA;AAAEF;EAAAC;EAAAC;IAAA,8BAAe;EAAA;AAAA;AAAEF;EAAAC;EAAAC;IAAA,8BAAe;EAAA;AAAA","names":["Object","enumerable","get"],"sourceRoot":"../src/","sources":["packages/react-components/react-utilities/src/index.ts"],"sourcesContent":["export { getSlots, resolveShorthand, isResolvedShorthand } from './compose/index';\nexport type {\n ExtractSlotProps,\n ComponentProps,\n ComponentState,\n ForwardRefComponent,\n ResolveShorthandFunction,\n ResolveShorthandOptions,\n Slot,\n Slots,\n SlotClassNames,\n SlotPropsRecord,\n SlotRenderFunction,\n SlotShorthandValue,\n} from './compose/index';\n\nexport {\n resetIdsForTests,\n useControllableState,\n useEventCallback,\n useFirstMount,\n useForceUpdate,\n useId,\n useIsomorphicLayoutEffect,\n useMergedRefs,\n useOnClickOutside,\n useOnScrollOutside,\n usePrevious,\n useScrollbarWidth,\n useTimeout,\n} from './hooks/index';\nexport type { RefObjectFunction, UseControllableStateOptions, UseOnClickOrScrollOutsideOptions } from './hooks/index';\n\nexport { canUseDOM, useIsSSR, SSRProvider } from './ssr/index';\n\nexport {\n clamp,\n getNativeElementProps,\n getPartitionedNativeProps,\n getRTLSafeKey,\n mergeCallbacks,\n isHTMLElement,\n isInteractiveHTMLElement,\n} from './utils/index';\n\nexport { applyTriggerPropsToChildren, getTriggerChild, isFluentTrigger } from './trigger/index';\n\nexport type { FluentTriggerComponent, TriggerProps } from './trigger/index';\n"]}
@@ -4,17 +4,13 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.useIsSSR = exports.SSRProvider = exports.useSSRContext = exports.SSRContext = exports.defaultSSRContextValue = void 0;
7
-
8
7
  const React = /*#__PURE__*/require("react");
9
-
10
8
  const canUseDOM_1 = /*#__PURE__*/require("./canUseDOM");
11
9
  /**
12
10
  * Default context value to use in case there is no SSRProvider. This is fine for client-only apps.
13
11
  *
14
12
  * @internal
15
13
  */
16
-
17
-
18
14
  exports.defaultSSRContextValue = {
19
15
  current: 0
20
16
  };
@@ -22,13 +18,10 @@ exports.SSRContext = /*#__PURE__*/React.createContext(undefined);
22
18
  /**
23
19
  * @internal
24
20
  */
25
-
26
21
  function useSSRContext() {
27
22
  var _a;
28
-
29
23
  return (_a = React.useContext(exports.SSRContext)) !== null && _a !== void 0 ? _a : exports.defaultSSRContextValue;
30
24
  }
31
-
32
25
  exports.useSSRContext = useSSRContext;
33
26
  /**
34
27
  * When using SSR with Fluent UI, applications must be wrapped in an SSRProvider. This ensures that auto generated ids
@@ -36,7 +29,6 @@ exports.useSSRContext = useSSRContext;
36
29
  *
37
30
  * @public
38
31
  */
39
-
40
32
  const SSRProvider = props => {
41
33
  const [value] = React.useState(() => ({
42
34
  current: 0
@@ -45,27 +37,24 @@ const SSRProvider = props => {
45
37
  value: value
46
38
  }, props.children);
47
39
  };
48
-
49
40
  exports.SSRProvider = SSRProvider;
50
41
  /**
51
42
  * Returns whether the component is currently being server side rendered or hydrated on the client. Can be used to delay
52
43
  * browser-specific rendering until after hydration. May cause re-renders on a client when is used within SSRProvider.
53
44
  */
54
-
55
45
  function useIsSSR() {
56
46
  const isInSSRContext = useSSRContext() !== exports.defaultSSRContextValue;
57
- const [isSSR, setIsSSR] = React.useState(isInSSRContext); // If we are rendering in a non-DOM environment, and there's no SSRProvider, provide a warning to hint to the
47
+ const [isSSR, setIsSSR] = React.useState(isInSSRContext);
48
+ // If we are rendering in a non-DOM environment, and there's no SSRProvider, provide a warning to hint to the
58
49
  // developer to add one.
59
-
60
50
  if (process.env.NODE_ENV !== 'production') {
61
51
  if (!isInSSRContext && !canUseDOM_1.canUseDOM()) {
62
52
  // eslint-disable-next-line no-console
63
53
  console.error(['@fluentui/react-components: ', 'When server rendering, you must wrap your application in an <SSRProvider> to ensure consistent ids are ' + 'generated between the client and server.', '\n', '\n', 'Check documentation at https://aka.ms/fluentui-ssr'].join(''));
64
54
  }
65
- } // If on the client, and the component was initially server rendered, then schedule a layout effect to update the
55
+ }
56
+ // If on the client, and the component was initially server rendered, then schedule a layout effect to update the
66
57
  // component after hydration.
67
-
68
-
69
58
  if (canUseDOM_1.canUseDOM() && isInSSRContext) {
70
59
  // This if statement technically breaks the rules of hooks, but is safe because the condition never changes after
71
60
  // mounting.
@@ -74,9 +63,7 @@ function useIsSSR() {
74
63
  setIsSSR(false);
75
64
  }, []);
76
65
  }
77
-
78
66
  return isSSR;
79
67
  }
80
-
81
68
  exports.useIsSSR = useIsSSR;
82
69
  //# sourceMappingURL=SSRContext.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-utilities/src/ssr/SSRContext.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;AAYA;;;;AAIG;;;AACU,OAAA,CAAA,sBAAA,GAA0C;EACrD,OAAO,EAAE;AAD4C,CAA1C;AAIA,OAAA,CAAA,UAAA,gBAAa,KAAK,CAAC,aAAN,CAAiD,SAAjD,CAAb;AAEb;;AAEG;;AACH,SAAgB,aAAhB,GAA6B;;;EAC3B,OAAO,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,CAAiB,OAAA,CAAA,UAAjB,CAAA,MAA4B,IAA5B,IAA4B,EAAA,KAAA,KAAA,CAA5B,GAA4B,EAA5B,GAAgC,OAAA,CAAA,sBAAvC;AACD;;AAFD,OAAA,CAAA,aAAA,GAAA,aAAA;AAIA;;;;;AAKG;;AACI,MAAM,WAAW,GAAa,KAAK,IAAG;EAC3C,MAAM,CAAC,KAAD,IAAU,KAAK,CAAC,QAAN,CAAgC,OAAO;IAAE,OAAO,EAAE;EAAX,CAAP,CAAhC,CAAhB;EAEA,OAAO,KAAA,CAAA,aAAA,CAAC,OAAA,CAAA,UAAA,CAAW,QAAZ,EAAoB;IAAC,KAAK,EAAE;EAAR,CAApB,EAAoC,KAAK,CAAC,QAA1C,CAAP;AACD,CAJM;;AAAM,OAAA,CAAA,WAAA,GAAW,WAAX;AAMb;;;AAGG;;AACH,SAAgB,QAAhB,GAAwB;EACtB,MAAM,cAAc,GAAG,aAAa,OAAO,OAAA,CAAA,sBAA3C;EACA,MAAM,CAAC,KAAD,EAAQ,QAAR,IAAoB,KAAK,CAAC,QAAN,CAAe,cAAf,CAA1B,CAFsB,CAItB;EACA;;EACA,IAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;IACzC,IAAI,CAAC,cAAD,IAAmB,CAAC,WAAA,CAAA,SAAA,EAAxB,EAAqC;MACnC;MACA,OAAO,CAAC,KAAR,CACE,CACE,8BADF,EAEE,4GACE,0CAHJ,EAIE,IAJF,EAKE,IALF,EAME,oDANF,EAOE,IAPF,CAOO,EAPP,CADF;IAUD;EACF,CApBqB,CAsBtB;EACA;;;EACA,IAAI,WAAA,CAAA,SAAA,MAAe,cAAnB,EAAmC;IACjC;IACA;IACA;IACA,KAAK,CAAC,eAAN,CAAsB,MAAK;MACzB,QAAQ,CAAC,KAAD,CAAR;IACD,CAFD,EAEG,EAFH;EAGD;;EAED,OAAO,KAAP;AACD;;AAlCD,OAAA,CAAA,QAAA,GAAA,QAAA","sourcesContent":["import * as React from 'react';\nimport { canUseDOM } from './canUseDOM';\n\n/**\n * To support SSR, the auto incrementing id counter is stored in a context. This allows it to be reset on every request\n * to ensure the client and server are consistent.\n *\n * @internal\n */\nexport type SSRContextValue = {\n current: number;\n};\n\n/**\n * Default context value to use in case there is no SSRProvider. This is fine for client-only apps.\n *\n * @internal\n */\nexport const defaultSSRContextValue: SSRContextValue = {\n current: 0,\n};\n\nexport const SSRContext = React.createContext<SSRContextValue | undefined>(undefined) as React.Context<SSRContextValue>;\n\n/**\n * @internal\n */\nexport function useSSRContext(): SSRContextValue {\n return React.useContext(SSRContext) ?? defaultSSRContextValue;\n}\n\n/**\n * When using SSR with Fluent UI, applications must be wrapped in an SSRProvider. This ensures that auto generated ids\n * are consistent between the client and server.\n *\n * @public\n */\nexport const SSRProvider: React.FC = props => {\n const [value] = React.useState<SSRContextValue>(() => ({ current: 0 }));\n\n return <SSRContext.Provider value={value}>{props.children}</SSRContext.Provider>;\n};\n\n/**\n * Returns whether the component is currently being server side rendered or hydrated on the client. Can be used to delay\n * browser-specific rendering until after hydration. May cause re-renders on a client when is used within SSRProvider.\n */\nexport function useIsSSR(): boolean {\n const isInSSRContext = useSSRContext() !== defaultSSRContextValue;\n const [isSSR, setIsSSR] = React.useState(isInSSRContext);\n\n // If we are rendering in a non-DOM environment, and there's no SSRProvider, provide a warning to hint to the\n // developer to add one.\n if (process.env.NODE_ENV !== 'production') {\n if (!isInSSRContext && !canUseDOM()) {\n // eslint-disable-next-line no-console\n console.error(\n [\n '@fluentui/react-components: ',\n 'When server rendering, you must wrap your application in an <SSRProvider> to ensure consistent ids are ' +\n 'generated between the client and server.',\n '\\n',\n '\\n',\n 'Check documentation at https://aka.ms/fluentui-ssr',\n ].join(''),\n );\n }\n }\n\n // If on the client, and the component was initially server rendered, then schedule a layout effect to update the\n // component after hydration.\n if (canUseDOM() && isInSSRContext) {\n // This if statement technically breaks the rules of hooks, but is safe because the condition never changes after\n // mounting.\n // eslint-disable-next-line\n React.useLayoutEffect(() => {\n setIsSSR(false);\n }, []);\n }\n\n return isSSR;\n}\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":";;;;;;AAAA;AACA;AAYA;;;;;AAKaA,8BAAsB,GAAoB;EACrDC,OAAO,EAAE;CACV;AAEYD,kBAAU,gBAAGE,KAAK,CAACC,aAAa,CAA8BC,SAAS,CAAmC;AAEvH;;;AAGA,SAAgBC,aAAa;;EAC3B,OAAO,WAAK,CAACC,UAAU,CAACN,kBAAU,CAAC,mCAAIA,8BAAsB;AAC/D;AAFAA;AAIA;;;;;;AAMO,MAAMO,WAAW,GAAaC,KAAK,IAAG;EAC3C,MAAM,CAACC,KAAK,CAAC,GAAGP,KAAK,CAACQ,QAAQ,CAAkB,OAAO;IAAET,OAAO,EAAE;EAAC,CAAE,CAAC,CAAC;EAEvE,OAAOC,oBAACF,kBAAU,CAACW,QAAQ;IAACF,KAAK,EAAEA;EAAK,GAAGD,KAAK,CAACI,QAAQ,CAAuB;AAClF,CAAC;AAJYZ,mBAAW;AAMxB;;;;AAIA,SAAgBa,QAAQ;EACtB,MAAMC,cAAc,GAAGT,aAAa,EAAE,KAAKL,8BAAsB;EACjE,MAAM,CAACe,KAAK,EAAEC,QAAQ,CAAC,GAAGd,KAAK,CAACQ,QAAQ,CAACI,cAAc,CAAC;EAExD;EACA;EACA,IAAIG,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,EAAE;IACzC,IAAI,CAACL,cAAc,IAAI,CAACM,qBAAS,EAAE,EAAE;MACnC;MACAC,OAAO,CAACC,KAAK,CACX,CACE,8BAA8B,EAC9B,yGAAyG,GACvG,0CAA0C,EAC5C,IAAI,EACJ,IAAI,EACJ,oDAAoD,CACrD,CAACC,IAAI,CAAC,EAAE,CAAC,CACX;;;EAIL;EACA;EACA,IAAIH,qBAAS,EAAE,IAAIN,cAAc,EAAE;IACjC;IACA;IACA;IACAZ,KAAK,CAACsB,eAAe,CAAC,MAAK;MACzBR,QAAQ,CAAC,KAAK,CAAC;IACjB,CAAC,EAAE,EAAE,CAAC;;EAGR,OAAOD,KAAK;AACd;AAlCAf","names":["exports","current","React","createContext","undefined","useSSRContext","useContext","SSRProvider","props","value","useState","Provider","children","useIsSSR","isInSSRContext","isSSR","setIsSSR","process","env","NODE_ENV","canUseDOM_1","console","error","join","useLayoutEffect"],"sourceRoot":"../src/","sources":["packages/react-components/react-utilities/src/ssr/SSRContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport { canUseDOM } from './canUseDOM';\n\n/**\n * To support SSR, the auto incrementing id counter is stored in a context. This allows it to be reset on every request\n * to ensure the client and server are consistent.\n *\n * @internal\n */\nexport type SSRContextValue = {\n current: number;\n};\n\n/**\n * Default context value to use in case there is no SSRProvider. This is fine for client-only apps.\n *\n * @internal\n */\nexport const defaultSSRContextValue: SSRContextValue = {\n current: 0,\n};\n\nexport const SSRContext = React.createContext<SSRContextValue | undefined>(undefined) as React.Context<SSRContextValue>;\n\n/**\n * @internal\n */\nexport function useSSRContext(): SSRContextValue {\n return React.useContext(SSRContext) ?? defaultSSRContextValue;\n}\n\n/**\n * When using SSR with Fluent UI, applications must be wrapped in an SSRProvider. This ensures that auto generated ids\n * are consistent between the client and server.\n *\n * @public\n */\nexport const SSRProvider: React.FC = props => {\n const [value] = React.useState<SSRContextValue>(() => ({ current: 0 }));\n\n return <SSRContext.Provider value={value}>{props.children}</SSRContext.Provider>;\n};\n\n/**\n * Returns whether the component is currently being server side rendered or hydrated on the client. Can be used to delay\n * browser-specific rendering until after hydration. May cause re-renders on a client when is used within SSRProvider.\n */\nexport function useIsSSR(): boolean {\n const isInSSRContext = useSSRContext() !== defaultSSRContextValue;\n const [isSSR, setIsSSR] = React.useState(isInSSRContext);\n\n // If we are rendering in a non-DOM environment, and there's no SSRProvider, provide a warning to hint to the\n // developer to add one.\n if (process.env.NODE_ENV !== 'production') {\n if (!isInSSRContext && !canUseDOM()) {\n // eslint-disable-next-line no-console\n console.error(\n [\n '@fluentui/react-components: ',\n 'When server rendering, you must wrap your application in an <SSRProvider> to ensure consistent ids are ' +\n 'generated between the client and server.',\n '\\n',\n '\\n',\n 'Check documentation at https://aka.ms/fluentui-ssr',\n ].join(''),\n );\n }\n }\n\n // If on the client, and the component was initially server rendered, then schedule a layout effect to update the\n // component after hydration.\n if (canUseDOM() && isInSSRContext) {\n // This if statement technically breaks the rules of hooks, but is safe because the condition never changes after\n // mounting.\n // eslint-disable-next-line\n React.useLayoutEffect(() => {\n setIsSSR(false);\n }, []);\n }\n\n return isSSR;\n}\n"]}