@wordpress/compose 6.11.0 → 6.12.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (124) hide show
  1. package/CHANGELOG.md +2 -0
  2. package/build/higher-order/if-condition/index.js +2 -1
  3. package/build/higher-order/if-condition/index.js.map +1 -1
  4. package/build/higher-order/pipe.js +6 -19
  5. package/build/higher-order/pipe.js.map +1 -1
  6. package/build/higher-order/pure/index.js +2 -1
  7. package/build/higher-order/pure/index.js.map +1 -1
  8. package/build/higher-order/with-global-events/index.js +2 -4
  9. package/build/higher-order/with-global-events/index.js.map +1 -1
  10. package/build/higher-order/with-global-events/listener.js +1 -3
  11. package/build/higher-order/with-global-events/listener.js.map +1 -1
  12. package/build/higher-order/with-instance-id/index.js +2 -4
  13. package/build/higher-order/with-instance-id/index.js.map +1 -1
  14. package/build/higher-order/with-preferred-color-scheme/index.native.js +4 -5
  15. package/build/higher-order/with-preferred-color-scheme/index.native.js.map +1 -1
  16. package/build/higher-order/with-safe-timeout/index.js +2 -6
  17. package/build/higher-order/with-safe-timeout/index.js.map +1 -1
  18. package/build/higher-order/with-state/index.js +4 -6
  19. package/build/higher-order/with-state/index.js.map +1 -1
  20. package/build/hooks/use-async-list/index.js +3 -4
  21. package/build/hooks/use-async-list/index.js.map +1 -1
  22. package/build/hooks/use-constrained-tabbing/index.js +1 -1
  23. package/build/hooks/use-constrained-tabbing/index.js.map +1 -1
  24. package/build/hooks/use-copy-on-click/index.js +5 -8
  25. package/build/hooks/use-copy-on-click/index.js.map +1 -1
  26. package/build/hooks/use-copy-to-clipboard/index.js +3 -4
  27. package/build/hooks/use-copy-to-clipboard/index.js.map +1 -1
  28. package/build/hooks/use-dialog/index.js +3 -7
  29. package/build/hooks/use-dialog/index.js.map +1 -1
  30. package/build/hooks/use-disabled/index.js +4 -7
  31. package/build/hooks/use-disabled/index.js.map +1 -1
  32. package/build/hooks/use-dragging/index.js +5 -6
  33. package/build/hooks/use-dragging/index.js.map +1 -1
  34. package/build/hooks/use-drop-zone/index.js +27 -21
  35. package/build/hooks/use-drop-zone/index.js.map +1 -1
  36. package/build/hooks/use-fixed-window-list/index.js +14 -22
  37. package/build/hooks/use-fixed-window-list/index.js.map +1 -1
  38. package/build/hooks/use-focus-on-mount/index.js +3 -4
  39. package/build/hooks/use-focus-on-mount/index.js.map +1 -1
  40. package/build/hooks/use-focus-outside/index.js +1 -3
  41. package/build/hooks/use-focus-outside/index.js.map +1 -1
  42. package/build/hooks/use-focus-return/index.js +3 -7
  43. package/build/hooks/use-focus-return/index.js.map +1 -1
  44. package/build/hooks/use-keyboard-shortcut/index.js +14 -14
  45. package/build/hooks/use-keyboard-shortcut/index.js.map +1 -1
  46. package/build/hooks/use-media-query/index.js +1 -1
  47. package/build/hooks/use-media-query/index.js.map +1 -1
  48. package/build/hooks/use-preferred-color-scheme/index.android.js +3 -4
  49. package/build/hooks/use-preferred-color-scheme/index.android.js.map +1 -1
  50. package/build/hooks/use-resize-observer/index.js +1 -2
  51. package/build/hooks/use-resize-observer/index.js.map +1 -1
  52. package/build/hooks/use-resize-observer/index.native.js +3 -4
  53. package/build/hooks/use-resize-observer/index.native.js.map +1 -1
  54. package/build/hooks/use-viewport-match/index.js +1 -2
  55. package/build/hooks/use-viewport-match/index.js.map +1 -1
  56. package/build/hooks/use-warn-on-change/index.js +2 -5
  57. package/build/hooks/use-warn-on-change/index.js.map +1 -1
  58. package/build/utils/debounce/index.js +1 -6
  59. package/build/utils/debounce/index.js.map +1 -1
  60. package/build-module/higher-order/if-condition/index.js +2 -1
  61. package/build-module/higher-order/if-condition/index.js.map +1 -1
  62. package/build-module/higher-order/pipe.js +6 -19
  63. package/build-module/higher-order/pipe.js.map +1 -1
  64. package/build-module/higher-order/pure/index.js +2 -1
  65. package/build-module/higher-order/pure/index.js.map +1 -1
  66. package/build-module/higher-order/with-global-events/index.js +2 -3
  67. package/build-module/higher-order/with-global-events/index.js.map +1 -1
  68. package/build-module/higher-order/with-global-events/listener.js +1 -3
  69. package/build-module/higher-order/with-global-events/listener.js.map +1 -1
  70. package/build-module/higher-order/with-instance-id/index.js +2 -3
  71. package/build-module/higher-order/with-instance-id/index.js.map +1 -1
  72. package/build-module/higher-order/with-preferred-color-scheme/index.native.js +4 -4
  73. package/build-module/higher-order/with-preferred-color-scheme/index.native.js.map +1 -1
  74. package/build-module/higher-order/with-safe-timeout/index.js +2 -3
  75. package/build-module/higher-order/with-safe-timeout/index.js.map +1 -1
  76. package/build-module/higher-order/with-state/index.js +4 -5
  77. package/build-module/higher-order/with-state/index.js.map +1 -1
  78. package/build-module/hooks/use-async-list/index.js +3 -4
  79. package/build-module/hooks/use-async-list/index.js.map +1 -1
  80. package/build-module/hooks/use-constrained-tabbing/index.js +1 -1
  81. package/build-module/hooks/use-constrained-tabbing/index.js.map +1 -1
  82. package/build-module/hooks/use-copy-on-click/index.js +5 -8
  83. package/build-module/hooks/use-copy-on-click/index.js.map +1 -1
  84. package/build-module/hooks/use-copy-to-clipboard/index.js +3 -4
  85. package/build-module/hooks/use-copy-to-clipboard/index.js.map +1 -1
  86. package/build-module/hooks/use-dialog/index.js +3 -7
  87. package/build-module/hooks/use-dialog/index.js.map +1 -1
  88. package/build-module/hooks/use-disabled/index.js +4 -7
  89. package/build-module/hooks/use-disabled/index.js.map +1 -1
  90. package/build-module/hooks/use-dragging/index.js +5 -6
  91. package/build-module/hooks/use-dragging/index.js.map +1 -1
  92. package/build-module/hooks/use-drop-zone/index.js +27 -21
  93. package/build-module/hooks/use-drop-zone/index.js.map +1 -1
  94. package/build-module/hooks/use-fixed-window-list/index.js +14 -22
  95. package/build-module/hooks/use-fixed-window-list/index.js.map +1 -1
  96. package/build-module/hooks/use-focus-on-mount/index.js +3 -4
  97. package/build-module/hooks/use-focus-on-mount/index.js.map +1 -1
  98. package/build-module/hooks/use-focus-outside/index.js +1 -3
  99. package/build-module/hooks/use-focus-outside/index.js.map +1 -1
  100. package/build-module/hooks/use-focus-return/index.js +3 -7
  101. package/build-module/hooks/use-focus-return/index.js.map +1 -1
  102. package/build-module/hooks/use-keyboard-shortcut/index.js +14 -14
  103. package/build-module/hooks/use-keyboard-shortcut/index.js.map +1 -1
  104. package/build-module/hooks/use-media-query/index.js +1 -1
  105. package/build-module/hooks/use-media-query/index.js.map +1 -1
  106. package/build-module/hooks/use-preferred-color-scheme/index.android.js +3 -4
  107. package/build-module/hooks/use-preferred-color-scheme/index.android.js.map +1 -1
  108. package/build-module/hooks/use-resize-observer/index.js +1 -2
  109. package/build-module/hooks/use-resize-observer/index.js.map +1 -1
  110. package/build-module/hooks/use-resize-observer/index.native.js +3 -4
  111. package/build-module/hooks/use-resize-observer/index.native.js.map +1 -1
  112. package/build-module/hooks/use-viewport-match/index.js +1 -2
  113. package/build-module/hooks/use-viewport-match/index.js.map +1 -1
  114. package/build-module/hooks/use-warn-on-change/index.js +2 -5
  115. package/build-module/hooks/use-warn-on-change/index.js.map +1 -1
  116. package/build-module/utils/debounce/index.js +1 -6
  117. package/build-module/utils/debounce/index.js.map +1 -1
  118. package/build-types/hooks/use-drop-zone/index.d.ts +11 -9
  119. package/build-types/hooks/use-drop-zone/index.d.ts.map +1 -1
  120. package/package.json +8 -8
  121. package/src/hooks/use-drop-zone/README.md +71 -0
  122. package/src/hooks/use-drop-zone/index.js +17 -10
  123. package/src/hooks/use-drop-zone/test/index.js +63 -0
  124. package/tsconfig.tsbuildinfo +1 -1
