@wordpress/components 28.1.0 → 28.3.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 +179 -120
- package/build/animation/index.js.map +1 -1
- package/build/autocomplete/autocompleter-ui.js +1 -0
- package/build/autocomplete/autocompleter-ui.js.map +1 -1
- package/build/autocomplete/index.js.map +1 -1
- package/build/base-control/index.js +14 -7
- package/build/base-control/index.js.map +1 -1
- package/build/border-box-control/border-box-control-visualizer/component.js +0 -4
- package/build/border-box-control/border-box-control-visualizer/component.js.map +1 -1
- package/build/button/index.js +5 -3
- package/build/button/index.js.map +1 -1
- package/build/button/types.js.map +1 -1
- package/build/combobox-control/index.js +4 -1
- package/build/combobox-control/index.js.map +1 -1
- package/build/composite/current/index.js.map +1 -1
- package/build/custom-select-control-v2/custom-select.js +58 -36
- package/build/custom-select-control-v2/custom-select.js.map +1 -1
- package/build/custom-select-control-v2/default-component/index.js +0 -1
- package/build/custom-select-control-v2/default-component/index.js.map +1 -1
- package/build/custom-select-control-v2/item.js +2 -0
- package/build/custom-select-control-v2/item.js.map +1 -1
- package/build/custom-select-control-v2/legacy-component/index.js +33 -15
- package/build/custom-select-control-v2/legacy-component/index.js.map +1 -1
- package/build/custom-select-control-v2/styles.js +92 -65
- package/build/custom-select-control-v2/styles.js.map +1 -1
- package/build/custom-select-control-v2/types.js.map +1 -1
- package/build/date-time/date-time/index.js +3 -1
- package/build/date-time/date-time/index.js.map +1 -1
- package/build/date-time/index.js +7 -0
- package/build/date-time/index.js.map +1 -1
- package/build/date-time/time/index.js +62 -145
- package/build/date-time/time/index.js.map +1 -1
- package/build/date-time/time-input/index.js +159 -0
- package/build/date-time/time-input/index.js.map +1 -0
- package/build/date-time/types.js.map +1 -1
- package/build/date-time/utils.js +64 -0
- package/build/date-time/utils.js.map +1 -1
- package/build/disclosure/index.js +0 -1
- package/build/disclosure/index.js.map +1 -1
- package/build/divider/component.js +0 -1
- package/build/divider/component.js.map +1 -1
- package/build/divider/types.js.map +1 -1
- package/build/drop-zone/index.js +16 -79
- package/build/drop-zone/index.js.map +1 -1
- package/build/dropdown-menu/index.js +1 -0
- package/build/dropdown-menu/index.js.map +1 -1
- package/build/dropdown-menu-v2/index.js +0 -1
- package/build/dropdown-menu-v2/index.js.map +1 -1
- package/build/dropdown-menu-v2/styles.js +15 -16
- package/build/dropdown-menu-v2/styles.js.map +1 -1
- package/build/dropdown-menu-v2/types.js.map +1 -1
- package/build/font-size-picker/font-size-picker-select.js +2 -2
- package/build/font-size-picker/font-size-picker-select.js.map +1 -1
- package/build/font-size-picker/index.js +1 -1
- package/build/font-size-picker/index.js.map +1 -1
- package/build/font-size-picker/utils.js +0 -4
- package/build/font-size-picker/utils.js.map +1 -1
- package/build/form-token-field/token.js +4 -1
- package/build/form-token-field/token.js.map +1 -1
- package/build/higher-order/with-spoken-messages/index.js +1 -2
- package/build/higher-order/with-spoken-messages/index.js.map +1 -1
- package/build/lock-unlock.js +1 -1
- package/build/lock-unlock.js.map +1 -1
- package/build/menu-items-choice/types.js.map +1 -1
- package/build/palette-edit/index.js +30 -38
- package/build/palette-edit/index.js.map +1 -1
- package/build/palette-edit/types.js.map +1 -1
- package/build/popover/index.js +0 -4
- package/build/popover/index.js.map +1 -1
- package/build/popover/utils.js +0 -1
- package/build/popover/utils.js.map +1 -1
- package/build/private-apis.js +2 -4
- package/build/private-apis.js.map +1 -1
- package/build/progress-bar/styles.js +19 -13
- package/build/progress-bar/styles.js.map +1 -1
- package/build/radio-group/context.js +0 -1
- package/build/radio-group/context.js.map +1 -1
- package/build/radio-group/index.js +0 -1
- package/build/radio-group/index.js.map +1 -1
- package/build/radio-group/radio.js +0 -1
- package/build/radio-group/radio.js.map +1 -1
- package/build/range-control/index.js +4 -1
- package/build/range-control/index.js.map +1 -1
- package/build/range-control/styles/range-control-styles.js +34 -28
- package/build/range-control/styles/range-control-styles.js.map +1 -1
- package/build/resizable-box/resize-tooltip/utils.js.map +1 -1
- package/build/select-control/index.js +1 -2
- package/build/select-control/index.js.map +1 -1
- package/build/select-control/styles/select-control-styles.js +13 -8
- package/build/select-control/styles/select-control-styles.js.map +1 -1
- package/build/tab-panel/index.js +0 -1
- package/build/tab-panel/index.js.map +1 -1
- package/build/tabs/index.js +0 -1
- package/build/tabs/index.js.map +1 -1
- package/build/tabs/styles.js +3 -5
- package/build/tabs/styles.js.map +1 -1
- package/build/tabs/tablist.js +148 -37
- package/build/tabs/tablist.js.map +1 -1
- package/build/tabs/types.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control/as-radio-group.js +0 -2
- package/build/toggle-group-control/toggle-group-control/as-radio-group.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control/component.js +0 -2
- package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control-option-base/component.js +0 -4
- package/build/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -1
- package/build/toolbar/toolbar/toolbar-container.js +0 -1
- package/build/toolbar/toolbar/toolbar-container.js.map +1 -1
- package/build/toolbar/toolbar/types.js.map +1 -1
- package/build/toolbar/toolbar-button/index.js +27 -19
- package/build/toolbar/toolbar-button/index.js.map +1 -1
- package/build/toolbar/toolbar-button/types.js.map +1 -1
- package/build/toolbar/toolbar-context/index.js +0 -1
- package/build/toolbar/toolbar-context/index.js.map +1 -1
- package/build/toolbar/toolbar-item/index.js +1 -1
- package/build/toolbar/toolbar-item/index.js.map +1 -1
- package/build/tooltip/index.js +3 -2
- package/build/tooltip/index.js.map +1 -1
- package/build/tooltip/types.js.map +1 -1
- package/build/unit-control/index.js +3 -3
- package/build/unit-control/index.js.map +1 -1
- package/build/unit-control/styles/unit-control-styles.js +7 -7
- package/build/unit-control/styles/unit-control-styles.js.map +1 -1
- package/build/utils/hooks/use-update-effect.js +4 -1
- package/build/utils/hooks/use-update-effect.js.map +1 -1
- package/build-module/animation/index.js +0 -1
- package/build-module/animation/index.js.map +1 -1
- package/build-module/autocomplete/autocompleter-ui.js +1 -0
- package/build-module/autocomplete/autocompleter-ui.js.map +1 -1
- package/build-module/autocomplete/index.js.map +1 -1
- package/build-module/base-control/index.js +13 -6
- package/build-module/base-control/index.js.map +1 -1
- package/build-module/border-box-control/border-box-control-visualizer/component.js +0 -4
- package/build-module/border-box-control/border-box-control-visualizer/component.js.map +1 -1
- package/build-module/button/index.js +5 -3
- package/build-module/button/index.js.map +1 -1
- package/build-module/button/types.js.map +1 -1
- package/build-module/combobox-control/index.js +4 -1
- package/build-module/combobox-control/index.js.map +1 -1
- package/build-module/composite/current/index.js +0 -3
- package/build-module/composite/current/index.js.map +1 -1
- package/build-module/custom-select-control-v2/custom-select.js +59 -38
- package/build-module/custom-select-control-v2/custom-select.js.map +1 -1
- package/build-module/custom-select-control-v2/default-component/index.js +0 -1
- package/build-module/custom-select-control-v2/default-component/index.js.map +1 -1
- package/build-module/custom-select-control-v2/item.js +2 -0
- package/build-module/custom-select-control-v2/item.js.map +1 -1
- package/build-module/custom-select-control-v2/legacy-component/index.js +33 -16
- package/build-module/custom-select-control-v2/legacy-component/index.js.map +1 -1
- package/build-module/custom-select-control-v2/styles.js +90 -63
- 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/date-time/date-time/index.js +4 -1
- package/build-module/date-time/date-time/index.js.map +1 -1
- package/build-module/date-time/index.js +2 -1
- package/build-module/date-time/index.js.map +1 -1
- package/build-module/date-time/time/index.js +65 -149
- package/build-module/date-time/time/index.js.map +1 -1
- package/build-module/date-time/time-input/index.js +151 -0
- package/build-module/date-time/time-input/index.js.map +1 -0
- package/build-module/date-time/types.js.map +1 -1
- package/build-module/date-time/utils.js +61 -0
- package/build-module/date-time/utils.js.map +1 -1
- package/build-module/disclosure/index.js +0 -1
- package/build-module/disclosure/index.js.map +1 -1
- package/build-module/divider/component.js +0 -1
- package/build-module/divider/component.js.map +1 -1
- package/build-module/divider/types.js.map +1 -1
- package/build-module/drop-zone/index.js +17 -80
- package/build-module/drop-zone/index.js.map +1 -1
- package/build-module/dropdown-menu/index.js +1 -0
- package/build-module/dropdown-menu/index.js.map +1 -1
- package/build-module/dropdown-menu-v2/index.js +0 -1
- package/build-module/dropdown-menu-v2/index.js.map +1 -1
- package/build-module/dropdown-menu-v2/styles.js +14 -15
- package/build-module/dropdown-menu-v2/styles.js.map +1 -1
- package/build-module/dropdown-menu-v2/types.js.map +1 -1
- package/build-module/font-size-picker/font-size-picker-select.js +1 -1
- package/build-module/font-size-picker/font-size-picker-select.js.map +1 -1
- package/build-module/font-size-picker/index.js +1 -1
- package/build-module/font-size-picker/index.js.map +1 -1
- package/build-module/font-size-picker/utils.js +0 -4
- package/build-module/font-size-picker/utils.js.map +1 -1
- package/build-module/form-token-field/token.js +4 -1
- package/build-module/form-token-field/token.js.map +1 -1
- package/build-module/higher-order/with-spoken-messages/index.js +1 -2
- package/build-module/higher-order/with-spoken-messages/index.js.map +1 -1
- package/build-module/lock-unlock.js +1 -1
- package/build-module/lock-unlock.js.map +1 -1
- package/build-module/menu-items-choice/types.js.map +1 -1
- package/build-module/palette-edit/index.js +31 -39
- package/build-module/palette-edit/index.js.map +1 -1
- package/build-module/palette-edit/types.js.map +1 -1
- package/build-module/popover/index.js +0 -3
- package/build-module/popover/index.js.map +1 -1
- package/build-module/popover/utils.js +0 -1
- package/build-module/popover/utils.js.map +1 -1
- package/build-module/private-apis.js +2 -4
- package/build-module/private-apis.js.map +1 -1
- package/build-module/progress-bar/styles.js +21 -13
- package/build-module/progress-bar/styles.js.map +1 -1
- package/build-module/radio-group/context.js +0 -1
- package/build-module/radio-group/context.js.map +1 -1
- package/build-module/radio-group/index.js +0 -1
- package/build-module/radio-group/index.js.map +1 -1
- package/build-module/radio-group/radio.js +0 -1
- package/build-module/radio-group/radio.js.map +1 -1
- package/build-module/range-control/index.js +4 -1
- package/build-module/range-control/index.js.map +1 -1
- package/build-module/range-control/styles/range-control-styles.js +34 -28
- package/build-module/range-control/styles/range-control-styles.js.map +1 -1
- package/build-module/resizable-box/resize-tooltip/utils.js.map +1 -1
- package/build-module/select-control/index.js +2 -3
- package/build-module/select-control/index.js.map +1 -1
- package/build-module/select-control/styles/select-control-styles.js +12 -7
- package/build-module/select-control/styles/select-control-styles.js.map +1 -1
- package/build-module/tab-panel/index.js +0 -1
- package/build-module/tab-panel/index.js.map +1 -1
- package/build-module/tabs/index.js +0 -1
- package/build-module/tabs/index.js.map +1 -1
- package/build-module/tabs/styles.js +3 -4
- package/build-module/tabs/styles.js.map +1 -1
- package/build-module/tabs/tablist.js +149 -38
- package/build-module/tabs/tablist.js.map +1 -1
- package/build-module/tabs/types.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control/as-radio-group.js +0 -1
- package/build-module/toggle-group-control/toggle-group-control/as-radio-group.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control/component.js +0 -1
- package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control-option-base/component.js +0 -2
- package/build-module/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -1
- package/build-module/toolbar/toolbar/toolbar-container.js +0 -1
- package/build-module/toolbar/toolbar/toolbar-container.js.map +1 -1
- package/build-module/toolbar/toolbar/types.js.map +1 -1
- package/build-module/toolbar/toolbar-button/index.js +27 -19
- package/build-module/toolbar/toolbar-button/index.js.map +1 -1
- package/build-module/toolbar/toolbar-button/types.js.map +1 -1
- package/build-module/toolbar/toolbar-context/index.js +0 -1
- package/build-module/toolbar/toolbar-context/index.js.map +1 -1
- package/build-module/toolbar/toolbar-item/index.js +1 -1
- package/build-module/toolbar/toolbar-item/index.js.map +1 -1
- package/build-module/tooltip/index.js +3 -2
- package/build-module/tooltip/index.js.map +1 -1
- package/build-module/tooltip/types.js.map +1 -1
- package/build-module/unit-control/index.js +3 -3
- package/build-module/unit-control/index.js.map +1 -1
- package/build-module/unit-control/styles/unit-control-styles.js +7 -7
- package/build-module/unit-control/styles/unit-control-styles.js.map +1 -1
- package/build-module/utils/hooks/use-update-effect.js +4 -1
- package/build-module/utils/hooks/use-update-effect.js.map +1 -1
- package/build-style/style-rtl.css +46 -6
- package/build-style/style.css +46 -6
- package/build-types/animation/index.d.ts.map +1 -1
- package/build-types/autocomplete/autocompleter-ui.d.ts.map +1 -1
- package/build-types/autocomplete/index.d.ts.map +1 -1
- package/build-types/base-control/index.d.ts +6 -20
- package/build-types/base-control/index.d.ts.map +1 -1
- package/build-types/base-control/stories/index.story.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control-visualizer/component.d.ts.map +1 -1
- package/build-types/button/deprecated.d.ts +4 -4
- package/build-types/button/index.d.ts.map +1 -1
- package/build-types/button/stories/e2e/index.story.d.ts.map +1 -1
- package/build-types/button/types.d.ts +27 -10
- package/build-types/button/types.d.ts.map +1 -1
- package/build-types/combobox-control/index.d.ts.map +1 -1
- package/build-types/composite/current/index.d.ts.map +1 -1
- package/build-types/custom-select-control/stories/index.story.d.ts +15 -0
- package/build-types/custom-select-control/stories/index.story.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/custom-select.d.ts +2 -2
- package/build-types/custom-select-control-v2/custom-select.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/default-component/index.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/item.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/legacy-component/index.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/stories/default.story.d.ts +6 -3
- package/build-types/custom-select-control-v2/stories/default.story.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/styles.d.ts +18 -22
- package/build-types/custom-select-control-v2/styles.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/types.d.ts +13 -2
- package/build-types/custom-select-control-v2/types.d.ts.map +1 -1
- package/build-types/date-time/date-time/index.d.ts.map +1 -1
- package/build-types/date-time/index.d.ts +2 -1
- package/build-types/date-time/index.d.ts.map +1 -1
- package/build-types/date-time/stories/time-input.story.d.ts +12 -0
- package/build-types/date-time/stories/time-input.story.d.ts.map +1 -0
- package/build-types/date-time/time/index.d.ts +1 -1
- package/build-types/date-time/time/index.d.ts.map +1 -1
- package/build-types/date-time/time-input/index.d.ts +5 -0
- package/build-types/date-time/time-input/index.d.ts.map +1 -0
- package/build-types/date-time/time-input/test/index.d.ts +2 -0
- package/build-types/date-time/time-input/test/index.d.ts.map +1 -0
- package/build-types/date-time/types.d.ts +54 -0
- package/build-types/date-time/types.d.ts.map +1 -1
- package/build-types/date-time/utils.d.ts +40 -0
- package/build-types/date-time/utils.d.ts.map +1 -1
- package/build-types/disclosure/index.d.ts.map +1 -1
- package/build-types/divider/component.d.ts.map +1 -1
- package/build-types/divider/types.d.ts.map +1 -1
- package/build-types/drop-zone/index.d.ts +3 -0
- package/build-types/drop-zone/index.d.ts.map +1 -1
- package/build-types/dropdown-menu/index.d.ts.map +1 -1
- package/build-types/dropdown-menu-v2/index.d.ts.map +1 -1
- package/build-types/dropdown-menu-v2/styles.d.ts.map +1 -1
- package/build-types/dropdown-menu-v2/types.d.ts.map +1 -1
- package/build-types/font-size-picker/styles.d.ts +1 -1
- package/build-types/font-size-picker/utils.d.ts.map +1 -1
- package/build-types/form-token-field/token.d.ts.map +1 -1
- package/build-types/higher-order/with-spoken-messages/index.d.ts +1 -2
- package/build-types/higher-order/with-spoken-messages/index.d.ts.map +1 -1
- package/build-types/menu-items-choice/types.d.ts +1 -1
- package/build-types/menu-items-choice/types.d.ts.map +1 -1
- package/build-types/navigator/navigator-back-button/component.d.ts +1 -1
- package/build-types/navigator/navigator-back-button/hook.d.ts +1 -1
- package/build-types/navigator/navigator-button/component.d.ts +1 -1
- package/build-types/navigator/navigator-button/hook.d.ts +1 -1
- package/build-types/navigator/navigator-to-parent-button/component.d.ts +1 -1
- package/build-types/palette-edit/index.d.ts.map +1 -1
- package/build-types/palette-edit/types.d.ts +1 -3
- package/build-types/palette-edit/types.d.ts.map +1 -1
- package/build-types/popover/index.d.ts.map +1 -1
- package/build-types/popover/utils.d.ts.map +1 -1
- package/build-types/private-apis.d.ts.map +1 -1
- package/build-types/progress-bar/styles.d.ts.map +1 -1
- package/build-types/radio-group/context.d.ts.map +1 -1
- package/build-types/radio-group/index.d.ts.map +1 -1
- package/build-types/radio-group/radio.d.ts.map +1 -1
- package/build-types/range-control/index.d.ts.map +1 -1
- package/build-types/range-control/styles/range-control-styles.d.ts.map +1 -1
- package/build-types/resizable-box/resize-tooltip/utils.d.ts +2 -2
- package/build-types/resizable-box/resize-tooltip/utils.d.ts.map +1 -1
- package/build-types/select-control/index.d.ts.map +1 -1
- package/build-types/select-control/styles/select-control-styles.d.ts +5 -0
- package/build-types/select-control/styles/select-control-styles.d.ts.map +1 -1
- package/build-types/tab-panel/index.d.ts.map +1 -1
- package/build-types/tabs/index.d.ts.map +1 -1
- package/build-types/tabs/stories/index.story.d.ts.map +1 -1
- package/build-types/tabs/styles.d.ts.map +1 -1
- package/build-types/tabs/tablist.d.ts.map +1 -1
- package/build-types/tabs/types.d.ts.map +1 -1
- package/build-types/theme/stories/index.story.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control/as-radio-group.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts.map +1 -1
- package/build-types/toolbar/toolbar/toolbar-container.d.ts.map +1 -1
- package/build-types/toolbar/toolbar/types.d.ts +6 -0
- package/build-types/toolbar/toolbar/types.d.ts.map +1 -1
- package/build-types/toolbar/toolbar-button/index.d.ts +3 -96
- package/build-types/toolbar/toolbar-button/index.d.ts.map +1 -1
- package/build-types/toolbar/toolbar-button/types.d.ts +18 -0
- package/build-types/toolbar/toolbar-button/types.d.ts.map +1 -1
- package/build-types/toolbar/toolbar-context/index.d.ts.map +1 -1
- package/build-types/toolbar/toolbar-item/index.d.ts +1 -3
- package/build-types/toolbar/toolbar-item/index.d.ts.map +1 -1
- package/build-types/tooltip/index.d.ts.map +1 -1
- package/build-types/tooltip/types.d.ts +4 -0
- package/build-types/tooltip/types.d.ts.map +1 -1
- package/build-types/unit-control/index.d.ts.map +1 -1
- package/build-types/unit-control/styles/unit-control-styles.d.ts.map +1 -1
- package/build-types/utils/hooks/use-update-effect.d.ts +1 -1
- package/build-types/utils/hooks/use-update-effect.d.ts.map +1 -1
- package/package.json +19 -19
- package/src/animation/index.tsx +0 -1
- package/src/autocomplete/autocompleter-ui.tsx +1 -0
- package/src/autocomplete/index.tsx +0 -1
- package/src/base-control/index.tsx +16 -6
- package/src/base-control/stories/index.story.tsx +0 -1
- package/src/border-box-control/border-box-control-visualizer/component.tsx +0 -5
- package/src/button/README.md +13 -0
- package/src/button/index.tsx +6 -4
- package/src/button/stories/e2e/index.story.tsx +2 -1
- package/src/button/test/index.tsx +17 -2
- package/src/button/types.ts +27 -10
- package/src/combobox-control/index.tsx +2 -0
- package/src/composite/current/index.ts +0 -2
- package/src/custom-select-control/stories/index.story.tsx +32 -3
- package/src/custom-select-control/test/index.js +247 -28
- package/src/custom-select-control-v2/custom-select.tsx +58 -23
- package/src/custom-select-control-v2/default-component/index.tsx +0 -1
- package/src/custom-select-control-v2/item.tsx +5 -1
- package/src/custom-select-control-v2/legacy-component/index.tsx +45 -16
- package/src/custom-select-control-v2/legacy-component/test/index.tsx +261 -43
- package/src/custom-select-control-v2/styles.ts +156 -74
- package/src/custom-select-control-v2/test/index.tsx +35 -5
- package/src/custom-select-control-v2/types.ts +19 -6
- package/src/date-time/README.md +8 -0
- package/src/date-time/date-time/index.tsx +2 -1
- package/src/date-time/index.ts +2 -1
- package/src/date-time/stories/time-input.story.tsx +36 -0
- package/src/date-time/time/index.tsx +77 -194
- package/src/date-time/time/test/index.tsx +61 -0
- package/src/date-time/time-input/index.tsx +196 -0
- package/src/date-time/time-input/test/index.tsx +171 -0
- package/src/date-time/types.ts +63 -0
- package/src/date-time/utils.ts +69 -0
- package/src/dimension-control/test/__snapshots__/index.test.js.snap +116 -96
- package/src/disclosure/index.tsx +0 -1
- package/src/divider/component.tsx +0 -1
- package/src/divider/types.ts +0 -1
- package/src/drop-zone/index.tsx +17 -76
- package/src/drop-zone/style.scss +51 -16
- package/src/dropdown-menu/index.tsx +1 -0
- package/src/dropdown-menu-v2/index.tsx +0 -1
- package/src/dropdown-menu-v2/styles.ts +0 -1
- package/src/dropdown-menu-v2/types.ts +0 -1
- package/src/font-size-picker/font-size-picker-select.tsx +1 -1
- package/src/font-size-picker/index.tsx +1 -1
- package/src/font-size-picker/test/index.tsx +6 -6
- package/src/font-size-picker/utils.ts +0 -5
- package/src/form-token-field/token.tsx +2 -0
- package/src/higher-order/navigate-regions/style.scss +25 -13
- package/src/higher-order/with-spoken-messages/index.tsx +1 -2
- package/src/lock-unlock.js +1 -1
- package/src/menu-items-choice/types.ts +2 -1
- package/src/palette-edit/index.tsx +33 -45
- package/src/palette-edit/test/index.tsx +3 -4
- package/src/palette-edit/types.ts +1 -3
- package/src/popover/index.tsx +0 -2
- package/src/popover/utils.ts +0 -1
- package/src/private-apis.ts +2 -5
- package/src/progress-bar/styles.ts +18 -9
- package/src/radio-group/context.tsx +0 -1
- package/src/radio-group/index.tsx +0 -1
- package/src/radio-group/radio.tsx +0 -1
- package/src/range-control/index.tsx +2 -0
- package/src/range-control/styles/range-control-styles.ts +6 -2
- package/src/resizable-box/resize-tooltip/utils.ts +1 -1
- package/src/select-control/index.tsx +3 -4
- package/src/select-control/styles/select-control-styles.ts +17 -6
- package/src/tab-panel/index.tsx +0 -1
- package/src/tabs/index.tsx +0 -1
- package/src/tabs/stories/index.story.tsx +25 -18
- package/src/tabs/styles.ts +18 -14
- package/src/tabs/tablist.tsx +187 -43
- package/src/tabs/types.ts +0 -1
- package/src/theme/stories/index.story.tsx +2 -0
- package/src/toggle-group-control/toggle-group-control/as-radio-group.tsx +0 -1
- package/src/toggle-group-control/toggle-group-control/component.tsx +0 -2
- package/src/toggle-group-control/toggle-group-control-option-base/component.tsx +0 -2
- package/src/toolbar/toolbar/README.md +9 -0
- package/src/toolbar/toolbar/style.scss +7 -0
- package/src/toolbar/toolbar/toolbar-container.tsx +0 -1
- package/src/toolbar/toolbar/types.ts +6 -0
- package/src/toolbar/toolbar-button/index.tsx +30 -17
- package/src/toolbar/toolbar-button/types.ts +19 -0
- package/src/toolbar/toolbar-context/index.ts +0 -1
- package/src/toolbar/toolbar-item/index.tsx +1 -1
- package/src/tooltip/index.tsx +3 -2
- package/src/tooltip/test/index.tsx +18 -0
- package/src/tooltip/types.ts +4 -0
- package/src/unit-control/index.tsx +3 -2
- package/src/unit-control/styles/unit-control-styles.ts +10 -4
- package/src/utils/hooks/use-update-effect.js +8 -1
- package/tsconfig.tsbuildinfo +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["clsx","VisuallyHidden","Wrapper","StyledField","StyledLabel","StyledHelp","StyledVisualLabel","contextConnectWithoutRef","useContextSystem","jsx","_jsx","jsxs","_jsxs","useBaseControlProps","UnconnectedBaseControl","props","__nextHasNoMarginBottom","id","label","hideLabelFromVision","help","className","children","as","htmlFor","VisualLabel","undefined","BaseControl","Object","assign"],"sources":["@wordpress/components/src/base-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * Internal dependencies\n */\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { BaseControlProps, BaseControlVisualLabelProps } from './types';\nimport {\n\tWrapper,\n\tStyledField,\n\tStyledLabel,\n\tStyledHelp,\n\tStyledVisualLabel,\n} from './styles/base-control-styles';\nimport type { WordPressComponentProps } from '../context';\nimport { contextConnectWithoutRef, useContextSystem } from '../context';\n\nexport { useBaseControlProps } from './hooks';\n\n/**\n * `BaseControl` is a component used to generate labels and help text for components handling user inputs.\n *\n * ```jsx\n * import { BaseControl, useBaseControlProps } from '@wordpress/components';\n *\n * // Render a `BaseControl` for a textarea input\n * const MyCustomTextareaControl = ({ children, ...baseProps }) => (\n * \t// `useBaseControlProps` is a convenience hook to get the props for the `BaseControl`\n * \t// and the inner control itself. Namely, it takes care of generating a unique `id`,\n * \t// properly associating it with the `label` and `help` elements.\n * \tconst { baseControlProps, controlProps } = useBaseControlProps( baseProps );\n *\n * \treturn (\n * \t\t<BaseControl { ...baseControlProps } __nextHasNoMarginBottom={ true }>\n * \t\t\t<textarea { ...controlProps }>\n * \t\t\t { children }\n * \t\t\t</textarea>\n * \t\t</BaseControl>\n * \t);\n * );\n * ```\n */\nconst UnconnectedBaseControl = (\n\tprops: WordPressComponentProps< BaseControlProps, null >\n) => {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\tid,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tclassName,\n\t\tchildren,\n\t} = useContextSystem( props, 'BaseControl' );\n\n\treturn (\n\t\t<Wrapper className={ className }>\n\t\t\t<StyledField\n\t\t\t\tclassName=\"components-base-control__field\"\n\t\t\t\t// TODO: Official deprecation for this should start after all internal usages have been migrated\n\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t>\n\t\t\t\t{ label &&\n\t\t\t\t\tid &&\n\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t<VisuallyHidden as=\"label\" htmlFor={ id }>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<StyledLabel\n\t\t\t\t\t\t\tclassName=\"components-base-control__label\"\n\t\t\t\t\t\t\thtmlFor={ id }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</StyledLabel>\n\t\t\t\t\t) ) }\n\t\t\t\t{ label &&\n\t\t\t\t\t! id &&\n\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t<VisuallyHidden as=\"label\">{ label }</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<VisualLabel>{ label }</VisualLabel>\n\t\t\t\t\t) ) }\n\t\t\t\t{ children }\n\t\t\t</StyledField>\n\t\t\t{ !! help && (\n\t\t\t\t<StyledHelp\n\t\t\t\t\tid={ id ? id + '__help' : undefined }\n\t\t\t\t\tclassName=\"components-base-control__help\"\n\t\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\t>\n\t\t\t\t\t{ help }\n\t\t\t\t</StyledHelp>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n};\n\n/**\n * `BaseControl.VisualLabel` is used to render a purely visual label inside a `BaseControl` component.\n *\n * It should only be used in cases where the children being rendered inside `BaseControl` are already accessibly labeled,\n * e.g., a button, but we want an additional visual label for that section equivalent to the labels `BaseControl` would\n * otherwise use if the `label` prop was passed.\n *\n * @example\n * import { BaseControl } from '@wordpress/components';\n *\n * const MyBaseControl = () => (\n * \t<BaseControl help=\"This button is already accessibly labeled.\">\n * \t\t<BaseControl.VisualLabel>Author</BaseControl.VisualLabel>\n * \t\t<Button>Select an author</Button>\n * \t</BaseControl>\n * );\n */\
|
|
1
|
+
{"version":3,"names":["clsx","forwardRef","VisuallyHidden","Wrapper","StyledField","StyledLabel","StyledHelp","StyledVisualLabel","contextConnectWithoutRef","useContextSystem","jsx","_jsx","jsxs","_jsxs","useBaseControlProps","UnconnectedBaseControl","props","__nextHasNoMarginBottom","id","label","hideLabelFromVision","help","className","children","as","htmlFor","VisualLabel","undefined","UnforwardedVisualLabel","ref","restProps","BaseControl","Object","assign"],"sources":["@wordpress/components/src/base-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { BaseControlProps, BaseControlVisualLabelProps } from './types';\nimport {\n\tWrapper,\n\tStyledField,\n\tStyledLabel,\n\tStyledHelp,\n\tStyledVisualLabel,\n} from './styles/base-control-styles';\nimport type { WordPressComponentProps } from '../context';\nimport { contextConnectWithoutRef, useContextSystem } from '../context';\n\nexport { useBaseControlProps } from './hooks';\n\n/**\n * `BaseControl` is a component used to generate labels and help text for components handling user inputs.\n *\n * ```jsx\n * import { BaseControl, useBaseControlProps } from '@wordpress/components';\n *\n * // Render a `BaseControl` for a textarea input\n * const MyCustomTextareaControl = ({ children, ...baseProps }) => (\n * \t// `useBaseControlProps` is a convenience hook to get the props for the `BaseControl`\n * \t// and the inner control itself. Namely, it takes care of generating a unique `id`,\n * \t// properly associating it with the `label` and `help` elements.\n * \tconst { baseControlProps, controlProps } = useBaseControlProps( baseProps );\n *\n * \treturn (\n * \t\t<BaseControl { ...baseControlProps } __nextHasNoMarginBottom={ true }>\n * \t\t\t<textarea { ...controlProps }>\n * \t\t\t { children }\n * \t\t\t</textarea>\n * \t\t</BaseControl>\n * \t);\n * );\n * ```\n */\nconst UnconnectedBaseControl = (\n\tprops: WordPressComponentProps< BaseControlProps, null >\n) => {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\tid,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tclassName,\n\t\tchildren,\n\t} = useContextSystem( props, 'BaseControl' );\n\n\treturn (\n\t\t<Wrapper className={ className }>\n\t\t\t<StyledField\n\t\t\t\tclassName=\"components-base-control__field\"\n\t\t\t\t// TODO: Official deprecation for this should start after all internal usages have been migrated\n\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t>\n\t\t\t\t{ label &&\n\t\t\t\t\tid &&\n\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t<VisuallyHidden as=\"label\" htmlFor={ id }>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<StyledLabel\n\t\t\t\t\t\t\tclassName=\"components-base-control__label\"\n\t\t\t\t\t\t\thtmlFor={ id }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</StyledLabel>\n\t\t\t\t\t) ) }\n\t\t\t\t{ label &&\n\t\t\t\t\t! id &&\n\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t<VisuallyHidden as=\"label\">{ label }</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<VisualLabel>{ label }</VisualLabel>\n\t\t\t\t\t) ) }\n\t\t\t\t{ children }\n\t\t\t</StyledField>\n\t\t\t{ !! help && (\n\t\t\t\t<StyledHelp\n\t\t\t\t\tid={ id ? id + '__help' : undefined }\n\t\t\t\t\tclassName=\"components-base-control__help\"\n\t\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\t>\n\t\t\t\t\t{ help }\n\t\t\t\t</StyledHelp>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n};\n\n/**\n * `BaseControl.VisualLabel` is used to render a purely visual label inside a `BaseControl` component.\n *\n * It should only be used in cases where the children being rendered inside `BaseControl` are already accessibly labeled,\n * e.g., a button, but we want an additional visual label for that section equivalent to the labels `BaseControl` would\n * otherwise use if the `label` prop was passed.\n *\n * @example\n * import { BaseControl } from '@wordpress/components';\n *\n * const MyBaseControl = () => (\n * \t<BaseControl help=\"This button is already accessibly labeled.\">\n * \t\t<BaseControl.VisualLabel>Author</BaseControl.VisualLabel>\n * \t\t<Button>Select an author</Button>\n * \t</BaseControl>\n * );\n */\nconst UnforwardedVisualLabel = (\n\tprops: WordPressComponentProps< BaseControlVisualLabelProps, 'span' >,\n\tref: ForwardedRef< any >\n) => {\n\tconst { className, children, ...restProps } = props;\n\n\treturn (\n\t\t<StyledVisualLabel\n\t\t\tref={ ref }\n\t\t\t{ ...restProps }\n\t\t\tclassName={ clsx( 'components-base-control__label', className ) }\n\t\t>\n\t\t\t{ children }\n\t\t</StyledVisualLabel>\n\t);\n};\n\nexport const VisualLabel = forwardRef( UnforwardedVisualLabel );\n\nexport const BaseControl = Object.assign(\n\tcontextConnectWithoutRef( UnconnectedBaseControl, 'BaseControl' ),\n\t{ VisualLabel }\n);\n\nexport default BaseControl;\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;AAGvB;AACA;AACA;AACA,SAASC,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,SAASC,cAAc,QAAQ,oBAAoB;AAEnD,SACCC,OAAO,EACPC,WAAW,EACXC,WAAW,EACXC,UAAU,EACVC,iBAAiB,QACX,8BAA8B;AAErC,SAASC,wBAAwB,EAAEC,gBAAgB,QAAQ,YAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAExE,SAASC,mBAAmB,QAAQ,SAAS;;AAE7C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,sBAAsB,GAC3BC,KAAwD,IACpD;EACJ,MAAM;IACLC,uBAAuB,GAAG,KAAK;IAC/BC,EAAE;IACFC,KAAK;IACLC,mBAAmB,GAAG,KAAK;IAC3BC,IAAI;IACJC,SAAS;IACTC;EACD,CAAC,GAAGd,gBAAgB,CAAEO,KAAK,EAAE,aAAc,CAAC;EAE5C,oBACCH,KAAA,CAACV,OAAO;IAACmB,SAAS,EAAGA,SAAW;IAAAC,QAAA,gBAC/BV,KAAA,CAACT,WAAW;MACXkB,SAAS,EAAC;MACV;MAAA;MACAL,uBAAuB,EAAGA,uBAAyB;MAAAM,QAAA,GAEjDJ,KAAK,IACND,EAAE,KACAE,mBAAmB,gBACpBT,IAAA,CAACT,cAAc;QAACsB,EAAE,EAAC,OAAO;QAACC,OAAO,EAAGP,EAAI;QAAAK,QAAA,EACtCJ;MAAK,CACQ,CAAC,gBAEjBR,IAAA,CAACN,WAAW;QACXiB,SAAS,EAAC,gCAAgC;QAC1CG,OAAO,EAAGP,EAAI;QAAAK,QAAA,EAEZJ;MAAK,CACK,CACb,CAAE,EACFA,KAAK,IACN,CAAED,EAAE,KACFE,mBAAmB,gBACpBT,IAAA,CAACT,cAAc;QAACsB,EAAE,EAAC,OAAO;QAAAD,QAAA,EAAGJ;MAAK,CAAkB,CAAC,gBAErDR,IAAA,CAACe,WAAW;QAAAH,QAAA,EAAGJ;MAAK,CAAe,CACnC,CAAE,EACFI,QAAQ;IAAA,CACE,CAAC,EACZ,CAAC,CAAEF,IAAI,iBACRV,IAAA,CAACL,UAAU;MACVY,EAAE,EAAGA,EAAE,GAAGA,EAAE,GAAG,QAAQ,GAAGS,SAAW;MACrCL,SAAS,EAAC,+BAA+B;MACzCL,uBAAuB,EAAGA,uBAAyB;MAAAM,QAAA,EAEjDF;IAAI,CACK,CACZ;EAAA,CACO,CAAC;AAEZ,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMO,sBAAsB,GAAGA,CAC9BZ,KAAqE,EACrEa,GAAwB,KACpB;EACJ,MAAM;IAAEP,SAAS;IAAEC,QAAQ;IAAE,GAAGO;EAAU,CAAC,GAAGd,KAAK;EAEnD,oBACCL,IAAA,CAACJ,iBAAiB;IACjBsB,GAAG,EAAGA,GAAK;IAAA,GACNC,SAAS;IACdR,SAAS,EAAGtB,IAAI,CAAE,gCAAgC,EAAEsB,SAAU,CAAG;IAAAC,QAAA,EAE/DA;EAAQ,CACQ,CAAC;AAEtB,CAAC;AAED,OAAO,MAAMG,WAAW,GAAGzB,UAAU,CAAE2B,sBAAuB,CAAC;AAE/D,OAAO,MAAMG,WAAW,GAAGC,MAAM,CAACC,MAAM,CACvCzB,wBAAwB,CAAEO,sBAAsB,EAAE,aAAc,CAAC,EACjE;EAAEW;AAAY,CACf,CAAC;AAED,eAAeK,WAAW","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["View","contextConnect","useBorderBoxControlVisualizer","jsx","_jsx","BorderBoxControlVisualizer","props","forwardedRef","value","otherProps","ref","ConnectedBorderBoxControlVisualizer"],"sources":["@wordpress/components/src/border-box-control/border-box-control-visualizer/component.tsx"],"sourcesContent":["/**\n *
|
|
1
|
+
{"version":3,"names":["View","contextConnect","useBorderBoxControlVisualizer","jsx","_jsx","BorderBoxControlVisualizer","props","forwardedRef","value","otherProps","ref","ConnectedBorderBoxControlVisualizer"],"sources":["@wordpress/components/src/border-box-control/border-box-control-visualizer/component.tsx"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { View } from '../../view';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderBoxControlVisualizer } from './hook';\n\nimport type { VisualizerProps } from '../types';\n\nconst BorderBoxControlVisualizer = (\n\tprops: WordPressComponentProps< VisualizerProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst { value, ...otherProps } = useBorderBoxControlVisualizer( props );\n\n\treturn <View { ...otherProps } ref={ forwardedRef } />;\n};\n\nconst ConnectedBorderBoxControlVisualizer = contextConnect(\n\tBorderBoxControlVisualizer,\n\t'BorderBoxControlVisualizer'\n);\nexport default ConnectedBorderBoxControlVisualizer;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,6BAA6B,QAAQ,QAAQ;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIvD,MAAMC,0BAA0B,GAAGA,CAClCC,KAAwD,EACxDC,YAAuC,KACnC;EACJ,MAAM;IAAEC,KAAK;IAAE,GAAGC;EAAW,CAAC,GAAGP,6BAA6B,CAAEI,KAAM,CAAC;EAEvE,oBAAOF,IAAA,CAACJ,IAAI;IAAA,GAAMS,UAAU;IAAGC,GAAG,EAAGH;EAAc,CAAE,CAAC;AACvD,CAAC;AAED,MAAMI,mCAAmC,GAAGV,cAAc,CACzDI,0BAA0B,EAC1B,4BACD,CAAC;AACD,eAAeM,mCAAmC","ignoreList":[]}
|
|
@@ -21,6 +21,7 @@ import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
|
21
21
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
22
22
|
const disabledEventsOnDisabledButton = ['onMouseDown', 'onClick'];
|
|
23
23
|
function useDeprecatedProps({
|
|
24
|
+
__experimentalIsFocusable,
|
|
24
25
|
isDefault,
|
|
25
26
|
isPrimary,
|
|
26
27
|
isSecondary,
|
|
@@ -35,6 +36,7 @@ function useDeprecatedProps({
|
|
|
35
36
|
let computedSize = size;
|
|
36
37
|
let computedVariant = variant;
|
|
37
38
|
const newProps = {
|
|
39
|
+
accessibleWhenDisabled: __experimentalIsFocusable,
|
|
38
40
|
// @todo Mark `isPressed` as deprecated
|
|
39
41
|
'aria-pressed': isPressed
|
|
40
42
|
};
|
|
@@ -76,6 +78,7 @@ function useDeprecatedProps({
|
|
|
76
78
|
export function UnforwardedButton(props, ref) {
|
|
77
79
|
const {
|
|
78
80
|
__next40pxDefaultSize,
|
|
81
|
+
accessibleWhenDisabled,
|
|
79
82
|
isBusy,
|
|
80
83
|
isDestructive,
|
|
81
84
|
className,
|
|
@@ -91,7 +94,6 @@ export function UnforwardedButton(props, ref) {
|
|
|
91
94
|
size = 'default',
|
|
92
95
|
text,
|
|
93
96
|
variant,
|
|
94
|
-
__experimentalIsFocusable: isFocusable,
|
|
95
97
|
describedBy,
|
|
96
98
|
...buttonOrAnchorProps
|
|
97
99
|
} = useDeprecatedProps(props);
|
|
@@ -127,7 +129,7 @@ export function UnforwardedButton(props, ref) {
|
|
|
127
129
|
'has-text': !!icon && (hasChildren || text),
|
|
128
130
|
'has-icon': !!icon
|
|
129
131
|
});
|
|
130
|
-
const trulyDisabled = disabled && !
|
|
132
|
+
const trulyDisabled = disabled && !accessibleWhenDisabled;
|
|
131
133
|
const Tag = href !== undefined && !trulyDisabled ? 'a' : 'button';
|
|
132
134
|
const buttonProps = Tag === 'button' ? {
|
|
133
135
|
type: 'button',
|
|
@@ -141,7 +143,7 @@ export function UnforwardedButton(props, ref) {
|
|
|
141
143
|
target
|
|
142
144
|
} : {};
|
|
143
145
|
const disableEventProps = {};
|
|
144
|
-
if (disabled &&
|
|
146
|
+
if (disabled && accessibleWhenDisabled) {
|
|
145
147
|
// In this case, the button will be disabled, but still focusable and
|
|
146
148
|
// perceivable by screen reader users.
|
|
147
149
|
buttonProps['aria-disabled'] = true;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["clsx","deprecated","forwardRef","useInstanceId","Tooltip","Icon","VisuallyHidden","positionToPlacement","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","disabledEventsOnDisabledButton","useDeprecatedProps","isDefault","isPrimary","isSecondary","isTertiary","isLink","isPressed","isSmall","size","variant","otherProps","computedSize","computedVariant","newProps","_computedSize","_computedVariant","_computedVariant2","_computedVariant3","_computedVariant4","since","alternative","_computedVariant5","UnforwardedButton","props","ref","__next40pxDefaultSize","isBusy","isDestructive","className","disabled","icon","iconPosition","iconSize","showTooltip","tooltipPosition","shortcut","label","children","text","__experimentalIsFocusable","isFocusable","describedBy","buttonOrAnchorProps","href","target","ariaChecked","ariaPressed","ariaSelected","additionalProps","undefined","instanceId","Button","hasChildren","Array","isArray","truthyAriaPressedValues","classes","includes","trulyDisabled","Tag","buttonProps","type","anchorProps","disableEventProps","disabledEvent","event","stopPropagation","preventDefault","shouldShowTooltip","length","descriptionId","describedById","commonProps","elementChildren","element","tooltipProps","placement","id"],"sources":["@wordpress/components/src/button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type {\n\tComponentPropsWithoutRef,\n\tForwardedRef,\n\tHTMLAttributes,\n\tMouseEvent,\n\tReactElement,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport Icon from '../icon';\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { ButtonProps, DeprecatedButtonProps } from './types';\nimport { positionToPlacement } from '../popover/utils';\n\nconst disabledEventsOnDisabledButton = [ 'onMouseDown', 'onClick' ] as const;\n\nfunction useDeprecatedProps( {\n\tisDefault,\n\tisPrimary,\n\tisSecondary,\n\tisTertiary,\n\tisLink,\n\tisPressed,\n\tisSmall,\n\tsize,\n\tvariant,\n\t...otherProps\n}: ButtonProps & DeprecatedButtonProps ): ButtonProps {\n\tlet computedSize = size;\n\tlet computedVariant = variant;\n\n\tconst newProps: { 'aria-pressed'?: boolean } = {\n\t\t// @todo Mark `isPressed` as deprecated\n\t\t'aria-pressed': isPressed,\n\t};\n\n\tif ( isSmall ) {\n\t\tcomputedSize ??= 'small';\n\t}\n\n\tif ( isPrimary ) {\n\t\tcomputedVariant ??= 'primary';\n\t}\n\n\tif ( isTertiary ) {\n\t\tcomputedVariant ??= 'tertiary';\n\t}\n\n\tif ( isSecondary ) {\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isDefault ) {\n\t\tdeprecated( 'wp.components.Button `isDefault` prop', {\n\t\t\tsince: '5.4',\n\t\t\talternative: 'variant=\"secondary\"',\n\t\t} );\n\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isLink ) {\n\t\tcomputedVariant ??= 'link';\n\t}\n\n\treturn {\n\t\t...newProps,\n\t\t...otherProps,\n\t\tsize: computedSize,\n\t\tvariant: computedVariant,\n\t};\n}\n\nexport function UnforwardedButton(\n\tprops: ButtonProps & DeprecatedButtonProps,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\tisBusy,\n\t\tisDestructive,\n\t\tclassName,\n\t\tdisabled,\n\t\ticon,\n\t\ticonPosition = 'left',\n\t\ticonSize,\n\t\tshowTooltip,\n\t\ttooltipPosition,\n\t\tshortcut,\n\t\tlabel,\n\t\tchildren,\n\t\tsize = 'default',\n\t\ttext,\n\t\tvariant,\n\t\t__experimentalIsFocusable: isFocusable,\n\t\tdescribedBy,\n\t\t...buttonOrAnchorProps\n\t} = useDeprecatedProps( props );\n\n\tconst {\n\t\thref,\n\t\ttarget,\n\t\t'aria-checked': ariaChecked,\n\t\t'aria-pressed': ariaPressed,\n\t\t'aria-selected': ariaSelected,\n\t\t...additionalProps\n\t} = 'href' in buttonOrAnchorProps\n\t\t? buttonOrAnchorProps\n\t\t: { href: undefined, target: undefined, ...buttonOrAnchorProps };\n\n\tconst instanceId = useInstanceId(\n\t\tButton,\n\t\t'components-button__description'\n\t);\n\n\tconst hasChildren =\n\t\t( 'string' === typeof children && !! children ) ||\n\t\t( Array.isArray( children ) &&\n\t\t\tchildren?.[ 0 ] &&\n\t\t\tchildren[ 0 ] !== null &&\n\t\t\t// Tooltip should not considered as a child\n\t\t\tchildren?.[ 0 ]?.props?.className !== 'components-tooltip' );\n\n\tconst truthyAriaPressedValues: ( typeof ariaPressed )[] = [\n\t\ttrue,\n\t\t'true',\n\t\t'mixed',\n\t];\n\n\tconst classes = clsx( 'components-button', className, {\n\t\t'is-next-40px-default-size': __next40pxDefaultSize,\n\t\t'is-secondary': variant === 'secondary',\n\t\t'is-primary': variant === 'primary',\n\t\t'is-small': size === 'small',\n\t\t'is-compact': size === 'compact',\n\t\t'is-tertiary': variant === 'tertiary',\n\n\t\t'is-pressed': truthyAriaPressedValues.includes( ariaPressed ),\n\t\t'is-pressed-mixed': ariaPressed === 'mixed',\n\n\t\t'is-busy': isBusy,\n\t\t'is-link': variant === 'link',\n\t\t'is-destructive': isDestructive,\n\t\t'has-text': !! icon && ( hasChildren || text ),\n\t\t'has-icon': !! icon,\n\t} );\n\n\tconst trulyDisabled = disabled && ! isFocusable;\n\tconst Tag = href !== undefined && ! trulyDisabled ? 'a' : 'button';\n\tconst buttonProps: ComponentPropsWithoutRef< 'button' > =\n\t\tTag === 'button'\n\t\t\t? {\n\t\t\t\t\ttype: 'button',\n\t\t\t\t\tdisabled: trulyDisabled,\n\t\t\t\t\t'aria-checked': ariaChecked,\n\t\t\t\t\t'aria-pressed': ariaPressed,\n\t\t\t\t\t'aria-selected': ariaSelected,\n\t\t\t }\n\t\t\t: {};\n\tconst anchorProps: ComponentPropsWithoutRef< 'a' > =\n\t\tTag === 'a' ? { href, target } : {};\n\n\tconst disableEventProps: {\n\t\t[ key: string ]: ( event: MouseEvent ) => void;\n\t} = {};\n\tif ( disabled && isFocusable ) {\n\t\t// In this case, the button will be disabled, but still focusable and\n\t\t// perceivable by screen reader users.\n\t\tbuttonProps[ 'aria-disabled' ] = true;\n\t\tanchorProps[ 'aria-disabled' ] = true;\n\t\tfor ( const disabledEvent of disabledEventsOnDisabledButton ) {\n\t\t\tdisableEventProps[ disabledEvent ] = ( event: MouseEvent ) => {\n\t\t\t\tif ( event ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t}\n\n\t// Should show the tooltip if...\n\tconst shouldShowTooltip =\n\t\t! trulyDisabled &&\n\t\t// An explicit tooltip is passed or...\n\t\t( ( showTooltip && !! label ) ||\n\t\t\t// There's a shortcut or...\n\t\t\t!! shortcut ||\n\t\t\t// There's a label and...\n\t\t\t( !! label &&\n\t\t\t\t// The children are empty and...\n\t\t\t\t! ( children as string | ReactElement[] )?.length &&\n\t\t\t\t// The tooltip is not explicitly disabled.\n\t\t\t\tfalse !== showTooltip ) );\n\n\tconst descriptionId = describedBy ? instanceId : undefined;\n\n\tconst describedById =\n\t\tadditionalProps[ 'aria-describedby' ] || descriptionId;\n\n\tconst commonProps = {\n\t\tclassName: classes,\n\t\t'aria-label': additionalProps[ 'aria-label' ] || label,\n\t\t'aria-describedby': describedById,\n\t\tref,\n\t};\n\n\tconst elementChildren = (\n\t\t<>\n\t\t\t{ icon && iconPosition === 'left' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ text && <>{ text }</> }\n\t\t\t{ children }\n\t\t\t{ icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t</>\n\t);\n\n\tconst element =\n\t\tTag === 'a' ? (\n\t\t\t<a\n\t\t\t\t{ ...anchorProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLAnchorElement > ) }\n\t\t\t\t{ ...disableEventProps }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</a>\n\t\t) : (\n\t\t\t<button\n\t\t\t\t{ ...buttonProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLButtonElement > ) }\n\t\t\t\t{ ...disableEventProps }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</button>\n\t\t);\n\n\t// In order to avoid some React reconciliation issues, we are always rendering\n\t// the `Tooltip` component even when `shouldShowTooltip` is `false`.\n\t// In order to make sure that the tooltip doesn't show when it shouldn't,\n\t// we don't pass the props to the `Tooltip` component.\n\tconst tooltipProps = shouldShowTooltip\n\t\t? {\n\t\t\t\ttext:\n\t\t\t\t\t( children as string | ReactElement[] )?.length &&\n\t\t\t\t\tdescribedBy\n\t\t\t\t\t\t? describedBy\n\t\t\t\t\t\t: label,\n\t\t\t\tshortcut,\n\t\t\t\tplacement:\n\t\t\t\t\ttooltipPosition &&\n\t\t\t\t\t// Convert legacy `position` values to be used with the new `placement` prop\n\t\t\t\t\tpositionToPlacement( tooltipPosition ),\n\t\t }\n\t\t: {};\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip { ...tooltipProps }>{ element }</Tooltip>\n\t\t\t{ describedBy && (\n\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * Lets users take actions and make choices with a single click or tap.\n *\n * ```jsx\n * import { Button } from '@wordpress/components';\n * const Mybutton = () => (\n * <Button\n * variant=\"primary\"\n * onClick={ handleClick }\n * >\n * Click here\n * </Button>\n * );\n * ```\n */\nexport const Button = forwardRef( UnforwardedButton );\nexport default Button;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["clsx","deprecated","forwardRef","useInstanceId","Tooltip","Icon","VisuallyHidden","positionToPlacement","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","disabledEventsOnDisabledButton","useDeprecatedProps","__experimentalIsFocusable","isDefault","isPrimary","isSecondary","isTertiary","isLink","isPressed","isSmall","size","variant","otherProps","computedSize","computedVariant","newProps","accessibleWhenDisabled","_computedSize","_computedVariant","_computedVariant2","_computedVariant3","_computedVariant4","since","alternative","_computedVariant5","UnforwardedButton","props","ref","__next40pxDefaultSize","isBusy","isDestructive","className","disabled","icon","iconPosition","iconSize","showTooltip","tooltipPosition","shortcut","label","children","text","describedBy","buttonOrAnchorProps","href","target","ariaChecked","ariaPressed","ariaSelected","additionalProps","undefined","instanceId","Button","hasChildren","Array","isArray","truthyAriaPressedValues","classes","includes","trulyDisabled","Tag","buttonProps","type","anchorProps","disableEventProps","disabledEvent","event","stopPropagation","preventDefault","shouldShowTooltip","length","descriptionId","describedById","commonProps","elementChildren","element","tooltipProps","placement","id"],"sources":["@wordpress/components/src/button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type {\n\tComponentPropsWithoutRef,\n\tForwardedRef,\n\tHTMLAttributes,\n\tMouseEvent,\n\tReactElement,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport Icon from '../icon';\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { ButtonProps, DeprecatedButtonProps } from './types';\nimport { positionToPlacement } from '../popover/utils';\n\nconst disabledEventsOnDisabledButton = [ 'onMouseDown', 'onClick' ] as const;\n\nfunction useDeprecatedProps( {\n\t__experimentalIsFocusable,\n\tisDefault,\n\tisPrimary,\n\tisSecondary,\n\tisTertiary,\n\tisLink,\n\tisPressed,\n\tisSmall,\n\tsize,\n\tvariant,\n\t...otherProps\n}: ButtonProps & DeprecatedButtonProps ): ButtonProps {\n\tlet computedSize = size;\n\tlet computedVariant = variant;\n\n\tconst newProps = {\n\t\taccessibleWhenDisabled: __experimentalIsFocusable,\n\t\t// @todo Mark `isPressed` as deprecated\n\t\t'aria-pressed': isPressed,\n\t};\n\n\tif ( isSmall ) {\n\t\tcomputedSize ??= 'small';\n\t}\n\n\tif ( isPrimary ) {\n\t\tcomputedVariant ??= 'primary';\n\t}\n\n\tif ( isTertiary ) {\n\t\tcomputedVariant ??= 'tertiary';\n\t}\n\n\tif ( isSecondary ) {\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isDefault ) {\n\t\tdeprecated( 'wp.components.Button `isDefault` prop', {\n\t\t\tsince: '5.4',\n\t\t\talternative: 'variant=\"secondary\"',\n\t\t} );\n\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isLink ) {\n\t\tcomputedVariant ??= 'link';\n\t}\n\n\treturn {\n\t\t...newProps,\n\t\t...otherProps,\n\t\tsize: computedSize,\n\t\tvariant: computedVariant,\n\t};\n}\n\nexport function UnforwardedButton(\n\tprops: ButtonProps & DeprecatedButtonProps,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\taccessibleWhenDisabled,\n\t\tisBusy,\n\t\tisDestructive,\n\t\tclassName,\n\t\tdisabled,\n\t\ticon,\n\t\ticonPosition = 'left',\n\t\ticonSize,\n\t\tshowTooltip,\n\t\ttooltipPosition,\n\t\tshortcut,\n\t\tlabel,\n\t\tchildren,\n\t\tsize = 'default',\n\t\ttext,\n\t\tvariant,\n\t\tdescribedBy,\n\t\t...buttonOrAnchorProps\n\t} = useDeprecatedProps( props );\n\n\tconst {\n\t\thref,\n\t\ttarget,\n\t\t'aria-checked': ariaChecked,\n\t\t'aria-pressed': ariaPressed,\n\t\t'aria-selected': ariaSelected,\n\t\t...additionalProps\n\t} = 'href' in buttonOrAnchorProps\n\t\t? buttonOrAnchorProps\n\t\t: { href: undefined, target: undefined, ...buttonOrAnchorProps };\n\n\tconst instanceId = useInstanceId(\n\t\tButton,\n\t\t'components-button__description'\n\t);\n\n\tconst hasChildren =\n\t\t( 'string' === typeof children && !! children ) ||\n\t\t( Array.isArray( children ) &&\n\t\t\tchildren?.[ 0 ] &&\n\t\t\tchildren[ 0 ] !== null &&\n\t\t\t// Tooltip should not considered as a child\n\t\t\tchildren?.[ 0 ]?.props?.className !== 'components-tooltip' );\n\n\tconst truthyAriaPressedValues: ( typeof ariaPressed )[] = [\n\t\ttrue,\n\t\t'true',\n\t\t'mixed',\n\t];\n\n\tconst classes = clsx( 'components-button', className, {\n\t\t'is-next-40px-default-size': __next40pxDefaultSize,\n\t\t'is-secondary': variant === 'secondary',\n\t\t'is-primary': variant === 'primary',\n\t\t'is-small': size === 'small',\n\t\t'is-compact': size === 'compact',\n\t\t'is-tertiary': variant === 'tertiary',\n\n\t\t'is-pressed': truthyAriaPressedValues.includes( ariaPressed ),\n\t\t'is-pressed-mixed': ariaPressed === 'mixed',\n\n\t\t'is-busy': isBusy,\n\t\t'is-link': variant === 'link',\n\t\t'is-destructive': isDestructive,\n\t\t'has-text': !! icon && ( hasChildren || text ),\n\t\t'has-icon': !! icon,\n\t} );\n\n\tconst trulyDisabled = disabled && ! accessibleWhenDisabled;\n\tconst Tag = href !== undefined && ! trulyDisabled ? 'a' : 'button';\n\tconst buttonProps: ComponentPropsWithoutRef< 'button' > =\n\t\tTag === 'button'\n\t\t\t? {\n\t\t\t\t\ttype: 'button',\n\t\t\t\t\tdisabled: trulyDisabled,\n\t\t\t\t\t'aria-checked': ariaChecked,\n\t\t\t\t\t'aria-pressed': ariaPressed,\n\t\t\t\t\t'aria-selected': ariaSelected,\n\t\t\t }\n\t\t\t: {};\n\tconst anchorProps: ComponentPropsWithoutRef< 'a' > =\n\t\tTag === 'a' ? { href, target } : {};\n\n\tconst disableEventProps: {\n\t\t[ key: string ]: ( event: MouseEvent ) => void;\n\t} = {};\n\tif ( disabled && accessibleWhenDisabled ) {\n\t\t// In this case, the button will be disabled, but still focusable and\n\t\t// perceivable by screen reader users.\n\t\tbuttonProps[ 'aria-disabled' ] = true;\n\t\tanchorProps[ 'aria-disabled' ] = true;\n\t\tfor ( const disabledEvent of disabledEventsOnDisabledButton ) {\n\t\t\tdisableEventProps[ disabledEvent ] = ( event: MouseEvent ) => {\n\t\t\t\tif ( event ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t}\n\n\t// Should show the tooltip if...\n\tconst shouldShowTooltip =\n\t\t! trulyDisabled &&\n\t\t// An explicit tooltip is passed or...\n\t\t( ( showTooltip && !! label ) ||\n\t\t\t// There's a shortcut or...\n\t\t\t!! shortcut ||\n\t\t\t// There's a label and...\n\t\t\t( !! label &&\n\t\t\t\t// The children are empty and...\n\t\t\t\t! ( children as string | ReactElement[] )?.length &&\n\t\t\t\t// The tooltip is not explicitly disabled.\n\t\t\t\tfalse !== showTooltip ) );\n\n\tconst descriptionId = describedBy ? instanceId : undefined;\n\n\tconst describedById =\n\t\tadditionalProps[ 'aria-describedby' ] || descriptionId;\n\n\tconst commonProps = {\n\t\tclassName: classes,\n\t\t'aria-label': additionalProps[ 'aria-label' ] || label,\n\t\t'aria-describedby': describedById,\n\t\tref,\n\t};\n\n\tconst elementChildren = (\n\t\t<>\n\t\t\t{ icon && iconPosition === 'left' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ text && <>{ text }</> }\n\t\t\t{ children }\n\t\t\t{ icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t</>\n\t);\n\n\tconst element =\n\t\tTag === 'a' ? (\n\t\t\t<a\n\t\t\t\t{ ...anchorProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLAnchorElement > ) }\n\t\t\t\t{ ...disableEventProps }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</a>\n\t\t) : (\n\t\t\t<button\n\t\t\t\t{ ...buttonProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLButtonElement > ) }\n\t\t\t\t{ ...disableEventProps }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</button>\n\t\t);\n\n\t// In order to avoid some React reconciliation issues, we are always rendering\n\t// the `Tooltip` component even when `shouldShowTooltip` is `false`.\n\t// In order to make sure that the tooltip doesn't show when it shouldn't,\n\t// we don't pass the props to the `Tooltip` component.\n\tconst tooltipProps = shouldShowTooltip\n\t\t? {\n\t\t\t\ttext:\n\t\t\t\t\t( children as string | ReactElement[] )?.length &&\n\t\t\t\t\tdescribedBy\n\t\t\t\t\t\t? describedBy\n\t\t\t\t\t\t: label,\n\t\t\t\tshortcut,\n\t\t\t\tplacement:\n\t\t\t\t\ttooltipPosition &&\n\t\t\t\t\t// Convert legacy `position` values to be used with the new `placement` prop\n\t\t\t\t\tpositionToPlacement( tooltipPosition ),\n\t\t }\n\t\t: {};\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip { ...tooltipProps }>{ element }</Tooltip>\n\t\t\t{ describedBy && (\n\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * Lets users take actions and make choices with a single click or tap.\n *\n * ```jsx\n * import { Button } from '@wordpress/components';\n * const Mybutton = () => (\n * <Button\n * variant=\"primary\"\n * onClick={ handleClick }\n * >\n * Click here\n * </Button>\n * );\n * ```\n */\nexport const Button = forwardRef( UnforwardedButton );\nexport default Button;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["@wordpress/components/src/button/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { Props as IconProps } from '../icon';\nimport type { PopoverProps } from '../popover/types';\nimport type { WordPressComponentProps } from '../context/wordpress-component';\n\nexport type ButtonProps =\n\t| WordPressComponentProps< ButtonAsButtonProps, 'button', false >\n\t| WordPressComponentProps< ButtonAsAnchorProps, 'a', false >;\n\nexport type ButtonAsButtonProps = BaseButtonProps & _ButtonProps;\nexport type ButtonAsAnchorProps = BaseButtonProps & AnchorProps;\n\ntype BaseButtonProps = {\n\t/**\n\t * Start opting into the larger default height that will become the\n\t * default size in a future version.\n\t *\n\t * @default false\n\t */\n\t__next40pxDefaultSize?: boolean;\n\t/**\n\t * The button's children.\n\t */\n\tchildren?: ReactNode;\n\t/**\n\t * An accessible description for the button.\n\t */\n\tdescribedBy?: string;\n\t/**\n\t * If provided, renders an Icon component inside the button.\n\t */\n\ticon?: IconProps[ 'icon' ];\n\t/**\n\t * If provided with `icon`, sets the position of icon relative to the `text`.\n\t *\n\t * @default 'left'\n\t */\n\ticonPosition?: 'left' | 'right';\n\t/**\n\t * If provided with `icon`, sets the icon size.\n\t * Please refer to the Icon component for more details regarding\n\t * the default value of its `size` prop.\n\t */\n\ticonSize?: IconProps[ 'size' ];\n\t/**\n\t * Indicates activity while a action is being performed.\n\t */\n\tisBusy?: boolean;\n\t/**\n\t * Renders a red text-based button style to indicate destructive behavior.\n\t */\n\tisDestructive?: boolean;\n\t/**\n\t * Renders a pressed button style.\n\t */\n\tisPressed?: boolean;\n\t/**\n\t * Sets the `aria-label` of the component, if none is provided.\n\t * Sets the Tooltip content if `showTooltip` is provided.\n\t */\n\tlabel?: string;\n\t/**\n\t * If provided with `showTooltip`, appends the Shortcut label to the tooltip content.\n\t * If an object is provided, it should contain `display` and `ariaLabel` keys.\n\t */\n\tshortcut?: string | { display: string; ariaLabel: string };\n\t/**\n\t * If provided, renders a Tooltip component for the button.\n\t */\n\tshowTooltip?: boolean;\n\t/**\n\t * The size of the button.\n\t *\n\t * - `'default'`: For normal text-label buttons, unless it is a toggle button.\n\t * - `'compact'`: For toggle buttons, icon buttons, and buttons when used in context of either.\n\t * - `'small'`: For icon buttons associated with more advanced or auxiliary features.\n\t *\n\t * If the deprecated `isSmall` prop is also defined, this prop will take precedence.\n\t *\n\t * @default 'default'\n\t */\n\tsize?: 'default' | 'compact' | 'small';\n\t/**\n\t * If provided, displays the given text inside the button. If the button contains children elements, the text is displayed before them.\n\t */\n\ttext?: string;\n\t/**\n\t * If provided with `showTooltip`, sets the position of the tooltip.\n\t * Please refer to the Tooltip component for more details regarding the defaults.\n\t */\n\ttooltipPosition?: PopoverProps[ 'position' ];\n\t/**\n\t * Specifies the button's style.\n\t * The accepted values are:\n\t * 'primary' (the primary button styles)\n\t * 'secondary' (the default button styles)\n\t * 'tertiary' (the text-based button styles)\n\t * 'link' (the link button styles)\n\t */\n\tvariant?: 'primary' | 'secondary' | 'tertiary' | 'link';\n
|
|
1
|
+
{"version":3,"names":[],"sources":["@wordpress/components/src/button/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { Props as IconProps } from '../icon';\nimport type { PopoverProps } from '../popover/types';\nimport type { WordPressComponentProps } from '../context/wordpress-component';\n\nexport type ButtonProps =\n\t| WordPressComponentProps< ButtonAsButtonProps, 'button', false >\n\t| WordPressComponentProps< ButtonAsAnchorProps, 'a', false >;\n\nexport type ButtonAsButtonProps = BaseButtonProps & _ButtonProps;\nexport type ButtonAsAnchorProps = BaseButtonProps & AnchorProps;\n\ntype BaseButtonProps = {\n\t/**\n\t * Start opting into the larger default height that will become the\n\t * default size in a future version.\n\t *\n\t * @default false\n\t */\n\t__next40pxDefaultSize?: boolean;\n\t/**\n\t * Whether to keep the button focusable when disabled.\n\t *\n\t * In most cases, it is recommended to set this to `true`. Disabling a control without maintaining focusability\n\t * can cause accessibility issues, by hiding their presence from screen reader users,\n\t * or by preventing focus from returning to a trigger element.\n\t *\n\t * Learn more about the [focusability of disabled controls](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#focusabilityofdisabledcontrols)\n\t * in the WAI-ARIA Authoring Practices Guide.\n\t *\n\t * @default false\n\t */\n\taccessibleWhenDisabled?: boolean;\n\t/**\n\t * The button's children.\n\t */\n\tchildren?: ReactNode;\n\t/**\n\t * An accessible description for the button.\n\t */\n\tdescribedBy?: string;\n\t/**\n\t * If provided, renders an Icon component inside the button.\n\t */\n\ticon?: IconProps[ 'icon' ];\n\t/**\n\t * If provided with `icon`, sets the position of icon relative to the `text`.\n\t *\n\t * @default 'left'\n\t */\n\ticonPosition?: 'left' | 'right';\n\t/**\n\t * If provided with `icon`, sets the icon size.\n\t * Please refer to the Icon component for more details regarding\n\t * the default value of its `size` prop.\n\t */\n\ticonSize?: IconProps[ 'size' ];\n\t/**\n\t * Indicates activity while a action is being performed.\n\t */\n\tisBusy?: boolean;\n\t/**\n\t * Renders a red text-based button style to indicate destructive behavior.\n\t */\n\tisDestructive?: boolean;\n\t/**\n\t * Renders a pressed button style.\n\t */\n\tisPressed?: boolean;\n\t/**\n\t * Sets the `aria-label` of the component, if none is provided.\n\t * Sets the Tooltip content if `showTooltip` is provided.\n\t */\n\tlabel?: string;\n\t/**\n\t * If provided with `showTooltip`, appends the Shortcut label to the tooltip content.\n\t * If an object is provided, it should contain `display` and `ariaLabel` keys.\n\t */\n\tshortcut?: string | { display: string; ariaLabel: string };\n\t/**\n\t * If provided, renders a Tooltip component for the button.\n\t */\n\tshowTooltip?: boolean;\n\t/**\n\t * The size of the button.\n\t *\n\t * - `'default'`: For normal text-label buttons, unless it is a toggle button.\n\t * - `'compact'`: For toggle buttons, icon buttons, and buttons when used in context of either.\n\t * - `'small'`: For icon buttons associated with more advanced or auxiliary features.\n\t *\n\t * If the deprecated `isSmall` prop is also defined, this prop will take precedence.\n\t *\n\t * @default 'default'\n\t */\n\tsize?: 'default' | 'compact' | 'small';\n\t/**\n\t * If provided, displays the given text inside the button. If the button contains children elements, the text is displayed before them.\n\t */\n\ttext?: string;\n\t/**\n\t * If provided with `showTooltip`, sets the position of the tooltip.\n\t * Please refer to the Tooltip component for more details regarding the defaults.\n\t */\n\ttooltipPosition?: PopoverProps[ 'position' ];\n\t/**\n\t * Specifies the button's style.\n\t * The accepted values are:\n\t * 'primary' (the primary button styles)\n\t * 'secondary' (the default button styles)\n\t * 'tertiary' (the text-based button styles)\n\t * 'link' (the link button styles)\n\t */\n\tvariant?: 'primary' | 'secondary' | 'tertiary' | 'link';\n};\n\ntype _ButtonProps = {\n\t/**\n\t * Whether the button is disabled. If `true`, this will force a `button` element\n\t * to be rendered, even when an `href` is given.\n\t *\n\t * In most cases, it is recommended to also set the `accessibleWhenDisabled` prop to `true`.\n\t */\n\tdisabled?: boolean;\n};\n\ntype AnchorProps = {\n\t/**\n\t * Whether the button is disabled. If `true`, this will force a `button` element\n\t * to be rendered, even when an `href` is given.\n\t *\n\t * In most cases, it is recommended to also set the `accessibleWhenDisabled` prop to `true`.\n\t */\n\tdisabled?: false;\n\t/**\n\t * If provided, renders `a` instead of `button`.\n\t */\n\thref: string;\n\t/**\n\t * If provided with `href`, sets the `target` attribute to the `a`.\n\t */\n\ttarget?: string;\n};\n\nexport type DeprecatedButtonProps = {\n\t/**\n\t * Whether to keep the button focusable when disabled.\n\t *\n\t * @default false\n\t * @deprecated Use the `accessibleWhenDisabled` prop instead.\n\t * @ignore\n\t */\n\t__experimentalIsFocusable?: boolean;\n\t/**\n\t * Gives the button a default style.\n\t *\n\t * @deprecated Use the `'secondary'` value on the `variant` prop instead.\n\t * @ignore\n\t */\n\tisDefault?: boolean;\n\t/**\n\t * Gives the button a link style.\n\t *\n\t * @deprecated Use the `'link'` value on the `variant` prop instead.\n\t * @ignore\n\t */\n\tisLink?: boolean;\n\t/**\n\t * Gives the button a primary style.\n\t *\n\t * @deprecated Use the `'primary'` value on the `variant` prop instead.\n\t * @ignore\n\t */\n\tisPrimary?: boolean;\n\t/**\n\t * Gives the button a default style.\n\t *\n\t * @deprecated Use the `'secondary'` value on the `variant` prop instead.\n\t * @ignore\n\t */\n\tisSecondary?: boolean;\n\t/**\n\t * Gives the button a text-based style.\n\t *\n\t * @deprecated Use the `'tertiary'` value on the `variant` prop instead.\n\t * @ignore\n\t */\n\tisTertiary?: boolean;\n\t/**\n\t * Decreases the size of the button.\n\t *\n\t * @deprecated Use the `'small'` value on the `size` prop instead.\n\t * @ignore\n\t */\n\tisSmall?: boolean;\n};\n\nexport type DeprecatedIconButtonProps = {\n\tlabelPosition: ButtonProps[ 'tooltipPosition' ];\n\tshowTooltip?: boolean;\n\tsize: ButtonProps[ 'iconSize' ];\n\tlabel: ButtonProps[ 'label' ];\n\ttooltip: ButtonProps[ 'label' ];\n};\n"],"mappings":"","ignoreList":[]}
|
|
@@ -274,7 +274,10 @@ function ComboboxControl(props) {
|
|
|
274
274
|
}), allowReset && /*#__PURE__*/_jsx(FlexItem, {
|
|
275
275
|
children: /*#__PURE__*/_jsx(Button, {
|
|
276
276
|
className: "components-combobox-control__reset",
|
|
277
|
-
icon: closeSmall
|
|
277
|
+
icon: closeSmall
|
|
278
|
+
// Disable reason: Focus returns to input field when reset is clicked.
|
|
279
|
+
// eslint-disable-next-line no-restricted-syntax
|
|
280
|
+
,
|
|
278
281
|
disabled: !value,
|
|
279
282
|
onClick: handleOnReset,
|
|
280
283
|
label: __('Reset')
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["clsx","__","_n","sprintf","Component","useState","useMemo","useRef","useEffect","useInstanceId","speak","closeSmall","InputWrapperFlex","TokenInput","SuggestionsList","BaseControl","Button","FlexBlock","FlexItem","withFocusOutside","useControlledValue","normalizeTextString","useDeprecated36pxDefaultSizeProp","withIgnoreIMEEvents","jsx","_jsx","jsxs","_jsxs","noop","DetectOutside","handleFocusOutside","event","props","onFocusOutside","render","children","getIndexOfMatchingSuggestion","selectedSuggestion","matchingSuggestions","indexOf","ComboboxControl","_currentOption$label","__nextHasNoMarginBottom","__next40pxDefaultSize","value","valueProp","label","options","onChange","onChangeProp","onFilterValueChange","hideLabelFromVision","help","allowReset","className","messages","selected","__experimentalRenderItem","expandOnFocus","setValue","currentOption","find","option","currentLabel","instanceId","setSelectedSuggestion","isExpanded","setIsExpanded","inputHasFocus","setInputHasFocus","inputValue","setInputValue","inputContainer","startsWithMatch","containsMatch","match","forEach","index","push","concat","onSuggestionSelected","newSelectedSuggestion","disabled","handleArrowNavigation","offset","nextIndex","length","onKeyDown","preventDefault","defaultPrevented","code","onBlur","onFocus","onClick","onInputChange","text","handleOnReset","current","focus","hasMatchingSuggestions","hasSelectedMatchingSuggestions","message","id","tabIndex","ref","selectedSuggestionIndex","icon","displayTransform","suggestion","suggestions","selectedIndex","onHover","onSelect","scrollIntoView"],"sources":["@wordpress/components/src/combobox-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {\n\tComponent,\n\tuseState,\n\tuseMemo,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { InputWrapperFlex } from './styles';\nimport TokenInput from '../form-token-field/token-input';\nimport SuggestionsList from '../form-token-field/suggestions-list';\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { FlexBlock, FlexItem } from '../flex';\nimport withFocusOutside from '../higher-order/with-focus-outside';\nimport { useControlledValue } from '../utils/hooks';\nimport { normalizeTextString } from '../utils/strings';\nimport type { ComboboxControlOption, ComboboxControlProps } from './types';\nimport type { TokenInputProps } from '../form-token-field/types';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\n\nconst noop = () => {};\n\ninterface DetectOutsideComponentProps {\n\tonFocusOutside: ( event: React.FocusEvent ) => void;\n\tchildren?: React.ReactNode;\n}\n\nconst DetectOutside = withFocusOutside(\n\tclass extends Component< DetectOutsideComponentProps > {\n\t\thandleFocusOutside( event: React.FocusEvent ) {\n\t\t\tthis.props.onFocusOutside( event );\n\t\t}\n\n\t\trender() {\n\t\t\treturn this.props.children;\n\t\t}\n\t}\n);\n\nconst getIndexOfMatchingSuggestion = (\n\tselectedSuggestion: ComboboxControlOption | null,\n\tmatchingSuggestions: ComboboxControlOption[]\n) =>\n\tselectedSuggestion === null\n\t\t? -1\n\t\t: matchingSuggestions.indexOf( selectedSuggestion );\n\n/**\n * `ComboboxControl` is an enhanced version of a [`SelectControl`](../select-control/README.md) with the addition of\n * being able to search for options using a search input.\n *\n * ```jsx\n * import { ComboboxControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const options = [\n * \t{\n * \t\tvalue: 'small',\n * \t\tlabel: 'Small',\n * \t},\n * \t{\n * \t\tvalue: 'normal',\n * \t\tlabel: 'Normal',\n * \t\tdisabled: true,\n * \t},\n * \t{\n * \t\tvalue: 'large',\n * \t\tlabel: 'Large',\n * \t\tdisabled: false,\n * \t},\n * ];\n *\n * function MyComboboxControl() {\n * \tconst [ fontSize, setFontSize ] = useState();\n * \tconst [ filteredOptions, setFilteredOptions ] = useState( options );\n * \treturn (\n * \t\t<ComboboxControl\n * \t\t\tlabel=\"Font Size\"\n * \t\t\tvalue={ fontSize }\n * \t\t\tonChange={ setFontSize }\n * \t\t\toptions={ filteredOptions }\n * \t\t\tonFilterValueChange={ ( inputValue ) =>\n * \t\t\t\tsetFilteredOptions(\n * \t\t\t\t\toptions.filter( ( option ) =>\n * \t\t\t\t\t\toption.label\n * \t\t\t\t\t\t\t.toLowerCase()\n * \t\t\t\t\t\t\t.startsWith( inputValue.toLowerCase() )\n * \t\t\t\t\t)\n * \t\t\t\t)\n * \t\t\t}\n * \t\t/>\n * \t);\n * }\n * ```\n */\nfunction ComboboxControl( props: ComboboxControlProps ) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\t__next40pxDefaultSize = false,\n\t\tvalue: valueProp,\n\t\tlabel,\n\t\toptions,\n\t\tonChange: onChangeProp,\n\t\tonFilterValueChange = noop,\n\t\thideLabelFromVision,\n\t\thelp,\n\t\tallowReset = true,\n\t\tclassName,\n\t\tmessages = {\n\t\t\tselected: __( 'Item selected.' ),\n\t\t},\n\t\t__experimentalRenderItem,\n\t\texpandOnFocus = true,\n\t} = useDeprecated36pxDefaultSizeProp( props );\n\n\tconst [ value, setValue ] = useControlledValue( {\n\t\tvalue: valueProp,\n\t\tonChange: onChangeProp,\n\t} );\n\n\tconst currentOption = options.find( ( option ) => option.value === value );\n\tconst currentLabel = currentOption?.label ?? '';\n\t// Use a custom prefix when generating the `instanceId` to avoid having\n\t// duplicate input IDs when rendering this component and `FormTokenField`\n\t// in the same page (see https://github.com/WordPress/gutenberg/issues/42112).\n\tconst instanceId = useInstanceId( ComboboxControl, 'combobox-control' );\n\tconst [ selectedSuggestion, setSelectedSuggestion ] = useState(\n\t\tcurrentOption || null\n\t);\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ inputHasFocus, setInputHasFocus ] = useState( false );\n\tconst [ inputValue, setInputValue ] = useState( '' );\n\tconst inputContainer = useRef< HTMLInputElement >( null );\n\n\tconst matchingSuggestions = useMemo( () => {\n\t\tconst startsWithMatch: ComboboxControlOption[] = [];\n\t\tconst containsMatch: ComboboxControlOption[] = [];\n\t\tconst match = normalizeTextString( inputValue );\n\t\toptions.forEach( ( option ) => {\n\t\t\tconst index = normalizeTextString( option.label ).indexOf( match );\n\t\t\tif ( index === 0 ) {\n\t\t\t\tstartsWithMatch.push( option );\n\t\t\t} else if ( index > 0 ) {\n\t\t\t\tcontainsMatch.push( option );\n\t\t\t}\n\t\t} );\n\n\t\treturn startsWithMatch.concat( containsMatch );\n\t}, [ inputValue, options ] );\n\n\tconst onSuggestionSelected = (\n\t\tnewSelectedSuggestion: ComboboxControlOption\n\t) => {\n\t\tif ( newSelectedSuggestion.disabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetValue( newSelectedSuggestion.value );\n\t\tspeak( messages.selected, 'assertive' );\n\t\tsetSelectedSuggestion( newSelectedSuggestion );\n\t\tsetInputValue( '' );\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst handleArrowNavigation = ( offset = 1 ) => {\n\t\tconst index = getIndexOfMatchingSuggestion(\n\t\t\tselectedSuggestion,\n\t\t\tmatchingSuggestions\n\t\t);\n\t\tlet nextIndex = index + offset;\n\t\tif ( nextIndex < 0 ) {\n\t\t\tnextIndex = matchingSuggestions.length - 1;\n\t\t} else if ( nextIndex >= matchingSuggestions.length ) {\n\t\t\tnextIndex = 0;\n\t\t}\n\t\tsetSelectedSuggestion( matchingSuggestions[ nextIndex ] );\n\t\tsetIsExpanded( true );\n\t};\n\n\tconst onKeyDown: React.KeyboardEventHandler< HTMLDivElement > =\n\t\twithIgnoreIMEEvents( ( event ) => {\n\t\t\tlet preventDefault = false;\n\n\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tswitch ( event.code ) {\n\t\t\t\tcase 'Enter':\n\t\t\t\t\tif ( selectedSuggestion ) {\n\t\t\t\t\t\tonSuggestionSelected( selectedSuggestion );\n\t\t\t\t\t\tpreventDefault = true;\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'ArrowUp':\n\t\t\t\t\thandleArrowNavigation( -1 );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'ArrowDown':\n\t\t\t\t\thandleArrowNavigation( 1 );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'Escape':\n\t\t\t\t\tsetIsExpanded( false );\n\t\t\t\t\tsetSelectedSuggestion( null );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t\tbreak;\n\t\t\t\tdefault:\n\t\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tif ( preventDefault ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t} );\n\n\tconst onBlur = () => {\n\t\tsetInputHasFocus( false );\n\t};\n\n\tconst onFocus = () => {\n\t\tsetInputHasFocus( true );\n\t\tif ( expandOnFocus ) {\n\t\t\tsetIsExpanded( true );\n\t\t}\n\n\t\tonFilterValueChange( '' );\n\t\tsetInputValue( '' );\n\t};\n\n\tconst onClick = () => {\n\t\tsetIsExpanded( true );\n\t};\n\n\tconst onFocusOutside = () => {\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst onInputChange: TokenInputProps[ 'onChange' ] = ( event ) => {\n\t\tconst text = event.value;\n\t\tsetInputValue( text );\n\t\tonFilterValueChange( text );\n\t\tif ( inputHasFocus ) {\n\t\t\tsetIsExpanded( true );\n\t\t}\n\t};\n\n\tconst handleOnReset = () => {\n\t\tsetValue( null );\n\t\tinputContainer.current?.focus();\n\t};\n\n\t// Update current selections when the filter input changes.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tconst hasSelectedMatchingSuggestions =\n\t\t\tgetIndexOfMatchingSuggestion(\n\t\t\t\tselectedSuggestion,\n\t\t\t\tmatchingSuggestions\n\t\t\t) > 0;\n\n\t\tif ( hasMatchingSuggestions && ! hasSelectedMatchingSuggestions ) {\n\t\t\t// If the current selection isn't present in the list of suggestions, then automatically select the first item from the list of suggestions.\n\t\t\tsetSelectedSuggestion( matchingSuggestions[ 0 ] );\n\t\t}\n\t}, [ matchingSuggestions, selectedSuggestion ] );\n\n\t// Announcements.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tif ( isExpanded ) {\n\t\t\tconst message = hasMatchingSuggestions\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t )\n\t\t\t\t: __( 'No results.' );\n\n\t\t\tspeak( message, 'polite' );\n\t\t}\n\t}, [ matchingSuggestions, isExpanded ] );\n\n\t// Disable reason: There is no appropriate role which describes the\n\t// input container intended accessible usability.\n\t// TODO: Refactor click detection to use blur to stop propagation.\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<DetectOutside onFocusOutside={ onFocusOutside }>\n\t\t\t<BaseControl\n\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\tclassName={ clsx( className, 'components-combobox-control' ) }\n\t\t\t\tlabel={ label }\n\t\t\t\tid={ `components-form-token-input-${ instanceId }` }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\thelp={ help }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"components-combobox-control__suggestions-container\"\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<InputWrapperFlex\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t<TokenInput\n\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__input\"\n\t\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t\tref={ inputContainer }\n\t\t\t\t\t\t\t\tvalue={ isExpanded ? inputValue : currentLabel }\n\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\t\t\t\tonClick={ onClick }\n\t\t\t\t\t\t\t\tisExpanded={ isExpanded }\n\t\t\t\t\t\t\t\tselectedSuggestionIndex={ getIndexOfMatchingSuggestion(\n\t\t\t\t\t\t\t\t\tselectedSuggestion,\n\t\t\t\t\t\t\t\t\tmatchingSuggestions\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonChange={ onInputChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t{ allowReset && (\n\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__reset\"\n\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\tdisabled={ ! value }\n\t\t\t\t\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</InputWrapperFlex>\n\t\t\t\t\t{ isExpanded && (\n\t\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t// The empty string for `value` here is not actually used, but is\n\t\t\t\t\t\t\t// just a quick way to satisfy the TypeScript requirements of SuggestionsList.\n\t\t\t\t\t\t\t// See: https://github.com/WordPress/gutenberg/pull/47581/files#r1091089330\n\t\t\t\t\t\t\tmatch={ { label: inputValue, value: '' } }\n\t\t\t\t\t\t\tdisplayTransform={ ( suggestion ) =>\n\t\t\t\t\t\t\t\tsuggestion.label\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\t\tselectedIndex={ getIndexOfMatchingSuggestion(\n\t\t\t\t\t\t\t\tselectedSuggestion,\n\t\t\t\t\t\t\t\tmatchingSuggestions\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonHover={ setSelectedSuggestion }\n\t\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t\tscrollIntoView\n\t\t\t\t\t\t\t__experimentalRenderItem={\n\t\t\t\t\t\t\t\t__experimentalRenderItem\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</BaseControl>\n\t\t</DetectOutside>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default ComboboxControl;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["clsx","__","_n","sprintf","Component","useState","useMemo","useRef","useEffect","useInstanceId","speak","closeSmall","InputWrapperFlex","TokenInput","SuggestionsList","BaseControl","Button","FlexBlock","FlexItem","withFocusOutside","useControlledValue","normalizeTextString","useDeprecated36pxDefaultSizeProp","withIgnoreIMEEvents","jsx","_jsx","jsxs","_jsxs","noop","DetectOutside","handleFocusOutside","event","props","onFocusOutside","render","children","getIndexOfMatchingSuggestion","selectedSuggestion","matchingSuggestions","indexOf","ComboboxControl","_currentOption$label","__nextHasNoMarginBottom","__next40pxDefaultSize","value","valueProp","label","options","onChange","onChangeProp","onFilterValueChange","hideLabelFromVision","help","allowReset","className","messages","selected","__experimentalRenderItem","expandOnFocus","setValue","currentOption","find","option","currentLabel","instanceId","setSelectedSuggestion","isExpanded","setIsExpanded","inputHasFocus","setInputHasFocus","inputValue","setInputValue","inputContainer","startsWithMatch","containsMatch","match","forEach","index","push","concat","onSuggestionSelected","newSelectedSuggestion","disabled","handleArrowNavigation","offset","nextIndex","length","onKeyDown","preventDefault","defaultPrevented","code","onBlur","onFocus","onClick","onInputChange","text","handleOnReset","current","focus","hasMatchingSuggestions","hasSelectedMatchingSuggestions","message","id","tabIndex","ref","selectedSuggestionIndex","icon","displayTransform","suggestion","suggestions","selectedIndex","onHover","onSelect","scrollIntoView"],"sources":["@wordpress/components/src/combobox-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {\n\tComponent,\n\tuseState,\n\tuseMemo,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { InputWrapperFlex } from './styles';\nimport TokenInput from '../form-token-field/token-input';\nimport SuggestionsList from '../form-token-field/suggestions-list';\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { FlexBlock, FlexItem } from '../flex';\nimport withFocusOutside from '../higher-order/with-focus-outside';\nimport { useControlledValue } from '../utils/hooks';\nimport { normalizeTextString } from '../utils/strings';\nimport type { ComboboxControlOption, ComboboxControlProps } from './types';\nimport type { TokenInputProps } from '../form-token-field/types';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\n\nconst noop = () => {};\n\ninterface DetectOutsideComponentProps {\n\tonFocusOutside: ( event: React.FocusEvent ) => void;\n\tchildren?: React.ReactNode;\n}\n\nconst DetectOutside = withFocusOutside(\n\tclass extends Component< DetectOutsideComponentProps > {\n\t\thandleFocusOutside( event: React.FocusEvent ) {\n\t\t\tthis.props.onFocusOutside( event );\n\t\t}\n\n\t\trender() {\n\t\t\treturn this.props.children;\n\t\t}\n\t}\n);\n\nconst getIndexOfMatchingSuggestion = (\n\tselectedSuggestion: ComboboxControlOption | null,\n\tmatchingSuggestions: ComboboxControlOption[]\n) =>\n\tselectedSuggestion === null\n\t\t? -1\n\t\t: matchingSuggestions.indexOf( selectedSuggestion );\n\n/**\n * `ComboboxControl` is an enhanced version of a [`SelectControl`](../select-control/README.md) with the addition of\n * being able to search for options using a search input.\n *\n * ```jsx\n * import { ComboboxControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const options = [\n * \t{\n * \t\tvalue: 'small',\n * \t\tlabel: 'Small',\n * \t},\n * \t{\n * \t\tvalue: 'normal',\n * \t\tlabel: 'Normal',\n * \t\tdisabled: true,\n * \t},\n * \t{\n * \t\tvalue: 'large',\n * \t\tlabel: 'Large',\n * \t\tdisabled: false,\n * \t},\n * ];\n *\n * function MyComboboxControl() {\n * \tconst [ fontSize, setFontSize ] = useState();\n * \tconst [ filteredOptions, setFilteredOptions ] = useState( options );\n * \treturn (\n * \t\t<ComboboxControl\n * \t\t\tlabel=\"Font Size\"\n * \t\t\tvalue={ fontSize }\n * \t\t\tonChange={ setFontSize }\n * \t\t\toptions={ filteredOptions }\n * \t\t\tonFilterValueChange={ ( inputValue ) =>\n * \t\t\t\tsetFilteredOptions(\n * \t\t\t\t\toptions.filter( ( option ) =>\n * \t\t\t\t\t\toption.label\n * \t\t\t\t\t\t\t.toLowerCase()\n * \t\t\t\t\t\t\t.startsWith( inputValue.toLowerCase() )\n * \t\t\t\t\t)\n * \t\t\t\t)\n * \t\t\t}\n * \t\t/>\n * \t);\n * }\n * ```\n */\nfunction ComboboxControl( props: ComboboxControlProps ) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\t__next40pxDefaultSize = false,\n\t\tvalue: valueProp,\n\t\tlabel,\n\t\toptions,\n\t\tonChange: onChangeProp,\n\t\tonFilterValueChange = noop,\n\t\thideLabelFromVision,\n\t\thelp,\n\t\tallowReset = true,\n\t\tclassName,\n\t\tmessages = {\n\t\t\tselected: __( 'Item selected.' ),\n\t\t},\n\t\t__experimentalRenderItem,\n\t\texpandOnFocus = true,\n\t} = useDeprecated36pxDefaultSizeProp( props );\n\n\tconst [ value, setValue ] = useControlledValue( {\n\t\tvalue: valueProp,\n\t\tonChange: onChangeProp,\n\t} );\n\n\tconst currentOption = options.find( ( option ) => option.value === value );\n\tconst currentLabel = currentOption?.label ?? '';\n\t// Use a custom prefix when generating the `instanceId` to avoid having\n\t// duplicate input IDs when rendering this component and `FormTokenField`\n\t// in the same page (see https://github.com/WordPress/gutenberg/issues/42112).\n\tconst instanceId = useInstanceId( ComboboxControl, 'combobox-control' );\n\tconst [ selectedSuggestion, setSelectedSuggestion ] = useState(\n\t\tcurrentOption || null\n\t);\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ inputHasFocus, setInputHasFocus ] = useState( false );\n\tconst [ inputValue, setInputValue ] = useState( '' );\n\tconst inputContainer = useRef< HTMLInputElement >( null );\n\n\tconst matchingSuggestions = useMemo( () => {\n\t\tconst startsWithMatch: ComboboxControlOption[] = [];\n\t\tconst containsMatch: ComboboxControlOption[] = [];\n\t\tconst match = normalizeTextString( inputValue );\n\t\toptions.forEach( ( option ) => {\n\t\t\tconst index = normalizeTextString( option.label ).indexOf( match );\n\t\t\tif ( index === 0 ) {\n\t\t\t\tstartsWithMatch.push( option );\n\t\t\t} else if ( index > 0 ) {\n\t\t\t\tcontainsMatch.push( option );\n\t\t\t}\n\t\t} );\n\n\t\treturn startsWithMatch.concat( containsMatch );\n\t}, [ inputValue, options ] );\n\n\tconst onSuggestionSelected = (\n\t\tnewSelectedSuggestion: ComboboxControlOption\n\t) => {\n\t\tif ( newSelectedSuggestion.disabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetValue( newSelectedSuggestion.value );\n\t\tspeak( messages.selected, 'assertive' );\n\t\tsetSelectedSuggestion( newSelectedSuggestion );\n\t\tsetInputValue( '' );\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst handleArrowNavigation = ( offset = 1 ) => {\n\t\tconst index = getIndexOfMatchingSuggestion(\n\t\t\tselectedSuggestion,\n\t\t\tmatchingSuggestions\n\t\t);\n\t\tlet nextIndex = index + offset;\n\t\tif ( nextIndex < 0 ) {\n\t\t\tnextIndex = matchingSuggestions.length - 1;\n\t\t} else if ( nextIndex >= matchingSuggestions.length ) {\n\t\t\tnextIndex = 0;\n\t\t}\n\t\tsetSelectedSuggestion( matchingSuggestions[ nextIndex ] );\n\t\tsetIsExpanded( true );\n\t};\n\n\tconst onKeyDown: React.KeyboardEventHandler< HTMLDivElement > =\n\t\twithIgnoreIMEEvents( ( event ) => {\n\t\t\tlet preventDefault = false;\n\n\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tswitch ( event.code ) {\n\t\t\t\tcase 'Enter':\n\t\t\t\t\tif ( selectedSuggestion ) {\n\t\t\t\t\t\tonSuggestionSelected( selectedSuggestion );\n\t\t\t\t\t\tpreventDefault = true;\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'ArrowUp':\n\t\t\t\t\thandleArrowNavigation( -1 );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'ArrowDown':\n\t\t\t\t\thandleArrowNavigation( 1 );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'Escape':\n\t\t\t\t\tsetIsExpanded( false );\n\t\t\t\t\tsetSelectedSuggestion( null );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t\tbreak;\n\t\t\t\tdefault:\n\t\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tif ( preventDefault ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t} );\n\n\tconst onBlur = () => {\n\t\tsetInputHasFocus( false );\n\t};\n\n\tconst onFocus = () => {\n\t\tsetInputHasFocus( true );\n\t\tif ( expandOnFocus ) {\n\t\t\tsetIsExpanded( true );\n\t\t}\n\n\t\tonFilterValueChange( '' );\n\t\tsetInputValue( '' );\n\t};\n\n\tconst onClick = () => {\n\t\tsetIsExpanded( true );\n\t};\n\n\tconst onFocusOutside = () => {\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst onInputChange: TokenInputProps[ 'onChange' ] = ( event ) => {\n\t\tconst text = event.value;\n\t\tsetInputValue( text );\n\t\tonFilterValueChange( text );\n\t\tif ( inputHasFocus ) {\n\t\t\tsetIsExpanded( true );\n\t\t}\n\t};\n\n\tconst handleOnReset = () => {\n\t\tsetValue( null );\n\t\tinputContainer.current?.focus();\n\t};\n\n\t// Update current selections when the filter input changes.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tconst hasSelectedMatchingSuggestions =\n\t\t\tgetIndexOfMatchingSuggestion(\n\t\t\t\tselectedSuggestion,\n\t\t\t\tmatchingSuggestions\n\t\t\t) > 0;\n\n\t\tif ( hasMatchingSuggestions && ! hasSelectedMatchingSuggestions ) {\n\t\t\t// If the current selection isn't present in the list of suggestions, then automatically select the first item from the list of suggestions.\n\t\t\tsetSelectedSuggestion( matchingSuggestions[ 0 ] );\n\t\t}\n\t}, [ matchingSuggestions, selectedSuggestion ] );\n\n\t// Announcements.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tif ( isExpanded ) {\n\t\t\tconst message = hasMatchingSuggestions\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t )\n\t\t\t\t: __( 'No results.' );\n\n\t\t\tspeak( message, 'polite' );\n\t\t}\n\t}, [ matchingSuggestions, isExpanded ] );\n\n\t// Disable reason: There is no appropriate role which describes the\n\t// input container intended accessible usability.\n\t// TODO: Refactor click detection to use blur to stop propagation.\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<DetectOutside onFocusOutside={ onFocusOutside }>\n\t\t\t<BaseControl\n\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\tclassName={ clsx( className, 'components-combobox-control' ) }\n\t\t\t\tlabel={ label }\n\t\t\t\tid={ `components-form-token-input-${ instanceId }` }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\thelp={ help }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"components-combobox-control__suggestions-container\"\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<InputWrapperFlex\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t<TokenInput\n\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__input\"\n\t\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t\tref={ inputContainer }\n\t\t\t\t\t\t\t\tvalue={ isExpanded ? inputValue : currentLabel }\n\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\t\t\t\tonClick={ onClick }\n\t\t\t\t\t\t\t\tisExpanded={ isExpanded }\n\t\t\t\t\t\t\t\tselectedSuggestionIndex={ getIndexOfMatchingSuggestion(\n\t\t\t\t\t\t\t\t\tselectedSuggestion,\n\t\t\t\t\t\t\t\t\tmatchingSuggestions\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonChange={ onInputChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t{ allowReset && (\n\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__reset\"\n\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\t// Disable reason: Focus returns to input field when reset is clicked.\n\t\t\t\t\t\t\t\t\t// eslint-disable-next-line no-restricted-syntax\n\t\t\t\t\t\t\t\t\tdisabled={ ! value }\n\t\t\t\t\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</InputWrapperFlex>\n\t\t\t\t\t{ isExpanded && (\n\t\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t// The empty string for `value` here is not actually used, but is\n\t\t\t\t\t\t\t// just a quick way to satisfy the TypeScript requirements of SuggestionsList.\n\t\t\t\t\t\t\t// See: https://github.com/WordPress/gutenberg/pull/47581/files#r1091089330\n\t\t\t\t\t\t\tmatch={ { label: inputValue, value: '' } }\n\t\t\t\t\t\t\tdisplayTransform={ ( suggestion ) =>\n\t\t\t\t\t\t\t\tsuggestion.label\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\t\tselectedIndex={ getIndexOfMatchingSuggestion(\n\t\t\t\t\t\t\t\tselectedSuggestion,\n\t\t\t\t\t\t\t\tmatchingSuggestions\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonHover={ setSelectedSuggestion }\n\t\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t\tscrollIntoView\n\t\t\t\t\t\t\t__experimentalRenderItem={\n\t\t\t\t\t\t\t\t__experimentalRenderItem\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</BaseControl>\n\t\t</DetectOutside>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default ComboboxControl;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -8,8 +8,5 @@
|
|
|
8
8
|
* @see https://ariakit.org/components/composite
|
|
9
9
|
*/
|
|
10
10
|
|
|
11
|
-
/* eslint-disable-next-line no-restricted-imports */
|
|
12
11
|
export { Composite, CompositeGroup, CompositeGroupLabel, CompositeItem, CompositeRow, useCompositeStore } from '@ariakit/react';
|
|
13
|
-
|
|
14
|
-
/* eslint-disable-next-line no-restricted-imports */
|
|
15
12
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Composite","CompositeGroup","CompositeGroupLabel","CompositeItem","CompositeRow","useCompositeStore"],"sources":["@wordpress/components/src/composite/current/index.ts"],"sourcesContent":["/**\n * Composite is a component that may contain navigable items represented by\n * CompositeItem. It's inspired by the WAI-ARIA Composite Role and implements\n * all the keyboard navigation mechanisms to ensure that there's only one\n * tab stop for the whole Composite element. This means that it can behave as\n * a roving tabindex or aria-activedescendant container.\n *\n * @see https://ariakit.org/components/composite\n */\n\
|
|
1
|
+
{"version":3,"names":["Composite","CompositeGroup","CompositeGroupLabel","CompositeItem","CompositeRow","useCompositeStore"],"sources":["@wordpress/components/src/composite/current/index.ts"],"sourcesContent":["/**\n * Composite is a component that may contain navigable items represented by\n * CompositeItem. It's inspired by the WAI-ARIA Composite Role and implements\n * all the keyboard navigation mechanisms to ensure that there's only one\n * tab stop for the whole Composite element. This means that it can behave as\n * a roving tabindex or aria-activedescendant container.\n *\n * @see https://ariakit.org/components/composite\n */\n\nexport {\n\tComposite,\n\tCompositeGroup,\n\tCompositeGroupLabel,\n\tCompositeItem,\n\tCompositeRow,\n\tuseCompositeStore,\n} from '@ariakit/react';\n\nexport type { CompositeStore, CompositeStoreProps } from '@ariakit/react';\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SACCA,SAAS,EACTC,cAAc,EACdC,mBAAmB,EACnBC,aAAa,EACbC,YAAY,EACZC,iBAAiB,QACX,gBAAgB","ignoreList":[]}
|
|
@@ -1,7 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* External dependencies
|
|
3
|
+
*/
|
|
4
|
+
import * as Ariakit from '@ariakit/react';
|
|
5
|
+
|
|
1
6
|
/**
|
|
2
7
|
* WordPress dependencies
|
|
3
8
|
*/
|
|
4
|
-
import { createContext, useMemo } from '@wordpress/element';
|
|
9
|
+
import { createContext, useCallback, useMemo } from '@wordpress/element';
|
|
5
10
|
import { __, sprintf } from '@wordpress/i18n';
|
|
6
11
|
|
|
7
12
|
/**
|
|
@@ -11,9 +16,9 @@ import { VisuallyHidden } from '..';
|
|
|
11
16
|
import * as Styled from './styles';
|
|
12
17
|
import InputBase from '../input-control/input-base';
|
|
13
18
|
import SelectControlChevronDown from '../select-control/chevron-down';
|
|
19
|
+
import BaseControl from '../base-control';
|
|
14
20
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
15
21
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
16
|
-
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
17
22
|
export const CustomSelectContext = createContext(undefined);
|
|
18
23
|
function defaultRenderSelectedValue(value) {
|
|
19
24
|
const isValueEmpty = Array.isArray(value) ? value.length === 0 : value === undefined || value === null;
|
|
@@ -41,14 +46,8 @@ const CustomSelectButton = ({
|
|
|
41
46
|
...restProps,
|
|
42
47
|
size: size,
|
|
43
48
|
hasCustomRenderProp: !!renderSelectedValue,
|
|
44
|
-
store: store
|
|
45
|
-
|
|
46
|
-
// move selection rather than open the popover
|
|
47
|
-
,
|
|
48
|
-
showOnKeyDown: false,
|
|
49
|
-
children: /*#__PURE__*/_jsx("div", {
|
|
50
|
-
children: computedRenderSelectedValue(currentValue)
|
|
51
|
-
})
|
|
49
|
+
store: store,
|
|
50
|
+
children: computedRenderSelectedValue(currentValue)
|
|
52
51
|
});
|
|
53
52
|
};
|
|
54
53
|
function _CustomSelect(props) {
|
|
@@ -58,39 +57,61 @@ function _CustomSelect(props) {
|
|
|
58
57
|
label,
|
|
59
58
|
size,
|
|
60
59
|
store,
|
|
60
|
+
className,
|
|
61
|
+
isLegacy = false,
|
|
61
62
|
...restProps
|
|
62
63
|
} = props;
|
|
63
|
-
|
|
64
|
-
|
|
64
|
+
const onSelectPopoverKeyDown = useCallback(e => {
|
|
65
|
+
if (isLegacy) {
|
|
66
|
+
e.stopPropagation();
|
|
67
|
+
}
|
|
68
|
+
}, [isLegacy]);
|
|
69
|
+
const contextValue = useMemo(() => ({
|
|
70
|
+
store,
|
|
71
|
+
size
|
|
72
|
+
}), [store, size]);
|
|
73
|
+
return (
|
|
65
74
|
/*#__PURE__*/
|
|
66
|
-
//
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
children:
|
|
70
|
-
}) : /*#__PURE__*/_jsx(Styled.SelectLabel, {
|
|
71
|
-
store: store,
|
|
72
|
-
children: label
|
|
73
|
-
}), /*#__PURE__*/_jsxs(InputBase, {
|
|
74
|
-
__next40pxDefaultSize: true,
|
|
75
|
-
size: size,
|
|
76
|
-
suffix: /*#__PURE__*/_jsx(SelectControlChevronDown, {}),
|
|
77
|
-
children: [/*#__PURE__*/_jsx(CustomSelectButton, {
|
|
78
|
-
...restProps,
|
|
79
|
-
size: size,
|
|
80
|
-
store: store
|
|
81
|
-
}), /*#__PURE__*/_jsx(Styled.SelectPopover, {
|
|
82
|
-
gutter: 12,
|
|
75
|
+
// Where should `restProps` be forwarded to?
|
|
76
|
+
_jsxs("div", {
|
|
77
|
+
className: className,
|
|
78
|
+
children: [/*#__PURE__*/_jsx(Ariakit.SelectLabel, {
|
|
83
79
|
store: store,
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
80
|
+
render: hideLabelFromVision ?
|
|
81
|
+
/*#__PURE__*/
|
|
82
|
+
// @ts-expect-error `children` are passed via the render prop
|
|
83
|
+
_jsx(VisuallyHidden, {}) :
|
|
84
|
+
/*#__PURE__*/
|
|
85
|
+
// @ts-expect-error `children` are passed via the render prop
|
|
86
|
+
_jsx(BaseControl.VisualLabel, {
|
|
87
|
+
as: "div"
|
|
88
|
+
}),
|
|
89
|
+
children: label
|
|
90
|
+
}), /*#__PURE__*/_jsxs(InputBase, {
|
|
91
|
+
__next40pxDefaultSize: true,
|
|
92
|
+
size: size,
|
|
93
|
+
suffix: /*#__PURE__*/_jsx(SelectControlChevronDown, {}),
|
|
94
|
+
children: [/*#__PURE__*/_jsx(CustomSelectButton, {
|
|
95
|
+
...restProps,
|
|
96
|
+
size: size,
|
|
97
|
+
store: store
|
|
98
|
+
// Match legacy behavior (move selection rather than open the popover)
|
|
99
|
+
,
|
|
100
|
+
showOnKeyDown: !isLegacy
|
|
101
|
+
}), /*#__PURE__*/_jsx(Styled.SelectPopover, {
|
|
102
|
+
gutter: 12,
|
|
103
|
+
store: store,
|
|
104
|
+
sameWidth: true,
|
|
105
|
+
slide: false,
|
|
106
|
+
onKeyDown: onSelectPopoverKeyDown,
|
|
107
|
+
children: /*#__PURE__*/_jsx(CustomSelectContext.Provider, {
|
|
108
|
+
value: contextValue,
|
|
109
|
+
children: children
|
|
110
|
+
})
|
|
111
|
+
})]
|
|
91
112
|
})]
|
|
92
|
-
})
|
|
93
|
-
|
|
113
|
+
})
|
|
114
|
+
);
|
|
94
115
|
}
|
|
95
116
|
export default _CustomSelect;
|
|
96
117
|
//# sourceMappingURL=custom-select.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["createContext","useMemo","__","sprintf","VisuallyHidden","Styled","InputBase","SelectControlChevronDown","jsx","_jsx","jsxs","_jsxs","
|
|
1
|
+
{"version":3,"names":["Ariakit","createContext","useCallback","useMemo","__","sprintf","VisuallyHidden","Styled","InputBase","SelectControlChevronDown","BaseControl","jsx","_jsx","jsxs","_jsxs","CustomSelectContext","undefined","defaultRenderSelectedValue","value","isValueEmpty","Array","isArray","length","CustomSelectButton","renderSelectedValue","size","store","restProps","currentValue","useState","computedRenderSelectedValue","Select","hasCustomRenderProp","children","_CustomSelect","props","hideLabelFromVision","label","className","isLegacy","onSelectPopoverKeyDown","e","stopPropagation","contextValue","SelectLabel","render","VisualLabel","as","__next40pxDefaultSize","suffix","showOnKeyDown","SelectPopover","gutter","sameWidth","slide","onKeyDown","Provider"],"sources":["@wordpress/components/src/custom-select-control-v2/custom-select.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { createContext, useCallback, useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { VisuallyHidden } from '..';\nimport * as Styled from './styles';\nimport type {\n\tCustomSelectContext as CustomSelectContextType,\n\tCustomSelectStore,\n\tCustomSelectButtonProps,\n\tCustomSelectButtonSize,\n\t_CustomSelectInternalProps,\n\t_CustomSelectProps,\n} from './types';\nimport InputBase from '../input-control/input-base';\nimport SelectControlChevronDown from '../select-control/chevron-down';\nimport BaseControl from '../base-control';\n\nexport const CustomSelectContext =\n\tcreateContext< CustomSelectContextType >( undefined );\n\nfunction defaultRenderSelectedValue(\n\tvalue: CustomSelectButtonProps[ 'value' ]\n) {\n\tconst isValueEmpty = Array.isArray( value )\n\t\t? value.length === 0\n\t\t: value === undefined || value === null;\n\n\tif ( isValueEmpty ) {\n\t\treturn __( 'Select an item' );\n\t}\n\n\tif ( Array.isArray( value ) ) {\n\t\treturn value.length === 1\n\t\t\t? value[ 0 ]\n\t\t\t: // translators: %s: number of items selected (it will always be 2 or more items)\n\t\t\t sprintf( __( '%s items selected' ), value.length );\n\t}\n\n\treturn value;\n}\n\nconst CustomSelectButton = ( {\n\trenderSelectedValue,\n\tsize = 'default',\n\tstore,\n\t...restProps\n}: Omit<\n\tReact.ComponentProps< typeof Ariakit.Select > &\n\t\tCustomSelectButtonProps &\n\t\tCustomSelectButtonSize &\n\t\tCustomSelectStore,\n\t'onChange'\n> ) => {\n\tconst { value: currentValue } = store.useState();\n\n\tconst computedRenderSelectedValue = useMemo(\n\t\t() => renderSelectedValue ?? defaultRenderSelectedValue,\n\t\t[ renderSelectedValue ]\n\t);\n\n\treturn (\n\t\t<Styled.Select\n\t\t\t{ ...restProps }\n\t\t\tsize={ size }\n\t\t\thasCustomRenderProp={ !! renderSelectedValue }\n\t\t\tstore={ store }\n\t\t>\n\t\t\t{ computedRenderSelectedValue( currentValue ) }\n\t\t</Styled.Select>\n\t);\n};\n\nfunction _CustomSelect(\n\tprops: _CustomSelectInternalProps &\n\t\t_CustomSelectProps &\n\t\tCustomSelectStore &\n\t\tCustomSelectButtonSize\n) {\n\tconst {\n\t\tchildren,\n\t\thideLabelFromVision = false,\n\t\tlabel,\n\t\tsize,\n\t\tstore,\n\t\tclassName,\n\t\tisLegacy = false,\n\t\t...restProps\n\t} = props;\n\n\tconst onSelectPopoverKeyDown: React.KeyboardEventHandler< HTMLDivElement > =\n\t\tuseCallback(\n\t\t\t( e ) => {\n\t\t\t\tif ( isLegacy ) {\n\t\t\t\t\te.stopPropagation();\n\t\t\t\t}\n\t\t\t},\n\t\t\t[ isLegacy ]\n\t\t);\n\n\tconst contextValue = useMemo( () => ( { store, size } ), [ store, size ] );\n\n\treturn (\n\t\t// Where should `restProps` be forwarded to?\n\t\t<div className={ className }>\n\t\t\t<Ariakit.SelectLabel\n\t\t\t\tstore={ store }\n\t\t\t\trender={\n\t\t\t\t\thideLabelFromVision ? (\n\t\t\t\t\t\t// @ts-expect-error `children` are passed via the render prop\n\t\t\t\t\t\t<VisuallyHidden />\n\t\t\t\t\t) : (\n\t\t\t\t\t\t// @ts-expect-error `children` are passed via the render prop\n\t\t\t\t\t\t<BaseControl.VisualLabel as=\"div\" />\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{ label }\n\t\t\t</Ariakit.SelectLabel>\n\t\t\t<InputBase\n\t\t\t\t__next40pxDefaultSize\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ <SelectControlChevronDown /> }\n\t\t\t>\n\t\t\t\t<CustomSelectButton\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t\tsize={ size }\n\t\t\t\t\tstore={ store }\n\t\t\t\t\t// Match legacy behavior (move selection rather than open the popover)\n\t\t\t\t\tshowOnKeyDown={ ! isLegacy }\n\t\t\t\t/>\n\t\t\t\t<Styled.SelectPopover\n\t\t\t\t\tgutter={ 12 }\n\t\t\t\t\tstore={ store }\n\t\t\t\t\tsameWidth\n\t\t\t\t\tslide={ false }\n\t\t\t\t\tonKeyDown={ onSelectPopoverKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<CustomSelectContext.Provider value={ contextValue }>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</CustomSelectContext.Provider>\n\t\t\t\t</Styled.SelectPopover>\n\t\t\t</InputBase>\n\t\t</div>\n\t);\n}\n\nexport default _CustomSelect;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Ariakit","_CustomSelect","Item","jsx","_jsx","CustomSelectControlV2","props","defaultValue","onChange","value","restProps","store","useSelectStore","setValue","nextValue"],"sources":["@wordpress/components/src/custom-select-control-v2/default-component/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\
|
|
1
|
+
{"version":3,"names":["Ariakit","_CustomSelect","Item","jsx","_jsx","CustomSelectControlV2","props","defaultValue","onChange","value","restProps","store","useSelectStore","setValue","nextValue"],"sources":["@wordpress/components/src/custom-select-control-v2/default-component/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n/**\n * Internal dependencies\n */\nimport _CustomSelect from '../custom-select';\nimport type { CustomSelectProps } from '../types';\nimport type { WordPressComponentProps } from '../../context';\nimport Item from '../item';\n\nfunction CustomSelectControlV2(\n\tprops: WordPressComponentProps< CustomSelectProps, 'button', false >\n) {\n\tconst { defaultValue, onChange, value, ...restProps } = props;\n\t// Forward props + store from v2 implementation\n\tconst store = Ariakit.useSelectStore( {\n\t\tsetValue: ( nextValue ) => onChange?.( nextValue ),\n\t\tdefaultValue,\n\t\tvalue,\n\t} );\n\n\treturn <_CustomSelect { ...restProps } store={ store } />;\n}\n\nCustomSelectControlV2.Item = Item;\n\nexport default CustomSelectControlV2;\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,KAAKA,OAAO,MAAM,gBAAgB;AACzC;AACA;AACA;AACA,OAAOC,aAAa,MAAM,kBAAkB;AAG5C,OAAOC,IAAI,MAAM,SAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE3B,SAASC,qBAAqBA,CAC7BC,KAAoE,EACnE;EACD,MAAM;IAAEC,YAAY;IAAEC,QAAQ;IAAEC,KAAK;IAAE,GAAGC;EAAU,CAAC,GAAGJ,KAAK;EAC7D;EACA,MAAMK,KAAK,GAAGX,OAAO,CAACY,cAAc,CAAE;IACrCC,QAAQ,EAAIC,SAAS,IAAMN,QAAQ,GAAIM,SAAU,CAAC;IAClDP,YAAY;IACZE;EACD,CAAE,CAAC;EAEH,oBAAOL,IAAA,CAACH,aAAa;IAAA,GAAMS,SAAS;IAAGC,KAAK,EAAGA;EAAO,CAAE,CAAC;AAC1D;AAEAN,qBAAqB,CAACH,IAAI,GAAGA,IAAI;AAEjC,eAAeG,qBAAqB","ignoreList":[]}
|
|
@@ -15,9 +15,11 @@ export function CustomSelectItem({
|
|
|
15
15
|
children,
|
|
16
16
|
...props
|
|
17
17
|
}) {
|
|
18
|
+
var _customSelectContext$;
|
|
18
19
|
const customSelectContext = useContext(CustomSelectContext);
|
|
19
20
|
return /*#__PURE__*/_jsxs(Styled.SelectItem, {
|
|
20
21
|
store: customSelectContext?.store,
|
|
22
|
+
size: (_customSelectContext$ = customSelectContext?.size) !== null && _customSelectContext$ !== void 0 ? _customSelectContext$ : 'default',
|
|
21
23
|
...props,
|
|
22
24
|
children: [children !== null && children !== void 0 ? children : props.value, /*#__PURE__*/_jsx(Styled.SelectedItemCheck, {
|
|
23
25
|
children: /*#__PURE__*/_jsx(Icon, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useContext","Icon","check","Styled","CustomSelectContext","jsx","_jsx","jsxs","_jsxs","CustomSelectItem","children","props","customSelectContext","SelectItem","store","value","SelectedItemCheck","icon","displayName"],"sources":["@wordpress/components/src/custom-select-control-v2/item.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\nimport { Icon, check } from '@wordpress/icons';\n/**\n * Internal dependencies\n */\nimport type { CustomSelectItemProps } from './types';\nimport type { WordPressComponentProps } from '../context';\nimport * as Styled from './styles';\nimport { CustomSelectContext } from './custom-select';\n\nexport function CustomSelectItem( {\n\tchildren,\n\t...props\n}: WordPressComponentProps< CustomSelectItemProps, 'div', false > ) {\n\tconst customSelectContext = useContext( CustomSelectContext );\n\treturn (\n\t\t<Styled.SelectItem store={ customSelectContext?.
|
|
1
|
+
{"version":3,"names":["useContext","Icon","check","Styled","CustomSelectContext","jsx","_jsx","jsxs","_jsxs","CustomSelectItem","children","props","_customSelectContext$","customSelectContext","SelectItem","store","size","value","SelectedItemCheck","icon","displayName"],"sources":["@wordpress/components/src/custom-select-control-v2/item.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\nimport { Icon, check } from '@wordpress/icons';\n/**\n * Internal dependencies\n */\nimport type { CustomSelectItemProps } from './types';\nimport type { WordPressComponentProps } from '../context';\nimport * as Styled from './styles';\nimport { CustomSelectContext } from './custom-select';\n\nexport function CustomSelectItem( {\n\tchildren,\n\t...props\n}: WordPressComponentProps< CustomSelectItemProps, 'div', false > ) {\n\tconst customSelectContext = useContext( CustomSelectContext );\n\treturn (\n\t\t<Styled.SelectItem\n\t\t\tstore={ customSelectContext?.store }\n\t\t\tsize={ customSelectContext?.size ?? 'default' }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children ?? props.value }\n\t\t\t<Styled.SelectedItemCheck>\n\t\t\t\t<Icon icon={ check } />\n\t\t\t</Styled.SelectedItemCheck>\n\t\t</Styled.SelectItem>\n\t);\n}\n\nCustomSelectItem.displayName = 'CustomSelectControlV2.Item';\n\nexport default CustomSelectItem;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,UAAU,QAAQ,oBAAoB;AAC/C,SAASC,IAAI,EAAEC,KAAK,QAAQ,kBAAkB;AAC9C;AACA;AACA;;AAGA,OAAO,KAAKC,MAAM,MAAM,UAAU;AAClC,SAASC,mBAAmB,QAAQ,iBAAiB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAEtD,OAAO,SAASC,gBAAgBA,CAAE;EACjCC,QAAQ;EACR,GAAGC;AAC4D,CAAC,EAAG;EAAA,IAAAC,qBAAA;EACnE,MAAMC,mBAAmB,GAAGb,UAAU,CAAEI,mBAAoB,CAAC;EAC7D,oBACCI,KAAA,CAACL,MAAM,CAACW,UAAU;IACjBC,KAAK,EAAGF,mBAAmB,EAAEE,KAAO;IACpCC,IAAI,GAAAJ,qBAAA,GAAGC,mBAAmB,EAAEG,IAAI,cAAAJ,qBAAA,cAAAA,qBAAA,GAAI,SAAW;IAAA,GAC1CD,KAAK;IAAAD,QAAA,GAERA,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIC,KAAK,CAACM,KAAK,eACzBX,IAAA,CAACH,MAAM,CAACe,iBAAiB;MAAAR,QAAA,eACxBJ,IAAA,CAACL,IAAI;QAACkB,IAAI,EAAGjB;MAAO,CAAE;IAAC,CACE,CAAC;EAAA,CACT,CAAC;AAEtB;AAEAO,gBAAgB,CAACW,WAAW,GAAG,4BAA4B;AAE3D,eAAeX,gBAAgB","ignoreList":[]}
|