@wordpress/components 19.7.0-next.e230fbab09.0 → 19.8.1
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 +57 -1
- package/README.md +38 -0
- package/build/base-control/index.js +41 -32
- package/build/base-control/index.js.map +1 -1
- package/build/base-control/styles/base-control-styles.js +43 -22
- package/build/base-control/styles/base-control-styles.js.map +1 -1
- package/build/base-control/types.js +6 -0
- package/build/base-control/types.js.map +1 -0
- package/build/border-box-control/border-box-control/component.js +124 -0
- package/build/border-box-control/border-box-control/component.js.map +1 -0
- package/build/border-box-control/border-box-control/hook.js +113 -0
- package/build/border-box-control/border-box-control/hook.js.map +1 -0
- package/build/border-box-control/border-box-control/index.js +24 -0
- package/build/border-box-control/border-box-control/index.js.map +1 -0
- package/build/border-box-control/border-box-control-linked-button/component.js +59 -0
- package/build/border-box-control/border-box-control-linked-button/component.js.map +1 -0
- package/build/border-box-control/border-box-control-linked-button/hook.js +41 -0
- package/build/border-box-control/border-box-control-linked-button/hook.js.map +1 -0
- package/build/border-box-control/border-box-control-linked-button/index.js +16 -0
- package/build/border-box-control/border-box-control-linked-button/index.js.map +1 -0
- package/build/border-box-control/border-box-control-split-controls/component.js +93 -0
- package/build/border-box-control/border-box-control-split-controls/component.js.map +1 -0
- package/build/border-box-control/border-box-control-split-controls/hook.js +45 -0
- package/build/border-box-control/border-box-control-split-controls/hook.js.map +1 -0
- package/build/border-box-control/border-box-control-split-controls/index.js +16 -0
- package/build/border-box-control/border-box-control-split-controls/index.js.map +1 -0
- package/build/border-box-control/border-box-control-visualizer/component.js +40 -0
- package/build/border-box-control/border-box-control-visualizer/component.js.map +1 -0
- package/build/border-box-control/border-box-control-visualizer/hook.js +43 -0
- package/build/border-box-control/border-box-control-visualizer/hook.js.map +1 -0
- package/build/border-box-control/border-box-control-visualizer/index.js +16 -0
- package/build/border-box-control/border-box-control-visualizer/index.js.map +1 -0
- package/build/border-box-control/index.js +44 -0
- package/build/border-box-control/index.js.map +1 -0
- package/build/border-box-control/styles.js +76 -0
- package/build/border-box-control/styles.js.map +1 -0
- package/build/border-box-control/types.js +6 -0
- package/build/border-box-control/types.js.map +1 -0
- package/build/border-box-control/utils.js +161 -0
- package/build/border-box-control/utils.js.map +1 -0
- package/build/border-control/border-control/component.js +119 -0
- package/build/border-control/border-control/component.js.map +1 -0
- package/build/border-control/border-control/hook.js +130 -0
- package/build/border-control/border-control/hook.js.map +1 -0
- package/build/border-control/border-control/index.js +24 -0
- package/build/border-control/border-control/index.js.map +1 -0
- package/build/border-control/border-control-dropdown/component.js +196 -0
- package/build/border-control/border-control-dropdown/component.js.map +1 -0
- package/build/border-control/border-control-dropdown/hook.js +105 -0
- package/build/border-control/border-control-dropdown/hook.js.map +1 -0
- package/build/border-control/border-control-dropdown/index.js +16 -0
- package/build/border-control/border-control-dropdown/index.js.map +1 -0
- package/build/border-control/border-control-style-picker/component.js +101 -0
- package/build/border-control/border-control-style-picker/component.js.map +1 -0
- package/build/border-control/border-control-style-picker/hook.js +45 -0
- package/build/border-control/border-control-style-picker/hook.js.map +1 -0
- package/build/border-control/border-control-style-picker/index.js +16 -0
- package/build/border-control/border-control-style-picker/index.js.map +1 -0
- package/build/border-control/index.js +24 -0
- package/build/border-control/index.js.map +1 -0
- package/build/border-control/styles.js +125 -0
- package/build/border-control/styles.js.map +1 -0
- package/build/border-control/types.js +6 -0
- package/build/border-control/types.js.map +1 -0
- package/build/box-control/all-input-control.js +3 -7
- package/build/box-control/all-input-control.js.map +1 -1
- package/build/box-control/axial-input-controls.js +20 -15
- package/build/box-control/axial-input-controls.js.map +1 -1
- package/build/box-control/input-controls.js +21 -16
- package/build/box-control/input-controls.js.map +1 -1
- package/build/box-control/utils.js +25 -11
- package/build/box-control/utils.js.map +1 -1
- package/build/card/styles.js +22 -17
- package/build/card/styles.js.map +1 -1
- package/build/checkbox-control/index.js +21 -1
- package/build/checkbox-control/index.js.map +1 -1
- package/build/color-palette/index.js +53 -4
- package/build/color-palette/index.js.map +1 -1
- package/build/custom-select-control/index.js +12 -4
- package/build/custom-select-control/index.js.map +1 -1
- package/build/divider/styles.js +28 -16
- package/build/divider/styles.js.map +1 -1
- package/build/focal-point-picker/controls.js +2 -3
- package/build/focal-point-picker/controls.js.map +1 -1
- package/build/form-file-upload/index.js +4 -1
- package/build/form-file-upload/index.js.map +1 -1
- package/build/guide/index.js +14 -8
- package/build/guide/index.js.map +1 -1
- package/build/index.js +40 -0
- package/build/index.js.map +1 -1
- package/build/input-control/input-field.js +21 -14
- package/build/input-control/input-field.js.map +1 -1
- package/build/input-control/reducer/actions.js +1 -3
- package/build/input-control/reducer/actions.js.map +1 -1
- package/build/input-control/reducer/reducer.js +1 -43
- package/build/input-control/reducer/reducer.js.map +1 -1
- package/build/item-group/styles.js +14 -14
- package/build/item-group/styles.js.map +1 -1
- package/build/mobile/picker/index.android.js +0 -3
- package/build/mobile/picker/index.android.js.map +1 -1
- package/build/number-control/index.js +15 -10
- package/build/number-control/index.js.map +1 -1
- package/build/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +4 -4
- package/build/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js.map +1 -1
- package/build/surface/styles.js +8 -8
- package/build/surface/styles.js.map +1 -1
- package/build/toggle-group-control/index.js +8 -0
- package/build/toggle-group-control/index.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control/component.js +10 -1
- package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control/styles.js +14 -3
- package/build/toggle-group-control/toggle-group-control/styles.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js +90 -0
- package/build/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js.map +1 -0
- package/build/toggle-group-control/toggle-group-control-option/component.js +9 -90
- 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 +127 -0
- package/build/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -0
- package/build/toggle-group-control/toggle-group-control-option-base/index.js +16 -0
- package/build/toggle-group-control/toggle-group-control-option-base/index.js.map +1 -0
- package/build/toggle-group-control/toggle-group-control-option-base/styles.js +66 -0
- package/build/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -0
- package/build/toggle-group-control/toggle-group-control-option-icon/component.js +55 -0
- package/build/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -0
- package/build/toggle-group-control/toggle-group-control-option-icon/index.js +16 -0
- package/build/toggle-group-control/toggle-group-control-option-icon/index.js.map +1 -0
- package/build/toolbar-dropdown-menu/index.js +1 -1
- package/build/toolbar-dropdown-menu/index.js.map +1 -1
- package/build/tree-grid/index.js +4 -1
- package/build/tree-grid/index.js.map +1 -1
- package/build/unit-control/index.js +56 -29
- package/build/unit-control/index.js.map +1 -1
- package/build/unit-control/unit-select-control.js +2 -4
- package/build/unit-control/unit-select-control.js.map +1 -1
- package/build/utils/colors-values.js +5 -3
- package/build/utils/colors-values.js.map +1 -1
- package/build/utils/config-values.js +9 -4
- package/build/utils/config-values.js.map +1 -1
- package/build-module/base-control/index.js +39 -35
- package/build-module/base-control/index.js.map +1 -1
- package/build-module/base-control/styles/base-control-styles.js +44 -16
- package/build-module/base-control/styles/base-control-styles.js.map +1 -1
- package/build-module/base-control/types.js +2 -0
- package/build-module/base-control/types.js.map +1 -0
- package/build-module/border-box-control/border-box-control/component.js +104 -0
- package/build-module/border-box-control/border-box-control/component.js.map +1 -0
- package/build-module/border-box-control/border-box-control/hook.js +97 -0
- package/build-module/border-box-control/border-box-control/hook.js.map +1 -0
- package/build-module/border-box-control/border-box-control/index.js +3 -0
- package/build-module/border-box-control/border-box-control/index.js.map +1 -0
- package/build-module/border-box-control/border-box-control-linked-button/component.js +42 -0
- package/build-module/border-box-control/border-box-control-linked-button/component.js.map +1 -0
- package/build-module/border-box-control/border-box-control-linked-button/hook.js +26 -0
- package/build-module/border-box-control/border-box-control-linked-button/hook.js.map +1 -0
- package/build-module/border-box-control/border-box-control-linked-button/index.js +2 -0
- package/build-module/border-box-control/border-box-control-linked-button/index.js.map +1 -0
- package/build-module/border-box-control/border-box-control-split-controls/component.js +77 -0
- package/build-module/border-box-control/border-box-control-split-controls/component.js.map +1 -0
- package/build-module/border-box-control/border-box-control-split-controls/hook.js +30 -0
- package/build-module/border-box-control/border-box-control-split-controls/hook.js.map +1 -0
- package/build-module/border-box-control/border-box-control-split-controls/index.js +2 -0
- package/build-module/border-box-control/border-box-control-split-controls/index.js.map +1 -0
- package/build-module/border-box-control/border-box-control-visualizer/component.js +27 -0
- package/build-module/border-box-control/border-box-control-visualizer/component.js.map +1 -0
- package/build-module/border-box-control/border-box-control-visualizer/hook.js +28 -0
- package/build-module/border-box-control/border-box-control-visualizer/hook.js.map +1 -0
- package/build-module/border-box-control/border-box-control-visualizer/index.js +2 -0
- package/build-module/border-box-control/border-box-control-visualizer/index.js.map +1 -0
- package/build-module/border-box-control/index.js +4 -0
- package/build-module/border-box-control/index.js.map +1 -0
- package/build-module/border-box-control/styles.js +66 -0
- package/build-module/border-box-control/styles.js.map +1 -0
- package/build-module/border-box-control/types.js +2 -0
- package/build-module/border-box-control/types.js.map +1 -0
- package/build-module/border-box-control/utils.js +127 -0
- package/build-module/border-box-control/utils.js.map +1 -0
- package/build-module/border-control/border-control/component.js +100 -0
- package/build-module/border-control/border-control/component.js.map +1 -0
- package/build-module/border-control/border-control/hook.js +115 -0
- package/build-module/border-control/border-control/hook.js.map +1 -0
- package/build-module/border-control/border-control/index.js +3 -0
- package/build-module/border-control/border-control/index.js.map +1 -0
- package/build-module/border-control/border-control-dropdown/component.js +174 -0
- package/build-module/border-control/border-control-dropdown/component.js.map +1 -0
- package/build-module/border-control/border-control-dropdown/hook.js +89 -0
- package/build-module/border-control/border-control-dropdown/hook.js.map +1 -0
- package/build-module/border-control/border-control-dropdown/index.js +2 -0
- package/build-module/border-control/border-control-dropdown/index.js.map +1 -0
- package/build-module/border-control/border-control-style-picker/component.js +81 -0
- package/build-module/border-control/border-control-style-picker/component.js.map +1 -0
- package/build-module/border-control/border-control-style-picker/hook.js +30 -0
- package/build-module/border-control/border-control-style-picker/hook.js.map +1 -0
- package/build-module/border-control/border-control-style-picker/index.js +2 -0
- package/build-module/border-control/border-control-style-picker/index.js.map +1 -0
- package/build-module/border-control/index.js +3 -0
- package/build-module/border-control/index.js.map +1 -0
- package/build-module/border-control/styles.js +90 -0
- package/build-module/border-control/styles.js.map +1 -0
- package/build-module/border-control/types.js +2 -0
- package/build-module/border-control/types.js.map +1 -0
- package/build-module/box-control/all-input-control.js +4 -8
- package/build-module/box-control/all-input-control.js.map +1 -1
- package/build-module/box-control/axial-input-controls.js +18 -14
- package/build-module/box-control/axial-input-controls.js.map +1 -1
- package/build-module/box-control/input-controls.js +18 -14
- package/build-module/box-control/input-controls.js.map +1 -1
- package/build-module/box-control/utils.js +25 -11
- package/build-module/box-control/utils.js.map +1 -1
- package/build-module/card/styles.js +23 -18
- package/build-module/card/styles.js.map +1 -1
- package/build-module/checkbox-control/index.js +24 -3
- package/build-module/checkbox-control/index.js.map +1 -1
- package/build-module/color-palette/index.js +52 -4
- package/build-module/color-palette/index.js.map +1 -1
- package/build-module/custom-select-control/index.js +12 -4
- package/build-module/custom-select-control/index.js.map +1 -1
- package/build-module/divider/styles.js +29 -10
- package/build-module/divider/styles.js.map +1 -1
- package/build-module/focal-point-picker/controls.js +2 -3
- package/build-module/focal-point-picker/controls.js.map +1 -1
- package/build-module/form-file-upload/index.js +4 -1
- package/build-module/form-file-upload/index.js.map +1 -1
- package/build-module/guide/index.js +14 -8
- package/build-module/guide/index.js.map +1 -1
- package/build-module/index.js +3 -1
- package/build-module/index.js.map +1 -1
- package/build-module/input-control/input-field.js +21 -13
- package/build-module/input-control/input-field.js.map +1 -1
- package/build-module/input-control/reducer/actions.js +0 -1
- package/build-module/input-control/reducer/actions.js.map +1 -1
- package/build-module/input-control/reducer/reducer.js +2 -39
- package/build-module/input-control/reducer/reducer.js.map +1 -1
- package/build-module/item-group/styles.js +14 -14
- package/build-module/item-group/styles.js.map +1 -1
- package/build-module/mobile/picker/index.android.js +0 -3
- package/build-module/mobile/picker/index.android.js.map +1 -1
- package/build-module/number-control/index.js +15 -9
- package/build-module/number-control/index.js.map +1 -1
- package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +4 -4
- package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js.map +1 -1
- package/build-module/surface/styles.js +8 -8
- package/build-module/surface/styles.js.map +1 -1
- package/build-module/toggle-group-control/index.js +1 -0
- package/build-module/toggle-group-control/index.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control/component.js +8 -1
- 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 +11 -3
- package/build-module/toggle-group-control/toggle-group-control/styles.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js +86 -0
- package/build-module/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js.map +1 -0
- package/build-module/toggle-group-control/toggle-group-control-option/component.js +9 -79
- 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 +105 -0
- package/build-module/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -0
- package/build-module/toggle-group-control/toggle-group-control-option-base/index.js +2 -0
- package/build-module/toggle-group-control/toggle-group-control-option-base/index.js.map +1 -0
- package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js +55 -0
- package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -0
- package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js +50 -0
- package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -0
- package/build-module/toggle-group-control/toggle-group-control-option-icon/index.js +2 -0
- package/build-module/toggle-group-control/toggle-group-control-option-icon/index.js.map +1 -0
- package/build-module/toolbar-dropdown-menu/index.js +1 -1
- package/build-module/toolbar-dropdown-menu/index.js.map +1 -1
- package/build-module/tree-grid/index.js +4 -1
- package/build-module/tree-grid/index.js.map +1 -1
- package/build-module/unit-control/index.js +54 -27
- package/build-module/unit-control/index.js.map +1 -1
- package/build-module/unit-control/unit-select-control.js +2 -3
- package/build-module/unit-control/unit-select-control.js.map +1 -1
- package/build-module/utils/colors-values.js +5 -3
- package/build-module/utils/colors-values.js.map +1 -1
- package/build-module/utils/config-values.js +8 -4
- package/build-module/utils/config-values.js.map +1 -1
- package/build-style/style-rtl.css +33 -185
- package/build-style/style.css +33 -185
- package/build-types/base-control/index.d.ts +35 -71
- package/build-types/base-control/index.d.ts.map +1 -1
- package/build-types/base-control/stories/index.d.ts +25 -0
- package/build-types/base-control/stories/index.d.ts.map +1 -0
- package/build-types/base-control/styles/base-control-styles.d.ts +10 -5
- package/build-types/base-control/styles/base-control-styles.d.ts.map +1 -1
- package/build-types/base-control/types.d.ts +41 -0
- package/build-types/base-control/types.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control/component.d.ts +4 -0
- package/build-types/border-box-control/border-box-control/component.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control/hook.d.ts +282 -0
- package/build-types/border-box-control/border-box-control/hook.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control/index.d.ts +3 -0
- package/build-types/border-box-control/border-box-control/index.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control-linked-button/component.d.ts +4 -0
- package/build-types/border-box-control/border-box-control-linked-button/component.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts +266 -0
- package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control-linked-button/index.d.ts +2 -0
- package/build-types/border-box-control/border-box-control-linked-button/index.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control-split-controls/component.d.ts +4 -0
- package/build-types/border-box-control/border-box-control-split-controls/component.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +274 -0
- package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control-split-controls/index.d.ts +2 -0
- package/build-types/border-box-control/border-box-control-split-controls/index.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control-visualizer/component.d.ts +4 -0
- package/build-types/border-box-control/border-box-control-visualizer/component.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts +266 -0
- package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control-visualizer/index.d.ts +2 -0
- package/build-types/border-box-control/border-box-control-visualizer/index.d.ts.map +1 -0
- package/build-types/border-box-control/index.d.ts +4 -0
- package/build-types/border-box-control/index.d.ts.map +1 -0
- package/build-types/border-box-control/styles.d.ts +8 -0
- package/build-types/border-box-control/styles.d.ts.map +1 -0
- package/build-types/border-box-control/types.d.ts +91 -0
- package/build-types/border-box-control/types.d.ts.map +1 -0
- package/build-types/border-box-control/utils.d.ts +24 -0
- package/build-types/border-box-control/utils.d.ts.map +1 -0
- package/build-types/border-control/border-control/component.d.ts +4 -0
- package/build-types/border-control/border-control/component.d.ts.map +1 -0
- package/build-types/border-control/border-control/hook.d.ts +285 -0
- package/build-types/border-control/border-control/hook.d.ts.map +1 -0
- package/build-types/border-control/border-control/index.d.ts +3 -0
- package/build-types/border-control/border-control/index.d.ts.map +1 -0
- package/build-types/border-control/border-control-dropdown/component.d.ts +4 -0
- package/build-types/border-control/border-control-dropdown/component.d.ts.map +1 -0
- package/build-types/border-control/border-control-dropdown/hook.d.ts +280 -0
- package/build-types/border-control/border-control-dropdown/hook.d.ts.map +1 -0
- package/build-types/border-control/border-control-dropdown/index.d.ts +2 -0
- package/build-types/border-control/border-control-dropdown/index.d.ts.map +1 -0
- package/build-types/border-control/border-control-style-picker/component.d.ts +4 -0
- package/build-types/border-control/border-control-style-picker/component.d.ts.map +1 -0
- package/build-types/border-control/border-control-style-picker/hook.d.ts +269 -0
- package/build-types/border-control/border-control-style-picker/hook.d.ts.map +1 -0
- package/build-types/border-control/border-control-style-picker/index.d.ts +2 -0
- package/build-types/border-control/border-control-style-picker/index.d.ts.map +1 -0
- package/build-types/border-control/index.d.ts +3 -0
- package/build-types/border-control/index.d.ts.map +1 -0
- package/build-types/border-control/styles.d.ts +18 -0
- package/build-types/border-control/styles.d.ts.map +1 -0
- package/build-types/border-control/types.d.ts +163 -0
- package/build-types/border-control/types.d.ts.map +1 -0
- package/build-types/card/card-divider/hook.d.ts +1 -1
- package/build-types/card/styles.d.ts.map +1 -1
- package/build-types/color-indicator/index.d.ts +7 -0
- package/build-types/color-indicator/index.d.ts.map +1 -0
- package/build-types/color-palette/index.d.ts.map +1 -1
- package/build-types/color-picker/styles.d.ts +1 -1
- package/build-types/divider/stories/index.d.ts +1 -0
- package/build-types/divider/stories/index.d.ts.map +1 -1
- package/build-types/divider/styles.d.ts.map +1 -1
- package/build-types/divider/types.d.ts +8 -1
- package/build-types/divider/types.d.ts.map +1 -1
- package/build-types/input-control/input-field.d.ts.map +1 -1
- package/build-types/input-control/reducer/actions.d.ts +1 -3
- package/build-types/input-control/reducer/actions.d.ts.map +1 -1
- package/build-types/input-control/reducer/reducer.d.ts +3 -9
- package/build-types/input-control/reducer/reducer.d.ts.map +1 -1
- package/build-types/input-control/stories/index.d.ts +17 -0
- package/build-types/input-control/stories/index.d.ts.map +1 -0
- package/build-types/input-control/types.d.ts +2 -2
- package/build-types/input-control/types.d.ts.map +1 -1
- package/build-types/item-group/styles.d.ts.map +1 -1
- package/build-types/number-control/index.d.ts +3 -3
- package/build-types/number-control/index.d.ts.map +1 -1
- package/build-types/range-control/styles/range-control-styles.d.ts +1 -1
- package/build-types/resizable-box/resize-tooltip/styles/resize-tooltip.styles.d.ts.map +1 -1
- package/build-types/spinner/styles/spinner-styles.d.ts +5 -0
- package/build-types/spinner/styles/spinner-styles.d.ts.map +1 -0
- package/build-types/toggle-group-control/index.d.ts +1 -0
- package/build-types/toggle-group-control/index.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control/styles.d.ts +5 -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/toggle-group-control-backdrop.d.ts +9 -0
- package/build-types/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.d.ts.map +1 -0
- package/build-types/toggle-group-control/toggle-group-control-option/component.d.ts +6 -2
- 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/styles.d.ts +0 -4
- package/build-types/toggle-group-control/toggle-group-control-option/styles.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts +25 -0
- package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts.map +1 -0
- package/build-types/toggle-group-control/toggle-group-control-option-base/index.d.ts +2 -0
- package/build-types/toggle-group-control/toggle-group-control-option-base/index.d.ts.map +1 -0
- package/build-types/toggle-group-control/toggle-group-control-option-base/styles.d.ts +15 -0
- package/build-types/toggle-group-control/toggle-group-control-option-base/styles.d.ts.map +1 -0
- package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts +37 -0
- package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts.map +1 -0
- package/build-types/toggle-group-control/toggle-group-control-option-icon/index.d.ts +2 -0
- package/build-types/toggle-group-control/toggle-group-control-option-icon/index.d.ts.map +1 -0
- package/build-types/toggle-group-control/types.d.ts +24 -8
- package/build-types/toggle-group-control/types.d.ts.map +1 -1
- package/build-types/ui/form-group/form-group.d.ts +2 -2
- package/build-types/unit-control/index.d.ts +12 -5
- package/build-types/unit-control/index.d.ts.map +1 -1
- package/build-types/unit-control/stories/index.d.ts +33 -0
- package/build-types/unit-control/stories/index.d.ts.map +1 -0
- package/build-types/unit-control/styles/unit-control-styles.d.ts +1 -1
- package/build-types/unit-control/types.d.ts +28 -7
- package/build-types/unit-control/types.d.ts.map +1 -1
- package/build-types/unit-control/unit-select-control.d.ts.map +1 -1
- package/build-types/utils/colors-values.d.ts +78 -18
- package/build-types/utils/colors-values.d.ts.map +1 -1
- package/build-types/utils/config-values.d.ts +71 -71
- package/build-types/utils/config-values.d.ts.map +1 -1
- package/package.json +17 -17
- package/src/animate/README.md +1 -1
- package/src/base-control/README.md +20 -12
- package/src/base-control/index.tsx +124 -0
- package/src/base-control/stories/index.tsx +80 -0
- package/src/base-control/styles/{base-control-styles.js → base-control-styles.ts} +23 -1
- package/src/base-control/types.ts +42 -0
- package/src/border-box-control/border-box-control/README.md +178 -0
- package/src/border-box-control/border-box-control/component.tsx +123 -0
- package/src/border-box-control/border-box-control/hook.ts +119 -0
- package/src/border-box-control/border-box-control/index.ts +2 -0
- package/src/border-box-control/border-box-control-linked-button/component.tsx +50 -0
- package/src/border-box-control/border-box-control-linked-button/hook.ts +30 -0
- package/src/border-box-control/border-box-control-linked-button/index.ts +1 -0
- package/src/border-box-control/border-box-control-split-controls/component.tsx +90 -0
- package/src/border-box-control/border-box-control-split-controls/hook.ts +34 -0
- package/src/border-box-control/border-box-control-split-controls/index.ts +1 -0
- package/src/border-box-control/border-box-control-visualizer/component.tsx +28 -0
- package/src/border-box-control/border-box-control-visualizer/hook.ts +30 -0
- package/src/border-box-control/border-box-control-visualizer/index.ts +1 -0
- package/src/border-box-control/index.ts +3 -0
- package/src/border-box-control/stories/index.js +104 -0
- package/src/border-box-control/styles.ts +69 -0
- package/src/border-box-control/test/index.js +354 -0
- package/src/border-box-control/test/utils.js +305 -0
- package/src/border-box-control/types.ts +98 -0
- package/src/border-box-control/utils.ts +151 -0
- package/src/border-control/border-control/README.md +181 -0
- package/src/border-control/border-control/component.tsx +112 -0
- package/src/border-control/border-control/hook.ts +145 -0
- package/src/border-control/border-control/index.ts +2 -0
- package/src/border-control/border-control-dropdown/component.tsx +252 -0
- package/src/border-control/border-control-dropdown/hook.ts +98 -0
- package/src/border-control/border-control-dropdown/index.ts +1 -0
- package/src/border-control/border-control-style-picker/component.tsx +89 -0
- package/src/border-control/border-control-style-picker/hook.ts +34 -0
- package/src/border-control/border-control-style-picker/index.ts +1 -0
- package/src/border-control/index.ts +2 -0
- package/src/border-control/stories/index.js +118 -0
- package/src/border-control/styles.ts +190 -0
- package/src/border-control/test/index.js +436 -0
- package/src/border-control/types.ts +173 -0
- package/src/box-control/all-input-control.js +2 -10
- package/src/box-control/axial-input-controls.js +32 -21
- package/src/box-control/input-controls.js +30 -19
- package/src/box-control/utils.js +29 -12
- package/src/card/styles.js +11 -5
- package/src/card/test/__snapshots__/index.js.snap +83 -66
- package/src/card/test/index.js +7 -5
- package/src/checkbox-control/index.js +34 -3
- package/src/checkbox-control/stories/index.js +44 -0
- package/src/checkbox-control/style.scss +4 -2
- package/src/color-palette/README.md +6 -0
- package/src/color-palette/index.js +73 -8
- package/src/color-palette/stories/index.js +69 -26
- package/src/color-palette/style.scss +11 -3
- package/src/color-palette/test/__snapshots__/index.js.snap +662 -12
- package/src/color-palette/test/index.js +1 -1
- package/src/custom-select-control/index.js +15 -3
- package/src/custom-select-control/stories/index.js +77 -74
- package/src/custom-select-control/style.scss +23 -4
- package/src/disabled/README.md +7 -10
- package/src/divider/stories/index.tsx +26 -23
- package/src/divider/styles.ts +9 -0
- package/src/divider/types.ts +11 -1
- package/src/flyout/test/__snapshots__/index.js.snap +7 -7
- package/src/focal-point-picker/controls.js +2 -3
- package/src/font-size-picker/test/index.js +0 -2
- package/src/form-file-upload/README.md +18 -0
- package/src/form-file-upload/index.js +3 -0
- package/src/form-file-upload/test/index.js +73 -11
- package/src/form-toggle/README.md +1 -1
- package/src/guide/index.js +12 -13
- package/src/guide/style.scss +0 -4
- package/src/index.js +8 -0
- package/src/input-control/input-field.tsx +23 -12
- package/src/input-control/reducer/actions.ts +1 -7
- package/src/input-control/reducer/reducer.ts +0 -29
- package/src/input-control/types.ts +2 -1
- package/src/item-group/styles.ts +1 -0
- package/src/item-group/test/__snapshots__/index.js.snap +11 -10
- package/src/mobile/picker/index.android.js +0 -1
- package/src/number-control/README.md +14 -0
- package/src/number-control/index.js +13 -12
- package/src/number-control/stories/index.js +14 -7
- package/src/number-control/test/index.js +79 -1
- package/src/range-control/stories/index.js +91 -119
- package/src/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +1 -0
- package/src/surface/styles.js +1 -1
- package/src/surface/test/__snapshots__/index.js.snap +11 -11
- package/src/toggle-group-control/index.ts +1 -0
- package/src/toggle-group-control/stories/index.js +37 -7
- package/src/toggle-group-control/test/__snapshots__/index.js.snap +269 -32
- package/src/toggle-group-control/test/index.js +43 -10
- package/src/toggle-group-control/toggle-group-control/component.tsx +10 -0
- package/src/toggle-group-control/toggle-group-control/styles.ts +14 -0
- package/src/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.tsx +86 -0
- package/src/toggle-group-control/toggle-group-control-option/README.md +8 -5
- package/src/toggle-group-control/toggle-group-control-option/component.tsx +18 -97
- package/src/toggle-group-control/toggle-group-control-option-base/README.md +27 -0
- package/src/toggle-group-control/toggle-group-control-option-base/component.tsx +129 -0
- package/src/toggle-group-control/toggle-group-control-option-base/index.ts +1 -0
- package/src/toggle-group-control/{toggle-group-control-option → toggle-group-control-option-base}/styles.ts +4 -13
- package/src/toggle-group-control/toggle-group-control-option-icon/README.md +56 -0
- package/src/toggle-group-control/toggle-group-control-option-icon/component.tsx +56 -0
- package/src/toggle-group-control/toggle-group-control-option-icon/index.ts +1 -0
- package/src/toggle-group-control/types.ts +33 -8
- package/src/toolbar-dropdown-menu/index.js +1 -1
- package/src/toolbar-group/style.scss +0 -73
- package/src/tools-panel/test/__snapshots__/index.js.snap +8 -8
- package/src/tree-grid/README.md +1 -1
- package/src/tree-grid/index.js +4 -0
- package/src/tree-grid/test/index.js +61 -17
- package/src/unit-control/README.md +7 -3
- package/src/unit-control/index.tsx +65 -31
- package/src/unit-control/stories/index.tsx +170 -0
- package/src/unit-control/test/index.js +263 -100
- package/src/unit-control/types.ts +65 -42
- package/src/unit-control/unit-select-control.tsx +2 -3
- package/src/utils/colors-values.js +4 -3
- package/src/utils/config-values.js +9 -4
- package/tsconfig.json +3 -0
- package/tsconfig.tsbuildinfo +1 -1
- package/build/guide/finish-button.js +0 -44
- package/build/guide/finish-button.js.map +0 -1
- package/build/toggle-group-control/toggle-group-control-option/styles.js +0 -73
- package/build/toggle-group-control/toggle-group-control-option/styles.js.map +0 -1
- package/build-module/guide/finish-button.js +0 -34
- package/build-module/guide/finish-button.js.map +0 -1
- package/build-module/toggle-group-control/toggle-group-control-option/styles.js +0 -61
- package/build-module/toggle-group-control/toggle-group-control-option/styles.js.map +0 -1
- package/src/base-control/index.js +0 -111
- package/src/base-control/stories/index.js +0 -81
- package/src/guide/finish-button.js +0 -26
- package/src/guide/test/finish-button.js +0 -49
- package/src/unit-control/stories/index.js +0 -127
|
@@ -4,29 +4,28 @@ import { createElement } from "@wordpress/element";
|
|
|
4
4
|
/**
|
|
5
5
|
* External dependencies
|
|
6
6
|
*/
|
|
7
|
-
import {
|
|
7
|
+
import { omit } from 'lodash';
|
|
8
8
|
import classnames from 'classnames';
|
|
9
9
|
/**
|
|
10
10
|
* WordPress dependencies
|
|
11
11
|
*/
|
|
12
12
|
|
|
13
|
+
import deprecated from '@wordpress/deprecated';
|
|
13
14
|
import { forwardRef, useMemo, useRef, useEffect } from '@wordpress/element';
|
|
14
15
|
import { __ } from '@wordpress/i18n';
|
|
15
|
-
import { ENTER } from '@wordpress/keycodes';
|
|
16
16
|
/**
|
|
17
17
|
* Internal dependencies
|
|
18
18
|
*/
|
|
19
19
|
|
|
20
20
|
import * as inputControlActionTypes from '../input-control/reducer/actions';
|
|
21
|
-
import { composeStateReducers } from '../input-control/reducer/reducer';
|
|
22
21
|
import { Root, ValueInput } from './styles/unit-control-styles';
|
|
23
22
|
import UnitSelectControl from './unit-select-control';
|
|
24
23
|
import { CSS_UNITS, getParsedQuantityAndUnit, getUnitsWithCurrentUnit, getValidParsedQuantityAndUnit } from './utils';
|
|
25
24
|
import { useControlledState } from '../utils/hooks';
|
|
26
25
|
|
|
27
|
-
function
|
|
28
|
-
|
|
29
|
-
__unstableStateReducer:
|
|
26
|
+
function UnforwardedUnitControl(unitControlProps, forwardedRef) {
|
|
27
|
+
const {
|
|
28
|
+
__unstableStateReducer: stateReducerProp,
|
|
30
29
|
autoComplete = 'off',
|
|
31
30
|
className,
|
|
32
31
|
disabled = false,
|
|
@@ -35,18 +34,28 @@ function UnitControl(_ref, forwardedRef) {
|
|
|
35
34
|
isResetValueOnUnitChange = false,
|
|
36
35
|
isUnitSelectTabbable = true,
|
|
37
36
|
label,
|
|
38
|
-
onChange
|
|
39
|
-
onUnitChange
|
|
37
|
+
onChange: onChangeProp,
|
|
38
|
+
onUnitChange,
|
|
40
39
|
size = 'default',
|
|
41
40
|
style,
|
|
42
41
|
unit: unitProp,
|
|
43
42
|
units: unitsProp = CSS_UNITS,
|
|
44
43
|
value: valueProp,
|
|
44
|
+
onBlur: onBlurProp,
|
|
45
45
|
...props
|
|
46
|
-
} =
|
|
47
|
-
|
|
46
|
+
} = unitControlProps;
|
|
47
|
+
|
|
48
|
+
if ('unit' in unitControlProps) {
|
|
49
|
+
deprecated('UnitControl unit prop', {
|
|
50
|
+
since: '5.6',
|
|
51
|
+
hint: 'The unit should be provided within the `value` prop.',
|
|
52
|
+
version: '6.2'
|
|
53
|
+
});
|
|
54
|
+
} // The `value` prop, in theory, should not be `null`, but the following line
|
|
48
55
|
// ensures it fallback to `undefined` in case a consumer of `UnitControl`
|
|
49
56
|
// still passes `null` as a `value`.
|
|
57
|
+
|
|
58
|
+
|
|
50
59
|
const nonNullValueProp = valueProp !== null && valueProp !== void 0 ? valueProp : undefined;
|
|
51
60
|
const units = useMemo(() => getUnitsWithCurrentUnit(nonNullValueProp, unitProp, unitsProp), [nonNullValueProp, unitProp, unitsProp]);
|
|
52
61
|
const [parsedQuantity, parsedUnit] = getParsedQuantityAndUnit(nonNullValueProp, unitProp, units);
|
|
@@ -55,7 +64,9 @@ function UnitControl(_ref, forwardedRef) {
|
|
|
55
64
|
fallback: ''
|
|
56
65
|
});
|
|
57
66
|
useEffect(() => {
|
|
58
|
-
|
|
67
|
+
if (parsedUnit !== undefined) {
|
|
68
|
+
setUnit(parsedUnit);
|
|
69
|
+
}
|
|
59
70
|
}, [parsedUnit]); // Stores parsed value for hand-off in state reducer.
|
|
60
71
|
|
|
61
72
|
const refParsedQuantity = useRef(undefined);
|
|
@@ -63,7 +74,7 @@ function UnitControl(_ref, forwardedRef) {
|
|
|
63
74
|
|
|
64
75
|
const handleOnQuantityChange = (nextQuantityValue, changeProps) => {
|
|
65
76
|
if (nextQuantityValue === '' || typeof nextQuantityValue === 'undefined' || nextQuantityValue === null) {
|
|
66
|
-
|
|
77
|
+
onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp('', changeProps);
|
|
67
78
|
return;
|
|
68
79
|
}
|
|
69
80
|
/*
|
|
@@ -73,7 +84,7 @@ function UnitControl(_ref, forwardedRef) {
|
|
|
73
84
|
|
|
74
85
|
|
|
75
86
|
const onChangeValue = getValidParsedQuantityAndUnit(nextQuantityValue, units, parsedQuantity, unit).join('');
|
|
76
|
-
|
|
87
|
+
onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(onChangeValue, changeProps);
|
|
77
88
|
};
|
|
78
89
|
|
|
79
90
|
const handleOnUnitChange = (nextUnitValue, changeProps) => {
|
|
@@ -86,8 +97,8 @@ function UnitControl(_ref, forwardedRef) {
|
|
|
86
97
|
nextValue = `${data.default}${nextUnitValue}`;
|
|
87
98
|
}
|
|
88
99
|
|
|
89
|
-
|
|
90
|
-
onUnitChange(nextUnitValue, changeProps);
|
|
100
|
+
onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(nextValue, changeProps);
|
|
101
|
+
onUnitChange === null || onUnitChange === void 0 ? void 0 : onUnitChange(nextUnitValue, changeProps);
|
|
91
102
|
setUnit(nextUnitValue);
|
|
92
103
|
};
|
|
93
104
|
|
|
@@ -106,20 +117,23 @@ function UnitControl(_ref, forwardedRef) {
|
|
|
106
117
|
event,
|
|
107
118
|
data
|
|
108
119
|
};
|
|
109
|
-
|
|
110
|
-
onUnitChange(validParsedUnit, changeProps);
|
|
120
|
+
onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(`${validParsedQuantity !== null && validParsedQuantity !== void 0 ? validParsedQuantity : ''}${validParsedUnit}`, changeProps);
|
|
121
|
+
onUnitChange === null || onUnitChange === void 0 ? void 0 : onUnitChange(validParsedUnit, changeProps);
|
|
111
122
|
setUnit(validParsedUnit);
|
|
112
123
|
}
|
|
113
124
|
};
|
|
114
125
|
|
|
115
|
-
const handleOnBlur =
|
|
126
|
+
const handleOnBlur = event => {
|
|
127
|
+
mayUpdateUnit(event);
|
|
128
|
+
onBlurProp === null || onBlurProp === void 0 ? void 0 : onBlurProp(event);
|
|
129
|
+
};
|
|
116
130
|
|
|
117
131
|
const handleOnKeyDown = event => {
|
|
118
132
|
const {
|
|
119
|
-
|
|
133
|
+
key
|
|
120
134
|
} = event;
|
|
121
135
|
|
|
122
|
-
if (
|
|
136
|
+
if (key === 'Enter') {
|
|
123
137
|
mayUpdateUnit(event);
|
|
124
138
|
}
|
|
125
139
|
};
|
|
@@ -135,23 +149,35 @@ function UnitControl(_ref, forwardedRef) {
|
|
|
135
149
|
|
|
136
150
|
|
|
137
151
|
const unitControlStateReducer = (state, action) => {
|
|
152
|
+
const nextState = { ...state
|
|
153
|
+
};
|
|
138
154
|
/*
|
|
139
155
|
* On commits (when pressing ENTER and on blur if
|
|
140
156
|
* isPressEnterToChange is true), if a parse has been performed
|
|
141
157
|
* then use that result to update the state.
|
|
142
158
|
*/
|
|
159
|
+
|
|
143
160
|
if (action.type === inputControlActionTypes.COMMIT) {
|
|
144
161
|
if (refParsedQuantity.current !== undefined) {
|
|
145
162
|
var _refParsedQuantity$cu;
|
|
146
163
|
|
|
147
|
-
|
|
164
|
+
nextState.value = ((_refParsedQuantity$cu = refParsedQuantity.current) !== null && _refParsedQuantity$cu !== void 0 ? _refParsedQuantity$cu : '').toString();
|
|
148
165
|
refParsedQuantity.current = undefined;
|
|
149
166
|
}
|
|
150
167
|
}
|
|
151
168
|
|
|
152
|
-
return
|
|
169
|
+
return nextState;
|
|
153
170
|
};
|
|
154
171
|
|
|
172
|
+
let stateReducer = unitControlStateReducer;
|
|
173
|
+
|
|
174
|
+
if (stateReducerProp) {
|
|
175
|
+
stateReducer = (state, action) => {
|
|
176
|
+
const baseState = unitControlStateReducer(state, action);
|
|
177
|
+
return stateReducerProp(baseState, action);
|
|
178
|
+
};
|
|
179
|
+
}
|
|
180
|
+
|
|
155
181
|
const inputSuffix = !disableUnits ? createElement(UnitSelectControl, {
|
|
156
182
|
"aria-label": __('Select unit'),
|
|
157
183
|
disabled: disabled,
|
|
@@ -159,7 +185,8 @@ function UnitControl(_ref, forwardedRef) {
|
|
|
159
185
|
onChange: handleOnUnitChange,
|
|
160
186
|
size: size,
|
|
161
187
|
unit: unit,
|
|
162
|
-
units: units
|
|
188
|
+
units: units,
|
|
189
|
+
onBlur: onBlurProp
|
|
163
190
|
}) : null;
|
|
164
191
|
let step = props.step;
|
|
165
192
|
/*
|
|
@@ -195,11 +222,11 @@ function UnitControl(_ref, forwardedRef) {
|
|
|
195
222
|
suffix: inputSuffix,
|
|
196
223
|
value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : '',
|
|
197
224
|
step: step,
|
|
198
|
-
__unstableStateReducer:
|
|
225
|
+
__unstableStateReducer: stateReducer
|
|
199
226
|
})));
|
|
200
227
|
}
|
|
201
228
|
/**
|
|
202
|
-
* `UnitControl` allows the user to set a
|
|
229
|
+
* `UnitControl` allows the user to set a numeric quantity as well as a unit (e.g. `px`).
|
|
203
230
|
*
|
|
204
231
|
*
|
|
205
232
|
* @example
|
|
@@ -216,7 +243,7 @@ function UnitControl(_ref, forwardedRef) {
|
|
|
216
243
|
*/
|
|
217
244
|
|
|
218
245
|
|
|
219
|
-
const
|
|
246
|
+
export const UnitControl = forwardRef(UnforwardedUnitControl);
|
|
220
247
|
export { parseQuantityAndUnitFromRawValue, useCustomUnits } from './utils';
|
|
221
|
-
export default
|
|
248
|
+
export default UnitControl;
|
|
222
249
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/unit-control/index.tsx"],"names":["noop","omit","classnames","forwardRef","useMemo","useRef","useEffect","__","ENTER","inputControlActionTypes","composeStateReducers","Root","ValueInput","UnitSelectControl","CSS_UNITS","getParsedQuantityAndUnit","getUnitsWithCurrentUnit","getValidParsedQuantityAndUnit","useControlledState","UnitControl","forwardedRef","__unstableStateReducer","stateReducer","state","autoComplete","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","onUnitChange","size","style","unit","unitProp","units","unitsProp","value","valueProp","props","nonNullValueProp","undefined","parsedQuantity","parsedUnit","setUnit","initial","fallback","refParsedQuantity","classes","handleOnQuantityChange","nextQuantityValue","changeProps","onChangeValue","join","handleOnUnitChange","nextUnitValue","data","nextValue","default","mayUpdateUnit","event","isNaN","Number","currentTarget","current","validParsedQuantity","validParsedUnit","Array","isArray","find","option","handleOnBlur","handleOnKeyDown","keyCode","unitControlStateReducer","action","type","COMMIT","toString","inputSuffix","step","activeUnit","ForwardedUnitControl","parseQuantityAndUnitFromRawValue","useCustomUnits"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tFocusEventHandler,\n\tKeyboardEvent,\n\tForwardedRef,\n\tSyntheticEvent,\n\tChangeEvent,\n} from 'react';\nimport { noop, omit } from 'lodash';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useMemo, useRef, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { ENTER } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport * as inputControlActionTypes from '../input-control/reducer/actions';\nimport { composeStateReducers } from '../input-control/reducer/reducer';\nimport { Root, ValueInput } from './styles/unit-control-styles';\nimport UnitSelectControl from './unit-select-control';\nimport {\n\tCSS_UNITS,\n\tgetParsedQuantityAndUnit,\n\tgetUnitsWithCurrentUnit,\n\tgetValidParsedQuantityAndUnit,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport type { UnitControlProps, UnitControlOnChangeCallback } from './types';\nimport type { StateReducer } from '../input-control/reducer/state';\n\nfunction UnitControl(\n\t{\n\t\t__unstableStateReducer: stateReducer = ( state ) => state,\n\t\tautoComplete = 'off',\n\t\tclassName,\n\t\tdisabled = false,\n\t\tdisableUnits = false,\n\t\tisPressEnterToChange = false,\n\t\tisResetValueOnUnitChange = false,\n\t\tisUnitSelectTabbable = true,\n\t\tlabel,\n\t\tonChange = noop,\n\t\tonUnitChange = noop,\n\t\tsize = 'default',\n\t\tstyle,\n\t\tunit: unitProp,\n\t\tunits: unitsProp = CSS_UNITS,\n\t\tvalue: valueProp,\n\t\t...props\n\t}: WordPressComponentProps< UnitControlProps, 'input', false >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\t// The `value` prop, in theory, should not be `null`, but the following line\n\t// ensures it fallback to `undefined` in case a consumer of `UnitControl`\n\t// still passes `null` as a `value`.\n\tconst nonNullValueProp = valueProp ?? undefined;\n\tconst units = useMemo(\n\t\t() => getUnitsWithCurrentUnit( nonNullValueProp, unitProp, unitsProp ),\n\t\t[ nonNullValueProp, unitProp, unitsProp ]\n\t);\n\tconst [ parsedQuantity, parsedUnit ] = getParsedQuantityAndUnit(\n\t\tnonNullValueProp,\n\t\tunitProp,\n\t\tunits\n\t);\n\n\tconst [ unit, setUnit ] = useControlledState< string | undefined >(\n\t\tunitProp,\n\t\t{\n\t\t\tinitial: parsedUnit,\n\t\t\tfallback: '',\n\t\t}\n\t);\n\n\tuseEffect( () => {\n\t\tsetUnit( parsedUnit );\n\t}, [ parsedUnit ] );\n\n\t// Stores parsed value for hand-off in state reducer.\n\tconst refParsedQuantity = useRef< number | undefined >( undefined );\n\n\tconst classes = classnames( 'components-unit-control', className );\n\n\tconst handleOnQuantityChange = (\n\t\tnextQuantityValue: number | string | undefined,\n\t\tchangeProps: { event: ChangeEvent< HTMLInputElement > }\n\t) => {\n\t\tif (\n\t\t\tnextQuantityValue === '' ||\n\t\t\ttypeof nextQuantityValue === 'undefined' ||\n\t\t\tnextQuantityValue === null\n\t\t) {\n\t\t\tonChange( '', changeProps );\n\t\t\treturn;\n\t\t}\n\n\t\t/*\n\t\t * Customizing the onChange callback.\n\t\t * This allows as to broadcast a combined value+unit to onChange.\n\t\t */\n\t\tconst onChangeValue = getValidParsedQuantityAndUnit(\n\t\t\tnextQuantityValue,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t).join( '' );\n\n\t\tonChange( onChangeValue, changeProps );\n\t};\n\n\tconst handleOnUnitChange: UnitControlOnChangeCallback = (\n\t\tnextUnitValue,\n\t\tchangeProps\n\t) => {\n\t\tconst { data } = changeProps;\n\n\t\tlet nextValue = `${ parsedQuantity ?? '' }${ nextUnitValue }`;\n\n\t\tif ( isResetValueOnUnitChange && data?.default !== undefined ) {\n\t\t\tnextValue = `${ data.default }${ nextUnitValue }`;\n\t\t}\n\n\t\tonChange( nextValue, changeProps );\n\t\tonUnitChange( nextUnitValue, changeProps );\n\n\t\tsetUnit( nextUnitValue );\n\t};\n\n\tconst mayUpdateUnit = ( event: SyntheticEvent< HTMLInputElement > ) => {\n\t\tif ( ! isNaN( Number( event.currentTarget.value ) ) ) {\n\t\t\trefParsedQuantity.current = undefined;\n\t\t\treturn;\n\t\t}\n\t\tconst [\n\t\t\tvalidParsedQuantity,\n\t\t\tvalidParsedUnit,\n\t\t] = getValidParsedQuantityAndUnit(\n\t\t\tevent.currentTarget.value,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t);\n\n\t\trefParsedQuantity.current = validParsedQuantity;\n\n\t\tif ( isPressEnterToChange && validParsedUnit !== unit ) {\n\t\t\tconst data = Array.isArray( units )\n\t\t\t\t? units.find( ( option ) => option.value === validParsedUnit )\n\t\t\t\t: undefined;\n\t\t\tconst changeProps = { event, data };\n\n\t\t\tonChange(\n\t\t\t\t`${ validParsedQuantity ?? '' }${ validParsedUnit }`,\n\t\t\t\tchangeProps\n\t\t\t);\n\t\t\tonUnitChange( validParsedUnit, changeProps );\n\n\t\t\tsetUnit( validParsedUnit );\n\t\t}\n\t};\n\n\tconst handleOnBlur: FocusEventHandler< HTMLInputElement > = mayUpdateUnit;\n\n\tconst handleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\tconst { keyCode } = event;\n\t\tif ( keyCode === ENTER ) {\n\t\t\tmayUpdateUnit( event );\n\t\t}\n\t};\n\n\t/**\n\t * \"Middleware\" function that intercepts updates from InputControl.\n\t * This allows us to tap into actions to transform the (next) state for\n\t * InputControl.\n\t *\n\t * @param state State from InputControl\n\t * @param action Action triggering state change\n\t * @return The updated state to apply to InputControl\n\t */\n\tconst unitControlStateReducer: StateReducer = ( state, action ) => {\n\t\t/*\n\t\t * On commits (when pressing ENTER and on blur if\n\t\t * isPressEnterToChange is true), if a parse has been performed\n\t\t * then use that result to update the state.\n\t\t */\n\t\tif ( action.type === inputControlActionTypes.COMMIT ) {\n\t\t\tif ( refParsedQuantity.current !== undefined ) {\n\t\t\t\tstate.value = ( refParsedQuantity.current ?? '' ).toString();\n\t\t\t\trefParsedQuantity.current = undefined;\n\t\t\t}\n\t\t}\n\n\t\treturn state;\n\t};\n\n\tconst inputSuffix = ! disableUnits ? (\n\t\t<UnitSelectControl\n\t\t\taria-label={ __( 'Select unit' ) }\n\t\t\tdisabled={ disabled }\n\t\t\tisUnitSelectTabbable={ isUnitSelectTabbable }\n\t\t\tonChange={ handleOnUnitChange }\n\t\t\tsize={ size }\n\t\t\tunit={ unit }\n\t\t\tunits={ units }\n\t\t/>\n\t) : null;\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\treturn (\n\t\t<Root className=\"components-unit-control-wrapper\" style={ style }>\n\t\t\t<ValueInput\n\t\t\t\taria-label={ label }\n\t\t\t\ttype={ isPressEnterToChange ? 'text' : 'number' }\n\t\t\t\t{ ...omit( props, [ 'children' ] ) }\n\t\t\t\tautoComplete={ autoComplete }\n\t\t\t\tclassName={ classes }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\t\tlabel={ label }\n\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\tonKeyDown={ handleOnKeyDown }\n\t\t\t\tonChange={ handleOnQuantityChange }\n\t\t\t\tref={ forwardedRef }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ inputSuffix }\n\t\t\t\tvalue={ parsedQuantity ?? '' }\n\t\t\t\tstep={ step }\n\t\t\t\t__unstableStateReducer={ composeStateReducers(\n\t\t\t\t\tunitControlStateReducer,\n\t\t\t\t\tstateReducer\n\t\t\t\t) }\n\t\t\t/>\n\t\t</Root>\n\t);\n}\n\n/**\n * `UnitControl` allows the user to set a value as well as a unit (e.g. `px`).\n *\n *\n * @example\n * ```jsx\n * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n * const [ value, setValue ] = useState( '10px' );\n *\n * return <UnitControl onChange={ setValue } value={ value } />;\n * };\n * ```\n */\nconst ForwardedUnitControl = forwardRef( UnitControl );\n\nexport { parseQuantityAndUnitFromRawValue, useCustomUnits } from './utils';\nexport default ForwardedUnitControl;\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/unit-control/index.tsx"],"names":["omit","classnames","deprecated","forwardRef","useMemo","useRef","useEffect","__","inputControlActionTypes","Root","ValueInput","UnitSelectControl","CSS_UNITS","getParsedQuantityAndUnit","getUnitsWithCurrentUnit","getValidParsedQuantityAndUnit","useControlledState","UnforwardedUnitControl","unitControlProps","forwardedRef","__unstableStateReducer","stateReducerProp","autoComplete","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","onChangeProp","onUnitChange","size","style","unit","unitProp","units","unitsProp","value","valueProp","onBlur","onBlurProp","props","since","hint","version","nonNullValueProp","undefined","parsedQuantity","parsedUnit","setUnit","initial","fallback","refParsedQuantity","classes","handleOnQuantityChange","nextQuantityValue","changeProps","onChangeValue","join","handleOnUnitChange","nextUnitValue","data","nextValue","default","mayUpdateUnit","event","isNaN","Number","currentTarget","current","validParsedQuantity","validParsedUnit","Array","isArray","find","option","handleOnBlur","handleOnKeyDown","key","unitControlStateReducer","state","action","nextState","type","COMMIT","toString","stateReducer","baseState","inputSuffix","step","activeUnit","UnitControl","parseQuantityAndUnitFromRawValue","useCustomUnits"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tFocusEventHandler,\n\tKeyboardEvent,\n\tForwardedRef,\n\tSyntheticEvent,\n\tChangeEvent,\n\tPointerEvent,\n} from 'react';\nimport { omit } from 'lodash';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef, useMemo, useRef, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport * as inputControlActionTypes from '../input-control/reducer/actions';\nimport { Root, ValueInput } from './styles/unit-control-styles';\nimport UnitSelectControl from './unit-select-control';\nimport {\n\tCSS_UNITS,\n\tgetParsedQuantityAndUnit,\n\tgetUnitsWithCurrentUnit,\n\tgetValidParsedQuantityAndUnit,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport type { UnitControlProps, UnitControlOnChangeCallback } from './types';\nimport type { StateReducer } from '../input-control/reducer/state';\n\nfunction UnforwardedUnitControl(\n\tunitControlProps: WordPressComponentProps<\n\t\tUnitControlProps,\n\t\t'input',\n\t\tfalse\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__unstableStateReducer: stateReducerProp,\n\t\tautoComplete = 'off',\n\t\tclassName,\n\t\tdisabled = false,\n\t\tdisableUnits = false,\n\t\tisPressEnterToChange = false,\n\t\tisResetValueOnUnitChange = false,\n\t\tisUnitSelectTabbable = true,\n\t\tlabel,\n\t\tonChange: onChangeProp,\n\t\tonUnitChange,\n\t\tsize = 'default',\n\t\tstyle,\n\t\tunit: unitProp,\n\t\tunits: unitsProp = CSS_UNITS,\n\t\tvalue: valueProp,\n\t\tonBlur: onBlurProp,\n\t\t...props\n\t} = unitControlProps;\n\n\tif ( 'unit' in unitControlProps ) {\n\t\tdeprecated( 'UnitControl unit prop', {\n\t\t\tsince: '5.6',\n\t\t\thint: 'The unit should be provided within the `value` prop.',\n\t\t\tversion: '6.2',\n\t\t} );\n\t}\n\n\t// The `value` prop, in theory, should not be `null`, but the following line\n\t// ensures it fallback to `undefined` in case a consumer of `UnitControl`\n\t// still passes `null` as a `value`.\n\tconst nonNullValueProp = valueProp ?? undefined;\n\tconst units = useMemo(\n\t\t() => getUnitsWithCurrentUnit( nonNullValueProp, unitProp, unitsProp ),\n\t\t[ nonNullValueProp, unitProp, unitsProp ]\n\t);\n\tconst [ parsedQuantity, parsedUnit ] = getParsedQuantityAndUnit(\n\t\tnonNullValueProp,\n\t\tunitProp,\n\t\tunits\n\t);\n\n\tconst [ unit, setUnit ] = useControlledState< string | undefined >(\n\t\tunitProp,\n\t\t{\n\t\t\tinitial: parsedUnit,\n\t\t\tfallback: '',\n\t\t}\n\t);\n\n\tuseEffect( () => {\n\t\tif ( parsedUnit !== undefined ) {\n\t\t\tsetUnit( parsedUnit );\n\t\t}\n\t}, [ parsedUnit ] );\n\n\t// Stores parsed value for hand-off in state reducer.\n\tconst refParsedQuantity = useRef< number | undefined >( undefined );\n\n\tconst classes = classnames( 'components-unit-control', className );\n\n\tconst handleOnQuantityChange = (\n\t\tnextQuantityValue: number | string | undefined,\n\t\tchangeProps: {\n\t\t\tevent:\n\t\t\t\t| ChangeEvent< HTMLInputElement >\n\t\t\t\t| PointerEvent< HTMLInputElement >;\n\t\t}\n\t) => {\n\t\tif (\n\t\t\tnextQuantityValue === '' ||\n\t\t\ttypeof nextQuantityValue === 'undefined' ||\n\t\t\tnextQuantityValue === null\n\t\t) {\n\t\t\tonChangeProp?.( '', changeProps );\n\t\t\treturn;\n\t\t}\n\n\t\t/*\n\t\t * Customizing the onChange callback.\n\t\t * This allows as to broadcast a combined value+unit to onChange.\n\t\t */\n\t\tconst onChangeValue = getValidParsedQuantityAndUnit(\n\t\t\tnextQuantityValue,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t).join( '' );\n\n\t\tonChangeProp?.( onChangeValue, changeProps );\n\t};\n\n\tconst handleOnUnitChange: UnitControlOnChangeCallback = (\n\t\tnextUnitValue,\n\t\tchangeProps\n\t) => {\n\t\tconst { data } = changeProps;\n\n\t\tlet nextValue = `${ parsedQuantity ?? '' }${ nextUnitValue }`;\n\n\t\tif ( isResetValueOnUnitChange && data?.default !== undefined ) {\n\t\t\tnextValue = `${ data.default }${ nextUnitValue }`;\n\t\t}\n\n\t\tonChangeProp?.( nextValue, changeProps );\n\t\tonUnitChange?.( nextUnitValue, changeProps );\n\n\t\tsetUnit( nextUnitValue );\n\t};\n\n\tconst mayUpdateUnit = ( event: SyntheticEvent< HTMLInputElement > ) => {\n\t\tif ( ! isNaN( Number( event.currentTarget.value ) ) ) {\n\t\t\trefParsedQuantity.current = undefined;\n\t\t\treturn;\n\t\t}\n\t\tconst [\n\t\t\tvalidParsedQuantity,\n\t\t\tvalidParsedUnit,\n\t\t] = getValidParsedQuantityAndUnit(\n\t\t\tevent.currentTarget.value,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t);\n\n\t\trefParsedQuantity.current = validParsedQuantity;\n\n\t\tif ( isPressEnterToChange && validParsedUnit !== unit ) {\n\t\t\tconst data = Array.isArray( units )\n\t\t\t\t? units.find( ( option ) => option.value === validParsedUnit )\n\t\t\t\t: undefined;\n\t\t\tconst changeProps = { event, data };\n\n\t\t\tonChangeProp?.(\n\t\t\t\t`${ validParsedQuantity ?? '' }${ validParsedUnit }`,\n\t\t\t\tchangeProps\n\t\t\t);\n\t\t\tonUnitChange?.( validParsedUnit, changeProps );\n\n\t\t\tsetUnit( validParsedUnit );\n\t\t}\n\t};\n\n\tconst handleOnBlur: FocusEventHandler< HTMLInputElement > = ( event ) => {\n\t\tmayUpdateUnit( event );\n\t\tonBlurProp?.( event );\n\t};\n\n\tconst handleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\tconst { key } = event;\n\t\tif ( key === 'Enter' ) {\n\t\t\tmayUpdateUnit( event );\n\t\t}\n\t};\n\n\t/**\n\t * \"Middleware\" function that intercepts updates from InputControl.\n\t * This allows us to tap into actions to transform the (next) state for\n\t * InputControl.\n\t *\n\t * @param state State from InputControl\n\t * @param action Action triggering state change\n\t * @return The updated state to apply to InputControl\n\t */\n\tconst unitControlStateReducer: StateReducer = ( state, action ) => {\n\t\tconst nextState = { ...state };\n\n\t\t/*\n\t\t * On commits (when pressing ENTER and on blur if\n\t\t * isPressEnterToChange is true), if a parse has been performed\n\t\t * then use that result to update the state.\n\t\t */\n\t\tif ( action.type === inputControlActionTypes.COMMIT ) {\n\t\t\tif ( refParsedQuantity.current !== undefined ) {\n\t\t\t\tnextState.value = (\n\t\t\t\t\trefParsedQuantity.current ?? ''\n\t\t\t\t).toString();\n\t\t\t\trefParsedQuantity.current = undefined;\n\t\t\t}\n\t\t}\n\n\t\treturn nextState;\n\t};\n\n\tlet stateReducer: StateReducer = unitControlStateReducer;\n\tif ( stateReducerProp ) {\n\t\tstateReducer = ( state, action ) => {\n\t\t\tconst baseState = unitControlStateReducer( state, action );\n\t\t\treturn stateReducerProp( baseState, action );\n\t\t};\n\t}\n\n\tconst inputSuffix = ! disableUnits ? (\n\t\t<UnitSelectControl\n\t\t\taria-label={ __( 'Select unit' ) }\n\t\t\tdisabled={ disabled }\n\t\t\tisUnitSelectTabbable={ isUnitSelectTabbable }\n\t\t\tonChange={ handleOnUnitChange }\n\t\t\tsize={ size }\n\t\t\tunit={ unit }\n\t\t\tunits={ units }\n\t\t\tonBlur={ onBlurProp }\n\t\t/>\n\t) : null;\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\treturn (\n\t\t<Root className=\"components-unit-control-wrapper\" style={ style }>\n\t\t\t<ValueInput\n\t\t\t\taria-label={ label }\n\t\t\t\ttype={ isPressEnterToChange ? 'text' : 'number' }\n\t\t\t\t{ ...omit( props, [ 'children' ] ) }\n\t\t\t\tautoComplete={ autoComplete }\n\t\t\t\tclassName={ classes }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\t\tlabel={ label }\n\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\tonKeyDown={ handleOnKeyDown }\n\t\t\t\tonChange={ handleOnQuantityChange }\n\t\t\t\tref={ forwardedRef }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ inputSuffix }\n\t\t\t\tvalue={ parsedQuantity ?? '' }\n\t\t\t\tstep={ step }\n\t\t\t\t__unstableStateReducer={ stateReducer }\n\t\t\t/>\n\t\t</Root>\n\t);\n}\n\n/**\n * `UnitControl` allows the user to set a numeric quantity as well as a unit (e.g. `px`).\n *\n *\n * @example\n * ```jsx\n * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n * const [ value, setValue ] = useState( '10px' );\n *\n * return <UnitControl onChange={ setValue } value={ value } />;\n * };\n * ```\n */\nexport const UnitControl = forwardRef( UnforwardedUnitControl );\n\nexport { parseQuantityAndUnitFromRawValue, useCustomUnits } from './utils';\nexport default UnitControl;\n"]}
|
|
@@ -4,7 +4,6 @@ import { createElement } from "@wordpress/element";
|
|
|
4
4
|
/**
|
|
5
5
|
* External dependencies
|
|
6
6
|
*/
|
|
7
|
-
import { noop } from 'lodash';
|
|
8
7
|
import classnames from 'classnames';
|
|
9
8
|
import { UnitSelect, UnitLabel } from './styles/unit-control-styles';
|
|
10
9
|
import { CSS_UNITS, hasUnits } from './utils';
|
|
@@ -12,7 +11,7 @@ export default function UnitSelectControl(_ref) {
|
|
|
12
11
|
let {
|
|
13
12
|
className,
|
|
14
13
|
isUnitSelectTabbable: isTabbable = true,
|
|
15
|
-
onChange
|
|
14
|
+
onChange,
|
|
16
15
|
size = 'default',
|
|
17
16
|
unit = 'px',
|
|
18
17
|
units = CSS_UNITS,
|
|
@@ -31,7 +30,7 @@ export default function UnitSelectControl(_ref) {
|
|
|
31
30
|
value: unitValue
|
|
32
31
|
} = event.target;
|
|
33
32
|
const data = units.find(option => option.value === unitValue);
|
|
34
|
-
onChange(unitValue, {
|
|
33
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(unitValue, {
|
|
35
34
|
event,
|
|
36
35
|
data
|
|
37
36
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/unit-control/unit-select-control.tsx"],"names":["
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/unit-control/unit-select-control.tsx"],"names":["classnames","UnitSelect","UnitLabel","CSS_UNITS","hasUnits","UnitSelectControl","className","isUnitSelectTabbable","isTabbable","onChange","size","unit","units","props","length","handleOnChange","event","value","unitValue","target","data","find","option","classes","undefined","map","label"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAOA,SAASC,UAAT,EAAqBC,SAArB,QAAsC,8BAAtC;AACA,SAASC,SAAT,EAAoBC,QAApB,QAAoC,SAApC;AAGA,eAAe,SAASC,iBAAT,OAQyD;AAAA,MAR7B;AAC1CC,IAAAA,SAD0C;AAE1CC,IAAAA,oBAAoB,EAAEC,UAAU,GAAG,IAFO;AAG1CC,IAAAA,QAH0C;AAI1CC,IAAAA,IAAI,GAAG,SAJmC;AAK1CC,IAAAA,IAAI,GAAG,IALmC;AAM1CC,IAAAA,KAAK,GAAGT,SANkC;AAO1C,OAAGU;AAPuC,GAQ6B;;AACvE,MAAK,CAAET,QAAQ,CAAEQ,KAAF,CAAV,IAAuB,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEE,MAAP,MAAkB,CAA9C,EAAkD;AACjD,WACC,cAAC,SAAD;AACC,MAAA,SAAS,EAAC,qCADX;AAEC,MAAA,UAAU,EAAGJ;AAFd,OAIGC,IAJH,CADD;AAQA;;AAED,QAAMI,cAAc,GAAKC,KAAF,IAA+C;AACrE,UAAM;AAAEC,MAAAA,KAAK,EAAEC;AAAT,QAAuBF,KAAK,CAACG,MAAnC;AACA,UAAMC,IAAI,GAAGR,KAAK,CAACS,IAAN,CAAcC,MAAF,IAAcA,MAAM,CAACL,KAAP,KAAiBC,SAA3C,CAAb;AAEAT,IAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAIS,SAAJ,EAAe;AAAEF,MAAAA,KAAF;AAASI,MAAAA;AAAT,KAAf,CAAR;AACA,GALD;;AAOA,QAAMG,OAAO,GAAGvB,UAAU,CAAE,iCAAF,EAAqCM,SAArC,CAA1B;AAEA,SACC,cAAC,UAAD;AACC,IAAA,SAAS,EAAGiB,OADb;AAEC,IAAA,QAAQ,EAAGR,cAFZ;AAGC,IAAA,UAAU,EAAGL,IAHd;AAIC,IAAA,QAAQ,EAAGF,UAAU,GAAGgB,SAAH,GAAe,CAAC,CAJtC;AAKC,IAAA,KAAK,EAAGb;AALT,KAMME,KANN,GAQGD,KAAK,CAACa,GAAN,CAAaH,MAAF,IACZ;AAAQ,IAAA,KAAK,EAAGA,MAAM,CAACL,KAAvB;AAA+B,IAAA,GAAG,EAAGK,MAAM,CAACL;AAA5C,KACGK,MAAM,CAACI,KADV,CADC,CARH,CADD;AAgBA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ChangeEvent } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport { UnitSelect, UnitLabel } from './styles/unit-control-styles';\nimport { CSS_UNITS, hasUnits } from './utils';\nimport type { UnitSelectControlProps } from './types';\n\nexport default function UnitSelectControl( {\n\tclassName,\n\tisUnitSelectTabbable: isTabbable = true,\n\tonChange,\n\tsize = 'default',\n\tunit = 'px',\n\tunits = CSS_UNITS,\n\t...props\n}: WordPressComponentProps< UnitSelectControlProps, 'select', false > ) {\n\tif ( ! hasUnits( units ) || units?.length === 1 ) {\n\t\treturn (\n\t\t\t<UnitLabel\n\t\t\t\tclassName=\"components-unit-control__unit-label\"\n\t\t\t\tselectSize={ size }\n\t\t\t>\n\t\t\t\t{ unit }\n\t\t\t</UnitLabel>\n\t\t);\n\t}\n\n\tconst handleOnChange = ( event: ChangeEvent< HTMLSelectElement > ) => {\n\t\tconst { value: unitValue } = event.target;\n\t\tconst data = units.find( ( option ) => option.value === unitValue );\n\n\t\tonChange?.( unitValue, { event, data } );\n\t};\n\n\tconst classes = classnames( 'components-unit-control__select', className );\n\n\treturn (\n\t\t<UnitSelect\n\t\t\tclassName={ classes }\n\t\t\tonChange={ handleOnChange }\n\t\t\tselectSize={ size }\n\t\t\ttabIndex={ isTabbable ? undefined : -1 }\n\t\t\tvalue={ unit }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ units.map( ( option ) => (\n\t\t\t\t<option value={ option.value } key={ option.value }>\n\t\t\t\t\t{ option.label }\n\t\t\t\t</option>\n\t\t\t) ) }\n\t\t</UnitSelect>\n\t);\n}\n"]}
|
|
@@ -163,8 +163,10 @@ export const UI = {
|
|
|
163
163
|
textDisabled: DARK_GRAY[150],
|
|
164
164
|
textDark: BASE.white,
|
|
165
165
|
textLight: BASE.black
|
|
166
|
-
};
|
|
167
|
-
|
|
166
|
+
}; // Using Object.assign instead of { ...spread } syntax helps TypeScript
|
|
167
|
+
// to extract the correct type defs here.
|
|
168
|
+
|
|
169
|
+
export const COLORS = Object.assign({}, BASE, {
|
|
168
170
|
darkGray: merge({}, DARK_GRAY, G2.darkGray),
|
|
169
171
|
darkOpacity: DARK_OPACITY,
|
|
170
172
|
darkOpacityLight: DARK_OPACITY_LIGHT,
|
|
@@ -176,6 +178,6 @@ export const COLORS = { ...BASE,
|
|
|
176
178
|
alert: ALERT,
|
|
177
179
|
admin: ADMIN,
|
|
178
180
|
ui: UI
|
|
179
|
-
};
|
|
181
|
+
});
|
|
180
182
|
export default COLORS;
|
|
181
183
|
//# sourceMappingURL=colors-values.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/utils/colors-values.js"],"names":["merge","rgba","BASE","black","white","G2","blue","medium","focus","focusDark","gray","darkGray","primary","heading","mediumGray","text","lightGray","ui","secondary","tertiary","DARK_GRAY","placeholder","DARK_OPACITY","backgroundFill","DARK_OPACITY_LIGHT","LIGHT_GRAY","LIGHT_OPACITY_LIGHT","BLUE","wordpress","dark","highlight","ALERT","yellow","red","green","ADMIN","theme","themeDark10","UI","background","backgroundDisabled","border","borderHover","borderFocus","borderDisabled","borderLight","label","textDisabled","textDark","textLight","COLORS","darkOpacity","darkOpacityLight","lightGrayLight","alert","admin"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { merge } from 'lodash';\n\n/**\n * Internal dependencies\n */\nimport { rgba } from './colors';\n\nexport const BASE = {\n\tblack: '#000',\n\twhite: '#fff',\n};\n\n/**\n * TODO: Continue to update values as \"G2\" design evolves.\n *\n * \"G2\" refers to the movement to advance the interface of the block editor.\n * https://github.com/WordPress/gutenberg/issues/18667\n */\nexport const G2 = {\n\tblue: {\n\t\tmedium: {\n\t\t\tfocus: '#007cba',\n\t\t\tfocusDark: '#fff',\n\t\t},\n\t},\n\tgray: {\n\t\t900: '#1e1e1e',\n\t\t700: '#757575', // Meets 4.6:1 text contrast against white.\n\t\t600: '#949494', // Meets 3:1 UI or large text contrast against white.\n\t\t400: '#ccc',\n\t\t300: '#ddd', // Used for most borders.\n\t\t200: '#e0e0e0', // Used sparingly for light borders.\n\t\t100: '#f0f0f0', // Used for light gray backgrounds.\n\t},\n\tdarkGray: {\n\t\tprimary: '#1e1e1e',\n\t\theading: '#050505',\n\t},\n\tmediumGray: {\n\t\ttext: '#757575',\n\t},\n\tlightGray: {\n\t\tui: '#949494',\n\t\tsecondary: '#ccc',\n\t\ttertiary: '#e7e8e9',\n\t},\n};\n\nexport const DARK_GRAY = {\n\t900: '#191e23',\n\t800: '#23282d',\n\t700: '#32373c',\n\t600: '#40464d',\n\t500: '#555d66', // Use this most of the time for dark items.\n\t400: '#606a73',\n\t300: '#6c7781', // Lightest gray that can be used for AA text contrast.\n\t200: '#7e8993',\n\t150: '#8d96a0', // Lightest gray that can be used for AA non-text contrast.\n\t100: '#8f98a1',\n\tplaceholder: rgba( G2.gray[ 900 ], 0.62 ),\n};\n\nexport const DARK_OPACITY = {\n\t900: rgba( '#000510', 0.9 ),\n\t800: rgba( '#00000a', 0.85 ),\n\t700: rgba( '#06060b', 0.8 ),\n\t600: rgba( '#000913', 0.75 ),\n\t500: rgba( '#0a1829', 0.7 ),\n\t400: rgba( '#0a1829', 0.65 ),\n\t300: rgba( '#0e1c2e', 0.62 ),\n\t200: rgba( '#162435', 0.55 ),\n\t100: rgba( '#223443', 0.5 ),\n\tbackgroundFill: rgba( DARK_GRAY[ 700 ], 0.7 ),\n};\n\nexport const DARK_OPACITY_LIGHT = {\n\t900: rgba( '#304455', 0.45 ),\n\t800: rgba( '#425863', 0.4 ),\n\t700: rgba( '#667886', 0.35 ),\n\t600: rgba( '#7b86a2', 0.3 ),\n\t500: rgba( '#9197a2', 0.25 ),\n\t400: rgba( '#95959c', 0.2 ),\n\t300: rgba( '#829493', 0.15 ),\n\t200: rgba( '#8b8b96', 0.1 ),\n\t100: rgba( '#747474', 0.05 ),\n};\n\nexport const LIGHT_GRAY = {\n\t900: '#a2aab2',\n\t800: '#b5bcc2',\n\t700: '#ccd0d4',\n\t600: '#d7dade',\n\t500: '#e2e4e7', // Good for \"grayed\" items and borders.\n\t400: '#e8eaeb', // Good for \"readonly\" input fields and special text selection.\n\t300: '#edeff0',\n\t200: '#f3f4f5',\n\t100: '#f8f9f9',\n\tplaceholder: rgba( BASE.white, 0.65 ),\n};\n\nexport const LIGHT_OPACITY_LIGHT = {\n\t900: rgba( BASE.white, 0.5 ),\n\t800: rgba( BASE.white, 0.45 ),\n\t700: rgba( BASE.white, 0.4 ),\n\t600: rgba( BASE.white, 0.35 ),\n\t500: rgba( BASE.white, 0.3 ),\n\t400: rgba( BASE.white, 0.25 ),\n\t300: rgba( BASE.white, 0.2 ),\n\t200: rgba( BASE.white, 0.15 ),\n\t100: rgba( BASE.white, 0.1 ),\n\tbackgroundFill: rgba( LIGHT_GRAY[ 300 ], 0.8 ),\n};\n\n// Additional colors.\n// Some are from https://make.wordpress.org/design/handbook/foundations/colors/.\n\nexport const BLUE = {\n\twordpress: {\n\t\t700: '#00669b',\n\t},\n\tdark: {\n\t\t900: '#0071a1',\n\t},\n\tmedium: {\n\t\t900: '#006589',\n\t\t800: '#00739c',\n\t\t700: '#007fac',\n\t\t600: '#008dbe',\n\t\t500: '#00a0d2',\n\t\t400: '#33b3db',\n\t\t300: '#66c6e4',\n\t\t200: '#bfe7f3',\n\t\t100: '#e5f5fa',\n\t\thighlight: '#b3e7fe',\n\t\tfocus: '#007cba',\n\t},\n};\n\nexport const ALERT = {\n\tyellow: '#f0b849',\n\tred: '#d94f4f',\n\tgreen: '#4ab866',\n};\n\nexport const ADMIN = {\n\ttheme: `var( --wp-admin-theme-color, ${ BLUE.wordpress[ 700 ] })`,\n\tthemeDark10: `var( --wp-admin-theme-color-darker-10, ${ BLUE.medium.focus })`,\n};\n\n// Namespaced values for raw colors hex codes.\nexport const UI = {\n\ttheme: ADMIN.theme,\n\tbackground: BASE.white,\n\tbackgroundDisabled: LIGHT_GRAY[ 200 ],\n\tborder: G2.gray[ 700 ],\n\tborderHover: G2.gray[ 700 ],\n\tborderFocus: ADMIN.themeDark10,\n\tborderDisabled: G2.gray[ 400 ],\n\tborderLight: G2.gray[ 300 ],\n\tlabel: DARK_GRAY[ 500 ],\n\ttextDisabled: DARK_GRAY[ 150 ],\n\ttextDark: BASE.white,\n\ttextLight: BASE.black,\n};\n\nexport const COLORS = {\n\t...BASE,\n\tdarkGray: merge( {}, DARK_GRAY, G2.darkGray ),\n\tdarkOpacity: DARK_OPACITY,\n\tdarkOpacityLight: DARK_OPACITY_LIGHT,\n\tmediumGray: G2.mediumGray,\n\tgray: G2.gray,\n\tlightGray: merge( {}, LIGHT_GRAY, G2.lightGray ),\n\tlightGrayLight: LIGHT_OPACITY_LIGHT,\n\tblue: merge( {}, BLUE, G2.blue ),\n\talert: ALERT,\n\tadmin: ADMIN,\n\tui: UI,\n};\n\nexport default COLORS;\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/utils/colors-values.js"],"names":["merge","rgba","BASE","black","white","G2","blue","medium","focus","focusDark","gray","darkGray","primary","heading","mediumGray","text","lightGray","ui","secondary","tertiary","DARK_GRAY","placeholder","DARK_OPACITY","backgroundFill","DARK_OPACITY_LIGHT","LIGHT_GRAY","LIGHT_OPACITY_LIGHT","BLUE","wordpress","dark","highlight","ALERT","yellow","red","green","ADMIN","theme","themeDark10","UI","background","backgroundDisabled","border","borderHover","borderFocus","borderDisabled","borderLight","label","textDisabled","textDark","textLight","COLORS","Object","assign","darkOpacity","darkOpacityLight","lightGrayLight","alert","admin"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,KAAT,QAAsB,QAAtB;AAEA;AACA;AACA;;AACA,SAASC,IAAT,QAAqB,UAArB;AAEA,OAAO,MAAMC,IAAI,GAAG;AACnBC,EAAAA,KAAK,EAAE,MADY;AAEnBC,EAAAA,KAAK,EAAE;AAFY,CAAb;AAKP;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,EAAE,GAAG;AACjBC,EAAAA,IAAI,EAAE;AACLC,IAAAA,MAAM,EAAE;AACPC,MAAAA,KAAK,EAAE,SADA;AAEPC,MAAAA,SAAS,EAAE;AAFJ;AADH,GADW;AAOjBC,EAAAA,IAAI,EAAE;AACL,SAAK,SADA;AAEL,SAAK,SAFA;AAEW;AAChB,SAAK,SAHA;AAGW;AAChB,SAAK,MAJA;AAKL,SAAK,MALA;AAKQ;AACb,SAAK,SANA;AAMW;AAChB,SAAK,SAPA,CAOW;;AAPX,GAPW;AAgBjBC,EAAAA,QAAQ,EAAE;AACTC,IAAAA,OAAO,EAAE,SADA;AAETC,IAAAA,OAAO,EAAE;AAFA,GAhBO;AAoBjBC,EAAAA,UAAU,EAAE;AACXC,IAAAA,IAAI,EAAE;AADK,GApBK;AAuBjBC,EAAAA,SAAS,EAAE;AACVC,IAAAA,EAAE,EAAE,SADM;AAEVC,IAAAA,SAAS,EAAE,MAFD;AAGVC,IAAAA,QAAQ,EAAE;AAHA;AAvBM,CAAX;AA8BP,OAAO,MAAMC,SAAS,GAAG;AACxB,OAAK,SADmB;AAExB,OAAK,SAFmB;AAGxB,OAAK,SAHmB;AAIxB,OAAK,SAJmB;AAKxB,OAAK,SALmB;AAKR;AAChB,OAAK,SANmB;AAOxB,OAAK,SAPmB;AAOR;AAChB,OAAK,SARmB;AASxB,OAAK,SATmB;AASR;AAChB,OAAK,SAVmB;AAWxBC,EAAAA,WAAW,EAAEpB,IAAI,CAAEI,EAAE,CAACK,IAAH,CAAS,GAAT,CAAF,EAAkB,IAAlB;AAXO,CAAlB;AAcP,OAAO,MAAMY,YAAY,GAAG;AAC3B,OAAKrB,IAAI,CAAE,SAAF,EAAa,GAAb,CADkB;AAE3B,OAAKA,IAAI,CAAE,SAAF,EAAa,IAAb,CAFkB;AAG3B,OAAKA,IAAI,CAAE,SAAF,EAAa,GAAb,CAHkB;AAI3B,OAAKA,IAAI,CAAE,SAAF,EAAa,IAAb,CAJkB;AAK3B,OAAKA,IAAI,CAAE,SAAF,EAAa,GAAb,CALkB;AAM3B,OAAKA,IAAI,CAAE,SAAF,EAAa,IAAb,CANkB;AAO3B,OAAKA,IAAI,CAAE,SAAF,EAAa,IAAb,CAPkB;AAQ3B,OAAKA,IAAI,CAAE,SAAF,EAAa,IAAb,CARkB;AAS3B,OAAKA,IAAI,CAAE,SAAF,EAAa,GAAb,CATkB;AAU3BsB,EAAAA,cAAc,EAAEtB,IAAI,CAAEmB,SAAS,CAAE,GAAF,CAAX,EAAoB,GAApB;AAVO,CAArB;AAaP,OAAO,MAAMI,kBAAkB,GAAG;AACjC,OAAKvB,IAAI,CAAE,SAAF,EAAa,IAAb,CADwB;AAEjC,OAAKA,IAAI,CAAE,SAAF,EAAa,GAAb,CAFwB;AAGjC,OAAKA,IAAI,CAAE,SAAF,EAAa,IAAb,CAHwB;AAIjC,OAAKA,IAAI,CAAE,SAAF,EAAa,GAAb,CAJwB;AAKjC,OAAKA,IAAI,CAAE,SAAF,EAAa,IAAb,CALwB;AAMjC,OAAKA,IAAI,CAAE,SAAF,EAAa,GAAb,CANwB;AAOjC,OAAKA,IAAI,CAAE,SAAF,EAAa,IAAb,CAPwB;AAQjC,OAAKA,IAAI,CAAE,SAAF,EAAa,GAAb,CARwB;AASjC,OAAKA,IAAI,CAAE,SAAF,EAAa,IAAb;AATwB,CAA3B;AAYP,OAAO,MAAMwB,UAAU,GAAG;AACzB,OAAK,SADoB;AAEzB,OAAK,SAFoB;AAGzB,OAAK,SAHoB;AAIzB,OAAK,SAJoB;AAKzB,OAAK,SALoB;AAKT;AAChB,OAAK,SANoB;AAMT;AAChB,OAAK,SAPoB;AAQzB,OAAK,SARoB;AASzB,OAAK,SAToB;AAUzBJ,EAAAA,WAAW,EAAEpB,IAAI,CAAEC,IAAI,CAACE,KAAP,EAAc,IAAd;AAVQ,CAAnB;AAaP,OAAO,MAAMsB,mBAAmB,GAAG;AAClC,OAAKzB,IAAI,CAAEC,IAAI,CAACE,KAAP,EAAc,GAAd,CADyB;AAElC,OAAKH,IAAI,CAAEC,IAAI,CAACE,KAAP,EAAc,IAAd,CAFyB;AAGlC,OAAKH,IAAI,CAAEC,IAAI,CAACE,KAAP,EAAc,GAAd,CAHyB;AAIlC,OAAKH,IAAI,CAAEC,IAAI,CAACE,KAAP,EAAc,IAAd,CAJyB;AAKlC,OAAKH,IAAI,CAAEC,IAAI,CAACE,KAAP,EAAc,GAAd,CALyB;AAMlC,OAAKH,IAAI,CAAEC,IAAI,CAACE,KAAP,EAAc,IAAd,CANyB;AAOlC,OAAKH,IAAI,CAAEC,IAAI,CAACE,KAAP,EAAc,GAAd,CAPyB;AAQlC,OAAKH,IAAI,CAAEC,IAAI,CAACE,KAAP,EAAc,IAAd,CARyB;AASlC,OAAKH,IAAI,CAAEC,IAAI,CAACE,KAAP,EAAc,GAAd,CATyB;AAUlCmB,EAAAA,cAAc,EAAEtB,IAAI,CAAEwB,UAAU,CAAE,GAAF,CAAZ,EAAqB,GAArB;AAVc,CAA5B,C,CAaP;AACA;;AAEA,OAAO,MAAME,IAAI,GAAG;AACnBC,EAAAA,SAAS,EAAE;AACV,SAAK;AADK,GADQ;AAInBC,EAAAA,IAAI,EAAE;AACL,SAAK;AADA,GAJa;AAOnBtB,EAAAA,MAAM,EAAE;AACP,SAAK,SADE;AAEP,SAAK,SAFE;AAGP,SAAK,SAHE;AAIP,SAAK,SAJE;AAKP,SAAK,SALE;AAMP,SAAK,SANE;AAOP,SAAK,SAPE;AAQP,SAAK,SARE;AASP,SAAK,SATE;AAUPuB,IAAAA,SAAS,EAAE,SAVJ;AAWPtB,IAAAA,KAAK,EAAE;AAXA;AAPW,CAAb;AAsBP,OAAO,MAAMuB,KAAK,GAAG;AACpBC,EAAAA,MAAM,EAAE,SADY;AAEpBC,EAAAA,GAAG,EAAE,SAFe;AAGpBC,EAAAA,KAAK,EAAE;AAHa,CAAd;AAMP,OAAO,MAAMC,KAAK,GAAG;AACpBC,EAAAA,KAAK,EAAG,gCAAgCT,IAAI,CAACC,SAAL,CAAgB,GAAhB,CAAuB,GAD3C;AAEpBS,EAAAA,WAAW,EAAG,0CAA0CV,IAAI,CAACpB,MAAL,CAAYC,KAAO;AAFvD,CAAd,C,CAKP;;AACA,OAAO,MAAM8B,EAAE,GAAG;AACjBF,EAAAA,KAAK,EAAED,KAAK,CAACC,KADI;AAEjBG,EAAAA,UAAU,EAAErC,IAAI,CAACE,KAFA;AAGjBoC,EAAAA,kBAAkB,EAAEf,UAAU,CAAE,GAAF,CAHb;AAIjBgB,EAAAA,MAAM,EAAEpC,EAAE,CAACK,IAAH,CAAS,GAAT,CAJS;AAKjBgC,EAAAA,WAAW,EAAErC,EAAE,CAACK,IAAH,CAAS,GAAT,CALI;AAMjBiC,EAAAA,WAAW,EAAER,KAAK,CAACE,WANF;AAOjBO,EAAAA,cAAc,EAAEvC,EAAE,CAACK,IAAH,CAAS,GAAT,CAPC;AAQjBmC,EAAAA,WAAW,EAAExC,EAAE,CAACK,IAAH,CAAS,GAAT,CARI;AASjBoC,EAAAA,KAAK,EAAE1B,SAAS,CAAE,GAAF,CATC;AAUjB2B,EAAAA,YAAY,EAAE3B,SAAS,CAAE,GAAF,CAVN;AAWjB4B,EAAAA,QAAQ,EAAE9C,IAAI,CAACE,KAXE;AAYjB6C,EAAAA,SAAS,EAAE/C,IAAI,CAACC;AAZC,CAAX,C,CAeP;AACA;;AACA,OAAO,MAAM+C,MAAM,GAAGC,MAAM,CAACC,MAAP,CAAe,EAAf,EAAmBlD,IAAnB,EAAyB;AAC9CS,EAAAA,QAAQ,EAAEX,KAAK,CAAE,EAAF,EAAMoB,SAAN,EAAiBf,EAAE,CAACM,QAApB,CAD+B;AAE9C0C,EAAAA,WAAW,EAAE/B,YAFiC;AAG9CgC,EAAAA,gBAAgB,EAAE9B,kBAH4B;AAI9CV,EAAAA,UAAU,EAAET,EAAE,CAACS,UAJ+B;AAK9CJ,EAAAA,IAAI,EAAEL,EAAE,CAACK,IALqC;AAM9CM,EAAAA,SAAS,EAAEhB,KAAK,CAAE,EAAF,EAAMyB,UAAN,EAAkBpB,EAAE,CAACW,SAArB,CAN8B;AAO9CuC,EAAAA,cAAc,EAAE7B,mBAP8B;AAQ9CpB,EAAAA,IAAI,EAAEN,KAAK,CAAE,EAAF,EAAM2B,IAAN,EAAYtB,EAAE,CAACC,IAAf,CARmC;AAS9CkD,EAAAA,KAAK,EAAEzB,KATuC;AAU9C0B,EAAAA,KAAK,EAAEtB,KAVuC;AAW9ClB,EAAAA,EAAE,EAAEqB;AAX0C,CAAzB,CAAf;AAcP,eAAeY,MAAf","sourcesContent":["/**\n * External dependencies\n */\nimport { merge } from 'lodash';\n\n/**\n * Internal dependencies\n */\nimport { rgba } from './colors';\n\nexport const BASE = {\n\tblack: '#000',\n\twhite: '#fff',\n};\n\n/**\n * TODO: Continue to update values as \"G2\" design evolves.\n *\n * \"G2\" refers to the movement to advance the interface of the block editor.\n * https://github.com/WordPress/gutenberg/issues/18667\n */\nexport const G2 = {\n\tblue: {\n\t\tmedium: {\n\t\t\tfocus: '#007cba',\n\t\t\tfocusDark: '#fff',\n\t\t},\n\t},\n\tgray: {\n\t\t900: '#1e1e1e',\n\t\t700: '#757575', // Meets 4.6:1 text contrast against white.\n\t\t600: '#949494', // Meets 3:1 UI or large text contrast against white.\n\t\t400: '#ccc',\n\t\t300: '#ddd', // Used for most borders.\n\t\t200: '#e0e0e0', // Used sparingly for light borders.\n\t\t100: '#f0f0f0', // Used for light gray backgrounds.\n\t},\n\tdarkGray: {\n\t\tprimary: '#1e1e1e',\n\t\theading: '#050505',\n\t},\n\tmediumGray: {\n\t\ttext: '#757575',\n\t},\n\tlightGray: {\n\t\tui: '#949494',\n\t\tsecondary: '#ccc',\n\t\ttertiary: '#e7e8e9',\n\t},\n};\n\nexport const DARK_GRAY = {\n\t900: '#191e23',\n\t800: '#23282d',\n\t700: '#32373c',\n\t600: '#40464d',\n\t500: '#555d66', // Use this most of the time for dark items.\n\t400: '#606a73',\n\t300: '#6c7781', // Lightest gray that can be used for AA text contrast.\n\t200: '#7e8993',\n\t150: '#8d96a0', // Lightest gray that can be used for AA non-text contrast.\n\t100: '#8f98a1',\n\tplaceholder: rgba( G2.gray[ 900 ], 0.62 ),\n};\n\nexport const DARK_OPACITY = {\n\t900: rgba( '#000510', 0.9 ),\n\t800: rgba( '#00000a', 0.85 ),\n\t700: rgba( '#06060b', 0.8 ),\n\t600: rgba( '#000913', 0.75 ),\n\t500: rgba( '#0a1829', 0.7 ),\n\t400: rgba( '#0a1829', 0.65 ),\n\t300: rgba( '#0e1c2e', 0.62 ),\n\t200: rgba( '#162435', 0.55 ),\n\t100: rgba( '#223443', 0.5 ),\n\tbackgroundFill: rgba( DARK_GRAY[ 700 ], 0.7 ),\n};\n\nexport const DARK_OPACITY_LIGHT = {\n\t900: rgba( '#304455', 0.45 ),\n\t800: rgba( '#425863', 0.4 ),\n\t700: rgba( '#667886', 0.35 ),\n\t600: rgba( '#7b86a2', 0.3 ),\n\t500: rgba( '#9197a2', 0.25 ),\n\t400: rgba( '#95959c', 0.2 ),\n\t300: rgba( '#829493', 0.15 ),\n\t200: rgba( '#8b8b96', 0.1 ),\n\t100: rgba( '#747474', 0.05 ),\n};\n\nexport const LIGHT_GRAY = {\n\t900: '#a2aab2',\n\t800: '#b5bcc2',\n\t700: '#ccd0d4',\n\t600: '#d7dade',\n\t500: '#e2e4e7', // Good for \"grayed\" items and borders.\n\t400: '#e8eaeb', // Good for \"readonly\" input fields and special text selection.\n\t300: '#edeff0',\n\t200: '#f3f4f5',\n\t100: '#f8f9f9',\n\tplaceholder: rgba( BASE.white, 0.65 ),\n};\n\nexport const LIGHT_OPACITY_LIGHT = {\n\t900: rgba( BASE.white, 0.5 ),\n\t800: rgba( BASE.white, 0.45 ),\n\t700: rgba( BASE.white, 0.4 ),\n\t600: rgba( BASE.white, 0.35 ),\n\t500: rgba( BASE.white, 0.3 ),\n\t400: rgba( BASE.white, 0.25 ),\n\t300: rgba( BASE.white, 0.2 ),\n\t200: rgba( BASE.white, 0.15 ),\n\t100: rgba( BASE.white, 0.1 ),\n\tbackgroundFill: rgba( LIGHT_GRAY[ 300 ], 0.8 ),\n};\n\n// Additional colors.\n// Some are from https://make.wordpress.org/design/handbook/foundations/colors/.\n\nexport const BLUE = {\n\twordpress: {\n\t\t700: '#00669b',\n\t},\n\tdark: {\n\t\t900: '#0071a1',\n\t},\n\tmedium: {\n\t\t900: '#006589',\n\t\t800: '#00739c',\n\t\t700: '#007fac',\n\t\t600: '#008dbe',\n\t\t500: '#00a0d2',\n\t\t400: '#33b3db',\n\t\t300: '#66c6e4',\n\t\t200: '#bfe7f3',\n\t\t100: '#e5f5fa',\n\t\thighlight: '#b3e7fe',\n\t\tfocus: '#007cba',\n\t},\n};\n\nexport const ALERT = {\n\tyellow: '#f0b849',\n\tred: '#d94f4f',\n\tgreen: '#4ab866',\n};\n\nexport const ADMIN = {\n\ttheme: `var( --wp-admin-theme-color, ${ BLUE.wordpress[ 700 ] })`,\n\tthemeDark10: `var( --wp-admin-theme-color-darker-10, ${ BLUE.medium.focus })`,\n};\n\n// Namespaced values for raw colors hex codes.\nexport const UI = {\n\ttheme: ADMIN.theme,\n\tbackground: BASE.white,\n\tbackgroundDisabled: LIGHT_GRAY[ 200 ],\n\tborder: G2.gray[ 700 ],\n\tborderHover: G2.gray[ 700 ],\n\tborderFocus: ADMIN.themeDark10,\n\tborderDisabled: G2.gray[ 400 ],\n\tborderLight: G2.gray[ 300 ],\n\tlabel: DARK_GRAY[ 500 ],\n\ttextDisabled: DARK_GRAY[ 150 ],\n\ttextDark: BASE.white,\n\ttextLight: BASE.black,\n};\n\n// Using Object.assign instead of { ...spread } syntax helps TypeScript\n// to extract the correct type defs here.\nexport const COLORS = Object.assign( {}, BASE, {\n\tdarkGray: merge( {}, DARK_GRAY, G2.darkGray ),\n\tdarkOpacity: DARK_OPACITY,\n\tdarkOpacityLight: DARK_OPACITY_LIGHT,\n\tmediumGray: G2.mediumGray,\n\tgray: G2.gray,\n\tlightGray: merge( {}, LIGHT_GRAY, G2.lightGray ),\n\tlightGrayLight: LIGHT_OPACITY_LIGHT,\n\tblue: merge( {}, BLUE, G2.blue ),\n\talert: ALERT,\n\tadmin: ADMIN,\n\tui: UI,\n} );\n\nexport default COLORS;\n"]}
|
|
@@ -27,10 +27,14 @@ const CONTROL_PROPS = {
|
|
|
27
27
|
const TOGGLE_GROUP_CONTROL_PROPS = {
|
|
28
28
|
toggleGroupControlBackgroundColor: CONTROL_PROPS.controlBackgroundColor,
|
|
29
29
|
toggleGroupControlBorderColor: COLORS.ui.border,
|
|
30
|
+
toggleGroupControlBackdropBackgroundColor: CONTROL_PROPS.controlSurfaceColor,
|
|
31
|
+
toggleGroupControlBackdropBorderColor: COLORS.ui.border,
|
|
32
|
+
toggleGroupControlBackdropBoxShadow: 'transparent',
|
|
30
33
|
toggleGroupControlButtonColorActive: CONTROL_PROPS.controlBackgroundColor
|
|
31
|
-
};
|
|
32
|
-
|
|
33
|
-
|
|
34
|
+
}; // Using Object.assign to avoid creating circular references when emitting
|
|
35
|
+
// TypeScript type declarations.
|
|
36
|
+
|
|
37
|
+
export default Object.assign({}, CONTROL_PROPS, TOGGLE_GROUP_CONTROL_PROPS, {
|
|
34
38
|
colorDivider: 'rgba(0, 0, 0, 0.1)',
|
|
35
39
|
colorScrollbarThumb: 'rgba(0, 0, 0, 0.2)',
|
|
36
40
|
colorScrollbarThumbHover: 'rgba(0, 0, 0, 0.5)',
|
|
@@ -75,5 +79,5 @@ export default { ...CONTROL_PROPS,
|
|
|
75
79
|
transitionDurationFastest: '100ms',
|
|
76
80
|
transitionTimingFunction: 'cubic-bezier(0.08, 0.52, 0.52, 1)',
|
|
77
81
|
transitionTimingFunctionControl: 'cubic-bezier(0.12, 0.8, 0.32, 1)'
|
|
78
|
-
};
|
|
82
|
+
});
|
|
79
83
|
//# sourceMappingURL=config-values.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/utils/config-values.js"],"names":["space","COLORS","CONTROL_HEIGHT","CONTROL_PADDING_X","CONTROL_PROPS","controlSurfaceColor","white","controlTextActiveColor","ui","theme","controlPaddingX","controlPaddingXLarge","controlPaddingXSmall","controlBackgroundColor","controlBorderRadius","controlBorderColor","gray","controlBoxShadow","controlBorderColorHover","controlBoxShadowFocus","admin","controlDestructiveBorderColor","alert","red","controlHeight","controlHeightXSmall","controlHeightSmall","controlHeightLarge","controlHeightXLarge","TOGGLE_GROUP_CONTROL_PROPS","toggleGroupControlBackgroundColor","toggleGroupControlBorderColor","border","toggleGroupControlButtonColorActive","colorDivider","colorScrollbarThumb","colorScrollbarThumbHover","colorScrollbarTrack","elevationIntensity","radiusBlockUi","borderWidth","borderWidthFocus","borderWidthTab","spinnerSize","fontSize","fontSizeH1","fontSizeH2","fontSizeH3","fontSizeH4","fontSizeH5","fontSizeH6","fontSizeInputMobile","fontSizeMobile","fontSizeSmall","fontSizeXSmall","fontLineHeightBase","fontWeight","fontWeightHeading","gridBase","cardBorderRadius","cardPaddingXSmall","cardPaddingSmall","cardPaddingMedium","cardPaddingLarge","surfaceBackgroundColor","surfaceBackgroundSubtleColor","surfaceBackgroundTintColor","surfaceBorderColor","surfaceBorderBoldColor","surfaceBorderSubtleColor","surfaceBackgroundTertiaryColor","surfaceColor","transitionDuration","transitionDurationFast","transitionDurationFaster","transitionDurationFastest","transitionTimingFunction","transitionTimingFunctionControl"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,KAAT,QAAsB,mBAAtB;AACA,SAASC,MAAT,QAAuB,iBAAvB;AAEA,MAAMC,cAAc,GAAG,MAAvB;AACA,MAAMC,iBAAiB,GAAG,MAA1B;AAEA,MAAMC,aAAa,GAAG;AACrBC,EAAAA,mBAAmB,EAAEJ,MAAM,CAACK,KADP;AAErBC,EAAAA,sBAAsB,EAAEN,MAAM,CAACO,EAAP,CAAUC,KAFb;AAGrBC,EAAAA,eAAe,EAAEP,iBAHI;AAIrBQ,EAAAA,oBAAoB,EAAG,QAAQR,iBAAmB,YAJ7B;AAKrBS,EAAAA,oBAAoB,EAAG,QAAQT,iBAAmB,YAL7B;AAMrBU,EAAAA,sBAAsB,EAAEZ,MAAM,CAACK,KANV;AAOrBQ,EAAAA,mBAAmB,EAAE,KAPA;AAQrBC,EAAAA,kBAAkB,EAAEd,MAAM,CAACe,IAAP,CAAa,GAAb,CARC;AASrBC,EAAAA,gBAAgB,EAAE,aATG;AAUrBC,EAAAA,uBAAuB,EAAEjB,MAAM,CAACe,IAAP,CAAa,GAAb,CAVJ;AAWrBG,EAAAA,qBAAqB,EAAG,eAAelB,MAAM,CAACmB,KAAP,CAAaX,KAAO,EAXtC;AAYrBY,EAAAA,6BAA6B,EAAEpB,MAAM,CAACqB,KAAP,CAAaC,GAZvB;AAarBC,EAAAA,aAAa,EAAEtB,cAbM;AAcrBuB,EAAAA,mBAAmB,EAAG,SAASvB,cAAgB,UAd1B;AAerBwB,EAAAA,kBAAkB,EAAG,SAASxB,cAAgB,UAfzB;AAgBrByB,EAAAA,kBAAkB,EAAG,SAASzB,cAAgB,UAhBzB;AAiBrB0B,EAAAA,mBAAmB,EAAG,SAAS1B,cAAgB;AAjB1B,CAAtB;
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/utils/config-values.js"],"names":["space","COLORS","CONTROL_HEIGHT","CONTROL_PADDING_X","CONTROL_PROPS","controlSurfaceColor","white","controlTextActiveColor","ui","theme","controlPaddingX","controlPaddingXLarge","controlPaddingXSmall","controlBackgroundColor","controlBorderRadius","controlBorderColor","gray","controlBoxShadow","controlBorderColorHover","controlBoxShadowFocus","admin","controlDestructiveBorderColor","alert","red","controlHeight","controlHeightXSmall","controlHeightSmall","controlHeightLarge","controlHeightXLarge","TOGGLE_GROUP_CONTROL_PROPS","toggleGroupControlBackgroundColor","toggleGroupControlBorderColor","border","toggleGroupControlBackdropBackgroundColor","toggleGroupControlBackdropBorderColor","toggleGroupControlBackdropBoxShadow","toggleGroupControlButtonColorActive","Object","assign","colorDivider","colorScrollbarThumb","colorScrollbarThumbHover","colorScrollbarTrack","elevationIntensity","radiusBlockUi","borderWidth","borderWidthFocus","borderWidthTab","spinnerSize","fontSize","fontSizeH1","fontSizeH2","fontSizeH3","fontSizeH4","fontSizeH5","fontSizeH6","fontSizeInputMobile","fontSizeMobile","fontSizeSmall","fontSizeXSmall","fontLineHeightBase","fontWeight","fontWeightHeading","gridBase","cardBorderRadius","cardPaddingXSmall","cardPaddingSmall","cardPaddingMedium","cardPaddingLarge","surfaceBackgroundColor","surfaceBackgroundSubtleColor","surfaceBackgroundTintColor","surfaceBorderColor","surfaceBorderBoldColor","surfaceBorderSubtleColor","surfaceBackgroundTertiaryColor","surfaceColor","transitionDuration","transitionDurationFast","transitionDurationFaster","transitionDurationFastest","transitionTimingFunction","transitionTimingFunctionControl"],"mappings":"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","sourcesContent":["/**\n * Internal dependencies\n */\nimport { space } from '../ui/utils/space';\nimport { COLORS } from './colors-values';\n\nconst CONTROL_HEIGHT = '36px';\nconst CONTROL_PADDING_X = '12px';\n\nconst CONTROL_PROPS = {\n\tcontrolSurfaceColor: COLORS.white,\n\tcontrolTextActiveColor: COLORS.ui.theme,\n\tcontrolPaddingX: CONTROL_PADDING_X,\n\tcontrolPaddingXLarge: `calc(${ CONTROL_PADDING_X } * 1.3334)`,\n\tcontrolPaddingXSmall: `calc(${ CONTROL_PADDING_X } / 1.3334)`,\n\tcontrolBackgroundColor: COLORS.white,\n\tcontrolBorderRadius: '2px',\n\tcontrolBorderColor: COLORS.gray[ 700 ],\n\tcontrolBoxShadow: 'transparent',\n\tcontrolBorderColorHover: COLORS.gray[ 700 ],\n\tcontrolBoxShadowFocus: `0 0 0 0.5px ${ COLORS.admin.theme }`,\n\tcontrolDestructiveBorderColor: COLORS.alert.red,\n\tcontrolHeight: CONTROL_HEIGHT,\n\tcontrolHeightXSmall: `calc( ${ CONTROL_HEIGHT } * 0.6 )`,\n\tcontrolHeightSmall: `calc( ${ CONTROL_HEIGHT } * 0.8 )`,\n\tcontrolHeightLarge: `calc( ${ CONTROL_HEIGHT } * 1.2 )`,\n\tcontrolHeightXLarge: `calc( ${ CONTROL_HEIGHT } * 1.4 )`,\n};\n\nconst TOGGLE_GROUP_CONTROL_PROPS = {\n\ttoggleGroupControlBackgroundColor: CONTROL_PROPS.controlBackgroundColor,\n\ttoggleGroupControlBorderColor: COLORS.ui.border,\n\ttoggleGroupControlBackdropBackgroundColor:\n\t\tCONTROL_PROPS.controlSurfaceColor,\n\ttoggleGroupControlBackdropBorderColor: COLORS.ui.border,\n\ttoggleGroupControlBackdropBoxShadow: 'transparent',\n\ttoggleGroupControlButtonColorActive: CONTROL_PROPS.controlBackgroundColor,\n};\n\n// Using Object.assign to avoid creating circular references when emitting\n// TypeScript type declarations.\nexport default Object.assign( {}, CONTROL_PROPS, TOGGLE_GROUP_CONTROL_PROPS, {\n\tcolorDivider: 'rgba(0, 0, 0, 0.1)',\n\tcolorScrollbarThumb: 'rgba(0, 0, 0, 0.2)',\n\tcolorScrollbarThumbHover: 'rgba(0, 0, 0, 0.5)',\n\tcolorScrollbarTrack: 'rgba(0, 0, 0, 0.04)',\n\televationIntensity: 1,\n\tradiusBlockUi: '2px',\n\tborderWidth: '1px',\n\tborderWidthFocus: '1.5px',\n\tborderWidthTab: '4px',\n\tspinnerSize: 16,\n\tfontSize: '13px',\n\tfontSizeH1: 'calc(2.44 * 13px)',\n\tfontSizeH2: 'calc(1.95 * 13px)',\n\tfontSizeH3: 'calc(1.56 * 13px)',\n\tfontSizeH4: 'calc(1.25 * 13px)',\n\tfontSizeH5: '13px',\n\tfontSizeH6: 'calc(0.8 * 13px)',\n\tfontSizeInputMobile: '16px',\n\tfontSizeMobile: '15px',\n\tfontSizeSmall: 'calc(0.92 * 13px)',\n\tfontSizeXSmall: 'calc(0.75 * 13px)',\n\tfontLineHeightBase: '1.2',\n\tfontWeight: 'normal',\n\tfontWeightHeading: '600',\n\tgridBase: '4px',\n\tcardBorderRadius: '2px',\n\tcardPaddingXSmall: `${ space( 2 ) }`,\n\tcardPaddingSmall: `${ space( 4 ) }`,\n\tcardPaddingMedium: `${ space( 4 ) } ${ space( 6 ) }`,\n\tcardPaddingLarge: `${ space( 6 ) } ${ space( 8 ) }`,\n\tsurfaceBackgroundColor: COLORS.white,\n\tsurfaceBackgroundSubtleColor: '#F3F3F3',\n\tsurfaceBackgroundTintColor: '#F5F5F5',\n\tsurfaceBorderColor: 'rgba(0, 0, 0, 0.1)',\n\tsurfaceBorderBoldColor: 'rgba(0, 0, 0, 0.15)',\n\tsurfaceBorderSubtleColor: 'rgba(0, 0, 0, 0.05)',\n\tsurfaceBackgroundTertiaryColor: COLORS.white,\n\tsurfaceColor: COLORS.white,\n\ttransitionDuration: '200ms',\n\ttransitionDurationFast: '160ms',\n\ttransitionDurationFaster: '120ms',\n\ttransitionDurationFastest: '100ms',\n\ttransitionTimingFunction: 'cubic-bezier(0.08, 0.52, 0.52, 1)',\n\ttransitionTimingFunctionControl: 'cubic-bezier(0.12, 0.8, 0.32, 1)',\n} );\n"]}
|