@wordpress/compose 7.46.0 → 8.0.0

package/CHANGELOG.md

@@ -2,6 +2,17 @@
 
 ## Unreleased
 
+## 8.0.0 (2026-05-27)
+
+### Breaking Changes
+
+-   `useDialog`: The returned `props` object now exposes an `onKeyDown` handler. Consumers that spread it onto a wrapper which also receives an `onKeyDown` from elsewhere should pass that handler via the new `onKeyDown` option (which merges it with close-on-Escape) or merge the two themselves ([#78433](https://github.com/WordPress/gutenberg/pull/78433)).
+
+### Bug Fixes
+
+-   `useCopyToClipboard`: Call the `onSuccess` callback even when the trigger node unmounts before the copy resolves ([#78387](https://github.com/WordPress/gutenberg/pull/78387)).
+-   `useDialog`: Handle Escape via React `onKeyDown` so portaled descendants can stop propagation to prevent the dialog from closing ([#78433](https://github.com/WordPress/gutenberg/pull/78433)).
+
 ## 7.46.0 (2026-05-14)
 
 ## 7.45.0 (2026-04-29)

package/README.md

@@ -147,6 +147,10 @@ _Related_
 
 -   <https://lodash.com/docs/4#flow>
 
+### privateApis
+
+Private @wordpress/compose APIs.
+
 ### pure
 
 > **Deprecated** Use `memo` or `PureComponent` instead.

package/build/hooks/use-copy-on-click/index.cjs

@@ -72,7 +72,7 @@ function useCopyOnClick(ref, text, timeout = 4e3) {
         return;
       }
       if (success) {
-        (0, import_use_copy_to_clipboard.clearSelection)(trigger);
+        (0, import_use_copy_to_clipboard.restoreFocus)(trigger);
         if (timeout) {
           setHasCopied(true);
           clearTimeout(timeoutId);

package/build/hooks/use-copy-on-click/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/hooks/use-copy-on-click/index.ts"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect, useState } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\nimport type { RefObject } from 'react';\n\n/**\n * Internal dependencies\n */\nimport { clearSelection, copyToClipboard } from '../use-copy-to-clipboard';\n\n/**\n * Copies the text to the clipboard when the element is clicked.\n *\n * @deprecated\n * @param ref      Reference with the element.\n * @param text    The text to copy.\n * @param timeout Optional timeout to reset the returned\n *                state. 4 seconds by default.\n * @return   Whether or not the text has been copied. Resets after the\n *           timeout.\n */\nexport default function useCopyOnClick(\n\tref: RefObject< string | Element | NodeListOf< Element > >,\n\ttext: string | ( () => string ),\n\ttimeout: number = 4000\n): boolean {\n\tdeprecated( 'wp.compose.useCopyOnClick', {\n\t\tsince: '5.8',\n\t\talternative: 'wp.compose.useCopyToClipboard',\n\t} );\n\n\tconst [ hasCopied, setHasCopied ] = useState( false );\n\n\tuseEffect( () => {\n\t\t// Flag to prevent state updates after unmount when the Promise resolves.\n\t\tlet isActive = true;\n\t\tlet timeoutId: ReturnType< typeof setTimeout > | undefined;\n\t\tif ( ! ref.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet targets: Element[];\n\t\tif ( typeof ref.current === 'string' ) {\n\t\t\ttargets =\n\t\t\t\ttypeof document !== 'undefined'\n\t\t\t\t\t? Array.from( document.querySelectorAll( ref.current ) )\n\t\t\t\t\t: [];\n\t\t} else if (\n\t\t\t'length' in ref.current &&\n\t\t\ttypeof ref.current.length === 'number'\n\t\t) {\n\t\t\ttargets = Array.from( ref.current );\n\t\t} else {\n\t\t\ttargets = [ ref.current as Element ];\n\t\t}\n\n\t\tif ( targets.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleClick = async ( event: Event ) => {\n\t\t\tconst trigger = event.currentTarget as Element;\n\t\t\tif ( ! trigger ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst success = await copyToClipboard(\n\t\t\t\ttypeof text === 'function' ? text() : text || '',\n\t\t\t\ttrigger\n\t\t\t);\n\t\t\tif ( ! isActive ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif ( success ) {\n\t\t\t\tclearSelection( trigger );\n\t\t\t\tif ( timeout ) {\n\t\t\t\t\tsetHasCopied( true );\n\t\t\t\t\tclearTimeout( timeoutId );\n\t\t\t\t\ttimeoutId = setTimeout(\n\t\t\t\t\t\t() => setHasCopied( false ),\n\t\t\t\t\t\ttimeout\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\n\t\tfor ( const target of targets ) {\n\t\t\ttarget.addEventListener( 'click', handleClick );\n\t\t}\n\t\treturn () => {\n\t\t\tisActive = false;\n\t\t\tfor ( const target of targets ) {\n\t\t\t\ttarget.removeEventListener( 'click', handleClick );\n\t\t\t}\n\t\t\tclearTimeout( timeoutId );\n\t\t};\n\t}, [ ref, text, timeout ] );\n\n\treturn hasCopied;\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAoC;AACpC,wBAAuB;AAMvB,mCAAgD;AAajC,SAAR,eACN,KACA,MACA,UAAkB,KACR;AACV,wBAAAA,SAAY,6BAA6B;AAAA,IACxC,OAAO;AAAA,IACP,aAAa;AAAA,EACd,CAAE;AAEF,QAAM,CAAE,WAAW,YAAa,QAAI,yBAAU,KAAM;AAEpD,gCAAW,MAAM;AAEhB,QAAI,WAAW;AACf,QAAI;AACJ,QAAK,CAAE,IAAI,SAAU;AACpB;AAAA,IACD;AAEA,QAAI;AACJ,QAAK,OAAO,IAAI,YAAY,UAAW;AACtC,gBACC,OAAO,aAAa,cACjB,MAAM,KAAM,SAAS,iBAAkB,IAAI,OAAQ,CAAE,IACrD,CAAC;AAAA,IACN,WACC,YAAY,IAAI,WAChB,OAAO,IAAI,QAAQ,WAAW,UAC7B;AACD,gBAAU,MAAM,KAAM,IAAI,OAAQ;AAAA,IACnC,OAAO;AACN,gBAAU,CAAE,IAAI,OAAmB;AAAA,IACpC;AAEA,QAAK,QAAQ,WAAW,GAAI;AAC3B;AAAA,IACD;AAEA,UAAM,cAAc,OAAQ,UAAkB;AAC7C,YAAM,UAAU,MAAM;AACtB,UAAK,CAAE,SAAU;AAChB;AAAA,MACD;AACA,YAAM,UAAU,UAAM;AAAA,QACrB,OAAO,SAAS,aAAa,KAAK,IAAI,QAAQ;AAAA,QAC9C;AAAA,MACD;AACA,UAAK,CAAE,UAAW;AACjB;AAAA,MACD;AACA,UAAK,SAAU;AACd,yDAAgB,OAAQ;AACxB,YAAK,SAAU;AACd,uBAAc,IAAK;AACnB,uBAAc,SAAU;AACxB,sBAAY;AAAA,YACX,MAAM,aAAc,KAAM;AAAA,YAC1B;AAAA,UACD;AAAA,QACD;AAAA,MACD;AAAA,IACD;AAEA,eAAY,UAAU,SAAU;AAC/B,aAAO,iBAAkB,SAAS,WAAY;AAAA,IAC/C;AACA,WAAO,MAAM;AACZ,iBAAW;AACX,iBAAY,UAAU,SAAU;AAC/B,eAAO,oBAAqB,SAAS,WAAY;AAAA,MAClD;AACA,mBAAc,SAAU;AAAA,IACzB;AAAA,EACD,GAAG,CAAE,KAAK,MAAM,OAAQ,CAAE;AAE1B,SAAO;AACR;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect, useState } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\nimport type { RefObject } from 'react';\n\n/**\n * Internal dependencies\n */\nimport { restoreFocus, copyToClipboard } from '../use-copy-to-clipboard';\n\n/**\n * Copies the text to the clipboard when the element is clicked.\n *\n * @deprecated\n * @param ref      Reference with the element.\n * @param text    The text to copy.\n * @param timeout Optional timeout to reset the returned\n *                state. 4 seconds by default.\n * @return   Whether or not the text has been copied. Resets after the\n *           timeout.\n */\nexport default function useCopyOnClick(\n\tref: RefObject< string | Element | NodeListOf< Element > >,\n\ttext: string | ( () => string ),\n\ttimeout: number = 4000\n): boolean {\n\tdeprecated( 'wp.compose.useCopyOnClick', {\n\t\tsince: '5.8',\n\t\talternative: 'wp.compose.useCopyToClipboard',\n\t} );\n\n\tconst [ hasCopied, setHasCopied ] = useState( false );\n\n\tuseEffect( () => {\n\t\t// Flag to prevent state updates after unmount when the Promise resolves.\n\t\tlet isActive = true;\n\t\tlet timeoutId: ReturnType< typeof setTimeout > | undefined;\n\t\tif ( ! ref.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet targets: Element[];\n\t\tif ( typeof ref.current === 'string' ) {\n\t\t\ttargets =\n\t\t\t\ttypeof document !== 'undefined'\n\t\t\t\t\t? Array.from( document.querySelectorAll( ref.current ) )\n\t\t\t\t\t: [];\n\t\t} else if (\n\t\t\t'length' in ref.current &&\n\t\t\ttypeof ref.current.length === 'number'\n\t\t) {\n\t\t\ttargets = Array.from( ref.current );\n\t\t} else {\n\t\t\ttargets = [ ref.current as Element ];\n\t\t}\n\n\t\tif ( targets.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleClick = async ( event: Event ) => {\n\t\t\tconst trigger = event.currentTarget as Element;\n\t\t\tif ( ! trigger ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst success = await copyToClipboard(\n\t\t\t\ttypeof text === 'function' ? text() : text || '',\n\t\t\t\ttrigger\n\t\t\t);\n\t\t\tif ( ! isActive ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif ( success ) {\n\t\t\t\trestoreFocus( trigger );\n\t\t\t\tif ( timeout ) {\n\t\t\t\t\tsetHasCopied( true );\n\t\t\t\t\tclearTimeout( timeoutId );\n\t\t\t\t\ttimeoutId = setTimeout(\n\t\t\t\t\t\t() => setHasCopied( false ),\n\t\t\t\t\t\ttimeout\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\n\t\tfor ( const target of targets ) {\n\t\t\ttarget.addEventListener( 'click', handleClick );\n\t\t}\n\t\treturn () => {\n\t\t\tisActive = false;\n\t\t\tfor ( const target of targets ) {\n\t\t\t\ttarget.removeEventListener( 'click', handleClick );\n\t\t\t}\n\t\t\tclearTimeout( timeoutId );\n\t\t};\n\t}, [ ref, text, timeout ] );\n\n\treturn hasCopied;\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAoC;AACpC,wBAAuB;AAMvB,mCAA8C;AAa/B,SAAR,eACN,KACA,MACA,UAAkB,KACR;AACV,wBAAAA,SAAY,6BAA6B;AAAA,IACxC,OAAO;AAAA,IACP,aAAa;AAAA,EACd,CAAE;AAEF,QAAM,CAAE,WAAW,YAAa,QAAI,yBAAU,KAAM;AAEpD,gCAAW,MAAM;AAEhB,QAAI,WAAW;AACf,QAAI;AACJ,QAAK,CAAE,IAAI,SAAU;AACpB;AAAA,IACD;AAEA,QAAI;AACJ,QAAK,OAAO,IAAI,YAAY,UAAW;AACtC,gBACC,OAAO,aAAa,cACjB,MAAM,KAAM,SAAS,iBAAkB,IAAI,OAAQ,CAAE,IACrD,CAAC;AAAA,IACN,WACC,YAAY,IAAI,WAChB,OAAO,IAAI,QAAQ,WAAW,UAC7B;AACD,gBAAU,MAAM,KAAM,IAAI,OAAQ;AAAA,IACnC,OAAO;AACN,gBAAU,CAAE,IAAI,OAAmB;AAAA,IACpC;AAEA,QAAK,QAAQ,WAAW,GAAI;AAC3B;AAAA,IACD;AAEA,UAAM,cAAc,OAAQ,UAAkB;AAC7C,YAAM,UAAU,MAAM;AACtB,UAAK,CAAE,SAAU;AAChB;AAAA,MACD;AACA,YAAM,UAAU,UAAM;AAAA,QACrB,OAAO,SAAS,aAAa,KAAK,IAAI,QAAQ;AAAA,QAC9C;AAAA,MACD;AACA,UAAK,CAAE,UAAW;AACjB;AAAA,MACD;AACA,UAAK,SAAU;AACd,uDAAc,OAAQ;AACtB,YAAK,SAAU;AACd,uBAAc,IAAK;AACnB,uBAAc,SAAU;AACxB,sBAAY;AAAA,YACX,MAAM,aAAc,KAAM;AAAA,YAC1B;AAAA,UACD;AAAA,QACD;AAAA,MACD;AAAA,IACD;AAEA,eAAY,UAAU,SAAU;AAC/B,aAAO,iBAAkB,SAAS,WAAY;AAAA,IAC/C;AACA,WAAO,MAAM;AACZ,iBAAW;AACX,iBAAY,UAAU,SAAU;AAC/B,eAAO,oBAAqB,SAAS,WAAY;AAAA,MAClD;AACA,mBAAc,SAAU;AAAA,IACzB;AAAA,EACD,GAAG,CAAE,KAAK,MAAM,OAAQ,CAAE;AAE1B,SAAO;AACR;",
   "names": ["deprecated"]
 }

package/build/hooks/use-copy-to-clipboard/index.cjs

@@ -30,9 +30,9 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // packages/compose/src/hooks/use-copy-to-clipboard/index.ts
 var use_copy_to_clipboard_exports = {};
 __export(use_copy_to_clipboard_exports, {
-  clearSelection: () => clearSelection,
   copyToClipboard: () => copyToClipboard,
-  default: () => useCopyToClipboard
+  default: () => useCopyToClipboard,
+  restoreFocus: () => restoreFocus
 });
 module.exports = __toCommonJS(use_copy_to_clipboard_exports);
 var import_element = require("@wordpress/element");
@@ -66,11 +66,10 @@ async function copyToClipboard(text, trigger) {
     return false;
   }
 }
-function clearSelection(trigger) {
+function restoreFocus(trigger) {
   if ("focus" in trigger && typeof trigger.focus === "function") {
     trigger.focus();
   }
-  trigger.ownerDocument?.defaultView?.getSelection()?.removeAllRanges();
 }
 function useUpdatedRef(value) {
   const ref = (0, import_element.useRef)(value);
@@ -87,11 +86,10 @@ function useCopyToClipboard(text, onSuccess) {
     const handleClick = async () => {
       const textToCopy = typeof textRef.current === "function" ? textRef.current() : textRef.current || "";
       const success = await copyToClipboard(textToCopy, node);
-      if (!isActive) {
-        return;
-      }
       if (success) {
-        clearSelection(node);
+        if (isActive) {
+          restoreFocus(node);
+        }
         if (onSuccessRef.current) {
           onSuccessRef.current();
         }
@@ -106,7 +104,7 @@ function useCopyToClipboard(text, onSuccess) {
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  clearSelection,
-  copyToClipboard
+  copyToClipboard,
+  restoreFocus
 });
 //# sourceMappingURL=index.cjs.map

package/build/hooks/use-copy-to-clipboard/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/hooks/use-copy-to-clipboard/index.ts"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useRef, useLayoutEffect } from '@wordpress/element';\nimport type { MutableRefObject, RefCallback } from 'react';\n\n/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\n\n/**\n * Copies text to the clipboard using the Clipboard API when available,\n * with a fallback for non-secure contexts (e.g. HTTP) and older browsers.\n *\n * @param text    The text to copy.\n * @param trigger The element that triggered the copy.\n * @return Resolves to true if successful, false otherwise.\n */\nexport async function copyToClipboard(\n\ttext: string,\n\ttrigger: Element | null\n): Promise< boolean > {\n\tif ( ! trigger ) {\n\t\treturn false;\n\t}\n\tconst { ownerDocument } = trigger;\n\tif ( ! ownerDocument ) {\n\t\treturn false;\n\t}\n\tconst { defaultView } = ownerDocument;\n\ttry {\n\t\tif ( defaultView?.navigator?.clipboard?.writeText ) {\n\t\t\tawait defaultView.navigator.clipboard.writeText( text );\n\t\t\treturn true;\n\t\t}\n\t\t// Fallback for non-secure contexts (HTTP) and older browsers.\n\t\tconst textarea = ownerDocument.createElement( 'textarea' );\n\t\ttextarea.value = text;\n\t\ttextarea.setAttribute( 'readonly', '' );\n\t\ttextarea.style.position = 'fixed';\n\t\ttextarea.style.left = '-9999px';\n\t\ttextarea.style.top = '-9999px';\n\t\townerDocument.body.appendChild( textarea );\n\t\ttextarea.select();\n\t\tconst success = ownerDocument.execCommand( 'copy' );\n\t\ttextarea.remove();\n\t\treturn success;\n\t} catch {\n\t\treturn false;\n\t}\n}\n\n/**\n * Clears the current selection and restores focus to the trigger element.\n *\n * @param trigger The element that triggered the copy.\n */\nexport function clearSelection( trigger: Element ): void {\n\tif ( 'focus' in trigger && typeof trigger.focus === 'function' ) {\n\t\ttrigger.focus();\n\t}\n\ttrigger.ownerDocument?.defaultView?.getSelection()?.removeAllRanges();\n}\n\n/**\n * @template T\n * @param    value\n * @return   A ref to assign to the target element.\n */\nfunction useUpdatedRef< T >( value: T ): MutableRefObject< T > {\n\tconst ref = useRef< T >( value );\n\tuseLayoutEffect( () => {\n\t\tref.current = value;\n\t}, [ value ] );\n\treturn ref;\n}\n\n/**\n * Copies the given text to the clipboard when the element is clicked.\n *\n * @template T\n * @param    text      The text to copy. Use a function if not\n *                     already available and expensive to compute.\n * @param    onSuccess Called when to text is copied.\n *\n * @return   A ref to assign to the target element.\n */\nexport default function useCopyToClipboard< T extends HTMLElement >(\n\ttext: string | ( () => string ),\n\tonSuccess?: () => void\n): RefCallback< T > {\n\tconst textRef = useUpdatedRef( text );\n\tconst onSuccessRef = useUpdatedRef( onSuccess );\n\treturn useRefEffect( ( node ) => {\n\t\t// Flag to prevent callbacks after unmount when the Promise resolves.\n\t\tlet isActive = true;\n\t\tconst handleClick = async () => {\n\t\t\tconst textToCopy =\n\t\t\t\ttypeof textRef.current === 'function'\n\t\t\t\t\t? textRef.current()\n\t\t\t\t\t: textRef.current || '';\n\t\t\tconst success = await copyToClipboard( textToCopy, node );\n\t\t\tif ( ! isActive ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif ( success ) {\n\t\t\t\tclearSelection( node );\n\t\t\t\tif ( onSuccessRef.current ) {\n\t\t\t\t\tonSuccessRef.current();\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t\tnode.addEventListener( 'click', handleClick );\n\t\treturn () => {\n\t\t\tisActive = false;\n\t\t\tnode.removeEventListener( 'click', handleClick );\n\t\t};\n\t}, [] );\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAwC;AAMxC,4BAAyB;AAUzB,eAAsB,gBACrB,MACA,SACqB;AACrB,MAAK,CAAE,SAAU;AAChB,WAAO;AAAA,EACR;AACA,QAAM,EAAE,cAAc,IAAI;AAC1B,MAAK,CAAE,eAAgB;AACtB,WAAO;AAAA,EACR;AACA,QAAM,EAAE,YAAY,IAAI;AACxB,MAAI;AACH,QAAK,aAAa,WAAW,WAAW,WAAY;AACnD,YAAM,YAAY,UAAU,UAAU,UAAW,IAAK;AACtD,aAAO;AAAA,IACR;AAEA,UAAM,WAAW,cAAc,cAAe,UAAW;AACzD,aAAS,QAAQ;AACjB,aAAS,aAAc,YAAY,EAAG;AACtC,aAAS,MAAM,WAAW;AAC1B,aAAS,MAAM,OAAO;AACtB,aAAS,MAAM,MAAM;AACrB,kBAAc,KAAK,YAAa,QAAS;AACzC,aAAS,OAAO;AAChB,UAAM,UAAU,cAAc,YAAa,MAAO;AAClD,aAAS,OAAO;AAChB,WAAO;AAAA,EACR,QAAQ;AACP,WAAO;AAAA,EACR;AACD;AAOO,SAAS,eAAgB,SAAyB;AACxD,MAAK,WAAW,WAAW,OAAO,QAAQ,UAAU,YAAa;AAChE,YAAQ,MAAM;AAAA,EACf;AACA,UAAQ,eAAe,aAAa,aAAa,GAAG,gBAAgB;AACrE;AAOA,SAAS,cAAoB,OAAkC;AAC9D,QAAM,UAAM,uBAAa,KAAM;AAC/B,sCAAiB,MAAM;AACtB,QAAI,UAAU;AAAA,EACf,GAAG,CAAE,KAAM,CAAE;AACb,SAAO;AACR;AAYe,SAAR,mBACN,MACA,WACmB;AACnB,QAAM,UAAU,cAAe,IAAK;AACpC,QAAM,eAAe,cAAe,SAAU;AAC9C,aAAO,sBAAAA,SAAc,CAAE,SAAU;AAEhC,QAAI,WAAW;AACf,UAAM,cAAc,YAAY;AAC/B,YAAM,aACL,OAAO,QAAQ,YAAY,aACxB,QAAQ,QAAQ,IAChB,QAAQ,WAAW;AACvB,YAAM,UAAU,MAAM,gBAAiB,YAAY,IAAK;AACxD,UAAK,CAAE,UAAW;AACjB;AAAA,MACD;AACA,UAAK,SAAU;AACd,uBAAgB,IAAK;AACrB,YAAK,aAAa,SAAU;AAC3B,uBAAa,QAAQ;AAAA,QACtB;AAAA,MACD;AAAA,IACD;AACA,SAAK,iBAAkB,SAAS,WAAY;AAC5C,WAAO,MAAM;AACZ,iBAAW;AACX,WAAK,oBAAqB,SAAS,WAAY;AAAA,IAChD;AAAA,EACD,GAAG,CAAC,CAAE;AACP;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useRef, useLayoutEffect } from '@wordpress/element';\nimport type { MutableRefObject, RefCallback } from 'react';\n\n/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\n\n/**\n * Copies text to the clipboard using the Clipboard API when available,\n * with a fallback for non-secure contexts (e.g. HTTP) and older browsers.\n *\n * @param text    The text to copy.\n * @param trigger The element that triggered the copy.\n * @return Resolves to true if successful, false otherwise.\n */\nexport async function copyToClipboard(\n\ttext: string,\n\ttrigger: Element | null\n): Promise< boolean > {\n\tif ( ! trigger ) {\n\t\treturn false;\n\t}\n\tconst { ownerDocument } = trigger;\n\tif ( ! ownerDocument ) {\n\t\treturn false;\n\t}\n\tconst { defaultView } = ownerDocument;\n\ttry {\n\t\tif ( defaultView?.navigator?.clipboard?.writeText ) {\n\t\t\tawait defaultView.navigator.clipboard.writeText( text );\n\t\t\treturn true;\n\t\t}\n\t\t// Fallback for non-secure contexts (HTTP) and older browsers.\n\t\tconst textarea = ownerDocument.createElement( 'textarea' );\n\t\ttextarea.value = text;\n\t\ttextarea.setAttribute( 'readonly', '' );\n\t\ttextarea.style.position = 'fixed';\n\t\ttextarea.style.left = '-9999px';\n\t\ttextarea.style.top = '-9999px';\n\t\townerDocument.body.appendChild( textarea );\n\t\ttextarea.select();\n\t\tconst success = ownerDocument.execCommand( 'copy' );\n\t\ttextarea.remove();\n\t\treturn success;\n\t} catch {\n\t\treturn false;\n\t}\n}\n\n/**\n * Restores focus to the trigger element.\n *\n * @param trigger The element that triggered the copy.\n */\nexport function restoreFocus( trigger: Element ): void {\n\tif ( 'focus' in trigger && typeof trigger.focus === 'function' ) {\n\t\ttrigger.focus();\n\t}\n}\n\n/**\n * @template T\n * @param    value\n * @return   A ref to assign to the target element.\n */\nfunction useUpdatedRef< T >( value: T ): MutableRefObject< T > {\n\tconst ref = useRef< T >( value );\n\tuseLayoutEffect( () => {\n\t\tref.current = value;\n\t}, [ value ] );\n\treturn ref;\n}\n\n/**\n * Copies the given text to the clipboard when the element is clicked.\n *\n * @template T\n * @param    text      The text to copy. Use a function if not\n *                     already available and expensive to compute.\n * @param    onSuccess Called when to text is copied.\n *\n * @return   A ref to assign to the target element.\n */\nexport default function useCopyToClipboard< T extends HTMLElement >(\n\ttext: string | ( () => string ),\n\tonSuccess?: () => void\n): RefCallback< T > {\n\tconst textRef = useUpdatedRef( text );\n\tconst onSuccessRef = useUpdatedRef( onSuccess );\n\treturn useRefEffect( ( node ) => {\n\t\t// Tracks whether the node is still mounted when the Promise resolves.\n\t\tlet isActive = true;\n\t\tconst handleClick = async () => {\n\t\t\tconst textToCopy =\n\t\t\t\ttypeof textRef.current === 'function'\n\t\t\t\t\t? textRef.current()\n\t\t\t\t\t: textRef.current || '';\n\t\t\tconst success = await copyToClipboard( textToCopy, node );\n\t\t\tif ( success ) {\n\t\t\t\t// Restoring focus only matters while the node is mounted.\n\t\t\t\tif ( isActive ) {\n\t\t\t\t\trestoreFocus( node );\n\t\t\t\t}\n\t\t\t\t// Always run, even after unmount, to allow updating other UI.\n\t\t\t\tif ( onSuccessRef.current ) {\n\t\t\t\t\tonSuccessRef.current();\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t\tnode.addEventListener( 'click', handleClick );\n\t\treturn () => {\n\t\t\tisActive = false;\n\t\t\tnode.removeEventListener( 'click', handleClick );\n\t\t};\n\t}, [] );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAwC;AAMxC,4BAAyB;AAUzB,eAAsB,gBACrB,MACA,SACqB;AACrB,MAAK,CAAE,SAAU;AAChB,WAAO;AAAA,EACR;AACA,QAAM,EAAE,cAAc,IAAI;AAC1B,MAAK,CAAE,eAAgB;AACtB,WAAO;AAAA,EACR;AACA,QAAM,EAAE,YAAY,IAAI;AACxB,MAAI;AACH,QAAK,aAAa,WAAW,WAAW,WAAY;AACnD,YAAM,YAAY,UAAU,UAAU,UAAW,IAAK;AACtD,aAAO;AAAA,IACR;AAEA,UAAM,WAAW,cAAc,cAAe,UAAW;AACzD,aAAS,QAAQ;AACjB,aAAS,aAAc,YAAY,EAAG;AACtC,aAAS,MAAM,WAAW;AAC1B,aAAS,MAAM,OAAO;AACtB,aAAS,MAAM,MAAM;AACrB,kBAAc,KAAK,YAAa,QAAS;AACzC,aAAS,OAAO;AAChB,UAAM,UAAU,cAAc,YAAa,MAAO;AAClD,aAAS,OAAO;AAChB,WAAO;AAAA,EACR,QAAQ;AACP,WAAO;AAAA,EACR;AACD;AAOO,SAAS,aAAc,SAAyB;AACtD,MAAK,WAAW,WAAW,OAAO,QAAQ,UAAU,YAAa;AAChE,YAAQ,MAAM;AAAA,EACf;AACD;AAOA,SAAS,cAAoB,OAAkC;AAC9D,QAAM,UAAM,uBAAa,KAAM;AAC/B,sCAAiB,MAAM;AACtB,QAAI,UAAU;AAAA,EACf,GAAG,CAAE,KAAM,CAAE;AACb,SAAO;AACR;AAYe,SAAR,mBACN,MACA,WACmB;AACnB,QAAM,UAAU,cAAe,IAAK;AACpC,QAAM,eAAe,cAAe,SAAU;AAC9C,aAAO,sBAAAA,SAAc,CAAE,SAAU;AAEhC,QAAI,WAAW;AACf,UAAM,cAAc,YAAY;AAC/B,YAAM,aACL,OAAO,QAAQ,YAAY,aACxB,QAAQ,QAAQ,IAChB,QAAQ,WAAW;AACvB,YAAM,UAAU,MAAM,gBAAiB,YAAY,IAAK;AACxD,UAAK,SAAU;AAEd,YAAK,UAAW;AACf,uBAAc,IAAK;AAAA,QACpB;AAEA,YAAK,aAAa,SAAU;AAC3B,uBAAa,QAAQ;AAAA,QACtB;AAAA,MACD;AAAA,IACD;AACA,SAAK,iBAAkB,SAAS,WAAY;AAC5C,WAAO,MAAM;AACZ,iBAAW;AACX,WAAK,oBAAqB,SAAS,WAAY;AAAA,IAChD;AAAA,EACD,GAAG,CAAC,CAAE;AACP;",
   "names": ["useRefEffect"]
 }

package/build/hooks/use-dialog/index.cjs

@@ -34,7 +34,6 @@ __export(use_dialog_exports, {
 });
 module.exports = __toCommonJS(use_dialog_exports);
 var import_element = require("@wordpress/element");
-var import_keycodes = require("@wordpress/keycodes");
 var import_use_constrained_tabbing = __toESM(require("../use-constrained-tabbing/index.cjs"));
 var import_use_focus_on_mount = require("../use-focus-on-mount/index.cjs");
 var import_use_focus_return = __toESM(require("../use-focus-return/index.cjs"));
@@ -56,27 +55,23 @@ function useDialog(options) {
       currentOptions.current.onClose();
     }
   });
-  const closeOnEscapeRef = (0, import_element.useCallback)((node) => {
-    if (!node) {
-      return;
+  const onKeyDown = (0, import_element.useCallback)((event) => {
+    currentOptions.current?.onKeyDown?.(event);
+    if (event.key === "Escape" && !event.defaultPrevented && currentOptions.current?.onClose) {
+      event.preventDefault();
+      event.stopPropagation();
+      currentOptions.current.onClose();
     }
-    node.addEventListener("keydown", (event) => {
-      if (event.keyCode === import_keycodes.ESCAPE && !event.defaultPrevented && currentOptions.current?.onClose) {
-        event.preventDefault();
-        event.stopPropagation();
-        currentOptions.current.onClose();
-      }
-    });
   }, []);
   return [
     (0, import_use_merge_refs.default)([
       constrainTabbing ? constrainedTabbingRef : null,
       options.focusOnMount !== false ? focusReturnRef : null,
-      options.focusOnMount !== false ? focusOnMountRef : null,
-      closeOnEscapeRef
+      options.focusOnMount !== false ? focusOnMountRef : null
     ]),
     {
       ...focusOutsideProps,
+      onKeyDown,
       tabIndex: -1
     }
   ];

package/build/hooks/use-dialog/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/hooks/use-dialog/index.ts"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport type { RefCallback, SyntheticEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useCallback } from '@wordpress/element';\nimport { ESCAPE } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport useConstrainedTabbing from '../use-constrained-tabbing';\nimport { useFocusOnMount } from '../use-focus-on-mount';\nimport useFocusReturn from '../use-focus-return';\nimport useFocusOutside from '../use-focus-outside';\nimport useMergeRefs from '../use-merge-refs';\n\ntype DialogOptions = {\n\t/**\n\t * Determines focus behavior when the dialog mounts.\n\t *\n\t * - `\"firstElement\"` focuses the first tabbable element within.\n\t * - `\"firstInputElement\"` focuses the first value control within.\n\t * - `true` focuses the element itself.\n\t * - `false` does nothing and _should not be used unless an accessible\n\t *    substitute behavior is implemented_.\n\t *\n\t * @default 'firstElement'\n\t */\n\tfocusOnMount?: useFocusOnMount.Mode;\n\t/**\n\t * Determines whether tabbing is constrained to within the popover,\n\t * preventing keyboard focus from leaving the popover content without\n\t * explicit focus elsewhere, or whether the popover remains part of the\n\t * wider tab order.\n\t * If no value is passed, it will be derived from `focusOnMount`.\n\t *\n\t * @see focusOnMount\n\t * @default `focusOnMount` !== false\n\t */\n\tconstrainTabbing?: boolean;\n\tonClose?: () => void;\n\t/**\n\t * Use the `onClose` prop instead.\n\t *\n\t * @deprecated\n\t */\n\t__unstableOnClose?: (\n\t\ttype: string | undefined,\n\t\tevent: SyntheticEvent\n\t) => void;\n};\n\ntype useDialogReturn = [\n\tRefCallback< HTMLElement >,\n\tReturnType< typeof useFocusOutside > & Pick< HTMLElement, 'tabIndex' >,\n];\n\n/**\n * Returns a ref and props to apply to a dialog wrapper to enable the following behaviors:\n *  - constrained tabbing.\n *  - focus on mount.\n *  - return focus on unmount.\n *  - focus outside.\n *\n * @param options Dialog Options.\n */\nfunction useDialog( options: DialogOptions ): useDialogReturn {\n\tconst currentOptions = useRef< DialogOptions >( undefined );\n\tconst { constrainTabbing = options.focusOnMount !== false } = options;\n\tuseEffect( () => {\n\t\tcurrentOptions.current = options;\n\t}, Object.values( options ) );\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusOnMountRef = useFocusOnMount( options.focusOnMount );\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( ( event ) => {\n\t\t// This unstable prop  is here only to manage backward compatibility\n\t\t// for the Popover component otherwise, the onClose should be enough.\n\t\tif ( currentOptions.current?.__unstableOnClose ) {\n\t\t\tcurrentOptions.current.__unstableOnClose( 'focus-outside', event );\n\t\t} else if ( currentOptions.current?.onClose ) {\n\t\t\tcurrentOptions.current.onClose();\n\t\t}\n\t} );\n\tconst closeOnEscapeRef = useCallback( ( node: HTMLElement ) => {\n\t\tif ( ! node ) {\n\t\t\treturn;\n\t\t}\n\n\t\tnode.addEventListener( 'keydown', ( event: KeyboardEvent ) => {\n\t\t\t// Close on escape.\n\t\t\tif (\n\t\t\t\tevent.keyCode === ESCAPE &&\n\t\t\t\t! event.defaultPrevented &&\n\t\t\t\tcurrentOptions.current?.onClose\n\t\t\t) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\t\t\t\tcurrentOptions.current.onClose();\n\t\t\t}\n\t\t} );\n\t}, [] );\n\n\treturn [\n\t\tuseMergeRefs( [\n\t\t\tconstrainTabbing ? constrainedTabbingRef : null,\n\t\t\toptions.focusOnMount !== false ? focusReturnRef : null,\n\t\t\toptions.focusOnMount !== false ? focusOnMountRef : null,\n\t\t\tcloseOnEscapeRef,\n\t\t] ),\n\t\t{\n\t\t\t...focusOutsideProps,\n\t\t\ttabIndex: -1,\n\t\t},\n\t];\n}\n\nexport default useDialog;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA,qBAA+C;AAC/C,sBAAuB;AAKvB,qCAAkC;AAClC,gCAAgC;AAChC,8BAA2B;AAC3B,+BAA4B;AAC5B,4BAAyB;AAoDzB,SAAS,UAAW,SAA0C;AAC7D,QAAM,qBAAiB,uBAAyB,MAAU;AAC1D,QAAM,EAAE,mBAAmB,QAAQ,iBAAiB,MAAM,IAAI;AAC9D,gCAAW,MAAM;AAChB,mBAAe,UAAU;AAAA,EAC1B,GAAG,OAAO,OAAQ,OAAQ,CAAE;AAC5B,QAAM,4BAAwB,+BAAAA,SAAsB;AACpD,QAAM,sBAAkB,2CAAiB,QAAQ,YAAa;AAC9D,QAAM,qBAAiB,wBAAAC,SAAe;AACtC,QAAM,wBAAoB,yBAAAC,SAAiB,CAAE,UAAW;AAGvD,QAAK,eAAe,SAAS,mBAAoB;AAChD,qBAAe,QAAQ,kBAAmB,iBAAiB,KAAM;AAAA,IAClE,WAAY,eAAe,SAAS,SAAU;AAC7C,qBAAe,QAAQ,QAAQ;AAAA,IAChC;AAAA,EACD,CAAE;AACF,QAAM,uBAAmB,4BAAa,CAAE,SAAuB;AAC9D,QAAK,CAAE,MAAO;AACb;AAAA,IACD;AAEA,SAAK,iBAAkB,WAAW,CAAE,UAA0B;AAE7D,UACC,MAAM,YAAY,0BAClB,CAAE,MAAM,oBACR,eAAe,SAAS,SACvB;AACD,cAAM,eAAe;AACrB,cAAM,gBAAgB;AACtB,uBAAe,QAAQ,QAAQ;AAAA,MAChC;AAAA,IACD,CAAE;AAAA,EACH,GAAG,CAAC,CAAE;AAEN,SAAO;AAAA,QACN,sBAAAC,SAAc;AAAA,MACb,mBAAmB,wBAAwB;AAAA,MAC3C,QAAQ,iBAAiB,QAAQ,iBAAiB;AAAA,MAClD,QAAQ,iBAAiB,QAAQ,kBAAkB;AAAA,MACnD;AAAA,IACD,CAAE;AAAA,IACF;AAAA,MACC,GAAG;AAAA,MACH,UAAU;AAAA,IACX;AAAA,EACD;AACD;AAEA,IAAO,qBAAQ;",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport type {\n\tKeyboardEvent,\n\tKeyboardEventHandler,\n\tRefCallback,\n\tSyntheticEvent,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useConstrainedTabbing from '../use-constrained-tabbing';\nimport { useFocusOnMount } from '../use-focus-on-mount';\nimport useFocusReturn from '../use-focus-return';\nimport useFocusOutside from '../use-focus-outside';\nimport useMergeRefs from '../use-merge-refs';\n\ntype DialogOptions = {\n\t/**\n\t * Determines focus behavior when the dialog mounts.\n\t *\n\t * - `\"firstElement\"` focuses the first tabbable element within.\n\t * - `\"firstInputElement\"` focuses the first value control within.\n\t * - `true` focuses the element itself.\n\t * - `false` does nothing and _should not be used unless an accessible\n\t *    substitute behavior is implemented_.\n\t *\n\t * @default 'firstElement'\n\t */\n\tfocusOnMount?: useFocusOnMount.Mode;\n\t/**\n\t * Determines whether tabbing is constrained to within the popover,\n\t * preventing keyboard focus from leaving the popover content without\n\t * explicit focus elsewhere, or whether the popover remains part of the\n\t * wider tab order.\n\t * If no value is passed, it will be derived from `focusOnMount`.\n\t *\n\t * @see focusOnMount\n\t * @default `focusOnMount` !== false\n\t */\n\tconstrainTabbing?: boolean;\n\tonClose?: () => void;\n\t/**\n\t * Optional `onKeyDown` handler, merged with the built-in one.\n\t */\n\tonKeyDown?: KeyboardEventHandler< HTMLElement >;\n\t/**\n\t * Use the `onClose` prop instead.\n\t *\n\t * @deprecated\n\t */\n\t__unstableOnClose?: (\n\t\ttype: string | undefined,\n\t\tevent: SyntheticEvent\n\t) => void;\n};\n\ntype useDialogReturn = [\n\tRefCallback< HTMLElement >,\n\tReturnType< typeof useFocusOutside > & {\n\t\tonKeyDown: ( event: KeyboardEvent< HTMLElement > ) => void;\n\t} & Pick< HTMLElement, 'tabIndex' >,\n];\n\n/**\n * Returns a ref and props to apply to a dialog wrapper to enable the following behaviors:\n *  - constrained tabbing.\n *  - focus on mount.\n *  - return focus on unmount.\n *  - focus outside.\n *\n * @param options Dialog Options.\n */\nfunction useDialog( options: DialogOptions ): useDialogReturn {\n\tconst currentOptions = useRef< DialogOptions >( undefined );\n\tconst { constrainTabbing = options.focusOnMount !== false } = options;\n\tuseEffect( () => {\n\t\tcurrentOptions.current = options;\n\t}, Object.values( options ) );\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusOnMountRef = useFocusOnMount( options.focusOnMount );\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( ( event ) => {\n\t\t// This unstable prop  is here only to manage backward compatibility\n\t\t// for the Popover component otherwise, the onClose should be enough.\n\t\tif ( currentOptions.current?.__unstableOnClose ) {\n\t\t\tcurrentOptions.current.__unstableOnClose( 'focus-outside', event );\n\t\t} else if ( currentOptions.current?.onClose ) {\n\t\t\tcurrentOptions.current.onClose();\n\t\t}\n\t} );\n\t// Close on Escape via a React `onKeyDown` (rather than a native listener)\n\t// so portaled descendants that handle Escape and call\n\t// `event.stopPropagation()` correctly prevent the dialog from closing.\n\t// See https://github.com/WordPress/gutenberg/issues/78432.\n\tconst onKeyDown = useCallback( ( event: KeyboardEvent< HTMLElement > ) => {\n\t\t// Let the consumer-provided handler (if any) run first so it can\n\t\t// call `preventDefault()` to opt out of close-on-Escape.\n\t\tcurrentOptions.current?.onKeyDown?.( event );\n\t\tif (\n\t\t\tevent.key === 'Escape' &&\n\t\t\t! event.defaultPrevented &&\n\t\t\tcurrentOptions.current?.onClose\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tevent.stopPropagation();\n\t\t\tcurrentOptions.current.onClose();\n\t\t}\n\t}, [] );\n\n\treturn [\n\t\tuseMergeRefs( [\n\t\t\tconstrainTabbing ? constrainedTabbingRef : null,\n\t\t\toptions.focusOnMount !== false ? focusReturnRef : null,\n\t\t\toptions.focusOnMount !== false ? focusOnMountRef : null,\n\t\t] ),\n\t\t{\n\t\t\t...focusOutsideProps,\n\t\t\tonKeyDown,\n\t\t\ttabIndex: -1,\n\t\t},\n\t];\n}\n\nexport default useDialog;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAaA,qBAA+C;AAK/C,qCAAkC;AAClC,gCAAgC;AAChC,8BAA2B;AAC3B,+BAA4B;AAC5B,4BAAyB;AA0DzB,SAAS,UAAW,SAA0C;AAC7D,QAAM,qBAAiB,uBAAyB,MAAU;AAC1D,QAAM,EAAE,mBAAmB,QAAQ,iBAAiB,MAAM,IAAI;AAC9D,gCAAW,MAAM;AAChB,mBAAe,UAAU;AAAA,EAC1B,GAAG,OAAO,OAAQ,OAAQ,CAAE;AAC5B,QAAM,4BAAwB,+BAAAA,SAAsB;AACpD,QAAM,sBAAkB,2CAAiB,QAAQ,YAAa;AAC9D,QAAM,qBAAiB,wBAAAC,SAAe;AACtC,QAAM,wBAAoB,yBAAAC,SAAiB,CAAE,UAAW;AAGvD,QAAK,eAAe,SAAS,mBAAoB;AAChD,qBAAe,QAAQ,kBAAmB,iBAAiB,KAAM;AAAA,IAClE,WAAY,eAAe,SAAS,SAAU;AAC7C,qBAAe,QAAQ,QAAQ;AAAA,IAChC;AAAA,EACD,CAAE;AAKF,QAAM,gBAAY,4BAAa,CAAE,UAAyC;AAGzE,mBAAe,SAAS,YAAa,KAAM;AAC3C,QACC,MAAM,QAAQ,YACd,CAAE,MAAM,oBACR,eAAe,SAAS,SACvB;AACD,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,qBAAe,QAAQ,QAAQ;AAAA,IAChC;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,SAAO;AAAA,QACN,sBAAAC,SAAc;AAAA,MACb,mBAAmB,wBAAwB;AAAA,MAC3C,QAAQ,iBAAiB,QAAQ,iBAAiB;AAAA,MAClD,QAAQ,iBAAiB,QAAQ,kBAAkB;AAAA,IACpD,CAAE;AAAA,IACF;AAAA,MACC,GAAG;AAAA,MACH;AAAA,MACA,UAAU;AAAA,IACX;AAAA,EACD;AACD;AAEA,IAAO,qBAAQ;",
   "names": ["useConstrainedTabbing", "useFocusReturn", "useFocusOutside", "useMergeRefs"]
 }

package/build/hooks/use-disabled/index.cjs

@@ -53,8 +53,8 @@ function useDisabled({
           if (!(child instanceof defaultView.HTMLElement)) {
             return;
           }
-          if (!child.getAttribute("inert")) {
-            child.setAttribute("inert", "true");
+          if (!child.hasAttribute("inert")) {
+            child.setAttribute("inert", "");
             updates.push(() => {
               child.removeAttribute("inert");
             });

package/build/hooks/use-disabled/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/hooks/use-disabled/index.ts"],
-  "sourcesContent": ["/**\n * Internal dependencies\n */\nimport { debounce } from '../../utils/debounce';\nimport useRefEffect from '../use-ref-effect';\n\n/**\n * In some circumstances, such as block previews, all focusable DOM elements\n * (input fields, links, buttons, etc.) need to be disabled. This hook adds the\n * behavior to disable nested DOM elements to the returned ref.\n *\n * If you can, prefer the use of the inert HTML attribute.\n *\n * @param {Object}   config            Configuration object.\n * @param {boolean=} config.isDisabled Whether the element should be disabled.\n * @return {React.RefCallback<HTMLElement>} Element Ref.\n *\n * @example\n * ```js\n * import { useDisabled } from '@wordpress/compose';\n *\n * const DisabledExample = () => {\n * \tconst disabledRef = useDisabled();\n *\treturn (\n *\t\t<div ref={ disabledRef }>\n *\t\t\t<a href=\"#\">This link will have tabindex set to -1</a>\n *\t\t\t<input placeholder=\"This input will have the disabled attribute added to it.\" type=\"text\" />\n *\t\t</div>\n *\t);\n * };\n * ```\n */\nexport default function useDisabled( {\n\tisDisabled: isDisabledProp = false,\n} = {} ) {\n\treturn useRefEffect(\n\t\t( node ) => {\n\t\t\tif ( isDisabledProp ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst defaultView = node?.ownerDocument?.defaultView;\n\t\t\tif ( ! defaultView ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t/** A variable keeping track of the previous updates in order to restore them. */\n\t\t\tconst updates: Function[] = [];\n\t\t\tconst disable = () => {\n\t\t\t\tnode.childNodes.forEach( ( child ) => {\n\t\t\t\t\tif ( ! ( child instanceof defaultView.HTMLElement ) ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tif ( ! child.getAttribute( 'inert' ) ) {\n\t\t\t\t\t\tchild.setAttribute( 'inert', 'true' );\n\t\t\t\t\t\tupdates.push( () => {\n\t\t\t\t\t\t\tchild.removeAttribute( 'inert' );\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t};\n\n\t\t\t// Debounce re-disable since disabling process itself will incur\n\t\t\t// additional mutations which should be ignored.\n\t\t\tconst debouncedDisable = debounce( disable, 0, {\n\t\t\t\tleading: true,\n\t\t\t} );\n\t\t\tdisable();\n\n\t\t\t/** @type {MutationObserver | undefined} */\n\t\t\tconst observer = new window.MutationObserver( debouncedDisable );\n\t\t\tobserver.observe( node, {\n\t\t\t\tchildList: true,\n\t\t\t} );\n\n\t\t\treturn () => {\n\t\t\t\tif ( observer ) {\n\t\t\t\t\tobserver.disconnect();\n\t\t\t\t}\n\t\t\t\tdebouncedDisable.cancel();\n\t\t\t\tupdates.forEach( ( update ) => update() );\n\t\t\t};\n\t\t},\n\t\t[ isDisabledProp ]\n\t);\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,sBAAyB;AACzB,4BAAyB;AA4BV,SAAR,YAA8B;AAAA,EACpC,YAAY,iBAAiB;AAC9B,IAAI,CAAC,GAAI;AACR,aAAO,sBAAAA;AAAA,IACN,CAAE,SAAU;AACX,UAAK,gBAAiB;AACrB;AAAA,MACD;AAEA,YAAM,cAAc,MAAM,eAAe;AACzC,UAAK,CAAE,aAAc;AACpB;AAAA,MACD;AAGA,YAAM,UAAsB,CAAC;AAC7B,YAAM,UAAU,MAAM;AACrB,aAAK,WAAW,QAAS,CAAE,UAAW;AACrC,cAAK,EAAI,iBAAiB,YAAY,cAAgB;AACrD;AAAA,UACD;AACA,cAAK,CAAE,MAAM,aAAc,OAAQ,GAAI;AACtC,kBAAM,aAAc,SAAS,MAAO;AACpC,oBAAQ,KAAM,MAAM;AACnB,oBAAM,gBAAiB,OAAQ;AAAA,YAChC,CAAE;AAAA,UACH;AAAA,QACD,CAAE;AAAA,MACH;AAIA,YAAM,uBAAmB,0BAAU,SAAS,GAAG;AAAA,QAC9C,SAAS;AAAA,MACV,CAAE;AACF,cAAQ;AAGR,YAAM,WAAW,IAAI,OAAO,iBAAkB,gBAAiB;AAC/D,eAAS,QAAS,MAAM;AAAA,QACvB,WAAW;AAAA,MACZ,CAAE;AAEF,aAAO,MAAM;AACZ,YAAK,UAAW;AACf,mBAAS,WAAW;AAAA,QACrB;AACA,yBAAiB,OAAO;AACxB,gBAAQ,QAAS,CAAE,WAAY,OAAO,CAAE;AAAA,MACzC;AAAA,IACD;AAAA,IACA,CAAE,cAAe;AAAA,EAClB;AACD;",
+  "sourcesContent": ["/**\n * Internal dependencies\n */\nimport { debounce } from '../../utils/debounce';\nimport useRefEffect from '../use-ref-effect';\n\n/**\n * In some circumstances, such as block previews, all focusable DOM elements\n * (input fields, links, buttons, etc.) need to be disabled. This hook adds the\n * behavior to disable nested DOM elements to the returned ref.\n *\n * If you can, prefer the use of the inert HTML attribute.\n *\n * @param {Object}   config            Configuration object.\n * @param {boolean=} config.isDisabled Whether the element should be disabled.\n * @return {React.RefCallback<HTMLElement>} Element Ref.\n *\n * @example\n * ```js\n * import { useDisabled } from '@wordpress/compose';\n *\n * const DisabledExample = () => {\n * \tconst disabledRef = useDisabled();\n *\treturn (\n *\t\t<div ref={ disabledRef }>\n *\t\t\t<a href=\"#\">This link will have tabindex set to -1</a>\n *\t\t\t<input placeholder=\"This input will have the disabled attribute added to it.\" type=\"text\" />\n *\t\t</div>\n *\t);\n * };\n * ```\n */\nexport default function useDisabled( {\n\tisDisabled: isDisabledProp = false,\n} = {} ) {\n\treturn useRefEffect(\n\t\t( node ) => {\n\t\t\tif ( isDisabledProp ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst defaultView = node?.ownerDocument?.defaultView;\n\t\t\tif ( ! defaultView ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t/** A variable keeping track of the previous updates in order to restore them. */\n\t\t\tconst updates: ( () => void )[] = [];\n\t\t\tconst disable = () => {\n\t\t\t\tnode.childNodes.forEach( ( child ) => {\n\t\t\t\t\tif ( ! ( child instanceof defaultView.HTMLElement ) ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tif ( ! child.hasAttribute( 'inert' ) ) {\n\t\t\t\t\t\tchild.setAttribute( 'inert', '' );\n\t\t\t\t\t\tupdates.push( () => {\n\t\t\t\t\t\t\tchild.removeAttribute( 'inert' );\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t};\n\n\t\t\t// Debounce re-disable since disabling process itself will incur\n\t\t\t// additional mutations which should be ignored.\n\t\t\tconst debouncedDisable = debounce( disable, 0, {\n\t\t\t\tleading: true,\n\t\t\t} );\n\t\t\tdisable();\n\n\t\t\t/** @type {MutationObserver | undefined} */\n\t\t\tconst observer = new window.MutationObserver( debouncedDisable );\n\t\t\tobserver.observe( node, {\n\t\t\t\tchildList: true,\n\t\t\t} );\n\n\t\t\treturn () => {\n\t\t\t\tif ( observer ) {\n\t\t\t\t\tobserver.disconnect();\n\t\t\t\t}\n\t\t\t\tdebouncedDisable.cancel();\n\t\t\t\tupdates.forEach( ( update ) => update() );\n\t\t\t};\n\t\t},\n\t\t[ isDisabledProp ]\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,sBAAyB;AACzB,4BAAyB;AA4BV,SAAR,YAA8B;AAAA,EACpC,YAAY,iBAAiB;AAC9B,IAAI,CAAC,GAAI;AACR,aAAO,sBAAAA;AAAA,IACN,CAAE,SAAU;AACX,UAAK,gBAAiB;AACrB;AAAA,MACD;AAEA,YAAM,cAAc,MAAM,eAAe;AACzC,UAAK,CAAE,aAAc;AACpB;AAAA,MACD;AAGA,YAAM,UAA4B,CAAC;AACnC,YAAM,UAAU,MAAM;AACrB,aAAK,WAAW,QAAS,CAAE,UAAW;AACrC,cAAK,EAAI,iBAAiB,YAAY,cAAgB;AACrD;AAAA,UACD;AACA,cAAK,CAAE,MAAM,aAAc,OAAQ,GAAI;AACtC,kBAAM,aAAc,SAAS,EAAG;AAChC,oBAAQ,KAAM,MAAM;AACnB,oBAAM,gBAAiB,OAAQ;AAAA,YAChC,CAAE;AAAA,UACH;AAAA,QACD,CAAE;AAAA,MACH;AAIA,YAAM,uBAAmB,0BAAU,SAAS,GAAG;AAAA,QAC9C,SAAS;AAAA,MACV,CAAE;AACF,cAAQ;AAGR,YAAM,WAAW,IAAI,OAAO,iBAAkB,gBAAiB;AAC/D,eAAS,QAAS,MAAM;AAAA,QACvB,WAAW;AAAA,MACZ,CAAE;AAEF,aAAO,MAAM;AACZ,YAAK,UAAW;AACf,mBAAS,WAAW;AAAA,QACrB;AACA,yBAAiB,OAAO;AACxB,gBAAQ,QAAS,CAAE,WAAY,OAAO,CAAE;AAAA,MACzC;AAAA,IACD;AAAA,IACA,CAAE,cAAe;AAAA,EAClB;AACD;",
   "names": ["useRefEffect"]
 }

package/build/hooks/use-focus-return/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../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 {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 {React.MutableRefObject<null | HTMLElement>} */\n\tconst ref = useRef( null );\n\t/** @type {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\tconst activeDocument =\n\t\t\t\tnode.ownerDocument.activeElement instanceof\n\t\t\t\twindow.HTMLIFrameElement\n\t\t\t\t\t? node.ownerDocument.activeElement.contentDocument\n\t\t\t\t\t: node.ownerDocument;\n\n\t\t\tfocusedBeforeMount.current = activeDocument?.activeElement ?? null;\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"],
+  "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 {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 {React.RefObject<HTMLElement| null>} */\n\tconst ref = useRef( null );\n\t/** @type {React.RefObject<Element | null>} */\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\tconst activeDocument =\n\t\t\t\tnode.ownerDocument.activeElement instanceof\n\t\t\t\twindow.HTMLIFrameElement\n\t\t\t\t\t? node.ownerDocument.activeElement.contentDocument\n\t\t\t\t\t: node.ownerDocument;\n\n\t\t\tfocusedBeforeMount.current = activeDocument?.activeElement ?? null;\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;AAAA;AAAA;AAAA;AAAA;AAGA,qBAA+C;AAG/C,IAAI,SAAS;AAwBb,SAAS,eAAgB,eAAgB;AAExC,QAAM,UAAM,uBAAQ,IAAK;AAEzB,QAAM,yBAAqB,uBAAQ,IAAK;AACxC,QAAM,uBAAmB,uBAAQ,aAAc;AAC/C,gCAAW,MAAM;AAChB,qBAAiB,UAAU;AAAA,EAC5B,GAAG,CAAE,aAAc,CAAE;AAErB,aAAO,4BAAa,CAAE,SAAU;AAC/B,QAAK,MAAO;AAEX,UAAI,UAAU;AAGd,UAAK,mBAAmB,SAAU;AACjC;AAAA,MACD;AAEA,YAAM,iBACL,KAAK,cAAc,yBACnB,OAAO,oBACJ,KAAK,cAAc,cAAc,kBACjC,KAAK;AAET,yBAAmB,UAAU,gBAAgB,iBAAiB;AAAA,IAC/D,WAAY,mBAAmB,SAAU;AACxC,YAAM,YAAY,IAAI,SAAS;AAAA,QAC9B,IAAI,SAAS,cAAc;AAAA,MAC5B;AAEA,UAAK,IAAI,SAAS,eAAe,CAAE,WAAY;AAC9C,mBAAW,mBAAmB;AAC9B;AAAA,MACD;AAMA,UAAK,iBAAiB,SAAU;AAC/B,yBAAiB,QAAQ;AAAA,MAC1B,OAAO;AAC0B,SAC/B,CAAE,mBAAmB,QAAQ,cAC1B,SACA,mBAAmB,UACpB,MAAM;AAAA,MACV;AACA,eAAS;AAAA,IACV;AAAA,EACD,GAAG,CAAC,CAAE;AACP;AAEA,IAAO,2BAAQ;",
   "names": []
 }

package/build/hooks/use-media-query/index.cjs

@@ -25,47 +25,53 @@ __export(use_media_query_exports, {
 module.exports = __toCommonJS(use_media_query_exports);
 var import_element = require("@wordpress/element");
 var perWindowCache = /* @__PURE__ */ new WeakMap();
-function getMediaQueryList(view, query) {
-  if (!query) {
-    return null;
-  }
-  const matchMediaCache = perWindowCache.get(view) ?? /* @__PURE__ */ new Map();
-  if (!perWindowCache.has(view)) {
-    perWindowCache.set(view, matchMediaCache);
+var EMPTY_SUBSCRIBER = {
+  subscribe: () => () => {
+  },
+  getValue: () => false
+};
+function getMQLSubscriber(view, query) {
+  if (!query || typeof view?.matchMedia !== "function") {
+    return EMPTY_SUBSCRIBER;
   }
-  let match = matchMediaCache.get(query);
-  if (match) {
-    return match;
+  let queryCache = perWindowCache.get(view);
+  if (!queryCache) {
+    queryCache = /* @__PURE__ */ new Map();
+    perWindowCache.set(view, queryCache);
   }
-  if (typeof view?.matchMedia === "function") {
-    match = view.matchMedia(query);
-    matchMediaCache.set(query, match);
-    return match;
+  const cached = queryCache.get(query);
+  if (cached) {
+    return cached;
   }
-  return null;
+  const mediaQueryList = view.matchMedia(query);
+  const listeners = /* @__PURE__ */ new Set();
+  const notify = () => {
+    for (const listener of listeners) {
+      listener();
+    }
+  };
+  const subscriber = {
+    subscribe(onStoreChange) {
+      if (listeners.size === 0) {
+        mediaQueryList.addEventListener?.("change", notify);
+      }
+      listeners.add(onStoreChange);
+      return () => {
+        listeners.delete(onStoreChange);
+        if (listeners.size === 0) {
+          mediaQueryList.removeEventListener?.("change", notify);
+        }
+      };
+    },
+    getValue() {
+      return mediaQueryList.matches;
+    }
+  };
+  queryCache.set(query, subscriber);
+  return subscriber;
 }
 function useMediaQuery(query, view = window) {
-  const source = (0, import_element.useMemo)(() => {
-    const mediaQueryList = getMediaQueryList(view, query);
-    return {
-      subscribe(onStoreChange) {
-        if (!mediaQueryList) {
-          return () => {
-          };
-        }
-        mediaQueryList.addEventListener?.("change", onStoreChange);
-        return () => {
-          mediaQueryList.removeEventListener?.(
-            "change",
-            onStoreChange
-          );
-        };
-      },
-      getValue() {
-        return mediaQueryList?.matches ?? false;
-      }
-    };
-  }, [view, query]);
+  const source = getMQLSubscriber(view, query);
   return (0, import_element.useSyncExternalStore)(
     source.subscribe,
     source.getValue,

package/build/hooks/use-media-query/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/hooks/use-media-query/index.ts"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useMemo, useSyncExternalStore } from '@wordpress/element';\n\ntype MQLCache = Map< string, MediaQueryList >;\n\nconst perWindowCache = new WeakMap< Window, MQLCache >();\n\n/**\n * A new MediaQueryList object for the media query\n *\n * @param view    Window.\n * @param [query] Media Query.\n */\nfunction getMediaQueryList(\n\tview: Window,\n\tquery?: string\n): MediaQueryList | null {\n\tif ( ! query ) {\n\t\treturn null;\n\t}\n\n\tconst matchMediaCache: MQLCache = perWindowCache.get( view ) ?? new Map();\n\n\tif ( ! perWindowCache.has( view ) ) {\n\t\tperWindowCache.set( view, matchMediaCache );\n\t}\n\n\tlet match = matchMediaCache.get( query );\n\n\tif ( match ) {\n\t\treturn match;\n\t}\n\n\tif ( typeof view?.matchMedia === 'function' ) {\n\t\tmatch = view.matchMedia( query );\n\t\tmatchMediaCache.set( query, match );\n\t\treturn match;\n\t}\n\n\treturn null;\n}\n\n/**\n * Runs a media query and returns its value when it changes.\n *\n * @param [query] Media Query.\n * @param [view]  Window instance, else default to global window\n * @return return value of the media query.\n */\nexport default function useMediaQuery(\n\tquery?: string,\n\tview: Window = window\n): boolean {\n\tconst source = useMemo( () => {\n\t\tconst mediaQueryList = getMediaQueryList( view, query );\n\n\t\treturn {\n\t\t\tsubscribe( onStoreChange: any ) {\n\t\t\t\tif ( ! mediaQueryList ) {\n\t\t\t\t\treturn () => {};\n\t\t\t\t}\n\n\t\t\t\t// Avoid a fatal error when browsers don't support `addEventListener` on MediaQueryList.\n\t\t\t\tmediaQueryList.addEventListener?.( 'change', onStoreChange );\n\t\t\t\treturn () => {\n\t\t\t\t\tmediaQueryList.removeEventListener?.(\n\t\t\t\t\t\t'change',\n\t\t\t\t\t\tonStoreChange\n\t\t\t\t\t);\n\t\t\t\t};\n\t\t\t},\n\t\t\tgetValue() {\n\t\t\t\treturn mediaQueryList?.matches ?? false;\n\t\t\t},\n\t\t};\n\t}, [ view, query ] );\n\n\treturn useSyncExternalStore(\n\t\tsource.subscribe,\n\t\tsource.getValue,\n\t\t() => false\n\t);\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAA8C;AAI9C,IAAM,iBAAiB,oBAAI,QAA4B;AAQvD,SAAS,kBACR,MACA,OACwB;AACxB,MAAK,CAAE,OAAQ;AACd,WAAO;AAAA,EACR;AAEA,QAAM,kBAA4B,eAAe,IAAK,IAAK,KAAK,oBAAI,IAAI;AAExE,MAAK,CAAE,eAAe,IAAK,IAAK,GAAI;AACnC,mBAAe,IAAK,MAAM,eAAgB;AAAA,EAC3C;AAEA,MAAI,QAAQ,gBAAgB,IAAK,KAAM;AAEvC,MAAK,OAAQ;AACZ,WAAO;AAAA,EACR;AAEA,MAAK,OAAO,MAAM,eAAe,YAAa;AAC7C,YAAQ,KAAK,WAAY,KAAM;AAC/B,oBAAgB,IAAK,OAAO,KAAM;AAClC,WAAO;AAAA,EACR;AAEA,SAAO;AACR;AASe,SAAR,cACN,OACA,OAAe,QACL;AACV,QAAM,aAAS,wBAAS,MAAM;AAC7B,UAAM,iBAAiB,kBAAmB,MAAM,KAAM;AAEtD,WAAO;AAAA,MACN,UAAW,eAAqB;AAC/B,YAAK,CAAE,gBAAiB;AACvB,iBAAO,MAAM;AAAA,UAAC;AAAA,QACf;AAGA,uBAAe,mBAAoB,UAAU,aAAc;AAC3D,eAAO,MAAM;AACZ,yBAAe;AAAA,YACd;AAAA,YACA;AAAA,UACD;AAAA,QACD;AAAA,MACD;AAAA,MACA,WAAW;AACV,eAAO,gBAAgB,WAAW;AAAA,MACnC;AAAA,IACD;AAAA,EACD,GAAG,CAAE,MAAM,KAAM,CAAE;AAEnB,aAAO;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACP;AACD;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useSyncExternalStore } from '@wordpress/element';\n\ntype MQLSubscriber = {\n\tsubscribe: ( onStoreChange: () => void ) => () => void;\n\tgetValue: () => boolean;\n};\n\n// One subscriber per (window, query). The underlying MediaQueryList lives\n// inside the subscriber's closure; a single `change` listener fans out to\n// every React consumer via an in-JS `Set` to avoid the per-consumer\n// `addEventListener` cost (~85 ms during a large-post editor mount).\nconst perWindowCache = new WeakMap< Window, Map< string, MQLSubscriber > >();\n\nconst EMPTY_SUBSCRIBER: MQLSubscriber = {\n\tsubscribe: () => () => {},\n\tgetValue: () => false,\n};\n\nfunction getMQLSubscriber( view: Window, query?: string ): MQLSubscriber {\n\tif ( ! query || typeof view?.matchMedia !== 'function' ) {\n\t\treturn EMPTY_SUBSCRIBER;\n\t}\n\n\tlet queryCache = perWindowCache.get( view );\n\tif ( ! queryCache ) {\n\t\tqueryCache = new Map();\n\t\tperWindowCache.set( view, queryCache );\n\t}\n\n\tconst cached = queryCache.get( query );\n\tif ( cached ) {\n\t\treturn cached;\n\t}\n\n\tconst mediaQueryList = view.matchMedia( query );\n\tconst listeners = new Set< () => void >();\n\tconst notify = () => {\n\t\tfor ( const listener of listeners ) {\n\t\t\tlistener();\n\t\t}\n\t};\n\n\tconst subscriber: MQLSubscriber = {\n\t\tsubscribe( onStoreChange ) {\n\t\t\tif ( listeners.size === 0 ) {\n\t\t\t\t// Avoid a fatal error when browsers don't support `addEventListener` on MediaQueryList.\n\t\t\t\tmediaQueryList.addEventListener?.( 'change', notify );\n\t\t\t}\n\t\t\tlisteners.add( onStoreChange );\n\t\t\treturn () => {\n\t\t\t\tlisteners.delete( onStoreChange );\n\t\t\t\tif ( listeners.size === 0 ) {\n\t\t\t\t\tmediaQueryList.removeEventListener?.( 'change', notify );\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\t\tgetValue() {\n\t\t\treturn mediaQueryList.matches;\n\t\t},\n\t};\n\n\tqueryCache.set( query, subscriber );\n\treturn subscriber;\n}\n\n/**\n * Runs a media query and returns its value when it changes.\n *\n * @param [query] Media Query.\n * @param [view]  Window instance, else default to global window\n * @return return value of the media query.\n */\nexport default function useMediaQuery(\n\tquery?: string,\n\tview: Window = window\n): boolean {\n\tconst source = getMQLSubscriber( view, query );\n\n\treturn useSyncExternalStore(\n\t\tsource.subscribe,\n\t\tsource.getValue,\n\t\t() => false\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAqC;AAWrC,IAAM,iBAAiB,oBAAI,QAAgD;AAE3E,IAAM,mBAAkC;AAAA,EACvC,WAAW,MAAM,MAAM;AAAA,EAAC;AAAA,EACxB,UAAU,MAAM;AACjB;AAEA,SAAS,iBAAkB,MAAc,OAAgC;AACxE,MAAK,CAAE,SAAS,OAAO,MAAM,eAAe,YAAa;AACxD,WAAO;AAAA,EACR;AAEA,MAAI,aAAa,eAAe,IAAK,IAAK;AAC1C,MAAK,CAAE,YAAa;AACnB,iBAAa,oBAAI,IAAI;AACrB,mBAAe,IAAK,MAAM,UAAW;AAAA,EACtC;AAEA,QAAM,SAAS,WAAW,IAAK,KAAM;AACrC,MAAK,QAAS;AACb,WAAO;AAAA,EACR;AAEA,QAAM,iBAAiB,KAAK,WAAY,KAAM;AAC9C,QAAM,YAAY,oBAAI,IAAkB;AACxC,QAAM,SAAS,MAAM;AACpB,eAAY,YAAY,WAAY;AACnC,eAAS;AAAA,IACV;AAAA,EACD;AAEA,QAAM,aAA4B;AAAA,IACjC,UAAW,eAAgB;AAC1B,UAAK,UAAU,SAAS,GAAI;AAE3B,uBAAe,mBAAoB,UAAU,MAAO;AAAA,MACrD;AACA,gBAAU,IAAK,aAAc;AAC7B,aAAO,MAAM;AACZ,kBAAU,OAAQ,aAAc;AAChC,YAAK,UAAU,SAAS,GAAI;AAC3B,yBAAe,sBAAuB,UAAU,MAAO;AAAA,QACxD;AAAA,MACD;AAAA,IACD;AAAA,IACA,WAAW;AACV,aAAO,eAAe;AAAA,IACvB;AAAA,EACD;AAEA,aAAW,IAAK,OAAO,UAAW;AAClC,SAAO;AACR;AASe,SAAR,cACN,OACA,OAAe,QACL;AACV,QAAM,SAAS,iBAAkB,MAAM,KAAM;AAE7C,aAAO;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACP;AACD;",
   "names": []
 }

package/build/hooks/use-merge-refs/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/hooks/use-merge-refs/index.ts"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useRef, useCallback, useLayoutEffect } from '@wordpress/element';\nimport type { MutableRefObject, Ref, RefCallback } from 'react';\n\nfunction assignRef< T >( ref: Ref< T >, value: T ) {\n\tif ( typeof ref === 'function' ) {\n\t\tref( value );\n\t} else if ( ref && ref.hasOwnProperty( 'current' ) ) {\n\t\t( ref as MutableRefObject< T > ).current = value;\n\t}\n}\n\n/**\n * Merges refs into one ref callback.\n *\n * It also ensures that the merged ref callbacks are only called when they\n * change (as a result of a `useCallback` dependency update) OR when the ref\n * value changes, just as React does when passing a single ref callback to the\n * component.\n *\n * As expected, if you pass a new function on every render, the ref callback\n * will be called after every render.\n *\n * If you don't wish a ref callback to be called after every render, wrap it\n * with `useCallback( callback, dependencies )`. When a dependency changes, the\n * old ref callback will be called with `null` and the new ref callback will be\n * called with the same value.\n *\n * To make ref callbacks easier to use, you can also pass the result of\n * `useRefEffect`, which makes cleanup easier by allowing you to return a\n * cleanup function instead of handling `null`.\n *\n * It's also possible to _disable_ a ref (and its behaviour) by simply not\n * passing the ref.\n *\n * ```jsx\n * const ref = useRefEffect( ( node ) => {\n *   node.addEventListener( ... );\n *   return () => {\n *     node.removeEventListener( ... );\n *   };\n * }, [ ...dependencies ] );\n * const otherRef = useRef();\n * const mergedRefs useMergeRefs( [\n *   enabled && ref,\n *   otherRef,\n * ] );\n * return <div ref={ mergedRefs } />;\n * ```\n *\n * @param refs The refs to be merged.\n * @return The merged ref callback.\n */\nexport default function useMergeRefs< T >(\n\trefs: Ref< T >[]\n): RefCallback< T > {\n\tconst element = useRef( null );\n\tconst isAttachedRef = useRef( false );\n\tconst didElementChangeRef = useRef( false );\n\tconst previousRefsRef = useRef< Ref< T >[] >( [] );\n\tconst currentRefsRef = useRef( refs );\n\n\t// Update on render before the ref callback is called, so the ref callback\n\t// always has access to the current refs.\n\tcurrentRefsRef.current = refs;\n\n\t// If any of the refs change, call the previous ref with `null` and the new\n\t// ref with the node, except when the element changes in the same cycle, in\n\t// which case the ref callbacks will already have been called.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\tdidElementChangeRef.current === false &&\n\t\t\tisAttachedRef.current === true\n\t\t) {\n\t\t\trefs.forEach( ( ref, index ) => {\n\t\t\t\tconst previousRef = previousRefsRef.current[ index ];\n\t\t\t\tif ( ref !== previousRef ) {\n\t\t\t\t\tassignRef( previousRef, null );\n\t\t\t\t\tassignRef( ref, element.current );\n\t\t\t\t}\n\t\t\t} );\n\t\t}\n\n\t\tpreviousRefsRef.current = refs;\n\t}, refs );\n\n\t// No dependencies, must be reset after every render so ref callbacks are\n\t// correctly called after a ref change.\n\tuseLayoutEffect( () => {\n\t\tdidElementChangeRef.current = false;\n\t} );\n\n\t// There should be no dependencies so that `callback` is only called when\n\t// the node changes.\n\treturn useCallback( ( value: T | null ) => {\n\t\t// Update the element so it can be used when calling ref callbacks on a\n\t\t// dependency change.\n\t\tassignRef( element, value );\n\n\t\tdidElementChangeRef.current = true;\n\t\tisAttachedRef.current = value !== null;\n\n\t\t// When an element changes, the current ref callback should be called\n\t\t// with the new element and the previous one with `null`.\n\t\tconst refsToAssign = value\n\t\t\t? currentRefsRef.current\n\t\t\t: previousRefsRef.current;\n\n\t\t// Update the latest refs.\n\t\tfor ( const ref of refsToAssign ) {\n\t\t\tassignRef( ref, value );\n\t\t}\n\t}, [] );\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAqD;AAGrD,SAAS,UAAgB,KAAe,OAAW;AAClD,MAAK,OAAO,QAAQ,YAAa;AAChC,QAAK,KAAM;AAAA,EACZ,WAAY,OAAO,IAAI,eAAgB,SAAU,GAAI;AACpD,IAAE,IAA+B,UAAU;AAAA,EAC5C;AACD;AA2Ce,SAAR,aACN,MACmB;AACnB,QAAM,cAAU,uBAAQ,IAAK;AAC7B,QAAM,oBAAgB,uBAAQ,KAAM;AACpC,QAAM,0BAAsB,uBAAQ,KAAM;AAC1C,QAAM,sBAAkB,uBAAsB,CAAC,CAAE;AACjD,QAAM,qBAAiB,uBAAQ,IAAK;AAIpC,iBAAe,UAAU;AAKzB,sCAAiB,MAAM;AACtB,QACC,oBAAoB,YAAY,SAChC,cAAc,YAAY,MACzB;AACD,WAAK,QAAS,CAAE,KAAK,UAAW;AAC/B,cAAM,cAAc,gBAAgB,QAAS,KAAM;AACnD,YAAK,QAAQ,aAAc;AAC1B,oBAAW,aAAa,IAAK;AAC7B,oBAAW,KAAK,QAAQ,OAAQ;AAAA,QACjC;AAAA,MACD,CAAE;AAAA,IACH;AAEA,oBAAgB,UAAU;AAAA,EAC3B,GAAG,IAAK;AAIR,sCAAiB,MAAM;AACtB,wBAAoB,UAAU;AAAA,EAC/B,CAAE;AAIF,aAAO,4BAAa,CAAE,UAAqB;AAG1C,cAAW,SAAS,KAAM;AAE1B,wBAAoB,UAAU;AAC9B,kBAAc,UAAU,UAAU;AAIlC,UAAM,eAAe,QAClB,eAAe,UACf,gBAAgB;AAGnB,eAAY,OAAO,cAAe;AACjC,gBAAW,KAAK,KAAM;AAAA,IACvB;AAAA,EACD,GAAG,CAAC,CAAE;AACP;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useRef, useCallback, useLayoutEffect } from '@wordpress/element';\nimport type { Ref, RefCallback } from 'react';\n\nfunction assignRef< T >( ref: Ref< T >, value: T ) {\n\tif ( typeof ref === 'function' ) {\n\t\tref( value );\n\t} else if ( ref && ref.hasOwnProperty( 'current' ) ) {\n\t\tref.current = value;\n\t}\n}\n\n/**\n * Merges refs into one ref callback.\n *\n * It also ensures that the merged ref callbacks are only called when they\n * change (as a result of a `useCallback` dependency update) OR when the ref\n * value changes, just as React does when passing a single ref callback to the\n * component.\n *\n * As expected, if you pass a new function on every render, the ref callback\n * will be called after every render.\n *\n * If you don't wish a ref callback to be called after every render, wrap it\n * with `useCallback( callback, dependencies )`. When a dependency changes, the\n * old ref callback will be called with `null` and the new ref callback will be\n * called with the same value.\n *\n * To make ref callbacks easier to use, you can also pass the result of\n * `useRefEffect`, which makes cleanup easier by allowing you to return a\n * cleanup function instead of handling `null`.\n *\n * It's also possible to _disable_ a ref (and its behaviour) by simply not\n * passing the ref.\n *\n * ```jsx\n * const ref = useRefEffect( ( node ) => {\n *   node.addEventListener( ... );\n *   return () => {\n *     node.removeEventListener( ... );\n *   };\n * }, [ ...dependencies ] );\n * const otherRef = useRef();\n * const mergedRefs useMergeRefs( [\n *   enabled && ref,\n *   otherRef,\n * ] );\n * return <div ref={ mergedRefs } />;\n * ```\n *\n * @param refs The refs to be merged.\n * @return The merged ref callback.\n */\nexport default function useMergeRefs< T >(\n\trefs: Ref< T >[]\n): RefCallback< T > {\n\tconst element = useRef( null );\n\tconst isAttachedRef = useRef( false );\n\tconst didElementChangeRef = useRef( false );\n\tconst previousRefsRef = useRef< Ref< T >[] >( [] );\n\tconst currentRefsRef = useRef( refs );\n\n\t// Update on render before the ref callback is called, so the ref callback\n\t// always has access to the current refs.\n\tcurrentRefsRef.current = refs;\n\n\t// If any of the refs change, call the previous ref with `null` and the new\n\t// ref with the node, except when the element changes in the same cycle, in\n\t// which case the ref callbacks will already have been called.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\tdidElementChangeRef.current === false &&\n\t\t\tisAttachedRef.current === true\n\t\t) {\n\t\t\trefs.forEach( ( ref, index ) => {\n\t\t\t\tconst previousRef = previousRefsRef.current[ index ];\n\t\t\t\tif ( ref !== previousRef ) {\n\t\t\t\t\tassignRef( previousRef, null );\n\t\t\t\t\tassignRef( ref, element.current );\n\t\t\t\t}\n\t\t\t} );\n\t\t}\n\n\t\tpreviousRefsRef.current = refs;\n\t}, refs );\n\n\t// No dependencies, must be reset after every render so ref callbacks are\n\t// correctly called after a ref change.\n\tuseLayoutEffect( () => {\n\t\tdidElementChangeRef.current = false;\n\t} );\n\n\t// There should be no dependencies so that `callback` is only called when\n\t// the node changes.\n\treturn useCallback( ( value: T | null ) => {\n\t\t// Update the element so it can be used when calling ref callbacks on a\n\t\t// dependency change.\n\t\tassignRef( element, value );\n\n\t\tdidElementChangeRef.current = true;\n\t\tisAttachedRef.current = value !== null;\n\n\t\t// When an element changes, the current ref callback should be called\n\t\t// with the new element and the previous one with `null`.\n\t\tconst refsToAssign = value\n\t\t\t? currentRefsRef.current\n\t\t\t: previousRefsRef.current;\n\n\t\t// Update the latest refs.\n\t\tfor ( const ref of refsToAssign ) {\n\t\t\tassignRef( ref, value );\n\t\t}\n\t}, [] );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAqD;AAGrD,SAAS,UAAgB,KAAe,OAAW;AAClD,MAAK,OAAO,QAAQ,YAAa;AAChC,QAAK,KAAM;AAAA,EACZ,WAAY,OAAO,IAAI,eAAgB,SAAU,GAAI;AACpD,QAAI,UAAU;AAAA,EACf;AACD;AA2Ce,SAAR,aACN,MACmB;AACnB,QAAM,cAAU,uBAAQ,IAAK;AAC7B,QAAM,oBAAgB,uBAAQ,KAAM;AACpC,QAAM,0BAAsB,uBAAQ,KAAM;AAC1C,QAAM,sBAAkB,uBAAsB,CAAC,CAAE;AACjD,QAAM,qBAAiB,uBAAQ,IAAK;AAIpC,iBAAe,UAAU;AAKzB,sCAAiB,MAAM;AACtB,QACC,oBAAoB,YAAY,SAChC,cAAc,YAAY,MACzB;AACD,WAAK,QAAS,CAAE,KAAK,UAAW;AAC/B,cAAM,cAAc,gBAAgB,QAAS,KAAM;AACnD,YAAK,QAAQ,aAAc;AAC1B,oBAAW,aAAa,IAAK;AAC7B,oBAAW,KAAK,QAAQ,OAAQ;AAAA,QACjC;AAAA,MACD,CAAE;AAAA,IACH;AAEA,oBAAgB,UAAU;AAAA,EAC3B,GAAG,IAAK;AAIR,sCAAiB,MAAM;AACtB,wBAAoB,UAAU;AAAA,EAC/B,CAAE;AAIF,aAAO,4BAAa,CAAE,UAAqB;AAG1C,cAAW,SAAS,KAAM;AAE1B,wBAAoB,UAAU;AAC9B,kBAAc,UAAU,UAAU;AAIlC,UAAM,eAAe,QAClB,eAAe,UACf,gBAAgB;AAGnB,eAAY,OAAO,cAAe;AACjC,gBAAW,KAAK,KAAM;AAAA,IACvB;AAAA,EACD,GAAG,CAAC,CAAE;AACP;",
   "names": []
 }

package/build/hooks/use-resize-observer/use-resize-observer.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/hooks/use-resize-observer/use-resize-observer.ts"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport useEvent from '../use-event';\n\n// This is the current implementation of `useResizeObserver`.\n//\n// The legacy implementation is still supported for backwards compatibility.\n// This is achieved by overloading the exported function with both signatures,\n// and detecting which API is being used at runtime.\nexport function useResizeObserver< T extends HTMLElement >(\n\tcallback: ResizeObserverCallback,\n\tresizeObserverOptions: ResizeObserverOptions = {}\n): ( element?: T | null ) => void {\n\tconst callbackEvent = useEvent( callback );\n\n\tconst observedElementRef = useRef< T | null >( null );\n\tconst resizeObserverRef = useRef< ResizeObserver >( undefined );\n\treturn useEvent( ( element?: T | null ) => {\n\t\tif ( element === observedElementRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Set up `ResizeObserver`.\n\t\tresizeObserverRef.current ??= new ResizeObserver( callbackEvent );\n\t\tconst { current: resizeObserver } = resizeObserverRef;\n\n\t\t// Unobserve previous element.\n\t\tif ( observedElementRef.current ) {\n\t\t\tresizeObserver.unobserve( observedElementRef.current );\n\t\t}\n\n\t\t// Observe new element.\n\t\tobservedElementRef.current = element ?? null;\n\t\tif ( element ) {\n\t\t\tresizeObserver.observe( element, resizeObserverOptions );\n\t\t}\n\t} );\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAuB;AAIvB,uBAAqB;AAOd,SAAS,kBACf,UACA,wBAA+C,CAAC,GACf;AACjC,QAAM,oBAAgB,iBAAAA,SAAU,QAAS;AAEzC,QAAM,yBAAqB,uBAAoB,IAAK;AACpD,QAAM,wBAAoB,uBAA0B,MAAU;AAC9D,aAAO,iBAAAA,SAAU,CAAE,YAAwB;AAC1C,QAAK,YAAY,mBAAmB,SAAU;AAC7C;AAAA,IACD;AAGA,sBAAkB,YAAY,IAAI,eAAgB,aAAc;AAChE,UAAM,EAAE,SAAS,eAAe,IAAI;AAGpC,QAAK,mBAAmB,SAAU;AACjC,qBAAe,UAAW,mBAAmB,OAAQ;AAAA,IACtD;AAGA,uBAAmB,UAAU,WAAW;AACxC,QAAK,SAAU;AACd,qBAAe,QAAS,SAAS,qBAAsB;AAAA,IACxD;AAAA,EACD,CAAE;AACH;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport useEvent from '../use-event';\n\n// This is the current implementation of `useResizeObserver`.\n//\n// The legacy implementation is still supported for backwards compatibility.\n// This is achieved by overloading the exported function with both signatures,\n// and detecting which API is being used at runtime.\nexport function useResizeObserver< T extends HTMLElement >(\n\tcallback: ResizeObserverCallback,\n\tresizeObserverOptions: ResizeObserverOptions = {}\n): ( element?: T | null ) => void {\n\tconst callbackEvent = useEvent( callback );\n\n\tconst observedElementRef = useRef< T >( null );\n\tconst resizeObserverRef = useRef< ResizeObserver >( undefined );\n\treturn useEvent( ( element?: T | null ) => {\n\t\tif ( element === observedElementRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Set up `ResizeObserver`.\n\t\tresizeObserverRef.current ??= new ResizeObserver( callbackEvent );\n\t\tconst { current: resizeObserver } = resizeObserverRef;\n\n\t\t// Unobserve previous element.\n\t\tif ( observedElementRef.current ) {\n\t\t\tresizeObserver.unobserve( observedElementRef.current );\n\t\t}\n\n\t\t// Observe new element.\n\t\tobservedElementRef.current = element ?? null;\n\t\tif ( element ) {\n\t\t\tresizeObserver.observe( element, resizeObserverOptions );\n\t\t}\n\t} );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAuB;AAIvB,uBAAqB;AAOd,SAAS,kBACf,UACA,wBAA+C,CAAC,GACf;AACjC,QAAM,oBAAgB,iBAAAA,SAAU,QAAS;AAEzC,QAAM,yBAAqB,uBAAa,IAAK;AAC7C,QAAM,wBAAoB,uBAA0B,MAAU;AAC9D,aAAO,iBAAAA,SAAU,CAAE,YAAwB;AAC1C,QAAK,YAAY,mBAAmB,SAAU;AAC7C;AAAA,IACD;AAGA,sBAAkB,YAAY,IAAI,eAAgB,aAAc;AAChE,UAAM,EAAE,SAAS,eAAe,IAAI;AAGpC,QAAK,mBAAmB,SAAU;AACjC,qBAAe,UAAW,mBAAmB,OAAQ;AAAA,IACtD;AAGA,uBAAmB,UAAU,WAAW;AACxC,QAAK,SAAU;AACd,qBAAe,QAAS,SAAS,qBAAsB;AAAA,IACxD;AAAA,EACD,CAAE;AACH;",
   "names": ["useEvent"]
 }

package/build/index.cjs

@@ -39,6 +39,7 @@ __export(index_exports, {
   compose: () => import_compose.default,
   ifCondition: () => import_if_condition.default,
   pipe: () => import_pipe.default,
+  privateApis: () => import_private_apis.privateApis,
   pure: () => import_pure.default,
   useAsyncList: () => import_use_async_list.default,
   useConstrainedTabbing: () => import_use_constrained_tabbing.default,
@@ -75,6 +76,7 @@ __reExport(index_exports, require("./utils/create-higher-order-component/index.c
 __reExport(index_exports, require("./utils/debounce/index.cjs"), module.exports);
 __reExport(index_exports, require("./utils/throttle/index.cjs"), module.exports);
 __reExport(index_exports, require("./utils/observable-map/index.cjs"), module.exports);
+var import_private_apis = require("./private-apis.cjs");
 var import_compose = __toESM(require("./higher-order/compose.cjs"));
 var import_pipe = __toESM(require("./higher-order/pipe.cjs"));
 var import_if_condition = __toESM(require("./higher-order/if-condition/index.cjs"));
@@ -123,6 +125,7 @@ var import_use_observable_value = __toESM(require("./hooks/use-observable-value/
   compose,
   ifCondition,
   pipe,
+  privateApis,
   pure,
   useAsyncList,
   useConstrainedTabbing,

package/build/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/index.js"],
-  "sourcesContent": ["// The `createHigherOrderComponent` helper and helper types.\nexport * from './utils/create-higher-order-component';\n// The `debounce` helper and its types.\nexport * from './utils/debounce';\n// The `throttle` helper and its types.\nexport * from './utils/throttle';\n// The `ObservableMap` data structure\nexport * from './utils/observable-map';\n\n// The `compose` and `pipe` helpers (inspired by `flowRight` and `flow` from Lodash).\nexport { default as compose } from './higher-order/compose';\nexport { default as pipe } from './higher-order/pipe';\n\n// Higher-order components.\nexport { default as ifCondition } from './higher-order/if-condition';\nexport { default as pure } from './higher-order/pure';\nexport { default as withGlobalEvents } from './higher-order/with-global-events';\nexport { default as withInstanceId } from './higher-order/with-instance-id';\nexport { default as withSafeTimeout } from './higher-order/with-safe-timeout';\nexport { default as withState } from './higher-order/with-state';\n\n// Hooks.\nexport { default as useConstrainedTabbing } from './hooks/use-constrained-tabbing';\nexport { default as useCopyOnClick } from './hooks/use-copy-on-click';\nexport { default as useCopyToClipboard } from './hooks/use-copy-to-clipboard';\nexport { default as __experimentalUseDialog } from './hooks/use-dialog';\nexport { default as useDisabled } from './hooks/use-disabled';\nexport { default as useEvent } from './hooks/use-event';\nexport { default as __experimentalUseDragging } from './hooks/use-dragging';\nexport { useFocusOnMount } from './hooks/use-focus-on-mount';\nexport { default as __experimentalUseFocusOutside } from './hooks/use-focus-outside';\nexport { default as useFocusReturn } from './hooks/use-focus-return';\nexport { default as useInstanceId } from './hooks/use-instance-id';\nexport { default as useIsomorphicLayoutEffect } from './hooks/use-isomorphic-layout-effect';\nexport { default as useKeyboardShortcut } from './hooks/use-keyboard-shortcut';\nexport { default as useMediaQuery } from './hooks/use-media-query';\nexport { default as usePrevious } from './hooks/use-previous';\nexport { default as useReducedMotion } from './hooks/use-reduced-motion';\nexport { default as useStateWithHistory } from './hooks/use-state-with-history';\nexport { default as useViewportMatch } from './hooks/use-viewport-match';\nexport { default as useResizeObserver } from './hooks/use-resize-observer';\nexport { default as useAsyncList } from './hooks/use-async-list';\nexport { default as useWarnOnChange } from './hooks/use-warn-on-change';\nexport { default as useDebounce } from './hooks/use-debounce';\nexport { default as useDebouncedInput } from './hooks/use-debounced-input';\nexport { default as useThrottle } from './hooks/use-throttle';\nexport { default as useMergeRefs } from './hooks/use-merge-refs';\nexport { default as useRefEffect } from './hooks/use-ref-effect';\nexport { default as __experimentalUseDropZone } from './hooks/use-drop-zone';\nexport { default as useFocusableIframe } from './hooks/use-focusable-iframe';\nexport { default as __experimentalUseFixedWindowList } from './hooks/use-fixed-window-list';\nexport { default as useObservableValue } from './hooks/use-observable-value';\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,0BAAc,4DADd;AAGA,0BAAc,uCAHd;AAKA,0BAAc,uCALd;AAOA,0BAAc,6CAPd;AAUA,qBAAmC;AACnC,kBAAgC;AAGhC,0BAAuC;AACvC,kBAAgC;AAChC,gCAA4C;AAC5C,8BAA0C;AAC1C,+BAA2C;AAC3C,wBAAqC;AAGrC,qCAAiD;AACjD,+BAA0C;AAC1C,mCAA8C;AAC9C,wBAAmD;AACnD,0BAAuC;AACvC,uBAAoC;AACpC,0BAAqD;AACrD,gCAAgC;AAChC,+BAAyD;AACzD,8BAA0C;AAC1C,6BAAyC;AACzC,0CAAqD;AACrD,mCAA+C;AAC/C,6BAAyC;AACzC,0BAAuC;AACvC,gCAA4C;AAC5C,oCAA+C;AAC/C,gCAA4C;AAC5C,iCAA6C;AAC7C,4BAAwC;AACxC,gCAA2C;AAC3C,0BAAuC;AACvC,iCAA6C;AAC7C,0BAAuC;AACvC,4BAAwC;AACxC,4BAAwC;AACxC,2BAAqD;AACrD,kCAA8C;AAC9C,mCAA4D;AAC5D,kCAA8C;",
+  "sourcesContent": ["// The `createHigherOrderComponent` helper and helper types.\nexport * from './utils/create-higher-order-component';\n// The `debounce` helper and its types.\nexport * from './utils/debounce';\n// The `throttle` helper and its types.\nexport * from './utils/throttle';\n// The `ObservableMap` data structure\nexport * from './utils/observable-map';\n\n// Private APIs.\nexport { privateApis } from './private-apis';\n\n// The `compose` and `pipe` helpers (inspired by `flowRight` and `flow` from Lodash).\nexport { default as compose } from './higher-order/compose';\nexport { default as pipe } from './higher-order/pipe';\n\n// Higher-order components.\nexport { default as ifCondition } from './higher-order/if-condition';\nexport { default as pure } from './higher-order/pure';\nexport { default as withGlobalEvents } from './higher-order/with-global-events';\nexport { default as withInstanceId } from './higher-order/with-instance-id';\nexport { default as withSafeTimeout } from './higher-order/with-safe-timeout';\nexport { default as withState } from './higher-order/with-state';\n\n// Hooks.\nexport { default as useConstrainedTabbing } from './hooks/use-constrained-tabbing';\nexport { default as useCopyOnClick } from './hooks/use-copy-on-click';\nexport { default as useCopyToClipboard } from './hooks/use-copy-to-clipboard';\nexport { default as __experimentalUseDialog } from './hooks/use-dialog';\nexport { default as useDisabled } from './hooks/use-disabled';\nexport { default as useEvent } from './hooks/use-event';\nexport { default as __experimentalUseDragging } from './hooks/use-dragging';\nexport { useFocusOnMount } from './hooks/use-focus-on-mount';\nexport { default as __experimentalUseFocusOutside } from './hooks/use-focus-outside';\nexport { default as useFocusReturn } from './hooks/use-focus-return';\nexport { default as useInstanceId } from './hooks/use-instance-id';\nexport { default as useIsomorphicLayoutEffect } from './hooks/use-isomorphic-layout-effect';\nexport { default as useKeyboardShortcut } from './hooks/use-keyboard-shortcut';\nexport { default as useMediaQuery } from './hooks/use-media-query';\nexport { default as usePrevious } from './hooks/use-previous';\nexport { default as useReducedMotion } from './hooks/use-reduced-motion';\nexport { default as useStateWithHistory } from './hooks/use-state-with-history';\nexport { default as useViewportMatch } from './hooks/use-viewport-match';\nexport { default as useResizeObserver } from './hooks/use-resize-observer';\nexport { default as useAsyncList } from './hooks/use-async-list';\nexport { default as useWarnOnChange } from './hooks/use-warn-on-change';\nexport { default as useDebounce } from './hooks/use-debounce';\nexport { default as useDebouncedInput } from './hooks/use-debounced-input';\nexport { default as useThrottle } from './hooks/use-throttle';\nexport { default as useMergeRefs } from './hooks/use-merge-refs';\nexport { default as useRefEffect } from './hooks/use-ref-effect';\nexport { default as __experimentalUseDropZone } from './hooks/use-drop-zone';\nexport { default as useFocusableIframe } from './hooks/use-focusable-iframe';\nexport { default as __experimentalUseFixedWindowList } from './hooks/use-fixed-window-list';\nexport { default as useObservableValue } from './hooks/use-observable-value';\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,0BAAc,4DADd;AAGA,0BAAc,uCAHd;AAKA,0BAAc,uCALd;AAOA,0BAAc,6CAPd;AAUA,0BAA4B;AAG5B,qBAAmC;AACnC,kBAAgC;AAGhC,0BAAuC;AACvC,kBAAgC;AAChC,gCAA4C;AAC5C,8BAA0C;AAC1C,+BAA2C;AAC3C,wBAAqC;AAGrC,qCAAiD;AACjD,+BAA0C;AAC1C,mCAA8C;AAC9C,wBAAmD;AACnD,0BAAuC;AACvC,uBAAoC;AACpC,0BAAqD;AACrD,gCAAgC;AAChC,+BAAyD;AACzD,8BAA0C;AAC1C,6BAAyC;AACzC,0CAAqD;AACrD,mCAA+C;AAC/C,6BAAyC;AACzC,0BAAuC;AACvC,gCAA4C;AAC5C,oCAA+C;AAC/C,gCAA4C;AAC5C,iCAA6C;AAC7C,4BAAwC;AACxC,gCAA2C;AAC3C,0BAAuC;AACvC,iCAA6C;AAC7C,0BAAuC;AACvC,4BAAwC;AACxC,4BAAwC;AACxC,2BAAqD;AACrD,kCAA8C;AAC9C,mCAA4D;AAC5D,kCAA8C;",
   "names": []
 }

package/build/lock-unlock.cjs

@@ -0,0 +1,37 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/compose/src/lock-unlock.ts
+var lock_unlock_exports = {};
+__export(lock_unlock_exports, {
+  lock: () => lock,
+  unlock: () => unlock
+});
+module.exports = __toCommonJS(lock_unlock_exports);
+var import_private_apis = require("@wordpress/private-apis");
+var { lock, unlock } = (0, import_private_apis.__dangerousOptInToUnstableAPIsOnlyForCoreModules)(
+  "I acknowledge private features are not for use in themes or plugins and doing so will break in the next version of WordPress.",
+  "@wordpress/compose"
+);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  lock,
+  unlock
+});
+//# sourceMappingURL=lock-unlock.cjs.map

package/build/lock-unlock.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/lock-unlock.ts"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/private-apis';\n\nexport const { lock, unlock } =\n\t__dangerousOptInToUnstableAPIsOnlyForCoreModules(\n\t\t'I acknowledge private features are not for use in themes or plugins and doing so will break in the next version of WordPress.',\n\t\t'@wordpress/compose'\n\t);\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,0BAAiE;AAE1D,IAAM,EAAE,MAAM,OAAO,QAC3B;AAAA,EACC;AAAA,EACA;AACD;",
+  "names": []
+}