@wordpress/components 23.1.0 → 23.3.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 +53 -0
- package/CONTRIBUTING.md +1 -1
- package/LICENSE.md +1 -1
- package/build/alignment-matrix-control/utils.js +2 -2
- package/build/alignment-matrix-control/utils.js.map +1 -1
- package/build/autocomplete/autocompleter-ui.js +1 -3
- package/build/autocomplete/autocompleter-ui.js.map +1 -1
- package/build/border-box-control/border-box-control-linked-button/component.js.map +1 -1
- package/build/border-box-control/border-box-control-linked-button/hook.js.map +1 -1
- package/build/border-control/border-control-dropdown/component.js +8 -4
- package/build/border-control/border-control-dropdown/component.js.map +1 -1
- package/build/button/deprecated.js +8 -6
- package/build/button/deprecated.js.map +1 -1
- package/build/button/index.js +52 -23
- package/build/button/index.js.map +1 -1
- package/build/button/types.js +6 -0
- package/build/button/types.js.map +1 -0
- package/build/color-list-picker/index.js.map +1 -1
- package/build/color-list-picker/types.js +6 -0
- package/build/color-list-picker/types.js.map +1 -0
- package/build/color-palette/index.js +9 -61
- package/build/color-palette/index.js.map +1 -1
- package/build/color-palette/index.native.js +24 -9
- package/build/color-palette/index.native.js.map +1 -1
- package/build/color-palette/utils.js +103 -0
- package/build/color-palette/utils.js.map +1 -0
- package/build/color-picker/component.js +1 -0
- package/build/color-picker/component.js.map +1 -1
- package/build/color-picker/styles.js +8 -10
- package/build/color-picker/styles.js.map +1 -1
- package/build/combobox-control/index.js +5 -1
- package/build/combobox-control/index.js.map +1 -1
- package/build/custom-gradient-picker/gradient-bar/utils.js +1 -1
- package/build/custom-gradient-picker/gradient-bar/utils.js.map +1 -1
- package/build/date-time/date/index.js.map +1 -1
- package/build/dropdown/index.js +20 -8
- package/build/dropdown/index.js.map +1 -1
- package/build/focal-point-picker/utils.js +1 -1
- package/build/focal-point-picker/utils.js.map +1 -1
- package/build/form-token-field/token.js +1 -1
- package/build/form-token-field/token.js.map +1 -1
- package/build/gradient-picker/index.js +9 -1
- package/build/gradient-picker/index.js.map +1 -1
- package/build/h-stack/component.js +0 -1
- package/build/h-stack/component.js.map +1 -1
- package/build/index.js +7 -17
- package/build/index.js.map +1 -1
- package/build/index.native.js +8 -18
- package/build/index.native.js.map +1 -1
- package/build/input-control/input-field.js +4 -2
- package/build/input-control/input-field.js.map +1 -1
- package/build/item-group/item/component.js +27 -3
- package/build/item-group/item/component.js.map +1 -1
- package/build/item-group/item-group/component.js +26 -3
- package/build/item-group/item-group/component.js.map +1 -1
- package/build/item-group/styles.js +14 -14
- package/build/item-group/styles.js.map +1 -1
- package/build/keyboard-shortcuts/index.js +44 -16
- package/build/keyboard-shortcuts/index.js.map +1 -1
- package/build/keyboard-shortcuts/types.js +6 -0
- package/build/keyboard-shortcuts/types.js.map +1 -0
- package/build/modal/index.js +1 -1
- package/build/modal/index.js.map +1 -1
- package/build/notice/index.js +16 -18
- package/build/notice/index.js.map +1 -1
- package/build/notice/list.js +23 -8
- package/build/notice/list.js.map +1 -1
- package/build/notice/types.js +6 -0
- package/build/notice/types.js.map +1 -0
- package/build/number-control/index.js +1 -1
- package/build/number-control/index.js.map +1 -1
- package/build/panel/row.js +5 -3
- package/build/panel/row.js.map +1 -1
- package/build/query-controls/author-select.js +7 -3
- package/build/query-controls/author-select.js.map +1 -1
- package/build/query-controls/category-select.js +7 -3
- package/build/query-controls/category-select.js.map +1 -1
- package/build/query-controls/index.js +69 -20
- package/build/query-controls/index.js.map +1 -1
- package/build/query-controls/terms.js +4 -3
- package/build/query-controls/terms.js.map +1 -1
- package/build/query-controls/types.js +6 -0
- package/build/query-controls/types.js.map +1 -0
- package/build/resizable-box/index.js +5 -4
- package/build/resizable-box/index.js.map +1 -1
- package/build/responsive-wrapper/index.js +18 -1
- package/build/responsive-wrapper/index.js.map +1 -1
- package/build/responsive-wrapper/types.js +6 -0
- package/build/responsive-wrapper/types.js.map +1 -0
- package/build/sandbox/index.js +35 -24
- package/build/sandbox/index.js.map +1 -1
- package/build/sandbox/types.js +6 -0
- package/build/sandbox/types.js.map +1 -0
- package/build/slot-fill/bubbles-virtually/fill.js +1 -0
- package/build/slot-fill/bubbles-virtually/fill.js.map +1 -1
- package/build/slot-fill/slot.js +1 -0
- package/build/slot-fill/slot.js.map +1 -1
- package/build/slot-fill/use-slot.js +1 -11
- package/build/slot-fill/use-slot.js.map +1 -1
- package/build/snackbar/index.js.map +1 -1
- package/build/snackbar/list.js.map +1 -1
- package/build/tab-panel/index.js +40 -7
- package/build/tab-panel/index.js.map +1 -1
- package/build/toolbar/index.js +42 -60
- package/build/toolbar/index.js.map +1 -1
- package/build/toolbar/toolbar/index.js +74 -0
- package/build/toolbar/toolbar/index.js.map +1 -0
- package/build/toolbar/{toolbar-container.js → toolbar/toolbar-container.js} +0 -0
- package/build/toolbar/toolbar/toolbar-container.js.map +1 -0
- package/build/toolbar/{toolbar-container.native.js → toolbar/toolbar-container.native.js} +0 -0
- package/build/toolbar/toolbar/toolbar-container.native.js.map +1 -0
- package/build/{toolbar-button → toolbar/toolbar-button}/index.js +1 -1
- package/build/toolbar/toolbar-button/index.js.map +1 -0
- package/build/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.js +0 -0
- package/build/toolbar/toolbar-button/toolbar-button-container.js.map +1 -0
- package/build/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.native.js +0 -0
- package/build/toolbar/toolbar-button/toolbar-button-container.native.js.map +1 -0
- package/build/{toolbar-context → toolbar/toolbar-context}/index.js +0 -0
- package/build/toolbar/toolbar-context/index.js.map +1 -0
- package/build/{toolbar-dropdown-menu → toolbar/toolbar-dropdown-menu}/index.js +1 -1
- package/build/toolbar/toolbar-dropdown-menu/index.js.map +1 -0
- package/build/{toolbar-group → toolbar/toolbar-group}/index.js +0 -0
- package/build/toolbar/toolbar-group/index.js.map +1 -0
- package/build/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.js +1 -1
- package/build/toolbar/toolbar-group/toolbar-group-collapsed.js.map +1 -0
- package/build/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.native.js +1 -1
- package/build/toolbar/toolbar-group/toolbar-group-collapsed.native.js.map +1 -0
- package/build/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.js +0 -0
- package/build/toolbar/toolbar-group/toolbar-group-container.js.map +1 -0
- package/build/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.native.js +0 -0
- package/build/toolbar/toolbar-group/toolbar-group-container.native.js.map +1 -0
- package/build/{toolbar-item → toolbar/toolbar-item}/index.js +0 -0
- package/build/toolbar/toolbar-item/index.js.map +1 -0
- package/build/{toolbar-item → toolbar/toolbar-item}/index.native.js +0 -0
- package/build/toolbar/toolbar-item/index.native.js.map +1 -0
- package/build/tree-grid/index.js +4 -4
- package/build/tree-grid/index.js.map +1 -1
- package/build/tree-select/index.js +2 -6
- package/build/tree-select/index.js.map +1 -1
- package/build-module/alignment-matrix-control/utils.js +2 -2
- package/build-module/alignment-matrix-control/utils.js.map +1 -1
- package/build-module/autocomplete/autocompleter-ui.js +1 -2
- package/build-module/autocomplete/autocompleter-ui.js.map +1 -1
- package/build-module/border-box-control/border-box-control-linked-button/component.js.map +1 -1
- package/build-module/border-box-control/border-box-control-linked-button/hook.js.map +1 -1
- package/build-module/border-control/border-control-dropdown/component.js +7 -4
- package/build-module/border-control/border-control-dropdown/component.js.map +1 -1
- package/build-module/button/deprecated.js +8 -5
- package/build-module/button/deprecated.js.map +1 -1
- package/build-module/button/index.js +51 -22
- package/build-module/button/index.js.map +1 -1
- package/build-module/button/types.js +2 -0
- package/build-module/button/types.js.map +1 -0
- package/build-module/color-list-picker/index.js.map +1 -1
- package/build-module/color-list-picker/types.js +2 -0
- package/build-module/color-list-picker/types.js.map +1 -0
- package/build-module/color-palette/index.js +7 -54
- package/build-module/color-palette/index.js.map +1 -1
- package/build-module/color-palette/index.native.js +24 -8
- package/build-module/color-palette/index.native.js.map +1 -1
- package/build-module/color-palette/utils.js +79 -0
- package/build-module/color-palette/utils.js.map +1 -0
- package/build-module/color-picker/component.js +1 -0
- package/build-module/color-picker/component.js.map +1 -1
- package/build-module/color-picker/styles.js +8 -9
- package/build-module/color-picker/styles.js.map +1 -1
- package/build-module/combobox-control/index.js +5 -1
- package/build-module/combobox-control/index.js.map +1 -1
- package/build-module/custom-gradient-picker/gradient-bar/utils.js +1 -1
- package/build-module/custom-gradient-picker/gradient-bar/utils.js.map +1 -1
- package/build-module/date-time/date/index.js +1 -1
- package/build-module/date-time/date/index.js.map +1 -1
- package/build-module/dropdown/index.js +19 -8
- package/build-module/dropdown/index.js.map +1 -1
- package/build-module/focal-point-picker/utils.js +1 -1
- package/build-module/focal-point-picker/utils.js.map +1 -1
- package/build-module/form-token-field/token.js +1 -1
- package/build-module/form-token-field/token.js.map +1 -1
- package/build-module/gradient-picker/index.js +9 -2
- package/build-module/gradient-picker/index.js.map +1 -1
- package/build-module/h-stack/component.js +0 -1
- package/build-module/h-stack/component.js.map +1 -1
- package/build-module/index.js +1 -6
- package/build-module/index.js.map +1 -1
- package/build-module/index.native.js +1 -6
- package/build-module/index.native.js.map +1 -1
- package/build-module/input-control/input-field.js +4 -2
- package/build-module/input-control/input-field.js.map +1 -1
- package/build-module/item-group/item/component.js +26 -2
- package/build-module/item-group/item/component.js.map +1 -1
- package/build-module/item-group/item-group/component.js +25 -2
- package/build-module/item-group/item-group/component.js.map +1 -1
- package/build-module/item-group/styles.js +14 -14
- package/build-module/item-group/styles.js.map +1 -1
- package/build-module/keyboard-shortcuts/index.js +48 -16
- package/build-module/keyboard-shortcuts/index.js.map +1 -1
- package/build-module/keyboard-shortcuts/types.js +2 -0
- package/build-module/keyboard-shortcuts/types.js.map +1 -0
- package/build-module/modal/index.js +1 -1
- package/build-module/modal/index.js.map +1 -1
- package/build-module/notice/index.js +14 -15
- package/build-module/notice/index.js.map +1 -1
- package/build-module/notice/list.js +23 -8
- package/build-module/notice/list.js.map +1 -1
- package/build-module/notice/types.js +2 -0
- package/build-module/notice/types.js.map +1 -0
- package/build-module/number-control/index.js +1 -1
- package/build-module/number-control/index.js.map +1 -1
- package/build-module/panel/row.js +5 -3
- package/build-module/panel/row.js.map +1 -1
- package/build-module/query-controls/author-select.js +7 -3
- package/build-module/query-controls/author-select.js.map +1 -1
- package/build-module/query-controls/category-select.js +8 -4
- package/build-module/query-controls/category-select.js.map +1 -1
- package/build-module/query-controls/index.js +65 -20
- package/build-module/query-controls/index.js.map +1 -1
- package/build-module/query-controls/terms.js +8 -4
- package/build-module/query-controls/terms.js.map +1 -1
- package/build-module/query-controls/types.js +2 -0
- package/build-module/query-controls/types.js.map +1 -0
- package/build-module/resizable-box/index.js +3 -2
- package/build-module/resizable-box/index.js.map +1 -1
- package/build-module/responsive-wrapper/index.js +20 -1
- package/build-module/responsive-wrapper/index.js.map +1 -1
- package/build-module/responsive-wrapper/types.js +2 -0
- package/build-module/responsive-wrapper/types.js.map +1 -0
- package/build-module/sandbox/index.js +37 -23
- package/build-module/sandbox/index.js.map +1 -1
- package/build-module/sandbox/types.js +2 -0
- package/build-module/sandbox/types.js.map +1 -0
- package/build-module/slot-fill/bubbles-virtually/fill.js +1 -0
- package/build-module/slot-fill/bubbles-virtually/fill.js.map +1 -1
- package/build-module/slot-fill/slot.js +1 -0
- package/build-module/slot-fill/slot.js.map +1 -1
- package/build-module/slot-fill/use-slot.js +2 -12
- package/build-module/slot-fill/use-slot.js.map +1 -1
- package/build-module/snackbar/index.js.map +1 -1
- package/build-module/snackbar/list.js.map +1 -1
- package/build-module/tab-panel/index.js +40 -7
- package/build-module/tab-panel/index.js.map +1 -1
- package/build-module/toolbar/index.js +6 -58
- package/build-module/toolbar/index.js.map +1 -1
- package/build-module/toolbar/toolbar/index.js +59 -0
- package/build-module/toolbar/toolbar/index.js.map +1 -0
- package/build-module/toolbar/{toolbar-container.js → toolbar/toolbar-container.js} +0 -0
- package/{build → build-module/toolbar}/toolbar/toolbar-container.js.map +1 -1
- package/build-module/toolbar/{toolbar-container.native.js → toolbar/toolbar-container.native.js} +0 -0
- package/build-module/toolbar/toolbar/toolbar-container.native.js.map +1 -0
- package/build-module/{toolbar-button → toolbar/toolbar-button}/index.js +1 -1
- package/build-module/toolbar/toolbar-button/index.js.map +1 -0
- package/build-module/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.js +0 -0
- package/build-module/toolbar/toolbar-button/toolbar-button-container.js.map +1 -0
- package/build-module/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.native.js +0 -0
- package/build-module/toolbar/toolbar-button/toolbar-button-container.native.js.map +1 -0
- package/build-module/{toolbar-context → toolbar/toolbar-context}/index.js +0 -0
- package/build-module/toolbar/toolbar-context/index.js.map +1 -0
- package/build-module/{toolbar-dropdown-menu → toolbar/toolbar-dropdown-menu}/index.js +1 -1
- package/build-module/toolbar/toolbar-dropdown-menu/index.js.map +1 -0
- package/build-module/{toolbar-group → toolbar/toolbar-group}/index.js +0 -0
- package/build-module/toolbar/toolbar-group/index.js.map +1 -0
- package/build-module/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.js +1 -1
- package/build-module/toolbar/toolbar-group/toolbar-group-collapsed.js.map +1 -0
- package/build-module/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.native.js +1 -1
- package/build-module/toolbar/toolbar-group/toolbar-group-collapsed.native.js.map +1 -0
- package/build-module/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.js +0 -0
- package/build-module/toolbar/toolbar-group/toolbar-group-container.js.map +1 -0
- package/build-module/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.native.js +0 -0
- package/build-module/toolbar/toolbar-group/toolbar-group-container.native.js.map +1 -0
- package/build-module/{toolbar-item → toolbar/toolbar-item}/index.js +0 -0
- package/build-module/toolbar/toolbar-item/index.js.map +1 -0
- package/build-module/{toolbar-item → toolbar/toolbar-item}/index.native.js +0 -0
- package/build-module/toolbar/toolbar-item/index.native.js.map +1 -0
- package/build-module/tree-grid/index.js +4 -4
- package/build-module/tree-grid/index.js.map +1 -1
- package/build-module/tree-select/index.js +2 -6
- package/build-module/tree-select/index.js.map +1 -1
- package/build-style/style-rtl.css +6 -1
- package/build-style/style.css +6 -1
- package/build-types/border-box-control/border-box-control/hook.d.ts +1 -1
- package/build-types/border-box-control/border-box-control-linked-button/component.d.ts +1 -1
- package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts +171 -160
- 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 +1 -1
- package/build-types/border-control/border-control/hook.d.ts +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 +1 -1
- package/build-types/button/deprecated.d.ts +143 -7
- package/build-types/button/deprecated.d.ts.map +1 -1
- package/build-types/button/index.d.ts +20 -3
- package/build-types/button/index.d.ts.map +1 -1
- package/build-types/button/stories/index.d.ts +20 -0
- package/build-types/button/stories/index.d.ts.map +1 -0
- package/build-types/button/test/index.d.ts +2 -0
- package/build-types/button/test/index.d.ts.map +1 -0
- package/build-types/button/types.d.ts +134 -0
- package/build-types/button/types.d.ts.map +1 -0
- package/build-types/color-list-picker/index.d.ts +5 -0
- package/build-types/color-list-picker/index.d.ts.map +1 -0
- package/build-types/color-list-picker/types.d.ts +42 -0
- package/build-types/color-list-picker/types.d.ts.map +1 -0
- package/build-types/color-palette/index.d.ts +2 -4
- package/build-types/color-palette/index.d.ts.map +1 -1
- package/build-types/color-palette/stories/index.d.ts +2 -2
- package/build-types/color-palette/styles.d.ts +1 -1
- package/build-types/color-palette/types.d.ts +1 -1
- package/build-types/color-palette/types.d.ts.map +1 -1
- package/build-types/color-palette/utils.d.ts +14 -0
- package/build-types/color-palette/utils.d.ts.map +1 -0
- package/build-types/color-picker/component.d.ts.map +1 -1
- package/build-types/color-picker/styles.d.ts +2 -2
- package/build-types/color-picker/styles.d.ts.map +1 -1
- package/build-types/dashicon/types.d.ts +0 -4
- package/build-types/dashicon/types.d.ts.map +1 -1
- package/build-types/date-time/date/index.d.ts.map +1 -1
- package/build-types/date-time/date/styles.d.ts +3 -3
- package/build-types/dropdown/index.d.ts +4 -4
- package/build-types/dropdown/index.d.ts.map +1 -1
- package/build-types/dropdown/stories/index.d.ts.map +1 -1
- package/build-types/dropdown/types.d.ts +9 -10
- package/build-types/dropdown/types.d.ts.map +1 -1
- package/build-types/focal-point-picker/utils.d.ts.map +1 -1
- package/build-types/font-size-picker/styles.d.ts +2 -2
- package/build-types/h-stack/component.d.ts +0 -1
- package/build-types/h-stack/component.d.ts.map +1 -1
- package/build-types/input-control/input-field.d.ts.map +1 -1
- package/build-types/item-group/item/component.d.ts +24 -2
- package/build-types/item-group/item/component.d.ts.map +1 -1
- package/build-types/item-group/item-group/component.d.ts +23 -2
- package/build-types/item-group/item-group/component.d.ts.map +1 -1
- package/build-types/item-group/stories/index.d.ts +15 -0
- package/build-types/item-group/stories/index.d.ts.map +1 -0
- package/build-types/item-group/styles.d.ts.map +1 -1
- package/build-types/keyboard-shortcuts/index.d.ts +38 -0
- package/build-types/keyboard-shortcuts/index.d.ts.map +1 -0
- package/build-types/keyboard-shortcuts/stories/index.d.ts +12 -0
- package/build-types/keyboard-shortcuts/stories/index.d.ts.map +1 -0
- package/build-types/keyboard-shortcuts/test/index.d.ts +2 -0
- package/build-types/keyboard-shortcuts/test/index.d.ts.map +1 -0
- package/build-types/keyboard-shortcuts/types.d.ts +48 -0
- package/build-types/keyboard-shortcuts/types.d.ts.map +1 -0
- package/build-types/modal/index.d.ts.map +1 -1
- package/build-types/navigator/navigator-back-button/component.d.ts +1 -1
- package/build-types/navigator/navigator-back-button/hook.d.ts +2 -2
- package/build-types/navigator/navigator-button/component.d.ts +1 -1
- package/build-types/navigator/navigator-button/hook.d.ts +2 -2
- package/build-types/notice/index.d.ts +16 -0
- package/build-types/notice/index.d.ts.map +1 -0
- package/build-types/notice/list.d.ts +32 -0
- package/build-types/notice/list.d.ts.map +1 -0
- package/build-types/notice/stories/index.d.ts +17 -0
- package/build-types/notice/stories/index.d.ts.map +1 -0
- package/build-types/notice/test/index.d.ts +2 -0
- package/build-types/notice/test/index.d.ts.map +1 -0
- package/build-types/notice/test/list.d.ts +2 -0
- package/build-types/notice/test/list.d.ts.map +1 -0
- package/build-types/notice/types.d.ts +128 -0
- package/build-types/notice/types.d.ts.map +1 -0
- package/build-types/number-control/styles/number-control-styles.d.ts +2 -2
- package/build-types/number-control/styles/number-control-styles.d.ts.map +1 -1
- package/build-types/placeholder/stories/index.d.ts.map +1 -1
- package/build-types/query-controls/author-select.d.ts +4 -0
- package/build-types/query-controls/author-select.d.ts.map +1 -0
- package/build-types/query-controls/category-select.d.ts +4 -0
- package/build-types/query-controls/category-select.d.ts.map +1 -0
- package/build-types/query-controls/index.d.ts +30 -0
- package/build-types/query-controls/index.d.ts.map +1 -0
- package/build-types/query-controls/stories/index.d.ts +13 -0
- package/build-types/query-controls/stories/index.d.ts.map +1 -0
- package/build-types/query-controls/terms.d.ts +13 -0
- package/build-types/query-controls/terms.d.ts.map +1 -0
- package/build-types/query-controls/test/terms.d.ts +2 -0
- package/build-types/query-controls/test/terms.d.ts.map +1 -0
- package/build-types/query-controls/types.d.ts +131 -0
- package/build-types/query-controls/types.d.ts.map +1 -0
- package/build-types/range-control/index.d.ts +1 -1
- package/build-types/resizable-box/index.d.ts +6 -7
- package/build-types/resizable-box/index.d.ts.map +1 -1
- package/build-types/resizable-box/stories/index.d.ts +61 -0
- package/build-types/resizable-box/stories/index.d.ts.map +1 -0
- package/build-types/responsive-wrapper/index.d.ts +24 -0
- package/build-types/responsive-wrapper/index.d.ts.map +1 -0
- package/build-types/responsive-wrapper/stories/index.d.ts +12 -0
- package/build-types/responsive-wrapper/stories/index.d.ts.map +1 -0
- package/build-types/responsive-wrapper/types.d.ts +22 -0
- package/build-types/responsive-wrapper/types.d.ts.map +1 -0
- package/build-types/sandbox/index.d.ts +19 -0
- package/build-types/sandbox/index.d.ts.map +1 -0
- package/build-types/sandbox/stories/index.d.ts +12 -0
- package/build-types/sandbox/stories/index.d.ts.map +1 -0
- package/build-types/sandbox/test/index.d.ts +2 -0
- package/build-types/sandbox/test/index.d.ts.map +1 -0
- package/build-types/sandbox/types.d.ts +36 -0
- package/build-types/sandbox/types.d.ts.map +1 -0
- package/build-types/slot-fill/bubbles-virtually/fill.d.ts.map +1 -1
- package/build-types/slot-fill/use-slot.d.ts.map +1 -1
- package/build-types/snackbar/index.d.ts +9 -2
- package/build-types/snackbar/index.d.ts.map +1 -1
- package/build-types/snackbar/list.d.ts.map +1 -1
- package/build-types/snackbar/types.d.ts +15 -88
- package/build-types/snackbar/types.d.ts.map +1 -1
- package/build-types/tab-panel/index.d.ts.map +1 -1
- package/build-types/tab-panel/stories/index.d.ts +1 -0
- package/build-types/tab-panel/stories/index.d.ts.map +1 -1
- package/build-types/tab-panel/types.d.ts +11 -5
- package/build-types/tab-panel/types.d.ts.map +1 -1
- package/build-types/toggle-group-control/stories/index.d.ts.map +1 -1
- package/build-types/tree-select/index.d.ts.map +1 -1
- package/build-types/ui/form-group/form-group.d.ts +2 -2
- package/package.json +18 -17
- package/src/alignment-matrix-control/utils.tsx +2 -2
- package/src/autocomplete/autocompleter-ui.js +1 -2
- package/src/autocomplete/test/index.js +1 -5
- package/src/border-box-control/border-box-control-linked-button/component.tsx +1 -1
- package/src/border-box-control/border-box-control-linked-button/hook.ts +1 -1
- package/src/border-control/border-control-dropdown/component.tsx +9 -8
- package/src/box-control/test/index.js +11 -35
- package/src/button/README.md +49 -55
- package/src/button/{deprecated.js → deprecated.tsx} +19 -4
- package/src/button/{index.js → index.tsx} +95 -34
- package/src/button/stories/index.tsx +106 -0
- package/src/button/style.scss +3 -2
- package/src/button/test/{index.js → index.tsx} +30 -7
- package/src/button/types.ts +138 -0
- package/src/checkbox-control/test/index.tsx +1 -5
- package/src/color-list-picker/{index.js → index.tsx} +3 -2
- package/src/color-list-picker/types.ts +46 -0
- package/src/color-palette/README.md +1 -1
- package/src/color-palette/index.native.js +11 -4
- package/src/color-palette/index.tsx +11 -67
- package/src/color-palette/test/index.tsx +4 -14
- package/src/color-palette/test/utils.ts +1 -1
- package/src/color-palette/types.ts +1 -1
- package/src/color-palette/utils.ts +98 -0
- package/src/color-picker/component.tsx +1 -0
- package/src/color-picker/stories/index.js +20 -60
- package/src/color-picker/styles.ts +0 -5
- package/src/color-picker/test/index.js +6 -15
- package/src/combobox-control/index.js +9 -1
- package/src/combobox-control/test/index.js +1 -6
- package/src/confirm-dialog/test/index.js +9 -29
- package/src/custom-gradient-picker/gradient-bar/utils.js +1 -1
- package/src/dashicon/types.ts +0 -6
- package/src/date-time/date/index.tsx +2 -1
- package/src/date-time/date/test/index.tsx +2 -8
- package/src/date-time/time/test/index.tsx +9 -29
- package/src/dimension-control/test/index.test.js +2 -8
- package/src/disabled/test/index.tsx +1 -5
- package/src/draggable/test/index.native.js +4 -4
- package/src/dropdown/README.md +1 -8
- package/src/dropdown/index.tsx +17 -6
- package/src/dropdown/stories/index.tsx +3 -3
- package/src/dropdown/test/index.tsx +2 -8
- package/src/dropdown/types.ts +9 -10
- package/src/dropdown-menu/README.md +1 -1
- package/src/dropdown-menu/stories/index.js +96 -27
- package/src/dropdown-menu/test/index.js +2 -8
- package/src/external-link/test/index.tsx +1 -6
- package/src/focal-point-picker/stories/index.tsx +1 -1
- package/src/focal-point-picker/test/index.js +3 -11
- package/src/focal-point-picker/utils.ts +4 -1
- package/src/font-size-picker/test/index.tsx +14 -44
- package/src/form-file-upload/test/index.tsx +2 -17
- package/src/form-toggle/test/index.tsx +1 -5
- package/src/form-token-field/test/index.tsx +80 -163
- package/src/form-token-field/token.tsx +1 -1
- package/src/gradient-picker/index.js +15 -4
- package/src/guide/stories/index.js +14 -41
- package/src/guide/test/index.js +5 -17
- package/src/h-stack/component.tsx +0 -1
- package/src/higher-order/with-filters/test/index.js +24 -24
- package/src/higher-order/with-focus-outside/test/index.js +11 -25
- package/src/higher-order/with-focus-return/test/index.js +1 -5
- package/src/index.js +8 -6
- package/src/index.native.js +8 -6
- package/src/input-control/input-field.tsx +3 -1
- package/src/input-control/test/index.js +1 -6
- package/src/isolated-event-container/test/index.js +2 -8
- package/src/item-group/item/component.tsx +26 -2
- package/src/item-group/item-group/component.tsx +25 -2
- package/src/item-group/stories/index.tsx +103 -0
- package/src/item-group/styles.ts +1 -0
- package/src/item-group/test/__snapshots__/index.js.snap +11 -10
- package/src/keyboard-shortcuts/README.md +1 -1
- package/src/keyboard-shortcuts/index.tsx +93 -0
- package/src/keyboard-shortcuts/stories/index.tsx +60 -0
- package/src/keyboard-shortcuts/test/{index.js → index.tsx} +16 -6
- package/src/keyboard-shortcuts/types.ts +51 -0
- package/src/modal/index.tsx +1 -2
- package/src/navigable-container/test/navigable-menu.js +5 -17
- package/src/navigable-container/test/tababble-container.js +3 -11
- package/src/navigation/test/index.js +3 -11
- package/src/navigator/test/index.tsx +6 -20
- package/src/notice/README.md +89 -42
- package/src/notice/{index.js → index.tsx} +28 -20
- package/src/notice/list.tsx +72 -0
- package/src/notice/stories/index.tsx +119 -0
- package/src/notice/test/__snapshots__/{index.js.snap → index.tsx.snap} +0 -0
- package/src/notice/test/{index.js → index.tsx} +7 -4
- package/src/notice/test/{list.js → list.tsx} +0 -0
- package/src/notice/types.ts +136 -0
- package/src/number-control/index.tsx +1 -1
- package/src/number-control/test/index.tsx +28 -86
- package/src/panel/row.js +3 -3
- package/src/panel/stories/index.js +62 -80
- package/src/panel/test/body.js +2 -8
- package/src/placeholder/stories/index.tsx +1 -0
- package/src/placeholder/style.scss +1 -1
- package/src/query-controls/README.md +56 -56
- package/src/query-controls/author-select.tsx +37 -0
- package/src/query-controls/category-select.tsx +46 -0
- package/src/query-controls/index.tsx +192 -0
- package/src/query-controls/stories/index.tsx +205 -0
- package/src/query-controls/terms.ts +57 -0
- package/src/query-controls/test/{terms.js → terms.ts} +36 -20
- package/src/query-controls/types.ts +150 -0
- package/src/resizable-box/README.md +2 -2
- package/src/resizable-box/index.tsx +7 -6
- package/src/resizable-box/stories/index.tsx +92 -0
- package/src/responsive-wrapper/README.md +29 -0
- package/src/responsive-wrapper/{index.js → index.tsx} +23 -2
- package/src/responsive-wrapper/stories/index.tsx +38 -0
- package/src/responsive-wrapper/types.ts +20 -0
- package/src/sandbox/README.md +45 -2
- package/src/sandbox/{index.js → index.tsx} +47 -24
- package/src/sandbox/stories/index.tsx +32 -0
- package/src/sandbox/test/{index.js → index.tsx} +9 -4
- package/src/sandbox/types.ts +34 -0
- package/src/select-control/test/select-control.tsx +1 -6
- package/src/slot-fill/bubbles-virtually/fill.js +1 -0
- package/src/slot-fill/slot.js +1 -1
- package/src/slot-fill/stories/index.js +12 -17
- package/src/slot-fill/use-slot.js +6 -16
- package/src/snackbar/index.tsx +6 -5
- package/src/snackbar/list.tsx +4 -2
- package/src/snackbar/types.ts +18 -92
- package/src/style.scss +3 -3
- package/src/tab-panel/README.md +1 -0
- package/src/tab-panel/index.tsx +42 -6
- package/src/tab-panel/stories/index.tsx +20 -0
- package/src/tab-panel/style.scss +8 -0
- package/src/tab-panel/test/index.tsx +124 -7
- package/src/tab-panel/types.ts +11 -5
- package/src/theme/test/index.tsx +4 -4
- package/src/toggle-group-control/stories/index.tsx +1 -0
- package/src/toggle-group-control/test/index.tsx +7 -23
- package/src/toolbar/index.js +6 -52
- package/src/toolbar/stories/index.js +71 -75
- package/src/toolbar/test/index.js +1 -2
- package/src/{toolbar-group/test/index.js → toolbar/test/toolbar-group.js} +1 -1
- package/src/toolbar/{README.md → toolbar/README.md} +0 -0
- package/src/toolbar/toolbar/index.js +52 -0
- package/src/toolbar/{style.native.scss → toolbar/style.native.scss} +0 -0
- package/src/toolbar/{style.scss → toolbar/style.scss} +0 -0
- package/src/toolbar/{toolbar-container.js → toolbar/toolbar-container.js} +0 -0
- package/src/toolbar/{toolbar-container.native.js → toolbar/toolbar-container.native.js} +0 -0
- package/src/{toolbar-button → toolbar/toolbar-button}/README.md +0 -0
- package/src/{toolbar-button → toolbar/toolbar-button}/index.js +1 -1
- package/src/{toolbar-button → toolbar/toolbar-button}/style.scss +0 -0
- package/src/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.js +0 -0
- package/src/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.native.js +0 -0
- package/src/{toolbar-context → toolbar/toolbar-context}/index.js +0 -0
- package/src/{toolbar-dropdown-menu → toolbar/toolbar-dropdown-menu}/README.md +0 -0
- package/src/{toolbar-dropdown-menu → toolbar/toolbar-dropdown-menu}/index.js +1 -1
- package/src/{toolbar-group → toolbar/toolbar-group}/README.md +0 -0
- package/src/{toolbar-group → toolbar/toolbar-group}/index.js +0 -0
- package/src/{toolbar-group → toolbar/toolbar-group}/style.native.scss +0 -0
- package/src/{toolbar-group → toolbar/toolbar-group}/style.scss +0 -0
- package/src/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.js +1 -1
- package/src/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.native.js +1 -1
- package/src/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.js +0 -0
- package/src/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.native.js +0 -0
- package/src/{toolbar-item → toolbar/toolbar-item}/README.md +0 -0
- package/src/{toolbar-item → toolbar/toolbar-item}/index.js +0 -0
- package/src/{toolbar-item → toolbar/toolbar-item}/index.native.js +0 -0
- package/src/tools-panel/stories/index.js +3 -0
- package/src/tools-panel/test/index.js +1 -1
- package/src/tree-grid/index.js +3 -5
- package/src/tree-select/index.tsx +3 -6
- package/src/ui/context/test/context-connect.tsx +2 -0
- package/src/ui/context/test/wordpress-component.tsx +2 -0
- package/src/unit-control/test/index.tsx +21 -74
- package/src/utils/hooks/test/use-latest-ref.js +15 -18
- package/tsconfig.json +1 -11
- package/tsconfig.tsbuildinfo +1 -1
- package/build/toolbar/toolbar-container.native.js.map +0 -1
- package/build/toolbar-button/index.js.map +0 -1
- package/build/toolbar-button/toolbar-button-container.js.map +0 -1
- package/build/toolbar-button/toolbar-button-container.native.js.map +0 -1
- package/build/toolbar-context/index.js.map +0 -1
- package/build/toolbar-dropdown-menu/index.js.map +0 -1
- package/build/toolbar-group/index.js.map +0 -1
- package/build/toolbar-group/toolbar-group-collapsed.js.map +0 -1
- package/build/toolbar-group/toolbar-group-collapsed.native.js.map +0 -1
- package/build/toolbar-group/toolbar-group-container.js.map +0 -1
- package/build/toolbar-group/toolbar-group-container.native.js.map +0 -1
- package/build/toolbar-item/index.js.map +0 -1
- package/build/toolbar-item/index.native.js.map +0 -1
- package/build-module/toolbar/toolbar-container.js.map +0 -1
- package/build-module/toolbar/toolbar-container.native.js.map +0 -1
- package/build-module/toolbar-button/index.js.map +0 -1
- package/build-module/toolbar-button/toolbar-button-container.js.map +0 -1
- package/build-module/toolbar-button/toolbar-button-container.native.js.map +0 -1
- package/build-module/toolbar-context/index.js.map +0 -1
- package/build-module/toolbar-dropdown-menu/index.js.map +0 -1
- package/build-module/toolbar-group/index.js.map +0 -1
- package/build-module/toolbar-group/toolbar-group-collapsed.js.map +0 -1
- package/build-module/toolbar-group/toolbar-group-collapsed.native.js.map +0 -1
- package/build-module/toolbar-group/toolbar-group-container.js.map +0 -1
- package/build-module/toolbar-group/toolbar-group-container.native.js.map +0 -1
- package/build-module/toolbar-item/index.js.map +0 -1
- package/build-module/toolbar-item/index.native.js.map +0 -1
- package/src/button/stories/index.js +0 -179
- package/src/item-group/stories/index.js +0 -270
- package/src/keyboard-shortcuts/index.js +0 -56
- package/src/notice/list.js +0 -48
- package/src/notice/stories/index.js +0 -74
- package/src/query-controls/author-select.js +0 -23
- package/src/query-controls/category-select.js +0 -31
- package/src/query-controls/index.js +0 -121
- package/src/query-controls/terms.js +0 -40
- package/src/resizable-box/stories/index.js +0 -97
- package/src/toolbar-button/stories/index.js +0 -33
- package/src/toolbar-group/stories/index.js +0 -33
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/tab-panel/index.tsx"],"names":["TabButton","tabId","
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/tab-panel/index.tsx"],"names":["TabButton","tabId","children","selected","rest","undefined","TabPanel","className","tabs","selectOnMove","initialTabName","orientation","activeClass","onSelect","instanceId","setSelected","handleTabSelection","tabKey","activateTabAutomatically","_childIndex","child","click","selectedTab","find","name","selectedId","initialTab","tab","disabled","firstEnabledTab","map","icon","title"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useEffect, useCallback } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { NavigableMenu } from '../navigable-container';\nimport Button from '../button';\nimport type { TabButtonProps, TabPanelProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst TabButton = ( {\n\ttabId,\n\tchildren,\n\tselected,\n\t...rest\n}: TabButtonProps ) => (\n\t<Button\n\t\trole=\"tab\"\n\t\ttabIndex={ selected ? undefined : -1 }\n\t\taria-selected={ selected }\n\t\tid={ tabId }\n\t\t__experimentalIsFocusable\n\t\t{ ...rest }\n\t>\n\t\t{ children }\n\t</Button>\n);\n\n/**\n * TabPanel is an ARIA-compliant tabpanel.\n *\n * TabPanels organize content across different screens, data sets, and interactions.\n * It has two sections: a list of tabs, and the view to show when tabs are chosen.\n *\n * ```jsx\n * import { TabPanel } from '@wordpress/components';\n *\n * const onSelect = ( tabName ) => {\n * console.log( 'Selecting tab', tabName );\n * };\n *\n * const MyTabPanel = () => (\n * <TabPanel\n * className=\"my-tab-panel\"\n * activeClass=\"active-tab\"\n * onSelect={ onSelect }\n * tabs={ [\n * {\n * name: 'tab1',\n * title: 'Tab 1',\n * className: 'tab-one',\n * },\n * {\n * name: 'tab2',\n * title: 'Tab 2',\n * className: 'tab-two',\n * },\n * ] }\n * >\n * { ( tab ) => <p>{ tab.title }</p> }\n * </TabPanel>\n * );\n * ```\n */\nexport function TabPanel( {\n\tclassName,\n\tchildren,\n\ttabs,\n\tselectOnMove = true,\n\tinitialTabName,\n\torientation = 'horizontal',\n\tactiveClass = 'is-active',\n\tonSelect,\n}: WordPressComponentProps< TabPanelProps, 'div', false > ) {\n\tconst instanceId = useInstanceId( TabPanel, 'tab-panel' );\n\tconst [ selected, setSelected ] = useState< string >();\n\n\tconst handleTabSelection = useCallback(\n\t\t( tabKey: string ) => {\n\t\t\tsetSelected( tabKey );\n\t\t\tonSelect?.( tabKey );\n\t\t},\n\t\t[ onSelect ]\n\t);\n\n\t// Simulate a click on the newly focused tab, which causes the component\n\t// to show the `tab-panel` associated with the clicked tab.\n\tconst activateTabAutomatically = (\n\t\t_childIndex: number,\n\t\tchild: HTMLButtonElement\n\t) => {\n\t\tchild.click();\n\t};\n\tconst selectedTab = tabs.find( ( { name } ) => name === selected );\n\tconst selectedId = `${ instanceId }-${ selectedTab?.name ?? 'none' }`;\n\n\t// Handle selecting the initial tab.\n\tuseEffect( () => {\n\t\t// If there's a selected tab, don't override it.\n\t\tif ( selectedTab ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst initialTab = tabs.find( ( tab ) => tab.name === initialTabName );\n\n\t\t// Wait for the denoted initial tab to be declared before making a\n\t\t// selection. This ensures that if a tab is declared lazily it can\n\t\t// still receive initial selection.\n\t\tif ( initialTabName && ! initialTab ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( initialTab && ! initialTab.disabled ) {\n\t\t\t// Select the initial tab if it's not disabled.\n\t\t\thandleTabSelection( initialTab.name );\n\t\t} else {\n\t\t\t// Fallback to the first enabled tab when the initial is disabled.\n\t\t\tconst firstEnabledTab = tabs.find( ( tab ) => ! tab.disabled );\n\t\t\tif ( firstEnabledTab ) handleTabSelection( firstEnabledTab.name );\n\t\t}\n\t}, [ tabs, selectedTab, initialTabName, handleTabSelection ] );\n\n\t// Handle the currently selected tab becoming disabled.\n\tuseEffect( () => {\n\t\t// This effect only runs when the selected tab is defined and becomes disabled.\n\t\tif ( ! selectedTab?.disabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst firstEnabledTab = tabs.find( ( tab ) => ! tab.disabled );\n\n\t\t// If the currently selected tab becomes disabled, select the first enabled tab.\n\t\t// (if there is one).\n\t\tif ( firstEnabledTab ) {\n\t\t\thandleTabSelection( firstEnabledTab.name );\n\t\t}\n\t}, [ tabs, selectedTab?.disabled, handleTabSelection ] );\n\n\treturn (\n\t\t<div className={ className }>\n\t\t\t<NavigableMenu\n\t\t\t\trole=\"tablist\"\n\t\t\t\torientation={ orientation }\n\t\t\t\tonNavigate={\n\t\t\t\t\tselectOnMove ? activateTabAutomatically : undefined\n\t\t\t\t}\n\t\t\t\tclassName=\"components-tab-panel__tabs\"\n\t\t\t>\n\t\t\t\t{ tabs.map( ( tab ) => (\n\t\t\t\t\t<TabButton\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'components-tab-panel__tabs-item',\n\t\t\t\t\t\t\ttab.className,\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t[ activeClass ]: tab.name === selected,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\ttabId={ `${ instanceId }-${ tab.name }` }\n\t\t\t\t\t\taria-controls={ `${ instanceId }-${ tab.name }-view` }\n\t\t\t\t\t\tselected={ tab.name === selected }\n\t\t\t\t\t\tkey={ tab.name }\n\t\t\t\t\t\tonClick={ () => handleTabSelection( tab.name ) }\n\t\t\t\t\t\tdisabled={ tab.disabled }\n\t\t\t\t\t\tlabel={ tab.icon && tab.title }\n\t\t\t\t\t\ticon={ tab.icon }\n\t\t\t\t\t\tshowTooltip={ !! tab.icon }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! tab.icon && tab.title }\n\t\t\t\t\t</TabButton>\n\t\t\t\t) ) }\n\t\t\t</NavigableMenu>\n\t\t\t{ selectedTab && (\n\t\t\t\t<div\n\t\t\t\t\tkey={ selectedId }\n\t\t\t\t\taria-labelledby={ selectedId }\n\t\t\t\t\trole=\"tabpanel\"\n\t\t\t\t\tid={ `${ selectedId }-view` }\n\t\t\t\t\tclassName=\"components-tab-panel__tab-content\"\n\t\t\t\t>\n\t\t\t\t\t{ children( selectedTab ) }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default TabPanel;\n"]}
|
package/build/toolbar/index.js
CHANGED
|
@@ -5,70 +5,52 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
-
exports
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
8
|
+
Object.defineProperty(exports, "Toolbar", {
|
|
9
|
+
enumerable: true,
|
|
10
|
+
get: function () {
|
|
11
|
+
return _toolbar.default;
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
Object.defineProperty(exports, "ToolbarButton", {
|
|
15
|
+
enumerable: true,
|
|
16
|
+
get: function () {
|
|
17
|
+
return _toolbarButton.default;
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
Object.defineProperty(exports, "ToolbarContext", {
|
|
21
|
+
enumerable: true,
|
|
22
|
+
get: function () {
|
|
23
|
+
return _toolbarContext.default;
|
|
24
|
+
}
|
|
25
|
+
});
|
|
26
|
+
Object.defineProperty(exports, "ToolbarDropdownMenu", {
|
|
27
|
+
enumerable: true,
|
|
28
|
+
get: function () {
|
|
29
|
+
return _toolbarDropdownMenu.default;
|
|
30
|
+
}
|
|
31
|
+
});
|
|
32
|
+
Object.defineProperty(exports, "ToolbarGroup", {
|
|
33
|
+
enumerable: true,
|
|
34
|
+
get: function () {
|
|
35
|
+
return _toolbarGroup.default;
|
|
36
|
+
}
|
|
37
|
+
});
|
|
38
|
+
Object.defineProperty(exports, "ToolbarItem", {
|
|
39
|
+
enumerable: true,
|
|
40
|
+
get: function () {
|
|
41
|
+
return _toolbarItem.default;
|
|
42
|
+
}
|
|
43
|
+
});
|
|
33
44
|
|
|
34
|
-
|
|
35
|
-
* Renders a toolbar.
|
|
36
|
-
*
|
|
37
|
-
* To add controls, simply pass `ToolbarButton` components as children.
|
|
38
|
-
*
|
|
39
|
-
* @param {Object} props Component props.
|
|
40
|
-
* @param {string} [props.className] Class to set on the container div.
|
|
41
|
-
* @param {string} [props.label] ARIA label for toolbar container.
|
|
42
|
-
* @param {Object} ref React Element ref.
|
|
43
|
-
*/
|
|
44
|
-
function Toolbar(_ref, ref) {
|
|
45
|
-
let {
|
|
46
|
-
className,
|
|
47
|
-
label,
|
|
48
|
-
...props
|
|
49
|
-
} = _ref;
|
|
45
|
+
var _toolbar = _interopRequireDefault(require("./toolbar"));
|
|
50
46
|
|
|
51
|
-
|
|
52
|
-
(0, _deprecated.default)('Using Toolbar without label prop', {
|
|
53
|
-
since: '5.6',
|
|
54
|
-
alternative: 'ToolbarGroup component',
|
|
55
|
-
link: 'https://developer.wordpress.org/block-editor/components/toolbar/'
|
|
56
|
-
});
|
|
57
|
-
return (0, _element.createElement)(_toolbarGroup.default, (0, _extends2.default)({}, props, {
|
|
58
|
-
className: className
|
|
59
|
-
}));
|
|
60
|
-
} // `ToolbarGroup` already uses components-toolbar for compatibility reasons.
|
|
47
|
+
var _toolbarButton = _interopRequireDefault(require("./toolbar-button"));
|
|
61
48
|
|
|
49
|
+
var _toolbarContext = _interopRequireDefault(require("./toolbar-context"));
|
|
62
50
|
|
|
63
|
-
|
|
64
|
-
return (0, _element.createElement)(_toolbarContainer.default, (0, _extends2.default)({
|
|
65
|
-
className: finalClassName,
|
|
66
|
-
label: label,
|
|
67
|
-
ref: ref
|
|
68
|
-
}, props));
|
|
69
|
-
}
|
|
51
|
+
var _toolbarDropdownMenu = _interopRequireDefault(require("./toolbar-dropdown-menu"));
|
|
70
52
|
|
|
71
|
-
var
|
|
53
|
+
var _toolbarGroup = _interopRequireDefault(require("./toolbar-group"));
|
|
72
54
|
|
|
73
|
-
|
|
55
|
+
var _toolbarItem = _interopRequireDefault(require("./toolbar-item"));
|
|
74
56
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/toolbar/index.js"],"names":[
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA","sourcesContent":["export { default as Toolbar } from './toolbar';\nexport { default as ToolbarButton } from './toolbar-button';\nexport { default as ToolbarContext } from './toolbar-context';\nexport { default as ToolbarDropdownMenu } from './toolbar-dropdown-menu';\nexport { default as ToolbarGroup } from './toolbar-group';\nexport { default as ToolbarItem } from './toolbar-item';\n"]}
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
|
|
10
|
+
var _element = require("@wordpress/element");
|
|
11
|
+
|
|
12
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
13
|
+
|
|
14
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
15
|
+
|
|
16
|
+
var _deprecated = _interopRequireDefault(require("@wordpress/deprecated"));
|
|
17
|
+
|
|
18
|
+
var _toolbarGroup = _interopRequireDefault(require("../toolbar-group"));
|
|
19
|
+
|
|
20
|
+
var _toolbarContainer = _interopRequireDefault(require("./toolbar-container"));
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* External dependencies
|
|
24
|
+
*/
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* WordPress dependencies
|
|
28
|
+
*/
|
|
29
|
+
|
|
30
|
+
/**
|
|
31
|
+
* Internal dependencies
|
|
32
|
+
*/
|
|
33
|
+
|
|
34
|
+
/**
|
|
35
|
+
* Renders a toolbar.
|
|
36
|
+
*
|
|
37
|
+
* To add controls, simply pass `ToolbarButton` components as children.
|
|
38
|
+
*
|
|
39
|
+
* @param {Object} props Component props.
|
|
40
|
+
* @param {string} [props.className] Class to set on the container div.
|
|
41
|
+
* @param {string} [props.label] ARIA label for toolbar container.
|
|
42
|
+
* @param {Object} ref React Element ref.
|
|
43
|
+
*/
|
|
44
|
+
function Toolbar(_ref, ref) {
|
|
45
|
+
let {
|
|
46
|
+
className,
|
|
47
|
+
label,
|
|
48
|
+
...props
|
|
49
|
+
} = _ref;
|
|
50
|
+
|
|
51
|
+
if (!label) {
|
|
52
|
+
(0, _deprecated.default)('Using Toolbar without label prop', {
|
|
53
|
+
since: '5.6',
|
|
54
|
+
alternative: 'ToolbarGroup component',
|
|
55
|
+
link: 'https://developer.wordpress.org/block-editor/components/toolbar/'
|
|
56
|
+
});
|
|
57
|
+
return (0, _element.createElement)(_toolbarGroup.default, (0, _extends2.default)({}, props, {
|
|
58
|
+
className: className
|
|
59
|
+
}));
|
|
60
|
+
} // `ToolbarGroup` already uses components-toolbar for compatibility reasons.
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
const finalClassName = (0, _classnames.default)('components-accessible-toolbar', className);
|
|
64
|
+
return (0, _element.createElement)(_toolbarContainer.default, (0, _extends2.default)({
|
|
65
|
+
className: finalClassName,
|
|
66
|
+
label: label,
|
|
67
|
+
ref: ref
|
|
68
|
+
}, props));
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
var _default = (0, _element.forwardRef)(Toolbar);
|
|
72
|
+
|
|
73
|
+
exports.default = _default;
|
|
74
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar/index.js"],"names":["Toolbar","ref","className","label","props","since","alternative","link","finalClassName"],"mappings":";;;;;;;;;AAQA;;;;AALA;;AAMA;;AAKA;;AACA;;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,OAAT,OAAkDC,GAAlD,EAAwD;AAAA,MAAtC;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,KAAb;AAAoB,OAAGC;AAAvB,GAAsC;;AACvD,MAAK,CAAED,KAAP,EAAe;AACd,6BAAY,kCAAZ,EAAgD;AAC/CE,MAAAA,KAAK,EAAE,KADwC;AAE/CC,MAAAA,WAAW,EAAE,wBAFkC;AAG/CC,MAAAA,IAAI,EAAE;AAHyC,KAAhD;AAKA,WAAO,4BAAC,qBAAD,6BAAmBH,KAAnB;AAA2B,MAAA,SAAS,EAAGF;AAAvC,OAAP;AACA,GARsD,CASvD;;;AACA,QAAMM,cAAc,GAAG,yBACtB,+BADsB,EAEtBN,SAFsB,CAAvB;AAIA,SACC,4BAAC,yBAAD;AACC,IAAA,SAAS,EAAGM,cADb;AAEC,IAAA,KAAK,EAAGL,KAFT;AAGC,IAAA,GAAG,EAAGF;AAHP,KAIMG,KAJN,EADD;AAQA;;eAEc,yBAAYJ,OAAZ,C","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport ToolbarGroup from '../toolbar-group';\nimport ToolbarContainer from './toolbar-container';\n\n/**\n * Renders a toolbar.\n *\n * To add controls, simply pass `ToolbarButton` components as children.\n *\n * @param {Object} props Component props.\n * @param {string} [props.className] Class to set on the container div.\n * @param {string} [props.label] ARIA label for toolbar container.\n * @param {Object} ref React Element ref.\n */\nfunction Toolbar( { className, label, ...props }, ref ) {\n\tif ( ! label ) {\n\t\tdeprecated( 'Using Toolbar without label prop', {\n\t\t\tsince: '5.6',\n\t\t\talternative: 'ToolbarGroup component',\n\t\t\tlink: 'https://developer.wordpress.org/block-editor/components/toolbar/',\n\t\t} );\n\t\treturn <ToolbarGroup { ...props } className={ className } />;\n\t}\n\t// `ToolbarGroup` already uses components-toolbar for compatibility reasons.\n\tconst finalClassName = classnames(\n\t\t'components-accessible-toolbar',\n\t\tclassName\n\t);\n\treturn (\n\t\t<ToolbarContainer\n\t\t\tclassName={ finalClassName }\n\t\t\tlabel={ label }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( Toolbar );\n"]}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar/toolbar-container.js"],"names":["ToolbarContainer","ref","label","props","toolbarState","loop","baseId","id","rtl"],"mappings":";;;;;;;;;AAQA;;;;AALA;;AAMA;;AAKA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAGA,SAASA,gBAAT,OAAgDC,GAAhD,EAAsD;AAAA,MAA3B;AAAEC,IAAAA,KAAF;AAAS,OAAGC;AAAZ,GAA2B;AACrD;AACA;AACA;AACA,QAAMC,YAAY,GAAG,8BAAiB;AACrCC,IAAAA,IAAI,EAAE,IAD+B;AAErCC,IAAAA,MAAM,EAAEH,KAAK,CAACI,EAFuB;AAGrCC,IAAAA,GAAG,EAAE;AAHgC,GAAjB,CAArB;AAMA,SACC;AACA,gCAAC,uBAAD,CAAgB,QAAhB;AAAyB,MAAA,KAAK,EAAGJ;AAAjC,OACC,4BAAC,gBAAD;AACC,MAAA,GAAG,EAAGH,GADP;AAEC,oBAAaC;AAFd,OAGME,YAHN,EAIMD,KAJN,EADD;AAFD;AAWA;;eAEc,yBAAYH,gBAAZ,C","sourcesContent":["/**\n * External dependencies\n */\nimport { useToolbarState, Toolbar } from 'reakit/Toolbar';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport ToolbarContext from '../toolbar-context';\n\nfunction ToolbarContainer( { label, ...props }, ref ) {\n\t// https://reakit.io/docs/basic-concepts/#state-hooks\n\t// Passing baseId for server side rendering (which includes snapshots)\n\t// If an id prop is passed to Toolbar, toolbar items will use it as a base for their ids\n\tconst toolbarState = useToolbarState( {\n\t\tloop: true,\n\t\tbaseId: props.id,\n\t\trtl: isRTL(),\n\t} );\n\n\treturn (\n\t\t// This will provide state for `ToolbarButton`'s\n\t\t<ToolbarContext.Provider value={ toolbarState }>\n\t\t\t<Toolbar\n\t\t\t\tref={ ref }\n\t\t\t\taria-label={ label }\n\t\t\t\t{ ...toolbarState }\n\t\t\t\t{ ...props }\n\t\t\t/>\n\t\t</ToolbarContext.Provider>\n\t);\n}\n\nexport default forwardRef( ToolbarContainer );\n"]}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar/toolbar-container.native.js"],"names":["ToolbarContainer","children"],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;AAGA,MAAMA,gBAAgB,GAAG;AAAA,MAAE;AAAEC,IAAAA;AAAF,GAAF;AAAA,SAAoB,4BAAC,iBAAD,QAAQA,QAAR,CAApB;AAAA,CAAzB;;eAEeD,gB","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\nconst ToolbarContainer = ( { children } ) => <View>{ children }</View>;\n\nexport default ToolbarContainer;\n"]}
|
|
@@ -13,7 +13,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
|
|
|
13
13
|
|
|
14
14
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
15
15
|
|
|
16
|
-
var _button = _interopRequireDefault(require("
|
|
16
|
+
var _button = _interopRequireDefault(require("../../button"));
|
|
17
17
|
|
|
18
18
|
var _toolbarItem = _interopRequireDefault(require("../toolbar-item"));
|
|
19
19
|
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-button/index.js"],"names":["ToolbarButton","ref","containerClassName","className","extraProps","children","title","isActive","isDisabled","props","accessibleToolbarState","ToolbarContext","icon","shortcut","subscript","event","stopPropagation","onClick","toolbarItemProps"],"mappings":";;;;;;;;;AAOA;;;;AAJA;;AAQA;;AACA;;AACA;;AACA;;AAdA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AAMA,SAASA,aAAT,OAWCC,GAXD,EAYE;AAAA,MAXD;AACCC,IAAAA,kBADD;AAECC,IAAAA,SAFD;AAGCC,IAAAA,UAHD;AAICC,IAAAA,QAJD;AAKCC,IAAAA,KALD;AAMCC,IAAAA,QAND;AAOCC,IAAAA,UAPD;AAQC,OAAGC;AARJ,GAWC;AACD,QAAMC,sBAAsB,GAAG,yBAAYC,uBAAZ,CAA/B;;AAEA,MAAK,CAAED,sBAAP,EAAgC;AAC/B,WACC,4BAAC,+BAAD;AAAwB,MAAA,SAAS,EAAGR;AAApC,OACC,4BAAC,eAAD;AACC,MAAA,GAAG,EAAGD,GADP;AAEC,MAAA,IAAI,EAAGQ,KAAK,CAACG,IAFd;AAGC,MAAA,KAAK,EAAGN,KAHT;AAIC,MAAA,QAAQ,EAAGG,KAAK,CAACI,QAJlB;AAKC,wBAAiBJ,KAAK,CAACK,SALxB;AAMC,MAAA,OAAO,EAAKC,KAAF,IAAa;AACtBA,QAAAA,KAAK,CAACC,eAAN;;AACA,YAAKP,KAAK,CAACQ,OAAX,EAAqB;AACpBR,UAAAA,KAAK,CAACQ,OAAN,CAAeF,KAAf;AACA;AACD,OAXF;AAYC,MAAA,SAAS,EAAG,yBACX,6BADW,EAEXZ,SAFW,CAZb;AAgBC,MAAA,SAAS,EAAGI,QAhBb;AAiBC,MAAA,QAAQ,EAAGC,UAjBZ;AAkBC;AAlBD,OAmBMJ,UAnBN,EAoBMK,KApBN,GAsBGJ,QAtBH,CADD,CADD;AA4BA,GAhCA,CAkCD;AACA;AACA;;;AACA,SACC,4BAAC,oBAAD;AACC,IAAA,SAAS,EAAG,yBAAY,2BAAZ,EAAyCF,SAAzC;AADb,KAEMC,UAFN,EAGMK,KAHN;AAIC,IAAA,GAAG,EAAGR;AAJP,MAMKiB,gBAAF,IACD,4BAAC,eAAD;AACC,IAAA,KAAK,EAAGZ,KADT;AAEC,IAAA,SAAS,EAAGC,QAFb;AAGC,IAAA,QAAQ,EAAGC;AAHZ,KAIMU,gBAJN,GAMGb,QANH,CAPF,CADD;AAmBA;;eAEc,yBAAYL,aAAZ,C","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n/**\n * WordPress dependencies\n */\nimport { useContext, forwardRef } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport ToolbarItem from '../toolbar-item';\nimport ToolbarContext from '../toolbar-context';\nimport ToolbarButtonContainer from './toolbar-button-container';\n\nfunction ToolbarButton(\n\t{\n\t\tcontainerClassName,\n\t\tclassName,\n\t\textraProps,\n\t\tchildren,\n\t\ttitle,\n\t\tisActive,\n\t\tisDisabled,\n\t\t...props\n\t},\n\tref\n) {\n\tconst accessibleToolbarState = useContext( ToolbarContext );\n\n\tif ( ! accessibleToolbarState ) {\n\t\treturn (\n\t\t\t<ToolbarButtonContainer className={ containerClassName }>\n\t\t\t\t<Button\n\t\t\t\t\tref={ ref }\n\t\t\t\t\ticon={ props.icon }\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tshortcut={ props.shortcut }\n\t\t\t\t\tdata-subscript={ props.subscript }\n\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tif ( props.onClick ) {\n\t\t\t\t\t\t\tprops.onClick( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-toolbar__control',\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tisPressed={ isActive }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\tdata-toolbar-item\n\t\t\t\t\t{ ...extraProps }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</Button>\n\t\t\t</ToolbarButtonContainer>\n\t\t);\n\t}\n\n\t// ToobarItem will pass all props to the render prop child, which will pass\n\t// all props to Button. This means that ToolbarButton has the same API as\n\t// Button.\n\treturn (\n\t\t<ToolbarItem\n\t\t\tclassName={ classnames( 'components-toolbar-button', className ) }\n\t\t\t{ ...extraProps }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ ( toolbarItemProps ) => (\n\t\t\t\t<Button\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tisPressed={ isActive }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\t{ ...toolbarItemProps }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</Button>\n\t\t\t) }\n\t\t</ToolbarItem>\n\t);\n}\n\nexport default forwardRef( ToolbarButton );\n"]}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-button/toolbar-button-container.js"],"names":["ToolbarButtonContainer","props","className","children"],"mappings":";;;;;;;;;AAAA,MAAMA,sBAAsB,GAAKC,KAAF,IAC9B;AAAK,EAAA,SAAS,EAAGA,KAAK,CAACC;AAAvB,GAAqCD,KAAK,CAACE,QAA3C,CADD;;eAGeH,sB","sourcesContent":["const ToolbarButtonContainer = ( props ) => (\n\t<div className={ props.className }>{ props.children }</div>\n);\nexport default ToolbarButtonContainer;\n"]}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-button/toolbar-button-container.native.js"],"names":["props","children"],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;eAGiBA,KAAF,IAAa,4BAAC,iBAAD,QAAQA,KAAK,CAACC,QAAd,C","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\nexport default ( props ) => <View>{ props.children }</View>;\n"]}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-context/index.js"],"names":["ToolbarContext"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;AAGA,MAAMA,cAAc,GAAG,6BAAvB;eAEeA,c","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nconst ToolbarContext = createContext();\n\nexport default ToolbarContext;\n"]}
|
|
@@ -15,7 +15,7 @@ var _toolbarItem = _interopRequireDefault(require("../toolbar-item"));
|
|
|
15
15
|
|
|
16
16
|
var _toolbarContext = _interopRequireDefault(require("../toolbar-context"));
|
|
17
17
|
|
|
18
|
-
var _dropdownMenu = _interopRequireDefault(require("
|
|
18
|
+
var _dropdownMenu = _interopRequireDefault(require("../../dropdown-menu"));
|
|
19
19
|
|
|
20
20
|
/**
|
|
21
21
|
* WordPress dependencies
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-dropdown-menu/index.js"],"names":["ToolbarDropdownMenu","props","ref","accessibleToolbarState","ToolbarContext","toggleProps","toolbarItemProps","variant","popoverProps"],"mappings":";;;;;;;;;AAGA;;;;AAKA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAKA,SAASA,mBAAT,CAA8BC,KAA9B,EAAqCC,GAArC,EAA2C;AAC1C,QAAMC,sBAAsB,GAAG,yBAAYC,uBAAZ,CAA/B;;AAEA,MAAK,CAAED,sBAAP,EAAgC;AAC/B,WAAO,4BAAC,qBAAD,EAAmBF,KAAnB,CAAP;AACA,GALyC,CAO1C;AACA;AACA;;;AACA,SACC,4BAAC,oBAAD;AAAa,IAAA,GAAG,EAAGC;AAAnB,KAA8BD,KAAK,CAACI,WAApC,GACKC,gBAAF,IACD,4BAAC,qBAAD,6BACML,KADN;AAEC,IAAA,YAAY,EAAG;AACdM,MAAAA,OAAO,EAAE,SADK;AAEd,SAAGN,KAAK,CAACO;AAFK,KAFhB;AAMC,IAAA,WAAW,EAAGF;AANf,KAFF,CADD;AAcA;;eAEc,yBAAYN,mBAAZ,C","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport ToolbarItem from '../toolbar-item';\nimport ToolbarContext from '../toolbar-context';\nimport DropdownMenu from '../../dropdown-menu';\n\nfunction ToolbarDropdownMenu( props, ref ) {\n\tconst accessibleToolbarState = useContext( ToolbarContext );\n\n\tif ( ! accessibleToolbarState ) {\n\t\treturn <DropdownMenu { ...props } />;\n\t}\n\n\t// ToobarItem will pass all props to the render prop child, which will pass\n\t// all props to the toggle of DropdownMenu. This means that ToolbarDropdownMenu\n\t// has the same API as DropdownMenu.\n\treturn (\n\t\t<ToolbarItem ref={ ref } { ...props.toggleProps }>\n\t\t\t{ ( toolbarItemProps ) => (\n\t\t\t\t<DropdownMenu\n\t\t\t\t\t{ ...props }\n\t\t\t\t\tpopoverProps={ {\n\t\t\t\t\t\tvariant: 'toolbar',\n\t\t\t\t\t\t...props.popoverProps,\n\t\t\t\t\t} }\n\t\t\t\t\ttoggleProps={ toolbarItemProps }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</ToolbarItem>\n\t);\n}\n\nexport default forwardRef( ToolbarDropdownMenu );\n"]}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-group/index.js"],"names":["ToolbarGroup","controls","children","className","isCollapsed","title","props","accessibleToolbarState","ToolbarContext","length","finalClassName","controlSets","Array","isArray","flatMap","controlSet","indexOfSet","map","control","indexOfControl","join"],"mappings":";;;;;;;;;AAQA;;;;AALA;;AAUA;;AACA;;AACA;;AACA;;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,YAAT,OAOI;AAAA;;AAAA,MAPmB;AACtBC,IAAAA,QAAQ,GAAG,EADW;AAEtBC,IAAAA,QAFsB;AAGtBC,IAAAA,SAHsB;AAItBC,IAAAA,WAJsB;AAKtBC,IAAAA,KALsB;AAMtB,OAAGC;AANmB,GAOnB;AACH;AACA;AACA,QAAMC,sBAAsB,GAAG,yBAAYC,uBAAZ,CAA/B;;AAEA,MAAK,CAAE,CAAEP,QAAF,IAAc,CAAEA,QAAQ,CAACQ,MAA3B,KAAuC,CAAEP,QAA9C,EAAyD;AACxD,WAAO,IAAP;AACA;;AAED,QAAMQ,cAAc,GAAG,0BACtB;AACA;AACAH,EAAAA,sBAAsB,GACnB,0BADmB,GAEnB,oBALmB,EAMtBJ,SANsB,CAAvB,CATG,CAkBH;;AACA,MAAIQ,WAAW,GAAGV,QAAlB;;AACA,MAAK,CAAEW,KAAK,CAACC,OAAN,CAAeF,WAAW,CAAE,CAAF,CAA1B,CAAP,EAA2C;AAC1CA,IAAAA,WAAW,GAAG,CAAEA,WAAF,CAAd;AACA;;AAED,MAAKP,WAAL,EAAmB;AAClB,WACC,4BAAC,8BAAD;AACC,MAAA,KAAK,EAAGC,KADT;AAEC,MAAA,QAAQ,EAAGM,WAFZ;AAGC,MAAA,SAAS,EAAGD,cAHb;AAIC,MAAA,QAAQ,EAAGR;AAJZ,OAKMI,KALN,EADD;AASA;;AAED,SACC,4BAAC,8BAAD;AAAuB,IAAA,SAAS,EAAGI;AAAnC,KAAyDJ,KAAzD,mBACGK,WADH,iDACG,aAAaG,OAAb,CAAsB,CAAEC,UAAF,EAAcC,UAAd,KACvBD,UAAU,CAACE,GAAX,CAAgB,CAAEC,OAAF,EAAWC,cAAX,KACf,4BAAC,sBAAD;AACC,IAAA,GAAG,EAAG,CAAEH,UAAF,EAAcG,cAAd,EAA+BC,IAA/B,EADP;AAEC,IAAA,kBAAkB,EACjBJ,UAAU,GAAG,CAAb,IAAkBG,cAAc,KAAK,CAArC,GACG,kBADH,GAEG;AALL,KAOMD,OAPN,EADD,CADC,CADH,EAcGhB,QAdH,CADD;AAkBA;;eAEcF,Y","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport ToolbarButton from '../toolbar-button';\nimport ToolbarGroupContainer from './toolbar-group-container';\nimport ToolbarGroupCollapsed from './toolbar-group-collapsed';\nimport ToolbarContext from '../toolbar-context';\n\n/**\n * Renders a collapsible group of controls\n *\n * The `controls` prop accepts an array of sets. A set is an array of controls.\n * Controls have the following shape:\n *\n * ```\n * {\n * icon: string,\n * title: string,\n * subscript: string,\n * onClick: Function,\n * isActive: boolean,\n * isDisabled: boolean\n * }\n * ```\n *\n * For convenience it is also possible to pass only an array of controls. It is\n * then assumed this is the only set.\n *\n * Either `controls` or `children` is required, otherwise this components\n * renders nothing.\n *\n * @param {Object} props Component props.\n * @param {Array} [props.controls] The controls to render in this toolbar.\n * @param {WPElement} [props.children] Any other things to render inside the toolbar besides the controls.\n * @param {string} [props.className] Class to set on the container div.\n * @param {boolean} [props.isCollapsed] Turns ToolbarGroup into a dropdown menu.\n * @param {string} [props.title] ARIA label for dropdown menu if is collapsed.\n */\nfunction ToolbarGroup( {\n\tcontrols = [],\n\tchildren,\n\tclassName,\n\tisCollapsed,\n\ttitle,\n\t...props\n} ) {\n\t// It'll contain state if `ToolbarGroup` is being used within\n\t// `<Toolbar label=\"label\" />`\n\tconst accessibleToolbarState = useContext( ToolbarContext );\n\n\tif ( ( ! controls || ! controls.length ) && ! children ) {\n\t\treturn null;\n\t}\n\n\tconst finalClassName = classnames(\n\t\t// Unfortunately, there's legacy code referencing to `.components-toolbar`\n\t\t// So we can't get rid of it\n\t\taccessibleToolbarState\n\t\t\t? 'components-toolbar-group'\n\t\t\t: 'components-toolbar',\n\t\tclassName\n\t);\n\n\t// Normalize controls to nested array of objects (sets of controls)\n\tlet controlSets = controls;\n\tif ( ! Array.isArray( controlSets[ 0 ] ) ) {\n\t\tcontrolSets = [ controlSets ];\n\t}\n\n\tif ( isCollapsed ) {\n\t\treturn (\n\t\t\t<ToolbarGroupCollapsed\n\t\t\t\tlabel={ title }\n\t\t\t\tcontrols={ controlSets }\n\t\t\t\tclassName={ finalClassName }\n\t\t\t\tchildren={ children }\n\t\t\t\t{ ...props }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<ToolbarGroupContainer className={ finalClassName } { ...props }>\n\t\t\t{ controlSets?.flatMap( ( controlSet, indexOfSet ) =>\n\t\t\t\tcontrolSet.map( ( control, indexOfControl ) => (\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\tkey={ [ indexOfSet, indexOfControl ].join() }\n\t\t\t\t\t\tcontainerClassName={\n\t\t\t\t\t\t\tindexOfSet > 0 && indexOfControl === 0\n\t\t\t\t\t\t\t\t? 'has-left-divider'\n\t\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{ ...control }\n\t\t\t\t\t/>\n\t\t\t\t) )\n\t\t\t) }\n\t\t\t{ children }\n\t\t</ToolbarGroupContainer>\n\t);\n}\n\nexport default ToolbarGroup;\n"]}
|
|
@@ -11,7 +11,7 @@ var _element = require("@wordpress/element");
|
|
|
11
11
|
|
|
12
12
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
13
13
|
|
|
14
|
-
var _dropdownMenu = _interopRequireDefault(require("
|
|
14
|
+
var _dropdownMenu = _interopRequireDefault(require("../../dropdown-menu"));
|
|
15
15
|
|
|
16
16
|
var _toolbarContext = _interopRequireDefault(require("../toolbar-context"));
|
|
17
17
|
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-group/toolbar-group-collapsed.js"],"names":["ToolbarGroupCollapsed","controls","toggleProps","props","accessibleToolbarState","ToolbarContext","renderDropdownMenu","internalToggleProps"],"mappings":";;;;;;;;;AAGA;;;;AAKA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAKA,SAASA,qBAAT,OAA2E;AAAA,MAA3C;AAAEC,IAAAA,QAAQ,GAAG,EAAb;AAAiBC,IAAAA,WAAjB;AAA8B,OAAGC;AAAjC,GAA2C;AAC1E;AACA;AACA,QAAMC,sBAAsB,GAAG,yBAAYC,uBAAZ,CAA/B;;AAEA,QAAMC,kBAAkB,GAAKC,mBAAF,IAC1B,4BAAC,qBAAD;AACC,IAAA,QAAQ,EAAGN,QADZ;AAEC,IAAA,WAAW,EAAG,EACb,GAAGM,mBADU;AAEb,2BAAqB;AAFR;AAFf,KAMMJ,KANN,EADD;;AAWA,MAAKC,sBAAL,EAA8B;AAC7B,WACC,4BAAC,oBAAD,EAAkBF,WAAlB,EAAkCI,kBAAlC,CADD;AAGA;;AAED,SAAOA,kBAAkB,CAAEJ,WAAF,CAAzB;AACA;;eAEcF,qB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport DropdownMenu from '../../dropdown-menu';\nimport ToolbarContext from '../toolbar-context';\nimport ToolbarItem from '../toolbar-item';\n\nfunction ToolbarGroupCollapsed( { controls = [], toggleProps, ...props } ) {\n\t// It'll contain state if `ToolbarGroup` is being used within\n\t// `<Toolbar label=\"label\" />`\n\tconst accessibleToolbarState = useContext( ToolbarContext );\n\n\tconst renderDropdownMenu = ( internalToggleProps ) => (\n\t\t<DropdownMenu\n\t\t\tcontrols={ controls }\n\t\t\ttoggleProps={ {\n\t\t\t\t...internalToggleProps,\n\t\t\t\t'data-toolbar-item': true,\n\t\t\t} }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n\n\tif ( accessibleToolbarState ) {\n\t\treturn (\n\t\t\t<ToolbarItem { ...toggleProps }>{ renderDropdownMenu }</ToolbarItem>\n\t\t);\n\t}\n\n\treturn renderDropdownMenu( toggleProps );\n}\n\nexport default ToolbarGroupCollapsed;\n"]}
|
|
@@ -15,7 +15,7 @@ var _reactNative = require("react-native");
|
|
|
15
15
|
|
|
16
16
|
var _compose = require("@wordpress/compose");
|
|
17
17
|
|
|
18
|
-
var _dropdownMenu = _interopRequireDefault(require("
|
|
18
|
+
var _dropdownMenu = _interopRequireDefault(require("../../dropdown-menu"));
|
|
19
19
|
|
|
20
20
|
var _style = _interopRequireDefault(require("./style.scss"));
|
|
21
21
|
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-group/toolbar-group-collapsed.native.js"],"names":["ToolbarGroupCollapsed","controls","getStylesFromColorScheme","passedStyle","props","styles","container","containerDark"],"mappings":";;;;;;;;;;;;;AAGA;;AAIA;;AAIA;;AACA;;AAZA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AAIA,SAASA,qBAAT,OAKI;AAAA,MAL4B;AAC/BC,IAAAA,QAAQ,GAAG,EADoB;AAE/BC,IAAAA,wBAF+B;AAG/BC,IAAAA,WAH+B;AAI/B,OAAGC;AAJ4B,GAK5B;AACH,SACC,4BAAC,iBAAD;AACC,IAAA,KAAK,EAAG,CACPF,wBAAwB,CACvBG,eAAOC,SADgB,EAEvBD,eAAOE,aAFgB,CADjB,EAKPJ,WALO;AADT,KASC,4BAAC,qBAAD;AAAc,IAAA,QAAQ,EAAGF;AAAzB,KAAyCG,KAAzC,EATD,CADD;AAaA;;eAEc,uCAA0BJ,qBAA1B,C","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport DropdownMenu from '../../dropdown-menu';\nimport styles from './style.scss';\n\nfunction ToolbarGroupCollapsed( {\n\tcontrols = [],\n\tgetStylesFromColorScheme,\n\tpassedStyle,\n\t...props\n} ) {\n\treturn (\n\t\t<View\n\t\t\tstyle={ [\n\t\t\t\tgetStylesFromColorScheme(\n\t\t\t\t\tstyles.container,\n\t\t\t\t\tstyles.containerDark\n\t\t\t\t),\n\t\t\t\tpassedStyle,\n\t\t\t] }\n\t\t>\n\t\t\t<DropdownMenu controls={ controls } { ...props } />\n\t\t</View>\n\t);\n}\n\nexport default withPreferredColorScheme( ToolbarGroupCollapsed );\n"]}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-group/toolbar-group-container.js"],"names":["ToolbarGroupContainer","className","children","props"],"mappings":";;;;;;;;;;;;;AAAA,MAAMA,qBAAqB,GAAG;AAAA,MAAE;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,QAAb;AAAuB,OAAGC;AAA1B,GAAF;AAAA,SAC7B;AAAK,IAAA,SAAS,EAAGF;AAAjB,KAAkCE,KAAlC,GACGD,QADH,CAD6B;AAAA,CAA9B;;eAKeF,qB","sourcesContent":["const ToolbarGroupContainer = ( { className, children, ...props } ) => (\n\t<div className={ className } { ...props }>\n\t\t{ children }\n\t</div>\n);\nexport default ToolbarGroupContainer;\n"]}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-group/toolbar-group-container.native.js"],"names":["ToolbarGroupContainer","getStylesFromColorScheme","passedStyle","children","styles","container","containerDark"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAGA,MAAMA,qBAAqB,GAAG;AAAA,MAAE;AAC/BC,IAAAA,wBAD+B;AAE/BC,IAAAA,WAF+B;AAG/BC,IAAAA;AAH+B,GAAF;AAAA,SAK7B,4BAAC,iBAAD;AACC,IAAA,KAAK,EAAG,CACPF,wBAAwB,CAAEG,eAAOC,SAAT,EAAoBD,eAAOE,aAA3B,CADjB,EAEPJ,WAFO;AADT,KAMGC,QANH,CAL6B;AAAA,CAA9B;;eAee,uCAA0BH,qBAA1B,C","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nconst ToolbarGroupContainer = ( {\n\tgetStylesFromColorScheme,\n\tpassedStyle,\n\tchildren,\n} ) => (\n\t<View\n\t\tstyle={ [\n\t\t\tgetStylesFromColorScheme( styles.container, styles.containerDark ),\n\t\t\tpassedStyle,\n\t\t] }\n\t>\n\t\t{ children }\n\t</View>\n);\n\nexport default withPreferredColorScheme( ToolbarGroupContainer );\n"]}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-item/index.js"],"names":["ToolbarItem","ref","children","as","Component","props","accessibleToolbarState","ToolbarContext","allProps"],"mappings":";;;;;;;;;AAQA;;;;AALA;;AAMA;;AAKA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAGA,SAASA,WAAT,OAA6DC,GAA7D,EAAmE;AAAA,MAA7C;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,EAAE,EAAEC,SAAhB;AAA2B,OAAGC;AAA9B,GAA6C;AAClE,QAAMC,sBAAsB,GAAG,yBAAYC,uBAAZ,CAA/B;;AAEA,MAAK,OAAOL,QAAP,KAAoB,UAApB,IAAkC,CAAEE,SAAzC,EAAqD;AACpD,mHACC,yIACC,2EAFF;AAIA,WAAO,IAAP;AACA;;AAED,QAAMI,QAAQ,GAAG,EAAE,GAAGH,KAAL;AAAYJ,IAAAA,GAAZ;AAAiB,yBAAqB;AAAtC,GAAjB;;AAEA,MAAK,CAAEK,sBAAP,EAAgC;AAC/B,QAAKF,SAAL,EAAiB;AAChB,aAAO,4BAAC,SAAD,EAAgBI,QAAhB,EAA6BN,QAA7B,CAAP;AACA;;AACD,WAAOA,QAAQ,CAAEM,QAAF,CAAf;AACA;;AAED,SACC,4BAAC,oBAAD,6BACMF,sBADN,EAEME,QAFN;AAGC,IAAA,EAAE,EAAGJ;AAHN,MAKGF,QALH,CADD;AASA;;eAEc,yBAAYF,WAAZ,C","sourcesContent":["/**\n * External dependencies\n */\nimport { ToolbarItem as BaseToolbarItem } from 'reakit/Toolbar';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useContext } from '@wordpress/element';\nimport warning from '@wordpress/warning';\n\n/**\n * Internal dependencies\n */\nimport ToolbarContext from '../toolbar-context';\n\nfunction ToolbarItem( { children, as: Component, ...props }, ref ) {\n\tconst accessibleToolbarState = useContext( ToolbarContext );\n\n\tif ( typeof children !== 'function' && ! Component ) {\n\t\twarning(\n\t\t\t'`ToolbarItem` is a generic headless component. You must pass either a `children` prop as a function or an `as` prop as a component. ' +\n\t\t\t\t'See https://developer.wordpress.org/block-editor/components/toolbar-item/'\n\t\t);\n\t\treturn null;\n\t}\n\n\tconst allProps = { ...props, ref, 'data-toolbar-item': true };\n\n\tif ( ! accessibleToolbarState ) {\n\t\tif ( Component ) {\n\t\t\treturn <Component { ...allProps }>{ children }</Component>;\n\t\t}\n\t\treturn children( allProps );\n\t}\n\n\treturn (\n\t\t<BaseToolbarItem\n\t\t\t{ ...accessibleToolbarState }\n\t\t\t{ ...allProps }\n\t\t\tas={ Component }\n\t\t>\n\t\t\t{ children }\n\t\t</BaseToolbarItem>\n\t);\n}\n\nexport default forwardRef( ToolbarItem );\n"]}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-item/index.native.js"],"names":["ToolbarItem","ref","children","props"],"mappings":";;;;;;;;;AAGA;;AACA;;AAJA;AACA;AACA;AAIA,SAASA,WAAT,OAA8CC,GAA9C,EAAoD;AAAA,MAA9B;AAAEC,IAAAA,QAAF;AAAY,OAAGC;AAAf,GAA8B;;AACnD,MAAK,OAAOD,QAAP,KAAoB,UAAzB,EAAsC;AACrC,mHACC,yFADD;AAGA,WAAO,IAAP;AACA;;AACD,SAAOA,QAAQ,CAAE,EAAE,GAAGC,KAAL;AAAYF,IAAAA;AAAZ,GAAF,CAAf;AACA;;eAEc,yBAAYD,WAAZ,C","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport warning from '@wordpress/warning';\n\nfunction ToolbarItem( { children, ...props }, ref ) {\n\tif ( typeof children !== 'function' ) {\n\t\twarning(\n\t\t\t'`ToolbarItem` is a generic headless component that accepts only function children props'\n\t\t);\n\t\treturn null;\n\t}\n\treturn children( { ...props, ref } );\n}\n\nexport default forwardRef( ToolbarItem );\n"]}
|
package/build/tree-grid/index.js
CHANGED
|
@@ -55,7 +55,7 @@ var _item = _interopRequireDefault(require("./item"));
|
|
|
55
55
|
*
|
|
56
56
|
* @param {Element} rowElement The DOM element representing the row.
|
|
57
57
|
*
|
|
58
|
-
* @return {
|
|
58
|
+
* @return {Array | undefined} The array of focusables in the row.
|
|
59
59
|
*/
|
|
60
60
|
function getRowFocusables(rowElement) {
|
|
61
61
|
const focusablesInRow = _dom.focus.focusable.find(rowElement, {
|
|
@@ -175,15 +175,15 @@ function TreeGrid(_ref, ref) {
|
|
|
175
175
|
onExpandRow(activeRow);
|
|
176
176
|
event.preventDefault();
|
|
177
177
|
return;
|
|
178
|
-
} // If a row is focused, and it is expanded, focuses the
|
|
178
|
+
} // If a row is focused, and it is expanded, focuses the next cell in the row.
|
|
179
179
|
|
|
180
180
|
|
|
181
181
|
const focusableItems = getRowFocusables(activeRow);
|
|
182
182
|
|
|
183
183
|
if (focusableItems.length > 0) {
|
|
184
|
-
var _focusableItems;
|
|
184
|
+
var _focusableItems$nextI;
|
|
185
185
|
|
|
186
|
-
(_focusableItems = focusableItems[
|
|
186
|
+
(_focusableItems$nextI = focusableItems[nextIndex]) === null || _focusableItems$nextI === void 0 ? void 0 : _focusableItems$nextI.focus();
|
|
187
187
|
}
|
|
188
188
|
} // Prevent key use for anything else. For example, Voiceover
|
|
189
189
|
// will start reading text on continued use of left/right arrow
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/tree-grid/index.js"],"names":["getRowFocusables","rowElement","focusablesInRow","focus","focusable","find","sequential","length","filter","closest","TreeGrid","ref","children","onExpandRow","onCollapseRow","onFocusRow","applicationAriaLabel","props","onKeyDown","event","keyCode","metaKey","ctrlKey","altKey","hasModifierKeyPressed","UP","DOWN","LEFT","RIGHT","HOME","END","includes","stopPropagation","activeElement","document","currentTarget","treeGridElement","contains","activeRow","currentColumnIndex","indexOf","canExpandCollapse","cannotFocusNextColumn","getAttribute","nextIndex","Math","max","min","preventDefault","level","parseInt","rows","Array","from","querySelectorAll","parentRow","currentRowIndex","i","focusableItems","nextRowIndex","focusablesInNextRow"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { focus } from '@wordpress/dom';\nimport { forwardRef, useCallback } from '@wordpress/element';\nimport { UP, DOWN, LEFT, RIGHT, HOME, END } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport RovingTabIndexContainer from './roving-tab-index';\n\n/**\n * Return focusables in a row element, excluding those from other branches\n * nested within the row.\n *\n * @param {Element} rowElement The DOM element representing the row.\n *\n * @return {?Array} The array of focusables in the row.\n */\nfunction getRowFocusables( rowElement ) {\n\tconst focusablesInRow = focus.focusable.find( rowElement, {\n\t\tsequential: true,\n\t} );\n\n\tif ( ! focusablesInRow || ! focusablesInRow.length ) {\n\t\treturn;\n\t}\n\n\treturn focusablesInRow.filter( ( focusable ) => {\n\t\treturn focusable.closest( '[role=\"row\"]' ) === rowElement;\n\t} );\n}\n\n/**\n * Renders both a table and tbody element, used to create a tree hierarchy.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md\n * @param {Object} props Component props.\n * @param {WPElement} props.children Children to be rendered.\n * @param {Function} props.onExpandRow Callback to fire when row is expanded.\n * @param {Function} props.onCollapseRow Callback to fire when row is collapsed.\n * @param {Function} props.onFocusRow Callback to fire when moving focus to a different row.\n * @param {string} props.applicationAriaLabel Label to use for the application role.\n * @param {Object} ref A ref to the underlying DOM table element.\n */\nfunction TreeGrid(\n\t{\n\t\tchildren,\n\t\tonExpandRow = () => {},\n\t\tonCollapseRow = () => {},\n\t\tonFocusRow = () => {},\n\t\tapplicationAriaLabel,\n\t\t...props\n\t},\n\tref\n) {\n\tconst onKeyDown = useCallback(\n\t\t( event ) => {\n\t\t\tconst { keyCode, metaKey, ctrlKey, altKey } = event;\n\n\t\t\t// The shift key is intentionally absent from the following list,\n\t\t\t// to enable shift + up/down to select items from the list.\n\t\t\tconst hasModifierKeyPressed = metaKey || ctrlKey || altKey;\n\n\t\t\tif (\n\t\t\t\thasModifierKeyPressed ||\n\t\t\t\t! [ UP, DOWN, LEFT, RIGHT, HOME, END ].includes( keyCode )\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// The event will be handled, stop propagation.\n\t\t\tevent.stopPropagation();\n\n\t\t\tconst { activeElement } = document;\n\t\t\tconst { currentTarget: treeGridElement } = event;\n\t\t\tif ( ! treeGridElement.contains( activeElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Calculate the columnIndex of the active element.\n\t\t\tconst activeRow = activeElement.closest( '[role=\"row\"]' );\n\t\t\tconst focusablesInRow = getRowFocusables( activeRow );\n\t\t\tconst currentColumnIndex = focusablesInRow.indexOf( activeElement );\n\t\t\tconst canExpandCollapse = 0 === currentColumnIndex;\n\t\t\tconst cannotFocusNextColumn =\n\t\t\t\tcanExpandCollapse &&\n\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'false' &&\n\t\t\t\tkeyCode === RIGHT;\n\n\t\t\tif ( [ LEFT, RIGHT ].includes( keyCode ) ) {\n\t\t\t\t// Calculate to the next element.\n\t\t\t\tlet nextIndex;\n\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\tnextIndex = Math.max( 0, currentColumnIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextIndex = Math.min(\n\t\t\t\t\t\tcurrentColumnIndex + 1,\n\t\t\t\t\t\tfocusablesInRow.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is at the left most column.\n\t\t\t\tif ( canExpandCollapse ) {\n\t\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\t\t// Left:\n\t\t\t\t\t\t// If a row is focused, and it is expanded, collapses the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'true'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonCollapseRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, moves to the parent row (if there is one).\n\t\t\t\t\t\tconst level = Math.max(\n\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\tactiveRow?.getAttribute( 'aria-level' ) ?? 1,\n\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t) - 1,\n\t\t\t\t\t\t\t1\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst rows = Array.from(\n\t\t\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t\t\t);\n\t\t\t\t\t\tlet parentRow = activeRow;\n\t\t\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\t\t\tfor ( let i = currentRowIndex; i >= 0; i-- ) {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\t\trows[ i ].getAttribute( 'aria-level' ),\n\t\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t\t) === level\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tparentRow = rows[ i ];\n\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tgetRowFocusables( parentRow )?.[ 0 ]?.focus();\n\t\t\t\t\t}\n\t\t\t\t\tif ( keyCode === RIGHT ) {\n\t\t\t\t\t\t// Right:\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, expands the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) ===\n\t\t\t\t\t\t\t'false'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonExpandRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is expanded, focuses the rightmost cell in the row.\n\t\t\t\t\t\tconst focusableItems = getRowFocusables( activeRow );\n\t\t\t\t\t\tif ( focusableItems.length > 0 ) {\n\t\t\t\t\t\t\tfocusableItems[\n\t\t\t\t\t\t\t\tfocusableItems.length - 1\n\t\t\t\t\t\t\t]?.focus();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start reading text on continued use of left/right arrow\n\t\t\t\t\t// keys.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Focus the next element. If at most left column and row is collapsed, moving right is not allowed as this will expand. However, if row is collapsed, moving left is allowed.\n\t\t\t\tif ( cannotFocusNextColumn ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tfocusablesInRow[ nextIndex ].focus();\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( [ UP, DOWN ].includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === UP ) {\n\t\t\t\t\tnextRowIndex = Math.max( 0, currentRowIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = Math.min(\n\t\t\t\t\t\tcurrentRowIndex + 1,\n\t\t\t\t\t\trows.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( [ HOME, END ].includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === HOME ) {\n\t\t\t\t\tnextRowIndex = 0;\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = rows.length - 1;\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ onExpandRow, onCollapseRow, onFocusRow ]\n\t);\n\n\t/* Disable reason: A treegrid is implemented using a table element. */\n\t/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n\treturn (\n\t\t<RovingTabIndexContainer>\n\t\t\t{\n\t\t\t\t// Prevent browser mode from triggering in NVDA by wrapping List View\n\t\t\t\t// in a role=application wrapper.\n\t\t\t\t// see: https://github.com/WordPress/gutenberg/issues/43729\n\t\t\t }\n\t\t\t<div role=\"application\" aria-label={ applicationAriaLabel }>\n\t\t\t\t<table\n\t\t\t\t\t{ ...props }\n\t\t\t\t\trole=\"treegrid\"\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t\tref={ ref }\n\t\t\t\t>\n\t\t\t\t\t<tbody>{ children }</tbody>\n\t\t\t\t</table>\n\t\t\t</div>\n\t\t</RovingTabIndexContainer>\n\t);\n\t/* eslint-enable jsx-a11y/no-noninteractive-element-to-interactive-role */\n}\n\nexport default forwardRef( TreeGrid );\nexport { default as TreeGridRow } from './row';\nexport { default as TreeGridCell } from './cell';\nexport { default as TreeGridItem } from './item';\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/tree-grid/index.js"],"names":["getRowFocusables","rowElement","focusablesInRow","focus","focusable","find","sequential","length","filter","closest","TreeGrid","ref","children","onExpandRow","onCollapseRow","onFocusRow","applicationAriaLabel","props","onKeyDown","event","keyCode","metaKey","ctrlKey","altKey","hasModifierKeyPressed","UP","DOWN","LEFT","RIGHT","HOME","END","includes","stopPropagation","activeElement","document","currentTarget","treeGridElement","contains","activeRow","currentColumnIndex","indexOf","canExpandCollapse","cannotFocusNextColumn","getAttribute","nextIndex","Math","max","min","preventDefault","level","parseInt","rows","Array","from","querySelectorAll","parentRow","currentRowIndex","i","focusableItems","nextRowIndex","focusablesInNextRow"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { focus } from '@wordpress/dom';\nimport { forwardRef, useCallback } from '@wordpress/element';\nimport { UP, DOWN, LEFT, RIGHT, HOME, END } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport RovingTabIndexContainer from './roving-tab-index';\n\n/**\n * Return focusables in a row element, excluding those from other branches\n * nested within the row.\n *\n * @param {Element} rowElement The DOM element representing the row.\n *\n * @return {Array | undefined} The array of focusables in the row.\n */\nfunction getRowFocusables( rowElement ) {\n\tconst focusablesInRow = focus.focusable.find( rowElement, {\n\t\tsequential: true,\n\t} );\n\n\tif ( ! focusablesInRow || ! focusablesInRow.length ) {\n\t\treturn;\n\t}\n\n\treturn focusablesInRow.filter( ( focusable ) => {\n\t\treturn focusable.closest( '[role=\"row\"]' ) === rowElement;\n\t} );\n}\n\n/**\n * Renders both a table and tbody element, used to create a tree hierarchy.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md\n * @param {Object} props Component props.\n * @param {WPElement} props.children Children to be rendered.\n * @param {Function} props.onExpandRow Callback to fire when row is expanded.\n * @param {Function} props.onCollapseRow Callback to fire when row is collapsed.\n * @param {Function} props.onFocusRow Callback to fire when moving focus to a different row.\n * @param {string} props.applicationAriaLabel Label to use for the application role.\n * @param {Object} ref A ref to the underlying DOM table element.\n */\nfunction TreeGrid(\n\t{\n\t\tchildren,\n\t\tonExpandRow = () => {},\n\t\tonCollapseRow = () => {},\n\t\tonFocusRow = () => {},\n\t\tapplicationAriaLabel,\n\t\t...props\n\t},\n\tref\n) {\n\tconst onKeyDown = useCallback(\n\t\t( event ) => {\n\t\t\tconst { keyCode, metaKey, ctrlKey, altKey } = event;\n\n\t\t\t// The shift key is intentionally absent from the following list,\n\t\t\t// to enable shift + up/down to select items from the list.\n\t\t\tconst hasModifierKeyPressed = metaKey || ctrlKey || altKey;\n\n\t\t\tif (\n\t\t\t\thasModifierKeyPressed ||\n\t\t\t\t! [ UP, DOWN, LEFT, RIGHT, HOME, END ].includes( keyCode )\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// The event will be handled, stop propagation.\n\t\t\tevent.stopPropagation();\n\n\t\t\tconst { activeElement } = document;\n\t\t\tconst { currentTarget: treeGridElement } = event;\n\t\t\tif ( ! treeGridElement.contains( activeElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Calculate the columnIndex of the active element.\n\t\t\tconst activeRow = activeElement.closest( '[role=\"row\"]' );\n\t\t\tconst focusablesInRow = getRowFocusables( activeRow );\n\t\t\tconst currentColumnIndex = focusablesInRow.indexOf( activeElement );\n\t\t\tconst canExpandCollapse = 0 === currentColumnIndex;\n\t\t\tconst cannotFocusNextColumn =\n\t\t\t\tcanExpandCollapse &&\n\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'false' &&\n\t\t\t\tkeyCode === RIGHT;\n\n\t\t\tif ( [ LEFT, RIGHT ].includes( keyCode ) ) {\n\t\t\t\t// Calculate to the next element.\n\t\t\t\tlet nextIndex;\n\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\tnextIndex = Math.max( 0, currentColumnIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextIndex = Math.min(\n\t\t\t\t\t\tcurrentColumnIndex + 1,\n\t\t\t\t\t\tfocusablesInRow.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is at the left most column.\n\t\t\t\tif ( canExpandCollapse ) {\n\t\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\t\t// Left:\n\t\t\t\t\t\t// If a row is focused, and it is expanded, collapses the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'true'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonCollapseRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, moves to the parent row (if there is one).\n\t\t\t\t\t\tconst level = Math.max(\n\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\tactiveRow?.getAttribute( 'aria-level' ) ?? 1,\n\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t) - 1,\n\t\t\t\t\t\t\t1\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst rows = Array.from(\n\t\t\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t\t\t);\n\t\t\t\t\t\tlet parentRow = activeRow;\n\t\t\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\t\t\tfor ( let i = currentRowIndex; i >= 0; i-- ) {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\t\trows[ i ].getAttribute( 'aria-level' ),\n\t\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t\t) === level\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tparentRow = rows[ i ];\n\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tgetRowFocusables( parentRow )?.[ 0 ]?.focus();\n\t\t\t\t\t}\n\t\t\t\t\tif ( keyCode === RIGHT ) {\n\t\t\t\t\t\t// Right:\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, expands the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) ===\n\t\t\t\t\t\t\t'false'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonExpandRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is expanded, focuses the next cell in the row.\n\t\t\t\t\t\tconst focusableItems = getRowFocusables( activeRow );\n\t\t\t\t\t\tif ( focusableItems.length > 0 ) {\n\t\t\t\t\t\t\tfocusableItems[ nextIndex ]?.focus();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start reading text on continued use of left/right arrow\n\t\t\t\t\t// keys.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Focus the next element. If at most left column and row is collapsed, moving right is not allowed as this will expand. However, if row is collapsed, moving left is allowed.\n\t\t\t\tif ( cannotFocusNextColumn ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tfocusablesInRow[ nextIndex ].focus();\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( [ UP, DOWN ].includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === UP ) {\n\t\t\t\t\tnextRowIndex = Math.max( 0, currentRowIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = Math.min(\n\t\t\t\t\t\tcurrentRowIndex + 1,\n\t\t\t\t\t\trows.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( [ HOME, END ].includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === HOME ) {\n\t\t\t\t\tnextRowIndex = 0;\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = rows.length - 1;\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ onExpandRow, onCollapseRow, onFocusRow ]\n\t);\n\n\t/* Disable reason: A treegrid is implemented using a table element. */\n\t/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n\treturn (\n\t\t<RovingTabIndexContainer>\n\t\t\t{\n\t\t\t\t// Prevent browser mode from triggering in NVDA by wrapping List View\n\t\t\t\t// in a role=application wrapper.\n\t\t\t\t// see: https://github.com/WordPress/gutenberg/issues/43729\n\t\t\t }\n\t\t\t<div role=\"application\" aria-label={ applicationAriaLabel }>\n\t\t\t\t<table\n\t\t\t\t\t{ ...props }\n\t\t\t\t\trole=\"treegrid\"\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t\tref={ ref }\n\t\t\t\t>\n\t\t\t\t\t<tbody>{ children }</tbody>\n\t\t\t\t</table>\n\t\t\t</div>\n\t\t</RovingTabIndexContainer>\n\t);\n\t/* eslint-enable jsx-a11y/no-noninteractive-element-to-interactive-role */\n}\n\nexport default forwardRef( TreeGrid );\nexport { default as TreeGridRow } from './row';\nexport { default as TreeGridCell } from './cell';\nexport { default as TreeGridItem } from './item';\n"]}
|
|
@@ -12,14 +12,10 @@ var _element = require("@wordpress/element");
|
|
|
12
12
|
|
|
13
13
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
14
14
|
|
|
15
|
-
var
|
|
15
|
+
var _htmlEntities = require("@wordpress/html-entities");
|
|
16
16
|
|
|
17
17
|
var _selectControl = require("../select-control");
|
|
18
18
|
|
|
19
|
-
/**
|
|
20
|
-
* External dependencies
|
|
21
|
-
*/
|
|
22
|
-
|
|
23
19
|
/**
|
|
24
20
|
* WordPress dependencies
|
|
25
21
|
*/
|
|
@@ -31,7 +27,7 @@ function getSelectOptions(tree) {
|
|
|
31
27
|
let level = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
32
28
|
return tree.flatMap(treeNode => [{
|
|
33
29
|
value: treeNode.id,
|
|
34
|
-
label: '\u00A0'.repeat(level * 3) + (0,
|
|
30
|
+
label: '\u00A0'.repeat(level * 3) + (0, _htmlEntities.decodeEntities)(treeNode.name)
|
|
35
31
|
}, ...getSelectOptions(treeNode.children || [], level + 1)]);
|
|
36
32
|
}
|
|
37
33
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/tree-select/index.tsx"],"names":["getSelectOptions","tree","level","flatMap","treeNode","value","id","label","repeat","name","children","TreeSelect","noOptionLabel","onChange","selectedId","props","options","filter","option"],"mappings":";;;;;;;;;;
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/tree-select/index.tsx"],"names":["getSelectOptions","tree","level","flatMap","treeNode","value","id","label","repeat","name","children","TreeSelect","noOptionLabel","onChange","selectedId","props","options","filter","option"],"mappings":";;;;;;;;;;AAGA;;;;AACA;;AAKA;;AATA;AACA;AACA;;AAIA;AACA;AACA;AAIA,SAASA,gBAAT,CAA2BC,IAA3B,EAAoE;AAAA,MAA3BC,KAA2B,uEAAnB,CAAmB;AACnE,SAAOD,IAAI,CAACE,OAAL,CAAgBC,QAAF,IAAgB,CACpC;AACCC,IAAAA,KAAK,EAAED,QAAQ,CAACE,EADjB;AAECC,IAAAA,KAAK,EACJ,SAASC,MAAT,CAAiBN,KAAK,GAAG,CAAzB,IAA+B,kCAAgBE,QAAQ,CAACK,IAAzB;AAHjC,GADoC,EAMpC,GAAGT,gBAAgB,CAAEI,QAAQ,CAACM,QAAT,IAAqB,EAAvB,EAA2BR,KAAK,GAAG,CAAnC,CANiB,CAA9B,CAAP;AAQA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEO,SAASS,UAAT,OAOc;AAAA,MAPO;AAC3BJ,IAAAA,KAD2B;AAE3BK,IAAAA,aAF2B;AAG3BC,IAAAA,QAH2B;AAI3BC,IAAAA,UAJ2B;AAK3Bb,IAAAA,IAAI,GAAG,EALoB;AAM3B,OAAGc;AANwB,GAOP;AACpB,QAAMC,OAAO,GAAG,sBAAS,MAAM;AAC9B,WAAO,CACNJ,aAAa,IAAI;AAAEP,MAAAA,KAAK,EAAE,EAAT;AAAaE,MAAAA,KAAK,EAAEK;AAApB,KADX,EAEN,GAAGZ,gBAAgB,CAAEC,IAAF,CAFb,EAGLgB,MAHK,CAGWC,MAAR,IAA8C,CAAC,CAAEA,MAHpD,CAAP;AAIA,GALe,EAKb,CAAEN,aAAF,EAAiBX,IAAjB,CALa,CAAhB;AAOA,SACC,4BAAC,4BAAD;AACQM,IAAAA,KADR;AACeS,IAAAA,OADf;AACwBH,IAAAA,QADxB;AAEC,IAAA,KAAK,EAAGC;AAFT,KAGMC,KAHN,EADD;AAOA;;eAEcJ,U","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport { decodeEntities } from '@wordpress/html-entities';\n\n/**\n * Internal dependencies\n */\nimport { SelectControl } from '../select-control';\nimport type { TreeSelectProps, Tree, SelectOptions, Truthy } from './types';\n\nfunction getSelectOptions( tree: Tree[], level = 0 ): SelectOptions {\n\treturn tree.flatMap( ( treeNode ) => [\n\t\t{\n\t\t\tvalue: treeNode.id,\n\t\t\tlabel:\n\t\t\t\t'\\u00A0'.repeat( level * 3 ) + decodeEntities( treeNode.name ),\n\t\t},\n\t\t...getSelectOptions( treeNode.children || [], level + 1 ),\n\t] );\n}\n\n/**\n * TreeSelect component is used to generate select input fields.\n *\n * @example\n * ```jsx\n * import { TreeSelect } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyTreeSelect = () => {\n * \tconst [ page, setPage ] = useState( 'p21' );\n *\n * \treturn (\n * \t\t<TreeSelect\n * \t\t\tlabel=\"Parent page\"\n * \t\t\tnoOptionLabel=\"No parent page\"\n * \t\t\tonChange={ ( newPage ) => setPage( newPage ) }\n * \t\t\tselectedId={ page }\n * \t\t\ttree={ [\n * \t\t\t\t{\n * \t\t\t\t\tname: 'Page 1',\n * \t\t\t\t\tid: 'p1',\n * \t\t\t\t\tchildren: [\n * \t\t\t\t\t\t{ name: 'Descend 1 of page 1', id: 'p11' },\n * \t\t\t\t\t\t{ name: 'Descend 2 of page 1', id: 'p12' },\n * \t\t\t\t\t],\n * \t\t\t\t},\n * \t\t\t\t{\n * \t\t\t\t\tname: 'Page 2',\n * \t\t\t\t\tid: 'p2',\n * \t\t\t\t\tchildren: [\n * \t\t\t\t\t\t{\n * \t\t\t\t\t\t\tname: 'Descend 1 of page 2',\n * \t\t\t\t\t\t\tid: 'p21',\n * \t\t\t\t\t\t\tchildren: [\n * \t\t\t\t\t\t\t\t{\n * \t\t\t\t\t\t\t\t\tname: 'Descend 1 of Descend 1 of page 2',\n * \t\t\t\t\t\t\t\t\tid: 'p211',\n * \t\t\t\t\t\t\t\t},\n * \t\t\t\t\t\t\t],\n * \t\t\t\t\t\t},\n * \t\t\t\t\t],\n * \t\t\t\t},\n * \t\t\t] }\n * \t\t/>\n * \t);\n * }\n * ```\n */\n\nexport function TreeSelect( {\n\tlabel,\n\tnoOptionLabel,\n\tonChange,\n\tselectedId,\n\ttree = [],\n\t...props\n}: TreeSelectProps ) {\n\tconst options = useMemo( () => {\n\t\treturn [\n\t\t\tnoOptionLabel && { value: '', label: noOptionLabel },\n\t\t\t...getSelectOptions( tree ),\n\t\t].filter( < T, >( option: T ): option is Truthy< T > => !! option );\n\t}, [ noOptionLabel, tree ] );\n\n\treturn (\n\t\t<SelectControl\n\t\t\t{ ...{ label, options, onChange } }\n\t\t\tvalue={ selectedId }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nexport default TreeSelect;\n"]}
|