@wordpress/compose 6.15.0 → 6.17.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (211) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/README.md +1 -1
  3. package/build/higher-order/compose.js +0 -2
  4. package/build/higher-order/compose.js.map +1 -1
  5. package/build/higher-order/if-condition/index.js +2 -6
  6. package/build/higher-order/if-condition/index.js.map +1 -1
  7. package/build/higher-order/pipe.js +1 -5
  8. package/build/higher-order/pipe.js.map +1 -1
  9. package/build/higher-order/pure/index.js +2 -10
  10. package/build/higher-order/pure/index.js.map +1 -1
  11. package/build/higher-order/with-global-events/index.js +13 -32
  12. package/build/higher-order/with-global-events/index.js.map +1 -1
  13. package/build/higher-order/with-global-events/listener.js +5 -28
  14. package/build/higher-order/with-global-events/listener.js.map +1 -1
  15. package/build/higher-order/with-instance-id/index.js +4 -8
  16. package/build/higher-order/with-instance-id/index.js.map +1 -1
  17. package/build/higher-order/with-preferred-color-scheme/index.native.js +3 -6
  18. package/build/higher-order/with-preferred-color-scheme/index.native.js.map +1 -1
  19. package/build/higher-order/with-safe-timeout/index.js +4 -14
  20. package/build/higher-order/with-safe-timeout/index.js.map +1 -1
  21. package/build/higher-order/with-state/index.js +3 -11
  22. package/build/higher-order/with-state/index.js.map +1 -1
  23. package/build/hooks/use-async-list/index.js +1 -14
  24. package/build/hooks/use-async-list/index.js.map +1 -1
  25. package/build/hooks/use-constrained-tabbing/index.js +14 -30
  26. package/build/hooks/use-constrained-tabbing/index.js.map +1 -1
  27. package/build/hooks/use-constrained-tabbing/index.native.js +4 -4
  28. package/build/hooks/use-constrained-tabbing/index.native.js.map +1 -1
  29. package/build/hooks/use-copy-on-click/index.js +6 -15
  30. package/build/hooks/use-copy-on-click/index.js.map +1 -1
  31. package/build/hooks/use-copy-to-clipboard/index.js +3 -11
  32. package/build/hooks/use-copy-to-clipboard/index.js.map +1 -1
  33. package/build/hooks/use-debounce/index.js +0 -4
  34. package/build/hooks/use-debounce/index.js.map +1 -1
  35. package/build/hooks/use-dialog/index.js +2 -12
  36. package/build/hooks/use-dialog/index.js.map +1 -1
  37. package/build/hooks/use-disabled/index.js +5 -15
  38. package/build/hooks/use-disabled/index.js.map +1 -1
  39. package/build/hooks/use-dragging/index.js +4 -11
  40. package/build/hooks/use-dragging/index.js.map +1 -1
  41. package/build/hooks/use-drop-zone/index.js +27 -66
  42. package/build/hooks/use-drop-zone/index.js.map +1 -1
  43. package/build/hooks/use-fixed-window-list/index.js +8 -34
  44. package/build/hooks/use-fixed-window-list/index.js.map +1 -1
  45. package/build/hooks/use-focus-on-mount/index.js +3 -14
  46. package/build/hooks/use-focus-on-mount/index.js.map +1 -1
  47. package/build/hooks/use-focus-outside/index.js +13 -19
  48. package/build/hooks/use-focus-outside/index.js.map +1 -1
  49. package/build/hooks/use-focus-outside/index.native.js +13 -21
  50. package/build/hooks/use-focus-outside/index.native.js.map +1 -1
  51. package/build/hooks/use-focus-return/index.js +14 -16
  52. package/build/hooks/use-focus-return/index.js.map +1 -1
  53. package/build/hooks/use-focusable-iframe/index.js +1 -5
  54. package/build/hooks/use-focusable-iframe/index.js.map +1 -1
  55. package/build/hooks/use-instance-id/index.js +3 -5
  56. package/build/hooks/use-instance-id/index.js.map +1 -1
  57. package/build/hooks/use-isomorphic-layout-effect/index.js +0 -2
  58. package/build/hooks/use-isomorphic-layout-effect/index.js.map +1 -1
  59. package/build/hooks/use-keyboard-shortcut/index.js +12 -28
  60. package/build/hooks/use-keyboard-shortcut/index.js.map +1 -1
  61. package/build/hooks/use-keyboard-shortcut/index.native.js +0 -2
  62. package/build/hooks/use-keyboard-shortcut/index.native.js.map +1 -1
  63. package/build/hooks/use-media-query/index.js +1 -9
  64. package/build/hooks/use-media-query/index.js.map +1 -1
  65. package/build/hooks/use-merge-refs/index.js +18 -24
  66. package/build/hooks/use-merge-refs/index.js.map +1 -1
  67. package/build/hooks/use-preferred-color-scheme/index.android.js +0 -5
  68. package/build/hooks/use-preferred-color-scheme/index.android.js.map +1 -1
  69. package/build/hooks/use-preferred-color-scheme/index.ios.js +0 -2
  70. package/build/hooks/use-preferred-color-scheme/index.ios.js.map +1 -1
  71. package/build/hooks/use-preferred-color-scheme-style/index.native.js +2 -5
  72. package/build/hooks/use-preferred-color-scheme-style/index.native.js.map +1 -1
  73. package/build/hooks/use-previous/index.js +3 -4
  74. package/build/hooks/use-previous/index.js.map +1 -1
  75. package/build/hooks/use-reduced-motion/index.js +0 -4
  76. package/build/hooks/use-reduced-motion/index.js.map +1 -1
  77. package/build/hooks/use-ref-effect/index.js +0 -2
  78. package/build/hooks/use-ref-effect/index.js.map +1 -1
  79. package/build/hooks/use-resize-observer/index.js +23 -30
  80. package/build/hooks/use-resize-observer/index.js.map +1 -1
  81. package/build/hooks/use-resize-observer/index.native.js +0 -6
  82. package/build/hooks/use-resize-observer/index.native.js.map +1 -1
  83. package/build/hooks/use-throttle/index.js +0 -4
  84. package/build/hooks/use-throttle/index.js.map +1 -1
  85. package/build/hooks/use-viewport-match/index.js +4 -13
  86. package/build/hooks/use-viewport-match/index.js.map +1 -1
  87. package/build/hooks/use-warn-on-change/index.js +4 -14
  88. package/build/hooks/use-warn-on-change/index.js.map +1 -1
  89. package/build/index.js +0 -41
  90. package/build/index.js.map +1 -1
  91. package/build/index.native.js +0 -33
  92. package/build/index.native.js.map +1 -1
  93. package/build/utils/create-higher-order-component/index.js +1 -4
  94. package/build/utils/create-higher-order-component/index.js.map +1 -1
  95. package/build/utils/debounce/index.js +12 -37
  96. package/build/utils/debounce/index.js.map +1 -1
  97. package/build/utils/throttle/index.js +0 -5
  98. package/build/utils/throttle/index.js.map +1 -1
  99. package/build-module/higher-order/compose.js +1 -1
  100. package/build-module/higher-order/compose.js.map +1 -1
  101. package/build-module/higher-order/if-condition/index.js +3 -5
  102. package/build-module/higher-order/if-condition/index.js.map +1 -1
  103. package/build-module/higher-order/pipe.js +1 -4
  104. package/build-module/higher-order/pipe.js.map +1 -1
  105. package/build-module/higher-order/pure/index.js +4 -8
  106. package/build-module/higher-order/pure/index.js.map +1 -1
  107. package/build-module/higher-order/with-global-events/index.js +15 -29
  108. package/build-module/higher-order/with-global-events/index.js.map +1 -1
  109. package/build-module/higher-order/with-global-events/listener.js +5 -27
  110. package/build-module/higher-order/with-global-events/listener.js.map +1 -1
  111. package/build-module/higher-order/with-instance-id/index.js +5 -5
  112. package/build-module/higher-order/with-instance-id/index.js.map +1 -1
  113. package/build-module/higher-order/with-preferred-color-scheme/index.native.js +3 -3
  114. package/build-module/higher-order/with-preferred-color-scheme/index.native.js.map +1 -1
  115. package/build-module/higher-order/with-safe-timeout/index.js +6 -8
  116. package/build-module/higher-order/with-safe-timeout/index.js.map +1 -1
  117. package/build-module/higher-order/with-state/index.js +5 -9
  118. package/build-module/higher-order/with-state/index.js.map +1 -1
  119. package/build-module/hooks/use-async-list/index.js +1 -12
  120. package/build-module/hooks/use-async-list/index.js.map +1 -1
  121. package/build-module/hooks/use-constrained-tabbing/index.js +16 -27
  122. package/build-module/hooks/use-constrained-tabbing/index.js.map +1 -1
  123. package/build-module/hooks/use-constrained-tabbing/index.native.js +3 -3
  124. package/build-module/hooks/use-constrained-tabbing/index.native.js.map +1 -1
  125. package/build-module/hooks/use-copy-on-click/index.js +8 -12
  126. package/build-module/hooks/use-copy-on-click/index.js.map +1 -1
  127. package/build-module/hooks/use-copy-to-clipboard/index.js +6 -9
  128. package/build-module/hooks/use-copy-to-clipboard/index.js.map +1 -1
  129. package/build-module/hooks/use-debounce/index.js +3 -3
  130. package/build-module/hooks/use-debounce/index.js.map +1 -1
  131. package/build-module/hooks/use-dialog/index.js +3 -5
  132. package/build-module/hooks/use-dialog/index.js.map +1 -1
  133. package/build-module/hooks/use-disabled/index.js +6 -12
  134. package/build-module/hooks/use-disabled/index.js.map +1 -1
  135. package/build-module/hooks/use-dragging/index.js +6 -9
  136. package/build-module/hooks/use-dragging/index.js.map +1 -1
  137. package/build-module/hooks/use-drop-zone/index.js +29 -64
  138. package/build-module/hooks/use-drop-zone/index.js.map +1 -1
  139. package/build-module/hooks/use-fixed-window-list/index.js +8 -30
  140. package/build-module/hooks/use-fixed-window-list/index.js.map +1 -1
  141. package/build-module/hooks/use-focus-on-mount/index.js +4 -12
  142. package/build-module/hooks/use-focus-on-mount/index.js.map +1 -1
  143. package/build-module/hooks/use-focus-outside/index.js +14 -18
  144. package/build-module/hooks/use-focus-outside/index.js.map +1 -1
  145. package/build-module/hooks/use-focus-outside/index.native.js +14 -20
  146. package/build-module/hooks/use-focus-outside/index.native.js.map +1 -1
  147. package/build-module/hooks/use-focus-return/index.js +15 -15
  148. package/build-module/hooks/use-focus-return/index.js.map +1 -1
  149. package/build-module/hooks/use-focusable-iframe/index.js +2 -3
  150. package/build-module/hooks/use-focusable-iframe/index.js.map +1 -1
  151. package/build-module/hooks/use-instance-id/index.js +2 -3
  152. package/build-module/hooks/use-instance-id/index.js.map +1 -1
  153. package/build-module/hooks/use-isomorphic-layout-effect/index.js +1 -1
  154. package/build-module/hooks/use-isomorphic-layout-effect/index.js.map +1 -1
  155. package/build-module/hooks/use-keyboard-shortcut/index.js +14 -24
  156. package/build-module/hooks/use-keyboard-shortcut/index.js.map +1 -1
  157. package/build-module/hooks/use-keyboard-shortcut/index.native.js +0 -1
  158. package/build-module/hooks/use-keyboard-shortcut/index.native.js.map +1 -1
  159. package/build-module/hooks/use-media-query/index.js +2 -8
  160. package/build-module/hooks/use-media-query/index.js.map +1 -1
  161. package/build-module/hooks/use-merge-refs/index.js +19 -23
  162. package/build-module/hooks/use-merge-refs/index.js.map +1 -1
  163. package/build-module/hooks/use-preferred-color-scheme/index.android.js +1 -3
  164. package/build-module/hooks/use-preferred-color-scheme/index.android.js.map +1 -1
  165. package/build-module/hooks/use-preferred-color-scheme/index.ios.js +1 -1
  166. package/build-module/hooks/use-preferred-color-scheme/index.ios.js.map +1 -1
  167. package/build-module/hooks/use-preferred-color-scheme-style/index.native.js +3 -3
  168. package/build-module/hooks/use-preferred-color-scheme-style/index.native.js.map +1 -1
  169. package/build-module/hooks/use-previous/index.js +4 -3
  170. package/build-module/hooks/use-previous/index.js.map +1 -1
  171. package/build-module/hooks/use-reduced-motion/index.js +1 -2
  172. package/build-module/hooks/use-reduced-motion/index.js.map +1 -1
  173. package/build-module/hooks/use-ref-effect/index.js +1 -1
  174. package/build-module/hooks/use-ref-effect/index.js.map +1 -1
  175. package/build-module/hooks/use-resize-observer/index.js +22 -30
  176. package/build-module/hooks/use-resize-observer/index.js.map +1 -1
  177. package/build-module/hooks/use-resize-observer/index.native.js +1 -6
  178. package/build-module/hooks/use-resize-observer/index.native.js.map +1 -1
  179. package/build-module/hooks/use-throttle/index.js +3 -3
  180. package/build-module/hooks/use-throttle/index.js.map +1 -1
  181. package/build-module/hooks/use-viewport-match/index.js +6 -11
  182. package/build-module/hooks/use-viewport-match/index.js.map +1 -1
  183. package/build-module/hooks/use-warn-on-change/index.js +6 -12
  184. package/build-module/hooks/use-warn-on-change/index.js.map +1 -1
  185. package/build-module/index.js +10 -7
  186. package/build-module/index.js.map +1 -1
  187. package/build-module/index.native.js +10 -7
  188. package/build-module/index.native.js.map +1 -1
  189. package/build-module/utils/create-higher-order-component/index.js +1 -2
  190. package/build-module/utils/create-higher-order-component/index.js.map +1 -1
  191. package/build-module/utils/debounce/index.js +12 -35
  192. package/build-module/utils/debounce/index.js.map +1 -1
  193. package/build-module/utils/throttle/index.js +0 -3
  194. package/build-module/utils/throttle/index.js.map +1 -1
  195. package/build-types/higher-order/with-instance-id/index.d.ts +1 -1
  196. package/build-types/higher-order/with-instance-id/index.d.ts.map +1 -1
  197. package/build-types/higher-order/with-safe-timeout/index.d.ts +1 -1
  198. package/build-types/higher-order/with-safe-timeout/index.d.ts.map +1 -1
  199. package/build-types/hooks/use-disabled/index.d.ts +1 -1
  200. package/build-types/hooks/use-disabled/index.d.ts.map +1 -1
  201. package/build-types/hooks/use-focus-return/index.d.ts +2 -4
  202. package/build-types/hooks/use-focus-return/index.d.ts.map +1 -1
  203. package/build-types/hooks/use-isomorphic-layout-effect/index.d.ts +1 -1
  204. package/build-types/hooks/use-isomorphic-layout-effect/index.d.ts.map +1 -1
  205. package/build-types/hooks/use-viewport-match/index.d.ts +1 -1
  206. package/package.json +8 -8
  207. package/src/higher-order/with-instance-id/index.tsx +2 -2
  208. package/src/higher-order/with-safe-timeout/index.tsx +2 -2
  209. package/src/hooks/use-focus-return/index.js +11 -6
  210. package/src/hooks/use-resize-observer/index.native.js +0 -1
  211. package/tsconfig.tsbuildinfo +1 -1
