@wordpress/components 19.17.0 → 20.0.1-next.d6164808d3.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 +68 -1
- package/build/alignment-matrix-control/index.js +1 -1
- package/build/alignment-matrix-control/index.js.map +1 -1
- package/build/alignment-matrix-control/styles/alignment-matrix-control-styles.js +9 -9
- package/build/alignment-matrix-control/styles/alignment-matrix-control-styles.js.map +1 -1
- package/build/angle-picker-control/index.js +3 -0
- package/build/angle-picker-control/index.js.map +1 -1
- package/build/angle-picker-control/styles/angle-picker-control-styles.js +14 -4
- package/build/angle-picker-control/styles/angle-picker-control-styles.js.map +1 -1
- package/build/autocomplete/index.js +9 -11
- package/build/autocomplete/index.js.map +1 -1
- package/build/base-control/styles/base-control-styles.js +8 -8
- package/build/base-control/styles/base-control-styles.js.map +1 -1
- package/build/base-field/styles.js +5 -5
- package/build/base-field/styles.js.map +1 -1
- package/build/box-control/styles/box-control-visualizer-styles.js +8 -8
- package/build/box-control/styles/box-control-visualizer-styles.js.map +1 -1
- package/build/color-list-picker/index.js +16 -5
- package/build/color-list-picker/index.js.map +1 -1
- package/build/color-palette/index.js +22 -12
- package/build/color-palette/index.js.map +1 -1
- package/build/color-palette/index.native.js +3 -3
- package/build/color-palette/index.native.js.map +1 -1
- package/build/combobox-control/index.js +7 -4
- package/build/combobox-control/index.js.map +1 -1
- package/build/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/constants.js +0 -0
- package/build/custom-gradient-picker/gradient-bar/constants.js.map +1 -0
- package/build/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/control-points.js +34 -41
- package/build/custom-gradient-picker/gradient-bar/control-points.js.map +1 -0
- package/build/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/index.js +0 -1
- package/build/custom-gradient-picker/gradient-bar/index.js.map +1 -0
- package/build/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/utils.js +0 -0
- package/build/custom-gradient-picker/gradient-bar/utils.js.map +1 -0
- package/build/custom-gradient-picker/index.js +19 -4
- package/build/custom-gradient-picker/index.js.map +1 -1
- package/build/custom-select-control/index.js +21 -11
- package/build/custom-select-control/index.js.map +1 -1
- package/build/custom-select-control/styles.js +34 -0
- package/build/custom-select-control/styles.js.map +1 -0
- package/build/date-time/constants.js +9 -0
- package/build/date-time/constants.js.map +1 -0
- package/build/date-time/date/index.js +175 -186
- package/build/date-time/date/index.js.map +1 -1
- package/build/date-time/date/styles.js +59 -40
- package/build/date-time/date/styles.js.map +1 -1
- package/build/date-time/date-time/index.js +5 -2
- package/build/date-time/date-time/index.js.map +1 -1
- package/build/date-time/time/index.js +22 -17
- package/build/date-time/time/index.js.map +1 -1
- package/build/date-time/utils.js +27 -0
- package/build/date-time/utils.js.map +1 -0
- package/build/dimension-control/index.js +2 -6
- package/build/dimension-control/index.js.map +1 -1
- package/build/disabled/index.js +28 -11
- package/build/disabled/index.js.map +1 -1
- package/build/disabled/styles/disabled-styles.js +3 -3
- package/build/disabled/styles/disabled-styles.js.map +1 -1
- package/build/{swatch → disabled}/types.js +0 -0
- package/build/{swatch → disabled}/types.js.map +0 -0
- package/build/dropdown/index.js +5 -6
- package/build/dropdown/index.js.map +1 -1
- package/build/duotone-picker/custom-duotone-bar.js +2 -2
- package/build/duotone-picker/custom-duotone-bar.js.map +1 -1
- package/build/duotone-picker/duotone-picker.js +9 -1
- package/build/duotone-picker/duotone-picker.js.map +1 -1
- package/build/duotone-picker/duotone-swatch.js +13 -3
- package/build/duotone-picker/duotone-swatch.js.map +1 -1
- package/build/focal-point-picker/index.js +4 -6
- package/build/focal-point-picker/index.js.map +1 -1
- package/build/focal-point-picker/styles/focal-point-style.js +4 -4
- package/build/focal-point-picker/styles/focal-point-style.js.map +1 -1
- package/build/font-size-picker/index.js +43 -14
- package/build/font-size-picker/index.js.map +1 -1
- package/build/font-size-picker/utils.js +32 -22
- package/build/font-size-picker/utils.js.map +1 -1
- package/build/form-token-field/index.js +11 -5
- package/build/form-token-field/index.js.map +1 -1
- package/build/gradient-picker/index.js +15 -3
- package/build/gradient-picker/index.js.map +1 -1
- package/build/guide/index.js +5 -3
- package/build/guide/index.js.map +1 -1
- package/build/guide/page-control.js +3 -7
- package/build/guide/page-control.js.map +1 -1
- package/build/item-group/styles.js +10 -10
- package/build/item-group/styles.js.map +1 -1
- package/build/mobile/bottom-sheet/index.native.js +3 -6
- package/build/mobile/bottom-sheet/index.native.js.map +1 -1
- package/build/mobile/global-styles-context/utils.native.js +3 -1
- package/build/mobile/global-styles-context/utils.native.js.map +1 -1
- package/build/mobile/image/index.native.js +6 -26
- package/build/mobile/image/index.native.js.map +1 -1
- package/build/mobile/picker/index.android.js +3 -3
- package/build/mobile/picker/index.android.js.map +1 -1
- package/build/modal/index.js +1 -3
- package/build/modal/index.js.map +1 -1
- package/build/navigable-container/container.js +9 -8
- package/build/navigable-container/container.js.map +1 -1
- package/build/navigator/navigator-back-button/hook.js +0 -4
- package/build/navigator/navigator-back-button/hook.js.map +1 -1
- package/build/navigator/navigator-button/hook.js +0 -4
- package/build/navigator/navigator-button/hook.js.map +1 -1
- package/build/notice/list.js +10 -6
- package/build/notice/list.js.map +1 -1
- package/build/palette-edit/index.js +1 -0
- package/build/palette-edit/index.js.map +1 -1
- package/build/palette-edit/styles.js +10 -10
- package/build/palette-edit/styles.js.map +1 -1
- package/build/popover/index.js +100 -97
- package/build/popover/index.js.map +1 -1
- package/build/popover/utils.js +178 -0
- package/build/popover/utils.js.map +1 -0
- package/build/range-control/index.js +3 -0
- package/build/range-control/index.js.map +1 -1
- package/build/range-control/styles/range-control-styles.js +43 -37
- package/build/range-control/styles/range-control-styles.js.map +1 -1
- package/build/select-control/chevron-down.js +30 -0
- package/build/select-control/chevron-down.js.map +1 -0
- package/build/select-control/index.js +7 -7
- package/build/select-control/index.js.map +1 -1
- package/build/select-control/styles/select-control-styles.js +30 -15
- package/build/select-control/styles/select-control-styles.js.map +1 -1
- package/build/snackbar/list.js +5 -3
- package/build/snackbar/list.js.map +1 -1
- package/build/spinner/index.js +2 -0
- package/build/spinner/index.js.map +1 -1
- package/build/text/styles.js +7 -7
- package/build/text/styles.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control/component.js +16 -8
- package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control/styles.js +7 -5
- package/build/toggle-group-control/toggle-group-control/styles.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control-option/component.js +15 -5
- package/build/toggle-group-control/toggle-group-control-option/component.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control-option-base/component.js +5 -1
- package/build/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control-option-base/styles.js +20 -7
- package/build/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control-option-icon/component.js +26 -7
- package/build/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
- package/build/tools-panel/styles.js +11 -11
- package/build/tools-panel/styles.js.map +1 -1
- package/build/ui/context/context-connect.js +1 -3
- package/build/ui/context/context-connect.js.map +1 -1
- package/build/unit-control/index.js +2 -3
- package/build/unit-control/index.js.map +1 -1
- package/build/utils/colors-values.js +52 -142
- package/build/utils/colors-values.js.map +1 -1
- package/build/utils/config-values.js +1 -1
- package/build/utils/config-values.js.map +1 -1
- package/build/utils/input/input-control.js +1 -1
- package/build/utils/input/input-control.js.map +1 -1
- package/build/utils/rtl.js +6 -5
- package/build/utils/rtl.js.map +1 -1
- package/build/utils/strings.js +50 -0
- package/build/utils/strings.js.map +1 -0
- package/build-module/alignment-matrix-control/index.js +1 -1
- package/build-module/alignment-matrix-control/index.js.map +1 -1
- package/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js +9 -9
- package/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js.map +1 -1
- package/build-module/angle-picker-control/index.js +3 -0
- package/build-module/angle-picker-control/index.js.map +1 -1
- package/build-module/angle-picker-control/styles/angle-picker-control-styles.js +13 -4
- package/build-module/angle-picker-control/styles/angle-picker-control-styles.js.map +1 -1
- package/build-module/autocomplete/index.js +9 -10
- package/build-module/autocomplete/index.js.map +1 -1
- package/build-module/base-control/styles/base-control-styles.js +8 -8
- package/build-module/base-control/styles/base-control-styles.js.map +1 -1
- package/build-module/base-field/styles.js +5 -5
- package/build-module/base-field/styles.js.map +1 -1
- package/build-module/box-control/styles/box-control-visualizer-styles.js +8 -8
- package/build-module/box-control/styles/box-control-visualizer-styles.js.map +1 -1
- package/build-module/color-list-picker/index.js +13 -5
- package/build-module/color-list-picker/index.js.map +1 -1
- package/build-module/color-palette/index.js +22 -11
- package/build-module/color-palette/index.js.map +1 -1
- package/build-module/color-palette/index.native.js +4 -4
- package/build-module/color-palette/index.native.js.map +1 -1
- package/build-module/combobox-control/index.js +6 -3
- package/build-module/combobox-control/index.js.map +1 -1
- package/build-module/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/constants.js +0 -0
- package/build-module/custom-gradient-picker/gradient-bar/constants.js.map +1 -0
- package/build-module/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/control-points.js +34 -41
- package/build-module/custom-gradient-picker/gradient-bar/control-points.js.map +1 -0
- package/build-module/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/index.js +0 -1
- package/build-module/custom-gradient-picker/gradient-bar/index.js.map +1 -0
- package/build-module/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/utils.js +0 -0
- package/build-module/custom-gradient-picker/gradient-bar/utils.js.map +1 -0
- package/build-module/custom-gradient-picker/index.js +16 -3
- package/build-module/custom-gradient-picker/index.js.map +1 -1
- package/build-module/custom-select-control/index.js +20 -12
- package/build-module/custom-select-control/index.js.map +1 -1
- package/build-module/custom-select-control/styles.js +22 -0
- package/build-module/custom-select-control/styles.js.map +1 -0
- package/build-module/date-time/constants.js +2 -0
- package/build-module/date-time/constants.js.map +1 -0
- package/build-module/date-time/date/index.js +178 -184
- package/build-module/date-time/date/index.js.map +1 -1
- package/build-module/date-time/date/styles.js +47 -38
- package/build-module/date-time/date/styles.js.map +1 -1
- package/build-module/date-time/date-time/index.js +4 -2
- package/build-module/date-time/date-time/index.js.map +1 -1
- package/build-module/date-time/time/index.js +20 -16
- package/build-module/date-time/time/index.js.map +1 -1
- package/build-module/date-time/utils.js +19 -0
- package/build-module/date-time/utils.js.map +1 -0
- package/build-module/dimension-control/index.js +1 -5
- package/build-module/dimension-control/index.js.map +1 -1
- package/build-module/disabled/index.js +28 -11
- package/build-module/disabled/index.js.map +1 -1
- package/build-module/disabled/styles/disabled-styles.js +3 -3
- package/build-module/disabled/styles/disabled-styles.js.map +1 -1
- package/build-module/{swatch → disabled}/types.js +0 -0
- package/build-module/{swatch → disabled}/types.js.map +0 -0
- package/build-module/dropdown/index.js +5 -6
- package/build-module/dropdown/index.js.map +1 -1
- package/build-module/duotone-picker/custom-duotone-bar.js +1 -1
- package/build-module/duotone-picker/custom-duotone-bar.js.map +1 -1
- package/build-module/duotone-picker/duotone-picker.js +7 -1
- package/build-module/duotone-picker/duotone-picker.js.map +1 -1
- package/build-module/duotone-picker/duotone-swatch.js +11 -3
- package/build-module/duotone-picker/duotone-swatch.js.map +1 -1
- package/build-module/focal-point-picker/index.js +4 -5
- package/build-module/focal-point-picker/index.js.map +1 -1
- package/build-module/focal-point-picker/styles/focal-point-style.js +4 -4
- package/build-module/focal-point-picker/styles/focal-point-style.js.map +1 -1
- package/build-module/font-size-picker/index.js +39 -14
- package/build-module/font-size-picker/index.js.map +1 -1
- package/build-module/font-size-picker/utils.js +31 -23
- package/build-module/font-size-picker/utils.js.map +1 -1
- package/build-module/form-token-field/index.js +12 -6
- package/build-module/form-token-field/index.js.map +1 -1
- package/build-module/gradient-picker/index.js +14 -3
- package/build-module/gradient-picker/index.js.map +1 -1
- package/build-module/guide/index.js +5 -3
- package/build-module/guide/index.js.map +1 -1
- package/build-module/guide/page-control.js +3 -6
- package/build-module/guide/page-control.js.map +1 -1
- package/build-module/item-group/styles.js +10 -10
- package/build-module/item-group/styles.js.map +1 -1
- package/build-module/mobile/bottom-sheet/index.native.js +3 -5
- package/build-module/mobile/bottom-sheet/index.native.js.map +1 -1
- package/build-module/mobile/global-styles-context/utils.native.js +2 -1
- package/build-module/mobile/global-styles-context/utils.native.js.map +1 -1
- package/build-module/mobile/image/index.native.js +8 -28
- package/build-module/mobile/image/index.native.js.map +1 -1
- package/build-module/mobile/picker/index.android.js +3 -3
- package/build-module/mobile/picker/index.android.js.map +1 -1
- package/build-module/modal/index.js +1 -2
- package/build-module/modal/index.js.map +1 -1
- package/build-module/navigable-container/container.js +9 -7
- package/build-module/navigable-container/container.js.map +1 -1
- package/build-module/navigator/navigator-back-button/hook.js +0 -4
- package/build-module/navigator/navigator-back-button/hook.js.map +1 -1
- package/build-module/navigator/navigator-button/hook.js +0 -4
- package/build-module/navigator/navigator-button/hook.js.map +1 -1
- package/build-module/notice/list.js +10 -5
- package/build-module/notice/list.js.map +1 -1
- package/build-module/palette-edit/index.js +1 -0
- package/build-module/palette-edit/index.js.map +1 -1
- package/build-module/palette-edit/styles.js +10 -10
- package/build-module/palette-edit/styles.js.map +1 -1
- package/build-module/popover/index.js +100 -98
- package/build-module/popover/index.js.map +1 -1
- package/build-module/popover/utils.js +164 -0
- package/build-module/popover/utils.js.map +1 -0
- package/build-module/range-control/index.js +3 -0
- package/build-module/range-control/index.js.map +1 -1
- package/build-module/range-control/styles/range-control-styles.js +43 -37
- package/build-module/range-control/styles/range-control-styles.js.map +1 -1
- package/build-module/select-control/chevron-down.js +21 -0
- package/build-module/select-control/chevron-down.js.map +1 -0
- package/build-module/select-control/index.js +7 -7
- package/build-module/select-control/index.js.map +1 -1
- package/build-module/select-control/styles/select-control-styles.js +24 -13
- package/build-module/select-control/styles/select-control-styles.js.map +1 -1
- package/build-module/snackbar/list.js +5 -2
- package/build-module/snackbar/list.js.map +1 -1
- package/build-module/spinner/index.js +2 -0
- package/build-module/spinner/index.js.map +1 -1
- package/build-module/text/styles.js +7 -7
- package/build-module/text/styles.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control/component.js +14 -7
- package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control/styles.js +5 -4
- package/build-module/toggle-group-control/toggle-group-control/styles.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control-option/component.js +17 -3
- package/build-module/toggle-group-control/toggle-group-control-option/component.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control-option-base/component.js +5 -1
- package/build-module/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js +16 -6
- package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js +27 -5
- package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
- package/build-module/tools-panel/styles.js +11 -11
- package/build-module/tools-panel/styles.js.map +1 -1
- package/build-module/ui/context/context-connect.js +1 -2
- package/build-module/ui/context/context-connect.js.map +1 -1
- package/build-module/unit-control/index.js +2 -2
- package/build-module/unit-control/index.js.map +1 -1
- package/build-module/utils/colors-values.js +52 -141
- package/build-module/utils/colors-values.js.map +1 -1
- package/build-module/utils/config-values.js +1 -1
- package/build-module/utils/config-values.js.map +1 -1
- package/build-module/utils/input/input-control.js +1 -1
- package/build-module/utils/input/input-control.js.map +1 -1
- package/build-module/utils/rtl.js +6 -4
- package/build-module/utils/rtl.js.map +1 -1
- package/build-module/utils/strings.js +37 -0
- package/build-module/utils/strings.js.map +1 -0
- package/build-style/style-rtl.css +176 -1227
- package/build-style/style.css +171 -1225
- package/build-types/color-palette/index.d.ts +2 -1
- package/build-types/color-palette/index.d.ts.map +1 -1
- package/build-types/color-picker/styles.d.ts +2 -2
- package/build-types/date-time/constants.d.ts +2 -0
- package/build-types/date-time/constants.d.ts.map +1 -0
- package/build-types/date-time/date/index.d.ts +3 -1
- package/build-types/date-time/date/index.d.ts.map +1 -1
- package/build-types/date-time/date/styles.d.ts +22 -8
- package/build-types/date-time/date/styles.d.ts.map +1 -1
- package/build-types/date-time/date/test/index.d.ts +1 -1
- package/build-types/date-time/date/test/index.d.ts.map +1 -1
- package/build-types/date-time/date-time/index.d.ts.map +1 -1
- package/build-types/date-time/time/index.d.ts.map +1 -1
- package/build-types/date-time/utils.d.ts +8 -0
- package/build-types/date-time/utils.d.ts.map +1 -0
- package/build-types/disabled/index.d.ts +35 -28
- package/build-types/disabled/index.d.ts.map +1 -1
- package/build-types/disabled/stories/index.d.ts +13 -0
- package/build-types/disabled/stories/index.d.ts.map +1 -0
- package/build-types/disabled/styles/disabled-styles.d.ts +2 -1
- package/build-types/disabled/styles/disabled-styles.d.ts.map +1 -1
- package/build-types/disabled/test/index.d.ts +2 -0
- package/build-types/{flyout/flyout → disabled/test}/index.d.ts.map +1 -1
- package/build-types/disabled/types.d.ts +14 -0
- package/build-types/disabled/types.d.ts.map +1 -0
- package/build-types/dropdown/index.d.ts.map +1 -1
- package/build-types/form-token-field/index.d.ts.map +1 -1
- package/build-types/form-token-field/stories/index.d.ts +1 -0
- package/build-types/form-token-field/stories/index.d.ts.map +1 -1
- package/build-types/form-token-field/types.d.ts +7 -0
- package/build-types/form-token-field/types.d.ts.map +1 -1
- package/build-types/navigator/navigator-back-button/hook.d.ts +0 -3
- package/build-types/navigator/navigator-back-button/hook.d.ts.map +1 -1
- package/build-types/navigator/navigator-button/hook.d.ts +0 -3
- package/build-types/navigator/navigator-button/hook.d.ts.map +1 -1
- package/build-types/placeholder/test/index.d.ts +2 -0
- package/build-types/{flyout → placeholder/test}/index.d.ts.map +1 -1
- package/build-types/popover/index.d.ts +1 -1
- package/build-types/popover/index.d.ts.map +1 -1
- package/build-types/popover/utils.d.ts +26 -69
- package/build-types/popover/utils.d.ts.map +1 -1
- package/build-types/range-control/index.d.ts +2 -2
- package/build-types/range-control/index.d.ts.map +1 -1
- package/build-types/range-control/styles/range-control-styles.d.ts +5 -2
- package/build-types/range-control/styles/range-control-styles.d.ts.map +1 -1
- package/build-types/range-control/types.d.ts +2 -2
- package/build-types/range-control/types.d.ts.map +1 -1
- package/build-types/select-control/chevron-down.d.ts +4 -0
- package/build-types/select-control/chevron-down.d.ts.map +1 -0
- package/build-types/select-control/index.d.ts.map +1 -1
- package/build-types/select-control/styles/select-control-styles.d.ts +8 -0
- package/build-types/select-control/styles/select-control-styles.d.ts.map +1 -1
- package/build-types/spinner/index.d.ts.map +1 -1
- package/build-types/toggle-group-control/stories/index.d.ts +25 -0
- package/build-types/toggle-group-control/stories/index.d.ts.map +1 -0
- package/build-types/toggle-group-control/test/index.d.ts +2 -0
- package/build-types/toggle-group-control/test/index.d.ts.map +1 -0
- package/build-types/toggle-group-control/toggle-group-control/component.d.ts +6 -3
- package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control/styles.d.ts +1 -0
- package/build-types/toggle-group-control/toggle-group-control/styles.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control-option/component.d.ts +6 -7
- package/build-types/toggle-group-control/toggle-group-control-option/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/toggle-group-control/toggle-group-control-option-base/styles.d.ts +4 -0
- package/build-types/toggle-group-control/toggle-group-control-option-base/styles.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts +11 -9
- package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts.map +1 -1
- package/build-types/toggle-group-control/types.d.ts +23 -10
- package/build-types/toggle-group-control/types.d.ts.map +1 -1
- package/build-types/ui/context/context-connect.d.ts +3 -0
- package/build-types/ui/context/context-connect.d.ts.map +1 -1
- package/build-types/ui/form-group/use-form-group.d.ts +2 -2
- package/build-types/unit-control/index.d.ts +2 -1
- package/build-types/unit-control/index.d.ts.map +1 -1
- package/build-types/unit-control/types.d.ts +5 -1
- package/build-types/unit-control/types.d.ts.map +1 -1
- package/build-types/utils/colors-values.d.ts +18 -97
- package/build-types/utils/colors-values.d.ts.map +1 -1
- package/build-types/utils/rtl.d.ts.map +1 -1
- package/build-types/utils/strings.d.ts +2 -0
- package/build-types/utils/strings.d.ts.map +1 -0
- package/package.json +22 -21
- package/src/alignment-matrix-control/index.js +1 -1
- package/src/alignment-matrix-control/stories/index.js +49 -24
- package/src/alignment-matrix-control/styles/alignment-matrix-control-styles.js +1 -3
- package/src/angle-picker-control/index.js +7 -1
- package/src/angle-picker-control/stories/index.js +8 -5
- package/src/angle-picker-control/styles/angle-picker-control-styles.js +12 -3
- package/src/autocomplete/index.js +9 -18
- package/src/base-control/styles/base-control-styles.ts +1 -1
- package/src/base-field/styles.js +1 -1
- package/src/base-field/test/__snapshots__/index.js.snap +2 -2
- package/src/box-control/styles/box-control-visualizer-styles.js +0 -1
- package/src/box-control/test/index.js +8 -8
- package/src/button/test/index.js +188 -146
- package/src/color-list-picker/index.js +15 -3
- package/src/color-list-picker/style.scss +11 -0
- package/src/color-palette/index.js +32 -16
- package/src/color-palette/index.native.js +10 -6
- package/src/color-palette/stories/index.js +1 -1
- package/src/color-palette/test/__snapshots__/index.js.snap +17 -3
- package/src/combobox-control/index.js +6 -5
- package/src/combobox-control/stories/index.js +9 -3
- package/src/combobox-control/style.scss +0 -1
- package/src/confirm-dialog/test/index.js +85 -62
- package/src/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/constants.js +0 -0
- package/src/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/control-points.js +54 -50
- package/src/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/index.js +0 -3
- package/src/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/test/utils.js +0 -0
- package/src/{custom-gradient-bar → custom-gradient-picker/gradient-bar}/utils.js +0 -0
- package/src/custom-gradient-picker/index.js +18 -3
- package/src/custom-gradient-picker/stories/index.js +4 -3
- package/src/custom-gradient-picker/style.scss +30 -27
- package/src/custom-select-control/README.md +10 -0
- package/src/custom-select-control/index.js +22 -16
- package/src/custom-select-control/stories/index.js +1 -1
- package/src/custom-select-control/style.scss +0 -12
- package/src/custom-select-control/styles.ts +28 -0
- package/src/custom-select-control/test/index.js +4 -1
- package/src/date-time/constants.ts +1 -0
- package/src/date-time/date/index.tsx +289 -184
- package/src/date-time/date/styles.ts +86 -27
- package/src/date-time/date/test/index.tsx +18 -28
- package/src/date-time/date-time/index.tsx +3 -2
- package/src/date-time/time/index.tsx +23 -19
- package/src/date-time/utils.ts +17 -0
- package/src/dimension-control/index.js +1 -5
- package/src/disabled/index.tsx +80 -0
- package/src/disabled/stories/index.tsx +87 -0
- package/src/disabled/styles/{disabled-styles.js → disabled-styles.tsx} +0 -0
- package/src/disabled/test/index.tsx +174 -0
- package/src/disabled/types.ts +13 -0
- package/src/dropdown/index.js +3 -5
- package/src/dropdown-menu/stories/index.js +13 -2
- package/src/duotone-picker/custom-duotone-bar.js +1 -1
- package/src/duotone-picker/duotone-picker.js +34 -26
- package/src/duotone-picker/duotone-swatch.js +12 -5
- package/src/duotone-picker/stories/duotone-picker.js +66 -0
- package/src/duotone-picker/stories/duotone-swatch.js +32 -0
- package/src/focal-point-picker/index.js +10 -5
- package/src/focal-point-picker/styles/focal-point-style.js +0 -1
- package/src/focal-point-picker/test/index.js +78 -45
- package/src/font-size-picker/index.js +161 -144
- package/src/font-size-picker/stories/index.js +1 -0
- package/src/font-size-picker/style.scss +8 -5
- package/src/font-size-picker/test/index.js +13 -6
- package/src/font-size-picker/test/{util.js → utils.js} +77 -1
- package/src/font-size-picker/utils.js +38 -23
- package/src/form-token-field/README.md +1 -0
- package/src/form-token-field/index.tsx +24 -10
- package/src/form-token-field/stories/index.tsx +8 -0
- package/src/form-token-field/test/index.js +31 -0
- package/src/form-token-field/types.ts +7 -0
- package/src/gradient-picker/index.js +22 -7
- package/src/gradient-picker/stories/index.js +56 -81
- package/src/guide/index.js +3 -1
- package/src/guide/page-control.js +1 -6
- package/src/guide/stories/index.js +12 -11
- package/src/guide/test/index.js +54 -37
- package/src/guide/test/page-control.js +14 -17
- package/src/higher-order/with-notices/test/index.js +4 -2
- package/src/higher-order/with-spoken-messages/test/index.js +1 -1
- package/src/item-group/styles.ts +3 -3
- package/src/menu-group/test/index.js +18 -7
- package/src/mobile/bottom-sheet/index.native.js +2 -4
- package/src/mobile/global-styles-context/utils.native.js +2 -1
- package/src/mobile/image/index.native.js +9 -30
- package/src/mobile/picker/index.android.js +10 -4
- package/src/mobile/picker/styles.native.scss +4 -4
- package/src/modal/index.js +1 -2
- package/src/modal/test/index.js +11 -9
- package/src/navigable-container/container.js +12 -18
- package/src/navigable-container/test/menu.js +14 -11
- package/src/navigator/navigator-back-button/hook.ts +0 -3
- package/src/navigator/navigator-button/hook.ts +0 -3
- package/src/notice/list.js +12 -10
- package/src/palette-edit/index.js +1 -0
- package/src/palette-edit/styles.js +6 -5
- package/src/placeholder/README.md +1 -1
- package/src/placeholder/style.scss +65 -20
- package/src/placeholder/test/index.tsx +174 -0
- package/src/popover/index.js +133 -112
- package/src/popover/stories/index.js +17 -3
- package/src/popover/test/__snapshots__/index.js.snap +6 -6
- package/src/popover/test/index.js +129 -36
- package/src/popover/utils.js +107 -0
- package/src/range-control/index.tsx +3 -0
- package/src/range-control/styles/range-control-styles.ts +9 -4
- package/src/range-control/types.ts +5 -2
- package/src/select-control/chevron-down.tsx +25 -0
- package/src/select-control/index.tsx +6 -9
- package/src/select-control/styles/select-control-styles.ts +23 -14
- package/src/slot-fill/test/slot.js +5 -5
- package/src/snackbar/list.js +3 -2
- package/src/spinner/index.tsx +2 -0
- package/src/style.scss +0 -2
- package/src/text/styles.js +1 -1
- package/src/text/test/index.tsx +1 -1
- package/src/toggle-group-control/stories/index.tsx +127 -0
- package/src/toggle-group-control/test/__snapshots__/{index.js.snap → index.tsx.snap} +28 -22
- package/src/toggle-group-control/test/{index.js → index.tsx} +2 -4
- package/src/toggle-group-control/toggle-group-control/README.md +2 -0
- package/src/toggle-group-control/toggle-group-control/component.tsx +18 -9
- package/src/toggle-group-control/toggle-group-control/styles.ts +9 -6
- package/src/toggle-group-control/toggle-group-control-option/component.tsx +19 -3
- package/src/toggle-group-control/toggle-group-control-option-base/component.tsx +3 -0
- package/src/toggle-group-control/toggle-group-control-option-base/styles.ts +18 -0
- package/src/toggle-group-control/toggle-group-control-option-icon/README.md +6 -8
- package/src/toggle-group-control/toggle-group-control-option-icon/component.tsx +30 -7
- package/src/toggle-group-control/types.ts +74 -59
- package/src/toolbar/test/index.js +4 -4
- package/src/toolbar-group/test/index.js +9 -15
- package/src/tools-panel/styles.ts +2 -2
- package/src/tools-panel/test/index.js +3 -2
- package/src/tooltip/test/index.js +188 -172
- package/src/ui/context/context-connect.ts +3 -2
- package/src/unit-control/index.tsx +2 -2
- package/src/unit-control/types.ts +10 -1
- package/src/utils/colors-values.js +42 -137
- package/src/utils/config-values.js +1 -1
- package/src/utils/input/input-control.js +6 -6
- package/src/utils/rtl.js +6 -2
- package/src/utils/strings.ts +72 -0
- package/src/utils/test/strings.js +15 -0
- package/tsconfig.json +0 -1
- package/tsconfig.tsbuildinfo +1 -1
- package/build/custom-gradient-bar/constants.js.map +0 -1
- package/build/custom-gradient-bar/control-points.js.map +0 -1
- package/build/custom-gradient-bar/index.js.map +0 -1
- package/build/custom-gradient-bar/utils.js.map +0 -1
- package/build/date-time/date/utils.js +0 -34
- package/build/date-time/date/utils.js.map +0 -1
- package/build/swatch/index.js +0 -41
- package/build/swatch/index.js.map +0 -1
- package/build-module/custom-gradient-bar/constants.js.map +0 -1
- package/build-module/custom-gradient-bar/control-points.js.map +0 -1
- package/build-module/custom-gradient-bar/index.js.map +0 -1
- package/build-module/custom-gradient-bar/utils.js.map +0 -1
- package/build-module/date-time/date/utils.js +0 -22
- package/build-module/date-time/date/utils.js.map +0 -1
- package/build-module/swatch/index.js +0 -30
- package/build-module/swatch/index.js.map +0 -1
- package/build-types/color-picker/color-display.d.ts +0 -13
- package/build-types/color-picker/color-display.d.ts.map +0 -1
- package/build-types/date-time/date/test/utils.d.ts +0 -2
- package/build-types/date-time/date/test/utils.d.ts.map +0 -1
- package/build-types/date-time/date/utils.d.ts +0 -15
- package/build-types/date-time/date/utils.d.ts.map +0 -1
- package/build-types/flyout/context.d.ts +0 -6
- package/build-types/flyout/context.d.ts.map +0 -1
- package/build-types/flyout/flyout/component.d.ts +0 -21
- package/build-types/flyout/flyout/component.d.ts.map +0 -1
- package/build-types/flyout/flyout/hook.d.ts +0 -270
- package/build-types/flyout/flyout/hook.d.ts.map +0 -1
- package/build-types/flyout/flyout/index.d.ts +0 -3
- package/build-types/flyout/flyout-content/component.d.ts +0 -3
- package/build-types/flyout/flyout-content/component.d.ts.map +0 -1
- package/build-types/flyout/flyout-content/index.d.ts +0 -2
- package/build-types/flyout/flyout-content/index.d.ts.map +0 -1
- package/build-types/flyout/index.d.ts +0 -2
- package/build-types/flyout/styles.d.ts +0 -22
- package/build-types/flyout/styles.d.ts.map +0 -1
- package/build-types/flyout/types.d.ts +0 -80
- package/build-types/flyout/types.d.ts.map +0 -1
- package/build-types/flyout/utils.d.ts +0 -8
- package/build-types/flyout/utils.d.ts.map +0 -1
- package/build-types/swatch/index.d.ts +0 -5
- package/build-types/swatch/index.d.ts.map +0 -1
- package/build-types/swatch/types.d.ts +0 -11
- package/build-types/swatch/types.d.ts.map +0 -1
- package/build-types/utils/hooks/use-combined-ref.d.ts +0 -8
- package/build-types/utils/hooks/use-combined-ref.d.ts.map +0 -1
- package/src/date-time/date/datepicker.scss +0 -863
- package/src/date-time/date/style.scss +0 -85
- package/src/date-time/date/test/utils.ts +0 -32
- package/src/date-time/date/utils.ts +0 -20
- package/src/date-time/style.scss +0 -1
- package/src/disabled/index.js +0 -55
- package/src/disabled/stories/index.js +0 -61
- package/src/disabled/test/index.js +0 -240
- package/src/menu-group/test/__snapshots__/index.js.snap +0 -23
- package/src/placeholder/test/index.js +0 -163
- package/src/swatch/index.tsx +0 -22
- package/src/swatch/style.scss +0 -21
- package/src/swatch/types.ts +0 -11
- package/src/toggle-group-control/stories/index.js +0 -203
- package/src/tools-panel/test/__snapshots__/index.js.snap +0 -210
|
@@ -13,14 +13,22 @@ const CUSTOM_FONT_SIZE_OPTION = {
|
|
|
13
13
|
name: __('Custom')
|
|
14
14
|
};
|
|
15
15
|
/**
|
|
16
|
-
* In case we have at most five font sizes,
|
|
17
|
-
*
|
|
18
|
-
*
|
|
19
|
-
* cannot be caluclated properly and the incremental sequence of numbers as labels
|
|
20
|
-
* can help the user better mentally map the different available font sizes.
|
|
16
|
+
* In case we have at most five font sizes, show a `T-shirt size`
|
|
17
|
+
* alias as a label of the font size. The label assumes that the font sizes
|
|
18
|
+
* are ordered accordingly - from smallest to largest.
|
|
21
19
|
*/
|
|
22
20
|
|
|
23
|
-
const FONT_SIZES_ALIASES = [
|
|
21
|
+
const FONT_SIZES_ALIASES = [
|
|
22
|
+
/* translators: S stands for 'small' and is a size label. */
|
|
23
|
+
__('S'),
|
|
24
|
+
/* translators: M stands for 'medium' and is a size label. */
|
|
25
|
+
__('M'),
|
|
26
|
+
/* translators: L stands for 'large' and is a size label. */
|
|
27
|
+
__('L'),
|
|
28
|
+
/* translators: XL stands for 'extra large' and is a size label. */
|
|
29
|
+
__('XL'),
|
|
30
|
+
/* translators: XXL stands for 'extra extra large' and is a size label. */
|
|
31
|
+
__('XXL')];
|
|
24
32
|
/**
|
|
25
33
|
* Helper util to split a font size to its numeric value
|
|
26
34
|
* and its `unit`, if exists.
|
|
@@ -54,19 +62,18 @@ export function isSimpleCssValue(value) {
|
|
|
54
62
|
* Return font size options in the proper format depending
|
|
55
63
|
* on the currently used control (select, toggle group).
|
|
56
64
|
*
|
|
57
|
-
* @param {boolean} useSelectControl
|
|
58
|
-
* @param {Object[]} optionsArray
|
|
59
|
-
* @param {
|
|
60
|
-
* @
|
|
61
|
-
* @return {Object[]|null} Array of font sizes in proper format for the used control.
|
|
65
|
+
* @param {boolean} useSelectControl Whether to use a select control.
|
|
66
|
+
* @param {Object[]} optionsArray Array of available font sizes objects.
|
|
67
|
+
* @param {boolean} disableCustomFontSizes Flag that indicates if custom font sizes are disabled.
|
|
68
|
+
* @return {Object[]|null} Array of font sizes in proper format for the used control.
|
|
62
69
|
*/
|
|
63
70
|
|
|
64
|
-
export function getFontSizeOptions(useSelectControl, optionsArray, disableCustomFontSizes
|
|
71
|
+
export function getFontSizeOptions(useSelectControl, optionsArray, disableCustomFontSizes) {
|
|
65
72
|
if (disableCustomFontSizes && !optionsArray.length) {
|
|
66
73
|
return null;
|
|
67
74
|
}
|
|
68
75
|
|
|
69
|
-
return useSelectControl ? getSelectOptions(optionsArray, disableCustomFontSizes) : getToggleGroupOptions(optionsArray
|
|
76
|
+
return useSelectControl ? getSelectOptions(optionsArray, disableCustomFontSizes) : getToggleGroupOptions(optionsArray);
|
|
70
77
|
}
|
|
71
78
|
|
|
72
79
|
function getSelectOptions(optionsArray, disableCustomFontSizes) {
|
|
@@ -85,30 +92,31 @@ function getSelectOptions(optionsArray, disableCustomFontSizes) {
|
|
|
85
92
|
};
|
|
86
93
|
});
|
|
87
94
|
}
|
|
95
|
+
/**
|
|
96
|
+
* Build options for the toggle group options.
|
|
97
|
+
*
|
|
98
|
+
* @param {Array} optionsArray An array of font size options.
|
|
99
|
+
* @param {string[]} labelAliases An array of alternative labels.
|
|
100
|
+
* @return {Array} Remapped optionsArray.
|
|
101
|
+
*/
|
|
102
|
+
|
|
88
103
|
|
|
89
|
-
function getToggleGroupOptions(optionsArray
|
|
104
|
+
export function getToggleGroupOptions(optionsArray) {
|
|
105
|
+
let labelAliases = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : FONT_SIZES_ALIASES;
|
|
90
106
|
return optionsArray.map((_ref2, index) => {
|
|
91
107
|
let {
|
|
92
108
|
slug,
|
|
93
109
|
size,
|
|
94
110
|
name
|
|
95
111
|
} = _ref2;
|
|
96
|
-
let label = optionsContainComplexCssValues ? FONT_SIZES_ALIASES[index] : size;
|
|
97
|
-
|
|
98
|
-
if (!optionsContainComplexCssValues && typeof size === 'string') {
|
|
99
|
-
const [numericValue] = splitValueAndUnitFromSize(size);
|
|
100
|
-
label = numericValue;
|
|
101
|
-
}
|
|
102
|
-
|
|
103
112
|
return {
|
|
104
113
|
key: slug,
|
|
105
114
|
value: size,
|
|
106
|
-
label,
|
|
115
|
+
label: labelAliases[index],
|
|
107
116
|
name
|
|
108
117
|
};
|
|
109
118
|
});
|
|
110
119
|
}
|
|
111
|
-
|
|
112
120
|
export function getSelectedOption(fontSizes, value) {
|
|
113
121
|
if (!value) {
|
|
114
122
|
return DEFAULT_FONT_SIZE_OPTION;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/font-size-picker/utils.js"],"names":["__","DEFAULT_FONT_SIZE","DEFAULT_FONT_SIZE_OPTION","slug","name","CUSTOM_FONT_SIZE","CUSTOM_FONT_SIZE_OPTION","FONT_SIZES_ALIASES","splitValueAndUnitFromSize","size","numericValue","unit","match","isNaN","parseFloat","isFinite","isSimpleCssValue","value","sizeRegex","test","getFontSizeOptions","useSelectControl","optionsArray","disableCustomFontSizes","
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/font-size-picker/utils.js"],"names":["__","DEFAULT_FONT_SIZE","DEFAULT_FONT_SIZE_OPTION","slug","name","CUSTOM_FONT_SIZE","CUSTOM_FONT_SIZE_OPTION","FONT_SIZES_ALIASES","splitValueAndUnitFromSize","size","numericValue","unit","match","isNaN","parseFloat","isFinite","isSimpleCssValue","value","sizeRegex","test","getFontSizeOptions","useSelectControl","optionsArray","disableCustomFontSizes","length","getSelectOptions","getToggleGroupOptions","options","map","key","__experimentalHint","labelAliases","index","label","getSelectedOption","fontSizes","find","font"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\nconst DEFAULT_FONT_SIZE = 'default';\nconst DEFAULT_FONT_SIZE_OPTION = {\n\tslug: DEFAULT_FONT_SIZE,\n\tname: __( 'Default' ),\n};\nexport const CUSTOM_FONT_SIZE = 'custom';\nconst CUSTOM_FONT_SIZE_OPTION = {\n\tslug: CUSTOM_FONT_SIZE,\n\tname: __( 'Custom' ),\n};\n\n/**\n * In case we have at most five font sizes, show a `T-shirt size`\n * alias as a label of the font size. The label assumes that the font sizes\n * are ordered accordingly - from smallest to largest.\n */\nconst FONT_SIZES_ALIASES = [\n\t/* translators: S stands for 'small' and is a size label. */\n\t__( 'S' ),\n\t/* translators: M stands for 'medium' and is a size label. */\n\t__( 'M' ),\n\t/* translators: L stands for 'large' and is a size label. */\n\t__( 'L' ),\n\t/* translators: XL stands for 'extra large' and is a size label. */\n\t__( 'XL' ),\n\t/* translators: XXL stands for 'extra extra large' and is a size label. */\n\t__( 'XXL' ),\n];\n\n/**\n * Helper util to split a font size to its numeric value\n * and its `unit`, if exists.\n *\n * @param {string|number} size Font size.\n * @return {[number, string]} An array with the numeric value and the unit if exists.\n */\nexport function splitValueAndUnitFromSize( size ) {\n\tconst [ numericValue, unit ] = `${ size }`.match( /[\\d\\.]+|\\D+/g );\n\n\tif ( ! isNaN( parseFloat( numericValue ) ) && isFinite( numericValue ) ) {\n\t\treturn [ numericValue, unit ];\n\t}\n\n\treturn [];\n}\n\n/**\n * Some themes use css vars for their font sizes, so until we\n * have the way of calculating them don't display them.\n *\n * @param {string|number} value The value that is checked.\n * @return {boolean} Whether the value is a simple css value.\n */\nexport function isSimpleCssValue( value ) {\n\tconst sizeRegex = /^[\\d\\.]+(px|em|rem|vw|vh|%)?$/i;\n\treturn sizeRegex.test( value );\n}\n\n/**\n * Return font size options in the proper format depending\n * on the currently used control (select, toggle group).\n *\n * @param {boolean} useSelectControl Whether to use a select control.\n * @param {Object[]} optionsArray Array of available font sizes objects.\n * @param {boolean} disableCustomFontSizes Flag that indicates if custom font sizes are disabled.\n * @return {Object[]|null} Array of font sizes in proper format for the used control.\n */\nexport function getFontSizeOptions(\n\tuseSelectControl,\n\toptionsArray,\n\tdisableCustomFontSizes\n) {\n\tif ( disableCustomFontSizes && ! optionsArray.length ) {\n\t\treturn null;\n\t}\n\treturn useSelectControl\n\t\t? getSelectOptions( optionsArray, disableCustomFontSizes )\n\t\t: getToggleGroupOptions( optionsArray );\n}\n\nfunction getSelectOptions( optionsArray, disableCustomFontSizes ) {\n\tconst options = [\n\t\tDEFAULT_FONT_SIZE_OPTION,\n\t\t...optionsArray,\n\t\t...( disableCustomFontSizes ? [] : [ CUSTOM_FONT_SIZE_OPTION ] ),\n\t];\n\treturn options.map( ( { slug, name, size } ) => ( {\n\t\tkey: slug,\n\t\tname,\n\t\tsize,\n\t\t__experimentalHint:\n\t\t\tsize && isSimpleCssValue( size ) && parseFloat( size ),\n\t} ) );\n}\n\n/**\n * Build options for the toggle group options.\n *\n * @param {Array} optionsArray An array of font size options.\n * @param {string[]} labelAliases An array of alternative labels.\n * @return {Array} Remapped optionsArray.\n */\nexport function getToggleGroupOptions(\n\toptionsArray,\n\tlabelAliases = FONT_SIZES_ALIASES\n) {\n\treturn optionsArray.map( ( { slug, size, name }, index ) => {\n\t\treturn {\n\t\t\tkey: slug,\n\t\t\tvalue: size,\n\t\t\tlabel: labelAliases[ index ],\n\t\t\tname,\n\t\t};\n\t} );\n}\n\nexport function getSelectedOption( fontSizes, value ) {\n\tif ( ! value ) {\n\t\treturn DEFAULT_FONT_SIZE_OPTION;\n\t}\n\treturn (\n\t\tfontSizes.find( ( font ) => font.size === value ) ||\n\t\tCUSTOM_FONT_SIZE_OPTION\n\t);\n}\n"]}
|
|
@@ -4,7 +4,7 @@ import { createElement } from "@wordpress/element";
|
|
|
4
4
|
/**
|
|
5
5
|
* External dependencies
|
|
6
6
|
*/
|
|
7
|
-
import { last, clone,
|
|
7
|
+
import { last, clone, map, some } from 'lodash';
|
|
8
8
|
import classnames from 'classnames';
|
|
9
9
|
|
|
10
10
|
/**
|
|
@@ -69,7 +69,8 @@ export function FormTokenField(props) {
|
|
|
69
69
|
__experimentalExpandOnFocus = false,
|
|
70
70
|
__experimentalValidateInput = () => true,
|
|
71
71
|
__experimentalShowHowTo = true,
|
|
72
|
-
__next36pxDefaultSize = false
|
|
72
|
+
__next36pxDefaultSize = false,
|
|
73
|
+
__experimentalAutoSelectFirstMatch = false
|
|
73
74
|
} = props;
|
|
74
75
|
const instanceId = useInstanceId(FormTokenField); // We reset to these initial values again in the onBlur
|
|
75
76
|
|
|
@@ -387,7 +388,7 @@ export function FormTokenField(props) {
|
|
|
387
388
|
}
|
|
388
389
|
|
|
389
390
|
function addNewTokens(tokens) {
|
|
390
|
-
const tokensToAdd =
|
|
391
|
+
const tokensToAdd = [...new Set(tokens.map(saveTransform).filter(Boolean).filter(token => !valueContainsToken(token)))];
|
|
391
392
|
|
|
392
393
|
if (tokensToAdd.length > 0) {
|
|
393
394
|
const newValue = clone(value);
|
|
@@ -455,7 +456,7 @@ export function FormTokenField(props) {
|
|
|
455
456
|
});
|
|
456
457
|
|
|
457
458
|
if (match.length === 0) {
|
|
458
|
-
_suggestions =
|
|
459
|
+
_suggestions = _suggestions.filter(suggestion => !normalizedValue.includes(suggestion));
|
|
459
460
|
} else {
|
|
460
461
|
match = match.toLocaleLowerCase();
|
|
461
462
|
|
|
@@ -511,8 +512,13 @@ export function FormTokenField(props) {
|
|
|
511
512
|
setIsExpanded(__experimentalExpandOnFocus || inputHasMinimumChars && hasMatchingSuggestions);
|
|
512
513
|
|
|
513
514
|
if (resetSelectedSuggestion) {
|
|
514
|
-
|
|
515
|
-
|
|
515
|
+
if (__experimentalAutoSelectFirstMatch && inputHasMinimumChars && hasMatchingSuggestions) {
|
|
516
|
+
setSelectedSuggestionIndex(0);
|
|
517
|
+
setSelectedSuggestionScroll(true);
|
|
518
|
+
} else {
|
|
519
|
+
setSelectedSuggestionIndex(-1);
|
|
520
|
+
setSelectedSuggestionScroll(false);
|
|
521
|
+
}
|
|
516
522
|
}
|
|
517
523
|
|
|
518
524
|
if (inputHasMinimumChars) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/form-token-field/index.tsx"],"names":["last","clone","uniq","map","difference","some","classnames","useEffect","useRef","useState","__","_n","sprintf","useDebounce","useInstanceId","usePrevious","speak","BACKSPACE","ENTER","UP","DOWN","LEFT","RIGHT","SPACE","DELETE","ESCAPE","isShallowEqual","Token","TokenInput","TokensAndInputWrapperFlex","SuggestionsList","FlexItem","StyledLabel","identity","value","FormTokenField","props","autoCapitalize","autoComplete","maxLength","placeholder","label","className","suggestions","maxSuggestions","displayTransform","saveTransform","token","trim","onChange","onInputChange","onFocus","undefined","isBorderless","disabled","tokenizeOnSpace","messages","added","removed","remove","__experimentalInvalid","__experimentalRenderItem","__experimentalExpandOnFocus","__experimentalValidateInput","__experimentalShowHowTo","__next36pxDefaultSize","instanceId","incompleteTokenValue","setIncompleteTokenValue","inputOffsetFromEnd","setInputOffsetFromEnd","isActive","setIsActive","isExpanded","setIsExpanded","selectedSuggestionIndex","setSelectedSuggestionIndex","selectedSuggestionScroll","setSelectedSuggestionScroll","prevSuggestions","prevValue","input","tokensAndInput","debouncedSpeak","hasFocus","focus","suggestionsDidUpdate","updateSuggestions","current","ownerDocument","activeElement","onFocusHandler","event","target","onBlur","inputHasValidValue","onKeyDown","preventDefault","defaultPrevented","keyCode","handleDeleteKey","deleteTokenBeforeInput","addCurrentToken","handleLeftArrowKey","handleUpArrowKey","handleRightArrowKey","handleDownArrowKey","deleteTokenAfterInput","handleEscapeKey","onKeyPress","charCode","handleCommaKey","onContainerTouched","onTokenClickRemove","deleteToken","onSuggestionHovered","suggestion","index","getMatchingSuggestions","indexOf","onSuggestionSelected","addNewToken","onInputChangeHandler","text","separator","items","split","tokenValue","length","addNewTokens","slice","_deleteToken","isInputEmpty","moveInputBeforePreviousToken","moveInputAfterNextToken","HTMLInputElement","moveInputToIndex","Math","max","prevInputOffsetFromEnd","min","getIndexOfInput","selectedSuggestion","getSelectedSuggestion","tokens","tokensToAdd","filter","Boolean","valueContainsToken","newValue","splice","newTokens","item","getTokenValue","searchValue","_suggestions","_value","_maxSuggestions","_saveTransform","match","startsWithMatch","containsMatch","normalizedValue","toLocaleLowerCase","forEach","push","concat","resetSelectedSuggestion","inputHasMinimumChars","matchingSuggestions","hasMatchingSuggestions","message","renderTokensAndInput","components","renderToken","renderInput","status","termPosition","termsCount","title","onMouseEnter","onMouseLeave","inputProps","key","classes","tokenFieldProps","tabIndex","Object","assign"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { last, clone, uniq, map, difference, some } from 'lodash';\nimport classnames from 'classnames';\nimport type { KeyboardEvent, MouseEvent, TouchEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { useDebounce, useInstanceId, usePrevious } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport {\n\tBACKSPACE,\n\tENTER,\n\tUP,\n\tDOWN,\n\tLEFT,\n\tRIGHT,\n\tSPACE,\n\tDELETE,\n\tESCAPE,\n} from '@wordpress/keycodes';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport Token from './token';\nimport TokenInput from './token-input';\nimport { TokensAndInputWrapperFlex } from './styles';\nimport SuggestionsList from './suggestions-list';\nimport type { FormTokenFieldProps, TokenItem } from './types';\nimport { FlexItem } from '../flex';\nimport { StyledLabel } from '../base-control/styles/base-control-styles';\n\nconst identity = ( value: string ) => value;\n\n/**\n * A `FormTokenField` is a field similar to the tags and categories fields in the interim editor chrome,\n * or the \"to\" field in Mail on OS X. Tokens can be entered by typing them or selecting them from a list of suggested tokens.\n *\n * Up to one hundred suggestions that match what the user has typed so far will be shown from which the user can pick from (auto-complete).\n * Tokens are separated by the \",\" character. Suggestions can be selected with the up or down arrows and added with the tab or enter key.\n *\n * The `value` property is handled in a manner similar to controlled form components.\n * See [Forms](http://facebook.github.io/react/docs/forms.html) in the React Documentation for more information.\n */\nexport function FormTokenField( props: FormTokenFieldProps ) {\n\tconst {\n\t\tautoCapitalize,\n\t\tautoComplete,\n\t\tmaxLength,\n\t\tplaceholder,\n\t\tlabel = __( 'Add item' ),\n\t\tclassName,\n\t\tsuggestions = [],\n\t\tmaxSuggestions = 100,\n\t\tvalue = [],\n\t\tdisplayTransform = identity,\n\t\tsaveTransform = ( token ) => token.trim(),\n\t\tonChange = () => {},\n\t\tonInputChange = () => {},\n\t\tonFocus = undefined,\n\t\tisBorderless = false,\n\t\tdisabled = false,\n\t\ttokenizeOnSpace = false,\n\t\tmessages = {\n\t\t\tadded: __( 'Item added.' ),\n\t\t\tremoved: __( 'Item removed.' ),\n\t\t\tremove: __( 'Remove item' ),\n\t\t\t__experimentalInvalid: __( 'Invalid item' ),\n\t\t},\n\t\t__experimentalRenderItem,\n\t\t__experimentalExpandOnFocus = false,\n\t\t__experimentalValidateInput = () => true,\n\t\t__experimentalShowHowTo = true,\n\t\t__next36pxDefaultSize = false,\n\t} = props;\n\n\tconst instanceId = useInstanceId( FormTokenField );\n\n\t// We reset to these initial values again in the onBlur\n\tconst [ incompleteTokenValue, setIncompleteTokenValue ] = useState( '' );\n\tconst [ inputOffsetFromEnd, setInputOffsetFromEnd ] = useState( 0 );\n\tconst [ isActive, setIsActive ] = useState( false );\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ selectedSuggestionIndex, setSelectedSuggestionIndex ] =\n\t\tuseState( -1 );\n\tconst [ selectedSuggestionScroll, setSelectedSuggestionScroll ] =\n\t\tuseState( false );\n\n\tconst prevSuggestions = usePrevious< string[] >( suggestions );\n\tconst prevValue = usePrevious< ( string | TokenItem )[] >( value );\n\n\tconst input = useRef< HTMLInputElement >( null );\n\tconst tokensAndInput = useRef< HTMLInputElement >( null );\n\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\n\tuseEffect( () => {\n\t\t// Make sure to focus the input when the isActive state is true.\n\t\tif ( isActive && ! hasFocus() ) {\n\t\t\tfocus();\n\t\t}\n\t}, [ isActive ] );\n\n\tuseEffect( () => {\n\t\tconst suggestionsDidUpdate = ! isShallowEqual(\n\t\t\tsuggestions,\n\t\t\tprevSuggestions || []\n\t\t);\n\n\t\tif ( suggestionsDidUpdate || value !== prevValue ) {\n\t\t\tupdateSuggestions( suggestionsDidUpdate );\n\t\t}\n\n\t\t// TODO: updateSuggestions() should first be refactored so its actual deps are clearer.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ suggestions, prevSuggestions, value, prevValue ] );\n\n\tuseEffect( () => {\n\t\tupdateSuggestions();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ incompleteTokenValue ] );\n\n\tif ( disabled && isActive ) {\n\t\tsetIsActive( false );\n\t\tsetIncompleteTokenValue( '' );\n\t}\n\n\tfunction focus() {\n\t\tinput.current?.focus();\n\t}\n\n\tfunction hasFocus() {\n\t\treturn input.current === input.current?.ownerDocument.activeElement;\n\t}\n\n\tfunction onFocusHandler( event: FocusEvent ) {\n\t\t// If focus is on the input or on the container, set the isActive state to true.\n\t\tif ( hasFocus() || event.target === tokensAndInput.current ) {\n\t\t\tsetIsActive( true );\n\t\t\tsetIsExpanded( __experimentalExpandOnFocus || isExpanded );\n\t\t} else {\n\t\t\t/*\n\t\t\t * Otherwise, focus is on one of the token \"remove\" buttons and we\n\t\t\t * set the isActive state to false to prevent the input to be\n\t\t\t * re-focused, see componentDidUpdate().\n\t\t\t */\n\t\t\tsetIsActive( false );\n\t\t}\n\n\t\tif ( 'function' === typeof onFocus ) {\n\t\t\tonFocus( event );\n\t\t}\n\t}\n\n\tfunction onBlur() {\n\t\tif ( inputHasValidValue() ) {\n\t\t\tsetIsActive( false );\n\t\t} else {\n\t\t\t// Reset to initial state\n\t\t\tsetIncompleteTokenValue( '' );\n\t\t\tsetInputOffsetFromEnd( 0 );\n\t\t\tsetIsActive( false );\n\t\t\tsetIsExpanded( false );\n\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\t}\n\n\tfunction onKeyDown( event: KeyboardEvent ) {\n\t\tlet preventDefault = false;\n\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\t\t// TODO: replace to event.code;\n\t\tswitch ( event.keyCode ) {\n\t\t\tcase BACKSPACE:\n\t\t\t\tpreventDefault = handleDeleteKey( deleteTokenBeforeInput );\n\t\t\t\tbreak;\n\t\t\tcase ENTER:\n\t\t\t\tpreventDefault = addCurrentToken();\n\t\t\t\tbreak;\n\t\t\tcase LEFT:\n\t\t\t\tpreventDefault = handleLeftArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase UP:\n\t\t\t\tpreventDefault = handleUpArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase RIGHT:\n\t\t\t\tpreventDefault = handleRightArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase DOWN:\n\t\t\t\tpreventDefault = handleDownArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase DELETE:\n\t\t\t\tpreventDefault = handleDeleteKey( deleteTokenAfterInput );\n\t\t\t\tbreak;\n\t\t\tcase SPACE:\n\t\t\t\tif ( tokenizeOnSpace ) {\n\t\t\t\t\tpreventDefault = addCurrentToken();\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\tcase ESCAPE:\n\t\t\t\tpreventDefault = handleEscapeKey( event );\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onKeyPress( event: KeyboardEvent ) {\n\t\tlet preventDefault = false;\n\t\t// TODO: replace to event.code;\n\t\tswitch ( event.charCode ) {\n\t\t\tcase 44: // Comma.\n\t\t\t\tpreventDefault = handleCommaKey();\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onContainerTouched( event: MouseEvent | TouchEvent ) {\n\t\t// Prevent clicking/touching the tokensAndInput container from blurring\n\t\t// the input and adding the current token.\n\t\tif ( event.target === tokensAndInput.current && isActive ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onTokenClickRemove( event: { value: string } ) {\n\t\tdeleteToken( event.value );\n\t\tfocus();\n\t}\n\n\tfunction onSuggestionHovered( suggestion: string ) {\n\t\tconst index = getMatchingSuggestions().indexOf( suggestion );\n\n\t\tif ( index >= 0 ) {\n\t\t\tsetSelectedSuggestionIndex( index );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\t}\n\n\tfunction onSuggestionSelected( suggestion: string ) {\n\t\taddNewToken( suggestion );\n\t}\n\n\tfunction onInputChangeHandler( event: { value: string } ) {\n\t\tconst text = event.value;\n\t\tconst separator = tokenizeOnSpace ? /[ ,\\t]+/ : /[,\\t]+/;\n\t\tconst items = text.split( separator );\n\t\tconst tokenValue = last( items ) || '';\n\n\t\tif ( items.length > 1 ) {\n\t\t\taddNewTokens( items.slice( 0, -1 ) );\n\t\t}\n\t\tsetIncompleteTokenValue( tokenValue );\n\t\tonInputChange( tokenValue );\n\t}\n\n\tfunction handleDeleteKey( _deleteToken: () => void ) {\n\t\tlet preventDefault = false;\n\t\tif ( hasFocus() && isInputEmpty() ) {\n\t\t\t_deleteToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleLeftArrowKey() {\n\t\tlet preventDefault = false;\n\t\tif ( isInputEmpty() ) {\n\t\t\tmoveInputBeforePreviousToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleRightArrowKey() {\n\t\tlet preventDefault = false;\n\t\tif ( isInputEmpty() ) {\n\t\t\tmoveInputAfterNextToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleUpArrowKey() {\n\t\tsetSelectedSuggestionIndex( ( index ) => {\n\t\t\treturn (\n\t\t\t\t( index === 0\n\t\t\t\t\t? getMatchingSuggestions(\n\t\t\t\t\t\t\tincompleteTokenValue,\n\t\t\t\t\t\t\tsuggestions,\n\t\t\t\t\t\t\tvalue,\n\t\t\t\t\t\t\tmaxSuggestions,\n\t\t\t\t\t\t\tsaveTransform\n\t\t\t\t\t ).length\n\t\t\t\t\t: index ) - 1\n\t\t\t);\n\t\t} );\n\t\tsetSelectedSuggestionScroll( true );\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleDownArrowKey() {\n\t\tsetSelectedSuggestionIndex( ( index ) => {\n\t\t\treturn (\n\t\t\t\t( index + 1 ) %\n\t\t\t\tgetMatchingSuggestions(\n\t\t\t\t\tincompleteTokenValue,\n\t\t\t\t\tsuggestions,\n\t\t\t\t\tvalue,\n\t\t\t\t\tmaxSuggestions,\n\t\t\t\t\tsaveTransform\n\t\t\t\t).length\n\t\t\t);\n\t\t} );\n\n\t\tsetSelectedSuggestionScroll( true );\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleEscapeKey( event: KeyboardEvent ) {\n\t\tif ( event.target instanceof HTMLInputElement ) {\n\t\t\tsetIncompleteTokenValue( event.target.value );\n\t\t\tsetIsExpanded( false );\n\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleCommaKey() {\n\t\tif ( inputHasValidValue() ) {\n\t\t\taddNewToken( incompleteTokenValue );\n\t\t}\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction moveInputToIndex( index: number ) {\n\t\tsetInputOffsetFromEnd( value.length - Math.max( index, -1 ) - 1 );\n\t}\n\n\tfunction moveInputBeforePreviousToken() {\n\t\tsetInputOffsetFromEnd( ( prevInputOffsetFromEnd ) => {\n\t\t\treturn Math.min( prevInputOffsetFromEnd + 1, value.length );\n\t\t} );\n\t}\n\n\tfunction moveInputAfterNextToken() {\n\t\tsetInputOffsetFromEnd( ( prevInputOffsetFromEnd ) => {\n\t\t\treturn Math.max( prevInputOffsetFromEnd - 1, 0 );\n\t\t} );\n\t}\n\n\tfunction deleteTokenBeforeInput() {\n\t\tconst index = getIndexOfInput() - 1;\n\n\t\tif ( index > -1 ) {\n\t\t\tdeleteToken( value[ index ] );\n\t\t}\n\t}\n\n\tfunction deleteTokenAfterInput() {\n\t\tconst index = getIndexOfInput();\n\n\t\tif ( index < value.length ) {\n\t\t\tdeleteToken( value[ index ] );\n\t\t\t// Update input offset since it's the offset from the last token.\n\t\t\tmoveInputToIndex( index );\n\t\t}\n\t}\n\n\tfunction addCurrentToken() {\n\t\tlet preventDefault = false;\n\t\tconst selectedSuggestion = getSelectedSuggestion();\n\n\t\tif ( selectedSuggestion ) {\n\t\t\taddNewToken( selectedSuggestion );\n\t\t\tpreventDefault = true;\n\t\t} else if ( inputHasValidValue() ) {\n\t\t\taddNewToken( incompleteTokenValue );\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction addNewTokens( tokens: string[] ) {\n\t\tconst tokensToAdd = uniq(\n\t\t\ttokens\n\t\t\t\t.map( saveTransform )\n\t\t\t\t.filter( Boolean )\n\t\t\t\t.filter( ( token ) => ! valueContainsToken( token ) )\n\t\t);\n\n\t\tif ( tokensToAdd.length > 0 ) {\n\t\t\tconst newValue = clone( value );\n\t\t\tnewValue.splice( getIndexOfInput(), 0, ...tokensToAdd );\n\t\t\tonChange( newValue );\n\t\t}\n\t}\n\n\tfunction addNewToken( token: string ) {\n\t\tif ( ! __experimentalValidateInput( token ) ) {\n\t\t\tspeak( messages.__experimentalInvalid, 'assertive' );\n\t\t\treturn;\n\t\t}\n\t\taddNewTokens( [ token ] );\n\t\tspeak( messages.added, 'assertive' );\n\n\t\tsetIncompleteTokenValue( '' );\n\t\tsetSelectedSuggestionIndex( -1 );\n\t\tsetSelectedSuggestionScroll( false );\n\t\tsetIsExpanded( ! __experimentalExpandOnFocus );\n\n\t\tif ( isActive ) {\n\t\t\tfocus();\n\t\t}\n\t}\n\n\tfunction deleteToken( token: string | TokenItem ) {\n\t\tconst newTokens = value.filter( ( item ) => {\n\t\t\treturn getTokenValue( item ) !== getTokenValue( token );\n\t\t} );\n\t\tonChange( newTokens );\n\t\tspeak( messages.removed, 'assertive' );\n\t}\n\n\tfunction getTokenValue( token: { value: string } | string ) {\n\t\tif ( 'object' === typeof token ) {\n\t\t\treturn token.value;\n\t\t}\n\n\t\treturn token;\n\t}\n\n\tfunction getMatchingSuggestions(\n\t\tsearchValue = incompleteTokenValue,\n\t\t_suggestions = suggestions,\n\t\t_value = value,\n\t\t_maxSuggestions = maxSuggestions,\n\t\t_saveTransform = saveTransform\n\t) {\n\t\tlet match = _saveTransform( searchValue );\n\t\tconst startsWithMatch: string[] = [];\n\t\tconst containsMatch: string[] = [];\n\t\tconst normalizedValue = _value.map( ( item ) => {\n\t\t\tif ( typeof item === 'string' ) {\n\t\t\t\treturn item;\n\t\t\t}\n\t\t\treturn item.value;\n\t\t} );\n\n\t\tif ( match.length === 0 ) {\n\t\t\t_suggestions = difference( _suggestions, normalizedValue );\n\t\t} else {\n\t\t\tmatch = match.toLocaleLowerCase();\n\n\t\t\t_suggestions.forEach( ( suggestion ) => {\n\t\t\t\tconst index = suggestion.toLocaleLowerCase().indexOf( match );\n\t\t\t\tif ( normalizedValue.indexOf( suggestion ) === -1 ) {\n\t\t\t\t\tif ( index === 0 ) {\n\t\t\t\t\t\tstartsWithMatch.push( suggestion );\n\t\t\t\t\t} else if ( index > 0 ) {\n\t\t\t\t\t\tcontainsMatch.push( suggestion );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\t_suggestions = startsWithMatch.concat( containsMatch );\n\t\t}\n\n\t\treturn _suggestions.slice( 0, _maxSuggestions );\n\t}\n\n\tfunction getSelectedSuggestion() {\n\t\tif ( selectedSuggestionIndex !== -1 ) {\n\t\t\treturn getMatchingSuggestions()[ selectedSuggestionIndex ];\n\t\t}\n\n\t\treturn undefined;\n\t}\n\n\tfunction valueContainsToken( token: string ) {\n\t\treturn some( value, ( item ) => {\n\t\t\treturn getTokenValue( token ) === getTokenValue( item );\n\t\t} );\n\t}\n\n\tfunction getIndexOfInput() {\n\t\treturn value.length - inputOffsetFromEnd;\n\t}\n\n\tfunction isInputEmpty() {\n\t\treturn incompleteTokenValue.length === 0;\n\t}\n\n\tfunction inputHasValidValue() {\n\t\treturn saveTransform( incompleteTokenValue ).length > 0;\n\t}\n\n\tfunction updateSuggestions( resetSelectedSuggestion = true ) {\n\t\tconst inputHasMinimumChars = incompleteTokenValue.trim().length > 1;\n\t\tconst matchingSuggestions =\n\t\t\tgetMatchingSuggestions( incompleteTokenValue );\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\n\t\tsetIsExpanded(\n\t\t\t__experimentalExpandOnFocus ||\n\t\t\t\t( inputHasMinimumChars && hasMatchingSuggestions )\n\t\t);\n\n\t\tif ( resetSelectedSuggestion ) {\n\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\n\t\tif ( inputHasMinimumChars ) {\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\tdebouncedSpeak( message, 'assertive' );\n\t\t}\n\t}\n\n\tfunction renderTokensAndInput() {\n\t\tconst components = map( value, renderToken );\n\t\tcomponents.splice( getIndexOfInput(), 0, renderInput() );\n\n\t\treturn components;\n\t}\n\n\tfunction renderToken(\n\t\ttoken: string | TokenItem,\n\t\tindex: number,\n\t\ttokens: ( string | TokenItem )[]\n\t) {\n\t\tconst _value = getTokenValue( token );\n\t\tconst status = typeof token !== 'string' ? token.status : undefined;\n\t\tconst termPosition = index + 1;\n\t\tconst termsCount = tokens.length;\n\n\t\treturn (\n\t\t\t<FlexItem key={ 'token-' + _value }>\n\t\t\t\t<Token\n\t\t\t\t\tvalue={ _value }\n\t\t\t\t\tstatus={ status }\n\t\t\t\t\ttitle={\n\t\t\t\t\t\ttypeof token !== 'string' ? token.title : undefined\n\t\t\t\t\t}\n\t\t\t\t\tdisplayTransform={ displayTransform }\n\t\t\t\t\tonClickRemove={ onTokenClickRemove }\n\t\t\t\t\tisBorderless={\n\t\t\t\t\t\t( typeof token !== 'string' && token.isBorderless ) ||\n\t\t\t\t\t\tisBorderless\n\t\t\t\t\t}\n\t\t\t\t\tonMouseEnter={\n\t\t\t\t\t\ttypeof token !== 'string'\n\t\t\t\t\t\t\t? token.onMouseEnter\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tonMouseLeave={\n\t\t\t\t\t\ttypeof token !== 'string'\n\t\t\t\t\t\t\t? token.onMouseLeave\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tdisabled={ 'error' !== status && disabled }\n\t\t\t\t\tmessages={ messages }\n\t\t\t\t\ttermsCount={ termsCount }\n\t\t\t\t\ttermPosition={ termPosition }\n\t\t\t\t/>\n\t\t\t</FlexItem>\n\t\t);\n\t}\n\n\tfunction renderInput() {\n\t\tconst inputProps = {\n\t\t\tinstanceId,\n\t\t\tautoCapitalize,\n\t\t\tautoComplete,\n\t\t\tplaceholder: value.length === 0 ? placeholder : '',\n\t\t\tkey: 'input',\n\t\t\tdisabled,\n\t\t\tvalue: incompleteTokenValue,\n\t\t\tonBlur,\n\t\t\tisExpanded,\n\t\t\tselectedSuggestionIndex,\n\t\t};\n\n\t\treturn (\n\t\t\t<TokenInput\n\t\t\t\t{ ...inputProps }\n\t\t\t\tonChange={\n\t\t\t\t\t! ( maxLength && value.length >= maxLength )\n\t\t\t\t\t\t? onInputChangeHandler\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\tref={ input }\n\t\t\t/>\n\t\t);\n\t}\n\n\tconst classes = classnames(\n\t\tclassName,\n\t\t'components-form-token-field__input-container',\n\t\t{\n\t\t\t'is-active': isActive,\n\t\t\t'is-disabled': disabled,\n\t\t}\n\t);\n\n\tlet tokenFieldProps = {\n\t\tclassName: 'components-form-token-field',\n\t\ttabIndex: -1,\n\t};\n\tconst matchingSuggestions = getMatchingSuggestions();\n\n\tif ( ! disabled ) {\n\t\ttokenFieldProps = Object.assign( {}, tokenFieldProps, {\n\t\t\tonKeyDown,\n\t\t\tonKeyPress,\n\t\t\tonFocus: onFocusHandler,\n\t\t} );\n\t}\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<div { ...tokenFieldProps }>\n\t\t\t<StyledLabel\n\t\t\t\thtmlFor={ `components-form-token-input-${ instanceId }` }\n\t\t\t\tclassName=\"components-form-token-field__label\"\n\t\t\t>\n\t\t\t\t{ label }\n\t\t\t</StyledLabel>\n\t\t\t<div\n\t\t\t\tref={ tokensAndInput }\n\t\t\t\tclassName={ classes }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t\tonMouseDown={ onContainerTouched }\n\t\t\t\tonTouchStart={ onContainerTouched }\n\t\t\t>\n\t\t\t\t<TokensAndInputWrapperFlex\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\talign=\"center\"\n\t\t\t\t\tgap={ 1 }\n\t\t\t\t\twrap={ true }\n\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\thasTokens={ !! value.length }\n\t\t\t\t>\n\t\t\t\t\t{ renderTokensAndInput() }\n\t\t\t\t</TokensAndInputWrapperFlex>\n\t\t\t\t{ isExpanded && (\n\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\tmatch={ saveTransform( incompleteTokenValue ) }\n\t\t\t\t\t\tdisplayTransform={ displayTransform }\n\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\tselectedIndex={ selectedSuggestionIndex }\n\t\t\t\t\t\tscrollIntoView={ selectedSuggestionScroll }\n\t\t\t\t\t\tonHover={ onSuggestionHovered }\n\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t__experimentalRenderItem={ __experimentalRenderItem }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t\t{ __experimentalShowHowTo && (\n\t\t\t\t<p\n\t\t\t\t\tid={ `components-form-token-suggestions-howto-${ instanceId }` }\n\t\t\t\t\tclassName=\"components-form-token-field__help\"\n\t\t\t\t>\n\t\t\t\t\t{ tokenizeOnSpace\n\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t'Separate with commas, spaces, or the Enter key.'\n\t\t\t\t\t\t )\n\t\t\t\t\t\t: __( 'Separate with commas or the Enter key.' ) }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</div>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default FormTokenField;\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/form-token-field/index.tsx"],"names":["last","clone","map","some","classnames","useEffect","useRef","useState","__","_n","sprintf","useDebounce","useInstanceId","usePrevious","speak","BACKSPACE","ENTER","UP","DOWN","LEFT","RIGHT","SPACE","DELETE","ESCAPE","isShallowEqual","Token","TokenInput","TokensAndInputWrapperFlex","SuggestionsList","FlexItem","StyledLabel","identity","value","FormTokenField","props","autoCapitalize","autoComplete","maxLength","placeholder","label","className","suggestions","maxSuggestions","displayTransform","saveTransform","token","trim","onChange","onInputChange","onFocus","undefined","isBorderless","disabled","tokenizeOnSpace","messages","added","removed","remove","__experimentalInvalid","__experimentalRenderItem","__experimentalExpandOnFocus","__experimentalValidateInput","__experimentalShowHowTo","__next36pxDefaultSize","__experimentalAutoSelectFirstMatch","instanceId","incompleteTokenValue","setIncompleteTokenValue","inputOffsetFromEnd","setInputOffsetFromEnd","isActive","setIsActive","isExpanded","setIsExpanded","selectedSuggestionIndex","setSelectedSuggestionIndex","selectedSuggestionScroll","setSelectedSuggestionScroll","prevSuggestions","prevValue","input","tokensAndInput","debouncedSpeak","hasFocus","focus","suggestionsDidUpdate","updateSuggestions","current","ownerDocument","activeElement","onFocusHandler","event","target","onBlur","inputHasValidValue","onKeyDown","preventDefault","defaultPrevented","keyCode","handleDeleteKey","deleteTokenBeforeInput","addCurrentToken","handleLeftArrowKey","handleUpArrowKey","handleRightArrowKey","handleDownArrowKey","deleteTokenAfterInput","handleEscapeKey","onKeyPress","charCode","handleCommaKey","onContainerTouched","onTokenClickRemove","deleteToken","onSuggestionHovered","suggestion","index","getMatchingSuggestions","indexOf","onSuggestionSelected","addNewToken","onInputChangeHandler","text","separator","items","split","tokenValue","length","addNewTokens","slice","_deleteToken","isInputEmpty","moveInputBeforePreviousToken","moveInputAfterNextToken","HTMLInputElement","moveInputToIndex","Math","max","prevInputOffsetFromEnd","min","getIndexOfInput","selectedSuggestion","getSelectedSuggestion","tokens","tokensToAdd","Set","filter","Boolean","valueContainsToken","newValue","splice","newTokens","item","getTokenValue","searchValue","_suggestions","_value","_maxSuggestions","_saveTransform","match","startsWithMatch","containsMatch","normalizedValue","includes","toLocaleLowerCase","forEach","push","concat","resetSelectedSuggestion","inputHasMinimumChars","matchingSuggestions","hasMatchingSuggestions","message","renderTokensAndInput","components","renderToken","renderInput","status","termPosition","termsCount","title","onMouseEnter","onMouseLeave","inputProps","key","classes","tokenFieldProps","tabIndex","Object","assign"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { last, clone, map, some } from 'lodash';\nimport classnames from 'classnames';\nimport type { KeyboardEvent, MouseEvent, TouchEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { useDebounce, useInstanceId, usePrevious } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport {\n\tBACKSPACE,\n\tENTER,\n\tUP,\n\tDOWN,\n\tLEFT,\n\tRIGHT,\n\tSPACE,\n\tDELETE,\n\tESCAPE,\n} from '@wordpress/keycodes';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport Token from './token';\nimport TokenInput from './token-input';\nimport { TokensAndInputWrapperFlex } from './styles';\nimport SuggestionsList from './suggestions-list';\nimport type { FormTokenFieldProps, TokenItem } from './types';\nimport { FlexItem } from '../flex';\nimport { StyledLabel } from '../base-control/styles/base-control-styles';\n\nconst identity = ( value: string ) => value;\n\n/**\n * A `FormTokenField` is a field similar to the tags and categories fields in the interim editor chrome,\n * or the \"to\" field in Mail on OS X. Tokens can be entered by typing them or selecting them from a list of suggested tokens.\n *\n * Up to one hundred suggestions that match what the user has typed so far will be shown from which the user can pick from (auto-complete).\n * Tokens are separated by the \",\" character. Suggestions can be selected with the up or down arrows and added with the tab or enter key.\n *\n * The `value` property is handled in a manner similar to controlled form components.\n * See [Forms](http://facebook.github.io/react/docs/forms.html) in the React Documentation for more information.\n */\nexport function FormTokenField( props: FormTokenFieldProps ) {\n\tconst {\n\t\tautoCapitalize,\n\t\tautoComplete,\n\t\tmaxLength,\n\t\tplaceholder,\n\t\tlabel = __( 'Add item' ),\n\t\tclassName,\n\t\tsuggestions = [],\n\t\tmaxSuggestions = 100,\n\t\tvalue = [],\n\t\tdisplayTransform = identity,\n\t\tsaveTransform = ( token ) => token.trim(),\n\t\tonChange = () => {},\n\t\tonInputChange = () => {},\n\t\tonFocus = undefined,\n\t\tisBorderless = false,\n\t\tdisabled = false,\n\t\ttokenizeOnSpace = false,\n\t\tmessages = {\n\t\t\tadded: __( 'Item added.' ),\n\t\t\tremoved: __( 'Item removed.' ),\n\t\t\tremove: __( 'Remove item' ),\n\t\t\t__experimentalInvalid: __( 'Invalid item' ),\n\t\t},\n\t\t__experimentalRenderItem,\n\t\t__experimentalExpandOnFocus = false,\n\t\t__experimentalValidateInput = () => true,\n\t\t__experimentalShowHowTo = true,\n\t\t__next36pxDefaultSize = false,\n\t\t__experimentalAutoSelectFirstMatch = false,\n\t} = props;\n\n\tconst instanceId = useInstanceId( FormTokenField );\n\n\t// We reset to these initial values again in the onBlur\n\tconst [ incompleteTokenValue, setIncompleteTokenValue ] = useState( '' );\n\tconst [ inputOffsetFromEnd, setInputOffsetFromEnd ] = useState( 0 );\n\tconst [ isActive, setIsActive ] = useState( false );\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ selectedSuggestionIndex, setSelectedSuggestionIndex ] =\n\t\tuseState( -1 );\n\tconst [ selectedSuggestionScroll, setSelectedSuggestionScroll ] =\n\t\tuseState( false );\n\n\tconst prevSuggestions = usePrevious< string[] >( suggestions );\n\tconst prevValue = usePrevious< ( string | TokenItem )[] >( value );\n\n\tconst input = useRef< HTMLInputElement >( null );\n\tconst tokensAndInput = useRef< HTMLInputElement >( null );\n\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\n\tuseEffect( () => {\n\t\t// Make sure to focus the input when the isActive state is true.\n\t\tif ( isActive && ! hasFocus() ) {\n\t\t\tfocus();\n\t\t}\n\t}, [ isActive ] );\n\n\tuseEffect( () => {\n\t\tconst suggestionsDidUpdate = ! isShallowEqual(\n\t\t\tsuggestions,\n\t\t\tprevSuggestions || []\n\t\t);\n\n\t\tif ( suggestionsDidUpdate || value !== prevValue ) {\n\t\t\tupdateSuggestions( suggestionsDidUpdate );\n\t\t}\n\n\t\t// TODO: updateSuggestions() should first be refactored so its actual deps are clearer.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ suggestions, prevSuggestions, value, prevValue ] );\n\n\tuseEffect( () => {\n\t\tupdateSuggestions();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ incompleteTokenValue ] );\n\n\tif ( disabled && isActive ) {\n\t\tsetIsActive( false );\n\t\tsetIncompleteTokenValue( '' );\n\t}\n\n\tfunction focus() {\n\t\tinput.current?.focus();\n\t}\n\n\tfunction hasFocus() {\n\t\treturn input.current === input.current?.ownerDocument.activeElement;\n\t}\n\n\tfunction onFocusHandler( event: FocusEvent ) {\n\t\t// If focus is on the input or on the container, set the isActive state to true.\n\t\tif ( hasFocus() || event.target === tokensAndInput.current ) {\n\t\t\tsetIsActive( true );\n\t\t\tsetIsExpanded( __experimentalExpandOnFocus || isExpanded );\n\t\t} else {\n\t\t\t/*\n\t\t\t * Otherwise, focus is on one of the token \"remove\" buttons and we\n\t\t\t * set the isActive state to false to prevent the input to be\n\t\t\t * re-focused, see componentDidUpdate().\n\t\t\t */\n\t\t\tsetIsActive( false );\n\t\t}\n\n\t\tif ( 'function' === typeof onFocus ) {\n\t\t\tonFocus( event );\n\t\t}\n\t}\n\n\tfunction onBlur() {\n\t\tif ( inputHasValidValue() ) {\n\t\t\tsetIsActive( false );\n\t\t} else {\n\t\t\t// Reset to initial state\n\t\t\tsetIncompleteTokenValue( '' );\n\t\t\tsetInputOffsetFromEnd( 0 );\n\t\t\tsetIsActive( false );\n\t\t\tsetIsExpanded( false );\n\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\t}\n\n\tfunction onKeyDown( event: KeyboardEvent ) {\n\t\tlet preventDefault = false;\n\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\t\t// TODO: replace to event.code;\n\t\tswitch ( event.keyCode ) {\n\t\t\tcase BACKSPACE:\n\t\t\t\tpreventDefault = handleDeleteKey( deleteTokenBeforeInput );\n\t\t\t\tbreak;\n\t\t\tcase ENTER:\n\t\t\t\tpreventDefault = addCurrentToken();\n\t\t\t\tbreak;\n\t\t\tcase LEFT:\n\t\t\t\tpreventDefault = handleLeftArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase UP:\n\t\t\t\tpreventDefault = handleUpArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase RIGHT:\n\t\t\t\tpreventDefault = handleRightArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase DOWN:\n\t\t\t\tpreventDefault = handleDownArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase DELETE:\n\t\t\t\tpreventDefault = handleDeleteKey( deleteTokenAfterInput );\n\t\t\t\tbreak;\n\t\t\tcase SPACE:\n\t\t\t\tif ( tokenizeOnSpace ) {\n\t\t\t\t\tpreventDefault = addCurrentToken();\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\tcase ESCAPE:\n\t\t\t\tpreventDefault = handleEscapeKey( event );\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onKeyPress( event: KeyboardEvent ) {\n\t\tlet preventDefault = false;\n\t\t// TODO: replace to event.code;\n\t\tswitch ( event.charCode ) {\n\t\t\tcase 44: // Comma.\n\t\t\t\tpreventDefault = handleCommaKey();\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onContainerTouched( event: MouseEvent | TouchEvent ) {\n\t\t// Prevent clicking/touching the tokensAndInput container from blurring\n\t\t// the input and adding the current token.\n\t\tif ( event.target === tokensAndInput.current && isActive ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onTokenClickRemove( event: { value: string } ) {\n\t\tdeleteToken( event.value );\n\t\tfocus();\n\t}\n\n\tfunction onSuggestionHovered( suggestion: string ) {\n\t\tconst index = getMatchingSuggestions().indexOf( suggestion );\n\n\t\tif ( index >= 0 ) {\n\t\t\tsetSelectedSuggestionIndex( index );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\t}\n\n\tfunction onSuggestionSelected( suggestion: string ) {\n\t\taddNewToken( suggestion );\n\t}\n\n\tfunction onInputChangeHandler( event: { value: string } ) {\n\t\tconst text = event.value;\n\t\tconst separator = tokenizeOnSpace ? /[ ,\\t]+/ : /[,\\t]+/;\n\t\tconst items = text.split( separator );\n\t\tconst tokenValue = last( items ) || '';\n\n\t\tif ( items.length > 1 ) {\n\t\t\taddNewTokens( items.slice( 0, -1 ) );\n\t\t}\n\t\tsetIncompleteTokenValue( tokenValue );\n\t\tonInputChange( tokenValue );\n\t}\n\n\tfunction handleDeleteKey( _deleteToken: () => void ) {\n\t\tlet preventDefault = false;\n\t\tif ( hasFocus() && isInputEmpty() ) {\n\t\t\t_deleteToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleLeftArrowKey() {\n\t\tlet preventDefault = false;\n\t\tif ( isInputEmpty() ) {\n\t\t\tmoveInputBeforePreviousToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleRightArrowKey() {\n\t\tlet preventDefault = false;\n\t\tif ( isInputEmpty() ) {\n\t\t\tmoveInputAfterNextToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleUpArrowKey() {\n\t\tsetSelectedSuggestionIndex( ( index ) => {\n\t\t\treturn (\n\t\t\t\t( index === 0\n\t\t\t\t\t? getMatchingSuggestions(\n\t\t\t\t\t\t\tincompleteTokenValue,\n\t\t\t\t\t\t\tsuggestions,\n\t\t\t\t\t\t\tvalue,\n\t\t\t\t\t\t\tmaxSuggestions,\n\t\t\t\t\t\t\tsaveTransform\n\t\t\t\t\t ).length\n\t\t\t\t\t: index ) - 1\n\t\t\t);\n\t\t} );\n\t\tsetSelectedSuggestionScroll( true );\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleDownArrowKey() {\n\t\tsetSelectedSuggestionIndex( ( index ) => {\n\t\t\treturn (\n\t\t\t\t( index + 1 ) %\n\t\t\t\tgetMatchingSuggestions(\n\t\t\t\t\tincompleteTokenValue,\n\t\t\t\t\tsuggestions,\n\t\t\t\t\tvalue,\n\t\t\t\t\tmaxSuggestions,\n\t\t\t\t\tsaveTransform\n\t\t\t\t).length\n\t\t\t);\n\t\t} );\n\n\t\tsetSelectedSuggestionScroll( true );\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleEscapeKey( event: KeyboardEvent ) {\n\t\tif ( event.target instanceof HTMLInputElement ) {\n\t\t\tsetIncompleteTokenValue( event.target.value );\n\t\t\tsetIsExpanded( false );\n\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleCommaKey() {\n\t\tif ( inputHasValidValue() ) {\n\t\t\taddNewToken( incompleteTokenValue );\n\t\t}\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction moveInputToIndex( index: number ) {\n\t\tsetInputOffsetFromEnd( value.length - Math.max( index, -1 ) - 1 );\n\t}\n\n\tfunction moveInputBeforePreviousToken() {\n\t\tsetInputOffsetFromEnd( ( prevInputOffsetFromEnd ) => {\n\t\t\treturn Math.min( prevInputOffsetFromEnd + 1, value.length );\n\t\t} );\n\t}\n\n\tfunction moveInputAfterNextToken() {\n\t\tsetInputOffsetFromEnd( ( prevInputOffsetFromEnd ) => {\n\t\t\treturn Math.max( prevInputOffsetFromEnd - 1, 0 );\n\t\t} );\n\t}\n\n\tfunction deleteTokenBeforeInput() {\n\t\tconst index = getIndexOfInput() - 1;\n\n\t\tif ( index > -1 ) {\n\t\t\tdeleteToken( value[ index ] );\n\t\t}\n\t}\n\n\tfunction deleteTokenAfterInput() {\n\t\tconst index = getIndexOfInput();\n\n\t\tif ( index < value.length ) {\n\t\t\tdeleteToken( value[ index ] );\n\t\t\t// Update input offset since it's the offset from the last token.\n\t\t\tmoveInputToIndex( index );\n\t\t}\n\t}\n\n\tfunction addCurrentToken() {\n\t\tlet preventDefault = false;\n\t\tconst selectedSuggestion = getSelectedSuggestion();\n\n\t\tif ( selectedSuggestion ) {\n\t\t\taddNewToken( selectedSuggestion );\n\t\t\tpreventDefault = true;\n\t\t} else if ( inputHasValidValue() ) {\n\t\t\taddNewToken( incompleteTokenValue );\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction addNewTokens( tokens: string[] ) {\n\t\tconst tokensToAdd = [\n\t\t\t...new Set(\n\t\t\t\ttokens\n\t\t\t\t\t.map( saveTransform )\n\t\t\t\t\t.filter( Boolean )\n\t\t\t\t\t.filter( ( token ) => ! valueContainsToken( token ) )\n\t\t\t),\n\t\t];\n\n\t\tif ( tokensToAdd.length > 0 ) {\n\t\t\tconst newValue = clone( value );\n\t\t\tnewValue.splice( getIndexOfInput(), 0, ...tokensToAdd );\n\t\t\tonChange( newValue );\n\t\t}\n\t}\n\n\tfunction addNewToken( token: string ) {\n\t\tif ( ! __experimentalValidateInput( token ) ) {\n\t\t\tspeak( messages.__experimentalInvalid, 'assertive' );\n\t\t\treturn;\n\t\t}\n\t\taddNewTokens( [ token ] );\n\t\tspeak( messages.added, 'assertive' );\n\n\t\tsetIncompleteTokenValue( '' );\n\t\tsetSelectedSuggestionIndex( -1 );\n\t\tsetSelectedSuggestionScroll( false );\n\t\tsetIsExpanded( ! __experimentalExpandOnFocus );\n\n\t\tif ( isActive ) {\n\t\t\tfocus();\n\t\t}\n\t}\n\n\tfunction deleteToken( token: string | TokenItem ) {\n\t\tconst newTokens = value.filter( ( item ) => {\n\t\t\treturn getTokenValue( item ) !== getTokenValue( token );\n\t\t} );\n\t\tonChange( newTokens );\n\t\tspeak( messages.removed, 'assertive' );\n\t}\n\n\tfunction getTokenValue( token: { value: string } | string ) {\n\t\tif ( 'object' === typeof token ) {\n\t\t\treturn token.value;\n\t\t}\n\n\t\treturn token;\n\t}\n\n\tfunction getMatchingSuggestions(\n\t\tsearchValue = incompleteTokenValue,\n\t\t_suggestions = suggestions,\n\t\t_value = value,\n\t\t_maxSuggestions = maxSuggestions,\n\t\t_saveTransform = saveTransform\n\t) {\n\t\tlet match = _saveTransform( searchValue );\n\t\tconst startsWithMatch: string[] = [];\n\t\tconst containsMatch: string[] = [];\n\t\tconst normalizedValue = _value.map( ( item ) => {\n\t\t\tif ( typeof item === 'string' ) {\n\t\t\t\treturn item;\n\t\t\t}\n\t\t\treturn item.value;\n\t\t} );\n\n\t\tif ( match.length === 0 ) {\n\t\t\t_suggestions = _suggestions.filter(\n\t\t\t\t( suggestion ) => ! normalizedValue.includes( suggestion )\n\t\t\t);\n\t\t} else {\n\t\t\tmatch = match.toLocaleLowerCase();\n\n\t\t\t_suggestions.forEach( ( suggestion ) => {\n\t\t\t\tconst index = suggestion.toLocaleLowerCase().indexOf( match );\n\t\t\t\tif ( normalizedValue.indexOf( suggestion ) === -1 ) {\n\t\t\t\t\tif ( index === 0 ) {\n\t\t\t\t\t\tstartsWithMatch.push( suggestion );\n\t\t\t\t\t} else if ( index > 0 ) {\n\t\t\t\t\t\tcontainsMatch.push( suggestion );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\t_suggestions = startsWithMatch.concat( containsMatch );\n\t\t}\n\n\t\treturn _suggestions.slice( 0, _maxSuggestions );\n\t}\n\n\tfunction getSelectedSuggestion() {\n\t\tif ( selectedSuggestionIndex !== -1 ) {\n\t\t\treturn getMatchingSuggestions()[ selectedSuggestionIndex ];\n\t\t}\n\n\t\treturn undefined;\n\t}\n\n\tfunction valueContainsToken( token: string ) {\n\t\treturn some( value, ( item ) => {\n\t\t\treturn getTokenValue( token ) === getTokenValue( item );\n\t\t} );\n\t}\n\n\tfunction getIndexOfInput() {\n\t\treturn value.length - inputOffsetFromEnd;\n\t}\n\n\tfunction isInputEmpty() {\n\t\treturn incompleteTokenValue.length === 0;\n\t}\n\n\tfunction inputHasValidValue() {\n\t\treturn saveTransform( incompleteTokenValue ).length > 0;\n\t}\n\n\tfunction updateSuggestions( resetSelectedSuggestion = true ) {\n\t\tconst inputHasMinimumChars = incompleteTokenValue.trim().length > 1;\n\t\tconst matchingSuggestions =\n\t\t\tgetMatchingSuggestions( incompleteTokenValue );\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\n\t\tsetIsExpanded(\n\t\t\t__experimentalExpandOnFocus ||\n\t\t\t\t( inputHasMinimumChars && hasMatchingSuggestions )\n\t\t);\n\n\t\tif ( resetSelectedSuggestion ) {\n\t\t\tif (\n\t\t\t\t__experimentalAutoSelectFirstMatch &&\n\t\t\t\tinputHasMinimumChars &&\n\t\t\t\thasMatchingSuggestions\n\t\t\t) {\n\t\t\t\tsetSelectedSuggestionIndex( 0 );\n\t\t\t\tsetSelectedSuggestionScroll( true );\n\t\t\t} else {\n\t\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\t\tsetSelectedSuggestionScroll( false );\n\t\t\t}\n\t\t}\n\n\t\tif ( inputHasMinimumChars ) {\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\tdebouncedSpeak( message, 'assertive' );\n\t\t}\n\t}\n\n\tfunction renderTokensAndInput() {\n\t\tconst components = map( value, renderToken );\n\t\tcomponents.splice( getIndexOfInput(), 0, renderInput() );\n\n\t\treturn components;\n\t}\n\n\tfunction renderToken(\n\t\ttoken: string | TokenItem,\n\t\tindex: number,\n\t\ttokens: ( string | TokenItem )[]\n\t) {\n\t\tconst _value = getTokenValue( token );\n\t\tconst status = typeof token !== 'string' ? token.status : undefined;\n\t\tconst termPosition = index + 1;\n\t\tconst termsCount = tokens.length;\n\n\t\treturn (\n\t\t\t<FlexItem key={ 'token-' + _value }>\n\t\t\t\t<Token\n\t\t\t\t\tvalue={ _value }\n\t\t\t\t\tstatus={ status }\n\t\t\t\t\ttitle={\n\t\t\t\t\t\ttypeof token !== 'string' ? token.title : undefined\n\t\t\t\t\t}\n\t\t\t\t\tdisplayTransform={ displayTransform }\n\t\t\t\t\tonClickRemove={ onTokenClickRemove }\n\t\t\t\t\tisBorderless={\n\t\t\t\t\t\t( typeof token !== 'string' && token.isBorderless ) ||\n\t\t\t\t\t\tisBorderless\n\t\t\t\t\t}\n\t\t\t\t\tonMouseEnter={\n\t\t\t\t\t\ttypeof token !== 'string'\n\t\t\t\t\t\t\t? token.onMouseEnter\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tonMouseLeave={\n\t\t\t\t\t\ttypeof token !== 'string'\n\t\t\t\t\t\t\t? token.onMouseLeave\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tdisabled={ 'error' !== status && disabled }\n\t\t\t\t\tmessages={ messages }\n\t\t\t\t\ttermsCount={ termsCount }\n\t\t\t\t\ttermPosition={ termPosition }\n\t\t\t\t/>\n\t\t\t</FlexItem>\n\t\t);\n\t}\n\n\tfunction renderInput() {\n\t\tconst inputProps = {\n\t\t\tinstanceId,\n\t\t\tautoCapitalize,\n\t\t\tautoComplete,\n\t\t\tplaceholder: value.length === 0 ? placeholder : '',\n\t\t\tkey: 'input',\n\t\t\tdisabled,\n\t\t\tvalue: incompleteTokenValue,\n\t\t\tonBlur,\n\t\t\tisExpanded,\n\t\t\tselectedSuggestionIndex,\n\t\t};\n\n\t\treturn (\n\t\t\t<TokenInput\n\t\t\t\t{ ...inputProps }\n\t\t\t\tonChange={\n\t\t\t\t\t! ( maxLength && value.length >= maxLength )\n\t\t\t\t\t\t? onInputChangeHandler\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\tref={ input }\n\t\t\t/>\n\t\t);\n\t}\n\n\tconst classes = classnames(\n\t\tclassName,\n\t\t'components-form-token-field__input-container',\n\t\t{\n\t\t\t'is-active': isActive,\n\t\t\t'is-disabled': disabled,\n\t\t}\n\t);\n\n\tlet tokenFieldProps = {\n\t\tclassName: 'components-form-token-field',\n\t\ttabIndex: -1,\n\t};\n\tconst matchingSuggestions = getMatchingSuggestions();\n\n\tif ( ! disabled ) {\n\t\ttokenFieldProps = Object.assign( {}, tokenFieldProps, {\n\t\t\tonKeyDown,\n\t\t\tonKeyPress,\n\t\t\tonFocus: onFocusHandler,\n\t\t} );\n\t}\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<div { ...tokenFieldProps }>\n\t\t\t<StyledLabel\n\t\t\t\thtmlFor={ `components-form-token-input-${ instanceId }` }\n\t\t\t\tclassName=\"components-form-token-field__label\"\n\t\t\t>\n\t\t\t\t{ label }\n\t\t\t</StyledLabel>\n\t\t\t<div\n\t\t\t\tref={ tokensAndInput }\n\t\t\t\tclassName={ classes }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t\tonMouseDown={ onContainerTouched }\n\t\t\t\tonTouchStart={ onContainerTouched }\n\t\t\t>\n\t\t\t\t<TokensAndInputWrapperFlex\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\talign=\"center\"\n\t\t\t\t\tgap={ 1 }\n\t\t\t\t\twrap={ true }\n\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\thasTokens={ !! value.length }\n\t\t\t\t>\n\t\t\t\t\t{ renderTokensAndInput() }\n\t\t\t\t</TokensAndInputWrapperFlex>\n\t\t\t\t{ isExpanded && (\n\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\tmatch={ saveTransform( incompleteTokenValue ) }\n\t\t\t\t\t\tdisplayTransform={ displayTransform }\n\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\tselectedIndex={ selectedSuggestionIndex }\n\t\t\t\t\t\tscrollIntoView={ selectedSuggestionScroll }\n\t\t\t\t\t\tonHover={ onSuggestionHovered }\n\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t__experimentalRenderItem={ __experimentalRenderItem }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t\t{ __experimentalShowHowTo && (\n\t\t\t\t<p\n\t\t\t\t\tid={ `components-form-token-suggestions-howto-${ instanceId }` }\n\t\t\t\t\tclassName=\"components-form-token-field__help\"\n\t\t\t\t>\n\t\t\t\t\t{ tokenizeOnSpace\n\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t'Separate with commas, spaces, or the Enter key.'\n\t\t\t\t\t\t )\n\t\t\t\t\t\t: __( 'Separate with commas or the Enter key.' ) }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</div>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default FormTokenField;\n"]}
|
|
@@ -19,6 +19,7 @@ import CircularOptionPicker from '../circular-option-picker';
|
|
|
19
19
|
import CustomGradientPicker from '../custom-gradient-picker';
|
|
20
20
|
import { VStack } from '../v-stack';
|
|
21
21
|
import { ColorHeading } from '../color-palette/styles';
|
|
22
|
+
import { Spacer } from '../spacer';
|
|
22
23
|
|
|
23
24
|
function SingleOrigin(_ref) {
|
|
24
25
|
let {
|
|
@@ -95,6 +96,8 @@ function MultipleOrigin(_ref3) {
|
|
|
95
96
|
|
|
96
97
|
export default function GradientPicker(_ref5) {
|
|
97
98
|
let {
|
|
99
|
+
/** Start opting into the new margin-free styles that will become the default in a future version. */
|
|
100
|
+
__nextHasNoMargin = false,
|
|
98
101
|
className,
|
|
99
102
|
gradients,
|
|
100
103
|
onChange,
|
|
@@ -105,7 +108,11 @@ export default function GradientPicker(_ref5) {
|
|
|
105
108
|
__experimentalIsRenderedInSidebar
|
|
106
109
|
} = _ref5;
|
|
107
110
|
const clearGradient = useCallback(() => onChange(undefined), [onChange]);
|
|
108
|
-
const Component = __experimentalHasMultipleOrigins && gradients !== null && gradients !== void 0 && gradients.length ? MultipleOrigin : SingleOrigin;
|
|
111
|
+
const Component = __experimentalHasMultipleOrigins && gradients !== null && gradients !== void 0 && gradients.length ? MultipleOrigin : SingleOrigin; // Can be removed when deprecation period is over
|
|
112
|
+
|
|
113
|
+
const deprecatedMarginSpacerProps = !__nextHasNoMargin ? {
|
|
114
|
+
marginTop: 3
|
|
115
|
+
} : {};
|
|
109
116
|
return createElement(Component, {
|
|
110
117
|
className: className,
|
|
111
118
|
clearable: clearable,
|
|
@@ -116,11 +123,15 @@ export default function GradientPicker(_ref5) {
|
|
|
116
123
|
actions: clearable && ((gradients === null || gradients === void 0 ? void 0 : gradients.length) || !disableCustomGradients) && createElement(CircularOptionPicker.ButtonAction, {
|
|
117
124
|
onClick: clearGradient
|
|
118
125
|
}, __('Clear')),
|
|
119
|
-
content: !disableCustomGradients && createElement(
|
|
126
|
+
content: !disableCustomGradients && createElement(Spacer, _extends({
|
|
127
|
+
marginTop: gradients !== null && gradients !== void 0 && gradients.length ? 3 : 0,
|
|
128
|
+
marginBottom: 0
|
|
129
|
+
}, deprecatedMarginSpacerProps), createElement(CustomGradientPicker, {
|
|
130
|
+
__nextHasNoMargin: __nextHasNoMargin,
|
|
120
131
|
__experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
|
|
121
132
|
value: value,
|
|
122
133
|
onChange: onChange
|
|
123
|
-
})
|
|
134
|
+
}))
|
|
124
135
|
});
|
|
125
136
|
}
|
|
126
137
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/gradient-picker/index.js"],"names":["map","__","sprintf","useCallback","useMemo","CircularOptionPicker","CustomGradientPicker","VStack","ColorHeading","SingleOrigin","className","clearGradient","gradients","onChange","value","actions","content","gradientOptions","gradient","name","color","background","MultipleOrigin","index","gradientSet","length","GradientPicker","clearable","disableCustomGradients","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","undefined","Component"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,QAApB;AAEA;AACA;AACA;;AACA,SAASC,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AACA,SAASC,WAAT,EAAsBC,OAAtB,QAAqC,oBAArC;AAEA;AACA;AACA;;AACA,OAAOC,oBAAP,MAAiC,2BAAjC;AACA,OAAOC,oBAAP,MAAiC,2BAAjC;AACA,SAASC,MAAT,QAAuB,YAAvB;AACA,SAASC,YAAT,QAA6B,yBAA7B;;AAEA,SAASC,YAAT,OAQI;AAAA,MARmB;AACtBC,IAAAA,SADsB;AAEtBC,IAAAA,aAFsB;AAGtBC,IAAAA,SAHsB;AAItBC,IAAAA,QAJsB;AAKtBC,IAAAA,KALsB;AAMtBC,IAAAA,OANsB;AAOtBC,IAAAA;AAPsB,GAQnB;AACH,QAAMC,eAAe,
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/gradient-picker/index.js"],"names":["map","__","sprintf","useCallback","useMemo","CircularOptionPicker","CustomGradientPicker","VStack","ColorHeading","Spacer","SingleOrigin","className","clearGradient","gradients","onChange","value","actions","content","gradientOptions","gradient","name","color","background","MultipleOrigin","index","gradientSet","length","GradientPicker","__nextHasNoMargin","clearable","disableCustomGradients","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","undefined","Component","deprecatedMarginSpacerProps","marginTop"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,QAApB;AAEA;AACA;AACA;;AACA,SAASC,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AACA,SAASC,WAAT,EAAsBC,OAAtB,QAAqC,oBAArC;AAEA;AACA;AACA;;AACA,OAAOC,oBAAP,MAAiC,2BAAjC;AACA,OAAOC,oBAAP,MAAiC,2BAAjC;AACA,SAASC,MAAT,QAAuB,YAAvB;AACA,SAASC,YAAT,QAA6B,yBAA7B;AACA,SAASC,MAAT,QAAuB,WAAvB;;AAEA,SAASC,YAAT,OAQI;AAAA,MARmB;AACtBC,IAAAA,SADsB;AAEtBC,IAAAA,aAFsB;AAGtBC,IAAAA,SAHsB;AAItBC,IAAAA,QAJsB;AAKtBC,IAAAA,KALsB;AAMtBC,IAAAA,OANsB;AAOtBC,IAAAA;AAPsB,GAQnB;AACH,QAAMC,eAAe,GAAGd,OAAO,CAAE,MAAM;AACtC,WAAOJ,GAAG,CAAEa,SAAF,EAAa;AAAA,UAAE;AAAEM,QAAAA,QAAF;AAAYC,QAAAA;AAAZ,OAAF;AAAA,aACtB,cAAC,oBAAD,CAAsB,MAAtB;AACC,QAAA,GAAG,EAAGD,QADP;AAEC,QAAA,KAAK,EAAGA,QAFT;AAGC,QAAA,UAAU,EAAGJ,KAAK,KAAKI,QAHxB;AAIC,QAAA,WAAW,EACVC,IAAI,IACJ;AACAlB,QAAAA,OAAO,CAAED,EAAE,CAAE,mBAAF,CAAJ,EAA6BkB,QAA7B,CAPT;AASC,QAAA,KAAK,EAAG;AAAEE,UAAAA,KAAK,EAAE,iBAAT;AAA4BC,UAAAA,UAAU,EAAEH;AAAxC,SATT;AAUC,QAAA,OAAO,EACNJ,KAAK,KAAKI,QAAV,GACGP,aADH,GAEG,MAAME,QAAQ,CAAEK,QAAF,CAbnB;AAeC,sBACCC,IAAI,GACD;AACAlB,QAAAA,OAAO,CAAED,EAAE,CAAE,cAAF,CAAJ,EAAwBmB,IAAxB,CAFN,GAGD;AACAlB,QAAAA,OAAO,CAAED,EAAE,CAAE,mBAAF,CAAJ,EAA6BkB,QAA7B;AApBZ,QADsB;AAAA,KAAb,CAAV;AAyBA,GA1B8B,EA0B5B,CAAEN,SAAF,EAAaE,KAAb,EAAoBD,QAApB,EAA8BF,aAA9B,CA1B4B,CAA/B;AA2BA,SACC,cAAC,oBAAD;AACC,IAAA,SAAS,EAAGD,SADb;AAEC,IAAA,OAAO,EAAGO,eAFX;AAGC,IAAA,OAAO,EAAGF;AAHX,KAKGC,OALH,CADD;AASA;;AAED,SAASM,cAAT,QAQI;AAAA,MARqB;AACxBZ,IAAAA,SADwB;AAExBC,IAAAA,aAFwB;AAGxBC,IAAAA,SAHwB;AAIxBC,IAAAA,QAJwB;AAKxBC,IAAAA,KALwB;AAMxBC,IAAAA,OANwB;AAOxBC,IAAAA;AAPwB,GAQrB;AACH,SACC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG,CAAlB;AAAsB,IAAA,SAAS,EAAGN;AAAlC,KACGE,SAAS,CAACb,GAAV,CAAe,QAAoCwB,KAApC,KAA+C;AAAA,QAA7C;AAAEJ,MAAAA,IAAF;AAAQP,MAAAA,SAAS,EAAEY;AAAnB,KAA6C;AAC/D,WACC,cAAC,MAAD;AAAQ,MAAA,OAAO,EAAG,CAAlB;AAAsB,MAAA,GAAG,EAAGD;AAA5B,OACC,cAAC,YAAD,QAAgBJ,IAAhB,CADD,EAEC,cAAC,YAAD;AACC,MAAA,aAAa,EAAGR,aADjB;AAEC,MAAA,SAAS,EAAGa,WAFb;AAGC,MAAA,QAAQ,EAAGX,QAHZ;AAIC,MAAA,KAAK,EAAGC;AAJT,OAKQF,SAAS,CAACa,MAAV,KAAqBF,KAAK,GAAG,CAA7B,GACJ;AACAR,MAAAA,OADA;AAEAC,MAAAA;AAFA,KADI,GAKJ,EAVJ,EAFD,CADD;AAiBA,GAlBC,CADH,CADD;AAuBA;;AAED,eAAe,SAASU,cAAT,QAWX;AAAA,MAXoC;AACvC;AACAC,IAAAA,iBAAiB,GAAG,KAFmB;AAGvCjB,IAAAA,SAHuC;AAIvCE,IAAAA,SAJuC;AAKvCC,IAAAA,QALuC;AAMvCC,IAAAA,KANuC;AAOvCc,IAAAA,SAAS,GAAG,IAP2B;AAQvCC,IAAAA,sBAAsB,GAAG,KARc;AASvCC,IAAAA,gCATuC;AAUvCC,IAAAA;AAVuC,GAWpC;AACH,QAAMpB,aAAa,GAAGT,WAAW,CAChC,MAAMW,QAAQ,CAAEmB,SAAF,CADkB,EAEhC,CAAEnB,QAAF,CAFgC,CAAjC;AAIA,QAAMoB,SAAS,GACdH,gCAAgC,IAAIlB,SAAJ,aAAIA,SAAJ,eAAIA,SAAS,CAAEa,MAA/C,GACGH,cADH,GAEGb,YAHJ,CALG,CAUH;;AACA,QAAMyB,2BAA2B,GAAG,CAAEP,iBAAF,GACjC;AAAEQ,IAAAA,SAAS,EAAE;AAAb,GADiC,GAEjC,EAFH;AAIA,SACC,cAAC,SAAD;AACC,IAAA,SAAS,EAAGzB,SADb;AAEC,IAAA,SAAS,EAAGkB,SAFb;AAGC,IAAA,aAAa,EAAGjB,aAHjB;AAIC,IAAA,SAAS,EAAGC,SAJb;AAKC,IAAA,QAAQ,EAAGC,QALZ;AAMC,IAAA,KAAK,EAAGC,KANT;AAOC,IAAA,OAAO,EACNc,SAAS,KACP,CAAAhB,SAAS,SAAT,IAAAA,SAAS,WAAT,YAAAA,SAAS,CAAEa,MAAX,KAAqB,CAAEI,sBADhB,CAAT,IAEC,cAAC,oBAAD,CAAsB,YAAtB;AACC,MAAA,OAAO,EAAGlB;AADX,OAGGX,EAAE,CAAE,OAAF,CAHL,CAVH;AAiBC,IAAA,OAAO,EACN,CAAE6B,sBAAF,IACC,cAAC,MAAD;AACC,MAAA,SAAS,EAAGjB,SAAS,SAAT,IAAAA,SAAS,WAAT,IAAAA,SAAS,CAAEa,MAAX,GAAoB,CAApB,GAAwB,CADrC;AAEC,MAAA,YAAY,EAAG;AAFhB,OAGMS,2BAHN,GAKC,cAAC,oBAAD;AACC,MAAA,iBAAiB,EAAGP,iBADrB;AAEC,MAAA,iCAAiC,EAChCI,iCAHF;AAKC,MAAA,KAAK,EAAGjB,KALT;AAMC,MAAA,QAAQ,EAAGD;AANZ,MALD;AAnBH,IADD;AAsCA","sourcesContent":["/**\n * External dependencies\n */\nimport { map } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport CircularOptionPicker from '../circular-option-picker';\nimport CustomGradientPicker from '../custom-gradient-picker';\nimport { VStack } from '../v-stack';\nimport { ColorHeading } from '../color-palette/styles';\nimport { Spacer } from '../spacer';\n\nfunction SingleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\n\tcontent,\n} ) {\n\tconst gradientOptions = useMemo( () => {\n\t\treturn map( gradients, ( { gradient, name } ) => (\n\t\t\t<CircularOptionPicker.Option\n\t\t\t\tkey={ gradient }\n\t\t\t\tvalue={ gradient }\n\t\t\t\tisSelected={ value === gradient }\n\t\t\t\ttooltipText={\n\t\t\t\t\tname ||\n\t\t\t\t\t// translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\tsprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t\tstyle={ { color: 'rgba( 0,0,0,0 )', background: gradient } }\n\t\t\t\tonClick={\n\t\t\t\t\tvalue === gradient\n\t\t\t\t\t\t? clearGradient\n\t\t\t\t\t\t: () => onChange( gradient )\n\t\t\t\t}\n\t\t\t\taria-label={\n\t\t\t\t\tname\n\t\t\t\t\t\t? // translators: %s: The name of the gradient e.g: \"Angular red to blue\".\n\t\t\t\t\t\t sprintf( __( 'Gradient: %s' ), name )\n\t\t\t\t\t\t: // translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\t\t sprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t/>\n\t\t) );\n\t}, [ gradients, value, onChange, clearGradient ] );\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\tclassName={ className }\n\t\t\toptions={ gradientOptions }\n\t\t\tactions={ actions }\n\t\t>\n\t\t\t{ content }\n\t\t</CircularOptionPicker>\n\t);\n}\n\nfunction MultipleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\n\tcontent,\n} ) {\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ gradients.map( ( { name, gradients: gradientSet }, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading>{ name }</ColorHeading>\n\t\t\t\t\t\t<SingleOrigin\n\t\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\t\tgradients={ gradientSet }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t{ ...( gradients.length === index + 1\n\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\tactions,\n\t\t\t\t\t\t\t\t\t\tcontent,\n\t\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t\t: {} ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport default function GradientPicker( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMargin = false,\n\tclassName,\n\tgradients,\n\tonChange,\n\tvalue,\n\tclearable = true,\n\tdisableCustomGradients = false,\n\t__experimentalHasMultipleOrigins,\n\t__experimentalIsRenderedInSidebar,\n} ) {\n\tconst clearGradient = useCallback(\n\t\t() => onChange( undefined ),\n\t\t[ onChange ]\n\t);\n\tconst Component =\n\t\t__experimentalHasMultipleOrigins && gradients?.length\n\t\t\t? MultipleOrigin\n\t\t\t: SingleOrigin;\n\n\t// Can be removed when deprecation period is over\n\tconst deprecatedMarginSpacerProps = ! __nextHasNoMargin\n\t\t? { marginTop: 3 }\n\t\t: {};\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={ className }\n\t\t\tclearable={ clearable }\n\t\t\tclearGradient={ clearGradient }\n\t\t\tgradients={ gradients }\n\t\t\tonChange={ onChange }\n\t\t\tvalue={ value }\n\t\t\tactions={\n\t\t\t\tclearable &&\n\t\t\t\t( gradients?.length || ! disableCustomGradients ) && (\n\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\tonClick={ clearGradient }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t)\n\t\t\t}\n\t\t\tcontent={\n\t\t\t\t! disableCustomGradients && (\n\t\t\t\t\t<Spacer\n\t\t\t\t\t\tmarginTop={ gradients?.length ? 3 : 0 }\n\t\t\t\t\t\tmarginBottom={ 0 }\n\t\t\t\t\t\t{ ...deprecatedMarginSpacerProps }\n\t\t\t\t\t>\n\t\t\t\t\t\t<CustomGradientPicker\n\t\t\t\t\t\t\t__nextHasNoMargin={ __nextHasNoMargin }\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Spacer>\n\t\t\t\t)\n\t\t\t}\n\t\t/>\n\t);\n}\n"]}
|
|
@@ -40,11 +40,13 @@ export default function Guide(_ref) {
|
|
|
40
40
|
}
|
|
41
41
|
}, [children]);
|
|
42
42
|
useEffect(() => {
|
|
43
|
-
var _focus$tabbable$find, _focus$tabbable$find$;
|
|
44
|
-
|
|
45
43
|
// Each time we change the current page, start from the first element of the page.
|
|
46
44
|
// This also solves any focus loss that can happen.
|
|
47
|
-
|
|
45
|
+
if (guideContainer.current) {
|
|
46
|
+
var _focus$tabbable$find, _focus$tabbable$find$;
|
|
47
|
+
|
|
48
|
+
(_focus$tabbable$find = focus.tabbable.find(guideContainer.current)) === null || _focus$tabbable$find === void 0 ? void 0 : (_focus$tabbable$find$ = _focus$tabbable$find[0]) === null || _focus$tabbable$find$ === void 0 ? void 0 : _focus$tabbable$find$.focus();
|
|
49
|
+
}
|
|
48
50
|
}, [currentPage]);
|
|
49
51
|
|
|
50
52
|
if (Children.count(children)) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/guide/index.js"],"names":["classnames","useState","useEffect","Children","useRef","deprecated","__","LEFT","RIGHT","focus","Modal","Button","PageControl","Guide","children","className","contentLabel","finishButtonText","onFinish","pages","guideContainer","currentPage","setCurrentPage","count","since","alternative","
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/guide/index.js"],"names":["classnames","useState","useEffect","Children","useRef","deprecated","__","LEFT","RIGHT","focus","Modal","Button","PageControl","Guide","children","className","contentLabel","finishButtonText","onFinish","pages","guideContainer","currentPage","setCurrentPage","count","since","alternative","current","tabbable","find","map","child","content","canGoBack","canGoForward","length","goBack","goForward","event","keyCode","image"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useEffect, Children, useRef } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\nimport { __ } from '@wordpress/i18n';\nimport { LEFT, RIGHT } from '@wordpress/keycodes';\nimport { focus } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport Modal from '../modal';\nimport Button from '../button';\nimport PageControl from './page-control';\n\nexport default function Guide( {\n\tchildren,\n\tclassName,\n\tcontentLabel,\n\tfinishButtonText,\n\tonFinish,\n\tpages = [],\n} ) {\n\tconst guideContainer = useRef();\n\tconst [ currentPage, setCurrentPage ] = useState( 0 );\n\n\tuseEffect( () => {\n\t\tif ( Children.count( children ) ) {\n\t\t\tdeprecated( 'Passing children to <Guide>', {\n\t\t\t\tsince: '5.5',\n\t\t\t\talternative: 'the `pages` prop',\n\t\t\t} );\n\t\t}\n\t}, [ children ] );\n\n\tuseEffect( () => {\n\t\t// Each time we change the current page, start from the first element of the page.\n\t\t// This also solves any focus loss that can happen.\n\t\tif ( guideContainer.current ) {\n\t\t\tfocus.tabbable.find( guideContainer.current )?.[ 0 ]?.focus();\n\t\t}\n\t}, [ currentPage ] );\n\n\tif ( Children.count( children ) ) {\n\t\tpages = Children.map( children, ( child ) => ( { content: child } ) );\n\t}\n\n\tconst canGoBack = currentPage > 0;\n\tconst canGoForward = currentPage < pages.length - 1;\n\n\tconst goBack = () => {\n\t\tif ( canGoBack ) {\n\t\t\tsetCurrentPage( currentPage - 1 );\n\t\t}\n\t};\n\n\tconst goForward = () => {\n\t\tif ( canGoForward ) {\n\t\t\tsetCurrentPage( currentPage + 1 );\n\t\t}\n\t};\n\n\tif ( pages.length === 0 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Modal\n\t\t\tclassName={ classnames( 'components-guide', className ) }\n\t\t\tcontentLabel={ contentLabel }\n\t\t\tonRequestClose={ onFinish }\n\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\tif ( event.keyCode === LEFT ) {\n\t\t\t\t\tgoBack();\n\t\t\t\t} else if ( event.keyCode === RIGHT ) {\n\t\t\t\t\tgoForward();\n\t\t\t\t}\n\t\t\t} }\n\t\t\tref={ guideContainer }\n\t\t>\n\t\t\t<div className=\"components-guide__container\">\n\t\t\t\t<div className=\"components-guide__page\">\n\t\t\t\t\t{ pages[ currentPage ].image }\n\n\t\t\t\t\t{ pages.length > 1 && (\n\t\t\t\t\t\t<PageControl\n\t\t\t\t\t\t\tcurrentPage={ currentPage }\n\t\t\t\t\t\t\tnumberOfPages={ pages.length }\n\t\t\t\t\t\t\tsetCurrentPage={ setCurrentPage }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ pages[ currentPage ].content }\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"components-guide__footer\">\n\t\t\t\t\t{ canGoBack && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"components-guide__back-button\"\n\t\t\t\t\t\t\tonClick={ goBack }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Previous' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t\t{ canGoForward && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"components-guide__forward-button\"\n\t\t\t\t\t\t\tonClick={ goForward }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Next' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! canGoForward && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"components-guide__finish-button\"\n\t\t\t\t\t\t\tonClick={ onFinish }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ finishButtonText || __( 'Finish' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n}\n"]}
|
|
@@ -1,13 +1,8 @@
|
|
|
1
1
|
import { createElement } from "@wordpress/element";
|
|
2
2
|
|
|
3
|
-
/**
|
|
4
|
-
* External dependencies
|
|
5
|
-
*/
|
|
6
|
-
import { times } from 'lodash';
|
|
7
3
|
/**
|
|
8
4
|
* WordPress dependencies
|
|
9
5
|
*/
|
|
10
|
-
|
|
11
6
|
import { __, sprintf } from '@wordpress/i18n';
|
|
12
7
|
/**
|
|
13
8
|
* Internal dependencies
|
|
@@ -24,7 +19,9 @@ export default function PageControl(_ref) {
|
|
|
24
19
|
return createElement("ul", {
|
|
25
20
|
className: "components-guide__page-control",
|
|
26
21
|
"aria-label": __('Guide controls')
|
|
27
|
-
},
|
|
22
|
+
}, Array.from({
|
|
23
|
+
length: numberOfPages
|
|
24
|
+
}).map((_, page) => createElement("li", {
|
|
28
25
|
key: page // Set aria-current="step" on the active page, see https://www.w3.org/TR/wai-aria-1.1/#aria-current
|
|
29
26
|
,
|
|
30
27
|
"aria-current": page === currentPage ? 'step' : undefined
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/guide/page-control.js"],"names":["
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/guide/page-control.js"],"names":["__","sprintf","Button","PageControlIcon","PageControl","currentPage","numberOfPages","setCurrentPage","Array","from","length","map","_","page","undefined"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,SAASC,eAAT,QAAgC,SAAhC;AAEA,eAAe,SAASC,WAAT,OAIX;AAAA,MAJiC;AACpCC,IAAAA,WADoC;AAEpCC,IAAAA,aAFoC;AAGpCC,IAAAA;AAHoC,GAIjC;AACH,SACC;AACC,IAAA,SAAS,EAAC,gCADX;AAEC,kBAAaP,EAAE,CAAE,gBAAF;AAFhB,KAIGQ,KAAK,CAACC,IAAN,CAAY;AAAEC,IAAAA,MAAM,EAAEJ;AAAV,GAAZ,EAAwCK,GAAxC,CAA6C,CAAEC,CAAF,EAAKC,IAAL,KAC9C;AACC,IAAA,GAAG,EAAGA,IADP,CAEC;AAFD;AAGC,oBAAeA,IAAI,KAAKR,WAAT,GAAuB,MAAvB,GAAgCS;AAHhD,KAKC,cAAC,MAAD;AACC,IAAA,GAAG,EAAGD,IADP;AAEC,IAAA,IAAI,EACH,cAAC,eAAD;AACC,MAAA,UAAU,EAAGA,IAAI,KAAKR;AADvB,MAHF;AAOC,kBAAaJ,OAAO;AACnB;AACAD,IAAAA,EAAE,CAAE,mBAAF,CAFiB,EAGnBa,IAAI,GAAG,CAHY,EAInBP,aAJmB,CAPrB;AAaC,IAAA,OAAO,EAAG,MAAMC,cAAc,CAAEM,IAAF;AAb/B,IALD,CADC,CAJH,CADD;AA8BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport { PageControlIcon } from './icons';\n\nexport default function PageControl( {\n\tcurrentPage,\n\tnumberOfPages,\n\tsetCurrentPage,\n} ) {\n\treturn (\n\t\t<ul\n\t\t\tclassName=\"components-guide__page-control\"\n\t\t\taria-label={ __( 'Guide controls' ) }\n\t\t>\n\t\t\t{ Array.from( { length: numberOfPages } ).map( ( _, page ) => (\n\t\t\t\t<li\n\t\t\t\t\tkey={ page }\n\t\t\t\t\t// Set aria-current=\"step\" on the active page, see https://www.w3.org/TR/wai-aria-1.1/#aria-current\n\t\t\t\t\taria-current={ page === currentPage ? 'step' : undefined }\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tkey={ page }\n\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t<PageControlIcon\n\t\t\t\t\t\t\t\tisSelected={ page === currentPage }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\taria-label={ sprintf(\n\t\t\t\t\t\t\t/* translators: 1: current page number 2: total number of pages */\n\t\t\t\t\t\t\t__( 'Page %1$d of %2$d' ),\n\t\t\t\t\t\t\tpage + 1,\n\t\t\t\t\t\t\tnumberOfPages\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tonClick={ () => setCurrentPage( page ) }\n\t\t\t\t\t/>\n\t\t\t\t</li>\n\t\t\t) ) }\n\t\t</ul>\n\t);\n}\n"]}
|