@wordpress/compose 6.33.0 → 6.35.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 +6 -0
- package/README.md +21 -0
- package/build/hooks/use-focusable-iframe/index.js +6 -2
- package/build/hooks/use-focusable-iframe/index.js.map +1 -1
- package/build/hooks/use-instance-id/index.js +3 -1
- package/build/hooks/use-instance-id/index.js.map +1 -1
- package/build/hooks/use-media-query/index.js +13 -2
- package/build/hooks/use-media-query/index.js.map +1 -1
- package/build/hooks/use-observable-value/index.js +32 -0
- package/build/hooks/use-observable-value/index.js.map +1 -0
- package/build/index.js +21 -1
- package/build/index.js.map +1 -1
- package/build/index.native.js +21 -1
- package/build/index.native.js.map +1 -1
- package/build/utils/observable-map/index.js +58 -0
- package/build/utils/observable-map/index.js.map +1 -0
- package/build-module/hooks/use-focusable-iframe/index.js +6 -2
- package/build-module/hooks/use-focusable-iframe/index.js.map +1 -1
- package/build-module/hooks/use-instance-id/index.js +3 -1
- package/build-module/hooks/use-instance-id/index.js.map +1 -1
- package/build-module/hooks/use-media-query/index.js +12 -2
- package/build-module/hooks/use-media-query/index.js.map +1 -1
- package/build-module/hooks/use-observable-value/index.js +26 -0
- package/build-module/hooks/use-observable-value/index.js.map +1 -0
- package/build-module/index.js +3 -0
- package/build-module/index.js.map +1 -1
- package/build-module/index.native.js +3 -0
- package/build-module/index.native.js.map +1 -1
- package/build-module/utils/observable-map/index.js +52 -0
- package/build-module/utils/observable-map/index.js.map +1 -0
- package/build-types/higher-order/if-condition/index.d.ts +1 -1
- package/build-types/higher-order/if-condition/index.d.ts.map +1 -1
- package/build-types/higher-order/with-instance-id/index.d.ts +1 -1
- 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 +1 -1
- package/build-types/hooks/use-focusable-iframe/index.d.ts.map +1 -1
- package/build-types/hooks/use-instance-id/index.d.ts.map +1 -1
- package/build-types/hooks/use-media-query/index.d.ts.map +1 -1
- package/build-types/hooks/use-observable-value/index.d.ts +18 -0
- package/build-types/hooks/use-observable-value/index.d.ts.map +1 -0
- package/build-types/index.d.ts +2 -0
- package/build-types/utils/observable-map/index.d.ts +19 -0
- package/build-types/utils/observable-map/index.d.ts.map +1 -0
- package/package.json +9 -9
- package/src/hooks/use-focusable-iframe/index.ts +6 -2
- package/src/hooks/use-instance-id/index.ts +3 -1
- package/src/hooks/use-media-query/index.js +15 -2
- package/src/hooks/use-media-query/test/index.js +5 -4
- package/src/hooks/use-observable-value/index.ts +35 -0
- package/src/hooks/use-observable-value/test/index.js +42 -0
- package/src/index.js +3 -0
- package/src/index.native.js +3 -0
- package/src/utils/observable-map/index.ts +61 -0
- package/src/utils/observable-map/test/index.js +43 -0
- package/tsconfig.tsbuildinfo +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["default","compose","pipe","ifCondition","pure","withGlobalEvents","withInstanceId","withSafeTimeout","withState","useConstrainedTabbing","useCopyOnClick","useCopyToClipboard","__experimentalUseDialog","useDisabled","__experimentalUseDragging","useFocusOnMount","__experimentalUseFocusOutside","useFocusReturn","useInstanceId","useIsomorphicLayoutEffect","useKeyboardShortcut","useMediaQuery","usePrevious","useReducedMotion","useStateWithHistory","useViewportMatch","useResizeObserver","useAsyncList","useWarnOnChange","useDebounce","useDebouncedInput","useThrottle","useMergeRefs","useRefEffect","__experimentalUseDropZone","useFocusableIframe","__experimentalUseFixedWindowList"],"sources":["@wordpress/compose/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\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 __experimentalUseDragging } from './hooks/use-dragging';\nexport { default as 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';\n"],"mappings":"AAAA;AACA,cAAc,uCAAuC;AACrD;AACA,cAAc,kBAAkB;AAChC;AACA,cAAc,kBAAkB;;
|
|
1
|
+
{"version":3,"names":["default","compose","pipe","ifCondition","pure","withGlobalEvents","withInstanceId","withSafeTimeout","withState","useConstrainedTabbing","useCopyOnClick","useCopyToClipboard","__experimentalUseDialog","useDisabled","__experimentalUseDragging","useFocusOnMount","__experimentalUseFocusOutside","useFocusReturn","useInstanceId","useIsomorphicLayoutEffect","useKeyboardShortcut","useMediaQuery","usePrevious","useReducedMotion","useStateWithHistory","useViewportMatch","useResizeObserver","useAsyncList","useWarnOnChange","useDebounce","useDebouncedInput","useThrottle","useMergeRefs","useRefEffect","__experimentalUseDropZone","useFocusableIframe","__experimentalUseFixedWindowList","useObservableValue"],"sources":["@wordpress/compose/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 __experimentalUseDragging } from './hooks/use-dragging';\nexport { default as 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;AACA,cAAc,uCAAuC;AACrD;AACA,cAAc,kBAAkB;AAChC;AACA,cAAc,kBAAkB;AAChC;AACA,cAAc,wBAAwB;;AAEtC;AACA,SAASA,OAAO,IAAIC,OAAO,QAAQ,wBAAwB;AAC3D,SAASD,OAAO,IAAIE,IAAI,QAAQ,qBAAqB;;AAErD;AACA,SAASF,OAAO,IAAIG,WAAW,QAAQ,6BAA6B;AACpE,SAASH,OAAO,IAAII,IAAI,QAAQ,qBAAqB;AACrD,SAASJ,OAAO,IAAIK,gBAAgB,QAAQ,mCAAmC;AAC/E,SAASL,OAAO,IAAIM,cAAc,QAAQ,iCAAiC;AAC3E,SAASN,OAAO,IAAIO,eAAe,QAAQ,kCAAkC;AAC7E,SAASP,OAAO,IAAIQ,SAAS,QAAQ,2BAA2B;;AAEhE;AACA,SAASR,OAAO,IAAIS,qBAAqB,QAAQ,iCAAiC;AAClF,SAAST,OAAO,IAAIU,cAAc,QAAQ,2BAA2B;AACrE,SAASV,OAAO,IAAIW,kBAAkB,QAAQ,+BAA+B;AAC7E,SAASX,OAAO,IAAIY,uBAAuB,QAAQ,oBAAoB;AACvE,SAASZ,OAAO,IAAIa,WAAW,QAAQ,sBAAsB;AAC7D,SAASb,OAAO,IAAIc,yBAAyB,QAAQ,sBAAsB;AAC3E,SAASd,OAAO,IAAIe,eAAe,QAAQ,4BAA4B;AACvE,SAASf,OAAO,IAAIgB,6BAA6B,QAAQ,2BAA2B;AACpF,SAAShB,OAAO,IAAIiB,cAAc,QAAQ,0BAA0B;AACpE,SAASjB,OAAO,IAAIkB,aAAa,QAAQ,yBAAyB;AAClE,SAASlB,OAAO,IAAImB,yBAAyB,QAAQ,sCAAsC;AAC3F,SAASnB,OAAO,IAAIoB,mBAAmB,QAAQ,+BAA+B;AAC9E,SAASpB,OAAO,IAAIqB,aAAa,QAAQ,yBAAyB;AAClE,SAASrB,OAAO,IAAIsB,WAAW,QAAQ,sBAAsB;AAC7D,SAAStB,OAAO,IAAIuB,gBAAgB,QAAQ,4BAA4B;AACxE,SAASvB,OAAO,IAAIwB,mBAAmB,QAAQ,gCAAgC;AAC/E,SAASxB,OAAO,IAAIyB,gBAAgB,QAAQ,4BAA4B;AACxE,SAASzB,OAAO,IAAI0B,iBAAiB,QAAQ,6BAA6B;AAC1E,SAAS1B,OAAO,IAAI2B,YAAY,QAAQ,wBAAwB;AAChE,SAAS3B,OAAO,IAAI4B,eAAe,QAAQ,4BAA4B;AACvE,SAAS5B,OAAO,IAAI6B,WAAW,QAAQ,sBAAsB;AAC7D,SAAS7B,OAAO,IAAI8B,iBAAiB,QAAQ,6BAA6B;AAC1E,SAAS9B,OAAO,IAAI+B,WAAW,QAAQ,sBAAsB;AAC7D,SAAS/B,OAAO,IAAIgC,YAAY,QAAQ,wBAAwB;AAChE,SAAShC,OAAO,IAAIiC,YAAY,QAAQ,wBAAwB;AAChE,SAASjC,OAAO,IAAIkC,yBAAyB,QAAQ,uBAAuB;AAC5E,SAASlC,OAAO,IAAImC,kBAAkB,QAAQ,8BAA8B;AAC5E,SAASnC,OAAO,IAAIoC,gCAAgC,QAAQ,+BAA+B;AAC3F,SAASpC,OAAO,IAAIqC,kBAAkB,QAAQ,8BAA8B","ignoreList":[]}
|
|
@@ -4,6 +4,8 @@ export * from './utils/create-higher-order-component';
|
|
|
4
4
|
export * from './utils/debounce';
|
|
5
5
|
// The `throttle` helper and its types.
|
|
6
6
|
export * from './utils/throttle';
|
|
7
|
+
// The `ObservableMap` data structure
|
|
8
|
+
export * from './utils/observable-map';
|
|
7
9
|
|
|
8
10
|
// The `compose` and `pipe` helpers (inspired by `flowRight` and `flow` from Lodash).
|
|
9
11
|
export { default as compose } from './higher-order/compose';
|
|
@@ -39,4 +41,5 @@ export { default as useThrottle } from './hooks/use-throttle';
|
|
|
39
41
|
export { default as useMergeRefs } from './hooks/use-merge-refs';
|
|
40
42
|
export { default as useRefEffect } from './hooks/use-ref-effect';
|
|
41
43
|
export { default as useNetworkConnectivity } from './hooks/use-network-connectivity';
|
|
44
|
+
export { default as useObservableValue } from './hooks/use-observable-value';
|
|
42
45
|
//# sourceMappingURL=index.native.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["default","compose","pipe","ifCondition","pure","withGlobalEvents","withInstanceId","withSafeTimeout","withState","withPreferredColorScheme","withNetworkConnectivity","useConstrainedTabbing","__experimentalUseDragging","__experimentalUseFocusOutside","useInstanceId","useIsomorphicLayoutEffect","useKeyboardShortcut","useMediaQuery","usePrevious","useReducedMotion","useViewportMatch","usePreferredColorScheme","usePreferredColorSchemeStyle","useResizeObserver","useDebounce","useDebouncedInput","useThrottle","useMergeRefs","useRefEffect","useNetworkConnectivity"],"sources":["@wordpress/compose/src/index.native.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\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';\nexport { default as withPreferredColorScheme } from './higher-order/with-preferred-color-scheme';\nexport { default as withNetworkConnectivity } from './higher-order/with-network-connectivity';\n\n// Hooks.\nexport { default as useConstrainedTabbing } from './hooks/use-constrained-tabbing';\nexport { default as __experimentalUseDragging } from './hooks/use-dragging';\nexport { default as __experimentalUseFocusOutside } from './hooks/use-focus-outside';\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 useViewportMatch } from './hooks/use-viewport-match';\nexport { default as usePreferredColorScheme } from './hooks/use-preferred-color-scheme';\nexport { default as usePreferredColorSchemeStyle } from './hooks/use-preferred-color-scheme-style';\nexport { default as useResizeObserver } from './hooks/use-resize-observer';\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 useNetworkConnectivity } from './hooks/use-network-connectivity';\n"],"mappings":"AAAA;AACA,cAAc,uCAAuC;AACrD;AACA,cAAc,kBAAkB;AAChC;AACA,cAAc,kBAAkB;;
|
|
1
|
+
{"version":3,"names":["default","compose","pipe","ifCondition","pure","withGlobalEvents","withInstanceId","withSafeTimeout","withState","withPreferredColorScheme","withNetworkConnectivity","useConstrainedTabbing","__experimentalUseDragging","__experimentalUseFocusOutside","useInstanceId","useIsomorphicLayoutEffect","useKeyboardShortcut","useMediaQuery","usePrevious","useReducedMotion","useViewportMatch","usePreferredColorScheme","usePreferredColorSchemeStyle","useResizeObserver","useDebounce","useDebouncedInput","useThrottle","useMergeRefs","useRefEffect","useNetworkConnectivity","useObservableValue"],"sources":["@wordpress/compose/src/index.native.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';\nexport { default as withPreferredColorScheme } from './higher-order/with-preferred-color-scheme';\nexport { default as withNetworkConnectivity } from './higher-order/with-network-connectivity';\n\n// Hooks.\nexport { default as useConstrainedTabbing } from './hooks/use-constrained-tabbing';\nexport { default as __experimentalUseDragging } from './hooks/use-dragging';\nexport { default as __experimentalUseFocusOutside } from './hooks/use-focus-outside';\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 useViewportMatch } from './hooks/use-viewport-match';\nexport { default as usePreferredColorScheme } from './hooks/use-preferred-color-scheme';\nexport { default as usePreferredColorSchemeStyle } from './hooks/use-preferred-color-scheme-style';\nexport { default as useResizeObserver } from './hooks/use-resize-observer';\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 useNetworkConnectivity } from './hooks/use-network-connectivity';\nexport { default as useObservableValue } from './hooks/use-observable-value';\n"],"mappings":"AAAA;AACA,cAAc,uCAAuC;AACrD;AACA,cAAc,kBAAkB;AAChC;AACA,cAAc,kBAAkB;AAChC;AACA,cAAc,wBAAwB;;AAEtC;AACA,SAASA,OAAO,IAAIC,OAAO,QAAQ,wBAAwB;AAC3D,SAASD,OAAO,IAAIE,IAAI,QAAQ,qBAAqB;;AAErD;AACA,SAASF,OAAO,IAAIG,WAAW,QAAQ,6BAA6B;AACpE,SAASH,OAAO,IAAII,IAAI,QAAQ,qBAAqB;AACrD,SAASJ,OAAO,IAAIK,gBAAgB,QAAQ,mCAAmC;AAC/E,SAASL,OAAO,IAAIM,cAAc,QAAQ,iCAAiC;AAC3E,SAASN,OAAO,IAAIO,eAAe,QAAQ,kCAAkC;AAC7E,SAASP,OAAO,IAAIQ,SAAS,QAAQ,2BAA2B;AAChE,SAASR,OAAO,IAAIS,wBAAwB,QAAQ,4CAA4C;AAChG,SAAST,OAAO,IAAIU,uBAAuB,QAAQ,0CAA0C;;AAE7F;AACA,SAASV,OAAO,IAAIW,qBAAqB,QAAQ,iCAAiC;AAClF,SAASX,OAAO,IAAIY,yBAAyB,QAAQ,sBAAsB;AAC3E,SAASZ,OAAO,IAAIa,6BAA6B,QAAQ,2BAA2B;AACpF,SAASb,OAAO,IAAIc,aAAa,QAAQ,yBAAyB;AAClE,SAASd,OAAO,IAAIe,yBAAyB,QAAQ,sCAAsC;AAC3F,SAASf,OAAO,IAAIgB,mBAAmB,QAAQ,+BAA+B;AAC9E,SAAShB,OAAO,IAAIiB,aAAa,QAAQ,yBAAyB;AAClE,SAASjB,OAAO,IAAIkB,WAAW,QAAQ,sBAAsB;AAC7D,SAASlB,OAAO,IAAImB,gBAAgB,QAAQ,4BAA4B;AACxE,SAASnB,OAAO,IAAIoB,gBAAgB,QAAQ,4BAA4B;AACxE,SAASpB,OAAO,IAAIqB,uBAAuB,QAAQ,oCAAoC;AACvF,SAASrB,OAAO,IAAIsB,4BAA4B,QAAQ,0CAA0C;AAClG,SAAStB,OAAO,IAAIuB,iBAAiB,QAAQ,6BAA6B;AAC1E,SAASvB,OAAO,IAAIwB,WAAW,QAAQ,sBAAsB;AAC7D,SAASxB,OAAO,IAAIyB,iBAAiB,QAAQ,6BAA6B;AAC1E,SAASzB,OAAO,IAAI0B,WAAW,QAAQ,sBAAsB;AAC7D,SAAS1B,OAAO,IAAI2B,YAAY,QAAQ,wBAAwB;AAChE,SAAS3B,OAAO,IAAI4B,YAAY,QAAQ,wBAAwB;AAChE,SAAS5B,OAAO,IAAI6B,sBAAsB,QAAQ,kCAAkC;AACpF,SAAS7B,OAAO,IAAI8B,kBAAkB,QAAQ,8BAA8B","ignoreList":[]}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A constructor (factory) for `ObservableMap`, a map-like key/value data structure
|
|
3
|
+
* where the individual entries are observable: using the `subscribe` method, you can
|
|
4
|
+
* subscribe to updates for a particular keys. Each subscriber always observes one
|
|
5
|
+
* specific key and is not notified about any unrelated changes (for different keys)
|
|
6
|
+
* in the `ObservableMap`.
|
|
7
|
+
*
|
|
8
|
+
* @template K The type of the keys in the map.
|
|
9
|
+
* @template V The type of the values in the map.
|
|
10
|
+
* @return A new instance of the `ObservableMap` type.
|
|
11
|
+
*/
|
|
12
|
+
export function observableMap() {
|
|
13
|
+
const map = new Map();
|
|
14
|
+
const listeners = new Map();
|
|
15
|
+
function callListeners(name) {
|
|
16
|
+
const list = listeners.get(name);
|
|
17
|
+
if (!list) {
|
|
18
|
+
return;
|
|
19
|
+
}
|
|
20
|
+
for (const listener of list) {
|
|
21
|
+
listener();
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
return {
|
|
25
|
+
get(name) {
|
|
26
|
+
return map.get(name);
|
|
27
|
+
},
|
|
28
|
+
set(name, value) {
|
|
29
|
+
map.set(name, value);
|
|
30
|
+
callListeners(name);
|
|
31
|
+
},
|
|
32
|
+
delete(name) {
|
|
33
|
+
map.delete(name);
|
|
34
|
+
callListeners(name);
|
|
35
|
+
},
|
|
36
|
+
subscribe(name, listener) {
|
|
37
|
+
let list = listeners.get(name);
|
|
38
|
+
if (!list) {
|
|
39
|
+
list = new Set();
|
|
40
|
+
listeners.set(name, list);
|
|
41
|
+
}
|
|
42
|
+
list.add(listener);
|
|
43
|
+
return () => {
|
|
44
|
+
list.delete(listener);
|
|
45
|
+
if (list.size === 0) {
|
|
46
|
+
listeners.delete(name);
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
};
|
|
51
|
+
}
|
|
52
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["observableMap","map","Map","listeners","callListeners","name","list","get","listener","set","value","delete","subscribe","Set","add","size"],"sources":["@wordpress/compose/src/utils/observable-map/index.ts"],"sourcesContent":["export type ObservableMap< K, V > = {\n\tget( name: K ): V | undefined;\n\tset( name: K, value: V ): void;\n\tdelete( name: K ): void;\n\tsubscribe( name: K, listener: () => void ): () => void;\n};\n\n/**\n * A constructor (factory) for `ObservableMap`, a map-like key/value data structure\n * where the individual entries are observable: using the `subscribe` method, you can\n * subscribe to updates for a particular keys. Each subscriber always observes one\n * specific key and is not notified about any unrelated changes (for different keys)\n * in the `ObservableMap`.\n *\n * @template K The type of the keys in the map.\n * @template V The type of the values in the map.\n * @return A new instance of the `ObservableMap` type.\n */\nexport function observableMap< K, V >(): ObservableMap< K, V > {\n\tconst map = new Map< K, V >();\n\tconst listeners = new Map< K, Set< () => void > >();\n\n\tfunction callListeners( name: K ) {\n\t\tconst list = listeners.get( name );\n\t\tif ( ! list ) {\n\t\t\treturn;\n\t\t}\n\t\tfor ( const listener of list ) {\n\t\t\tlistener();\n\t\t}\n\t}\n\n\treturn {\n\t\tget( name ) {\n\t\t\treturn map.get( name );\n\t\t},\n\t\tset( name, value ) {\n\t\t\tmap.set( name, value );\n\t\t\tcallListeners( name );\n\t\t},\n\t\tdelete( name ) {\n\t\t\tmap.delete( name );\n\t\t\tcallListeners( name );\n\t\t},\n\t\tsubscribe( name, listener ) {\n\t\t\tlet list = listeners.get( name );\n\t\t\tif ( ! list ) {\n\t\t\t\tlist = new Set();\n\t\t\t\tlisteners.set( name, list );\n\t\t\t}\n\t\t\tlist.add( listener );\n\n\t\t\treturn () => {\n\t\t\t\tlist.delete( listener );\n\t\t\t\tif ( list.size === 0 ) {\n\t\t\t\t\tlisteners.delete( name );\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\t};\n}\n"],"mappings":"AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASA,aAAaA,CAAA,EAAkC;EAC9D,MAAMC,GAAG,GAAG,IAAIC,GAAG,CAAS,CAAC;EAC7B,MAAMC,SAAS,GAAG,IAAID,GAAG,CAAyB,CAAC;EAEnD,SAASE,aAAaA,CAAEC,IAAO,EAAG;IACjC,MAAMC,IAAI,GAAGH,SAAS,CAACI,GAAG,CAAEF,IAAK,CAAC;IAClC,IAAK,CAAEC,IAAI,EAAG;MACb;IACD;IACA,KAAM,MAAME,QAAQ,IAAIF,IAAI,EAAG;MAC9BE,QAAQ,CAAC,CAAC;IACX;EACD;EAEA,OAAO;IACND,GAAGA,CAAEF,IAAI,EAAG;MACX,OAAOJ,GAAG,CAACM,GAAG,CAAEF,IAAK,CAAC;IACvB,CAAC;IACDI,GAAGA,CAAEJ,IAAI,EAAEK,KAAK,EAAG;MAClBT,GAAG,CAACQ,GAAG,CAAEJ,IAAI,EAAEK,KAAM,CAAC;MACtBN,aAAa,CAAEC,IAAK,CAAC;IACtB,CAAC;IACDM,MAAMA,CAAEN,IAAI,EAAG;MACdJ,GAAG,CAACU,MAAM,CAAEN,IAAK,CAAC;MAClBD,aAAa,CAAEC,IAAK,CAAC;IACtB,CAAC;IACDO,SAASA,CAAEP,IAAI,EAAEG,QAAQ,EAAG;MAC3B,IAAIF,IAAI,GAAGH,SAAS,CAACI,GAAG,CAAEF,IAAK,CAAC;MAChC,IAAK,CAAEC,IAAI,EAAG;QACbA,IAAI,GAAG,IAAIO,GAAG,CAAC,CAAC;QAChBV,SAAS,CAACM,GAAG,CAAEJ,IAAI,EAAEC,IAAK,CAAC;MAC5B;MACAA,IAAI,CAACQ,GAAG,CAAEN,QAAS,CAAC;MAEpB,OAAO,MAAM;QACZF,IAAI,CAACK,MAAM,CAAEH,QAAS,CAAC;QACvB,IAAKF,IAAI,CAACS,IAAI,KAAK,CAAC,EAAG;UACtBZ,SAAS,CAACQ,MAAM,CAAEN,IAAK,CAAC;QACzB;MACD,CAAC;IACF;EACD,CAAC;AACF","ignoreList":[]}
|
|
@@ -19,6 +19,6 @@ import type { ComponentType } from 'react';
|
|
|
19
19
|
*
|
|
20
20
|
* @return Higher-order component.
|
|
21
21
|
*/
|
|
22
|
-
declare function ifCondition<Props extends {}>(predicate: (props: Props) => boolean): (Inner: ComponentType<Props>) => (props: Props) => JSX.Element | null;
|
|
22
|
+
declare function ifCondition<Props extends {}>(predicate: (props: Props) => boolean): (Inner: ComponentType<Props>) => (props: Props) => import("react").JSX.Element | null;
|
|
23
23
|
export default ifCondition;
|
|
24
24
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/higher-order/if-condition/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAO3C;;;;;;;;;;;;;;;;GAgBG;AACH,iBAAS,WAAW,CAAE,KAAK,SAAS,EAAE,EACrC,SAAS,EAAE,CAAE,KAAK,EAAE,KAAK,KAAM,OAAO,4CAGoB,KAAK,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/higher-order/if-condition/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAO3C;;;;;;;;;;;;;;;;GAgBG;AACH,iBAAS,WAAW,CAAE,KAAK,SAAS,EAAE,EACrC,SAAS,EAAE,CAAE,KAAK,EAAE,KAAK,KAAM,OAAO,4CAGoB,KAAK,wCAS/D;AAED,eAAe,WAAW,CAAC"}
|
|
@@ -9,6 +9,6 @@ type InstanceIdProps = {
|
|
|
9
9
|
* A Higher Order Component used to be provide a unique instance ID by
|
|
10
10
|
* component.
|
|
11
11
|
*/
|
|
12
|
-
declare const withInstanceId: <C extends WithInjectedProps<C, InstanceIdProps>>(Inner: C) => (props: WithoutInjectedProps<C, InstanceIdProps>) => JSX.Element;
|
|
12
|
+
declare const withInstanceId: <C extends WithInjectedProps<C, InstanceIdProps>>(Inner: C) => (props: WithoutInjectedProps<C, InstanceIdProps>) => import("react").JSX.Element;
|
|
13
13
|
export default withInstanceId;
|
|
14
14
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/higher-order/with-instance-id/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EACX,iBAAiB,EACjB,oBAAoB,EACpB,MAAM,2CAA2C,CAAC;AAInD,KAAK,eAAe,GAAG;IAAE,UAAU,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,CAAC;AAEvD;;;GAGG;AACH,QAAA,MAAM,cAAc,yEAIF,qBAAsB,CAAC,EAAE,eAAe,CAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/higher-order/with-instance-id/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EACX,iBAAiB,EACjB,oBAAoB,EACpB,MAAM,2CAA2C,CAAC;AAInD,KAAK,eAAe,GAAG;IAAE,UAAU,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,CAAC;AAEvD;;;GAGG;AACH,QAAA,MAAM,cAAc,yEAIF,qBAAsB,CAAC,EAAE,eAAe,CAAE,gCAO3D,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -24,7 +24,7 @@ declare const withSafeTimeout: <C extends WithInjectedProps<C, TimeoutProps>>(In
|
|
|
24
24
|
componentWillUnmount(): void;
|
|
25
25
|
setTimeout(fn: () => void, delay: number): number;
|
|
26
26
|
clearTimeout(id: number): void;
|
|
27
|
-
render(): JSX.Element;
|
|
27
|
+
render(): import("react").JSX.Element;
|
|
28
28
|
context: unknown;
|
|
29
29
|
setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<WithoutInjectedProps<C, TimeoutProps>>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
|
|
30
30
|
forceUpdate(callback?: (() => void) | undefined): void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-focusable-iframe/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAOzC;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,IAAI,WAAW,CAAE,iBAAiB,CAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-focusable-iframe/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAOzC;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,IAAI,WAAW,CAAE,iBAAiB,CAAE,CA0B7E"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-instance-id/index.ts"],"names":[],"mappings":"AAmBA;;;;;;;;;;;GAWG;AACH,iBAAS,aAAa,CAAE,MAAM,EAAE,MAAM,GAAI,MAAM,CAAC;AACjD,iBAAS,aAAa,CAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,MAAM,CAAC;AACjE,iBAAS,aAAa,CAAE,CAAC,SAAS,MAAM,GAAG,MAAM,EAChD,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,MAAM,EACd,WAAW,CAAC,EAAE,CAAC,GACb,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-instance-id/index.ts"],"names":[],"mappings":"AAmBA;;;;;;;;;;;GAWG;AACH,iBAAS,aAAa,CAAE,MAAM,EAAE,MAAM,GAAI,MAAM,CAAC;AACjD,iBAAS,aAAa,CAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,MAAM,CAAC;AACjE,iBAAS,aAAa,CAAE,CAAC,SAAS,MAAM,GAAG,MAAM,EAChD,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,MAAM,EACd,WAAW,CAAC,EAAE,CAAC,GACb,CAAC,CAAC;AAyBL,eAAe,aAAa,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-media-query/index.js"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-media-query/index.js"],"names":[],"mappings":"AAoCA;;;;;GAKG;AACH,mEAFY,OAAO,CAiClB"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Internal dependencies
|
|
3
|
+
*/
|
|
4
|
+
import type { ObservableMap } from '../../utils/observable-map';
|
|
5
|
+
/**
|
|
6
|
+
* React hook that lets you observe an entry in an `ObservableMap`. The hook returns the
|
|
7
|
+
* current value corresponding to the key, or `undefined` when there is no value stored.
|
|
8
|
+
* It also observes changes to the value and triggers an update of the calling component
|
|
9
|
+
* in case the value changes.
|
|
10
|
+
*
|
|
11
|
+
* @template K The type of the keys in the map.
|
|
12
|
+
* @template V The type of the values in the map.
|
|
13
|
+
* @param map The `ObservableMap` to observe.
|
|
14
|
+
* @param name The map key to observe.
|
|
15
|
+
* @return The value corresponding to the map key requested.
|
|
16
|
+
*/
|
|
17
|
+
export default function useObservableValue<K, V>(map: ObservableMap<K, V>, name: K): V | undefined;
|
|
18
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-observable-value/index.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAEhE;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAE,CAAC,EAAE,CAAC,EAC/C,GAAG,EAAE,aAAa,CAAE,CAAC,EAAE,CAAC,CAAE,EAC1B,IAAI,EAAE,CAAC,GACL,CAAC,GAAG,SAAS,CASf"}
|
package/build-types/index.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export * from "./utils/create-higher-order-component";
|
|
2
2
|
export * from "./utils/debounce";
|
|
3
3
|
export * from "./utils/throttle";
|
|
4
|
+
export * from "./utils/observable-map";
|
|
4
5
|
export { default as compose } from "./higher-order/compose";
|
|
5
6
|
export { default as pipe } from "./higher-order/pipe";
|
|
6
7
|
export { default as ifCondition } from "./higher-order/if-condition";
|
|
@@ -37,4 +38,5 @@ export { default as useRefEffect } from "./hooks/use-ref-effect";
|
|
|
37
38
|
export { default as __experimentalUseDropZone } from "./hooks/use-drop-zone";
|
|
38
39
|
export { default as useFocusableIframe } from "./hooks/use-focusable-iframe";
|
|
39
40
|
export { default as __experimentalUseFixedWindowList } from "./hooks/use-fixed-window-list";
|
|
41
|
+
export { default as useObservableValue } from "./hooks/use-observable-value";
|
|
40
42
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export type ObservableMap<K, V> = {
|
|
2
|
+
get(name: K): V | undefined;
|
|
3
|
+
set(name: K, value: V): void;
|
|
4
|
+
delete(name: K): void;
|
|
5
|
+
subscribe(name: K, listener: () => void): () => void;
|
|
6
|
+
};
|
|
7
|
+
/**
|
|
8
|
+
* A constructor (factory) for `ObservableMap`, a map-like key/value data structure
|
|
9
|
+
* where the individual entries are observable: using the `subscribe` method, you can
|
|
10
|
+
* subscribe to updates for a particular keys. Each subscriber always observes one
|
|
11
|
+
* specific key and is not notified about any unrelated changes (for different keys)
|
|
12
|
+
* in the `ObservableMap`.
|
|
13
|
+
*
|
|
14
|
+
* @template K The type of the keys in the map.
|
|
15
|
+
* @template V The type of the values in the map.
|
|
16
|
+
* @return A new instance of the `ObservableMap` type.
|
|
17
|
+
*/
|
|
18
|
+
export declare function observableMap<K, V>(): ObservableMap<K, V>;
|
|
19
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/observable-map/index.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,CAAE,CAAC,EAAE,CAAC,IAAK;IACnC,GAAG,CAAE,IAAI,EAAE,CAAC,GAAI,CAAC,GAAG,SAAS,CAAC;IAC9B,GAAG,CAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,GAAI,IAAI,CAAC;IAC/B,MAAM,CAAE,IAAI,EAAE,CAAC,GAAI,IAAI,CAAC;IACxB,SAAS,CAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,IAAI,GAAI,MAAM,IAAI,CAAC;CACvD,CAAC;AAEF;;;;;;;;;;GAUG;AACH,wBAAgB,aAAa,CAAE,CAAC,EAAE,CAAC,KAAM,aAAa,CAAE,CAAC,EAAE,CAAC,CAAE,CA0C7D"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wordpress/compose",
|
|
3
|
-
"version": "6.
|
|
3
|
+
"version": "6.35.0",
|
|
4
4
|
"description": "WordPress higher-order components (HOCs).",
|
|
5
5
|
"author": "The WordPress Contributors",
|
|
6
6
|
"license": "GPL-2.0-or-later",
|
|
@@ -31,13 +31,13 @@
|
|
|
31
31
|
"dependencies": {
|
|
32
32
|
"@babel/runtime": "^7.16.0",
|
|
33
33
|
"@types/mousetrap": "^1.6.8",
|
|
34
|
-
"@wordpress/deprecated": "^3.
|
|
35
|
-
"@wordpress/dom": "^3.
|
|
36
|
-
"@wordpress/element": "^5.
|
|
37
|
-
"@wordpress/is-shallow-equal": "^4.
|
|
38
|
-
"@wordpress/keycodes": "^3.
|
|
39
|
-
"@wordpress/priority-queue": "^2.
|
|
40
|
-
"@wordpress/undo-manager": "^0.
|
|
34
|
+
"@wordpress/deprecated": "^3.58.0",
|
|
35
|
+
"@wordpress/dom": "^3.58.0",
|
|
36
|
+
"@wordpress/element": "^5.35.0",
|
|
37
|
+
"@wordpress/is-shallow-equal": "^4.58.0",
|
|
38
|
+
"@wordpress/keycodes": "^3.58.0",
|
|
39
|
+
"@wordpress/priority-queue": "^2.58.0",
|
|
40
|
+
"@wordpress/undo-manager": "^0.18.0",
|
|
41
41
|
"change-case": "^4.1.2",
|
|
42
42
|
"clipboard": "^2.0.11",
|
|
43
43
|
"mousetrap": "^1.6.5",
|
|
@@ -49,5 +49,5 @@
|
|
|
49
49
|
"publishConfig": {
|
|
50
50
|
"access": "public"
|
|
51
51
|
},
|
|
52
|
-
"gitHead": "
|
|
52
|
+
"gitHead": "42f38f287506a6b3ed8ccba839b18ad066821044"
|
|
53
53
|
}
|
|
@@ -17,9 +17,13 @@ import useRefEffect from '../use-ref-effect';
|
|
|
17
17
|
export default function useFocusableIframe(): RefCallback< HTMLIFrameElement > {
|
|
18
18
|
return useRefEffect( ( element ) => {
|
|
19
19
|
const { ownerDocument } = element;
|
|
20
|
-
if ( ! ownerDocument )
|
|
20
|
+
if ( ! ownerDocument ) {
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
21
23
|
const { defaultView } = ownerDocument;
|
|
22
|
-
if ( ! defaultView )
|
|
24
|
+
if ( ! defaultView ) {
|
|
25
|
+
return;
|
|
26
|
+
}
|
|
23
27
|
|
|
24
28
|
/**
|
|
25
29
|
* Checks whether the iframe is the activeElement, inferring that it has
|
|
@@ -51,7 +51,9 @@ function useInstanceId(
|
|
|
51
51
|
preferredId?: string | number
|
|
52
52
|
): string | number {
|
|
53
53
|
return useMemo( () => {
|
|
54
|
-
if ( preferredId )
|
|
54
|
+
if ( preferredId ) {
|
|
55
|
+
return preferredId;
|
|
56
|
+
}
|
|
55
57
|
const id = createId( object );
|
|
56
58
|
|
|
57
59
|
return prefix ? `${ prefix }-${ id }` : id;
|
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { useMemo, useSyncExternalStore } from '@wordpress/element';
|
|
5
5
|
|
|
6
|
+
const matchMediaCache = new Map();
|
|
7
|
+
|
|
6
8
|
/**
|
|
7
9
|
* A new MediaQueryList object for the media query
|
|
8
10
|
*
|
|
@@ -10,12 +12,23 @@ import { useMemo, useSyncExternalStore } from '@wordpress/element';
|
|
|
10
12
|
* @return {MediaQueryList|null} A new object for the media query
|
|
11
13
|
*/
|
|
12
14
|
function getMediaQueryList( query ) {
|
|
15
|
+
if ( ! query ) {
|
|
16
|
+
return null;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
let match = matchMediaCache.get( query );
|
|
20
|
+
|
|
21
|
+
if ( match ) {
|
|
22
|
+
return match;
|
|
23
|
+
}
|
|
24
|
+
|
|
13
25
|
if (
|
|
14
|
-
query &&
|
|
15
26
|
typeof window !== 'undefined' &&
|
|
16
27
|
typeof window.matchMedia === 'function'
|
|
17
28
|
) {
|
|
18
|
-
|
|
29
|
+
match = window.matchMedia( query );
|
|
30
|
+
matchMediaCache.set( query, match );
|
|
31
|
+
return match;
|
|
19
32
|
}
|
|
20
33
|
|
|
21
34
|
return null;
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* External dependencies
|
|
3
3
|
*/
|
|
4
4
|
import { act, render } from '@testing-library/react';
|
|
5
|
-
import { matchMedia, setMedia
|
|
5
|
+
import { matchMedia, setMedia } from 'mock-match-media';
|
|
6
6
|
|
|
7
7
|
/**
|
|
8
8
|
* Internal dependencies
|
|
@@ -26,10 +26,11 @@ describe( 'useMediaQuery', () => {
|
|
|
26
26
|
} );
|
|
27
27
|
|
|
28
28
|
afterEach( () => {
|
|
29
|
-
|
|
29
|
+
// Do not clean up, this will break our cache. Browsers also do not
|
|
30
|
+
// reset media queries.
|
|
30
31
|
} );
|
|
31
32
|
|
|
32
|
-
it( 'should return true when query matches', async () => {
|
|
33
|
+
it( 'should return true when the query matches', async () => {
|
|
33
34
|
const { container } = render(
|
|
34
35
|
<TestComponent query="(min-width: 782px)" />
|
|
35
36
|
);
|
|
@@ -53,7 +54,7 @@ describe( 'useMediaQuery', () => {
|
|
|
53
54
|
expect( container ).toHaveTextContent( 'useMediaQuery: false' );
|
|
54
55
|
} );
|
|
55
56
|
|
|
56
|
-
it( 'should return false when the query does not
|
|
57
|
+
it( 'should return false when the query does not match', async () => {
|
|
57
58
|
const { container } = render(
|
|
58
59
|
<TestComponent query="(max-width: 782px)" />
|
|
59
60
|
);
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* WordPress dependencies
|
|
3
|
+
*/
|
|
4
|
+
import { useMemo, useSyncExternalStore } from '@wordpress/element';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Internal dependencies
|
|
8
|
+
*/
|
|
9
|
+
import type { ObservableMap } from '../../utils/observable-map';
|
|
10
|
+
|
|
11
|
+
/**
|
|
12
|
+
* React hook that lets you observe an entry in an `ObservableMap`. The hook returns the
|
|
13
|
+
* current value corresponding to the key, or `undefined` when there is no value stored.
|
|
14
|
+
* It also observes changes to the value and triggers an update of the calling component
|
|
15
|
+
* in case the value changes.
|
|
16
|
+
*
|
|
17
|
+
* @template K The type of the keys in the map.
|
|
18
|
+
* @template V The type of the values in the map.
|
|
19
|
+
* @param map The `ObservableMap` to observe.
|
|
20
|
+
* @param name The map key to observe.
|
|
21
|
+
* @return The value corresponding to the map key requested.
|
|
22
|
+
*/
|
|
23
|
+
export default function useObservableValue< K, V >(
|
|
24
|
+
map: ObservableMap< K, V >,
|
|
25
|
+
name: K
|
|
26
|
+
): V | undefined {
|
|
27
|
+
const [ subscribe, getValue ] = useMemo(
|
|
28
|
+
() => [
|
|
29
|
+
( listener: () => void ) => map.subscribe( name, listener ),
|
|
30
|
+
() => map.get( name ),
|
|
31
|
+
],
|
|
32
|
+
[ map, name ]
|
|
33
|
+
);
|
|
34
|
+
return useSyncExternalStore( subscribe, getValue, getValue );
|
|
35
|
+
}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* External dependencies
|
|
3
|
+
*/
|
|
4
|
+
import { render, screen, act } from '@testing-library/react';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Internal dependencies
|
|
8
|
+
*/
|
|
9
|
+
import { observableMap } from '../../../utils/observable-map';
|
|
10
|
+
import useObservableValue from '..';
|
|
11
|
+
|
|
12
|
+
describe( 'useObservableValue', () => {
|
|
13
|
+
test( 'reacts only to the specified key', () => {
|
|
14
|
+
const map = observableMap();
|
|
15
|
+
map.set( 'a', 1 );
|
|
16
|
+
|
|
17
|
+
const MapUI = jest.fn( () => {
|
|
18
|
+
const value = useObservableValue( map, 'a' );
|
|
19
|
+
return <div>value is { value }</div>;
|
|
20
|
+
} );
|
|
21
|
+
|
|
22
|
+
render( <MapUI /> );
|
|
23
|
+
expect( screen.getByText( /^value is/ ) ).toHaveTextContent(
|
|
24
|
+
'value is 1'
|
|
25
|
+
);
|
|
26
|
+
expect( MapUI ).toHaveBeenCalledTimes( 1 );
|
|
27
|
+
|
|
28
|
+
act( () => {
|
|
29
|
+
map.set( 'a', 2 );
|
|
30
|
+
} );
|
|
31
|
+
expect( screen.getByText( /^value is/ ) ).toHaveTextContent(
|
|
32
|
+
'value is 2'
|
|
33
|
+
);
|
|
34
|
+
expect( MapUI ).toHaveBeenCalledTimes( 2 );
|
|
35
|
+
|
|
36
|
+
// check that setting unobserved map key doesn't trigger a render at all
|
|
37
|
+
act( () => {
|
|
38
|
+
map.set( 'b', 1 );
|
|
39
|
+
} );
|
|
40
|
+
expect( MapUI ).toHaveBeenCalledTimes( 2 );
|
|
41
|
+
} );
|
|
42
|
+
} );
|
package/src/index.js
CHANGED
|
@@ -4,6 +4,8 @@ export * from './utils/create-higher-order-component';
|
|
|
4
4
|
export * from './utils/debounce';
|
|
5
5
|
// The `throttle` helper and its types.
|
|
6
6
|
export * from './utils/throttle';
|
|
7
|
+
// The `ObservableMap` data structure
|
|
8
|
+
export * from './utils/observable-map';
|
|
7
9
|
|
|
8
10
|
// The `compose` and `pipe` helpers (inspired by `flowRight` and `flow` from Lodash).
|
|
9
11
|
export { default as compose } from './higher-order/compose';
|
|
@@ -46,3 +48,4 @@ export { default as useRefEffect } from './hooks/use-ref-effect';
|
|
|
46
48
|
export { default as __experimentalUseDropZone } from './hooks/use-drop-zone';
|
|
47
49
|
export { default as useFocusableIframe } from './hooks/use-focusable-iframe';
|
|
48
50
|
export { default as __experimentalUseFixedWindowList } from './hooks/use-fixed-window-list';
|
|
51
|
+
export { default as useObservableValue } from './hooks/use-observable-value';
|
package/src/index.native.js
CHANGED
|
@@ -4,6 +4,8 @@ export * from './utils/create-higher-order-component';
|
|
|
4
4
|
export * from './utils/debounce';
|
|
5
5
|
// The `throttle` helper and its types.
|
|
6
6
|
export * from './utils/throttle';
|
|
7
|
+
// The `ObservableMap` data structure
|
|
8
|
+
export * from './utils/observable-map';
|
|
7
9
|
|
|
8
10
|
// The `compose` and `pipe` helpers (inspired by `flowRight` and `flow` from Lodash).
|
|
9
11
|
export { default as compose } from './higher-order/compose';
|
|
@@ -39,3 +41,4 @@ export { default as useThrottle } from './hooks/use-throttle';
|
|
|
39
41
|
export { default as useMergeRefs } from './hooks/use-merge-refs';
|
|
40
42
|
export { default as useRefEffect } from './hooks/use-ref-effect';
|
|
41
43
|
export { default as useNetworkConnectivity } from './hooks/use-network-connectivity';
|
|
44
|
+
export { default as useObservableValue } from './hooks/use-observable-value';
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
export type ObservableMap< K, V > = {
|
|
2
|
+
get( name: K ): V | undefined;
|
|
3
|
+
set( name: K, value: V ): void;
|
|
4
|
+
delete( name: K ): void;
|
|
5
|
+
subscribe( name: K, listener: () => void ): () => void;
|
|
6
|
+
};
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* A constructor (factory) for `ObservableMap`, a map-like key/value data structure
|
|
10
|
+
* where the individual entries are observable: using the `subscribe` method, you can
|
|
11
|
+
* subscribe to updates for a particular keys. Each subscriber always observes one
|
|
12
|
+
* specific key and is not notified about any unrelated changes (for different keys)
|
|
13
|
+
* in the `ObservableMap`.
|
|
14
|
+
*
|
|
15
|
+
* @template K The type of the keys in the map.
|
|
16
|
+
* @template V The type of the values in the map.
|
|
17
|
+
* @return A new instance of the `ObservableMap` type.
|
|
18
|
+
*/
|
|
19
|
+
export function observableMap< K, V >(): ObservableMap< K, V > {
|
|
20
|
+
const map = new Map< K, V >();
|
|
21
|
+
const listeners = new Map< K, Set< () => void > >();
|
|
22
|
+
|
|
23
|
+
function callListeners( name: K ) {
|
|
24
|
+
const list = listeners.get( name );
|
|
25
|
+
if ( ! list ) {
|
|
26
|
+
return;
|
|
27
|
+
}
|
|
28
|
+
for ( const listener of list ) {
|
|
29
|
+
listener();
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
return {
|
|
34
|
+
get( name ) {
|
|
35
|
+
return map.get( name );
|
|
36
|
+
},
|
|
37
|
+
set( name, value ) {
|
|
38
|
+
map.set( name, value );
|
|
39
|
+
callListeners( name );
|
|
40
|
+
},
|
|
41
|
+
delete( name ) {
|
|
42
|
+
map.delete( name );
|
|
43
|
+
callListeners( name );
|
|
44
|
+
},
|
|
45
|
+
subscribe( name, listener ) {
|
|
46
|
+
let list = listeners.get( name );
|
|
47
|
+
if ( ! list ) {
|
|
48
|
+
list = new Set();
|
|
49
|
+
listeners.set( name, list );
|
|
50
|
+
}
|
|
51
|
+
list.add( listener );
|
|
52
|
+
|
|
53
|
+
return () => {
|
|
54
|
+
list.delete( listener );
|
|
55
|
+
if ( list.size === 0 ) {
|
|
56
|
+
listeners.delete( name );
|
|
57
|
+
}
|
|
58
|
+
};
|
|
59
|
+
},
|
|
60
|
+
};
|
|
61
|
+
}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Internal dependencies
|
|
3
|
+
*/
|
|
4
|
+
import { observableMap } from '..';
|
|
5
|
+
|
|
6
|
+
describe( 'ObservableMap', () => {
|
|
7
|
+
test( 'should observe individual values', () => {
|
|
8
|
+
const map = observableMap();
|
|
9
|
+
|
|
10
|
+
const listenerA = jest.fn();
|
|
11
|
+
const listenerB = jest.fn();
|
|
12
|
+
|
|
13
|
+
const unsubA = map.subscribe( 'a', listenerA );
|
|
14
|
+
const unsubB = map.subscribe( 'b', listenerB );
|
|
15
|
+
|
|
16
|
+
// check that setting `a` doesn't notify the `b` listener
|
|
17
|
+
map.set( 'a', 1 );
|
|
18
|
+
expect( listenerA ).toHaveBeenCalledTimes( 1 );
|
|
19
|
+
expect( listenerB ).toHaveBeenCalledTimes( 0 );
|
|
20
|
+
|
|
21
|
+
// check that setting `b` doesn't notify the `a` listener
|
|
22
|
+
map.set( 'b', 2 );
|
|
23
|
+
expect( listenerA ).toHaveBeenCalledTimes( 1 );
|
|
24
|
+
expect( listenerB ).toHaveBeenCalledTimes( 1 );
|
|
25
|
+
|
|
26
|
+
// check that `delete` triggers notifications, too
|
|
27
|
+
map.delete( 'a' );
|
|
28
|
+
expect( listenerA ).toHaveBeenCalledTimes( 2 );
|
|
29
|
+
expect( listenerB ).toHaveBeenCalledTimes( 1 );
|
|
30
|
+
|
|
31
|
+
// check that the subscription survived the `delete`
|
|
32
|
+
map.set( 'a', 2 );
|
|
33
|
+
expect( listenerA ).toHaveBeenCalledTimes( 3 );
|
|
34
|
+
expect( listenerB ).toHaveBeenCalledTimes( 1 );
|
|
35
|
+
|
|
36
|
+
// check that unsubscription really works
|
|
37
|
+
unsubA();
|
|
38
|
+
unsubB();
|
|
39
|
+
map.set( 'a', 3 );
|
|
40
|
+
expect( listenerA ).toHaveBeenCalledTimes( 3 );
|
|
41
|
+
expect( listenerB ).toHaveBeenCalledTimes( 1 );
|
|
42
|
+
} );
|
|
43
|
+
} );
|