@workday/canvas-kit-react 5.3.5 → 5.3.9

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 (79) hide show
  1. package/common/lib/utils/index.ts +1 -0
  2. package/common/lib/utils/useIsFullscreen.ts +20 -0
  3. package/dist/commonjs/common/lib/utils/index.d.ts +1 -0
  4. package/dist/commonjs/common/lib/utils/index.d.ts.map +1 -1
  5. package/dist/commonjs/common/lib/utils/index.js +1 -0
  6. package/dist/commonjs/common/lib/utils/useIsFullscreen.d.ts +2 -0
  7. package/dist/commonjs/common/lib/utils/useIsFullscreen.d.ts.map +1 -0
  8. package/dist/commonjs/common/lib/utils/useIsFullscreen.js +20 -0
  9. package/dist/commonjs/popup/lib/Popper.d.ts +5 -0
  10. package/dist/commonjs/popup/lib/Popper.d.ts.map +1 -1
  11. package/dist/commonjs/popup/lib/Popper.js +9 -8
  12. package/dist/commonjs/popup/lib/hooks/index.d.ts +3 -0
  13. package/dist/commonjs/popup/lib/hooks/index.d.ts.map +1 -1
  14. package/dist/commonjs/popup/lib/hooks/index.js +3 -0
  15. package/dist/commonjs/popup/lib/hooks/useCloseOnFullscreenExit.d.ts +7 -0
  16. package/dist/commonjs/popup/lib/hooks/useCloseOnFullscreenExit.d.ts.map +1 -0
  17. package/dist/commonjs/popup/lib/hooks/useCloseOnFullscreenExit.js +34 -0
  18. package/dist/commonjs/popup/lib/hooks/useInitialFocus.d.ts.map +1 -1
  19. package/dist/commonjs/popup/lib/hooks/useInitialFocus.js +5 -3
  20. package/dist/commonjs/popup/lib/hooks/usePopupStack.d.ts.map +1 -1
  21. package/dist/commonjs/popup/lib/hooks/usePopupStack.js +1 -1
  22. package/dist/commonjs/popup/lib/hooks/useTransferOnFullscreenEnter.d.ts +10 -0
  23. package/dist/commonjs/popup/lib/hooks/useTransferOnFullscreenEnter.d.ts.map +1 -0
  24. package/dist/commonjs/popup/lib/hooks/useTransferOnFullscreenEnter.js +41 -0
  25. package/dist/commonjs/popup/lib/hooks/useTransferOnFullscreenExit.d.ts +9 -0
  26. package/dist/commonjs/popup/lib/hooks/useTransferOnFullscreenExit.d.ts.map +1 -0
  27. package/dist/commonjs/popup/lib/hooks/useTransferOnFullscreenExit.js +40 -0
  28. package/dist/commonjs/tooltip/lib/useTooltip.d.ts.map +1 -1
  29. package/dist/commonjs/tooltip/lib/useTooltip.js +1 -0
  30. package/dist/es6/common/lib/utils/index.d.ts +1 -0
  31. package/dist/es6/common/lib/utils/index.d.ts.map +1 -1
  32. package/dist/es6/common/lib/utils/index.js +1 -0
  33. package/dist/es6/common/lib/utils/useIsFullscreen.d.ts +2 -0
  34. package/dist/es6/common/lib/utils/useIsFullscreen.d.ts.map +1 -0
  35. package/dist/es6/common/lib/utils/useIsFullscreen.js +15 -0
  36. package/dist/es6/popup/lib/Popper.d.ts +5 -0
  37. package/dist/es6/popup/lib/Popper.d.ts.map +1 -1
  38. package/dist/es6/popup/lib/Popper.js +9 -8
  39. package/dist/es6/popup/lib/hooks/index.d.ts +3 -0
  40. package/dist/es6/popup/lib/hooks/index.d.ts.map +1 -1
  41. package/dist/es6/popup/lib/hooks/index.js +3 -0
  42. package/dist/es6/popup/lib/hooks/useCloseOnFullscreenExit.d.ts +7 -0
  43. package/dist/es6/popup/lib/hooks/useCloseOnFullscreenExit.d.ts.map +1 -0
  44. package/dist/es6/popup/lib/hooks/useCloseOnFullscreenExit.js +29 -0
  45. package/dist/es6/popup/lib/hooks/useInitialFocus.d.ts.map +1 -1
  46. package/dist/es6/popup/lib/hooks/useInitialFocus.js +5 -3
  47. package/dist/es6/popup/lib/hooks/usePopupStack.d.ts.map +1 -1
  48. package/dist/es6/popup/lib/hooks/usePopupStack.js +1 -1
  49. package/dist/es6/popup/lib/hooks/useTransferOnFullscreenEnter.d.ts +10 -0
  50. package/dist/es6/popup/lib/hooks/useTransferOnFullscreenEnter.d.ts.map +1 -0
  51. package/dist/es6/popup/lib/hooks/useTransferOnFullscreenEnter.js +36 -0
  52. package/dist/es6/popup/lib/hooks/useTransferOnFullscreenExit.d.ts +9 -0
  53. package/dist/es6/popup/lib/hooks/useTransferOnFullscreenExit.d.ts.map +1 -0
  54. package/dist/es6/popup/lib/hooks/useTransferOnFullscreenExit.js +35 -0
  55. package/dist/es6/tooltip/lib/useTooltip.d.ts.map +1 -1
  56. package/dist/es6/tooltip/lib/useTooltip.js +2 -1
  57. package/package.json +8 -6
  58. package/popup/lib/Popper.tsx +13 -5
  59. package/popup/lib/hooks/index.ts +3 -0
  60. package/popup/lib/hooks/useCloseOnFullscreenExit.ts +37 -0
  61. package/popup/lib/hooks/useInitialFocus.tsx +3 -1
  62. package/popup/lib/hooks/usePopupStack.ts +2 -1
  63. package/popup/lib/hooks/useTransferOnFullscreenEnter.ts +44 -0
  64. package/popup/lib/hooks/useTransferOnFullscreenExit.ts +43 -0
  65. package/tooltip/lib/useTooltip.tsx +2 -0
  66. package/ts3.5/dist/commonjs/common/lib/utils/index.d.ts +1 -0
  67. package/ts3.5/dist/commonjs/common/lib/utils/useIsFullscreen.d.ts +2 -0
  68. package/ts3.5/dist/commonjs/popup/lib/Popper.d.ts +5 -0
  69. package/ts3.5/dist/commonjs/popup/lib/hooks/index.d.ts +3 -0
  70. package/ts3.5/dist/commonjs/popup/lib/hooks/useCloseOnFullscreenExit.d.ts +7 -0
  71. package/ts3.5/dist/commonjs/popup/lib/hooks/useTransferOnFullscreenEnter.d.ts +10 -0
  72. package/ts3.5/dist/commonjs/popup/lib/hooks/useTransferOnFullscreenExit.d.ts +9 -0
  73. package/ts3.5/dist/es6/common/lib/utils/index.d.ts +1 -0
  74. package/ts3.5/dist/es6/common/lib/utils/useIsFullscreen.d.ts +2 -0
  75. package/ts3.5/dist/es6/popup/lib/Popper.d.ts +5 -0
  76. package/ts3.5/dist/es6/popup/lib/hooks/index.d.ts +3 -0
  77. package/ts3.5/dist/es6/popup/lib/hooks/useCloseOnFullscreenExit.d.ts +7 -0
  78. package/ts3.5/dist/es6/popup/lib/hooks/useTransferOnFullscreenEnter.d.ts +10 -0
  79. package/ts3.5/dist/es6/popup/lib/hooks/useTransferOnFullscreenExit.d.ts +9 -0