@@ -39,8 +39,8 @@ const DEFAULT_INIT_WINDOW_SIZE = 30;
39
39
  export default function useFixedWindowList(elementRef, itemHeight, totalItems, options) {
40
40
  var _options$initWindowSi, _options$useWindowing;
41
41
 
42
- const initWindowSize = (_options$initWindowSi = options === null || options === void 0 ? void 0 : options.initWindowSize) !== null && _options$initWindowSi !== void 0 ? _options$initWindowSi : DEFAULT_INIT_WINDOW_SIZE;
43
- const useWindowing = (_options$useWindowing = options === null || options === void 0 ? void 0 : options.useWindowing) !== null && _options$useWindowing !== void 0 ? _options$useWindowing : true;
42
+ const initWindowSize = (_options$initWindowSi = options?.initWindowSize) !== null && _options$initWindowSi !== void 0 ? _options$initWindowSi : DEFAULT_INIT_WINDOW_SIZE;
43
+ const useWindowing = (_options$useWindowing = options?.useWindowing) !== null && _options$useWindowing !== void 0 ? _options$useWindowing : true;
44
44
  const [fixedListWindow, setFixedListWindow] = useState({
45
45
  visibleItems: initWindowSize,
46
46
  start: 0,
@@ -52,8 +52,6 @@ export default function useFixedWindowList(elementRef, itemHeight, totalItems, o
52
52
  }
53
53
  });
54
54
  useLayoutEffect(() => {
55
- var _scrollContainer$owne, _scrollContainer$owne2, _scrollContainer$owne3, _scrollContainer$owne4;
56
-
57
55
  if (!useWindowing) {
58
56
  return;
59
57
  }
@@ -71,7 +69,7 @@ export default function useFixedWindowList(elementRef, itemHeight, totalItems, o
71
69
 
72
70
  const visibleItems = Math.ceil(scrollContainer.clientHeight / itemHeight); // Aim to keep opening list view fast, afterward we can optimize for scrolling.
73
71
 
74
- const windowOverscan = initRender ? visibleItems : (_options$windowOversc = options === null || options === void 0 ? void 0 : options.windowOverscan) !== null && _options$windowOversc !== void 0 ? _options$windowOversc : visibleItems;
72
+ const windowOverscan = initRender ? visibleItems : (_options$windowOversc = options?.windowOverscan) !== null && _options$windowOversc !== void 0 ? _options$windowOversc : visibleItems;
75
73
  const firstViewableIndex = Math.floor(scrollContainer.scrollTop / itemHeight);
76
74
  const start = Math.max(0, firstViewableIndex - windowOverscan);
77
75
  const end = Math.min(totalItems - 1, firstViewableIndex + visibleItems + windowOverscan);
@@ -99,19 +97,15 @@ export default function useFixedWindowList(elementRef, itemHeight, totalItems, o
99
97
  const debounceMeasureList = debounce(() => {
100
98
  measureWindow();
101
99
  }, 16);
102
- scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.addEventListener('scroll', debounceMeasureList);
103
- scrollContainer === null || scrollContainer === void 0 ? void 0 : (_scrollContainer$owne = scrollContainer.ownerDocument) === null || _scrollContainer$owne === void 0 ? void 0 : (_scrollContainer$owne2 = _scrollContainer$owne.defaultView) === null || _scrollContainer$owne2 === void 0 ? void 0 : _scrollContainer$owne2.addEventListener('resize', debounceMeasureList);
104
- scrollContainer === null || scrollContainer === void 0 ? void 0 : (_scrollContainer$owne3 = scrollContainer.ownerDocument) === null || _scrollContainer$owne3 === void 0 ? void 0 : (_scrollContainer$owne4 = _scrollContainer$owne3.defaultView) === null || _scrollContainer$owne4 === void 0 ? void 0 : _scrollContainer$owne4.addEventListener('resize', debounceMeasureList);
100
+ scrollContainer?.addEventListener('scroll', debounceMeasureList);
101
+ scrollContainer?.ownerDocument?.defaultView?.addEventListener('resize', debounceMeasureList);
102
+ scrollContainer?.ownerDocument?.defaultView?.addEventListener('resize', debounceMeasureList);
105
103
  return () => {
106
- var _scrollContainer$owne5, _scrollContainer$owne6;
107
-
108
- scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.removeEventListener('scroll', debounceMeasureList);
109
- scrollContainer === null || scrollContainer === void 0 ? void 0 : (_scrollContainer$owne5 = scrollContainer.ownerDocument) === null || _scrollContainer$owne5 === void 0 ? void 0 : (_scrollContainer$owne6 = _scrollContainer$owne5.defaultView) === null || _scrollContainer$owne6 === void 0 ? void 0 : _scrollContainer$owne6.removeEventListener('resize', debounceMeasureList);
104
+ scrollContainer?.removeEventListener('scroll', debounceMeasureList);
105
+ scrollContainer?.ownerDocument?.defaultView?.removeEventListener('resize', debounceMeasureList);
110
106
  };
111
107
  }, [itemHeight, elementRef, totalItems]);
112
108
  useLayoutEffect(() => {
113
- var _scrollContainer$owne7, _scrollContainer$owne8;
114
-
115
109
  if (!useWindowing) {
116
110
  return;
117
111
  }
@@ -124,39 +118,37 @@ export default function useFixedWindowList(elementRef, itemHeight, totalItems, o
124
118
  switch (event.keyCode) {
125
119
  case HOME:
126
120
  {
127
- return scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollTo({
121
+ return scrollContainer?.scrollTo({
128
122
  top: 0
129
123
  });
130
124
  }
131
125
 
132
126
  case END:
133
127
  {
134
- return scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollTo({
128
+ return scrollContainer?.scrollTo({
135
129
  top: totalItems * itemHeight
136
130
  });
137
131
  }
138
132
 
139
133
  case PAGEUP:
140
134
  {
141
- return scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollTo({
135
+ return scrollContainer?.scrollTo({
142
136
  top: scrollContainer.scrollTop - fixedListWindow.visibleItems * itemHeight
143
137
  });
144
138
  }
145
139
 
146
140
  case PAGEDOWN:
147
141
  {
148
- return scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollTo({
142
+ return scrollContainer?.scrollTo({
149
143
  top: scrollContainer.scrollTop + fixedListWindow.visibleItems * itemHeight
150
144
  });
151
145
  }
152
146
  }
153
147
  };
154
148
 
155
- scrollContainer === null || scrollContainer === void 0 ? void 0 : (_scrollContainer$owne7 = scrollContainer.ownerDocument) === null || _scrollContainer$owne7 === void 0 ? void 0 : (_scrollContainer$owne8 = _scrollContainer$owne7.defaultView) === null || _scrollContainer$owne8 === void 0 ? void 0 : _scrollContainer$owne8.addEventListener('keydown', handleKeyDown);
149
+ scrollContainer?.ownerDocument?.defaultView?.addEventListener('keydown', handleKeyDown);
156
150
  return () => {
157
- var _scrollContainer$owne9, _scrollContainer$owne10;
158
-
159
- scrollContainer === null || scrollContainer === void 0 ? void 0 : (_scrollContainer$owne9 = scrollContainer.ownerDocument) === null || _scrollContainer$owne9 === void 0 ? void 0 : (_scrollContainer$owne10 = _scrollContainer$owne9.defaultView) === null || _scrollContainer$owne10 === void 0 ? void 0 : _scrollContainer$owne10.removeEventListener('keydown', handleKeyDown);
151
+ scrollContainer?.ownerDocument?.defaultView?.removeEventListener('keydown', handleKeyDown);
160
152
  };
161
153
  }, [totalItems, itemHeight, elementRef, fixedListWindow.visibleItems]);
162
154
  return [fixedListWindow, setFixedListWindow];
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/compose/src/hooks/use-fixed-window-list/index.js"],"names":["useState","useLayoutEffect","getScrollContainer","PAGEUP","PAGEDOWN","HOME","END","debounce","DEFAULT_INIT_WINDOW_SIZE","useFixedWindowList","elementRef","itemHeight","totalItems","options","initWindowSize","useWindowing","fixedListWindow","setFixedListWindow","visibleItems","start","end","itemInView","index","scrollContainer","current","measureWindow","initRender","Math","ceil","clientHeight","windowOverscan","firstViewableIndex","floor","scrollTop","max","min","lastWindow","nextWindow","debounceMeasureList","addEventListener","ownerDocument","defaultView","removeEventListener","handleKeyDown","event","keyCode","scrollTo","top"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useLayoutEffect } from '@wordpress/element';\nimport { getScrollContainer } from '@wordpress/dom';\nimport { PAGEUP, PAGEDOWN, HOME, END } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { debounce } from '../../utils/debounce';\n\nconst DEFAULT_INIT_WINDOW_SIZE = 30;\n\n/**\n * @typedef {Object} WPFixedWindowList\n *\n * @property {number} visibleItems Items visible in the current viewport\n * @property {number} start Start index of the window\n * @property {number} end End index of the window\n * @property {(index:number)=>boolean} itemInView Returns true if item is in the window\n */\n\n/**\n * @typedef {Object} WPFixedWindowListOptions\n *\n * @property {number} [windowOverscan] Renders windowOverscan number of items before and after the calculated visible window.\n * @property {boolean} [useWindowing] When false avoids calculating the window size\n * @property {number} [initWindowSize] Initial window size to use on first render before we can calculate the window size.\n */\n\n/**\n *\n * @param {import('react').RefObject<HTMLElement>} elementRef Used to find the closest scroll container that contains element.\n * @param { number } itemHeight Fixed item height in pixels\n * @param { number } totalItems Total items in list\n * @param { WPFixedWindowListOptions } [options] Options object\n * @return {[ WPFixedWindowList, setFixedListWindow:(nextWindow:WPFixedWindowList)=>void]} Array with the fixed window list and setter\n */\nexport default function useFixedWindowList(\n\telementRef,\n\titemHeight,\n\ttotalItems,\n\toptions\n) {\n\tconst initWindowSize = options?.initWindowSize ?? DEFAULT_INIT_WINDOW_SIZE;\n\tconst useWindowing = options?.useWindowing ?? true;\n\n\tconst [ fixedListWindow, setFixedListWindow ] = useState( {\n\t\tvisibleItems: initWindowSize,\n\t\tstart: 0,\n\t\tend: initWindowSize,\n\t\titemInView: ( /** @type {number} */ index ) => {\n\t\t\treturn index >= 0 && index <= initWindowSize;\n\t\t},\n\t} );\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! useWindowing ) {\n\t\t\treturn;\n\t\t}\n\t\tconst scrollContainer = getScrollContainer( elementRef.current );\n\t\tconst measureWindow = (\n\t\t\t/** @type {boolean | undefined} */ initRender\n\t\t) => {\n\t\t\tif ( ! scrollContainer ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst visibleItems = Math.ceil(\n\t\t\t\tscrollContainer.clientHeight / itemHeight\n\t\t\t);\n\t\t\t// Aim to keep opening list view fast, afterward we can optimize for scrolling.\n\t\t\tconst windowOverscan = initRender\n\t\t\t\t? visibleItems\n\t\t\t\t: options?.windowOverscan ?? visibleItems;\n\t\t\tconst firstViewableIndex = Math.floor(\n\t\t\t\tscrollContainer.scrollTop / itemHeight\n\t\t\t);\n\t\t\tconst start = Math.max( 0, firstViewableIndex - windowOverscan );\n\t\t\tconst end = Math.min(\n\t\t\t\ttotalItems - 1,\n\t\t\t\tfirstViewableIndex + visibleItems + windowOverscan\n\t\t\t);\n\t\t\tsetFixedListWindow( ( lastWindow ) => {\n\t\t\t\tconst nextWindow = {\n\t\t\t\t\tvisibleItems,\n\t\t\t\t\tstart,\n\t\t\t\t\tend,\n\t\t\t\t\titemInView: ( /** @type {number} */ index ) => {\n\t\t\t\t\t\treturn start <= index && index <= end;\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t\tif (\n\t\t\t\t\tlastWindow.start !== nextWindow.start ||\n\t\t\t\t\tlastWindow.end !== nextWindow.end ||\n\t\t\t\t\tlastWindow.visibleItems !== nextWindow.visibleItems\n\t\t\t\t) {\n\t\t\t\t\treturn nextWindow;\n\t\t\t\t}\n\t\t\t\treturn lastWindow;\n\t\t\t} );\n\t\t};\n\n\t\tmeasureWindow( true );\n\t\tconst debounceMeasureList = debounce( () => {\n\t\t\tmeasureWindow();\n\t\t}, 16 );\n\t\tscrollContainer?.addEventListener( 'scroll', debounceMeasureList );\n\t\tscrollContainer?.ownerDocument?.defaultView?.addEventListener(\n\t\t\t'resize',\n\t\t\tdebounceMeasureList\n\t\t);\n\t\tscrollContainer?.ownerDocument?.defaultView?.addEventListener(\n\t\t\t'resize',\n\t\t\tdebounceMeasureList\n\t\t);\n\n\t\treturn () => {\n\t\t\tscrollContainer?.removeEventListener(\n\t\t\t\t'scroll',\n\t\t\t\tdebounceMeasureList\n\t\t\t);\n\t\t\tscrollContainer?.ownerDocument?.defaultView?.removeEventListener(\n\t\t\t\t'resize',\n\t\t\t\tdebounceMeasureList\n\t\t\t);\n\t\t};\n\t}, [ itemHeight, elementRef, totalItems ] );\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! useWindowing ) {\n\t\t\treturn;\n\t\t}\n\t\tconst scrollContainer = getScrollContainer( elementRef.current );\n\t\tconst handleKeyDown = ( /** @type {KeyboardEvent} */ event ) => {\n\t\t\tswitch ( event.keyCode ) {\n\t\t\t\tcase HOME: {\n\t\t\t\t\treturn scrollContainer?.scrollTo( { top: 0 } );\n\t\t\t\t}\n\t\t\t\tcase END: {\n\t\t\t\t\treturn scrollContainer?.scrollTo( {\n\t\t\t\t\t\ttop: totalItems * itemHeight,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\tcase PAGEUP: {\n\t\t\t\t\treturn scrollContainer?.scrollTo( {\n\t\t\t\t\t\ttop:\n\t\t\t\t\t\t\tscrollContainer.scrollTop -\n\t\t\t\t\t\t\tfixedListWindow.visibleItems * itemHeight,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\tcase PAGEDOWN: {\n\t\t\t\t\treturn scrollContainer?.scrollTo( {\n\t\t\t\t\t\ttop:\n\t\t\t\t\t\t\tscrollContainer.scrollTop +\n\t\t\t\t\t\t\tfixedListWindow.visibleItems * itemHeight,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t\tscrollContainer?.ownerDocument?.defaultView?.addEventListener(\n\t\t\t'keydown',\n\t\t\thandleKeyDown\n\t\t);\n\t\treturn () => {\n\t\t\tscrollContainer?.ownerDocument?.defaultView?.removeEventListener(\n\t\t\t\t'keydown',\n\t\t\t\thandleKeyDown\n\t\t\t);\n\t\t};\n\t}, [ totalItems, itemHeight, elementRef, fixedListWindow.visibleItems ] );\n\n\treturn [ fixedListWindow, setFixedListWindow ];\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/compose/src/hooks/use-fixed-window-list/index.js"],"names":["useState","useLayoutEffect","getScrollContainer","PAGEUP","PAGEDOWN","HOME","END","debounce","DEFAULT_INIT_WINDOW_SIZE","useFixedWindowList","elementRef","itemHeight","totalItems","options","initWindowSize","useWindowing","fixedListWindow","setFixedListWindow","visibleItems","start","end","itemInView","index","scrollContainer","current","measureWindow","initRender","Math","ceil","clientHeight","windowOverscan","firstViewableIndex","floor","scrollTop","max","min","lastWindow","nextWindow","debounceMeasureList","addEventListener","ownerDocument","defaultView","removeEventListener","handleKeyDown","event","keyCode","scrollTo","top"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useLayoutEffect } from '@wordpress/element';\nimport { getScrollContainer } from '@wordpress/dom';\nimport { PAGEUP, PAGEDOWN, HOME, END } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { debounce } from '../../utils/debounce';\n\nconst DEFAULT_INIT_WINDOW_SIZE = 30;\n\n/**\n * @typedef {Object} WPFixedWindowList\n *\n * @property {number} visibleItems Items visible in the current viewport\n * @property {number} start Start index of the window\n * @property {number} end End index of the window\n * @property {(index:number)=>boolean} itemInView Returns true if item is in the window\n */\n\n/**\n * @typedef {Object} WPFixedWindowListOptions\n *\n * @property {number} [windowOverscan] Renders windowOverscan number of items before and after the calculated visible window.\n * @property {boolean} [useWindowing] When false avoids calculating the window size\n * @property {number} [initWindowSize] Initial window size to use on first render before we can calculate the window size.\n */\n\n/**\n *\n * @param {import('react').RefObject<HTMLElement>} elementRef Used to find the closest scroll container that contains element.\n * @param { number } itemHeight Fixed item height in pixels\n * @param { number } totalItems Total items in list\n * @param { WPFixedWindowListOptions } [options] Options object\n * @return {[ WPFixedWindowList, setFixedListWindow:(nextWindow:WPFixedWindowList)=>void]} Array with the fixed window list and setter\n */\nexport default function useFixedWindowList(\n\telementRef,\n\titemHeight,\n\ttotalItems,\n\toptions\n) {\n\tconst initWindowSize = options?.initWindowSize ?? DEFAULT_INIT_WINDOW_SIZE;\n\tconst useWindowing = options?.useWindowing ?? true;\n\n\tconst [ fixedListWindow, setFixedListWindow ] = useState( {\n\t\tvisibleItems: initWindowSize,\n\t\tstart: 0,\n\t\tend: initWindowSize,\n\t\titemInView: ( /** @type {number} */ index ) => {\n\t\t\treturn index >= 0 && index <= initWindowSize;\n\t\t},\n\t} );\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! useWindowing ) {\n\t\t\treturn;\n\t\t}\n\t\tconst scrollContainer = getScrollContainer( elementRef.current );\n\t\tconst measureWindow = (\n\t\t\t/** @type {boolean | undefined} */ initRender\n\t\t) => {\n\t\t\tif ( ! scrollContainer ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst visibleItems = Math.ceil(\n\t\t\t\tscrollContainer.clientHeight / itemHeight\n\t\t\t);\n\t\t\t// Aim to keep opening list view fast, afterward we can optimize for scrolling.\n\t\t\tconst windowOverscan = initRender\n\t\t\t\t? visibleItems\n\t\t\t\t: options?.windowOverscan ?? visibleItems;\n\t\t\tconst firstViewableIndex = Math.floor(\n\t\t\t\tscrollContainer.scrollTop / itemHeight\n\t\t\t);\n\t\t\tconst start = Math.max( 0, firstViewableIndex - windowOverscan );\n\t\t\tconst end = Math.min(\n\t\t\t\ttotalItems - 1,\n\t\t\t\tfirstViewableIndex + visibleItems + windowOverscan\n\t\t\t);\n\t\t\tsetFixedListWindow( ( lastWindow ) => {\n\t\t\t\tconst nextWindow = {\n\t\t\t\t\tvisibleItems,\n\t\t\t\t\tstart,\n\t\t\t\t\tend,\n\t\t\t\t\titemInView: ( /** @type {number} */ index ) => {\n\t\t\t\t\t\treturn start <= index && index <= end;\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t\tif (\n\t\t\t\t\tlastWindow.start !== nextWindow.start ||\n\t\t\t\t\tlastWindow.end !== nextWindow.end ||\n\t\t\t\t\tlastWindow.visibleItems !== nextWindow.visibleItems\n\t\t\t\t) {\n\t\t\t\t\treturn nextWindow;\n\t\t\t\t}\n\t\t\t\treturn lastWindow;\n\t\t\t} );\n\t\t};\n\n\t\tmeasureWindow( true );\n\t\tconst debounceMeasureList = debounce( () => {\n\t\t\tmeasureWindow();\n\t\t}, 16 );\n\t\tscrollContainer?.addEventListener( 'scroll', debounceMeasureList );\n\t\tscrollContainer?.ownerDocument?.defaultView?.addEventListener(\n\t\t\t'resize',\n\t\t\tdebounceMeasureList\n\t\t);\n\t\tscrollContainer?.ownerDocument?.defaultView?.addEventListener(\n\t\t\t'resize',\n\t\t\tdebounceMeasureList\n\t\t);\n\n\t\treturn () => {\n\t\t\tscrollContainer?.removeEventListener(\n\t\t\t\t'scroll',\n\t\t\t\tdebounceMeasureList\n\t\t\t);\n\t\t\tscrollContainer?.ownerDocument?.defaultView?.removeEventListener(\n\t\t\t\t'resize',\n\t\t\t\tdebounceMeasureList\n\t\t\t);\n\t\t};\n\t}, [ itemHeight, elementRef, totalItems ] );\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! useWindowing ) {\n\t\t\treturn;\n\t\t}\n\t\tconst scrollContainer = getScrollContainer( elementRef.current );\n\t\tconst handleKeyDown = ( /** @type {KeyboardEvent} */ event ) => {\n\t\t\tswitch ( event.keyCode ) {\n\t\t\t\tcase HOME: {\n\t\t\t\t\treturn scrollContainer?.scrollTo( { top: 0 } );\n\t\t\t\t}\n\t\t\t\tcase END: {\n\t\t\t\t\treturn scrollContainer?.scrollTo( {\n\t\t\t\t\t\ttop: totalItems * itemHeight,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\tcase PAGEUP: {\n\t\t\t\t\treturn scrollContainer?.scrollTo( {\n\t\t\t\t\t\ttop:\n\t\t\t\t\t\t\tscrollContainer.scrollTop -\n\t\t\t\t\t\t\tfixedListWindow.visibleItems * itemHeight,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\tcase PAGEDOWN: {\n\t\t\t\t\treturn scrollContainer?.scrollTo( {\n\t\t\t\t\t\ttop:\n\t\t\t\t\t\t\tscrollContainer.scrollTop +\n\t\t\t\t\t\t\tfixedListWindow.visibleItems * itemHeight,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t\tscrollContainer?.ownerDocument?.defaultView?.addEventListener(\n\t\t\t'keydown',\n\t\t\thandleKeyDown\n\t\t);\n\t\treturn () => {\n\t\t\tscrollContainer?.ownerDocument?.defaultView?.removeEventListener(\n\t\t\t\t'keydown',\n\t\t\t\thandleKeyDown\n\t\t\t);\n\t\t};\n\t}, [ totalItems, itemHeight, elementRef, fixedListWindow.visibleItems ] );\n\n\treturn [ fixedListWindow, setFixedListWindow ];\n}\n"]}
@@ -25,8 +25,7 @@ import { focus } from '@wordpress/dom';
25
25
  * ```
26
26
  */
27
27
 
28
- export default function useFocusOnMount() {
29
- let focusOnMount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'firstElement';
28
+ export default function useFocusOnMount(focusOnMount = 'firstElement') {
30
29
  const focusOnMountRef = useRef(focusOnMount);
31
30
  /**
32
31
  * Sets focus on a DOM element.
@@ -58,13 +57,13 @@ export default function useFocusOnMount() {
58
57
  };
59
58
  }, []);
60
59
  return useCallback(node => {
61
- var _node$ownerDocument$a, _node$ownerDocument;
60
+ var _node$ownerDocument$a;
62
61
 
63
62
  if (!node || focusOnMountRef.current === false) {
64
63
  return;
65
64
  }
66
65
 
67
- if (node.contains((_node$ownerDocument$a = (_node$ownerDocument = node.ownerDocument) === null || _node$ownerDocument === void 0 ? void 0 : _node$ownerDocument.activeElement) !== null && _node$ownerDocument$a !== void 0 ? _node$ownerDocument$a : null)) {
66
+ if (node.contains((_node$ownerDocument$a = node.ownerDocument?.activeElement) !== null && _node$ownerDocument$a !== void 0 ? _node$ownerDocument$a : null)) {
68
67
  return;
69
68
  }
70
69
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-on-mount/index.js"],"names":["useRef","useEffect","useCallback","focus","useFocusOnMount","focusOnMount","focusOnMountRef","setFocus","target","preventScroll","timerId","current","clearTimeout","node","contains","ownerDocument","activeElement","setTimeout","firstTabbable","tabbable","find"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,SAAjB,EAA4BC,WAA5B,QAA+C,oBAA/C;AACA,SAASC,KAAT,QAAsB,gBAAtB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,eAAT,GAA0D;AAAA,MAAhCC,YAAgC,uEAAjB,cAAiB;AACxE,QAAMC,eAAe,GAAGN,MAAM,CAAEK,YAAF,CAA9B;AAEA;AACD;AACA;AACA;AACA;AACA;;AACC,QAAME,QAAQ,GAAKC,MAAF,IAAc;AAC9BA,IAAAA,MAAM,CAACL,KAAP,CAAc;AACb;AACA;AACA;AACAM,MAAAA,aAAa,EAAE;AAJF,KAAd;AAMA,GAPD;AASA;;;AACA,QAAMC,OAAO,GAAGV,MAAM,EAAtB;AAEAC,EAAAA,SAAS,CAAE,MAAM;AAChBK,IAAAA,eAAe,CAACK,OAAhB,GAA0BN,YAA1B;AACA,GAFQ,EAEN,CAAEA,YAAF,CAFM,CAAT;AAIAJ,EAAAA,SAAS,CAAE,MAAM;AAChB,WAAO,MAAM;AACZ,UAAKS,OAAO,CAACC,OAAb,EAAuB;AACtBC,QAAAA,YAAY,CAAEF,OAAO,CAACC,OAAV,CAAZ;AACA;AACD,KAJD;AAKA,GANQ,EAMN,EANM,CAAT;AAQA,SAAOT,WAAW,CAAIW,IAAF,IAAY;AAAA;;AAC/B,QAAK,CAAEA,IAAF,IAAUP,eAAe,CAACK,OAAhB,KAA4B,KAA3C,EAAmD;AAClD;AACA;;AAED,QAAKE,IAAI,CAACC,QAAL,iDAAeD,IAAI,CAACE,aAApB,wDAAe,oBAAoBC,aAAnC,yEAAoD,IAApD,CAAL,EAAkE;AACjE;AACA;;AAED,QAAKV,eAAe,CAACK,OAAhB,KAA4B,cAAjC,EAAkD;AACjDD,MAAAA,OAAO,CAACC,OAAR,GAAkBM,UAAU,CAAE,MAAM;AACnC,cAAMC,aAAa,GAAGf,KAAK,CAACgB,QAAN,CAAeC,IAAf,CAAqBP,IAArB,EAA6B,CAA7B,CAAtB;;AAEA,YAAKK,aAAL,EAAqB;AACpBX,UAAAA,QAAQ;AAAE;AAA6BW,UAAAA,aAA/B,CAAR;AACA;AACD,OAN2B,EAMzB,CANyB,CAA5B;AAQA;AACA;;AAEDX,IAAAA,QAAQ,CAAEM,IAAF,CAAR;AACA,GAtBiB,EAsBf,EAtBe,CAAlB;AAuBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useCallback } from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/**\n * Hook used to focus the first tabbable element on mount.\n *\n * @param {boolean | 'firstElement'} focusOnMount Focus on mount mode.\n * @return {import('react').RefCallback<HTMLElement>} Ref callback.\n *\n * @example\n * ```js\n * import { useFocusOnMount } from '@wordpress/compose';\n *\n * const WithFocusOnMount = () => {\n * const ref = useFocusOnMount()\n * return (\n * <div ref={ ref }>\n * <Button />\n * <Button />\n * </div>\n * );\n * }\n * ```\n */\nexport default function useFocusOnMount( focusOnMount = 'firstElement' ) {\n\tconst focusOnMountRef = useRef( focusOnMount );\n\n\t/**\n\t * Sets focus on a DOM element.\n\t *\n\t * @param {HTMLElement} target The DOM element to set focus to.\n\t * @return {void}\n\t */\n\tconst setFocus = ( target ) => {\n\t\ttarget.focus( {\n\t\t\t// When focusing newly mounted dialogs,\n\t\t\t// the position of the popover is often not right on the first render\n\t\t\t// This prevents the layout shifts when focusing the dialogs.\n\t\t\tpreventScroll: true,\n\t\t} );\n\t};\n\n\t/** @type {import('react').MutableRefObject<ReturnType<setTimeout> | undefined>} */\n\tconst timerId = useRef();\n\n\tuseEffect( () => {\n\t\tfocusOnMountRef.current = focusOnMount;\n\t}, [ focusOnMount ] );\n\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif ( timerId.current ) {\n\t\t\t\tclearTimeout( timerId.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\treturn useCallback( ( node ) => {\n\t\tif ( ! node || focusOnMountRef.current === false ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( node.contains( node.ownerDocument?.activeElement ?? null ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( focusOnMountRef.current === 'firstElement' ) {\n\t\t\ttimerId.current = setTimeout( () => {\n\t\t\t\tconst firstTabbable = focus.tabbable.find( node )[ 0 ];\n\n\t\t\t\tif ( firstTabbable ) {\n\t\t\t\t\tsetFocus( /** @type {HTMLElement} */ ( firstTabbable ) );\n\t\t\t\t}\n\t\t\t}, 0 );\n\n\t\t\treturn;\n\t\t}\n\n\t\tsetFocus( node );\n\t}, [] );\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-on-mount/index.js"],"names":["useRef","useEffect","useCallback","focus","useFocusOnMount","focusOnMount","focusOnMountRef","setFocus","target","preventScroll","timerId","current","clearTimeout","node","contains","ownerDocument","activeElement","setTimeout","firstTabbable","tabbable","find"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,SAAjB,EAA4BC,WAA5B,QAA+C,oBAA/C;AACA,SAASC,KAAT,QAAsB,gBAAtB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,eAAT,CAA0BC,YAAY,GAAG,cAAzC,EAA0D;AACxE,QAAMC,eAAe,GAAGN,MAAM,CAAEK,YAAF,CAA9B;AAEA;AACD;AACA;AACA;AACA;AACA;;AACC,QAAME,QAAQ,GAAKC,MAAF,IAAc;AAC9BA,IAAAA,MAAM,CAACL,KAAP,CAAc;AACb;AACA;AACA;AACAM,MAAAA,aAAa,EAAE;AAJF,KAAd;AAMA,GAPD;AASA;;;AACA,QAAMC,OAAO,GAAGV,MAAM,EAAtB;AAEAC,EAAAA,SAAS,CAAE,MAAM;AAChBK,IAAAA,eAAe,CAACK,OAAhB,GAA0BN,YAA1B;AACA,GAFQ,EAEN,CAAEA,YAAF,CAFM,CAAT;AAIAJ,EAAAA,SAAS,CAAE,MAAM;AAChB,WAAO,MAAM;AACZ,UAAKS,OAAO,CAACC,OAAb,EAAuB;AACtBC,QAAAA,YAAY,CAAEF,OAAO,CAACC,OAAV,CAAZ;AACA;AACD,KAJD;AAKA,GANQ,EAMN,EANM,CAAT;AAQA,SAAOT,WAAW,CAAIW,IAAF,IAAY;AAAA;;AAC/B,QAAK,CAAEA,IAAF,IAAUP,eAAe,CAACK,OAAhB,KAA4B,KAA3C,EAAmD;AAClD;AACA;;AAED,QAAKE,IAAI,CAACC,QAAL,0BAAeD,IAAI,CAACE,aAAL,EAAoBC,aAAnC,yEAAoD,IAApD,CAAL,EAAkE;AACjE;AACA;;AAED,QAAKV,eAAe,CAACK,OAAhB,KAA4B,cAAjC,EAAkD;AACjDD,MAAAA,OAAO,CAACC,OAAR,GAAkBM,UAAU,CAAE,MAAM;AACnC,cAAMC,aAAa,GAAGf,KAAK,CAACgB,QAAN,CAAeC,IAAf,CAAqBP,IAArB,EAA6B,CAA7B,CAAtB;;AAEA,YAAKK,aAAL,EAAqB;AACpBX,UAAAA,QAAQ;AAAE;AAA6BW,UAAAA,aAA/B,CAAR;AACA;AACD,OAN2B,EAMzB,CANyB,CAA5B;AAQA;AACA;;AAEDX,IAAAA,QAAQ,CAAEM,IAAF,CAAR;AACA,GAtBiB,EAsBf,EAtBe,CAAlB;AAuBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useCallback } from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/**\n * Hook used to focus the first tabbable element on mount.\n *\n * @param {boolean | 'firstElement'} focusOnMount Focus on mount mode.\n * @return {import('react').RefCallback<HTMLElement>} Ref callback.\n *\n * @example\n * ```js\n * import { useFocusOnMount } from '@wordpress/compose';\n *\n * const WithFocusOnMount = () => {\n * const ref = useFocusOnMount()\n * return (\n * <div ref={ ref }>\n * <Button />\n * <Button />\n * </div>\n * );\n * }\n * ```\n */\nexport default function useFocusOnMount( focusOnMount = 'firstElement' ) {\n\tconst focusOnMountRef = useRef( focusOnMount );\n\n\t/**\n\t * Sets focus on a DOM element.\n\t *\n\t * @param {HTMLElement} target The DOM element to set focus to.\n\t * @return {void}\n\t */\n\tconst setFocus = ( target ) => {\n\t\ttarget.focus( {\n\t\t\t// When focusing newly mounted dialogs,\n\t\t\t// the position of the popover is often not right on the first render\n\t\t\t// This prevents the layout shifts when focusing the dialogs.\n\t\t\tpreventScroll: true,\n\t\t} );\n\t};\n\n\t/** @type {import('react').MutableRefObject<ReturnType<setTimeout> | undefined>} */\n\tconst timerId = useRef();\n\n\tuseEffect( () => {\n\t\tfocusOnMountRef.current = focusOnMount;\n\t}, [ focusOnMount ] );\n\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif ( timerId.current ) {\n\t\t\t\tclearTimeout( timerId.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\treturn useCallback( ( node ) => {\n\t\tif ( ! node || focusOnMountRef.current === false ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( node.contains( node.ownerDocument?.activeElement ?? null ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( focusOnMountRef.current === 'firstElement' ) {\n\t\t\ttimerId.current = setTimeout( () => {\n\t\t\t\tconst firstTabbable = focus.tabbable.find( node )[ 0 ];\n\n\t\t\t\tif ( firstTabbable ) {\n\t\t\t\t\tsetFocus( /** @type {HTMLElement} */ ( firstTabbable ) );\n\t\t\t\t}\n\t\t\t}, 0 );\n\n\t\t\treturn;\n\t\t}\n\n\t\tsetFocus( node );\n\t}, [] );\n}\n"]}
@@ -112,8 +112,6 @@ export default function useFocusOutside(onFocusOutside) {
112
112
  */
113
113
 
114
114
  const queueBlurCheck = useCallback(event => {
115
- var _event$relatedTarget;
116
-
117
115
  // React does not allow using an event reference asynchronously
118
116
  // due to recycling behavior, except when explicitly persisted.
119
117
  event.persist(); // Skip blur check if clicking button. See `normalizeButtonFocus`.
@@ -131,7 +129,7 @@ export default function useFocusOutside(onFocusOutside) {
131
129
 
132
130
  const ignoreForRelatedTarget = event.target.getAttribute('data-unstable-ignore-focus-outside-for-relatedtarget');
133
131
 
134
- if (ignoreForRelatedTarget && (_event$relatedTarget = event.relatedTarget) !== null && _event$relatedTarget !== void 0 && _event$relatedTarget.closest(ignoreForRelatedTarget)) {
132
+ if (ignoreForRelatedTarget && event.relatedTarget?.closest(ignoreForRelatedTarget)) {
135
133
  return;
136
134
  }
137
135
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-outside/index.ts"],"names":["useCallback","useEffect","useRef","INPUT_BUTTON_TYPES","isFocusNormalizedButton","eventTarget","window","HTMLElement","nodeName","includes","type","useFocusOutside","onFocusOutside","currentOnFocusOutside","current","preventBlurCheck","blurCheckTimeoutId","cancelBlurCheck","clearTimeout","normalizeButtonFocus","event","target","isInteractionEnd","queueBlurCheck","persist","ignoreForRelatedTarget","getAttribute","relatedTarget","closest","setTimeout","document","hasFocus","preventDefault","onFocus","onMouseDown","onMouseUp","onTouchStart","onTouchEnd","onBlur"],"mappings":"AAAA;AACA;AACA;;AAWA;AACA;AACA;AACA,SAASA,WAAT,EAAsBC,SAAtB,EAAiCC,MAAjC,QAA+C,oBAA/C;AAEA;AACA;AACA;AACA;;AACA,MAAMC,kBAAkB,GAAG,CAAE,QAAF,EAAY,QAAZ,CAA3B;AAEA;AACA;AACA;AACA;AACA;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,uBAAT,CACCC,WADD,EAEwC;AACvC,MAAK,EAAIA,WAAW,YAAYC,MAAM,CAACC,WAAlC,CAAL,EAAuD;AACtD,WAAO,KAAP;AACA;;AACD,UAASF,WAAW,CAACG,QAArB;AACC,SAAK,GAAL;AACA,SAAK,QAAL;AACC,aAAO,IAAP;;AAED,SAAK,OAAL;AACC,aAAOL,kBAAkB,CAACM,QAAnB,CACJJ,WAAF,CAAoCK,IAD9B,CAAP;AANF;;AAWA,SAAO,KAAP;AACA;;AAWD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,eAAT,CACdC,cADc,EAEU;AACxB,QAAMC,qBAAqB,GAAGX,MAAM,CAAEU,cAAF,CAApC;AACAX,EAAAA,SAAS,CAAE,MAAM;AAChBY,IAAAA,qBAAqB,CAACC,OAAtB,GAAgCF,cAAhC;AACA,GAFQ,EAEN,CAAEA,cAAF,CAFM,CAAT;AAIA,QAAMG,gBAAgB,GAAGb,MAAM,CAAE,KAAF,CAA/B;AAEA,QAAMc,kBAAkB,GAAGd,MAAM,EAAjC;AAEA;AACD;AACA;;AACC,QAAMe,eAAe,GAAGjB,WAAW,CAAE,MAAM;AAC1CkB,IAAAA,YAAY,CAAEF,kBAAkB,CAACF,OAArB,CAAZ;AACA,GAFkC,EAEhC,EAFgC,CAAnC,CAbwB,CAiBxB;;AACAb,EAAAA,SAAS,CAAE,MAAM;AAChB,WAAO,MAAMgB,eAAe,EAA5B;AACA,GAFQ,EAEN,EAFM,CAAT,CAlBwB,CAsBxB;;AACAhB,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAK,CAAEW,cAAP,EAAwB;AACvBK,MAAAA,eAAe;AACf;AACD,GAJQ,EAIN,CAAEL,cAAF,EAAkBK,eAAlB,CAJM,CAAT;AAMA;AACD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACC,QAAME,oBAA6D,GAClEnB,WAAW,CAAIoB,KAAF,IAAa;AACzB,UAAM;AAAEV,MAAAA,IAAF;AAAQW,MAAAA;AAAR,QAAmBD,KAAzB;AACA,UAAME,gBAAgB,GAAG,CAAE,SAAF,EAAa,UAAb,EAA0Bb,QAA1B,CAAoCC,IAApC,CAAzB;;AAEA,QAAKY,gBAAL,EAAwB;AACvBP,MAAAA,gBAAgB,CAACD,OAAjB,GAA2B,KAA3B;AACA,KAFD,MAEO,IAAKV,uBAAuB,CAAEiB,MAAF,CAA5B,EAAyC;AAC/CN,MAAAA,gBAAgB,CAACD,OAAjB,GAA2B,IAA3B;AACA;AACD,GATU,EASR,EATQ,CADZ;AAYA;AACD;AACA;AACA;AACA;AACA;AACA;;AACC,QAAMS,cAAiC,GAAGvB,WAAW,CAAIoB,KAAF,IAAa;AAAA;;AACnE;AACA;AACAA,IAAAA,KAAK,CAACI,OAAN,GAHmE,CAKnE;;AACA,QAAKT,gBAAgB,CAACD,OAAtB,EAAgC;AAC/B;AACA,KARkE,CAUnE;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,UAAMW,sBAAsB,GAAGL,KAAK,CAACC,MAAN,CAAaK,YAAb,CAC9B,sDAD8B,CAA/B;;AAGA,QACCD,sBAAsB,4BACtBL,KAAK,CAACO,aADgB,iDACtB,qBAAqBC,OAArB,CAA8BH,sBAA9B,CAFD,EAGE;AACD;AACA;;AAEDT,IAAAA,kBAAkB,CAACF,OAAnB,GAA6Be,UAAU,CAAE,MAAM;AAC9C;AACA;AACA;AACA;AACA,UAAK,CAAEC,QAAQ,CAACC,QAAT,EAAP,EAA6B;AAC5BX,QAAAA,KAAK,CAACY,cAAN;AACA;AACA;;AAED,UAAK,eAAe,OAAOnB,qBAAqB,CAACC,OAAjD,EAA2D;AAC1DD,QAAAA,qBAAqB,CAACC,OAAtB,CAA+BM,KAA/B;AACA;AACD,KAbsC,EAapC,CAboC,CAAvC;AAcA,GAzCoD,EAyClD,EAzCkD,CAArD;AA2CA,SAAO;AACNa,IAAAA,OAAO,EAAEhB,eADH;AAENiB,IAAAA,WAAW,EAAEf,oBAFP;AAGNgB,IAAAA,SAAS,EAAEhB,oBAHL;AAINiB,IAAAA,YAAY,EAAEjB,oBAJR;AAKNkB,IAAAA,UAAU,EAAElB,oBALN;AAMNmB,IAAAA,MAAM,EAAEf;AANF,GAAP;AAQA","sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tFocusEventHandler,\n\tEventHandler,\n\tMouseEventHandler,\n\tTouchEventHandler,\n\tFocusEvent,\n\tMouseEvent,\n\tTouchEvent,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useEffect, useRef } from '@wordpress/element';\n\n/**\n * Input types which are classified as button types, for use in considering\n * whether element is a (focus-normalized) button.\n */\nconst INPUT_BUTTON_TYPES = [ 'button', 'submit' ];\n\n/**\n * List of HTML button elements subject to focus normalization\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n */\ntype FocusNormalizedButton =\n\t| HTMLButtonElement\n\t| HTMLLinkElement\n\t| HTMLInputElement;\n\n/**\n * Returns true if the given element is a button element subject to focus\n * normalization, or false otherwise.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n *\n * @param eventTarget The target from a mouse or touch event.\n *\n * @return Whether the element is a button element subject to focus normalization.\n */\nfunction isFocusNormalizedButton(\n\teventTarget: EventTarget\n): eventTarget is FocusNormalizedButton {\n\tif ( ! ( eventTarget instanceof window.HTMLElement ) ) {\n\t\treturn false;\n\t}\n\tswitch ( eventTarget.nodeName ) {\n\t\tcase 'A':\n\t\tcase 'BUTTON':\n\t\t\treturn true;\n\n\t\tcase 'INPUT':\n\t\t\treturn INPUT_BUTTON_TYPES.includes(\n\t\t\t\t( eventTarget as HTMLInputElement ).type\n\t\t\t);\n\t}\n\n\treturn false;\n}\n\ntype UseFocusOutsideReturn = {\n\tonFocus: FocusEventHandler;\n\tonMouseDown: MouseEventHandler;\n\tonMouseUp: MouseEventHandler;\n\tonTouchStart: TouchEventHandler;\n\tonTouchEnd: TouchEventHandler;\n\tonBlur: FocusEventHandler;\n};\n\n/**\n * A react hook that can be used to check whether focus has moved outside the\n * element the event handlers are bound to.\n *\n * @param onFocusOutside A callback triggered when focus moves outside\n * the element the event handlers are bound to.\n *\n * @return An object containing event handlers. Bind the event handlers to a\n * wrapping element element to capture when focus moves outside that element.\n */\nexport default function useFocusOutside(\n\tonFocusOutside: ( event: FocusEvent ) => void\n): UseFocusOutsideReturn {\n\tconst currentOnFocusOutside = useRef( onFocusOutside );\n\tuseEffect( () => {\n\t\tcurrentOnFocusOutside.current = onFocusOutside;\n\t}, [ onFocusOutside ] );\n\n\tconst preventBlurCheck = useRef( false );\n\n\tconst blurCheckTimeoutId = useRef< number | undefined >();\n\n\t/**\n\t * Cancel a blur check timeout.\n\t */\n\tconst cancelBlurCheck = useCallback( () => {\n\t\tclearTimeout( blurCheckTimeoutId.current );\n\t}, [] );\n\n\t// Cancel blur checks on unmount.\n\tuseEffect( () => {\n\t\treturn () => cancelBlurCheck();\n\t}, [] );\n\n\t// Cancel a blur check if the callback or ref is no longer provided.\n\tuseEffect( () => {\n\t\tif ( ! onFocusOutside ) {\n\t\t\tcancelBlurCheck();\n\t\t}\n\t}, [ onFocusOutside, cancelBlurCheck ] );\n\n\t/**\n\t * Handles a mousedown or mouseup event to respectively assign and\n\t * unassign a flag for preventing blur check on button elements. Some\n\t * browsers, namely Firefox and Safari, do not emit a focus event on\n\t * button elements when clicked, while others do. The logic here\n\t * intends to normalize this as treating click on buttons as focus.\n\t *\n\t * @param event\n\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n\t */\n\tconst normalizeButtonFocus: EventHandler< MouseEvent | TouchEvent > =\n\t\tuseCallback( ( event ) => {\n\t\t\tconst { type, target } = event;\n\t\t\tconst isInteractionEnd = [ 'mouseup', 'touchend' ].includes( type );\n\n\t\t\tif ( isInteractionEnd ) {\n\t\t\t\tpreventBlurCheck.current = false;\n\t\t\t} else if ( isFocusNormalizedButton( target ) ) {\n\t\t\t\tpreventBlurCheck.current = true;\n\t\t\t}\n\t\t}, [] );\n\n\t/**\n\t * A callback triggered when a blur event occurs on the element the handler\n\t * is bound to.\n\t *\n\t * Calls the `onFocusOutside` callback in an immediate timeout if focus has\n\t * move outside the bound element and is still within the document.\n\t */\n\tconst queueBlurCheck: FocusEventHandler = useCallback( ( event ) => {\n\t\t// React does not allow using an event reference asynchronously\n\t\t// due to recycling behavior, except when explicitly persisted.\n\t\tevent.persist();\n\n\t\t// Skip blur check if clicking button. See `normalizeButtonFocus`.\n\t\tif ( preventBlurCheck.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// The usage of this attribute should be avoided. The only use case\n\t\t// would be when we load modals that are not React components and\n\t\t// therefore don't exist in the React tree. An example is opening\n\t\t// the Media Library modal from another dialog.\n\t\t// This attribute should contain a selector of the related target\n\t\t// we want to ignore, because we still need to trigger the blur event\n\t\t// on all other cases.\n\t\tconst ignoreForRelatedTarget = event.target.getAttribute(\n\t\t\t'data-unstable-ignore-focus-outside-for-relatedtarget'\n\t\t);\n\t\tif (\n\t\t\tignoreForRelatedTarget &&\n\t\t\tevent.relatedTarget?.closest( ignoreForRelatedTarget )\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tblurCheckTimeoutId.current = setTimeout( () => {\n\t\t\t// If document is not focused then focus should remain\n\t\t\t// inside the wrapped component and therefore we cancel\n\t\t\t// this blur event thereby leaving focus in place.\n\t\t\t// https://developer.mozilla.org/en-US/docs/Web/API/Document/hasFocus.\n\t\t\tif ( ! document.hasFocus() ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( 'function' === typeof currentOnFocusOutside.current ) {\n\t\t\t\tcurrentOnFocusOutside.current( event );\n\t\t\t}\n\t\t}, 0 );\n\t}, [] );\n\n\treturn {\n\t\tonFocus: cancelBlurCheck,\n\t\tonMouseDown: normalizeButtonFocus,\n\t\tonMouseUp: normalizeButtonFocus,\n\t\tonTouchStart: normalizeButtonFocus,\n\t\tonTouchEnd: normalizeButtonFocus,\n\t\tonBlur: queueBlurCheck,\n\t};\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-outside/index.ts"],"names":["useCallback","useEffect","useRef","INPUT_BUTTON_TYPES","isFocusNormalizedButton","eventTarget","window","HTMLElement","nodeName","includes","type","useFocusOutside","onFocusOutside","currentOnFocusOutside","current","preventBlurCheck","blurCheckTimeoutId","cancelBlurCheck","clearTimeout","normalizeButtonFocus","event","target","isInteractionEnd","queueBlurCheck","persist","ignoreForRelatedTarget","getAttribute","relatedTarget","closest","setTimeout","document","hasFocus","preventDefault","onFocus","onMouseDown","onMouseUp","onTouchStart","onTouchEnd","onBlur"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tFocusEventHandler,\n\tEventHandler,\n\tMouseEventHandler,\n\tTouchEventHandler,\n\tFocusEvent,\n\tMouseEvent,\n\tTouchEvent,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useEffect, useRef } from '@wordpress/element';\n\n/**\n * Input types which are classified as button types, for use in considering\n * whether element is a (focus-normalized) button.\n */\nconst INPUT_BUTTON_TYPES = [ 'button', 'submit' ];\n\n/**\n * List of HTML button elements subject to focus normalization\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n */\ntype FocusNormalizedButton =\n\t| HTMLButtonElement\n\t| HTMLLinkElement\n\t| HTMLInputElement;\n\n/**\n * Returns true if the given element is a button element subject to focus\n * normalization, or false otherwise.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n *\n * @param eventTarget The target from a mouse or touch event.\n *\n * @return Whether the element is a button element subject to focus normalization.\n */\nfunction isFocusNormalizedButton(\n\teventTarget: EventTarget\n): eventTarget is FocusNormalizedButton {\n\tif ( ! ( eventTarget instanceof window.HTMLElement ) ) {\n\t\treturn false;\n\t}\n\tswitch ( eventTarget.nodeName ) {\n\t\tcase 'A':\n\t\tcase 'BUTTON':\n\t\t\treturn true;\n\n\t\tcase 'INPUT':\n\t\t\treturn INPUT_BUTTON_TYPES.includes(\n\t\t\t\t( eventTarget as HTMLInputElement ).type\n\t\t\t);\n\t}\n\n\treturn false;\n}\n\ntype UseFocusOutsideReturn = {\n\tonFocus: FocusEventHandler;\n\tonMouseDown: MouseEventHandler;\n\tonMouseUp: MouseEventHandler;\n\tonTouchStart: TouchEventHandler;\n\tonTouchEnd: TouchEventHandler;\n\tonBlur: FocusEventHandler;\n};\n\n/**\n * A react hook that can be used to check whether focus has moved outside the\n * element the event handlers are bound to.\n *\n * @param onFocusOutside A callback triggered when focus moves outside\n * the element the event handlers are bound to.\n *\n * @return An object containing event handlers. Bind the event handlers to a\n * wrapping element element to capture when focus moves outside that element.\n */\nexport default function useFocusOutside(\n\tonFocusOutside: ( event: FocusEvent ) => void\n): UseFocusOutsideReturn {\n\tconst currentOnFocusOutside = useRef( onFocusOutside );\n\tuseEffect( () => {\n\t\tcurrentOnFocusOutside.current = onFocusOutside;\n\t}, [ onFocusOutside ] );\n\n\tconst preventBlurCheck = useRef( false );\n\n\tconst blurCheckTimeoutId = useRef< number | undefined >();\n\n\t/**\n\t * Cancel a blur check timeout.\n\t */\n\tconst cancelBlurCheck = useCallback( () => {\n\t\tclearTimeout( blurCheckTimeoutId.current );\n\t}, [] );\n\n\t// Cancel blur checks on unmount.\n\tuseEffect( () => {\n\t\treturn () => cancelBlurCheck();\n\t}, [] );\n\n\t// Cancel a blur check if the callback or ref is no longer provided.\n\tuseEffect( () => {\n\t\tif ( ! onFocusOutside ) {\n\t\t\tcancelBlurCheck();\n\t\t}\n\t}, [ onFocusOutside, cancelBlurCheck ] );\n\n\t/**\n\t * Handles a mousedown or mouseup event to respectively assign and\n\t * unassign a flag for preventing blur check on button elements. Some\n\t * browsers, namely Firefox and Safari, do not emit a focus event on\n\t * button elements when clicked, while others do. The logic here\n\t * intends to normalize this as treating click on buttons as focus.\n\t *\n\t * @param event\n\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n\t */\n\tconst normalizeButtonFocus: EventHandler< MouseEvent | TouchEvent > =\n\t\tuseCallback( ( event ) => {\n\t\t\tconst { type, target } = event;\n\t\t\tconst isInteractionEnd = [ 'mouseup', 'touchend' ].includes( type );\n\n\t\t\tif ( isInteractionEnd ) {\n\t\t\t\tpreventBlurCheck.current = false;\n\t\t\t} else if ( isFocusNormalizedButton( target ) ) {\n\t\t\t\tpreventBlurCheck.current = true;\n\t\t\t}\n\t\t}, [] );\n\n\t/**\n\t * A callback triggered when a blur event occurs on the element the handler\n\t * is bound to.\n\t *\n\t * Calls the `onFocusOutside` callback in an immediate timeout if focus has\n\t * move outside the bound element and is still within the document.\n\t */\n\tconst queueBlurCheck: FocusEventHandler = useCallback( ( event ) => {\n\t\t// React does not allow using an event reference asynchronously\n\t\t// due to recycling behavior, except when explicitly persisted.\n\t\tevent.persist();\n\n\t\t// Skip blur check if clicking button. See `normalizeButtonFocus`.\n\t\tif ( preventBlurCheck.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// The usage of this attribute should be avoided. The only use case\n\t\t// would be when we load modals that are not React components and\n\t\t// therefore don't exist in the React tree. An example is opening\n\t\t// the Media Library modal from another dialog.\n\t\t// This attribute should contain a selector of the related target\n\t\t// we want to ignore, because we still need to trigger the blur event\n\t\t// on all other cases.\n\t\tconst ignoreForRelatedTarget = event.target.getAttribute(\n\t\t\t'data-unstable-ignore-focus-outside-for-relatedtarget'\n\t\t);\n\t\tif (\n\t\t\tignoreForRelatedTarget &&\n\t\t\tevent.relatedTarget?.closest( ignoreForRelatedTarget )\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tblurCheckTimeoutId.current = setTimeout( () => {\n\t\t\t// If document is not focused then focus should remain\n\t\t\t// inside the wrapped component and therefore we cancel\n\t\t\t// this blur event thereby leaving focus in place.\n\t\t\t// https://developer.mozilla.org/en-US/docs/Web/API/Document/hasFocus.\n\t\t\tif ( ! document.hasFocus() ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( 'function' === typeof currentOnFocusOutside.current ) {\n\t\t\t\tcurrentOnFocusOutside.current( event );\n\t\t\t}\n\t\t}, 0 );\n\t}, [] );\n\n\treturn {\n\t\tonFocus: cancelBlurCheck,\n\t\tonMouseDown: normalizeButtonFocus,\n\t\tonMouseUp: normalizeButtonFocus,\n\t\tonTouchStart: normalizeButtonFocus,\n\t\tonTouchEnd: normalizeButtonFocus,\n\t\tonBlur: queueBlurCheck,\n\t};\n}\n"]}
@@ -48,11 +48,9 @@ function useFocusReturn(onFocusReturn) {
48
48
 
49
49
  focusedBeforeMount.current = node.ownerDocument.activeElement;
50
50
  } else if (focusedBeforeMount.current) {
51
- var _ref$current, _ref$current2, _ref$current3;
51
+ const isFocused = ref.current?.contains(ref.current?.ownerDocument.activeElement);
52
52
 
53
- const isFocused = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.contains((_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.ownerDocument.activeElement);
54
-
55
- if ((_ref$current3 = ref.current) !== null && _ref$current3 !== void 0 && _ref$current3.isConnected && !isFocused) {
53
+ if (ref.current?.isConnected && !isFocused) {
56
54
  return;
57
55
  } // Defer to the component's own explicit focus return behavior, if
58
56
  // specified. This allows for support that the `onFocusReturn`
@@ -63,10 +61,8 @@ function useFocusReturn(onFocusReturn) {
63
61
  if (onFocusReturnRef.current) {
64
62
  onFocusReturnRef.current();
65
63
  } else {
66
- var _focusedBeforeMount$c;
67
-
68
64
  /** @type {null | HTMLElement} */
69
- (_focusedBeforeMount$c = focusedBeforeMount.current) === null || _focusedBeforeMount$c === void 0 ? void 0 : _focusedBeforeMount$c.focus();
65
+ focusedBeforeMount.current?.focus();
70
66
  }
71
67
  }
72
68
  }, []);
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-return/index.js"],"names":["useRef","useEffect","useCallback","useFocusReturn","onFocusReturn","ref","focusedBeforeMount","onFocusReturnRef","current","node","ownerDocument","activeElement","isFocused","contains","isConnected","focus"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,SAAjB,EAA4BC,WAA5B,QAA+C,oBAA/C;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,cAAT,CAAyBC,aAAzB,EAAyC;AACxC;AACA,QAAMC,GAAG,GAAGL,MAAM,CAAE,IAAF,CAAlB;AACA;;AACA,QAAMM,kBAAkB,GAAGN,MAAM,CAAE,IAAF,CAAjC;AACA,QAAMO,gBAAgB,GAAGP,MAAM,CAAEI,aAAF,CAA/B;AACAH,EAAAA,SAAS,CAAE,MAAM;AAChBM,IAAAA,gBAAgB,CAACC,OAAjB,GAA2BJ,aAA3B;AACA,GAFQ,EAEN,CAAEA,aAAF,CAFM,CAAT;AAIA,SAAOF,WAAW,CAAIO,IAAF,IAAY;AAC/B,QAAKA,IAAL,EAAY;AACX;AACAJ,MAAAA,GAAG,CAACG,OAAJ,GAAcC,IAAd,CAFW,CAIX;;AACA,UAAKH,kBAAkB,CAACE,OAAxB,EAAkC;AACjC;AACA;;AAEDF,MAAAA,kBAAkB,CAACE,OAAnB,GAA6BC,IAAI,CAACC,aAAL,CAAmBC,aAAhD;AACA,KAVD,MAUO,IAAKL,kBAAkB,CAACE,OAAxB,EAAkC;AAAA;;AACxC,YAAMI,SAAS,mBAAGP,GAAG,CAACG,OAAP,iDAAG,aAAaK,QAAb,kBACjBR,GAAG,CAACG,OADa,kDACjB,cAAaE,aAAb,CAA2BC,aADV,CAAlB;;AAIA,UAAK,iBAAAN,GAAG,CAACG,OAAJ,wDAAaM,WAAb,IAA4B,CAAEF,SAAnC,EAA+C;AAC9C;AACA,OAPuC,CASxC;AACA;AACA;AACA;;;AACA,UAAKL,gBAAgB,CAACC,OAAtB,EAAgC;AAC/BD,QAAAA,gBAAgB,CAACC,OAAjB;AACA,OAFD,MAEO;AAAA;;AACN;AAAkC,iCACjCF,kBAAkB,CAACE,OADc,gFAE/BO,KAF+B;AAGlC;AACD;AACD,GAhCiB,EAgCf,EAhCe,CAAlB;AAiCA;;AAED,eAAeZ,cAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useCallback } from '@wordpress/element';\n\n/**\n * When opening modals/sidebars/dialogs, the focus\n * must move to the opened area and return to the\n * previously focused element when closed.\n * The current hook implements the returning behavior.\n *\n * @param {() => void} [onFocusReturn] Overrides the default return behavior.\n * @return {import('react').RefCallback<HTMLElement>} Element Ref.\n *\n * @example\n * ```js\n * import { useFocusReturn } from '@wordpress/compose';\n *\n * const WithFocusReturn = () => {\n * const ref = useFocusReturn()\n * return (\n * <div ref={ ref }>\n * <Button />\n * <Button />\n * </div>\n * );\n * }\n * ```\n */\nfunction useFocusReturn( onFocusReturn ) {\n\t/** @type {import('react').MutableRefObject<null | HTMLElement>} */\n\tconst ref = useRef( null );\n\t/** @type {import('react').MutableRefObject<null | Element>} */\n\tconst focusedBeforeMount = useRef( null );\n\tconst onFocusReturnRef = useRef( onFocusReturn );\n\tuseEffect( () => {\n\t\tonFocusReturnRef.current = onFocusReturn;\n\t}, [ onFocusReturn ] );\n\n\treturn useCallback( ( node ) => {\n\t\tif ( node ) {\n\t\t\t// Set ref to be used when unmounting.\n\t\t\tref.current = node;\n\n\t\t\t// Only set when the node mounts.\n\t\t\tif ( focusedBeforeMount.current ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfocusedBeforeMount.current = node.ownerDocument.activeElement;\n\t\t} else if ( focusedBeforeMount.current ) {\n\t\t\tconst isFocused = ref.current?.contains(\n\t\t\t\tref.current?.ownerDocument.activeElement\n\t\t\t);\n\n\t\t\tif ( ref.current?.isConnected && ! isFocused ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Defer to the component's own explicit focus return behavior, if\n\t\t\t// specified. This allows for support that the `onFocusReturn`\n\t\t\t// decides to allow the default behavior to occur under some\n\t\t\t// conditions.\n\t\t\tif ( onFocusReturnRef.current ) {\n\t\t\t\tonFocusReturnRef.current();\n\t\t\t} else {\n\t\t\t\t/** @type {null | HTMLElement} */ (\n\t\t\t\t\tfocusedBeforeMount.current\n\t\t\t\t)?.focus();\n\t\t\t}\n\t\t}\n\t}, [] );\n}\n\nexport default useFocusReturn;\n"]}
1
+ {"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-return/index.js"],"names":["useRef","useEffect","useCallback","useFocusReturn","onFocusReturn","ref","focusedBeforeMount","onFocusReturnRef","current","node","ownerDocument","activeElement","isFocused","contains","isConnected","focus"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,SAAjB,EAA4BC,WAA5B,QAA+C,oBAA/C;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,cAAT,CAAyBC,aAAzB,EAAyC;AACxC;AACA,QAAMC,GAAG,GAAGL,MAAM,CAAE,IAAF,CAAlB;AACA;;AACA,QAAMM,kBAAkB,GAAGN,MAAM,CAAE,IAAF,CAAjC;AACA,QAAMO,gBAAgB,GAAGP,MAAM,CAAEI,aAAF,CAA/B;AACAH,EAAAA,SAAS,CAAE,MAAM;AAChBM,IAAAA,gBAAgB,CAACC,OAAjB,GAA2BJ,aAA3B;AACA,GAFQ,EAEN,CAAEA,aAAF,CAFM,CAAT;AAIA,SAAOF,WAAW,CAAIO,IAAF,IAAY;AAC/B,QAAKA,IAAL,EAAY;AACX;AACAJ,MAAAA,GAAG,CAACG,OAAJ,GAAcC,IAAd,CAFW,CAIX;;AACA,UAAKH,kBAAkB,CAACE,OAAxB,EAAkC;AACjC;AACA;;AAEDF,MAAAA,kBAAkB,CAACE,OAAnB,GAA6BC,IAAI,CAACC,aAAL,CAAmBC,aAAhD;AACA,KAVD,MAUO,IAAKL,kBAAkB,CAACE,OAAxB,EAAkC;AACxC,YAAMI,SAAS,GAAGP,GAAG,CAACG,OAAJ,EAAaK,QAAb,CACjBR,GAAG,CAACG,OAAJ,EAAaE,aAAb,CAA2BC,aADV,CAAlB;;AAIA,UAAKN,GAAG,CAACG,OAAJ,EAAaM,WAAb,IAA4B,CAAEF,SAAnC,EAA+C;AAC9C;AACA,OAPuC,CASxC;AACA;AACA;AACA;;;AACA,UAAKL,gBAAgB,CAACC,OAAtB,EAAgC;AAC/BD,QAAAA,gBAAgB,CAACC,OAAjB;AACA,OAFD,MAEO;AACN;AACCF,QAAAA,kBAAkB,CAACE,OADc,EAE/BO,KAF+B;AAGlC;AACD;AACD,GAhCiB,EAgCf,EAhCe,CAAlB;AAiCA;;AAED,eAAeZ,cAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useCallback } from '@wordpress/element';\n\n/**\n * When opening modals/sidebars/dialogs, the focus\n * must move to the opened area and return to the\n * previously focused element when closed.\n * The current hook implements the returning behavior.\n *\n * @param {() => void} [onFocusReturn] Overrides the default return behavior.\n * @return {import('react').RefCallback<HTMLElement>} Element Ref.\n *\n * @example\n * ```js\n * import { useFocusReturn } from '@wordpress/compose';\n *\n * const WithFocusReturn = () => {\n * const ref = useFocusReturn()\n * return (\n * <div ref={ ref }>\n * <Button />\n * <Button />\n * </div>\n * );\n * }\n * ```\n */\nfunction useFocusReturn( onFocusReturn ) {\n\t/** @type {import('react').MutableRefObject<null | HTMLElement>} */\n\tconst ref = useRef( null );\n\t/** @type {import('react').MutableRefObject<null | Element>} */\n\tconst focusedBeforeMount = useRef( null );\n\tconst onFocusReturnRef = useRef( onFocusReturn );\n\tuseEffect( () => {\n\t\tonFocusReturnRef.current = onFocusReturn;\n\t}, [ onFocusReturn ] );\n\n\treturn useCallback( ( node ) => {\n\t\tif ( node ) {\n\t\t\t// Set ref to be used when unmounting.\n\t\t\tref.current = node;\n\n\t\t\t// Only set when the node mounts.\n\t\t\tif ( focusedBeforeMount.current ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfocusedBeforeMount.current = node.ownerDocument.activeElement;\n\t\t} else if ( focusedBeforeMount.current ) {\n\t\t\tconst isFocused = ref.current?.contains(\n\t\t\t\tref.current?.ownerDocument.activeElement\n\t\t\t);\n\n\t\t\tif ( ref.current?.isConnected && ! isFocused ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Defer to the component's own explicit focus return behavior, if\n\t\t\t// specified. This allows for support that the `onFocusReturn`\n\t\t\t// decides to allow the default behavior to occur under some\n\t\t\t// conditions.\n\t\t\tif ( onFocusReturnRef.current ) {\n\t\t\t\tonFocusReturnRef.current();\n\t\t\t} else {\n\t\t\t\t/** @type {null | HTMLElement} */ (\n\t\t\t\t\tfocusedBeforeMount.current\n\t\t\t\t)?.focus();\n\t\t\t}\n\t\t}\n\t}, [] );\n}\n\nexport default useFocusReturn;\n"]}
@@ -34,14 +34,13 @@ import { isAppleOS } from '@wordpress/keycodes';
34
34
 
35
35
  function useKeyboardShortcut(
36
36
  /* eslint-enable jsdoc/valid-types */
37
- shortcuts, callback) {
38
- let {
39
- bindGlobal = false,
40
- eventName = 'keydown',
41
- isDisabled = false,
42
- // This is important for performance considerations.
43
- target
44
- } = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
37
+ shortcuts, callback, {
38
+ bindGlobal = false,
39
+ eventName = 'keydown',
40
+ isDisabled = false,
41
+ // This is important for performance considerations.
42
+ target
43
+ } = {}) {
45
44
  const currentCallback = useRef(callback);
46
45
  useEffect(() => {
47
46
  currentCallback.current = callback;
@@ -75,12 +74,13 @@ shortcuts, callback) {
75
74
 
76
75
  const bindFn = bindGlobal ? 'bindGlobal' : 'bind'; // @ts-ignore `bindGlobal` is an undocumented property
77
76
 
78
- mousetrap[bindFn](shortcut, function () {
79
- return (
80
- /* eslint-enable jsdoc/valid-types */
81
- currentCallback.current(...arguments)
82
- );
83
- }, eventName);
77
+ mousetrap[bindFn](shortcut, (
78
+ /* eslint-disable jsdoc/valid-types */
79
+
80
+ /** @type {[e: import('mousetrap').ExtendedKeyboardEvent, combo: string]} */
81
+ ...args) =>
82
+ /* eslint-enable jsdoc/valid-types */
83
+ currentCallback.current(...args), eventName);
84
84
  });
85
85
  return () => {
86
86
  mousetrap.reset();
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/compose/src/hooks/use-keyboard-shortcut/index.js"],"names":["Mousetrap","useEffect","useRef","isAppleOS","useKeyboardShortcut","shortcuts","callback","bindGlobal","eventName","isDisabled","target","currentCallback","current","mousetrap","document","shortcutsArray","Array","isArray","forEach","shortcut","keys","split","modifiers","Set","filter","value","length","hasAlt","has","hasShift","size","Error","bindFn","reset"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,SAAP,MAAsB,WAAtB;AACA,OAAO,qDAAP;AAEA;AACA;AACA;;AACA,SAASC,SAAT,EAAoBC,MAApB,QAAkC,oBAAlC;AACA,SAASC,SAAT,QAA0B,qBAA1B;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,mBAAT;AACC;AACAC,SAFD,EAGCC,QAHD,EAUE;AAAA,MAND;AACCC,IAAAA,UAAU,GAAG,KADd;AAECC,IAAAA,SAAS,GAAG,SAFb;AAGCC,IAAAA,UAAU,GAAG,KAHd;AAGqB;AACpBC,IAAAA;AAJD,GAMC,uEADG,EACH;AACD,QAAMC,eAAe,GAAGT,MAAM,CAAEI,QAAF,CAA9B;AACAL,EAAAA,SAAS,CAAE,MAAM;AAChBU,IAAAA,eAAe,CAACC,OAAhB,GAA0BN,QAA1B;AACA,GAFQ,EAEN,CAAEA,QAAF,CAFM,CAAT;AAIAL,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKQ,UAAL,EAAkB;AACjB;AACA;;AACD,UAAMI,SAAS,GAAG,IAAIb,SAAJ,CACjBU,MAAM,IAAIA,MAAM,CAACE,OAAjB,GACGF,MAAM,CAACE,OADV,GAEG;AACA;AACA;;AACA;;AAAyB;AAAyBE,IAAAA,QANpC,CAAlB;AAQA,UAAMC,cAAc,GAAGC,KAAK,CAACC,OAAN,CAAeZ,SAAf,IACpBA,SADoB,GAEpB,CAAEA,SAAF,CAFH;AAGAU,IAAAA,cAAc,CAACG,OAAf,CAA0BC,QAAF,IAAgB;AACvC,YAAMC,IAAI,GAAGD,QAAQ,CAACE,KAAT,CAAgB,GAAhB,CAAb,CADuC,CAEvC;AACA;AACA;;AACA,YAAMC,SAAS,GAAG,IAAIC,GAAJ,CACjBH,IAAI,CAACI,MAAL,CAAeC,KAAF,IAAaA,KAAK,CAACC,MAAN,GAAe,CAAzC,CADiB,CAAlB;AAGA,YAAMC,MAAM,GAAGL,SAAS,CAACM,GAAV,CAAe,KAAf,CAAf;AACA,YAAMC,QAAQ,GAAGP,SAAS,CAACM,GAAV,CAAe,OAAf,CAAjB,CATuC,CAWvC;;AACA,UACCzB,SAAS,OACLmB,SAAS,CAACQ,IAAV,KAAmB,CAAnB,IAAwBH,MAA1B,IACCL,SAAS,CAACQ,IAAV,KAAmB,CAAnB,IAAwBH,MAAxB,IAAkCE,QAF5B,CADV,EAIE;AACD,cAAM,IAAIE,KAAJ,CACJ,eAAeZ,QAAU,iEADrB,CAAN;AAGA;;AAED,YAAMa,MAAM,GAAGzB,UAAU,GAAG,YAAH,GAAkB,MAA3C,CAtBuC,CAuBvC;;AACAM,MAAAA,SAAS,CAAEmB,MAAF,CAAT,CACCb,QADD,EAEC;AAAA;AAIC;AACAR,UAAAA,eAAe,CAACC,OAAhB,CAAyB,YAAzB;AALD;AAAA,OAFD,EAQCJ,SARD;AAUA,KAlCD;AAoCA,WAAO,MAAM;AACZK,MAAAA,SAAS,CAACoB,KAAV;AACA,KAFD;AAGA,GAtDQ,EAsDN,CAAE5B,SAAF,EAAaE,UAAb,EAAyBC,SAAzB,EAAoCE,MAApC,EAA4CD,UAA5C,CAtDM,CAAT;AAuDA;;AAED,eAAeL,mBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport Mousetrap from 'mousetrap';\nimport 'mousetrap/plugins/global-bind/mousetrap-global-bind';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\nimport { isAppleOS } from '@wordpress/keycodes';\n\n/**\n * A block selection object.\n *\n * @typedef {Object} WPKeyboardShortcutConfig\n *\n * @property {boolean} [bindGlobal] Handle keyboard events anywhere including inside textarea/input fields.\n * @property {string} [eventName] Event name used to trigger the handler, defaults to keydown.\n * @property {boolean} [isDisabled] Disables the keyboard handler if the value is true.\n * @property {import('react').RefObject<HTMLElement>} [target] React reference to the DOM element used to catch the keyboard event.\n */\n\n/* eslint-disable jsdoc/valid-types */\n/**\n * Attach a keyboard shortcut handler.\n *\n * @see https://craig.is/killing/mice#api.bind for information about the `callback` parameter.\n *\n * @param {string[]|string} shortcuts Keyboard Shortcuts.\n * @param {(e: import('mousetrap').ExtendedKeyboardEvent, combo: string) => void} callback Shortcut callback.\n * @param {WPKeyboardShortcutConfig} options Shortcut options.\n */\nfunction useKeyboardShortcut(\n\t/* eslint-enable jsdoc/valid-types */\n\tshortcuts,\n\tcallback,\n\t{\n\t\tbindGlobal = false,\n\t\teventName = 'keydown',\n\t\tisDisabled = false, // This is important for performance considerations.\n\t\ttarget,\n\t} = {}\n) {\n\tconst currentCallback = useRef( callback );\n\tuseEffect( () => {\n\t\tcurrentCallback.current = callback;\n\t}, [ callback ] );\n\n\tuseEffect( () => {\n\t\tif ( isDisabled ) {\n\t\t\treturn;\n\t\t}\n\t\tconst mousetrap = new Mousetrap(\n\t\t\ttarget && target.current\n\t\t\t\t? target.current\n\t\t\t\t: // We were passing `document` here previously, so to successfully cast it to Element we must cast it first to `unknown`.\n\t\t\t\t // Not sure if this is a mistake but it was the behavior previous to the addition of types so we're just doing what's\n\t\t\t\t // necessary to maintain the existing behavior.\n\t\t\t\t /** @type {Element} */ ( /** @type {unknown} */ ( document ) )\n\t\t);\n\t\tconst shortcutsArray = Array.isArray( shortcuts )\n\t\t\t? shortcuts\n\t\t\t: [ shortcuts ];\n\t\tshortcutsArray.forEach( ( shortcut ) => {\n\t\t\tconst keys = shortcut.split( '+' );\n\t\t\t// Determines whether a key is a modifier by the length of the string.\n\t\t\t// E.g. if I add a pass a shortcut Shift+Cmd+M, it'll determine that\n\t\t\t// the modifiers are Shift and Cmd because they're not a single character.\n\t\t\tconst modifiers = new Set(\n\t\t\t\tkeys.filter( ( value ) => value.length > 1 )\n\t\t\t);\n\t\t\tconst hasAlt = modifiers.has( 'alt' );\n\t\t\tconst hasShift = modifiers.has( 'shift' );\n\n\t\t\t// This should be better moved to the shortcut registration instead.\n\t\t\tif (\n\t\t\t\tisAppleOS() &&\n\t\t\t\t( ( modifiers.size === 1 && hasAlt ) ||\n\t\t\t\t\t( modifiers.size === 2 && hasAlt && hasShift ) )\n\t\t\t) {\n\t\t\t\tthrow new Error(\n\t\t\t\t\t`Cannot bind ${ shortcut }. Alt and Shift+Alt modifiers are reserved for character input.`\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tconst bindFn = bindGlobal ? 'bindGlobal' : 'bind';\n\t\t\t// @ts-ignore `bindGlobal` is an undocumented property\n\t\t\tmousetrap[ bindFn ](\n\t\t\t\tshortcut,\n\t\t\t\t(\n\t\t\t\t\t/* eslint-disable jsdoc/valid-types */\n\t\t\t\t\t/** @type {[e: import('mousetrap').ExtendedKeyboardEvent, combo: string]} */ ...args\n\t\t\t\t) =>\n\t\t\t\t\t/* eslint-enable jsdoc/valid-types */\n\t\t\t\t\tcurrentCallback.current( ...args ),\n\t\t\t\teventName\n\t\t\t);\n\t\t} );\n\n\t\treturn () => {\n\t\t\tmousetrap.reset();\n\t\t};\n\t}, [ shortcuts, bindGlobal, eventName, target, isDisabled ] );\n}\n\nexport default useKeyboardShortcut;\n"]}
1
+ {"version":3,"sources":["@wordpress/compose/src/hooks/use-keyboard-shortcut/index.js"],"names":["Mousetrap","useEffect","useRef","isAppleOS","useKeyboardShortcut","shortcuts","callback","bindGlobal","eventName","isDisabled","target","currentCallback","current","mousetrap","document","shortcutsArray","Array","isArray","forEach","shortcut","keys","split","modifiers","Set","filter","value","length","hasAlt","has","hasShift","size","Error","bindFn","args","reset"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,SAAP,MAAsB,WAAtB;AACA,OAAO,qDAAP;AAEA;AACA;AACA;;AACA,SAASC,SAAT,EAAoBC,MAApB,QAAkC,oBAAlC;AACA,SAASC,SAAT,QAA0B,qBAA1B;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,mBAAT;AACC;AACAC,SAFD,EAGCC,QAHD,EAIC;AACCC,EAAAA,UAAU,GAAG,KADd;AAECC,EAAAA,SAAS,GAAG,SAFb;AAGCC,EAAAA,UAAU,GAAG,KAHd;AAGqB;AACpBC,EAAAA;AAJD,IAKI,EATL,EAUE;AACD,QAAMC,eAAe,GAAGT,MAAM,CAAEI,QAAF,CAA9B;AACAL,EAAAA,SAAS,CAAE,MAAM;AAChBU,IAAAA,eAAe,CAACC,OAAhB,GAA0BN,QAA1B;AACA,GAFQ,EAEN,CAAEA,QAAF,CAFM,CAAT;AAIAL,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKQ,UAAL,EAAkB;AACjB;AACA;;AACD,UAAMI,SAAS,GAAG,IAAIb,SAAJ,CACjBU,MAAM,IAAIA,MAAM,CAACE,OAAjB,GACGF,MAAM,CAACE,OADV,GAEG;AACA;AACA;;AACA;;AAAyB;AAAyBE,IAAAA,QANpC,CAAlB;AAQA,UAAMC,cAAc,GAAGC,KAAK,CAACC,OAAN,CAAeZ,SAAf,IACpBA,SADoB,GAEpB,CAAEA,SAAF,CAFH;AAGAU,IAAAA,cAAc,CAACG,OAAf,CAA0BC,QAAF,IAAgB;AACvC,YAAMC,IAAI,GAAGD,QAAQ,CAACE,KAAT,CAAgB,GAAhB,CAAb,CADuC,CAEvC;AACA;AACA;;AACA,YAAMC,SAAS,GAAG,IAAIC,GAAJ,CACjBH,IAAI,CAACI,MAAL,CAAeC,KAAF,IAAaA,KAAK,CAACC,MAAN,GAAe,CAAzC,CADiB,CAAlB;AAGA,YAAMC,MAAM,GAAGL,SAAS,CAACM,GAAV,CAAe,KAAf,CAAf;AACA,YAAMC,QAAQ,GAAGP,SAAS,CAACM,GAAV,CAAe,OAAf,CAAjB,CATuC,CAWvC;;AACA,UACCzB,SAAS,OACLmB,SAAS,CAACQ,IAAV,KAAmB,CAAnB,IAAwBH,MAA1B,IACCL,SAAS,CAACQ,IAAV,KAAmB,CAAnB,IAAwBH,MAAxB,IAAkCE,QAF5B,CADV,EAIE;AACD,cAAM,IAAIE,KAAJ,CACJ,eAAeZ,QAAU,iEADrB,CAAN;AAGA;;AAED,YAAMa,MAAM,GAAGzB,UAAU,GAAG,YAAH,GAAkB,MAA3C,CAtBuC,CAuBvC;;AACAM,MAAAA,SAAS,CAAEmB,MAAF,CAAT,CACCb,QADD,EAEC;AACC;;AACA;AAA6E,SAAGc,IAFjF;AAIC;AACAtB,MAAAA,eAAe,CAACC,OAAhB,CAAyB,GAAGqB,IAA5B,CAPF,EAQCzB,SARD;AAUA,KAlCD;AAoCA,WAAO,MAAM;AACZK,MAAAA,SAAS,CAACqB,KAAV;AACA,KAFD;AAGA,GAtDQ,EAsDN,CAAE7B,SAAF,EAAaE,UAAb,EAAyBC,SAAzB,EAAoCE,MAApC,EAA4CD,UAA5C,CAtDM,CAAT;AAuDA;;AAED,eAAeL,mBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport Mousetrap from 'mousetrap';\nimport 'mousetrap/plugins/global-bind/mousetrap-global-bind';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\nimport { isAppleOS } from '@wordpress/keycodes';\n\n/**\n * A block selection object.\n *\n * @typedef {Object} WPKeyboardShortcutConfig\n *\n * @property {boolean} [bindGlobal] Handle keyboard events anywhere including inside textarea/input fields.\n * @property {string} [eventName] Event name used to trigger the handler, defaults to keydown.\n * @property {boolean} [isDisabled] Disables the keyboard handler if the value is true.\n * @property {import('react').RefObject<HTMLElement>} [target] React reference to the DOM element used to catch the keyboard event.\n */\n\n/* eslint-disable jsdoc/valid-types */\n/**\n * Attach a keyboard shortcut handler.\n *\n * @see https://craig.is/killing/mice#api.bind for information about the `callback` parameter.\n *\n * @param {string[]|string} shortcuts Keyboard Shortcuts.\n * @param {(e: import('mousetrap').ExtendedKeyboardEvent, combo: string) => void} callback Shortcut callback.\n * @param {WPKeyboardShortcutConfig} options Shortcut options.\n */\nfunction useKeyboardShortcut(\n\t/* eslint-enable jsdoc/valid-types */\n\tshortcuts,\n\tcallback,\n\t{\n\t\tbindGlobal = false,\n\t\teventName = 'keydown',\n\t\tisDisabled = false, // This is important for performance considerations.\n\t\ttarget,\n\t} = {}\n) {\n\tconst currentCallback = useRef( callback );\n\tuseEffect( () => {\n\t\tcurrentCallback.current = callback;\n\t}, [ callback ] );\n\n\tuseEffect( () => {\n\t\tif ( isDisabled ) {\n\t\t\treturn;\n\t\t}\n\t\tconst mousetrap = new Mousetrap(\n\t\t\ttarget && target.current\n\t\t\t\t? target.current\n\t\t\t\t: // We were passing `document` here previously, so to successfully cast it to Element we must cast it first to `unknown`.\n\t\t\t\t // Not sure if this is a mistake but it was the behavior previous to the addition of types so we're just doing what's\n\t\t\t\t // necessary to maintain the existing behavior.\n\t\t\t\t /** @type {Element} */ ( /** @type {unknown} */ ( document ) )\n\t\t);\n\t\tconst shortcutsArray = Array.isArray( shortcuts )\n\t\t\t? shortcuts\n\t\t\t: [ shortcuts ];\n\t\tshortcutsArray.forEach( ( shortcut ) => {\n\t\t\tconst keys = shortcut.split( '+' );\n\t\t\t// Determines whether a key is a modifier by the length of the string.\n\t\t\t// E.g. if I add a pass a shortcut Shift+Cmd+M, it'll determine that\n\t\t\t// the modifiers are Shift and Cmd because they're not a single character.\n\t\t\tconst modifiers = new Set(\n\t\t\t\tkeys.filter( ( value ) => value.length > 1 )\n\t\t\t);\n\t\t\tconst hasAlt = modifiers.has( 'alt' );\n\t\t\tconst hasShift = modifiers.has( 'shift' );\n\n\t\t\t// This should be better moved to the shortcut registration instead.\n\t\t\tif (\n\t\t\t\tisAppleOS() &&\n\t\t\t\t( ( modifiers.size === 1 && hasAlt ) ||\n\t\t\t\t\t( modifiers.size === 2 && hasAlt && hasShift ) )\n\t\t\t) {\n\t\t\t\tthrow new Error(\n\t\t\t\t\t`Cannot bind ${ shortcut }. Alt and Shift+Alt modifiers are reserved for character input.`\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tconst bindFn = bindGlobal ? 'bindGlobal' : 'bind';\n\t\t\t// @ts-ignore `bindGlobal` is an undocumented property\n\t\t\tmousetrap[ bindFn ](\n\t\t\t\tshortcut,\n\t\t\t\t(\n\t\t\t\t\t/* eslint-disable jsdoc/valid-types */\n\t\t\t\t\t/** @type {[e: import('mousetrap').ExtendedKeyboardEvent, combo: string]} */ ...args\n\t\t\t\t) =>\n\t\t\t\t\t/* eslint-enable jsdoc/valid-types */\n\t\t\t\t\tcurrentCallback.current( ...args ),\n\t\t\t\teventName\n\t\t\t);\n\t\t} );\n\n\t\treturn () => {\n\t\t\tmousetrap.reset();\n\t\t};\n\t}, [ shortcuts, bindGlobal, eventName, target, isDisabled ] );\n}\n\nexport default useKeyboardShortcut;\n"]}
@@ -43,7 +43,7 @@ export default function useMediaQuery(query) {
43
43
  getValue() {
44
44
  var _mediaQueryList$match;
45
45
 
46
- return (_mediaQueryList$match = mediaQueryList === null || mediaQueryList === void 0 ? void 0 : mediaQueryList.matches) !== null && _mediaQueryList$match !== void 0 ? _mediaQueryList$match : false;
46
+ return (_mediaQueryList$match = mediaQueryList?.matches) !== null && _mediaQueryList$match !== void 0 ? _mediaQueryList$match : false;
47
47
  }
48
48
 
49
49
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/compose/src/hooks/use-media-query/index.js"],"names":["useMemo","useSyncExternalStore","getMediaQueryList","query","window","matchMedia","useMediaQuery","source","mediaQueryList","subscribe","onStoreChange","addEventListener","removeEventListener","getValue","matches"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAT,EAAkBC,oBAAlB,QAA8C,oBAA9C;AAEA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,iBAAT,CAA4BC,KAA5B,EAAoC;AACnC,MACCA,KAAK,IACL,OAAOC,MAAP,KAAkB,WADlB,IAEA,OAAOA,MAAM,CAACC,UAAd,KAA6B,UAH9B,EAIE;AACD,WAAOD,MAAM,CAACC,UAAP,CAAmBF,KAAnB,CAAP;AACA;;AAED,SAAO,IAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;;;AACA,eAAe,SAASG,aAAT,CAAwBH,KAAxB,EAAgC;AAC9C,QAAMI,MAAM,GAAGP,OAAO,CAAE,MAAM;AAC7B,UAAMQ,cAAc,GAAGN,iBAAiB,CAAEC,KAAF,CAAxC;AAEA,WAAO;AACN;AACAM,MAAAA,SAAS,CAAEC,aAAF,EAAkB;AAC1B,YAAK,CAAEF,cAAP,EAAwB;AACvB,iBAAO,MAAM,CAAE,CAAf;AACA;;AAEDA,QAAAA,cAAc,CAACG,gBAAf,CAAiC,QAAjC,EAA2CD,aAA3C;AACA,eAAO,MAAM;AACZF,UAAAA,cAAc,CAACI,mBAAf,CACC,QADD,EAECF,aAFD;AAIA,SALD;AAMA,OAdK;;AAeNG,MAAAA,QAAQ,GAAG;AAAA;;AACV,wCAAOL,cAAP,aAAOA,cAAP,uBAAOA,cAAc,CAAEM,OAAvB,yEAAkC,KAAlC;AACA;;AAjBK,KAAP;AAmBA,GAtBqB,EAsBnB,CAAEX,KAAF,CAtBmB,CAAtB;AAwBA,SAAOF,oBAAoB,CAC1BM,MAAM,CAACE,SADmB,EAE1BF,MAAM,CAACM,QAFmB,EAG1B,MAAM,KAHoB,CAA3B;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo, useSyncExternalStore } from '@wordpress/element';\n\n/**\n * A new MediaQueryList object for the media query\n *\n * @param {string} [query] Media Query.\n * @return {MediaQueryList|null} A new object for the media query\n */\nfunction getMediaQueryList( query ) {\n\tif (\n\t\tquery &&\n\t\ttypeof window !== 'undefined' &&\n\t\ttypeof window.matchMedia === 'function'\n\t) {\n\t\treturn window.matchMedia( query );\n\t}\n\n\treturn null;\n}\n\n/**\n * Runs a media query and returns its value when it changes.\n *\n * @param {string} [query] Media Query.\n * @return {boolean} return value of the media query.\n */\nexport default function useMediaQuery( query ) {\n\tconst source = useMemo( () => {\n\t\tconst mediaQueryList = getMediaQueryList( query );\n\n\t\treturn {\n\t\t\t/** @type {(onStoreChange: () => void) => () => void} */\n\t\t\tsubscribe( onStoreChange ) {\n\t\t\t\tif ( ! mediaQueryList ) {\n\t\t\t\t\treturn () => {};\n\t\t\t\t}\n\n\t\t\t\tmediaQueryList.addEventListener( 'change', onStoreChange );\n\t\t\t\treturn () => {\n\t\t\t\t\tmediaQueryList.removeEventListener(\n\t\t\t\t\t\t'change',\n\t\t\t\t\t\tonStoreChange\n\t\t\t\t\t);\n\t\t\t\t};\n\t\t\t},\n\t\t\tgetValue() {\n\t\t\t\treturn mediaQueryList?.matches ?? false;\n\t\t\t},\n\t\t};\n\t}, [ query ] );\n\n\treturn useSyncExternalStore(\n\t\tsource.subscribe,\n\t\tsource.getValue,\n\t\t() => false\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/compose/src/hooks/use-media-query/index.js"],"names":["useMemo","useSyncExternalStore","getMediaQueryList","query","window","matchMedia","useMediaQuery","source","mediaQueryList","subscribe","onStoreChange","addEventListener","removeEventListener","getValue","matches"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAT,EAAkBC,oBAAlB,QAA8C,oBAA9C;AAEA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,iBAAT,CAA4BC,KAA5B,EAAoC;AACnC,MACCA,KAAK,IACL,OAAOC,MAAP,KAAkB,WADlB,IAEA,OAAOA,MAAM,CAACC,UAAd,KAA6B,UAH9B,EAIE;AACD,WAAOD,MAAM,CAACC,UAAP,CAAmBF,KAAnB,CAAP;AACA;;AAED,SAAO,IAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;;;AACA,eAAe,SAASG,aAAT,CAAwBH,KAAxB,EAAgC;AAC9C,QAAMI,MAAM,GAAGP,OAAO,CAAE,MAAM;AAC7B,UAAMQ,cAAc,GAAGN,iBAAiB,CAAEC,KAAF,CAAxC;AAEA,WAAO;AACN;AACAM,MAAAA,SAAS,CAAEC,aAAF,EAAkB;AAC1B,YAAK,CAAEF,cAAP,EAAwB;AACvB,iBAAO,MAAM,CAAE,CAAf;AACA;;AAEDA,QAAAA,cAAc,CAACG,gBAAf,CAAiC,QAAjC,EAA2CD,aAA3C;AACA,eAAO,MAAM;AACZF,UAAAA,cAAc,CAACI,mBAAf,CACC,QADD,EAECF,aAFD;AAIA,SALD;AAMA,OAdK;;AAeNG,MAAAA,QAAQ,GAAG;AAAA;;AACV,wCAAOL,cAAc,EAAEM,OAAvB,yEAAkC,KAAlC;AACA;;AAjBK,KAAP;AAmBA,GAtBqB,EAsBnB,CAAEX,KAAF,CAtBmB,CAAtB;AAwBA,SAAOF,oBAAoB,CAC1BM,MAAM,CAACE,SADmB,EAE1BF,MAAM,CAACM,QAFmB,EAG1B,MAAM,KAHoB,CAA3B;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo, useSyncExternalStore } from '@wordpress/element';\n\n/**\n * A new MediaQueryList object for the media query\n *\n * @param {string} [query] Media Query.\n * @return {MediaQueryList|null} A new object for the media query\n */\nfunction getMediaQueryList( query ) {\n\tif (\n\t\tquery &&\n\t\ttypeof window !== 'undefined' &&\n\t\ttypeof window.matchMedia === 'function'\n\t) {\n\t\treturn window.matchMedia( query );\n\t}\n\n\treturn null;\n}\n\n/**\n * Runs a media query and returns its value when it changes.\n *\n * @param {string} [query] Media Query.\n * @return {boolean} return value of the media query.\n */\nexport default function useMediaQuery( query ) {\n\tconst source = useMemo( () => {\n\t\tconst mediaQueryList = getMediaQueryList( query );\n\n\t\treturn {\n\t\t\t/** @type {(onStoreChange: () => void) => () => void} */\n\t\t\tsubscribe( onStoreChange ) {\n\t\t\t\tif ( ! mediaQueryList ) {\n\t\t\t\t\treturn () => {};\n\t\t\t\t}\n\n\t\t\t\tmediaQueryList.addEventListener( 'change', onStoreChange );\n\t\t\t\treturn () => {\n\t\t\t\t\tmediaQueryList.removeEventListener(\n\t\t\t\t\t\t'change',\n\t\t\t\t\t\tonStoreChange\n\t\t\t\t\t);\n\t\t\t\t};\n\t\t\t},\n\t\t\tgetValue() {\n\t\t\t\treturn mediaQueryList?.matches ?? false;\n\t\t\t},\n\t\t};\n\t}, [ query ] );\n\n\treturn useSyncExternalStore(\n\t\tsource.subscribe,\n\t\tsource.getValue,\n\t\t() => false\n\t);\n}\n"]}
@@ -12,10 +12,9 @@ import { subscribePreferredColorScheme, isInitialColorSchemeDark } from '@wordpr
12
12
  function usePreferredColorScheme() {
13
13
  const [currentColorScheme, setCurrentColorScheme] = useState(isInitialColorSchemeDark ? 'dark' : 'light');
14
14
  useEffect(() => {
15
- subscribePreferredColorScheme(_ref => {
16
- let {
17
- isPreferredColorSchemeDark
18
- } = _ref;
15
+ subscribePreferredColorScheme(({
16
+ isPreferredColorSchemeDark
17
+ }) => {
19
18
  const colorScheme = isPreferredColorSchemeDark ? 'dark' : 'light';
20
19
 
21
20
  if (colorScheme !== currentColorScheme) {
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/compose/src/hooks/use-preferred-color-scheme/index.android.js"],"names":["useState","useEffect","subscribePreferredColorScheme","isInitialColorSchemeDark","usePreferredColorScheme","currentColorScheme","setCurrentColorScheme","isPreferredColorSchemeDark","colorScheme"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,QAAT,EAAmBC,SAAnB,QAAoC,oBAApC;AACA,SACCC,6BADD,EAECC,wBAFD,QAGO,gCAHP;AAKA;AACA;AACA;AACA;AACA;;AACA,SAASC,uBAAT,GAAmC;AAClC,QAAM,CAAEC,kBAAF,EAAsBC,qBAAtB,IAAgDN,QAAQ,CAC7DG,wBAAwB,GAAG,MAAH,GAAY,OADyB,CAA9D;AAGAF,EAAAA,SAAS,CAAE,MAAM;AAChBC,IAAAA,6BAA6B,CAAE,QAAsC;AAAA,UAApC;AAAEK,QAAAA;AAAF,OAAoC;AACpE,YAAMC,WAAW,GAAGD,0BAA0B,GAAG,MAAH,GAAY,OAA1D;;AACA,UAAKC,WAAW,KAAKH,kBAArB,EAA0C;AACzCC,QAAAA,qBAAqB,CAAEE,WAAF,CAArB;AACA;AACD,KAL4B,CAA7B;AAMA,GAPQ,CAAT;AAQA,SAAOH,kBAAP;AACA;;AAED,eAAeD,uBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useEffect } from '@wordpress/element';\nimport {\n\tsubscribePreferredColorScheme,\n\tisInitialColorSchemeDark,\n} from '@wordpress/react-native-bridge';\n\n/**\n * Returns the color scheme value when it changes. Possible values: [ 'light', 'dark' ]\n *\n * @return {string} return current color scheme.\n */\nfunction usePreferredColorScheme() {\n\tconst [ currentColorScheme, setCurrentColorScheme ] = useState(\n\t\tisInitialColorSchemeDark ? 'dark' : 'light'\n\t);\n\tuseEffect( () => {\n\t\tsubscribePreferredColorScheme( ( { isPreferredColorSchemeDark } ) => {\n\t\t\tconst colorScheme = isPreferredColorSchemeDark ? 'dark' : 'light';\n\t\t\tif ( colorScheme !== currentColorScheme ) {\n\t\t\t\tsetCurrentColorScheme( colorScheme );\n\t\t\t}\n\t\t} );\n\t} );\n\treturn currentColorScheme;\n}\n\nexport default usePreferredColorScheme;\n"]}
1
+ {"version":3,"sources":["@wordpress/compose/src/hooks/use-preferred-color-scheme/index.android.js"],"names":["useState","useEffect","subscribePreferredColorScheme","isInitialColorSchemeDark","usePreferredColorScheme","currentColorScheme","setCurrentColorScheme","isPreferredColorSchemeDark","colorScheme"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,QAAT,EAAmBC,SAAnB,QAAoC,oBAApC;AACA,SACCC,6BADD,EAECC,wBAFD,QAGO,gCAHP;AAKA;AACA;AACA;AACA;AACA;;AACA,SAASC,uBAAT,GAAmC;AAClC,QAAM,CAAEC,kBAAF,EAAsBC,qBAAtB,IAAgDN,QAAQ,CAC7DG,wBAAwB,GAAG,MAAH,GAAY,OADyB,CAA9D;AAGAF,EAAAA,SAAS,CAAE,MAAM;AAChBC,IAAAA,6BAA6B,CAAE,CAAE;AAAEK,MAAAA;AAAF,KAAF,KAAsC;AACpE,YAAMC,WAAW,GAAGD,0BAA0B,GAAG,MAAH,GAAY,OAA1D;;AACA,UAAKC,WAAW,KAAKH,kBAArB,EAA0C;AACzCC,QAAAA,qBAAqB,CAAEE,WAAF,CAArB;AACA;AACD,KAL4B,CAA7B;AAMA,GAPQ,CAAT;AAQA,SAAOH,kBAAP;AACA;;AAED,eAAeD,uBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useEffect } from '@wordpress/element';\nimport {\n\tsubscribePreferredColorScheme,\n\tisInitialColorSchemeDark,\n} from '@wordpress/react-native-bridge';\n\n/**\n * Returns the color scheme value when it changes. Possible values: [ 'light', 'dark' ]\n *\n * @return {string} return current color scheme.\n */\nfunction usePreferredColorScheme() {\n\tconst [ currentColorScheme, setCurrentColorScheme ] = useState(\n\t\tisInitialColorSchemeDark ? 'dark' : 'light'\n\t);\n\tuseEffect( () => {\n\t\tsubscribePreferredColorScheme( ( { isPreferredColorSchemeDark } ) => {\n\t\t\tconst colorScheme = isPreferredColorSchemeDark ? 'dark' : 'light';\n\t\t\tif ( colorScheme !== currentColorScheme ) {\n\t\t\t\tsetCurrentColorScheme( colorScheme );\n\t\t\t}\n\t\t} );\n\t} );\n\treturn currentColorScheme;\n}\n\nexport default usePreferredColorScheme;\n"]}
@@ -110,8 +110,7 @@ const extractSize = (entry, boxProp, sizeType) => {
110
110
  entry[boxProp][sizeType];
111
111
  };
112
112
 
113
- function useResizeObserver() {
114
- let opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
113
+ function useResizeObserver(opts = {}) {
115
114
  // Saving the callback as a ref. With this, I don't need to put onResize in the
116
115
  // effect dep array, and just passing in an anonymous function without memoising
117
116
  // will not reinstantiate the hook's ResizeObserver.
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/compose/src/hooks/use-resize-observer/index.tsx"],"names":["useMemo","useRef","useCallback","useEffect","useState","useResolvedElement","subscriber","refOrElement","callbackRefElement","lastReportRef","cleanupRef","callSubscriber","element","current","HTMLElement","reporter","extractSize","entry","boxProp","sizeType","contentRect","undefined","useResizeObserver","opts","onResize","onResizeRef","round","Math","resizeObserverRef","size","setSize","width","height","didUnmount","previous","refCallback","box","instance","ResizeObserver","entries","reportedWidth","reportedHeight","newWidth","newHeight","newSize","observe","unobserve","ref","useResizeAware","sizes","resizeListener","position","top","left","right","bottom","pointerEvents","opacity","overflow","zIndex"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { RefCallback, RefObject } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseMemo,\n\tuseRef,\n\tuseCallback,\n\tuseEffect,\n\tuseState,\n} from '@wordpress/element';\nimport type { WPElement } from '@wordpress/element';\n\ntype SubscriberCleanup = () => void;\ntype SubscriberResponse = SubscriberCleanup | void;\n\n// This of course could've been more streamlined with internal state instead of\n// refs, but then host hooks / components could not opt out of renders.\n// This could've been exported to its own module, but the current build doesn't\n// seem to work with module imports and I had no more time to spend on this...\nfunction useResolvedElement< T extends HTMLElement >(\n\tsubscriber: ( element: T ) => SubscriberResponse,\n\trefOrElement?: T | RefObject< T > | null\n): RefCallback< T > {\n\tconst callbackRefElement = useRef< T | null >( null );\n\tconst lastReportRef = useRef< {\n\t\treporter: () => void;\n\t\telement: T | null;\n\t} | null >( null );\n\tconst cleanupRef = useRef< SubscriberResponse | null >();\n\n\tconst callSubscriber = useCallback( () => {\n\t\tlet element = null;\n\t\tif ( callbackRefElement.current ) {\n\t\t\telement = callbackRefElement.current;\n\t\t} else if ( refOrElement ) {\n\t\t\tif ( refOrElement instanceof HTMLElement ) {\n\t\t\t\telement = refOrElement;\n\t\t\t} else {\n\t\t\t\telement = refOrElement.current;\n\t\t\t}\n\t\t}\n\n\t\tif (\n\t\t\tlastReportRef.current &&\n\t\t\tlastReportRef.current.element === element &&\n\t\t\tlastReportRef.current.reporter === callSubscriber\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( cleanupRef.current ) {\n\t\t\tcleanupRef.current();\n\t\t\t// Making sure the cleanup is not called accidentally multiple times.\n\t\t\tcleanupRef.current = null;\n\t\t}\n\t\tlastReportRef.current = {\n\t\t\treporter: callSubscriber,\n\t\t\telement,\n\t\t};\n\n\t\t// Only calling the subscriber, if there's an actual element to report.\n\t\tif ( element ) {\n\t\t\tcleanupRef.current = subscriber( element );\n\t\t}\n\t}, [ refOrElement, subscriber ] );\n\n\t// On each render, we check whether a ref changed, or if we got a new raw\n\t// element.\n\tuseEffect( () => {\n\t\t// With this we're *technically* supporting cases where ref objects' current value changes, but only if there's a\n\t\t// render accompanying that change as well.\n\t\t// To guarantee we always have the right element, one must use the ref callback provided instead, but we support\n\t\t// RefObjects to make the hook API more convenient in certain cases.\n\t\tcallSubscriber();\n\t}, [ callSubscriber ] );\n\n\treturn useCallback< RefCallback< T > >(\n\t\t( element ) => {\n\t\t\tcallbackRefElement.current = element;\n\t\t\tcallSubscriber();\n\t\t},\n\t\t[ callSubscriber ]\n\t);\n}\n\ntype ObservedSize = {\n\twidth: number | undefined;\n\theight: number | undefined;\n};\n\ntype ResizeHandler = ( size: ObservedSize ) => void;\n\ntype HookResponse< T extends HTMLElement > = {\n\tref: RefCallback< T >;\n} & ObservedSize;\n\n// Declaring my own type here instead of using the one provided by TS (available since 4.2.2), because this way I'm not\n// forcing consumers to use a specific TS version.\ntype ResizeObserverBoxOptions =\n\t| 'border-box'\n\t| 'content-box'\n\t| 'device-pixel-content-box';\n\ndeclare global {\n\tinterface ResizeObserverEntry {\n\t\treadonly devicePixelContentBoxSize: ReadonlyArray< ResizeObserverSize >;\n\t}\n}\n\n// We're only using the first element of the size sequences, until future versions of the spec solidify on how\n// exactly it'll be used for fragments in multi-column scenarios:\n// From the spec:\n// > The box size properties are exposed as FrozenArray in order to support elements that have multiple fragments,\n// > which occur in multi-column scenarios. However the current definitions of content rect and border box do not\n// > mention how those boxes are affected by multi-column layout. In this spec, there will only be a single\n// > ResizeObserverSize returned in the FrozenArray, which will correspond to the dimensions of the first column.\n// > A future version of this spec will extend the returned FrozenArray to contain the per-fragment size information.\n// (https://drafts.csswg.org/resize-observer/#resize-observer-entry-interface)\n//\n// Also, testing these new box options revealed that in both Chrome and FF everything is returned in the callback,\n// regardless of the \"box\" option.\n// The spec states the following on this:\n// > This does not have any impact on which box dimensions are returned to the defined callback when the event\n// > is fired, it solely defines which box the author wishes to observe layout changes on.\n// (https://drafts.csswg.org/resize-observer/#resize-observer-interface)\n// I'm not exactly clear on what this means, especially when you consider a later section stating the following:\n// > This section is non-normative. An author may desire to observe more than one CSS box.\n// > In this case, author will need to use multiple ResizeObservers.\n// (https://drafts.csswg.org/resize-observer/#resize-observer-interface)\n// Which is clearly not how current browser implementations behave, and seems to contradict the previous quote.\n// For this reason I decided to only return the requested size,\n// even though it seems we have access to results for all box types.\n// This also means that we get to keep the current api, being able to return a simple { width, height } pair,\n// regardless of box option.\nconst extractSize = (\n\tentry: ResizeObserverEntry,\n\tboxProp: 'borderBoxSize' | 'contentBoxSize' | 'devicePixelContentBoxSize',\n\tsizeType: keyof ResizeObserverSize\n): number | undefined => {\n\tif ( ! entry[ boxProp ] ) {\n\t\tif ( boxProp === 'contentBoxSize' ) {\n\t\t\t// The dimensions in `contentBoxSize` and `contentRect` are equivalent according to the spec.\n\t\t\t// See the 6th step in the description for the RO algorithm:\n\t\t\t// https://drafts.csswg.org/resize-observer/#create-and-populate-resizeobserverentry-h\n\t\t\t// > Set this.contentRect to logical this.contentBoxSize given target and observedBox of \"content-box\".\n\t\t\t// In real browser implementations of course these objects differ, but the width/height values should be equivalent.\n\t\t\treturn entry.contentRect[\n\t\t\t\tsizeType === 'inlineSize' ? 'width' : 'height'\n\t\t\t];\n\t\t}\n\n\t\treturn undefined;\n\t}\n\n\t// A couple bytes smaller than calling Array.isArray() and just as effective here.\n\treturn entry[ boxProp ][ 0 ]\n\t\t? entry[ boxProp ][ 0 ][ sizeType ]\n\t\t: // TS complains about this, because the RO entry type follows the spec and does not reflect Firefox's current\n\t\t // behaviour of returning objects instead of arrays for `borderBoxSize` and `contentBoxSize`.\n\t\t // @ts-ignore\n\t\t entry[ boxProp ][ sizeType ];\n};\n\ntype RoundingFunction = ( n: number ) => number;\n\nfunction useResizeObserver< T extends HTMLElement >(\n\topts: {\n\t\tref?: RefObject< T > | T | null | undefined;\n\t\tonResize?: ResizeHandler;\n\t\tbox?: ResizeObserverBoxOptions;\n\t\tround?: RoundingFunction;\n\t} = {}\n): HookResponse< T > {\n\t// Saving the callback as a ref. With this, I don't need to put onResize in the\n\t// effect dep array, and just passing in an anonymous function without memoising\n\t// will not reinstantiate the hook's ResizeObserver.\n\tconst onResize = opts.onResize;\n\tconst onResizeRef = useRef< ResizeHandler | undefined >( undefined );\n\tonResizeRef.current = onResize;\n\tconst round = opts.round || Math.round;\n\n\t// Using a single instance throughout the hook's lifetime\n\tconst resizeObserverRef = useRef< {\n\t\tbox?: ResizeObserverBoxOptions;\n\t\tround?: RoundingFunction;\n\t\tinstance: ResizeObserver;\n\t} >();\n\n\tconst [ size, setSize ] = useState< {\n\t\twidth?: number;\n\t\theight?: number;\n\t} >( {\n\t\twidth: undefined,\n\t\theight: undefined,\n\t} );\n\n\t// In certain edge cases the RO might want to report a size change just after\n\t// the component unmounted.\n\tconst didUnmount = useRef( false );\n\tuseEffect( () => {\n\t\tdidUnmount.current = false;\n\t\treturn () => {\n\t\t\tdidUnmount.current = true;\n\t\t};\n\t}, [] );\n\n\t// Using a ref to track the previous width / height to avoid unnecessary renders.\n\tconst previous: {\n\t\tcurrent: {\n\t\t\twidth?: number;\n\t\t\theight?: number;\n\t\t};\n\t} = useRef( {\n\t\twidth: undefined,\n\t\theight: undefined,\n\t} );\n\n\t// This block is kinda like a useEffect, only it's called whenever a new\n\t// element could be resolved based on the ref option. It also has a cleanup\n\t// function.\n\tconst refCallback = useResolvedElement< T >(\n\t\tuseCallback(\n\t\t\t( element ) => {\n\t\t\t\t// We only use a single Resize Observer instance, and we're instantiating it on demand, only once there's something to observe.\n\t\t\t\t// This instance is also recreated when the `box` option changes, so that a new observation is fired if there was a previously observed element with a different box option.\n\t\t\t\tif (\n\t\t\t\t\t! resizeObserverRef.current ||\n\t\t\t\t\tresizeObserverRef.current.box !== opts.box ||\n\t\t\t\t\tresizeObserverRef.current.round !== round\n\t\t\t\t) {\n\t\t\t\t\tresizeObserverRef.current = {\n\t\t\t\t\t\tbox: opts.box,\n\t\t\t\t\t\tround,\n\t\t\t\t\t\tinstance: new ResizeObserver( ( entries ) => {\n\t\t\t\t\t\t\tconst entry = entries[ 0 ];\n\n\t\t\t\t\t\t\tlet boxProp:\n\t\t\t\t\t\t\t\t| 'borderBoxSize'\n\t\t\t\t\t\t\t\t| 'contentBoxSize'\n\t\t\t\t\t\t\t\t| 'devicePixelContentBoxSize' = 'borderBoxSize';\n\t\t\t\t\t\t\tif ( opts.box === 'border-box' ) {\n\t\t\t\t\t\t\t\tboxProp = 'borderBoxSize';\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tboxProp =\n\t\t\t\t\t\t\t\t\topts.box === 'device-pixel-content-box'\n\t\t\t\t\t\t\t\t\t\t? 'devicePixelContentBoxSize'\n\t\t\t\t\t\t\t\t\t\t: 'contentBoxSize';\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tconst reportedWidth = extractSize(\n\t\t\t\t\t\t\t\tentry,\n\t\t\t\t\t\t\t\tboxProp,\n\t\t\t\t\t\t\t\t'inlineSize'\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tconst reportedHeight = extractSize(\n\t\t\t\t\t\t\t\tentry,\n\t\t\t\t\t\t\t\tboxProp,\n\t\t\t\t\t\t\t\t'blockSize'\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\tconst newWidth = reportedWidth\n\t\t\t\t\t\t\t\t? round( reportedWidth )\n\t\t\t\t\t\t\t\t: undefined;\n\t\t\t\t\t\t\tconst newHeight = reportedHeight\n\t\t\t\t\t\t\t\t? round( reportedHeight )\n\t\t\t\t\t\t\t\t: undefined;\n\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tprevious.current.width !== newWidth ||\n\t\t\t\t\t\t\t\tprevious.current.height !== newHeight\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tconst newSize = {\n\t\t\t\t\t\t\t\t\twidth: newWidth,\n\t\t\t\t\t\t\t\t\theight: newHeight,\n\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\tprevious.current.width = newWidth;\n\t\t\t\t\t\t\t\tprevious.current.height = newHeight;\n\t\t\t\t\t\t\t\tif ( onResizeRef.current ) {\n\t\t\t\t\t\t\t\t\tonResizeRef.current( newSize );\n\t\t\t\t\t\t\t\t} else if ( ! didUnmount.current ) {\n\t\t\t\t\t\t\t\t\tsetSize( newSize );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} ),\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\tresizeObserverRef.current.instance.observe( element, {\n\t\t\t\t\tbox: opts.box,\n\t\t\t\t} );\n\n\t\t\t\treturn () => {\n\t\t\t\t\tif ( resizeObserverRef.current ) {\n\t\t\t\t\t\tresizeObserverRef.current.instance.unobserve( element );\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ opts.box, round ]\n\t\t),\n\t\topts.ref\n\t);\n\n\treturn useMemo(\n\t\t() => ( {\n\t\t\tref: refCallback,\n\t\t\twidth: size.width,\n\t\t\theight: size.height,\n\t\t} ),\n\t\t[ refCallback, size ? size.width : null, size ? size.height : null ]\n\t);\n}\n\n/**\n * Hook which allows to listen the resize event of any target element when it changes sizes.\n * _Note: `useResizeObserver` will report `null` until after first render.\n *\n * @example\n *\n * ```js\n * const App = () => {\n * \tconst [ resizeListener, sizes ] = useResizeObserver();\n *\n * \treturn (\n * \t\t<div>\n * \t\t\t{ resizeListener }\n * \t\t\tYour content here\n * \t\t</div>\n * \t);\n * };\n * ```\n */\nexport default function useResizeAware(): [\n\tWPElement,\n\t{ width: number | null; height: number | null }\n] {\n\tconst { ref, width, height } = useResizeObserver();\n\tconst sizes = useMemo( () => {\n\t\treturn { width: width ?? null, height: height ?? null };\n\t}, [ width, height ] );\n\tconst resizeListener = (\n\t\t<div\n\t\t\tstyle={ {\n\t\t\t\tposition: 'absolute',\n\t\t\t\ttop: 0,\n\t\t\t\tleft: 0,\n\t\t\t\tright: 0,\n\t\t\t\tbottom: 0,\n\t\t\t\tpointerEvents: 'none',\n\t\t\t\topacity: 0,\n\t\t\t\toverflow: 'hidden',\n\t\t\t\tzIndex: -1,\n\t\t\t} }\n\t\t\taria-hidden=\"true\"\n\t\t\tref={ ref }\n\t\t/>\n\t);\n\treturn [ resizeListener, sizes ];\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/compose/src/hooks/use-resize-observer/index.tsx"],"names":["useMemo","useRef","useCallback","useEffect","useState","useResolvedElement","subscriber","refOrElement","callbackRefElement","lastReportRef","cleanupRef","callSubscriber","element","current","HTMLElement","reporter","extractSize","entry","boxProp","sizeType","contentRect","undefined","useResizeObserver","opts","onResize","onResizeRef","round","Math","resizeObserverRef","size","setSize","width","height","didUnmount","previous","refCallback","box","instance","ResizeObserver","entries","reportedWidth","reportedHeight","newWidth","newHeight","newSize","observe","unobserve","ref","useResizeAware","sizes","resizeListener","position","top","left","right","bottom","pointerEvents","opacity","overflow","zIndex"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { RefCallback, RefObject } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseMemo,\n\tuseRef,\n\tuseCallback,\n\tuseEffect,\n\tuseState,\n} from '@wordpress/element';\nimport type { WPElement } from '@wordpress/element';\n\ntype SubscriberCleanup = () => void;\ntype SubscriberResponse = SubscriberCleanup | void;\n\n// This of course could've been more streamlined with internal state instead of\n// refs, but then host hooks / components could not opt out of renders.\n// This could've been exported to its own module, but the current build doesn't\n// seem to work with module imports and I had no more time to spend on this...\nfunction useResolvedElement< T extends HTMLElement >(\n\tsubscriber: ( element: T ) => SubscriberResponse,\n\trefOrElement?: T | RefObject< T > | null\n): RefCallback< T > {\n\tconst callbackRefElement = useRef< T | null >( null );\n\tconst lastReportRef = useRef< {\n\t\treporter: () => void;\n\t\telement: T | null;\n\t} | null >( null );\n\tconst cleanupRef = useRef< SubscriberResponse | null >();\n\n\tconst callSubscriber = useCallback( () => {\n\t\tlet element = null;\n\t\tif ( callbackRefElement.current ) {\n\t\t\telement = callbackRefElement.current;\n\t\t} else if ( refOrElement ) {\n\t\t\tif ( refOrElement instanceof HTMLElement ) {\n\t\t\t\telement = refOrElement;\n\t\t\t} else {\n\t\t\t\telement = refOrElement.current;\n\t\t\t}\n\t\t}\n\n\t\tif (\n\t\t\tlastReportRef.current &&\n\t\t\tlastReportRef.current.element === element &&\n\t\t\tlastReportRef.current.reporter === callSubscriber\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( cleanupRef.current ) {\n\t\t\tcleanupRef.current();\n\t\t\t// Making sure the cleanup is not called accidentally multiple times.\n\t\t\tcleanupRef.current = null;\n\t\t}\n\t\tlastReportRef.current = {\n\t\t\treporter: callSubscriber,\n\t\t\telement,\n\t\t};\n\n\t\t// Only calling the subscriber, if there's an actual element to report.\n\t\tif ( element ) {\n\t\t\tcleanupRef.current = subscriber( element );\n\t\t}\n\t}, [ refOrElement, subscriber ] );\n\n\t// On each render, we check whether a ref changed, or if we got a new raw\n\t// element.\n\tuseEffect( () => {\n\t\t// With this we're *technically* supporting cases where ref objects' current value changes, but only if there's a\n\t\t// render accompanying that change as well.\n\t\t// To guarantee we always have the right element, one must use the ref callback provided instead, but we support\n\t\t// RefObjects to make the hook API more convenient in certain cases.\n\t\tcallSubscriber();\n\t}, [ callSubscriber ] );\n\n\treturn useCallback< RefCallback< T > >(\n\t\t( element ) => {\n\t\t\tcallbackRefElement.current = element;\n\t\t\tcallSubscriber();\n\t\t},\n\t\t[ callSubscriber ]\n\t);\n}\n\ntype ObservedSize = {\n\twidth: number | undefined;\n\theight: number | undefined;\n};\n\ntype ResizeHandler = ( size: ObservedSize ) => void;\n\ntype HookResponse< T extends HTMLElement > = {\n\tref: RefCallback< T >;\n} & ObservedSize;\n\n// Declaring my own type here instead of using the one provided by TS (available since 4.2.2), because this way I'm not\n// forcing consumers to use a specific TS version.\ntype ResizeObserverBoxOptions =\n\t| 'border-box'\n\t| 'content-box'\n\t| 'device-pixel-content-box';\n\ndeclare global {\n\tinterface ResizeObserverEntry {\n\t\treadonly devicePixelContentBoxSize: ReadonlyArray< ResizeObserverSize >;\n\t}\n}\n\n// We're only using the first element of the size sequences, until future versions of the spec solidify on how\n// exactly it'll be used for fragments in multi-column scenarios:\n// From the spec:\n// > The box size properties are exposed as FrozenArray in order to support elements that have multiple fragments,\n// > which occur in multi-column scenarios. However the current definitions of content rect and border box do not\n// > mention how those boxes are affected by multi-column layout. In this spec, there will only be a single\n// > ResizeObserverSize returned in the FrozenArray, which will correspond to the dimensions of the first column.\n// > A future version of this spec will extend the returned FrozenArray to contain the per-fragment size information.\n// (https://drafts.csswg.org/resize-observer/#resize-observer-entry-interface)\n//\n// Also, testing these new box options revealed that in both Chrome and FF everything is returned in the callback,\n// regardless of the \"box\" option.\n// The spec states the following on this:\n// > This does not have any impact on which box dimensions are returned to the defined callback when the event\n// > is fired, it solely defines which box the author wishes to observe layout changes on.\n// (https://drafts.csswg.org/resize-observer/#resize-observer-interface)\n// I'm not exactly clear on what this means, especially when you consider a later section stating the following:\n// > This section is non-normative. An author may desire to observe more than one CSS box.\n// > In this case, author will need to use multiple ResizeObservers.\n// (https://drafts.csswg.org/resize-observer/#resize-observer-interface)\n// Which is clearly not how current browser implementations behave, and seems to contradict the previous quote.\n// For this reason I decided to only return the requested size,\n// even though it seems we have access to results for all box types.\n// This also means that we get to keep the current api, being able to return a simple { width, height } pair,\n// regardless of box option.\nconst extractSize = (\n\tentry: ResizeObserverEntry,\n\tboxProp: 'borderBoxSize' | 'contentBoxSize' | 'devicePixelContentBoxSize',\n\tsizeType: keyof ResizeObserverSize\n): number | undefined => {\n\tif ( ! entry[ boxProp ] ) {\n\t\tif ( boxProp === 'contentBoxSize' ) {\n\t\t\t// The dimensions in `contentBoxSize` and `contentRect` are equivalent according to the spec.\n\t\t\t// See the 6th step in the description for the RO algorithm:\n\t\t\t// https://drafts.csswg.org/resize-observer/#create-and-populate-resizeobserverentry-h\n\t\t\t// > Set this.contentRect to logical this.contentBoxSize given target and observedBox of \"content-box\".\n\t\t\t// In real browser implementations of course these objects differ, but the width/height values should be equivalent.\n\t\t\treturn entry.contentRect[\n\t\t\t\tsizeType === 'inlineSize' ? 'width' : 'height'\n\t\t\t];\n\t\t}\n\n\t\treturn undefined;\n\t}\n\n\t// A couple bytes smaller than calling Array.isArray() and just as effective here.\n\treturn entry[ boxProp ][ 0 ]\n\t\t? entry[ boxProp ][ 0 ][ sizeType ]\n\t\t: // TS complains about this, because the RO entry type follows the spec and does not reflect Firefox's current\n\t\t // behaviour of returning objects instead of arrays for `borderBoxSize` and `contentBoxSize`.\n\t\t // @ts-ignore\n\t\t entry[ boxProp ][ sizeType ];\n};\n\ntype RoundingFunction = ( n: number ) => number;\n\nfunction useResizeObserver< T extends HTMLElement >(\n\topts: {\n\t\tref?: RefObject< T > | T | null | undefined;\n\t\tonResize?: ResizeHandler;\n\t\tbox?: ResizeObserverBoxOptions;\n\t\tround?: RoundingFunction;\n\t} = {}\n): HookResponse< T > {\n\t// Saving the callback as a ref. With this, I don't need to put onResize in the\n\t// effect dep array, and just passing in an anonymous function without memoising\n\t// will not reinstantiate the hook's ResizeObserver.\n\tconst onResize = opts.onResize;\n\tconst onResizeRef = useRef< ResizeHandler | undefined >( undefined );\n\tonResizeRef.current = onResize;\n\tconst round = opts.round || Math.round;\n\n\t// Using a single instance throughout the hook's lifetime\n\tconst resizeObserverRef = useRef< {\n\t\tbox?: ResizeObserverBoxOptions;\n\t\tround?: RoundingFunction;\n\t\tinstance: ResizeObserver;\n\t} >();\n\n\tconst [ size, setSize ] = useState< {\n\t\twidth?: number;\n\t\theight?: number;\n\t} >( {\n\t\twidth: undefined,\n\t\theight: undefined,\n\t} );\n\n\t// In certain edge cases the RO might want to report a size change just after\n\t// the component unmounted.\n\tconst didUnmount = useRef( false );\n\tuseEffect( () => {\n\t\tdidUnmount.current = false;\n\t\treturn () => {\n\t\t\tdidUnmount.current = true;\n\t\t};\n\t}, [] );\n\n\t// Using a ref to track the previous width / height to avoid unnecessary renders.\n\tconst previous: {\n\t\tcurrent: {\n\t\t\twidth?: number;\n\t\t\theight?: number;\n\t\t};\n\t} = useRef( {\n\t\twidth: undefined,\n\t\theight: undefined,\n\t} );\n\n\t// This block is kinda like a useEffect, only it's called whenever a new\n\t// element could be resolved based on the ref option. It also has a cleanup\n\t// function.\n\tconst refCallback = useResolvedElement< T >(\n\t\tuseCallback(\n\t\t\t( element ) => {\n\t\t\t\t// We only use a single Resize Observer instance, and we're instantiating it on demand, only once there's something to observe.\n\t\t\t\t// This instance is also recreated when the `box` option changes, so that a new observation is fired if there was a previously observed element with a different box option.\n\t\t\t\tif (\n\t\t\t\t\t! resizeObserverRef.current ||\n\t\t\t\t\tresizeObserverRef.current.box !== opts.box ||\n\t\t\t\t\tresizeObserverRef.current.round !== round\n\t\t\t\t) {\n\t\t\t\t\tresizeObserverRef.current = {\n\t\t\t\t\t\tbox: opts.box,\n\t\t\t\t\t\tround,\n\t\t\t\t\t\tinstance: new ResizeObserver( ( entries ) => {\n\t\t\t\t\t\t\tconst entry = entries[ 0 ];\n\n\t\t\t\t\t\t\tlet boxProp:\n\t\t\t\t\t\t\t\t| 'borderBoxSize'\n\t\t\t\t\t\t\t\t| 'contentBoxSize'\n\t\t\t\t\t\t\t\t| 'devicePixelContentBoxSize' = 'borderBoxSize';\n\t\t\t\t\t\t\tif ( opts.box === 'border-box' ) {\n\t\t\t\t\t\t\t\tboxProp = 'borderBoxSize';\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tboxProp =\n\t\t\t\t\t\t\t\t\topts.box === 'device-pixel-content-box'\n\t\t\t\t\t\t\t\t\t\t? 'devicePixelContentBoxSize'\n\t\t\t\t\t\t\t\t\t\t: 'contentBoxSize';\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tconst reportedWidth = extractSize(\n\t\t\t\t\t\t\t\tentry,\n\t\t\t\t\t\t\t\tboxProp,\n\t\t\t\t\t\t\t\t'inlineSize'\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tconst reportedHeight = extractSize(\n\t\t\t\t\t\t\t\tentry,\n\t\t\t\t\t\t\t\tboxProp,\n\t\t\t\t\t\t\t\t'blockSize'\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\tconst newWidth = reportedWidth\n\t\t\t\t\t\t\t\t? round( reportedWidth )\n\t\t\t\t\t\t\t\t: undefined;\n\t\t\t\t\t\t\tconst newHeight = reportedHeight\n\t\t\t\t\t\t\t\t? round( reportedHeight )\n\t\t\t\t\t\t\t\t: undefined;\n\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tprevious.current.width !== newWidth ||\n\t\t\t\t\t\t\t\tprevious.current.height !== newHeight\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tconst newSize = {\n\t\t\t\t\t\t\t\t\twidth: newWidth,\n\t\t\t\t\t\t\t\t\theight: newHeight,\n\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\tprevious.current.width = newWidth;\n\t\t\t\t\t\t\t\tprevious.current.height = newHeight;\n\t\t\t\t\t\t\t\tif ( onResizeRef.current ) {\n\t\t\t\t\t\t\t\t\tonResizeRef.current( newSize );\n\t\t\t\t\t\t\t\t} else if ( ! didUnmount.current ) {\n\t\t\t\t\t\t\t\t\tsetSize( newSize );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} ),\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\tresizeObserverRef.current.instance.observe( element, {\n\t\t\t\t\tbox: opts.box,\n\t\t\t\t} );\n\n\t\t\t\treturn () => {\n\t\t\t\t\tif ( resizeObserverRef.current ) {\n\t\t\t\t\t\tresizeObserverRef.current.instance.unobserve( element );\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ opts.box, round ]\n\t\t),\n\t\topts.ref\n\t);\n\n\treturn useMemo(\n\t\t() => ( {\n\t\t\tref: refCallback,\n\t\t\twidth: size.width,\n\t\t\theight: size.height,\n\t\t} ),\n\t\t[ refCallback, size ? size.width : null, size ? size.height : null ]\n\t);\n}\n\n/**\n * Hook which allows to listen the resize event of any target element when it changes sizes.\n * _Note: `useResizeObserver` will report `null` until after first render.\n *\n * @example\n *\n * ```js\n * const App = () => {\n * \tconst [ resizeListener, sizes ] = useResizeObserver();\n *\n * \treturn (\n * \t\t<div>\n * \t\t\t{ resizeListener }\n * \t\t\tYour content here\n * \t\t</div>\n * \t);\n * };\n * ```\n */\nexport default function useResizeAware(): [\n\tWPElement,\n\t{ width: number | null; height: number | null }\n] {\n\tconst { ref, width, height } = useResizeObserver();\n\tconst sizes = useMemo( () => {\n\t\treturn { width: width ?? null, height: height ?? null };\n\t}, [ width, height ] );\n\tconst resizeListener = (\n\t\t<div\n\t\t\tstyle={ {\n\t\t\t\tposition: 'absolute',\n\t\t\t\ttop: 0,\n\t\t\t\tleft: 0,\n\t\t\t\tright: 0,\n\t\t\t\tbottom: 0,\n\t\t\t\tpointerEvents: 'none',\n\t\t\t\topacity: 0,\n\t\t\t\toverflow: 'hidden',\n\t\t\t\tzIndex: -1,\n\t\t\t} }\n\t\t\taria-hidden=\"true\"\n\t\t\tref={ ref }\n\t\t/>\n\t);\n\treturn [ resizeListener, sizes ];\n}\n"]}
@@ -31,10 +31,9 @@ import { useState, useCallback } from '@wordpress/element';
31
31
 
32
32
  const useResizeObserver = () => {
33
33
  const [measurements, setMeasurements] = useState(null);
34
- const onLayout = useCallback(_ref => {
35
- let {
36
- nativeEvent
37
- } = _ref;
34
+ const onLayout = useCallback(({
35
+ nativeEvent
36
+ }) => {
38
37
  const {
39
38
  width,
40
39
  height