@@ -2,26 +2,22 @@
2
2
  * WordPress dependencies
3
3
  */
4
4
  import { useRef } from '@wordpress/element';
5
+
5
6
  /**
6
7
  * Internal dependencies
7
8
  */
8
-
9
9
  import useRefEffect from '../use-ref-effect';
10
- /* eslint-disable jsdoc/valid-types */
11
10
 
11
+ /* eslint-disable jsdoc/valid-types */
12
12
  /**
13
13
  * @template T
14
14
  * @param {T} value
15
15
  * @return {import('react').MutableRefObject<T|null>} A ref with the value.
16
16
  */
17
-
18
17
  function useFreshRef(value) {
19
18
  /* eslint-enable jsdoc/valid-types */
20
-
21
19
  /* eslint-disable jsdoc/no-undefined-types */
22
-
23
20
  /** @type {import('react').MutableRefObject<T>} */
24
-
25
21
  /* eslint-enable jsdoc/no-undefined-types */
26
22
  // Disable reason: We're doing something pretty JavaScript-y here where the
27
23
  // ref will always have a current value that is not null or undefined but it
@@ -33,6 +29,7 @@ function useFreshRef(value) {
33
29
  ref.current = value;
34
30
  return ref;
35
31
  }
32
+
36
33
  /**
37
34
  * A hook to facilitate drag and drop handling.
38
35
  *
@@ -48,8 +45,6 @@ function useFreshRef(value) {
48
45
  *
49
46
  * @return {import('react').RefCallback<HTMLElement>} Ref callback to be passed to the drop zone element.
50
47
  */
51
-
52
-
53
48
  export default function useDropZone({
54
49
  dropZoneElement,
55
50
  isDisabled,
@@ -69,16 +64,17 @@ export default function useDropZone({
69
64
  return useRefEffect(elem => {
70
65
  if (isDisabled) {
71
66
  return;
72
- } // If a custom dropZoneRef is passed, use that instead of the element.
67
+ }
68
+
69
+ // If a custom dropZoneRef is passed, use that instead of the element.
73
70
  // This allows the dropzone to cover an expanded area, rather than
74
71
  // be restricted to the area of the ref returned by this hook.
75
-
76
-
77
72
  const element = dropZoneElement !== null && dropZoneElement !== void 0 ? dropZoneElement : elem;
78
73
  let isDragging = false;
79
74
  const {
80
75
  ownerDocument
81
76
  } = element;
77
+
82
78
  /**
83
79
  * Checks if an element is in the drop zone.
84
80
  *
@@ -86,84 +82,64 @@ export default function useDropZone({
86
82
  *
87
83
  * @return {boolean} True if in drop zone, false if not.
88
84
  */
89
-
90
85
  function isElementInZone(targetToCheck) {
91
86
  const {
92
87
  defaultView
93
88
  } = ownerDocument;
94
-
95
89
  if (!targetToCheck || !defaultView || !(targetToCheck instanceof defaultView.HTMLElement) || !element.contains(targetToCheck)) {
96
90
  return false;
97
91
  }
98
- /** @type {HTMLElement|null} */
99
-
100
92
 
93
+ /** @type {HTMLElement|null} */
101
94
  let elementToCheck = targetToCheck;
102
-
103
95
  do {
104
96
  if (elementToCheck.dataset.isDropZone) {
105
97
  return elementToCheck === element;
106
98
  }
107
99
  } while (elementToCheck = elementToCheck.parentElement);
108
-
109
100
  return false;
110
101
  }
111
-
112
- function maybeDragStart(
113
- /** @type {DragEvent} */
114
- event) {
102
+ function maybeDragStart( /** @type {DragEvent} */event) {
115
103
  if (isDragging) {
116
104
  return;
117
105
  }
106
+ isDragging = true;
118
107
 
119
- isDragging = true; // Note that `dragend` doesn't fire consistently for file and
108
+ // Note that `dragend` doesn't fire consistently for file and
120
109
  // HTML drag events where the drag origin is outside the browser
121
110
  // window. In Firefox it may also not fire if the originating
122
111
  // node is removed.
123
-
124
112
  ownerDocument.addEventListener('dragend', maybeDragEnd);
125
113
  ownerDocument.addEventListener('mousemove', maybeDragEnd);
126
-
127
114
  if (onDragStartRef.current) {
128
115
  onDragStartRef.current(event);
129
116
  }
130
117
  }
118
+ function onDragEnter( /** @type {DragEvent} */event) {
119
+ event.preventDefault();
131
120
 
132
- function onDragEnter(
133
- /** @type {DragEvent} */
134
- event) {
135
- event.preventDefault(); // The `dragenter` event will also fire when entering child
121
+ // The `dragenter` event will also fire when entering child
136
122
  // elements, but we only want to call `onDragEnter` when
137
123
  // entering the drop zone, which means the `relatedTarget`
138
124
  // (element that has been left) should be outside the drop zone.
139
-
140
- if (element.contains(
141
- /** @type {Node} */
142
- event.relatedTarget)) {
125
+ if (element.contains( /** @type {Node} */event.relatedTarget)) {
143
126
  return;
144
127
  }
145
-
146
128
  if (onDragEnterRef.current) {
147
129
  onDragEnterRef.current(event);
148
130
  }
149
131
  }
150
-
151
- function onDragOver(
152
- /** @type {DragEvent} */
153
- event) {
132
+ function onDragOver( /** @type {DragEvent} */event) {
154
133
  // Only call onDragOver for the innermost hovered drop zones.
155
134
  if (!event.defaultPrevented && onDragOverRef.current) {
156
135
  onDragOverRef.current(event);
157
- } // Prevent the browser default while also signalling to parent
158
- // drop zones that `onDragOver` is already handled.
159
-
136
+ }
160
137
 
138
+ // Prevent the browser default while also signalling to parent
139
+ // drop zones that `onDragOver` is already handled.
161
140
  event.preventDefault();
162
141
  }
163
-
164
- function onDragLeave(
165
- /** @type {DragEvent} */
166
- event) {
142
+ function onDragLeave( /** @type {DragEvent} */event) {
167
143
  // The `dragleave` event will also fire when leaving child
168
144
  // elements, but we only want to call `onDragLeave` when
169
145
  // leaving the drop zone, which means the `relatedTarget`
@@ -174,59 +150,48 @@ export default function useDropZone({
174
150
  if (isElementInZone(event.relatedTarget)) {
175
151
  return;
176
152
  }
177
-
178
153
  if (onDragLeaveRef.current) {
179
154
  onDragLeaveRef.current(event);
180
155
  }
181
156
  }
182
-
183
- function onDrop(
184
- /** @type {DragEvent} */
185
- event) {
157
+ function onDrop( /** @type {DragEvent} */event) {
186
158
  // Don't handle drop if an inner drop zone already handled it.
187
159
  if (event.defaultPrevented) {
188
160
  return;
189
- } // Prevent the browser default while also signalling to parent
190
- // drop zones that `onDrop` is already handled.
161
+ }
191
162
 
163
+ // Prevent the browser default while also signalling to parent
164
+ // drop zones that `onDrop` is already handled.
165
+ event.preventDefault();
192
166
 
193
- event.preventDefault(); // This seemingly useless line has been shown to resolve a
167
+ // This seemingly useless line has been shown to resolve a
194
168
  // Safari issue where files dragged directly from the dock are
195
169
  // not recognized.
196
170
  // eslint-disable-next-line no-unused-expressions
197
-
198
171
  event.dataTransfer && event.dataTransfer.files.length;
199
-
200
172
  if (onDropRef.current) {
201
173
  onDropRef.current(event);
202
174
  }
203
-
204
175
  maybeDragEnd(event);
205
176
  }
206
-
207
- function maybeDragEnd(
208
- /** @type {MouseEvent} */
209
- event) {
177
+ function maybeDragEnd( /** @type {MouseEvent} */event) {
210
178
  if (!isDragging) {
211
179
  return;
212
180
  }
213
-
214
181
  isDragging = false;
215
182
  ownerDocument.removeEventListener('dragend', maybeDragEnd);
216
183
  ownerDocument.removeEventListener('mousemove', maybeDragEnd);
217
-
218
184
  if (onDragEndRef.current) {
219
185
  onDragEndRef.current(event);
220
186
  }
221
187
  }
222
-
223
188
  element.dataset.isDropZone = 'true';
224
189
  element.addEventListener('drop', onDrop);
225
190
  element.addEventListener('dragenter', onDragEnter);
226
191
  element.addEventListener('dragover', onDragOver);
227
- element.addEventListener('dragleave', onDragLeave); // The `dragstart` event doesn't fire if the drag started outside
192
+ element.addEventListener('dragleave', onDragLeave);
193
+ // The `dragstart` event doesn't fire if the drag started outside
228
194
  // the document.
229
-
230
195
  ownerDocument.addEventListener('dragenter', maybeDragStart);
231
196
  return () => {
232
197
  delete element.dataset.isDropZone;
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/compose/src/hooks/use-drop-zone/index.js"],"names":["useRef","useRefEffect","useFreshRef","value","ref","current","useDropZone","dropZoneElement","isDisabled","onDrop","_onDrop","onDragStart","_onDragStart","onDragEnter","_onDragEnter","onDragLeave","_onDragLeave","onDragEnd","_onDragEnd","onDragOver","_onDragOver","onDropRef","onDragStartRef","onDragEnterRef","onDragLeaveRef","onDragEndRef","onDragOverRef","elem","element","isDragging","ownerDocument","isElementInZone","targetToCheck","defaultView","HTMLElement","contains","elementToCheck","dataset","isDropZone","parentElement","maybeDragStart","event","addEventListener","maybeDragEnd","preventDefault","relatedTarget","defaultPrevented","dataTransfer","files","length","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\n\n/* eslint-disable jsdoc/valid-types */\n/**\n * @template T\n * @param {T} value\n * @return {import('react').MutableRefObject<T|null>} A ref with the value.\n */\nfunction useFreshRef( value ) {\n\t/* eslint-enable jsdoc/valid-types */\n\t/* eslint-disable jsdoc/no-undefined-types */\n\t/** @type {import('react').MutableRefObject<T>} */\n\t/* eslint-enable jsdoc/no-undefined-types */\n\t// Disable reason: We're doing something pretty JavaScript-y here where the\n\t// ref will always have a current value that is not null or undefined but it\n\t// needs to start as undefined. We don't want to change the return type so\n\t// it's easier to just ts-ignore this specific line that's complaining about\n\t// undefined not being part of T.\n\t// @ts-ignore\n\tconst ref = useRef();\n\tref.current = value;\n\treturn ref;\n}\n\n/**\n * A hook to facilitate drag and drop handling.\n *\n * @param {Object} props Named parameters.\n * @param {?HTMLElement} [props.dropZoneElement] Optional element to be used as the drop zone.\n * @param {boolean} [props.isDisabled] Whether or not to disable the drop zone.\n * @param {(e: DragEvent) => void} [props.onDragStart] Called when dragging has started.\n * @param {(e: DragEvent) => void} [props.onDragEnter] Called when the zone is entered.\n * @param {(e: DragEvent) => void} [props.onDragOver] Called when the zone is moved within.\n * @param {(e: DragEvent) => void} [props.onDragLeave] Called when the zone is left.\n * @param {(e: MouseEvent) => void} [props.onDragEnd] Called when dragging has ended.\n * @param {(e: DragEvent) => void} [props.onDrop] Called when dropping in the zone.\n *\n * @return {import('react').RefCallback<HTMLElement>} Ref callback to be passed to the drop zone element.\n */\nexport default function useDropZone( {\n\tdropZoneElement,\n\tisDisabled,\n\tonDrop: _onDrop,\n\tonDragStart: _onDragStart,\n\tonDragEnter: _onDragEnter,\n\tonDragLeave: _onDragLeave,\n\tonDragEnd: _onDragEnd,\n\tonDragOver: _onDragOver,\n} ) {\n\tconst onDropRef = useFreshRef( _onDrop );\n\tconst onDragStartRef = useFreshRef( _onDragStart );\n\tconst onDragEnterRef = useFreshRef( _onDragEnter );\n\tconst onDragLeaveRef = useFreshRef( _onDragLeave );\n\tconst onDragEndRef = useFreshRef( _onDragEnd );\n\tconst onDragOverRef = useFreshRef( _onDragOver );\n\n\treturn useRefEffect(\n\t\t( elem ) => {\n\t\t\tif ( isDisabled ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// If a custom dropZoneRef is passed, use that instead of the element.\n\t\t\t// This allows the dropzone to cover an expanded area, rather than\n\t\t\t// be restricted to the area of the ref returned by this hook.\n\t\t\tconst element = dropZoneElement ?? elem;\n\n\t\t\tlet isDragging = false;\n\n\t\t\tconst { ownerDocument } = element;\n\n\t\t\t/**\n\t\t\t * Checks if an element is in the drop zone.\n\t\t\t *\n\t\t\t * @param {EventTarget|null} targetToCheck\n\t\t\t *\n\t\t\t * @return {boolean} True if in drop zone, false if not.\n\t\t\t */\n\t\t\tfunction isElementInZone( targetToCheck ) {\n\t\t\t\tconst { defaultView } = ownerDocument;\n\t\t\t\tif (\n\t\t\t\t\t! targetToCheck ||\n\t\t\t\t\t! defaultView ||\n\t\t\t\t\t! ( targetToCheck instanceof defaultView.HTMLElement ) ||\n\t\t\t\t\t! element.contains( targetToCheck )\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\t/** @type {HTMLElement|null} */\n\t\t\t\tlet elementToCheck = targetToCheck;\n\n\t\t\t\tdo {\n\t\t\t\t\tif ( elementToCheck.dataset.isDropZone ) {\n\t\t\t\t\t\treturn elementToCheck === element;\n\t\t\t\t\t}\n\t\t\t\t} while ( ( elementToCheck = elementToCheck.parentElement ) );\n\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\tfunction maybeDragStart( /** @type {DragEvent} */ event ) {\n\t\t\t\tif ( isDragging ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tisDragging = true;\n\n\t\t\t\t// Note that `dragend` doesn't fire consistently for file and\n\t\t\t\t// HTML drag events where the drag origin is outside the browser\n\t\t\t\t// window. In Firefox it may also not fire if the originating\n\t\t\t\t// node is removed.\n\t\t\t\townerDocument.addEventListener( 'dragend', maybeDragEnd );\n\t\t\t\townerDocument.addEventListener( 'mousemove', maybeDragEnd );\n\n\t\t\t\tif ( onDragStartRef.current ) {\n\t\t\t\t\tonDragStartRef.current( event );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfunction onDragEnter( /** @type {DragEvent} */ event ) {\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\t// The `dragenter` event will also fire when entering child\n\t\t\t\t// elements, but we only want to call `onDragEnter` when\n\t\t\t\t// entering the drop zone, which means the `relatedTarget`\n\t\t\t\t// (element that has been left) should be outside the drop zone.\n\t\t\t\tif (\n\t\t\t\t\telement.contains(\n\t\t\t\t\t\t/** @type {Node} */ ( event.relatedTarget )\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( onDragEnterRef.current ) {\n\t\t\t\t\tonDragEnterRef.current( event );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfunction onDragOver( /** @type {DragEvent} */ event ) {\n\t\t\t\t// Only call onDragOver for the innermost hovered drop zones.\n\t\t\t\tif ( ! event.defaultPrevented && onDragOverRef.current ) {\n\t\t\t\t\tonDragOverRef.current( event );\n\t\t\t\t}\n\n\t\t\t\t// Prevent the browser default while also signalling to parent\n\t\t\t\t// drop zones that `onDragOver` is already handled.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\n\t\t\tfunction onDragLeave( /** @type {DragEvent} */ event ) {\n\t\t\t\t// The `dragleave` event will also fire when leaving child\n\t\t\t\t// elements, but we only want to call `onDragLeave` when\n\t\t\t\t// leaving the drop zone, which means the `relatedTarget`\n\t\t\t\t// (element that has been entered) should be outside the drop\n\t\t\t\t// zone.\n\t\t\t\t// Note: This is not entirely reliable in Safari due to this bug\n\t\t\t\t// https://bugs.webkit.org/show_bug.cgi?id=66547\n\t\t\t\tif ( isElementInZone( event.relatedTarget ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( onDragLeaveRef.current ) {\n\t\t\t\t\tonDragLeaveRef.current( event );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfunction onDrop( /** @type {DragEvent} */ event ) {\n\t\t\t\t// Don't handle drop if an inner drop zone already handled it.\n\t\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Prevent the browser default while also signalling to parent\n\t\t\t\t// drop zones that `onDrop` is already handled.\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\t// This seemingly useless line has been shown to resolve a\n\t\t\t\t// Safari issue where files dragged directly from the dock are\n\t\t\t\t// not recognized.\n\t\t\t\t// eslint-disable-next-line no-unused-expressions\n\t\t\t\tevent.dataTransfer && event.dataTransfer.files.length;\n\n\t\t\t\tif ( onDropRef.current ) {\n\t\t\t\t\tonDropRef.current( event );\n\t\t\t\t}\n\n\t\t\t\tmaybeDragEnd( event );\n\t\t\t}\n\n\t\t\tfunction maybeDragEnd( /** @type {MouseEvent} */ event ) {\n\t\t\t\tif ( ! isDragging ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tisDragging = false;\n\n\t\t\t\townerDocument.removeEventListener( 'dragend', maybeDragEnd );\n\t\t\t\townerDocument.removeEventListener( 'mousemove', maybeDragEnd );\n\n\t\t\t\tif ( onDragEndRef.current ) {\n\t\t\t\t\tonDragEndRef.current( event );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\telement.dataset.isDropZone = 'true';\n\t\t\telement.addEventListener( 'drop', onDrop );\n\t\t\telement.addEventListener( 'dragenter', onDragEnter );\n\t\t\telement.addEventListener( 'dragover', onDragOver );\n\t\t\telement.addEventListener( 'dragleave', onDragLeave );\n\t\t\t// The `dragstart` event doesn't fire if the drag started outside\n\t\t\t// the document.\n\t\t\townerDocument.addEventListener( 'dragenter', maybeDragStart );\n\n\t\t\treturn () => {\n\t\t\t\tdelete element.dataset.isDropZone;\n\t\t\t\telement.removeEventListener( 'drop', onDrop );\n\t\t\t\telement.removeEventListener( 'dragenter', onDragEnter );\n\t\t\t\telement.removeEventListener( 'dragover', onDragOver );\n\t\t\t\telement.removeEventListener( 'dragleave', onDragLeave );\n\t\t\t\townerDocument.removeEventListener( 'dragend', maybeDragEnd );\n\t\t\t\townerDocument.removeEventListener( 'mousemove', maybeDragEnd );\n\t\t\t\townerDocument.removeEventListener(\n\t\t\t\t\t'dragenter',\n\t\t\t\t\tmaybeDragStart\n\t\t\t\t);\n\t\t\t};\n\t\t},\n\t\t[ isDisabled, dropZoneElement ] // Refresh when the passed in dropZoneElement changes.\n\t);\n}\n"]}
1
+ {"version":3,"names":["useRef","useRefEffect","useFreshRef","value","ref","current","useDropZone","dropZoneElement","isDisabled","onDrop","_onDrop","onDragStart","_onDragStart","onDragEnter","_onDragEnter","onDragLeave","_onDragLeave","onDragEnd","_onDragEnd","onDragOver","_onDragOver","onDropRef","onDragStartRef","onDragEnterRef","onDragLeaveRef","onDragEndRef","onDragOverRef","elem","element","isDragging","ownerDocument","isElementInZone","targetToCheck","defaultView","HTMLElement","contains","elementToCheck","dataset","isDropZone","parentElement","maybeDragStart","event","addEventListener","maybeDragEnd","preventDefault","relatedTarget","defaultPrevented","dataTransfer","files","length","removeEventListener"],"sources":["@wordpress/compose/src/hooks/use-drop-zone/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\n\n/* eslint-disable jsdoc/valid-types */\n/**\n * @template T\n * @param {T} value\n * @return {import('react').MutableRefObject<T|null>} A ref with the value.\n */\nfunction useFreshRef( value ) {\n\t/* eslint-enable jsdoc/valid-types */\n\t/* eslint-disable jsdoc/no-undefined-types */\n\t/** @type {import('react').MutableRefObject<T>} */\n\t/* eslint-enable jsdoc/no-undefined-types */\n\t// Disable reason: We're doing something pretty JavaScript-y here where the\n\t// ref will always have a current value that is not null or undefined but it\n\t// needs to start as undefined. We don't want to change the return type so\n\t// it's easier to just ts-ignore this specific line that's complaining about\n\t// undefined not being part of T.\n\t// @ts-ignore\n\tconst ref = useRef();\n\tref.current = value;\n\treturn ref;\n}\n\n/**\n * A hook to facilitate drag and drop handling.\n *\n * @param {Object} props Named parameters.\n * @param {?HTMLElement} [props.dropZoneElement] Optional element to be used as the drop zone.\n * @param {boolean} [props.isDisabled] Whether or not to disable the drop zone.\n * @param {(e: DragEvent) => void} [props.onDragStart] Called when dragging has started.\n * @param {(e: DragEvent) => void} [props.onDragEnter] Called when the zone is entered.\n * @param {(e: DragEvent) => void} [props.onDragOver] Called when the zone is moved within.\n * @param {(e: DragEvent) => void} [props.onDragLeave] Called when the zone is left.\n * @param {(e: MouseEvent) => void} [props.onDragEnd] Called when dragging has ended.\n * @param {(e: DragEvent) => void} [props.onDrop] Called when dropping in the zone.\n *\n * @return {import('react').RefCallback<HTMLElement>} Ref callback to be passed to the drop zone element.\n */\nexport default function useDropZone( {\n\tdropZoneElement,\n\tisDisabled,\n\tonDrop: _onDrop,\n\tonDragStart: _onDragStart,\n\tonDragEnter: _onDragEnter,\n\tonDragLeave: _onDragLeave,\n\tonDragEnd: _onDragEnd,\n\tonDragOver: _onDragOver,\n} ) {\n\tconst onDropRef = useFreshRef( _onDrop );\n\tconst onDragStartRef = useFreshRef( _onDragStart );\n\tconst onDragEnterRef = useFreshRef( _onDragEnter );\n\tconst onDragLeaveRef = useFreshRef( _onDragLeave );\n\tconst onDragEndRef = useFreshRef( _onDragEnd );\n\tconst onDragOverRef = useFreshRef( _onDragOver );\n\n\treturn useRefEffect(\n\t\t( elem ) => {\n\t\t\tif ( isDisabled ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// If a custom dropZoneRef is passed, use that instead of the element.\n\t\t\t// This allows the dropzone to cover an expanded area, rather than\n\t\t\t// be restricted to the area of the ref returned by this hook.\n\t\t\tconst element = dropZoneElement ?? elem;\n\n\t\t\tlet isDragging = false;\n\n\t\t\tconst { ownerDocument } = element;\n\n\t\t\t/**\n\t\t\t * Checks if an element is in the drop zone.\n\t\t\t *\n\t\t\t * @param {EventTarget|null} targetToCheck\n\t\t\t *\n\t\t\t * @return {boolean} True if in drop zone, false if not.\n\t\t\t */\n\t\t\tfunction isElementInZone( targetToCheck ) {\n\t\t\t\tconst { defaultView } = ownerDocument;\n\t\t\t\tif (\n\t\t\t\t\t! targetToCheck ||\n\t\t\t\t\t! defaultView ||\n\t\t\t\t\t! ( targetToCheck instanceof defaultView.HTMLElement ) ||\n\t\t\t\t\t! element.contains( targetToCheck )\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\t/** @type {HTMLElement|null} */\n\t\t\t\tlet elementToCheck = targetToCheck;\n\n\t\t\t\tdo {\n\t\t\t\t\tif ( elementToCheck.dataset.isDropZone ) {\n\t\t\t\t\t\treturn elementToCheck === element;\n\t\t\t\t\t}\n\t\t\t\t} while ( ( elementToCheck = elementToCheck.parentElement ) );\n\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\tfunction maybeDragStart( /** @type {DragEvent} */ event ) {\n\t\t\t\tif ( isDragging ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tisDragging = true;\n\n\t\t\t\t// Note that `dragend` doesn't fire consistently for file and\n\t\t\t\t// HTML drag events where the drag origin is outside the browser\n\t\t\t\t// window. In Firefox it may also not fire if the originating\n\t\t\t\t// node is removed.\n\t\t\t\townerDocument.addEventListener( 'dragend', maybeDragEnd );\n\t\t\t\townerDocument.addEventListener( 'mousemove', maybeDragEnd );\n\n\t\t\t\tif ( onDragStartRef.current ) {\n\t\t\t\t\tonDragStartRef.current( event );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfunction onDragEnter( /** @type {DragEvent} */ event ) {\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\t// The `dragenter` event will also fire when entering child\n\t\t\t\t// elements, but we only want to call `onDragEnter` when\n\t\t\t\t// entering the drop zone, which means the `relatedTarget`\n\t\t\t\t// (element that has been left) should be outside the drop zone.\n\t\t\t\tif (\n\t\t\t\t\telement.contains(\n\t\t\t\t\t\t/** @type {Node} */ ( event.relatedTarget )\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( onDragEnterRef.current ) {\n\t\t\t\t\tonDragEnterRef.current( event );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfunction onDragOver( /** @type {DragEvent} */ event ) {\n\t\t\t\t// Only call onDragOver for the innermost hovered drop zones.\n\t\t\t\tif ( ! event.defaultPrevented && onDragOverRef.current ) {\n\t\t\t\t\tonDragOverRef.current( event );\n\t\t\t\t}\n\n\t\t\t\t// Prevent the browser default while also signalling to parent\n\t\t\t\t// drop zones that `onDragOver` is already handled.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\n\t\t\tfunction onDragLeave( /** @type {DragEvent} */ event ) {\n\t\t\t\t// The `dragleave` event will also fire when leaving child\n\t\t\t\t// elements, but we only want to call `onDragLeave` when\n\t\t\t\t// leaving the drop zone, which means the `relatedTarget`\n\t\t\t\t// (element that has been entered) should be outside the drop\n\t\t\t\t// zone.\n\t\t\t\t// Note: This is not entirely reliable in Safari due to this bug\n\t\t\t\t// https://bugs.webkit.org/show_bug.cgi?id=66547\n\t\t\t\tif ( isElementInZone( event.relatedTarget ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( onDragLeaveRef.current ) {\n\t\t\t\t\tonDragLeaveRef.current( event );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfunction onDrop( /** @type {DragEvent} */ event ) {\n\t\t\t\t// Don't handle drop if an inner drop zone already handled it.\n\t\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Prevent the browser default while also signalling to parent\n\t\t\t\t// drop zones that `onDrop` is already handled.\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\t// This seemingly useless line has been shown to resolve a\n\t\t\t\t// Safari issue where files dragged directly from the dock are\n\t\t\t\t// not recognized.\n\t\t\t\t// eslint-disable-next-line no-unused-expressions\n\t\t\t\tevent.dataTransfer && event.dataTransfer.files.length;\n\n\t\t\t\tif ( onDropRef.current ) {\n\t\t\t\t\tonDropRef.current( event );\n\t\t\t\t}\n\n\t\t\t\tmaybeDragEnd( event );\n\t\t\t}\n\n\t\t\tfunction maybeDragEnd( /** @type {MouseEvent} */ event ) {\n\t\t\t\tif ( ! isDragging ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tisDragging = false;\n\n\t\t\t\townerDocument.removeEventListener( 'dragend', maybeDragEnd );\n\t\t\t\townerDocument.removeEventListener( 'mousemove', maybeDragEnd );\n\n\t\t\t\tif ( onDragEndRef.current ) {\n\t\t\t\t\tonDragEndRef.current( event );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\telement.dataset.isDropZone = 'true';\n\t\t\telement.addEventListener( 'drop', onDrop );\n\t\t\telement.addEventListener( 'dragenter', onDragEnter );\n\t\t\telement.addEventListener( 'dragover', onDragOver );\n\t\t\telement.addEventListener( 'dragleave', onDragLeave );\n\t\t\t// The `dragstart` event doesn't fire if the drag started outside\n\t\t\t// the document.\n\t\t\townerDocument.addEventListener( 'dragenter', maybeDragStart );\n\n\t\t\treturn () => {\n\t\t\t\tdelete element.dataset.isDropZone;\n\t\t\t\telement.removeEventListener( 'drop', onDrop );\n\t\t\t\telement.removeEventListener( 'dragenter', onDragEnter );\n\t\t\t\telement.removeEventListener( 'dragover', onDragOver );\n\t\t\t\telement.removeEventListener( 'dragleave', onDragLeave );\n\t\t\t\townerDocument.removeEventListener( 'dragend', maybeDragEnd );\n\t\t\t\townerDocument.removeEventListener( 'mousemove', maybeDragEnd );\n\t\t\t\townerDocument.removeEventListener(\n\t\t\t\t\t'dragenter',\n\t\t\t\t\tmaybeDragStart\n\t\t\t\t);\n\t\t\t};\n\t\t},\n\t\t[ isDisabled, dropZoneElement ] // Refresh when the passed in dropZoneElement changes.\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,oBAAoB;;AAE3C;AACA;AACA;AACA,OAAOC,YAAY,MAAM,mBAAmB;;AAE5C;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,WAAWA,CAAEC,KAAK,EAAG;EAC7B;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,MAAMC,GAAG,GAAGJ,MAAM,CAAC,CAAC;EACpBI,GAAG,CAACC,OAAO,GAAGF,KAAK;EACnB,OAAOC,GAAG;AACX;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASE,WAAWA,CAAE;EACpCC,eAAe;EACfC,UAAU;EACVC,MAAM,EAAEC,OAAO;EACfC,WAAW,EAAEC,YAAY;EACzBC,WAAW,EAAEC,YAAY;EACzBC,WAAW,EAAEC,YAAY;EACzBC,SAAS,EAAEC,UAAU;EACrBC,UAAU,EAAEC;AACb,CAAC,EAAG;EACH,MAAMC,SAAS,GAAGnB,WAAW,CAAEQ,OAAQ,CAAC;EACxC,MAAMY,cAAc,GAAGpB,WAAW,CAAEU,YAAa,CAAC;EAClD,MAAMW,cAAc,GAAGrB,WAAW,CAAEY,YAAa,CAAC;EAClD,MAAMU,cAAc,GAAGtB,WAAW,CAAEc,YAAa,CAAC;EAClD,MAAMS,YAAY,GAAGvB,WAAW,CAAEgB,UAAW,CAAC;EAC9C,MAAMQ,aAAa,GAAGxB,WAAW,CAAEkB,WAAY,CAAC;EAEhD,OAAOnB,YAAY,CAChB0B,IAAI,IAAM;IACX,IAAKnB,UAAU,EAAG;MACjB;IACD;;IAEA;IACA;IACA;IACA,MAAMoB,OAAO,GAAGrB,eAAe,aAAfA,eAAe,cAAfA,eAAe,GAAIoB,IAAI;IAEvC,IAAIE,UAAU,GAAG,KAAK;IAEtB,MAAM;MAAEC;IAAc,CAAC,GAAGF,OAAO;;IAEjC;AACH;AACA;AACA;AACA;AACA;AACA;IACG,SAASG,eAAeA,CAAEC,aAAa,EAAG;MACzC,MAAM;QAAEC;MAAY,CAAC,GAAGH,aAAa;MACrC,IACC,CAAEE,aAAa,IACf,CAAEC,WAAW,IACb,EAAID,aAAa,YAAYC,WAAW,CAACC,WAAW,CAAE,IACtD,CAAEN,OAAO,CAACO,QAAQ,CAAEH,aAAc,CAAC,EAClC;QACD,OAAO,KAAK;MACb;;MAEA;MACA,IAAII,cAAc,GAAGJ,aAAa;MAElC,GAAG;QACF,IAAKI,cAAc,CAACC,OAAO,CAACC,UAAU,EAAG;UACxC,OAAOF,cAAc,KAAKR,OAAO;QAClC;MACD,CAAC,QAAWQ,cAAc,GAAGA,cAAc,CAACG,aAAa;MAEzD,OAAO,KAAK;IACb;IAEA,SAASC,cAAcA,CAAA,CAAE,wBAAyBC,KAAK,EAAG;MACzD,IAAKZ,UAAU,EAAG;QACjB;MACD;MAEAA,UAAU,GAAG,IAAI;;MAEjB;MACA;MACA;MACA;MACAC,aAAa,CAACY,gBAAgB,CAAE,SAAS,EAAEC,YAAa,CAAC;MACzDb,aAAa,CAACY,gBAAgB,CAAE,WAAW,EAAEC,YAAa,CAAC;MAE3D,IAAKrB,cAAc,CAACjB,OAAO,EAAG;QAC7BiB,cAAc,CAACjB,OAAO,CAAEoC,KAAM,CAAC;MAChC;IACD;IAEA,SAAS5B,WAAWA,CAAA,CAAE,wBAAyB4B,KAAK,EAAG;MACtDA,KAAK,CAACG,cAAc,CAAC,CAAC;;MAEtB;MACA;MACA;MACA;MACA,IACChB,OAAO,CAACO,QAAQ,EACf,mBAAsBM,KAAK,CAACI,aAC7B,CAAC,EACA;QACD;MACD;MAEA,IAAKtB,cAAc,CAAClB,OAAO,EAAG;QAC7BkB,cAAc,CAAClB,OAAO,CAAEoC,KAAM,CAAC;MAChC;IACD;IAEA,SAAStB,UAAUA,CAAA,CAAE,wBAAyBsB,KAAK,EAAG;MACrD;MACA,IAAK,CAAEA,KAAK,CAACK,gBAAgB,IAAIpB,aAAa,CAACrB,OAAO,EAAG;QACxDqB,aAAa,CAACrB,OAAO,CAAEoC,KAAM,CAAC;MAC/B;;MAEA;MACA;MACAA,KAAK,CAACG,cAAc,CAAC,CAAC;IACvB;IAEA,SAAS7B,WAAWA,CAAA,CAAE,wBAAyB0B,KAAK,EAAG;MACtD;MACA;MACA;MACA;MACA;MACA;MACA;MACA,IAAKV,eAAe,CAAEU,KAAK,CAACI,aAAc,CAAC,EAAG;QAC7C;MACD;MAEA,IAAKrB,cAAc,CAACnB,OAAO,EAAG;QAC7BmB,cAAc,CAACnB,OAAO,CAAEoC,KAAM,CAAC;MAChC;IACD;IAEA,SAAShC,MAAMA,CAAA,CAAE,wBAAyBgC,KAAK,EAAG;MACjD;MACA,IAAKA,KAAK,CAACK,gBAAgB,EAAG;QAC7B;MACD;;MAEA;MACA;MACAL,KAAK,CAACG,cAAc,CAAC,CAAC;;MAEtB;MACA;MACA;MACA;MACAH,KAAK,CAACM,YAAY,IAAIN,KAAK,CAACM,YAAY,CAACC,KAAK,CAACC,MAAM;MAErD,IAAK5B,SAAS,CAAChB,OAAO,EAAG;QACxBgB,SAAS,CAAChB,OAAO,CAAEoC,KAAM,CAAC;MAC3B;MAEAE,YAAY,CAAEF,KAAM,CAAC;IACtB;IAEA,SAASE,YAAYA,CAAA,CAAE,yBAA0BF,KAAK,EAAG;MACxD,IAAK,CAAEZ,UAAU,EAAG;QACnB;MACD;MAEAA,UAAU,GAAG,KAAK;MAElBC,aAAa,CAACoB,mBAAmB,CAAE,SAAS,EAAEP,YAAa,CAAC;MAC5Db,aAAa,CAACoB,mBAAmB,CAAE,WAAW,EAAEP,YAAa,CAAC;MAE9D,IAAKlB,YAAY,CAACpB,OAAO,EAAG;QAC3BoB,YAAY,CAACpB,OAAO,CAAEoC,KAAM,CAAC;MAC9B;IACD;IAEAb,OAAO,CAACS,OAAO,CAACC,UAAU,GAAG,MAAM;IACnCV,OAAO,CAACc,gBAAgB,CAAE,MAAM,EAAEjC,MAAO,CAAC;IAC1CmB,OAAO,CAACc,gBAAgB,CAAE,WAAW,EAAE7B,WAAY,CAAC;IACpDe,OAAO,CAACc,gBAAgB,CAAE,UAAU,EAAEvB,UAAW,CAAC;IAClDS,OAAO,CAACc,gBAAgB,CAAE,WAAW,EAAE3B,WAAY,CAAC;IACpD;IACA;IACAe,aAAa,CAACY,gBAAgB,CAAE,WAAW,EAAEF,cAAe,CAAC;IAE7D,OAAO,MAAM;MACZ,OAAOZ,OAAO,CAACS,OAAO,CAACC,UAAU;MACjCV,OAAO,CAACsB,mBAAmB,CAAE,MAAM,EAAEzC,MAAO,CAAC;MAC7CmB,OAAO,CAACsB,mBAAmB,CAAE,WAAW,EAAErC,WAAY,CAAC;MACvDe,OAAO,CAACsB,mBAAmB,CAAE,UAAU,EAAE/B,UAAW,CAAC;MACrDS,OAAO,CAACsB,mBAAmB,CAAE,WAAW,EAAEnC,WAAY,CAAC;MACvDe,aAAa,CAACoB,mBAAmB,CAAE,SAAS,EAAEP,YAAa,CAAC;MAC5Db,aAAa,CAACoB,mBAAmB,CAAE,WAAW,EAAEP,YAAa,CAAC;MAC9Db,aAAa,CAACoB,mBAAmB,CAChC,WAAW,EACXV,cACD,CAAC;IACF,CAAC;EACF,CAAC,EACD,CAAEhC,UAAU,EAAED,eAAe,CAAE,CAAC;EACjC,CAAC;AACF"}
@@ -4,12 +4,13 @@
4
4
  import { useState, useLayoutEffect } from '@wordpress/element';
5
5
  import { getScrollContainer } from '@wordpress/dom';
6
6
  import { PAGEUP, PAGEDOWN, HOME, END } from '@wordpress/keycodes';
7
+
7
8
  /**
8
9
  * Internal dependencies
9
10
  */
10
-
11
11
  import { debounce } from '../../utils/debounce';
12
12
  const DEFAULT_INIT_WINDOW_SIZE = 30;
13
+
13
14
  /**
14
15
  * @typedef {Object} WPFixedWindowList
15
16
  *
@@ -35,19 +36,15 @@ const DEFAULT_INIT_WINDOW_SIZE = 30;
35
36
  * @param { WPFixedWindowListOptions } [options] Options object
36
37
  * @return {[ WPFixedWindowList, setFixedListWindow:(nextWindow:WPFixedWindowList)=>void]} Array with the fixed window list and setter
37
38
  */
38
-
39
39
  export default function useFixedWindowList(elementRef, itemHeight, totalItems, options) {
40
40
  var _options$initWindowSi, _options$useWindowing;
41
-
42
41
  const initWindowSize = (_options$initWindowSi = options?.initWindowSize) !== null && _options$initWindowSi !== void 0 ? _options$initWindowSi : DEFAULT_INIT_WINDOW_SIZE;
43
42
  const useWindowing = (_options$useWindowing = options?.useWindowing) !== null && _options$useWindowing !== void 0 ? _options$useWindowing : true;
44
43
  const [fixedListWindow, setFixedListWindow] = useState({
45
44
  visibleItems: initWindowSize,
46
45
  start: 0,
47
46
  end: initWindowSize,
48
- itemInView: (
49
- /** @type {number} */
50
- index) => {
47
+ itemInView: ( /** @type {number} */index) => {
51
48
  return index >= 0 && index <= initWindowSize;
52
49
  }
53
50
  });
@@ -55,20 +52,14 @@ export default function useFixedWindowList(elementRef, itemHeight, totalItems, o
55
52
  if (!useWindowing) {
56
53
  return;
57
54
  }
58
-
59
55
  const scrollContainer = getScrollContainer(elementRef.current);
60
-
61
- const measureWindow = (
62
- /** @type {boolean | undefined} */
63
- initRender) => {
56
+ const measureWindow = ( /** @type {boolean | undefined} */initRender) => {
64
57
  var _options$windowOversc;
65
-
66
58
  if (!scrollContainer) {
67
59
  return;
68
60
  }
69
-
70
- const visibleItems = Math.ceil(scrollContainer.clientHeight / itemHeight); // Aim to keep opening list view fast, afterward we can optimize for scrolling.
71
-
61
+ const visibleItems = Math.ceil(scrollContainer.clientHeight / itemHeight);
62
+ // Aim to keep opening list view fast, afterward we can optimize for scrolling.
72
63
  const windowOverscan = initRender ? visibleItems : (_options$windowOversc = options?.windowOverscan) !== null && _options$windowOversc !== void 0 ? _options$windowOversc : visibleItems;
73
64
  const firstViewableIndex = Math.floor(scrollContainer.scrollTop / itemHeight);
74
65
  const start = Math.max(0, firstViewableIndex - windowOverscan);
@@ -78,21 +69,16 @@ export default function useFixedWindowList(elementRef, itemHeight, totalItems, o
78
69
  visibleItems,
79
70
  start,
80
71
  end,
81
- itemInView: (
82
- /** @type {number} */
83
- index) => {
72
+ itemInView: ( /** @type {number} */index) => {
84
73
  return start <= index && index <= end;
85
74
  }
86
75
  };
87
-
88
76
  if (lastWindow.start !== nextWindow.start || lastWindow.end !== nextWindow.end || lastWindow.visibleItems !== nextWindow.visibleItems) {
89
77
  return nextWindow;
90
78
  }
91
-
92
79
  return lastWindow;
93
80
  });
94
81
  };
95
-
96
82
  measureWindow(true);
97
83
  const debounceMeasureList = debounce(() => {
98
84
  measureWindow();
@@ -109,12 +95,8 @@ export default function useFixedWindowList(elementRef, itemHeight, totalItems, o
109
95
  if (!useWindowing) {
110
96
  return;
111
97
  }
112
-
113
98
  const scrollContainer = getScrollContainer(elementRef.current);
114
-
115
- const handleKeyDown = (
116
- /** @type {KeyboardEvent} */
117
- event) => {
99
+ const handleKeyDown = ( /** @type {KeyboardEvent} */event) => {
118
100
  switch (event.keyCode) {
119
101
  case HOME:
120
102
  {
@@ -122,21 +104,18 @@ export default function useFixedWindowList(elementRef, itemHeight, totalItems, o
122
104
  top: 0
123
105
  });
124
106
  }
125
-
126
107
  case END:
127
108
  {
128
109
  return scrollContainer?.scrollTo({
129
110
  top: totalItems * itemHeight
130
111
  });
131
112
  }
132
-
133
113
  case PAGEUP:
134
114
  {
135
115
  return scrollContainer?.scrollTo({
136
116
  top: scrollContainer.scrollTop - fixedListWindow.visibleItems * itemHeight
137
117
  });
138
118
  }
139
-
140
119
  case PAGEDOWN:
141
120
  {
142
121
  return scrollContainer?.scrollTo({
@@ -145,7 +124,6 @@ export default function useFixedWindowList(elementRef, itemHeight, totalItems, o
145
124
  }
146
125
  }
147
126
  };
148
-
149
127
  scrollContainer?.ownerDocument?.defaultView?.addEventListener('keydown', handleKeyDown);
150
128
  return () => {
151
129
  scrollContainer?.ownerDocument?.defaultView?.removeEventListener('keydown', handleKeyDown);
@@ -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,"names":["useState","useLayoutEffect","getScrollContainer","PAGEUP","PAGEDOWN","HOME","END","debounce","DEFAULT_INIT_WINDOW_SIZE","useFixedWindowList","elementRef","itemHeight","totalItems","options","_options$initWindowSi","_options$useWindowing","initWindowSize","useWindowing","fixedListWindow","setFixedListWindow","visibleItems","start","end","itemInView","index","scrollContainer","current","measureWindow","initRender","_options$windowOversc","Math","ceil","clientHeight","windowOverscan","firstViewableIndex","floor","scrollTop","max","min","lastWindow","nextWindow","debounceMeasureList","addEventListener","ownerDocument","defaultView","removeEventListener","handleKeyDown","event","keyCode","scrollTo","top"],"sources":["@wordpress/compose/src/hooks/use-fixed-window-list/index.js"],"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"],"mappings":"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"}
@@ -3,6 +3,7 @@
3
3
  */
4
4
  import { useRef, useEffect, useCallback } from '@wordpress/element';
5
5
  import { focus } from '@wordpress/dom';
6
+
6
7
  /**
7
8
  * Hook used to focus the first tabbable element on mount.
8
9
  *
@@ -24,16 +25,15 @@ import { focus } from '@wordpress/dom';
24
25
  * }
25
26
  * ```
26
27
  */
27
-
28
28
  export default function useFocusOnMount(focusOnMount = 'firstElement') {
29
29
  const focusOnMountRef = useRef(focusOnMount);
30
+
30
31
  /**
31
32
  * Sets focus on a DOM element.
32
33
  *
33
34
  * @param {HTMLElement} target The DOM element to set focus to.
34
35
  * @return {void}
35
36
  */
36
-
37
37
  const setFocus = target => {
38
38
  target.focus({
39
39
  // When focusing newly mounted dialogs,
@@ -42,9 +42,8 @@ export default function useFocusOnMount(focusOnMount = 'firstElement') {
42
42
  preventScroll: true
43
43
  });
44
44
  };
45
- /** @type {import('react').MutableRefObject<ReturnType<setTimeout> | undefined>} */
46
-
47
45
 
46
+ /** @type {import('react').MutableRefObject<ReturnType<setTimeout> | undefined>} */
48
47
  const timerId = useRef();
49
48
  useEffect(() => {
50
49
  focusOnMountRef.current = focusOnMount;
@@ -58,28 +57,21 @@ export default function useFocusOnMount(focusOnMount = 'firstElement') {
58
57
  }, []);
59
58
  return useCallback(node => {
60
59
  var _node$ownerDocument$a;
61
-
62
60
  if (!node || focusOnMountRef.current === false) {
63
61
  return;
64
62
  }
65
-
66
63
  if (node.contains((_node$ownerDocument$a = node.ownerDocument?.activeElement) !== null && _node$ownerDocument$a !== void 0 ? _node$ownerDocument$a : null)) {
67
64
  return;
68
65
  }
69
-
70
66
  if (focusOnMountRef.current === 'firstElement') {
71
67
  timerId.current = setTimeout(() => {
72
68
  const firstTabbable = focus.tabbable.find(node)[0];
73
-
74
69
  if (firstTabbable) {
75
- setFocus(
76
- /** @type {HTMLElement} */
77
- firstTabbable);
70
+ setFocus( /** @type {HTMLElement} */firstTabbable);
78
71
  }
79
72
  }, 0);
80
73
  return;
81
74
  }
82
-
83
75
  setFocus(node);
84
76
  }, []);
85
77
  }
@@ -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,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"]}
1
+ {"version":3,"names":["useRef","useEffect","useCallback","focus","useFocusOnMount","focusOnMount","focusOnMountRef","setFocus","target","preventScroll","timerId","current","clearTimeout","node","_node$ownerDocument$a","contains","ownerDocument","activeElement","setTimeout","firstTabbable","tabbable","find"],"sources":["@wordpress/compose/src/hooks/use-focus-on-mount/index.js"],"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"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAM,EAAEC,SAAS,EAAEC,WAAW,QAAQ,oBAAoB;AACnE,SAASC,KAAK,QAAQ,gBAAgB;;AAEtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,eAAeA,CAAEC,YAAY,GAAG,cAAc,EAAG;EACxE,MAAMC,eAAe,GAAGN,MAAM,CAAEK,YAAa,CAAC;;EAE9C;AACD;AACA;AACA;AACA;AACA;EACC,MAAME,QAAQ,GAAKC,MAAM,IAAM;IAC9BA,MAAM,CAACL,KAAK,CAAE;MACb;MACA;MACA;MACAM,aAAa,EAAE;IAChB,CAAE,CAAC;EACJ,CAAC;;EAED;EACA,MAAMC,OAAO,GAAGV,MAAM,CAAC,CAAC;EAExBC,SAAS,CAAE,MAAM;IAChBK,eAAe,CAACK,OAAO,GAAGN,YAAY;EACvC,CAAC,EAAE,CAAEA,YAAY,CAAG,CAAC;EAErBJ,SAAS,CAAE,MAAM;IAChB,OAAO,MAAM;MACZ,IAAKS,OAAO,CAACC,OAAO,EAAG;QACtBC,YAAY,CAAEF,OAAO,CAACC,OAAQ,CAAC;MAChC;IACD,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,OAAOT,WAAW,CAAIW,IAAI,IAAM;IAAA,IAAAC,qBAAA;IAC/B,IAAK,CAAED,IAAI,IAAIP,eAAe,CAACK,OAAO,KAAK,KAAK,EAAG;MAClD;IACD;IAEA,IAAKE,IAAI,CAACE,QAAQ,EAAAD,qBAAA,GAAED,IAAI,CAACG,aAAa,EAAEC,aAAa,cAAAH,qBAAA,cAAAA,qBAAA,GAAI,IAAK,CAAC,EAAG;MACjE;IACD;IAEA,IAAKR,eAAe,CAACK,OAAO,KAAK,cAAc,EAAG;MACjDD,OAAO,CAACC,OAAO,GAAGO,UAAU,CAAE,MAAM;QACnC,MAAMC,aAAa,GAAGhB,KAAK,CAACiB,QAAQ,CAACC,IAAI,CAAER,IAAK,CAAC,CAAE,CAAC,CAAE;QAEtD,IAAKM,aAAa,EAAG;UACpBZ,QAAQ,EAAE,0BAA6BY,aAAgB,CAAC;QACzD;MACD,CAAC,EAAE,CAAE,CAAC;MAEN;IACD;IAEAZ,QAAQ,CAAEM,IAAK,CAAC;EACjB,CAAC,EAAE,EAAG,CAAC;AACR"}