@@ -10,5 +10,6 @@ export * from './useMount';
10
10
  export * from './components';
11
11
  export * from './models';
12
12
  export * from './elements';
13
+ export * from './useIsFullscreen';
13
14
  export * from './useWindowSize';
14
15
  export * from './StaticStates';
@@ -0,0 +1,20 @@
1
+ import React from 'react';
2
+ import screenfull from 'screenfull';
3
+
4
+ export const useIsFullscreen = () => {
5
+ const [isFullscreen, setIsFullscreen] = React.useState(false);
6
+
7
+ const handler = React.useCallback(() => {
8
+ setIsFullscreen(screenfull.isFullscreen);
9
+ }, []);
10
+
11
+ React.useEffect(() => {
12
+ screenfull.on('change', handler);
13
+
14
+ return () => {
15
+ screenfull.off('change', handler);
16
+ };
17
+ }, [handler]);
18
+
19
+ return isFullscreen;
20
+ };
@@ -10,6 +10,7 @@ export * from './useMount';
10
10
  export * from './components';
11
11
  export * from './models';
12
12
  export * from './elements';
13
+ export * from './useIsFullscreen';
13
14
  export * from './useWindowSize';
14
15
  export * from './StaticStates';
15
16
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,0BAA0B,CAAC;AACzC,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,0BAA0B,CAAC;AACzC,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC"}
@@ -15,5 +15,6 @@ __export(require("./useMount"));
15
15
  __export(require("./components"));
16
16
  __export(require("./models"));
17
17
  __export(require("./elements"));
18
+ __export(require("./useIsFullscreen"));
18
19
  __export(require("./useWindowSize"));
19
20
  __export(require("./StaticStates"));
@@ -0,0 +1,2 @@
1
+ export declare const useIsFullscreen: () => boolean;
2
+ //# sourceMappingURL=useIsFullscreen.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useIsFullscreen.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/useIsFullscreen.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,eAAe,eAgB3B,CAAC"}
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ var react_1 = __importDefault(require("react"));
7
+ var screenfull_1 = __importDefault(require("screenfull"));
8
+ exports.useIsFullscreen = function () {
9
+ var _a = react_1.default.useState(false), isFullscreen = _a[0], setIsFullscreen = _a[1];
10
+ var handler = react_1.default.useCallback(function () {
11
+ setIsFullscreen(screenfull_1.default.isFullscreen);
12
+ }, []);
13
+ react_1.default.useEffect(function () {
14
+ screenfull_1.default.on('change', handler);
15
+ return function () {
16
+ screenfull_1.default.off('change', handler);
17
+ };
18
+ }, [handler]);
19
+ return isFullscreen;
20
+ };
@@ -65,6 +65,11 @@ export interface PopperProps {
65
65
  * @default true
66
66
  */
67
67
  portal?: boolean;
68
+ /**
69
+ * Reference to the PopperJS instance. Useful for making direct method calls on the popper
70
+ * instance like `update`.
71
+ */
72
+ popperInstanceRef?: React.Ref<PopperJS.Instance>;
68
73
  }
