@wordpress/compose 6.15.0 → 6.17.0

package/build-module/hooks/use-focus-outside/index.js

@@ -6,12 +6,13 @@
  * WordPress dependencies
  */
 import { useCallback, useEffect, useRef } from '@wordpress/element';
+
 /**
  * Input types which are classified as button types, for use in considering
  * whether element is a (focus-normalized) button.
  */
-
 const INPUT_BUTTON_TYPES = ['button', 'submit'];
+
 /**
  * List of HTML button elements subject to focus normalization
  *
@@ -32,19 +33,15 @@ function isFocusNormalizedButton(eventTarget) {
   if (!(eventTarget instanceof window.HTMLElement)) {
     return false;
   }
-
   switch (eventTarget.nodeName) {
     case 'A':
     case 'BUTTON':
       return true;
-
     case 'INPUT':
       return INPUT_BUTTON_TYPES.includes(eventTarget.type);
   }
-
   return false;
 }
-
 /**
  * A react hook that can be used to check whether focus has moved outside the
  * element the event handlers are bound to.
@@ -62,23 +59,26 @@ export default function useFocusOutside(onFocusOutside) {
   }, [onFocusOutside]);
   const preventBlurCheck = useRef(false);
   const blurCheckTimeoutId = useRef();
+
   /**
    * Cancel a blur check timeout.
    */
-
   const cancelBlurCheck = useCallback(() => {
     clearTimeout(blurCheckTimeoutId.current);
-  }, []); // Cancel blur checks on unmount.
+  }, []);
 
+  // Cancel blur checks on unmount.
   useEffect(() => {
     return () => cancelBlurCheck();
-  }, []); // Cancel a blur check if the callback or ref is no longer provided.
+  }, []);
 
+  // Cancel a blur check if the callback or ref is no longer provided.
   useEffect(() => {
     if (!onFocusOutside) {
       cancelBlurCheck();
     }
   }, [onFocusOutside, cancelBlurCheck]);
+
   /**
    * Handles a mousedown or mouseup event to respectively assign and
    * unassign a flag for preventing blur check on button elements. Some
@@ -89,20 +89,19 @@ export default function useFocusOutside(onFocusOutside) {
    * @param event
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
    */
-
   const normalizeButtonFocus = useCallback(event => {
     const {
       type,
       target
     } = event;
     const isInteractionEnd = ['mouseup', 'touchend'].includes(type);
-
     if (isInteractionEnd) {
       preventBlurCheck.current = false;
     } else if (isFocusNormalizedButton(target)) {
       preventBlurCheck.current = true;
     }
   }, []);
+
   /**
    * A callback triggered when a blur event occurs on the element the handler
    * is bound to.
@@ -110,29 +109,27 @@ export default function useFocusOutside(onFocusOutside) {
    * Calls the `onFocusOutside` callback in an immediate timeout if focus has
    * move outside the bound element and is still within the document.
    */
