@wordpress/components 21.1.2-next.4d3b314fd5.0 → 21.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 +48 -3
- package/CONTRIBUTING.md +20 -0
- package/build/border-box-control/border-box-control/component.js +2 -0
- package/build/border-box-control/border-box-control/component.js.map +1 -1
- package/build/border-box-control/border-box-control/hook.js +4 -1
- package/build/border-box-control/border-box-control/hook.js.map +1 -1
- package/build/border-box-control/utils.js +42 -2
- package/build/border-box-control/utils.js.map +1 -1
- package/build/border-control/border-control/component.js +2 -0
- package/build/border-control/border-control/component.js.map +1 -1
- package/build/combobox-control/index.js +0 -1
- package/build/combobox-control/index.js.map +1 -1
- package/build/custom-select-control/index.js +4 -2
- package/build/custom-select-control/index.js.map +1 -1
- package/build/disabled/index.js +6 -26
- package/build/disabled/index.js.map +1 -1
- package/build/font-size-picker/index.js +47 -56
- package/build/font-size-picker/index.js.map +1 -1
- package/build/font-size-picker/styles.js +65 -0
- package/build/font-size-picker/styles.js.map +1 -0
- package/build/font-size-picker/types.js +6 -0
- package/build/font-size-picker/types.js.map +1 -0
- package/build/font-size-picker/utils.js +18 -16
- package/build/font-size-picker/utils.js.map +1 -1
- package/build/form-token-field/suggestions-list.js +5 -5
- package/build/form-token-field/suggestions-list.js.map +1 -1
- package/build/form-token-field/token-input.js +20 -1
- package/build/form-token-field/token-input.js.map +1 -1
- package/build/higher-order/with-fallback-styles/index.js +1 -1
- package/build/higher-order/with-fallback-styles/index.js.map +1 -1
- package/build/index.js +14 -6
- package/build/index.js.map +1 -1
- package/build/modal/aria-helper.js +2 -3
- package/build/modal/aria-helper.js.map +1 -1
- package/build/modal/index.js +42 -11
- package/build/modal/index.js.map +1 -1
- package/build/modal/types.js +6 -0
- package/build/modal/types.js.map +1 -0
- package/build/navigator/index.js +8 -8
- package/build/navigator/index.js.map +1 -1
- package/build/navigator/navigator-back-button/component.js +5 -4
- package/build/navigator/navigator-back-button/component.js.map +1 -1
- package/build/navigator/navigator-back-button/index.js +1 -1
- package/build/navigator/navigator-back-button/index.js.map +1 -1
- package/build/navigator/navigator-button/component.js +5 -4
- package/build/navigator/navigator-button/component.js.map +1 -1
- package/build/navigator/navigator-button/index.js +1 -1
- package/build/navigator/navigator-button/index.js.map +1 -1
- package/build/navigator/navigator-provider/component.js +10 -7
- package/build/navigator/navigator-provider/component.js.map +1 -1
- package/build/navigator/navigator-provider/index.js +1 -1
- package/build/navigator/navigator-provider/index.js.map +1 -1
- package/build/navigator/navigator-screen/component.js +30 -26
- package/build/navigator/navigator-screen/component.js.map +1 -1
- package/build/navigator/navigator-screen/index.js +1 -1
- package/build/navigator/navigator-screen/index.js.map +1 -1
- package/build/resizable-box/resize-tooltip/utils.js +12 -14
- package/build/resizable-box/resize-tooltip/utils.js.map +1 -1
- package/build/sandbox/index.js +68 -67
- package/build/sandbox/index.js.map +1 -1
- package/build/sandbox/index.native.js +66 -63
- package/build/sandbox/index.native.js.map +1 -1
- package/build/search-control/index.native.js +6 -2
- package/build/search-control/index.native.js.map +1 -1
- package/build/slot-fill/bubbles-virtually/slot-fill-context.js +8 -2
- package/build/slot-fill/bubbles-virtually/slot-fill-context.js.map +1 -1
- package/build/slot-fill/bubbles-virtually/slot-fill-provider.js +31 -41
- package/build/slot-fill/bubbles-virtually/slot-fill-provider.js.map +1 -1
- package/build/slot-fill/bubbles-virtually/use-slot-fills.js +39 -0
- package/build/slot-fill/bubbles-virtually/use-slot-fills.js.map +1 -0
- package/build/slot-fill/bubbles-virtually/use-slot.js +13 -4
- package/build/slot-fill/bubbles-virtually/use-slot.js.map +1 -1
- package/build/slot-fill/index.js +8 -0
- package/build/slot-fill/index.js.map +1 -1
- package/build/tab-panel/index.js +4 -4
- package/build/tab-panel/index.js.map +1 -1
- package/build/theme/index.js +62 -0
- package/build/theme/index.js.map +1 -0
- package/build/theme/styles.js +33 -0
- package/build/theme/styles.js.map +1 -0
- package/build/theme/types.js +6 -0
- package/build/theme/types.js.map +1 -0
- package/build/toggle-group-control/toggle-group-control-option-base/styles.js +8 -8
- package/build/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -1
- package/build/tools-panel/tools-panel/hook.js +3 -3
- package/build/tools-panel/tools-panel/hook.js.map +1 -1
- package/build/tools-panel/tools-panel-item/hook.js +6 -6
- package/build/tools-panel/tools-panel-item/hook.js.map +1 -1
- package/build/tooltip/index.js +4 -1
- package/build/tooltip/index.js.map +1 -1
- package/build/tooltip/index.native.js +17 -4
- package/build/tooltip/index.native.js.map +1 -1
- package/build-module/border-box-control/border-box-control/component.js +2 -0
- package/build-module/border-box-control/border-box-control/component.js.map +1 -1
- package/build-module/border-box-control/border-box-control/hook.js +4 -1
- package/build-module/border-box-control/border-box-control/hook.js.map +1 -1
- package/build-module/border-box-control/utils.js +36 -1
- package/build-module/border-box-control/utils.js.map +1 -1
- package/build-module/border-control/border-control/component.js +2 -0
- package/build-module/border-control/border-control/component.js.map +1 -1
- package/build-module/combobox-control/index.js +0 -1
- package/build-module/combobox-control/index.js.map +1 -1
- package/build-module/custom-select-control/index.js +2 -1
- package/build-module/custom-select-control/index.js.map +1 -1
- package/build-module/disabled/index.js +7 -26
- package/build-module/disabled/index.js.map +1 -1
- package/build-module/font-size-picker/index.js +46 -54
- package/build-module/font-size-picker/index.js.map +1 -1
- package/build-module/font-size-picker/styles.js +54 -0
- package/build-module/font-size-picker/styles.js.map +1 -0
- package/build-module/font-size-picker/types.js +2 -0
- package/build-module/font-size-picker/types.js.map +1 -0
- package/build-module/font-size-picker/utils.js +22 -16
- package/build-module/font-size-picker/utils.js.map +1 -1
- package/build-module/form-token-field/suggestions-list.js +5 -5
- package/build-module/form-token-field/suggestions-list.js.map +1 -1
- package/build-module/form-token-field/token-input.js +21 -2
- package/build-module/form-token-field/token-input.js.map +1 -1
- package/build-module/higher-order/with-fallback-styles/index.js +2 -2
- package/build-module/higher-order/with-fallback-styles/index.js.map +1 -1
- package/build-module/index.js +3 -2
- package/build-module/index.js.map +1 -1
- package/build-module/modal/aria-helper.js +2 -3
- package/build-module/modal/aria-helper.js.map +1 -1
- package/build-module/modal/index.js +44 -12
- package/build-module/modal/index.js.map +1 -1
- package/build-module/modal/types.js +2 -0
- package/build-module/modal/types.js.map +1 -0
- package/build-module/navigator/index.js +4 -4
- package/build-module/navigator/index.js.map +1 -1
- package/build-module/navigator/navigator-back-button/component.js +3 -3
- package/build-module/navigator/navigator-back-button/component.js.map +1 -1
- package/build-module/navigator/navigator-back-button/index.js +1 -1
- package/build-module/navigator/navigator-back-button/index.js.map +1 -1
- package/build-module/navigator/navigator-button/component.js +3 -3
- package/build-module/navigator/navigator-button/component.js.map +1 -1
- package/build-module/navigator/navigator-button/index.js +1 -1
- package/build-module/navigator/navigator-button/index.js.map +1 -1
- package/build-module/navigator/navigator-provider/component.js +8 -6
- package/build-module/navigator/navigator-provider/component.js.map +1 -1
- package/build-module/navigator/navigator-provider/index.js +1 -1
- package/build-module/navigator/navigator-provider/index.js.map +1 -1
- package/build-module/navigator/navigator-screen/component.js +18 -25
- package/build-module/navigator/navigator-screen/component.js.map +1 -1
- package/build-module/navigator/navigator-screen/index.js +1 -1
- package/build-module/navigator/navigator-screen/index.js.map +1 -1
- package/build-module/resizable-box/resize-tooltip/utils.js +13 -15
- package/build-module/resizable-box/resize-tooltip/utils.js.map +1 -1
- package/build-module/sandbox/index.js +69 -67
- package/build-module/sandbox/index.js.map +1 -1
- package/build-module/sandbox/index.native.js +57 -53
- package/build-module/sandbox/index.native.js.map +1 -1
- package/build-module/search-control/index.native.js +6 -2
- package/build-module/search-control/index.native.js.map +1 -1
- package/build-module/slot-fill/bubbles-virtually/slot-fill-context.js +7 -2
- package/build-module/slot-fill/bubbles-virtually/slot-fill-context.js.map +1 -1
- package/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js +30 -42
- package/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js.map +1 -1
- package/build-module/slot-fill/bubbles-virtually/use-slot-fills.js +27 -0
- package/build-module/slot-fill/bubbles-virtually/use-slot-fills.js.map +1 -0
- package/build-module/slot-fill/bubbles-virtually/use-slot.js +13 -5
- package/build-module/slot-fill/bubbles-virtually/use-slot.js.map +1 -1
- package/build-module/slot-fill/index.js +1 -0
- package/build-module/slot-fill/index.js.map +1 -1
- package/build-module/tab-panel/index.js +4 -4
- package/build-module/tab-panel/index.js.map +1 -1
- package/build-module/theme/index.js +52 -0
- package/build-module/theme/index.js.map +1 -0
- package/build-module/theme/styles.js +25 -0
- package/build-module/theme/styles.js.map +1 -0
- package/build-module/theme/types.js +2 -0
- package/build-module/theme/types.js.map +1 -0
- package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js +7 -7
- package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -1
- package/build-module/tools-panel/tools-panel/hook.js +3 -3
- package/build-module/tools-panel/tools-panel/hook.js.map +1 -1
- package/build-module/tools-panel/tools-panel-item/hook.js +6 -6
- package/build-module/tools-panel/tools-panel-item/hook.js.map +1 -1
- package/build-module/tooltip/index.js +4 -1
- package/build-module/tooltip/index.js.map +1 -1
- package/build-module/tooltip/index.native.js +17 -4
- package/build-module/tooltip/index.native.js.map +1 -1
- package/build-style/style-rtl.css +27 -120
- package/build-style/style.css +27 -120
- package/build-types/border-box-control/border-box-control/component.d.ts.map +1 -1
- package/build-types/border-box-control/border-box-control/hook.d.ts +1 -0
- package/build-types/border-box-control/border-box-control/hook.d.ts.map +1 -1
- package/build-types/border-box-control/utils.d.ts +1 -3
- package/build-types/border-box-control/utils.d.ts.map +1 -1
- package/build-types/border-control/border-control/component.d.ts +1 -0
- package/build-types/border-control/border-control/component.d.ts.map +1 -1
- package/build-types/border-control/border-control/hook.d.ts +1 -0
- package/build-types/border-control/border-control/hook.d.ts.map +1 -1
- package/build-types/border-control/stories/index.d.ts +6 -0
- package/build-types/border-control/stories/index.d.ts.map +1 -1
- package/build-types/border-control/types.d.ts +4 -0
- package/build-types/border-control/types.d.ts.map +1 -1
- package/build-types/confirm-dialog/types.d.ts +5 -1
- package/build-types/confirm-dialog/types.d.ts.map +1 -1
- package/build-types/custom-select-control/index.d.ts +13 -0
- package/build-types/custom-select-control/index.d.ts.map +1 -0
- package/build-types/custom-select-control/styles.d.ts +9 -0
- package/build-types/custom-select-control/styles.d.ts.map +1 -0
- package/build-types/disabled/index.d.ts.map +1 -1
- package/build-types/font-size-picker/index.d.ts +5 -0
- package/build-types/font-size-picker/index.d.ts.map +1 -0
- package/build-types/font-size-picker/stories/e2e/index.d.ts +16 -0
- package/build-types/font-size-picker/stories/e2e/index.d.ts.map +1 -0
- package/build-types/font-size-picker/stories/index.d.ts +31 -0
- package/build-types/font-size-picker/stories/index.d.ts.map +1 -0
- package/build-types/font-size-picker/styles.d.ts +27 -0
- package/build-types/font-size-picker/styles.d.ts.map +1 -0
- package/build-types/font-size-picker/test/index.d.ts +2 -0
- package/build-types/font-size-picker/test/index.d.ts.map +1 -0
- package/build-types/font-size-picker/test/utils.d.ts +2 -0
- package/build-types/font-size-picker/test/utils.d.ts.map +1 -0
- package/build-types/font-size-picker/types.d.ts +93 -0
- package/build-types/font-size-picker/types.d.ts.map +1 -0
- package/build-types/font-size-picker/utils.d.ts +41 -0
- package/build-types/font-size-picker/utils.d.ts.map +1 -0
- package/build-types/form-token-field/token-input.d.ts.map +1 -1
- package/build-types/modal/aria-helper.d.ts +4 -4
- package/build-types/modal/aria-helper.d.ts.map +1 -1
- package/build-types/modal/index.d.ts +35 -2
- package/build-types/modal/index.d.ts.map +1 -1
- package/build-types/modal/stories/index.d.ts +9 -0
- package/build-types/modal/stories/index.d.ts.map +1 -0
- package/build-types/modal/test/aria-helper.d.ts +2 -0
- package/build-types/modal/test/aria-helper.d.ts.map +1 -0
- package/build-types/modal/test/index.d.ts +2 -0
- package/build-types/modal/test/index.d.ts.map +1 -0
- package/build-types/modal/types.d.ts +134 -0
- package/build-types/modal/types.d.ts.map +1 -0
- package/build-types/navigator/index.d.ts +4 -4
- package/build-types/navigator/index.d.ts.map +1 -1
- package/build-types/navigator/navigator-back-button/component.d.ts +4 -2
- package/build-types/navigator/navigator-back-button/component.d.ts.map +1 -1
- package/build-types/navigator/navigator-back-button/hook.d.ts +1 -0
- package/build-types/navigator/navigator-back-button/hook.d.ts.map +1 -1
- package/build-types/navigator/navigator-back-button/index.d.ts +1 -1
- package/build-types/navigator/navigator-back-button/index.d.ts.map +1 -1
- package/build-types/navigator/navigator-button/component.d.ts +4 -2
- package/build-types/navigator/navigator-button/component.d.ts.map +1 -1
- package/build-types/navigator/navigator-button/hook.d.ts +1 -0
- package/build-types/navigator/navigator-button/hook.d.ts.map +1 -1
- package/build-types/navigator/navigator-button/index.d.ts +1 -1
- package/build-types/navigator/navigator-button/index.d.ts.map +1 -1
- package/build-types/navigator/navigator-provider/component.d.ts +2 -2
- package/build-types/navigator/navigator-provider/component.d.ts.map +1 -1
- package/build-types/navigator/navigator-provider/index.d.ts +1 -1
- package/build-types/navigator/navigator-provider/index.d.ts.map +1 -1
- package/build-types/navigator/navigator-screen/component.d.ts +2 -2
- package/build-types/navigator/navigator-screen/component.d.ts.map +1 -1
- package/build-types/navigator/navigator-screen/index.d.ts +1 -1
- package/build-types/navigator/navigator-screen/index.d.ts.map +1 -1
- package/build-types/navigator/stories/index.d.ts +9 -0
- package/build-types/navigator/stories/index.d.ts.map +1 -0
- package/build-types/navigator/test/index.d.ts +2 -0
- package/build-types/navigator/test/index.d.ts.map +1 -0
- package/build-types/navigator/types.d.ts +4 -1
- package/build-types/navigator/types.d.ts.map +1 -1
- package/build-types/slot-fill/bubbles-virtually/slot-fill-context.d.ts +2 -2
- package/build-types/slot-fill/bubbles-virtually/slot-fill-context.d.ts.map +1 -1
- package/build-types/slot-fill/bubbles-virtually/slot-fill-provider.d.ts.map +1 -1
- package/build-types/slot-fill/bubbles-virtually/use-slot-fills.d.ts +2 -0
- package/build-types/slot-fill/bubbles-virtually/use-slot-fills.d.ts.map +1 -0
- package/build-types/slot-fill/bubbles-virtually/use-slot.d.ts.map +1 -1
- package/build-types/slot-fill/index.d.ts +1 -0
- package/build-types/slot-fill/index.d.ts.map +1 -1
- package/build-types/tab-panel/index.d.ts.map +1 -1
- package/build-types/theme/index.d.ts +31 -0
- package/build-types/theme/index.d.ts.map +1 -0
- package/build-types/theme/stories/index.d.ts +13 -0
- package/build-types/theme/stories/index.d.ts.map +1 -0
- package/build-types/theme/styles.d.ts +10 -0
- package/build-types/theme/styles.d.ts.map +1 -0
- package/build-types/theme/test/index.d.ts +2 -0
- package/build-types/theme/test/index.d.ts.map +1 -0
- package/build-types/theme/types.d.ts +21 -0
- package/build-types/theme/types.d.ts.map +1 -0
- package/build-types/toggle-group-control/toggle-group-control-option-base/styles.d.ts +1 -1
- package/build-types/toggle-group-control/toggle-group-control-option-base/styles.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel/hook.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel-item/hook.d.ts.map +1 -1
- package/build-types/tooltip/index.d.ts.map +1 -1
- package/package.json +19 -18
- package/src/alignment-matrix-control/test/index.js +17 -62
- package/src/base-field/test/index.js +4 -6
- package/src/border-box-control/border-box-control/component.tsx +2 -0
- package/src/border-box-control/border-box-control/hook.ts +4 -0
- package/src/border-box-control/test/index.js +7 -2
- package/src/border-box-control/test/utils.js +48 -0
- package/src/border-box-control/utils.ts +44 -1
- package/src/border-control/border-control/README.md +6 -0
- package/src/border-control/border-control/component.tsx +2 -0
- package/src/border-control/types.ts +4 -0
- package/src/button/style.scss +25 -25
- package/src/button/test/index.js +3 -5
- package/src/combobox-control/index.js +0 -5
- package/src/combobox-control/test/index.js +1 -1
- package/src/confirm-dialog/types.ts +6 -0
- package/src/custom-select-control/index.js +2 -1
- package/src/date-time/time/test/index.tsx +2 -6
- package/src/disabled/index.tsx +11 -33
- package/src/disabled/test/index.tsx +14 -82
- package/src/dropdown/test/index.js +4 -3
- package/src/font-size-picker/{index.js → index.tsx} +114 -80
- package/src/font-size-picker/stories/e2e/{index.js → index.tsx} +13 -4
- package/src/font-size-picker/stories/{index.js → index.tsx} +42 -36
- package/src/font-size-picker/styles.ts +46 -0
- package/src/font-size-picker/test/{index.js → index.tsx} +3 -3
- package/src/font-size-picker/test/{utils.js → utils.ts} +11 -7
- package/src/font-size-picker/types.ts +98 -0
- package/src/font-size-picker/{utils.js → utils.ts} +52 -28
- package/src/form-file-upload/test/index.tsx +1 -1
- package/src/form-token-field/suggestions-list.tsx +5 -5
- package/src/form-token-field/test/index.tsx +22 -1
- package/src/form-token-field/token-input.tsx +25 -3
- package/src/higher-order/with-fallback-styles/index.js +6 -2
- package/src/higher-order/with-focus-outside/test/index.js +44 -45
- package/src/higher-order/with-focus-return/test/index.js +34 -30
- package/src/higher-order/with-notices/test/index.js +1 -1
- package/src/index.js +3 -1
- package/src/input-control/test/index.js +2 -2
- package/src/item-group/test/index.js +2 -2
- package/src/menu-item/test/index.js +0 -3
- package/src/mobile/bottom-sheet/test/range-cell.native.js +16 -14
- package/src/modal/README.md +53 -54
- package/src/modal/{aria-helper.js → aria-helper.ts} +5 -7
- package/src/modal/{index.js → index.tsx} +48 -12
- package/src/modal/stories/{index.js → index.tsx} +47 -42
- package/src/modal/test/{aria-helper.js → aria-helper.ts} +0 -0
- package/src/modal/test/{index.js → index.tsx} +13 -3
- package/src/modal/types.ts +144 -0
- package/src/navigation/test/index.js +1 -1
- package/src/navigator/index.ts +4 -4
- package/src/navigator/navigator-back-button/component.tsx +4 -4
- package/src/navigator/navigator-back-button/index.ts +1 -1
- package/src/navigator/navigator-button/component.tsx +4 -4
- package/src/navigator/navigator-button/index.ts +1 -1
- package/src/navigator/navigator-provider/component.tsx +6 -4
- package/src/navigator/navigator-provider/index.ts +1 -1
- package/src/navigator/navigator-screen/component.tsx +27 -26
- package/src/navigator/navigator-screen/index.ts +1 -1
- package/src/navigator/stories/index.tsx +210 -0
- package/src/navigator/test/index.tsx +509 -0
- package/src/navigator/types.ts +2 -0
- package/src/notice/test/__snapshots__/index.js.snap +39 -38
- package/src/notice/test/index.js +15 -36
- package/src/notice/test/list.js +6 -14
- package/src/number-control/test/index.js +3 -2
- package/src/panel/test/body.js +2 -2
- package/src/placeholder/style.scss +7 -2
- package/src/resizable-box/resize-tooltip/utils.ts +13 -13
- package/src/sandbox/index.js +75 -54
- package/src/sandbox/index.native.js +75 -52
- package/src/sandbox/test/index.js +7 -10
- package/src/search-control/index.native.js +6 -0
- package/src/shortcut/test/index.tsx +1 -1
- package/src/slot-fill/bubbles-virtually/slot-fill-context.js +6 -2
- package/src/slot-fill/bubbles-virtually/slot-fill-provider.js +53 -58
- package/src/slot-fill/bubbles-virtually/use-slot-fills.js +24 -0
- package/src/slot-fill/bubbles-virtually/use-slot.js +11 -6
- package/src/slot-fill/index.js +1 -0
- package/src/style.scss +4 -1
- package/src/tab-panel/index.tsx +4 -7
- package/src/text-highlight/test/index.tsx +1 -3
- package/src/theme/README.md +34 -0
- package/src/theme/index.tsx +51 -0
- package/src/theme/stories/index.tsx +47 -0
- package/src/theme/styles.ts +28 -0
- package/src/theme/test/index.tsx +101 -0
- package/src/theme/types.ts +21 -0
- package/src/toggle-group-control/test/__snapshots__/index.tsx.snap +1 -0
- package/src/toggle-group-control/toggle-group-control-option-base/styles.ts +9 -7
- package/src/toolbar/test/index.js +2 -2
- package/src/toolbar-group/test/index.js +6 -10
- package/src/tools-panel/test/index.js +4 -6
- package/src/tools-panel/tools-panel/hook.ts +2 -9
- package/src/tools-panel/tools-panel-item/hook.ts +17 -3
- package/src/tooltip/index.js +3 -0
- package/src/tooltip/index.native.js +15 -0
- package/src/tooltip/test/index.native.js +1 -2
- package/src/tree-grid/test/__snapshots__/cell.js.snap +1 -3
- package/src/tree-grid/test/__snapshots__/roving-tab-index-item.js.snap +17 -15
- package/src/tree-grid/test/__snapshots__/row.js.snap +25 -21
- package/src/tree-grid/test/cell.js +4 -4
- package/src/tree-grid/test/roving-tab-index-item.js +8 -8
- package/src/tree-grid/test/roving-tab-index.js +3 -3
- package/src/tree-grid/test/row.js +20 -16
- package/src/truncate/test/index.tsx +4 -4
- package/src/ui/shortcut/test/index.js +2 -1
- package/src/ui/spinner/test/index.js +14 -13
- package/src/ui/tooltip/test/index.js +16 -14
- package/src/utils/theme-variables.scss +8 -0
- package/src/visually-hidden/README.md +4 -0
- package/tsconfig.json +0 -2
- package/tsconfig.tsbuildinfo +1 -1
- package/src/font-size-picker/style.scss +0 -78
- package/src/navigator/stories/index.js +0 -194
- package/src/navigator/test/index.js +0 -407
|
@@ -9,12 +9,20 @@ exports.default = SlotFillProvider;
|
|
|
9
9
|
|
|
10
10
|
var _element = require("@wordpress/element");
|
|
11
11
|
|
|
12
|
+
var _valtio = require("valtio");
|
|
13
|
+
|
|
14
|
+
var _utils = require("valtio/utils");
|
|
15
|
+
|
|
12
16
|
var _isShallowEqual = _interopRequireDefault(require("@wordpress/is-shallow-equal"));
|
|
13
17
|
|
|
14
18
|
var _slotFillContext = _interopRequireDefault(require("./slot-fill-context"));
|
|
15
19
|
|
|
16
20
|
// @ts-nocheck
|
|
17
21
|
|
|
22
|
+
/**
|
|
23
|
+
* External dependencies
|
|
24
|
+
*/
|
|
25
|
+
|
|
18
26
|
/**
|
|
19
27
|
* WordPress dependencies
|
|
20
28
|
*/
|
|
@@ -23,36 +31,26 @@ var _slotFillContext = _interopRequireDefault(require("./slot-fill-context"));
|
|
|
23
31
|
* Internal dependencies
|
|
24
32
|
*/
|
|
25
33
|
function useSlotRegistry() {
|
|
26
|
-
const
|
|
27
|
-
const
|
|
34
|
+
const slots = (0, _element.useRef)((0, _utils.proxyMap)());
|
|
35
|
+
const fills = (0, _element.useRef)((0, _utils.proxyMap)());
|
|
28
36
|
const registerSlot = (0, _element.useCallback)((name, ref, fillProps) => {
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
fillProps: fillProps || slot.fillProps || {}
|
|
35
|
-
}
|
|
36
|
-
};
|
|
37
|
-
});
|
|
37
|
+
const slot = slots.current.get(name) || {};
|
|
38
|
+
slots.current.set(name, (0, _valtio.ref)({ ...slot,
|
|
39
|
+
ref: ref || slot.ref,
|
|
40
|
+
fillProps: fillProps || slot.fillProps || {}
|
|
41
|
+
}));
|
|
38
42
|
}, []);
|
|
39
43
|
const unregisterSlot = (0, _element.useCallback)((name, ref) => {
|
|
40
|
-
|
|
41
|
-
const {
|
|
42
|
-
[name]: slot,
|
|
43
|
-
...nextSlots
|
|
44
|
-
} = prevSlots; // Make sure we're not unregistering a slot registered by another element
|
|
45
|
-
// See https://github.com/WordPress/gutenberg/pull/19242#issuecomment-590295412
|
|
46
|
-
|
|
47
|
-
if ((slot === null || slot === void 0 ? void 0 : slot.ref) === ref) {
|
|
48
|
-
return nextSlots;
|
|
49
|
-
}
|
|
44
|
+
var _slots$current$get;
|
|
50
45
|
|
|
51
|
-
|
|
52
|
-
|
|
46
|
+
// Make sure we're not unregistering a slot registered by another element
|
|
47
|
+
// See https://github.com/WordPress/gutenberg/pull/19242#issuecomment-590295412
|
|
48
|
+
if (((_slots$current$get = slots.current.get(name)) === null || _slots$current$get === void 0 ? void 0 : _slots$current$get.ref) === ref) {
|
|
49
|
+
slots.current.delete(name);
|
|
50
|
+
}
|
|
53
51
|
}, []);
|
|
54
52
|
const updateSlot = (0, _element.useCallback)((name, fillProps) => {
|
|
55
|
-
const slot = slots
|
|
53
|
+
const slot = slots.current.get(name);
|
|
56
54
|
|
|
57
55
|
if (!slot) {
|
|
58
56
|
return;
|
|
@@ -60,40 +58,32 @@ function useSlotRegistry() {
|
|
|
60
58
|
|
|
61
59
|
if (!(0, _isShallowEqual.default)(slot.fillProps, fillProps)) {
|
|
62
60
|
slot.fillProps = fillProps;
|
|
63
|
-
const slotFills = fills
|
|
61
|
+
const slotFills = fills.current.get(name);
|
|
64
62
|
|
|
65
63
|
if (slotFills) {
|
|
66
64
|
// Force update fills.
|
|
67
65
|
slotFills.map(fill => fill.current.rerender());
|
|
68
66
|
}
|
|
69
67
|
}
|
|
70
|
-
}, [
|
|
68
|
+
}, []);
|
|
71
69
|
const registerFill = (0, _element.useCallback)((name, ref) => {
|
|
72
|
-
|
|
73
|
-
[name]: [...(prevFills[name] || []), ref]
|
|
74
|
-
}));
|
|
70
|
+
fills.current.set(name, (0, _valtio.ref)([...(fills.current.get(name) || []), ref]));
|
|
75
71
|
}, []);
|
|
76
72
|
const unregisterFill = (0, _element.useCallback)((name, ref) => {
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
[name]: prevFills[name].filter(fillRef => fillRef !== ref)
|
|
81
|
-
};
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
return prevFills;
|
|
85
|
-
});
|
|
73
|
+
if (fills.current.get(name)) {
|
|
74
|
+
fills.current.set(name, (0, _valtio.ref)(fills.current.get(name).filter(fillRef => fillRef !== ref)));
|
|
75
|
+
}
|
|
86
76
|
}, []); // Memoizing the return value so it can be directly passed to Provider value
|
|
87
77
|
|
|
88
78
|
const registry = (0, _element.useMemo)(() => ({
|
|
89
|
-
slots,
|
|
90
|
-
fills,
|
|
79
|
+
slots: slots.current,
|
|
80
|
+
fills: fills.current,
|
|
91
81
|
registerSlot,
|
|
92
82
|
updateSlot,
|
|
93
83
|
unregisterSlot,
|
|
94
84
|
registerFill,
|
|
95
85
|
unregisterFill
|
|
96
|
-
}), [
|
|
86
|
+
}), [registerSlot, updateSlot, unregisterSlot, registerFill, unregisterFill]);
|
|
97
87
|
return registry;
|
|
98
88
|
}
|
|
99
89
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/slot-fill-provider.js"],"names":["useSlotRegistry","slots","
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/slot-fill-provider.js"],"names":["useSlotRegistry","slots","fills","registerSlot","name","ref","fillProps","slot","current","get","set","unregisterSlot","delete","updateSlot","slotFills","map","fill","rerender","registerFill","unregisterFill","filter","fillRef","registry","SlotFillProvider","children"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { ref as valRef } from 'valtio';\nimport { proxyMap } from 'valtio/utils';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useCallback, useRef } from '@wordpress/element';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './slot-fill-context';\n\nfunction useSlotRegistry() {\n\tconst slots = useRef( proxyMap() );\n\tconst fills = useRef( proxyMap() );\n\n\tconst registerSlot = useCallback( ( name, ref, fillProps ) => {\n\t\tconst slot = slots.current.get( name ) || {};\n\t\tslots.current.set(\n\t\t\tname,\n\t\t\tvalRef( {\n\t\t\t\t...slot,\n\t\t\t\tref: ref || slot.ref,\n\t\t\t\tfillProps: fillProps || slot.fillProps || {},\n\t\t\t} )\n\t\t);\n\t}, [] );\n\n\tconst unregisterSlot = useCallback( ( name, ref ) => {\n\t\t// Make sure we're not unregistering a slot registered by another element\n\t\t// See https://github.com/WordPress/gutenberg/pull/19242#issuecomment-590295412\n\t\tif ( slots.current.get( name )?.ref === ref ) {\n\t\t\tslots.current.delete( name );\n\t\t}\n\t}, [] );\n\n\tconst updateSlot = useCallback( ( name, fillProps ) => {\n\t\tconst slot = slots.current.get( name );\n\t\tif ( ! slot ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( ! isShallowEqual( slot.fillProps, fillProps ) ) {\n\t\t\tslot.fillProps = fillProps;\n\t\t\tconst slotFills = fills.current.get( name );\n\t\t\tif ( slotFills ) {\n\t\t\t\t// Force update fills.\n\t\t\t\tslotFills.map( ( fill ) => fill.current.rerender() );\n\t\t\t}\n\t\t}\n\t}, [] );\n\n\tconst registerFill = useCallback( ( name, ref ) => {\n\t\tfills.current.set(\n\t\t\tname,\n\t\t\tvalRef( [ ...( fills.current.get( name ) || [] ), ref ] )\n\t\t);\n\t}, [] );\n\n\tconst unregisterFill = useCallback( ( name, ref ) => {\n\t\tif ( fills.current.get( name ) ) {\n\t\t\tfills.current.set(\n\t\t\t\tname,\n\t\t\t\tvalRef(\n\t\t\t\t\tfills.current\n\t\t\t\t\t\t.get( name )\n\t\t\t\t\t\t.filter( ( fillRef ) => fillRef !== ref )\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\t}, [] );\n\n\t// Memoizing the return value so it can be directly passed to Provider value\n\tconst registry = useMemo(\n\t\t() => ( {\n\t\t\tslots: slots.current,\n\t\t\tfills: fills.current,\n\t\t\tregisterSlot,\n\t\t\tupdateSlot,\n\t\t\tunregisterSlot,\n\t\t\tregisterFill,\n\t\t\tunregisterFill,\n\t\t} ),\n\t\t[\n\t\t\tregisterSlot,\n\t\t\tupdateSlot,\n\t\t\tunregisterSlot,\n\t\t\tregisterFill,\n\t\t\tunregisterFill,\n\t\t]\n\t);\n\n\treturn registry;\n}\n\nexport default function SlotFillProvider( { children } ) {\n\tconst registry = useSlotRegistry();\n\treturn (\n\t\t<SlotFillContext.Provider value={ registry }>\n\t\t\t{ children }\n\t\t</SlotFillContext.Provider>\n\t);\n}\n"]}
|
|
@@ -0,0 +1,39 @@
|
|
|
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 = useSlotFills;
|
|
9
|
+
|
|
10
|
+
var _valtio = require("valtio");
|
|
11
|
+
|
|
12
|
+
var _element = require("@wordpress/element");
|
|
13
|
+
|
|
14
|
+
var _slotFillContext = _interopRequireDefault(require("./slot-fill-context"));
|
|
15
|
+
|
|
16
|
+
// @ts-nocheck
|
|
17
|
+
|
|
18
|
+
/**
|
|
19
|
+
* External dependencies
|
|
20
|
+
*/
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* WordPress dependencies
|
|
24
|
+
*/
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* Internal dependencies
|
|
28
|
+
*/
|
|
29
|
+
function useSlotFills(name) {
|
|
30
|
+
const registry = (0, _element.useContext)(_slotFillContext.default);
|
|
31
|
+
const fills = (0, _valtio.useSnapshot)(registry.fills, {
|
|
32
|
+
sync: true
|
|
33
|
+
}); // The important bit here is that this call ensures that the hook
|
|
34
|
+
// only causes a re-render if the "fills" of a given slot name
|
|
35
|
+
// change change, not any fills.
|
|
36
|
+
|
|
37
|
+
return fills.get(name);
|
|
38
|
+
}
|
|
39
|
+
//# sourceMappingURL=use-slot-fills.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/use-slot-fills.js"],"names":["useSlotFills","name","registry","SlotFillContext","fills","sync","get"],"mappings":";;;;;;;;;AAIA;;AAKA;;AAKA;;AAdA;;AACA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAGe,SAASA,YAAT,CAAuBC,IAAvB,EAA8B;AAC5C,QAAMC,QAAQ,GAAG,yBAAYC,wBAAZ,CAAjB;AACA,QAAMC,KAAK,GAAG,yBAAaF,QAAQ,CAACE,KAAtB,EAA6B;AAAEC,IAAAA,IAAI,EAAE;AAAR,GAA7B,CAAd,CAF4C,CAG5C;AACA;AACA;;AACA,SAAOD,KAAK,CAACE,GAAN,CAAWL,IAAX,CAAP;AACA","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { useSnapshot } from 'valtio';\n\n/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './slot-fill-context';\n\nexport default function useSlotFills( name ) {\n\tconst registry = useContext( SlotFillContext );\n\tconst fills = useSnapshot( registry.fills, { sync: true } );\n\t// The important bit here is that this call ensures that the hook\n\t// only causes a re-render if the \"fills\" of a given slot name\n\t// change change, not any fills.\n\treturn fills.get( name );\n}\n"]}
|
|
@@ -7,12 +7,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
});
|
|
8
8
|
exports.default = useSlot;
|
|
9
9
|
|
|
10
|
+
var _valtio = require("valtio");
|
|
11
|
+
|
|
10
12
|
var _element = require("@wordpress/element");
|
|
11
13
|
|
|
12
14
|
var _slotFillContext = _interopRequireDefault(require("./slot-fill-context"));
|
|
13
15
|
|
|
14
16
|
// @ts-nocheck
|
|
15
17
|
|
|
18
|
+
/**
|
|
19
|
+
* External dependencies
|
|
20
|
+
*/
|
|
21
|
+
|
|
16
22
|
/**
|
|
17
23
|
* WordPress dependencies
|
|
18
24
|
*/
|
|
@@ -22,9 +28,13 @@ var _slotFillContext = _interopRequireDefault(require("./slot-fill-context"));
|
|
|
22
28
|
*/
|
|
23
29
|
function useSlot(name) {
|
|
24
30
|
const registry = (0, _element.useContext)(_slotFillContext.default);
|
|
25
|
-
const
|
|
26
|
-
|
|
27
|
-
|
|
31
|
+
const slots = (0, _valtio.useSnapshot)(registry.slots, {
|
|
32
|
+
sync: true
|
|
33
|
+
}); // The important bit here is that this call ensures
|
|
34
|
+
// the hook only causes a re-render if the slot
|
|
35
|
+
// with the given name change, not any other slot.
|
|
36
|
+
|
|
37
|
+
const slot = slots.get(name);
|
|
28
38
|
const updateSlot = (0, _element.useCallback)(fillProps => {
|
|
29
39
|
registry.updateSlot(name, fillProps);
|
|
30
40
|
}, [name, registry.updateSlot]);
|
|
@@ -40,7 +50,6 @@ function useSlot(name) {
|
|
|
40
50
|
return { ...slot,
|
|
41
51
|
updateSlot,
|
|
42
52
|
unregisterSlot,
|
|
43
|
-
fills,
|
|
44
53
|
registerFill,
|
|
45
54
|
unregisterFill
|
|
46
55
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/use-slot.js"],"names":["useSlot","name","registry","SlotFillContext","
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/use-slot.js"],"names":["useSlot","name","registry","SlotFillContext","slots","sync","slot","get","updateSlot","fillProps","unregisterSlot","slotRef","registerFill","fillRef","unregisterFill"],"mappings":";;;;;;;;;AAIA;;AAKA;;AAKA;;AAdA;;AACA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAGe,SAASA,OAAT,CAAkBC,IAAlB,EAAyB;AACvC,QAAMC,QAAQ,GAAG,yBAAYC,wBAAZ,CAAjB;AACA,QAAMC,KAAK,GAAG,yBAAaF,QAAQ,CAACE,KAAtB,EAA6B;AAAEC,IAAAA,IAAI,EAAE;AAAR,GAA7B,CAAd,CAFuC,CAGvC;AACA;AACA;;AACA,QAAMC,IAAI,GAAGF,KAAK,CAACG,GAAN,CAAWN,IAAX,CAAb;AAEA,QAAMO,UAAU,GAAG,0BAChBC,SAAF,IAAiB;AAChBP,IAAAA,QAAQ,CAACM,UAAT,CAAqBP,IAArB,EAA2BQ,SAA3B;AACA,GAHiB,EAIlB,CAAER,IAAF,EAAQC,QAAQ,CAACM,UAAjB,CAJkB,CAAnB;AAOA,QAAME,cAAc,GAAG,0BACpBC,OAAF,IAAe;AACdT,IAAAA,QAAQ,CAACQ,cAAT,CAAyBT,IAAzB,EAA+BU,OAA/B;AACA,GAHqB,EAItB,CAAEV,IAAF,EAAQC,QAAQ,CAACQ,cAAjB,CAJsB,CAAvB;AAOA,QAAME,YAAY,GAAG,0BAClBC,OAAF,IAAe;AACdX,IAAAA,QAAQ,CAACU,YAAT,CAAuBX,IAAvB,EAA6BY,OAA7B;AACA,GAHmB,EAIpB,CAAEZ,IAAF,EAAQC,QAAQ,CAACU,YAAjB,CAJoB,CAArB;AAOA,QAAME,cAAc,GAAG,0BACpBD,OAAF,IAAe;AACdX,IAAAA,QAAQ,CAACY,cAAT,CAAyBb,IAAzB,EAA+BY,OAA/B;AACA,GAHqB,EAItB,CAAEZ,IAAF,EAAQC,QAAQ,CAACY,cAAjB,CAJsB,CAAvB;AAOA,SAAO,EACN,GAAGR,IADG;AAENE,IAAAA,UAFM;AAGNE,IAAAA,cAHM;AAINE,IAAAA,YAJM;AAKNE,IAAAA;AALM,GAAP;AAOA","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { useSnapshot } from 'valtio';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './slot-fill-context';\n\nexport default function useSlot( name ) {\n\tconst registry = useContext( SlotFillContext );\n\tconst slots = useSnapshot( registry.slots, { sync: true } );\n\t// The important bit here is that this call ensures\n\t// the hook only causes a re-render if the slot\n\t// with the given name change, not any other slot.\n\tconst slot = slots.get( name );\n\n\tconst updateSlot = useCallback(\n\t\t( fillProps ) => {\n\t\t\tregistry.updateSlot( name, fillProps );\n\t\t},\n\t\t[ name, registry.updateSlot ]\n\t);\n\n\tconst unregisterSlot = useCallback(\n\t\t( slotRef ) => {\n\t\t\tregistry.unregisterSlot( name, slotRef );\n\t\t},\n\t\t[ name, registry.unregisterSlot ]\n\t);\n\n\tconst registerFill = useCallback(\n\t\t( fillRef ) => {\n\t\t\tregistry.registerFill( name, fillRef );\n\t\t},\n\t\t[ name, registry.registerFill ]\n\t);\n\n\tconst unregisterFill = useCallback(\n\t\t( fillRef ) => {\n\t\t\tregistry.unregisterFill( name, fillRef );\n\t\t},\n\t\t[ name, registry.unregisterFill ]\n\t);\n\n\treturn {\n\t\t...slot,\n\t\tupdateSlot,\n\t\tunregisterSlot,\n\t\tregisterFill,\n\t\tunregisterFill,\n\t};\n}\n"]}
|
package/build/slot-fill/index.js
CHANGED
|
@@ -15,6 +15,12 @@ Object.defineProperty(exports, "useSlot", {
|
|
|
15
15
|
return _useSlot.default;
|
|
16
16
|
}
|
|
17
17
|
});
|
|
18
|
+
Object.defineProperty(exports, "useSlotFills", {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function () {
|
|
21
|
+
return _useSlotFills.default;
|
|
22
|
+
}
|
|
23
|
+
});
|
|
18
24
|
|
|
19
25
|
var _element = require("@wordpress/element");
|
|
20
26
|
|
|
@@ -34,6 +40,8 @@ var _provider = _interopRequireDefault(require("./provider"));
|
|
|
34
40
|
|
|
35
41
|
var _useSlot = _interopRequireDefault(require("./bubbles-virtually/use-slot"));
|
|
36
42
|
|
|
43
|
+
var _useSlotFills = _interopRequireDefault(require("./bubbles-virtually/use-slot-fills"));
|
|
44
|
+
|
|
37
45
|
// @ts-nocheck
|
|
38
46
|
|
|
39
47
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/slot-fill/index.js"],"names":["Fill","props","Slot","ref","bubblesVirtually","Provider","children","createSlotFill","name","FillComponent","displayName","SlotComponent","__unstableName"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/slot-fill/index.js"],"names":["Fill","props","Slot","ref","bubblesVirtually","Provider","children","createSlotFill","name","FillComponent","displayName","SlotComponent","__unstableName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAIA;;;;AAKA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAhBA;;AACA;AACA;AACA;;AAGA;AACA;AACA;AAUO,SAASA,IAAT,CAAeC,KAAf,EAAuB;AAC7B;AACA;AACA;AACA,SACC,qDACC,4BAAC,aAAD,EAAeA,KAAf,CADD,EAEC,4BAAC,cAAD,EAA2BA,KAA3B,CAFD,CADD;AAMA;;AACM,MAAMC,IAAI,GAAG,yBAAY,OAAkCC,GAAlC,KAA2C;AAAA,MAAzC;AAAEC,IAAAA,gBAAF;AAAoB,OAAGH;AAAvB,GAAyC;;AAC1E,MAAKG,gBAAL,EAAwB;AACvB,WAAO,4BAAC,cAAD,6BAA2BH,KAA3B;AAAmC,MAAA,GAAG,EAAGE;AAAzC,OAAP;AACA;;AACD,SAAO,4BAAC,aAAD,EAAeF,KAAf,CAAP;AACA,CALmB,CAAb;;;AAOA,SAASI,QAAT,QAA4C;AAAA,MAAzB;AAAEC,IAAAA,QAAF;AAAY,OAAGL;AAAf,GAAyB;AAClD,SACC,4BAAC,iBAAD,EAAuBA,KAAvB,EACC,4BAAC,yBAAD,QACGK,QADH,CADD,CADD;AAOA;;AAEM,SAASC,cAAT,CAAyBC,IAAzB,EAAgC;AACtC,QAAMC,aAAa,GAAKR,KAAF,IAAa,4BAAC,IAAD;AAAM,IAAA,IAAI,EAAGO;AAAb,KAAyBP,KAAzB,EAAnC;;AACAQ,EAAAA,aAAa,CAACC,WAAd,GAA4BF,IAAI,GAAG,MAAnC;;AAEA,QAAMG,aAAa,GAAKV,KAAF,IAAa,4BAAC,IAAD;AAAM,IAAA,IAAI,EAAGO;AAAb,KAAyBP,KAAzB,EAAnC;;AACAU,EAAAA,aAAa,CAACD,WAAd,GAA4BF,IAAI,GAAG,MAAnC;AACAG,EAAAA,aAAa,CAACC,cAAd,GAA+BJ,IAA/B;AAEA,SAAO;AACNR,IAAAA,IAAI,EAAES,aADA;AAENP,IAAAA,IAAI,EAAES;AAFA,GAAP;AAIA","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BaseFill from './fill';\nimport BaseSlot from './slot';\nimport BubblesVirtuallyFill from './bubbles-virtually/fill';\nimport BubblesVirtuallySlot from './bubbles-virtually/slot';\nimport BubblesVirtuallySlotFillProvider from './bubbles-virtually/slot-fill-provider';\nimport SlotFillProvider from './provider';\nimport useSlot from './bubbles-virtually/use-slot';\nexport { default as useSlotFills } from './bubbles-virtually/use-slot-fills';\n\nexport function Fill( props ) {\n\t// We're adding both Fills here so they can register themselves before\n\t// their respective slot has been registered. Only the Fill that has a slot\n\t// will render. The other one will return null.\n\treturn (\n\t\t<>\n\t\t\t<BaseFill { ...props } />\n\t\t\t<BubblesVirtuallyFill { ...props } />\n\t\t</>\n\t);\n}\nexport const Slot = forwardRef( ( { bubblesVirtually, ...props }, ref ) => {\n\tif ( bubblesVirtually ) {\n\t\treturn <BubblesVirtuallySlot { ...props } ref={ ref } />;\n\t}\n\treturn <BaseSlot { ...props } />;\n} );\n\nexport function Provider( { children, ...props } ) {\n\treturn (\n\t\t<SlotFillProvider { ...props }>\n\t\t\t<BubblesVirtuallySlotFillProvider>\n\t\t\t\t{ children }\n\t\t\t</BubblesVirtuallySlotFillProvider>\n\t\t</SlotFillProvider>\n\t);\n}\n\nexport function createSlotFill( name ) {\n\tconst FillComponent = ( props ) => <Fill name={ name } { ...props } />;\n\tFillComponent.displayName = name + 'Fill';\n\n\tconst SlotComponent = ( props ) => <Slot name={ name } { ...props } />;\n\tSlotComponent.displayName = name + 'Slot';\n\tSlotComponent.__unstableName = name;\n\n\treturn {\n\t\tFill: FillComponent,\n\t\tSlot: SlotComponent,\n\t};\n}\n\nexport { useSlot };\n"]}
|
package/build/tab-panel/index.js
CHANGED
|
@@ -102,7 +102,7 @@ function TabPanel(_ref2) {
|
|
|
102
102
|
const instanceId = (0, _compose.useInstanceId)(TabPanel, 'tab-panel');
|
|
103
103
|
const [selected, setSelected] = (0, _element.useState)();
|
|
104
104
|
|
|
105
|
-
const
|
|
105
|
+
const handleTabSelection = tabKey => {
|
|
106
106
|
setSelected(tabKey);
|
|
107
107
|
onSelect === null || onSelect === void 0 ? void 0 : onSelect(tabKey);
|
|
108
108
|
};
|
|
@@ -120,8 +120,8 @@ function TabPanel(_ref2) {
|
|
|
120
120
|
name: selected
|
|
121
121
|
});
|
|
122
122
|
|
|
123
|
-
if (!newSelectedTab) {
|
|
124
|
-
|
|
123
|
+
if (!newSelectedTab && tabs.length > 0) {
|
|
124
|
+
handleTabSelection(initialTabName || tabs[0].name);
|
|
125
125
|
}
|
|
126
126
|
}, [tabs]);
|
|
127
127
|
return (0, _element.createElement)("div", {
|
|
@@ -139,7 +139,7 @@ function TabPanel(_ref2) {
|
|
|
139
139
|
"aria-controls": `${instanceId}-${tab.name}-view`,
|
|
140
140
|
selected: tab.name === selected,
|
|
141
141
|
key: tab.name,
|
|
142
|
-
onClick: () =>
|
|
142
|
+
onClick: () => handleTabSelection(tab.name)
|
|
143
143
|
}, tab.title))), selectedTab && (0, _element.createElement)("div", {
|
|
144
144
|
key: selectedId,
|
|
145
145
|
"aria-labelledby": selectedId,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/tab-panel/index.tsx"],"names":["TabButton","tabId","onClick","children","selected","rest","TabPanel","className","tabs","initialTabName","orientation","activeClass","onSelect","instanceId","setSelected","
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/tab-panel/index.tsx"],"names":["TabButton","tabId","onClick","children","selected","rest","TabPanel","className","tabs","initialTabName","orientation","activeClass","onSelect","instanceId","setSelected","handleTabSelection","tabKey","onNavigate","_childIndex","child","click","selectedTab","name","selectedId","newSelectedTab","length","map","tab","title"],"mappings":";;;;;;;;;;AASA;;;;AANA;;AACA;;AAMA;;AAKA;;AACA;;AAhBA;AACA;AACA;;AAIA;AACA;AACA;;AAIA;AACA;AACA;AAMA,MAAMA,SAAS,GAAG;AAAA,MAAE;AACnBC,IAAAA,KADmB;AAEnBC,IAAAA,OAFmB;AAGnBC,IAAAA,QAHmB;AAInBC,IAAAA,QAJmB;AAKnB,OAAGC;AALgB,GAAF;AAAA,SAOjB,4BAAC,eAAD;AACC,IAAA,IAAI,EAAC,KADN;AAEC,IAAA,QAAQ,EAAGD,QAAQ,GAAG,IAAH,GAAU,CAAC,CAF/B;AAGC,qBAAgBA,QAHjB;AAIC,IAAA,EAAE,EAAGH,KAJN;AAKC,IAAA,OAAO,EAAGC;AALX,KAMMG,IANN,GAQGF,QARH,CAPiB;AAAA,CAAlB;AAmBA;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;;;AACO,SAASG,QAAT,QAQqD;AAAA;;AAAA,MARlC;AACzBC,IAAAA,SADyB;AAEzBJ,IAAAA,QAFyB;AAGzBK,IAAAA,IAHyB;AAIzBC,IAAAA,cAJyB;AAKzBC,IAAAA,WAAW,GAAG,YALW;AAMzBC,IAAAA,WAAW,GAAG,WANW;AAOzBC,IAAAA;AAPyB,GAQkC;AAC3D,QAAMC,UAAU,GAAG,4BAAeP,QAAf,EAAyB,WAAzB,CAAnB;AACA,QAAM,CAAEF,QAAF,EAAYU,WAAZ,IAA4B,wBAAlC;;AAEA,QAAMC,kBAAkB,GAAKC,MAAF,IAAsB;AAChDF,IAAAA,WAAW,CAAEE,MAAF,CAAX;AACAJ,IAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAII,MAAJ,CAAR;AACA,GAHD;;AAKA,QAAMC,UAAU,GAAG,CAAEC,WAAF,EAAuBC,KAAvB,KAAqD;AACvEA,IAAAA,KAAK,CAACC,KAAN;AACA,GAFD;;AAGA,QAAMC,WAAW,GAAG,kBAAMb,IAAN,EAAY;AAAEc,IAAAA,IAAI,EAAElB;AAAR,GAAZ,CAApB;AACA,QAAMmB,UAAU,GAAI,GAAGV,UAAY,IAAhB,qBAAoBQ,WAApB,aAAoBA,WAApB,uBAAoBA,WAAW,CAAEC,IAAjC,iEAAyC,MAAQ,EAApE;AAEA,0BAAW,MAAM;AAChB,UAAME,cAAc,GAAG,kBAAMhB,IAAN,EAAY;AAAEc,MAAAA,IAAI,EAAElB;AAAR,KAAZ,CAAvB;;AACA,QAAK,CAAEoB,cAAF,IAAoBhB,IAAI,CAACiB,MAAL,GAAc,CAAvC,EAA2C;AAC1CV,MAAAA,kBAAkB,CAAEN,cAAc,IAAID,IAAI,CAAE,CAAF,CAAJ,CAAUc,IAA9B,CAAlB;AACA;AACD,GALD,EAKG,CAAEd,IAAF,CALH;AAOA,SACC;AAAK,IAAA,SAAS,EAAGD;AAAjB,KACC,4BAAC,iCAAD;AACC,IAAA,IAAI,EAAC,SADN;AAEC,IAAA,WAAW,EAAGG,WAFf;AAGC,IAAA,UAAU,EAAGO,UAHd;AAIC,IAAA,SAAS,EAAC;AAJX,KAMGT,IAAI,CAACkB,GAAL,CAAYC,GAAF,IACX,4BAAC,SAAD;AACC,IAAA,SAAS,EAAG,yBACX,iCADW,EAEXA,GAAG,CAACpB,SAFO,EAGX;AACC,OAAEI,WAAF,GAAiBgB,GAAG,CAACL,IAAJ,KAAalB;AAD/B,KAHW,CADb;AAQC,IAAA,KAAK,EAAI,GAAGS,UAAY,IAAIc,GAAG,CAACL,IAAM,EARvC;AASC,qBAAiB,GAAGT,UAAY,IAAIc,GAAG,CAACL,IAAM,OAT/C;AAUC,IAAA,QAAQ,EAAGK,GAAG,CAACL,IAAJ,KAAalB,QAVzB;AAWC,IAAA,GAAG,EAAGuB,GAAG,CAACL,IAXX;AAYC,IAAA,OAAO,EAAG,MAAMP,kBAAkB,CAAEY,GAAG,CAACL,IAAN;AAZnC,KAcGK,GAAG,CAACC,KAdP,CADC,CANH,CADD,EA0BGP,WAAW,IACZ;AACC,IAAA,GAAG,EAAGE,UADP;AAEC,uBAAkBA,UAFnB;AAGC,IAAA,IAAI,EAAC,UAHN;AAIC,IAAA,EAAE,EAAI,GAAGA,UAAY,OAJtB;AAKC,IAAA,SAAS,EAAC;AALX,KAOGpB,QAAQ,CAAEkB,WAAF,CAPX,CA3BF,CADD;AAwCA;;eAEcf,Q","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { find } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useEffect } 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\tonClick,\n\tchildren,\n\tselected,\n\t...rest\n}: TabButtonProps ) => (\n\t<Button\n\t\trole=\"tab\"\n\t\ttabIndex={ selected ? null : -1 }\n\t\taria-selected={ selected }\n\t\tid={ tabId }\n\t\tonClick={ onClick }\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\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 = ( tabKey: string ) => {\n\t\tsetSelected( tabKey );\n\t\tonSelect?.( tabKey );\n\t};\n\n\tconst onNavigate = ( _childIndex: number, child: HTMLButtonElement ) => {\n\t\tchild.click();\n\t};\n\tconst selectedTab = find( tabs, { name: selected } );\n\tconst selectedId = `${ instanceId }-${ selectedTab?.name ?? 'none' }`;\n\n\tuseEffect( () => {\n\t\tconst newSelectedTab = find( tabs, { name: selected } );\n\t\tif ( ! newSelectedTab && tabs.length > 0 ) {\n\t\t\thandleTabSelection( initialTabName || tabs[ 0 ].name );\n\t\t}\n\t}, [ tabs ] );\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={ onNavigate }\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>\n\t\t\t\t\t\t{ 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"]}
|
|
@@ -0,0 +1,62 @@
|
|
|
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 _colord = require("colord");
|
|
13
|
+
|
|
14
|
+
var _a11y = _interopRequireDefault(require("colord/plugins/a11y"));
|
|
15
|
+
|
|
16
|
+
var _names = _interopRequireDefault(require("colord/plugins/names"));
|
|
17
|
+
|
|
18
|
+
var _styles = require("./styles");
|
|
19
|
+
|
|
20
|
+
/**
|
|
21
|
+
* External dependencies
|
|
22
|
+
*/
|
|
23
|
+
(0, _colord.extend)([_names.default, _a11y.default]);
|
|
24
|
+
/**
|
|
25
|
+
* `Theme` allows defining theme variables for components in the `@wordpress/components` package.
|
|
26
|
+
*
|
|
27
|
+
* Multiple `Theme` components can be nested in order to override specific theme variables.
|
|
28
|
+
*
|
|
29
|
+
*
|
|
30
|
+
* @example
|
|
31
|
+
* ```jsx
|
|
32
|
+
* import { __experimentalTheme as Theme } from '@wordpress/components';
|
|
33
|
+
*
|
|
34
|
+
* const Example = () => {
|
|
35
|
+
* return (
|
|
36
|
+
* <Theme accent="red">
|
|
37
|
+
* <Button variant="primary">I'm red</Button>
|
|
38
|
+
* <Theme accent="blue">
|
|
39
|
+
* <Button variant="primary">I'm blue</Button>
|
|
40
|
+
* </Theme>
|
|
41
|
+
* </Theme>
|
|
42
|
+
* );
|
|
43
|
+
* };
|
|
44
|
+
* ```
|
|
45
|
+
*/
|
|
46
|
+
|
|
47
|
+
function Theme(props) {
|
|
48
|
+
const {
|
|
49
|
+
accent
|
|
50
|
+
} = props;
|
|
51
|
+
|
|
52
|
+
if (accent && !(0, _colord.colord)(accent).isValid()) {
|
|
53
|
+
// eslint-disable-next-line no-console
|
|
54
|
+
console.warn(`wp.components.Theme: "${accent}" is not a valid color value for the 'accent' prop.`);
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
return (0, _element.createElement)(_styles.Wrapper, props);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
var _default = Theme;
|
|
61
|
+
exports.default = _default;
|
|
62
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/theme/index.tsx"],"names":["namesPlugin","a11yPlugin","Theme","props","accent","isValid","console","warn"],"mappings":";;;;;;;;;;;AAGA;;AACA;;AACA;;AAOA;;AAZA;AACA;AACA;AAYA,oBAAQ,CAAEA,cAAF,EAAeC,aAAf,CAAR;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,KAAT,CAAgBC,KAAhB,EAA4E;AAC3E,QAAM;AAAEC,IAAAA;AAAF,MAAaD,KAAnB;;AACA,MAAKC,MAAM,IAAI,CAAE,oBAAQA,MAAR,EAAiBC,OAAjB,EAAjB,EAA8C;AAC7C;AACAC,IAAAA,OAAO,CAACC,IAAR,CACE,yBAAyBH,MAAQ,qDADnC;AAGA;;AAED,SAAO,4BAAC,eAAD,EAAcD,KAAd,CAAP;AACA;;eAEcD,K","sourcesContent":["/**\n * External dependencies\n */\nimport { colord, extend } from 'colord';\nimport a11yPlugin from 'colord/plugins/a11y';\nimport namesPlugin from 'colord/plugins/names';\n\n/**\n * Internal dependencies\n */\nimport type { ThemeProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\nimport { Wrapper } from './styles';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\n/**\n * `Theme` allows defining theme variables for components in the `@wordpress/components` package.\n *\n * Multiple `Theme` components can be nested in order to override specific theme variables.\n *\n *\n * @example\n * ```jsx\n * import { __experimentalTheme as Theme } from '@wordpress/components';\n *\n * const Example = () => {\n * return (\n * <Theme accent=\"red\">\n * <Button variant=\"primary\">I'm red</Button>\n * <Theme accent=\"blue\">\n * <Button variant=\"primary\">I'm blue</Button>\n * </Theme>\n * </Theme>\n * );\n * };\n * ```\n */\nfunction Theme( props: WordPressComponentProps< ThemeProps, 'div', true > ) {\n\tconst { accent } = props;\n\tif ( accent && ! colord( accent ).isValid() ) {\n\t\t// eslint-disable-next-line no-console\n\t\tconsole.warn(\n\t\t\t`wp.components.Theme: \"${ accent }\" is not a valid color value for the 'accent' prop.`\n\t\t);\n\t}\n\n\treturn <Wrapper { ...props } />;\n}\n\nexport default Theme;\n"]}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.Wrapper = void 0;
|
|
9
|
+
|
|
10
|
+
var _base = _interopRequireDefault(require("@emotion/styled/base"));
|
|
11
|
+
|
|
12
|
+
var _colord = require("colord");
|
|
13
|
+
|
|
14
|
+
var _react = require("@emotion/react");
|
|
15
|
+
|
|
16
|
+
/**
|
|
17
|
+
* External dependencies
|
|
18
|
+
*/
|
|
19
|
+
const accentColor = _ref => {
|
|
20
|
+
let {
|
|
21
|
+
accent
|
|
22
|
+
} = _ref;
|
|
23
|
+
return accent ? /*#__PURE__*/(0, _react.css)("--wp-components-color-accent:", accent, ";--wp-components-color-accent-darker-10:", (0, _colord.colord)(accent).darken(0.1).toHex(), ";--wp-components-color-accent-darker-20:", (0, _colord.colord)(accent).darken(0.2).toHex(), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:accentColor;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGhlbWUvc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWNPIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGhlbWUvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY29sb3JkIH0gZnJvbSAnY29sb3JkJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHR5cGUgeyBUaGVtZVByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IGFjY2VudENvbG9yID0gKCB7IGFjY2VudCB9OiBUaGVtZVByb3BzICkgPT5cblx0YWNjZW50XG5cdFx0PyBjc3NgXG5cdFx0XHRcdC0td3AtY29tcG9uZW50cy1jb2xvci1hY2NlbnQ6ICR7IGFjY2VudCB9O1xuXHRcdFx0XHQtLXdwLWNvbXBvbmVudHMtY29sb3ItYWNjZW50LWRhcmtlci0xMDogJHsgY29sb3JkKCBhY2NlbnQgKVxuXHRcdFx0XHRcdC5kYXJrZW4oIDAuMSApXG5cdFx0XHRcdFx0LnRvSGV4KCkgfTtcblx0XHRcdFx0LS13cC1jb21wb25lbnRzLWNvbG9yLWFjY2VudC1kYXJrZXItMjA6ICR7IGNvbG9yZCggYWNjZW50IClcblx0XHRcdFx0XHQuZGFya2VuKCAwLjIgKVxuXHRcdFx0XHRcdC50b0hleCgpIH07XG5cdFx0ICBgXG5cdFx0OiB1bmRlZmluZWQ7XG5cbmV4cG9ydCBjb25zdCBXcmFwcGVyID0gc3R5bGVkLmRpdjwgVGhlbWVQcm9wcyA+YFxuXHQkeyBhY2NlbnRDb2xvciB9XG5gO1xuIl19 */") : undefined;
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
const Wrapper = (0, _base.default)("div", process.env.NODE_ENV === "production" ? {
|
|
27
|
+
target: "e1krjpvb0"
|
|
28
|
+
} : {
|
|
29
|
+
target: "e1krjpvb0",
|
|
30
|
+
label: "Wrapper"
|
|
31
|
+
})(accentColor, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGhlbWUvc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlCK0MiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy90aGVtZS9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjb2xvcmQgfSBmcm9tICdjb2xvcmQnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgdHlwZSB7IFRoZW1lUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgYWNjZW50Q29sb3IgPSAoIHsgYWNjZW50IH06IFRoZW1lUHJvcHMgKSA9PlxuXHRhY2NlbnRcblx0XHQ/IGNzc2Bcblx0XHRcdFx0LS13cC1jb21wb25lbnRzLWNvbG9yLWFjY2VudDogJHsgYWNjZW50IH07XG5cdFx0XHRcdC0td3AtY29tcG9uZW50cy1jb2xvci1hY2NlbnQtZGFya2VyLTEwOiAkeyBjb2xvcmQoIGFjY2VudCApXG5cdFx0XHRcdFx0LmRhcmtlbiggMC4xIClcblx0XHRcdFx0XHQudG9IZXgoKSB9O1xuXHRcdFx0XHQtLXdwLWNvbXBvbmVudHMtY29sb3ItYWNjZW50LWRhcmtlci0yMDogJHsgY29sb3JkKCBhY2NlbnQgKVxuXHRcdFx0XHRcdC5kYXJrZW4oIDAuMiApXG5cdFx0XHRcdFx0LnRvSGV4KCkgfTtcblx0XHQgIGBcblx0XHQ6IHVuZGVmaW5lZDtcblxuZXhwb3J0IGNvbnN0IFdyYXBwZXIgPSBzdHlsZWQuZGl2PCBUaGVtZVByb3BzID5gXG5cdCR7IGFjY2VudENvbG9yIH1cbmA7XG4iXX0= */"));
|
|
32
|
+
exports.Wrapper = Wrapper;
|
|
33
|
+
//# sourceMappingURL=styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/theme/styles.ts"],"names":["accentColor","accent","css","darken","toHex","undefined","Wrapper"],"mappings":";;;;;;;;;;;AAGA;;AAEA;;AALA;AACA;AACA;AAUA,MAAMA,WAAW,GAAG;AAAA,MAAE;AAAEC,IAAAA;AAAF,GAAF;AAAA,SACnBA,MAAM,oBACHC,UADG,mCAE8BD,MAF9B,8CAGwC,oBAAQA,MAAR,EACzCE,MADyC,CACjC,GADiC,EAEzCC,KAFyC,EAHxC,8CAMwC,oBAAQH,MAAR,EACzCE,MADyC,CACjC,GADiC,EAEzCC,KAFyC,EANxC,w0CAUHC,SAXgB;AAAA,CAApB;;AAaO,MAAMC,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAChBN,WADgB,qwCAAb","sourcesContent":["/**\n * External dependencies\n */\nimport { colord } from 'colord';\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport type { ThemeProps } from './types';\n\nconst accentColor = ( { accent }: ThemeProps ) =>\n\taccent\n\t\t? css`\n\t\t\t\t--wp-components-color-accent: ${ accent };\n\t\t\t\t--wp-components-color-accent-darker-10: ${ colord( accent )\n\t\t\t\t\t.darken( 0.1 )\n\t\t\t\t\t.toHex() };\n\t\t\t\t--wp-components-color-accent-darker-20: ${ colord( accent )\n\t\t\t\t\t.darken( 0.2 )\n\t\t\t\t\t.toHex() };\n\t\t `\n\t\t: undefined;\n\nexport const Wrapper = styled.div< ThemeProps >`\n\t${ accentColor }\n`;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}
|