69
74
  export declare const Popper: React.ForwardRefExoticComponent<PopperProps & React.RefAttributes<HTMLDivElement>>;
70
75
  //# sourceMappingURL=Popper.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Popper.d.ts","sourceRoot":"","sources":["../../../../popup/lib/Popper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,QAAQ,MAAM,gBAAgB,CAAC;AAE3C,oBAAY,SAAS,GAAG,QAAQ,CAAC,SAAS,CAAC;AAC3C,oBAAY,aAAa,GAAG,QAAQ,CAAC,OAAO,CAAC;AAI7C,MAAM,WAAW,WAAW;IAC1B;;;;OAIG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC;IAC1D;;;;;OAKG;IACH,QAAQ,EAAE,CAAC,CAAC,KAAK,EAAE;QAAC,SAAS,EAAE,SAAS,CAAA;KAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;IACjF;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAClC;;;;;;OAMG;IACH,mBAAmB,CAAC,EAAE,MAAM,OAAO,CAAC;IACpC;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;IACnD;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IACvC;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,MAAM,oFAQlB,CAAC"}
1
+ {"version":3,"file":"Popper.d.ts","sourceRoot":"","sources":["../../../../popup/lib/Popper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,QAAQ,MAAM,gBAAgB,CAAC;AAE3C,oBAAY,SAAS,GAAG,QAAQ,CAAC,SAAS,CAAC;AAC3C,oBAAY,aAAa,GAAG,QAAQ,CAAC,OAAO,CAAC;AAK7C,MAAM,WAAW,WAAW;IAC1B;;;;OAIG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC;IAC1D;;;;;OAKG;IACH,QAAQ,EAAE,CAAC,CAAC,KAAK,EAAE;QAAC,SAAS,EAAE,SAAS,CAAA;KAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;IACjF;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAClC;;;;;;OAMG;IACH,mBAAmB,CAAC,EAAE,MAAM,OAAO,CAAC;IACpC;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;IACnD;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IACvC;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,MAAM,oFAQlB,CAAC"}
@@ -40,6 +40,7 @@ var React = __importStar(require("react"));
40
40
  var ReactDOM = __importStar(require("react-dom"));
41
41
  var PopperJS = __importStar(require("@popperjs/core"));
42
42
  var hooks_1 = require("./hooks");
43
+ var common_1 = require("@workday/canvas-kit-react/common");
43
44
  exports.Popper = React.forwardRef(function (_a, ref) {
44
45
  var _b = _a.portal, portal = _b === void 0 ? true : _b, _c = _a.open, open = _c === void 0 ? true : _c, elemProps = __rest(_a, ["portal", "open"]);
45
46
  if (!open) {
@@ -63,10 +64,10 @@ var defaultPopperOptions = {};
63
64
  // Popper bails early if `open` is false and React hooks cannot be called conditionally,
64
65
  // so we're breaking out the open version into another component.
65
66
  var OpenPopper = React.forwardRef(function (_a, ref) {
66
- var anchorElement = _a.anchorElement, getAnchorClientRect = _a.getAnchorClientRect, _b = _a.popperOptions, popperOptions = _b === void 0 ? defaultPopperOptions : _b, _c = _a.placement, popperPlacement = _c === void 0 ? 'bottom' : _c, onPlacementChange = _a.onPlacementChange, children = _a.children, portal = _a.portal, containerElement = _a.containerElement;
67
+ var anchorElement = _a.anchorElement, getAnchorClientRect = _a.getAnchorClientRect, _b = _a.popperOptions, popperOptions = _b === void 0 ? defaultPopperOptions : _b, _c = _a.placement, popperPlacement = _c === void 0 ? 'bottom' : _c, onPlacementChange = _a.onPlacementChange, children = _a.children, portal = _a.portal, containerElement = _a.containerElement, popperInstanceRef = _a.popperInstanceRef;
67
68
  var firstRender = React.useRef(true);
68
- var popperInstance = React.useRef();
69
- var _d = React.useState(popperPlacement), placement = _d[0], setPlacement = _d[1];
69
+ var _d = common_1.useLocalRef(popperInstanceRef), localRef = _d.localRef, elementRef = _d.elementRef;
70
+ var _e = React.useState(popperPlacement), placement = _e[0], setPlacement = _e[1];
70
71
  var stackRef = hooks_1.usePopupStack(ref, anchorElement);
71
72
  var placementModifier = React.useMemo(function () {
72
73
  return {
@@ -90,10 +91,10 @@ var OpenPopper = React.forwardRef(function (_a, ref) {
90
91
  return undefined;
91
92
  }
92
93
  if (stackRef.current) {
93
- popperInstance.current = PopperJS.createPopper(anchorEl, stackRef.current, __assign(__assign({ placement: popperPlacement }, popperOptions), { modifiers: __spreadArrays((popperOptions.modifiers || []), [placementModifier]) }));
94
+ var instance_1 = PopperJS.createPopper(anchorEl, stackRef.current, __assign(__assign({ placement: popperPlacement }, popperOptions), { modifiers: __spreadArrays((popperOptions.modifiers || []), [placementModifier]) }));
95
+ elementRef(instance_1); // update the ref with the instance
94
96
  return function () {
95
- var _a;
96
- (_a = popperInstance.current) === null || _a === void 0 ? void 0 : _a.destroy();
97
+ instance_1 === null || instance_1 === void 0 ? void 0 : instance_1.destroy();
97
98
  };
98
99
  }
99
100
  return undefined;
@@ -106,10 +107,10 @@ var OpenPopper = React.forwardRef(function (_a, ref) {
106
107
  var _a;
107
108
  // Only update options if this is _not_ the first render
108
109
  if (!firstRender.current) {
109
- (_a = popperInstance.current) === null || _a === void 0 ? void 0 : _a.setOptions(__assign(__assign({ placement: popperPlacement }, popperOptions), { modifiers: __spreadArrays((popperOptions.modifiers || []), [placementModifier]) }));
110
+ (_a = localRef.current) === null || _a === void 0 ? void 0 : _a.setOptions(__assign(__assign({ placement: popperPlacement }, popperOptions), { modifiers: __spreadArrays((popperOptions.modifiers || []), [placementModifier]) }));
110
111
  }
111
112
  firstRender.current = false;
112
- }, [popperOptions, popperPlacement, placementModifier]);
113
+ }, [popperOptions, popperPlacement, placementModifier, localRef]);
113
114
  var contents = React.createElement(React.Fragment, null, isRenderProp(children) ? children({ placement: placement }) : children);
114
115
  if (!portal) {
115
116
  return contents;
@@ -2,6 +2,7 @@ export * from './useAlwaysCloseOnOutsideClick';
2
2
  export * from './useAssistiveHideSiblings';
3
3
  export * from './useBringToTopOnClick';
4
4
  export * from './useCloseOnEscape';
5
+ export * from './useCloseOnFullscreenExit';
5
6
  export * from './useCloseOnOutsideClick';
6
7
  export * from './useDisableBodyScroll';
7
8
  export * from './useFocusRedirect';
@@ -15,4 +16,6 @@ export * from './usePopupPopper';
15
16
  export * from './usePopupStack';
16
17
  export * from './usePopupTarget';
17
18
  export * from './useReturnFocus';
19
+ export * from './useTransferOnFullscreenEnter';
20
+ export * from './useTransferOnFullscreenExit';
18
21
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC;AAC/C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC;AAC/C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,+BAA+B,CAAC"}
@@ -7,6 +7,7 @@ __export(require("./useAlwaysCloseOnOutsideClick"));
7
7
  __export(require("./useAssistiveHideSiblings"));
8
8
  __export(require("./useBringToTopOnClick"));
9
9
  __export(require("./useCloseOnEscape"));
10
+ __export(require("./useCloseOnFullscreenExit"));
10
11
  __export(require("./useCloseOnOutsideClick"));
11
12
  __export(require("./useDisableBodyScroll"));
12
13
  __export(require("./useFocusRedirect"));
@@ -20,3 +21,5 @@ __export(require("./usePopupPopper"));
20
21
  __export(require("./usePopupStack"));
21
22
  __export(require("./usePopupTarget"));
22
23
  __export(require("./useReturnFocus"));
24
+ __export(require("./useTransferOnFullscreenEnter"));
25
+ __export(require("./useTransferOnFullscreenExit"));
@@ -0,0 +1,7 @@
1
+ /**
2
+ * Closes the popup when fullscreen is exited. Entering/exiting fullscreen changes the context of
3
+ * the entire screen. This should be added to popup types that are very context sensitive like
4
+ * Tooltips.
5
+ */
6
+ export declare const useCloseOnFullscreenExit: (model: import("../../..").Model<import("./usePopupModel").PopupState, import("./usePopupModel").PopupEvents>, elemProps?: {}) => {};
7
+ //# sourceMappingURL=useCloseOnFullscreenExit.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useCloseOnFullscreenExit.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useCloseOnFullscreenExit.ts"],"names":[],"mappings":"AAKA;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,sIA0BpC,CAAC"}
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ var react_1 = __importDefault(require("react"));
7
+ var screenfull_1 = __importDefault(require("screenfull"));
8
+ /**
9
+ * Closes the popup when fullscreen is exited. Entering/exiting fullscreen changes the context of
10
+ * the entire screen. This should be added to popup types that are very context sensitive like
11
+ * Tooltips.
12
+ */
13
+ exports.useCloseOnFullscreenExit = function (model, elemProps) {
14
+ if (elemProps === void 0) { elemProps = {}; }
15
+ var handler = react_1.default.useCallback(function (event) {
16
+ if (!screenfull_1.default.isFullscreen) {
17
+ model.events.hide({ event: event });
18
+ }
19
+ }, [model.events]);
20
+ var visible = model.state.visibility !== 'hidden';
21
+ react_1.default.useEffect(function () {
22
+ if (!visible) {
23
+ return;
24
+ }
25
+ if (screenfull_1.default.isEnabled) {
26
+ screenfull_1.default.on('change', handler);
27
+ return function () {
28
+ screenfull_1.default.off('change', handler);
29
+ };
30
+ }
31
+ return;
32
+ }, [handler, visible]);
33
+ return elemProps;
34
+ };
@@ -1 +1 @@
1
- {"version":3,"file":"useInitialFocus.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useInitialFocus.tsx"],"names":[],"mappings":"AAMA;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,6IAsB3B,CAAC"}
1
+ {"version":3,"file":"useInitialFocus.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useInitialFocus.tsx"],"names":[],"mappings":"AAMA;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,6IAwB3B,CAAC"}
@@ -22,10 +22,12 @@ exports.useInitialFocus = function (model, elemProps) {
22
22
  react_1.default.useEffect(function () {
23
23
  var _a;
24
24
  if (visible && model.state.stackRef.current) {
25
- var element = ((_a = model.state.initialFocusRef) === null || _a === void 0 ? void 0 : _a.current) ||
25
+ var element_1 = ((_a = model.state.initialFocusRef) === null || _a === void 0 ? void 0 : _a.current) ||
26
26
  common_1.getFirstFocusableElement(model.state.stackRef.current);
27
- common_1.assert(element, 'No focusable element was found. Please ensure popup has at least one focusable element');
28
- common_1.changeFocus(element);
27
+ common_1.assert(element_1, 'No focusable element was found. Please ensure popup has at least one focusable element');
28
+ requestAnimationFrame(function () {
29
+ common_1.changeFocus(element_1);
30
+ });
29
31
  }
30
32
  }, [model.state.initialFocusRef, model.state.stackRef, visible]);
31
33
  return elemProps;
@@ -1 +1 @@
1
- {"version":3,"file":"usePopupStack.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupStack.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,aAAa,wMA6CzB,CAAC"}
1
+ {"version":3,"file":"usePopupStack.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupStack.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,aAAa,wMA8CzB,CAAC"}
@@ -61,8 +61,8 @@ exports.usePopupStack = function (ref, target) {
61
61
  ? target.current || undefined
62
62
  : target
63
63
  : undefined;
64
- canvas_kit_popup_stack_1.PopupStack.add({ element: localRef.current, owner: targetEl });
65
64
  var element = localRef.current;
65
+ canvas_kit_popup_stack_1.PopupStack.add({ element: element, owner: targetEl });
66
66
  return function () {
67
67
  canvas_kit_popup_stack_1.PopupStack.remove(element);
68
68
  };
@@ -0,0 +1,10 @@
1
+ /**
2
+ * Makes the popup transfer to the fullscreen element when fullscreen is entered. Without this, the
3
+ * popup would seem to disappear because the popup container element is not a child of the
4
+ * fullscreen element.
5
+ *
6
+ * Don't use this in conjunction with a hook that will close the popup when entering fullscreen.
7
+ * Doing so would open the popup when the intention was to close it.
8
+ */
9
+ export declare const useTransferOnFullscreenEnter: (model: import("../../..").Model<import("./usePopupModel").PopupState, import("./usePopupModel").PopupEvents>, elemProps?: {}) => {};
10
+ //# sourceMappingURL=useTransferOnFullscreenEnter.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useTransferOnFullscreenEnter.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useTransferOnFullscreenEnter.ts"],"names":[],"mappings":"AAMA;;;;;;;GAOG;AACH,eAAO,MAAM,4BAA4B,sIA6BxC,CAAC"}
@@ -0,0 +1,41 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ var react_1 = __importDefault(require("react"));
7
+ var screenfull_1 = __importDefault(require("screenfull"));
8
+ var canvas_kit_popup_stack_1 = require("@workday/canvas-kit-popup-stack");
9
+ /**
10
+ * Makes the popup transfer to the fullscreen element when fullscreen is entered. Without this, the
11
+ * popup would seem to disappear because the popup container element is not a child of the
12
+ * fullscreen element.
13
+ *
14
+ * Don't use this in conjunction with a hook that will close the popup when entering fullscreen.
15
+ * Doing so would open the popup when the intention was to close it.
16
+ */
17
+ exports.useTransferOnFullscreenEnter = function (model, elemProps) {
18
+ if (elemProps === void 0) { elemProps = {}; }
19
+ var handler = react_1.default.useCallback(function (event) {
20
+ if (screenfull_1.default.isFullscreen && model.state.stackRef.current) {
21
+ canvas_kit_popup_stack_1.PopupStack.transferToCurrentContext({
22
+ element: model.state.stackRef.current,
23
+ owner: model.state.targetRef.current,
24
+ });
25
+ }
26
+ }, [model.state.stackRef, model.state.targetRef]);
27
+ var visible = model.state.visibility !== 'hidden';
28
+ react_1.default.useEffect(function () {
29
+ if (!visible) {
30
+ return;
31
+ }
32
+ if (screenfull_1.default.isEnabled) {
33
+ screenfull_1.default.on('change', handler);
34
+ return function () {
35
+ screenfull_1.default.off('change', handler);
36
+ };
37
+ }
38
+ return;
39
+ }, [handler, visible]);
40
+ return elemProps;
41
+ };
@@ -0,0 +1,9 @@
1
+ /**
2
+ * Makes the popup transfer to fullscreen when fullscreen is exited. Without this hook, the popup
3
+ * would not operate correctly with other popups on the screen.
4
+ *
5
+ * Don't use this in conjunction with a hook that will close the popup when exiting fullscreen.
6
+ * Doing so would open the popup when the intention was to close it.
7
+ */
8
+ export declare const useTransferOnFullscreenExit: (model: import("../../..").Model<import("./usePopupModel").PopupState, import("./usePopupModel").PopupEvents>, elemProps?: {}) => {};
9
+ //# sourceMappingURL=useTransferOnFullscreenExit.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useTransferOnFullscreenExit.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useTransferOnFullscreenExit.ts"],"names":[],"mappings":"AAMA;;;;;;GAMG;AACH,eAAO,MAAM,2BAA2B,sIA6BvC,CAAC"}
@@ -0,0 +1,40 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ var react_1 = __importDefault(require("react"));
7
+ var screenfull_1 = __importDefault(require("screenfull"));
8
+ var canvas_kit_popup_stack_1 = require("@workday/canvas-kit-popup-stack");
9
+ /**
10
+ * Makes the popup transfer to fullscreen when fullscreen is exited. Without this hook, the popup
11
+ * would not operate correctly with other popups on the screen.
12
+ *
13
+ * Don't use this in conjunction with a hook that will close the popup when exiting fullscreen.
14
+ * Doing so would open the popup when the intention was to close it.
15
+ */
16
+ exports.useTransferOnFullscreenExit = function (model, elemProps) {
17
+ if (elemProps === void 0) { elemProps = {}; }
18
+ var handler = react_1.default.useCallback(function (event) {
19
+ if (!screenfull_1.default.isFullscreen && model.state.stackRef.current) {
20
+ canvas_kit_popup_stack_1.PopupStack.transferToCurrentContext({
21
+ element: model.state.stackRef.current,
22
+ owner: model.state.targetRef.current,
23
+ });
24
+ }
25
+ }, [model.state.stackRef, model.state.targetRef]);
26
+ var visible = model.state.visibility !== 'hidden';
27
+ react_1.default.useEffect(function () {
28
+ if (!visible) {
29
+ return;
30
+ }
31
+ if (screenfull_1.default.isEnabled) {
32
+ screenfull_1.default.on('change', handler);
33
+ return function () {
34
+ screenfull_1.default.off('change', handler);
35
+ };
36
+ }
37
+ return;
38
+ }, [handler, visible]);
39
+ return elemProps;
40
+ };
@@ -1 +1 @@
1
- {"version":3,"file":"useTooltip.d.ts","sourceRoot":"","sources":["../../../../tooltip/lib/useTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAiD/B;;;GAGG;AACH,wBAAgB,UAAU,CAAC,CAAC,SAAS,OAAO,GAAG,OAAO,EAAE,EACtD,IAAc,EACd,SAAc,EACd,SAAe,EACf,SAAe,GAChB,GAAE;IACD;;;;;;;;;;;;;;;OAeG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,OAAO,CAAC;IACtC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACf;IA4CF,2EAA2E;;;;;;;;;;IAY3E,uDAAuD;;;;;;IAMvD,iEAAiE;;;;;;;EAQpE"}
1
+ {"version":3,"file":"useTooltip.d.ts","sourceRoot":"","sources":["../../../../tooltip/lib/useTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAkD/B;;;GAGG;AACH,wBAAgB,UAAU,CAAC,CAAC,SAAS,OAAO,GAAG,OAAO,EAAE,EACtD,IAAc,EACd,SAAc,EACd,SAAe,EACf,SAAe,GAChB,GAAE;IACD;;;;;;;;;;;;;;;OAeG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,OAAO,CAAC;IACtC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACf;IA6CF,2EAA2E;;;;;;;;;;IAY3E,uDAAuD;;;;;;IAMvD,iEAAiE;;;;;;;EAQpE"}
@@ -86,6 +86,7 @@ function useTooltip(_a) {
86
86
  };
87
87
  popup_1.useCloseOnEscape(popupModel);
88
88
  popup_1.useAlwaysCloseOnOutsideClick(popupModel);
89
+ popup_1.useCloseOnFullscreenExit(popupModel);
89
90
  var visible = popupModel.state.visibility !== 'hidden';
90
91
  return {
91
92
  /** Mix these properties into the target element. **Must be an Element** */
@@ -10,6 +10,7 @@ export * from './useMount';
10
10
  export * from './components';
11
11
  export * from './models';
12
12
  export * from './elements';
13
+ export * from './useIsFullscreen';
13
14
  export * from './useWindowSize';
14
15
  export * from './StaticStates';
15
16
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,0BAA0B,CAAC;AACzC,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,0BAA0B,CAAC;AACzC,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC"}
@@ -10,5 +10,6 @@ export * from './useMount';
10
10
  export * from './components';
11
11
  export * from './models';
12
12
  export * from './elements';
13
+ export * from './useIsFullscreen';
13
14
  export * from './useWindowSize';
14
15
  export * from './StaticStates';
@@ -0,0 +1,2 @@
1
+ export declare const useIsFullscreen: () => boolean;
2
+ //# sourceMappingURL=useIsFullscreen.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useIsFullscreen.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/useIsFullscreen.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,eAAe,eAgB3B,CAAC"}
@@ -0,0 +1,15 @@
1
+ import React from 'react';
2
+ import screenfull from 'screenfull';
3
+ export var useIsFullscreen = function () {
4
+ var _a = React.useState(false), isFullscreen = _a[0], setIsFullscreen = _a[1];
5
+ var handler = React.useCallback(function () {
6
+ setIsFullscreen(screenfull.isFullscreen);
7
+ }, []);
8
+ React.useEffect(function () {
9
+ screenfull.on('change', handler);
10
+ return function () {
11
+ screenfull.off('change', handler);
12
+ };
13
+ }, [handler]);
14
+ return isFullscreen;
15
+ };
@@ -65,6 +65,11 @@ export interface PopperProps {
65
65
  * @default true
66
66
  */
67
67
  portal?: boolean;
68
+ /**
69
+ * Reference to the PopperJS instance. Useful for making direct method calls on the popper
70
+ * instance like `update`.
71
+ */
72
+ popperInstanceRef?: React.Ref<PopperJS.Instance>;
68
73
  }
69
74
  export declare const Popper: React.ForwardRefExoticComponent<PopperProps & React.RefAttributes<HTMLDivElement>>;
70
75
  //# sourceMappingURL=Popper.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Popper.d.ts","sourceRoot":"","sources":["../../../../popup/lib/Popper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,QAAQ,MAAM,gBAAgB,CAAC;AAE3C,oBAAY,SAAS,GAAG,QAAQ,CAAC,SAAS,CAAC;AAC3C,oBAAY,aAAa,GAAG,QAAQ,CAAC,OAAO,CAAC;AAI7C,MAAM,WAAW,WAAW;IAC1B;;;;OAIG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC;IAC1D;;;;;OAKG;IACH,QAAQ,EAAE,CAAC,CAAC,KAAK,EAAE;QAAC,SAAS,EAAE,SAAS,CAAA;KAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;IACjF;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAClC;;;;;;OAMG;IACH,mBAAmB,CAAC,EAAE,MAAM,OAAO,CAAC;IACpC;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;IACnD;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IACvC;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,MAAM,oFAQlB,CAAC"}
1
+ {"version":3,"file":"Popper.d.ts","sourceRoot":"","sources":["../../../../popup/lib/Popper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,QAAQ,MAAM,gBAAgB,CAAC;AAE3C,oBAAY,SAAS,GAAG,QAAQ,CAAC,SAAS,CAAC;AAC3C,oBAAY,aAAa,GAAG,QAAQ,CAAC,OAAO,CAAC;AAK7C,MAAM,WAAW,WAAW;IAC1B;;;;OAIG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC;IAC1D;;;;;OAKG;IACH,QAAQ,EAAE,CAAC,CAAC,KAAK,EAAE;QAAC,SAAS,EAAE,SAAS,CAAA;KAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;IACjF;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAClC;;;;;;OAMG;IACH,mBAAmB,CAAC,EAAE,MAAM,OAAO,CAAC;IACpC;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;IACnD;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IACvC;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,MAAM,oFAQlB,CAAC"}
@@ -31,6 +31,7 @@ import * as React from 'react';
31
31
  import * as ReactDOM from 'react-dom';
32
32
  import * as PopperJS from '@popperjs/core';
33
33
  import { usePopupStack } from './hooks';
34
+ import { useLocalRef } from '@workday/canvas-kit-react/common';
34
35
  export var Popper = React.forwardRef(function (_a, ref) {
35
36
  var _b = _a.portal, portal = _b === void 0 ? true : _b, _c = _a.open, open = _c === void 0 ? true : _c, elemProps = __rest(_a, ["portal", "open"]);
36
37
  if (!open) {
@@ -54,10 +55,10 @@ var defaultPopperOptions = {};
54
55
  // Popper bails early if `open` is false and React hooks cannot be called conditionally,
55
56
  // so we're breaking out the open version into another component.
56
57
  var OpenPopper = React.forwardRef(function (_a, ref) {
57
- var anchorElement = _a.anchorElement, getAnchorClientRect = _a.getAnchorClientRect, _b = _a.popperOptions, popperOptions = _b === void 0 ? defaultPopperOptions : _b, _c = _a.placement, popperPlacement = _c === void 0 ? 'bottom' : _c, onPlacementChange = _a.onPlacementChange, children = _a.children, portal = _a.portal, containerElement = _a.containerElement;
58
+ var anchorElement = _a.anchorElement, getAnchorClientRect = _a.getAnchorClientRect, _b = _a.popperOptions, popperOptions = _b === void 0 ? defaultPopperOptions : _b, _c = _a.placement, popperPlacement = _c === void 0 ? 'bottom' : _c, onPlacementChange = _a.onPlacementChange, children = _a.children, portal = _a.portal, containerElement = _a.containerElement, popperInstanceRef = _a.popperInstanceRef;
58
59
  var firstRender = React.useRef(true);
59
- var popperInstance = React.useRef();
60
- var _d = React.useState(popperPlacement), placement = _d[0], setPlacement = _d[1];
60
+ var _d = useLocalRef(popperInstanceRef), localRef = _d.localRef, elementRef = _d.elementRef;
61
+ var _e = React.useState(popperPlacement), placement = _e[0], setPlacement = _e[1];
61
62
  var stackRef = usePopupStack(ref, anchorElement);
62
63
  var placementModifier = React.useMemo(function () {
63
64
  return {
@@ -81,10 +82,10 @@ var OpenPopper = React.forwardRef(function (_a, ref) {
81
82
  return undefined;
82
83
  }
83
84
  if (stackRef.current) {
84
- popperInstance.current = PopperJS.createPopper(anchorEl, stackRef.current, __assign(__assign({ placement: popperPlacement }, popperOptions), { modifiers: __spreadArrays((popperOptions.modifiers || []), [placementModifier]) }));
85
+ var instance_1 = PopperJS.createPopper(anchorEl, stackRef.current, __assign(__assign({ placement: popperPlacement }, popperOptions), { modifiers: __spreadArrays((popperOptions.modifiers || []), [placementModifier]) }));
86
+ elementRef(instance_1); // update the ref with the instance
85
87
  return function () {
86
- var _a;
87
- (_a = popperInstance.current) === null || _a === void 0 ? void 0 : _a.destroy();
88
+ instance_1 === null || instance_1 === void 0 ? void 0 : instance_1.destroy();
88
89
  };
89
90
  }
90
91
  return undefined;
@@ -97,10 +98,10 @@ var OpenPopper = React.forwardRef(function (_a, ref) {
97
98
  var _a;
98
99
  // Only update options if this is _not_ the first render
99
100
  if (!firstRender.current) {
100
- (_a = popperInstance.current) === null || _a === void 0 ? void 0 : _a.setOptions(__assign(__assign({ placement: popperPlacement }, popperOptions), { modifiers: __spreadArrays((popperOptions.modifiers || []), [placementModifier]) }));
101
+ (_a = localRef.current) === null || _a === void 0 ? void 0 : _a.setOptions(__assign(__assign({ placement: popperPlacement }, popperOptions), { modifiers: __spreadArrays((popperOptions.modifiers || []), [placementModifier]) }));
101
102
  }
102
103
  firstRender.current = false;
103
- }, [popperOptions, popperPlacement, placementModifier]);
104
+ }, [popperOptions, popperPlacement, placementModifier, localRef]);
104
105
  var contents = React.createElement(React.Fragment, null, isRenderProp(children) ? children({ placement: placement }) : children);
105
106
  if (!portal) {
106
107
  return contents;
@@ -2,6 +2,7 @@ export * from './useAlwaysCloseOnOutsideClick';
2
2
  export * from './useAssistiveHideSiblings';
3
3
  export * from './useBringToTopOnClick';
4
4
  export * from './useCloseOnEscape';
5
+ export * from './useCloseOnFullscreenExit';
5
6
  export * from './useCloseOnOutsideClick';
6
7
  export * from './useDisableBodyScroll';
7
8
  export * from './useFocusRedirect';
@@ -15,4 +16,6 @@ export * from './usePopupPopper';
15
16
  export * from './usePopupStack';
16
17
  export * from './usePopupTarget';
17
18
  export * from './useReturnFocus';
19
+ export * from './useTransferOnFullscreenEnter';
20
+ export * from './useTransferOnFullscreenExit';
18
21
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC;AAC/C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC;AAC/C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,+BAA+B,CAAC"}
@@ -2,6 +2,7 @@ export * from './useAlwaysCloseOnOutsideClick';
2
2
  export * from './useAssistiveHideSiblings';
3
3
  export * from './useBringToTopOnClick';
4
4
  export * from './useCloseOnEscape';
5
+ export * from './useCloseOnFullscreenExit';
5
6
  export * from './useCloseOnOutsideClick';
6
7
  export * from './useDisableBodyScroll';
7
8
  export * from './useFocusRedirect';
@@ -15,3 +16,5 @@ export * from './usePopupPopper';
15
16
  export * from './usePopupStack';
16
17
  export * from './usePopupTarget';
17
18
  export * from './useReturnFocus';
19
+ export * from './useTransferOnFullscreenEnter';
20
+ export * from './useTransferOnFullscreenExit';
@@ -0,0 +1,7 @@
1
+ /**
2
+ * Closes the popup when fullscreen is exited. Entering/exiting fullscreen changes the context of
3
+ * the entire screen. This should be added to popup types that are very context sensitive like
4
+ * Tooltips.
5
+ */
6
+ export declare const useCloseOnFullscreenExit: (model: import("../../..").Model<import("./usePopupModel").PopupState, import("./usePopupModel").PopupEvents>, elemProps?: {}) => {};
7
+ //# sourceMappingURL=useCloseOnFullscreenExit.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useCloseOnFullscreenExit.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useCloseOnFullscreenExit.ts"],"names":[],"mappings":"AAKA;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,sIA0BpC,CAAC"}
@@ -0,0 +1,29 @@
1
+ import React from 'react';
2
+ import screenfull from 'screenfull';
3
+ /**
4
+ * Closes the popup when fullscreen is exited. Entering/exiting fullscreen changes the context of
5
+ * the entire screen. This should be added to popup types that are very context sensitive like
6
+ * Tooltips.
7
+ */
8
+ export var useCloseOnFullscreenExit = function (model, elemProps) {
9
+ if (elemProps === void 0) { elemProps = {}; }
10
+ var handler = React.useCallback(function (event) {
11
+ if (!screenfull.isFullscreen) {
12
+ model.events.hide({ event: event });
13
+ }
14
+ }, [model.events]);
15
+ var visible = model.state.visibility !== 'hidden';
16
+ React.useEffect(function () {
17
+ if (!visible) {
18
+ return;
19
+ }
20
+ if (screenfull.isEnabled) {
21
+ screenfull.on('change', handler);
22
+ return function () {
23
+ screenfull.off('change', handler);
24
+ };
25
+ }
26
+ return;
27
+ }, [handler, visible]);
28
+ return elemProps;
29
+ };
@@ -1 +1 @@
1
- {"version":3,"file":"useInitialFocus.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useInitialFocus.tsx"],"names":[],"mappings":"AAMA;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,6IAsB3B,CAAC"}
1
+ {"version":3,"file":"useInitialFocus.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useInitialFocus.tsx"],"names":[],"mappings":"AAMA;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,6IAwB3B,CAAC"}