@wordpress/compose 5.6.0 → 5.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +18 -0
- package/README.md +37 -11
- package/build/higher-order/if-condition/index.js +14 -10
- package/build/higher-order/if-condition/index.js.map +1 -1
- package/build/higher-order/pure/index.js +9 -5
- package/build/higher-order/pure/index.js.map +1 -1
- package/build/higher-order/with-global-events/index.js +2 -2
- package/build/higher-order/with-global-events/index.js.map +1 -1
- package/build/higher-order/with-instance-id/index.js +3 -3
- package/build/higher-order/with-instance-id/index.js.map +1 -1
- package/build/higher-order/with-preferred-color-scheme/index.native.js +2 -2
- package/build/higher-order/with-preferred-color-scheme/index.native.js.map +1 -1
- package/build/higher-order/with-safe-timeout/index.js +10 -7
- package/build/higher-order/with-safe-timeout/index.js.map +1 -1
- package/build/higher-order/with-state/index.js +2 -2
- package/build/higher-order/with-state/index.js.map +1 -1
- package/build/hooks/use-copy-to-clipboard/index.js +1 -1
- package/build/hooks/use-copy-to-clipboard/index.js.map +1 -1
- package/build/hooks/use-debounce/index.js.map +1 -1
- package/build/hooks/use-dialog/index.js.map +1 -1
- package/build/hooks/use-disabled/index.js +77 -7
- package/build/hooks/use-disabled/index.js.map +1 -1
- package/build/hooks/use-focus-on-mount/index.js +6 -1
- package/build/hooks/use-focus-on-mount/index.js.map +1 -1
- package/build/hooks/use-focus-return/index.js.map +1 -1
- package/build/hooks/use-keyboard-shortcut/index.js.map +1 -1
- package/build/hooks/use-merge-refs/index.js.map +1 -1
- package/build/hooks/use-ref-effect/index.js.map +1 -1
- package/build/hooks/use-resize-observer/index.js +224 -13
- package/build/hooks/use-resize-observer/index.js.map +1 -1
- package/build/hooks/use-resize-observer/index.native.js +0 -2
- package/build/hooks/use-resize-observer/index.native.js.map +1 -1
- package/build/hooks/use-throttle/index.js.map +1 -1
- package/build/index.js +54 -13
- package/build/index.js.map +1 -1
- package/build/index.native.js +48 -7
- package/build/index.native.js.map +1 -1
- package/build/utils/create-higher-order-component/index.js +19 -5
- package/build/utils/create-higher-order-component/index.js.map +1 -1
- package/build-module/higher-order/if-condition/index.js +13 -7
- package/build-module/higher-order/if-condition/index.js.map +1 -1
- package/build-module/higher-order/pure/index.js +10 -9
- package/build-module/higher-order/pure/index.js.map +1 -1
- package/build-module/higher-order/with-global-events/index.js +1 -1
- package/build-module/higher-order/with-global-events/index.js.map +1 -1
- package/build-module/higher-order/with-instance-id/index.js +3 -3
- package/build-module/higher-order/with-instance-id/index.js.map +1 -1
- package/build-module/higher-order/with-preferred-color-scheme/index.native.js +1 -1
- package/build-module/higher-order/with-preferred-color-scheme/index.native.js.map +1 -1
- package/build-module/higher-order/with-safe-timeout/index.js +9 -7
- package/build-module/higher-order/with-safe-timeout/index.js.map +1 -1
- package/build-module/higher-order/with-state/index.js +1 -1
- package/build-module/higher-order/with-state/index.js.map +1 -1
- package/build-module/hooks/use-copy-to-clipboard/index.js +1 -1
- package/build-module/hooks/use-copy-to-clipboard/index.js.map +1 -1
- package/build-module/hooks/use-debounce/index.js.map +1 -1
- package/build-module/hooks/use-dialog/index.js.map +1 -1
- package/build-module/hooks/use-disabled/index.js +78 -7
- package/build-module/hooks/use-disabled/index.js.map +1 -1
- package/build-module/hooks/use-focus-on-mount/index.js +6 -1
- package/build-module/hooks/use-focus-on-mount/index.js.map +1 -1
- package/build-module/hooks/use-focus-return/index.js.map +1 -1
- package/build-module/hooks/use-keyboard-shortcut/index.js.map +1 -1
- package/build-module/hooks/use-merge-refs/index.js.map +1 -1
- package/build-module/hooks/use-ref-effect/index.js.map +1 -1
- package/build-module/hooks/use-resize-observer/index.js +226 -9
- package/build-module/hooks/use-resize-observer/index.js.map +1 -1
- package/build-module/hooks/use-resize-observer/index.native.js +0 -2
- package/build-module/hooks/use-resize-observer/index.native.js.map +1 -1
- package/build-module/hooks/use-throttle/index.js.map +1 -1
- package/build-module/index.js +3 -3
- package/build-module/index.js.map +1 -1
- package/build-module/index.native.js +3 -2
- package/build-module/index.native.js.map +1 -1
- package/build-module/utils/create-higher-order-component/index.js +18 -4
- package/build-module/utils/create-higher-order-component/index.js.map +1 -1
- package/build-types/higher-order/if-condition/index.d.ts +5 -2
- package/build-types/higher-order/if-condition/index.d.ts.map +1 -1
- package/build-types/higher-order/pure/index.d.ts +1 -1
- package/build-types/higher-order/pure/index.d.ts.map +1 -1
- package/build-types/higher-order/with-global-events/index.d.ts.map +1 -1
- package/build-types/higher-order/with-instance-id/index.d.ts +8 -4
- package/build-types/higher-order/with-instance-id/index.d.ts.map +1 -1
- package/build-types/higher-order/with-safe-timeout/index.d.ts +37 -4
- package/build-types/higher-order/with-safe-timeout/index.d.ts.map +1 -1
- package/build-types/hooks/use-debounce/index.d.ts.map +1 -1
- package/build-types/hooks/use-dialog/index.d.ts.map +1 -1
- package/build-types/hooks/use-disabled/index.d.ts +6 -2
- package/build-types/hooks/use-disabled/index.d.ts.map +1 -1
- package/build-types/hooks/use-focus-on-mount/index.d.ts.map +1 -1
- package/build-types/hooks/use-focus-return/index.d.ts.map +1 -1
- package/build-types/hooks/use-merge-refs/index.d.ts.map +1 -1
- package/build-types/hooks/use-ref-effect/index.d.ts +1 -1
- package/build-types/hooks/use-ref-effect/index.d.ts.map +1 -1
- package/build-types/hooks/use-resize-observer/index.d.ts +32 -2
- package/build-types/hooks/use-resize-observer/index.d.ts.map +1 -1
- package/build-types/hooks/use-throttle/index.d.ts.map +1 -1
- package/build-types/index.d.ts +2 -2
- package/build-types/utils/create-higher-order-component/index.d.ts +5 -12
- package/build-types/utils/create-higher-order-component/index.d.ts.map +1 -1
- package/package.json +8 -9
- package/src/higher-order/if-condition/index.tsx +11 -7
- package/src/higher-order/pure/index.tsx +29 -31
- package/src/higher-order/with-global-events/index.js +4 -2
- package/src/higher-order/with-global-events/test/index.js +2 -2
- package/src/higher-order/with-instance-id/index.tsx +19 -10
- package/src/higher-order/with-preferred-color-scheme/index.native.js +1 -1
- package/src/higher-order/with-safe-timeout/index.tsx +22 -19
- package/src/higher-order/with-state/index.js +1 -1
- package/src/hooks/use-copy-to-clipboard/index.js +1 -1
- package/src/hooks/use-debounce/index.js +4 -5
- package/src/hooks/use-dialog/index.js +13 -12
- package/src/hooks/use-disabled/index.js +139 -50
- package/src/hooks/use-focus-on-mount/index.js +6 -1
- package/src/hooks/use-focus-return/index.js +3 -1
- package/src/hooks/use-keyboard-shortcut/index.js +1 -1
- package/src/hooks/use-merge-refs/index.js +2 -1
- package/src/hooks/use-ref-effect/index.ts +2 -2
- package/src/hooks/use-resize-observer/index.native.js +0 -2
- package/src/hooks/use-resize-observer/index.tsx +362 -0
- package/src/hooks/use-throttle/index.js +4 -5
- package/src/index.js +3 -3
- package/src/index.native.js +3 -2
- package/src/utils/create-higher-order-component/index.ts +30 -27
- package/src/utils/create-higher-order-component/test/index.js +1 -1
- package/tsconfig.json +2 -4
- package/tsconfig.tsbuildinfo +1 -1
- package/src/hooks/use-resize-observer/index.js +0 -31
|
@@ -36,7 +36,7 @@ function useUpdatedRef(value) {
|
|
|
36
36
|
|
|
37
37
|
|
|
38
38
|
export default function useCopyToClipboard(text, onSuccess) {
|
|
39
|
-
// Store the dependencies as refs and
|
|
39
|
+
// Store the dependencies as refs and continuously update them so they're
|
|
40
40
|
// fresh when the callback is called.
|
|
41
41
|
const textRef = useUpdatedRef(text);
|
|
42
42
|
const onSuccessRef = useUpdatedRef(onSuccess);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/compose/src/hooks/use-copy-to-clipboard/index.js"],"names":["Clipboard","useRef","useRefEffect","useUpdatedRef","value","ref","current","useCopyToClipboard","text","onSuccess","textRef","onSuccessRef","node","clipboard","on","clearSelection","focus","destroy"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,SAAP,MAAsB,WAAtB;AAEA;AACA;AACA;;AACA,SAASC,MAAT,QAAuB,oBAAvB;AAEA;AACA;AACA;;AACA,OAAOC,YAAP,MAAyB,mBAAzB;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,aAAT,CAAwBC,KAAxB,EAAgC;AAC/B,QAAMC,GAAG,GAAGJ,MAAM,CAAEG,KAAF,CAAlB;AACAC,EAAAA,GAAG,CAACC,OAAJ,GAAcF,KAAd;AACA,SAAOC,GAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,eAAe,SAASE,kBAAT,CAA6BC,IAA7B,EAAmCC,SAAnC,EAA+C;AAC7D;AACA;AACA,QAAMC,OAAO,GAAGP,aAAa,CAAEK,IAAF,CAA7B;AACA,QAAMG,YAAY,GAAGR,aAAa,CAAEM,SAAF,CAAlC;AACA,SAAOP,YAAY,CAAIU,IAAF,IAAY;AAChC;AACA,UAAMC,SAAS,GAAG,IAAIb,SAAJ,CAAeY,IAAf,EAAqB;AACtCJ,MAAAA,IAAI,GAAG;AACN,eAAO,OAAOE,OAAO,CAACJ,OAAf,KAA2B,UAA3B,GACJI,OAAO,CAACJ,OAAR,EADI,GAEJI,OAAO,CAACJ,OAAR,IAAmB,EAFtB;AAGA;;AALqC,KAArB,CAAlB;AAQAO,IAAAA,SAAS,CAACC,EAAV,CAAc,SAAd,EAAyB,QAA0B;AAAA,UAAxB;AAAEC,QAAAA;AAAF,OAAwB;AAClD;AACA;AACA;AACAA,MAAAA,cAAc,GAJoC,CAKlD;AACA;;AACAH,MAAAA,IAAI,CAACI,KAAL;;AAEA,UAAKL,YAAY,CAACL,OAAlB,EAA4B;AAC3BK,QAAAA,YAAY,CAACL,OAAb;AACA;AACD,KAZD;AAcA,WAAO,MAAM;AACZO,MAAAA,SAAS,CAACI,OAAV;AACA,KAFD;AAGA,GA3BkB,EA2BhB,EA3BgB,CAAnB;AA4BA","sourcesContent":["/**\n * External dependencies\n */\nimport Clipboard from 'clipboard';\n\n/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\n\n/**\n * @template T\n * @param {T} value\n * @return {import('react').RefObject<T>} The updated ref\n */\nfunction useUpdatedRef( value ) {\n\tconst ref = useRef( value );\n\tref.current = value;\n\treturn ref;\n}\n\n/**\n * Copies the given text to the clipboard when the element is clicked.\n *\n * @template {HTMLElement} TElementType\n * @param {string | (() => string)} text The text to copy. Use a function if not\n * already available and expensive to compute.\n * @param {Function} onSuccess Called when to text is copied.\n *\n * @return {import('react').Ref<TElementType>} A ref to assign to the target element.\n */\nexport default function useCopyToClipboard( text, onSuccess ) {\n\t// Store the dependencies as refs and
|
|
1
|
+
{"version":3,"sources":["@wordpress/compose/src/hooks/use-copy-to-clipboard/index.js"],"names":["Clipboard","useRef","useRefEffect","useUpdatedRef","value","ref","current","useCopyToClipboard","text","onSuccess","textRef","onSuccessRef","node","clipboard","on","clearSelection","focus","destroy"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,SAAP,MAAsB,WAAtB;AAEA;AACA;AACA;;AACA,SAASC,MAAT,QAAuB,oBAAvB;AAEA;AACA;AACA;;AACA,OAAOC,YAAP,MAAyB,mBAAzB;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,aAAT,CAAwBC,KAAxB,EAAgC;AAC/B,QAAMC,GAAG,GAAGJ,MAAM,CAAEG,KAAF,CAAlB;AACAC,EAAAA,GAAG,CAACC,OAAJ,GAAcF,KAAd;AACA,SAAOC,GAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,eAAe,SAASE,kBAAT,CAA6BC,IAA7B,EAAmCC,SAAnC,EAA+C;AAC7D;AACA;AACA,QAAMC,OAAO,GAAGP,aAAa,CAAEK,IAAF,CAA7B;AACA,QAAMG,YAAY,GAAGR,aAAa,CAAEM,SAAF,CAAlC;AACA,SAAOP,YAAY,CAAIU,IAAF,IAAY;AAChC;AACA,UAAMC,SAAS,GAAG,IAAIb,SAAJ,CAAeY,IAAf,EAAqB;AACtCJ,MAAAA,IAAI,GAAG;AACN,eAAO,OAAOE,OAAO,CAACJ,OAAf,KAA2B,UAA3B,GACJI,OAAO,CAACJ,OAAR,EADI,GAEJI,OAAO,CAACJ,OAAR,IAAmB,EAFtB;AAGA;;AALqC,KAArB,CAAlB;AAQAO,IAAAA,SAAS,CAACC,EAAV,CAAc,SAAd,EAAyB,QAA0B;AAAA,UAAxB;AAAEC,QAAAA;AAAF,OAAwB;AAClD;AACA;AACA;AACAA,MAAAA,cAAc,GAJoC,CAKlD;AACA;;AACAH,MAAAA,IAAI,CAACI,KAAL;;AAEA,UAAKL,YAAY,CAACL,OAAlB,EAA4B;AAC3BK,QAAAA,YAAY,CAACL,OAAb;AACA;AACD,KAZD;AAcA,WAAO,MAAM;AACZO,MAAAA,SAAS,CAACI,OAAV;AACA,KAFD;AAGA,GA3BkB,EA2BhB,EA3BgB,CAAnB;AA4BA","sourcesContent":["/**\n * External dependencies\n */\nimport Clipboard from 'clipboard';\n\n/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\n\n/**\n * @template T\n * @param {T} value\n * @return {import('react').RefObject<T>} The updated ref\n */\nfunction useUpdatedRef( value ) {\n\tconst ref = useRef( value );\n\tref.current = value;\n\treturn ref;\n}\n\n/**\n * Copies the given text to the clipboard when the element is clicked.\n *\n * @template {HTMLElement} TElementType\n * @param {string | (() => string)} text The text to copy. Use a function if not\n * already available and expensive to compute.\n * @param {Function} onSuccess Called when to text is copied.\n *\n * @return {import('react').Ref<TElementType>} A ref to assign to the target element.\n */\nexport default function useCopyToClipboard( text, onSuccess ) {\n\t// Store the dependencies as refs and continuously update them so they're\n\t// fresh when the callback is called.\n\tconst textRef = useUpdatedRef( text );\n\tconst onSuccessRef = useUpdatedRef( onSuccess );\n\treturn useRefEffect( ( node ) => {\n\t\t// Clipboard listens to click events.\n\t\tconst clipboard = new Clipboard( node, {\n\t\t\ttext() {\n\t\t\t\treturn typeof textRef.current === 'function'\n\t\t\t\t\t? textRef.current()\n\t\t\t\t\t: textRef.current || '';\n\t\t\t},\n\t\t} );\n\n\t\tclipboard.on( 'success', ( { clearSelection } ) => {\n\t\t\t// Clearing selection will move focus back to the triggering\n\t\t\t// button, ensuring that it is not reset to the body, and\n\t\t\t// further that it is kept within the rendered node.\n\t\t\tclearSelection();\n\t\t\t// Handle ClipboardJS focus bug, see\n\t\t\t// https://github.com/zenorocha/clipboard.js/issues/680\n\t\t\tnode.focus();\n\n\t\t\tif ( onSuccessRef.current ) {\n\t\t\t\tonSuccessRef.current();\n\t\t\t}\n\t\t} );\n\n\t\treturn () => {\n\t\t\tclipboard.destroy();\n\t\t};\n\t}, [] );\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/compose/src/hooks/use-debounce/index.js"],"names":["debounce","useMemoOne","useEffect","useDebounce","fn","wait","options","debounced","cancel"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,QAAT,QAAyB,QAAzB;AACA,SAASC,UAAT,QAA2B,cAA3B;AAEA;AACA;AACA;;AACA,SAASC,SAAT,QAA0B,oBAA1B;AAEA;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,WAAT,CAAsBC,EAAtB,EAA0BC,IAA1B,EAAgCC,OAAhC,EAA0C;AACxD;AACA,QAAMC,SAAS,GAAGN,UAAU,
|
|
1
|
+
{"version":3,"sources":["@wordpress/compose/src/hooks/use-debounce/index.js"],"names":["debounce","useMemoOne","useEffect","useDebounce","fn","wait","options","debounced","cancel"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,QAAT,QAAyB,QAAzB;AACA,SAASC,UAAT,QAA2B,cAA3B;AAEA;AACA;AACA;;AACA,SAASC,SAAT,QAA0B,oBAA1B;AAEA;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,WAAT,CAAsBC,EAAtB,EAA0BC,IAA1B,EAAgCC,OAAhC,EAA0C;AACxD;AACA,QAAMC,SAAS,GAAGN,UAAU,CAC3B,MAAMD,QAAQ,CAAEI,EAAF,EAAMC,IAAN,EAAYC,OAAZ,CADa,EAE3B,CAAEF,EAAF,EAAMC,IAAN,EAAYC,OAAZ,CAF2B,CAA5B;AAIAJ,EAAAA,SAAS,CAAE,MAAM,MAAMK,SAAS,CAACC,MAAV,EAAd,EAAkC,CAAED,SAAF,CAAlC,CAAT;AACA,SAAOA,SAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport { debounce } from 'lodash';\nimport { useMemoOne } from 'use-memo-one';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect } from '@wordpress/element';\n\n/* eslint-disable jsdoc/valid-types */\n/**\n * Debounces a function with Lodash's `debounce`. A new debounced function will\n * be returned and any scheduled calls cancelled if any of the arguments change,\n * including the function to debounce, so please wrap functions created on\n * render in components in `useCallback`.\n *\n * @see https://docs-lodash.com/v4/debounce/\n *\n * @template {(...args: any[]) => void} TFunc\n *\n * @param {TFunc} fn The function to debounce.\n * @param {number} [wait] The number of milliseconds to delay.\n * @param {import('lodash').DebounceSettings} [options] The options object.\n * @return {import('lodash').DebouncedFunc<TFunc>} Debounced function.\n */\nexport default function useDebounce( fn, wait, options ) {\n\t/* eslint-enable jsdoc/valid-types */\n\tconst debounced = useMemoOne(\n\t\t() => debounce( fn, wait, options ),\n\t\t[ fn, wait, options ]\n\t);\n\tuseEffect( () => () => debounced.cancel(), [ debounced ] );\n\treturn debounced;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/compose/src/hooks/use-dialog/index.js"],"names":["useRef","useEffect","useCallback","ESCAPE","useConstrainedTabbing","useFocusOnMount","useFocusReturn","useFocusOutside","useMergeRefs","useDialog","options","currentOptions","current","Object","values","constrainedTabbingRef","focusOnMountRef","focusOnMount","focusReturnRef","focusOutsideProps","event","__unstableOnClose","onClose","closeOnEscapeRef","node","addEventListener","keyCode","defaultPrevented","preventDefault","tabIndex"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,SAAjB,EAA4BC,WAA5B,QAA+C,oBAA/C;AACA,SAASC,MAAT,QAAuB,qBAAvB;AAEA;AACA;AACA;;AACA,OAAOC,qBAAP,MAAkC,4BAAlC;AACA,OAAOC,eAAP,MAA4B,uBAA5B;AACA,OAAOC,cAAP,MAA2B,qBAA3B;AACA,OAAOC,eAAP,MAA4B,sBAA5B;AACA,OAAOC,YAAP,MAAyB,mBAAzB;AAEA;;AACA;AACA;AACA;AACA;AACA;;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,SAAT,CAAoBC,OAApB,EAA8B;AAC7B;AACD;AACA;AACC,QAAMC,cAAc,GAAGX,MAAM,EAA7B;AACAC,EAAAA,SAAS,CAAE,MAAM;AAChBU,IAAAA,cAAc,CAACC,OAAf,GAAyBF,OAAzB;AACA,GAFQ,EAENG,MAAM,CAACC,MAAP,CAAeJ,OAAf,CAFM,CAAT;AAGA,QAAMK,qBAAqB,GAAGX,qBAAqB,EAAnD;AACA,QAAMY,eAAe,GAAGX,eAAe,CAAEK,OAAO,CAACO,YAAV,CAAvC;AACA,QAAMC,cAAc,GAAGZ,cAAc,EAArC;AACA,QAAMa,iBAAiB,GAAGZ,eAAe,CAAIa,KAAF,IAAa;AAAA;;AACvD;AACA;AACA;AACA,iCAAKT,cAAc,CAACC,OAApB,kDAAK,sBAAwBS,iBAA7B,EAAiD;AAChD;AACAV,MAAAA,cAAc,CAACC,OAAf,CAAuBS,iBAAvB,CAA0C,eAA1C,EAA2DD,KAA3D;AACA,KAHD,MAGO,8BAAKT,cAAc,CAACC,OAApB,mDAAK,uBAAwBU,OAA7B,EAAuC;AAC7CX,MAAAA,cAAc,CAACC,OAAf,CAAuBU,OAAvB;AACA;AACD,GAVwC,CAAzC;AAWA,QAAMC,gBAAgB,GAAGrB,WAAW,CAAIsB,IAAF,IAAY;AACjD,QAAK,CAAEA,IAAP,EAAc;AACb;AACA;;AAEDA,IAAAA,IAAI,CAACC,gBAAL,
|
|
1
|
+
{"version":3,"sources":["@wordpress/compose/src/hooks/use-dialog/index.js"],"names":["useRef","useEffect","useCallback","ESCAPE","useConstrainedTabbing","useFocusOnMount","useFocusReturn","useFocusOutside","useMergeRefs","useDialog","options","currentOptions","current","Object","values","constrainedTabbingRef","focusOnMountRef","focusOnMount","focusReturnRef","focusOutsideProps","event","__unstableOnClose","onClose","closeOnEscapeRef","node","addEventListener","keyCode","defaultPrevented","preventDefault","tabIndex"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,SAAjB,EAA4BC,WAA5B,QAA+C,oBAA/C;AACA,SAASC,MAAT,QAAuB,qBAAvB;AAEA;AACA;AACA;;AACA,OAAOC,qBAAP,MAAkC,4BAAlC;AACA,OAAOC,eAAP,MAA4B,uBAA5B;AACA,OAAOC,cAAP,MAA2B,qBAA3B;AACA,OAAOC,eAAP,MAA4B,sBAA5B;AACA,OAAOC,YAAP,MAAyB,mBAAzB;AAEA;;AACA;AACA;AACA;AACA;AACA;;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,SAAT,CAAoBC,OAApB,EAA8B;AAC7B;AACD;AACA;AACC,QAAMC,cAAc,GAAGX,MAAM,EAA7B;AACAC,EAAAA,SAAS,CAAE,MAAM;AAChBU,IAAAA,cAAc,CAACC,OAAf,GAAyBF,OAAzB;AACA,GAFQ,EAENG,MAAM,CAACC,MAAP,CAAeJ,OAAf,CAFM,CAAT;AAGA,QAAMK,qBAAqB,GAAGX,qBAAqB,EAAnD;AACA,QAAMY,eAAe,GAAGX,eAAe,CAAEK,OAAO,CAACO,YAAV,CAAvC;AACA,QAAMC,cAAc,GAAGZ,cAAc,EAArC;AACA,QAAMa,iBAAiB,GAAGZ,eAAe,CAAIa,KAAF,IAAa;AAAA;;AACvD;AACA;AACA;AACA,iCAAKT,cAAc,CAACC,OAApB,kDAAK,sBAAwBS,iBAA7B,EAAiD;AAChD;AACAV,MAAAA,cAAc,CAACC,OAAf,CAAuBS,iBAAvB,CAA0C,eAA1C,EAA2DD,KAA3D;AACA,KAHD,MAGO,8BAAKT,cAAc,CAACC,OAApB,mDAAK,uBAAwBU,OAA7B,EAAuC;AAC7CX,MAAAA,cAAc,CAACC,OAAf,CAAuBU,OAAvB;AACA;AACD,GAVwC,CAAzC;AAWA,QAAMC,gBAAgB,GAAGrB,WAAW,CAAIsB,IAAF,IAAY;AACjD,QAAK,CAAEA,IAAP,EAAc;AACb;AACA;;AAEDA,IAAAA,IAAI,CAACC,gBAAL,CACC,SADD,EAEC;AAAE;AAA6BL,IAAAA,KAA/B,KAA0C;AAAA;;AACzC;AACA,UACCA,KAAK,CAACM,OAAN,KAAkBvB,MAAlB,IACA,CAAEiB,KAAK,CAACO,gBADR,8BAEAhB,cAAc,CAACC,OAFf,mDAEA,uBAAwBU,OAHzB,EAIE;AACDF,QAAAA,KAAK,CAACQ,cAAN;AACAjB,QAAAA,cAAc,CAACC,OAAf,CAAuBU,OAAvB;AACA;AACD,KAZF;AAcA,GAnBmC,EAmBjC,EAnBiC,CAApC;AAqBA,SAAO,CACNd,YAAY,CAAE,CACbE,OAAO,CAACO,YAAR,KAAyB,KAAzB,GAAiCF,qBAAjC,GAAyD,IAD5C,EAEbL,OAAO,CAACO,YAAR,KAAyB,KAAzB,GAAiCC,cAAjC,GAAkD,IAFrC,EAGbR,OAAO,CAACO,YAAR,KAAyB,KAAzB,GAAiCD,eAAjC,GAAmD,IAHtC,EAIbO,gBAJa,CAAF,CADN,EAON,EACC,GAAGJ,iBADJ;AAECU,IAAAA,QAAQ,EAAE;AAFX,GAPM,CAAP;AAYA;;AAED,eAAepB,SAAf","sourcesContent":["/**\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\n/* eslint-disable jsdoc/valid-types */\n/**\n * @typedef DialogOptions\n * @property {Parameters<useFocusOnMount>[0]} focusOnMount Focus on mount arguments.\n * @property {() => void} onClose Function to call when the dialog is closed.\n */\n/* eslint-enable jsdoc/valid-types */\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 {DialogOptions} options Dialog Options.\n */\nfunction useDialog( options ) {\n\t/**\n\t * @type {import('react').MutableRefObject<DialogOptions | undefined>}\n\t */\n\tconst currentOptions = useRef();\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\t// @ts-ignore unstable property\n\t\tif ( currentOptions.current?.__unstableOnClose ) {\n\t\t\t// @ts-ignore unstable property\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 ) => {\n\t\tif ( ! node ) {\n\t\t\treturn;\n\t\t}\n\n\t\tnode.addEventListener(\n\t\t\t'keydown',\n\t\t\t( /** @type {KeyboardEvent} */ event ) => {\n\t\t\t\t// Close on escape.\n\t\t\t\tif (\n\t\t\t\t\tevent.keyCode === ESCAPE &&\n\t\t\t\t\t! event.defaultPrevented &&\n\t\t\t\t\tcurrentOptions.current?.onClose\n\t\t\t\t) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tcurrentOptions.current.onClose();\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t}, [] );\n\n\treturn [\n\t\tuseMergeRefs( [\n\t\t\toptions.focusOnMount !== false ? 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"]}
|
|
@@ -28,11 +28,13 @@ const DISABLED_ELIGIBLE_NODE_NAMES = ['BUTTON', 'FIELDSET', 'INPUT', 'OPTGROUP',
|
|
|
28
28
|
* (input fields, links, buttons, etc.) need to be disabled. This hook adds the
|
|
29
29
|
* behavior to disable nested DOM elements to the returned ref.
|
|
30
30
|
*
|
|
31
|
+
* @param {Object} config Configuration object.
|
|
32
|
+
* @param {boolean=} config.isDisabled Whether the element should be disabled.
|
|
31
33
|
* @return {import('react').RefCallback<HTMLElement>} Element Ref.
|
|
32
34
|
*
|
|
33
35
|
* @example
|
|
34
36
|
* ```js
|
|
35
|
-
* import {
|
|
37
|
+
* import { useDisabled } from '@wordpress/compose';
|
|
36
38
|
* const DisabledExample = () => {
|
|
37
39
|
* const disabledRef = useDisabled();
|
|
38
40
|
* return (
|
|
@@ -46,33 +48,101 @@ const DISABLED_ELIGIBLE_NODE_NAMES = ['BUTTON', 'FIELDSET', 'INPUT', 'OPTGROUP',
|
|
|
46
48
|
*/
|
|
47
49
|
|
|
48
50
|
export default function useDisabled() {
|
|
51
|
+
let {
|
|
52
|
+
isDisabled: isDisabledProp = false
|
|
53
|
+
} = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
49
54
|
return useRefEffect(node => {
|
|
55
|
+
if (isDisabledProp) {
|
|
56
|
+
return;
|
|
57
|
+
}
|
|
58
|
+
/** A variable keeping track of the previous updates in order to restore them. */
|
|
59
|
+
|
|
60
|
+
/** @type {Function[]} */
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
const updates = [];
|
|
64
|
+
|
|
50
65
|
const disable = () => {
|
|
51
|
-
node.style.
|
|
52
|
-
|
|
66
|
+
if (node.style.getPropertyValue('user-select') !== 'none') {
|
|
67
|
+
const previousValue = node.style.getPropertyValue('user-select');
|
|
68
|
+
node.style.setProperty('user-select', 'none');
|
|
69
|
+
node.style.setProperty('-webkit-user-select', 'none');
|
|
70
|
+
updates.push(() => {
|
|
71
|
+
if (!node.isConnected) {
|
|
72
|
+
return;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
node.style.setProperty('user-select', previousValue);
|
|
76
|
+
node.style.setProperty('-webkit-user-select', previousValue);
|
|
77
|
+
});
|
|
78
|
+
}
|
|
79
|
+
|
|
53
80
|
focus.focusable.find(node).forEach(focusable => {
|
|
54
81
|
var _node$ownerDocument$d;
|
|
55
82
|
|
|
56
|
-
if (includes(DISABLED_ELIGIBLE_NODE_NAMES, focusable.nodeName)
|
|
83
|
+
if (includes(DISABLED_ELIGIBLE_NODE_NAMES, focusable.nodeName) && // @ts-ignore
|
|
84
|
+
!focusable.disabled) {
|
|
57
85
|
focusable.setAttribute('disabled', '');
|
|
86
|
+
updates.push(() => {
|
|
87
|
+
if (!focusable.isConnected) {
|
|
88
|
+
return;
|
|
89
|
+
} // @ts-ignore
|
|
90
|
+
|
|
91
|
+
|
|
92
|
+
focusable.disabled = false;
|
|
93
|
+
});
|
|
58
94
|
}
|
|
59
95
|
|
|
60
|
-
if (focusable.nodeName === 'A') {
|
|
96
|
+
if (focusable.nodeName === 'A' && focusable.getAttribute('tabindex') !== '-1') {
|
|
97
|
+
const previousValue = focusable.getAttribute('tabindex');
|
|
61
98
|
focusable.setAttribute('tabindex', '-1');
|
|
99
|
+
updates.push(() => {
|
|
100
|
+
if (!focusable.isConnected) {
|
|
101
|
+
return;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
if (!previousValue) {
|
|
105
|
+
focusable.removeAttribute('tabindex');
|
|
106
|
+
} else {
|
|
107
|
+
focusable.setAttribute('tabindex', previousValue);
|
|
108
|
+
}
|
|
109
|
+
});
|
|
62
110
|
}
|
|
63
111
|
|
|
64
112
|
const tabIndex = focusable.getAttribute('tabindex');
|
|
65
113
|
|
|
66
114
|
if (tabIndex !== null && tabIndex !== '-1') {
|
|
67
115
|
focusable.removeAttribute('tabindex');
|
|
116
|
+
updates.push(() => {
|
|
117
|
+
if (!focusable.isConnected) {
|
|
118
|
+
return;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
focusable.setAttribute('tabindex', tabIndex);
|
|
122
|
+
});
|
|
68
123
|
}
|
|
69
124
|
|
|
70
|
-
if (focusable.hasAttribute('contenteditable')) {
|
|
125
|
+
if (focusable.hasAttribute('contenteditable') && focusable.getAttribute('contenteditable') !== 'false') {
|
|
71
126
|
focusable.setAttribute('contenteditable', 'false');
|
|
127
|
+
updates.push(() => {
|
|
128
|
+
if (!focusable.isConnected) {
|
|
129
|
+
return;
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
focusable.setAttribute('contenteditable', 'true');
|
|
133
|
+
});
|
|
72
134
|
}
|
|
73
135
|
|
|
74
136
|
if ((_node$ownerDocument$d = node.ownerDocument.defaultView) !== null && _node$ownerDocument$d !== void 0 && _node$ownerDocument$d.HTMLElement && focusable instanceof node.ownerDocument.defaultView.HTMLElement) {
|
|
137
|
+
const previousValue = focusable.style.getPropertyValue('pointer-events');
|
|
75
138
|
focusable.style.setProperty('pointer-events', 'none');
|
|
139
|
+
updates.push(() => {
|
|
140
|
+
if (!focusable.isConnected) {
|
|
141
|
+
return;
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
focusable.style.setProperty('pointer-events', previousValue);
|
|
145
|
+
});
|
|
76
146
|
}
|
|
77
147
|
});
|
|
78
148
|
}; // Debounce re-disable since disabling process itself will incur
|
|
@@ -97,7 +167,8 @@ export default function useDisabled() {
|
|
|
97
167
|
}
|
|
98
168
|
|
|
99
169
|
debouncedDisable.cancel();
|
|
170
|
+
updates.forEach(update => update());
|
|
100
171
|
};
|
|
101
|
-
}, []);
|
|
172
|
+
}, [isDisabledProp]);
|
|
102
173
|
}
|
|
103
174
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/compose/src/hooks/use-disabled/index.js"],"names":["includes","debounce","focus","useRefEffect","DISABLED_ELIGIBLE_NODE_NAMES","useDisabled","node","disable","style","setProperty","focusable","find","forEach","nodeName","setAttribute","tabIndex","getAttribute","removeAttribute","hasAttribute","ownerDocument","defaultView","HTMLElement","debouncedDisable","undefined","leading","observer","window","MutationObserver","observe","childList","attributes","subtree","disconnect","cancel"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,QAAT,EAAmBC,QAAnB,QAAmC,QAAnC;AAEA;AACA;AACA;;AACA,SAASC,KAAT,QAAsB,gBAAtB;AAEA;AACA;AACA;;AACA,OAAOC,YAAP,MAAyB,mBAAzB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,MAAMC,4BAA4B,GAAG,CACpC,QADoC,EAEpC,UAFoC,EAGpC,OAHoC,EAIpC,UAJoC,EAKpC,QALoC,EAMpC,QANoC,EAOpC,UAPoC,CAArC;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,WAAT,GAAuB;AACrC,SAAOF,YAAY,CAAIG,IAAF,IAAY;AAChC,UAAMC,OAAO,GAAG,MAAM;AACrBD,MAAAA,IAAI,CAACE,KAAL,CAAWC,WAAX,CAAwB,aAAxB,EAAuC,MAAvC;AACAH,MAAAA,IAAI,CAACE,KAAL,CAAWC,WAAX,CAAwB,qBAAxB,EAA+C,MAA/C;AACAP,MAAAA,KAAK,CAACQ,SAAN,CAAgBC,IAAhB,CAAsBL,IAAtB,EAA6BM,OAA7B,CAAwCF,SAAF,IAAiB;AAAA;;AACtD,YACCV,QAAQ,CAAEI,4BAAF,EAAgCM,SAAS,CAACG,QAA1C,CADT,EAEE;AACDH,UAAAA,SAAS,CAACI,YAAV,CAAwB,UAAxB,EAAoC,EAApC;AACA;;AAED,YAAKJ,SAAS,CAACG,QAAV,KAAuB,GAA5B,EAAkC;AACjCH,UAAAA,SAAS,CAACI,YAAV,CAAwB,UAAxB,EAAoC,IAApC;AACA;;AAED,cAAMC,QAAQ,GAAGL,SAAS,CAACM,YAAV,CAAwB,UAAxB,CAAjB;;AACA,YAAKD,QAAQ,KAAK,IAAb,IAAqBA,QAAQ,KAAK,IAAvC,EAA8C;AAC7CL,UAAAA,SAAS,CAACO,eAAV,CAA2B,UAA3B;AACA;;AAED,YAAKP,SAAS,CAACQ,YAAV,CAAwB,iBAAxB,CAAL,EAAmD;AAClDR,UAAAA,SAAS,CAACI,YAAV,CAAwB,iBAAxB,EAA2C,OAA3C;AACA;;AAED,YACC,yBAAAR,IAAI,CAACa,aAAL,CAAmBC,WAAnB,wEAAgCC,WAAhC,IACAX,SAAS,YACRJ,IAAI,CAACa,aAAL,CAAmBC,WAAnB,CAA+BC,WAHjC,EAIE;AACDX,UAAAA,SAAS,CAACF,KAAV,CAAgBC,WAAhB,CAA6B,gBAA7B,EAA+C,MAA/C;AACA;AACD,OA3BD;AA4BA,KA/BD,CADgC,CAkChC;AACA;;;AACA,UAAMa,gBAAgB,GAAGrB,QAAQ,CAAEM,OAAF,EAAWgB,SAAX,EAAsB;AACtDC,MAAAA,OAAO,EAAE;AAD6C,KAAtB,CAAjC;AAGAjB,IAAAA,OAAO;AAEP;;AACA,UAAMkB,QAAQ,GAAG,IAAIC,MAAM,CAACC,gBAAX,CAA6BL,gBAA7B,CAAjB;AACAG,IAAAA,QAAQ,CAACG,OAAT,CAAkBtB,IAAlB,EAAwB;AACvBuB,MAAAA,SAAS,EAAE,IADY;AAEvBC,MAAAA,UAAU,EAAE,IAFW;AAGvBC,MAAAA,OAAO,EAAE;AAHc,KAAxB;AAMA,WAAO,MAAM;AACZ,UAAKN,QAAL,EAAgB;AACfA,QAAAA,QAAQ,CAACO,UAAT;AACA;;AACDV,MAAAA,gBAAgB,CAACW,MAAjB;AACA,KALD;AAMA,GAvDkB,EAuDhB,EAvDgB,CAAnB;AAwDA","sourcesContent":["/**\n * External dependencies\n */\nimport { includes, debounce } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { focus } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\n\n/**\n * Names of control nodes which qualify for disabled behavior.\n *\n * See WHATWG HTML Standard: 4.10.18.5: \"Enabling and disabling form controls: the disabled attribute\".\n *\n * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#enabling-and-disabling-form-controls:-the-disabled-attribute\n *\n * @type {string[]}\n */\nconst DISABLED_ELIGIBLE_NODE_NAMES = [\n\t'BUTTON',\n\t'FIELDSET',\n\t'INPUT',\n\t'OPTGROUP',\n\t'OPTION',\n\t'SELECT',\n\t'TEXTAREA',\n];\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 * @return {import('react').RefCallback<HTMLElement>} Element Ref.\n *\n * @example\n * ```js\n * import { __experimentalUseDisabled as useDisabled } from '@wordpress/compose';\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\treturn useRefEffect( ( node ) => {\n\t\tconst disable = () => {\n\t\t\tnode.style.setProperty( 'user-select', 'none' );\n\t\t\tnode.style.setProperty( '-webkit-user-select', 'none' );\n\t\t\tfocus.focusable.find( node ).forEach( ( focusable ) => {\n\t\t\t\tif (\n\t\t\t\t\tincludes( DISABLED_ELIGIBLE_NODE_NAMES, focusable.nodeName )\n\t\t\t\t) {\n\t\t\t\t\tfocusable.setAttribute( 'disabled', '' );\n\t\t\t\t}\n\n\t\t\t\tif ( focusable.nodeName === 'A' ) {\n\t\t\t\t\tfocusable.setAttribute( 'tabindex', '-1' );\n\t\t\t\t}\n\n\t\t\t\tconst tabIndex = focusable.getAttribute( 'tabindex' );\n\t\t\t\tif ( tabIndex !== null && tabIndex !== '-1' ) {\n\t\t\t\t\tfocusable.removeAttribute( 'tabindex' );\n\t\t\t\t}\n\n\t\t\t\tif ( focusable.hasAttribute( 'contenteditable' ) ) {\n\t\t\t\t\tfocusable.setAttribute( 'contenteditable', 'false' );\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\tnode.ownerDocument.defaultView?.HTMLElement &&\n\t\t\t\t\tfocusable instanceof\n\t\t\t\t\t\tnode.ownerDocument.defaultView.HTMLElement\n\t\t\t\t) {\n\t\t\t\t\tfocusable.style.setProperty( 'pointer-events', 'none' );\n\t\t\t\t}\n\t\t\t} );\n\t\t};\n\n\t\t// Debounce re-disable since disabling process itself will incur\n\t\t// additional mutations which should be ignored.\n\t\tconst debouncedDisable = debounce( disable, undefined, {\n\t\t\tleading: true,\n\t\t} );\n\t\tdisable();\n\n\t\t/** @type {MutationObserver | undefined} */\n\t\tconst observer = new window.MutationObserver( debouncedDisable );\n\t\tobserver.observe( node, {\n\t\t\tchildList: true,\n\t\t\tattributes: true,\n\t\t\tsubtree: true,\n\t\t} );\n\n\t\treturn () => {\n\t\t\tif ( observer ) {\n\t\t\t\tobserver.disconnect();\n\t\t\t}\n\t\t\tdebouncedDisable.cancel();\n\t\t};\n\t}, [] );\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/compose/src/hooks/use-disabled/index.js"],"names":["includes","debounce","focus","useRefEffect","DISABLED_ELIGIBLE_NODE_NAMES","useDisabled","isDisabled","isDisabledProp","node","updates","disable","style","getPropertyValue","previousValue","setProperty","push","isConnected","focusable","find","forEach","nodeName","disabled","setAttribute","getAttribute","removeAttribute","tabIndex","hasAttribute","ownerDocument","defaultView","HTMLElement","debouncedDisable","undefined","leading","observer","window","MutationObserver","observe","childList","attributes","subtree","disconnect","cancel","update"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { includes, debounce } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { focus } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport useRefEffect from '../use-ref-effect';\n\n/**\n * Names of control nodes which qualify for disabled behavior.\n *\n * See WHATWG HTML Standard: 4.10.18.5: \"Enabling and disabling form controls: the disabled attribute\".\n *\n * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#enabling-and-disabling-form-controls:-the-disabled-attribute\n *\n * @type {string[]}\n */\nconst DISABLED_ELIGIBLE_NODE_NAMES = [\n\t'BUTTON',\n\t'FIELDSET',\n\t'INPUT',\n\t'OPTGROUP',\n\t'OPTION',\n\t'SELECT',\n\t'TEXTAREA',\n];\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 * @param {Object} config Configuration object.\n * @param {boolean=} config.isDisabled Whether the element should be disabled.\n * @return {import('react').RefCallback<HTMLElement>} Element Ref.\n *\n * @example\n * ```js\n * import { useDisabled } from '@wordpress/compose';\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\t/** A variable keeping track of the previous updates in order to restore them. */\n\t\t\t/** @type {Function[]} */\n\t\t\tconst updates = [];\n\n\t\t\tconst disable = () => {\n\t\t\t\tif ( node.style.getPropertyValue( 'user-select' ) !== 'none' ) {\n\t\t\t\t\tconst previousValue =\n\t\t\t\t\t\tnode.style.getPropertyValue( 'user-select' );\n\t\t\t\t\tnode.style.setProperty( 'user-select', 'none' );\n\t\t\t\t\tnode.style.setProperty( '-webkit-user-select', 'none' );\n\t\t\t\t\tupdates.push( () => {\n\t\t\t\t\t\tif ( ! node.isConnected ) {\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tnode.style.setProperty( 'user-select', previousValue );\n\t\t\t\t\t\tnode.style.setProperty(\n\t\t\t\t\t\t\t'-webkit-user-select',\n\t\t\t\t\t\t\tpreviousValue\n\t\t\t\t\t\t);\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\tfocus.focusable.find( node ).forEach( ( focusable ) => {\n\t\t\t\t\tif (\n\t\t\t\t\t\tincludes(\n\t\t\t\t\t\t\tDISABLED_ELIGIBLE_NODE_NAMES,\n\t\t\t\t\t\t\tfocusable.nodeName\n\t\t\t\t\t\t) &&\n\t\t\t\t\t\t// @ts-ignore\n\t\t\t\t\t\t! focusable.disabled\n\t\t\t\t\t) {\n\t\t\t\t\t\tfocusable.setAttribute( 'disabled', '' );\n\t\t\t\t\t\tupdates.push( () => {\n\t\t\t\t\t\t\tif ( ! focusable.isConnected ) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t// @ts-ignore\n\t\t\t\t\t\t\tfocusable.disabled = false;\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\n\t\t\t\t\tif (\n\t\t\t\t\t\tfocusable.nodeName === 'A' &&\n\t\t\t\t\t\tfocusable.getAttribute( 'tabindex' ) !== '-1'\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst previousValue =\n\t\t\t\t\t\t\tfocusable.getAttribute( 'tabindex' );\n\t\t\t\t\t\tfocusable.setAttribute( 'tabindex', '-1' );\n\t\t\t\t\t\tupdates.push( () => {\n\t\t\t\t\t\t\tif ( ! focusable.isConnected ) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif ( ! previousValue ) {\n\t\t\t\t\t\t\t\tfocusable.removeAttribute( 'tabindex' );\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tfocusable.setAttribute(\n\t\t\t\t\t\t\t\t\t'tabindex',\n\t\t\t\t\t\t\t\t\tpreviousValue\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\n\t\t\t\t\tconst tabIndex = focusable.getAttribute( 'tabindex' );\n\t\t\t\t\tif ( tabIndex !== null && tabIndex !== '-1' ) {\n\t\t\t\t\t\tfocusable.removeAttribute( 'tabindex' );\n\t\t\t\t\t\tupdates.push( () => {\n\t\t\t\t\t\t\tif ( ! focusable.isConnected ) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tfocusable.setAttribute( 'tabindex', tabIndex );\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\n\t\t\t\t\tif (\n\t\t\t\t\t\tfocusable.hasAttribute( 'contenteditable' ) &&\n\t\t\t\t\t\tfocusable.getAttribute( 'contenteditable' ) !== 'false'\n\t\t\t\t\t) {\n\t\t\t\t\t\tfocusable.setAttribute( 'contenteditable', 'false' );\n\t\t\t\t\t\tupdates.push( () => {\n\t\t\t\t\t\t\tif ( ! focusable.isConnected ) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tfocusable.setAttribute( 'contenteditable', 'true' );\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\n\t\t\t\t\tif (\n\t\t\t\t\t\tnode.ownerDocument.defaultView?.HTMLElement &&\n\t\t\t\t\t\tfocusable instanceof\n\t\t\t\t\t\t\tnode.ownerDocument.defaultView.HTMLElement\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst previousValue =\n\t\t\t\t\t\t\tfocusable.style.getPropertyValue(\n\t\t\t\t\t\t\t\t'pointer-events'\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\tfocusable.style.setProperty( 'pointer-events', 'none' );\n\t\t\t\t\t\tupdates.push( () => {\n\t\t\t\t\t\t\tif ( ! focusable.isConnected ) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tfocusable.style.setProperty(\n\t\t\t\t\t\t\t\t'pointer-events',\n\t\t\t\t\t\t\t\tpreviousValue\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\t\t\t\t} );\n\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, undefined, {\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\tattributes: true,\n\t\t\t\tsubtree: 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"]}
|
|
@@ -54,7 +54,12 @@ export default function useFocusOnMount() {
|
|
|
54
54
|
}
|
|
55
55
|
}
|
|
56
56
|
|
|
57
|
-
target.focus(
|
|
57
|
+
target.focus({
|
|
58
|
+
// When focusing newly mounted dialogs,
|
|
59
|
+
// the position of the popover is often not right on the first render
|
|
60
|
+
// This prevents the layout shifts when focusing the dialogs.
|
|
61
|
+
preventScroll: true
|
|
62
|
+
});
|
|
58
63
|
}, []);
|
|
59
64
|
}
|
|
60
65
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-on-mount/index.js"],"names":["useRef","useEffect","useCallback","focus","useFocusOnMount","focusOnMount","focusOnMountRef","current","node","contains","ownerDocument","activeElement","target","firstTabbable","tabbable","find"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,SAAjB,EAA4BC,WAA5B,QAA+C,oBAA/C;AACA,SAASC,KAAT,QAAsB,gBAAtB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,eAAT,GAA0D;AAAA,MAAhCC,YAAgC,uEAAjB,cAAiB;AACxE,QAAMC,eAAe,GAAGN,MAAM,CAAEK,YAAF,CAA9B;AACAJ,EAAAA,SAAS,CAAE,MAAM;AAChBK,IAAAA,eAAe,CAACC,OAAhB,GAA0BF,YAA1B;AACA,GAFQ,EAEN,CAAEA,YAAF,CAFM,CAAT;AAIA,SAAOH,WAAW,CAAIM,IAAF,IAAY;AAAA;;AAC/B,QAAK,CAAEA,IAAF,IAAUF,eAAe,CAACC,OAAhB,KAA4B,KAA3C,EAAmD;AAClD;AACA;;AAED,QAAKC,IAAI,CAACC,QAAL,iDAAeD,IAAI,CAACE,aAApB,wDAAe,oBAAoBC,aAAnC,yEAAoD,IAApD,CAAL,EAAkE;AACjE;AACA;;AAED,QAAIC,MAAM,GAAGJ,IAAb;;AAEA,QAAKF,eAAe,CAACC,OAAhB,KAA4B,cAAjC,EAAkD;AACjD,YAAMM,aAAa,GAAGV,KAAK,CAACW,QAAN,CAAeC,IAAf,CAAqBP,IAArB,EAA6B,CAA7B,CAAtB;;AAEA,UAAKK,aAAL,EAAqB;AACpBD,QAAAA,MAAM;AAAG;AAA6BC,QAAAA,aAAtC;AACA;AACD;;AAEDD,IAAAA,MAAM,CAACT,KAAP;AACA,
|
|
1
|
+
{"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-on-mount/index.js"],"names":["useRef","useEffect","useCallback","focus","useFocusOnMount","focusOnMount","focusOnMountRef","current","node","contains","ownerDocument","activeElement","target","firstTabbable","tabbable","find","preventScroll"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,SAAjB,EAA4BC,WAA5B,QAA+C,oBAA/C;AACA,SAASC,KAAT,QAAsB,gBAAtB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,eAAT,GAA0D;AAAA,MAAhCC,YAAgC,uEAAjB,cAAiB;AACxE,QAAMC,eAAe,GAAGN,MAAM,CAAEK,YAAF,CAA9B;AACAJ,EAAAA,SAAS,CAAE,MAAM;AAChBK,IAAAA,eAAe,CAACC,OAAhB,GAA0BF,YAA1B;AACA,GAFQ,EAEN,CAAEA,YAAF,CAFM,CAAT;AAIA,SAAOH,WAAW,CAAIM,IAAF,IAAY;AAAA;;AAC/B,QAAK,CAAEA,IAAF,IAAUF,eAAe,CAACC,OAAhB,KAA4B,KAA3C,EAAmD;AAClD;AACA;;AAED,QAAKC,IAAI,CAACC,QAAL,iDAAeD,IAAI,CAACE,aAApB,wDAAe,oBAAoBC,aAAnC,yEAAoD,IAApD,CAAL,EAAkE;AACjE;AACA;;AAED,QAAIC,MAAM,GAAGJ,IAAb;;AAEA,QAAKF,eAAe,CAACC,OAAhB,KAA4B,cAAjC,EAAkD;AACjD,YAAMM,aAAa,GAAGV,KAAK,CAACW,QAAN,CAAeC,IAAf,CAAqBP,IAArB,EAA6B,CAA7B,CAAtB;;AAEA,UAAKK,aAAL,EAAqB;AACpBD,QAAAA,MAAM;AAAG;AAA6BC,QAAAA,aAAtC;AACA;AACD;;AAEDD,IAAAA,MAAM,CAACT,KAAP,CAAc;AACb;AACA;AACA;AACAa,MAAAA,aAAa,EAAE;AAJF,KAAd;AAMA,GAzBiB,EAyBf,EAzBe,CAAlB;AA0BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useCallback } from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/**\n * Hook used to focus the first tabbable element on mount.\n *\n * @param {boolean | 'firstElement'} focusOnMount Focus on mount mode.\n * @return {import('react').RefCallback<HTMLElement>} Ref callback.\n *\n * @example\n * ```js\n * import { useFocusOnMount } from '@wordpress/compose';\n *\n * const WithFocusOnMount = () => {\n * const ref = useFocusOnMount()\n * return (\n * <div ref={ ref }>\n * <Button />\n * <Button />\n * </div>\n * );\n * }\n * ```\n */\nexport default function useFocusOnMount( focusOnMount = 'firstElement' ) {\n\tconst focusOnMountRef = useRef( focusOnMount );\n\tuseEffect( () => {\n\t\tfocusOnMountRef.current = focusOnMount;\n\t}, [ focusOnMount ] );\n\n\treturn useCallback( ( node ) => {\n\t\tif ( ! node || focusOnMountRef.current === false ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( node.contains( node.ownerDocument?.activeElement ?? null ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet target = node;\n\n\t\tif ( focusOnMountRef.current === 'firstElement' ) {\n\t\t\tconst firstTabbable = focus.tabbable.find( node )[ 0 ];\n\n\t\t\tif ( firstTabbable ) {\n\t\t\t\ttarget = /** @type {HTMLElement} */ ( firstTabbable );\n\t\t\t}\n\t\t}\n\n\t\ttarget.focus( {\n\t\t\t// When focusing newly mounted dialogs,\n\t\t\t// the position of the popover is often not right on the first render\n\t\t\t// This prevents the layout shifts when focusing the dialogs.\n\t\t\tpreventScroll: true,\n\t\t} );\n\t}, [] );\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-return/index.js"],"names":["useRef","useEffect","useCallback","useFocusReturn","onFocusReturn","ref","focusedBeforeMount","onFocusReturnRef","current","node","ownerDocument","activeElement","isFocused","contains","isConnected","focus"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,SAAjB,EAA4BC,WAA5B,QAA+C,oBAA/C;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,cAAT,CAAyBC,aAAzB,EAAyC;AACxC;AACA,QAAMC,GAAG,GAAGL,MAAM,CAAE,IAAF,CAAlB;AACA;;AACA,QAAMM,kBAAkB,GAAGN,MAAM,CAAE,IAAF,CAAjC;AACA,QAAMO,gBAAgB,GAAGP,MAAM,CAAEI,aAAF,CAA/B;AACAH,EAAAA,SAAS,CAAE,MAAM;AAChBM,IAAAA,gBAAgB,CAACC,OAAjB,GAA2BJ,aAA3B;AACA,GAFQ,EAEN,CAAEA,aAAF,CAFM,CAAT;AAIA,SAAOF,WAAW,CAAIO,IAAF,IAAY;AAC/B,QAAKA,IAAL,EAAY;AACX;AACAJ,MAAAA,GAAG,CAACG,OAAJ,GAAcC,IAAd,CAFW,CAIX;;AACA,UAAKH,kBAAkB,CAACE,OAAxB,EAAkC;AACjC;AACA;;AAEDF,MAAAA,kBAAkB,CAACE,OAAnB,GAA6BC,IAAI,CAACC,aAAL,CAAmBC,aAAhD;AACA,KAVD,MAUO,IAAKL,kBAAkB,CAACE,OAAxB,EAAkC;AAAA;;AACxC,YAAMI,SAAS,mBAAGP,GAAG,CAACG,OAAP,iDAAG,aAAaK,QAAb,kBACjBR,GAAG,CAACG,OADa,kDACjB,cAAaE,aAAb,CAA2BC,aADV,CAAlB;;AAIA,UAAK,iBAAAN,GAAG,CAACG,OAAJ,wDAAaM,WAAb,IAA4B,CAAEF,SAAnC,EAA+C;AAC9C;AACA,OAPuC,CASxC;AACA;AACA;AACA;;;AACA,UAAKL,gBAAgB,CAACC,OAAtB,EAAgC;AAC/BD,QAAAA,gBAAgB,CAACC,OAAjB;AACA,OAFD,MAEO;AAAA;;AACN;AAAkC,
|
|
1
|
+
{"version":3,"sources":["@wordpress/compose/src/hooks/use-focus-return/index.js"],"names":["useRef","useEffect","useCallback","useFocusReturn","onFocusReturn","ref","focusedBeforeMount","onFocusReturnRef","current","node","ownerDocument","activeElement","isFocused","contains","isConnected","focus"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,SAAjB,EAA4BC,WAA5B,QAA+C,oBAA/C;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,cAAT,CAAyBC,aAAzB,EAAyC;AACxC;AACA,QAAMC,GAAG,GAAGL,MAAM,CAAE,IAAF,CAAlB;AACA;;AACA,QAAMM,kBAAkB,GAAGN,MAAM,CAAE,IAAF,CAAjC;AACA,QAAMO,gBAAgB,GAAGP,MAAM,CAAEI,aAAF,CAA/B;AACAH,EAAAA,SAAS,CAAE,MAAM;AAChBM,IAAAA,gBAAgB,CAACC,OAAjB,GAA2BJ,aAA3B;AACA,GAFQ,EAEN,CAAEA,aAAF,CAFM,CAAT;AAIA,SAAOF,WAAW,CAAIO,IAAF,IAAY;AAC/B,QAAKA,IAAL,EAAY;AACX;AACAJ,MAAAA,GAAG,CAACG,OAAJ,GAAcC,IAAd,CAFW,CAIX;;AACA,UAAKH,kBAAkB,CAACE,OAAxB,EAAkC;AACjC;AACA;;AAEDF,MAAAA,kBAAkB,CAACE,OAAnB,GAA6BC,IAAI,CAACC,aAAL,CAAmBC,aAAhD;AACA,KAVD,MAUO,IAAKL,kBAAkB,CAACE,OAAxB,EAAkC;AAAA;;AACxC,YAAMI,SAAS,mBAAGP,GAAG,CAACG,OAAP,iDAAG,aAAaK,QAAb,kBACjBR,GAAG,CAACG,OADa,kDACjB,cAAaE,aAAb,CAA2BC,aADV,CAAlB;;AAIA,UAAK,iBAAAN,GAAG,CAACG,OAAJ,wDAAaM,WAAb,IAA4B,CAAEF,SAAnC,EAA+C;AAC9C;AACA,OAPuC,CASxC;AACA;AACA;AACA;;;AACA,UAAKL,gBAAgB,CAACC,OAAtB,EAAgC;AAC/BD,QAAAA,gBAAgB,CAACC,OAAjB;AACA,OAFD,MAEO;AAAA;;AACN;AAAkC,iCACjCF,kBAAkB,CAACE,OADc,gFAE/BO,KAF+B;AAGlC;AACD;AACD,GAhCiB,EAgCf,EAhCe,CAAlB;AAiCA;;AAED,eAAeZ,cAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useCallback } from '@wordpress/element';\n\n/**\n * When opening modals/sidebars/dialogs, the focus\n * must move to the opened area and return to the\n * previously focused element when closed.\n * The current hook implements the returning behavior.\n *\n * @param {() => void} [onFocusReturn] Overrides the default return behavior.\n * @return {import('react').RefCallback<HTMLElement>} Element Ref.\n *\n * @example\n * ```js\n * import { useFocusReturn } from '@wordpress/compose';\n *\n * const WithFocusReturn = () => {\n * const ref = useFocusReturn()\n * return (\n * <div ref={ ref }>\n * <Button />\n * <Button />\n * </div>\n * );\n * }\n * ```\n */\nfunction useFocusReturn( onFocusReturn ) {\n\t/** @type {import('react').MutableRefObject<null | HTMLElement>} */\n\tconst ref = useRef( null );\n\t/** @type {import('react').MutableRefObject<null | Element>} */\n\tconst focusedBeforeMount = useRef( null );\n\tconst onFocusReturnRef = useRef( onFocusReturn );\n\tuseEffect( () => {\n\t\tonFocusReturnRef.current = onFocusReturn;\n\t}, [ onFocusReturn ] );\n\n\treturn useCallback( ( node ) => {\n\t\tif ( node ) {\n\t\t\t// Set ref to be used when unmounting.\n\t\t\tref.current = node;\n\n\t\t\t// Only set when the node mounts.\n\t\t\tif ( focusedBeforeMount.current ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfocusedBeforeMount.current = node.ownerDocument.activeElement;\n\t\t} else if ( focusedBeforeMount.current ) {\n\t\t\tconst isFocused = ref.current?.contains(\n\t\t\t\tref.current?.ownerDocument.activeElement\n\t\t\t);\n\n\t\t\tif ( ref.current?.isConnected && ! isFocused ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Defer to the component's own explicit focus return behavior, if\n\t\t\t// specified. This allows for support that the `onFocusReturn`\n\t\t\t// decides to allow the default behavior to occur under some\n\t\t\t// conditions.\n\t\t\tif ( onFocusReturnRef.current ) {\n\t\t\t\tonFocusReturnRef.current();\n\t\t\t} else {\n\t\t\t\t/** @type {null | HTMLElement} */ (\n\t\t\t\t\tfocusedBeforeMount.current\n\t\t\t\t)?.focus();\n\t\t\t}\n\t\t}\n\t}, [] );\n}\n\nexport default useFocusReturn;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/compose/src/hooks/use-keyboard-shortcut/index.js"],"names":["Mousetrap","includes","castArray","useEffect","useRef","isAppleOS","_window","window","platform","navigator","indexOf","useKeyboardShortcut","shortcuts","callback","bindGlobal","eventName","isDisabled","target","currentCallback","current","mousetrap","document","forEach","shortcut","keys","split","modifiers","Set","filter","value","length","hasAlt","has","hasShift","size","Error","bindFn","reset"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,SAAP,MAAsB,WAAtB;AACA,OAAO,qDAAP;AACA,SAASC,QAAT,EAAmBC,SAAnB,QAAoC,QAApC;AAEA;AACA;AACA;;AACA,SAASC,SAAT,EAAoBC,MAApB,QAAkC,oBAAlC;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,SAAT,GAAuC;AAAA,MAAnBC,OAAmB,uEAATC,MAAS;;AACtC,QAAM;AAAEC,IAAAA;AAAF,MAAeF,OAAO,CAACG,SAA7B;AAEA,SACCD,QAAQ,CAACE,OAAT,CAAkB,KAAlB,MAA8B,CAAC,CAA/B,IACAT,QAAQ,CAAE,CAAE,MAAF,EAAU,QAAV,CAAF,EAAwBO,QAAxB,CAFT;AAIA;AAED;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,SAASG,mBAAT;AACC;AACAC,SAFD,EAGCC,QAHD,EAUE;AAAA,MAND;AACCC,IAAAA,UAAU,GAAG,KADd;AAECC,IAAAA,SAAS,GAAG,SAFb;AAGCC,IAAAA,UAAU,GAAG,KAHd;AAGqB;AACpBC,IAAAA;AAJD,GAMC,uEADG,EACH;AACD,QAAMC,eAAe,GAAGd,MAAM,CAAES,QAAF,CAA9B;AACAV,EAAAA,SAAS,CAAE,MAAM;AAChBe,IAAAA,eAAe,CAACC,OAAhB,GAA0BN,QAA1B;AACA,GAFQ,EAEN,CAAEA,QAAF,CAFM,CAAT;AAIAV,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKa,UAAL,EAAkB;AACjB;AACA;;AACD,UAAMI,SAAS,GAAG,IAAIpB,SAAJ,CACjBiB,MAAM,IAAIA,MAAM,CAACE,OAAjB,GACGF,MAAM,CAACE,OADV,GAEG;AACA;AACA;;AACA;;
|
|
1
|
+
{"version":3,"sources":["@wordpress/compose/src/hooks/use-keyboard-shortcut/index.js"],"names":["Mousetrap","includes","castArray","useEffect","useRef","isAppleOS","_window","window","platform","navigator","indexOf","useKeyboardShortcut","shortcuts","callback","bindGlobal","eventName","isDisabled","target","currentCallback","current","mousetrap","document","forEach","shortcut","keys","split","modifiers","Set","filter","value","length","hasAlt","has","hasShift","size","Error","bindFn","reset"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,SAAP,MAAsB,WAAtB;AACA,OAAO,qDAAP;AACA,SAASC,QAAT,EAAmBC,SAAnB,QAAoC,QAApC;AAEA;AACA;AACA;;AACA,SAASC,SAAT,EAAoBC,MAApB,QAAkC,oBAAlC;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,SAAT,GAAuC;AAAA,MAAnBC,OAAmB,uEAATC,MAAS;;AACtC,QAAM;AAAEC,IAAAA;AAAF,MAAeF,OAAO,CAACG,SAA7B;AAEA,SACCD,QAAQ,CAACE,OAAT,CAAkB,KAAlB,MAA8B,CAAC,CAA/B,IACAT,QAAQ,CAAE,CAAE,MAAF,EAAU,QAAV,CAAF,EAAwBO,QAAxB,CAFT;AAIA;AAED;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,SAASG,mBAAT;AACC;AACAC,SAFD,EAGCC,QAHD,EAUE;AAAA,MAND;AACCC,IAAAA,UAAU,GAAG,KADd;AAECC,IAAAA,SAAS,GAAG,SAFb;AAGCC,IAAAA,UAAU,GAAG,KAHd;AAGqB;AACpBC,IAAAA;AAJD,GAMC,uEADG,EACH;AACD,QAAMC,eAAe,GAAGd,MAAM,CAAES,QAAF,CAA9B;AACAV,EAAAA,SAAS,CAAE,MAAM;AAChBe,IAAAA,eAAe,CAACC,OAAhB,GAA0BN,QAA1B;AACA,GAFQ,EAEN,CAAEA,QAAF,CAFM,CAAT;AAIAV,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKa,UAAL,EAAkB;AACjB;AACA;;AACD,UAAMI,SAAS,GAAG,IAAIpB,SAAJ,CACjBiB,MAAM,IAAIA,MAAM,CAACE,OAAjB,GACGF,MAAM,CAACE,OADV,GAEG;AACA;AACA;;AACA;;AAAyB;AAAyBE,IAAAA,QANpC,CAAlB;AAQAnB,IAAAA,SAAS,CAAEU,SAAF,CAAT,CAAuBU,OAAvB,CAAkCC,QAAF,IAAgB;AAC/C,YAAMC,IAAI,GAAGD,QAAQ,CAACE,KAAT,CAAgB,GAAhB,CAAb,CAD+C,CAE/C;AACA;AACA;;AACA,YAAMC,SAAS,GAAG,IAAIC,GAAJ,CACjBH,IAAI,CAACI,MAAL,CAAeC,KAAF,IAAaA,KAAK,CAACC,MAAN,GAAe,CAAzC,CADiB,CAAlB;AAGA,YAAMC,MAAM,GAAGL,SAAS,CAACM,GAAV,CAAe,KAAf,CAAf;AACA,YAAMC,QAAQ,GAAGP,SAAS,CAACM,GAAV,CAAe,OAAf,CAAjB,CAT+C,CAW/C;;AACA,UACC3B,SAAS,OACLqB,SAAS,CAACQ,IAAV,KAAmB,CAAnB,IAAwBH,MAA1B,IACCL,SAAS,CAACQ,IAAV,KAAmB,CAAnB,IAAwBH,MAAxB,IAAkCE,QAF5B,CADV,EAIE;AACD,cAAM,IAAIE,KAAJ,CACJ,eAAeZ,QAAU,iEADrB,CAAN;AAGA;;AAED,YAAMa,MAAM,GAAGtB,UAAU,GAAG,YAAH,GAAkB,MAA3C,CAtB+C,CAuB/C;;AACAM,MAAAA,SAAS,CAAEgB,MAAF,CAAT,CACCb,QADD,EAEC;AAAA;AAIC;AACAL,UAAAA,eAAe,CAACC,OAAhB,CAAyB,YAAzB;AALD;AAAA,OAFD,EAQCJ,SARD;AAUA,KAlCD;AAoCA,WAAO,MAAM;AACZK,MAAAA,SAAS,CAACiB,KAAV;AACA,KAFD;AAGA,GAnDQ,EAmDN,CAAEzB,SAAF,EAAaE,UAAb,EAAyBC,SAAzB,EAAoCE,MAApC,EAA4CD,UAA5C,CAnDM,CAAT;AAoDA;;AAED,eAAeL,mBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport Mousetrap from 'mousetrap';\nimport 'mousetrap/plugins/global-bind/mousetrap-global-bind';\nimport { includes, castArray } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\n\n/**\n * A block selection object.\n *\n * @typedef {Object} WPKeyboardShortcutConfig\n *\n * @property {boolean} [bindGlobal] Handle keyboard events anywhere including inside textarea/input fields.\n * @property {string} [eventName] Event name used to trigger the handler, defaults to keydown.\n * @property {boolean} [isDisabled] Disables the keyboard handler if the value is true.\n * @property {import('react').RefObject<HTMLElement>} [target] React reference to the DOM element used to catch the keyboard event.\n */\n\n/**\n * Return true if platform is MacOS.\n *\n * @param {Window} [_window] window object by default; used for DI testing.\n *\n * @return {boolean} True if MacOS; false otherwise.\n */\nfunction isAppleOS( _window = window ) {\n\tconst { platform } = _window.navigator;\n\n\treturn (\n\t\tplatform.indexOf( 'Mac' ) !== -1 ||\n\t\tincludes( [ 'iPad', 'iPhone' ], platform )\n\t);\n}\n\n/* eslint-disable jsdoc/valid-types */\n/**\n * Attach a keyboard shortcut handler.\n *\n * @see https://craig.is/killing/mice#api.bind for information about the `callback` parameter.\n *\n * @param {string[]|string} shortcuts Keyboard Shortcuts.\n * @param {(e: import('mousetrap').ExtendedKeyboardEvent, combo: string) => void} callback Shortcut callback.\n * @param {WPKeyboardShortcutConfig} options Shortcut options.\n */\nfunction useKeyboardShortcut(\n\t/* eslint-enable jsdoc/valid-types */\n\tshortcuts,\n\tcallback,\n\t{\n\t\tbindGlobal = false,\n\t\teventName = 'keydown',\n\t\tisDisabled = false, // This is important for performance considerations.\n\t\ttarget,\n\t} = {}\n) {\n\tconst currentCallback = useRef( callback );\n\tuseEffect( () => {\n\t\tcurrentCallback.current = callback;\n\t}, [ callback ] );\n\n\tuseEffect( () => {\n\t\tif ( isDisabled ) {\n\t\t\treturn;\n\t\t}\n\t\tconst mousetrap = new Mousetrap(\n\t\t\ttarget && target.current\n\t\t\t\t? target.current\n\t\t\t\t: // We were passing `document` here previously, so to successfully cast it to Element we must cast it first to `unknown`.\n\t\t\t\t // Not sure if this is a mistake but it was the behavior previous to the addition of types so we're just doing what's\n\t\t\t\t // necessary to maintain the existing behavior.\n\t\t\t\t /** @type {Element} */ ( /** @type {unknown} */ ( document ) )\n\t\t);\n\t\tcastArray( shortcuts ).forEach( ( shortcut ) => {\n\t\t\tconst keys = shortcut.split( '+' );\n\t\t\t// Determines whether a key is a modifier by the length of the string.\n\t\t\t// E.g. if I add a pass a shortcut Shift+Cmd+M, it'll determine that\n\t\t\t// the modifiers are Shift and Cmd because they're not a single character.\n\t\t\tconst modifiers = new Set(\n\t\t\t\tkeys.filter( ( value ) => value.length > 1 )\n\t\t\t);\n\t\t\tconst hasAlt = modifiers.has( 'alt' );\n\t\t\tconst hasShift = modifiers.has( 'shift' );\n\n\t\t\t// This should be better moved to the shortcut registration instead.\n\t\t\tif (\n\t\t\t\tisAppleOS() &&\n\t\t\t\t( ( modifiers.size === 1 && hasAlt ) ||\n\t\t\t\t\t( modifiers.size === 2 && hasAlt && hasShift ) )\n\t\t\t) {\n\t\t\t\tthrow new Error(\n\t\t\t\t\t`Cannot bind ${ shortcut }. Alt and Shift+Alt modifiers are reserved for character input.`\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tconst bindFn = bindGlobal ? 'bindGlobal' : 'bind';\n\t\t\t// @ts-ignore `bindGlobal` is an undocumented property\n\t\t\tmousetrap[ bindFn ](\n\t\t\t\tshortcut,\n\t\t\t\t(\n\t\t\t\t\t/* eslint-disable jsdoc/valid-types */\n\t\t\t\t\t/** @type {[e: import('mousetrap').ExtendedKeyboardEvent, combo: string]} */ ...args\n\t\t\t\t) =>\n\t\t\t\t\t/* eslint-enable jsdoc/valid-types */\n\t\t\t\t\tcurrentCallback.current( ...args ),\n\t\t\t\teventName\n\t\t\t);\n\t\t} );\n\n\t\treturn () => {\n\t\t\tmousetrap.reset();\n\t\t};\n\t}, [ shortcuts, bindGlobal, eventName, target, isDisabled ] );\n}\n\nexport default useKeyboardShortcut;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/compose/src/hooks/use-merge-refs/index.js"],"names":["useRef","useCallback","useLayoutEffect","assignRef","ref","value","hasOwnProperty","current","useMergeRefs","refs","element","didElementChange","previousRefs","currentRefs","forEach","index","previousRef","refsToAssign"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,WAAjB,EAA8BC,eAA9B,QAAqD,oBAArD;AAEA;;AACA;AACA;AACA;AACA;;AACA;;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,SAAT,CAAoBC,GAApB,EAAyBC,KAAzB,EAAiC;AAChC,MAAK,OAAOD,GAAP,KAAe,UAApB,EAAiC;AAChCA,IAAAA,GAAG,CAAEC,KAAF,CAAH;AACA,GAFD,MAEO,IAAKD,GAAG,IAAIA,GAAG,CAACE,cAAJ,CAAoB,SAApB,CAAZ,EAA8C;AACpD;;AACA;AAAqDF,IAAAA,GAAF,CAAQG,OAAR,
|
|
1
|
+
{"version":3,"sources":["@wordpress/compose/src/hooks/use-merge-refs/index.js"],"names":["useRef","useCallback","useLayoutEffect","assignRef","ref","value","hasOwnProperty","current","useMergeRefs","refs","element","didElementChange","previousRefs","currentRefs","forEach","index","previousRef","refsToAssign"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,WAAjB,EAA8BC,eAA9B,QAAqD,oBAArD;AAEA;;AACA;AACA;AACA;AACA;;AACA;;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,SAAT,CAAoBC,GAApB,EAAyBC,KAAzB,EAAiC;AAChC,MAAK,OAAOD,GAAP,KAAe,UAApB,EAAiC;AAChCA,IAAAA,GAAG,CAAEC,KAAF,CAAH;AACA,GAFD,MAEO,IAAKD,GAAG,IAAIA,GAAG,CAACE,cAAJ,CAAoB,SAApB,CAAZ,EAA8C;AACpD;;AACA;AAAqDF,IAAAA,GAAF,CAAQG,OAAR,GAClDF,KADkD;AAEnD;AACA;AACD;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,eAAe,SAASG,YAAT,CAAuBC,IAAvB,EAA8B;AAC5C,QAAMC,OAAO,GAAGV,MAAM,EAAtB;AACA,QAAMW,gBAAgB,GAAGX,MAAM,CAAE,KAAF,CAA/B;AACA;;AACA;;AACA;;AACA,QAAMY,YAAY,GAAGZ,MAAM,CAAE,EAAF,CAA3B;AACA,QAAMa,WAAW,GAAGb,MAAM,CAAES,IAAF,CAA1B,CAP4C,CAS5C;AACA;;AACAI,EAAAA,WAAW,CAACN,OAAZ,GAAsBE,IAAtB,CAX4C,CAa5C;AACA;AACA;;AACAP,EAAAA,eAAe,CAAE,MAAM;AACtB,QAAKS,gBAAgB,CAACJ,OAAjB,KAA6B,KAAlC,EAA0C;AACzCE,MAAAA,IAAI,CAACK,OAAL,CAAc,CAAEV,GAAF,EAAOW,KAAP,KAAkB;AAC/B,cAAMC,WAAW,GAAGJ,YAAY,CAACL,OAAb,CAAsBQ,KAAtB,CAApB;;AACA,YAAKX,GAAG,KAAKY,WAAb,EAA2B;AAC1Bb,UAAAA,SAAS,CAAEa,WAAF,EAAe,IAAf,CAAT;AACAb,UAAAA,SAAS,CAAEC,GAAF,EAAOM,OAAO,CAACH,OAAf,CAAT;AACA;AACD,OAND;AAOA;;AAEDK,IAAAA,YAAY,CAACL,OAAb,GAAuBE,IAAvB;AACA,GAZc,EAYZA,IAZY,CAAf,CAhB4C,CA8B5C;AACA;;AACAP,EAAAA,eAAe,CAAE,MAAM;AACtBS,IAAAA,gBAAgB,CAACJ,OAAjB,GAA2B,KAA3B;AACA,GAFc,CAAf,CAhC4C,CAoC5C;AACA;;AACA,SAAON,WAAW,CAAII,KAAF,IAAa;AAChC;AACA;AACAF,IAAAA,SAAS,CAAEO,OAAF,EAAWL,KAAX,CAAT;AAEAM,IAAAA,gBAAgB,CAACJ,OAAjB,GAA2B,IAA3B,CALgC,CAOhC;AACA;;AACA,UAAMU,YAAY,GAAGZ,KAAK,GAAGQ,WAAW,CAACN,OAAf,GAAyBK,YAAY,CAACL,OAAhE,CATgC,CAWhC;;AACA,SAAM,MAAMH,GAAZ,IAAmBa,YAAnB,EAAkC;AACjCd,MAAAA,SAAS,CAAEC,GAAF,EAAOC,KAAP,CAAT;AACA;AACD,GAfiB,EAef,EAfe,CAAlB;AAgBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useCallback, useLayoutEffect } from '@wordpress/element';\n\n/* eslint-disable jsdoc/valid-types */\n/**\n * @template T\n * @typedef {T extends import('react').Ref<infer R> ? R : never} TypeFromRef\n */\n/* eslint-enable jsdoc/valid-types */\n\n/**\n * @template T\n * @param {import('react').Ref<T>} ref\n * @param {T} value\n */\nfunction assignRef( ref, value ) {\n\tif ( typeof ref === 'function' ) {\n\t\tref( value );\n\t} else if ( ref && ref.hasOwnProperty( 'current' ) ) {\n\t\t/* eslint-disable jsdoc/no-undefined-types */\n\t\t/** @type {import('react').MutableRefObject<T>} */ ( ref ).current =\n\t\t\tvalue;\n\t\t/* eslint-enable jsdoc/no-undefined-types */\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 * @template {import('react').Ref<any>} TRef\n * @param {Array<TRef>} refs The refs to be merged.\n *\n * @return {import('react').RefCallback<TypeFromRef<TRef>>} The merged ref callback.\n */\nexport default function useMergeRefs( refs ) {\n\tconst element = useRef();\n\tconst didElementChange = useRef( false );\n\t/* eslint-disable jsdoc/no-undefined-types */\n\t/** @type {import('react').MutableRefObject<TRef[]>} */\n\t/* eslint-enable jsdoc/no-undefined-types */\n\tconst previousRefs = useRef( [] );\n\tconst currentRefs = 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\tcurrentRefs.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 ( didElementChange.current === false ) {\n\t\t\trefs.forEach( ( ref, index ) => {\n\t\t\t\tconst previousRef = previousRefs.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\tpreviousRefs.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\tdidElementChange.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 ) => {\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\tdidElementChange.current = true;\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 ? currentRefs.current : previousRefs.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"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/compose/src/hooks/use-ref-effect/index.ts"],"names":["useCallback","useRef","useRefEffect","callback","dependencies","cleanup","node","current"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,WAAT,EAAsBC,MAAtB,QAAoC,oBAApC;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,YAAT,CACdC,QADc,EAEdC,YAFc,EAGmB;AACjC,QAAMC,OAAO,GAAGJ,MAAM,EAAtB;AACA,SAAOD,WAAW,CAAIM,IAAF,IAA6B;AAChD,QAAKA,IAAL,EAAY;AACXD,MAAAA,OAAO,CAACE,OAAR,GAAkBJ,QAAQ,CAAEG,IAAF,CAA1B;AACA,KAFD,MAEO,IAAKD,OAAO,CAACE,OAAb,EAAuB;AAC7BF,MAAAA,OAAO,CAACE,OAAR;AACA;AACD,GANiB,EAMfH,YANe,CAAlB;AAOA","sourcesContent":["/**\n * External dependencies\n */\nimport type { DependencyList, RefCallback } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useRef } from '@wordpress/element';\n\n/**\n * Effect-like ref callback. Just like with `useEffect`, this allows you to\n * return a cleanup function to be run if the ref changes or one of the\n * dependencies changes. The ref is provided as an argument to the callback\n * functions. The main difference between this and `useEffect` is that\n * the `useEffect` callback is not called when the ref changes, but this is.\n * Pass the returned ref callback as the component's ref and merge multiple refs\n * with `useMergeRefs`.\n *\n * It's worth noting that if the dependencies array is empty, there's not\n * strictly a need to clean up event handlers for example, because the node is\n * to be removed. It *is* necessary if you add dependencies because the ref\n * callback will be called multiple times for the same node.\n *\n * @param callback Callback with ref as argument.\n * @param dependencies Dependencies of the callback.\n *\n * @return Ref callback.\n */\nexport default function useRefEffect< TElement = Node >(\n\tcallback: ( node: TElement ) => ( () => void ) |
|
|
1
|
+
{"version":3,"sources":["@wordpress/compose/src/hooks/use-ref-effect/index.ts"],"names":["useCallback","useRef","useRefEffect","callback","dependencies","cleanup","node","current"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,WAAT,EAAsBC,MAAtB,QAAoC,oBAApC;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,YAAT,CACdC,QADc,EAEdC,YAFc,EAGmB;AACjC,QAAMC,OAAO,GAAGJ,MAAM,EAAtB;AACA,SAAOD,WAAW,CAAIM,IAAF,IAA6B;AAChD,QAAKA,IAAL,EAAY;AACXD,MAAAA,OAAO,CAACE,OAAR,GAAkBJ,QAAQ,CAAEG,IAAF,CAA1B;AACA,KAFD,MAEO,IAAKD,OAAO,CAACE,OAAb,EAAuB;AAC7BF,MAAAA,OAAO,CAACE,OAAR;AACA;AACD,GANiB,EAMfH,YANe,CAAlB;AAOA","sourcesContent":["/**\n * External dependencies\n */\nimport type { DependencyList, RefCallback } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useRef } from '@wordpress/element';\n\n/**\n * Effect-like ref callback. Just like with `useEffect`, this allows you to\n * return a cleanup function to be run if the ref changes or one of the\n * dependencies changes. The ref is provided as an argument to the callback\n * functions. The main difference between this and `useEffect` is that\n * the `useEffect` callback is not called when the ref changes, but this is.\n * Pass the returned ref callback as the component's ref and merge multiple refs\n * with `useMergeRefs`.\n *\n * It's worth noting that if the dependencies array is empty, there's not\n * strictly a need to clean up event handlers for example, because the node is\n * to be removed. It *is* necessary if you add dependencies because the ref\n * callback will be called multiple times for the same node.\n *\n * @param callback Callback with ref as argument.\n * @param dependencies Dependencies of the callback.\n *\n * @return Ref callback.\n */\nexport default function useRefEffect< TElement = Node >(\n\tcallback: ( node: TElement ) => ( () => void ) | void,\n\tdependencies: DependencyList\n): RefCallback< TElement | null > {\n\tconst cleanup = useRef< ( () => void ) | void >();\n\treturn useCallback( ( node: TElement | null ) => {\n\t\tif ( node ) {\n\t\t\tcleanup.current = callback( node );\n\t\t} else if ( cleanup.current ) {\n\t\t\tcleanup.current();\n\t\t}\n\t}, dependencies );\n}\n"]}
|