@wordpress/components 23.6.0 → 23.8.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 +43 -4
- package/build/angle-picker-control/angle-circle.js +1 -4
- package/build/angle-picker-control/angle-circle.js.map +1 -1
- package/build/angle-picker-control/index.js +10 -22
- package/build/angle-picker-control/index.js.map +1 -1
- package/build/angle-picker-control/styles/angle-picker-control-styles.js +24 -15
- package/build/angle-picker-control/styles/angle-picker-control-styles.js.map +1 -1
- package/build/animate/index.js +27 -19
- package/build/animate/index.js.map +1 -1
- package/build/animate/types.js.map +1 -0
- package/build/box-control/axial-input-controls.js.map +1 -1
- package/build/color-picker/color-input.js +0 -4
- package/build/color-picker/color-input.js.map +1 -1
- package/build/color-picker/component.js +5 -4
- package/build/color-picker/component.js.map +1 -1
- package/build/color-picker/hex-input.js.map +1 -1
- package/build/color-picker/hsl-input.js.map +1 -1
- package/build/color-picker/input-with-slider.js.map +1 -1
- package/build/color-picker/legacy-adapter.js.map +1 -1
- package/build/color-picker/picker.js.map +1 -1
- package/build/color-picker/rgb-input.js.map +1 -1
- package/build/color-picker/use-deprecated-props.js.map +1 -1
- package/build/custom-gradient-picker/constants.js +1 -1
- package/build/custom-gradient-picker/constants.js.map +1 -1
- package/build/custom-gradient-picker/gradient-bar/constants.js.map +1 -1
- package/build/custom-gradient-picker/gradient-bar/control-points.js +9 -5
- package/build/custom-gradient-picker/gradient-bar/control-points.js.map +1 -1
- package/build/custom-gradient-picker/gradient-bar/index.js +14 -9
- package/build/custom-gradient-picker/gradient-bar/index.js.map +1 -1
- package/build/custom-gradient-picker/gradient-bar/utils.js +34 -54
- package/build/custom-gradient-picker/gradient-bar/utils.js.map +1 -1
- package/build/custom-gradient-picker/index.js +45 -16
- package/build/custom-gradient-picker/index.js.map +1 -1
- package/build/custom-gradient-picker/serializer.js +10 -4
- package/build/custom-gradient-picker/serializer.js.map +1 -1
- package/build/custom-gradient-picker/styles/custom-gradient-picker-styles.js +6 -6
- package/build/custom-gradient-picker/styles/custom-gradient-picker-styles.js.map +1 -1
- package/build/custom-gradient-picker/types.js +6 -0
- package/build/custom-gradient-picker/types.js.map +1 -0
- package/build/custom-gradient-picker/utils.js +17 -12
- package/build/custom-gradient-picker/utils.js.map +1 -1
- package/build/drop-zone/index.js +8 -8
- package/build/drop-zone/index.js.map +1 -1
- package/build/{color-list-picker → duotone-picker/color-list-picker}/index.js +5 -5
- package/build/duotone-picker/color-list-picker/index.js.map +1 -0
- package/build/duotone-picker/color-list-picker/types.js +6 -0
- package/build/duotone-picker/color-list-picker/types.js.map +1 -0
- package/build/duotone-picker/custom-duotone-bar.js.map +1 -1
- package/build/duotone-picker/duotone-picker.js +39 -2
- package/build/duotone-picker/duotone-picker.js.map +1 -1
- package/build/duotone-picker/duotone-swatch.js.map +1 -1
- package/build/duotone-picker/index.js.map +1 -1
- package/build/duotone-picker/types.js +6 -0
- package/build/duotone-picker/types.js.map +1 -0
- package/build/duotone-picker/utils.js +13 -11
- package/build/duotone-picker/utils.js.map +1 -1
- package/build/form-token-field/index.js +9 -3
- package/build/form-token-field/index.js.map +1 -1
- package/build/gradient-picker/index.js +61 -9
- package/build/gradient-picker/index.js.map +1 -1
- package/build/gradient-picker/types.js +6 -0
- package/build/gradient-picker/types.js.map +1 -0
- package/build/index.js.map +1 -1
- package/build/mobile/keyboard-aware-flat-list/index.android.js +0 -4
- package/build/mobile/keyboard-aware-flat-list/index.android.js.map +1 -1
- package/build/mobile/keyboard-aware-flat-list/index.ios.js +100 -55
- package/build/mobile/keyboard-aware-flat-list/index.ios.js.map +1 -1
- package/build/mobile/keyboard-aware-flat-list/use-keyboard-offset.native.js +82 -0
- package/build/mobile/keyboard-aware-flat-list/use-keyboard-offset.native.js.map +1 -0
- package/build/mobile/keyboard-aware-flat-list/use-scroll-to-text-input.native.js +85 -0
- package/build/mobile/keyboard-aware-flat-list/use-scroll-to-text-input.native.js.map +1 -0
- package/build/mobile/keyboard-aware-flat-list/use-text-input-caret-position.native.js +44 -0
- package/build/mobile/keyboard-aware-flat-list/use-text-input-caret-position.native.js.map +1 -0
- package/build/mobile/keyboard-aware-flat-list/use-text-input-offset.native.js +53 -0
- package/build/mobile/keyboard-aware-flat-list/use-text-input-offset.native.js.map +1 -0
- package/build/navigator/navigator-provider/component.js +4 -2
- package/build/navigator/navigator-provider/component.js.map +1 -1
- package/build/navigator/navigator-screen/component.js +4 -3
- package/build/navigator/navigator-screen/component.js.map +1 -1
- package/build/palette-edit/index.js +1 -2
- package/build/palette-edit/index.js.map +1 -1
- package/build/private-apis.js.map +1 -1
- package/build/query-controls/author-select.js +2 -1
- package/build/query-controls/author-select.js.map +1 -1
- package/build/query-controls/category-select.js +3 -1
- package/build/query-controls/category-select.js.map +1 -1
- package/build/query-controls/index.js +7 -1
- package/build/query-controls/index.js.map +1 -1
- package/build/resizable-box/resize-tooltip/utils.js.map +1 -1
- package/build/sandbox/index.native.js +129 -93
- package/build/sandbox/index.native.js.map +1 -1
- package/build/tab-panel/index.js +1 -1
- package/build/tab-panel/index.js.map +1 -1
- package/build/tools-panel/tools-panel/hook.js +45 -6
- package/build/tools-panel/tools-panel/hook.js.map +1 -1
- package/build/utils/input/input-control.js +1 -1
- package/build/utils/input/input-control.js.map +1 -1
- package/build-module/angle-picker-control/angle-circle.js +1 -4
- package/build-module/angle-picker-control/angle-circle.js.map +1 -1
- package/build-module/angle-picker-control/index.js +12 -21
- package/build-module/angle-picker-control/index.js.map +1 -1
- package/build-module/angle-picker-control/styles/angle-picker-control-styles.js +20 -13
- package/build-module/angle-picker-control/styles/angle-picker-control-styles.js.map +1 -1
- package/build-module/animate/index.js +25 -17
- package/build-module/animate/index.js.map +1 -1
- package/build-module/box-control/axial-input-controls.js.map +1 -1
- package/build-module/color-picker/color-input.js +0 -4
- package/build-module/color-picker/color-input.js.map +1 -1
- package/build-module/color-picker/component.js +3 -3
- package/build-module/color-picker/component.js.map +1 -1
- package/build-module/color-picker/hex-input.js.map +1 -1
- package/build-module/color-picker/hsl-input.js.map +1 -1
- package/build-module/color-picker/input-with-slider.js.map +1 -1
- package/build-module/color-picker/legacy-adapter.js.map +1 -1
- package/build-module/color-picker/picker.js +4 -0
- package/build-module/color-picker/picker.js.map +1 -1
- package/build-module/color-picker/rgb-input.js.map +1 -1
- package/build-module/color-picker/use-deprecated-props.js.map +1 -1
- package/build-module/custom-gradient-picker/constants.js +1 -1
- package/build-module/custom-gradient-picker/constants.js.map +1 -1
- package/build-module/custom-gradient-picker/gradient-bar/constants.js.map +1 -1
- package/build-module/custom-gradient-picker/gradient-bar/control-points.js +9 -4
- package/build-module/custom-gradient-picker/gradient-bar/control-points.js.map +1 -1
- package/build-module/custom-gradient-picker/gradient-bar/index.js +14 -8
- package/build-module/custom-gradient-picker/gradient-bar/index.js.map +1 -1
- package/build-module/custom-gradient-picker/gradient-bar/utils.js +34 -54
- package/build-module/custom-gradient-picker/gradient-bar/utils.js.map +1 -1
- package/build-module/custom-gradient-picker/index.js +44 -17
- package/build-module/custom-gradient-picker/index.js.map +1 -1
- package/build-module/custom-gradient-picker/serializer.js +10 -4
- package/build-module/custom-gradient-picker/serializer.js.map +1 -1
- package/build-module/custom-gradient-picker/styles/custom-gradient-picker-styles.js +6 -6
- package/build-module/custom-gradient-picker/styles/custom-gradient-picker-styles.js.map +1 -1
- package/build-module/custom-gradient-picker/types.js +2 -0
- package/build-module/custom-gradient-picker/utils.js +17 -12
- package/build-module/custom-gradient-picker/utils.js.map +1 -1
- package/build-module/drop-zone/index.js +8 -8
- package/build-module/drop-zone/index.js.map +1 -1
- package/build-module/{color-list-picker → duotone-picker/color-list-picker}/index.js +5 -5
- package/build-module/duotone-picker/color-list-picker/index.js.map +1 -0
- package/build-module/duotone-picker/color-list-picker/types.js +2 -0
- package/build-module/duotone-picker/color-list-picker/types.js.map +1 -0
- package/build-module/duotone-picker/custom-duotone-bar.js.map +1 -1
- package/build-module/duotone-picker/duotone-picker.js +38 -2
- package/build-module/duotone-picker/duotone-picker.js.map +1 -1
- package/build-module/duotone-picker/duotone-swatch.js.map +1 -1
- package/build-module/duotone-picker/index.js.map +1 -1
- package/build-module/duotone-picker/types.js +2 -0
- package/build-module/duotone-picker/types.js.map +1 -0
- package/build-module/duotone-picker/utils.js +17 -11
- package/build-module/duotone-picker/utils.js.map +1 -1
- package/build-module/form-token-field/index.js +9 -4
- package/build-module/form-token-field/index.js.map +1 -1
- package/build-module/gradient-picker/index.js +61 -10
- package/build-module/gradient-picker/index.js.map +1 -1
- package/build-module/gradient-picker/types.js +2 -0
- package/build-module/gradient-picker/types.js.map +1 -0
- package/build-module/index.js.map +1 -1
- package/build-module/mobile/keyboard-aware-flat-list/index.android.js +0 -4
- package/build-module/mobile/keyboard-aware-flat-list/index.android.js.map +1 -1
- package/build-module/mobile/keyboard-aware-flat-list/index.ios.js +97 -54
- package/build-module/mobile/keyboard-aware-flat-list/index.ios.js.map +1 -1
- package/build-module/mobile/keyboard-aware-flat-list/use-keyboard-offset.native.js +73 -0
- package/build-module/mobile/keyboard-aware-flat-list/use-keyboard-offset.native.js.map +1 -0
- package/build-module/mobile/keyboard-aware-flat-list/use-scroll-to-text-input.native.js +76 -0
- package/build-module/mobile/keyboard-aware-flat-list/use-scroll-to-text-input.native.js.map +1 -0
- package/build-module/mobile/keyboard-aware-flat-list/use-text-input-caret-position.native.js +33 -0
- package/build-module/mobile/keyboard-aware-flat-list/use-text-input-caret-position.native.js.map +1 -0
- package/build-module/mobile/keyboard-aware-flat-list/use-text-input-offset.native.js +40 -0
- package/build-module/mobile/keyboard-aware-flat-list/use-text-input-offset.native.js.map +1 -0
- package/build-module/navigator/navigator-provider/component.js +4 -2
- package/build-module/navigator/navigator-provider/component.js.map +1 -1
- package/build-module/navigator/navigator-screen/component.js +4 -3
- package/build-module/navigator/navigator-screen/component.js.map +1 -1
- package/build-module/palette-edit/index.js +1 -2
- package/build-module/palette-edit/index.js.map +1 -1
- package/build-module/private-apis.js.map +1 -1
- package/build-module/query-controls/author-select.js +2 -1
- package/build-module/query-controls/author-select.js.map +1 -1
- package/build-module/query-controls/category-select.js +3 -1
- package/build-module/query-controls/category-select.js.map +1 -1
- package/build-module/query-controls/index.js +7 -2
- package/build-module/query-controls/index.js.map +1 -1
- package/build-module/resizable-box/resize-tooltip/utils.js.map +1 -1
- package/build-module/sandbox/index.native.js +121 -87
- package/build-module/sandbox/index.native.js.map +1 -1
- package/build-module/tab-panel/index.js +2 -2
- package/build-module/tab-panel/index.js.map +1 -1
- package/build-module/tools-panel/tools-panel/hook.js +45 -6
- package/build-module/tools-panel/tools-panel/hook.js.map +1 -1
- package/build-module/utils/input/input-control.js +1 -1
- package/build-module/utils/input/input-control.js.map +1 -1
- package/build-style/style-rtl.css +41 -29
- package/build-style/style.css +43 -29
- package/build-types/angle-picker-control/angle-circle.d.ts.map +1 -1
- package/build-types/angle-picker-control/index.d.ts.map +1 -1
- package/build-types/angle-picker-control/styles/angle-picker-control-styles.d.ts +6 -1
- package/build-types/angle-picker-control/styles/angle-picker-control-styles.d.ts.map +1 -1
- package/build-types/animate/index.d.ts +27 -22
- package/build-types/animate/index.d.ts.map +1 -1
- package/build-types/animate/stories/index.d.ts +18 -0
- package/build-types/animate/stories/index.d.ts.map +1 -0
- package/build-types/animate/types.d.ts +30 -0
- package/build-types/animate/types.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control/hook.d.ts +2 -2
- package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts +2 -2
- package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +2 -2
- package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts +2 -2
- package/build-types/border-control/border-control/hook.d.ts +2 -2
- package/build-types/border-control/border-control-dropdown/hook.d.ts +2 -2
- package/build-types/border-control/border-control-style-picker/hook.d.ts +2 -2
- package/build-types/box-control/styles/box-control-styles.d.ts +5 -5
- package/build-types/button/deprecated.d.ts +2 -2
- package/build-types/card/card/hook.d.ts +2 -2
- package/build-types/card/card-body/hook.d.ts +2 -2
- package/build-types/card/card-divider/hook.d.ts +2 -2
- package/build-types/card/card-footer/hook.d.ts +2 -2
- package/build-types/card/card-header/hook.d.ts +2 -2
- package/build-types/card/card-media/hook.d.ts +2 -2
- package/build-types/color-palette/styles.d.ts +1 -1
- package/build-types/color-picker/color-input.d.ts +1 -11
- package/build-types/color-picker/color-input.d.ts.map +1 -1
- package/build-types/color-picker/component.d.ts +8 -9
- package/build-types/color-picker/component.d.ts.map +1 -1
- package/build-types/color-picker/hex-input.d.ts +1 -10
- package/build-types/color-picker/hex-input.d.ts.map +1 -1
- package/build-types/color-picker/hsl-input.d.ts +1 -10
- package/build-types/color-picker/hsl-input.d.ts.map +1 -1
- package/build-types/color-picker/input-with-slider.d.ts +1 -9
- package/build-types/color-picker/input-with-slider.d.ts.map +1 -1
- package/build-types/color-picker/legacy-adapter.d.ts +1 -3
- package/build-types/color-picker/legacy-adapter.d.ts.map +1 -1
- package/build-types/color-picker/picker.d.ts +4 -7
- package/build-types/color-picker/picker.d.ts.map +1 -1
- package/build-types/color-picker/rgb-input.d.ts +1 -10
- package/build-types/color-picker/rgb-input.d.ts.map +1 -1
- package/build-types/color-picker/stories/index.d.ts +19 -0
- package/build-types/color-picker/stories/index.d.ts.map +1 -0
- package/build-types/color-picker/styles.d.ts +5 -5
- package/build-types/color-picker/test/index.d.ts +2 -0
- package/build-types/color-picker/test/index.d.ts.map +1 -0
- package/build-types/color-picker/types.d.ts +105 -1
- package/build-types/color-picker/types.d.ts.map +1 -1
- package/build-types/color-picker/use-deprecated-props.d.ts +1 -44
- package/build-types/color-picker/use-deprecated-props.d.ts.map +1 -1
- package/build-types/combobox-control/styles.d.ts +1 -1
- package/build-types/custom-gradient-picker/constants.d.ts +8 -8
- package/build-types/custom-gradient-picker/constants.d.ts.map +1 -1
- package/build-types/custom-gradient-picker/gradient-bar/constants.d.ts +7 -7
- package/build-types/custom-gradient-picker/gradient-bar/constants.d.ts.map +1 -1
- package/build-types/custom-gradient-picker/gradient-bar/control-points.d.ts +5 -22
- package/build-types/custom-gradient-picker/gradient-bar/control-points.d.ts.map +1 -1
- package/build-types/custom-gradient-picker/gradient-bar/index.d.ts +3 -9
- package/build-types/custom-gradient-picker/gradient-bar/index.d.ts.map +1 -1
- package/build-types/custom-gradient-picker/gradient-bar/test/utils.d.ts +2 -0
- package/build-types/custom-gradient-picker/gradient-bar/test/utils.d.ts.map +1 -0
- package/build-types/custom-gradient-picker/gradient-bar/utils.d.ts +44 -92
- package/build-types/custom-gradient-picker/gradient-bar/utils.d.ts.map +1 -1
- package/build-types/custom-gradient-picker/index.d.ts +27 -6
- package/build-types/custom-gradient-picker/index.d.ts.map +1 -1
- package/build-types/custom-gradient-picker/serializer.d.ts +9 -16
- package/build-types/custom-gradient-picker/serializer.d.ts.map +1 -1
- package/build-types/custom-gradient-picker/stories/index.d.ts +12 -0
- package/build-types/custom-gradient-picker/stories/index.d.ts.map +1 -0
- package/build-types/custom-gradient-picker/styles/custom-gradient-picker-styles.d.ts +3 -2
- package/build-types/custom-gradient-picker/styles/custom-gradient-picker-styles.d.ts.map +1 -1
- package/build-types/custom-gradient-picker/test/serializer.d.ts +2 -0
- package/build-types/custom-gradient-picker/test/serializer.d.ts.map +1 -0
- package/build-types/custom-gradient-picker/types.d.ts +118 -0
- package/build-types/custom-gradient-picker/types.d.ts.map +1 -0
- package/build-types/custom-gradient-picker/utils.d.ts +12 -4
- package/build-types/custom-gradient-picker/utils.d.ts.map +1 -1
- package/build-types/date-time/date/styles.d.ts +2 -2
- package/build-types/date-time/date-time/styles.d.ts +1 -1
- package/build-types/date-time/time/styles.d.ts +8 -8
- package/build-types/drop-zone/index.d.ts.map +1 -1
- package/build-types/duotone-picker/color-list-picker/index.d.ts.map +1 -0
- package/build-types/{color-list-picker → duotone-picker/color-list-picker}/types.d.ts +2 -2
- package/build-types/duotone-picker/color-list-picker/types.d.ts.map +1 -0
- package/build-types/duotone-picker/custom-duotone-bar.d.ts +6 -0
- package/build-types/duotone-picker/custom-duotone-bar.d.ts.map +1 -0
- package/build-types/duotone-picker/duotone-picker.d.ts +38 -0
- package/build-types/duotone-picker/duotone-picker.d.ts.map +1 -0
- package/build-types/duotone-picker/duotone-swatch.d.ts +5 -0
- package/build-types/duotone-picker/duotone-swatch.d.ts.map +1 -0
- package/build-types/duotone-picker/index.d.ts +3 -0
- package/build-types/duotone-picker/index.d.ts.map +1 -0
- package/build-types/duotone-picker/stories/duotone-picker.d.ts +12 -0
- package/build-types/duotone-picker/stories/duotone-picker.d.ts.map +1 -0
- package/build-types/duotone-picker/stories/duotone-swatch.d.ts +14 -0
- package/build-types/duotone-picker/stories/duotone-swatch.d.ts.map +1 -0
- package/build-types/duotone-picker/types.d.ts +60 -0
- package/build-types/duotone-picker/types.d.ts.map +1 -0
- package/build-types/duotone-picker/utils.d.ts +52 -0
- package/build-types/duotone-picker/utils.d.ts.map +1 -0
- package/build-types/elevation/hook.d.ts +2 -2
- package/build-types/external-link/styles/external-link-styles.d.ts +1 -1
- package/build-types/flex/flex/hook.d.ts +2 -2
- package/build-types/flex/flex-block/hook.d.ts +2 -2
- package/build-types/flex/flex-item/hook.d.ts +2 -2
- package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts +2 -2
- package/build-types/form-token-field/index.d.ts.map +1 -1
- package/build-types/form-token-field/styles.d.ts +1 -1
- package/build-types/form-token-field/types.d.ts +6 -0
- package/build-types/form-token-field/types.d.ts.map +1 -1
- package/build-types/gradient-picker/index.d.ts +49 -11
- package/build-types/gradient-picker/index.d.ts.map +1 -1
- package/build-types/gradient-picker/stories/index.d.ts +14 -0
- package/build-types/gradient-picker/stories/index.d.ts.map +1 -0
- package/build-types/gradient-picker/types.d.ts +87 -0
- package/build-types/gradient-picker/types.d.ts.map +1 -0
- package/build-types/grid/hook.d.ts +2 -2
- package/build-types/h-stack/hook.d.ts +2 -2
- package/build-types/heading/hook.d.ts +2 -2
- package/build-types/index.d.ts +128 -0
- package/build-types/index.d.ts.map +1 -0
- package/build-types/input-control/styles/input-control-styles.d.ts +2 -2
- package/build-types/item-group/item/hook.d.ts +2 -2
- package/build-types/item-group/item-group/hook.d.ts +2 -2
- package/build-types/navigation/styles/navigation-styles.d.ts +2 -2
- package/build-types/navigator/navigator-back-button/hook.d.ts +2 -2
- package/build-types/navigator/navigator-button/hook.d.ts +2 -2
- 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/navigator/stories/index.d.ts +1 -0
- package/build-types/navigator/stories/index.d.ts.map +1 -1
- package/build-types/navigator/types.d.ts +2 -2
- package/build-types/navigator/types.d.ts.map +1 -1
- package/build-types/number-control/index.d.ts +2 -2
- package/build-types/number-control/stories/index.d.ts +2 -2
- package/build-types/palette-edit/index.d.ts.map +1 -1
- package/build-types/palette-edit/styles.d.ts +3 -3
- package/build-types/popover/index.d.ts +1 -1
- package/build-types/popover/stories/e2e/index.d.ts +1 -1
- package/build-types/private-apis.d.ts +2 -3
- package/build-types/private-apis.d.ts.map +1 -1
- package/build-types/query-controls/author-select.d.ts.map +1 -1
- package/build-types/query-controls/category-select.d.ts.map +1 -1
- package/build-types/query-controls/index.d.ts.map +1 -1
- package/build-types/range-control/index.d.ts +1 -1
- package/build-types/range-control/styles/range-control-styles.d.ts +2 -2
- 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/utils.d.ts +1 -1
- package/build-types/resizable-box/resize-tooltip/utils.d.ts.map +1 -1
- package/build-types/resizable-box/stories/index.d.ts +2 -2
- package/build-types/scrollable/hook.d.ts +2 -2
- package/build-types/search-control/index.d.ts +1 -1
- package/build-types/search-control/stories/index.d.ts +2 -2
- package/build-types/spacer/hook.d.ts +2 -2
- package/build-types/spinner/index.d.ts +1 -1
- package/build-types/surface/hook.d.ts +2 -2
- package/build-types/tab-panel/index.d.ts.map +1 -1
- package/build-types/text/hook.d.ts +2 -2
- package/build-types/text-control/index.d.ts +1 -1
- package/build-types/toolbar/toolbar-button/index.d.ts +2 -2
- package/build-types/tools-panel/tools-panel/hook.d.ts +2 -2
- package/build-types/tools-panel/tools-panel/hook.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel-header/hook.d.ts +2 -2
- package/build-types/tools-panel/tools-panel-item/hook.d.ts +2 -2
- package/build-types/tools-panel/types.d.ts +1 -0
- package/build-types/tools-panel/types.d.ts.map +1 -1
- package/build-types/truncate/hook.d.ts +2 -2
- package/build-types/ui/control-group/hook.d.ts +2 -2
- package/build-types/ui/control-label/hook.d.ts +2 -2
- package/build-types/ui/form-group/form-group.d.ts +2 -2
- package/build-types/ui/form-group/use-form-group.d.ts +2 -2
- package/build-types/unit-control/index.d.ts +1 -1
- package/build-types/unit-control/styles/unit-control-styles.d.ts +2 -2
- package/build-types/utils/input/input-control.d.ts.map +1 -1
- package/build-types/v-stack/hook.d.ts +2 -2
- package/package.json +20 -19
- package/src/angle-picker-control/angle-circle.tsx +0 -1
- package/src/angle-picker-control/index.tsx +14 -27
- package/src/angle-picker-control/styles/angle-picker-control-styles.tsx +16 -9
- package/src/animate/index.tsx +75 -0
- package/src/animate/stories/index.tsx +102 -0
- package/src/animate/types.ts +32 -0
- package/src/border-box-control/stories/index.tsx +1 -1
- package/src/box-control/axial-input-controls.tsx +1 -1
- package/src/circular-option-picker/style.scss +10 -0
- package/src/color-indicator/style.scss +1 -0
- package/src/color-picker/README.md +2 -2
- package/src/color-picker/color-input.tsx +1 -12
- package/src/color-picker/component.tsx +9 -18
- package/src/color-picker/hex-input.tsx +2 -7
- package/src/color-picker/hsl-input.tsx +2 -7
- package/src/color-picker/input-with-slider.tsx +1 -9
- package/src/color-picker/legacy-adapter.tsx +1 -2
- package/src/color-picker/picker.tsx +5 -6
- package/src/color-picker/rgb-input.tsx +2 -7
- package/src/color-picker/stories/index.tsx +51 -0
- package/src/color-picker/test/{index.js → index.tsx} +36 -18
- package/src/color-picker/types.ts +128 -1
- package/src/color-picker/use-deprecated-props.ts +2 -53
- package/src/combobox-control/stories/index.tsx +1 -1
- package/src/custom-gradient-picker/{constants.js → constants.ts} +2 -2
- package/src/custom-gradient-picker/gradient-bar/{control-points.js → control-points.tsx} +171 -134
- package/src/custom-gradient-picker/gradient-bar/{index.js → index.tsx} +32 -10
- package/src/custom-gradient-picker/gradient-bar/test/{utils.js → utils.ts} +58 -31
- package/src/custom-gradient-picker/gradient-bar/utils.ts +193 -0
- package/src/custom-gradient-picker/{index.js → index.tsx} +63 -22
- package/src/custom-gradient-picker/serializer.ts +78 -0
- package/src/custom-gradient-picker/stories/index.tsx +45 -0
- package/src/custom-gradient-picker/style.scss +25 -4
- package/src/custom-gradient-picker/test/{serializer.js → serializer.ts} +39 -33
- package/src/custom-gradient-picker/types.ts +119 -0
- package/src/custom-gradient-picker/{utils.js → utils.ts} +37 -22
- package/src/custom-select-control/test/index.js +6 -4
- package/src/drop-zone/index.tsx +12 -8
- package/src/drop-zone/style.scss +1 -1
- package/src/{color-list-picker → duotone-picker/color-list-picker}/index.tsx +7 -6
- package/src/{color-list-picker → duotone-picker/color-list-picker}/types.ts +2 -2
- package/src/duotone-picker/{custom-duotone-bar.js → custom-duotone-bar.tsx} +7 -1
- package/src/duotone-picker/{duotone-picker.js → duotone-picker.tsx} +39 -2
- package/src/duotone-picker/{duotone-swatch.js → duotone-swatch.tsx} +2 -1
- package/src/duotone-picker/stories/{duotone-picker.js → duotone-picker.tsx} +15 -8
- package/src/duotone-picker/stories/{duotone-swatch.js → duotone-swatch.tsx} +9 -3
- package/src/duotone-picker/types.ts +61 -0
- package/src/duotone-picker/{utils.js → utils.ts} +29 -14
- package/src/flex/flex-item/README.md +1 -1
- package/src/form-token-field/README.md +1 -0
- package/src/form-token-field/index.tsx +10 -3
- package/src/form-token-field/style.scss +0 -7
- package/src/form-token-field/test/index.tsx +1 -0
- package/src/form-token-field/types.ts +6 -0
- package/src/gradient-picker/README.md +16 -23
- package/src/gradient-picker/{index.js → index.tsx} +70 -16
- package/src/gradient-picker/stories/{index.js → index.tsx} +19 -8
- package/src/gradient-picker/types.ts +89 -0
- package/src/item-group/test/index.js +5 -3
- package/src/mobile/keyboard-aware-flat-list/index.android.js +0 -4
- package/src/mobile/keyboard-aware-flat-list/index.ios.js +118 -67
- package/src/mobile/keyboard-aware-flat-list/test/use-keyboard-offset.native.js +203 -0
- package/src/mobile/keyboard-aware-flat-list/test/use-scroll-to-text-input.native.js +140 -0
- package/src/mobile/keyboard-aware-flat-list/test/use-text-input-caret-position.native.js +82 -0
- package/src/mobile/keyboard-aware-flat-list/test/use-text-input-offset.native.js +147 -0
- package/src/mobile/keyboard-aware-flat-list/use-keyboard-offset.native.js +87 -0
- package/src/mobile/keyboard-aware-flat-list/use-scroll-to-text-input.native.js +105 -0
- package/src/mobile/keyboard-aware-flat-list/use-text-input-caret-position.native.js +36 -0
- package/src/mobile/keyboard-aware-flat-list/use-text-input-offset.native.js +54 -0
- package/src/navigator/navigator-provider/component.tsx +2 -0
- package/src/navigator/navigator-screen/component.tsx +5 -2
- package/src/navigator/stories/index.tsx +68 -0
- package/src/navigator/test/index.tsx +52 -0
- package/src/navigator/types.ts +2 -1
- package/src/palette-edit/index.tsx +4 -5
- package/src/query-controls/author-select.tsx +1 -0
- package/src/query-controls/category-select.tsx +1 -0
- package/src/query-controls/index.tsx +4 -2
- package/src/resizable-box/resize-tooltip/utils.ts +1 -1
- package/src/sandbox/index.native.js +139 -112
- package/src/slot-fill/test/slot.js +8 -6
- package/src/style.scss +1 -1
- package/src/tab-panel/index.tsx +7 -2
- package/src/tools-panel/test/index.tsx +86 -0
- package/src/tools-panel/tools-panel/hook.ts +44 -4
- package/src/tools-panel/types.ts +1 -0
- package/src/tooltip/test/index.js +251 -301
- package/src/utils/input/input-control.js +1 -0
- package/tsconfig.json +1 -3
- package/tsconfig.tsbuildinfo +1 -1
- package/build/color-list-picker/index.js.map +0 -1
- package/build-module/color-list-picker/index.js.map +0 -1
- package/build-types/color-list-picker/index.d.ts.map +0 -1
- package/build-types/color-list-picker/types.d.ts.map +0 -1
- package/src/animate/index.js +0 -60
- package/src/animate/stories/index.js +0 -53
- package/src/color-picker/stories/index.js +0 -41
- package/src/custom-gradient-picker/gradient-bar/utils.js +0 -189
- package/src/custom-gradient-picker/serializer.js +0 -48
- package/src/custom-gradient-picker/stories/index.js +0 -33
- /package/build/{color-list-picker → animate}/types.js +0 -0
- /package/build-module/{color-list-picker → animate}/types.js +0 -0
- /package/build-module/{color-list-picker → animate}/types.js.map +0 -0
- /package/{build/color-list-picker → build-module/custom-gradient-picker}/types.js.map +0 -0
- /package/build-types/{color-list-picker → duotone-picker/color-list-picker}/index.d.ts +0 -0
- /package/src/custom-gradient-picker/gradient-bar/{constants.js → constants.ts} +0 -0
- /package/src/custom-gradient-picker/styles/{custom-gradient-picker-styles.js → custom-gradient-picker-styles.tsx} +0 -0
- /package/src/{color-list-picker → duotone-picker/color-list-picker}/style.scss +0 -0
- /package/src/duotone-picker/{index.js → index.ts} +0 -0
- /package/src/{index.js → index.ts} +0 -0
- /package/src/{private-apis.js → private-apis.ts} +0 -0
|
@@ -5,7 +5,8 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
-
exports.
|
|
8
|
+
exports.GradientPicker = GradientPicker;
|
|
9
|
+
exports.default = void 0;
|
|
9
10
|
|
|
10
11
|
var _element = require("@wordpress/element");
|
|
11
12
|
|
|
@@ -25,8 +26,6 @@ var _styles = require("../color-palette/styles");
|
|
|
25
26
|
|
|
26
27
|
var _spacer = require("../spacer");
|
|
27
28
|
|
|
28
|
-
// @ts-nocheck
|
|
29
|
-
|
|
30
29
|
/**
|
|
31
30
|
* WordPress dependencies
|
|
32
31
|
*/
|
|
@@ -115,12 +114,64 @@ function MultipleOrigin(_ref3) {
|
|
|
115
114
|
}));
|
|
116
115
|
}
|
|
117
116
|
|
|
117
|
+
function Component(props) {
|
|
118
|
+
if (isMultipleOriginArray(props.gradients)) {
|
|
119
|
+
return (0, _element.createElement)(MultipleOrigin, props);
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
return (0, _element.createElement)(SingleOrigin, props);
|
|
123
|
+
}
|
|
124
|
+
/**
|
|
125
|
+
* GradientPicker is a React component that renders a color gradient picker to
|
|
126
|
+
* define a multi step gradient. There's either a _linear_ or a _radial_ type
|
|
127
|
+
* available.
|
|
128
|
+
*
|
|
129
|
+
* ```jsx
|
|
130
|
+
*import { GradientPicker } from '@wordpress/components';
|
|
131
|
+
*import { useState } from '@wordpress/element';
|
|
132
|
+
*
|
|
133
|
+
*const myGradientPicker = () => {
|
|
134
|
+
* const [ gradient, setGradient ] = useState( null );
|
|
135
|
+
*
|
|
136
|
+
* return (
|
|
137
|
+
* <GradientPicker
|
|
138
|
+
* __nextHasNoMargin
|
|
139
|
+
* value={ gradient }
|
|
140
|
+
* onChange={ ( currentGradient ) => setGradient( currentGradient ) }
|
|
141
|
+
* gradients={ [
|
|
142
|
+
* {
|
|
143
|
+
* name: 'JShine',
|
|
144
|
+
* gradient:
|
|
145
|
+
* 'linear-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)',
|
|
146
|
+
* slug: 'jshine',
|
|
147
|
+
* },
|
|
148
|
+
* {
|
|
149
|
+
* name: 'Moonlit Asteroid',
|
|
150
|
+
* gradient:
|
|
151
|
+
* 'linear-gradient(135deg,#0F2027 0%, #203A43 0%, #2c5364 100%)',
|
|
152
|
+
* slug: 'moonlit-asteroid',
|
|
153
|
+
* },
|
|
154
|
+
* {
|
|
155
|
+
* name: 'Rastafarie',
|
|
156
|
+
* gradient:
|
|
157
|
+
* 'linear-gradient(135deg,#1E9600 0%, #FFF200 0%, #FF0000 100%)',
|
|
158
|
+
* slug: 'rastafari',
|
|
159
|
+
* },
|
|
160
|
+
* ] }
|
|
161
|
+
* />
|
|
162
|
+
* );
|
|
163
|
+
*};
|
|
164
|
+
*```
|
|
165
|
+
*
|
|
166
|
+
*/
|
|
167
|
+
|
|
168
|
+
|
|
118
169
|
function GradientPicker(_ref5) {
|
|
119
170
|
let {
|
|
120
171
|
/** Start opting into the new margin-free styles that will become the default in a future version. */
|
|
121
172
|
__nextHasNoMargin = false,
|
|
122
173
|
className,
|
|
123
|
-
gradients,
|
|
174
|
+
gradients = [],
|
|
124
175
|
onChange,
|
|
125
176
|
value,
|
|
126
177
|
clearable = true,
|
|
@@ -129,7 +180,6 @@ function GradientPicker(_ref5) {
|
|
|
129
180
|
headingLevel = 2
|
|
130
181
|
} = _ref5;
|
|
131
182
|
const clearGradient = (0, _element.useCallback)(() => onChange(undefined), [onChange]);
|
|
132
|
-
const Component = isMultipleOriginArray(gradients) ? MultipleOrigin : SingleOrigin;
|
|
133
183
|
|
|
134
184
|
if (!__nextHasNoMargin) {
|
|
135
185
|
(0, _deprecated.default)('Outer margin styles for wp.components.GradientPicker', {
|
|
@@ -140,22 +190,21 @@ function GradientPicker(_ref5) {
|
|
|
140
190
|
}
|
|
141
191
|
|
|
142
192
|
const deprecatedMarginSpacerProps = !__nextHasNoMargin ? {
|
|
143
|
-
marginTop: !
|
|
193
|
+
marginTop: !gradients.length ? 3 : undefined,
|
|
144
194
|
marginBottom: !clearable ? 6 : 0
|
|
145
195
|
} : {};
|
|
146
196
|
return (// Outmost Spacer wrapper can be removed when deprecation period is over
|
|
147
197
|
(0, _element.createElement)(_spacer.Spacer, (0, _extends2.default)({
|
|
148
198
|
marginBottom: 0
|
|
149
199
|
}, deprecatedMarginSpacerProps), (0, _element.createElement)(_vStack.VStack, {
|
|
150
|
-
spacing: gradients
|
|
200
|
+
spacing: gradients.length ? 4 : 0
|
|
151
201
|
}, !disableCustomGradients && (0, _element.createElement)(_customGradientPicker.default, {
|
|
152
202
|
__nextHasNoMargin: true,
|
|
153
203
|
__experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
|
|
154
204
|
value: value,
|
|
155
205
|
onChange: onChange
|
|
156
|
-
}), (
|
|
206
|
+
}), (gradients.length || clearable) && (0, _element.createElement)(Component, {
|
|
157
207
|
className: className,
|
|
158
|
-
clearable: clearable,
|
|
159
208
|
clearGradient: clearGradient,
|
|
160
209
|
gradients: gradients,
|
|
161
210
|
onChange: onChange,
|
|
@@ -167,4 +216,7 @@ function GradientPicker(_ref5) {
|
|
|
167
216
|
})))
|
|
168
217
|
);
|
|
169
218
|
}
|
|
219
|
+
|
|
220
|
+
var _default = GradientPicker;
|
|
221
|
+
exports.default = _default;
|
|
170
222
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/gradient-picker/index.js"],"names":["isMultipleOriginObject","obj","Array","isArray","gradients","isMultipleOriginArray","arr","length","every","gradientObj","SingleOrigin","className","clearGradient","onChange","value","actions","gradientOptions","map","index","gradient","name","color","background","MultipleOrigin","headingLevel","gradientSet","GradientPicker","__nextHasNoMargin","clearable","disableCustomGradients","__experimentalIsRenderedInSidebar","undefined","Component","since","version","hint","deprecatedMarginSpacerProps","marginTop","marginBottom"],"mappings":"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","sourcesContent":["// @ts-nocheck\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport CircularOptionPicker from '../circular-option-picker';\nimport CustomGradientPicker from '../custom-gradient-picker';\nimport { VStack } from '../v-stack';\nimport { ColorHeading } from '../color-palette/styles';\nimport { Spacer } from '../spacer';\n\n// The Multiple Origin Gradients have a `gradients` property (an array of\n// gradient objects), while Single Origin ones have a `gradient` property.\nconst isMultipleOriginObject = ( obj ) =>\n\tArray.isArray( obj.gradients ) && ! ( 'gradient' in obj );\n\nconst isMultipleOriginArray = ( arr ) => {\n\treturn (\n\t\tarr.length > 0 &&\n\t\tarr.every( ( gradientObj ) => isMultipleOriginObject( gradientObj ) )\n\t);\n};\n\nfunction SingleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\tconst gradientOptions = useMemo( () => {\n\t\treturn gradients.map( ( { gradient, name }, index ) => (\n\t\t\t<CircularOptionPicker.Option\n\t\t\t\tkey={ gradient }\n\t\t\t\tvalue={ gradient }\n\t\t\t\tisSelected={ value === gradient }\n\t\t\t\ttooltipText={\n\t\t\t\t\tname ||\n\t\t\t\t\t// translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\tsprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t\tstyle={ { color: 'rgba( 0,0,0,0 )', background: gradient } }\n\t\t\t\tonClick={\n\t\t\t\t\tvalue === gradient\n\t\t\t\t\t\t? clearGradient\n\t\t\t\t\t\t: () => onChange( gradient, index )\n\t\t\t\t}\n\t\t\t\taria-label={\n\t\t\t\t\tname\n\t\t\t\t\t\t? // translators: %s: The name of the gradient e.g: \"Angular red to blue\".\n\t\t\t\t\t\t sprintf( __( 'Gradient: %s' ), name )\n\t\t\t\t\t\t: // translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\t\t sprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t/>\n\t\t) );\n\t}, [ gradients, value, onChange, clearGradient ] );\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\tclassName={ className }\n\t\t\toptions={ gradientOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultipleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\n\theadingLevel,\n} ) {\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ gradients.map( ( { name, gradients: gradientSet }, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading level={ headingLevel }>\n\t\t\t\t\t\t\t{ name }\n\t\t\t\t\t\t</ColorHeading>\n\t\t\t\t\t\t<SingleOrigin\n\t\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\t\tgradients={ gradientSet }\n\t\t\t\t\t\t\tonChange={ ( gradient ) =>\n\t\t\t\t\t\t\t\tonChange( gradient, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t{ ...( gradients.length === index + 1\n\t\t\t\t\t\t\t\t? { actions }\n\t\t\t\t\t\t\t\t: {} ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport default function GradientPicker( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMargin = false,\n\tclassName,\n\tgradients,\n\tonChange,\n\tvalue,\n\tclearable = true,\n\tdisableCustomGradients = false,\n\t__experimentalIsRenderedInSidebar,\n\theadingLevel = 2,\n} ) {\n\tconst clearGradient = useCallback(\n\t\t() => onChange( undefined ),\n\t\t[ onChange ]\n\t);\n\tconst Component = isMultipleOriginArray( gradients )\n\t\t? MultipleOrigin\n\t\t: SingleOrigin;\n\n\tif ( ! __nextHasNoMargin ) {\n\t\tdeprecated( 'Outer margin styles for wp.components.GradientPicker', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.4',\n\t\t\thint: 'Set the `__nextHasNoMargin` prop to true to start opting into the new styles, which will become the default in a future version',\n\t\t} );\n\t}\n\n\tconst deprecatedMarginSpacerProps = ! __nextHasNoMargin\n\t\t? {\n\t\t\t\tmarginTop: ! gradients?.length ? 3 : undefined,\n\t\t\t\tmarginBottom: ! clearable ? 6 : 0,\n\t\t }\n\t\t: {};\n\n\treturn (\n\t\t// Outmost Spacer wrapper can be removed when deprecation period is over\n\t\t<Spacer marginBottom={ 0 } { ...deprecatedMarginSpacerProps }>\n\t\t\t<VStack spacing={ gradients?.length ? 4 : 0 }>\n\t\t\t\t{ ! disableCustomGradients && (\n\t\t\t\t\t<CustomGradientPicker\n\t\t\t\t\t\t__nextHasNoMargin\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ ( gradients?.length || clearable ) && (\n\t\t\t\t\t<Component\n\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\tclearable={ clearable }\n\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\tgradients={ gradients }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tactions={\n\t\t\t\t\t\t\tclearable &&\n\t\t\t\t\t\t\t! disableCustomGradients && (\n\t\t\t\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\t\t\t\tonClick={ clearGradient }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\theadingLevel={ headingLevel }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</VStack>\n\t\t</Spacer>\n\t);\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/gradient-picker/index.tsx"],"names":["isMultipleOriginObject","obj","Array","isArray","gradients","isMultipleOriginArray","arr","length","every","gradientObj","SingleOrigin","className","clearGradient","onChange","value","actions","gradientOptions","map","index","gradient","name","color","background","MultipleOrigin","headingLevel","gradientSet","Component","props","GradientPicker","__nextHasNoMargin","clearable","disableCustomGradients","__experimentalIsRenderedInSidebar","undefined","since","version","hint","deprecatedMarginSpacerProps","marginTop","marginBottom"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport CircularOptionPicker from '../circular-option-picker';\nimport CustomGradientPicker from '../custom-gradient-picker';\nimport { VStack } from '../v-stack';\nimport { ColorHeading } from '../color-palette/styles';\nimport { Spacer } from '../spacer';\nimport type {\n\tGradientPickerComponentProps,\n\tPickerProps,\n\tOriginObject,\n\tGradientObject,\n} from './types';\n\n// The Multiple Origin Gradients have a `gradients` property (an array of\n// gradient objects), while Single Origin ones have a `gradient` property.\nconst isMultipleOriginObject = (\n\tobj: Record< string, any >\n): obj is OriginObject =>\n\tArray.isArray( obj.gradients ) && ! ( 'gradient' in obj );\n\nconst isMultipleOriginArray = ( arr: any[] ): arr is OriginObject[] => {\n\treturn (\n\t\tarr.length > 0 &&\n\t\tarr.every( ( gradientObj ) => isMultipleOriginObject( gradientObj ) )\n\t);\n};\n\nfunction SingleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\n}: PickerProps< GradientObject > ) {\n\tconst gradientOptions = useMemo( () => {\n\t\treturn gradients.map( ( { gradient, name }, index ) => (\n\t\t\t<CircularOptionPicker.Option\n\t\t\t\tkey={ gradient }\n\t\t\t\tvalue={ gradient }\n\t\t\t\tisSelected={ value === gradient }\n\t\t\t\ttooltipText={\n\t\t\t\t\tname ||\n\t\t\t\t\t// translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\tsprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t\tstyle={ { color: 'rgba( 0,0,0,0 )', background: gradient } }\n\t\t\t\tonClick={\n\t\t\t\t\tvalue === gradient\n\t\t\t\t\t\t? clearGradient\n\t\t\t\t\t\t: () => onChange( gradient, index )\n\t\t\t\t}\n\t\t\t\taria-label={\n\t\t\t\t\tname\n\t\t\t\t\t\t? // translators: %s: The name of the gradient e.g: \"Angular red to blue\".\n\t\t\t\t\t\t sprintf( __( 'Gradient: %s' ), name )\n\t\t\t\t\t\t: // translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\t\t sprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t/>\n\t\t) );\n\t}, [ gradients, value, onChange, clearGradient ] );\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\tclassName={ className }\n\t\t\toptions={ gradientOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultipleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\n\theadingLevel,\n}: PickerProps< OriginObject > ) {\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ gradients.map( ( { name, gradients: gradientSet }, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading level={ headingLevel }>\n\t\t\t\t\t\t\t{ name }\n\t\t\t\t\t\t</ColorHeading>\n\t\t\t\t\t\t<SingleOrigin\n\t\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\t\tgradients={ gradientSet }\n\t\t\t\t\t\t\tonChange={ ( gradient ) =>\n\t\t\t\t\t\t\t\tonChange( gradient, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t{ ...( gradients.length === index + 1\n\t\t\t\t\t\t\t\t? { actions }\n\t\t\t\t\t\t\t\t: {} ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nfunction Component( props: PickerProps< any > ) {\n\tif ( isMultipleOriginArray( props.gradients ) ) {\n\t\treturn <MultipleOrigin { ...props } />;\n\t}\n\treturn <SingleOrigin { ...props } />;\n}\n\n/**\n * GradientPicker is a React component that renders a color gradient picker to\n * define a multi step gradient. There's either a _linear_ or a _radial_ type\n * available.\n *\n * ```jsx\n *import { GradientPicker } from '@wordpress/components';\n *import { useState } from '@wordpress/element';\n *\n *const myGradientPicker = () => {\n *\tconst [ gradient, setGradient ] = useState( null );\n *\n *\treturn (\n *\t\t<GradientPicker\n *\t\t\t__nextHasNoMargin\n *\t\t\tvalue={ gradient }\n *\t\t\tonChange={ ( currentGradient ) => setGradient( currentGradient ) }\n *\t\t\tgradients={ [\n *\t\t\t\t{\n *\t\t\t\t\tname: 'JShine',\n *\t\t\t\t\tgradient:\n *\t\t\t\t\t\t'linear-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)',\n *\t\t\t\t\tslug: 'jshine',\n *\t\t\t\t},\n *\t\t\t\t{\n *\t\t\t\t\tname: 'Moonlit Asteroid',\n *\t\t\t\t\tgradient:\n *\t\t\t\t\t\t'linear-gradient(135deg,#0F2027 0%, #203A43 0%, #2c5364 100%)',\n *\t\t\t\t\tslug: 'moonlit-asteroid',\n *\t\t\t\t},\n *\t\t\t\t{\n *\t\t\t\t\tname: 'Rastafarie',\n *\t\t\t\t\tgradient:\n *\t\t\t\t\t\t'linear-gradient(135deg,#1E9600 0%, #FFF200 0%, #FF0000 100%)',\n *\t\t\t\t\tslug: 'rastafari',\n *\t\t\t\t},\n *\t\t\t] }\n *\t\t/>\n *\t);\n *};\n *```\n *\n */\nexport function GradientPicker( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMargin = false,\n\tclassName,\n\tgradients = [],\n\tonChange,\n\tvalue,\n\tclearable = true,\n\tdisableCustomGradients = false,\n\t__experimentalIsRenderedInSidebar,\n\theadingLevel = 2,\n}: GradientPickerComponentProps ) {\n\tconst clearGradient = useCallback(\n\t\t() => onChange( undefined ),\n\t\t[ onChange ]\n\t);\n\n\tif ( ! __nextHasNoMargin ) {\n\t\tdeprecated( 'Outer margin styles for wp.components.GradientPicker', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.4',\n\t\t\thint: 'Set the `__nextHasNoMargin` prop to true to start opting into the new styles, which will become the default in a future version',\n\t\t} );\n\t}\n\n\tconst deprecatedMarginSpacerProps = ! __nextHasNoMargin\n\t\t? {\n\t\t\t\tmarginTop: ! gradients.length ? 3 : undefined,\n\t\t\t\tmarginBottom: ! clearable ? 6 : 0,\n\t\t }\n\t\t: {};\n\n\treturn (\n\t\t// Outmost Spacer wrapper can be removed when deprecation period is over\n\t\t<Spacer marginBottom={ 0 } { ...deprecatedMarginSpacerProps }>\n\t\t\t<VStack spacing={ gradients.length ? 4 : 0 }>\n\t\t\t\t{ ! disableCustomGradients && (\n\t\t\t\t\t<CustomGradientPicker\n\t\t\t\t\t\t__nextHasNoMargin\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ ( gradients.length || clearable ) && (\n\t\t\t\t\t<Component\n\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\tgradients={ gradients }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tactions={\n\t\t\t\t\t\t\tclearable &&\n\t\t\t\t\t\t\t! disableCustomGradients && (\n\t\t\t\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\t\t\t\tonClick={ clearGradient }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\theadingLevel={ headingLevel }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</VStack>\n\t\t</Spacer>\n\t);\n}\n\nexport default GradientPicker;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}
|
package/build/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;AAaA;;AACA;;AAIA;;AACA;;AACA;;AAIA;;AACA;;AAMA;;AACA;;AAIA;;AACA;;AACA;;AAQA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAMA;;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;;AACA;;AACA;;AACA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAQA;;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;;AACA;;AACA;;AAKA;;AAQA;;AAKA;;AACA;;AAMA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAQA;;AACA;;AAGA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AAIA;;AACA;;AAGA","sourcesContent":["// Primitives.\nexport {\n\tSVG,\n\tPath,\n\tCircle,\n\tPolygon,\n\tRect,\n\tG,\n\tLine,\n\tHorizontalRule,\n\tBlockQuotation,\n} from '@wordpress/primitives';\n\n// Components.\nexport { default as __experimentalAlignmentMatrixControl } from './alignment-matrix-control';\nexport {\n\tdefault as Animate,\n\tgetAnimateClassName as __unstableGetAnimateClassName,\n} from './animate';\nexport { __unstableMotion, __unstableAnimatePresence } from './animation';\nexport { default as AnglePickerControl } from './angle-picker-control';\nexport {\n\tdefault as Autocomplete,\n\tuseAutocompleteProps as __unstableUseAutocompleteProps,\n} from './autocomplete';\nexport { default as BaseControl, useBaseControlProps } from './base-control';\nexport {\n\tBorderBoxControl as __experimentalBorderBoxControl,\n\thasSplitBorders as __experimentalHasSplitBorders,\n\tisDefinedBorder as __experimentalIsDefinedBorder,\n\tisEmptyBorder as __experimentalIsEmptyBorder,\n} from './border-box-control';\nexport { BorderControl as __experimentalBorderControl } from './border-control';\nexport {\n\tdefault as __experimentalBoxControl,\n\tapplyValueToSides as __experimentalApplyValueToSides,\n} from './box-control';\nexport { default as Button } from './button';\nexport { default as ButtonGroup } from './button-group';\nexport {\n\tCard,\n\tCardBody,\n\tCardDivider,\n\tCardFooter,\n\tCardHeader,\n\tCardMedia,\n} from './card';\nexport { default as CheckboxControl } from './checkbox-control';\nexport { default as ClipboardButton } from './clipboard-button';\nexport { default as __experimentalPaletteEdit } from './palette-edit';\nexport { default as ColorIndicator } from './color-indicator';\nexport { default as ColorPalette } from './color-palette';\nexport { ColorPicker } from './color-picker';\nexport { default as ComboboxControl } from './combobox-control';\nexport {\n\tComposite as __unstableComposite,\n\tCompositeGroup as __unstableCompositeGroup,\n\tCompositeItem as __unstableCompositeItem,\n\tuseCompositeState as __unstableUseCompositeState,\n} from './composite';\nexport { ConfirmDialog as __experimentalConfirmDialog } from './confirm-dialog';\nexport { StableCustomSelectControl as CustomSelectControl } from './custom-select-control';\nexport { default as Dashicon } from './dashicon';\nexport { default as DateTimePicker, DatePicker, TimePicker } from './date-time';\nexport { default as __experimentalDimensionControl } from './dimension-control';\nexport { default as Disabled } from './disabled';\nexport { DisclosureContent as __unstableDisclosureContent } from './disclosure';\nexport { Divider as __experimentalDivider } from './divider';\nexport { default as Draggable } from './draggable';\nexport { default as DropZone } from './drop-zone';\nexport { default as DropZoneProvider } from './drop-zone/provider';\nexport { default as Dropdown } from './dropdown';\nexport { default as __experimentalDropdownContentWrapper } from './dropdown/dropdown-content-wrapper';\nexport { default as DropdownMenu } from './dropdown-menu';\nexport { DuotoneSwatch, DuotonePicker } from './duotone-picker';\nexport { Elevation as __experimentalElevation } from './elevation';\nexport { default as ExternalLink } from './external-link';\nexport { Flex, FlexBlock, FlexItem } from './flex';\nexport { default as FocalPointPicker } from './focal-point-picker';\nexport { default as FocusableIframe } from './focusable-iframe';\nexport { default as FontSizePicker } from './font-size-picker';\nexport { default as FormFileUpload } from './form-file-upload';\nexport { default as FormToggle } from './form-toggle';\nexport { default as FormTokenField } from './form-token-field';\nexport { default as GradientPicker } from './gradient-picker';\nexport { default as CustomGradientPicker } from './custom-gradient-picker';\nexport { Grid as __experimentalGrid } from './grid';\nexport { default as Guide } from './guide';\nexport { default as GuidePage } from './guide/page';\nexport { Heading as __experimentalHeading } from './heading';\nexport { HStack as __experimentalHStack } from './h-stack';\nexport { default as Icon } from './icon';\nexport { default as IconButton } from './button/deprecated';\nexport {\n\tItemGroup as __experimentalItemGroup,\n\tItem as __experimentalItem,\n} from './item-group';\nexport { default as __experimentalInputControl } from './input-control';\nexport { default as __experimentalInputControlPrefixWrapper } from './input-control/input-prefix-wrapper';\nexport { default as __experimentalInputControlSuffixWrapper } from './input-control/input-suffix-wrapper';\nexport { default as KeyboardShortcuts } from './keyboard-shortcuts';\nexport { default as MenuGroup } from './menu-group';\nexport { default as MenuItem } from './menu-item';\nexport { default as MenuItemsChoice } from './menu-items-choice';\nexport { default as Modal } from './modal';\nexport { default as ScrollLock } from './scroll-lock';\nexport { NavigableMenu, TabbableContainer } from './navigable-container';\nexport { default as __experimentalNavigation } from './navigation';\nexport { default as __experimentalNavigationBackButton } from './navigation/back-button';\nexport { default as __experimentalNavigationGroup } from './navigation/group';\nexport { default as __experimentalNavigationItem } from './navigation/item';\nexport { default as __experimentalNavigationMenu } from './navigation/menu';\nexport {\n\tNavigatorProvider as __experimentalNavigatorProvider,\n\tNavigatorScreen as __experimentalNavigatorScreen,\n\tNavigatorButton as __experimentalNavigatorButton,\n\tNavigatorBackButton as __experimentalNavigatorBackButton,\n\tNavigatorToParentButton as __experimentalNavigatorToParentButton,\n\tuseNavigator as __experimentalUseNavigator,\n} from './navigator';\nexport { default as Notice } from './notice';\nexport { default as __experimentalNumberControl } from './number-control';\nexport { default as NoticeList } from './notice/list';\nexport { default as Panel } from './panel';\nexport { default as PanelBody } from './panel/body';\nexport { default as PanelHeader } from './panel/header';\nexport { default as PanelRow } from './panel/row';\nexport { default as Placeholder } from './placeholder';\nexport { default as Popover } from './popover';\nexport { default as QueryControls } from './query-controls';\nexport { default as __experimentalRadio } from './radio-group/radio';\nexport { default as __experimentalRadioGroup } from './radio-group';\nexport { default as RadioControl } from './radio-control';\nexport { default as RangeControl } from './range-control';\nexport { default as ResizableBox } from './resizable-box';\nexport { default as ResponsiveWrapper } from './responsive-wrapper';\nexport { default as SandBox } from './sandbox';\nexport { default as SearchControl } from './search-control';\nexport { default as SelectControl } from './select-control';\nexport { default as Snackbar } from './snackbar';\nexport { default as SnackbarList } from './snackbar/list';\nexport { Spacer as __experimentalSpacer } from './spacer';\nexport { Scrollable as __experimentalScrollable } from './scrollable';\nexport { default as Spinner } from './spinner';\nexport { Surface as __experimentalSurface } from './surface';\nexport { default as TabPanel } from './tab-panel';\nexport { Text as __experimentalText } from './text';\nexport { default as TextControl } from './text-control';\nexport { default as TextareaControl } from './textarea-control';\nexport { default as TextHighlight } from './text-highlight';\nexport { default as Tip } from './tip';\nexport { default as ToggleControl } from './toggle-control';\nexport {\n\tToggleGroupControl as __experimentalToggleGroupControl,\n\tToggleGroupControlOption as __experimentalToggleGroupControlOption,\n\tToggleGroupControlOptionIcon as __experimentalToggleGroupControlOptionIcon,\n} from './toggle-group-control';\nexport {\n\tToolbar,\n\tToolbarButton,\n\tToolbarContext as __experimentalToolbarContext,\n\tToolbarDropdownMenu,\n\tToolbarGroup,\n\tToolbarItem,\n} from './toolbar';\nexport {\n\tToolsPanel as __experimentalToolsPanel,\n\tToolsPanelItem as __experimentalToolsPanelItem,\n\tToolsPanelContext as __experimentalToolsPanelContext,\n} from './tools-panel';\nexport { default as Tooltip } from './tooltip';\nexport {\n\tdefault as __experimentalTreeGrid,\n\tTreeGridRow as __experimentalTreeGridRow,\n\tTreeGridCell as __experimentalTreeGridCell,\n\tTreeGridItem as __experimentalTreeGridItem,\n} from './tree-grid';\nexport { default as TreeSelect } from './tree-select';\nexport { Truncate as __experimentalTruncate } from './truncate';\nexport {\n\tdefault as __experimentalUnitControl,\n\tuseCustomUnits as __experimentalUseCustomUnits,\n\tparseQuantityAndUnitFromRawValue as __experimentalParseQuantityAndUnitFromRawValue,\n} from './unit-control';\nexport { View as __experimentalView } from './view';\nexport { VisuallyHidden } from './visually-hidden';\nexport { VStack as __experimentalVStack } from './v-stack';\nexport { default as IsolatedEventContainer } from './isolated-event-container';\nexport {\n\tcreateSlotFill,\n\tSlot,\n\tFill,\n\tProvider as SlotFillProvider,\n\tuseSlot as __experimentalUseSlot,\n\tuseSlotFills as __experimentalUseSlotFills,\n} from './slot-fill';\nexport { default as __experimentalStyleProvider } from './style-provider';\nexport { ZStack as __experimentalZStack } from './z-stack';\n\n// Higher-Order Components.\nexport {\n\tdefault as navigateRegions,\n\tuseNavigateRegions as __unstableUseNavigateRegions,\n} from './higher-order/navigate-regions';\nexport { default as withConstrainedTabbing } from './higher-order/with-constrained-tabbing';\nexport { default as withFallbackStyles } from './higher-order/with-fallback-styles';\nexport { default as withFilters } from './higher-order/with-filters';\nexport { default as withFocusOutside } from './higher-order/with-focus-outside';\nexport {\n\tdefault as withFocusReturn,\n\tProvider as FocusReturnProvider,\n} from './higher-order/with-focus-return';\nexport { default as withNotices } from './higher-order/with-notices';\nexport { default as withSpokenMessages } from './higher-order/with-spoken-messages';\n\n// Private APIs.\nexport { privateApis } from './private-apis';\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;AAaA;;AACA;;AAIA;;AACA;;AACA;;AAIA;;AACA;;AAMA;;AACA;;AAIA;;AACA;;AACA;;AAQA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAMA;;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;;AACA;;AACA;;AACA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAQA;;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;;AACA;;AACA;;AAKA;;AAQA;;AAKA;;AACA;;AAMA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAQA;;AACA;;AAGA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AAIA;;AACA;;AAGA","sourcesContent":["// Primitives.\nexport {\n\tSVG,\n\tPath,\n\tCircle,\n\tPolygon,\n\tRect,\n\tG,\n\tLine,\n\tHorizontalRule,\n\tBlockQuotation,\n} from '@wordpress/primitives';\n\n// Components.\nexport { default as __experimentalAlignmentMatrixControl } from './alignment-matrix-control';\nexport {\n\tdefault as Animate,\n\tgetAnimateClassName as __unstableGetAnimateClassName,\n} from './animate';\nexport { __unstableMotion, __unstableAnimatePresence } from './animation';\nexport { default as AnglePickerControl } from './angle-picker-control';\nexport {\n\tdefault as Autocomplete,\n\tuseAutocompleteProps as __unstableUseAutocompleteProps,\n} from './autocomplete';\nexport { default as BaseControl, useBaseControlProps } from './base-control';\nexport {\n\tBorderBoxControl as __experimentalBorderBoxControl,\n\thasSplitBorders as __experimentalHasSplitBorders,\n\tisDefinedBorder as __experimentalIsDefinedBorder,\n\tisEmptyBorder as __experimentalIsEmptyBorder,\n} from './border-box-control';\nexport { BorderControl as __experimentalBorderControl } from './border-control';\nexport {\n\tdefault as __experimentalBoxControl,\n\tapplyValueToSides as __experimentalApplyValueToSides,\n} from './box-control';\nexport { default as Button } from './button';\nexport { default as ButtonGroup } from './button-group';\nexport {\n\tCard,\n\tCardBody,\n\tCardDivider,\n\tCardFooter,\n\tCardHeader,\n\tCardMedia,\n} from './card';\nexport { default as CheckboxControl } from './checkbox-control';\nexport { default as ClipboardButton } from './clipboard-button';\nexport { default as __experimentalPaletteEdit } from './palette-edit';\nexport { default as ColorIndicator } from './color-indicator';\nexport { default as ColorPalette } from './color-palette';\nexport { ColorPicker } from './color-picker';\nexport { default as ComboboxControl } from './combobox-control';\nexport {\n\tComposite as __unstableComposite,\n\tCompositeGroup as __unstableCompositeGroup,\n\tCompositeItem as __unstableCompositeItem,\n\tuseCompositeState as __unstableUseCompositeState,\n} from './composite';\nexport { ConfirmDialog as __experimentalConfirmDialog } from './confirm-dialog';\nexport { StableCustomSelectControl as CustomSelectControl } from './custom-select-control';\nexport { default as Dashicon } from './dashicon';\nexport { default as DateTimePicker, DatePicker, TimePicker } from './date-time';\nexport { default as __experimentalDimensionControl } from './dimension-control';\nexport { default as Disabled } from './disabled';\nexport { DisclosureContent as __unstableDisclosureContent } from './disclosure';\nexport { Divider as __experimentalDivider } from './divider';\nexport { default as Draggable } from './draggable';\nexport { default as DropZone } from './drop-zone';\nexport { default as DropZoneProvider } from './drop-zone/provider';\nexport { default as Dropdown } from './dropdown';\nexport { default as __experimentalDropdownContentWrapper } from './dropdown/dropdown-content-wrapper';\nexport { default as DropdownMenu } from './dropdown-menu';\nexport { DuotoneSwatch, DuotonePicker } from './duotone-picker';\nexport { Elevation as __experimentalElevation } from './elevation';\nexport { default as ExternalLink } from './external-link';\nexport { Flex, FlexBlock, FlexItem } from './flex';\nexport { default as FocalPointPicker } from './focal-point-picker';\nexport { default as FocusableIframe } from './focusable-iframe';\nexport { default as FontSizePicker } from './font-size-picker';\nexport { default as FormFileUpload } from './form-file-upload';\nexport { default as FormToggle } from './form-toggle';\nexport { default as FormTokenField } from './form-token-field';\nexport { default as GradientPicker } from './gradient-picker';\nexport { default as CustomGradientPicker } from './custom-gradient-picker';\nexport { Grid as __experimentalGrid } from './grid';\nexport { default as Guide } from './guide';\nexport { default as GuidePage } from './guide/page';\nexport { Heading as __experimentalHeading } from './heading';\nexport { HStack as __experimentalHStack } from './h-stack';\nexport { default as Icon } from './icon';\nexport { default as IconButton } from './button/deprecated';\nexport {\n\tItemGroup as __experimentalItemGroup,\n\tItem as __experimentalItem,\n} from './item-group';\nexport { default as __experimentalInputControl } from './input-control';\nexport { default as __experimentalInputControlPrefixWrapper } from './input-control/input-prefix-wrapper';\nexport { default as __experimentalInputControlSuffixWrapper } from './input-control/input-suffix-wrapper';\nexport { default as KeyboardShortcuts } from './keyboard-shortcuts';\nexport { default as MenuGroup } from './menu-group';\nexport { default as MenuItem } from './menu-item';\nexport { default as MenuItemsChoice } from './menu-items-choice';\nexport { default as Modal } from './modal';\nexport { default as ScrollLock } from './scroll-lock';\nexport { NavigableMenu, TabbableContainer } from './navigable-container';\nexport { default as __experimentalNavigation } from './navigation';\nexport { default as __experimentalNavigationBackButton } from './navigation/back-button';\nexport { default as __experimentalNavigationGroup } from './navigation/group';\nexport { default as __experimentalNavigationItem } from './navigation/item';\nexport { default as __experimentalNavigationMenu } from './navigation/menu';\nexport {\n\tNavigatorProvider as __experimentalNavigatorProvider,\n\tNavigatorScreen as __experimentalNavigatorScreen,\n\tNavigatorButton as __experimentalNavigatorButton,\n\tNavigatorBackButton as __experimentalNavigatorBackButton,\n\tNavigatorToParentButton as __experimentalNavigatorToParentButton,\n\tuseNavigator as __experimentalUseNavigator,\n} from './navigator';\nexport { default as Notice } from './notice';\nexport { default as __experimentalNumberControl } from './number-control';\nexport { default as NoticeList } from './notice/list';\nexport { default as Panel } from './panel';\nexport { default as PanelBody } from './panel/body';\nexport { default as PanelHeader } from './panel/header';\nexport { default as PanelRow } from './panel/row';\nexport { default as Placeholder } from './placeholder';\nexport { default as Popover } from './popover';\nexport { default as QueryControls } from './query-controls';\nexport { default as __experimentalRadio } from './radio-group/radio';\nexport { default as __experimentalRadioGroup } from './radio-group';\nexport { default as RadioControl } from './radio-control';\nexport { default as RangeControl } from './range-control';\nexport { default as ResizableBox } from './resizable-box';\nexport { default as ResponsiveWrapper } from './responsive-wrapper';\nexport { default as SandBox } from './sandbox';\nexport { default as SearchControl } from './search-control';\nexport { default as SelectControl } from './select-control';\nexport { default as Snackbar } from './snackbar';\nexport { default as SnackbarList } from './snackbar/list';\nexport { Spacer as __experimentalSpacer } from './spacer';\nexport { Scrollable as __experimentalScrollable } from './scrollable';\nexport { default as Spinner } from './spinner';\nexport { Surface as __experimentalSurface } from './surface';\nexport { default as TabPanel } from './tab-panel';\nexport { Text as __experimentalText } from './text';\nexport { default as TextControl } from './text-control';\nexport { default as TextareaControl } from './textarea-control';\nexport { default as TextHighlight } from './text-highlight';\nexport { default as Tip } from './tip';\nexport { default as ToggleControl } from './toggle-control';\nexport {\n\tToggleGroupControl as __experimentalToggleGroupControl,\n\tToggleGroupControlOption as __experimentalToggleGroupControlOption,\n\tToggleGroupControlOptionIcon as __experimentalToggleGroupControlOptionIcon,\n} from './toggle-group-control';\nexport {\n\tToolbar,\n\tToolbarButton,\n\tToolbarContext as __experimentalToolbarContext,\n\tToolbarDropdownMenu,\n\tToolbarGroup,\n\tToolbarItem,\n} from './toolbar';\nexport {\n\tToolsPanel as __experimentalToolsPanel,\n\tToolsPanelItem as __experimentalToolsPanelItem,\n\tToolsPanelContext as __experimentalToolsPanelContext,\n} from './tools-panel';\nexport { default as Tooltip } from './tooltip';\nexport {\n\tdefault as __experimentalTreeGrid,\n\tTreeGridRow as __experimentalTreeGridRow,\n\tTreeGridCell as __experimentalTreeGridCell,\n\tTreeGridItem as __experimentalTreeGridItem,\n} from './tree-grid';\nexport { default as TreeSelect } from './tree-select';\nexport { Truncate as __experimentalTruncate } from './truncate';\nexport {\n\tdefault as __experimentalUnitControl,\n\tuseCustomUnits as __experimentalUseCustomUnits,\n\tparseQuantityAndUnitFromRawValue as __experimentalParseQuantityAndUnitFromRawValue,\n} from './unit-control';\nexport { View as __experimentalView } from './view';\nexport { VisuallyHidden } from './visually-hidden';\nexport { VStack as __experimentalVStack } from './v-stack';\nexport { default as IsolatedEventContainer } from './isolated-event-container';\nexport {\n\tcreateSlotFill,\n\tSlot,\n\tFill,\n\tProvider as SlotFillProvider,\n\tuseSlot as __experimentalUseSlot,\n\tuseSlotFills as __experimentalUseSlotFills,\n} from './slot-fill';\nexport { default as __experimentalStyleProvider } from './style-provider';\nexport { ZStack as __experimentalZStack } from './z-stack';\n\n// Higher-Order Components.\nexport {\n\tdefault as navigateRegions,\n\tuseNavigateRegions as __unstableUseNavigateRegions,\n} from './higher-order/navigate-regions';\nexport { default as withConstrainedTabbing } from './higher-order/with-constrained-tabbing';\nexport { default as withFallbackStyles } from './higher-order/with-fallback-styles';\nexport { default as withFilters } from './higher-order/with-filters';\nexport { default as withFocusOutside } from './higher-order/with-focus-outside';\nexport {\n\tdefault as withFocusReturn,\n\tProvider as FocusReturnProvider,\n} from './higher-order/with-focus-return';\nexport { default as withNotices } from './higher-order/with-notices';\nexport { default as withSpokenMessages } from './higher-order/with-spoken-messages';\n\n// Private APIs.\nexport { privateApis } from './private-apis';\n"]}
|
|
@@ -50,10 +50,6 @@ const KeyboardAwareFlatList = _ref => {
|
|
|
50
50
|
};
|
|
51
51
|
|
|
52
52
|
exports.KeyboardAwareFlatList = KeyboardAwareFlatList;
|
|
53
|
-
|
|
54
|
-
KeyboardAwareFlatList.handleCaretVerticalPositionChange = () => {// no need to handle on Android, it is system managed
|
|
55
|
-
};
|
|
56
|
-
|
|
57
53
|
var _default = KeyboardAwareFlatList;
|
|
58
54
|
exports.default = _default;
|
|
59
55
|
//# sourceMappingURL=index.android.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/mobile/keyboard-aware-flat-list/index.android.js"],"names":["AnimatedFlatList","Animated","createAnimatedComponent","FlatList","KeyboardAwareFlatList","innerRef","onScroll","props","scrollHandler","flex"
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/mobile/keyboard-aware-flat-list/index.android.js"],"names":["AnimatedFlatList","Animated","createAnimatedComponent","FlatList","KeyboardAwareFlatList","innerRef","onScroll","props","scrollHandler","flex"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AAKA;;;;;;AATA;AACA;AACA;;AAIA;AACA;AACA;AAGA,MAAMA,gBAAgB,GAAGC,+BAASC,uBAAT,CAAkCC,qBAAlC,CAAzB;;AAEO,MAAMC,qBAAqB,GAAG,QAAwC;AAAA,MAAtC;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,QAAZ;AAAsB,OAAGC;AAAzB,GAAsC;AAC5E,QAAMC,aAAa,GAAG,qDAA0B;AAAEF,IAAAA;AAAF,GAA1B,CAAtB;AACA,SACC,4BAAC,6BAAD;AAAsB,IAAA,KAAK,EAAG;AAAEG,MAAAA,IAAI,EAAE;AAAR;AAA9B,KACC,4BAAC,gBAAD;AACC,IAAA,GAAG,EAAGJ,QADP;AAEC,IAAA,QAAQ,EAAGG;AAFZ,KAGMD,KAHN,EADD,CADD;AASA,CAXM;;;eAaQH,qB","sourcesContent":["/**\n * External dependencies\n */\nimport { FlatList } from 'react-native';\nimport Animated, { useAnimatedScrollHandler } from 'react-native-reanimated';\n\n/**\n * Internal dependencies\n */\nimport KeyboardAvoidingView from '../keyboard-avoiding-view';\n\nconst AnimatedFlatList = Animated.createAnimatedComponent( FlatList );\n\nexport const KeyboardAwareFlatList = ( { innerRef, onScroll, ...props } ) => {\n\tconst scrollHandler = useAnimatedScrollHandler( { onScroll } );\n\treturn (\n\t\t<KeyboardAvoidingView style={ { flex: 1 } }>\n\t\t\t<AnimatedFlatList\n\t\t\t\tref={ innerRef }\n\t\t\t\tonScroll={ scrollHandler }\n\t\t\t\t{ ...props }\n\t\t\t/>\n\t\t</KeyboardAvoidingView>\n\t);\n};\n\nexport default KeyboardAwareFlatList;\n"]}
|
|
@@ -9,14 +9,20 @@ exports.default = exports.KeyboardAwareFlatList = void 0;
|
|
|
9
9
|
|
|
10
10
|
var _element = require("@wordpress/element");
|
|
11
11
|
|
|
12
|
-
var _reactNativeKeyboardAwareScrollView = require("react-native-keyboard-aware-scroll-view");
|
|
13
|
-
|
|
14
12
|
var _reactNative = require("react-native");
|
|
15
13
|
|
|
16
|
-
var _es = _interopRequireDefault(require("fast-deep-equal/es6"));
|
|
17
|
-
|
|
18
14
|
var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
|
|
19
15
|
|
|
16
|
+
var _compose = require("@wordpress/compose");
|
|
17
|
+
|
|
18
|
+
var _useTextInputOffset = _interopRequireDefault(require("./use-text-input-offset"));
|
|
19
|
+
|
|
20
|
+
var _useKeyboardOffset = _interopRequireDefault(require("./use-keyboard-offset"));
|
|
21
|
+
|
|
22
|
+
var _useScrollToTextInput = _interopRequireDefault(require("./use-scroll-to-text-input"));
|
|
23
|
+
|
|
24
|
+
var _useTextInputCaretPosition = _interopRequireDefault(require("./use-text-input-caret-position"));
|
|
25
|
+
|
|
20
26
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
27
|
|
|
22
28
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
@@ -28,82 +34,121 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
28
34
|
/**
|
|
29
35
|
* WordPress dependencies
|
|
30
36
|
*/
|
|
31
|
-
const List = (0, _element.memo)(_reactNative.FlatList, _es.default);
|
|
32
37
|
|
|
33
|
-
|
|
38
|
+
/**
|
|
39
|
+
* Internal dependencies
|
|
40
|
+
*/
|
|
41
|
+
const AnimatedScrollView = _reactNativeReanimated.default.createAnimatedComponent(_reactNative.ScrollView);
|
|
42
|
+
/**
|
|
43
|
+
* React component that provides a FlatList that is aware of the keyboard state and can scroll
|
|
44
|
+
* to the currently focused TextInput.
|
|
45
|
+
*
|
|
46
|
+
* @param {Object} props Component props.
|
|
47
|
+
* @param {number} props.extraScrollHeight Extra scroll height for the content.
|
|
48
|
+
* @param {Function} props.innerRef Function to pass the ScrollView ref to the parent component.
|
|
49
|
+
* @param {Function} props.onScroll Function to be called when the list is scrolled.
|
|
50
|
+
* @param {boolean} props.scrollEnabled Whether the list can be scrolled.
|
|
51
|
+
* @param {Object} props.scrollViewStyle Additional style for the ScrollView component.
|
|
52
|
+
* @param {boolean} props.shouldPreventAutomaticScroll Whether to prevent scrolling when there's a Keyboard offset set.
|
|
53
|
+
* @param {Object} props... Other props to pass to the FlatList component.
|
|
54
|
+
* @return {WPComponent} KeyboardAwareFlatList component.
|
|
55
|
+
*/
|
|
56
|
+
|
|
34
57
|
|
|
35
58
|
const KeyboardAwareFlatList = _ref => {
|
|
36
59
|
let {
|
|
37
60
|
extraScrollHeight,
|
|
38
|
-
shouldPreventAutomaticScroll,
|
|
39
61
|
innerRef,
|
|
40
|
-
autoScroll,
|
|
41
|
-
scrollViewStyle,
|
|
42
|
-
inputAccessoryViewHeight,
|
|
43
62
|
onScroll,
|
|
44
|
-
|
|
63
|
+
scrollEnabled,
|
|
64
|
+
scrollViewStyle,
|
|
65
|
+
shouldPreventAutomaticScroll,
|
|
66
|
+
...props
|
|
45
67
|
} = _ref;
|
|
46
68
|
const scrollViewRef = (0, _element.useRef)();
|
|
47
|
-
const
|
|
48
|
-
const
|
|
69
|
+
const scrollViewMeasurements = (0, _element.useRef)();
|
|
70
|
+
const scrollViewYOffset = (0, _reactNativeReanimated.useSharedValue)(-1);
|
|
71
|
+
const {
|
|
72
|
+
height: windowHeight,
|
|
73
|
+
width: windowWidth
|
|
74
|
+
} = (0, _reactNative.useWindowDimensions)();
|
|
75
|
+
const isLandscape = windowWidth >= windowHeight;
|
|
76
|
+
const [keyboardOffset] = (0, _useKeyboardOffset.default)(scrollEnabled, shouldPreventAutomaticScroll);
|
|
77
|
+
const [currentCaretData] = (0, _useTextInputCaretPosition.default)(scrollEnabled);
|
|
78
|
+
const [getTextInputOffset] = (0, _useTextInputOffset.default)(scrollEnabled, scrollViewRef);
|
|
79
|
+
const [scrollToTextInputOffset] = (0, _useScrollToTextInput.default)(extraScrollHeight, keyboardOffset, scrollEnabled, scrollViewMeasurements, scrollViewRef, scrollViewYOffset);
|
|
80
|
+
const onScrollToTextInput = (0, _compose.useThrottle)((0, _element.useCallback)(async caret => {
|
|
81
|
+
const textInputOffset = await getTextInputOffset(caret);
|
|
82
|
+
const hasTextInputOffset = textInputOffset !== null;
|
|
83
|
+
|
|
84
|
+
if (hasTextInputOffset) {
|
|
85
|
+
scrollToTextInputOffset(caret, textInputOffset);
|
|
86
|
+
}
|
|
87
|
+
}, [getTextInputOffset, scrollToTextInputOffset]), 200, {
|
|
88
|
+
leading: false
|
|
89
|
+
});
|
|
90
|
+
(0, _element.useEffect)(() => {
|
|
91
|
+
onScrollToTextInput(currentCaretData);
|
|
92
|
+
}, [currentCaretData, onScrollToTextInput]); // When the orientation changes, the ScrollView measurements
|
|
93
|
+
// need to be re-calculated.
|
|
94
|
+
|
|
95
|
+
(0, _element.useEffect)(() => {
|
|
96
|
+
scrollViewMeasurements.current = null;
|
|
97
|
+
}, [isLandscape]);
|
|
49
98
|
const scrollHandler = (0, _reactNativeReanimated.useAnimatedScrollHandler)({
|
|
50
99
|
onScroll: event => {
|
|
51
100
|
const {
|
|
52
101
|
contentOffset
|
|
53
102
|
} = event;
|
|
54
|
-
|
|
103
|
+
scrollViewYOffset.value = contentOffset.y;
|
|
55
104
|
onScroll(event);
|
|
56
105
|
}
|
|
57
106
|
});
|
|
107
|
+
const measureScrollView = (0, _element.useCallback)(() => {
|
|
108
|
+
if (scrollViewRef.current) {
|
|
109
|
+
const scrollRef = scrollViewRef.current.getNativeScrollRef();
|
|
110
|
+
scrollRef.measureInWindow((_x, y, width, height) => {
|
|
111
|
+
scrollViewMeasurements.current = {
|
|
112
|
+
y,
|
|
113
|
+
width,
|
|
114
|
+
height
|
|
115
|
+
};
|
|
116
|
+
});
|
|
117
|
+
}
|
|
118
|
+
}, []);
|
|
119
|
+
const onContentSizeChange = (0, _element.useCallback)(() => {
|
|
120
|
+
onScrollToTextInput(currentCaretData); // Sets the first values when the content size changes.
|
|
121
|
+
|
|
122
|
+
if (!scrollViewMeasurements.current) {
|
|
123
|
+
measureScrollView();
|
|
124
|
+
}
|
|
125
|
+
}, [measureScrollView, onScrollToTextInput, currentCaretData]);
|
|
58
126
|
const getRef = (0, _element.useCallback)(ref => {
|
|
59
127
|
scrollViewRef.current = ref;
|
|
60
128
|
innerRef(ref);
|
|
61
|
-
}, [innerRef]);
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
}, 50);
|
|
74
|
-
}, [latestContentOffsetY, shouldPreventAutomaticScroll]);
|
|
75
|
-
const onKeyboardWillShow = (0, _element.useCallback)(() => {
|
|
76
|
-
keyboardWillShowIndicator.current = true;
|
|
77
|
-
}, []);
|
|
78
|
-
return (0, _element.createElement)(AnimatedKeyboardAwareScrollView, {
|
|
79
|
-
style: [{
|
|
80
|
-
flex: 1
|
|
81
|
-
}, scrollViewStyle],
|
|
82
|
-
keyboardDismissMode: "none",
|
|
83
|
-
enableResetScrollToCoords: false,
|
|
129
|
+
}, [innerRef]); // Adds content insets when the keyboard is opened to have
|
|
130
|
+
// extra padding at the bottom.
|
|
131
|
+
|
|
132
|
+
const contentInset = {
|
|
133
|
+
bottom: keyboardOffset
|
|
134
|
+
};
|
|
135
|
+
const style = [{
|
|
136
|
+
flex: 1
|
|
137
|
+
}, scrollViewStyle];
|
|
138
|
+
return (0, _element.createElement)(AnimatedScrollView, {
|
|
139
|
+
automaticallyAdjustContentInsets: false,
|
|
140
|
+
contentInset: contentInset,
|
|
84
141
|
keyboardShouldPersistTaps: "handled",
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
inputAccessoryViewHeight: inputAccessoryViewHeight,
|
|
88
|
-
enableAutomaticScroll: autoScroll === undefined ? false : autoScroll,
|
|
142
|
+
onContentSizeChange: onContentSizeChange,
|
|
143
|
+
onScroll: scrollHandler,
|
|
89
144
|
ref: getRef,
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
onScroll: scrollHandler
|
|
95
|
-
}, (0, _element.createElement)(List, listProps));
|
|
145
|
+
scrollEnabled: scrollEnabled,
|
|
146
|
+
scrollEventThrottle: 16,
|
|
147
|
+
style: style
|
|
148
|
+
}, (0, _element.createElement)(_reactNative.FlatList, props));
|
|
96
149
|
};
|
|
97
150
|
|
|
98
151
|
exports.KeyboardAwareFlatList = KeyboardAwareFlatList;
|
|
99
|
-
|
|
100
|
-
KeyboardAwareFlatList.handleCaretVerticalPositionChange = (scrollView, targetId, caretY, previousCaretY) => {
|
|
101
|
-
if (previousCaretY) {
|
|
102
|
-
// If this is not the first tap.
|
|
103
|
-
scrollView.refreshScrollForField(targetId);
|
|
104
|
-
}
|
|
105
|
-
};
|
|
106
|
-
|
|
107
152
|
var _default = KeyboardAwareFlatList;
|
|
108
153
|
exports.default = _default;
|
|
109
154
|
//# sourceMappingURL=index.ios.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/mobile/keyboard-aware-flat-list/index.ios.js"],"names":["
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/mobile/keyboard-aware-flat-list/index.ios.js"],"names":["AnimatedScrollView","Animated","createAnimatedComponent","ScrollView","KeyboardAwareFlatList","extraScrollHeight","innerRef","onScroll","scrollEnabled","scrollViewStyle","shouldPreventAutomaticScroll","props","scrollViewRef","scrollViewMeasurements","scrollViewYOffset","height","windowHeight","width","windowWidth","isLandscape","keyboardOffset","currentCaretData","getTextInputOffset","scrollToTextInputOffset","onScrollToTextInput","caret","textInputOffset","hasTextInputOffset","leading","current","scrollHandler","event","contentOffset","value","y","measureScrollView","scrollRef","getNativeScrollRef","measureInWindow","_x","onContentSizeChange","getRef","ref","contentInset","bottom","style","flex"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\n\nimport { ScrollView, FlatList, useWindowDimensions } from 'react-native';\nimport Animated, {\n\tuseAnimatedScrollHandler,\n\tuseSharedValue,\n} from 'react-native-reanimated';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useEffect, useRef } from '@wordpress/element';\nimport { useThrottle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport useTextInputOffset from './use-text-input-offset';\nimport useKeyboardOffset from './use-keyboard-offset';\nimport useScrollToTextInput from './use-scroll-to-text-input';\nimport useTextInputCaretPosition from './use-text-input-caret-position';\n\nconst AnimatedScrollView = Animated.createAnimatedComponent( ScrollView );\n\n/**\n * React component that provides a FlatList that is aware of the keyboard state and can scroll\n * to the currently focused TextInput.\n *\n * @param {Object} props Component props.\n * @param {number} props.extraScrollHeight Extra scroll height for the content.\n * @param {Function} props.innerRef Function to pass the ScrollView ref to the parent component.\n * @param {Function} props.onScroll Function to be called when the list is scrolled.\n * @param {boolean} props.scrollEnabled Whether the list can be scrolled.\n * @param {Object} props.scrollViewStyle Additional style for the ScrollView component.\n * @param {boolean} props.shouldPreventAutomaticScroll Whether to prevent scrolling when there's a Keyboard offset set.\n * @param {Object} props... Other props to pass to the FlatList component.\n * @return {WPComponent} KeyboardAwareFlatList component.\n */\nexport const KeyboardAwareFlatList = ( {\n\textraScrollHeight,\n\tinnerRef,\n\tonScroll,\n\tscrollEnabled,\n\tscrollViewStyle,\n\tshouldPreventAutomaticScroll,\n\t...props\n} ) => {\n\tconst scrollViewRef = useRef();\n\tconst scrollViewMeasurements = useRef();\n\tconst scrollViewYOffset = useSharedValue( -1 );\n\n\tconst { height: windowHeight, width: windowWidth } = useWindowDimensions();\n\tconst isLandscape = windowWidth >= windowHeight;\n\n\tconst [ keyboardOffset ] = useKeyboardOffset(\n\t\tscrollEnabled,\n\t\tshouldPreventAutomaticScroll\n\t);\n\n\tconst [ currentCaretData ] = useTextInputCaretPosition( scrollEnabled );\n\n\tconst [ getTextInputOffset ] = useTextInputOffset(\n\t\tscrollEnabled,\n\t\tscrollViewRef\n\t);\n\n\tconst [ scrollToTextInputOffset ] = useScrollToTextInput(\n\t\textraScrollHeight,\n\t\tkeyboardOffset,\n\t\tscrollEnabled,\n\t\tscrollViewMeasurements,\n\t\tscrollViewRef,\n\t\tscrollViewYOffset\n\t);\n\n\tconst onScrollToTextInput = useThrottle(\n\t\tuseCallback(\n\t\t\tasync ( caret ) => {\n\t\t\t\tconst textInputOffset = await getTextInputOffset( caret );\n\t\t\t\tconst hasTextInputOffset = textInputOffset !== null;\n\n\t\t\t\tif ( hasTextInputOffset ) {\n\t\t\t\t\tscrollToTextInputOffset( caret, textInputOffset );\n\t\t\t\t}\n\t\t\t},\n\t\t\t[ getTextInputOffset, scrollToTextInputOffset ]\n\t\t),\n\t\t200,\n\t\t{ leading: false }\n\t);\n\n\tuseEffect( () => {\n\t\tonScrollToTextInput( currentCaretData );\n\t}, [ currentCaretData, onScrollToTextInput ] );\n\n\t// When the orientation changes, the ScrollView measurements\n\t// need to be re-calculated.\n\tuseEffect( () => {\n\t\tscrollViewMeasurements.current = null;\n\t}, [ isLandscape ] );\n\n\tconst scrollHandler = useAnimatedScrollHandler( {\n\t\tonScroll: ( event ) => {\n\t\t\tconst { contentOffset } = event;\n\t\t\tscrollViewYOffset.value = contentOffset.y;\n\t\t\tonScroll( event );\n\t\t},\n\t} );\n\n\tconst measureScrollView = useCallback( () => {\n\t\tif ( scrollViewRef.current ) {\n\t\t\tconst scrollRef = scrollViewRef.current.getNativeScrollRef();\n\n\t\t\tscrollRef.measureInWindow( ( _x, y, width, height ) => {\n\t\t\t\tscrollViewMeasurements.current = { y, width, height };\n\t\t\t} );\n\t\t}\n\t}, [] );\n\n\tconst onContentSizeChange = useCallback( () => {\n\t\tonScrollToTextInput( currentCaretData );\n\n\t\t// Sets the first values when the content size changes.\n\t\tif ( ! scrollViewMeasurements.current ) {\n\t\t\tmeasureScrollView();\n\t\t}\n\t}, [ measureScrollView, onScrollToTextInput, currentCaretData ] );\n\n\tconst getRef = useCallback(\n\t\t( ref ) => {\n\t\t\tscrollViewRef.current = ref;\n\t\t\tinnerRef( ref );\n\t\t},\n\t\t[ innerRef ]\n\t);\n\n\t// Adds content insets when the keyboard is opened to have\n\t// extra padding at the bottom.\n\tconst contentInset = { bottom: keyboardOffset };\n\n\tconst style = [ { flex: 1 }, scrollViewStyle ];\n\n\treturn (\n\t\t<AnimatedScrollView\n\t\t\tautomaticallyAdjustContentInsets={ false }\n\t\t\tcontentInset={ contentInset }\n\t\t\tkeyboardShouldPersistTaps=\"handled\"\n\t\t\tonContentSizeChange={ onContentSizeChange }\n\t\t\tonScroll={ scrollHandler }\n\t\t\tref={ getRef }\n\t\t\tscrollEnabled={ scrollEnabled }\n\t\t\tscrollEventThrottle={ 16 }\n\t\t\tstyle={ style }\n\t\t>\n\t\t\t<FlatList { ...props } />\n\t\t</AnimatedScrollView>\n\t);\n};\n\nexport default KeyboardAwareFlatList;\n"]}
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = useKeyboardOffset;
|
|
7
|
+
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
|
|
10
|
+
var _element = require("@wordpress/element");
|
|
11
|
+
|
|
12
|
+
/**
|
|
13
|
+
* External dependencies
|
|
14
|
+
*/
|
|
15
|
+
|
|
16
|
+
/**
|
|
17
|
+
* WordPress dependencies
|
|
18
|
+
*/
|
|
19
|
+
|
|
20
|
+
/**
|
|
21
|
+
* Hook that adds Keyboard listeners to get the offset space
|
|
22
|
+
* when the keyboard is opened, taking into account focused AztecViews.
|
|
23
|
+
*
|
|
24
|
+
* @param {boolean} scrollEnabled Whether the scroll is enabled or not.
|
|
25
|
+
* @param {Function} shouldPreventAutomaticScroll Whether to prevent scrolling when there's a Keyboard offset set.
|
|
26
|
+
* @return {[number]} Keyboard offset.
|
|
27
|
+
*/
|
|
28
|
+
function useKeyboardOffset(scrollEnabled, shouldPreventAutomaticScroll) {
|
|
29
|
+
const [keyboardOffset, setKeyboardOffset] = (0, _element.useState)(0);
|
|
30
|
+
const timeoutRef = (0, _element.useRef)();
|
|
31
|
+
const onKeyboardDidHide = (0, _element.useCallback)(() => {
|
|
32
|
+
if (shouldPreventAutomaticScroll()) {
|
|
33
|
+
clearTimeout(timeoutRef.current);
|
|
34
|
+
return;
|
|
35
|
+
} // A timeout is being used to delay resetting the offset in cases
|
|
36
|
+
// where the focus is changed to a different TextInput.
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
clearTimeout(timeoutRef.current);
|
|
40
|
+
timeoutRef.current = setTimeout(() => {
|
|
41
|
+
setKeyboardOffset(0);
|
|
42
|
+
}, 200);
|
|
43
|
+
}, [shouldPreventAutomaticScroll]);
|
|
44
|
+
const onKeyboardDidShow = (0, _element.useCallback)(_ref => {
|
|
45
|
+
let {
|
|
46
|
+
endCoordinates
|
|
47
|
+
} = _ref;
|
|
48
|
+
clearTimeout(timeoutRef.current);
|
|
49
|
+
setKeyboardOffset(endCoordinates.height);
|
|
50
|
+
}, []);
|
|
51
|
+
const onKeyboardWillShow = (0, _element.useCallback)(() => {
|
|
52
|
+
clearTimeout(timeoutRef.current);
|
|
53
|
+
}, []);
|
|
54
|
+
(0, _element.useEffect)(() => {
|
|
55
|
+
let willShowSubscription;
|
|
56
|
+
let showSubscription;
|
|
57
|
+
let hideSubscription;
|
|
58
|
+
|
|
59
|
+
if (scrollEnabled) {
|
|
60
|
+
willShowSubscription = _reactNative.Keyboard.addListener('keyboardWillShow', onKeyboardWillShow);
|
|
61
|
+
showSubscription = _reactNative.Keyboard.addListener('keyboardDidShow', onKeyboardDidShow);
|
|
62
|
+
hideSubscription = _reactNative.Keyboard.addListener('keyboardDidHide', onKeyboardDidHide);
|
|
63
|
+
} else {
|
|
64
|
+
var _willShowSubscription, _showSubscription, _hideSubscription;
|
|
65
|
+
|
|
66
|
+
(_willShowSubscription = willShowSubscription) === null || _willShowSubscription === void 0 ? void 0 : _willShowSubscription.remove();
|
|
67
|
+
(_showSubscription = showSubscription) === null || _showSubscription === void 0 ? void 0 : _showSubscription.remove();
|
|
68
|
+
(_hideSubscription = hideSubscription) === null || _hideSubscription === void 0 ? void 0 : _hideSubscription.remove();
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
return () => {
|
|
72
|
+
var _willShowSubscription2, _showSubscription2, _hideSubscription2;
|
|
73
|
+
|
|
74
|
+
clearTimeout(timeoutRef.current);
|
|
75
|
+
(_willShowSubscription2 = willShowSubscription) === null || _willShowSubscription2 === void 0 ? void 0 : _willShowSubscription2.remove();
|
|
76
|
+
(_showSubscription2 = showSubscription) === null || _showSubscription2 === void 0 ? void 0 : _showSubscription2.remove();
|
|
77
|
+
(_hideSubscription2 = hideSubscription) === null || _hideSubscription2 === void 0 ? void 0 : _hideSubscription2.remove();
|
|
78
|
+
};
|
|
79
|
+
}, [onKeyboardDidHide, onKeyboardDidShow, onKeyboardWillShow, scrollEnabled]);
|
|
80
|
+
return [keyboardOffset];
|
|
81
|
+
}
|
|
82
|
+
//# sourceMappingURL=use-keyboard-offset.native.js.map
|