-
   const queueBlurCheck = useCallback(event => {
     // React does not allow using an event reference asynchronously
     // due to recycling behavior, except when explicitly persisted.
-    event.persist(); // Skip blur check if clicking button. See `normalizeButtonFocus`.
+    event.persist();
 
+    // Skip blur check if clicking button. See `normalizeButtonFocus`.
     if (preventBlurCheck.current) {
       return;
-    } // The usage of this attribute should be avoided. The only use case
+    }
+
+    // The usage of this attribute should be avoided. The only use case
     // would be when we load modals that are not React components and
     // therefore don't exist in the React tree. An example is opening
     // the Media Library modal from another dialog.
     // This attribute should contain a selector of the related target
     // we want to ignore, because we still need to trigger the blur event
     // on all other cases.
-
-
     const ignoreForRelatedTarget = event.target.getAttribute('data-unstable-ignore-focus-outside-for-relatedtarget');
-
     if (ignoreForRelatedTarget && event.relatedTarget?.closest(ignoreForRelatedTarget)) {
       return;
     }
-
     blurCheckTimeoutId.current = setTimeout(() => {
       // If document is not focused then focus should remain
       // inside the wrapped component and therefore we cancel
@@ -142,7 +139,6 @@ export default function useFocusOutside(onFocusOutside) {
         event.preventDefault();
         return;
       }
-
       if ('function' === typeof currentOnFocusOutside.current) {
         currentOnFocusOutside.current(event);
       }

package/build-module/hooks/use-focus-outside/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-outside/index.ts"],"names":["useCallback","useEffect","useRef","INPUT_BUTTON_TYPES","isFocusNormalizedButton","eventTarget","window","HTMLElement","nodeName","includes","type","useFocusOutside","onFocusOutside","currentOnFocusOutside","current","preventBlurCheck","blurCheckTimeoutId","cancelBlurCheck","clearTimeout","normalizeButtonFocus","event","target","isInteractionEnd","queueBlurCheck","persist","ignoreForRelatedTarget","getAttribute","relatedTarget","closest","setTimeout","document","hasFocus","preventDefault","onFocus","onMouseDown","onMouseUp","onTouchStart","onTouchEnd","onBlur"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tFocusEventHandler,\n\tEventHandler,\n\tMouseEventHandler,\n\tTouchEventHandler,\n\tFocusEvent,\n\tMouseEvent,\n\tTouchEvent,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useEffect, useRef } from '@wordpress/element';\n\n/**\n * Input types which are classified as button types, for use in considering\n * whether element is a (focus-normalized) button.\n */\nconst INPUT_BUTTON_TYPES = [ 'button', 'submit' ];\n\n/**\n * List of HTML button elements subject to focus normalization\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n */\ntype FocusNormalizedButton =\n\t| HTMLButtonElement\n\t| HTMLLinkElement\n\t| HTMLInputElement;\n\n/**\n * Returns true if the given element is a button element subject to focus\n * normalization, or false otherwise.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n *\n * @param eventTarget The target from a mouse or touch event.\n *\n * @return Whether the element is a button element subject to focus normalization.\n */\nfunction isFocusNormalizedButton(\n\teventTarget: EventTarget\n): eventTarget is FocusNormalizedButton {\n\tif ( ! ( eventTarget instanceof window.HTMLElement ) ) {\n\t\treturn false;\n\t}\n\tswitch ( eventTarget.nodeName ) {\n\t\tcase 'A':\n\t\tcase 'BUTTON':\n\t\t\treturn true;\n\n\t\tcase 'INPUT':\n\t\t\treturn INPUT_BUTTON_TYPES.includes(\n\t\t\t\t( eventTarget as HTMLInputElement ).type\n\t\t\t);\n\t}\n\n\treturn false;\n}\n\ntype UseFocusOutsideReturn = {\n\tonFocus: FocusEventHandler;\n\tonMouseDown: MouseEventHandler;\n\tonMouseUp: MouseEventHandler;\n\tonTouchStart: TouchEventHandler;\n\tonTouchEnd: TouchEventHandler;\n\tonBlur: FocusEventHandler;\n};\n\n/**\n * A react hook that can be used to check whether focus has moved outside the\n * element the event handlers are bound to.\n *\n * @param onFocusOutside A callback triggered when focus moves outside\n *                       the element the event handlers are bound to.\n *\n * @return An object containing event handlers. Bind the event handlers to a\n * wrapping element element to capture when focus moves outside that element.\n */\nexport default function useFocusOutside(\n\tonFocusOutside: ( event: FocusEvent ) => void\n): UseFocusOutsideReturn {\n\tconst currentOnFocusOutside = useRef( onFocusOutside );\n\tuseEffect( () => {\n\t\tcurrentOnFocusOutside.current = onFocusOutside;\n\t}, [ onFocusOutside ] );\n\n\tconst preventBlurCheck = useRef( false );\n\n\tconst blurCheckTimeoutId = useRef< number | undefined >();\n\n\t/**\n\t * Cancel a blur check timeout.\n\t */\n\tconst cancelBlurCheck = useCallback( () => {\n\t\tclearTimeout( blurCheckTimeoutId.current );\n\t}, [] );\n\n\t// Cancel blur checks on unmount.\n\tuseEffect( () => {\n\t\treturn () => cancelBlurCheck();\n\t}, [] );\n\n\t// Cancel a blur check if the callback or ref is no longer provided.\n\tuseEffect( () => {\n\t\tif ( ! onFocusOutside ) {\n\t\t\tcancelBlurCheck();\n\t\t}\n\t}, [ onFocusOutside, cancelBlurCheck ] );\n\n\t/**\n\t * Handles a mousedown or mouseup event to respectively assign and\n\t * unassign a flag for preventing blur check on button elements. Some\n\t * browsers, namely Firefox and Safari, do not emit a focus event on\n\t * button elements when clicked, while others do. The logic here\n\t * intends to normalize this as treating click on buttons as focus.\n\t *\n\t * @param event\n\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n\t */\n\tconst normalizeButtonFocus: EventHandler< MouseEvent | TouchEvent > =\n\t\tuseCallback( ( event ) => {\n\t\t\tconst { type, target } = event;\n\t\t\tconst isInteractionEnd = [ 'mouseup', 'touchend' ].includes( type );\n\n\t\t\tif ( isInteractionEnd ) {\n\t\t\t\tpreventBlurCheck.current = false;\n\t\t\t} else if ( isFocusNormalizedButton( target ) ) {\n\t\t\t\tpreventBlurCheck.current = true;\n\t\t\t}\n\t\t}, [] );\n\n\t/**\n\t * A callback triggered when a blur event occurs on the element the handler\n\t * is bound to.\n\t *\n\t * Calls the `onFocusOutside` callback in an immediate timeout if focus has\n\t * move outside the bound element and is still within the document.\n\t */\n\tconst queueBlurCheck: FocusEventHandler = useCallback( ( event ) => {\n\t\t// React does not allow using an event reference asynchronously\n\t\t// due to recycling behavior, except when explicitly persisted.\n\t\tevent.persist();\n\n\t\t// Skip blur check if clicking button. See `normalizeButtonFocus`.\n\t\tif ( preventBlurCheck.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// The usage of this attribute should be avoided. The only use case\n\t\t// would be when we load modals that are not React components and\n\t\t// therefore don't exist in the React tree. An example is opening\n\t\t// the Media Library modal from another dialog.\n\t\t// This attribute should contain a selector of the related target\n\t\t// we want to ignore, because we still need to trigger the blur event\n\t\t// on all other cases.\n\t\tconst ignoreForRelatedTarget = event.target.getAttribute(\n\t\t\t'data-unstable-ignore-focus-outside-for-relatedtarget'\n\t\t);\n\t\tif (\n\t\t\tignoreForRelatedTarget &&\n\t\t\tevent.relatedTarget?.closest( ignoreForRelatedTarget )\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tblurCheckTimeoutId.current = setTimeout( () => {\n\t\t\t// If document is not focused then focus should remain\n\t\t\t// inside the wrapped component and therefore we cancel\n\t\t\t// this blur event thereby leaving focus in place.\n\t\t\t// https://developer.mozilla.org/en-US/docs/Web/API/Document/hasFocus.\n\t\t\tif ( ! document.hasFocus() ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( 'function' === typeof currentOnFocusOutside.current ) {\n\t\t\t\tcurrentOnFocusOutside.current( event );\n\t\t\t}\n\t\t}, 0 );\n\t}, [] );\n\n\treturn {\n\t\tonFocus: cancelBlurCheck,\n\t\tonMouseDown: normalizeButtonFocus,\n\t\tonMouseUp: normalizeButtonFocus,\n\t\tonTouchStart: normalizeButtonFocus,\n\t\tonTouchEnd: normalizeButtonFocus,\n\t\tonBlur: queueBlurCheck,\n\t};\n}\n"]}
+{"version":3,"names":["useCallback","useEffect","useRef","INPUT_BUTTON_TYPES","isFocusNormalizedButton","eventTarget","window","HTMLElement","nodeName","includes","type","useFocusOutside","onFocusOutside","currentOnFocusOutside","current","preventBlurCheck","blurCheckTimeoutId","cancelBlurCheck","clearTimeout","normalizeButtonFocus","event","target","isInteractionEnd","queueBlurCheck","persist","ignoreForRelatedTarget","getAttribute","relatedTarget","closest","setTimeout","document","hasFocus","preventDefault","onFocus","onMouseDown","onMouseUp","onTouchStart","onTouchEnd","onBlur"],"sources":["@wordpress/compose/src/hooks/use-focus-outside/index.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tFocusEventHandler,\n\tEventHandler,\n\tMouseEventHandler,\n\tTouchEventHandler,\n\tFocusEvent,\n\tMouseEvent,\n\tTouchEvent,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useEffect, useRef } from '@wordpress/element';\n\n/**\n * Input types which are classified as button types, for use in considering\n * whether element is a (focus-normalized) button.\n */\nconst INPUT_BUTTON_TYPES = [ 'button', 'submit' ];\n\n/**\n * List of HTML button elements subject to focus normalization\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n */\ntype FocusNormalizedButton =\n\t| HTMLButtonElement\n\t| HTMLLinkElement\n\t| HTMLInputElement;\n\n/**\n * Returns true if the given element is a button element subject to focus\n * normalization, or false otherwise.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n *\n * @param eventTarget The target from a mouse or touch event.\n *\n * @return Whether the element is a button element subject to focus normalization.\n */\nfunction isFocusNormalizedButton(\n\teventTarget: EventTarget\n): eventTarget is FocusNormalizedButton {\n\tif ( ! ( eventTarget instanceof window.HTMLElement ) ) {\n\t\treturn false;\n\t}\n\tswitch ( eventTarget.nodeName ) {\n\t\tcase 'A':\n\t\tcase 'BUTTON':\n\t\t\treturn true;\n\n\t\tcase 'INPUT':\n\t\t\treturn INPUT_BUTTON_TYPES.includes(\n\t\t\t\t( eventTarget as HTMLInputElement ).type\n\t\t\t);\n\t}\n\n\treturn false;\n}\n\ntype UseFocusOutsideReturn = {\n\tonFocus: FocusEventHandler;\n\tonMouseDown: MouseEventHandler;\n\tonMouseUp: MouseEventHandler;\n\tonTouchStart: TouchEventHandler;\n\tonTouchEnd: TouchEventHandler;\n\tonBlur: FocusEventHandler;\n};\n\n/**\n * A react hook that can be used to check whether focus has moved outside the\n * element the event handlers are bound to.\n *\n * @param onFocusOutside A callback triggered when focus moves outside\n *                       the element the event handlers are bound to.\n *\n * @return An object containing event handlers. Bind the event handlers to a\n * wrapping element element to capture when focus moves outside that element.\n */\nexport default function useFocusOutside(\n\tonFocusOutside: ( event: FocusEvent ) => void\n): UseFocusOutsideReturn {\n\tconst currentOnFocusOutside = useRef( onFocusOutside );\n\tuseEffect( () => {\n\t\tcurrentOnFocusOutside.current = onFocusOutside;\n\t}, [ onFocusOutside ] );\n\n\tconst preventBlurCheck = useRef( false );\n\n\tconst blurCheckTimeoutId = useRef< number | undefined >();\n\n\t/**\n\t * Cancel a blur check timeout.\n\t */\n\tconst cancelBlurCheck = useCallback( () => {\n\t\tclearTimeout( blurCheckTimeoutId.current );\n\t}, [] );\n\n\t// Cancel blur checks on unmount.\n\tuseEffect( () => {\n\t\treturn () => cancelBlurCheck();\n\t}, [] );\n\n\t// Cancel a blur check if the callback or ref is no longer provided.\n\tuseEffect( () => {\n\t\tif ( ! onFocusOutside ) {\n\t\t\tcancelBlurCheck();\n\t\t}\n\t}, [ onFocusOutside, cancelBlurCheck ] );\n\n\t/**\n\t * Handles a mousedown or mouseup event to respectively assign and\n\t * unassign a flag for preventing blur check on button elements. Some\n\t * browsers, namely Firefox and Safari, do not emit a focus event on\n\t * button elements when clicked, while others do. The logic here\n\t * intends to normalize this as treating click on buttons as focus.\n\t *\n\t * @param event\n\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n\t */\n\tconst normalizeButtonFocus: EventHandler< MouseEvent | TouchEvent > =\n\t\tuseCallback( ( event ) => {\n\t\t\tconst { type, target } = event;\n\t\t\tconst isInteractionEnd = [ 'mouseup', 'touchend' ].includes( type );\n\n\t\t\tif ( isInteractionEnd ) {\n\t\t\t\tpreventBlurCheck.current = false;\n\t\t\t} else if ( isFocusNormalizedButton( target ) ) {\n\t\t\t\tpreventBlurCheck.current = true;\n\t\t\t}\n\t\t}, [] );\n\n\t/**\n\t * A callback triggered when a blur event occurs on the element the handler\n\t * is bound to.\n\t *\n\t * Calls the `onFocusOutside` callback in an immediate timeout if focus has\n\t * move outside the bound element and is still within the document.\n\t */\n\tconst queueBlurCheck: FocusEventHandler = useCallback( ( event ) => {\n\t\t// React does not allow using an event reference asynchronously\n\t\t// due to recycling behavior, except when explicitly persisted.\n\t\tevent.persist();\n\n\t\t// Skip blur check if clicking button. See `normalizeButtonFocus`.\n\t\tif ( preventBlurCheck.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// The usage of this attribute should be avoided. The only use case\n\t\t// would be when we load modals that are not React components and\n\t\t// therefore don't exist in the React tree. An example is opening\n\t\t// the Media Library modal from another dialog.\n\t\t// This attribute should contain a selector of the related target\n\t\t// we want to ignore, because we still need to trigger the blur event\n\t\t// on all other cases.\n\t\tconst ignoreForRelatedTarget = event.target.getAttribute(\n\t\t\t'data-unstable-ignore-focus-outside-for-relatedtarget'\n\t\t);\n\t\tif (\n\t\t\tignoreForRelatedTarget &&\n\t\t\tevent.relatedTarget?.closest( ignoreForRelatedTarget )\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tblurCheckTimeoutId.current = setTimeout( () => {\n\t\t\t// If document is not focused then focus should remain\n\t\t\t// inside the wrapped component and therefore we cancel\n\t\t\t// this blur event thereby leaving focus in place.\n\t\t\t// https://developer.mozilla.org/en-US/docs/Web/API/Document/hasFocus.\n\t\t\tif ( ! document.hasFocus() ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( 'function' === typeof currentOnFocusOutside.current ) {\n\t\t\t\tcurrentOnFocusOutside.current( event );\n\t\t\t}\n\t\t}, 0 );\n\t}, [] );\n\n\treturn {\n\t\tonFocus: cancelBlurCheck,\n\t\tonMouseDown: normalizeButtonFocus,\n\t\tonMouseUp: normalizeButtonFocus,\n\t\tonTouchStart: normalizeButtonFocus,\n\t\tonTouchEnd: normalizeButtonFocus,\n\t\tonBlur: queueBlurCheck,\n\t};\n}\n"],"mappings":"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"}

package/build-module/hooks/use-focus-outside/index.native.js

@@ -2,21 +2,21 @@
  * WordPress dependencies
  */
 import { useCallback, useEffect, useRef } from '@wordpress/element';
+
 /**
  * Input types which are classified as button types, for use in considering
  * whether element is a (focus-normalized) button.
  *
  * @type {string[]}
  */
-
 const INPUT_BUTTON_TYPES = ['button', 'submit'];
+
 /**
  * @typedef {HTMLButtonElement | HTMLLinkElement | HTMLInputElement} FocusNormalizedButton
  */
-// Disable reason: Rule doesn't support predicate return types.
 
+// Disable reason: Rule doesn't support predicate return types.
 /* eslint-disable jsdoc/valid-types */
-
 /**
  * Returns true if the given element is a button element subject to focus
  * normalization, or false otherwise.
@@ -27,19 +27,14 @@ const INPUT_BUTTON_TYPES = ['button', 'submit'];
  *
  * @return {eventTarget is FocusNormalizedButton} Whether element is a button.
  */
-
 function isFocusNormalizedButton(eventTarget) {
   switch (eventTarget.nodeName) {
     case 'A':
     case 'BUTTON':
       return true;
-
     case 'INPUT':
-      return INPUT_BUTTON_TYPES.includes(
-      /** @type {HTMLInputElement} */
-      eventTarget.type);
+      return INPUT_BUTTON_TYPES.includes( /** @type {HTMLInputElement} */eventTarget.type);
   }
-
   return false;
 }
 /* eslint-enable jsdoc/valid-types */
@@ -83,36 +78,37 @@ function isFocusNormalizedButton(eventTarget) {
  *                                   to a wrapping element element to capture when focus moves
  *                                   outside that element.
  */
-
-
 export default function useFocusOutside(onFocusOutside) {
   const currentOnFocusOutside = useRef(onFocusOutside);
   useEffect(() => {
     currentOnFocusOutside.current = onFocusOutside;
   }, [onFocusOutside]);
   const preventBlurCheck = useRef(false);
+
   /**
    * @type {import('react').MutableRefObject<number | undefined>}
    */
-
   const blurCheckTimeoutId = useRef();
+
   /**
    * Cancel a blur check timeout.
    */
-
   const cancelBlurCheck = useCallback(() => {
     clearTimeout(blurCheckTimeoutId.current);
-  }, []); // Cancel blur checks on unmount.
+  }, []);
 
+  // Cancel blur checks on unmount.
   useEffect(() => {
     return () => cancelBlurCheck();
-  }, []); // Cancel a blur check if the callback or ref is no longer provided.
+  }, []);
 
