@wordpress/compose 7.32.0 → 7.32.1-next.ff1cebbba.0

package/build-module/hooks/use-drop-zone/index.js

@@ -1,25 +1,6 @@
-/**
- * Internal dependencies
- */
-import useRefEffect from '../use-ref-effect';
-import useEvent from '../use-event';
-
-/**
- * A hook to facilitate drag and drop handling.
- *
- * @param {Object}                  props                   Named parameters.
- * @param {?HTMLElement}            [props.dropZoneElement] Optional element to be used as the drop zone.
- * @param {boolean}                 [props.isDisabled]      Whether or not to disable the drop zone.
- * @param {(e: DragEvent) => void}  [props.onDragStart]     Called when dragging has started.
- * @param {(e: DragEvent) => void}  [props.onDragEnter]     Called when the zone is entered.
- * @param {(e: DragEvent) => void}  [props.onDragOver]      Called when the zone is moved within.
- * @param {(e: DragEvent) => void}  [props.onDragLeave]     Called when the zone is left.
- * @param {(e: MouseEvent) => void} [props.onDragEnd]       Called when dragging has ended.
- * @param {(e: DragEvent) => void}  [props.onDrop]          Called when dropping in the zone.
- *
- * @return {import('react').RefCallback<HTMLElement>} Ref callback to be passed to the drop zone element.
- */
-export default function useDropZone({
+import useRefEffect from "../use-ref-effect";
+import useEvent from "../use-event";
+function useDropZone({
   dropZoneElement,
   isDisabled,
   onDrop: _onDrop,
@@ -35,150 +16,111 @@ export default function useDropZone({
   const onDragLeaveEvent = useEvent(_onDragLeave);
   const onDragEndEvent = useEvent(_onDragEnd);
   const onDragOverEvent = useEvent(_onDragOver);
-  return useRefEffect(elem => {
-    if (isDisabled) {
-      return;
-    }
-
-    // If a custom dropZoneRef is passed, use that instead of the element.
-    // This allows the dropzone to cover an expanded area, rather than
-    // be restricted to the area of the ref returned by this hook.
-    const element = dropZoneElement !== null && dropZoneElement !== void 0 ? dropZoneElement : elem;
-    let isDragging = false;
-    const {
-      ownerDocument
-    } = element;
-
-    /**
-     * Checks if an element is in the drop zone.
-     *
-     * @param {EventTarget|null} targetToCheck
-     *
-     * @return {boolean} True if in drop zone, false if not.
-     */
-    function isElementInZone(targetToCheck) {
-      const {
-        defaultView
-      } = ownerDocument;
-      if (!targetToCheck || !defaultView || !(targetToCheck instanceof defaultView.HTMLElement) || !element.contains(targetToCheck)) {
-        return false;
-      }
-
-      /** @type {HTMLElement|null} */
-      let elementToCheck = targetToCheck;
-      do {
-        if (elementToCheck.dataset.isDropZone) {
-          return elementToCheck === element;
-        }
-      } while (elementToCheck = elementToCheck.parentElement);
-      return false;
-    }
-    function maybeDragStart(/** @type {DragEvent} */event) {
-      if (isDragging) {
-        return;
-      }
-      isDragging = true;
-
-      // Note that `dragend` doesn't fire consistently for file and
-      // HTML drag events where the drag origin is outside the browser
-      // window. In Firefox it may also not fire if the originating
-      // node is removed.
-      ownerDocument.addEventListener('dragend', maybeDragEnd);
-      ownerDocument.addEventListener('mousemove', maybeDragEnd);
-      if (_onDragStart) {
-        onDragStartEvent(event);
-      }
-    }
-    function onDragEnter(/** @type {DragEvent} */event) {
-      event.preventDefault();
-
-      // The `dragenter` event will also fire when entering child
-      // elements, but we only want to call `onDragEnter` when
-      // entering the drop zone, which means the `relatedTarget`
-      // (element that has been left) should be outside the drop zone.
-      if (element.contains(/** @type {Node} */event.relatedTarget)) {
+  return useRefEffect(
+    (elem) => {
+      if (isDisabled) {
         return;
       }
-      if (_onDragEnter) {
-        onDragEnterEvent(event);
-      }
-    }
-    function onDragOver(/** @type {DragEvent} */event) {
-      // Only call onDragOver for the innermost hovered drop zones.
-      if (!event.defaultPrevented && _onDragOver) {
-        onDragOverEvent(event);
+      const element = dropZoneElement ?? elem;
+      let isDragging = false;
+      const { ownerDocument } = element;
+      function isElementInZone(targetToCheck) {
+        const { defaultView } = ownerDocument;
+        if (!targetToCheck || !defaultView || !(targetToCheck instanceof defaultView.HTMLElement) || !element.contains(targetToCheck)) {
+          return false;
+        }
+        let elementToCheck = targetToCheck;
+        do {
+          if (elementToCheck.dataset.isDropZone) {
+            return elementToCheck === element;
+          }
+        } while (elementToCheck = elementToCheck.parentElement);
+        return false;
       }
-
-      // Prevent the browser default while also signalling to parent
-      // drop zones that `onDragOver` is already handled.
-      event.preventDefault();
-    }
-    function onDragLeave(/** @type {DragEvent} */event) {
-      // The `dragleave` event will also fire when leaving child
-      // elements, but we only want to call `onDragLeave` when
-      // leaving the drop zone, which means the `relatedTarget`
-      // (element that has been entered) should be outside the drop
-      // zone.
-      // Note: This is not entirely reliable in Safari due to this bug
-      // https://bugs.webkit.org/show_bug.cgi?id=66547
-
-      if (isElementInZone(event.relatedTarget)) {
-        return;
+      function maybeDragStart(event) {
+        if (isDragging) {
+          return;
+        }
+        isDragging = true;
+        ownerDocument.addEventListener("dragend", maybeDragEnd);
+        ownerDocument.addEventListener("mousemove", maybeDragEnd);
+        if (_onDragStart) {
+          onDragStartEvent(event);
+        }
       }
-      if (_onDragLeave) {
-        onDragLeaveEvent(event);
+      function onDragEnter(event) {
+        event.preventDefault();
+        if (element.contains(
+          /** @type {Node} */
+          event.relatedTarget
+        )) {
+          return;
+        }
+        if (_onDragEnter) {
+          onDragEnterEvent(event);
+        }
       }
-    }
-    function onDrop(/** @type {DragEvent} */event) {
-      // Don't handle drop if an inner drop zone already handled it.
-      if (event.defaultPrevented) {
-        return;
+      function onDragOver(event) {
+        if (!event.defaultPrevented && _onDragOver) {
+          onDragOverEvent(event);
+        }
+        event.preventDefault();
       }
-
-      // Prevent the browser default while also signalling to parent
-      // drop zones that `onDrop` is already handled.
-      event.preventDefault();
-
-      // This seemingly useless line has been shown to resolve a
-      // Safari issue where files dragged directly from the dock are
-      // not recognized.
-      // eslint-disable-next-line no-unused-expressions
-      event.dataTransfer && event.dataTransfer.files.length;
-      if (_onDrop) {
-        onDropEvent(event);
+      function onDragLeave(event) {
+        if (isElementInZone(event.relatedTarget)) {
+          return;
+        }
+        if (_onDragLeave) {
+          onDragLeaveEvent(event);
+        }
       }
-      maybeDragEnd(event);
-    }
-    function maybeDragEnd(/** @type {MouseEvent} */event) {
-      if (!isDragging) {
-        return;
+      function onDrop(event) {
+        if (event.defaultPrevented) {
+          return;
+        }
+        event.preventDefault();
+        event.dataTransfer && event.dataTransfer.files.length;
+        if (_onDrop) {
+          onDropEvent(event);
+        }
+        maybeDragEnd(event);
       }
-      isDragging = false;
-      ownerDocument.removeEventListener('dragend', maybeDragEnd);
-      ownerDocument.removeEventListener('mousemove', maybeDragEnd);
-      if (_onDragEnd) {
-        onDragEndEvent(event);
+      function maybeDragEnd(event) {
+        if (!isDragging) {
+          return;
+        }
+        isDragging = false;
+        ownerDocument.removeEventListener("dragend", maybeDragEnd);
+        ownerDocument.removeEventListener("mousemove", maybeDragEnd);
+        if (_onDragEnd) {
+          onDragEndEvent(event);
+        }
       }
-    }
-    element.setAttribute('data-is-drop-zone', 'true');
-    element.addEventListener('drop', onDrop);
-    element.addEventListener('dragenter', onDragEnter);
-    element.addEventListener('dragover', onDragOver);
-    element.addEventListener('dragleave', onDragLeave);
-    // The `dragstart` event doesn't fire if the drag started outside
-    // the document.
-    ownerDocument.addEventListener('dragenter', maybeDragStart);
-    return () => {
-      element.removeAttribute('data-is-drop-zone');
-      element.removeEventListener('drop', onDrop);
-      element.removeEventListener('dragenter', onDragEnter);
-      element.removeEventListener('dragover', onDragOver);
-      element.removeEventListener('dragleave', onDragLeave);
-      ownerDocument.removeEventListener('dragend', maybeDragEnd);
-      ownerDocument.removeEventListener('mousemove', maybeDragEnd);
-      ownerDocument.removeEventListener('dragenter', maybeDragStart);
-    };
-  }, [isDisabled, dropZoneElement] // Refresh when the passed in dropZoneElement changes.
+      element.setAttribute("data-is-drop-zone", "true");
+      element.addEventListener("drop", onDrop);
+      element.addEventListener("dragenter", onDragEnter);
+      element.addEventListener("dragover", onDragOver);
+      element.addEventListener("dragleave", onDragLeave);
+      ownerDocument.addEventListener("dragenter", maybeDragStart);
+      return () => {
+        element.removeAttribute("data-is-drop-zone");
+        element.removeEventListener("drop", onDrop);
+        element.removeEventListener("dragenter", onDragEnter);
+        element.removeEventListener("dragover", onDragOver);
+        element.removeEventListener("dragleave", onDragLeave);
+        ownerDocument.removeEventListener("dragend", maybeDragEnd);
+        ownerDocument.removeEventListener("mousemove", maybeDragEnd);
+        ownerDocument.removeEventListener(
+          "dragenter",
+          maybeDragStart
+        );
+      };
+    },
+    [isDisabled, dropZoneElement]
+    // Refresh when the passed in dropZoneElement changes.
   );
 }
-//# sourceMappingURL=index.js.map
+export {
+  useDropZone as default
+};
+//# sourceMappingURL=index.js.map

package/build-module/hooks/use-drop-zone/index.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["useRefEffect","useEvent","useDropZone","dropZoneElement","isDisabled","onDrop","_onDrop","onDragStart","_onDragStart","onDragEnter","_onDragEnter","onDragLeave","_onDragLeave","onDragEnd","_onDragEnd","onDragOver","_onDragOver","onDropEvent","onDragStartEvent","onDragEnterEvent","onDragLeaveEvent","onDragEndEvent","onDragOverEvent","elem","element","isDragging","ownerDocument","isElementInZone","targetToCheck","defaultView","HTMLElement","contains","elementToCheck","dataset","isDropZone","parentElement","maybeDragStart","event","addEventListener","maybeDragEnd","preventDefault","relatedTarget","defaultPrevented","dataTransfer","files","length","removeEventListener","setAttribute","removeAttribute"],"sources":["@wordpress/compose/src/hooks/use-drop-zone/index.js"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\nimport useEvent from '../use-event';\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 onDropEvent = useEvent( _onDrop );\n\tconst onDragStartEvent = useEvent( _onDragStart );\n\tconst onDragEnterEvent = useEvent( _onDragEnter );\n\tconst onDragLeaveEvent = useEvent( _onDragLeave );\n\tconst onDragEndEvent = useEvent( _onDragEnd );\n\tconst onDragOverEvent = useEvent( _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\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 ( _onDragStart ) {\n\t\t\t\t\tonDragStartEvent( 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 ( _onDragEnter ) {\n\t\t\t\t\tonDragEnterEvent( 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 && _onDragOver ) {\n\t\t\t\t\tonDragOverEvent( 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\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 ( _onDragLeave ) {\n\t\t\t\t\tonDragLeaveEvent( 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 ( _onDrop ) {\n\t\t\t\t\tonDropEvent( 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 ( _onDragEnd ) {\n\t\t\t\t\tonDragEndEvent( event );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\telement.setAttribute( 'data-is-drop-zone', '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\telement.removeAttribute( 'data-is-drop-zone' );\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":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/use-drop-zone/index.js"],
+  "sourcesContent": ["/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\nimport useEvent from '../use-event';\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 onDropEvent = useEvent( _onDrop );\n\tconst onDragStartEvent = useEvent( _onDragStart );\n\tconst onDragEnterEvent = useEvent( _onDragEnter );\n\tconst onDragLeaveEvent = useEvent( _onDragLeave );\n\tconst onDragEndEvent = useEvent( _onDragEnd );\n\tconst onDragOverEvent = useEvent( _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\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 ( _onDragStart ) {\n\t\t\t\t\tonDragStartEvent( 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 ( _onDragEnter ) {\n\t\t\t\t\tonDragEnterEvent( 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 && _onDragOver ) {\n\t\t\t\t\tonDragOverEvent( 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\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 ( _onDragLeave ) {\n\t\t\t\t\tonDragLeaveEvent( 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 ( _onDrop ) {\n\t\t\t\t\tonDropEvent( 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 ( _onDragEnd ) {\n\t\t\t\t\tonDragEndEvent( event );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\telement.setAttribute( 'data-is-drop-zone', '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\telement.removeAttribute( 'data-is-drop-zone' );\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": "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",
+  "names": []
+}

package/build-module/hooks/use-event/index.js

@@ -1,45 +1,19 @@
-/**
- * WordPress dependencies
- */
-import { useRef, useInsertionEffect, useCallback } from '@wordpress/element';
-
-/**
- * Any function.
- */
-
-/**
- * Creates a stable callback function that has access to the latest state and
- * can be used within event handlers and effect callbacks. Throws when used in
- * the render phase.
- *
- * @param callback The callback function to wrap.
- *
- * @example
- *
- * ```tsx
- * function Component( props ) {
- *   const onClick = useEvent( props.onClick );
- *   useEffect( () => {
- *     onClick();
- *     // Won't trigger the effect again when props.onClick is updated.
- *   }, [ onClick ] );
- *   // Won't re-render Button when props.onClick is updated (if `Button` is
- *   // wrapped in `React.memo`).
- *   return <Button onClick={ onClick } />;
- * }
- * ```
- */
-export default function useEvent(
-/**
- * The callback function to wrap.
- */
-callback) {
+import { useRef, useInsertionEffect, useCallback } from "@wordpress/element";
+function useEvent(callback) {
   const ref = useRef(() => {
-    throw new Error('Callbacks created with `useEvent` cannot be called during rendering.');
+    throw new Error(
+      "Callbacks created with `useEvent` cannot be called during rendering."
+    );
   });
   useInsertionEffect(() => {
     ref.current = callback;
   });
-  return useCallback((...args) => ref.current?.(...args), []);
+  return useCallback(
+    (...args) => ref.current?.(...args),
+    []
+  );
 }
-//# sourceMappingURL=index.js.map
+export {
+  useEvent as default
+};
+//# sourceMappingURL=index.js.map

package/build-module/hooks/use-event/index.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["useRef","useInsertionEffect","useCallback","useEvent","callback","ref","Error","current","args"],"sources":["@wordpress/compose/src/hooks/use-event/index.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useInsertionEffect, useCallback } from '@wordpress/element';\n\n/**\n * Any function.\n */\nexport type AnyFunction = ( ...args: any ) => any;\n\n/**\n * Creates a stable callback function that has access to the latest state and\n * can be used within event handlers and effect callbacks. Throws when used in\n * the render phase.\n *\n * @param callback The callback function to wrap.\n *\n * @example\n *\n * ```tsx\n * function Component( props ) {\n *   const onClick = useEvent( props.onClick );\n *   useEffect( () => {\n *     onClick();\n *     // Won't trigger the effect again when props.onClick is updated.\n *   }, [ onClick ] );\n *   // Won't re-render Button when props.onClick is updated (if `Button` is\n *   // wrapped in `React.memo`).\n *   return <Button onClick={ onClick } />;\n * }\n * ```\n */\nexport default function useEvent< T extends AnyFunction >(\n\t/**\n\t * The callback function to wrap.\n\t */\n\tcallback?: T\n) {\n\tconst ref = useRef< AnyFunction | undefined >( () => {\n\t\tthrow new Error(\n\t\t\t'Callbacks created with `useEvent` cannot be called during rendering.'\n\t\t);\n\t} );\n\tuseInsertionEffect( () => {\n\t\tref.current = callback;\n\t} );\n\treturn useCallback< AnyFunction >(\n\t\t( ...args ) => ref.current?.( ...args ),\n\t\t[]\n\t) as T;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAM,EAAEC,kBAAkB,EAAEC,WAAW,QAAQ,oBAAoB;;AAE5E;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,QAAQA;AAC/B;AACD;AACA;AACCC,QAAY,EACX;EACD,MAAMC,GAAG,GAAGL,MAAM,CAA6B,MAAM;IACpD,MAAM,IAAIM,KAAK,CACd,sEACD,CAAC;EACF,CAAE,CAAC;EACHL,kBAAkB,CAAE,MAAM;IACzBI,GAAG,CAACE,OAAO,GAAGH,QAAQ;EACvB,CAAE,CAAC;EACH,OAAOF,WAAW,CACjB,CAAE,GAAGM,IAAI,KAAMH,GAAG,CAACE,OAAO,GAAI,GAAGC,IAAK,CAAC,EACvC,EACD,CAAC;AACF","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/use-event/index.ts"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useRef, useInsertionEffect, useCallback } from '@wordpress/element';\n\n/**\n * Any function.\n */\nexport type AnyFunction = ( ...args: any ) => any;\n\n/**\n * Creates a stable callback function that has access to the latest state and\n * can be used within event handlers and effect callbacks. Throws when used in\n * the render phase.\n *\n * @param callback The callback function to wrap.\n *\n * @example\n *\n * ```tsx\n * function Component( props ) {\n *   const onClick = useEvent( props.onClick );\n *   useEffect( () => {\n *     onClick();\n *     // Won't trigger the effect again when props.onClick is updated.\n *   }, [ onClick ] );\n *   // Won't re-render Button when props.onClick is updated (if `Button` is\n *   // wrapped in `React.memo`).\n *   return <Button onClick={ onClick } />;\n * }\n * ```\n */\nexport default function useEvent< T extends AnyFunction >(\n\t/**\n\t * The callback function to wrap.\n\t */\n\tcallback?: T\n) {\n\tconst ref = useRef< AnyFunction | undefined >( () => {\n\t\tthrow new Error(\n\t\t\t'Callbacks created with `useEvent` cannot be called during rendering.'\n\t\t);\n\t} );\n\tuseInsertionEffect( () => {\n\t\tref.current = callback;\n\t} );\n\treturn useCallback< AnyFunction >(\n\t\t( ...args ) => ref.current?.( ...args ),\n\t\t[]\n\t) as T;\n}\n"],
+  "mappings": "AAGA,SAAS,QAAQ,oBAAoB,mBAAmB;AA6BzC,SAAR,SAIN,UACC;AACD,QAAM,MAAM,OAAmC,MAAM;AACpD,UAAM,IAAI;AAAA,MACT;AAAA,IACD;AAAA,EACD,CAAE;AACF,qBAAoB,MAAM;AACzB,QAAI,UAAU;AAAA,EACf,CAAE;AACF,SAAO;AAAA,IACN,IAAK,SAAU,IAAI,UAAW,GAAG,IAAK;AAAA,IACtC,CAAC;AAAA,EACF;AACD;",
+  "names": []
+}

package/build-module/hooks/use-fixed-window-list/index.js

@@ -1,51 +1,16 @@
-/**
- * WordPress dependencies
- */
-import { useState, useLayoutEffect } from '@wordpress/element';
-import { getScrollContainer } from '@wordpress/dom';
-import { PAGEUP, PAGEDOWN, HOME, END } from '@wordpress/keycodes';
-
-/**
- * Internal dependencies
- */
-import { debounce } from '../../utils/debounce';
+import { useState, useLayoutEffect } from "@wordpress/element";
+import { getScrollContainer } from "@wordpress/dom";
+import { PAGEUP, PAGEDOWN, HOME, END } from "@wordpress/keycodes";
+import { debounce } from "../../utils/debounce";
 const DEFAULT_INIT_WINDOW_SIZE = 30;
-
-/**
- * @typedef {Object} WPFixedWindowList
- *
- * @property {number}                  visibleItems Items visible in the current viewport
- * @property {number}                  start        Start index of the window
- * @property {number}                  end          End index of the window
- * @property {(index:number)=>boolean} itemInView   Returns true if item is in the window
- */
-
-/**
- * @typedef {Object} WPFixedWindowListOptions
- *
- * @property {number}  [windowOverscan] Renders windowOverscan number of items before and after the calculated visible window.
- * @property {boolean} [useWindowing]   When false avoids calculating the window size
- * @property {number}  [initWindowSize] Initial window size to use on first render before we can calculate the window size.
- * @property {any}     [expandedState]  Used to recalculate the window size when the expanded state of a list changes.
- */
-
-/**
- *
- * @param {import('react').RefObject<HTMLElement>} elementRef Used to find the closest scroll container that contains element.
- * @param { number }                               itemHeight Fixed item height in pixels
- * @param { number }                               totalItems Total items in list
- * @param { WPFixedWindowListOptions }             [options]  Options object
- * @return {[ WPFixedWindowList, setFixedListWindow:(nextWindow:WPFixedWindowList)=>void]} Array with the fixed window list and setter
- */
-export default function useFixedWindowList(elementRef, itemHeight, totalItems, options) {
-  var _options$initWindowSi, _options$useWindowing;
-  const initWindowSize = (_options$initWindowSi = options?.initWindowSize) !== null && _options$initWindowSi !== void 0 ? _options$initWindowSi : DEFAULT_INIT_WINDOW_SIZE;
-  const useWindowing = (_options$useWindowing = options?.useWindowing) !== null && _options$useWindowing !== void 0 ? _options$useWindowing : true;
+function useFixedWindowList(elementRef, itemHeight, totalItems, options) {
+  const initWindowSize = options?.initWindowSize ?? DEFAULT_INIT_WINDOW_SIZE;
+  const useWindowing = options?.useWindowing ?? true;
   const [fixedListWindow, setFixedListWindow] = useState({
     visibleItems: initWindowSize,
     start: 0,
     end: initWindowSize,
-    itemInView: (/** @type {number} */index) => {
+    itemInView: (index) => {
       return index >= 0 && index <= initWindowSize;
     }
   });
@@ -54,23 +19,28 @@ export default function useFixedWindowList(elementRef, itemHeight, totalItems, o
       return;
     }
     const scrollContainer = getScrollContainer(elementRef.current);
-    const measureWindow = (/** @type {boolean | undefined} */initRender) => {
-      var _options$windowOversc;
+    const measureWindow = (initRender) => {
       if (!scrollContainer) {
         return;
       }
-      const visibleItems = Math.ceil(scrollContainer.clientHeight / itemHeight);
-      // Aim to keep opening list view fast, afterward we can optimize for scrolling.
-      const windowOverscan = initRender ? visibleItems : (_options$windowOversc = options?.windowOverscan) !== null && _options$windowOversc !== void 0 ? _options$windowOversc : visibleItems;
-      const firstViewableIndex = Math.floor(scrollContainer.scrollTop / itemHeight);
+      const visibleItems = Math.ceil(
+        scrollContainer.clientHeight / itemHeight
+      );
+      const windowOverscan = initRender ? visibleItems : options?.windowOverscan ?? visibleItems;
+      const firstViewableIndex = Math.floor(
+        scrollContainer.scrollTop / itemHeight
+      );
       const start = Math.max(0, firstViewableIndex - windowOverscan);
-      const end = Math.min(totalItems - 1, firstViewableIndex + visibleItems + windowOverscan);
-      setFixedListWindow(lastWindow => {
+      const end = Math.min(
+        totalItems - 1,
+        firstViewableIndex + visibleItems + windowOverscan
+      );
+      setFixedListWindow((lastWindow) => {
         const nextWindow = {
           visibleItems,
           start,
           end,
-          itemInView: (/** @type {number} */index) => {
+          itemInView: (index) => {
             return start <= index && index <= end;
           }
         };
@@ -84,52 +54,81 @@ export default function useFixedWindowList(elementRef, itemHeight, totalItems, o
     const debounceMeasureList = debounce(() => {
       measureWindow();
     }, 16);
-    scrollContainer?.addEventListener('scroll', debounceMeasureList);
-    scrollContainer?.ownerDocument?.defaultView?.addEventListener('resize', debounceMeasureList);
-    scrollContainer?.ownerDocument?.defaultView?.addEventListener('resize', debounceMeasureList);
+    scrollContainer?.addEventListener("scroll", debounceMeasureList);
+    scrollContainer?.ownerDocument?.defaultView?.addEventListener(
+      "resize",
+      debounceMeasureList
+    );
+    scrollContainer?.ownerDocument?.defaultView?.addEventListener(
+      "resize",
+      debounceMeasureList
+    );
     return () => {
-      scrollContainer?.removeEventListener('scroll', debounceMeasureList);
-      scrollContainer?.ownerDocument?.defaultView?.removeEventListener('resize', debounceMeasureList);
+      scrollContainer?.removeEventListener(
+        "scroll",
+        debounceMeasureList
+      );
+      scrollContainer?.ownerDocument?.defaultView?.removeEventListener(
+        "resize",
+        debounceMeasureList
+      );
     };
-  }, [itemHeight, elementRef, totalItems, options?.expandedState, options?.windowOverscan, useWindowing]);
+  }, [
+    itemHeight,
+    elementRef,
+    totalItems,
+    options?.expandedState,
+    options?.windowOverscan,
+    useWindowing
+  ]);
   useLayoutEffect(() => {
     if (!useWindowing) {
       return;
     }
     const scrollContainer = getScrollContainer(elementRef.current);
-    const handleKeyDown = (/** @type {KeyboardEvent} */event) => {
+    const handleKeyDown = (event) => {
       switch (event.keyCode) {
-        case HOME:
-          {
-            return scrollContainer?.scrollTo({
-              top: 0
-            });
-          }
-        case END:
-          {
-            return scrollContainer?.scrollTo({
-              top: totalItems * itemHeight
-            });
-          }
-        case PAGEUP:
-          {
-            return scrollContainer?.scrollTo({
-              top: scrollContainer.scrollTop - fixedListWindow.visibleItems * itemHeight
-            });
-          }
-        case PAGEDOWN:
-          {
-            return scrollContainer?.scrollTo({
-              top: scrollContainer.scrollTop + fixedListWindow.visibleItems * itemHeight
-            });
-          }
+        case HOME: {
+          return scrollContainer?.scrollTo({ top: 0 });
+        }
+        case END: {
+          return scrollContainer?.scrollTo({
+            top: totalItems * itemHeight
+          });
+        }
+        case PAGEUP: {
+          return scrollContainer?.scrollTo({
+            top: scrollContainer.scrollTop - fixedListWindow.visibleItems * itemHeight
+          });
+        }
+        case PAGEDOWN: {
+          return scrollContainer?.scrollTo({
+            top: scrollContainer.scrollTop + fixedListWindow.visibleItems * itemHeight
+          });
+        }
       }
     };
-    scrollContainer?.ownerDocument?.defaultView?.addEventListener('keydown', handleKeyDown);
+    scrollContainer?.ownerDocument?.defaultView?.addEventListener(
+      "keydown",
+      handleKeyDown
+    );
     return () => {
-      scrollContainer?.ownerDocument?.defaultView?.removeEventListener('keydown', handleKeyDown);
+      scrollContainer?.ownerDocument?.defaultView?.removeEventListener(
+        "keydown",
+        handleKeyDown
+      );
     };
-  }, [totalItems, itemHeight, elementRef, fixedListWindow.visibleItems, useWindowing, options?.expandedState]);
+  }, [
+    totalItems,
+    itemHeight,
+    elementRef,
+    fixedListWindow.visibleItems,
+    useWindowing,
+    options?.expandedState
+  ]);
   return [fixedListWindow, setFixedListWindow];
 }
-//# sourceMappingURL=index.js.map
+export {
+  useFixedWindowList as default
+};
+//# sourceMappingURL=index.js.map