@wordpress/components 33.1.1-next.v.202605131006.0 → 34.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +30 -1
- package/build/autocomplete/index.cjs +5 -4
- package/build/autocomplete/index.cjs.map +3 -3
- package/build/border-control/border-control-dropdown/component.cjs +33 -33
- package/build/border-control/border-control-dropdown/component.cjs.map +3 -3
- package/build/box-control/index.cjs +0 -6
- package/build/box-control/index.cjs.map +2 -2
- package/build/box-control/utils.cjs +0 -38
- package/build/box-control/utils.cjs.map +3 -3
- package/build/custom-gradient-picker/gradient-bar/index.cjs.map +2 -2
- package/build/disabled/index.cjs +1 -1
- package/build/disabled/index.cjs.map +2 -2
- package/build/draggable/index.cjs +101 -7
- package/build/draggable/index.cjs.map +3 -3
- package/build/form-token-field/index.cjs +41 -7
- package/build/form-token-field/index.cjs.map +2 -2
- package/build/higher-order/with-notices/index.cjs +3 -15
- package/build/higher-order/with-notices/index.cjs.map +2 -2
- package/build/index.cjs +0 -17
- package/build/index.cjs.map +2 -2
- package/build/input-control/input-base.cjs +31 -34
- package/build/input-control/input-base.cjs.map +2 -2
- package/build/notice/index.cjs +33 -35
- package/build/notice/index.cjs.map +2 -2
- package/build/popover/index.cjs +12 -0
- package/build/popover/index.cjs.map +2 -2
- package/build/responsive-wrapper/index.cjs +4 -3
- package/build/responsive-wrapper/index.cjs.map +2 -2
- package/build/tabs/styles.cjs +5 -5
- package/build/tabs/styles.cjs.map +2 -2
- package/build/tooltip/index.cjs +2 -1
- package/build/tooltip/index.cjs.map +2 -2
- package/build-module/autocomplete/index.mjs +6 -5
- package/build-module/autocomplete/index.mjs.map +2 -2
- package/build-module/border-control/border-control-dropdown/component.mjs +34 -34
- package/build-module/border-control/border-control-dropdown/component.mjs.map +2 -2
- package/build-module/box-control/index.mjs +0 -2
- package/build-module/box-control/index.mjs.map +2 -2
- package/build-module/box-control/utils.mjs +0 -27
- package/build-module/box-control/utils.mjs.map +2 -2
- package/build-module/custom-gradient-picker/gradient-bar/index.mjs.map +2 -2
- package/build-module/disabled/index.mjs +1 -1
- package/build-module/disabled/index.mjs.map +2 -2
- package/build-module/draggable/index.mjs +101 -7
- package/build-module/draggable/index.mjs.map +3 -3
- package/build-module/form-token-field/index.mjs +41 -7
- package/build-module/form-token-field/index.mjs.map +2 -2
- package/build-module/higher-order/with-notices/index.mjs +4 -16
- package/build-module/higher-order/with-notices/index.mjs.map +2 -2
- package/build-module/index.mjs +87 -99
- package/build-module/index.mjs.map +2 -2
- package/build-module/input-control/input-base.mjs +31 -34
- package/build-module/input-control/input-base.mjs.map +2 -2
- package/build-module/notice/index.mjs +34 -36
- package/build-module/notice/index.mjs.map +2 -2
- package/build-module/popover/index.mjs +12 -0
- package/build-module/popover/index.mjs.map +2 -2
- package/build-module/responsive-wrapper/index.mjs +4 -3
- package/build-module/responsive-wrapper/index.mjs.map +2 -2
- package/build-module/tabs/styles.mjs +5 -5
- package/build-module/tabs/styles.mjs.map +2 -2
- package/build-module/tooltip/index.mjs +2 -1
- package/build-module/tooltip/index.mjs.map +2 -2
- package/build-style/style-rtl.css +64 -66
- package/build-style/style.css +64 -66
- package/build-types/autocomplete/index.d.ts.map +1 -1
- package/build-types/badge/stories/e2e/index.story.d.ts +7 -0
- package/build-types/badge/stories/e2e/index.story.d.ts.map +1 -0
- package/build-types/border-box-control/border-box-control/hook.d.ts +24 -10
- package/build-types/border-box-control/border-box-control/hook.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts +26 -12
- package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +24 -10
- package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts +25 -11
- package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts.map +1 -1
- package/build-types/border-control/border-control/hook.d.ts +24 -10
- package/build-types/border-control/border-control/hook.d.ts.map +1 -1
- package/build-types/border-control/border-control-dropdown/component.d.ts.map +1 -1
- package/build-types/border-control/border-control-dropdown/hook.d.ts +23 -9
- package/build-types/border-control/border-control-dropdown/hook.d.ts.map +1 -1
- package/build-types/box-control/index.d.ts +0 -1
- package/build-types/box-control/index.d.ts.map +1 -1
- package/build-types/box-control/styles/box-control-styles.d.ts +3 -4
- package/build-types/box-control/styles/box-control-styles.d.ts.map +1 -1
- package/build-types/box-control/utils.d.ts +0 -13
- package/build-types/box-control/utils.d.ts.map +1 -1
- package/build-types/button/stories/e2e/index.story.d.ts +1 -0
- package/build-types/button/stories/e2e/index.story.d.ts.map +1 -1
- package/build-types/card/card/hook.d.ts +25 -11
- package/build-types/card/card/hook.d.ts.map +1 -1
- package/build-types/card/card-body/hook.d.ts +25 -11
- package/build-types/card/card-body/hook.d.ts.map +1 -1
- package/build-types/card/card-divider/hook.d.ts +26 -12
- package/build-types/card/card-divider/hook.d.ts.map +1 -1
- package/build-types/card/card-footer/hook.d.ts +25 -11
- package/build-types/card/card-footer/hook.d.ts.map +1 -1
- package/build-types/card/card-header/hook.d.ts +25 -11
- package/build-types/card/card-header/hook.d.ts.map +1 -1
- package/build-types/card/card-media/hook.d.ts +25 -11
- package/build-types/card/card-media/hook.d.ts.map +1 -1
- package/build-types/color-picker/styles.d.ts +3 -4
- package/build-types/color-picker/styles.d.ts.map +1 -1
- package/build-types/composite/stories/index.story.d.ts.map +1 -1
- package/build-types/custom-gradient-picker/gradient-bar/index.d.ts.map +1 -1
- package/build-types/custom-select-control-v2/styles.d.ts +4 -12
- package/build-types/custom-select-control-v2/styles.d.ts.map +1 -1
- package/build-types/date-time/time-picker/styles.d.ts +4 -4
- package/build-types/draggable/index.d.ts.map +1 -1
- package/build-types/draggable/stories/index.story.d.ts +4 -5
- package/build-types/draggable/stories/index.story.d.ts.map +1 -1
- package/build-types/draggable/types.d.ts +4 -0
- package/build-types/draggable/types.d.ts.map +1 -1
- package/build-types/elevation/hook.d.ts +25 -11
- package/build-types/elevation/hook.d.ts.map +1 -1
- package/build-types/flex/flex/hook.d.ts +25 -11
- package/build-types/flex/flex/hook.d.ts.map +1 -1
- package/build-types/flex/flex-block/hook.d.ts +25 -11
- package/build-types/flex/flex-block/hook.d.ts.map +1 -1
- package/build-types/flex/flex-item/hook.d.ts +25 -11
- package/build-types/flex/flex-item/hook.d.ts.map +1 -1
- package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts +1 -1
- package/build-types/form-token-field/index.d.ts.map +1 -1
- package/build-types/grid/hook.d.ts +25 -11
- package/build-types/grid/hook.d.ts.map +1 -1
- package/build-types/h-stack/hook.d.ts +25 -11
- package/build-types/h-stack/hook.d.ts.map +1 -1
- package/build-types/heading/hook.d.ts +25 -11
- package/build-types/heading/hook.d.ts.map +1 -1
- package/build-types/higher-order/with-fallback-styles/index.d.ts +1 -3
- package/build-types/higher-order/with-filters/index.d.ts +1 -6
- package/build-types/higher-order/with-filters/index.d.ts.map +1 -1
- package/build-types/higher-order/with-notices/index.d.ts +2 -4
- package/build-types/higher-order/with-notices/index.d.ts.map +1 -1
- package/build-types/icon/stories/index.story.d.ts +0 -6
- package/build-types/icon/stories/index.story.d.ts.map +1 -1
- package/build-types/index.d.ts +1 -6
- package/build-types/index.d.ts.map +1 -1
- package/build-types/input-control/reducer/reducer.d.ts +1 -1
- package/build-types/item-group/item/hook.d.ts +25 -11
- package/build-types/item-group/item/hook.d.ts.map +1 -1
- package/build-types/item-group/item-group/hook.d.ts +25 -11
- package/build-types/item-group/item-group/hook.d.ts.map +1 -1
- package/build-types/menu/stories/index.story.d.ts.map +1 -1
- package/build-types/menu/styles.d.ts +7 -21
- package/build-types/menu/styles.d.ts.map +1 -1
- package/build-types/modal/use-modal-exit-animation.d.ts +1 -1
- package/build-types/navigator/navigator-back-button/hook.d.ts +26 -12
- package/build-types/navigator/navigator-back-button/hook.d.ts.map +1 -1
- package/build-types/navigator/navigator-button/hook.d.ts +26 -12
- package/build-types/navigator/navigator-button/hook.d.ts.map +1 -1
- package/build-types/notice/index.d.ts.map +1 -1
- package/build-types/notice/types.d.ts +1 -2
- package/build-types/notice/types.d.ts.map +1 -1
- package/build-types/number-control/index.d.ts +1 -1
- package/build-types/number-control/index.d.ts.map +1 -1
- package/build-types/number-control/stories/index.story.d.ts +1 -1
- package/build-types/number-control/stories/index.story.d.ts.map +1 -1
- package/build-types/popover/index.d.ts.map +1 -1
- package/build-types/popover/types.d.ts +2 -2
- package/build-types/popover/types.d.ts.map +1 -1
- package/build-types/range-control/index.d.ts +2 -3
- package/build-types/range-control/index.d.ts.map +1 -1
- package/build-types/range-control/stories/index.story.d.ts.map +1 -1
- package/build-types/range-control/styles/range-control-styles.d.ts +1 -1
- package/build-types/range-control/types.d.ts +1 -5
- package/build-types/range-control/types.d.ts.map +1 -1
- package/build-types/responsive-wrapper/index.d.ts.map +1 -1
- package/build-types/scrollable/hook.d.ts +25 -11
- package/build-types/scrollable/hook.d.ts.map +1 -1
- package/build-types/snackbar/index.d.ts +2 -2
- package/build-types/snackbar/types.d.ts +2 -2
- package/build-types/snackbar/types.d.ts.map +1 -1
- package/build-types/spacer/hook.d.ts +25 -11
- package/build-types/spacer/hook.d.ts.map +1 -1
- package/build-types/surface/hook.d.ts +25 -11
- package/build-types/surface/hook.d.ts.map +1 -1
- package/build-types/tab-panel/stories/index.story.d.ts +0 -6
- package/build-types/tab-panel/stories/index.story.d.ts.map +1 -1
- package/build-types/tabs/stories/index.story.d.ts +0 -6
- package/build-types/tabs/stories/index.story.d.ts.map +1 -1
- package/build-types/tabs/styles.d.ts +3 -9
- package/build-types/tabs/styles.d.ts.map +1 -1
- package/build-types/text/hook.d.ts +25 -11
- package/build-types/text/hook.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel/hook.d.ts +25 -11
- package/build-types/tools-panel/tools-panel/hook.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel-header/hook.d.ts +25 -11
- package/build-types/tools-panel/tools-panel-header/hook.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel-item/hook.d.ts +25 -11
- package/build-types/tools-panel/tools-panel-item/hook.d.ts.map +1 -1
- package/build-types/tooltip/index.d.ts.map +1 -1
- package/build-types/truncate/hook.d.ts +25 -11
- package/build-types/truncate/hook.d.ts.map +1 -1
- package/build-types/unit-control/index.d.ts +1 -1
- package/build-types/unit-control/index.d.ts.map +1 -1
- package/build-types/unit-control/styles/unit-control-styles.d.ts +1 -1
- package/build-types/utils/get-node-text.d.ts.map +1 -1
- package/build-types/v-stack/hook.d.ts +25 -11
- package/build-types/v-stack/hook.d.ts.map +1 -1
- package/build-types/validated-form-controls/components/number-control.d.ts +1 -1
- package/build-types/validated-form-controls/components/number-control.d.ts.map +1 -1
- package/build-types/validated-form-controls/components/range-control.d.ts +2 -3
- package/build-types/validated-form-controls/components/range-control.d.ts.map +1 -1
- package/build-types/validated-form-controls/control-with-error.d.ts +4 -1
- package/build-types/validated-form-controls/control-with-error.d.ts.map +1 -1
- package/package.json +27 -25
- package/src/autocomplete/README.md +1 -1
- package/src/autocomplete/index.tsx +25 -7
- package/src/badge/stories/e2e/index.story.tsx +21 -0
- package/src/border-control/border-control-dropdown/component.tsx +36 -37
- package/src/box-control/index.tsx +0 -1
- package/src/box-control/utils.ts +0 -43
- package/src/button/stories/e2e/index.story.tsx +11 -0
- package/src/composite/stories/index.story.tsx +0 -1
- package/src/custom-gradient-picker/gradient-bar/index.tsx +1 -1
- package/src/disabled/index.tsx +1 -1
- package/src/draggable/index.tsx +32 -10
- package/src/draggable/stories/index.story.tsx +11 -6
- package/src/draggable/style.module.scss +29 -0
- package/src/draggable/types.ts +4 -0
- package/src/form-file-upload/README.md +1 -1
- package/src/form-token-field/index.tsx +84 -8
- package/src/form-token-field/test/index.tsx +189 -0
- package/src/h-stack/hook.tsx +1 -1
- package/src/higher-order/with-notices/index.tsx +4 -21
- package/src/higher-order/with-notices/test/index.tsx +0 -18
- package/src/icon/stories/index.story.tsx +2 -14
- package/src/index.ts +0 -6
- package/src/input-control/input-base.tsx +2 -2
- package/src/menu/README.md +7 -7
- package/src/menu/stories/index.story.tsx +0 -1
- package/src/menu/test/index.tsx +9 -4
- package/src/modal/style.scss +2 -1
- package/src/notice/README.md +1 -2
- package/src/notice/index.tsx +57 -64
- package/src/notice/style.scss +49 -41
- package/src/notice/test/__snapshots__/index.tsx.snap +23 -23
- package/src/notice/test/index.tsx +5 -5
- package/src/notice/types.ts +1 -2
- package/src/popover/index.tsx +29 -1
- package/src/popover/test/index.tsx +138 -1
- package/src/popover/types.ts +2 -4
- package/src/range-control/stories/index.story.tsx +0 -1
- package/src/range-control/types.ts +1 -5
- package/src/responsive-wrapper/index.tsx +7 -3
- package/src/snackbar/README.md +1 -1
- package/src/snackbar/types.ts +2 -2
- package/src/style.scss +0 -1
- package/src/tab-panel/stories/index.story.tsx +2 -13
- package/src/tab-panel/style.scss +36 -14
- package/src/tabs/README.md +1 -1
- package/src/tabs/stories/index.story.tsx +2 -14
- package/src/tabs/styles.ts +3 -8
- package/src/tabs/tablist.tsx +1 -1
- package/src/tooltip/index.tsx +7 -1
- package/src/tree-grid/test/cell.tsx +0 -1
- package/src/tree-grid/test/roving-tab-index-item.tsx +0 -1
- package/src/tree-select/README.md +1 -1
- package/src/utils/get-node-text.ts +7 -1
- package/src/validated-form-controls/control-with-error.tsx +6 -1
- package/build/navigation/back-button/index.cjs +0 -86
- package/build/navigation/back-button/index.cjs.map +0 -7
- package/build/navigation/constants.cjs +0 -34
- package/build/navigation/constants.cjs.map +0 -7
- package/build/navigation/context.cjs +0 -58
- package/build/navigation/context.cjs.map +0 -7
- package/build/navigation/group/context.cjs +0 -38
- package/build/navigation/group/context.cjs.map +0 -7
- package/build/navigation/group/index.cjs +0 -88
- package/build/navigation/group/index.cjs.map +0 -7
- package/build/navigation/index.cjs +0 -113
- package/build/navigation/index.cjs.map +0 -7
- package/build/navigation/item/base-content.cjs +0 -44
- package/build/navigation/item/base-content.cjs.map +0 -7
- package/build/navigation/item/base.cjs +0 -66
- package/build/navigation/item/base.cjs.map +0 -7
- package/build/navigation/item/index.cjs +0 -119
- package/build/navigation/item/index.cjs.map +0 -7
- package/build/navigation/item/use-navigation-tree-item.cjs +0 -64
- package/build/navigation/item/use-navigation-tree-item.cjs.map +0 -7
- package/build/navigation/menu/context.cjs +0 -39
- package/build/navigation/menu/context.cjs.map +0 -7
- package/build/navigation/menu/index.cjs +0 -114
- package/build/navigation/menu/index.cjs.map +0 -7
- package/build/navigation/menu/menu-title-search.cjs +0 -111
- package/build/navigation/menu/menu-title-search.cjs.map +0 -7
- package/build/navigation/menu/menu-title.cjs +0 -104
- package/build/navigation/menu/menu-title.cjs.map +0 -7
- package/build/navigation/menu/search-no-results-found.cjs +0 -48
- package/build/navigation/menu/search-no-results-found.cjs.map +0 -7
- package/build/navigation/menu/use-navigation-tree-menu.cjs +0 -51
- package/build/navigation/menu/use-navigation-tree-menu.cjs.map +0 -7
- package/build/navigation/styles/navigation-styles.cjs +0 -170
- package/build/navigation/styles/navigation-styles.cjs.map +0 -7
- package/build/navigation/types.cjs +0 -19
- package/build/navigation/types.cjs.map +0 -7
- package/build/navigation/use-create-navigation-tree.cjs +0 -103
- package/build/navigation/use-create-navigation-tree.cjs.map +0 -7
- package/build/navigation/use-navigation-tree-nodes.cjs +0 -60
- package/build/navigation/use-navigation-tree-nodes.cjs.map +0 -7
- package/build/navigation/utils.cjs +0 -45
- package/build/navigation/utils.cjs.map +0 -7
- package/build-module/navigation/back-button/index.mjs +0 -51
- package/build-module/navigation/back-button/index.mjs.map +0 -7
- package/build-module/navigation/constants.mjs +0 -8
- package/build-module/navigation/constants.mjs.map +0 -7
- package/build-module/navigation/context.mjs +0 -32
- package/build-module/navigation/context.mjs.map +0 -7
- package/build-module/navigation/group/context.mjs +0 -12
- package/build-module/navigation/group/context.mjs.map +0 -7
- package/build-module/navigation/group/index.mjs +0 -53
- package/build-module/navigation/group/index.mjs.map +0 -7
- package/build-module/navigation/index.mjs +0 -78
- package/build-module/navigation/index.mjs.map +0 -7
- package/build-module/navigation/item/base-content.mjs +0 -23
- package/build-module/navigation/item/base-content.mjs.map +0 -7
- package/build-module/navigation/item/base.mjs +0 -35
- package/build-module/navigation/item/base.mjs.map +0 -7
- package/build-module/navigation/item/index.mjs +0 -84
- package/build-module/navigation/item/index.mjs.map +0 -7
- package/build-module/navigation/item/use-navigation-tree-item.mjs +0 -39
- package/build-module/navigation/item/use-navigation-tree-item.mjs.map +0 -7
- package/build-module/navigation/menu/context.mjs +0 -13
- package/build-module/navigation/menu/context.mjs.map +0 -7
- package/build-module/navigation/menu/index.mjs +0 -79
- package/build-module/navigation/menu/index.mjs.map +0 -7
- package/build-module/navigation/menu/menu-title-search.mjs +0 -80
- package/build-module/navigation/menu/menu-title-search.mjs.map +0 -7
- package/build-module/navigation/menu/menu-title.mjs +0 -73
- package/build-module/navigation/menu/menu-title.mjs.map +0 -7
- package/build-module/navigation/menu/search-no-results-found.mjs +0 -27
- package/build-module/navigation/menu/search-no-results-found.mjs.map +0 -7
- package/build-module/navigation/menu/use-navigation-tree-menu.mjs +0 -26
- package/build-module/navigation/menu/use-navigation-tree-menu.mjs.map +0 -7
- package/build-module/navigation/styles/navigation-styles.mjs +0 -124
- package/build-module/navigation/styles/navigation-styles.mjs.map +0 -7
- package/build-module/navigation/types.mjs +0 -1
- package/build-module/navigation/types.mjs.map +0 -7
- package/build-module/navigation/use-create-navigation-tree.mjs +0 -78
- package/build-module/navigation/use-create-navigation-tree.mjs.map +0 -7
- package/build-module/navigation/use-navigation-tree-nodes.mjs +0 -35
- package/build-module/navigation/use-navigation-tree-nodes.mjs.map +0 -7
- package/build-module/navigation/utils.mjs +0 -9
- package/build-module/navigation/utils.mjs.map +0 -7
- package/build-types/navigation/back-button/index.d.ts +0 -7
- package/build-types/navigation/back-button/index.d.ts.map +0 -1
- package/build-types/navigation/constants.d.ts +0 -3
- package/build-types/navigation/constants.d.ts.map +0 -1
- package/build-types/navigation/context.d.ts +0 -4
- package/build-types/navigation/context.d.ts.map +0 -1
- package/build-types/navigation/group/context.d.ts +0 -7
- package/build-types/navigation/group/context.d.ts.map +0 -1
- package/build-types/navigation/group/index.d.ts +0 -7
- package/build-types/navigation/group/index.d.ts.map +0 -1
- package/build-types/navigation/index.d.ts +0 -46
- package/build-types/navigation/index.d.ts.map +0 -1
- package/build-types/navigation/item/base-content.d.ts +0 -3
- package/build-types/navigation/item/base-content.d.ts.map +0 -1
- package/build-types/navigation/item/base.d.ts +0 -3
- package/build-types/navigation/item/base.d.ts.map +0 -1
- package/build-types/navigation/item/index.d.ts +0 -7
- package/build-types/navigation/item/index.d.ts.map +0 -1
- package/build-types/navigation/item/use-navigation-tree-item.d.ts +0 -3
- package/build-types/navigation/item/use-navigation-tree-item.d.ts.map +0 -1
- package/build-types/navigation/menu/context.d.ts +0 -7
- package/build-types/navigation/menu/context.d.ts.map +0 -1
- package/build-types/navigation/menu/index.d.ts +0 -7
- package/build-types/navigation/menu/index.d.ts.map +0 -1
- package/build-types/navigation/menu/menu-title-search.d.ts +0 -3
- package/build-types/navigation/menu/menu-title-search.d.ts.map +0 -1
- package/build-types/navigation/menu/menu-title.d.ts +0 -3
- package/build-types/navigation/menu/menu-title.d.ts.map +0 -1
- package/build-types/navigation/menu/search-no-results-found.d.ts +0 -3
- package/build-types/navigation/menu/search-no-results-found.d.ts.map +0 -1
- package/build-types/navigation/menu/use-navigation-tree-menu.d.ts +0 -3
- package/build-types/navigation/menu/use-navigation-tree-menu.d.ts.map +0 -1
- package/build-types/navigation/stories/index.story.d.ts +0 -23
- package/build-types/navigation/stories/index.story.d.ts.map +0 -1
- package/build-types/navigation/stories/utils/controlled-state.d.ts +0 -7
- package/build-types/navigation/stories/utils/controlled-state.d.ts.map +0 -1
- package/build-types/navigation/stories/utils/default.d.ts +0 -10
- package/build-types/navigation/stories/utils/default.d.ts.map +0 -1
- package/build-types/navigation/stories/utils/group.d.ts +0 -10
- package/build-types/navigation/stories/utils/group.d.ts.map +0 -1
- package/build-types/navigation/stories/utils/hide-if-empty.d.ts +0 -10
- package/build-types/navigation/stories/utils/hide-if-empty.d.ts.map +0 -1
- package/build-types/navigation/stories/utils/more-examples.d.ts +0 -10
- package/build-types/navigation/stories/utils/more-examples.d.ts.map +0 -1
- package/build-types/navigation/stories/utils/search.d.ts +0 -10
- package/build-types/navigation/stories/utils/search.d.ts.map +0 -1
- package/build-types/navigation/styles/navigation-styles.d.ts +0 -55
- package/build-types/navigation/styles/navigation-styles.d.ts.map +0 -1
- package/build-types/navigation/test/index.d.ts +0 -2
- package/build-types/navigation/test/index.d.ts.map +0 -1
- package/build-types/navigation/types.d.ts +0 -266
- package/build-types/navigation/types.d.ts.map +0 -1
- package/build-types/navigation/use-create-navigation-tree.d.ts +0 -15
- package/build-types/navigation/use-create-navigation-tree.d.ts.map +0 -1
- package/build-types/navigation/use-navigation-tree-nodes.d.ts +0 -10
- package/build-types/navigation/use-navigation-tree-nodes.d.ts.map +0 -1
- package/build-types/navigation/utils.d.ts +0 -3
- package/build-types/navigation/utils.d.ts.map +0 -1
- package/src/draggable/style.scss +0 -21
- package/src/navigation/README.md +0 -267
- package/src/navigation/back-button/index.tsx +0 -73
- package/src/navigation/constants.tsx +0 -2
- package/src/navigation/context.tsx +0 -40
- package/src/navigation/group/context.tsx +0 -16
- package/src/navigation/group/index.tsx +0 -73
- package/src/navigation/index.tsx +0 -152
- package/src/navigation/item/base-content.tsx +0 -31
- package/src/navigation/item/base.tsx +0 -42
- package/src/navigation/item/index.tsx +0 -112
- package/src/navigation/item/use-navigation-tree-item.tsx +0 -47
- package/src/navigation/menu/context.tsx +0 -20
- package/src/navigation/menu/index.tsx +0 -105
- package/src/navigation/menu/menu-title-search.tsx +0 -99
- package/src/navigation/menu/menu-title.tsx +0 -100
- package/src/navigation/menu/search-no-results-found.tsx +0 -34
- package/src/navigation/menu/use-navigation-tree-menu.tsx +0 -29
- package/src/navigation/stories/index.story.tsx +0 -62
- package/src/navigation/stories/style.css +0 -25
- package/src/navigation/stories/utils/controlled-state.tsx +0 -149
- package/src/navigation/stories/utils/default.tsx +0 -92
- package/src/navigation/stories/utils/group.tsx +0 -61
- package/src/navigation/stories/utils/hide-if-empty.tsx +0 -66
- package/src/navigation/stories/utils/more-examples.tsx +0 -162
- package/src/navigation/stories/utils/search.tsx +0 -91
- package/src/navigation/styles/navigation-styles.tsx +0 -197
- package/src/navigation/test/index.tsx +0 -347
- package/src/navigation/types.ts +0 -325
- package/src/navigation/use-create-navigation-tree.tsx +0 -110
- package/src/navigation/use-navigation-tree-nodes.tsx +0 -31
- package/src/navigation/utils.tsx +0 -11
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/disabled/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { disabledStyles } from './styles/disabled-styles';\nimport { useCx } from '../utils';\nimport Context from './context';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst {\n Consumer,\n Provider\n} = Context;\n\n/**\n * `Disabled` is a component which disables descendant tabbable elements and\n * prevents pointer interaction.\n *\n * _Note: this component may not behave as expected in browsers that don't\n * support the `inert` HTML attribute. We recommend adding the official WICG\n * polyfill when using this component in your project._\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n *\n * ```jsx\n * import { Button, Disabled, TextControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDisabled = () => {\n * \tconst [ isDisabled, setIsDisabled ] = useState( true );\n *\n *\tlet input = (\n *\t\t<TextControl\n *\t\t\t__next40pxDefaultSize\n *\t\t\tlabel=\"Input\"\n *\t\t\tonChange={ () => {} }\n *\t\t/>\n *\t);\n * \tif ( isDisabled ) {\n * \t\tinput = <Disabled>{ input }</Disabled>;\n * \t}\n *\n * \tconst toggleDisabled = () => {\n * \t\tsetIsDisabled( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<div>\n * \t\t\t{ input }\n * \t\t\t<Button variant=\"primary\" onClick={ toggleDisabled }>\n * \t\t\t\tToggle Disabled\n * \t\t\t</Button>\n * \t\t</div>\n * \t);\n * };\n * ```\n */\nfunction Disabled({\n className,\n children,\n isDisabled = true,\n ...props\n}) {\n const cx = useCx();\n return /*#__PURE__*/_jsx(Provider, {\n value: isDisabled,\n children: /*#__PURE__*/_jsx(\"div\", {\n // @ts-ignore Reason: inert is a recent HTML attribute\n inert: isDisabled ?
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAA+B;AAC/B,mBAAsB;AACtB,qBAAoB;AACpB,yBAA4B;AAC5B,IAAM;AAAA,EACJ;AAAA,EACA;AACF,IAAI,eAAAA;AA6CJ,SAAS,SAAS;AAAA,EAChB;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,GAAG;AACL,GAAG;AACD,QAAM,SAAK,oBAAM;AACjB,SAAoB,uCAAAC,KAAK,UAAU;AAAA,IACjC,OAAO;AAAA,IACP,UAAuB,uCAAAA,KAAK,OAAO;AAAA;AAAA,MAEjC,OAAO,aAAa,
|
|
4
|
+
"sourcesContent": ["import { disabledStyles } from './styles/disabled-styles';\nimport { useCx } from '../utils';\nimport Context from './context';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst {\n Consumer,\n Provider\n} = Context;\n\n/**\n * `Disabled` is a component which disables descendant tabbable elements and\n * prevents pointer interaction.\n *\n * _Note: this component may not behave as expected in browsers that don't\n * support the `inert` HTML attribute. We recommend adding the official WICG\n * polyfill when using this component in your project._\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n *\n * ```jsx\n * import { Button, Disabled, TextControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDisabled = () => {\n * \tconst [ isDisabled, setIsDisabled ] = useState( true );\n *\n *\tlet input = (\n *\t\t<TextControl\n *\t\t\t__next40pxDefaultSize\n *\t\t\tlabel=\"Input\"\n *\t\t\tonChange={ () => {} }\n *\t\t/>\n *\t);\n * \tif ( isDisabled ) {\n * \t\tinput = <Disabled>{ input }</Disabled>;\n * \t}\n *\n * \tconst toggleDisabled = () => {\n * \t\tsetIsDisabled( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<div>\n * \t\t\t{ input }\n * \t\t\t<Button variant=\"primary\" onClick={ toggleDisabled }>\n * \t\t\t\tToggle Disabled\n * \t\t\t</Button>\n * \t\t</div>\n * \t);\n * };\n * ```\n */\nfunction Disabled({\n className,\n children,\n isDisabled = true,\n ...props\n}) {\n const cx = useCx();\n return /*#__PURE__*/_jsx(Provider, {\n value: isDisabled,\n children: /*#__PURE__*/_jsx(\"div\", {\n // @ts-ignore Reason: inert is a recent HTML attribute\n inert: isDisabled ? true : undefined,\n className: isDisabled ? cx(disabledStyles, className, 'components-disabled') : undefined,\n ...props,\n children: children\n })\n });\n}\nDisabled.Context = Context;\nDisabled.Consumer = Consumer;\nexport default Disabled;"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAA+B;AAC/B,mBAAsB;AACtB,qBAAoB;AACpB,yBAA4B;AAC5B,IAAM;AAAA,EACJ;AAAA,EACA;AACF,IAAI,eAAAA;AA6CJ,SAAS,SAAS;AAAA,EAChB;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,GAAG;AACL,GAAG;AACD,QAAM,SAAK,oBAAM;AACjB,SAAoB,uCAAAC,KAAK,UAAU;AAAA,IACjC,OAAO;AAAA,IACP,UAAuB,uCAAAA,KAAK,OAAO;AAAA;AAAA,MAEjC,OAAO,aAAa,OAAO;AAAA,MAC3B,WAAW,aAAa,GAAG,uCAAgB,WAAW,qBAAqB,IAAI;AAAA,MAC/E,GAAG;AAAA,MACH;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACH;AACA,SAAS,UAAU,eAAAD;AACnB,SAAS,WAAW;AACpB,IAAO,mBAAQ;",
|
|
6
6
|
"names": ["Context", "_jsx"]
|
|
7
7
|
}
|
|
@@ -26,11 +26,97 @@ __export(draggable_exports, {
|
|
|
26
26
|
module.exports = __toCommonJS(draggable_exports);
|
|
27
27
|
var import_compose = require("@wordpress/compose");
|
|
28
28
|
var import_element = require("@wordpress/element");
|
|
29
|
+
var import_ui = require("@wordpress/ui");
|
|
30
|
+
|
|
31
|
+
// packages/style-runtime/src/index.ts
|
|
32
|
+
var STYLE_HASH_ATTRIBUTE = "data-wp-hash";
|
|
33
|
+
function getRuntime() {
|
|
34
|
+
const globalScope = globalThis;
|
|
35
|
+
if (globalScope.__wpStyleRuntime) {
|
|
36
|
+
return globalScope.__wpStyleRuntime;
|
|
37
|
+
}
|
|
38
|
+
globalScope.__wpStyleRuntime = {
|
|
39
|
+
documents: /* @__PURE__ */ new Map(),
|
|
40
|
+
styles: /* @__PURE__ */ new Map(),
|
|
41
|
+
injectedStyles: /* @__PURE__ */ new WeakMap()
|
|
42
|
+
};
|
|
43
|
+
if (typeof document !== "undefined") {
|
|
44
|
+
registerDocument(document);
|
|
45
|
+
}
|
|
46
|
+
return globalScope.__wpStyleRuntime;
|
|
47
|
+
}
|
|
48
|
+
function documentContainsStyleHash(targetDocument, hash) {
|
|
49
|
+
if (!targetDocument.head) {
|
|
50
|
+
return false;
|
|
51
|
+
}
|
|
52
|
+
for (const style of targetDocument.head.querySelectorAll(`style[${STYLE_HASH_ATTRIBUTE}]`)) {
|
|
53
|
+
if (style.getAttribute(STYLE_HASH_ATTRIBUTE) === hash) {
|
|
54
|
+
return true;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
return false;
|
|
58
|
+
}
|
|
59
|
+
function injectStyle(targetDocument, hash, css) {
|
|
60
|
+
if (!targetDocument.head) {
|
|
61
|
+
return;
|
|
62
|
+
}
|
|
63
|
+
const runtime = getRuntime();
|
|
64
|
+
let injectedStyles = runtime.injectedStyles.get(targetDocument);
|
|
65
|
+
if (!injectedStyles) {
|
|
66
|
+
injectedStyles = /* @__PURE__ */ new Set();
|
|
67
|
+
runtime.injectedStyles.set(targetDocument, injectedStyles);
|
|
68
|
+
}
|
|
69
|
+
if (injectedStyles.has(hash)) {
|
|
70
|
+
return;
|
|
71
|
+
}
|
|
72
|
+
if (documentContainsStyleHash(targetDocument, hash)) {
|
|
73
|
+
injectedStyles.add(hash);
|
|
74
|
+
return;
|
|
75
|
+
}
|
|
76
|
+
const style = targetDocument.createElement("style");
|
|
77
|
+
style.setAttribute(STYLE_HASH_ATTRIBUTE, hash);
|
|
78
|
+
style.appendChild(targetDocument.createTextNode(css));
|
|
79
|
+
targetDocument.head.appendChild(style);
|
|
80
|
+
injectedStyles.add(hash);
|
|
81
|
+
}
|
|
82
|
+
function registerDocument(targetDocument) {
|
|
83
|
+
const runtime = getRuntime();
|
|
84
|
+
runtime.documents.set(targetDocument, (runtime.documents.get(targetDocument) ?? 0) + 1);
|
|
85
|
+
for (const [hash, css] of runtime.styles) {
|
|
86
|
+
injectStyle(targetDocument, hash, css);
|
|
87
|
+
}
|
|
88
|
+
return () => {
|
|
89
|
+
const count = runtime.documents.get(targetDocument);
|
|
90
|
+
if (count === void 0) {
|
|
91
|
+
return;
|
|
92
|
+
}
|
|
93
|
+
if (count <= 1) {
|
|
94
|
+
runtime.documents.delete(targetDocument);
|
|
95
|
+
return;
|
|
96
|
+
}
|
|
97
|
+
runtime.documents.set(targetDocument, count - 1);
|
|
98
|
+
};
|
|
99
|
+
}
|
|
100
|
+
function registerStyle(hash, css) {
|
|
101
|
+
const runtime = getRuntime();
|
|
102
|
+
runtime.styles.set(hash, css);
|
|
103
|
+
for (const targetDocument of runtime.documents.keys()) {
|
|
104
|
+
injectStyle(targetDocument, hash, css);
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
// packages/components/src/draggable/style.module.scss
|
|
109
|
+
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") {
|
|
110
|
+
registerStyle("f8d1257e92", "._3476c2e530687f96__invisible-drag-image{height:50px;left:-1000px;position:fixed;width:50px}._6f00e51ab7574306__clone{background:#0000;padding:0;pointer-events:none;position:fixed}._6f00e51ab7574306__clone:not(._664ecd37377558df__is-in-compat-slot){z-index:1000000000}body.is-dragging-components-draggable{cursor:move;cursor:grabbing!important}");
|
|
111
|
+
}
|
|
112
|
+
var style_module_default = { "invisible-drag-image": "_3476c2e530687f96__invisible-drag-image", "clone": "_6f00e51ab7574306__clone", "is-in-compat-slot": "_664ecd37377558df__is-in-compat-slot" };
|
|
113
|
+
|
|
114
|
+
// packages/components/src/draggable/index.tsx
|
|
29
115
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
30
|
-
var
|
|
31
|
-
var
|
|
32
|
-
var clonePadding = 0;
|
|
116
|
+
var dragImageClasses = [style_module_default["invisible-drag-image"], "components-draggable__invisible-drag-image"].filter(Boolean);
|
|
117
|
+
var cloneWrapperClasses = [style_module_default.clone, "components-draggable__clone"].filter(Boolean);
|
|
33
118
|
var bodyClass = "is-dragging-components-draggable";
|
|
119
|
+
var clonePadding = 0;
|
|
34
120
|
function Draggable({
|
|
35
121
|
children,
|
|
36
122
|
onDragStart,
|
|
@@ -57,17 +143,23 @@ function Draggable({
|
|
|
57
143
|
const {
|
|
58
144
|
ownerDocument
|
|
59
145
|
} = event.target;
|
|
146
|
+
const slot = (0, import_ui.getWpCompatOverlaySlot)();
|
|
147
|
+
const compatSlot = slot?.ownerDocument === ownerDocument ? slot : null;
|
|
60
148
|
event.dataTransfer.setData(transferDataType, JSON.stringify(transferData));
|
|
61
149
|
const cloneWrapper = ownerDocument.createElement("div");
|
|
62
150
|
cloneWrapper.style.top = "0";
|
|
63
151
|
cloneWrapper.style.left = "0";
|
|
64
152
|
const dragImage = ownerDocument.createElement("div");
|
|
65
153
|
if ("function" === typeof event.dataTransfer.setDragImage) {
|
|
66
|
-
dragImage.classList.add(
|
|
154
|
+
dragImage.classList.add(...dragImageClasses);
|
|
67
155
|
ownerDocument.body.appendChild(dragImage);
|
|
68
156
|
event.dataTransfer.setDragImage(dragImage, 0, 0);
|
|
69
157
|
}
|
|
70
|
-
cloneWrapper.classList.add(
|
|
158
|
+
cloneWrapper.classList.add(...cloneWrapperClasses);
|
|
159
|
+
const inSlotClass = style_module_default["is-in-compat-slot"];
|
|
160
|
+
if (compatSlot && inSlotClass) {
|
|
161
|
+
cloneWrapper.classList.add(inSlotClass);
|
|
162
|
+
}
|
|
71
163
|
if (cloneClassname) {
|
|
72
164
|
cloneWrapper.classList.add(cloneClassname);
|
|
73
165
|
}
|
|
@@ -80,7 +172,7 @@ function Draggable({
|
|
|
80
172
|
const clonedDragComponent = ownerDocument.createElement("div");
|
|
81
173
|
clonedDragComponent.innerHTML = dragComponentRef.current.innerHTML;
|
|
82
174
|
cloneWrapper.appendChild(clonedDragComponent);
|
|
83
|
-
ownerDocument.body.appendChild(cloneWrapper);
|
|
175
|
+
(compatSlot ?? ownerDocument.body).appendChild(cloneWrapper);
|
|
84
176
|
} else {
|
|
85
177
|
const element = ownerDocument.getElementById(elementId);
|
|
86
178
|
const elementRect = element.getBoundingClientRect();
|
|
@@ -95,7 +187,9 @@ function Draggable({
|
|
|
95
187
|
cloneWrapper.style.transform = `translate( ${x}px, ${y}px )`;
|
|
96
188
|
Array.from(clone.querySelectorAll("iframe")).forEach((child) => child.parentNode?.removeChild(child));
|
|
97
189
|
cloneWrapper.appendChild(clone);
|
|
98
|
-
if (
|
|
190
|
+
if (compatSlot) {
|
|
191
|
+
compatSlot.appendChild(cloneWrapper);
|
|
192
|
+
} else if (appendToOwnerDocument) {
|
|
99
193
|
ownerDocument.body.appendChild(cloneWrapper);
|
|
100
194
|
} else {
|
|
101
195
|
elementWrapper?.appendChild(cloneWrapper);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../src/draggable/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\n\n/**\n * WordPress dependencies\n */\nimport { throttle } from '@wordpress/compose';\nimport { useEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst dragImageClass = 'components-draggable__invisible-drag-image';\nconst cloneWrapperClass = 'components-draggable__clone';\nconst clonePadding = 0;\nconst bodyClass = 'is-dragging-components-draggable';\n\n/**\n * `Draggable` is a Component that provides a way to set up a cross-browser\n * (including IE) customizable drag image and the transfer data for the drag\n * event. It decouples the drag handle and the element to drag: use it by\n * wrapping the component that will become the drag handle and providing the DOM\n * ID of the element to drag.\n *\n * Note that the drag handle needs to declare the `draggable=\"true\"` property\n * and bind the `Draggable`s `onDraggableStart` and `onDraggableEnd` event\n * handlers to its own `onDragStart` and `onDragEnd` respectively. `Draggable`\n * takes care of the logic to setup the drag image and the transfer data, but is\n * not concerned with creating an actual DOM element that is draggable.\n *\n * ```jsx\n * import { Draggable, Panel, PanelBody } from '@wordpress/components';\n * import { Icon, more } from '@wordpress/icons';\n *\n * const MyDraggable = () => (\n * <div id=\"draggable-panel\">\n * <Panel header=\"Draggable panel\">\n * <PanelBody>\n * <Draggable elementId=\"draggable-panel\" transferData={ {} }>\n * { ( { onDraggableStart, onDraggableEnd } ) => (\n * <div\n * className=\"example-drag-handle\"\n * draggable\n * onDragStart={ onDraggableStart }\n * onDragEnd={ onDraggableEnd }\n * >\n * <Icon icon={ more } />\n * </div>\n * ) }\n * </Draggable>\n * </PanelBody>\n * </Panel>\n * </div>\n * );\n * ```\n */\nexport function Draggable({\n children,\n onDragStart,\n onDragOver,\n onDragEnd,\n appendToOwnerDocument = false,\n cloneClassname,\n elementId,\n transferData,\n __experimentalTransferDataType: transferDataType = 'text',\n __experimentalDragComponent: dragComponent\n}) {\n const dragComponentRef = useRef(null);\n const cleanupRef = useRef(() => {});\n\n /**\n * Removes the element clone, resets cursor, and removes drag listener.\n *\n * @param event The non-custom DragEvent.\n */\n function end(event) {\n event.preventDefault();\n cleanupRef.current();\n if (onDragEnd) {\n onDragEnd(event);\n }\n }\n\n /**\n * This method does a couple of things:\n *\n * - Clones the current element and spawns clone over original element.\n * - Adds a fake temporary drag image to avoid browser defaults.\n * - Sets transfer data.\n * - Adds dragover listener.\n *\n * @param event The non-custom DragEvent.\n */\n function start(event) {\n const {\n ownerDocument\n } = event.target;\n event.dataTransfer.setData(transferDataType, JSON.stringify(transferData));\n const cloneWrapper = ownerDocument.createElement('div');\n // Reset position to 0,0. Natural stacking order will position this lower, even with a transform otherwise.\n cloneWrapper.style.top = '0';\n cloneWrapper.style.left = '0';\n const dragImage = ownerDocument.createElement('div');\n\n // Set a fake drag image to avoid browser defaults. Remove from DOM\n // right after. event.dataTransfer.setDragImage is not supported yet in\n // IE, we need to check for its existence first.\n if ('function' === typeof event.dataTransfer.setDragImage) {\n dragImage.classList.add(dragImageClass);\n ownerDocument.body.appendChild(dragImage);\n event.dataTransfer.setDragImage(dragImage, 0, 0);\n }\n cloneWrapper.classList.add(cloneWrapperClass);\n if (cloneClassname) {\n cloneWrapper.classList.add(cloneClassname);\n }\n let x = 0;\n let y = 0;\n // If a dragComponent is defined, the following logic will clone the\n // HTML node and inject it into the cloneWrapper.\n if (dragComponentRef.current) {\n // Position dragComponent at the same position as the cursor.\n x = event.clientX;\n y = event.clientY;\n cloneWrapper.style.transform = `translate( ${x}px, ${y}px )`;\n const clonedDragComponent = ownerDocument.createElement('div');\n clonedDragComponent.innerHTML = dragComponentRef.current.innerHTML;\n cloneWrapper.appendChild(clonedDragComponent);\n\n // Inject the cloneWrapper into the DOM.\n ownerDocument.body.appendChild(cloneWrapper);\n } else {\n const element = ownerDocument.getElementById(elementId);\n\n // Prepare element clone and append to element wrapper.\n const elementRect = element.getBoundingClientRect();\n const elementWrapper = element.parentNode;\n const elementTopOffset = elementRect.top;\n const elementLeftOffset = elementRect.left;\n cloneWrapper.style.width = `${elementRect.width + clonePadding * 2}px`;\n const clone = element.cloneNode(true);\n clone.id = `clone-${elementId}`;\n\n // Position clone right over the original element (20px padding).\n x = elementLeftOffset - clonePadding;\n y = elementTopOffset - clonePadding;\n cloneWrapper.style.transform = `translate( ${x}px, ${y}px )`;\n\n // Hack: Remove iFrames as it's causing the embeds drag clone to freeze.\n Array.from(clone.querySelectorAll('iframe')).forEach(child => child.parentNode?.removeChild(child));\n cloneWrapper.appendChild(clone);\n\n // Inject the cloneWrapper into the DOM.\n if (appendToOwnerDocument) {\n ownerDocument.body.appendChild(cloneWrapper);\n } else {\n elementWrapper?.appendChild(cloneWrapper);\n }\n }\n\n // Mark the current cursor coordinates.\n let cursorLeft = event.clientX;\n let cursorTop = event.clientY;\n function over(e) {\n // Skip doing any work if mouse has not moved.\n if (cursorLeft === e.clientX && cursorTop === e.clientY) {\n return;\n }\n const nextX = x + e.clientX - cursorLeft;\n const nextY = y + e.clientY - cursorTop;\n cloneWrapper.style.transform = `translate( ${nextX}px, ${nextY}px )`;\n cursorLeft = e.clientX;\n cursorTop = e.clientY;\n x = nextX;\n y = nextY;\n if (onDragOver) {\n onDragOver(e);\n }\n }\n\n // Aim for 60fps (16 ms per frame) for now. We can potentially use requestAnimationFrame (raf) instead,\n // note that browsers may throttle raf below 60fps in certain conditions.\n // @ts-ignore\n const throttledDragOver = throttle(over, 16);\n ownerDocument.addEventListener('dragover', throttledDragOver);\n\n // Update cursor to 'grabbing', document wide.\n ownerDocument.body.classList.add(bodyClass);\n if (onDragStart) {\n onDragStart(event);\n }\n cleanupRef.current = () => {\n // Remove drag clone.\n if (cloneWrapper && cloneWrapper.parentNode) {\n cloneWrapper.parentNode.removeChild(cloneWrapper);\n }\n if (dragImage && dragImage.parentNode) {\n dragImage.parentNode.removeChild(dragImage);\n }\n\n // Reset cursor.\n ownerDocument.body.classList.remove(bodyClass);\n ownerDocument.removeEventListener('dragover', throttledDragOver);\n };\n }\n useEffect(() => () => {\n cleanupRef.current();\n }, []);\n return /*#__PURE__*/_jsxs(_Fragment, {\n children: [children({\n onDraggableStart: start,\n onDraggableEnd: end\n }), dragComponent && /*#__PURE__*/_jsx(\"div\", {\n className: \"components-draggable-drag-component-root\",\n style: {\n display: 'none'\n },\n ref: dragComponentRef,\n children: dragComponent\n })]\n });\n}\nexport default Draggable;"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA,qBAAyB;AACzB,qBAAkC;
|
|
3
|
+
"sources": ["../../src/draggable/index.tsx", "../../../style-runtime/src/index.ts", "../../src/draggable/style.module.scss"],
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\n\n/**\n * WordPress dependencies\n */\nimport { throttle } from '@wordpress/compose';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { getWpCompatOverlaySlot } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\n\nimport styles from './style.module.scss';\n\n// Legacy class names preserved alongside the CSS-module hashed ones for\n// backwards compatibility. `filter(Boolean)` strips `undefined` from Jest's\n// CSS-module mock.\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst dragImageClasses = [styles['invisible-drag-image'], 'components-draggable__invisible-drag-image'].filter(Boolean);\nconst cloneWrapperClasses = [styles.clone, 'components-draggable__clone'].filter(Boolean);\n// Global class \u2014 shared with external code (e.g. block-editor keyboard drag).\nconst bodyClass = 'is-dragging-components-draggable';\nconst clonePadding = 0;\n\n/**\n * `Draggable` is a Component that provides a way to set up a cross-browser\n * (including IE) customizable drag image and the transfer data for the drag\n * event. It decouples the drag handle and the element to drag: use it by\n * wrapping the component that will become the drag handle and providing the DOM\n * ID of the element to drag.\n *\n * Note that the drag handle needs to declare the `draggable=\"true\"` property\n * and bind the `Draggable`s `onDraggableStart` and `onDraggableEnd` event\n * handlers to its own `onDragStart` and `onDragEnd` respectively. `Draggable`\n * takes care of the logic to setup the drag image and the transfer data, but is\n * not concerned with creating an actual DOM element that is draggable.\n *\n * ```jsx\n * import { Draggable, Panel, PanelBody } from '@wordpress/components';\n * import { Icon, more } from '@wordpress/icons';\n *\n * const MyDraggable = () => (\n * <div id=\"draggable-panel\">\n * <Panel header=\"Draggable panel\">\n * <PanelBody>\n * <Draggable elementId=\"draggable-panel\" transferData={ {} }>\n * { ( { onDraggableStart, onDraggableEnd } ) => (\n * <div\n * className=\"example-drag-handle\"\n * draggable\n * onDragStart={ onDraggableStart }\n * onDragEnd={ onDraggableEnd }\n * >\n * <Icon icon={ more } />\n * </div>\n * ) }\n * </Draggable>\n * </PanelBody>\n * </Panel>\n * </div>\n * );\n * ```\n */\nexport function Draggable({\n children,\n onDragStart,\n onDragOver,\n onDragEnd,\n appendToOwnerDocument = false,\n cloneClassname,\n elementId,\n transferData,\n __experimentalTransferDataType: transferDataType = 'text',\n __experimentalDragComponent: dragComponent\n}) {\n const dragComponentRef = useRef(null);\n const cleanupRef = useRef(() => {});\n\n /**\n * Removes the element clone, resets cursor, and removes drag listener.\n *\n * @param event The non-custom DragEvent.\n */\n function end(event) {\n event.preventDefault();\n cleanupRef.current();\n if (onDragEnd) {\n onDragEnd(event);\n }\n }\n\n /**\n * This method does a couple of things:\n *\n * - Clones the current element and spawns clone over original element.\n * - Adds a fake temporary drag image to avoid browser defaults.\n * - Sets transfer data.\n * - Adds dragover listener.\n *\n * @param event The non-custom DragEvent.\n */\n function start(event) {\n const {\n ownerDocument\n } = event.target;\n // Only use the slot when it lives in the same document as the\n // dragged element, so coordinate resolution stays in one space.\n const slot = getWpCompatOverlaySlot();\n const compatSlot = slot?.ownerDocument === ownerDocument ? slot : null;\n event.dataTransfer.setData(transferDataType, JSON.stringify(transferData));\n const cloneWrapper = ownerDocument.createElement('div');\n // Reset position to 0,0. Natural stacking order will position this lower, even with a transform otherwise.\n cloneWrapper.style.top = '0';\n cloneWrapper.style.left = '0';\n const dragImage = ownerDocument.createElement('div');\n\n // Set a fake drag image to avoid browser defaults. Remove from DOM\n // right after. event.dataTransfer.setDragImage is not supported yet in\n // IE, we need to check for its existence first.\n if ('function' === typeof event.dataTransfer.setDragImage) {\n dragImage.classList.add(...dragImageClasses);\n // Invisible \u2014 stays at the document body, no slot needed.\n ownerDocument.body.appendChild(dragImage);\n event.dataTransfer.setDragImage(dragImage, 0, 0);\n }\n cloneWrapper.classList.add(...cloneWrapperClasses);\n const inSlotClass = styles['is-in-compat-slot'];\n if (compatSlot && inSlotClass) {\n cloneWrapper.classList.add(inSlotClass);\n }\n if (cloneClassname) {\n cloneWrapper.classList.add(cloneClassname);\n }\n let x = 0;\n let y = 0;\n // If a dragComponent is defined, the following logic will clone the\n // HTML node and inject it into the cloneWrapper.\n if (dragComponentRef.current) {\n // Position dragComponent at the same position as the cursor.\n x = event.clientX;\n y = event.clientY;\n cloneWrapper.style.transform = `translate( ${x}px, ${y}px )`;\n const clonedDragComponent = ownerDocument.createElement('div');\n clonedDragComponent.innerHTML = dragComponentRef.current.innerHTML;\n cloneWrapper.appendChild(clonedDragComponent);\n (compatSlot ?? ownerDocument.body).appendChild(cloneWrapper);\n } else {\n const element = ownerDocument.getElementById(elementId);\n\n // Prepare element clone and append to element wrapper.\n const elementRect = element.getBoundingClientRect();\n const elementWrapper = element.parentNode;\n const elementTopOffset = elementRect.top;\n const elementLeftOffset = elementRect.left;\n cloneWrapper.style.width = `${elementRect.width + clonePadding * 2}px`;\n const clone = element.cloneNode(true);\n clone.id = `clone-${elementId}`;\n\n // Position clone right over the original element (20px padding).\n x = elementLeftOffset - clonePadding;\n y = elementTopOffset - clonePadding;\n cloneWrapper.style.transform = `translate( ${x}px, ${y}px )`;\n\n // Hack: Remove iFrames as it's causing the embeds drag clone to freeze.\n Array.from(clone.querySelectorAll('iframe')).forEach(child => child.parentNode?.removeChild(child));\n cloneWrapper.appendChild(clone);\n if (compatSlot) {\n compatSlot.appendChild(cloneWrapper);\n } else if (appendToOwnerDocument) {\n ownerDocument.body.appendChild(cloneWrapper);\n } else {\n elementWrapper?.appendChild(cloneWrapper);\n }\n }\n\n // Mark the current cursor coordinates.\n let cursorLeft = event.clientX;\n let cursorTop = event.clientY;\n function over(e) {\n // Skip doing any work if mouse has not moved.\n if (cursorLeft === e.clientX && cursorTop === e.clientY) {\n return;\n }\n const nextX = x + e.clientX - cursorLeft;\n const nextY = y + e.clientY - cursorTop;\n cloneWrapper.style.transform = `translate( ${nextX}px, ${nextY}px )`;\n cursorLeft = e.clientX;\n cursorTop = e.clientY;\n x = nextX;\n y = nextY;\n if (onDragOver) {\n onDragOver(e);\n }\n }\n\n // Aim for 60fps (16 ms per frame) for now. We can potentially use requestAnimationFrame (raf) instead,\n // note that browsers may throttle raf below 60fps in certain conditions.\n // @ts-ignore\n const throttledDragOver = throttle(over, 16);\n ownerDocument.addEventListener('dragover', throttledDragOver);\n\n // Update cursor to 'grabbing', document wide.\n ownerDocument.body.classList.add(bodyClass);\n if (onDragStart) {\n onDragStart(event);\n }\n cleanupRef.current = () => {\n // Remove drag clone.\n if (cloneWrapper && cloneWrapper.parentNode) {\n cloneWrapper.parentNode.removeChild(cloneWrapper);\n }\n if (dragImage && dragImage.parentNode) {\n dragImage.parentNode.removeChild(dragImage);\n }\n\n // Reset cursor.\n ownerDocument.body.classList.remove(bodyClass);\n ownerDocument.removeEventListener('dragover', throttledDragOver);\n };\n }\n useEffect(() => () => {\n cleanupRef.current();\n }, []);\n return /*#__PURE__*/_jsxs(_Fragment, {\n children: [children({\n onDraggableStart: start,\n onDraggableEnd: end\n }), dragComponent && /*#__PURE__*/_jsx(\"div\", {\n className: \"components-draggable-drag-component-root\",\n style: {\n display: 'none'\n },\n ref: dragComponentRef,\n children: dragComponent\n })]\n });\n}\nexport default Draggable;", "const STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n const globalScope = globalThis;\n if (globalScope.__wpStyleRuntime) {\n return globalScope.__wpStyleRuntime;\n }\n globalScope.__wpStyleRuntime = {\n documents: new Map(),\n styles: new Map(),\n injectedStyles: new WeakMap()\n };\n if (typeof document !== 'undefined') {\n registerDocument(document);\n }\n return globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(targetDocument, hash) {\n if (!targetDocument.head) {\n return false;\n }\n for (const style of targetDocument.head.querySelectorAll(`style[${STYLE_HASH_ATTRIBUTE}]`)) {\n if (style.getAttribute(STYLE_HASH_ATTRIBUTE) === hash) {\n return true;\n }\n }\n return false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nfunction injectStyle(targetDocument, hash, css) {\n if (!targetDocument.head) {\n return;\n }\n const runtime = getRuntime();\n let injectedStyles = runtime.injectedStyles.get(targetDocument);\n if (!injectedStyles) {\n injectedStyles = new Set();\n runtime.injectedStyles.set(targetDocument, injectedStyles);\n }\n if (injectedStyles.has(hash)) {\n return;\n }\n\n // Older generated CSS module output can still inject matching style tags\n // after this document's cache is created, so keep the DOM as the fallback\n // source of truth on cache misses.\n if (documentContainsStyleHash(targetDocument, hash)) {\n injectedStyles.add(hash);\n return;\n }\n const style = targetDocument.createElement('style');\n style.setAttribute(STYLE_HASH_ATTRIBUTE, hash);\n style.appendChild(targetDocument.createTextNode(css));\n targetDocument.head.appendChild(style);\n injectedStyles.add(hash);\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument(targetDocument) {\n const runtime = getRuntime();\n runtime.documents.set(targetDocument, (runtime.documents.get(targetDocument) ?? 0) + 1);\n for (const [hash, css] of runtime.styles) {\n injectStyle(targetDocument, hash, css);\n }\n return () => {\n const count = runtime.documents.get(targetDocument);\n if (count === undefined) {\n return;\n }\n if (count <= 1) {\n runtime.documents.delete(targetDocument);\n return;\n }\n runtime.documents.set(targetDocument, count - 1);\n };\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nexport function registerStyle(hash, css) {\n const runtime = getRuntime();\n runtime.styles.set(hash, css);\n for (const targetDocument of runtime.documents.keys()) {\n injectStyle(targetDocument, hash, css);\n }\n}", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"f8d1257e92\", \"._3476c2e530687f96__invisible-drag-image{height:50px;left:-1000px;position:fixed;width:50px}._6f00e51ab7574306__clone{background:#0000;padding:0;pointer-events:none;position:fixed}._6f00e51ab7574306__clone:not(._664ecd37377558df__is-in-compat-slot){z-index:1000000000}body.is-dragging-components-draggable{cursor:move;cursor:grabbing!important}\");\n}\nexport default {\"invisible-drag-image\":\"_3476c2e530687f96__invisible-drag-image\",\"clone\":\"_6f00e51ab7574306__clone\",\"is-in-compat-slot\":\"_664ecd37377558df__is-in-compat-slot\"};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["_jsxs", "_Fragment", "_jsx"]
|
|
7
7
|
}
|
|
@@ -204,7 +204,9 @@ function FormTokenField(props) {
|
|
|
204
204
|
break;
|
|
205
205
|
case "Space":
|
|
206
206
|
if (tokenizeOnSpace) {
|
|
207
|
-
preventDefault = addCurrentToken(
|
|
207
|
+
preventDefault = addCurrentToken({
|
|
208
|
+
preventDefaultOnFailedValidation: false
|
|
209
|
+
});
|
|
208
210
|
}
|
|
209
211
|
break;
|
|
210
212
|
case "Escape":
|
|
@@ -258,7 +260,35 @@ function FormTokenField(props) {
|
|
|
258
260
|
const items = text.split(separator);
|
|
259
261
|
const tokenValue = items[items.length - 1] || "";
|
|
260
262
|
if (items.length > 1) {
|
|
261
|
-
|
|
263
|
+
const tokensToProcess = items.slice(0, -1);
|
|
264
|
+
const willFailValidation = (segment) => {
|
|
265
|
+
const transformed = saveTransform(segment);
|
|
266
|
+
return !!transformed && !valueContainsToken(transformed) && !__experimentalValidateInput(transformed);
|
|
267
|
+
};
|
|
268
|
+
const hasFailures = tokensToProcess.some(willFailValidation);
|
|
269
|
+
const addedTokens = addNewTokens(hasFailures ? items : tokensToProcess);
|
|
270
|
+
if (hasFailures) {
|
|
271
|
+
const rejected = items.filter((token) => {
|
|
272
|
+
const transformed = saveTransform(token);
|
|
273
|
+
if (!transformed) {
|
|
274
|
+
return false;
|
|
275
|
+
}
|
|
276
|
+
if (addedTokens.has(transformed)) {
|
|
277
|
+
return false;
|
|
278
|
+
}
|
|
279
|
+
if (valueContainsToken(transformed)) {
|
|
280
|
+
return false;
|
|
281
|
+
}
|
|
282
|
+
return !__experimentalValidateInput(transformed);
|
|
283
|
+
});
|
|
284
|
+
const usedSeparators = text.match(/[ ,\t]/g);
|
|
285
|
+
const separatorChar = usedSeparators?.[usedSeparators.length - 1] ?? (tokenizeOnSpace ? " " : ",");
|
|
286
|
+
const trailing = tokenValue === "" ? separatorChar : "";
|
|
287
|
+
const remaining = rejected.join(separatorChar) + trailing;
|
|
288
|
+
setIncompleteTokenValue(remaining);
|
|
289
|
+
onInputChange(remaining);
|
|
290
|
+
return;
|
|
291
|
+
}
|
|
262
292
|
}
|
|
263
293
|
setIncompleteTokenValue(tokenValue);
|
|
264
294
|
onInputChange(tokenValue);
|
|
@@ -349,30 +379,33 @@ function FormTokenField(props) {
|
|
|
349
379
|
moveInputToIndex(index);
|
|
350
380
|
}
|
|
351
381
|
}
|
|
352
|
-
function addCurrentToken(
|
|
382
|
+
function addCurrentToken({
|
|
383
|
+
preventDefaultOnFailedValidation = true
|
|
384
|
+
} = {}) {
|
|
353
385
|
let preventDefault = false;
|
|
354
386
|
const selectedSuggestion = getSelectedSuggestion();
|
|
355
387
|
if (selectedSuggestion) {
|
|
356
388
|
addNewToken(selectedSuggestion);
|
|
357
389
|
preventDefault = true;
|
|
358
390
|
} else if (inputHasValidValue()) {
|
|
359
|
-
addNewToken(incompleteTokenValue);
|
|
360
|
-
preventDefault =
|
|
391
|
+
const passedValidation = addNewToken(incompleteTokenValue);
|
|
392
|
+
preventDefault = passedValidation || preventDefaultOnFailedValidation;
|
|
361
393
|
}
|
|
362
394
|
return preventDefault;
|
|
363
395
|
}
|
|
364
396
|
function addNewTokens(tokens) {
|
|
365
|
-
const tokensToAdd = [...new Set(tokens.map(saveTransform).filter(Boolean).filter((token) => !valueContainsToken(token)))];
|
|
397
|
+
const tokensToAdd = [...new Set(tokens.map(saveTransform).filter(Boolean).filter((token) => !valueContainsToken(token)).filter((token) => __experimentalValidateInput(token)))];
|
|
366
398
|
if (tokensToAdd.length > 0) {
|
|
367
399
|
const newValue = [...value];
|
|
368
400
|
newValue.splice(getIndexOfInput(), 0, ...tokensToAdd);
|
|
369
401
|
onChange(newValue);
|
|
370
402
|
}
|
|
403
|
+
return new Set(tokensToAdd);
|
|
371
404
|
}
|
|
372
405
|
function addNewToken(token) {
|
|
373
406
|
if (!__experimentalValidateInput(token)) {
|
|
374
407
|
(0, import_a11y.speak)(messages.__experimentalInvalid, "assertive");
|
|
375
|
-
return;
|
|
408
|
+
return false;
|
|
376
409
|
}
|
|
377
410
|
addNewTokens([token]);
|
|
378
411
|
(0, import_a11y.speak)(messages.added, "assertive");
|
|
@@ -383,6 +416,7 @@ function FormTokenField(props) {
|
|
|
383
416
|
if (isActive && !tokenizeOnBlur) {
|
|
384
417
|
focus();
|
|
385
418
|
}
|
|
419
|
+
return true;
|
|
386
420
|
}
|
|
387
421
|
function deleteToken(token) {
|
|
388
422
|
const newTokens = value.filter((item) => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/form-token-field/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { useDebounce, useInstanceId, usePrevious } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport { isShallowEqual } from '@wordpress/is-shallow-equal';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport Token from './token';\nimport TokenInput from './token-input';\nimport { TokensAndInputWrapperFlex } from './styles';\nimport SuggestionsList from './suggestions-list';\nimport { FlexItem } from '../flex';\nimport { StyledHelp, StyledLabel } from '../base-control/styles/base-control-styles';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst identity = value => value;\n\n/**\n * A `FormTokenField` is a field similar to the tags and categories fields in the interim editor chrome,\n * or the \"to\" field in Mail on OS X. Tokens can be entered by typing them or selecting them from a list of suggested tokens.\n *\n * Up to one hundred suggestions that match what the user has typed so far will be shown from which the user can pick from (auto-complete).\n * Tokens are separated by the \",\" character. Suggestions can be selected with the up or down arrows and added with the tab or enter key.\n *\n * The `value` property is handled in a manner similar to controlled form components.\n * See [Forms](https://react.dev/reference/react-dom/components#form-components) in the React Documentation for more information.\n */\nexport function FormTokenField(props) {\n const {\n autoCapitalize,\n autoComplete,\n maxLength,\n placeholder,\n label = __('Add item'),\n className,\n suggestions = [],\n maxSuggestions = 100,\n value = [],\n displayTransform = identity,\n saveTransform = token => token.trim(),\n onChange = () => {},\n onInputChange = () => {},\n onFocus = undefined,\n isBorderless = false,\n disabled = false,\n tokenizeOnSpace = false,\n messages = {\n added: __('Item added.'),\n removed: __('Item removed.'),\n remove: __('Remove item'),\n __experimentalInvalid: __('Invalid item')\n },\n __experimentalRenderItem,\n __experimentalExpandOnFocus = false,\n __experimentalValidateInput = () => true,\n __experimentalShowHowTo,\n __next40pxDefaultSize = false,\n __experimentalAutoSelectFirstMatch = false,\n tokenizeOnBlur = false,\n help\n } = useDeprecated36pxDefaultSizeProp(props);\n maybeWarnDeprecated36pxSize({\n componentName: 'FormTokenField',\n size: undefined,\n __next40pxDefaultSize\n });\n const defaultHelp = tokenizeOnSpace ? __('Separate with commas, spaces, or the Enter key.') : __('Separate with commas or the Enter key.');\n let computedHelp = help !== undefined ? help : defaultHelp;\n if (typeof __experimentalShowHowTo === 'boolean') {\n deprecated('`__experimentalShowHowTo` prop in wp.components.FormTokenField', {\n since: '7.1',\n alternative: '`help` prop',\n hint: 'The `help` prop now defaults to the previous how-to text. Pass an empty string to hide it.'\n });\n if (__experimentalShowHowTo === false && help === undefined) {\n computedHelp = '';\n }\n }\n const instanceId = useInstanceId(FormTokenField);\n\n // We reset to these initial values again in the onBlur\n const [incompleteTokenValue, setIncompleteTokenValue] = useState('');\n const [inputOffsetFromEnd, setInputOffsetFromEnd] = useState(0);\n const [isActive, setIsActive] = useState(false);\n const [isExpanded, setIsExpanded] = useState(false);\n const [selectedSuggestionIndex, setSelectedSuggestionIndex] = useState(-1);\n const [selectedSuggestionScroll, setSelectedSuggestionScroll] = useState(false);\n const prevSuggestions = usePrevious(suggestions);\n const prevValue = usePrevious(value);\n const input = useRef(null);\n const tokensAndInput = useRef(null);\n const debouncedSpeak = useDebounce(speak, 500);\n useEffect(() => {\n // Make sure to focus the input when the isActive state is true.\n if (isActive && !hasFocus()) {\n focus();\n }\n }, [isActive]);\n useEffect(() => {\n const suggestionsDidUpdate = !isShallowEqual(suggestions, prevSuggestions || []);\n if (suggestionsDidUpdate || value !== prevValue) {\n updateSuggestions(suggestionsDidUpdate);\n }\n\n // TODO: updateSuggestions() should first be refactored so its actual deps are clearer.\n }, [suggestions, prevSuggestions, value, prevValue]);\n useEffect(() => {\n updateSuggestions();\n }, [incompleteTokenValue]);\n useEffect(() => {\n updateSuggestions();\n }, [__experimentalAutoSelectFirstMatch]);\n if (disabled && isActive) {\n setIsActive(false);\n setIncompleteTokenValue('');\n }\n function focus() {\n input.current?.focus();\n }\n function hasFocus() {\n return input.current === input.current?.ownerDocument.activeElement;\n }\n function onFocusHandler(event) {\n // If focus is on the input or on the container, set the isActive state to true.\n if (hasFocus() || event.target === tokensAndInput.current) {\n setIsActive(true);\n setIsExpanded(__experimentalExpandOnFocus || isExpanded);\n } else {\n /*\n * Otherwise, focus is on one of the token \"remove\" buttons and we\n * set the isActive state to false to prevent the input to be\n * re-focused, see componentDidUpdate().\n */\n setIsActive(false);\n }\n if ('function' === typeof onFocus) {\n onFocus(event);\n }\n }\n function onBlur(event) {\n if (inputHasValidValue() && __experimentalValidateInput(incompleteTokenValue)) {\n setIsActive(false);\n if (tokenizeOnBlur && inputHasValidValue()) {\n addNewToken(incompleteTokenValue);\n }\n } else {\n // Reset to initial state\n setIncompleteTokenValue('');\n setInputOffsetFromEnd(0);\n setIsActive(false);\n if (__experimentalExpandOnFocus) {\n // If `__experimentalExpandOnFocus` is true, don't close the suggestions list when\n // the user clicks on it (`tokensAndInput` will be the element that caused the blur).\n const hasFocusWithin = event.relatedTarget === tokensAndInput.current;\n setIsExpanded(hasFocusWithin);\n } else {\n // Else collapse the suggestion list. This will result in the suggestion list closing\n // after a suggestion has been submitted since that causes a blur.\n setIsExpanded(false);\n }\n setSelectedSuggestionIndex(-1);\n setSelectedSuggestionScroll(false);\n }\n }\n function onKeyDown(event) {\n let preventDefault = false;\n if (event.defaultPrevented) {\n return;\n }\n switch (event.key) {\n case 'Backspace':\n preventDefault = handleDeleteKey(deleteTokenBeforeInput);\n break;\n case 'Enter':\n preventDefault = addCurrentToken();\n break;\n case 'ArrowLeft':\n preventDefault = handleLeftArrowKey();\n break;\n case 'ArrowUp':\n preventDefault = handleUpArrowKey();\n break;\n case 'ArrowRight':\n preventDefault = handleRightArrowKey();\n break;\n case 'ArrowDown':\n preventDefault = handleDownArrowKey();\n break;\n case 'Delete':\n preventDefault = handleDeleteKey(deleteTokenAfterInput);\n break;\n case 'Space':\n if (tokenizeOnSpace) {\n preventDefault = addCurrentToken();\n }\n break;\n case 'Escape':\n preventDefault = handleEscapeKey(event);\n break;\n case 'Tab':\n preventDefault = handleTabKey(event);\n break;\n default:\n break;\n }\n if (preventDefault) {\n event.preventDefault();\n }\n }\n function onKeyPress(event) {\n let preventDefault = false;\n switch (event.key) {\n case ',':\n preventDefault = handleCommaKey();\n break;\n default:\n break;\n }\n if (preventDefault) {\n event.preventDefault();\n }\n }\n function onContainerTouched(event) {\n // Prevent clicking/touching the tokensAndInput container from blurring\n // the input and adding the current token.\n if (event.target === tokensAndInput.current && isActive) {\n event.preventDefault();\n }\n }\n function onTokenClickRemove(event) {\n deleteToken(event.value);\n focus();\n }\n function onSuggestionHovered(suggestion) {\n const index = getMatchingSuggestions().indexOf(suggestion);\n if (index >= 0) {\n setSelectedSuggestionIndex(index);\n setSelectedSuggestionScroll(false);\n }\n }\n function onSuggestionSelected(suggestion) {\n addNewToken(suggestion);\n }\n function onInputChangeHandler(event) {\n const text = event.value;\n const separator = tokenizeOnSpace ? /[ ,\\t]+/ : /[,\\t]+/;\n const items = text.split(separator);\n const tokenValue = items[items.length - 1] || '';\n if (items.length > 1) {\n addNewTokens(items.slice(0, -1));\n }\n setIncompleteTokenValue(tokenValue);\n onInputChange(tokenValue);\n }\n function handleDeleteKey(_deleteToken) {\n let preventDefault = false;\n if (hasFocus() && isInputEmpty()) {\n _deleteToken();\n preventDefault = true;\n }\n return preventDefault;\n }\n function handleLeftArrowKey() {\n let preventDefault = false;\n if (isInputEmpty()) {\n moveInputBeforePreviousToken();\n preventDefault = true;\n }\n return preventDefault;\n }\n function handleRightArrowKey() {\n let preventDefault = false;\n if (isInputEmpty()) {\n moveInputAfterNextToken();\n preventDefault = true;\n }\n return preventDefault;\n }\n function handleUpArrowKey() {\n setSelectedSuggestionIndex(index => {\n return (index === 0 ? getMatchingSuggestions(incompleteTokenValue, suggestions, value, maxSuggestions, saveTransform).length : index) - 1;\n });\n setSelectedSuggestionScroll(true);\n return true; // PreventDefault.\n }\n function handleDownArrowKey() {\n setSelectedSuggestionIndex(index => {\n return (index + 1) % getMatchingSuggestions(incompleteTokenValue, suggestions, value, maxSuggestions, saveTransform).length;\n });\n setSelectedSuggestionScroll(true);\n return true; // PreventDefault.\n }\n function collapseSuggestionsList(event) {\n if (event.target instanceof HTMLInputElement) {\n setIncompleteTokenValue(event.target.value);\n setIsExpanded(false);\n setSelectedSuggestionIndex(-1);\n setSelectedSuggestionScroll(false);\n }\n }\n function handleEscapeKey(event) {\n collapseSuggestionsList(event);\n return true; // PreventDefault.\n }\n function handleTabKey(event) {\n collapseSuggestionsList(event);\n return false; // Do not prevent the default behavior.\n }\n function handleCommaKey() {\n if (inputHasValidValue()) {\n addNewToken(incompleteTokenValue);\n }\n return true; // PreventDefault.\n }\n function moveInputToIndex(index) {\n setInputOffsetFromEnd(value.length - Math.max(index, -1) - 1);\n }\n function moveInputBeforePreviousToken() {\n setInputOffsetFromEnd(prevInputOffsetFromEnd => {\n return Math.min(prevInputOffsetFromEnd + 1, value.length);\n });\n }\n function moveInputAfterNextToken() {\n setInputOffsetFromEnd(prevInputOffsetFromEnd => {\n return Math.max(prevInputOffsetFromEnd - 1, 0);\n });\n }\n function deleteTokenBeforeInput() {\n const index = getIndexOfInput() - 1;\n if (index > -1) {\n deleteToken(value[index]);\n }\n }\n function deleteTokenAfterInput() {\n const index = getIndexOfInput();\n if (index < value.length) {\n deleteToken(value[index]);\n // Update input offset since it's the offset from the last token.\n moveInputToIndex(index);\n }\n }\n function addCurrentToken() {\n let preventDefault = false;\n const selectedSuggestion = getSelectedSuggestion();\n if (selectedSuggestion) {\n addNewToken(selectedSuggestion);\n preventDefault = true;\n } else if (inputHasValidValue()) {\n addNewToken(incompleteTokenValue);\n preventDefault = true;\n }\n return preventDefault;\n }\n function addNewTokens(tokens) {\n const tokensToAdd = [...new Set(tokens.map(saveTransform).filter(Boolean).filter(token => !valueContainsToken(token)))];\n if (tokensToAdd.length > 0) {\n const newValue = [...value];\n newValue.splice(getIndexOfInput(), 0, ...tokensToAdd);\n onChange(newValue);\n }\n }\n function addNewToken(token) {\n if (!__experimentalValidateInput(token)) {\n speak(messages.__experimentalInvalid, 'assertive');\n return;\n }\n addNewTokens([token]);\n speak(messages.added, 'assertive');\n setIncompleteTokenValue('');\n setSelectedSuggestionIndex(-1);\n setSelectedSuggestionScroll(false);\n setIsExpanded(!__experimentalExpandOnFocus);\n if (isActive && !tokenizeOnBlur) {\n focus();\n }\n }\n function deleteToken(token) {\n const newTokens = value.filter(item => {\n return getTokenValue(item) !== getTokenValue(token);\n });\n onChange(newTokens);\n speak(messages.removed, 'assertive');\n }\n function getTokenValue(token) {\n if ('object' === typeof token) {\n return token.value;\n }\n return token;\n }\n function getMatchingSuggestions(searchValue = incompleteTokenValue, _suggestions = suggestions, _value = value, _maxSuggestions = maxSuggestions, _saveTransform = saveTransform) {\n let match = _saveTransform(searchValue);\n const startsWithMatch = [];\n const containsMatch = [];\n const normalizedValue = _value.map(item => {\n if (typeof item === 'string') {\n return item;\n }\n return item.value;\n });\n if (match.length === 0) {\n _suggestions = _suggestions.filter(suggestion => !normalizedValue.includes(suggestion));\n } else {\n match = match.normalize('NFKC').toLocaleLowerCase();\n _suggestions.forEach(suggestion => {\n const index = suggestion.normalize('NFKC').toLocaleLowerCase().indexOf(match);\n if (normalizedValue.indexOf(suggestion) === -1) {\n if (index === 0) {\n startsWithMatch.push(suggestion);\n } else if (index > 0) {\n containsMatch.push(suggestion);\n }\n }\n });\n _suggestions = startsWithMatch.concat(containsMatch);\n }\n return _suggestions.slice(0, _maxSuggestions);\n }\n function getSelectedSuggestion() {\n if (selectedSuggestionIndex !== -1) {\n return getMatchingSuggestions()[selectedSuggestionIndex];\n }\n return undefined;\n }\n function valueContainsToken(token) {\n return value.some(item => {\n return getTokenValue(token) === getTokenValue(item);\n });\n }\n function getIndexOfInput() {\n return value.length - inputOffsetFromEnd;\n }\n function isInputEmpty() {\n return incompleteTokenValue.length === 0;\n }\n function inputHasValidValue() {\n return saveTransform(incompleteTokenValue).length > 0;\n }\n function updateSuggestions(resetSelectedSuggestion = true) {\n const inputHasMinimumChars = incompleteTokenValue.trim().length > 1;\n const matchingSuggestions = getMatchingSuggestions(incompleteTokenValue);\n const hasMatchingSuggestions = matchingSuggestions.length > 0;\n const shouldExpandIfFocuses = hasFocus() && __experimentalExpandOnFocus;\n setIsExpanded(shouldExpandIfFocuses || inputHasMinimumChars && hasMatchingSuggestions);\n if (resetSelectedSuggestion) {\n if (__experimentalAutoSelectFirstMatch && inputHasMinimumChars && hasMatchingSuggestions) {\n setSelectedSuggestionIndex(0);\n setSelectedSuggestionScroll(true);\n } else {\n setSelectedSuggestionIndex(-1);\n setSelectedSuggestionScroll(false);\n }\n }\n if (inputHasMinimumChars) {\n const message = hasMatchingSuggestions ? sprintf(/* translators: %d: number of results. */\n _n('%d result found, use up and down arrow keys to navigate.', '%d results found, use up and down arrow keys to navigate.', matchingSuggestions.length), matchingSuggestions.length) : __('No results.');\n debouncedSpeak(message, 'assertive');\n }\n }\n function renderTokensAndInput() {\n const components = value.map(renderToken);\n components.splice(getIndexOfInput(), 0, renderInput());\n return components;\n }\n function renderToken(token, index, tokens) {\n const _value = getTokenValue(token);\n const status = typeof token !== 'string' ? token.status : undefined;\n const termPosition = index + 1;\n const termsCount = tokens.length;\n return /*#__PURE__*/_jsx(FlexItem, {\n children: /*#__PURE__*/_jsx(Token, {\n value: _value,\n status: status,\n title: typeof token !== 'string' ? token.title : undefined,\n displayTransform: displayTransform,\n onClickRemove: onTokenClickRemove,\n isBorderless: typeof token !== 'string' && token.isBorderless || isBorderless,\n onMouseEnter: typeof token !== 'string' ? token.onMouseEnter : undefined,\n onMouseLeave: typeof token !== 'string' ? token.onMouseLeave : undefined,\n disabled: 'error' !== status && disabled,\n messages: messages,\n termsCount: termsCount,\n termPosition: termPosition\n })\n }, 'token-' + _value);\n }\n function renderInput() {\n const describedById = computedHelp ? `components-form-token-input-${instanceId}__help` : undefined;\n const inputProps = {\n instanceId,\n autoCapitalize,\n autoComplete,\n placeholder: value.length === 0 ? placeholder : '',\n disabled,\n value: incompleteTokenValue,\n onBlur,\n isExpanded,\n selectedSuggestionIndex,\n 'aria-describedby': describedById\n };\n return /*#__PURE__*/_jsx(TokenInput, {\n ...inputProps,\n onChange: !(maxLength && value.length >= maxLength) ? onInputChangeHandler : undefined,\n ref: input\n }, \"input\");\n }\n const classes = clsx(className, 'components-form-token-field__input-container', {\n 'is-active': isActive,\n 'is-disabled': disabled\n });\n let tokenFieldProps = {\n className: 'components-form-token-field',\n tabIndex: -1\n };\n const matchingSuggestions = getMatchingSuggestions();\n if (!disabled) {\n tokenFieldProps = Object.assign({}, tokenFieldProps, {\n onKeyDown: withIgnoreIMEEvents(onKeyDown),\n onKeyPress,\n onFocus: onFocusHandler\n });\n }\n\n // Disable reason: There is no appropriate role which describes the\n // input container intended accessible usability.\n // TODO: Refactor click detection to use blur to stop propagation.\n /* eslint-disable jsx-a11y/no-static-element-interactions */\n return /*#__PURE__*/_jsxs(\"div\", {\n ...tokenFieldProps,\n children: [label && /*#__PURE__*/_jsx(StyledLabel, {\n htmlFor: `components-form-token-input-${instanceId}`,\n className: \"components-form-token-field__label\",\n children: label\n }), /*#__PURE__*/_jsxs(\"div\", {\n ref: tokensAndInput,\n className: classes,\n tabIndex: -1,\n onMouseDown: onContainerTouched,\n onTouchStart: onContainerTouched,\n children: [/*#__PURE__*/_jsx(TokensAndInputWrapperFlex, {\n justify: \"flex-start\",\n align: \"center\",\n gap: 1,\n wrap: true,\n __next40pxDefaultSize: __next40pxDefaultSize,\n hasTokens: !!value.length,\n children: renderTokensAndInput()\n }), isExpanded && /*#__PURE__*/_jsx(SuggestionsList, {\n instanceId: instanceId,\n match: saveTransform(incompleteTokenValue),\n displayTransform: displayTransform,\n suggestions: matchingSuggestions,\n selectedIndex: selectedSuggestionIndex,\n scrollIntoView: selectedSuggestionScroll,\n onHover: onSuggestionHovered,\n onSelect: onSuggestionSelected,\n __experimentalRenderItem: __experimentalRenderItem\n })]\n }), computedHelp && /*#__PURE__*/_jsx(StyledHelp, {\n id: `components-form-token-input-${instanceId}__help`,\n className: \"components-form-token-field__help\",\n children: computedHelp\n })]\n });\n /* eslint-enable jsx-a11y/no-static-element-interactions */\n}\nexport default FormTokenField;"],
|
|
5
|
-
"mappings": "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",
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { useDebounce, useInstanceId, usePrevious } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport { isShallowEqual } from '@wordpress/is-shallow-equal';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport Token from './token';\nimport TokenInput from './token-input';\nimport { TokensAndInputWrapperFlex } from './styles';\nimport SuggestionsList from './suggestions-list';\nimport { FlexItem } from '../flex';\nimport { StyledHelp, StyledLabel } from '../base-control/styles/base-control-styles';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst identity = value => value;\n\n/**\n * A `FormTokenField` is a field similar to the tags and categories fields in the interim editor chrome,\n * or the \"to\" field in Mail on OS X. Tokens can be entered by typing them or selecting them from a list of suggested tokens.\n *\n * Up to one hundred suggestions that match what the user has typed so far will be shown from which the user can pick from (auto-complete).\n * Tokens are separated by the \",\" character. Suggestions can be selected with the up or down arrows and added with the tab or enter key.\n *\n * The `value` property is handled in a manner similar to controlled form components.\n * See [Forms](https://react.dev/reference/react-dom/components#form-components) in the React Documentation for more information.\n */\nexport function FormTokenField(props) {\n const {\n autoCapitalize,\n autoComplete,\n maxLength,\n placeholder,\n label = __('Add item'),\n className,\n suggestions = [],\n maxSuggestions = 100,\n value = [],\n displayTransform = identity,\n saveTransform = token => token.trim(),\n onChange = () => {},\n onInputChange = () => {},\n onFocus = undefined,\n isBorderless = false,\n disabled = false,\n tokenizeOnSpace = false,\n messages = {\n added: __('Item added.'),\n removed: __('Item removed.'),\n remove: __('Remove item'),\n __experimentalInvalid: __('Invalid item')\n },\n __experimentalRenderItem,\n __experimentalExpandOnFocus = false,\n __experimentalValidateInput = () => true,\n __experimentalShowHowTo,\n __next40pxDefaultSize = false,\n __experimentalAutoSelectFirstMatch = false,\n tokenizeOnBlur = false,\n help\n } = useDeprecated36pxDefaultSizeProp(props);\n maybeWarnDeprecated36pxSize({\n componentName: 'FormTokenField',\n size: undefined,\n __next40pxDefaultSize\n });\n const defaultHelp = tokenizeOnSpace ? __('Separate with commas, spaces, or the Enter key.') : __('Separate with commas or the Enter key.');\n let computedHelp = help !== undefined ? help : defaultHelp;\n if (typeof __experimentalShowHowTo === 'boolean') {\n deprecated('`__experimentalShowHowTo` prop in wp.components.FormTokenField', {\n since: '7.1',\n alternative: '`help` prop',\n hint: 'The `help` prop now defaults to the previous how-to text. Pass an empty string to hide it.'\n });\n if (__experimentalShowHowTo === false && help === undefined) {\n computedHelp = '';\n }\n }\n const instanceId = useInstanceId(FormTokenField);\n\n // We reset to these initial values again in the onBlur\n const [incompleteTokenValue, setIncompleteTokenValue] = useState('');\n const [inputOffsetFromEnd, setInputOffsetFromEnd] = useState(0);\n const [isActive, setIsActive] = useState(false);\n const [isExpanded, setIsExpanded] = useState(false);\n const [selectedSuggestionIndex, setSelectedSuggestionIndex] = useState(-1);\n const [selectedSuggestionScroll, setSelectedSuggestionScroll] = useState(false);\n const prevSuggestions = usePrevious(suggestions);\n const prevValue = usePrevious(value);\n const input = useRef(null);\n const tokensAndInput = useRef(null);\n const debouncedSpeak = useDebounce(speak, 500);\n useEffect(() => {\n // Make sure to focus the input when the isActive state is true.\n if (isActive && !hasFocus()) {\n focus();\n }\n }, [isActive]);\n useEffect(() => {\n const suggestionsDidUpdate = !isShallowEqual(suggestions, prevSuggestions || []);\n if (suggestionsDidUpdate || value !== prevValue) {\n updateSuggestions(suggestionsDidUpdate);\n }\n\n // TODO: updateSuggestions() should first be refactored so its actual deps are clearer.\n }, [suggestions, prevSuggestions, value, prevValue]);\n useEffect(() => {\n updateSuggestions();\n }, [incompleteTokenValue]);\n useEffect(() => {\n updateSuggestions();\n }, [__experimentalAutoSelectFirstMatch]);\n if (disabled && isActive) {\n setIsActive(false);\n setIncompleteTokenValue('');\n }\n function focus() {\n input.current?.focus();\n }\n function hasFocus() {\n return input.current === input.current?.ownerDocument.activeElement;\n }\n function onFocusHandler(event) {\n // If focus is on the input or on the container, set the isActive state to true.\n if (hasFocus() || event.target === tokensAndInput.current) {\n setIsActive(true);\n setIsExpanded(__experimentalExpandOnFocus || isExpanded);\n } else {\n /*\n * Otherwise, focus is on one of the token \"remove\" buttons and we\n * set the isActive state to false to prevent the input to be\n * re-focused, see componentDidUpdate().\n */\n setIsActive(false);\n }\n if ('function' === typeof onFocus) {\n onFocus(event);\n }\n }\n function onBlur(event) {\n if (inputHasValidValue() && __experimentalValidateInput(incompleteTokenValue)) {\n setIsActive(false);\n if (tokenizeOnBlur && inputHasValidValue()) {\n addNewToken(incompleteTokenValue);\n }\n } else {\n // Reset to initial state\n setIncompleteTokenValue('');\n setInputOffsetFromEnd(0);\n setIsActive(false);\n if (__experimentalExpandOnFocus) {\n // If `__experimentalExpandOnFocus` is true, don't close the suggestions list when\n // the user clicks on it (`tokensAndInput` will be the element that caused the blur).\n const hasFocusWithin = event.relatedTarget === tokensAndInput.current;\n setIsExpanded(hasFocusWithin);\n } else {\n // Else collapse the suggestion list. This will result in the suggestion list closing\n // after a suggestion has been submitted since that causes a blur.\n setIsExpanded(false);\n }\n setSelectedSuggestionIndex(-1);\n setSelectedSuggestionScroll(false);\n }\n }\n function onKeyDown(event) {\n let preventDefault = false;\n if (event.defaultPrevented) {\n return;\n }\n switch (event.key) {\n case 'Backspace':\n preventDefault = handleDeleteKey(deleteTokenBeforeInput);\n break;\n case 'Enter':\n preventDefault = addCurrentToken();\n break;\n case 'ArrowLeft':\n preventDefault = handleLeftArrowKey();\n break;\n case 'ArrowUp':\n preventDefault = handleUpArrowKey();\n break;\n case 'ArrowRight':\n preventDefault = handleRightArrowKey();\n break;\n case 'ArrowDown':\n preventDefault = handleDownArrowKey();\n break;\n case 'Delete':\n preventDefault = handleDeleteKey(deleteTokenAfterInput);\n break;\n case 'Space':\n if (tokenizeOnSpace) {\n preventDefault = addCurrentToken({\n preventDefaultOnFailedValidation: false\n });\n }\n break;\n case 'Escape':\n preventDefault = handleEscapeKey(event);\n break;\n case 'Tab':\n preventDefault = handleTabKey(event);\n break;\n default:\n break;\n }\n if (preventDefault) {\n event.preventDefault();\n }\n }\n function onKeyPress(event) {\n let preventDefault = false;\n switch (event.key) {\n case ',':\n preventDefault = handleCommaKey();\n break;\n default:\n break;\n }\n if (preventDefault) {\n event.preventDefault();\n }\n }\n function onContainerTouched(event) {\n // Prevent clicking/touching the tokensAndInput container from blurring\n // the input and adding the current token.\n if (event.target === tokensAndInput.current && isActive) {\n event.preventDefault();\n }\n }\n function onTokenClickRemove(event) {\n deleteToken(event.value);\n focus();\n }\n function onSuggestionHovered(suggestion) {\n const index = getMatchingSuggestions().indexOf(suggestion);\n if (index >= 0) {\n setSelectedSuggestionIndex(index);\n setSelectedSuggestionScroll(false);\n }\n }\n function onSuggestionSelected(suggestion) {\n addNewToken(suggestion);\n }\n function onInputChangeHandler(event) {\n const text = event.value;\n const separator = tokenizeOnSpace ? /[ ,\\t]+/ : /[,\\t]+/;\n const items = text.split(separator);\n const tokenValue = items[items.length - 1] || '';\n if (items.length > 1) {\n const tokensToProcess = items.slice(0, -1);\n\n // Pre-check: would any segment be rejected by\n // `__experimentalValidateInput`? Empties and duplicates of the\n // current selection are intentional skips, not failures.\n const willFailValidation = segment => {\n const transformed = saveTransform(segment);\n return !!transformed && !valueContainsToken(transformed) && !__experimentalValidateInput(transformed);\n };\n const hasFailures = tokensToProcess.some(willFailValidation);\n\n // When there are failures, also commit the trailing in-progress\n // segment so the user is left with only the items that need\n // fixing, instead of mixing the trailing segment with the failed\n // ones (which would block tokenization on Enter or comma).\n const addedTokens = addNewTokens(hasFailures ? items : tokensToProcess);\n if (hasFailures) {\n // Derive rejected segments from `addedTokens` so this stays\n // in sync with `addNewTokens`'s filter chain.\n const rejected = items.filter(token => {\n const transformed = saveTransform(token);\n if (!transformed) {\n return false;\n }\n if (addedTokens.has(transformed)) {\n return false;\n }\n if (valueContainsToken(transformed)) {\n return false;\n }\n return !__experimentalValidateInput(transformed);\n });\n\n // Reuse the separator the user actually used (the last one\n // in `text`) so we don't rewrite their input: comma-separated\n // paste under `tokenizeOnSpace` stays comma-separated, and\n // typed space under `tokenizeOnSpace` stays a space. Falls\n // back to the mode-appropriate separator only when no\n // separator characters are present in `text`.\n const usedSeparators = text.match(/[ ,\\t]/g);\n const separatorChar = usedSeparators?.[usedSeparators.length - 1] ?? (tokenizeOnSpace ? ' ' : ',');\n // Preserve a trailing separator when the input ended with\n // one, so the user can keep typing past a failed-validation\n // space without their separator disappearing.\n const trailing = tokenValue === '' ? separatorChar : '';\n const remaining = rejected.join(separatorChar) + trailing;\n setIncompleteTokenValue(remaining);\n onInputChange(remaining);\n return;\n }\n }\n setIncompleteTokenValue(tokenValue);\n onInputChange(tokenValue);\n }\n function handleDeleteKey(_deleteToken) {\n let preventDefault = false;\n if (hasFocus() && isInputEmpty()) {\n _deleteToken();\n preventDefault = true;\n }\n return preventDefault;\n }\n function handleLeftArrowKey() {\n let preventDefault = false;\n if (isInputEmpty()) {\n moveInputBeforePreviousToken();\n preventDefault = true;\n }\n return preventDefault;\n }\n function handleRightArrowKey() {\n let preventDefault = false;\n if (isInputEmpty()) {\n moveInputAfterNextToken();\n preventDefault = true;\n }\n return preventDefault;\n }\n function handleUpArrowKey() {\n setSelectedSuggestionIndex(index => {\n return (index === 0 ? getMatchingSuggestions(incompleteTokenValue, suggestions, value, maxSuggestions, saveTransform).length : index) - 1;\n });\n setSelectedSuggestionScroll(true);\n return true; // PreventDefault.\n }\n function handleDownArrowKey() {\n setSelectedSuggestionIndex(index => {\n return (index + 1) % getMatchingSuggestions(incompleteTokenValue, suggestions, value, maxSuggestions, saveTransform).length;\n });\n setSelectedSuggestionScroll(true);\n return true; // PreventDefault.\n }\n function collapseSuggestionsList(event) {\n if (event.target instanceof HTMLInputElement) {\n setIncompleteTokenValue(event.target.value);\n setIsExpanded(false);\n setSelectedSuggestionIndex(-1);\n setSelectedSuggestionScroll(false);\n }\n }\n function handleEscapeKey(event) {\n collapseSuggestionsList(event);\n return true; // PreventDefault.\n }\n function handleTabKey(event) {\n collapseSuggestionsList(event);\n return false; // Do not prevent the default behavior.\n }\n function handleCommaKey() {\n if (inputHasValidValue()) {\n addNewToken(incompleteTokenValue);\n }\n\n // Comma is always a separator (typed in onKeyPress, never as input).\n // Pasted commas go through onInputChangeHandler, which validates.\n return true;\n }\n function moveInputToIndex(index) {\n setInputOffsetFromEnd(value.length - Math.max(index, -1) - 1);\n }\n function moveInputBeforePreviousToken() {\n setInputOffsetFromEnd(prevInputOffsetFromEnd => {\n return Math.min(prevInputOffsetFromEnd + 1, value.length);\n });\n }\n function moveInputAfterNextToken() {\n setInputOffsetFromEnd(prevInputOffsetFromEnd => {\n return Math.max(prevInputOffsetFromEnd - 1, 0);\n });\n }\n function deleteTokenBeforeInput() {\n const index = getIndexOfInput() - 1;\n if (index > -1) {\n deleteToken(value[index]);\n }\n }\n function deleteTokenAfterInput() {\n const index = getIndexOfInput();\n if (index < value.length) {\n deleteToken(value[index]);\n // Update input offset since it's the offset from the last token.\n moveInputToIndex(index);\n }\n }\n function addCurrentToken({\n preventDefaultOnFailedValidation = true\n } = {}) {\n let preventDefault = false;\n const selectedSuggestion = getSelectedSuggestion();\n if (selectedSuggestion) {\n addNewToken(selectedSuggestion);\n preventDefault = true;\n } else if (inputHasValidValue()) {\n const passedValidation = addNewToken(incompleteTokenValue);\n preventDefault = passedValidation || preventDefaultOnFailedValidation;\n }\n return preventDefault;\n }\n function addNewTokens(tokens) {\n const tokensToAdd = [...new Set(tokens.map(saveTransform).filter(Boolean).filter(token => !valueContainsToken(token)).filter(token => __experimentalValidateInput(token)))];\n if (tokensToAdd.length > 0) {\n const newValue = [...value];\n newValue.splice(getIndexOfInput(), 0, ...tokensToAdd);\n onChange(newValue);\n }\n return new Set(tokensToAdd);\n }\n\n /**\n * Validates and adds `token`. Returns `true` if validation passed,\n * `false` if it was rejected by `__experimentalValidateInput`. A `true`\n * return does not guarantee the token was added: `addNewTokens` may\n * still drop it as a duplicate or after `saveTransform` returns empty.\n */\n function addNewToken(token) {\n if (!__experimentalValidateInput(token)) {\n speak(messages.__experimentalInvalid, 'assertive');\n return false;\n }\n addNewTokens([token]);\n speak(messages.added, 'assertive');\n setIncompleteTokenValue('');\n setSelectedSuggestionIndex(-1);\n setSelectedSuggestionScroll(false);\n setIsExpanded(!__experimentalExpandOnFocus);\n if (isActive && !tokenizeOnBlur) {\n focus();\n }\n return true;\n }\n function deleteToken(token) {\n const newTokens = value.filter(item => {\n return getTokenValue(item) !== getTokenValue(token);\n });\n onChange(newTokens);\n speak(messages.removed, 'assertive');\n }\n function getTokenValue(token) {\n if ('object' === typeof token) {\n return token.value;\n }\n return token;\n }\n function getMatchingSuggestions(searchValue = incompleteTokenValue, _suggestions = suggestions, _value = value, _maxSuggestions = maxSuggestions, _saveTransform = saveTransform) {\n let match = _saveTransform(searchValue);\n const startsWithMatch = [];\n const containsMatch = [];\n const normalizedValue = _value.map(item => {\n if (typeof item === 'string') {\n return item;\n }\n return item.value;\n });\n if (match.length === 0) {\n _suggestions = _suggestions.filter(suggestion => !normalizedValue.includes(suggestion));\n } else {\n match = match.normalize('NFKC').toLocaleLowerCase();\n _suggestions.forEach(suggestion => {\n const index = suggestion.normalize('NFKC').toLocaleLowerCase().indexOf(match);\n if (normalizedValue.indexOf(suggestion) === -1) {\n if (index === 0) {\n startsWithMatch.push(suggestion);\n } else if (index > 0) {\n containsMatch.push(suggestion);\n }\n }\n });\n _suggestions = startsWithMatch.concat(containsMatch);\n }\n return _suggestions.slice(0, _maxSuggestions);\n }\n function getSelectedSuggestion() {\n if (selectedSuggestionIndex !== -1) {\n return getMatchingSuggestions()[selectedSuggestionIndex];\n }\n return undefined;\n }\n function valueContainsToken(token) {\n return value.some(item => {\n return getTokenValue(token) === getTokenValue(item);\n });\n }\n function getIndexOfInput() {\n return value.length - inputOffsetFromEnd;\n }\n function isInputEmpty() {\n return incompleteTokenValue.length === 0;\n }\n function inputHasValidValue() {\n return saveTransform(incompleteTokenValue).length > 0;\n }\n function updateSuggestions(resetSelectedSuggestion = true) {\n const inputHasMinimumChars = incompleteTokenValue.trim().length > 1;\n const matchingSuggestions = getMatchingSuggestions(incompleteTokenValue);\n const hasMatchingSuggestions = matchingSuggestions.length > 0;\n const shouldExpandIfFocuses = hasFocus() && __experimentalExpandOnFocus;\n setIsExpanded(shouldExpandIfFocuses || inputHasMinimumChars && hasMatchingSuggestions);\n if (resetSelectedSuggestion) {\n if (__experimentalAutoSelectFirstMatch && inputHasMinimumChars && hasMatchingSuggestions) {\n setSelectedSuggestionIndex(0);\n setSelectedSuggestionScroll(true);\n } else {\n setSelectedSuggestionIndex(-1);\n setSelectedSuggestionScroll(false);\n }\n }\n if (inputHasMinimumChars) {\n const message = hasMatchingSuggestions ? sprintf(/* translators: %d: number of results. */\n _n('%d result found, use up and down arrow keys to navigate.', '%d results found, use up and down arrow keys to navigate.', matchingSuggestions.length), matchingSuggestions.length) : __('No results.');\n debouncedSpeak(message, 'assertive');\n }\n }\n function renderTokensAndInput() {\n const components = value.map(renderToken);\n components.splice(getIndexOfInput(), 0, renderInput());\n return components;\n }\n function renderToken(token, index, tokens) {\n const _value = getTokenValue(token);\n const status = typeof token !== 'string' ? token.status : undefined;\n const termPosition = index + 1;\n const termsCount = tokens.length;\n return /*#__PURE__*/_jsx(FlexItem, {\n children: /*#__PURE__*/_jsx(Token, {\n value: _value,\n status: status,\n title: typeof token !== 'string' ? token.title : undefined,\n displayTransform: displayTransform,\n onClickRemove: onTokenClickRemove,\n isBorderless: typeof token !== 'string' && token.isBorderless || isBorderless,\n onMouseEnter: typeof token !== 'string' ? token.onMouseEnter : undefined,\n onMouseLeave: typeof token !== 'string' ? token.onMouseLeave : undefined,\n disabled: 'error' !== status && disabled,\n messages: messages,\n termsCount: termsCount,\n termPosition: termPosition\n })\n }, 'token-' + _value);\n }\n function renderInput() {\n const describedById = computedHelp ? `components-form-token-input-${instanceId}__help` : undefined;\n const inputProps = {\n instanceId,\n autoCapitalize,\n autoComplete,\n placeholder: value.length === 0 ? placeholder : '',\n disabled,\n value: incompleteTokenValue,\n onBlur,\n isExpanded,\n selectedSuggestionIndex,\n 'aria-describedby': describedById\n };\n return /*#__PURE__*/_jsx(TokenInput, {\n ...inputProps,\n onChange: !(maxLength && value.length >= maxLength) ? onInputChangeHandler : undefined,\n ref: input\n }, \"input\");\n }\n const classes = clsx(className, 'components-form-token-field__input-container', {\n 'is-active': isActive,\n 'is-disabled': disabled\n });\n let tokenFieldProps = {\n className: 'components-form-token-field',\n tabIndex: -1\n };\n const matchingSuggestions = getMatchingSuggestions();\n if (!disabled) {\n tokenFieldProps = Object.assign({}, tokenFieldProps, {\n onKeyDown: withIgnoreIMEEvents(onKeyDown),\n onKeyPress,\n onFocus: onFocusHandler\n });\n }\n\n // Disable reason: There is no appropriate role which describes the\n // input container intended accessible usability.\n // TODO: Refactor click detection to use blur to stop propagation.\n /* eslint-disable jsx-a11y/no-static-element-interactions */\n return /*#__PURE__*/_jsxs(\"div\", {\n ...tokenFieldProps,\n children: [label && /*#__PURE__*/_jsx(StyledLabel, {\n htmlFor: `components-form-token-input-${instanceId}`,\n className: \"components-form-token-field__label\",\n children: label\n }), /*#__PURE__*/_jsxs(\"div\", {\n ref: tokensAndInput,\n className: classes,\n tabIndex: -1,\n onMouseDown: onContainerTouched,\n onTouchStart: onContainerTouched,\n children: [/*#__PURE__*/_jsx(TokensAndInputWrapperFlex, {\n justify: \"flex-start\",\n align: \"center\",\n gap: 1,\n wrap: true,\n __next40pxDefaultSize: __next40pxDefaultSize,\n hasTokens: !!value.length,\n children: renderTokensAndInput()\n }), isExpanded && /*#__PURE__*/_jsx(SuggestionsList, {\n instanceId: instanceId,\n match: saveTransform(incompleteTokenValue),\n displayTransform: displayTransform,\n suggestions: matchingSuggestions,\n selectedIndex: selectedSuggestionIndex,\n scrollIntoView: selectedSuggestionScroll,\n onHover: onSuggestionHovered,\n onSelect: onSuggestionSelected,\n __experimentalRenderItem: __experimentalRenderItem\n })]\n }), computedHelp && /*#__PURE__*/_jsx(StyledHelp, {\n id: `components-form-token-input-${instanceId}__help`,\n className: \"components-form-token-field__help\",\n children: computedHelp\n })]\n });\n /* eslint-enable jsx-a11y/no-static-element-interactions */\n}\nexport default FormTokenField;"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAIjB,qBAA4C;AAC5C,kBAAgC;AAChC,qBAAwD;AACxD,kBAAsB;AACtB,8BAA+B;AAC/B,wBAAuB;AAKvB,mBAAkB;AAClB,yBAAuB;AACvB,oBAA0C;AAC1C,8BAA4B;AAC5B,kBAAyB;AACzB,iCAAwC;AACxC,kCAAiD;AACjD,oCAAoC;AACpC,kCAA4C;AAC5C,yBAA2C;AAC3C,IAAM,WAAW,WAAS;AAYnB,SAAS,eAAe,OAAO;AACpC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAQ,gBAAG,UAAU;AAAA,IACrB;AAAA,IACA,cAAc,CAAC;AAAA,IACf,iBAAiB;AAAA,IACjB,QAAQ,CAAC;AAAA,IACT,mBAAmB;AAAA,IACnB,gBAAgB,WAAS,MAAM,KAAK;AAAA,IACpC,WAAW,MAAM;AAAA,IAAC;AAAA,IAClB,gBAAgB,MAAM;AAAA,IAAC;AAAA,IACvB,UAAU;AAAA,IACV,eAAe;AAAA,IACf,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB,WAAW;AAAA,MACT,WAAO,gBAAG,aAAa;AAAA,MACvB,aAAS,gBAAG,eAAe;AAAA,MAC3B,YAAQ,gBAAG,aAAa;AAAA,MACxB,2BAAuB,gBAAG,cAAc;AAAA,IAC1C;AAAA,IACA;AAAA,IACA,8BAA8B;AAAA,IAC9B,8BAA8B,MAAM;AAAA,IACpC;AAAA,IACA,wBAAwB;AAAA,IACxB,qCAAqC;AAAA,IACrC,iBAAiB;AAAA,IACjB;AAAA,EACF,QAAI,8DAAiC,KAAK;AAC1C,+DAA4B;AAAA,IAC1B,eAAe;AAAA,IACf,MAAM;AAAA,IACN;AAAA,EACF,CAAC;AACD,QAAM,cAAc,sBAAkB,gBAAG,iDAAiD,QAAI,gBAAG,wCAAwC;AACzI,MAAI,eAAe,SAAS,SAAY,OAAO;AAC/C,MAAI,OAAO,4BAA4B,WAAW;AAChD,0BAAAA,SAAW,kEAAkE;AAAA,MAC3E,OAAO;AAAA,MACP,aAAa;AAAA,MACb,MAAM;AAAA,IACR,CAAC;AACD,QAAI,4BAA4B,SAAS,SAAS,QAAW;AAC3D,qBAAe;AAAA,IACjB;AAAA,EACF;AACA,QAAM,iBAAa,8BAAc,cAAc;AAG/C,QAAM,CAAC,sBAAsB,uBAAuB,QAAI,yBAAS,EAAE;AACnE,QAAM,CAAC,oBAAoB,qBAAqB,QAAI,yBAAS,CAAC;AAC9D,QAAM,CAAC,UAAU,WAAW,QAAI,yBAAS,KAAK;AAC9C,QAAM,CAAC,YAAY,aAAa,QAAI,yBAAS,KAAK;AAClD,QAAM,CAAC,yBAAyB,0BAA0B,QAAI,yBAAS,EAAE;AACzE,QAAM,CAAC,0BAA0B,2BAA2B,QAAI,yBAAS,KAAK;AAC9E,QAAM,sBAAkB,4BAAY,WAAW;AAC/C,QAAM,gBAAY,4BAAY,KAAK;AACnC,QAAM,YAAQ,uBAAO,IAAI;AACzB,QAAM,qBAAiB,uBAAO,IAAI;AAClC,QAAM,qBAAiB,4BAAY,mBAAO,GAAG;AAC7C,gCAAU,MAAM;AAEd,QAAI,YAAY,CAAC,SAAS,GAAG;AAC3B,YAAM;AAAA,IACR;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AACb,gCAAU,MAAM;AACd,UAAM,uBAAuB,KAAC,wCAAe,aAAa,mBAAmB,CAAC,CAAC;AAC/E,QAAI,wBAAwB,UAAU,WAAW;AAC/C,wBAAkB,oBAAoB;AAAA,IACxC;AAAA,EAGF,GAAG,CAAC,aAAa,iBAAiB,OAAO,SAAS,CAAC;AACnD,gCAAU,MAAM;AACd,sBAAkB;AAAA,EACpB,GAAG,CAAC,oBAAoB,CAAC;AACzB,gCAAU,MAAM;AACd,sBAAkB;AAAA,EACpB,GAAG,CAAC,kCAAkC,CAAC;AACvC,MAAI,YAAY,UAAU;AACxB,gBAAY,KAAK;AACjB,4BAAwB,EAAE;AAAA,EAC5B;AACA,WAAS,QAAQ;AACf,UAAM,SAAS,MAAM;AAAA,EACvB;AACA,WAAS,WAAW;AAClB,WAAO,MAAM,YAAY,MAAM,SAAS,cAAc;AAAA,EACxD;AACA,WAAS,eAAe,OAAO;AAE7B,QAAI,SAAS,KAAK,MAAM,WAAW,eAAe,SAAS;AACzD,kBAAY,IAAI;AAChB,oBAAc,+BAA+B,UAAU;AAAA,IACzD,OAAO;AAML,kBAAY,KAAK;AAAA,IACnB;AACA,QAAI,eAAe,OAAO,SAAS;AACjC,cAAQ,KAAK;AAAA,IACf;AAAA,EACF;AACA,WAAS,OAAO,OAAO;AACrB,QAAI,mBAAmB,KAAK,4BAA4B,oBAAoB,GAAG;AAC7E,kBAAY,KAAK;AACjB,UAAI,kBAAkB,mBAAmB,GAAG;AAC1C,oBAAY,oBAAoB;AAAA,MAClC;AAAA,IACF,OAAO;AAEL,8BAAwB,EAAE;AAC1B,4BAAsB,CAAC;AACvB,kBAAY,KAAK;AACjB,UAAI,6BAA6B;AAG/B,cAAM,iBAAiB,MAAM,kBAAkB,eAAe;AAC9D,sBAAc,cAAc;AAAA,MAC9B,OAAO;AAGL,sBAAc,KAAK;AAAA,MACrB;AACA,iCAA2B,EAAE;AAC7B,kCAA4B,KAAK;AAAA,IACnC;AAAA,EACF;AACA,WAAS,UAAU,OAAO;AACxB,QAAI,iBAAiB;AACrB,QAAI,MAAM,kBAAkB;AAC1B;AAAA,IACF;AACA,YAAQ,MAAM,KAAK;AAAA,MACjB,KAAK;AACH,yBAAiB,gBAAgB,sBAAsB;AACvD;AAAA,MACF,KAAK;AACH,yBAAiB,gBAAgB;AACjC;AAAA,MACF,KAAK;AACH,yBAAiB,mBAAmB;AACpC;AAAA,MACF,KAAK;AACH,yBAAiB,iBAAiB;AAClC;AAAA,MACF,KAAK;AACH,yBAAiB,oBAAoB;AACrC;AAAA,MACF,KAAK;AACH,yBAAiB,mBAAmB;AACpC;AAAA,MACF,KAAK;AACH,yBAAiB,gBAAgB,qBAAqB;AACtD;AAAA,MACF,KAAK;AACH,YAAI,iBAAiB;AACnB,2BAAiB,gBAAgB;AAAA,YAC/B,kCAAkC;AAAA,UACpC,CAAC;AAAA,QACH;AACA;AAAA,MACF,KAAK;AACH,yBAAiB,gBAAgB,KAAK;AACtC;AAAA,MACF,KAAK;AACH,yBAAiB,aAAa,KAAK;AACnC;AAAA,MACF;AACE;AAAA,IACJ;AACA,QAAI,gBAAgB;AAClB,YAAM,eAAe;AAAA,IACvB;AAAA,EACF;AACA,WAAS,WAAW,OAAO;AACzB,QAAI,iBAAiB;AACrB,YAAQ,MAAM,KAAK;AAAA,MACjB,KAAK;AACH,yBAAiB,eAAe;AAChC;AAAA,MACF;AACE;AAAA,IACJ;AACA,QAAI,gBAAgB;AAClB,YAAM,eAAe;AAAA,IACvB;AAAA,EACF;AACA,WAAS,mBAAmB,OAAO;AAGjC,QAAI,MAAM,WAAW,eAAe,WAAW,UAAU;AACvD,YAAM,eAAe;AAAA,IACvB;AAAA,EACF;AACA,WAAS,mBAAmB,OAAO;AACjC,gBAAY,MAAM,KAAK;AACvB,UAAM;AAAA,EACR;AACA,WAAS,oBAAoB,YAAY;AACvC,UAAM,QAAQ,uBAAuB,EAAE,QAAQ,UAAU;AACzD,QAAI,SAAS,GAAG;AACd,iCAA2B,KAAK;AAChC,kCAA4B,KAAK;AAAA,IACnC;AAAA,EACF;AACA,WAAS,qBAAqB,YAAY;AACxC,gBAAY,UAAU;AAAA,EACxB;AACA,WAAS,qBAAqB,OAAO;AACnC,UAAM,OAAO,MAAM;AACnB,UAAM,YAAY,kBAAkB,YAAY;AAChD,UAAM,QAAQ,KAAK,MAAM,SAAS;AAClC,UAAM,aAAa,MAAM,MAAM,SAAS,CAAC,KAAK;AAC9C,QAAI,MAAM,SAAS,GAAG;AACpB,YAAM,kBAAkB,MAAM,MAAM,GAAG,EAAE;AAKzC,YAAM,qBAAqB,aAAW;AACpC,cAAM,cAAc,cAAc,OAAO;AACzC,eAAO,CAAC,CAAC,eAAe,CAAC,mBAAmB,WAAW,KAAK,CAAC,4BAA4B,WAAW;AAAA,MACtG;AACA,YAAM,cAAc,gBAAgB,KAAK,kBAAkB;AAM3D,YAAM,cAAc,aAAa,cAAc,QAAQ,eAAe;AACtE,UAAI,aAAa;AAGf,cAAM,WAAW,MAAM,OAAO,WAAS;AACrC,gBAAM,cAAc,cAAc,KAAK;AACvC,cAAI,CAAC,aAAa;AAChB,mBAAO;AAAA,UACT;AACA,cAAI,YAAY,IAAI,WAAW,GAAG;AAChC,mBAAO;AAAA,UACT;AACA,cAAI,mBAAmB,WAAW,GAAG;AACnC,mBAAO;AAAA,UACT;AACA,iBAAO,CAAC,4BAA4B,WAAW;AAAA,QACjD,CAAC;AAQD,cAAM,iBAAiB,KAAK,MAAM,SAAS;AAC3C,cAAM,gBAAgB,iBAAiB,eAAe,SAAS,CAAC,MAAM,kBAAkB,MAAM;AAI9F,cAAM,WAAW,eAAe,KAAK,gBAAgB;AACrD,cAAM,YAAY,SAAS,KAAK,aAAa,IAAI;AACjD,gCAAwB,SAAS;AACjC,sBAAc,SAAS;AACvB;AAAA,MACF;AAAA,IACF;AACA,4BAAwB,UAAU;AAClC,kBAAc,UAAU;AAAA,EAC1B;AACA,WAAS,gBAAgB,cAAc;AACrC,QAAI,iBAAiB;AACrB,QAAI,SAAS,KAAK,aAAa,GAAG;AAChC,mBAAa;AACb,uBAAiB;AAAA,IACnB;AACA,WAAO;AAAA,EACT;AACA,WAAS,qBAAqB;AAC5B,QAAI,iBAAiB;AACrB,QAAI,aAAa,GAAG;AAClB,mCAA6B;AAC7B,uBAAiB;AAAA,IACnB;AACA,WAAO;AAAA,EACT;AACA,WAAS,sBAAsB;AAC7B,QAAI,iBAAiB;AACrB,QAAI,aAAa,GAAG;AAClB,8BAAwB;AACxB,uBAAiB;AAAA,IACnB;AACA,WAAO;AAAA,EACT;AACA,WAAS,mBAAmB;AAC1B,+BAA2B,WAAS;AAClC,cAAQ,UAAU,IAAI,uBAAuB,sBAAsB,aAAa,OAAO,gBAAgB,aAAa,EAAE,SAAS,SAAS;AAAA,IAC1I,CAAC;AACD,gCAA4B,IAAI;AAChC,WAAO;AAAA,EACT;AACA,WAAS,qBAAqB;AAC5B,+BAA2B,WAAS;AAClC,cAAQ,QAAQ,KAAK,uBAAuB,sBAAsB,aAAa,OAAO,gBAAgB,aAAa,EAAE;AAAA,IACvH,CAAC;AACD,gCAA4B,IAAI;AAChC,WAAO;AAAA,EACT;AACA,WAAS,wBAAwB,OAAO;AACtC,QAAI,MAAM,kBAAkB,kBAAkB;AAC5C,8BAAwB,MAAM,OAAO,KAAK;AAC1C,oBAAc,KAAK;AACnB,iCAA2B,EAAE;AAC7B,kCAA4B,KAAK;AAAA,IACnC;AAAA,EACF;AACA,WAAS,gBAAgB,OAAO;AAC9B,4BAAwB,KAAK;AAC7B,WAAO;AAAA,EACT;AACA,WAAS,aAAa,OAAO;AAC3B,4BAAwB,KAAK;AAC7B,WAAO;AAAA,EACT;AACA,WAAS,iBAAiB;AACxB,QAAI,mBAAmB,GAAG;AACxB,kBAAY,oBAAoB;AAAA,IAClC;AAIA,WAAO;AAAA,EACT;AACA,WAAS,iBAAiB,OAAO;AAC/B,0BAAsB,MAAM,SAAS,KAAK,IAAI,OAAO,EAAE,IAAI,CAAC;AAAA,EAC9D;AACA,WAAS,+BAA+B;AACtC,0BAAsB,4BAA0B;AAC9C,aAAO,KAAK,IAAI,yBAAyB,GAAG,MAAM,MAAM;AAAA,IAC1D,CAAC;AAAA,EACH;AACA,WAAS,0BAA0B;AACjC,0BAAsB,4BAA0B;AAC9C,aAAO,KAAK,IAAI,yBAAyB,GAAG,CAAC;AAAA,IAC/C,CAAC;AAAA,EACH;AACA,WAAS,yBAAyB;AAChC,UAAM,QAAQ,gBAAgB,IAAI;AAClC,QAAI,QAAQ,IAAI;AACd,kBAAY,MAAM,KAAK,CAAC;AAAA,IAC1B;AAAA,EACF;AACA,WAAS,wBAAwB;AAC/B,UAAM,QAAQ,gBAAgB;AAC9B,QAAI,QAAQ,MAAM,QAAQ;AACxB,kBAAY,MAAM,KAAK,CAAC;AAExB,uBAAiB,KAAK;AAAA,IACxB;AAAA,EACF;AACA,WAAS,gBAAgB;AAAA,IACvB,mCAAmC;AAAA,EACrC,IAAI,CAAC,GAAG;AACN,QAAI,iBAAiB;AACrB,UAAM,qBAAqB,sBAAsB;AACjD,QAAI,oBAAoB;AACtB,kBAAY,kBAAkB;AAC9B,uBAAiB;AAAA,IACnB,WAAW,mBAAmB,GAAG;AAC/B,YAAM,mBAAmB,YAAY,oBAAoB;AACzD,uBAAiB,oBAAoB;AAAA,IACvC;AACA,WAAO;AAAA,EACT;AACA,WAAS,aAAa,QAAQ;AAC5B,UAAM,cAAc,CAAC,GAAG,IAAI,IAAI,OAAO,IAAI,aAAa,EAAE,OAAO,OAAO,EAAE,OAAO,WAAS,CAAC,mBAAmB,KAAK,CAAC,EAAE,OAAO,WAAS,4BAA4B,KAAK,CAAC,CAAC,CAAC;AAC1K,QAAI,YAAY,SAAS,GAAG;AAC1B,YAAM,WAAW,CAAC,GAAG,KAAK;AAC1B,eAAS,OAAO,gBAAgB,GAAG,GAAG,GAAG,WAAW;AACpD,eAAS,QAAQ;AAAA,IACnB;AACA,WAAO,IAAI,IAAI,WAAW;AAAA,EAC5B;AAQA,WAAS,YAAY,OAAO;AAC1B,QAAI,CAAC,4BAA4B,KAAK,GAAG;AACvC,6BAAM,SAAS,uBAAuB,WAAW;AACjD,aAAO;AAAA,IACT;AACA,iBAAa,CAAC,KAAK,CAAC;AACpB,2BAAM,SAAS,OAAO,WAAW;AACjC,4BAAwB,EAAE;AAC1B,+BAA2B,EAAE;AAC7B,gCAA4B,KAAK;AACjC,kBAAc,CAAC,2BAA2B;AAC1C,QAAI,YAAY,CAAC,gBAAgB;AAC/B,YAAM;AAAA,IACR;AACA,WAAO;AAAA,EACT;AACA,WAAS,YAAY,OAAO;AAC1B,UAAM,YAAY,MAAM,OAAO,UAAQ;AACrC,aAAO,cAAc,IAAI,MAAM,cAAc,KAAK;AAAA,IACpD,CAAC;AACD,aAAS,SAAS;AAClB,2BAAM,SAAS,SAAS,WAAW;AAAA,EACrC;AACA,WAAS,cAAc,OAAO;AAC5B,QAAI,aAAa,OAAO,OAAO;AAC7B,aAAO,MAAM;AAAA,IACf;AACA,WAAO;AAAA,EACT;AACA,WAAS,uBAAuB,cAAc,sBAAsB,eAAe,aAAa,SAAS,OAAO,kBAAkB,gBAAgB,iBAAiB,eAAe;AAChL,QAAI,QAAQ,eAAe,WAAW;AACtC,UAAM,kBAAkB,CAAC;AACzB,UAAM,gBAAgB,CAAC;AACvB,UAAM,kBAAkB,OAAO,IAAI,UAAQ;AACzC,UAAI,OAAO,SAAS,UAAU;AAC5B,eAAO;AAAA,MACT;AACA,aAAO,KAAK;AAAA,IACd,CAAC;AACD,QAAI,MAAM,WAAW,GAAG;AACtB,qBAAe,aAAa,OAAO,gBAAc,CAAC,gBAAgB,SAAS,UAAU,CAAC;AAAA,IACxF,OAAO;AACL,cAAQ,MAAM,UAAU,MAAM,EAAE,kBAAkB;AAClD,mBAAa,QAAQ,gBAAc;AACjC,cAAM,QAAQ,WAAW,UAAU,MAAM,EAAE,kBAAkB,EAAE,QAAQ,KAAK;AAC5E,YAAI,gBAAgB,QAAQ,UAAU,MAAM,IAAI;AAC9C,cAAI,UAAU,GAAG;AACf,4BAAgB,KAAK,UAAU;AAAA,UACjC,WAAW,QAAQ,GAAG;AACpB,0BAAc,KAAK,UAAU;AAAA,UAC/B;AAAA,QACF;AAAA,MACF,CAAC;AACD,qBAAe,gBAAgB,OAAO,aAAa;AAAA,IACrD;AACA,WAAO,aAAa,MAAM,GAAG,eAAe;AAAA,EAC9C;AACA,WAAS,wBAAwB;AAC/B,QAAI,4BAA4B,IAAI;AAClC,aAAO,uBAAuB,EAAE,uBAAuB;AAAA,IACzD;AACA,WAAO;AAAA,EACT;AACA,WAAS,mBAAmB,OAAO;AACjC,WAAO,MAAM,KAAK,UAAQ;AACxB,aAAO,cAAc,KAAK,MAAM,cAAc,IAAI;AAAA,IACpD,CAAC;AAAA,EACH;AACA,WAAS,kBAAkB;AACzB,WAAO,MAAM,SAAS;AAAA,EACxB;AACA,WAAS,eAAe;AACtB,WAAO,qBAAqB,WAAW;AAAA,EACzC;AACA,WAAS,qBAAqB;AAC5B,WAAO,cAAc,oBAAoB,EAAE,SAAS;AAAA,EACtD;AACA,WAAS,kBAAkB,0BAA0B,MAAM;AACzD,UAAM,uBAAuB,qBAAqB,KAAK,EAAE,SAAS;AAClE,UAAMC,uBAAsB,uBAAuB,oBAAoB;AACvE,UAAM,yBAAyBA,qBAAoB,SAAS;AAC5D,UAAM,wBAAwB,SAAS,KAAK;AAC5C,kBAAc,yBAAyB,wBAAwB,sBAAsB;AACrF,QAAI,yBAAyB;AAC3B,UAAI,sCAAsC,wBAAwB,wBAAwB;AACxF,mCAA2B,CAAC;AAC5B,oCAA4B,IAAI;AAAA,MAClC,OAAO;AACL,mCAA2B,EAAE;AAC7B,oCAA4B,KAAK;AAAA,MACnC;AAAA,IACF;AACA,QAAI,sBAAsB;AACxB,YAAM,UAAU,6BAAyB;AAAA;AAAA,YACzC,gBAAG,4DAA4D,6DAA6DA,qBAAoB,MAAM;AAAA,QAAGA,qBAAoB;AAAA,MAAM,QAAI,gBAAG,aAAa;AACvM,qBAAe,SAAS,WAAW;AAAA,IACrC;AAAA,EACF;AACA,WAAS,uBAAuB;AAC9B,UAAM,aAAa,MAAM,IAAI,WAAW;AACxC,eAAW,OAAO,gBAAgB,GAAG,GAAG,YAAY,CAAC;AACrD,WAAO;AAAA,EACT;AACA,WAAS,YAAY,OAAO,OAAO,QAAQ;AACzC,UAAM,SAAS,cAAc,KAAK;AAClC,UAAM,SAAS,OAAO,UAAU,WAAW,MAAM,SAAS;AAC1D,UAAM,eAAe,QAAQ;AAC7B,UAAM,aAAa,OAAO;AAC1B,WAAoB,uCAAAC,KAAK,sBAAU;AAAA,MACjC,UAAuB,uCAAAA,KAAK,aAAAC,SAAO;AAAA,QACjC,OAAO;AAAA,QACP;AAAA,QACA,OAAO,OAAO,UAAU,WAAW,MAAM,QAAQ;AAAA,QACjD;AAAA,QACA,eAAe;AAAA,QACf,cAAc,OAAO,UAAU,YAAY,MAAM,gBAAgB;AAAA,QACjE,cAAc,OAAO,UAAU,WAAW,MAAM,eAAe;AAAA,QAC/D,cAAc,OAAO,UAAU,WAAW,MAAM,eAAe;AAAA,QAC/D,UAAU,YAAY,UAAU;AAAA,QAChC;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH,GAAG,WAAW,MAAM;AAAA,EACtB;AACA,WAAS,cAAc;AACrB,UAAM,gBAAgB,eAAe,+BAA+B,UAAU,WAAW;AACzF,UAAM,aAAa;AAAA,MACjB;AAAA,MACA;AAAA,MACA;AAAA,MACA,aAAa,MAAM,WAAW,IAAI,cAAc;AAAA,MAChD;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA,oBAAoB;AAAA,IACtB;AACA,WAAoB,uCAAAD,KAAK,mBAAAE,SAAY;AAAA,MACnC,GAAG;AAAA,MACH,UAAU,EAAE,aAAa,MAAM,UAAU,aAAa,uBAAuB;AAAA,MAC7E,KAAK;AAAA,IACP,GAAG,OAAO;AAAA,EACZ;AACA,QAAM,cAAU,YAAAC,SAAK,WAAW,gDAAgD;AAAA,IAC9E,aAAa;AAAA,IACb,eAAe;AAAA,EACjB,CAAC;AACD,MAAI,kBAAkB;AAAA,IACpB,WAAW;AAAA,IACX,UAAU;AAAA,EACZ;AACA,QAAM,sBAAsB,uBAAuB;AACnD,MAAI,CAAC,UAAU;AACb,sBAAkB,OAAO,OAAO,CAAC,GAAG,iBAAiB;AAAA,MACnD,eAAW,mDAAoB,SAAS;AAAA,MACxC;AAAA,MACA,SAAS;AAAA,IACX,CAAC;AAAA,EACH;AAMA,SAAoB,uCAAAC,MAAM,OAAO;AAAA,IAC/B,GAAG;AAAA,IACH,UAAU,CAAC,SAAsB,uCAAAJ,KAAK,wCAAa;AAAA,MACjD,SAAS,+BAA+B,UAAU;AAAA,MAClD,WAAW;AAAA,MACX,UAAU;AAAA,IACZ,CAAC,GAAgB,uCAAAI,MAAM,OAAO;AAAA,MAC5B,KAAK;AAAA,MACL,WAAW;AAAA,MACX,UAAU;AAAA,MACV,aAAa;AAAA,MACb,cAAc;AAAA,MACd,UAAU,CAAc,uCAAAJ,KAAK,yCAA2B;AAAA,QACtD,SAAS;AAAA,QACT,OAAO;AAAA,QACP,KAAK;AAAA,QACL,MAAM;AAAA,QACN;AAAA,QACA,WAAW,CAAC,CAAC,MAAM;AAAA,QACnB,UAAU,qBAAqB;AAAA,MACjC,CAAC,GAAG,cAA2B,uCAAAA,KAAK,wBAAAK,SAAiB;AAAA,QACnD;AAAA,QACA,OAAO,cAAc,oBAAoB;AAAA,QACzC;AAAA,QACA,aAAa;AAAA,QACb,eAAe;AAAA,QACf,gBAAgB;AAAA,QAChB,SAAS;AAAA,QACT,UAAU;AAAA,QACV;AAAA,MACF,CAAC,CAAC;AAAA,IACJ,CAAC,GAAG,gBAA6B,uCAAAL,KAAK,uCAAY;AAAA,MAChD,IAAI,+BAA+B,UAAU;AAAA,MAC7C,WAAW;AAAA,MACX,UAAU;AAAA,IACZ,CAAC,CAAC;AAAA,EACJ,CAAC;AAEH;AACA,IAAO,2BAAQ;",
|
|
6
6
|
"names": ["deprecated", "matchingSuggestions", "_jsx", "Token", "TokenInput", "clsx", "_jsxs", "SuggestionsList"]
|
|
7
7
|
}
|
|
@@ -39,7 +39,7 @@ var import_compose = require("@wordpress/compose");
|
|
|
39
39
|
var import_list = __toESM(require("../../notice/list.cjs"));
|
|
40
40
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
41
41
|
var with_notices_default = (0, import_compose.createHigherOrderComponent)((OriginalComponent) => {
|
|
42
|
-
function Component(props
|
|
42
|
+
return function Component(props) {
|
|
43
43
|
const [noticeList, setNoticeList] = (0, import_element.useState)([]);
|
|
44
44
|
const noticeOperations = (0, import_element.useMemo)(() => {
|
|
45
45
|
const createNotice = (notice) => {
|
|
@@ -75,21 +75,9 @@ var with_notices_default = (0, import_compose.createHigherOrderComponent)((Origi
|
|
|
75
75
|
onRemove: noticeOperations.removeNotice
|
|
76
76
|
})
|
|
77
77
|
};
|
|
78
|
-
return
|
|
79
|
-
...propsOut,
|
|
80
|
-
ref
|
|
81
|
-
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(OriginalComponent, {
|
|
78
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(OriginalComponent, {
|
|
82
79
|
...propsOut
|
|
83
80
|
});
|
|
84
|
-
}
|
|
85
|
-
let isForwardRef;
|
|
86
|
-
const {
|
|
87
|
-
render
|
|
88
|
-
} = OriginalComponent;
|
|
89
|
-
if (typeof render === "function") {
|
|
90
|
-
isForwardRef = true;
|
|
91
|
-
return (0, import_element.forwardRef)(Component);
|
|
92
|
-
}
|
|
93
|
-
return Component;
|
|
81
|
+
};
|
|
94
82
|
}, "withNotices");
|
|
95
83
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/higher-order/with-notices/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport { v4 as uuid } from 'uuid';\n\n/**\n * WordPress dependencies\n */\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAA2B;AAK3B,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport { v4 as uuid } from 'uuid';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useMemo } from '@wordpress/element';\nimport { createHigherOrderComponent } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport NoticeList from '../../notice/list';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n/**\n * Override the default edit UI to include notices if supported.\n *\n * Wrapping the original component with `withNotices` encapsulates the component\n * with the additional props `noticeOperations` and `noticeUI`.\n *\n * ```jsx\n * import { withNotices, Button } from '@wordpress/components';\n *\n * const MyComponentWithNotices = withNotices(\n * \t( { noticeOperations, noticeUI } ) => {\n * \t\tconst addError = () =>\n * \t\t\tnoticeOperations.createErrorNotice( 'Error message' );\n * \t\treturn (\n * \t\t\t<div>\n * \t\t\t\t{ noticeUI }\n * \t\t\t\t<Button variant=\"secondary\" onClick={ addError }>\n * \t\t\t\t\tAdd error\n * \t\t\t\t</Button>\n * \t\t\t</div>\n * \t\t);\n * \t}\n * );\n * ```\n *\n * @param OriginalComponent Original component.\n *\n * @return Wrapped component.\n */\nexport default createHigherOrderComponent(OriginalComponent => {\n return function Component(props) {\n const [noticeList, setNoticeList] = useState([]);\n const noticeOperations = useMemo(() => {\n const createNotice = notice => {\n const noticeToAdd = notice.id ? notice : {\n ...notice,\n id: uuid()\n };\n setNoticeList(current => [...current, noticeToAdd]);\n };\n return {\n createNotice,\n createErrorNotice: msg => {\n // @ts-expect-error TODO: Missing `id`, potentially a bug\n createNotice({\n status: 'error',\n content: msg\n });\n },\n removeNotice: id => {\n setNoticeList(current => current.filter(notice => notice.id !== id));\n },\n removeAllNotices: () => {\n setNoticeList([]);\n }\n };\n }, []);\n const propsOut = {\n ...props,\n noticeList,\n noticeOperations,\n noticeUI: noticeList.length > 0 && /*#__PURE__*/_jsx(NoticeList, {\n className: \"components-with-notices-ui\",\n notices: noticeList,\n onRemove: noticeOperations.removeNotice\n })\n };\n return /*#__PURE__*/_jsx(OriginalComponent, {\n ...propsOut\n });\n };\n}, 'withNotices');"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAA2B;AAK3B,qBAAkC;AAClC,qBAA2C;AAK3C,kBAAuB;AACvB,yBAA4B;AA8B5B,IAAO,2BAAQ,2CAA2B,uBAAqB;AAC7D,SAAO,SAAS,UAAU,OAAO;AAC/B,UAAM,CAAC,YAAY,aAAa,QAAI,yBAAS,CAAC,CAAC;AAC/C,UAAM,uBAAmB,wBAAQ,MAAM;AACrC,YAAM,eAAe,YAAU;AAC7B,cAAM,cAAc,OAAO,KAAK,SAAS;AAAA,UACvC,GAAG;AAAA,UACH,QAAI,YAAAA,IAAK;AAAA,QACX;AACA,sBAAc,aAAW,CAAC,GAAG,SAAS,WAAW,CAAC;AAAA,MACpD;AACA,aAAO;AAAA,QACL;AAAA,QACA,mBAAmB,SAAO;AAExB,uBAAa;AAAA,YACX,QAAQ;AAAA,YACR,SAAS;AAAA,UACX,CAAC;AAAA,QACH;AAAA,QACA,cAAc,QAAM;AAClB,wBAAc,aAAW,QAAQ,OAAO,YAAU,OAAO,OAAO,EAAE,CAAC;AAAA,QACrE;AAAA,QACA,kBAAkB,MAAM;AACtB,wBAAc,CAAC,CAAC;AAAA,QAClB;AAAA,MACF;AAAA,IACF,GAAG,CAAC,CAAC;AACL,UAAM,WAAW;AAAA,MACf,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA,UAAU,WAAW,SAAS,KAAkB,uCAAAC,KAAK,YAAAC,SAAY;AAAA,QAC/D,WAAW;AAAA,QACX,SAAS;AAAA,QACT,UAAU,iBAAiB;AAAA,MAC7B,CAAC;AAAA,IACH;AACA,WAAoB,uCAAAD,KAAK,mBAAmB;AAAA,MAC1C,GAAG;AAAA,IACL,CAAC;AAAA,EACH;AACF,GAAG,aAAa;",
|
|
6
6
|
"names": ["uuid", "_jsx", "NoticeList"]
|
|
7
7
|
}
|
package/build/index.cjs
CHANGED
|
@@ -140,7 +140,6 @@ __export(index_exports, {
|
|
|
140
140
|
TreeSelect: () => import_tree_select.default,
|
|
141
141
|
VisuallyHidden: () => import_visually_hidden.VisuallyHidden,
|
|
142
142
|
__experimentalAlignmentMatrixControl: () => import_alignment_matrix_control.default,
|
|
143
|
-
__experimentalApplyValueToSides: () => import_box_control.applyValueToSides,
|
|
144
143
|
__experimentalBorderBoxControl: () => import_border_box_control.BorderBoxControl,
|
|
145
144
|
__experimentalBorderControl: () => import_border_control.BorderControl,
|
|
146
145
|
__experimentalBoxControl: () => import_box_control.default,
|
|
@@ -159,11 +158,6 @@ __export(index_exports, {
|
|
|
159
158
|
__experimentalIsEmptyBorder: () => import_border_box_control.isEmptyBorder,
|
|
160
159
|
__experimentalItem: () => import_item_group.Item,
|
|
161
160
|
__experimentalItemGroup: () => import_item_group.ItemGroup,
|
|
162
|
-
__experimentalNavigation: () => import_navigation.default,
|
|
163
|
-
__experimentalNavigationBackButton: () => import_back_button.default,
|
|
164
|
-
__experimentalNavigationGroup: () => import_group.default,
|
|
165
|
-
__experimentalNavigationItem: () => import_item.default,
|
|
166
|
-
__experimentalNavigationMenu: () => import_menu.default,
|
|
167
161
|
__experimentalNavigatorBackButton: () => import_legacy2.NavigatorBackButton,
|
|
168
162
|
__experimentalNavigatorButton: () => import_legacy2.NavigatorButton,
|
|
169
163
|
__experimentalNavigatorProvider: () => import_legacy2.NavigatorProvider,
|
|
@@ -288,11 +282,6 @@ var import_menu_items_choice = __toESM(require("./menu-items-choice/index.cjs"))
|
|
|
288
282
|
var import_modal = __toESM(require("./modal/index.cjs"));
|
|
289
283
|
var import_scroll_lock = __toESM(require("./scroll-lock/index.cjs"));
|
|
290
284
|
var import_navigable_container = require("./navigable-container/index.cjs");
|
|
291
|
-
var import_navigation = __toESM(require("./navigation/index.cjs"));
|
|
292
|
-
var import_back_button = __toESM(require("./navigation/back-button/index.cjs"));
|
|
293
|
-
var import_group = __toESM(require("./navigation/group/index.cjs"));
|
|
294
|
-
var import_item = __toESM(require("./navigation/item/index.cjs"));
|
|
295
|
-
var import_menu = __toESM(require("./navigation/menu/index.cjs"));
|
|
296
285
|
var import_legacy2 = require("./navigator/legacy.cjs");
|
|
297
286
|
var import_navigator = require("./navigator/index.cjs");
|
|
298
287
|
var import_notice = __toESM(require("./notice/index.cjs"));
|
|
@@ -464,7 +453,6 @@ var import_private_apis = require("./private-apis.cjs");
|
|
|
464
453
|
TreeSelect,
|
|
465
454
|
VisuallyHidden,
|
|
466
455
|
__experimentalAlignmentMatrixControl,
|
|
467
|
-
__experimentalApplyValueToSides,
|
|
468
456
|
__experimentalBorderBoxControl,
|
|
469
457
|
__experimentalBorderControl,
|
|
470
458
|
__experimentalBoxControl,
|
|
@@ -483,11 +471,6 @@ var import_private_apis = require("./private-apis.cjs");
|
|
|
483
471
|
__experimentalIsEmptyBorder,
|
|
484
472
|
__experimentalItem,
|
|
485
473
|
__experimentalItemGroup,
|
|
486
|
-
__experimentalNavigation,
|
|
487
|
-
__experimentalNavigationBackButton,
|
|
488
|
-
__experimentalNavigationGroup,
|
|
489
|
-
__experimentalNavigationItem,
|
|
490
|
-
__experimentalNavigationMenu,
|
|
491
474
|
__experimentalNavigatorBackButton,
|
|
492
475
|
__experimentalNavigatorButton,
|
|
493
476
|
__experimentalNavigatorProvider,
|