+  // Cancel a blur check if the callback or ref is no longer provided.
   useEffect(() => {
     if (!onFocusOutside) {
       cancelBlurCheck();
     }
   }, [onFocusOutside, cancelBlurCheck]);
+
   /**
    * Handles a mousedown or mouseup event to respectively assign and
    * unassign a flag for preventing blur check on button elements. Some
@@ -124,20 +120,19 @@ export default function useFocusOutside(onFocusOutside) {
    *
    * @param {SyntheticEvent} event Event for mousedown or mouseup.
    */
-
   const normalizeButtonFocus = useCallback(event => {
     const {
       type,
       target
     } = event;
     const isInteractionEnd = ['mouseup', 'touchend'].includes(type);
-
     if (isInteractionEnd) {
       preventBlurCheck.current = false;
     } else if (isFocusNormalizedButton(target)) {
       preventBlurCheck.current = true;
     }
   }, []);
+
   /**
    * A callback triggered when a blur event occurs on the element the handler
    * is bound to.
@@ -147,16 +142,15 @@ export default function useFocusOutside(onFocusOutside) {
    *
    * @param {SyntheticEvent} event Blur event.
    */
-
   const queueBlurCheck = useCallback(event => {
     // React does not allow using an event reference asynchronously
     // due to recycling behavior, except when explicitly persisted.
-    event.persist(); // Skip blur check if clicking button. See `normalizeButtonFocus`.
+    event.persist();
 
+    // Skip blur check if clicking button. See `normalizeButtonFocus`.
     if (preventBlurCheck.current) {
       return;
     }
-
     blurCheckTimeoutId.current = setTimeout(() => {
       if ('function' === typeof currentOnFocusOutside.current) {
         currentOnFocusOutside.current(event);

package/build-module/hooks/use-focus-outside/index.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-outside/index.native.js"],"names":["useCallback","useEffect","useRef","INPUT_BUTTON_TYPES","isFocusNormalizedButton","eventTarget","nodeName","includes","type","useFocusOutside","onFocusOutside","currentOnFocusOutside","current","preventBlurCheck","blurCheckTimeoutId","cancelBlurCheck","clearTimeout","normalizeButtonFocus","event","target","isInteractionEnd","queueBlurCheck","persist","setTimeout","onFocus","onMouseDown","onMouseUp","onTouchStart","onTouchEnd","onBlur"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback, useEffect, useRef } from '@wordpress/element';\n\n/**\n * Input types which are classified as button types, for use in considering\n * whether element is a (focus-normalized) button.\n *\n * @type {string[]}\n */\nconst INPUT_BUTTON_TYPES = [ 'button', 'submit' ];\n\n/**\n * @typedef {HTMLButtonElement | HTMLLinkElement | HTMLInputElement} FocusNormalizedButton\n */\n\n// Disable reason: Rule doesn't support predicate return types.\n/* eslint-disable jsdoc/valid-types */\n/**\n * Returns true if the given element is a button element subject to focus\n * normalization, or false otherwise.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n *\n * @param {EventTarget} eventTarget The target from a mouse or touch event.\n *\n * @return {eventTarget is FocusNormalizedButton} Whether element is a button.\n */\nfunction isFocusNormalizedButton( eventTarget ) {\n\tswitch ( eventTarget.nodeName ) {\n\t\tcase 'A':\n\t\tcase 'BUTTON':\n\t\t\treturn true;\n\n\t\tcase 'INPUT':\n\t\t\treturn INPUT_BUTTON_TYPES.includes(\n\t\t\t\t/** @type {HTMLInputElement} */ ( eventTarget ).type\n\t\t\t);\n\t}\n\n\treturn false;\n}\n/* eslint-enable jsdoc/valid-types */\n\n/**\n * @typedef {import('react').SyntheticEvent} SyntheticEvent\n */\n\n/**\n * @callback EventCallback\n * @param {SyntheticEvent} event input related event.\n */\n\n/**\n * @typedef FocusOutsideReactElement\n * @property {EventCallback} handleFocusOutside callback for a focus outside event.\n */\n\n/**\n * @typedef {import('react').MutableRefObject<FocusOutsideReactElement | undefined>} FocusOutsideRef\n */\n\n/**\n * @typedef {Object} FocusOutsideReturnValue\n * @property {EventCallback} onFocus      An event handler for focus events.\n * @property {EventCallback} onBlur       An event handler for blur events.\n * @property {EventCallback} onMouseDown  An event handler for mouse down events.\n * @property {EventCallback} onMouseUp    An event handler for mouse up events.\n * @property {EventCallback} onTouchStart An event handler for touch start events.\n * @property {EventCallback} onTouchEnd   An event handler for touch end events.\n */\n\n/**\n * A react hook that can be used to check whether focus has moved outside the\n * element the event handlers are bound to.\n *\n * @param {EventCallback} onFocusOutside A callback triggered when focus moves outside\n *                                       the element the event handlers are bound to.\n *\n * @return {FocusOutsideReturnValue} An object containing event handlers. Bind the event handlers\n *                                   to a wrapping element element to capture when focus moves\n *                                   outside that element.\n */\nexport default function useFocusOutside( onFocusOutside ) {\n\tconst currentOnFocusOutside = useRef( onFocusOutside );\n\tuseEffect( () => {\n\t\tcurrentOnFocusOutside.current = onFocusOutside;\n\t}, [ onFocusOutside ] );\n\n\tconst preventBlurCheck = useRef( false );\n\n\t/**\n\t * @type {import('react').MutableRefObject<number | undefined>}\n\t */\n\tconst blurCheckTimeoutId = useRef();\n\n\t/**\n\t * Cancel a blur check timeout.\n\t */\n\tconst cancelBlurCheck = useCallback( () => {\n\t\tclearTimeout( blurCheckTimeoutId.current );\n\t}, [] );\n\n\t// Cancel blur checks on unmount.\n\tuseEffect( () => {\n\t\treturn () => cancelBlurCheck();\n\t}, [] );\n\n\t// Cancel a blur check if the callback or ref is no longer provided.\n\tuseEffect( () => {\n\t\tif ( ! onFocusOutside ) {\n\t\t\tcancelBlurCheck();\n\t\t}\n\t}, [ onFocusOutside, cancelBlurCheck ] );\n\n\t/**\n\t * Handles a mousedown or mouseup event to respectively assign and\n\t * unassign a flag for preventing blur check on button elements. Some\n\t * browsers, namely Firefox and Safari, do not emit a focus event on\n\t * button elements when clicked, while others do. The logic here\n\t * intends to normalize this as treating click on buttons as focus.\n\t *\n\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n\t *\n\t * @param {SyntheticEvent} event Event for mousedown or mouseup.\n\t */\n\tconst normalizeButtonFocus = useCallback( ( event ) => {\n\t\tconst { type, target } = event;\n\t\tconst isInteractionEnd = [ 'mouseup', 'touchend' ].includes( type );\n\n\t\tif ( isInteractionEnd ) {\n\t\t\tpreventBlurCheck.current = false;\n\t\t} else if ( isFocusNormalizedButton( target ) ) {\n\t\t\tpreventBlurCheck.current = true;\n\t\t}\n\t}, [] );\n\n\t/**\n\t * A callback triggered when a blur event occurs on the element the handler\n\t * is bound to.\n\t *\n\t * Calls the `onFocusOutside` callback in an immediate timeout if focus has\n\t * move outside the bound element and is still within the document.\n\t *\n\t * @param {SyntheticEvent} event Blur event.\n\t */\n\tconst queueBlurCheck = useCallback( ( event ) => {\n\t\t// React does not allow using an event reference asynchronously\n\t\t// due to recycling behavior, except when explicitly persisted.\n\t\tevent.persist();\n\n\t\t// Skip blur check if clicking button. See `normalizeButtonFocus`.\n\t\tif ( preventBlurCheck.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tblurCheckTimeoutId.current = setTimeout( () => {\n\t\t\tif ( 'function' === typeof currentOnFocusOutside.current ) {\n\t\t\t\tcurrentOnFocusOutside.current( event );\n\t\t\t}\n\t\t}, 0 );\n\t}, [] );\n\n\treturn {\n\t\tonFocus: cancelBlurCheck,\n\t\tonMouseDown: normalizeButtonFocus,\n\t\tonMouseUp: normalizeButtonFocus,\n\t\tonTouchStart: normalizeButtonFocus,\n\t\tonTouchEnd: normalizeButtonFocus,\n\t\tonBlur: queueBlurCheck,\n\t};\n}\n"]}
+{"version":3,"names":["useCallback","useEffect","useRef","INPUT_BUTTON_TYPES","isFocusNormalizedButton","eventTarget","nodeName","includes","type","useFocusOutside","onFocusOutside","currentOnFocusOutside","current","preventBlurCheck","blurCheckTimeoutId","cancelBlurCheck","clearTimeout","normalizeButtonFocus","event","target","isInteractionEnd","queueBlurCheck","persist","setTimeout","onFocus","onMouseDown","onMouseUp","onTouchStart","onTouchEnd","onBlur"],"sources":["@wordpress/compose/src/hooks/use-focus-outside/index.native.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback, useEffect, useRef } from '@wordpress/element';\n\n/**\n * Input types which are classified as button types, for use in considering\n * whether element is a (focus-normalized) button.\n *\n * @type {string[]}\n */\nconst INPUT_BUTTON_TYPES = [ 'button', 'submit' ];\n\n/**\n * @typedef {HTMLButtonElement | HTMLLinkElement | HTMLInputElement} FocusNormalizedButton\n */\n\n// Disable reason: Rule doesn't support predicate return types.\n/* eslint-disable jsdoc/valid-types */\n/**\n * Returns true if the given element is a button element subject to focus\n * normalization, or false otherwise.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n *\n * @param {EventTarget} eventTarget The target from a mouse or touch event.\n *\n * @return {eventTarget is FocusNormalizedButton} Whether element is a button.\n */\nfunction isFocusNormalizedButton( eventTarget ) {\n\tswitch ( eventTarget.nodeName ) {\n\t\tcase 'A':\n\t\tcase 'BUTTON':\n\t\t\treturn true;\n\n\t\tcase 'INPUT':\n\t\t\treturn INPUT_BUTTON_TYPES.includes(\n\t\t\t\t/** @type {HTMLInputElement} */ ( eventTarget ).type\n\t\t\t);\n\t}\n\n\treturn false;\n}\n/* eslint-enable jsdoc/valid-types */\n\n/**\n * @typedef {import('react').SyntheticEvent} SyntheticEvent\n */\n\n/**\n * @callback EventCallback\n * @param {SyntheticEvent} event input related event.\n */\n\n/**\n * @typedef FocusOutsideReactElement\n * @property {EventCallback} handleFocusOutside callback for a focus outside event.\n */\n\n/**\n * @typedef {import('react').MutableRefObject<FocusOutsideReactElement | undefined>} FocusOutsideRef\n */\n\n/**\n * @typedef {Object} FocusOutsideReturnValue\n * @property {EventCallback} onFocus      An event handler for focus events.\n * @property {EventCallback} onBlur       An event handler for blur events.\n * @property {EventCallback} onMouseDown  An event handler for mouse down events.\n * @property {EventCallback} onMouseUp    An event handler for mouse up events.\n * @property {EventCallback} onTouchStart An event handler for touch start events.\n * @property {EventCallback} onTouchEnd   An event handler for touch end events.\n */\n\n/**\n * A react hook that can be used to check whether focus has moved outside the\n * element the event handlers are bound to.\n *\n * @param {EventCallback} onFocusOutside A callback triggered when focus moves outside\n *                                       the element the event handlers are bound to.\n *\n * @return {FocusOutsideReturnValue} An object containing event handlers. Bind the event handlers\n *                                   to a wrapping element element to capture when focus moves\n *                                   outside that element.\n */\nexport default function useFocusOutside( onFocusOutside ) {\n\tconst currentOnFocusOutside = useRef( onFocusOutside );\n\tuseEffect( () => {\n\t\tcurrentOnFocusOutside.current = onFocusOutside;\n\t}, [ onFocusOutside ] );\n\n\tconst preventBlurCheck = useRef( false );\n\n\t/**\n\t * @type {import('react').MutableRefObject<number | undefined>}\n\t */\n\tconst blurCheckTimeoutId = useRef();\n\n\t/**\n\t * Cancel a blur check timeout.\n\t */\n\tconst cancelBlurCheck = useCallback( () => {\n\t\tclearTimeout( blurCheckTimeoutId.current );\n\t}, [] );\n\n\t// Cancel blur checks on unmount.\n\tuseEffect( () => {\n\t\treturn () => cancelBlurCheck();\n\t}, [] );\n\n\t// Cancel a blur check if the callback or ref is no longer provided.\n\tuseEffect( () => {\n\t\tif ( ! onFocusOutside ) {\n\t\t\tcancelBlurCheck();\n\t\t}\n\t}, [ onFocusOutside, cancelBlurCheck ] );\n\n\t/**\n\t * Handles a mousedown or mouseup event to respectively assign and\n\t * unassign a flag for preventing blur check on button elements. Some\n\t * browsers, namely Firefox and Safari, do not emit a focus event on\n\t * button elements when clicked, while others do. The logic here\n\t * intends to normalize this as treating click on buttons as focus.\n\t *\n\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n\t *\n\t * @param {SyntheticEvent} event Event for mousedown or mouseup.\n\t */\n\tconst normalizeButtonFocus = useCallback( ( event ) => {\n\t\tconst { type, target } = event;\n\t\tconst isInteractionEnd = [ 'mouseup', 'touchend' ].includes( type );\n\n\t\tif ( isInteractionEnd ) {\n\t\t\tpreventBlurCheck.current = false;\n\t\t} else if ( isFocusNormalizedButton( target ) ) {\n\t\t\tpreventBlurCheck.current = true;\n\t\t}\n\t}, [] );\n\n\t/**\n\t * A callback triggered when a blur event occurs on the element the handler\n\t * is bound to.\n\t *\n\t * Calls the `onFocusOutside` callback in an immediate timeout if focus has\n\t * move outside the bound element and is still within the document.\n\t *\n\t * @param {SyntheticEvent} event Blur event.\n\t */\n\tconst queueBlurCheck = useCallback( ( event ) => {\n\t\t// React does not allow using an event reference asynchronously\n\t\t// due to recycling behavior, except when explicitly persisted.\n\t\tevent.persist();\n\n\t\t// Skip blur check if clicking button. See `normalizeButtonFocus`.\n\t\tif ( preventBlurCheck.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tblurCheckTimeoutId.current = setTimeout( () => {\n\t\t\tif ( 'function' === typeof currentOnFocusOutside.current ) {\n\t\t\t\tcurrentOnFocusOutside.current( event );\n\t\t\t}\n\t\t}, 0 );\n\t}, [] );\n\n\treturn {\n\t\tonFocus: cancelBlurCheck,\n\t\tonMouseDown: normalizeButtonFocus,\n\t\tonMouseUp: normalizeButtonFocus,\n\t\tonTouchStart: normalizeButtonFocus,\n\t\tonTouchEnd: normalizeButtonFocus,\n\t\tonBlur: queueBlurCheck,\n\t};\n}\n"],"mappings":"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"}

package/build-module/hooks/use-focus-return/index.js

@@ -2,11 +2,13 @@
  * WordPress dependencies
  */
 import { useRef, useEffect, useCallback } from '@wordpress/element';
+
+/** @type {Element|null} */
+let origin = null;
+
 /**
- * When opening modals/sidebars/dialogs, the focus
- * must move to the opened area and return to the
- * previously focused element when closed.
- * The current hook implements the returning behavior.
+ * Adds the unmount behavior of returning focus to the element which had it
+ * previously as is expected for roles like menus or dialogs.
  *
  * @param {() => void} [onFocusReturn] Overrides the default return behavior.
  * @return {import('react').RefCallback<HTMLElement>} Element Ref.
@@ -26,12 +28,10 @@ import { useRef, useEffect, useCallback } from '@wordpress/element';
  * }
  * ```
  */
-
 function useFocusReturn(onFocusReturn) {
   /** @type {import('react').MutableRefObject<null | HTMLElement>} */
   const ref = useRef(null);
   /** @type {import('react').MutableRefObject<null | Element>} */
-
   const focusedBeforeMount = useRef(null);
   const onFocusReturnRef = useRef(onFocusReturn);
   useEffect(() => {
@@ -40,33 +40,33 @@ function useFocusReturn(onFocusReturn) {
   return useCallback(node => {
     if (node) {
       // Set ref to be used when unmounting.
-      ref.current = node; // Only set when the node mounts.
+      ref.current = node;
 
+      // Only set when the node mounts.
       if (focusedBeforeMount.current) {
         return;
       }
-
       focusedBeforeMount.current = node.ownerDocument.activeElement;
     } else if (focusedBeforeMount.current) {
       const isFocused = ref.current?.contains(ref.current?.ownerDocument.activeElement);
-
       if (ref.current?.isConnected && !isFocused) {
+        var _origin;
+        (_origin = origin) !== null && _origin !== void 0 ? _origin : origin = focusedBeforeMount.current;
         return;
-      } // Defer to the component's own explicit focus return behavior, if
+      }
+
+      // Defer to the component's own explicit focus return behavior, if
       // specified. This allows for support that the `onFocusReturn`
       // decides to allow the default behavior to occur under some
       // conditions.
-
-
       if (onFocusReturnRef.current) {
         onFocusReturnRef.current();
       } else {
-        /** @type {null | HTMLElement} */
-        focusedBeforeMount.current?.focus();
+        /** @type {null|HTMLElement} */(!focusedBeforeMount.current.isConnected ? origin : focusedBeforeMount.current)?.focus();
       }
+      origin = null;
     }
   }, []);
 }
-
 export default useFocusReturn;
 //# sourceMappingURL=index.js.map

package/build-module/hooks/use-focus-return/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-return/index.js"],"names":["useRef","useEffect","useCallback","useFocusReturn","onFocusReturn","ref","focusedBeforeMount","onFocusReturnRef","current","node","ownerDocument","activeElement","isFocused","contains","isConnected","focus"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,SAAjB,EAA4BC,WAA5B,QAA+C,oBAA/C;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,cAAT,CAAyBC,aAAzB,EAAyC;AACxC;AACA,QAAMC,GAAG,GAAGL,MAAM,CAAE,IAAF,CAAlB;AACA;;AACA,QAAMM,kBAAkB,GAAGN,MAAM,CAAE,IAAF,CAAjC;AACA,QAAMO,gBAAgB,GAAGP,MAAM,CAAEI,aAAF,CAA/B;AACAH,EAAAA,SAAS,CAAE,MAAM;AAChBM,IAAAA,gBAAgB,CAACC,OAAjB,GAA2BJ,aAA3B;AACA,GAFQ,EAEN,CAAEA,aAAF,CAFM,CAAT;AAIA,SAAOF,WAAW,CAAIO,IAAF,IAAY;AAC/B,QAAKA,IAAL,EAAY;AACX;AACAJ,MAAAA,GAAG,CAACG,OAAJ,GAAcC,IAAd,CAFW,CAIX;;AACA,UAAKH,kBAAkB,CAACE,OAAxB,EAAkC;AACjC;AACA;;AAEDF,MAAAA,kBAAkB,CAACE,OAAnB,GAA6BC,IAAI,CAACC,aAAL,CAAmBC,aAAhD;AACA,KAVD,MAUO,IAAKL,kBAAkB,CAACE,OAAxB,EAAkC;AACxC,YAAMI,SAAS,GAAGP,GAAG,CAACG,OAAJ,EAAaK,QAAb,CACjBR,GAAG,CAACG,OAAJ,EAAaE,aAAb,CAA2BC,aADV,CAAlB;;AAIA,UAAKN,GAAG,CAACG,OAAJ,EAAaM,WAAb,IAA4B,CAAEF,SAAnC,EAA+C;AAC9C;AACA,OAPuC,CASxC;AACA;AACA;AACA;;;AACA,UAAKL,gBAAgB,CAACC,OAAtB,EAAgC;AAC/BD,QAAAA,gBAAgB,CAACC,OAAjB;AACA,OAFD,MAEO;AACN;AACCF,QAAAA,kBAAkB,CAACE,OADc,EAE/BO,KAF+B;AAGlC;AACD;AACD,GAhCiB,EAgCf,EAhCe,CAAlB;AAiCA;;AAED,eAAeZ,cAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useCallback } from '@wordpress/element';\n\n/**\n * When opening modals/sidebars/dialogs, the focus\n * must move to the opened area and return to the\n * previously focused element when closed.\n * The current hook implements the returning behavior.\n *\n * @param {() => void} [onFocusReturn] Overrides the default return behavior.\n * @return {import('react').RefCallback<HTMLElement>} Element Ref.\n *\n * @example\n * ```js\n * import { useFocusReturn } from '@wordpress/compose';\n *\n * const WithFocusReturn = () => {\n *     const ref = useFocusReturn()\n *     return (\n *         <div ref={ ref }>\n *             <Button />\n *             <Button />\n *         </div>\n *     );\n * }\n * ```\n */\nfunction useFocusReturn( onFocusReturn ) {\n\t/** @type {import('react').MutableRefObject<null | HTMLElement>} */\n\tconst ref = useRef( null );\n\t/** @type {import('react').MutableRefObject<null | Element>} */\n\tconst focusedBeforeMount = useRef( null );\n\tconst onFocusReturnRef = useRef( onFocusReturn );\n\tuseEffect( () => {\n\t\tonFocusReturnRef.current = onFocusReturn;\n\t}, [ onFocusReturn ] );\n\n\treturn useCallback( ( node ) => {\n\t\tif ( node ) {\n\t\t\t// Set ref to be used when unmounting.\n\t\t\tref.current = node;\n\n\t\t\t// Only set when the node mounts.\n\t\t\tif ( focusedBeforeMount.current ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfocusedBeforeMount.current = node.ownerDocument.activeElement;\n\t\t} else if ( focusedBeforeMount.current ) {\n\t\t\tconst isFocused = ref.current?.contains(\n\t\t\t\tref.current?.ownerDocument.activeElement\n\t\t\t);\n\n\t\t\tif ( ref.current?.isConnected && ! isFocused ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Defer to the component's own explicit focus return behavior, if\n\t\t\t// specified. This allows for support that the `onFocusReturn`\n\t\t\t// decides to allow the default behavior to occur under some\n\t\t\t// conditions.\n\t\t\tif ( onFocusReturnRef.current ) {\n\t\t\t\tonFocusReturnRef.current();\n\t\t\t} else {\n\t\t\t\t/** @type {null | HTMLElement} */ (\n\t\t\t\t\tfocusedBeforeMount.current\n\t\t\t\t)?.focus();\n\t\t\t}\n\t\t}\n\t}, [] );\n}\n\nexport default useFocusReturn;\n"]}
+{"version":3,"names":["useRef","useEffect","useCallback","origin","useFocusReturn","onFocusReturn","ref","focusedBeforeMount","onFocusReturnRef","current","node","ownerDocument","activeElement","isFocused","contains","isConnected","_origin","focus"],"sources":["@wordpress/compose/src/hooks/use-focus-return/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useCallback } from '@wordpress/element';\n\n/** @type {Element|null} */\nlet origin = null;\n\n/**\n * Adds the unmount behavior of returning focus to the element which had it\n * previously as is expected for roles like menus or dialogs.\n *\n * @param {() => void} [onFocusReturn] Overrides the default return behavior.\n * @return {import('react').RefCallback<HTMLElement>} Element Ref.\n *\n * @example\n * ```js\n * import { useFocusReturn } from '@wordpress/compose';\n *\n * const WithFocusReturn = () => {\n *     const ref = useFocusReturn()\n *     return (\n *         <div ref={ ref }>\n *             <Button />\n *             <Button />\n *         </div>\n *     );\n * }\n * ```\n */\nfunction useFocusReturn( onFocusReturn ) {\n\t/** @type {import('react').MutableRefObject<null | HTMLElement>} */\n\tconst ref = useRef( null );\n\t/** @type {import('react').MutableRefObject<null | Element>} */\n\tconst focusedBeforeMount = useRef( null );\n\tconst onFocusReturnRef = useRef( onFocusReturn );\n\tuseEffect( () => {\n\t\tonFocusReturnRef.current = onFocusReturn;\n\t}, [ onFocusReturn ] );\n\n\treturn useCallback( ( node ) => {\n\t\tif ( node ) {\n\t\t\t// Set ref to be used when unmounting.\n\t\t\tref.current = node;\n\n\t\t\t// Only set when the node mounts.\n\t\t\tif ( focusedBeforeMount.current ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfocusedBeforeMount.current = node.ownerDocument.activeElement;\n\t\t} else if ( focusedBeforeMount.current ) {\n\t\t\tconst isFocused = ref.current?.contains(\n\t\t\t\tref.current?.ownerDocument.activeElement\n\t\t\t);\n\n\t\t\tif ( ref.current?.isConnected && ! isFocused ) {\n\t\t\t\torigin ??= focusedBeforeMount.current;\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Defer to the component's own explicit focus return behavior, if\n\t\t\t// specified. This allows for support that the `onFocusReturn`\n\t\t\t// decides to allow the default behavior to occur under some\n\t\t\t// conditions.\n\t\t\tif ( onFocusReturnRef.current ) {\n\t\t\t\tonFocusReturnRef.current();\n\t\t\t} else {\n\t\t\t\t/** @type {null|HTMLElement} */ (\n\t\t\t\t\t! focusedBeforeMount.current.isConnected\n\t\t\t\t\t\t? origin\n\t\t\t\t\t\t: focusedBeforeMount.current\n\t\t\t\t)?.focus();\n\t\t\t}\n\t\t\torigin = null;\n\t\t}\n\t}, [] );\n}\n\nexport default useFocusReturn;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAM,EAAEC,SAAS,EAAEC,WAAW,QAAQ,oBAAoB;;AAEnE;AACA,IAAIC,MAAM,GAAG,IAAI;;AAEjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,cAAcA,CAAEC,aAAa,EAAG;EACxC;EACA,MAAMC,GAAG,GAAGN,MAAM,CAAE,IAAK,CAAC;EAC1B;EACA,MAAMO,kBAAkB,GAAGP,MAAM,CAAE,IAAK,CAAC;EACzC,MAAMQ,gBAAgB,GAAGR,MAAM,CAAEK,aAAc,CAAC;EAChDJ,SAAS,CAAE,MAAM;IAChBO,gBAAgB,CAACC,OAAO,GAAGJ,aAAa;EACzC,CAAC,EAAE,CAAEA,aAAa,CAAG,CAAC;EAEtB,OAAOH,WAAW,CAAIQ,IAAI,IAAM;IAC/B,IAAKA,IAAI,EAAG;MACX;MACAJ,GAAG,CAACG,OAAO,GAAGC,IAAI;;MAElB;MACA,IAAKH,kBAAkB,CAACE,OAAO,EAAG;QACjC;MACD;MAEAF,kBAAkB,CAACE,OAAO,GAAGC,IAAI,CAACC,aAAa,CAACC,aAAa;IAC9D,CAAC,MAAM,IAAKL,kBAAkB,CAACE,OAAO,EAAG;MACxC,MAAMI,SAAS,GAAGP,GAAG,CAACG,OAAO,EAAEK,QAAQ,CACtCR,GAAG,CAACG,OAAO,EAAEE,aAAa,CAACC,aAC5B,CAAC;MAED,IAAKN,GAAG,CAACG,OAAO,EAAEM,WAAW,IAAI,CAAEF,SAAS,EAAG;QAAA,IAAAG,OAAA;QAC9C,CAAAA,OAAA,GAAAb,MAAM,cAAAa,OAAA,cAAAA,OAAA,GAANb,MAAM,GAAKI,kBAAkB,CAACE,OAAO;QACrC;MACD;;MAEA;MACA;MACA;MACA;MACA,IAAKD,gBAAgB,CAACC,OAAO,EAAG;QAC/BD,gBAAgB,CAACC,OAAO,CAAC,CAAC;MAC3B,CAAC,MAAM;QACN,+BAAgC,CAC/B,CAAEF,kBAAkB,CAACE,OAAO,CAACM,WAAW,GACrCZ,MAAM,GACNI,kBAAkB,CAACE,OAAO,GAC3BQ,KAAK,CAAC,CAAC;MACX;MACAd,MAAM,GAAG,IAAI;IACd;EACD,CAAC,EAAE,EAAG,CAAC;AACR;AAEA,eAAeC,cAAc"}

package/build-module/hooks/use-focusable-iframe/index.js

@@ -6,13 +6,13 @@
  * Internal dependencies
  */
 import useRefEffect from '../use-ref-effect';
+
 /**
  * Dispatches a bubbling focus event when the iframe receives focus. Use
  * `onFocus` as usual on the iframe or a parent element.
  *
  * @return Ref to pass to the iframe.
  */
-
 export default function useFocusableIframe() {
   return useRefEffect(element => {
     const {
@@ -23,17 +23,16 @@ export default function useFocusableIframe() {
       defaultView
     } = ownerDocument;
     if (!defaultView) return;
+
     /**
      * Checks whether the iframe is the activeElement, inferring that it has
      * then received focus, and dispatches a focus event.
      */
-
     function checkFocus() {
       if (ownerDocument && ownerDocument.activeElement === element) {
         element.focus();
       }
     }
-
     defaultView.addEventListener('blur', checkFocus);
     return () => {
       defaultView.removeEventListener('blur', checkFocus);

package/build-module/hooks/use-focusable-iframe/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/compose/src/hooks/use-focusable-iframe/index.ts"],"names":["useRefEffect","useFocusableIframe","element","ownerDocument","defaultView","checkFocus","activeElement","focus","addEventListener","removeEventListener"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAOA,YAAP,MAAyB,mBAAzB;AAEA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,kBAAT,GAAgE;AAC9E,SAAOD,YAAY,CAAIE,OAAF,IAAe;AACnC,UAAM;AAAEC,MAAAA;AAAF,QAAoBD,OAA1B;AACA,QAAK,CAAEC,aAAP,EAAuB;AACvB,UAAM;AAAEC,MAAAA;AAAF,QAAkBD,aAAxB;AACA,QAAK,CAAEC,WAAP,EAAqB;AAErB;AACF;AACA;AACA;;AACE,aAASC,UAAT,GAAsB;AACrB,UAAKF,aAAa,IAAIA,aAAa,CAACG,aAAd,KAAgCJ,OAAtD,EAAgE;AAC7DA,QAAAA,OAAF,CAA2BK,KAA3B;AACA;AACD;;AAEDH,IAAAA,WAAW,CAACI,gBAAZ,CAA8B,MAA9B,EAAsCH,UAAtC;AACA,WAAO,MAAM;AACZD,MAAAA,WAAW,CAACK,mBAAZ,CAAiC,MAAjC,EAAyCJ,UAAzC;AACA,KAFD;AAGA,GApBkB,EAoBhB,EApBgB,CAAnB;AAqBA","sourcesContent":["/**\n * External dependencies\n */\nimport type { RefCallback } from 'react';\n\n/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\n\n/**\n * Dispatches a bubbling focus event when the iframe receives focus. Use\n * `onFocus` as usual on the iframe or a parent element.\n *\n * @return Ref to pass to the iframe.\n */\nexport default function useFocusableIframe(): RefCallback< HTMLIFrameElement > {\n\treturn useRefEffect( ( element ) => {\n\t\tconst { ownerDocument } = element;\n\t\tif ( ! ownerDocument ) return;\n\t\tconst { defaultView } = ownerDocument;\n\t\tif ( ! defaultView ) return;\n\n\t\t/**\n\t\t * Checks whether the iframe is the activeElement, inferring that it has\n\t\t * then received focus, and dispatches a focus event.\n\t\t */\n\t\tfunction checkFocus() {\n\t\t\tif ( ownerDocument && ownerDocument.activeElement === element ) {\n\t\t\t\t( element as HTMLElement ).focus();\n\t\t\t}\n\t\t}\n\n\t\tdefaultView.addEventListener( 'blur', checkFocus );\n\t\treturn () => {\n\t\t\tdefaultView.removeEventListener( 'blur', checkFocus );\n\t\t};\n\t}, [] );\n}\n"]}
+{"version":3,"names":["useRefEffect","useFocusableIframe","element","ownerDocument","defaultView","checkFocus","activeElement","focus","addEventListener","removeEventListener"],"sources":["@wordpress/compose/src/hooks/use-focusable-iframe/index.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { RefCallback } from 'react';\n\n/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\n\n/**\n * Dispatches a bubbling focus event when the iframe receives focus. Use\n * `onFocus` as usual on the iframe or a parent element.\n *\n * @return Ref to pass to the iframe.\n */\nexport default function useFocusableIframe(): RefCallback< HTMLIFrameElement > {\n\treturn useRefEffect( ( element ) => {\n\t\tconst { ownerDocument } = element;\n\t\tif ( ! ownerDocument ) return;\n\t\tconst { defaultView } = ownerDocument;\n\t\tif ( ! defaultView ) return;\n\n\t\t/**\n\t\t * Checks whether the iframe is the activeElement, inferring that it has\n\t\t * then received focus, and dispatches a focus event.\n\t\t */\n\t\tfunction checkFocus() {\n\t\t\tif ( ownerDocument && ownerDocument.activeElement === element ) {\n\t\t\t\t( element as HTMLElement ).focus();\n\t\t\t}\n\t\t}\n\n\t\tdefaultView.addEventListener( 'blur', checkFocus );\n\t\treturn () => {\n\t\t\tdefaultView.removeEventListener( 'blur', checkFocus );\n\t\t};\n\t}, [] );\n}\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAOA,YAAY,MAAM,mBAAmB;;AAE5C;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,kBAAkBA,CAAA,EAAqC;EAC9E,OAAOD,YAAY,CAAIE,OAAO,IAAM;IACnC,MAAM;MAAEC;IAAc,CAAC,GAAGD,OAAO;IACjC,IAAK,CAAEC,aAAa,EAAG;IACvB,MAAM;MAAEC;IAAY,CAAC,GAAGD,aAAa;IACrC,IAAK,CAAEC,WAAW,EAAG;;IAErB;AACF;AACA;AACA;IACE,SAASC,UAAUA,CAAA,EAAG;MACrB,IAAKF,aAAa,IAAIA,aAAa,CAACG,aAAa,KAAKJ,OAAO,EAAG;QAC7DA,OAAO,CAAkBK,KAAK,CAAC,CAAC;MACnC;IACD;IAEAH,WAAW,CAACI,gBAAgB,CAAE,MAAM,EAAEH,UAAW,CAAC;IAClD,OAAO,MAAM;MACZD,WAAW,CAACK,mBAAmB,CAAE,MAAM,EAAEJ,UAAW,CAAC;IACtD,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;AACR"}

package/build-module/hooks/use-instance-id/index.js

@@ -3,18 +3,19 @@
  */
 import { useMemo } from '@wordpress/element';
 const instanceMap = new WeakMap();
+
 /**
  * Creates a new id for a given object.
  *
  * @param object Object reference to create an id for.
  * @return The instance id (index).
  */
-
 function createId(object) {
   const instances = instanceMap.get(object) || 0;
   instanceMap.set(object, instances + 1);
   return instances;
 }
+
 /**
  * Specify the useInstanceId *function* signatures.
  *
@@ -28,7 +29,6 @@ function createId(object) {
  * @param object Object reference to create an id for.
  */
 
-
 /**
  * Provides a unique instance ID.
  *
@@ -44,6 +44,5 @@ function useInstanceId(object, prefix, preferredId) {
     return prefix ? `${prefix}-${id}` : id;
   }, [object, preferredId, prefix]);
 }
-
 export default useInstanceId;
 //# sourceMappingURL=index.js.map

package/build-module/hooks/use-instance-id/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/compose/src/hooks/use-instance-id/index.ts"],"names":["useMemo","instanceMap","WeakMap","createId","object","instances","get","set","useInstanceId","prefix","preferredId","id"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAT,QAAwB,oBAAxB;AAEA,MAAMC,WAAW,GAAG,IAAIC,OAAJ,EAApB;AAEA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,QAAT,CAAmBC,MAAnB,EAA4C;AAC3C,QAAMC,SAAS,GAAGJ,WAAW,CAACK,GAAZ,CAAiBF,MAAjB,KAA6B,CAA/C;AACAH,EAAAA,WAAW,CAACM,GAAZ,CAAiBH,MAAjB,EAAyBC,SAAS,GAAG,CAArC;AACA,SAAOA,SAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASG,aAAT,CACCJ,MADD,EAECK,MAFD,EAGCC,WAHD,EAImB;AAClB,SAAOV,OAAO,CAAE,MAAM;AACrB,QAAKU,WAAL,EAAmB,OAAOA,WAAP;AACnB,UAAMC,EAAE,GAAGR,QAAQ,CAAEC,MAAF,CAAnB;AAEA,WAAOK,MAAM,GAAI,GAAGA,MAAQ,IAAIE,EAAI,EAAvB,GAA2BA,EAAxC;AACA,GALa,EAKX,CAAEP,MAAF,EAAUM,WAAV,EAAuBD,MAAvB,CALW,CAAd;AAMA;;AAED,eAAeD,aAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\nconst instanceMap = new WeakMap< object, number >();\n\n/**\n * Creates a new id for a given object.\n *\n * @param object Object reference to create an id for.\n * @return The instance id (index).\n */\nfunction createId( object: object ): number {\n\tconst instances = instanceMap.get( object ) || 0;\n\tinstanceMap.set( object, instances + 1 );\n\treturn instances;\n}\n\n/**\n * Specify the useInstanceId *function* signatures.\n *\n * More accurately, useInstanceId distinguishes between three different\n * signatures:\n *\n * 1. When only object is given, the returned value is a number\n * 2. When object and prefix is given, the returned value is a string\n * 3. When preferredId is given, the returned value is the type of preferredId\n *\n * @param object Object reference to create an id for.\n */\nfunction useInstanceId( object: object ): number;\nfunction useInstanceId( object: object, prefix: string ): string;\nfunction useInstanceId< T extends string | number >(\n\tobject: object,\n\tprefix: string,\n\tpreferredId?: T\n): T;\n\n/**\n * Provides a unique instance ID.\n *\n * @param object        Object reference to create an id for.\n * @param [prefix]      Prefix for the unique id.\n * @param [preferredId] Default ID to use.\n * @return The unique instance id.\n */\nfunction useInstanceId(\n\tobject: object,\n\tprefix?: string,\n\tpreferredId?: string | number\n): string | number {\n\treturn useMemo( () => {\n\t\tif ( preferredId ) return preferredId;\n\t\tconst id = createId( object );\n\n\t\treturn prefix ? `${ prefix }-${ id }` : id;\n\t}, [ object, preferredId, prefix ] );\n}\n\nexport default useInstanceId;\n"]}
+{"version":3,"names":["useMemo","instanceMap","WeakMap","createId","object","instances","get","set","useInstanceId","prefix","preferredId","id"],"sources":["@wordpress/compose/src/hooks/use-instance-id/index.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\nconst instanceMap = new WeakMap< object, number >();\n\n/**\n * Creates a new id for a given object.\n *\n * @param object Object reference to create an id for.\n * @return The instance id (index).\n */\nfunction createId( object: object ): number {\n\tconst instances = instanceMap.get( object ) || 0;\n\tinstanceMap.set( object, instances + 1 );\n\treturn instances;\n}\n\n/**\n * Specify the useInstanceId *function* signatures.\n *\n * More accurately, useInstanceId distinguishes between three different\n * signatures:\n *\n * 1. When only object is given, the returned value is a number\n * 2. When object and prefix is given, the returned value is a string\n * 3. When preferredId is given, the returned value is the type of preferredId\n *\n * @param object Object reference to create an id for.\n */\nfunction useInstanceId( object: object ): number;\nfunction useInstanceId( object: object, prefix: string ): string;\nfunction useInstanceId< T extends string | number >(\n\tobject: object,\n\tprefix: string,\n\tpreferredId?: T\n): T;\n\n/**\n * Provides a unique instance ID.\n *\n * @param object        Object reference to create an id for.\n * @param [prefix]      Prefix for the unique id.\n * @param [preferredId] Default ID to use.\n * @return The unique instance id.\n */\nfunction useInstanceId(\n\tobject: object,\n\tprefix?: string,\n\tpreferredId?: string | number\n): string | number {\n\treturn useMemo( () => {\n\t\tif ( preferredId ) return preferredId;\n\t\tconst id = createId( object );\n\n\t\treturn prefix ? `${ prefix }-${ id }` : id;\n\t}, [ object, preferredId, prefix ] );\n}\n\nexport default useInstanceId;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAO,QAAQ,oBAAoB;AAE5C,MAAMC,WAAW,GAAG,IAAIC,OAAO,CAAmB,CAAC;;AAEnD;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,QAAQA,CAAEC,MAAc,EAAW;EAC3C,MAAMC,SAAS,GAAGJ,WAAW,CAACK,GAAG,CAAEF,MAAO,CAAC,IAAI,CAAC;EAChDH,WAAW,CAACM,GAAG,CAAEH,MAAM,EAAEC,SAAS,GAAG,CAAE,CAAC;EACxC,OAAOA,SAAS;AACjB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASG,aAAaA,CACrBJ,MAAc,EACdK,MAAe,EACfC,WAA6B,EACX;EAClB,OAAOV,OAAO,CAAE,MAAM;IACrB,IAAKU,WAAW,EAAG,OAAOA,WAAW;IACrC,MAAMC,EAAE,GAAGR,QAAQ,CAAEC,MAAO,CAAC;IAE7B,OAAOK,MAAM,GAAI,GAAGA,MAAQ,IAAIE,EAAI,EAAC,GAAGA,EAAE;EAC3C,CAAC,EAAE,CAAEP,MAAM,EAAEM,WAAW,EAAED,MAAM,CAAG,CAAC;AACrC;AAEA,eAAeD,aAAa"}

package/build-module/hooks/use-isomorphic-layout-effect/index.js

@@ -2,12 +2,12 @@
  * WordPress dependencies
  */
 import { useEffect, useLayoutEffect } from '@wordpress/element';
+
 /**
  * Preferred over direct usage of `useLayoutEffect` when supporting
  * server rendered components (SSR) because currently React
  * throws a warning when using useLayoutEffect in that environment.
  */
-
 const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
 export default useIsomorphicLayoutEffect;
 //# sourceMappingURL=index.js.map

package/build-module/hooks/use-isomorphic-layout-effect/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/compose/src/hooks/use-isomorphic-layout-effect/index.js"],"names":["useEffect","useLayoutEffect","useIsomorphicLayoutEffect","window"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,eAApB,QAA2C,oBAA3C;AAEA;AACA;AACA;AACA;AACA;;AACA,MAAMC,yBAAyB,GAC9B,OAAOC,MAAP,KAAkB,WAAlB,GAAgCF,eAAhC,GAAkDD,SADnD;AAGA,eAAeE,yBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useLayoutEffect } from '@wordpress/element';\n\n/**\n * Preferred over direct usage of `useLayoutEffect` when supporting\n * server rendered components (SSR) because currently React\n * throws a warning when using useLayoutEffect in that environment.\n */\nconst useIsomorphicLayoutEffect =\n\ttypeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\nexport default useIsomorphicLayoutEffect;\n"]}
+{"version":3,"names":["useEffect","useLayoutEffect","useIsomorphicLayoutEffect","window"],"sources":["@wordpress/compose/src/hooks/use-isomorphic-layout-effect/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useLayoutEffect } from '@wordpress/element';\n\n/**\n * Preferred over direct usage of `useLayoutEffect` when supporting\n * server rendered components (SSR) because currently React\n * throws a warning when using useLayoutEffect in that environment.\n */\nconst useIsomorphicLayoutEffect =\n\ttypeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\nexport default useIsomorphicLayoutEffect;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAS,EAAEC,eAAe,QAAQ,oBAAoB;;AAE/D;AACA;AACA;AACA;AACA;AACA,MAAMC,yBAAyB,GAC9B,OAAOC,MAAM,KAAK,WAAW,GAAGF,eAAe,GAAGD,SAAS;AAE5D,eAAeE,yBAAyB"}