@wordpress/components 26.0.4 → 27.1.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/.stylelintrc.js +2 -2
- package/CHANGELOG.md +45 -0
- package/CONTRIBUTING.md +72 -0
- package/build/autocomplete/index.js +3 -8
- package/build/autocomplete/index.js.map +1 -1
- package/build/base-control/index.native.js.map +1 -1
- package/build/border-box-control/border-box-control/component.js.map +1 -1
- package/build/border-box-control/border-box-control-split-controls/component.js.map +1 -1
- package/build/border-control/border-control-dropdown/component.js.map +1 -1
- package/build/button/index.js +2 -2
- package/build/button/index.js.map +1 -1
- package/build/button/index.native.js.map +1 -1
- package/build/color-picker/component.js +10 -1
- package/build/color-picker/component.js.map +1 -1
- package/build/color-picker/styles.js +8 -9
- package/build/color-picker/styles.js.map +1 -1
- package/build/combobox-control/index.js +4 -9
- package/build/combobox-control/index.js.map +1 -1
- package/build/confirm-dialog/component.js.map +1 -1
- package/build/custom-select-control/index.js +2 -15
- package/build/custom-select-control/index.js.map +1 -1
- package/build/custom-select-control-v2/custom-select-item.js +32 -0
- package/build/custom-select-control-v2/custom-select-item.js.map +1 -0
- package/build/custom-select-control-v2/custom-select.js +91 -0
- package/build/custom-select-control-v2/custom-select.js.map +1 -0
- package/build/custom-select-control-v2/default-component/index.js +41 -0
- package/build/custom-select-control-v2/default-component/index.js.map +1 -0
- package/build/custom-select-control-v2/index.js +13 -82
- package/build/custom-select-control-v2/index.js.map +1 -1
- package/build/custom-select-control-v2/legacy-component/index.js +123 -0
- package/build/custom-select-control-v2/legacy-component/index.js.map +1 -0
- package/build/custom-select-control-v2/styles.js +73 -50
- package/build/custom-select-control-v2/styles.js.map +1 -1
- package/build/custom-select-control-v2/types.js.map +1 -1
- package/build/draggable/index.native.js +2 -2
- package/build/draggable/index.native.js.map +1 -1
- package/build/dropdown-menu/index.native.js.map +1 -1
- package/build/flex/flex/hook.js +1 -1
- package/build/flex/flex/hook.js.map +1 -1
- package/build/font-size-picker/font-size-picker-select.js +0 -1
- package/build/font-size-picker/font-size-picker-select.js.map +1 -1
- package/build/font-size-picker/index.native.js.map +1 -1
- package/build/form-token-field/index.js +3 -8
- package/build/form-token-field/index.js.map +1 -1
- package/build/form-token-field/suggestions-list.js +5 -12
- package/build/form-token-field/suggestions-list.js.map +1 -1
- package/build/h-stack/hook.js +6 -1
- package/build/h-stack/hook.js.map +1 -1
- package/build/mobile/bottom-sheet/button.native.js.map +1 -1
- package/build/mobile/bottom-sheet/index.native.js.map +1 -1
- package/build/mobile/bottom-sheet/range-cell.native.js.map +1 -1
- package/build/mobile/bottom-sheet/stepper-cell/index.native.js.map +1 -1
- package/build/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
- package/build/mobile/bottom-sheet-text-control/index.native.js.map +1 -1
- package/build/mobile/gradient/index.native.js.map +1 -1
- package/build/mobile/image/index.native.js +4 -13
- package/build/mobile/image/index.native.js.map +1 -1
- package/build/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js +1 -1
- package/build/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js.map +1 -1
- package/build/mobile/media-edit/index.native.js.map +1 -1
- package/build/modal/index.js +2 -10
- package/build/modal/index.js.map +1 -1
- package/build/palette-edit/index.js.map +1 -1
- package/build/progress-bar/styles.js +5 -5
- package/build/progress-bar/styles.js.map +1 -1
- package/build/query-controls/index.native.js.map +1 -1
- package/build/range-control/index.js.map +1 -1
- package/build/search-control/index.native.js.map +1 -1
- package/build/snackbar/index.js +3 -2
- package/build/snackbar/index.js.map +1 -1
- package/build/snackbar/list.js +2 -1
- package/build/snackbar/list.js.map +1 -1
- package/build/snackbar/types.js.map +1 -1
- package/build/tabs/index.js +7 -7
- package/build/tabs/index.js.map +1 -1
- package/build/tabs/types.js.map +1 -1
- package/build/utils/hooks/index.js +0 -7
- package/build/utils/hooks/index.js.map +1 -1
- package/build/utils/with-ignore-ime-events.js +34 -0
- package/build/utils/with-ignore-ime-events.js.map +1 -0
- package/build-module/autocomplete/index.js +3 -8
- package/build-module/autocomplete/index.js.map +1 -1
- package/build-module/base-control/index.native.js.map +1 -1
- package/build-module/border-box-control/border-box-control/component.js.map +1 -1
- package/build-module/border-box-control/border-box-control-split-controls/component.js.map +1 -1
- package/build-module/border-control/border-control-dropdown/component.js.map +1 -1
- package/build-module/button/index.js +2 -2
- package/build-module/button/index.js.map +1 -1
- package/build-module/button/index.native.js.map +1 -1
- package/build-module/color-picker/component.js +11 -2
- package/build-module/color-picker/component.js.map +1 -1
- package/build-module/color-picker/styles.js +8 -9
- package/build-module/color-picker/styles.js.map +1 -1
- package/build-module/combobox-control/index.js +4 -9
- package/build-module/combobox-control/index.js.map +1 -1
- package/build-module/confirm-dialog/component.js.map +1 -1
- package/build-module/custom-select-control/index.js +2 -15
- package/build-module/custom-select-control/index.js.map +1 -1
- package/build-module/custom-select-control-v2/custom-select-item.js +26 -0
- package/build-module/custom-select-control-v2/custom-select-item.js.map +1 -0
- package/build-module/custom-select-control-v2/custom-select.js +82 -0
- package/build-module/custom-select-control-v2/custom-select.js.map +1 -0
- package/build-module/custom-select-control-v2/default-component/index.js +30 -0
- package/build-module/custom-select-control-v2/default-component/index.js.map +1 -0
- package/build-module/custom-select-control-v2/index.js +2 -74
- package/build-module/custom-select-control-v2/index.js.map +1 -1
- package/build-module/custom-select-control-v2/legacy-component/index.js +111 -0
- package/build-module/custom-select-control-v2/legacy-component/index.js.map +1 -0
- package/build-module/custom-select-control-v2/styles.js +73 -42
- package/build-module/custom-select-control-v2/styles.js.map +1 -1
- package/build-module/custom-select-control-v2/types.js.map +1 -1
- package/build-module/draggable/index.native.js +2 -2
- package/build-module/draggable/index.native.js.map +1 -1
- package/build-module/dropdown-menu/index.native.js.map +1 -1
- package/build-module/flex/flex/hook.js +1 -1
- package/build-module/flex/flex/hook.js.map +1 -1
- package/build-module/font-size-picker/font-size-picker-select.js +0 -1
- package/build-module/font-size-picker/font-size-picker-select.js.map +1 -1
- package/build-module/font-size-picker/index.native.js.map +1 -1
- package/build-module/form-token-field/index.js +3 -8
- package/build-module/form-token-field/index.js.map +1 -1
- package/build-module/form-token-field/suggestions-list.js +5 -12
- package/build-module/form-token-field/suggestions-list.js.map +1 -1
- package/build-module/h-stack/hook.js +6 -1
- package/build-module/h-stack/hook.js.map +1 -1
- package/build-module/mobile/bottom-sheet/button.native.js.map +1 -1
- package/build-module/mobile/bottom-sheet/index.native.js.map +1 -1
- package/build-module/mobile/bottom-sheet/range-cell.native.js.map +1 -1
- package/build-module/mobile/bottom-sheet/stepper-cell/index.native.js.map +1 -1
- package/build-module/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
- package/build-module/mobile/bottom-sheet-text-control/index.native.js.map +1 -1
- package/build-module/mobile/gradient/index.native.js.map +1 -1
- package/build-module/mobile/image/index.native.js +6 -15
- package/build-module/mobile/image/index.native.js.map +1 -1
- package/build-module/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js +1 -1
- package/build-module/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js.map +1 -1
- package/build-module/mobile/media-edit/index.native.js.map +1 -1
- package/build-module/modal/index.js +3 -10
- package/build-module/modal/index.js.map +1 -1
- package/build-module/palette-edit/index.js.map +1 -1
- package/build-module/progress-bar/styles.js +5 -5
- package/build-module/progress-bar/styles.js.map +1 -1
- package/build-module/query-controls/index.native.js.map +1 -1
- package/build-module/range-control/index.js.map +1 -1
- package/build-module/search-control/index.native.js.map +1 -1
- package/build-module/snackbar/index.js +3 -2
- package/build-module/snackbar/index.js.map +1 -1
- package/build-module/snackbar/list.js +2 -1
- package/build-module/snackbar/list.js.map +1 -1
- package/build-module/snackbar/types.js.map +1 -1
- package/build-module/tabs/index.js +7 -7
- package/build-module/tabs/index.js.map +1 -1
- package/build-module/tabs/types.js.map +1 -1
- package/build-module/utils/hooks/index.js +0 -1
- package/build-module/utils/hooks/index.js.map +1 -1
- package/build-module/utils/with-ignore-ime-events.js +28 -0
- package/build-module/utils/with-ignore-ime-events.js.map +1 -0
- package/build-style/style-rtl.css +10 -2
- package/build-style/style.css +10 -2
- package/build-types/alignment-matrix-control/stories/index.story.d.ts +1 -1
- package/build-types/angle-picker-control/stories/index.story.d.ts +1 -1
- package/build-types/animate/stories/index.story.d.ts +7 -7
- package/build-types/autocomplete/index.d.ts.map +1 -1
- package/build-types/base-control/stories/index.story.d.ts +1 -1
- package/build-types/border-box-control/stories/index.story.d.ts +1 -1
- package/build-types/border-control/stories/index.story.d.ts +6 -6
- package/build-types/box-control/stories/index.story.d.ts +6 -6
- package/build-types/button/stories/e2e/index.story.d.ts +1 -1
- package/build-types/button/stories/index.story.d.ts +7 -7
- package/build-types/card/stories/index.story.d.ts +2 -2
- package/build-types/circular-option-picker/stories/index.story.d.ts +5 -5
- package/build-types/color-palette/stories/index.story.d.ts +3 -3
- package/build-types/color-picker/component.d.ts.map +1 -1
- package/build-types/color-picker/stories/index.story.d.ts +1 -1
- package/build-types/color-picker/styles.d.ts.map +1 -1
- package/build-types/combobox-control/index.d.ts.map +1 -1
- package/build-types/combobox-control/stories/index.story.d.ts +2 -2
- package/build-types/confirm-dialog/stories/index.story.d.ts +2 -2
- package/build-types/custom-gradient-picker/stories/index.story.d.ts +1 -1
- package/build-types/custom-select-control/index.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/custom-select-item.d.ts +9 -0
- package/build-types/custom-select-control-v2/custom-select-item.d.ts.map +1 -0
- package/build-types/custom-select-control-v2/custom-select.d.ts +6 -0
- package/build-types/custom-select-control-v2/custom-select.d.ts.map +1 -0
- package/build-types/custom-select-control-v2/default-component/index.d.ts +6 -0
- package/build-types/custom-select-control-v2/default-component/index.d.ts.map +1 -0
- package/build-types/custom-select-control-v2/index.d.ts +5 -6
- package/build-types/custom-select-control-v2/index.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/legacy-component/index.d.ts +5 -0
- package/build-types/custom-select-control-v2/legacy-component/index.d.ts.map +1 -0
- package/build-types/custom-select-control-v2/legacy-component/test/index.d.ts +2 -0
- package/build-types/custom-select-control-v2/legacy-component/test/index.d.ts.map +1 -0
- package/build-types/custom-select-control-v2/stories/default.story.d.ts +30 -0
- package/build-types/custom-select-control-v2/stories/default.story.d.ts.map +1 -0
- package/build-types/custom-select-control-v2/stories/legacy.story.d.ts +12 -0
- package/build-types/custom-select-control-v2/stories/legacy.story.d.ts.map +1 -0
- package/build-types/custom-select-control-v2/styles.d.ts +31 -6
- package/build-types/custom-select-control-v2/styles.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/types.d.ts +136 -14
- package/build-types/custom-select-control-v2/types.d.ts.map +1 -1
- package/build-types/dimension-control/stories/index.story.d.ts +2 -2
- package/build-types/drop-zone/stories/index.story.d.ts +1 -1
- package/build-types/dropdown/stories/index.story.d.ts +3 -3
- package/build-types/dropdown-menu/stories/index.story.d.ts +2 -2
- package/build-types/dropdown-menu-v2/stories/index.story.d.ts.map +1 -1
- package/build-types/duotone-picker/stories/duotone-picker.story.d.ts +1 -1
- package/build-types/duotone-picker/stories/duotone-swatch.story.d.ts +3 -3
- package/build-types/flex/flex/hook.d.ts +2 -3
- package/build-types/flex/flex/hook.d.ts.map +1 -1
- package/build-types/focal-point-picker/stories/index.story.d.ts +4 -4
- package/build-types/font-size-picker/font-size-picker-select.d.ts.map +1 -1
- package/build-types/form-file-upload/stories/index.story.d.ts +5 -5
- package/build-types/form-token-field/index.d.ts.map +1 -1
- package/build-types/form-token-field/suggestions-list.d.ts.map +1 -1
- package/build-types/gradient-picker/stories/index.story.d.ts +3 -3
- package/build-types/guide/stories/index.story.d.ts +1 -1
- package/build-types/h-stack/hook.d.ts +2 -4
- package/build-types/h-stack/hook.d.ts.map +1 -1
- package/build-types/icon/stories/index.story.d.ts +4 -4
- package/build-types/input-control/stories/index.story.d.ts +6 -6
- package/build-types/keyboard-shortcuts/stories/index.story.d.ts +1 -1
- package/build-types/menu-group/stories/index.story.d.ts +1 -1
- package/build-types/menu-item/stories/index.story.d.ts +4 -4
- package/build-types/modal/index.d.ts.map +1 -1
- package/build-types/navigation/stories/index.story.d.ts +6 -6
- package/build-types/navigation/stories/utils/hide-if-empty.d.ts.map +1 -1
- package/build-types/notice/stories/index.story.d.ts +4 -4
- package/build-types/number-control/stories/index.story.d.ts +1 -1
- package/build-types/palette-edit/stories/index.story.d.ts +2 -2
- package/build-types/progress-bar/stories/index.story.d.ts.map +1 -1
- package/build-types/query-controls/stories/index.story.d.ts +1 -1
- package/build-types/radio-group/stories/index.story.d.ts.map +1 -1
- package/build-types/resizable-box/stories/index.story.d.ts +2 -2
- package/build-types/responsive-wrapper/stories/index.story.d.ts +1 -1
- package/build-types/sandbox/stories/index.story.d.ts +1 -1
- package/build-types/search-control/stories/index.story.d.ts +2 -2
- package/build-types/select-control/stories/index.story.d.ts +2 -2
- package/build-types/shortcut/stories/index.story.d.ts +1 -1
- package/build-types/snackbar/index.d.ts +5 -2
- package/build-types/snackbar/index.d.ts.map +1 -1
- package/build-types/snackbar/list.d.ts.map +1 -1
- package/build-types/snackbar/test/index.d.ts +2 -0
- package/build-types/snackbar/test/index.d.ts.map +1 -0
- package/build-types/snackbar/test/list.d.ts +2 -0
- package/build-types/snackbar/test/list.d.ts.map +1 -0
- package/build-types/snackbar/types.d.ts +18 -2
- package/build-types/snackbar/types.d.ts.map +1 -1
- package/build-types/tab-panel/stories/index.story.d.ts +4 -4
- package/build-types/tabs/index.d.ts +1 -1
- package/build-types/tabs/stories/index.story.d.ts +9 -9
- package/build-types/tabs/stories/index.story.d.ts.map +1 -1
- package/build-types/tabs/types.d.ts +1 -1
- package/build-types/text/stories/index.story.d.ts +3 -3
- package/build-types/theme/stories/index.story.d.ts +1 -1
- package/build-types/theme/stories/index.story.d.ts.map +1 -1
- package/build-types/toggle-control/stories/index.story.d.ts +2 -2
- package/build-types/toolbar/stories/index.story.d.ts +3 -3
- package/build-types/tooltip/stories/index.story.d.ts +1 -1
- package/build-types/tree-grid/stories/index.story.d.ts +1 -1
- package/build-types/tree-select/stories/index.story.d.ts +1 -1
- package/build-types/utils/hooks/index.d.ts +0 -1
- package/build-types/utils/with-ignore-ime-events.d.ts +15 -0
- package/build-types/utils/with-ignore-ime-events.d.ts.map +1 -0
- package/build-types/v-stack/hook.d.ts +2 -4
- package/build-types/v-stack/hook.d.ts.map +1 -1
- package/build-types/v-stack/stories/index.story.d.ts +1 -1
- package/package.json +19 -20
- package/src/alignment-matrix-control/test/index.tsx +3 -1
- package/src/autocomplete/index.tsx +3 -10
- package/src/base-control/index.native.js +1 -1
- package/src/base-control/test/index.tsx +1 -1
- package/src/border-box-control/border-box-control/component.tsx +1 -1
- package/src/border-box-control/border-box-control-split-controls/component.tsx +4 -4
- package/src/border-control/border-control-dropdown/component.tsx +1 -1
- package/src/button/index.native.js +1 -1
- package/src/button/index.tsx +1 -1
- package/src/button/style.scss +1 -3
- package/src/circular-option-picker/test/index.tsx +6 -5
- package/src/color-picker/component.tsx +22 -11
- package/src/color-picker/styles.ts +1 -15
- package/src/combobox-control/index.tsx +33 -41
- package/src/combobox-control/test/index.tsx +1 -1
- package/src/composite/legacy/test/index.tsx +18 -2
- package/src/confirm-dialog/component.tsx +1 -1
- package/src/confirm-dialog/test/index.tsx +5 -21
- package/src/custom-select-control/README.md +0 -10
- package/src/custom-select-control/index.js +3 -22
- package/src/custom-select-control/stories/index.story.js +0 -1
- package/src/custom-select-control/test/index.js +17 -17
- package/src/custom-select-control-v2/README.md +97 -7
- package/src/custom-select-control-v2/custom-select-item.tsx +29 -0
- package/src/custom-select-control-v2/custom-select.tsx +122 -0
- package/src/custom-select-control-v2/default-component/index.tsx +27 -0
- package/src/custom-select-control-v2/index.tsx +2 -102
- package/src/custom-select-control-v2/legacy-component/index.tsx +133 -0
- package/src/custom-select-control-v2/legacy-component/test/index.tsx +457 -0
- package/src/custom-select-control-v2/stories/{index.story.tsx → default.story.tsx} +27 -33
- package/src/custom-select-control-v2/stories/legacy.story.tsx +87 -0
- package/src/custom-select-control-v2/styles.ts +82 -38
- package/src/custom-select-control-v2/test/index.tsx +207 -17
- package/src/custom-select-control-v2/types.ts +147 -20
- package/src/disabled/test/index.tsx +1 -1
- package/src/draggable/index.native.js +2 -2
- package/src/draggable/test/index.native.js +6 -2
- package/src/dropdown-menu/index.native.js +2 -2
- package/src/dropdown-menu-v2/stories/index.story.tsx +1 -0
- package/src/dropdown-menu-v2/test/index.tsx +4 -1
- package/src/flex/flex/hook.ts +1 -1
- package/src/font-size-picker/font-size-picker-select.tsx +0 -1
- package/src/font-size-picker/index.native.js +2 -2
- package/src/form-token-field/index.tsx +4 -11
- package/src/form-token-field/suggestions-list.tsx +5 -17
- package/src/h-stack/hook.tsx +2 -1
- package/src/h-stack/test/index.tsx +10 -0
- package/src/item-group/test/index.js +2 -2
- package/src/mobile/bottom-sheet/bottom-sheet-navigation/test/navigation-container.native.js +10 -15
- package/src/mobile/bottom-sheet/button.native.js +1 -5
- package/src/mobile/bottom-sheet/index.native.js +2 -2
- package/src/mobile/bottom-sheet/range-cell.native.js +1 -1
- package/src/mobile/bottom-sheet/stepper-cell/index.native.js +2 -2
- package/src/mobile/bottom-sheet-select-control/index.native.js +1 -1
- package/src/mobile/bottom-sheet-text-control/index.native.js +1 -1
- package/src/mobile/gradient/index.native.js +1 -1
- package/src/mobile/image/index.native.js +8 -23
- package/src/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js +1 -1
- package/src/mobile/media-edit/index.native.js +1 -1
- package/src/modal/index.tsx +2 -12
- package/src/modal/style.scss +1 -0
- package/src/modal/test/index.tsx +1 -1
- package/src/navigation/stories/utils/hide-if-empty.tsx +2 -6
- package/src/palette-edit/index.tsx +2 -2
- package/src/popover/test/index.tsx +1 -4
- package/src/progress-bar/stories/index.story.tsx +1 -0
- package/src/progress-bar/styles.ts +2 -2
- package/src/query-controls/index.native.js +2 -2
- package/src/radio-group/stories/index.story.tsx +1 -0
- package/src/range-control/index.tsx +3 -3
- package/src/range-control/test/index.tsx +2 -2
- package/src/search-control/index.native.js +1 -1
- package/src/snackbar/index.tsx +5 -2
- package/src/snackbar/list.tsx +6 -1
- package/src/snackbar/stories/list.story.tsx +0 -3
- package/src/snackbar/test/index.tsx +267 -0
- package/src/snackbar/test/list.tsx +46 -0
- package/src/snackbar/types.ts +31 -3
- package/src/tab-panel/test/index.tsx +8 -1
- package/src/tabs/README.md +18 -18
- package/src/tabs/index.tsx +7 -7
- package/src/tabs/stories/index.story.tsx +2 -1
- package/src/tabs/test/index.tsx +66 -36
- package/src/tabs/types.ts +1 -1
- package/src/theme/stories/index.story.tsx +1 -0
- package/src/toggle-group-control/test/index.tsx +5 -1
- package/src/toolbar/toolbar-group/style.scss +1 -0
- package/src/tools-panel/stories/index.story.tsx +8 -8
- package/src/tools-panel/test/index.tsx +10 -28
- package/src/tooltip/style.scss +2 -1
- package/src/tooltip/test/index.native.js +3 -3
- package/src/tooltip/test/index.tsx +5 -0
- package/src/tree-grid/test/index.tsx +1 -1
- package/src/utils/hooks/index.js +0 -1
- package/src/utils/with-ignore-ime-events.ts +32 -0
- package/src/v-stack/test/index.tsx +10 -0
- package/tsconfig.json +0 -1
- package/tsconfig.tsbuildinfo +1 -1
- package/build/custom-select-control/styles.js +0 -27
- package/build/custom-select-control/styles.js.map +0 -1
- package/build/utils/hooks/use-latest-ref.js +0 -33
- package/build/utils/hooks/use-latest-ref.js.map +0 -1
- package/build-module/custom-select-control/styles.js +0 -18
- package/build-module/custom-select-control/styles.js.map +0 -1
- package/build-module/utils/hooks/use-latest-ref.js +0 -27
- package/build-module/utils/hooks/use-latest-ref.js.map +0 -1
- package/build-types/custom-select-control/styles.d.ts +0 -11
- package/build-types/custom-select-control/styles.d.ts.map +0 -1
- package/build-types/custom-select-control-v2/stories/index.story.d.ts +0 -20
- package/build-types/custom-select-control-v2/stories/index.story.d.ts.map +0 -1
- package/build-types/utils/hooks/use-latest-ref.d.ts +0 -15
- package/build-types/utils/hooks/use-latest-ref.d.ts.map +0 -1
- package/src/custom-select-control/styles.ts +0 -28
- package/src/utils/hooks/test/use-latest-ref.js +0 -119
- package/src/utils/hooks/use-latest-ref.ts +0 -29
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.InputBaseWithBackCompatMinWidth = void 0;
|
|
8
|
-
var _base = _interopRequireDefault(require("@emotion/styled/base"));
|
|
9
|
-
var _react = require("@emotion/react");
|
|
10
|
-
var _inputBase = _interopRequireDefault(require("../input-control/input-base"));
|
|
11
|
-
var _inputControlStyles = require("../input-control/styles/input-control-styles");
|
|
12
|
-
/**
|
|
13
|
-
* External dependencies
|
|
14
|
-
*/
|
|
15
|
-
|
|
16
|
-
/**
|
|
17
|
-
* Internal dependencies
|
|
18
|
-
*/
|
|
19
|
-
|
|
20
|
-
const backCompatMinWidth = props => !props.__nextUnconstrainedWidth ? /*#__PURE__*/(0, _react.css)(_inputControlStyles.Container, "{min-width:130px;}" + (process.env.NODE_ENV === "production" ? "" : ";label:backCompatMinWidth;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvY3VzdG9tLXNlbGVjdC1jb250cm9sL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQk8iLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9jdXN0b20tc2VsZWN0LWNvbnRyb2wvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgSW5wdXRCYXNlIGZyb20gJy4uL2lucHV0LWNvbnRyb2wvaW5wdXQtYmFzZSc7XG5pbXBvcnQgeyBDb250YWluZXIgYXMgSW5wdXRDb250cm9sQ29udGFpbmVyIH0gZnJvbSAnLi4vaW5wdXQtY29udHJvbC9zdHlsZXMvaW5wdXQtY29udHJvbC1zdHlsZXMnO1xuXG50eXBlIEJhY2tDb21wYXRNaW5XaWR0aFByb3BzID0ge1xuXHRfX25leHRVbmNvbnN0cmFpbmVkV2lkdGg6IGJvb2xlYW47XG59O1xuXG5jb25zdCBiYWNrQ29tcGF0TWluV2lkdGggPSAoIHByb3BzOiBCYWNrQ29tcGF0TWluV2lkdGhQcm9wcyApID0+XG5cdCEgcHJvcHMuX19uZXh0VW5jb25zdHJhaW5lZFdpZHRoXG5cdFx0PyBjc3NgXG5cdFx0XHRcdCR7IElucHV0Q29udHJvbENvbnRhaW5lciB9IHtcblx0XHRcdFx0XHRtaW4td2lkdGg6IDEzMHB4O1xuXHRcdFx0XHR9XG5cdFx0ICBgXG5cdFx0OiAnJztcblxuZXhwb3J0IGNvbnN0IElucHV0QmFzZVdpdGhCYWNrQ29tcGF0TWluV2lkdGggPSBzdHlsZWQoIElucHV0QmFzZSApYFxuXHQkeyBiYWNrQ29tcGF0TWluV2lkdGggfVxuYDtcbiJdfQ== */") : '';
|
|
21
|
-
const InputBaseWithBackCompatMinWidth = exports.InputBaseWithBackCompatMinWidth = ( /*#__PURE__*/0, _base.default)(_inputBase.default, process.env.NODE_ENV === "production" ? {
|
|
22
|
-
target: "eswuck60"
|
|
23
|
-
} : {
|
|
24
|
-
target: "eswuck60",
|
|
25
|
-
label: "InputBaseWithBackCompatMinWidth"
|
|
26
|
-
})(backCompatMinWidth, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvY3VzdG9tLXNlbGVjdC1jb250cm9sL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5QmtFIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvY3VzdG9tLXNlbGVjdC1jb250cm9sL3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IElucHV0QmFzZSBmcm9tICcuLi9pbnB1dC1jb250cm9sL2lucHV0LWJhc2UnO1xuaW1wb3J0IHsgQ29udGFpbmVyIGFzIElucHV0Q29udHJvbENvbnRhaW5lciB9IGZyb20gJy4uL2lucHV0LWNvbnRyb2wvc3R5bGVzL2lucHV0LWNvbnRyb2wtc3R5bGVzJztcblxudHlwZSBCYWNrQ29tcGF0TWluV2lkdGhQcm9wcyA9IHtcblx0X19uZXh0VW5jb25zdHJhaW5lZFdpZHRoOiBib29sZWFuO1xufTtcblxuY29uc3QgYmFja0NvbXBhdE1pbldpZHRoID0gKCBwcm9wczogQmFja0NvbXBhdE1pbldpZHRoUHJvcHMgKSA9PlxuXHQhIHByb3BzLl9fbmV4dFVuY29uc3RyYWluZWRXaWR0aFxuXHRcdD8gY3NzYFxuXHRcdFx0XHQkeyBJbnB1dENvbnRyb2xDb250YWluZXIgfSB7XG5cdFx0XHRcdFx0bWluLXdpZHRoOiAxMzBweDtcblx0XHRcdFx0fVxuXHRcdCAgYFxuXHRcdDogJyc7XG5cbmV4cG9ydCBjb25zdCBJbnB1dEJhc2VXaXRoQmFja0NvbXBhdE1pbldpZHRoID0gc3R5bGVkKCBJbnB1dEJhc2UgKWBcblx0JHsgYmFja0NvbXBhdE1pbldpZHRoIH1cbmA7XG4iXX0= */"));
|
|
27
|
-
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["_react","require","_inputBase","_interopRequireDefault","_inputControlStyles","backCompatMinWidth","props","__nextUnconstrainedWidth","css","InputControlContainer","process","env","NODE_ENV","InputBaseWithBackCompatMinWidth","exports","_base","default","InputBase","target","label"],"sources":["@wordpress/components/src/custom-select-control/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport InputBase from '../input-control/input-base';\nimport { Container as InputControlContainer } from '../input-control/styles/input-control-styles';\n\ntype BackCompatMinWidthProps = {\n\t__nextUnconstrainedWidth: boolean;\n};\n\nconst backCompatMinWidth = ( props: BackCompatMinWidthProps ) =>\n\t! props.__nextUnconstrainedWidth\n\t\t? css`\n\t\t\t\t${ InputControlContainer } {\n\t\t\t\t\tmin-width: 130px;\n\t\t\t\t}\n\t\t `\n\t\t: '';\n\nexport const InputBaseWithBackCompatMinWidth = styled( InputBase )`\n\t${ backCompatMinWidth }\n`;\n"],"mappings":";;;;;;;;AAGA,IAAAA,MAAA,GAAAC,OAAA;AAMA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,mBAAA,GAAAH,OAAA;AAVA;AACA;AACA;;AAIA;AACA;AACA;;AAQA,MAAMI,kBAAkB,GAAKC,KAA8B,IAC1D,CAAEA,KAAK,CAACC,wBAAwB,oBAC7BC,UAAG,EACAC,6BAAqB,0BAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,wDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,0xCAIxB,EAAE;AAEC,MAAMC,+BAA+B,GAAAC,OAAA,CAAAD,+BAAA,GAAG,kBAAAE,KAAA,CAAAC,OAAA,EAAQC,kBAAS,EAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,CAC9Dd,kBAAkB,SAAAK,OAAA,CAAAC,GAAA,CAAAC,QAAA,wxCACrB"}
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.useLatestRef = useLatestRef;
|
|
7
|
-
var _element = require("@wordpress/element");
|
|
8
|
-
var _compose = require("@wordpress/compose");
|
|
9
|
-
/**
|
|
10
|
-
* External dependencies
|
|
11
|
-
*/
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* WordPress dependencies
|
|
15
|
-
*/
|
|
16
|
-
|
|
17
|
-
/**
|
|
18
|
-
* Creates a reference for a prop. This is useful for preserving dependency
|
|
19
|
-
* memoization for hooks like useCallback.
|
|
20
|
-
*
|
|
21
|
-
* @see https://codesandbox.io/s/uselatestref-mlj3i?file=/src/App.tsx
|
|
22
|
-
*
|
|
23
|
-
* @param value The value to reference
|
|
24
|
-
* @return The prop reference.
|
|
25
|
-
*/
|
|
26
|
-
function useLatestRef(value) {
|
|
27
|
-
const ref = (0, _element.useRef)(value);
|
|
28
|
-
(0, _compose.useIsomorphicLayoutEffect)(() => {
|
|
29
|
-
ref.current = value;
|
|
30
|
-
});
|
|
31
|
-
return ref;
|
|
32
|
-
}
|
|
33
|
-
//# sourceMappingURL=use-latest-ref.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["_element","require","_compose","useLatestRef","value","ref","useRef","useIsomorphicLayoutEffect","current"],"sources":["@wordpress/components/src/utils/hooks/use-latest-ref.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { RefObject } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\nimport { useIsomorphicLayoutEffect } from '@wordpress/compose';\n\n/**\n * Creates a reference for a prop. This is useful for preserving dependency\n * memoization for hooks like useCallback.\n *\n * @see https://codesandbox.io/s/uselatestref-mlj3i?file=/src/App.tsx\n *\n * @param value The value to reference\n * @return The prop reference.\n */\nexport function useLatestRef< T >( value: T ): RefObject< T > {\n\tconst ref = useRef( value );\n\n\tuseIsomorphicLayoutEffect( () => {\n\t\tref.current = value;\n\t} );\n\n\treturn ref;\n}\n"],"mappings":";;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AATA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASE,YAAYA,CAAOC,KAAQ,EAAmB;EAC7D,MAAMC,GAAG,GAAG,IAAAC,eAAM,EAAEF,KAAM,CAAC;EAE3B,IAAAG,kCAAyB,EAAE,MAAM;IAChCF,GAAG,CAACG,OAAO,GAAGJ,KAAK;EACpB,CAAE,CAAC;EAEH,OAAOC,GAAG;AACX"}
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import _styled from "@emotion/styled/base";
|
|
2
|
-
/**
|
|
3
|
-
* External dependencies
|
|
4
|
-
*/
|
|
5
|
-
import { css } from '@emotion/react';
|
|
6
|
-
/**
|
|
7
|
-
* Internal dependencies
|
|
8
|
-
*/
|
|
9
|
-
import InputBase from '../input-control/input-base';
|
|
10
|
-
import { Container as InputControlContainer } from '../input-control/styles/input-control-styles';
|
|
11
|
-
const backCompatMinWidth = props => !props.__nextUnconstrainedWidth ? /*#__PURE__*/css(InputControlContainer, "{min-width:130px;}" + (process.env.NODE_ENV === "production" ? "" : ";label:backCompatMinWidth;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvY3VzdG9tLXNlbGVjdC1jb250cm9sL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQk8iLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9jdXN0b20tc2VsZWN0LWNvbnRyb2wvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgSW5wdXRCYXNlIGZyb20gJy4uL2lucHV0LWNvbnRyb2wvaW5wdXQtYmFzZSc7XG5pbXBvcnQgeyBDb250YWluZXIgYXMgSW5wdXRDb250cm9sQ29udGFpbmVyIH0gZnJvbSAnLi4vaW5wdXQtY29udHJvbC9zdHlsZXMvaW5wdXQtY29udHJvbC1zdHlsZXMnO1xuXG50eXBlIEJhY2tDb21wYXRNaW5XaWR0aFByb3BzID0ge1xuXHRfX25leHRVbmNvbnN0cmFpbmVkV2lkdGg6IGJvb2xlYW47XG59O1xuXG5jb25zdCBiYWNrQ29tcGF0TWluV2lkdGggPSAoIHByb3BzOiBCYWNrQ29tcGF0TWluV2lkdGhQcm9wcyApID0+XG5cdCEgcHJvcHMuX19uZXh0VW5jb25zdHJhaW5lZFdpZHRoXG5cdFx0PyBjc3NgXG5cdFx0XHRcdCR7IElucHV0Q29udHJvbENvbnRhaW5lciB9IHtcblx0XHRcdFx0XHRtaW4td2lkdGg6IDEzMHB4O1xuXHRcdFx0XHR9XG5cdFx0ICBgXG5cdFx0OiAnJztcblxuZXhwb3J0IGNvbnN0IElucHV0QmFzZVdpdGhCYWNrQ29tcGF0TWluV2lkdGggPSBzdHlsZWQoIElucHV0QmFzZSApYFxuXHQkeyBiYWNrQ29tcGF0TWluV2lkdGggfVxuYDtcbiJdfQ== */") : '';
|
|
12
|
-
export const InputBaseWithBackCompatMinWidth = /*#__PURE__*/_styled(InputBase, process.env.NODE_ENV === "production" ? {
|
|
13
|
-
target: "eswuck60"
|
|
14
|
-
} : {
|
|
15
|
-
target: "eswuck60",
|
|
16
|
-
label: "InputBaseWithBackCompatMinWidth"
|
|
17
|
-
})(backCompatMinWidth, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvY3VzdG9tLXNlbGVjdC1jb250cm9sL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5QmtFIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvY3VzdG9tLXNlbGVjdC1jb250cm9sL3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IElucHV0QmFzZSBmcm9tICcuLi9pbnB1dC1jb250cm9sL2lucHV0LWJhc2UnO1xuaW1wb3J0IHsgQ29udGFpbmVyIGFzIElucHV0Q29udHJvbENvbnRhaW5lciB9IGZyb20gJy4uL2lucHV0LWNvbnRyb2wvc3R5bGVzL2lucHV0LWNvbnRyb2wtc3R5bGVzJztcblxudHlwZSBCYWNrQ29tcGF0TWluV2lkdGhQcm9wcyA9IHtcblx0X19uZXh0VW5jb25zdHJhaW5lZFdpZHRoOiBib29sZWFuO1xufTtcblxuY29uc3QgYmFja0NvbXBhdE1pbldpZHRoID0gKCBwcm9wczogQmFja0NvbXBhdE1pbldpZHRoUHJvcHMgKSA9PlxuXHQhIHByb3BzLl9fbmV4dFVuY29uc3RyYWluZWRXaWR0aFxuXHRcdD8gY3NzYFxuXHRcdFx0XHQkeyBJbnB1dENvbnRyb2xDb250YWluZXIgfSB7XG5cdFx0XHRcdFx0bWluLXdpZHRoOiAxMzBweDtcblx0XHRcdFx0fVxuXHRcdCAgYFxuXHRcdDogJyc7XG5cbmV4cG9ydCBjb25zdCBJbnB1dEJhc2VXaXRoQmFja0NvbXBhdE1pbldpZHRoID0gc3R5bGVkKCBJbnB1dEJhc2UgKWBcblx0JHsgYmFja0NvbXBhdE1pbldpZHRoIH1cbmA7XG4iXX0= */"));
|
|
18
|
-
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["css","InputBase","Container","InputControlContainer","backCompatMinWidth","props","__nextUnconstrainedWidth","process","env","NODE_ENV","InputBaseWithBackCompatMinWidth","_styled","target","label"],"sources":["@wordpress/components/src/custom-select-control/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport InputBase from '../input-control/input-base';\nimport { Container as InputControlContainer } from '../input-control/styles/input-control-styles';\n\ntype BackCompatMinWidthProps = {\n\t__nextUnconstrainedWidth: boolean;\n};\n\nconst backCompatMinWidth = ( props: BackCompatMinWidthProps ) =>\n\t! props.__nextUnconstrainedWidth\n\t\t? css`\n\t\t\t\t${ InputControlContainer } {\n\t\t\t\t\tmin-width: 130px;\n\t\t\t\t}\n\t\t `\n\t\t: '';\n\nexport const InputBaseWithBackCompatMinWidth = styled( InputBase )`\n\t${ backCompatMinWidth }\n`;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,GAAG,QAAQ,gBAAgB;AAGpC;AACA;AACA;AACA,OAAOC,SAAS,MAAM,6BAA6B;AACnD,SAASC,SAAS,IAAIC,qBAAqB,QAAQ,8CAA8C;AAMjG,MAAMC,kBAAkB,GAAKC,KAA8B,IAC1D,CAAEA,KAAK,CAACC,wBAAwB,gBAC7BN,GAAG,CACAG,qBAAqB,0BAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,wDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,0xCAIxB,EAAE;AAEN,OAAO,MAAMC,+BAA+B,GAAG,aAAAC,OAAA,CAAQV,SAAS,EAAAM,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,CAC9DT,kBAAkB,SAAAG,OAAA,CAAAC,GAAA,CAAAC,QAAA,wxCACrB"}
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* External dependencies
|
|
3
|
-
*/
|
|
4
|
-
|
|
5
|
-
/**
|
|
6
|
-
* WordPress dependencies
|
|
7
|
-
*/
|
|
8
|
-
import { useRef } from '@wordpress/element';
|
|
9
|
-
import { useIsomorphicLayoutEffect } from '@wordpress/compose';
|
|
10
|
-
|
|
11
|
-
/**
|
|
12
|
-
* Creates a reference for a prop. This is useful for preserving dependency
|
|
13
|
-
* memoization for hooks like useCallback.
|
|
14
|
-
*
|
|
15
|
-
* @see https://codesandbox.io/s/uselatestref-mlj3i?file=/src/App.tsx
|
|
16
|
-
*
|
|
17
|
-
* @param value The value to reference
|
|
18
|
-
* @return The prop reference.
|
|
19
|
-
*/
|
|
20
|
-
export function useLatestRef(value) {
|
|
21
|
-
const ref = useRef(value);
|
|
22
|
-
useIsomorphicLayoutEffect(() => {
|
|
23
|
-
ref.current = value;
|
|
24
|
-
});
|
|
25
|
-
return ref;
|
|
26
|
-
}
|
|
27
|
-
//# sourceMappingURL=use-latest-ref.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["useRef","useIsomorphicLayoutEffect","useLatestRef","value","ref","current"],"sources":["@wordpress/components/src/utils/hooks/use-latest-ref.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { RefObject } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\nimport { useIsomorphicLayoutEffect } from '@wordpress/compose';\n\n/**\n * Creates a reference for a prop. This is useful for preserving dependency\n * memoization for hooks like useCallback.\n *\n * @see https://codesandbox.io/s/uselatestref-mlj3i?file=/src/App.tsx\n *\n * @param value The value to reference\n * @return The prop reference.\n */\nexport function useLatestRef< T >( value: T ): RefObject< T > {\n\tconst ref = useRef( value );\n\n\tuseIsomorphicLayoutEffect( () => {\n\t\tref.current = value;\n\t} );\n\n\treturn ref;\n}\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,oBAAoB;AAC3C,SAASC,yBAAyB,QAAQ,oBAAoB;;AAE9D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,YAAYA,CAAOC,KAAQ,EAAmB;EAC7D,MAAMC,GAAG,GAAGJ,MAAM,CAAEG,KAAM,CAAC;EAE3BF,yBAAyB,CAAE,MAAM;IAChCG,GAAG,CAACC,OAAO,GAAGF,KAAK;EACpB,CAAE,CAAC;EAEH,OAAOC,GAAG;AACX"}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
type BackCompatMinWidthProps = {
|
|
3
|
-
__nextUnconstrainedWidth: boolean;
|
|
4
|
-
};
|
|
5
|
-
export declare const InputBaseWithBackCompatMinWidth: import("@emotion/styled").StyledComponent<import("../input-control/types").InputBaseProps & import("react").RefAttributes<any> & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>>, "as" | keyof import("react").RefAttributes<any> | keyof import("../input-control/types").InputBaseProps> & {
|
|
6
|
-
as?: keyof JSX.IntrinsicElements | undefined;
|
|
7
|
-
} & {
|
|
8
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
9
|
-
} & BackCompatMinWidthProps, {}, {}>;
|
|
10
|
-
export {};
|
|
11
|
-
//# sourceMappingURL=styles.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/custom-select-control/styles.ts"],"names":[],"mappings":";AAYA,KAAK,uBAAuB,GAAG;IAC9B,wBAAwB,EAAE,OAAO,CAAC;CAClC,CAAC;AAWF,eAAO,MAAM,+BAA+B;;;;oCAE3C,CAAC"}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
/**
|
|
3
|
-
* External dependencies
|
|
4
|
-
*/
|
|
5
|
-
import type { Meta } from '@storybook/react';
|
|
6
|
-
/**
|
|
7
|
-
* Internal dependencies
|
|
8
|
-
*/
|
|
9
|
-
import { CustomSelect } from '..';
|
|
10
|
-
declare const meta: Meta<typeof CustomSelect>;
|
|
11
|
-
export default meta;
|
|
12
|
-
export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, import("../types").CustomSelectProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>>, "as" | keyof import("../types").CustomSelectProps>>;
|
|
13
|
-
/**
|
|
14
|
-
* Multiple selection can be enabled by using an array for the `value` and
|
|
15
|
-
* `defaultValue` props. The argument of the `onChange` function will also
|
|
16
|
-
* change accordingly.
|
|
17
|
-
*/
|
|
18
|
-
export declare const MultiSelect: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, import("../types").CustomSelectProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>>, "as" | keyof import("../types").CustomSelectProps>>;
|
|
19
|
-
export declare const Controlled: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, import("../types").CustomSelectProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>>, "as" | keyof import("../types").CustomSelectProps>>;
|
|
20
|
-
//# sourceMappingURL=index.story.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/custom-select-control-v2/stories/index.story.tsx"],"names":[],"mappings":";AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,kBAAkB,CAAC;AAOtD;;GAEG;AACH,OAAO,EAAE,YAAY,EAAoB,MAAM,IAAI,CAAC;AAEpD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,YAAY,CAgCpC,CAAC;AACF,eAAe,IAAI,CAAC;AAoBpB,eAAO,MAAM,OAAO,2XAAsB,CAAC;AAe3C;;;;GAIG;AACH,eAAO,MAAM,WAAW,2XAAsB,CAAC;AA8C/C,eAAO,MAAM,UAAU,2XAAgC,CAAC"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* External dependencies
|
|
3
|
-
*/
|
|
4
|
-
import type { RefObject } from 'react';
|
|
5
|
-
/**
|
|
6
|
-
* Creates a reference for a prop. This is useful for preserving dependency
|
|
7
|
-
* memoization for hooks like useCallback.
|
|
8
|
-
*
|
|
9
|
-
* @see https://codesandbox.io/s/uselatestref-mlj3i?file=/src/App.tsx
|
|
10
|
-
*
|
|
11
|
-
* @param value The value to reference
|
|
12
|
-
* @return The prop reference.
|
|
13
|
-
*/
|
|
14
|
-
export declare function useLatestRef<T>(value: T): RefObject<T>;
|
|
15
|
-
//# sourceMappingURL=use-latest-ref.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-latest-ref.d.ts","sourceRoot":"","sources":["../../../src/utils/hooks/use-latest-ref.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQvC;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAAE,CAAC,EAAI,KAAK,EAAE,CAAC,GAAI,SAAS,CAAE,CAAC,CAAE,CAQ5D"}
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* External dependencies
|
|
3
|
-
*/
|
|
4
|
-
import { css } from '@emotion/react';
|
|
5
|
-
import styled from '@emotion/styled';
|
|
6
|
-
|
|
7
|
-
/**
|
|
8
|
-
* Internal dependencies
|
|
9
|
-
*/
|
|
10
|
-
import InputBase from '../input-control/input-base';
|
|
11
|
-
import { Container as InputControlContainer } from '../input-control/styles/input-control-styles';
|
|
12
|
-
|
|
13
|
-
type BackCompatMinWidthProps = {
|
|
14
|
-
__nextUnconstrainedWidth: boolean;
|
|
15
|
-
};
|
|
16
|
-
|
|
17
|
-
const backCompatMinWidth = ( props: BackCompatMinWidthProps ) =>
|
|
18
|
-
! props.__nextUnconstrainedWidth
|
|
19
|
-
? css`
|
|
20
|
-
${ InputControlContainer } {
|
|
21
|
-
min-width: 130px;
|
|
22
|
-
}
|
|
23
|
-
`
|
|
24
|
-
: '';
|
|
25
|
-
|
|
26
|
-
export const InputBaseWithBackCompatMinWidth = styled( InputBase )`
|
|
27
|
-
${ backCompatMinWidth }
|
|
28
|
-
`;
|
|
@@ -1,119 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* External dependencies
|
|
3
|
-
*/
|
|
4
|
-
import { render, screen, fireEvent, waitFor } from '@testing-library/react';
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* WordPress dependencies
|
|
8
|
-
*/
|
|
9
|
-
import { useState } from '@wordpress/element';
|
|
10
|
-
|
|
11
|
-
/**
|
|
12
|
-
* Internal dependencies
|
|
13
|
-
*/
|
|
14
|
-
import { useLatestRef } from '..';
|
|
15
|
-
|
|
16
|
-
function debounce( callback, timeout = 0 ) {
|
|
17
|
-
let timeoutId = 0;
|
|
18
|
-
return ( ...args ) => {
|
|
19
|
-
window.clearTimeout( timeoutId );
|
|
20
|
-
timeoutId = window.setTimeout( () => callback( ...args ), timeout );
|
|
21
|
-
};
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
function useDebounce( callback, timeout = 0 ) {
|
|
25
|
-
const callbackRef = useLatestRef( callback );
|
|
26
|
-
return debounce( ( ...args ) => callbackRef.current( ...args ), timeout );
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
function Example() {
|
|
30
|
-
const [ count, setCount ] = useState( 0 );
|
|
31
|
-
const increment = () => setCount( count + 1 );
|
|
32
|
-
const incrementDebounced = debounce( increment, 50 );
|
|
33
|
-
const incrementDebouncedWithLatestRef = useDebounce( increment, 50 );
|
|
34
|
-
|
|
35
|
-
return (
|
|
36
|
-
<>
|
|
37
|
-
<div>Count: { count }</div>
|
|
38
|
-
<button onClick={ incrementDebounced }>Increment debounced</button>
|
|
39
|
-
<button onClick={ increment }>Increment immediately</button>
|
|
40
|
-
<br />
|
|
41
|
-
<button onClick={ incrementDebouncedWithLatestRef }>
|
|
42
|
-
Increment debounced with latest ref
|
|
43
|
-
</button>
|
|
44
|
-
</>
|
|
45
|
-
);
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
function getCount() {
|
|
49
|
-
return screen.getByText( /Count:/ ).innerHTML;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
function incrementCount() {
|
|
53
|
-
fireEvent.click( screen.getByText( 'Increment immediately' ) );
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
function incrementCountDebounced() {
|
|
57
|
-
fireEvent.click( screen.getByText( 'Increment debounced' ) );
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
function incrementCountDebouncedRef() {
|
|
61
|
-
fireEvent.click(
|
|
62
|
-
screen.getByText( 'Increment debounced with latest ref' )
|
|
63
|
-
);
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
describe( 'useLatestRef', () => {
|
|
67
|
-
describe( 'Example', () => {
|
|
68
|
-
// Prove the example works as expected.
|
|
69
|
-
it( 'should start at 0', () => {
|
|
70
|
-
render( <Example /> );
|
|
71
|
-
|
|
72
|
-
expect( getCount() ).toEqual( 'Count: 0' );
|
|
73
|
-
} );
|
|
74
|
-
|
|
75
|
-
it( 'should increment immediately', () => {
|
|
76
|
-
render( <Example /> );
|
|
77
|
-
|
|
78
|
-
incrementCount();
|
|
79
|
-
|
|
80
|
-
expect( getCount() ).toEqual( 'Count: 1' );
|
|
81
|
-
} );
|
|
82
|
-
|
|
83
|
-
it( 'should increment after debouncing', async () => {
|
|
84
|
-
render( <Example /> );
|
|
85
|
-
|
|
86
|
-
incrementCountDebounced();
|
|
87
|
-
|
|
88
|
-
expect( getCount() ).toEqual( 'Count: 0' );
|
|
89
|
-
await waitFor( () => expect( getCount() ).toEqual( 'Count: 1' ) );
|
|
90
|
-
} );
|
|
91
|
-
|
|
92
|
-
it( 'should increment after debouncing with latest ref', async () => {
|
|
93
|
-
render( <Example /> );
|
|
94
|
-
|
|
95
|
-
incrementCountDebouncedRef();
|
|
96
|
-
|
|
97
|
-
expect( getCount() ).toEqual( 'Count: 0' );
|
|
98
|
-
await waitFor( () => expect( getCount() ).toEqual( 'Count: 1' ) );
|
|
99
|
-
} );
|
|
100
|
-
} );
|
|
101
|
-
|
|
102
|
-
it( 'should increment to one', async () => {
|
|
103
|
-
render( <Example /> );
|
|
104
|
-
|
|
105
|
-
incrementCountDebounced();
|
|
106
|
-
incrementCount();
|
|
107
|
-
|
|
108
|
-
await waitFor( () => expect( getCount() ).toEqual( 'Count: 1' ) );
|
|
109
|
-
} );
|
|
110
|
-
|
|
111
|
-
it( 'should increment to two', async () => {
|
|
112
|
-
render( <Example /> );
|
|
113
|
-
|
|
114
|
-
incrementCountDebouncedRef();
|
|
115
|
-
incrementCount();
|
|
116
|
-
|
|
117
|
-
await waitFor( () => expect( getCount() ).toEqual( 'Count: 2' ) );
|
|
118
|
-
} );
|
|
119
|
-
} );
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* External dependencies
|
|
3
|
-
*/
|
|
4
|
-
import type { RefObject } from 'react';
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* WordPress dependencies
|
|
8
|
-
*/
|
|
9
|
-
import { useRef } from '@wordpress/element';
|
|
10
|
-
import { useIsomorphicLayoutEffect } from '@wordpress/compose';
|
|
11
|
-
|
|
12
|
-
/**
|
|
13
|
-
* Creates a reference for a prop. This is useful for preserving dependency
|
|
14
|
-
* memoization for hooks like useCallback.
|
|
15
|
-
*
|
|
16
|
-
* @see https://codesandbox.io/s/uselatestref-mlj3i?file=/src/App.tsx
|
|
17
|
-
*
|
|
18
|
-
* @param value The value to reference
|
|
19
|
-
* @return The prop reference.
|
|
20
|
-
*/
|
|
21
|
-
export function useLatestRef< T >( value: T ): RefObject< T > {
|
|
22
|
-
const ref = useRef( value );
|
|
23
|
-
|
|
24
|
-
useIsomorphicLayoutEffect( () => {
|
|
25
|
-
ref.current = value;
|
|
26
|
-
} );
|
|
27
|
-
|
|
28
|
-
return ref;
|
|
29
|
-
}
|