@wordpress/components 20.0.2-next.957ca95e4c.0 → 21.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +56 -1
- package/CONTRIBUTING.md +3 -54
- package/build/alignment-matrix-control/styles/alignment-matrix-control-styles.js +9 -9
- package/build/alignment-matrix-control/styles/alignment-matrix-control-styles.js.map +1 -1
- package/build/angle-picker-control/index.js +10 -0
- package/build/angle-picker-control/index.js.map +1 -1
- package/build/border-box-control/border-box-control/component.js +5 -1
- package/build/border-box-control/border-box-control/component.js.map +1 -1
- package/build/border-box-control/border-box-control-split-controls/component.js +5 -1
- package/build/border-box-control/border-box-control-split-controls/component.js.map +1 -1
- package/build/border-control/border-control-dropdown/component.js +2 -1
- package/build/border-control/border-control-dropdown/component.js.map +1 -1
- package/build/card/styles.js +17 -17
- package/build/card/styles.js.map +1 -1
- package/build/checkbox-control/index.js +3 -3
- package/build/checkbox-control/index.js.map +1 -1
- package/build/color-palette/index.js +1 -1
- package/build/color-palette/index.js.map +1 -1
- package/build/color-picker/input-with-slider.js +2 -1
- package/build/color-picker/input-with-slider.js.map +1 -1
- package/build/combobox-control/index.js +1 -1
- package/build/combobox-control/index.js.map +1 -1
- package/build/custom-gradient-picker/index.js +1 -1
- package/build/custom-gradient-picker/index.js.map +1 -1
- package/build/date-time/date/index.js +1 -1
- package/build/date-time/date/index.js.map +1 -1
- package/build/date-time/time/timezone.js +1 -1
- package/build/date-time/time/timezone.js.map +1 -1
- package/build/disabled/index.js +14 -6
- package/build/disabled/index.js.map +1 -1
- package/build/disabled/styles/disabled-styles.js +8 -18
- package/build/disabled/styles/disabled-styles.js.map +1 -1
- package/build/drop-zone/index.js +44 -9
- package/build/drop-zone/index.js.map +1 -1
- package/build/drop-zone/provider.js.map +1 -1
- package/build/drop-zone/types.js +6 -0
- package/build/drop-zone/types.js.map +1 -0
- package/build/flex/flex/hook.js +6 -30
- package/build/flex/flex/hook.js.map +1 -1
- package/build/focal-point-picker/controls.js +10 -5
- package/build/focal-point-picker/controls.js.map +1 -1
- package/build/focal-point-picker/focal-point.js.map +1 -1
- package/build/focal-point-picker/grid.js.map +1 -1
- package/build/focal-point-picker/index.js +83 -16
- package/build/focal-point-picker/index.js.map +1 -1
- package/build/focal-point-picker/media.js +4 -0
- package/build/focal-point-picker/media.js.map +1 -1
- package/build/focal-point-picker/styles/focal-point-picker-style.js +70 -41
- package/build/focal-point-picker/styles/focal-point-picker-style.js.map +1 -1
- package/build/focal-point-picker/styles/focal-point-style.js +12 -12
- package/build/focal-point-picker/styles/focal-point-style.js.map +1 -1
- package/build/focal-point-picker/types.js +6 -0
- package/build/focal-point-picker/types.js.map +1 -0
- package/build/focal-point-picker/utils.js +6 -6
- package/build/focal-point-picker/utils.js.map +1 -1
- package/build/font-size-picker/index.js +11 -0
- package/build/font-size-picker/index.js.map +1 -1
- package/build/font-size-picker/utils.js +1 -1
- package/build/font-size-picker/utils.js.map +1 -1
- package/build/form-file-upload/index.js +22 -2
- package/build/form-file-upload/index.js.map +1 -1
- package/build/form-file-upload/types.js +6 -0
- package/build/form-file-upload/types.js.map +1 -0
- package/build/form-toggle/index.js +1 -3
- package/build/form-toggle/index.js.map +1 -1
- package/build/form-token-field/index.js +4 -6
- package/build/form-token-field/index.js.map +1 -1
- package/build/form-token-field/suggestions-list.js +1 -3
- package/build/form-token-field/suggestions-list.js.map +1 -1
- package/build/gradient-picker/index.js +25 -26
- package/build/gradient-picker/index.js.map +1 -1
- package/build/icon/index.js +1 -2
- package/build/icon/index.js.map +1 -1
- package/build/input-control/input-base.js +3 -2
- package/build/input-control/input-base.js.map +1 -1
- package/build/input-control/label.js +2 -2
- package/build/input-control/label.js.map +1 -1
- package/build/input-control/styles/input-control-styles.js +41 -128
- package/build/input-control/styles/input-control-styles.js.map +1 -1
- package/build/modal/aria-helper.js +3 -10
- package/build/modal/aria-helper.js.map +1 -1
- package/build/navigable-container/container.js +5 -1
- package/build/navigable-container/container.js.map +1 -1
- package/build/navigable-container/menu.js +10 -12
- package/build/navigable-container/menu.js.map +1 -1
- package/build/navigable-container/tabbable.js +2 -4
- package/build/navigable-container/tabbable.js.map +1 -1
- package/build/navigator/navigator-button/hook.js +1 -1
- package/build/navigator/navigator-button/hook.js.map +1 -1
- package/build/navigator/navigator-screen/component.js +2 -2
- package/build/navigator/navigator-screen/component.js.map +1 -1
- package/build/number-control/index.js +29 -25
- package/build/number-control/index.js.map +1 -1
- package/build/number-control/types.js +6 -0
- package/build/number-control/types.js.map +1 -0
- package/build/placeholder/index.js +1 -3
- package/build/placeholder/index.js.map +1 -1
- package/build/popover/index.js +155 -154
- package/build/popover/index.js.map +1 -1
- package/build/popover/types.js +6 -0
- package/build/popover/types.js.map +1 -0
- package/build/popover/utils.js +119 -24
- package/build/popover/utils.js.map +1 -1
- package/build/radio-control/index.js +7 -4
- package/build/radio-control/index.js.map +1 -1
- package/build/range-control/index.js +4 -1
- package/build/range-control/index.js.map +1 -1
- package/build/range-control/styles/range-control-styles.js +33 -33
- package/build/range-control/styles/range-control-styles.js.map +1 -1
- package/build/sandbox/index.js +2 -2
- package/build/sandbox/index.js.map +1 -1
- package/build/search-control/index.js +38 -10
- package/build/search-control/index.js.map +1 -1
- package/build/search-control/types.js +6 -0
- package/build/search-control/types.js.map +1 -0
- package/build/select-control/index.native.js +2 -1
- package/build/select-control/index.native.js.map +1 -1
- package/build/tab-panel/index.js +48 -9
- package/build/tab-panel/index.js.map +1 -1
- package/build/tab-panel/types.js +6 -0
- package/build/tab-panel/types.js.map +1 -0
- package/build/text-control/index.js +2 -0
- package/build/text-control/index.js.map +1 -1
- package/build/textarea-control/index.js +3 -3
- package/build/textarea-control/index.js.map +1 -1
- package/build/toggle-control/index.js +44 -4
- package/build/toggle-control/index.js.map +1 -1
- package/build/toggle-control/types.js +6 -0
- package/build/toggle-control/types.js.map +1 -0
- package/build/toggle-group-control/toggle-group-control/component.js +2 -2
- package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control-option-icon/component.js +1 -1
- package/build/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
- package/build/tooltip/index.js +1 -1
- package/build/tooltip/index.js.map +1 -1
- package/build/ui/context/context-connect.js +31 -22
- package/build/ui/context/context-connect.js.map +1 -1
- package/build/ui/context/context-system-provider.js +4 -3
- package/build/ui/context/context-system-provider.js.map +1 -1
- package/build/unit-control/index.js +1 -1
- package/build/unit-control/index.js.map +1 -1
- package/build/unit-control/styles/unit-control-styles.js +9 -9
- package/build/unit-control/styles/unit-control-styles.js.map +1 -1
- package/build/utils/colors-values.js +2 -30
- package/build/utils/colors-values.js.map +1 -1
- package/build/utils/math.js +4 -4
- package/build/utils/math.js.map +1 -1
- package/build/utils/values.js +62 -6
- package/build/utils/values.js.map +1 -1
- package/build/view/component.js +6 -7
- package/build/view/component.js.map +1 -1
- package/build/view/types.js +6 -0
- package/build/view/types.js.map +1 -0
- package/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js +9 -9
- package/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js.map +1 -1
- package/build-module/angle-picker-control/index.js +9 -0
- package/build-module/angle-picker-control/index.js.map +1 -1
- package/build-module/border-box-control/border-box-control/component.js +5 -1
- package/build-module/border-box-control/border-box-control/component.js.map +1 -1
- package/build-module/border-box-control/border-box-control-split-controls/component.js +5 -1
- package/build-module/border-box-control/border-box-control-split-controls/component.js.map +1 -1
- package/build-module/border-control/border-control-dropdown/component.js +2 -1
- package/build-module/border-control/border-control-dropdown/component.js.map +1 -1
- package/build-module/card/styles.js +17 -17
- package/build-module/card/styles.js.map +1 -1
- package/build-module/checkbox-control/index.js +3 -3
- package/build-module/checkbox-control/index.js.map +1 -1
- package/build-module/color-palette/index.js +1 -1
- package/build-module/color-palette/index.js.map +1 -1
- package/build-module/color-picker/input-with-slider.js +2 -1
- package/build-module/color-picker/input-with-slider.js.map +1 -1
- package/build-module/combobox-control/index.js +1 -1
- package/build-module/combobox-control/index.js.map +1 -1
- package/build-module/custom-gradient-picker/index.js +1 -1
- package/build-module/custom-gradient-picker/index.js.map +1 -1
- package/build-module/date-time/date/index.js +2 -3
- package/build-module/date-time/date/index.js.map +1 -1
- package/build-module/date-time/time/timezone.js +1 -1
- package/build-module/date-time/time/timezone.js.map +1 -1
- package/build-module/disabled/index.js +16 -8
- package/build-module/disabled/index.js.map +1 -1
- package/build-module/disabled/styles/disabled-styles.js +6 -12
- package/build-module/disabled/styles/disabled-styles.js.map +1 -1
- package/build-module/drop-zone/index.js +40 -9
- package/build-module/drop-zone/index.js.map +1 -1
- package/build-module/drop-zone/provider.js.map +1 -1
- package/build-module/drop-zone/types.js +2 -0
- package/build-module/drop-zone/types.js.map +1 -0
- package/build-module/flex/flex/hook.js +7 -29
- package/build-module/flex/flex/hook.js.map +1 -1
- package/build-module/focal-point-picker/controls.js +11 -6
- package/build-module/focal-point-picker/controls.js.map +1 -1
- package/build-module/focal-point-picker/focal-point.js.map +1 -1
- package/build-module/focal-point-picker/grid.js.map +1 -1
- package/build-module/focal-point-picker/index.js +81 -16
- package/build-module/focal-point-picker/index.js.map +1 -1
- package/build-module/focal-point-picker/media.js +4 -0
- package/build-module/focal-point-picker/media.js.map +1 -1
- package/build-module/focal-point-picker/styles/focal-point-picker-style.js +68 -40
- package/build-module/focal-point-picker/styles/focal-point-picker-style.js.map +1 -1
- package/build-module/focal-point-picker/styles/focal-point-style.js +12 -12
- package/build-module/focal-point-picker/styles/focal-point-style.js.map +1 -1
- package/build-module/focal-point-picker/types.js +2 -0
- package/build-module/focal-point-picker/types.js.map +1 -0
- package/build-module/focal-point-picker/utils.js +6 -6
- package/build-module/focal-point-picker/utils.js.map +1 -1
- package/build-module/font-size-picker/index.js +10 -0
- package/build-module/font-size-picker/index.js.map +1 -1
- package/build-module/font-size-picker/utils.js +1 -1
- package/build-module/font-size-picker/utils.js.map +1 -1
- package/build-module/form-file-upload/index.js +21 -4
- package/build-module/form-file-upload/index.js.map +1 -1
- package/build-module/form-file-upload/types.js +2 -0
- package/build-module/form-file-upload/types.js.map +1 -0
- package/build-module/form-toggle/index.js +1 -3
- package/build-module/form-toggle/index.js.map +1 -1
- package/build-module/form-token-field/index.js +4 -5
- package/build-module/form-token-field/index.js.map +1 -1
- package/build-module/form-token-field/suggestions-list.js +1 -2
- package/build-module/form-token-field/suggestions-list.js.map +1 -1
- package/build-module/gradient-picker/index.js +25 -26
- package/build-module/gradient-picker/index.js.map +1 -1
- package/build-module/icon/index.js +1 -2
- package/build-module/icon/index.js.map +1 -1
- package/build-module/input-control/input-base.js +4 -3
- package/build-module/input-control/input-base.js.map +1 -1
- package/build-module/input-control/label.js +3 -3
- package/build-module/input-control/label.js.map +1 -1
- package/build-module/input-control/styles/input-control-styles.js +41 -127
- package/build-module/input-control/styles/input-control-styles.js.map +1 -1
- package/build-module/modal/aria-helper.js +3 -8
- package/build-module/modal/aria-helper.js.map +1 -1
- package/build-module/navigable-container/container.js +5 -1
- package/build-module/navigable-container/container.js.map +1 -1
- package/build-module/navigable-container/menu.js +10 -11
- package/build-module/navigable-container/menu.js.map +1 -1
- package/build-module/navigable-container/tabbable.js +2 -3
- package/build-module/navigable-container/tabbable.js.map +1 -1
- package/build-module/navigator/navigator-button/hook.js +1 -1
- package/build-module/navigator/navigator-button/hook.js.map +1 -1
- package/build-module/navigator/navigator-screen/component.js +2 -2
- package/build-module/navigator/navigator-screen/component.js.map +1 -1
- package/build-module/number-control/index.js +31 -23
- package/build-module/number-control/index.js.map +1 -1
- package/build-module/number-control/types.js +2 -0
- package/build-module/number-control/types.js.map +1 -0
- package/build-module/placeholder/index.js +1 -3
- package/build-module/placeholder/index.js.map +1 -1
- package/build-module/popover/index.js +157 -156
- package/build-module/popover/index.js.map +1 -1
- package/build-module/popover/types.js +2 -0
- package/build-module/popover/types.js.map +1 -0
- package/build-module/popover/utils.js +112 -23
- package/build-module/popover/utils.js.map +1 -1
- package/build-module/radio-control/index.js +7 -5
- package/build-module/radio-control/index.js.map +1 -1
- package/build-module/range-control/index.js +4 -1
- package/build-module/range-control/index.js.map +1 -1
- package/build-module/range-control/styles/range-control-styles.js +33 -33
- package/build-module/range-control/styles/range-control-styles.js.map +1 -1
- package/build-module/sandbox/index.js +2 -2
- package/build-module/sandbox/index.js.map +1 -1
- package/build-module/search-control/index.js +34 -7
- package/build-module/search-control/index.js.map +1 -1
- package/build-module/search-control/types.js +2 -0
- package/build-module/search-control/types.js.map +1 -0
- package/build-module/select-control/index.native.js +1 -1
- package/build-module/select-control/index.native.js.map +1 -1
- package/build-module/tab-panel/index.js +46 -10
- package/build-module/tab-panel/index.js.map +1 -1
- package/build-module/tab-panel/types.js +2 -0
- package/build-module/tab-panel/types.js.map +1 -0
- package/build-module/text-control/index.js +2 -0
- package/build-module/text-control/index.js.map +1 -1
- package/build-module/textarea-control/index.js +3 -3
- package/build-module/textarea-control/index.js.map +1 -1
- package/build-module/toggle-control/index.js +38 -4
- package/build-module/toggle-control/index.js.map +1 -1
- package/build-module/toggle-control/types.js +2 -0
- package/build-module/toggle-control/types.js.map +1 -0
- package/build-module/toggle-group-control/toggle-group-control/component.js +2 -2
- package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js +1 -1
- package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
- package/build-module/tooltip/index.js +1 -1
- package/build-module/tooltip/index.js.map +1 -1
- package/build-module/ui/context/context-connect.js +30 -23
- package/build-module/ui/context/context-connect.js.map +1 -1
- package/build-module/ui/context/context-system-provider.js +5 -4
- package/build-module/ui/context/context-system-provider.js.map +1 -1
- package/build-module/unit-control/index.js +1 -1
- package/build-module/unit-control/index.js.map +1 -1
- package/build-module/unit-control/styles/unit-control-styles.js +9 -9
- package/build-module/unit-control/styles/unit-control-styles.js.map +1 -1
- package/build-module/utils/colors-values.js +2 -30
- package/build-module/utils/colors-values.js.map +1 -1
- package/build-module/utils/math.js +4 -4
- package/build-module/utils/math.js.map +1 -1
- package/build-module/utils/values.js +48 -6
- package/build-module/utils/values.js.map +1 -1
- package/build-module/view/component.js +5 -8
- package/build-module/view/component.js.map +1 -1
- package/build-module/view/types.js +2 -0
- package/build-module/view/types.js.map +1 -0
- package/build-style/style-rtl.css +2 -28
- package/build-style/style.css +2 -28
- package/build-types/base-field/hook.d.ts +54 -55
- package/build-types/base-field/hook.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control/component.d.ts +10 -2
- package/build-types/border-box-control/border-box-control/component.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control/hook.d.ts +56 -57
- package/build-types/border-box-control/border-box-control/hook.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control-linked-button/component.d.ts +2 -1
- package/build-types/border-box-control/border-box-control-linked-button/component.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts +55 -56
- package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control-split-controls/component.d.ts +9 -2
- package/build-types/border-box-control/border-box-control-split-controls/component.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +56 -57
- package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control-visualizer/component.d.ts +2 -1
- package/build-types/border-box-control/border-box-control-visualizer/component.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts +55 -56
- package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts.map +1 -1
- package/build-types/border-box-control/types.d.ts +5 -4
- package/build-types/border-box-control/types.d.ts.map +1 -1
- package/build-types/border-control/border-control/component.d.ts +14 -2
- package/build-types/border-control/border-control/component.d.ts.map +1 -1
- package/build-types/border-control/border-control/hook.d.ts +56 -57
- package/build-types/border-control/border-control/hook.d.ts.map +1 -1
- package/build-types/border-control/border-control-dropdown/component.d.ts +10 -2
- package/build-types/border-control/border-control-dropdown/component.d.ts.map +1 -1
- package/build-types/border-control/border-control-dropdown/hook.d.ts +56 -57
- package/build-types/border-control/border-control-dropdown/hook.d.ts.map +1 -1
- package/build-types/border-control/border-control-style-picker/component.d.ts +6 -2
- package/build-types/border-control/border-control-style-picker/component.d.ts.map +1 -1
- package/build-types/border-control/border-control-style-picker/hook.d.ts +55 -56
- package/build-types/border-control/border-control-style-picker/hook.d.ts.map +1 -1
- package/build-types/border-control/stories/index.d.ts +74 -6
- package/build-types/border-control/stories/index.d.ts.map +1 -1
- package/build-types/border-control/types.d.ts +6 -8
- package/build-types/border-control/types.d.ts.map +1 -1
- package/build-types/button-group/index.d.ts +1 -3
- package/build-types/button-group/index.d.ts.map +1 -1
- package/build-types/card/card/component.d.ts +9 -2
- package/build-types/card/card/component.d.ts.map +1 -1
- package/build-types/card/card/hook.d.ts +55 -56
- package/build-types/card/card/hook.d.ts.map +1 -1
- package/build-types/card/card-body/component.d.ts +9 -2
- package/build-types/card/card-body/component.d.ts.map +1 -1
- package/build-types/card/card-body/hook.d.ts +55 -56
- package/build-types/card/card-body/hook.d.ts.map +1 -1
- package/build-types/card/card-divider/component.d.ts +7 -2
- package/build-types/card/card-divider/component.d.ts.map +1 -1
- package/build-types/card/card-divider/hook.d.ts +55 -55
- package/build-types/card/card-footer/component.d.ts +11 -2
- package/build-types/card/card-footer/component.d.ts.map +1 -1
- package/build-types/card/card-footer/hook.d.ts +55 -56
- package/build-types/card/card-footer/hook.d.ts.map +1 -1
- package/build-types/card/card-header/component.d.ts +1 -1
- package/build-types/card/card-header/component.d.ts.map +1 -1
- package/build-types/card/card-header/hook.d.ts +55 -56
- package/build-types/card/card-header/hook.d.ts.map +1 -1
- package/build-types/card/card-media/component.d.ts +2 -1
- package/build-types/card/card-media/component.d.ts.map +1 -1
- package/build-types/card/card-media/hook.d.ts +55 -56
- package/build-types/card/card-media/hook.d.ts.map +1 -1
- package/build-types/checkbox-control/index.d.ts +1 -1
- package/build-types/checkbox-control/index.d.ts.map +1 -1
- package/build-types/checkbox-control/stories/index.d.ts.map +1 -1
- package/build-types/checkbox-control/types.d.ts +1 -1
- package/build-types/checkbox-control/types.d.ts.map +1 -1
- package/build-types/color-indicator/index.d.ts +1 -3
- package/build-types/color-indicator/index.d.ts.map +1 -1
- package/build-types/color-palette/styles.d.ts +1 -3
- package/build-types/color-palette/styles.d.ts.map +1 -1
- package/build-types/color-picker/component.d.ts +2 -1
- package/build-types/color-picker/component.d.ts.map +1 -1
- package/build-types/color-picker/input-with-slider.d.ts.map +1 -1
- package/build-types/color-picker/styles.d.ts +12 -25
- package/build-types/color-picker/styles.d.ts.map +1 -1
- package/build-types/confirm-dialog/component.d.ts +4 -8
- package/build-types/confirm-dialog/component.d.ts.map +1 -1
- package/build-types/date-time/date/styles.d.ts +4 -8
- package/build-types/date-time/date/styles.d.ts.map +1 -1
- package/build-types/date-time/date-time/styles.d.ts +4 -6
- package/build-types/date-time/date-time/styles.d.ts.map +1 -1
- package/build-types/date-time/time/styles.d.ts +21 -43
- package/build-types/date-time/time/styles.d.ts.map +1 -1
- package/build-types/disabled/index.d.ts +1 -1
- package/build-types/disabled/index.d.ts.map +1 -1
- package/build-types/disabled/styles/disabled-styles.d.ts +1 -5
- package/build-types/disabled/styles/disabled-styles.d.ts.map +1 -1
- package/build-types/divider/component.d.ts +7 -2
- package/build-types/divider/component.d.ts.map +1 -1
- package/build-types/drop-zone/index.d.ts +29 -0
- package/build-types/drop-zone/index.d.ts.map +1 -0
- package/build-types/drop-zone/provider.d.ts +5 -0
- package/build-types/drop-zone/provider.d.ts.map +1 -0
- package/build-types/drop-zone/stories/index.d.ts +12 -0
- package/build-types/drop-zone/stories/index.d.ts.map +1 -0
- package/build-types/drop-zone/types.d.ts +29 -0
- package/build-types/drop-zone/types.d.ts.map +1 -0
- package/build-types/dropdown/dropdown-content-wrapper.d.ts +2 -1
- package/build-types/dropdown/dropdown-content-wrapper.d.ts.map +1 -1
- package/build-types/elevation/component.d.ts +2 -1
- package/build-types/elevation/component.d.ts.map +1 -1
- package/build-types/elevation/hook.d.ts +54 -55
- package/build-types/elevation/hook.d.ts.map +1 -1
- package/build-types/external-link/index.d.ts +1 -1
- package/build-types/external-link/index.d.ts.map +1 -1
- package/build-types/external-link/styles/external-link-styles.d.ts +1 -1
- package/build-types/flex/flex/component.d.ts +2 -1
- package/build-types/flex/flex/component.d.ts.map +1 -1
- package/build-types/flex/flex/hook.d.ts +55 -56
- package/build-types/flex/flex/hook.d.ts.map +1 -1
- package/build-types/flex/flex-block/component.d.ts +2 -1
- package/build-types/flex/flex-block/component.d.ts.map +1 -1
- package/build-types/flex/flex-block/hook.d.ts +55 -56
- package/build-types/flex/flex-block/hook.d.ts.map +1 -1
- package/build-types/flex/flex-item/component.d.ts +2 -1
- package/build-types/flex/flex-item/component.d.ts.map +1 -1
- package/build-types/flex/flex-item/hook.d.ts +55 -56
- package/build-types/flex/flex-item/hook.d.ts.map +1 -1
- package/build-types/focal-point-picker/controls.d.ts +4 -0
- package/build-types/focal-point-picker/controls.d.ts.map +1 -0
- package/build-types/focal-point-picker/focal-point.d.ts +5 -0
- package/build-types/focal-point-picker/focal-point.d.ts.map +1 -0
- package/build-types/focal-point-picker/grid.d.ts +5 -0
- package/build-types/focal-point-picker/grid.d.ts.map +1 -0
- package/build-types/focal-point-picker/index.d.ts +51 -0
- package/build-types/focal-point-picker/index.d.ts.map +1 -0
- package/build-types/focal-point-picker/media.d.ts +4 -0
- package/build-types/focal-point-picker/media.d.ts.map +1 -0
- package/build-types/focal-point-picker/stories/index.d.ts +15 -0
- package/build-types/focal-point-picker/stories/index.d.ts.map +1 -0
- package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts +56 -0
- package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts.map +1 -0
- package/build-types/focal-point-picker/styles/focal-point-style.d.ts +19 -0
- package/build-types/focal-point-picker/styles/focal-point-style.d.ts.map +1 -0
- package/build-types/focal-point-picker/types.d.ts +79 -0
- package/build-types/focal-point-picker/types.d.ts.map +1 -0
- package/build-types/focal-point-picker/utils.d.ts +26 -0
- package/build-types/focal-point-picker/utils.d.ts.map +1 -0
- package/build-types/form-file-upload/index.d.ts +22 -0
- package/build-types/form-file-upload/index.d.ts.map +1 -0
- package/build-types/form-file-upload/stories/index.d.ts +23 -0
- package/build-types/form-file-upload/stories/index.d.ts.map +1 -0
- package/build-types/form-file-upload/test/index.d.ts +2 -0
- package/build-types/form-file-upload/test/index.d.ts.map +1 -0
- package/build-types/form-file-upload/types.d.ts +63 -0
- package/build-types/form-file-upload/types.d.ts.map +1 -0
- package/build-types/form-toggle/index.d.ts +1 -1
- package/build-types/form-toggle/index.d.ts.map +1 -1
- package/build-types/form-token-field/index.d.ts.map +1 -1
- package/build-types/form-token-field/styles.d.ts +1 -3
- package/build-types/form-token-field/styles.d.ts.map +1 -1
- package/build-types/form-token-field/suggestions-list.d.ts.map +1 -1
- package/build-types/form-token-field/token-input.d.ts +1 -3
- package/build-types/form-token-field/token-input.d.ts.map +1 -1
- package/build-types/grid/component.d.ts +2 -1
- package/build-types/grid/component.d.ts.map +1 -1
- package/build-types/grid/hook.d.ts +55 -56
- package/build-types/grid/hook.d.ts.map +1 -1
- package/build-types/h-stack/component.d.ts +5 -2
- package/build-types/h-stack/component.d.ts.map +1 -1
- package/build-types/h-stack/hook.d.ts +55 -56
- package/build-types/h-stack/hook.d.ts.map +1 -1
- package/build-types/heading/component.d.ts +4 -2
- package/build-types/heading/component.d.ts.map +1 -1
- package/build-types/heading/hook.d.ts +54 -55
- package/build-types/heading/hook.d.ts.map +1 -1
- package/build-types/input-control/index.d.ts +1 -1
- package/build-types/input-control/index.d.ts.map +1 -1
- package/build-types/input-control/input-base.d.ts.map +1 -1
- package/build-types/input-control/input-field.d.ts +1 -3
- package/build-types/input-control/input-field.d.ts.map +1 -1
- package/build-types/input-control/input-prefix-wrapper.d.ts +2 -1
- package/build-types/input-control/input-prefix-wrapper.d.ts.map +1 -1
- package/build-types/input-control/input-suffix-wrapper.d.ts +2 -1
- package/build-types/input-control/input-suffix-wrapper.d.ts.map +1 -1
- package/build-types/input-control/label.d.ts.map +1 -1
- package/build-types/input-control/stories/index.d.ts +5 -5
- package/build-types/input-control/stories/index.d.ts.map +1 -1
- package/build-types/input-control/styles/input-control-styles.d.ts +2 -6
- package/build-types/input-control/styles/input-control-styles.d.ts.map +1 -1
- package/build-types/input-control/types.d.ts +3 -0
- package/build-types/input-control/types.d.ts.map +1 -1
- package/build-types/item-group/item/component.d.ts +2 -1
- package/build-types/item-group/item/component.d.ts.map +1 -1
- package/build-types/item-group/item/hook.d.ts +54 -55
- package/build-types/item-group/item/hook.d.ts.map +1 -1
- package/build-types/item-group/item-group/component.d.ts +2 -1
- package/build-types/item-group/item-group/component.d.ts.map +1 -1
- package/build-types/item-group/item-group/hook.d.ts +54 -55
- package/build-types/item-group/item-group/hook.d.ts.map +1 -1
- package/build-types/modal/aria-helper.d.ts.map +1 -1
- package/build-types/navigable-container/menu.d.ts.map +1 -1
- package/build-types/navigable-container/tabbable.d.ts.map +1 -1
- package/build-types/navigator/navigator-back-button/component.d.ts +4 -2
- package/build-types/navigator/navigator-back-button/component.d.ts.map +1 -1
- package/build-types/navigator/navigator-back-button/hook.d.ts +59 -60
- package/build-types/navigator/navigator-back-button/hook.d.ts.map +1 -1
- package/build-types/navigator/navigator-button/component.d.ts +7 -2
- package/build-types/navigator/navigator-button/component.d.ts.map +1 -1
- package/build-types/navigator/navigator-button/hook.d.ts +59 -60
- package/build-types/navigator/navigator-button/hook.d.ts.map +1 -1
- package/build-types/navigator/navigator-provider/component.d.ts +2 -1
- package/build-types/navigator/navigator-provider/component.d.ts.map +1 -1
- package/build-types/navigator/navigator-screen/component.d.ts +1 -1
- package/build-types/navigator/navigator-screen/component.d.ts.map +1 -1
- package/build-types/number-control/index.d.ts +10 -28
- package/build-types/number-control/index.d.ts.map +1 -1
- package/build-types/number-control/styles/number-control-styles.d.ts +1 -1
- package/build-types/number-control/types.d.ts +72 -0
- package/build-types/number-control/types.d.ts.map +1 -0
- package/build-types/placeholder/index.d.ts +1 -1
- package/build-types/placeholder/index.d.ts.map +1 -1
- package/build-types/popover/index.d.ts +28 -24
- package/build-types/popover/index.d.ts.map +1 -1
- package/build-types/popover/stories/index.d.ts +12 -0
- package/build-types/popover/stories/index.d.ts.map +1 -0
- package/build-types/popover/types.d.ts +161 -0
- package/build-types/popover/types.d.ts.map +1 -0
- package/build-types/popover/utils.d.ts +42 -24
- package/build-types/popover/utils.d.ts.map +1 -1
- package/build-types/radio-control/index.d.ts +1 -1
- package/build-types/radio-control/index.d.ts.map +1 -1
- package/build-types/range-control/index.d.ts +2 -4
- package/build-types/range-control/index.d.ts.map +1 -1
- package/build-types/range-control/input-range.d.ts +2 -4
- package/build-types/range-control/input-range.d.ts.map +1 -1
- package/build-types/range-control/styles/range-control-styles.d.ts +5 -10
- package/build-types/range-control/styles/range-control-styles.d.ts.map +1 -1
- package/build-types/resizable-box/index.d.ts +1 -1
- package/build-types/resizable-box/resize-tooltip/index.d.ts +1 -1
- package/build-types/resizable-box/resize-tooltip/label.d.ts +1 -1
- package/build-types/resizable-box/resize-tooltip/styles/resize-tooltip.styles.d.ts +1 -3
- package/build-types/resizable-box/resize-tooltip/styles/resize-tooltip.styles.d.ts.map +1 -1
- package/build-types/scrollable/component.d.ts +2 -1
- package/build-types/scrollable/component.d.ts.map +1 -1
- package/build-types/scrollable/hook.d.ts +55 -56
- package/build-types/scrollable/hook.d.ts.map +1 -1
- package/build-types/search-control/index.d.ts +29 -0
- package/build-types/search-control/index.d.ts.map +1 -0
- package/build-types/search-control/stories/index.d.ts +47 -0
- package/build-types/search-control/stories/index.d.ts.map +1 -0
- package/build-types/search-control/types.d.ts +39 -0
- package/build-types/search-control/types.d.ts.map +1 -0
- package/build-types/select-control/index.d.ts +1 -3
- package/build-types/select-control/index.d.ts.map +1 -1
- package/build-types/select-control/stories/index.d.ts +2 -6
- package/build-types/select-control/stories/index.d.ts.map +1 -1
- package/build-types/select-control/styles/select-control-styles.d.ts +1 -3
- package/build-types/select-control/styles/select-control-styles.d.ts.map +1 -1
- package/build-types/spacer/component.d.ts +2 -1
- package/build-types/spacer/component.d.ts.map +1 -1
- package/build-types/spacer/hook.d.ts +55 -56
- package/build-types/spacer/hook.d.ts.map +1 -1
- package/build-types/spinner/index.d.ts +1 -3
- package/build-types/spinner/index.d.ts.map +1 -1
- package/build-types/surface/component.d.ts +2 -1
- package/build-types/surface/component.d.ts.map +1 -1
- package/build-types/surface/hook.d.ts +55 -56
- package/build-types/surface/hook.d.ts.map +1 -1
- package/build-types/tab-panel/index.d.ts +42 -0
- package/build-types/tab-panel/index.d.ts.map +1 -0
- package/build-types/tab-panel/stories/index.d.ts +12 -0
- package/build-types/tab-panel/stories/index.d.ts.map +1 -0
- package/build-types/tab-panel/test/index.d.ts +2 -0
- package/build-types/tab-panel/test/index.d.ts.map +1 -0
- package/build-types/tab-panel/types.d.ts +64 -0
- package/build-types/tab-panel/types.d.ts.map +1 -0
- package/build-types/text/component.d.ts +1 -1
- package/build-types/text/component.d.ts.map +1 -1
- package/build-types/text/hook.d.ts +55 -56
- package/build-types/text/hook.d.ts.map +1 -1
- package/build-types/text-control/index.d.ts +2 -4
- package/build-types/text-control/index.d.ts.map +1 -1
- package/build-types/text-control/types.d.ts +1 -1
- package/build-types/text-control/types.d.ts.map +1 -1
- package/build-types/textarea-control/index.d.ts +1 -1
- package/build-types/textarea-control/index.d.ts.map +1 -1
- package/build-types/textarea-control/types.d.ts +1 -1
- package/build-types/textarea-control/types.d.ts.map +1 -1
- package/build-types/toggle-control/index.d.ts +26 -0
- package/build-types/toggle-control/index.d.ts.map +1 -0
- package/build-types/toggle-control/stories/index.d.ts +13 -0
- package/build-types/toggle-control/stories/index.d.ts.map +1 -0
- package/build-types/toggle-control/test/index.d.ts +2 -0
- package/build-types/toggle-control/test/index.d.ts.map +1 -0
- package/build-types/toggle-control/types.d.ts +20 -0
- package/build-types/toggle-control/types.d.ts.map +1 -0
- package/build-types/toggle-group-control/stories/index.d.ts +4 -2
- package/build-types/toggle-group-control/stories/index.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control/component.d.ts +12 -2
- package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control-option/component.d.ts +2 -4
- package/build-types/toggle-group-control/toggle-group-control-option/component.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts +2 -1
- package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts +3 -5
- package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts.map +1 -1
- package/build-types/toggle-group-control/types.d.ts +2 -2
- package/build-types/toggle-group-control/types.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel/component.d.ts +2 -1
- package/build-types/tools-panel/tools-panel/component.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel/hook.d.ts +55 -56
- package/build-types/tools-panel/tools-panel/hook.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel-header/component.d.ts +2 -1
- package/build-types/tools-panel/tools-panel-header/component.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel-header/hook.d.ts +55 -56
- package/build-types/tools-panel/tools-panel-header/hook.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel-item/component.d.ts +6 -2
- package/build-types/tools-panel/tools-panel-item/component.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel-item/hook.d.ts +55 -56
- package/build-types/tools-panel/tools-panel-item/hook.d.ts.map +1 -1
- package/build-types/truncate/component.d.ts +2 -1
- package/build-types/truncate/component.d.ts.map +1 -1
- package/build-types/truncate/hook.d.ts +55 -56
- package/build-types/truncate/hook.d.ts.map +1 -1
- package/build-types/ui/context/context-connect.d.ts +10 -9
- package/build-types/ui/context/context-connect.d.ts.map +1 -1
- package/build-types/ui/context/context-system-provider.d.ts.map +1 -1
- package/build-types/ui/context/test/context-connect.d.ts +2 -0
- package/build-types/ui/context/test/context-connect.d.ts.map +1 -0
- package/build-types/ui/context/test/wordpress-component.d.ts +2 -0
- package/build-types/ui/context/test/wordpress-component.d.ts.map +1 -0
- package/build-types/ui/context/wordpress-component.d.ts +8 -9
- package/build-types/ui/context/wordpress-component.d.ts.map +1 -1
- package/build-types/ui/control-group/component.d.ts +4 -1
- package/build-types/ui/control-group/component.d.ts.map +1 -1
- package/build-types/ui/control-group/hook.d.ts +55 -56
- package/build-types/ui/control-group/hook.d.ts.map +1 -1
- package/build-types/ui/control-label/component.d.ts +4 -1
- package/build-types/ui/control-label/component.d.ts.map +1 -1
- package/build-types/ui/control-label/hook.d.ts +55 -56
- package/build-types/ui/control-label/hook.d.ts.map +1 -1
- package/build-types/ui/form-group/form-group.d.ts +4 -8
- package/build-types/ui/form-group/form-group.d.ts.map +1 -1
- package/build-types/ui/form-group/use-form-group.d.ts +112 -114
- package/build-types/ui/form-group/use-form-group.d.ts.map +1 -1
- package/build-types/ui/shortcut/component.d.ts +2 -1
- package/build-types/ui/shortcut/component.d.ts.map +1 -1
- package/build-types/ui/spinner/component.d.ts +1 -1
- package/build-types/ui/tooltip/component.d.ts +11 -1
- package/build-types/ui/tooltip/component.d.ts.map +1 -1
- package/build-types/ui/tooltip/content.d.ts +7 -1
- package/build-types/ui/tooltip/styles.d.ts +1 -3
- package/build-types/ui/tooltip/styles.d.ts.map +1 -1
- package/build-types/unit-control/index.d.ts +2 -12
- package/build-types/unit-control/index.d.ts.map +1 -1
- package/build-types/unit-control/stories/index.d.ts.map +1 -1
- package/build-types/unit-control/styles/unit-control-styles.d.ts +5 -10
- package/build-types/unit-control/styles/unit-control-styles.d.ts.map +1 -1
- package/build-types/unit-control/types.d.ts +3 -35
- package/build-types/unit-control/types.d.ts.map +1 -1
- package/build-types/utils/colors-values.d.ts +0 -18
- package/build-types/utils/colors-values.d.ts.map +1 -1
- package/build-types/utils/math.d.ts +6 -6
- package/build-types/utils/math.d.ts.map +1 -1
- package/build-types/utils/values.d.ts +10 -8
- package/build-types/utils/values.d.ts.map +1 -1
- package/build-types/v-stack/component.d.ts +8 -2
- package/build-types/v-stack/component.d.ts.map +1 -1
- package/build-types/v-stack/hook.d.ts +55 -56
- package/build-types/v-stack/hook.d.ts.map +1 -1
- package/build-types/v-stack/stories/index.d.ts +8 -1
- package/build-types/v-stack/stories/index.d.ts.map +1 -1
- package/build-types/view/component.d.ts +8 -6
- package/build-types/view/component.d.ts.map +1 -1
- package/build-types/view/stories/index.d.ts +12 -0
- package/build-types/view/stories/index.d.ts.map +1 -0
- package/build-types/view/types.d.ts +8 -0
- package/build-types/view/types.d.ts.map +1 -0
- package/build-types/visually-hidden/component.d.ts +2 -1
- package/build-types/visually-hidden/component.d.ts.map +1 -1
- package/build-types/z-stack/component.d.ts +2 -1
- package/build-types/z-stack/component.d.ts.map +1 -1
- package/package.json +17 -17
- package/src/alignment-matrix-control/styles/alignment-matrix-control-styles.js +1 -1
- package/src/angle-picker-control/README.md +9 -1
- package/src/angle-picker-control/index.js +12 -0
- package/src/angle-picker-control/stories/index.js +3 -3
- package/src/base-field/test/__snapshots__/index.js.snap +3 -5
- package/src/border-box-control/border-box-control/component.tsx +9 -2
- package/src/border-box-control/border-box-control-split-controls/component.tsx +8 -2
- package/src/border-box-control/types.ts +5 -4
- package/src/border-control/border-control-dropdown/component.tsx +3 -8
- package/src/border-control/types.ts +7 -9
- package/src/card/styles.ts +1 -1
- package/src/card/test/__snapshots__/index.tsx.snap +39 -51
- package/src/checkbox-control/index.tsx +3 -6
- package/src/checkbox-control/stories/index.tsx +6 -2
- package/src/checkbox-control/types.ts +4 -1
- package/src/color-palette/index.js +1 -1
- package/src/color-palette/test/__snapshots__/index.js.snap +67 -91
- package/src/color-picker/input-with-slider.tsx +1 -0
- package/src/combobox-control/index.js +1 -1
- package/src/combobox-control/test/index.js +311 -0
- package/src/custom-gradient-picker/index.js +1 -1
- package/src/date-time/date/index.tsx +2 -2
- package/src/date-time/time/timezone.tsx +1 -1
- package/src/dimension-control/test/__snapshots__/index.test.js.snap +1122 -164
- package/src/dimension-control/test/index.test.js +29 -38
- package/src/disabled/index.tsx +27 -9
- package/src/disabled/styles/disabled-styles.tsx +2 -2
- package/src/disabled/test/index.tsx +38 -0
- package/src/drop-zone/README.md +3 -3
- package/src/drop-zone/{index.js → index.tsx} +48 -13
- package/src/drop-zone/{provider.js → provider.ts} +5 -1
- package/src/drop-zone/stories/index.tsx +30 -0
- package/src/drop-zone/types.ts +29 -0
- package/src/dropdown/README.md +6 -4
- package/src/dropdown/stories/index.js +1 -1
- package/src/flex/flex/hook.ts +5 -54
- package/src/flex/test/__snapshots__/index.tsx.snap +7 -15
- package/src/focal-point-picker/README.md +2 -2
- package/src/focal-point-picker/{controls.js → controls.tsx} +38 -10
- package/src/focal-point-picker/{focal-point.js → focal-point.tsx} +7 -1
- package/src/focal-point-picker/{grid.js → grid.tsx} +6 -1
- package/src/focal-point-picker/{index.js → index.tsx} +99 -15
- package/src/focal-point-picker/{media.js → media.tsx} +10 -4
- package/src/focal-point-picker/stories/index.tsx +93 -0
- package/src/focal-point-picker/styles/{focal-point-picker-style.js → focal-point-picker-style.ts} +31 -5
- package/src/focal-point-picker/styles/{focal-point-style.js → focal-point-style.ts} +2 -1
- package/src/focal-point-picker/test/index.js +27 -7
- package/src/focal-point-picker/types.ts +93 -0
- package/src/focal-point-picker/{utils.js → utils.ts} +9 -9
- package/src/font-size-picker/README.md +9 -0
- package/src/font-size-picker/index.js +9 -0
- package/src/font-size-picker/stories/index.js +3 -5
- package/src/font-size-picker/test/index.js +15 -2
- package/src/font-size-picker/test/utils.js +1 -2
- package/src/font-size-picker/utils.js +1 -1
- package/src/form-file-upload/README.md +6 -1
- package/src/form-file-upload/{index.js → index.tsx} +22 -4
- package/src/form-file-upload/stories/index.tsx +74 -0
- package/src/form-file-upload/test/{index.js → index.tsx} +7 -3
- package/src/form-file-upload/types.ts +63 -0
- package/src/form-toggle/index.tsx +1 -6
- package/src/form-token-field/index.tsx +4 -5
- package/src/form-token-field/suggestions-list.tsx +1 -2
- package/src/gradient-picker/index.js +41 -47
- package/src/gradient-picker/stories/index.js +10 -0
- package/src/h-stack/test/__snapshots__/index.tsx.snap +3 -12
- package/src/higher-order/with-filters/test/__snapshots__/index.js.snap +87 -0
- package/src/higher-order/with-filters/test/index.js +20 -74
- package/src/icon/index.tsx +1 -1
- package/src/icon/stories/index.js +18 -0
- package/src/icon/test/index.js +32 -83
- package/src/input-control/input-base.tsx +9 -11
- package/src/input-control/label.tsx +9 -4
- package/src/input-control/styles/input-control-styles.tsx +0 -43
- package/src/input-control/types.ts +3 -0
- package/src/isolated-event-container/test/index.js +53 -11
- package/src/item-group/test/__snapshots__/index.js.snap +16 -16
- package/src/keyboard-shortcuts/test/index.js +16 -31
- package/src/menu-item/test/__snapshots__/index.js.snap +60 -62
- package/src/menu-item/test/index.js +30 -22
- package/src/modal/aria-helper.js +3 -8
- package/src/navigable-container/README.md +2 -0
- package/src/navigable-container/container.js +8 -1
- package/src/navigable-container/menu.js +14 -11
- package/src/navigable-container/stories/navigable-menu.js +49 -0
- package/src/navigable-container/stories/tabbable-container.js +40 -0
- package/src/navigable-container/tabbable.js +2 -3
- package/src/navigable-container/test/navigable-menu.js +277 -0
- package/src/navigable-container/test/tababble-container.js +175 -0
- package/src/navigator/navigator-button/hook.ts +1 -1
- package/src/navigator/navigator-screen/component.tsx +6 -1
- package/src/number-control/index.tsx +209 -0
- package/src/number-control/stories/index.js +6 -18
- package/src/number-control/types.ts +75 -0
- package/src/panel/test/__snapshots__/header.js.snap +9 -0
- package/src/panel/test/__snapshots__/index.js.snap +17 -0
- package/src/panel/test/__snapshots__/row.js.snap +17 -0
- package/src/panel/test/header.js +30 -23
- package/src/panel/test/index.js +33 -25
- package/src/panel/test/row.js +18 -11
- package/src/placeholder/index.tsx +4 -5
- package/src/placeholder/style.scss +4 -0
- package/src/popover/README.md +83 -48
- package/src/popover/{index.js → index.tsx} +246 -176
- package/src/popover/stories/{index.js → index.tsx} +51 -54
- package/src/popover/types.ts +173 -0
- package/src/popover/utils.ts +230 -0
- package/src/radio-control/index.tsx +28 -29
- package/src/radio-control/style.scss +0 -17
- package/src/range-control/index.tsx +4 -1
- package/src/range-control/styles/range-control-styles.ts +8 -8
- package/src/sandbox/index.js +2 -2
- package/src/search-control/README.md +5 -3
- package/src/search-control/{index.js → index.tsx} +35 -7
- package/src/search-control/stories/index.tsx +66 -0
- package/src/search-control/types.ts +43 -0
- package/src/select-control/index.native.js +1 -1
- package/src/slot-fill/test/index.js +69 -12
- package/src/style.scss +0 -1
- package/src/surface/test/__snapshots__/index.tsx.snap +10 -10
- package/src/tab-panel/README.md +1 -2
- package/src/tab-panel/{index.js → index.tsx} +58 -13
- package/src/tab-panel/stories/index.tsx +37 -0
- package/src/tab-panel/test/index.tsx +120 -0
- package/src/tab-panel/types.ts +65 -0
- package/src/text-control/index.tsx +2 -0
- package/src/text-control/types.ts +5 -1
- package/src/textarea-control/index.tsx +3 -6
- package/src/textarea-control/types.ts +1 -1
- package/src/toggle-control/index.tsx +97 -0
- package/src/toggle-control/stories/index.tsx +58 -0
- package/src/toggle-control/test/index.tsx +53 -0
- package/src/toggle-control/types.ts +28 -0
- package/src/toggle-group-control/stories/index.tsx +10 -3
- package/src/toggle-group-control/toggle-group-control/component.tsx +3 -3
- package/src/toggle-group-control/toggle-group-control-option-icon/README.md +1 -1
- package/src/toggle-group-control/toggle-group-control-option-icon/component.tsx +1 -1
- package/src/toggle-group-control/types.ts +2 -2
- package/src/tooltip/index.js +1 -1
- package/src/ui/context/context-connect.ts +58 -31
- package/src/ui/context/context-system-provider.js +5 -4
- package/src/ui/context/test/context-connect.tsx +55 -0
- package/src/ui/context/test/wordpress-component.tsx +36 -0
- package/src/ui/context/wordpress-component.ts +18 -12
- package/src/ui/control-group/test/__snapshots__/index.js.snap +1 -4
- package/src/unit-control/index.tsx +1 -1
- package/src/unit-control/stories/index.tsx +7 -16
- package/src/unit-control/styles/unit-control-styles.ts +2 -2
- package/src/unit-control/test/__snapshots__/index.tsx.snap +4 -6
- package/src/unit-control/types.ts +3 -44
- package/src/utils/colors-values.js +2 -24
- package/src/utils/math.js +4 -4
- package/src/utils/values.js +48 -6
- package/src/v-stack/test/__snapshots__/index.tsx.snap +3 -12
- package/src/view/{component.js → component.tsx} +13 -4
- package/src/view/stories/index.tsx +32 -0
- package/src/view/types.ts +6 -0
- package/tsconfig.json +0 -6
- package/tsconfig.tsbuildinfo +1 -1
- package/src/focal-point-picker/stories/index.js +0 -76
- package/src/navigable-container/test/menu.js +0 -310
- package/src/navigable-container/test/tabbable.js +0 -158
- package/src/number-control/index.js +0 -192
- package/src/popover/utils.js +0 -107
- package/src/search-control/stories/index.js +0 -39
- package/src/tab-panel/stories/index.js +0 -39
- package/src/tab-panel/test/index.js +0 -179
- package/src/toggle-control/index.js +0 -55
- package/src/toggle-control/stories/index.js +0 -64
- package/src/toggle-control/style.scss +0 -14
- package/src/toggle-control/test/index.js +0 -52
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/toggle-control/index.
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toggle-control/index.tsx"],"names":["css","useInstanceId","FormToggle","BaseControl","HStack","useCx","space","ToggleControl","__nextHasNoMarginBottom","label","checked","help","className","onChange","disabled","onChangeToggle","event","target","instanceId","id","cx","classes","marginBottom","describedBy","helpLabel"],"mappings":";;AAAA;AACA;AACA;AAEA,SAASA,GAAT,QAAoB,gBAApB;AAEA;AACA;AACA;;AACA,SAASC,aAAT,QAA8B,oBAA9B;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,gBAAvB;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AAGA,SAASC,MAAT,QAAuB,YAAvB;AACA,SAASC,KAAT,QAAsB,UAAtB;AACA,SAASC,KAAT,QAAsB,mBAAtB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,aAAT,OAQ4D;AAAA,MARpC;AAC9BC,IAAAA,uBAD8B;AAE9BC,IAAAA,KAF8B;AAG9BC,IAAAA,OAH8B;AAI9BC,IAAAA,IAJ8B;AAK9BC,IAAAA,SAL8B;AAM9BC,IAAAA,QAN8B;AAO9BC,IAAAA;AAP8B,GAQoC;;AAClE,WAASC,cAAT,CAAyBC,KAAzB,EAAkE;AACjEH,IAAAA,QAAQ,CAAEG,KAAK,CAACC,MAAN,CAAaP,OAAf,CAAR;AACA;;AACD,QAAMQ,UAAU,GAAGjB,aAAa,CAAEM,aAAF,CAAhC;AACA,QAAMY,EAAE,GAAI,4BAA4BD,UAAY,EAApD;AAEA,QAAME,EAAE,GAAGf,KAAK,EAAhB;AACA,QAAMgB,OAAO,GAAGD,EAAE,CACjB,2BADiB,EAEjBR,SAFiB,EAGjB,CAAEJ,uBAAF,iBAA6BR,GAAG,CAAE;AAAEsB,IAAAA,YAAY,EAAEhB,KAAK,CAAE,CAAF;AAArB,GAAF,qpHAHf,CAAlB;AAMA,MAAIiB,WAAJ,EAAiBC,SAAjB;;AACA,MAAKb,IAAL,EAAY;AACXY,IAAAA,WAAW,GAAGJ,EAAE,GAAG,QAAnB;AACAK,IAAAA,SAAS,GAAG,OAAOb,IAAP,KAAgB,UAAhB,GAA6BA,IAAI,CAAED,OAAF,CAAjC,GAA+CC,IAA3D;AACA;;AAED,SACC,cAAC,WAAD;AACC,IAAA,EAAE,EAAGQ,EADN;AAEC,IAAA,IAAI,EAAGK,SAFR;AAGC,IAAA,SAAS,EAAGH,OAHb;AAIC,IAAA,uBAAuB;AAJxB,KAMC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAC,YAAhB;AAA6B,IAAA,OAAO,EAAG;AAAvC,KACC,cAAC,UAAD;AACC,IAAA,EAAE,EAAGF,EADN;AAEC,IAAA,OAAO,EAAGT,OAFX;AAGC,IAAA,QAAQ,EAAGK,cAHZ;AAIC,wBAAmBQ,WAJpB;AAKC,IAAA,QAAQ,EAAGT;AALZ,IADD,EAQC;AACC,IAAA,OAAO,EAAGK,EADX;AAEC,IAAA,SAAS,EAAC;AAFX,KAIGV,KAJH,CARD,CAND,CADD;AAwBA;AAED,eAAeF,aAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { ChangeEvent } from 'react';\nimport { css } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport FormToggle from '../form-toggle';\nimport BaseControl from '../base-control';\nimport type { WordPressComponentProps } from '../ui/context/wordpress-component';\nimport type { ToggleControlProps } from './types';\nimport { HStack } from '../h-stack';\nimport { useCx } from '../utils';\nimport { space } from '../ui/utils/space';\n\n/**\n * ToggleControl is used to generate a toggle user interface.\n *\n * ```jsx\n * import { ToggleControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyToggleControl = () => {\n * const [ value, setValue ] = useState( false );\n *\n * return (\n * <ToggleControl\n * label=\"Fixed Background\"\n * checked={ value }\n * onChange={ () => setValue( ( state ) => ! state ) }\n * />\n * );\n * };\n * ```\n */\nexport function ToggleControl( {\n\t__nextHasNoMarginBottom,\n\tlabel,\n\tchecked,\n\thelp,\n\tclassName,\n\tonChange,\n\tdisabled,\n}: WordPressComponentProps< ToggleControlProps, 'input', false > ) {\n\tfunction onChangeToggle( event: ChangeEvent< HTMLInputElement > ) {\n\t\tonChange( event.target.checked );\n\t}\n\tconst instanceId = useInstanceId( ToggleControl );\n\tconst id = `inspector-toggle-control-${ instanceId }`;\n\n\tconst cx = useCx();\n\tconst classes = cx(\n\t\t'components-toggle-control',\n\t\tclassName,\n\t\t! __nextHasNoMarginBottom && css( { marginBottom: space( 3 ) } )\n\t);\n\n\tlet describedBy, helpLabel;\n\tif ( help ) {\n\t\tdescribedBy = id + '__help';\n\t\thelpLabel = typeof help === 'function' ? help( checked ) : help;\n\t}\n\n\treturn (\n\t\t<BaseControl\n\t\t\tid={ id }\n\t\t\thelp={ helpLabel }\n\t\t\tclassName={ classes }\n\t\t\t__nextHasNoMarginBottom\n\t\t>\n\t\t\t<HStack justify=\"flex-start\" spacing={ 3 }>\n\t\t\t\t<FormToggle\n\t\t\t\t\tid={ id }\n\t\t\t\t\tchecked={ checked }\n\t\t\t\t\tonChange={ onChangeToggle }\n\t\t\t\t\taria-describedby={ describedBy }\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t/>\n\t\t\t\t<label\n\t\t\t\t\thtmlFor={ id }\n\t\t\t\t\tclassName=\"components-toggle-control__label\"\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</label>\n\t\t\t</HStack>\n\t\t</BaseControl>\n\t);\n}\n\nexport default ToggleControl;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}
|
|
@@ -33,7 +33,7 @@ function UnconnectedToggleGroupControl(props, forwardedRef) {
|
|
|
33
33
|
className,
|
|
34
34
|
isAdaptiveWidth = false,
|
|
35
35
|
isBlock = false,
|
|
36
|
-
|
|
36
|
+
__experimentalIsBorderless = false,
|
|
37
37
|
label,
|
|
38
38
|
hideLabelFromVision = false,
|
|
39
39
|
help,
|
|
@@ -68,7 +68,7 @@ function UnconnectedToggleGroupControl(props, forwardedRef) {
|
|
|
68
68
|
}, [value]);
|
|
69
69
|
const classes = useMemo(() => cx(styles.ToggleGroupControl({
|
|
70
70
|
size
|
|
71
|
-
}), !
|
|
71
|
+
}), !__experimentalIsBorderless && styles.border, isBlock && styles.block, className), [className, cx, isBlock, __experimentalIsBorderless, size]);
|
|
72
72
|
return createElement(BaseControl, {
|
|
73
73
|
help: help,
|
|
74
74
|
__nextHasNoMarginBottom: __nextHasNoMarginBottom
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"names":["RadioGroup","useRadioState","useRef","useMemo","useMergeRefs","useInstanceId","usePrevious","useResizeObserver","contextConnect","useContextSystem","useUpdateEffect","useCx","View","BaseControl","ToggleGroupControlBackdrop","ToggleGroupControlContext","VisualLabelWrapper","styles","noop","UnconnectedToggleGroupControl","props","forwardedRef","__nextHasNoMarginBottom","className","isAdaptiveWidth","isBlock","
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"names":["RadioGroup","useRadioState","useRef","useMemo","useMergeRefs","useInstanceId","usePrevious","useResizeObserver","contextConnect","useContextSystem","useUpdateEffect","useCx","View","BaseControl","ToggleGroupControlBackdrop","ToggleGroupControlContext","VisualLabelWrapper","styles","noop","UnconnectedToggleGroupControl","props","forwardedRef","__nextHasNoMarginBottom","className","isAdaptiveWidth","isBlock","__experimentalIsBorderless","label","hideLabelFromVision","help","onChange","size","value","children","otherProps","cx","containerRef","resizeListener","sizes","baseId","ToggleGroupControl","toString","radio","state","previousValue","setState","classes","border","block","width"],"mappings":";;;AAAA;AACA;AACA;AAEA;AACA,SAASA,UAAT,EAAqBC,aAArB,QAA0C,QAA1C;AAEA;AACA;AACA;;AAEA,SAASC,MAAT,EAAiBC,OAAjB,QAAgC,oBAAhC;AACA,SACCC,YADD,EAECC,aAFD,EAGCC,WAHD,EAICC,iBAJD,QAKO,oBALP;AAOA;AACA;AACA;;AACA,SACCC,cADD,EAECC,gBAFD,QAIO,kBAJP;AAKA,SAASC,eAAT,EAA0BC,KAA1B,QAAuC,mBAAvC;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,OAAOC,WAAP,MAAwB,oBAAxB;AAEA,OAAOC,0BAAP,MAAuC,iCAAvC;AACA,OAAOC,yBAAP,MAAsC,YAAtC;AACA,SAASC,kBAAT,QAAmC,UAAnC;AACA,OAAO,KAAKC,MAAZ,MAAwB,UAAxB;;AAEA,MAAMC,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEA,SAASC,6BAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAM;AACLC,IAAAA,uBAAuB,GAAG,KADrB;AAELC,IAAAA,SAFK;AAGLC,IAAAA,eAAe,GAAG,KAHb;AAILC,IAAAA,OAAO,GAAG,KAJL;AAKLC,IAAAA,0BAA0B,GAAG,KALxB;AAMLC,IAAAA,KANK;AAOLC,IAAAA,mBAAmB,GAAG,KAPjB;AAQLC,IAAAA,IARK;AASLC,IAAAA,QAAQ,GAAGZ,IATN;AAULa,IAAAA,IAAI,GAAG,SAVF;AAWLC,IAAAA,KAXK;AAYLC,IAAAA,QAZK;AAaL,OAAGC;AAbE,MAcFzB,gBAAgB,CAAEW,KAAF,EAAS,oBAAT,CAdpB;AAeA,QAAMe,EAAE,GAAGxB,KAAK,EAAhB;AACA,QAAMyB,YAAY,GAAGlC,MAAM,EAA3B;AACA,QAAM,CAAEmC,cAAF,EAAkBC,KAAlB,IAA4B/B,iBAAiB,EAAnD;AACA,QAAMgC,MAAM,GAAGlC,aAAa,CAC3BmC,kBAD2B,EAE3B,sBAF2B,CAAb,CAGbC,QAHa,EAAf;AAIA,QAAMC,KAAK,GAAGzC,aAAa,CAAE;AAC5BsC,IAAAA,MAD4B;AAE5BI,IAAAA,KAAK,EAAEX;AAFqB,GAAF,CAA3B;AAIA,QAAMY,aAAa,GAAGtC,WAAW,CAAE0B,KAAF,CAAjC,CA3BC,CA6BD;;AACAtB,EAAAA,eAAe,CAAE,MAAM;AACtB;AACA;AACA,QAAKkC,aAAa,KAAKF,KAAK,CAACC,KAA7B,EAAqC;AACpCb,MAAAA,QAAQ,CAAEY,KAAK,CAACC,KAAR,CAAR;AACA;AACD,GANc,EAMZ,CAAED,KAAK,CAACC,KAAR,CANY,CAAf,CA9BC,CAsCD;;AACAjC,EAAAA,eAAe,CAAE,MAAM;AACtB,QAAKsB,KAAK,KAAKU,KAAK,CAACC,KAArB,EAA6B;AAC5BD,MAAAA,KAAK,CAACG,QAAN,CAAgBb,KAAhB;AACA;AACD,GAJc,EAIZ,CAAEA,KAAF,CAJY,CAAf;AAMA,QAAMc,OAAO,GAAG3C,OAAO,CACtB,MACCgC,EAAE,CACDlB,MAAM,CAACuB,kBAAP,CAA2B;AAAET,IAAAA;AAAF,GAA3B,CADC,EAED,CAAEL,0BAAF,IAAgCT,MAAM,CAAC8B,MAFtC,EAGDtB,OAAO,IAAIR,MAAM,CAAC+B,KAHjB,EAIDzB,SAJC,CAFmB,EAQtB,CAAEA,SAAF,EAAaY,EAAb,EAAiBV,OAAjB,EAA0BC,0BAA1B,EAAsDK,IAAtD,CARsB,CAAvB;AAUA,SACC,cAAC,WAAD;AACC,IAAA,IAAI,EAAGF,IADR;AAEC,IAAA,uBAAuB,EAAGP;AAF3B,KAIC,cAAC,yBAAD,CAA2B,QAA3B;AACC,IAAA,KAAK,EAAG,EAAE,GAAGoB,KAAL;AAAYjB,MAAAA,OAAO,EAAE,CAAED,eAAvB;AAAwCO,MAAAA;AAAxC;AADT,KAGG,CAAEH,mBAAF,IACD,cAAC,kBAAD,QACC,cAAC,WAAD,CAAa,WAAb,QACGD,KADH,CADD,CAJF,EAUC,cAAC,UAAD,eACMe,KADN;AAEC,kBAAaf,KAFd;AAGC,IAAA,EAAE,EAAGf,IAHN;AAIC,IAAA,SAAS,EAAGkC;AAJb,KAKMZ,UALN;AAMC,IAAA,GAAG,EAAG9B,YAAY,CAAE,CAAEgC,YAAF,EAAgBf,YAAhB,CAAF;AANnB,MAQGgB,cARH,EASC,cAAC,0BAAD,eACMK,KADN;AAEC,IAAA,YAAY,EAAGN,YAFhB;AAGC,IAAA,cAAc,EAAGE,KAAK,CAACW,KAHxB;AAIC,IAAA,eAAe,EAAGzB;AAJnB,KATD,EAeGS,QAfH,CAVD,CAJD,CADD;AAmCA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,MAAMO,kBAAkB,GAAGhC,cAAc,CAC/CW,6BAD+C,EAE/C,oBAF+C,CAAzC;AAKP,eAAeqB,kBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n// eslint-disable-next-line no-restricted-imports\nimport { RadioGroup, useRadioState } from 'reakit';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useRef, useMemo } from '@wordpress/element';\nimport {\n\tuseMergeRefs,\n\tuseInstanceId,\n\tusePrevious,\n\tuseResizeObserver,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../../ui/context';\nimport { useUpdateEffect, useCx } from '../../utils/hooks';\nimport { View } from '../../view';\nimport BaseControl from '../../base-control';\nimport type { ToggleGroupControlProps } from '../types';\nimport ToggleGroupControlBackdrop from './toggle-group-control-backdrop';\nimport ToggleGroupControlContext from '../context';\nimport { VisualLabelWrapper } from './styles';\nimport * as styles from './styles';\n\nconst noop = () => {};\n\nfunction UnconnectedToggleGroupControl(\n\tprops: WordPressComponentProps< ToggleGroupControlProps, 'input', false >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\tclassName,\n\t\tisAdaptiveWidth = false,\n\t\tisBlock = false,\n\t\t__experimentalIsBorderless = false,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tonChange = noop,\n\t\tsize = 'default',\n\t\tvalue,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToggleGroupControl' );\n\tconst cx = useCx();\n\tconst containerRef = useRef();\n\tconst [ resizeListener, sizes ] = useResizeObserver();\n\tconst baseId = useInstanceId(\n\t\tToggleGroupControl,\n\t\t'toggle-group-control'\n\t).toString();\n\tconst radio = useRadioState( {\n\t\tbaseId,\n\t\tstate: value,\n\t} );\n\tconst previousValue = usePrevious( value );\n\n\t// Propagate radio.state change.\n\tuseUpdateEffect( () => {\n\t\t// Avoid calling onChange if radio state changed\n\t\t// from incoming value.\n\t\tif ( previousValue !== radio.state ) {\n\t\t\tonChange( radio.state );\n\t\t}\n\t}, [ radio.state ] );\n\n\t// Sync incoming value with radio.state.\n\tuseUpdateEffect( () => {\n\t\tif ( value !== radio.state ) {\n\t\t\tradio.setState( value );\n\t\t}\n\t}, [ value ] );\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.ToggleGroupControl( { size } ),\n\t\t\t\t! __experimentalIsBorderless && styles.border,\n\t\t\t\tisBlock && styles.block,\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isBlock, __experimentalIsBorderless, size ]\n\t);\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ help }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t>\n\t\t\t<ToggleGroupControlContext.Provider\n\t\t\t\tvalue={ { ...radio, isBlock: ! isAdaptiveWidth, size } }\n\t\t\t>\n\t\t\t\t{ ! hideLabelFromVision && (\n\t\t\t\t\t<VisualLabelWrapper>\n\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t</VisualLabelWrapper>\n\t\t\t\t) }\n\t\t\t\t<RadioGroup\n\t\t\t\t\t{ ...radio }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tas={ View }\n\t\t\t\t\tclassName={ classes }\n\t\t\t\t\t{ ...otherProps }\n\t\t\t\t\tref={ useMergeRefs( [ containerRef, forwardedRef ] ) }\n\t\t\t\t>\n\t\t\t\t\t{ resizeListener }\n\t\t\t\t\t<ToggleGroupControlBackdrop\n\t\t\t\t\t\t{ ...radio }\n\t\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t\t\tcontainerWidth={ sizes.width }\n\t\t\t\t\t\tisAdaptiveWidth={ isAdaptiveWidth }\n\t\t\t\t\t/>\n\t\t\t\t\t{ children }\n\t\t\t\t</RadioGroup>\n\t\t\t</ToggleGroupControlContext.Provider>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `ToggleGroupControl` is a form component that lets users choose options\n * represented in horizontal segments. To render options for this control use\n * `ToggleGroupControlOption` component.\n *\n * This component is intended for selecting a single persistent value from a set of options,\n * similar to a how a radio button group would work. If you simply want a toggle to switch between views,\n * use a `TabPanel` instead.\n *\n * Only use this control when you know for sure the labels of items inside won't\n * wrap. For items with longer labels, you can consider a `SelectControl` or a\n * `CustomSelectControl` component instead.\n *\n * ```jsx\n * import {\n * __experimentalToggleGroupControl as ToggleGroupControl,\n * __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n * return (\n * <ToggleGroupControl label=\"my label\" value=\"vertical\" isBlock>\n * <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n * <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n * </ToggleGroupControl>\n * );\n * }\n * ```\n */\nexport const ToggleGroupControl = contextConnect(\n\tUnconnectedToggleGroupControl,\n\t'ToggleGroupControl'\n);\n\nexport default ToggleGroupControl;\n"]}
|
|
@@ -45,7 +45,7 @@ function UnforwardedToggleGroupControlOptionIcon(props, ref) {
|
|
|
45
45
|
*
|
|
46
46
|
* function Example() {
|
|
47
47
|
* return (
|
|
48
|
-
* <ToggleGroupControl
|
|
48
|
+
* <ToggleGroupControl>
|
|
49
49
|
* <ToggleGroupControlOptionIcon
|
|
50
50
|
* value="uppercase"
|
|
51
51
|
* label="Uppercase"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control-option-icon/component.tsx"],"names":["forwardRef","ToggleGroupControlOptionBase","Icon","UnforwardedToggleGroupControlOptionIcon","props","ref","icon","label","restProps","ToggleGroupControlOptionIcon"],"mappings":";;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AAGA,SAASC,4BAAT,QAA6C,qCAA7C;AACA,OAAOC,IAAP,MAAiB,YAAjB;;AAEA,SAASC,uCAAT,CACCC,KADD,EAMCC,GAND,EAOE;AACD,QAAM;AAAEC,IAAAA,IAAF;AAAQC,IAAAA,KAAR;AAAe,OAAGC;AAAlB,MAAgCJ,KAAtC;AACA,SACC,cAAC,4BAAD,eACMI,SADN;AAEC,IAAA,MAAM,MAFP;AAGC,kBAAaD,KAHd;AAIC,IAAA,WAAW,MAJZ;AAKC,IAAA,GAAG,EAAGF;AALP,MAOC,cAAC,IAAD;AAAM,IAAA,IAAI,EAAGC;AAAb,IAPD,CADD;AAWA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,MAAMG,4BAA4B,GAAGT,UAAU,CACrDG,uCADqD,CAA/C;AAIP,eAAeM,4BAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../ui/context';\nimport type { ToggleGroupControlOptionIconProps } from '../types';\nimport { ToggleGroupControlOptionBase } from '../toggle-group-control-option-base';\nimport Icon from '../../icon';\n\nfunction UnforwardedToggleGroupControlOptionIcon(\n\tprops: WordPressComponentProps<\n\t\tToggleGroupControlOptionIconProps,\n\t\t'button',\n\t\tfalse\n\t>,\n\tref: ForwardedRef< any >\n) {\n\tconst { icon, label, ...restProps } = props;\n\treturn (\n\t\t<ToggleGroupControlOptionBase\n\t\t\t{ ...restProps }\n\t\t\tisIcon\n\t\t\taria-label={ label }\n\t\t\tshowTooltip\n\t\t\tref={ ref }\n\t\t>\n\t\t\t<Icon icon={ icon } />\n\t\t</ToggleGroupControlOptionBase>\n\t);\n}\n\n/**\n * `ToggleGroupControlOptionIcon` is a form component which is meant to be used as a\n * child of `ToggleGroupControl` and displays an icon.\n *\n * ```jsx\n *\n * import {\n *\t__experimentalToggleGroupControl as ToggleGroupControl,\n *\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n * from '@wordpress/components';\n * import { formatLowercase, formatUppercase } from '@wordpress/icons';\n *\n * function Example() {\n *\treturn (\n *\t\t<ToggleGroupControl
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control-option-icon/component.tsx"],"names":["forwardRef","ToggleGroupControlOptionBase","Icon","UnforwardedToggleGroupControlOptionIcon","props","ref","icon","label","restProps","ToggleGroupControlOptionIcon"],"mappings":";;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AAGA,SAASC,4BAAT,QAA6C,qCAA7C;AACA,OAAOC,IAAP,MAAiB,YAAjB;;AAEA,SAASC,uCAAT,CACCC,KADD,EAMCC,GAND,EAOE;AACD,QAAM;AAAEC,IAAAA,IAAF;AAAQC,IAAAA,KAAR;AAAe,OAAGC;AAAlB,MAAgCJ,KAAtC;AACA,SACC,cAAC,4BAAD,eACMI,SADN;AAEC,IAAA,MAAM,MAFP;AAGC,kBAAaD,KAHd;AAIC,IAAA,WAAW,MAJZ;AAKC,IAAA,GAAG,EAAGF;AALP,MAOC,cAAC,IAAD;AAAM,IAAA,IAAI,EAAGC;AAAb,IAPD,CADD;AAWA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,MAAMG,4BAA4B,GAAGT,UAAU,CACrDG,uCADqD,CAA/C;AAIP,eAAeM,4BAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../ui/context';\nimport type { ToggleGroupControlOptionIconProps } from '../types';\nimport { ToggleGroupControlOptionBase } from '../toggle-group-control-option-base';\nimport Icon from '../../icon';\n\nfunction UnforwardedToggleGroupControlOptionIcon(\n\tprops: WordPressComponentProps<\n\t\tToggleGroupControlOptionIconProps,\n\t\t'button',\n\t\tfalse\n\t>,\n\tref: ForwardedRef< any >\n) {\n\tconst { icon, label, ...restProps } = props;\n\treturn (\n\t\t<ToggleGroupControlOptionBase\n\t\t\t{ ...restProps }\n\t\t\tisIcon\n\t\t\taria-label={ label }\n\t\t\tshowTooltip\n\t\t\tref={ ref }\n\t\t>\n\t\t\t<Icon icon={ icon } />\n\t\t</ToggleGroupControlOptionBase>\n\t);\n}\n\n/**\n * `ToggleGroupControlOptionIcon` is a form component which is meant to be used as a\n * child of `ToggleGroupControl` and displays an icon.\n *\n * ```jsx\n *\n * import {\n *\t__experimentalToggleGroupControl as ToggleGroupControl,\n *\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n * from '@wordpress/components';\n * import { formatLowercase, formatUppercase } from '@wordpress/icons';\n *\n * function Example() {\n *\treturn (\n *\t\t<ToggleGroupControl>\n *\t\t\t<ToggleGroupControlOptionIcon\n *\t\t\t\tvalue=\"uppercase\"\n *\t\t\t\tlabel=\"Uppercase\"\n *\t\t\t\ticon={ formatUppercase }\n *\t\t\t/>\n *\t\t\t<ToggleGroupControlOptionIcon\n *\t\t\t\tvalue=\"lowercase\"\n *\t\t\t\tlabel=\"Lowercase\"\n *\t\t\t\ticon={ formatLowercase }\n *\t\t\t/>\n *\t\t</ToggleGroupControl>\n *\t);\n * }\n * ```\n */\nexport const ToggleGroupControlOptionIcon = forwardRef(\n\tUnforwardedToggleGroupControlOptionIcon\n);\n\nexport default ToggleGroupControlOptionIcon;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/tooltip/index.js"],"names":["Children","cloneElement","concatChildren","useEffect","useState","useRef","useDebounce","useMergeRefs","Popover","Shortcut","TOOLTIP_DELAY","eventCatcher","getDisabledElement","eventHandlers","child","childrenWithPopover","mergedRefs","children","ref","getRegularElement","addPopoverToGrandchildren","anchorRef","grandchildren","isOver","offset","position","shortcut","text","emitToChild","eventName","event","count","only","props","disabled","Tooltip","delay","isMouseDown","setIsMouseDown","setIsOver","delayedSetIsOver","childRef","existingChildRef","toArray","mergedChildRefs","createMouseDown","target","tagName","document","addEventListener","cancelIsMouseDown","createMouseUp","removeEventListener","createMouseEvent","type","createToggleIsOver","isDelayed","currentTarget","cancel","_isOver","includes","clearOnUnmount","process","env","NODE_ENV","console","error","onMouseEnter","onMouseLeave","onClick","onFocus","onBlur","onMouseDown","getElementWithPopover","popoverData"],"mappings":"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","sourcesContent":["// @ts-nocheck\n\n/**\n * WordPress dependencies\n */\nimport {\n\tChildren,\n\tcloneElement,\n\tconcatChildren,\n\tuseEffect,\n\tuseState,\n\tuseRef,\n} from '@wordpress/element';\nimport { useDebounce, useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Popover from '../popover';\nimport Shortcut from '../shortcut';\n\n/**\n * Time over children to wait before showing tooltip\n *\n * @type {number}\n */\nexport const TOOLTIP_DELAY = 700;\n\nconst eventCatcher = <div className=\"event-catcher\" />;\n\nconst getDisabledElement = ( {\n\teventHandlers,\n\tchild,\n\tchildrenWithPopover,\n\tmergedRefs,\n} ) => {\n\treturn cloneElement(\n\t\t<span className=\"disabled-element-wrapper\">\n\t\t\t{ cloneElement( eventCatcher, eventHandlers ) }\n\t\t\t{ cloneElement( child, {\n\t\t\t\tchildren: childrenWithPopover,\n\t\t\t\tref: mergedRefs,\n\t\t\t} ) }\n\t\t</span>,\n\t\t{ ...eventHandlers }\n\t);\n};\n\nconst getRegularElement = ( {\n\tchild,\n\teventHandlers,\n\tchildrenWithPopover,\n\tmergedRefs,\n} ) => {\n\treturn cloneElement( child, {\n\t\t...eventHandlers,\n\t\tchildren: childrenWithPopover,\n\t\tref: mergedRefs,\n\t} );\n};\n\nconst addPopoverToGrandchildren = ( {\n\tanchorRef,\n\tgrandchildren,\n\tisOver,\n\toffset,\n\tposition,\n\tshortcut,\n\ttext,\n} ) =>\n\tconcatChildren(\n\t\tgrandchildren,\n\t\tisOver && (\n\t\t\t<Popover\n\t\t\t\tfocusOnMount={ false }\n\t\t\t\tposition={ position }\n\t\t\t\tclassName=\"components-tooltip\"\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tanimate={ false }\n\t\t\t\toffset={ offset }\n\t\t\t\tanchorRef={ anchorRef }\n\t\t\t\t__unstableShift\n\t\t\t>\n\t\t\t\t{ text }\n\t\t\t\t<Shortcut\n\t\t\t\t\tclassName=\"components-tooltip__shortcut\"\n\t\t\t\t\tshortcut={ shortcut }\n\t\t\t\t/>\n\t\t\t</Popover>\n\t\t)\n\t);\n\nconst emitToChild = ( children, eventName, event ) => {\n\tif ( Children.count( children ) !== 1 ) {\n\t\treturn;\n\t}\n\n\tconst child = Children.only( children );\n\n\t// If the underlying element is disabled, do not emit the event.\n\tif ( child.props.disabled ) {\n\t\treturn;\n\t}\n\n\tif ( typeof child.props[ eventName ] === 'function' ) {\n\t\tchild.props[ eventName ]( event );\n\t}\n};\n\nfunction Tooltip( props ) {\n\tconst {\n\t\tchildren,\n\t\tposition = 'bottom middle',\n\t\ttext,\n\t\tshortcut,\n\t\tdelay = TOOLTIP_DELAY,\n\t} = props;\n\t/**\n\t * Whether a mouse is currently pressed, used in determining whether\n\t * to handle a focus event as displaying the tooltip immediately.\n\t *\n\t * @type {boolean}\n\t */\n\tconst [ isMouseDown, setIsMouseDown ] = useState( false );\n\tconst [ isOver, setIsOver ] = useState( false );\n\tconst delayedSetIsOver = useDebounce( setIsOver, delay );\n\n\t// Create a reference to the Tooltip's child, to be passed to the Popover\n\t// so that the Tooltip can be correctly positioned. Also, merge with the\n\t// existing ref for the first child, so that its ref is preserved.\n\tconst childRef = useRef( null );\n\tconst existingChildRef = Children.toArray( children )[ 0 ]?.ref;\n\tconst mergedChildRefs = useMergeRefs( [ childRef, existingChildRef ] );\n\n\tconst createMouseDown = ( event ) => {\n\t\t// In firefox, the mouse down event is also fired when the select\n\t\t// list is chosen.\n\t\t// Cancel further processing because re-rendering of child components\n\t\t// causes onChange to be triggered with the old value.\n\t\t// See https://github.com/WordPress/gutenberg/pull/42483\n\t\tif ( event.target.tagName === 'OPTION' ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Preserve original child callback behavior.\n\t\temitToChild( children, 'onMouseDown', event );\n\n\t\t// On mouse down, the next `mouseup` should revert the value of the\n\t\t// instance property and remove its own event handler. The bind is\n\t\t// made on the document since the `mouseup` might not occur within\n\t\t// the bounds of the element.\n\t\tdocument.addEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( true );\n\t};\n\n\tconst createMouseUp = ( event ) => {\n\t\t// In firefox, the mouse up event is also fired when the select\n\t\t// list is chosen.\n\t\t// Cancel further processing because re-rendering of child components\n\t\t// causes onChange to be triggered with the old value.\n\t\t// See https://github.com/WordPress/gutenberg/pull/42483\n\t\tif ( event.target.tagName === 'OPTION' ) {\n\t\t\treturn;\n\t\t}\n\n\t\temitToChild( children, 'onMouseUp', event );\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( false );\n\t};\n\n\tconst createMouseEvent = ( type ) => {\n\t\tif ( type === 'mouseUp' ) return createMouseUp;\n\t\tif ( type === 'mouseDown' ) return createMouseDown;\n\t};\n\n\t/**\n\t * Prebound `isInMouseDown` handler, created as a constant reference to\n\t * assure ability to remove in component unmount.\n\t *\n\t * @type {Function}\n\t */\n\tconst cancelIsMouseDown = createMouseEvent( 'mouseUp' );\n\n\tconst createToggleIsOver = ( eventName, isDelayed ) => {\n\t\treturn ( event ) => {\n\t\t\t// Preserve original child callback behavior.\n\t\t\temitToChild( children, eventName, event );\n\n\t\t\t// Mouse events behave unreliably in React for disabled elements,\n\t\t\t// firing on mouseenter but not mouseleave. Further, the default\n\t\t\t// behavior for disabled elements in some browsers is to ignore\n\t\t\t// mouse events. Don't bother trying to handle them.\n\t\t\t//\n\t\t\t// See: https://github.com/facebook/react/issues/4251\n\t\t\tif ( event.currentTarget.disabled ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// A focus event will occur as a result of a mouse click, but it\n\t\t\t// should be disambiguated between interacting with the button and\n\t\t\t// using an explicit focus shift as a cue to display the tooltip.\n\t\t\tif ( 'focus' === event.type && isMouseDown ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Needed in case unsetting is over while delayed set pending, i.e.\n\t\t\t// quickly blur/mouseleave before delayedSetIsOver is called.\n\t\t\tdelayedSetIsOver.cancel();\n\n\t\t\tconst _isOver = [ 'focus', 'mouseenter' ].includes( event.type );\n\t\t\tif ( _isOver === isOver ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( isDelayed ) {\n\t\t\t\tdelayedSetIsOver( _isOver );\n\t\t\t} else {\n\t\t\t\tsetIsOver( _isOver );\n\t\t\t}\n\t\t};\n\t};\n\tconst clearOnUnmount = () => {\n\t\tdelayedSetIsOver.cancel();\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t};\n\n\tuseEffect( () => clearOnUnmount, [] );\n\n\tif ( Children.count( children ) !== 1 ) {\n\t\tif ( 'development' === process.env.NODE_ENV ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.error(\n\t\t\t\t'Tooltip should be called with only a single child element.'\n\t\t\t);\n\t\t}\n\n\t\treturn children;\n\t}\n\n\tconst eventHandlers = {\n\t\tonMouseEnter: createToggleIsOver( 'onMouseEnter', true ),\n\t\tonMouseLeave: createToggleIsOver( 'onMouseLeave' ),\n\t\tonClick: createToggleIsOver( 'onClick' ),\n\t\tonFocus: createToggleIsOver( 'onFocus' ),\n\t\tonBlur: createToggleIsOver( 'onBlur' ),\n\t\tonMouseDown: createMouseEvent( 'mouseDown' ),\n\t};\n\n\tconst child = Children.only( children );\n\tconst { children: grandchildren, disabled } = child.props;\n\tconst getElementWithPopover = disabled\n\t\t? getDisabledElement\n\t\t: getRegularElement;\n\n\tconst popoverData = {\n\t\tanchorRef: childRef,\n\t\tisOver,\n\t\toffset: 4,\n\t\tposition,\n\t\tshortcut,\n\t\ttext,\n\t};\n\tconst childrenWithPopover = addPopoverToGrandchildren( {\n\t\tgrandchildren,\n\t\t...popoverData,\n\t} );\n\n\treturn getElementWithPopover( {\n\t\tchild,\n\t\teventHandlers,\n\t\tchildrenWithPopover,\n\t\tmergedRefs: mergedChildRefs,\n\t} );\n}\n\nexport default Tooltip;\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/tooltip/index.js"],"names":["Children","cloneElement","concatChildren","useEffect","useState","useRef","useDebounce","useMergeRefs","Popover","Shortcut","TOOLTIP_DELAY","eventCatcher","getDisabledElement","eventHandlers","child","childrenWithPopover","mergedRefs","children","ref","getRegularElement","addPopoverToGrandchildren","anchorRef","grandchildren","isOver","offset","position","shortcut","text","emitToChild","eventName","event","count","only","props","disabled","Tooltip","delay","isMouseDown","setIsMouseDown","setIsOver","delayedSetIsOver","childRef","existingChildRef","toArray","mergedChildRefs","createMouseDown","target","tagName","document","addEventListener","cancelIsMouseDown","createMouseUp","removeEventListener","createMouseEvent","type","createToggleIsOver","isDelayed","currentTarget","cancel","_isOver","includes","clearOnUnmount","process","env","NODE_ENV","console","error","onMouseEnter","onMouseLeave","onClick","onFocus","onBlur","onMouseDown","getElementWithPopover","popoverData"],"mappings":"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","sourcesContent":["// @ts-nocheck\n\n/**\n * WordPress dependencies\n */\nimport {\n\tChildren,\n\tcloneElement,\n\tconcatChildren,\n\tuseEffect,\n\tuseState,\n\tuseRef,\n} from '@wordpress/element';\nimport { useDebounce, useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Popover from '../popover';\nimport Shortcut from '../shortcut';\n\n/**\n * Time over children to wait before showing tooltip\n *\n * @type {number}\n */\nexport const TOOLTIP_DELAY = 700;\n\nconst eventCatcher = <div className=\"event-catcher\" />;\n\nconst getDisabledElement = ( {\n\teventHandlers,\n\tchild,\n\tchildrenWithPopover,\n\tmergedRefs,\n} ) => {\n\treturn cloneElement(\n\t\t<span className=\"disabled-element-wrapper\">\n\t\t\t{ cloneElement( eventCatcher, eventHandlers ) }\n\t\t\t{ cloneElement( child, {\n\t\t\t\tchildren: childrenWithPopover,\n\t\t\t\tref: mergedRefs,\n\t\t\t} ) }\n\t\t</span>,\n\t\t{ ...eventHandlers }\n\t);\n};\n\nconst getRegularElement = ( {\n\tchild,\n\teventHandlers,\n\tchildrenWithPopover,\n\tmergedRefs,\n} ) => {\n\treturn cloneElement( child, {\n\t\t...eventHandlers,\n\t\tchildren: childrenWithPopover,\n\t\tref: mergedRefs,\n\t} );\n};\n\nconst addPopoverToGrandchildren = ( {\n\tanchorRef,\n\tgrandchildren,\n\tisOver,\n\toffset,\n\tposition,\n\tshortcut,\n\ttext,\n} ) =>\n\tconcatChildren(\n\t\tgrandchildren,\n\t\tisOver && (\n\t\t\t<Popover\n\t\t\t\tfocusOnMount={ false }\n\t\t\t\tposition={ position }\n\t\t\t\tclassName=\"components-tooltip\"\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tanimate={ false }\n\t\t\t\toffset={ offset }\n\t\t\t\tanchorRef={ anchorRef }\n\t\t\t\tshift\n\t\t\t>\n\t\t\t\t{ text }\n\t\t\t\t<Shortcut\n\t\t\t\t\tclassName=\"components-tooltip__shortcut\"\n\t\t\t\t\tshortcut={ shortcut }\n\t\t\t\t/>\n\t\t\t</Popover>\n\t\t)\n\t);\n\nconst emitToChild = ( children, eventName, event ) => {\n\tif ( Children.count( children ) !== 1 ) {\n\t\treturn;\n\t}\n\n\tconst child = Children.only( children );\n\n\t// If the underlying element is disabled, do not emit the event.\n\tif ( child.props.disabled ) {\n\t\treturn;\n\t}\n\n\tif ( typeof child.props[ eventName ] === 'function' ) {\n\t\tchild.props[ eventName ]( event );\n\t}\n};\n\nfunction Tooltip( props ) {\n\tconst {\n\t\tchildren,\n\t\tposition = 'bottom middle',\n\t\ttext,\n\t\tshortcut,\n\t\tdelay = TOOLTIP_DELAY,\n\t} = props;\n\t/**\n\t * Whether a mouse is currently pressed, used in determining whether\n\t * to handle a focus event as displaying the tooltip immediately.\n\t *\n\t * @type {boolean}\n\t */\n\tconst [ isMouseDown, setIsMouseDown ] = useState( false );\n\tconst [ isOver, setIsOver ] = useState( false );\n\tconst delayedSetIsOver = useDebounce( setIsOver, delay );\n\n\t// Create a reference to the Tooltip's child, to be passed to the Popover\n\t// so that the Tooltip can be correctly positioned. Also, merge with the\n\t// existing ref for the first child, so that its ref is preserved.\n\tconst childRef = useRef( null );\n\tconst existingChildRef = Children.toArray( children )[ 0 ]?.ref;\n\tconst mergedChildRefs = useMergeRefs( [ childRef, existingChildRef ] );\n\n\tconst createMouseDown = ( event ) => {\n\t\t// In firefox, the mouse down event is also fired when the select\n\t\t// list is chosen.\n\t\t// Cancel further processing because re-rendering of child components\n\t\t// causes onChange to be triggered with the old value.\n\t\t// See https://github.com/WordPress/gutenberg/pull/42483\n\t\tif ( event.target.tagName === 'OPTION' ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Preserve original child callback behavior.\n\t\temitToChild( children, 'onMouseDown', event );\n\n\t\t// On mouse down, the next `mouseup` should revert the value of the\n\t\t// instance property and remove its own event handler. The bind is\n\t\t// made on the document since the `mouseup` might not occur within\n\t\t// the bounds of the element.\n\t\tdocument.addEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( true );\n\t};\n\n\tconst createMouseUp = ( event ) => {\n\t\t// In firefox, the mouse up event is also fired when the select\n\t\t// list is chosen.\n\t\t// Cancel further processing because re-rendering of child components\n\t\t// causes onChange to be triggered with the old value.\n\t\t// See https://github.com/WordPress/gutenberg/pull/42483\n\t\tif ( event.target.tagName === 'OPTION' ) {\n\t\t\treturn;\n\t\t}\n\n\t\temitToChild( children, 'onMouseUp', event );\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( false );\n\t};\n\n\tconst createMouseEvent = ( type ) => {\n\t\tif ( type === 'mouseUp' ) return createMouseUp;\n\t\tif ( type === 'mouseDown' ) return createMouseDown;\n\t};\n\n\t/**\n\t * Prebound `isInMouseDown` handler, created as a constant reference to\n\t * assure ability to remove in component unmount.\n\t *\n\t * @type {Function}\n\t */\n\tconst cancelIsMouseDown = createMouseEvent( 'mouseUp' );\n\n\tconst createToggleIsOver = ( eventName, isDelayed ) => {\n\t\treturn ( event ) => {\n\t\t\t// Preserve original child callback behavior.\n\t\t\temitToChild( children, eventName, event );\n\n\t\t\t// Mouse events behave unreliably in React for disabled elements,\n\t\t\t// firing on mouseenter but not mouseleave. Further, the default\n\t\t\t// behavior for disabled elements in some browsers is to ignore\n\t\t\t// mouse events. Don't bother trying to handle them.\n\t\t\t//\n\t\t\t// See: https://github.com/facebook/react/issues/4251\n\t\t\tif ( event.currentTarget.disabled ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// A focus event will occur as a result of a mouse click, but it\n\t\t\t// should be disambiguated between interacting with the button and\n\t\t\t// using an explicit focus shift as a cue to display the tooltip.\n\t\t\tif ( 'focus' === event.type && isMouseDown ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Needed in case unsetting is over while delayed set pending, i.e.\n\t\t\t// quickly blur/mouseleave before delayedSetIsOver is called.\n\t\t\tdelayedSetIsOver.cancel();\n\n\t\t\tconst _isOver = [ 'focus', 'mouseenter' ].includes( event.type );\n\t\t\tif ( _isOver === isOver ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( isDelayed ) {\n\t\t\t\tdelayedSetIsOver( _isOver );\n\t\t\t} else {\n\t\t\t\tsetIsOver( _isOver );\n\t\t\t}\n\t\t};\n\t};\n\tconst clearOnUnmount = () => {\n\t\tdelayedSetIsOver.cancel();\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t};\n\n\tuseEffect( () => clearOnUnmount, [] );\n\n\tif ( Children.count( children ) !== 1 ) {\n\t\tif ( 'development' === process.env.NODE_ENV ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.error(\n\t\t\t\t'Tooltip should be called with only a single child element.'\n\t\t\t);\n\t\t}\n\n\t\treturn children;\n\t}\n\n\tconst eventHandlers = {\n\t\tonMouseEnter: createToggleIsOver( 'onMouseEnter', true ),\n\t\tonMouseLeave: createToggleIsOver( 'onMouseLeave' ),\n\t\tonClick: createToggleIsOver( 'onClick' ),\n\t\tonFocus: createToggleIsOver( 'onFocus' ),\n\t\tonBlur: createToggleIsOver( 'onBlur' ),\n\t\tonMouseDown: createMouseEvent( 'mouseDown' ),\n\t};\n\n\tconst child = Children.only( children );\n\tconst { children: grandchildren, disabled } = child.props;\n\tconst getElementWithPopover = disabled\n\t\t? getDisabledElement\n\t\t: getRegularElement;\n\n\tconst popoverData = {\n\t\tanchorRef: childRef,\n\t\tisOver,\n\t\toffset: 4,\n\t\tposition,\n\t\tshortcut,\n\t\ttext,\n\t};\n\tconst childrenWithPopover = addPopoverToGrandchildren( {\n\t\tgrandchildren,\n\t\t...popoverData,\n\t} );\n\n\treturn getElementWithPopover( {\n\t\tchild,\n\t\teventHandlers,\n\t\tchildrenWithPopover,\n\t\tmergedRefs: mergedChildRefs,\n\t} );\n}\n\nexport default Tooltip;\n"]}
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
/**
|
|
6
6
|
* WordPress dependencies
|
|
7
7
|
*/
|
|
8
|
-
import { forwardRef
|
|
8
|
+
import { forwardRef } from '@wordpress/element';
|
|
9
9
|
import warn from '@wordpress/warning';
|
|
10
10
|
/**
|
|
11
11
|
* Internal dependencies
|
|
@@ -18,30 +18,36 @@ import { getStyledClassNameFromKey } from './get-styled-class-name-from-key';
|
|
|
18
18
|
* Forwards ref (React.ForwardRef) and "Connects" (or registers) a component
|
|
19
19
|
* within the Context system under a specified namespace.
|
|
20
20
|
*
|
|
21
|
-
* This is an (experimental) evolution of the initial connect() HOC.
|
|
22
|
-
* The hope is that we can improve render performance by removing functional
|
|
23
|
-
* component wrappers.
|
|
24
|
-
*
|
|
25
21
|
* @param Component The component to register into the Context system.
|
|
26
22
|
* @param namespace The namespace to register the component under.
|
|
27
|
-
* @param options
|
|
28
23
|
* @return The connected WordPressComponent
|
|
29
24
|
*/
|
|
30
25
|
export function contextConnect(Component, namespace) {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
26
|
+
return _contextConnect(Component, namespace, {
|
|
27
|
+
forwardsRef: true
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* "Connects" (or registers) a component within the Context system under a specified namespace.
|
|
32
|
+
* Does not forward a ref.
|
|
33
|
+
*
|
|
34
|
+
* @param Component The component to register into the Context system.
|
|
35
|
+
* @param namespace The namespace to register the component under.
|
|
36
|
+
* @return The connected WordPressComponent
|
|
37
|
+
*/
|
|
36
38
|
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
39
|
+
export function contextConnectWithoutRef(Component, namespace) {
|
|
40
|
+
return _contextConnect(Component, namespace);
|
|
41
|
+
} // This is an (experimental) evolution of the initial connect() HOC.
|
|
42
|
+
// The hope is that we can improve render performance by removing functional
|
|
43
|
+
// component wrappers.
|
|
44
|
+
|
|
45
|
+
function _contextConnect(Component, namespace, options) {
|
|
46
|
+
const WrappedComponent = options !== null && options !== void 0 && options.forwardsRef ? forwardRef(Component) : Component;
|
|
41
47
|
|
|
42
48
|
if (typeof namespace === 'undefined') {
|
|
43
49
|
typeof process !== "undefined" && process.env && process.env.NODE_ENV !== "production" ? warn('contextConnect: Please provide a namespace') : void 0;
|
|
44
|
-
} // @ts-
|
|
50
|
+
} // @ts-expect-error internal property
|
|
45
51
|
|
|
46
52
|
|
|
47
53
|
let mergedNamespace = WrappedComponent[CONNECT_STATIC_NAMESPACE] || [namespace];
|
|
@@ -55,15 +61,15 @@ export function contextConnect(Component, namespace) {
|
|
|
55
61
|
|
|
56
62
|
if (typeof namespace === 'string') {
|
|
57
63
|
mergedNamespace = [...mergedNamespace, namespace];
|
|
58
|
-
}
|
|
64
|
+
} // @ts-expect-error We can't rely on inferred types here because of the
|
|
65
|
+
// `as` prop polymorphism we're handling in https://github.com/WordPress/gutenberg/blob/9620bae6fef4fde7cc2b7833f416e240207cda29/packages/components/src/ui/context/wordpress-component.ts#L32-L33
|
|
59
66
|
|
|
60
|
-
WrappedComponent.displayName = namespace; // @ts-ignore internal property
|
|
61
67
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
68
|
+
return Object.assign(WrappedComponent, {
|
|
69
|
+
[CONNECT_STATIC_NAMESPACE]: [...new Set(mergedNamespace)],
|
|
70
|
+
displayName: namespace,
|
|
71
|
+
selector: `.${getStyledClassNameFromKey(namespace)}`
|
|
72
|
+
});
|
|
67
73
|
}
|
|
68
74
|
/**
|
|
69
75
|
* Attempts to retrieve the connected namespace from a component.
|
|
@@ -72,6 +78,7 @@ export function contextConnect(Component, namespace) {
|
|
|
72
78
|
* @return The connected namespaces.
|
|
73
79
|
*/
|
|
74
80
|
|
|
81
|
+
|
|
75
82
|
export function getConnectNamespace(Component) {
|
|
76
83
|
if (!Component) return [];
|
|
77
84
|
let namespaces = []; // @ts-ignore internal property
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/ui/context/context-connect.ts"],"names":["forwardRef","
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/ui/context/context-connect.ts"],"names":["forwardRef","warn","CONNECT_STATIC_NAMESPACE","getStyledClassNameFromKey","contextConnect","Component","namespace","_contextConnect","forwardsRef","contextConnectWithoutRef","options","WrappedComponent","mergedNamespace","Array","isArray","Object","assign","Set","displayName","selector","getConnectNamespace","namespaces","type","hasConnectNamespace","match","includes","some","result"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef, ReactChild, ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport warn from '@wordpress/warning';\n\n/**\n * Internal dependencies\n */\nimport { CONNECT_STATIC_NAMESPACE } from './constants';\nimport { getStyledClassNameFromKey } from './get-styled-class-name-from-key';\nimport type { WordPressComponentFromProps } from '.';\n\ntype AcceptsTwoArgs<\n\tF extends ( ...args: any ) => any,\n\tErrorMessage = never\n> = Parameters< F >[ 'length' ] extends 2 ? {} : ErrorMessage;\n\ntype ContextConnectOptions = {\n\tforwardsRef?: boolean;\n};\n\n/**\n * Forwards ref (React.ForwardRef) and \"Connects\" (or registers) a component\n * within the Context system under a specified namespace.\n *\n * @param Component The component to register into the Context system.\n * @param namespace The namespace to register the component under.\n * @return The connected WordPressComponent\n */\nexport function contextConnect<\n\tC extends ( props: any, ref: ForwardedRef< any > ) => JSX.Element | null\n>(\n\tComponent: C &\n\t\tAcceptsTwoArgs<\n\t\t\tC,\n\t\t\t'Warning: Your component function does not take a ref as the second argument. Did you mean to use `contextConnectWithoutRef`?'\n\t\t>,\n\tnamespace: string\n) {\n\treturn _contextConnect( Component, namespace, { forwardsRef: true } );\n}\n\n/**\n * \"Connects\" (or registers) a component within the Context system under a specified namespace.\n * Does not forward a ref.\n *\n * @param Component The component to register into the Context system.\n * @param namespace The namespace to register the component under.\n * @return The connected WordPressComponent\n */\nexport function contextConnectWithoutRef< P >(\n\tComponent: ( props: P ) => JSX.Element | null,\n\tnamespace: string\n) {\n\treturn _contextConnect( Component, namespace );\n}\n\n// This is an (experimental) evolution of the initial connect() HOC.\n// The hope is that we can improve render performance by removing functional\n// component wrappers.\nfunction _contextConnect<\n\tC extends ( props: any, ref: ForwardedRef< any > ) => JSX.Element | null,\n\tO extends ContextConnectOptions\n>(\n\tComponent: C,\n\tnamespace: string,\n\toptions?: O\n): WordPressComponentFromProps<\n\tParameters< C >[ 0 ],\n\tO[ 'forwardsRef' ] extends true ? true : false\n> {\n\tconst WrappedComponent = options?.forwardsRef\n\t\t? forwardRef< any, Parameters< C >[ 0 ] >( Component )\n\t\t: Component;\n\n\tif ( typeof namespace === 'undefined' ) {\n\t\twarn( 'contextConnect: Please provide a namespace' );\n\t}\n\n\t// @ts-expect-error internal property\n\tlet mergedNamespace = WrappedComponent[ CONNECT_STATIC_NAMESPACE ] || [\n\t\tnamespace,\n\t];\n\n\t/**\n\t * Consolidate (merge) namespaces before attaching it to the WrappedComponent.\n\t */\n\tif ( Array.isArray( namespace ) ) {\n\t\tmergedNamespace = [ ...mergedNamespace, ...namespace ];\n\t}\n\tif ( typeof namespace === 'string' ) {\n\t\tmergedNamespace = [ ...mergedNamespace, namespace ];\n\t}\n\n\t// @ts-expect-error We can't rely on inferred types here because of the\n\t// `as` prop polymorphism we're handling in https://github.com/WordPress/gutenberg/blob/9620bae6fef4fde7cc2b7833f416e240207cda29/packages/components/src/ui/context/wordpress-component.ts#L32-L33\n\treturn Object.assign( WrappedComponent, {\n\t\t[ CONNECT_STATIC_NAMESPACE ]: [ ...new Set( mergedNamespace ) ],\n\t\tdisplayName: namespace,\n\t\tselector: `.${ getStyledClassNameFromKey( namespace ) }`,\n\t} );\n}\n\n/**\n * Attempts to retrieve the connected namespace from a component.\n *\n * @param Component The component to retrieve a namespace from.\n * @return The connected namespaces.\n */\nexport function getConnectNamespace(\n\tComponent: ReactChild | undefined | {}\n): string[] {\n\tif ( ! Component ) return [];\n\n\tlet namespaces = [];\n\n\t// @ts-ignore internal property\n\tif ( Component[ CONNECT_STATIC_NAMESPACE ] ) {\n\t\t// @ts-ignore internal property\n\t\tnamespaces = Component[ CONNECT_STATIC_NAMESPACE ];\n\t}\n\n\t// @ts-ignore\n\tif ( Component.type && Component.type[ CONNECT_STATIC_NAMESPACE ] ) {\n\t\t// @ts-ignore\n\t\tnamespaces = Component.type[ CONNECT_STATIC_NAMESPACE ];\n\t}\n\n\treturn namespaces;\n}\n\n/**\n * Checks to see if a component is connected within the Context system.\n *\n * @param Component The component to retrieve a namespace from.\n * @param match The namespace to check.\n */\nexport function hasConnectNamespace(\n\tComponent: ReactNode,\n\tmatch: string[] | string\n): boolean {\n\tif ( ! Component ) return false;\n\n\tif ( typeof match === 'string' ) {\n\t\treturn getConnectNamespace( Component ).includes( match );\n\t}\n\tif ( Array.isArray( match ) ) {\n\t\treturn match.some( ( result ) =>\n\t\t\tgetConnectNamespace( Component ).includes( result )\n\t\t);\n\t}\n\n\treturn false;\n}\n"]}
|
|
@@ -3,7 +3,7 @@ import { createElement } from "@wordpress/element";
|
|
|
3
3
|
/**
|
|
4
4
|
* External dependencies
|
|
5
5
|
*/
|
|
6
|
-
import { isEqual, merge
|
|
6
|
+
import { isEqual, merge } from 'lodash';
|
|
7
7
|
/**
|
|
8
8
|
* WordPress dependencies
|
|
9
9
|
*/
|
|
@@ -58,7 +58,7 @@ function useContextSystemBridge(_ref) {
|
|
|
58
58
|
}, [value]); // `parentContext` will always be memoized (i.e., the result of this hook itself)
|
|
59
59
|
// or the default value from when the `ComponentsContext` was originally
|
|
60
60
|
// initialized (which will never change, it's a static variable)
|
|
61
|
-
// so this memoization will prevent `merge` and `
|
|
61
|
+
// so this memoization will prevent `merge` and `JSON.parse/stringify` from rerunning unless
|
|
62
62
|
// the references to `value` change OR the `parentContext` has an actual material change
|
|
63
63
|
// (because again, it's guaranteed to be memoized or a static reference to the empty object
|
|
64
64
|
// so we know that the only changes for `parentContext` are material ones... i.e., why we
|
|
@@ -66,10 +66,11 @@ function useContextSystemBridge(_ref) {
|
|
|
66
66
|
// need to bother with the `value`). The `useUpdateEffect` above will ensure that we are
|
|
67
67
|
// correctly warning when the `value` isn't being properly memoized. All of that to say
|
|
68
68
|
// that this should be super safe to assume that `useMemo` will only run on actual
|
|
69
|
-
// changes to the two dependencies, therefore saving us calls to `merge` and `
|
|
69
|
+
// changes to the two dependencies, therefore saving us calls to `merge` and `JSON.parse/stringify`!
|
|
70
70
|
|
|
71
71
|
const config = useMemo(() => {
|
|
72
|
-
|
|
72
|
+
// Deep clone `parentContext` to avoid mutating it later.
|
|
73
|
+
return merge(JSON.parse(JSON.stringify(parentContext)), value);
|
|
73
74
|
}, [parentContext, value]);
|
|
74
75
|
return config;
|
|
75
76
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/ui/context/context-system-provider.js"],"names":["isEqual","merge","
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/ui/context/context-system-provider.js"],"names":["isEqual","merge","createContext","useContext","useRef","useEffect","useMemo","memo","warn","ComponentsContext","useComponentsContext","useUpdateEffect","effect","deps","mounted","current","undefined","useContextSystemBridge","value","parentContext","valueRef","JSON","stringify","config","parse","BaseContextSystemProvider","children","contextValue","ContextSystemProvider"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,OAAT,EAAkBC,KAAlB,QAA+B,QAA/B;AAEA;AACA;AACA;;AACA,SACCC,aADD,EAECC,UAFD,EAGCC,MAHD,EAICC,SAJD,EAKCC,OALD,EAMCC,IAND,QAOO,oBAPP;AAQA,OAAOC,IAAP,MAAiB,oBAAjB;AAEA,OAAO,MAAMC,iBAAiB,GAAGP,aAAa;AAC7C;AAAqC,EADQ,CAAvC;AAGP,OAAO,MAAMQ,oBAAoB,GAAG,MAAMP,UAAU,CAAEM,iBAAF,CAA7C;AAEP;AACA;AACA;AACA;AACA;AACA;;AACA,SAASE,eAAT,CAA0BC,MAA1B,EAAkCC,IAAlC,EAAyC;AACxC,QAAMC,OAAO,GAAGV,MAAM,CAAE,KAAF,CAAtB;AACAC,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKS,OAAO,CAACC,OAAb,EAAuB;AACtB,aAAOH,MAAM,EAAb;AACA;;AACDE,IAAAA,OAAO,CAACC,OAAR,GAAkB,IAAlB;AACA,WAAOC,SAAP;AACA,GANQ,EAMNH,IANM,CAAT;AAOA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,SAASI,sBAAT,OAA6C;AAAA,MAAZ;AAAEC,IAAAA;AAAF,GAAY;AAC5C,QAAMC,aAAa,GAAGT,oBAAoB,EAA1C;AAEA,QAAMU,QAAQ,GAAGhB,MAAM,CAAEc,KAAF,CAAvB;AAEAP,EAAAA,eAAe,CAAE,MAAM;AACtB,SACC;AACAX,IAAAA,OAAO,CAAEoB,QAAQ,CAACL,OAAX,EAAoBG,KAApB,CAAP,IACA;AACAE,IAAAA,QAAQ,CAACL,OAAT,KAAqBG,KAJtB,EAKE;AACD,+FAAAV,IAAI,CAAG,gCAAgCa,IAAI,CAACC,SAAL,CAAgBJ,KAAhB,CAAyB,EAA5D,CAAJ;AACA;AACD,GATc,EASZ,CAAEA,KAAF,CATY,CAAf,CAL4C,CAgB5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,QAAMK,MAAM,GAAGjB,OAAO,CAAE,MAAM;AAC7B;AACA,WAAOL,KAAK,CAAEoB,IAAI,CAACG,KAAL,CAAYH,IAAI,CAACC,SAAL,CAAgBH,aAAhB,CAAZ,CAAF,EAAiDD,KAAjD,CAAZ;AACA,GAHqB,EAGnB,CAAEC,aAAF,EAAiBD,KAAjB,CAHmB,CAAtB;AAKA,SAAOK,MAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,yBAAyB,GAAG,SAA2B;AAAA,MAAzB;AAAEC,IAAAA,QAAF;AAAYR,IAAAA;AAAZ,GAAyB;AAC5D,QAAMS,YAAY,GAAGV,sBAAsB,CAAE;AAAEC,IAAAA;AAAF,GAAF,CAA3C;AAEA,SACC,cAAC,iBAAD,CAAmB,QAAnB;AAA4B,IAAA,KAAK,EAAGS;AAApC,KACGD,QADH,CADD;AAKA,CARD;;AAUA,OAAO,MAAME,qBAAqB,GAAGrB,IAAI,CAAEkB,yBAAF,CAAlC","sourcesContent":["/**\n * External dependencies\n */\nimport { isEqual, merge } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreateContext,\n\tuseContext,\n\tuseRef,\n\tuseEffect,\n\tuseMemo,\n\tmemo,\n} from '@wordpress/element';\nimport warn from '@wordpress/warning';\n\nexport const ComponentsContext = createContext(\n\t/** @type {Record<string, any>} */ ( {} )\n);\nexport const useComponentsContext = () => useContext( ComponentsContext );\n\n/**\n * Runs an effect only on update (i.e., ignores the first render)\n *\n * @param {import('react').EffectCallback} effect\n * @param {import('react').DependencyList} deps\n */\nfunction useUpdateEffect( effect, deps ) {\n\tconst mounted = useRef( false );\n\tuseEffect( () => {\n\t\tif ( mounted.current ) {\n\t\t\treturn effect();\n\t\t}\n\t\tmounted.current = true;\n\t\treturn undefined;\n\t}, deps );\n}\n\n/**\n * Consolidates incoming ContextSystem values with a (potential) parent ContextSystem value.\n *\n * Note: This function will warn if it detects an un-memoized `value`\n *\n * @param {Object} props\n * @param {Record<string, any>} props.value\n * @return {Record<string, any>} The consolidated value.\n */\nfunction useContextSystemBridge( { value } ) {\n\tconst parentContext = useComponentsContext();\n\n\tconst valueRef = useRef( value );\n\n\tuseUpdateEffect( () => {\n\t\tif (\n\t\t\t// Objects are equivalent.\n\t\t\tisEqual( valueRef.current, value ) &&\n\t\t\t// But not the same reference.\n\t\t\tvalueRef.current !== value\n\t\t) {\n\t\t\twarn( `Please memoize your context: ${ JSON.stringify( value ) }` );\n\t\t}\n\t}, [ value ] );\n\n\t// `parentContext` will always be memoized (i.e., the result of this hook itself)\n\t// or the default value from when the `ComponentsContext` was originally\n\t// initialized (which will never change, it's a static variable)\n\t// so this memoization will prevent `merge` and `JSON.parse/stringify` from rerunning unless\n\t// the references to `value` change OR the `parentContext` has an actual material change\n\t// (because again, it's guaranteed to be memoized or a static reference to the empty object\n\t// so we know that the only changes for `parentContext` are material ones... i.e., why we\n\t// don't have to warn in the `useUpdateEffect` hook above for `parentContext` and we only\n\t// need to bother with the `value`). The `useUpdateEffect` above will ensure that we are\n\t// correctly warning when the `value` isn't being properly memoized. All of that to say\n\t// that this should be super safe to assume that `useMemo` will only run on actual\n\t// changes to the two dependencies, therefore saving us calls to `merge` and `JSON.parse/stringify`!\n\tconst config = useMemo( () => {\n\t\t// Deep clone `parentContext` to avoid mutating it later.\n\t\treturn merge( JSON.parse( JSON.stringify( parentContext ) ), value );\n\t}, [ parentContext, value ] );\n\n\treturn config;\n}\n\n/**\n * A Provider component that can modify props for connected components within\n * the Context system.\n *\n * @example\n * ```jsx\n * <ContextSystemProvider value={{ Button: { size: 'small' }}}>\n * <Button>...</Button>\n * </ContextSystemProvider>\n * ```\n *\n * @template {Record<string, any>} T\n * @param {Object} options\n * @param {import('react').ReactNode} options.children Children to render.\n * @param {T} options.value Props to render into connected components.\n * @return {JSX.Element} A Provider wrapped component.\n */\nconst BaseContextSystemProvider = ( { children, value } ) => {\n\tconst contextValue = useContextSystemBridge( { value } );\n\n\treturn (\n\t\t<ComponentsContext.Provider value={ contextValue }>\n\t\t\t{ children }\n\t\t</ComponentsContext.Provider>\n\t);\n};\n\nexport const ContextSystemProvider = memo( BaseContextSystemProvider );\n"]}
|
|
@@ -26,6 +26,7 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
|
|
|
26
26
|
const {
|
|
27
27
|
__unstableStateReducer: stateReducerProp,
|
|
28
28
|
autoComplete = 'off',
|
|
29
|
+
// @ts-expect-error Ensure that children is omitted from restProps
|
|
29
30
|
children,
|
|
30
31
|
className,
|
|
31
32
|
disabled = false,
|
|
@@ -205,7 +206,6 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
|
|
|
205
206
|
className: "components-unit-control-wrapper",
|
|
206
207
|
style: style
|
|
207
208
|
}, createElement(ValueInput, _extends({
|
|
208
|
-
"aria-label": label,
|
|
209
209
|
type: isPressEnterToChange ? 'text' : 'number'
|
|
210
210
|
}, props, {
|
|
211
211
|
autoComplete: autoComplete,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/unit-control/index.tsx"],"names":["classnames","deprecated","forwardRef","useMemo","useRef","useEffect","__","inputControlActionTypes","Root","ValueInput","UnitSelectControl","CSS_UNITS","getParsedQuantityAndUnit","getUnitsWithCurrentUnit","getValidParsedQuantityAndUnit","useControlledState","UnforwardedUnitControl","unitControlProps","forwardedRef","__unstableStateReducer","stateReducerProp","autoComplete","children","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","length","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 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\tchildren,\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\tunits.length === 1 ? units[ 0 ].value : unitProp,\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 [ validParsedQuantity, validParsedUnit ] =\n\t\t\tgetValidParsedQuantityAndUnit(\n\t\t\t\tevent.currentTarget.value,\n\t\t\t\tunits,\n\t\t\t\tparsedQuantity,\n\t\t\t\tunit\n\t\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\t// The `onChange` callback already gets called, no need to call it explicitely.\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{ ...props }\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"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/unit-control/index.tsx"],"names":["classnames","deprecated","forwardRef","useMemo","useRef","useEffect","__","inputControlActionTypes","Root","ValueInput","UnitSelectControl","CSS_UNITS","getParsedQuantityAndUnit","getUnitsWithCurrentUnit","getValidParsedQuantityAndUnit","useControlledState","UnforwardedUnitControl","unitControlProps","forwardedRef","__unstableStateReducer","stateReducerProp","autoComplete","children","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","length","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 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\t// @ts-expect-error Ensure that children is omitted from restProps\n\t\tchildren,\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\tunits.length === 1 ? units[ 0 ].value : unitProp,\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 [ validParsedQuantity, validParsedUnit ] =\n\t\t\tgetValidParsedQuantityAndUnit(\n\t\t\t\tevent.currentTarget.value,\n\t\t\t\tunits,\n\t\t\t\tparsedQuantity,\n\t\t\t\tunit\n\t\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\t// The `onChange` callback already gets called, no need to call it explicitely.\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\ttype={ isPressEnterToChange ? 'text' : 'number' }\n\t\t\t\t{ ...props }\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"]}
|