@wordpress/ui 0.9.1-next.v.202603102151.0 → 0.10.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 +42 -1
- package/CONTRIBUTING.md +31 -0
- package/README.md +106 -0
- package/build/alert-dialog/context.cjs +34 -0
- package/build/alert-dialog/context.cjs.map +7 -0
- package/build/alert-dialog/index.cjs +37 -0
- package/build/alert-dialog/index.cjs.map +7 -0
- package/build/alert-dialog/popup.cjs +93 -0
- package/build/alert-dialog/popup.cjs.map +7 -0
- package/build/alert-dialog/root.cjs +52 -0
- package/build/alert-dialog/root.cjs.map +7 -0
- package/build/alert-dialog/trigger.cjs +48 -0
- package/build/alert-dialog/trigger.cjs.map +7 -0
- package/build/alert-dialog/types.cjs +19 -0
- package/build/alert-dialog/types.cjs.map +7 -0
- package/build/badge/badge.cjs +3 -3
- package/build/badge/badge.cjs.map +2 -2
- package/build/button/button.cjs +9 -9
- package/build/button/button.cjs.map +2 -2
- package/build/card/content.cjs +3 -3
- package/build/card/content.cjs.map +2 -2
- package/build/card/full-bleed.cjs +3 -3
- package/build/card/full-bleed.cjs.map +2 -2
- package/build/card/header.cjs +3 -3
- package/build/card/header.cjs.map +2 -2
- package/build/card/root.cjs +5 -5
- package/build/card/root.cjs.map +2 -2
- package/build/card/title.cjs +26 -13
- package/build/card/title.cjs.map +3 -3
- package/build/collapsible/index.cjs +37 -0
- package/build/collapsible/index.cjs.map +7 -0
- package/build/collapsible/panel.cjs +38 -0
- package/build/collapsible/panel.cjs.map +7 -0
- package/build/collapsible/root.cjs +38 -0
- package/build/collapsible/root.cjs.map +7 -0
- package/build/collapsible/trigger.cjs +38 -0
- package/build/collapsible/trigger.cjs.map +7 -0
- package/build/collapsible/types.cjs +19 -0
- package/build/collapsible/types.cjs.map +7 -0
- package/build/collapsible-card/content.cjs +26 -5
- package/build/collapsible-card/content.cjs.map +4 -4
- package/build/collapsible-card/context.cjs +35 -0
- package/build/collapsible-card/context.cjs.map +7 -0
- package/build/collapsible-card/header-description.cjs +52 -0
- package/build/collapsible-card/header-description.cjs.map +7 -0
- package/build/collapsible-card/header.cjs +57 -38
- package/build/collapsible-card/header.cjs.map +3 -3
- package/build/collapsible-card/index.cjs +3 -0
- package/build/collapsible-card/index.cjs.map +2 -2
- package/build/collapsible-card/root.cjs +4 -4
- package/build/collapsible-card/root.cjs.map +2 -2
- package/build/collapsible-card/types.cjs.map +1 -1
- package/build/dialog/action.cjs +4 -2
- package/build/dialog/action.cjs.map +2 -2
- package/build/dialog/close-icon.cjs +2 -1
- package/build/dialog/close-icon.cjs.map +2 -2
- package/build/dialog/footer.cjs +3 -3
- package/build/dialog/footer.cjs.map +2 -2
- package/build/dialog/header.cjs +3 -3
- package/build/dialog/header.cjs.map +2 -2
- package/build/dialog/popup.cjs +22 -5
- package/build/dialog/popup.cjs.map +2 -2
- package/build/dialog/title.cjs +3 -3
- package/build/dialog/title.cjs.map +2 -2
- package/build/dialog/types.cjs.map +1 -1
- package/build/empty-state/actions.cjs +66 -0
- package/build/empty-state/actions.cjs.map +7 -0
- package/build/empty-state/description.cjs +66 -0
- package/build/empty-state/description.cjs.map +7 -0
- package/build/empty-state/icon.cjs +69 -0
- package/build/empty-state/icon.cjs.map +7 -0
- package/build/empty-state/index.cjs +46 -0
- package/build/empty-state/index.cjs.map +7 -0
- package/build/empty-state/root.cjs +66 -0
- package/build/empty-state/root.cjs.map +7 -0
- package/build/empty-state/title.cjs +68 -0
- package/build/empty-state/title.cjs.map +7 -0
- package/build/empty-state/types.cjs +19 -0
- package/build/empty-state/types.cjs.map +7 -0
- package/build/empty-state/visual.cjs +66 -0
- package/build/empty-state/visual.cjs.map +7 -0
- package/build/form/index.cjs +27 -0
- package/build/form/index.cjs.map +7 -0
- package/build/form/input-control/index.cjs +31 -0
- package/build/form/input-control/index.cjs.map +7 -0
- package/build/form/input-control/input-control.cjs +50 -0
- package/build/form/input-control/input-control.cjs.map +7 -0
- package/build/form/input-control/types.cjs +19 -0
- package/build/form/input-control/types.cjs.map +7 -0
- package/build/form/primitives/field/description.cjs +2 -2
- package/build/form/primitives/field/description.cjs.map +1 -1
- package/build/form/primitives/field/details.cjs +2 -2
- package/build/form/primitives/field/details.cjs.map +1 -1
- package/build/form/primitives/field/label.cjs +2 -2
- package/build/form/primitives/field/label.cjs.map +1 -1
- package/build/form/primitives/field/root.cjs +4 -4
- package/build/form/primitives/field/root.cjs.map +2 -2
- package/build/form/primitives/fieldset/description.cjs +2 -2
- package/build/form/primitives/fieldset/description.cjs.map +1 -1
- package/build/form/primitives/fieldset/details.cjs +2 -2
- package/build/form/primitives/fieldset/details.cjs.map +1 -1
- package/build/form/primitives/fieldset/legend.cjs +2 -2
- package/build/form/primitives/fieldset/legend.cjs.map +1 -1
- package/build/form/primitives/fieldset/root.cjs +2 -2
- package/build/form/primitives/fieldset/root.cjs.map +1 -1
- package/build/form/primitives/input/input.cjs +6 -6
- package/build/form/primitives/input/input.cjs.map +2 -2
- package/build/form/primitives/input-layout/input-layout.cjs +4 -4
- package/build/form/primitives/input-layout/input-layout.cjs.map +1 -1
- package/build/form/primitives/input-layout/slot.cjs +5 -4
- package/build/form/primitives/input-layout/slot.cjs.map +2 -2
- package/build/form/primitives/select/item.cjs +5 -5
- package/build/form/primitives/select/item.cjs.map +2 -2
- package/build/form/primitives/select/popup.cjs +7 -7
- package/build/form/primitives/select/popup.cjs.map +2 -2
- package/build/form/primitives/select/trigger.cjs +7 -7
- package/build/form/primitives/select/trigger.cjs.map +2 -2
- package/build/form/primitives/textarea/textarea.cjs +3 -3
- package/build/form/primitives/textarea/textarea.cjs.map +2 -2
- package/build/form/types.cjs +19 -0
- package/build/form/types.cjs.map +7 -0
- package/build/icon-button/icon-button.cjs +2 -2
- package/build/icon-button/icon-button.cjs.map +1 -1
- package/build/index.cjs +11 -2
- package/build/index.cjs.map +2 -2
- package/build/link/link.cjs +8 -8
- package/build/link/link.cjs.map +2 -2
- package/build/notice/action-button.cjs +2 -2
- package/build/notice/action-button.cjs.map +1 -1
- package/build/notice/action-link.cjs +2 -2
- package/build/notice/action-link.cjs.map +1 -1
- package/build/notice/actions.cjs +2 -2
- package/build/notice/actions.cjs.map +1 -1
- package/build/notice/close-icon.cjs +2 -2
- package/build/notice/close-icon.cjs.map +1 -1
- package/build/notice/description.cjs +2 -2
- package/build/notice/description.cjs.map +1 -1
- package/build/notice/index.cjs.map +1 -1
- package/build/notice/root.cjs +4 -4
- package/build/notice/root.cjs.map +1 -1
- package/build/notice/title.cjs +2 -2
- package/build/notice/title.cjs.map +1 -1
- package/build/stack/stack.cjs +2 -2
- package/build/stack/stack.cjs.map +1 -1
- package/build/tabs/context.cjs +121 -0
- package/build/tabs/context.cjs.map +7 -0
- package/build/tabs/list.cjs +3 -3
- package/build/tabs/list.cjs.map +2 -2
- package/build/tabs/panel.cjs +5 -3
- package/build/tabs/panel.cjs.map +2 -2
- package/build/tabs/root.cjs +2 -1
- package/build/tabs/root.cjs.map +2 -2
- package/build/tabs/tab.cjs +5 -3
- package/build/tabs/tab.cjs.map +2 -2
- package/build/text/text.cjs +2 -2
- package/build/text/text.cjs.map +1 -1
- package/build/tooltip/popup.cjs +4 -4
- package/build/tooltip/popup.cjs.map +1 -1
- package/build/tooltip/root.cjs.map +2 -2
- package/build/utils/use-deprioritized-initial-focus.cjs +64 -0
- package/build/utils/use-deprioritized-initial-focus.cjs.map +7 -0
- package/build/visually-hidden/visually-hidden.cjs +2 -2
- package/build/visually-hidden/visually-hidden.cjs.map +1 -1
- package/build-module/alert-dialog/context.mjs +9 -0
- package/build-module/alert-dialog/context.mjs.map +7 -0
- package/build-module/alert-dialog/index.mjs +10 -0
- package/build-module/alert-dialog/index.mjs.map +7 -0
- package/build-module/alert-dialog/popup.mjs +58 -0
- package/build-module/alert-dialog/popup.mjs.map +7 -0
- package/build-module/alert-dialog/root.mjs +27 -0
- package/build-module/alert-dialog/root.mjs.map +7 -0
- package/build-module/alert-dialog/trigger.mjs +13 -0
- package/build-module/alert-dialog/trigger.mjs.map +7 -0
- package/build-module/alert-dialog/types.mjs +1 -0
- package/build-module/alert-dialog/types.mjs.map +7 -0
- package/build-module/badge/badge.mjs +3 -3
- package/build-module/badge/badge.mjs.map +2 -2
- package/build-module/button/button.mjs +9 -9
- package/build-module/button/button.mjs.map +2 -2
- package/build-module/card/content.mjs +3 -3
- package/build-module/card/content.mjs.map +2 -2
- package/build-module/card/full-bleed.mjs +3 -3
- package/build-module/card/full-bleed.mjs.map +2 -2
- package/build-module/card/header.mjs +3 -3
- package/build-module/card/header.mjs.map +2 -2
- package/build-module/card/root.mjs +5 -5
- package/build-module/card/root.mjs.map +2 -2
- package/build-module/card/title.mjs +16 -13
- package/build-module/card/title.mjs.map +2 -2
- package/build-module/collapsible/index.mjs +10 -0
- package/build-module/collapsible/index.mjs.map +7 -0
- package/build-module/collapsible/panel.mjs +13 -0
- package/build-module/collapsible/panel.mjs.map +7 -0
- package/build-module/collapsible/root.mjs +13 -0
- package/build-module/collapsible/root.mjs.map +7 -0
- package/build-module/collapsible/trigger.mjs +13 -0
- package/build-module/collapsible/trigger.mjs.map +7 -0
- package/build-module/collapsible/types.mjs +1 -0
- package/build-module/collapsible/types.mjs.map +7 -0
- package/build-module/collapsible-card/content.mjs +25 -4
- package/build-module/collapsible-card/content.mjs.map +3 -3
- package/build-module/collapsible-card/context.mjs +10 -0
- package/build-module/collapsible-card/context.mjs.map +7 -0
- package/build-module/collapsible-card/header-description.mjs +27 -0
- package/build-module/collapsible-card/header-description.mjs.map +7 -0
- package/build-module/collapsible-card/header.mjs +59 -40
- package/build-module/collapsible-card/header.mjs.map +3 -3
- package/build-module/collapsible-card/index.mjs +2 -0
- package/build-module/collapsible-card/index.mjs.map +2 -2
- package/build-module/collapsible-card/root.mjs +3 -3
- package/build-module/collapsible-card/root.mjs.map +2 -2
- package/build-module/dialog/action.mjs +4 -2
- package/build-module/dialog/action.mjs.map +2 -2
- package/build-module/dialog/close-icon.mjs +2 -1
- package/build-module/dialog/close-icon.mjs.map +2 -2
- package/build-module/dialog/footer.mjs +3 -3
- package/build-module/dialog/footer.mjs.map +2 -2
- package/build-module/dialog/header.mjs +3 -3
- package/build-module/dialog/header.mjs.map +2 -2
- package/build-module/dialog/popup.mjs +22 -5
- package/build-module/dialog/popup.mjs.map +2 -2
- package/build-module/dialog/title.mjs +3 -3
- package/build-module/dialog/title.mjs.map +2 -2
- package/build-module/empty-state/actions.mjs +31 -0
- package/build-module/empty-state/actions.mjs.map +7 -0
- package/build-module/empty-state/description.mjs +31 -0
- package/build-module/empty-state/description.mjs.map +7 -0
- package/build-module/empty-state/icon.mjs +34 -0
- package/build-module/empty-state/icon.mjs.map +7 -0
- package/build-module/empty-state/index.mjs +16 -0
- package/build-module/empty-state/index.mjs.map +7 -0
- package/build-module/empty-state/root.mjs +31 -0
- package/build-module/empty-state/root.mjs.map +7 -0
- package/build-module/empty-state/title.mjs +33 -0
- package/build-module/empty-state/title.mjs.map +7 -0
- package/build-module/empty-state/types.mjs +1 -0
- package/build-module/empty-state/types.mjs.map +7 -0
- package/build-module/empty-state/visual.mjs +31 -0
- package/build-module/empty-state/visual.mjs.map +7 -0
- package/build-module/form/index.mjs +4 -0
- package/build-module/form/index.mjs.map +7 -0
- package/build-module/form/input-control/index.mjs +6 -0
- package/build-module/form/input-control/index.mjs.map +7 -0
- package/build-module/form/input-control/input-control.mjs +25 -0
- package/build-module/form/input-control/input-control.mjs.map +7 -0
- package/build-module/form/input-control/types.mjs +1 -0
- package/build-module/form/input-control/types.mjs.map +7 -0
- package/build-module/form/primitives/field/description.mjs +2 -2
- package/build-module/form/primitives/field/description.mjs.map +1 -1
- package/build-module/form/primitives/field/details.mjs +2 -2
- package/build-module/form/primitives/field/details.mjs.map +1 -1
- package/build-module/form/primitives/field/label.mjs +2 -2
- package/build-module/form/primitives/field/label.mjs.map +1 -1
- package/build-module/form/primitives/field/root.mjs +4 -4
- package/build-module/form/primitives/field/root.mjs.map +2 -2
- package/build-module/form/primitives/fieldset/description.mjs +2 -2
- package/build-module/form/primitives/fieldset/description.mjs.map +1 -1
- package/build-module/form/primitives/fieldset/details.mjs +2 -2
- package/build-module/form/primitives/fieldset/details.mjs.map +1 -1
- package/build-module/form/primitives/fieldset/legend.mjs +2 -2
- package/build-module/form/primitives/fieldset/legend.mjs.map +1 -1
- package/build-module/form/primitives/fieldset/root.mjs +2 -2
- package/build-module/form/primitives/fieldset/root.mjs.map +1 -1
- package/build-module/form/primitives/input/input.mjs +6 -6
- package/build-module/form/primitives/input/input.mjs.map +2 -2
- package/build-module/form/primitives/input-layout/input-layout.mjs +4 -4
- package/build-module/form/primitives/input-layout/input-layout.mjs.map +1 -1
- package/build-module/form/primitives/input-layout/slot.mjs +5 -4
- package/build-module/form/primitives/input-layout/slot.mjs.map +2 -2
- package/build-module/form/primitives/select/item.mjs +5 -5
- package/build-module/form/primitives/select/item.mjs.map +2 -2
- package/build-module/form/primitives/select/popup.mjs +7 -7
- package/build-module/form/primitives/select/popup.mjs.map +2 -2
- package/build-module/form/primitives/select/trigger.mjs +7 -7
- package/build-module/form/primitives/select/trigger.mjs.map +2 -2
- package/build-module/form/primitives/textarea/textarea.mjs +3 -3
- package/build-module/form/primitives/textarea/textarea.mjs.map +2 -2
- package/build-module/form/types.mjs +1 -0
- package/build-module/form/types.mjs.map +7 -0
- package/build-module/icon-button/icon-button.mjs +2 -2
- package/build-module/icon-button/icon-button.mjs.map +1 -1
- package/build-module/index.mjs +7 -1
- package/build-module/index.mjs.map +2 -2
- package/build-module/link/link.mjs +8 -8
- package/build-module/link/link.mjs.map +2 -2
- package/build-module/notice/action-button.mjs +2 -2
- package/build-module/notice/action-button.mjs.map +1 -1
- package/build-module/notice/action-link.mjs +2 -2
- package/build-module/notice/action-link.mjs.map +1 -1
- package/build-module/notice/actions.mjs +2 -2
- package/build-module/notice/actions.mjs.map +1 -1
- package/build-module/notice/close-icon.mjs +2 -2
- package/build-module/notice/close-icon.mjs.map +1 -1
- package/build-module/notice/description.mjs +2 -2
- package/build-module/notice/description.mjs.map +1 -1
- package/build-module/notice/index.mjs.map +1 -1
- package/build-module/notice/root.mjs +4 -4
- package/build-module/notice/root.mjs.map +1 -1
- package/build-module/notice/title.mjs +2 -2
- package/build-module/notice/title.mjs.map +1 -1
- package/build-module/stack/stack.mjs +2 -2
- package/build-module/stack/stack.mjs.map +1 -1
- package/build-module/tabs/context.mjs +101 -0
- package/build-module/tabs/context.mjs.map +7 -0
- package/build-module/tabs/list.mjs +3 -3
- package/build-module/tabs/list.mjs.map +2 -2
- package/build-module/tabs/panel.mjs +5 -3
- package/build-module/tabs/panel.mjs.map +2 -2
- package/build-module/tabs/root.mjs +2 -1
- package/build-module/tabs/root.mjs.map +2 -2
- package/build-module/tabs/tab.mjs +5 -3
- package/build-module/tabs/tab.mjs.map +2 -2
- package/build-module/text/text.mjs +2 -2
- package/build-module/text/text.mjs.map +1 -1
- package/build-module/tooltip/popup.mjs +4 -4
- package/build-module/tooltip/popup.mjs.map +1 -1
- package/build-module/tooltip/root.mjs.map +2 -2
- package/build-module/utils/use-deprioritized-initial-focus.mjs +39 -0
- package/build-module/utils/use-deprioritized-initial-focus.mjs.map +7 -0
- package/build-module/visually-hidden/visually-hidden.mjs +2 -2
- package/build-module/visually-hidden/visually-hidden.mjs.map +1 -1
- package/build-types/alert-dialog/context.d.ts +8 -0
- package/build-types/alert-dialog/context.d.ts.map +1 -0
- package/build-types/alert-dialog/index.d.ts +4 -0
- package/build-types/alert-dialog/index.d.ts.map +1 -0
- package/build-types/alert-dialog/popup.d.ts +4 -0
- package/build-types/alert-dialog/popup.d.ts.map +1 -0
- package/build-types/alert-dialog/root.d.ts +24 -0
- package/build-types/alert-dialog/root.d.ts.map +1 -0
- package/build-types/alert-dialog/stories/index.story.d.ts +44 -0
- package/build-types/alert-dialog/stories/index.story.d.ts.map +1 -0
- package/build-types/alert-dialog/test/index.test.d.ts +2 -0
- package/build-types/alert-dialog/test/index.test.d.ts.map +1 -0
- package/build-types/alert-dialog/trigger.d.ts +6 -0
- package/build-types/alert-dialog/trigger.d.ts.map +1 -0
- package/build-types/alert-dialog/types.d.ts +70 -0
- package/build-types/alert-dialog/types.d.ts.map +1 -0
- package/build-types/card/title.d.ts.map +1 -1
- package/build-types/collapsible/index.d.ts +5 -0
- package/build-types/collapsible/index.d.ts.map +1 -0
- package/build-types/collapsible/panel.d.ts +16 -0
- package/build-types/collapsible/panel.d.ts.map +1 -0
- package/build-types/collapsible/root.d.ts +15 -0
- package/build-types/collapsible/root.d.ts.map +1 -0
- package/build-types/collapsible/stories/index.story.d.ts +18 -0
- package/build-types/collapsible/stories/index.story.d.ts.map +1 -0
- package/build-types/collapsible/test/index.test.d.ts +2 -0
- package/build-types/collapsible/test/index.test.d.ts.map +1 -0
- package/build-types/collapsible/trigger.d.ts +15 -0
- package/build-types/collapsible/trigger.d.ts.map +1 -0
- package/build-types/collapsible/types.d.ts +22 -0
- package/build-types/collapsible/types.d.ts.map +1 -0
- package/build-types/collapsible-card/content.d.ts.map +1 -1
- package/build-types/collapsible-card/context.d.ts +4 -0
- package/build-types/collapsible-card/context.d.ts.map +1 -0
- package/build-types/collapsible-card/header-description.d.ts +15 -0
- package/build-types/collapsible-card/header-description.d.ts.map +1 -0
- package/build-types/collapsible-card/header.d.ts.map +1 -1
- package/build-types/collapsible-card/index.d.ts +2 -1
- package/build-types/collapsible-card/index.d.ts.map +1 -1
- package/build-types/collapsible-card/stories/index.story.d.ts +10 -0
- package/build-types/collapsible-card/stories/index.story.d.ts.map +1 -1
- package/build-types/collapsible-card/types.d.ts +21 -0
- package/build-types/collapsible-card/types.d.ts.map +1 -1
- package/build-types/dialog/action.d.ts.map +1 -1
- package/build-types/dialog/close-icon.d.ts.map +1 -1
- package/build-types/dialog/popup.d.ts.map +1 -1
- package/build-types/dialog/stories/index.story.d.ts +0 -6
- package/build-types/dialog/stories/index.story.d.ts.map +1 -1
- package/build-types/dialog/types.d.ts +5 -5
- package/build-types/dialog/types.d.ts.map +1 -1
- package/build-types/empty-state/actions.d.ts +7 -0
- package/build-types/empty-state/actions.d.ts.map +1 -0
- package/build-types/empty-state/description.d.ts +7 -0
- package/build-types/empty-state/description.d.ts.map +1 -0
- package/build-types/empty-state/icon.d.ts +7 -0
- package/build-types/empty-state/icon.d.ts.map +1 -0
- package/build-types/empty-state/index.d.ts +8 -0
- package/build-types/empty-state/index.d.ts.map +1 -0
- package/build-types/empty-state/root.d.ts +6 -0
- package/build-types/empty-state/root.d.ts.map +1 -0
- package/build-types/empty-state/stories/index.story.d.ts +8 -0
- package/build-types/empty-state/stories/index.story.d.ts.map +1 -0
- package/build-types/empty-state/test/actions.test.d.ts +2 -0
- package/build-types/empty-state/test/actions.test.d.ts.map +1 -0
- package/build-types/empty-state/test/description.test.d.ts +2 -0
- package/build-types/empty-state/test/description.test.d.ts.map +1 -0
- package/build-types/empty-state/test/icon.test.d.ts +2 -0
- package/build-types/empty-state/test/icon.test.d.ts.map +1 -0
- package/build-types/empty-state/test/root.test.d.ts +2 -0
- package/build-types/empty-state/test/root.test.d.ts.map +1 -0
- package/build-types/empty-state/test/title.test.d.ts +2 -0
- package/build-types/empty-state/test/title.test.d.ts.map +1 -0
- package/build-types/empty-state/test/visual.test.d.ts +2 -0
- package/build-types/empty-state/test/visual.test.d.ts.map +1 -0
- package/build-types/empty-state/title.d.ts +6 -0
- package/build-types/empty-state/title.d.ts.map +1 -0
- package/build-types/empty-state/types.d.ts +40 -0
- package/build-types/empty-state/types.d.ts.map +1 -0
- package/build-types/empty-state/visual.d.ts +7 -0
- package/build-types/empty-state/visual.d.ts.map +1 -0
- package/build-types/form/index.d.ts +3 -0
- package/build-types/form/index.d.ts.map +1 -0
- package/build-types/form/input-control/index.d.ts +2 -0
- package/build-types/form/input-control/index.d.ts.map +1 -0
- package/build-types/form/input-control/input-control.d.ts +6 -0
- package/build-types/form/input-control/input-control.d.ts.map +1 -0
- package/build-types/form/input-control/stories/index.story.d.ts +16 -0
- package/build-types/form/input-control/stories/index.story.d.ts.map +1 -0
- package/build-types/form/input-control/test/index.test.d.ts +2 -0
- package/build-types/form/input-control/test/index.test.d.ts.map +1 -0
- package/build-types/form/input-control/types.d.ts +4 -0
- package/build-types/form/input-control/types.d.ts.map +1 -0
- package/build-types/form/primitives/field/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/fieldset/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/input/stories/index.story.d.ts +2 -0
- package/build-types/form/primitives/input/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/input-layout/slot.d.ts.map +1 -1
- package/build-types/form/primitives/input-layout/stories/index.story.d.ts +5 -0
- package/build-types/form/primitives/input-layout/stories/index.story.d.ts.map +1 -1
- package/build-types/form/stories/shared.d.ts +3 -0
- package/build-types/form/stories/shared.d.ts.map +1 -0
- package/build-types/form/types.d.ts +30 -0
- package/build-types/form/types.d.ts.map +1 -0
- package/build-types/index.d.ts +4 -1
- package/build-types/index.d.ts.map +1 -1
- package/build-types/notice/index.d.ts +0 -1
- package/build-types/notice/index.d.ts.map +1 -1
- package/build-types/tabs/context.d.ts +26 -0
- package/build-types/tabs/context.d.ts.map +1 -0
- package/build-types/tabs/panel.d.ts.map +1 -1
- package/build-types/tabs/root.d.ts.map +1 -1
- package/build-types/tabs/tab.d.ts.map +1 -1
- package/build-types/tooltip/root.d.ts +12 -0
- package/build-types/tooltip/root.d.ts.map +1 -1
- package/build-types/tooltip/stories/index.story.d.ts.map +1 -1
- package/build-types/utils/test/use-deprioritized-initial-focus.test.d.ts +2 -0
- package/build-types/utils/test/use-deprioritized-initial-focus.test.d.ts.map +1 -0
- package/build-types/utils/use-deprioritized-initial-focus.d.ts +35 -0
- package/build-types/utils/use-deprioritized-initial-focus.d.ts.map +1 -0
- package/package.json +17 -16
- package/src/alert-dialog/context.tsx +14 -0
- package/src/alert-dialog/index.ts +3 -0
- package/src/alert-dialog/popup.tsx +58 -0
- package/src/alert-dialog/root.tsx +48 -0
- package/src/alert-dialog/stories/index.story.tsx +254 -0
- package/src/alert-dialog/style.module.css +10 -0
- package/src/alert-dialog/test/index.test.tsx +537 -0
- package/src/alert-dialog/trigger.tsx +15 -0
- package/src/alert-dialog/types.ts +83 -0
- package/src/badge/style.module.css +5 -2
- package/src/button/style.module.css +2 -0
- package/src/card/stories/index.story.tsx +1 -1
- package/src/card/style.module.css +5 -7
- package/src/card/title.tsx +12 -11
- package/src/collapsible/index.ts +5 -0
- package/src/collapsible/panel.tsx +16 -0
- package/src/collapsible/root.tsx +15 -0
- package/src/collapsible/stories/index.story.tsx +108 -0
- package/src/collapsible/test/index.test.tsx +228 -0
- package/src/collapsible/trigger.tsx +15 -0
- package/src/collapsible/types.ts +24 -0
- package/src/collapsible-card/content.tsx +17 -4
- package/src/collapsible-card/context.ts +7 -0
- package/src/collapsible-card/header-description.tsx +43 -0
- package/src/collapsible-card/header.tsx +50 -45
- package/src/collapsible-card/index.ts +2 -1
- package/src/collapsible-card/root.tsx +1 -1
- package/src/collapsible-card/stories/index.story.tsx +99 -1
- package/src/collapsible-card/style.module.css +49 -4
- package/src/collapsible-card/test/index.test.tsx +107 -40
- package/src/collapsible-card/types.ts +22 -0
- package/src/dialog/action.tsx +8 -2
- package/src/dialog/close-icon.tsx +1 -0
- package/src/dialog/popup.tsx +21 -2
- package/src/dialog/stories/index.story.tsx +0 -28
- package/src/dialog/style.module.css +5 -5
- package/src/dialog/test/index.test.tsx +117 -0
- package/src/dialog/types.ts +11 -5
- package/src/empty-state/actions.tsx +24 -0
- package/src/empty-state/description.tsx +27 -0
- package/src/empty-state/icon.tsx +24 -0
- package/src/empty-state/index.ts +8 -0
- package/src/empty-state/root.tsx +23 -0
- package/src/empty-state/stories/index.story.tsx +64 -0
- package/src/empty-state/style.module.css +53 -0
- package/src/empty-state/test/actions.test.tsx +18 -0
- package/src/empty-state/test/description.test.tsx +13 -0
- package/src/empty-state/test/icon.test.tsx +13 -0
- package/src/empty-state/test/root.test.tsx +13 -0
- package/src/empty-state/test/title.test.tsx +13 -0
- package/src/empty-state/test/visual.test.tsx +17 -0
- package/src/empty-state/title.tsx +23 -0
- package/src/empty-state/types.ts +45 -0
- package/src/empty-state/visual.tsx +24 -0
- package/src/form/index.ts +3 -0
- package/src/form/input-control/index.ts +1 -0
- package/src/form/input-control/input-control.tsx +33 -0
- package/src/form/input-control/stories/index.story.tsx +163 -0
- package/src/form/input-control/test/index.test.tsx +53 -0
- package/src/form/input-control/types.ts +5 -0
- package/src/form/primitives/field/root.tsx +2 -2
- package/src/form/primitives/field/stories/index.story.tsx +2 -7
- package/src/form/primitives/fieldset/stories/index.story.tsx +2 -7
- package/src/form/primitives/input/stories/index.story.tsx +7 -0
- package/src/form/primitives/input-layout/slot.tsx +6 -2
- package/src/form/primitives/input-layout/stories/index.story.tsx +22 -1
- package/src/form/primitives/stories/overview.mdx +15 -0
- package/src/form/primitives/textarea/textarea.tsx +1 -1
- package/src/form/stories/shared.tsx +19 -0
- package/src/form/types.ts +34 -0
- package/src/index.ts +4 -1
- package/src/notice/index.ts +0 -2
- package/src/notice/style.module.css +1 -1
- package/src/tabs/context.tsx +170 -0
- package/src/tabs/panel.tsx +3 -0
- package/src/tabs/root.tsx +6 -1
- package/src/tabs/style.module.css +1 -1
- package/src/tabs/tab.tsx +3 -0
- package/src/tabs/test/index.test.tsx +162 -0
- package/src/tooltip/root.tsx +12 -0
- package/src/tooltip/stories/index.story.tsx +20 -15
- package/src/utils/css/focus.module.css +4 -2
- package/src/utils/css/item-popup.module.css +1 -0
- package/src/utils/css/select-trigger.module.css +1 -0
- package/src/utils/test/use-deprioritized-initial-focus.test.tsx +230 -0
- package/src/utils/use-deprioritized-initial-focus.ts +83 -0
- package/AGENTS.md +0 -9
- package/CLAUDE.md +0 -1
package/build/tabs/list.cjs
CHANGED
|
@@ -39,10 +39,10 @@ var import_tabs = require("@base-ui/react/tabs");
|
|
|
39
39
|
var import_compose = require("@wordpress/compose");
|
|
40
40
|
|
|
41
41
|
// packages/ui/src/tabs/style.module.css
|
|
42
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
42
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='abbf48f53e']")) {
|
|
43
43
|
const style = document.createElement("style");
|
|
44
|
-
style.setAttribute("data-wp-hash", "
|
|
45
|
-
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong,#6c6c6c);bottom:0;height:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px));left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active,#eaeaea);border-radius:var(--wpds-border-radius-sm,2px);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\n &[data-orientation=vertical]{border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);cursor:pointer;display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wpds-font-size-md,13px);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled,#8a8a8a);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e)}&:after{border-radius:var(--wpds-border-radius-sm,2px);opacity:0;outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg,16px);scroll-margin:24px;&:after{content:"";inset:var(--wpds-dimension-padding-md,12px)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm,8px) var(--wpds-dimension-padding-md,12px)}[data-orientation=vertical][data-select-on-move=false] &:after{content:"";inset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs, 4px)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\n [role=tab]:is([aria-selected=true])\n &{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline:2px solid #0000;outline-offset:0}}}'));
|
|
44
|
+
style.setAttribute("data-wp-hash", "abbf48f53e");
|
|
45
|
+
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong,#6c6c6c);bottom:0;height:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px));left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active,#eaeaea);border-radius:var(--wpds-border-radius-sm,2px);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\n &[data-orientation=vertical]{border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);cursor:var(--wpds-cursor-control,pointer);display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wpds-font-size-md,13px);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled,#8a8a8a);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e)}&:after{border-radius:var(--wpds-border-radius-sm,2px);opacity:0;outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg,16px);scroll-margin:24px;&:after{content:"";inset:var(--wpds-dimension-padding-md,12px)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm,8px) var(--wpds-dimension-padding-md,12px)}[data-orientation=vertical][data-select-on-move=false] &:after{content:"";inset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs, 4px)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\n [role=tab]:is([aria-selected=true])\n &{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline:2px solid #0000;outline-offset:0}}}'));
|
|
46
46
|
document.head.appendChild(style);
|
|
47
47
|
}
|
|
48
48
|
var style_default = { "tablist": "_7313adbc8a112e90__tablist", "is-overflowing-first": "_9f2ac729c68a735a__is-overflowing-first", "is-overflowing-last": "_81c799c1f3cdd261__is-overflowing-last", "is-minimal-variant": "_59228b5227f38a99__is-minimal-variant", "indicator": "_1c37dcfaa1ad8cda__indicator", "tab": "a5fd8814f195aa5e__tab", "tab-children": "_5dfc77e6edd345d4__tab-children", "tab-chevron": "_4a20e969d15e5ac1__tab-chevron", "tabpanel": "_49f4bf715948892a__tabpanel" };
|
package/build/tabs/list.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/tabs/list.tsx", "../../src/tabs/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import { forwardRef, useEffect, useState } from '@wordpress/element';\nimport clsx from 'clsx';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport { useMergeRefs } from '@wordpress/compose';\nimport styles from './style.module.css';\nimport type { TabListProps } from './types';\n\n// Account for sub-pixel rounding errors.\nconst SCROLL_EPSILON = 1;\n\n/**\n * Groups the individual tab buttons.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const List = forwardRef< HTMLDivElement, TabListProps >(\n\tfunction TabList(\n\t\t{\n\t\t\tchildren,\n\t\t\tvariant = 'default',\n\t\t\tclassName,\n\t\t\tactivateOnFocus,\n\t\t\trender,\n\t\t\t...otherProps\n\t\t},\n\t\tforwardedRef\n\t) {\n\t\tconst [ listEl, setListEl ] = useState< HTMLDivElement | null >( null );\n\t\tconst [ overflow, setOverflow ] = useState< {\n\t\t\tfirst: boolean;\n\t\t\tlast: boolean;\n\t\t\tisScrolling: boolean;\n\t\t} >( {\n\t\t\tfirst: false,\n\t\t\tlast: false,\n\t\t\tisScrolling: false,\n\t\t} );\n\n\t\t// Check if list is overflowing when it scrolls or resizes.\n\t\tuseEffect( () => {\n\t\t\tif ( ! listEl ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst measureOverflow = () => {\n\t\t\t\tconst { scrollWidth, clientWidth, scrollLeft } = listEl;\n\t\t\t\tconst maxScroll = Math.max( scrollWidth - clientWidth, 0 );\n\t\t\t\tconst direction =\n\t\t\t\t\tlistEl.dir ||\n\t\t\t\t\t( typeof window !== 'undefined'\n\t\t\t\t\t\t? window.getComputedStyle( listEl ).direction\n\t\t\t\t\t\t: 'ltr' );\n\n\t\t\t\tconst scrollFromStart =\n\t\t\t\t\tdirection === 'rtl' && scrollLeft < 0\n\t\t\t\t\t\t? // In RTL layouts, scrollLeft is typically 0 at the visual \"start\"\n\t\t\t\t\t\t // (right edge) and becomes negative toward the \"end\" (left edge).\n\t\t\t\t\t\t // Normalize value for correct first/last detection logic.\n\t\t\t\t\t\t -scrollLeft\n\t\t\t\t\t\t: scrollLeft;\n\n\t\t\t\t// Use SCROLL_EPSILON to handle subpixel rendering differences.\n\t\t\t\tsetOverflow( {\n\t\t\t\t\tfirst: scrollFromStart > SCROLL_EPSILON,\n\t\t\t\t\tlast: scrollFromStart < maxScroll - SCROLL_EPSILON,\n\t\t\t\t\tisScrolling: scrollWidth > clientWidth,\n\t\t\t\t} );\n\t\t\t};\n\n\t\t\tconst resizeObserver = new ResizeObserver( measureOverflow );\n\t\t\tresizeObserver.observe( listEl );\n\n\t\t\tlet scrollTick = false;\n\t\t\tconst throttleMeasureOverflowOnScroll = () => {\n\t\t\t\tif ( ! scrollTick ) {\n\t\t\t\t\trequestAnimationFrame( () => {\n\t\t\t\t\t\tmeasureOverflow();\n\t\t\t\t\t\tscrollTick = false;\n\t\t\t\t\t} );\n\t\t\t\t\tscrollTick = true;\n\t\t\t\t}\n\t\t\t};\n\t\t\tlistEl.addEventListener(\n\t\t\t\t'scroll',\n\t\t\t\tthrottleMeasureOverflowOnScroll,\n\t\t\t\t{ passive: true }\n\t\t\t);\n\n\t\t\t// Initial check.\n\t\t\tmeasureOverflow();\n\n\t\t\treturn () => {\n\t\t\t\tlistEl.removeEventListener(\n\t\t\t\t\t'scroll',\n\t\t\t\t\tthrottleMeasureOverflowOnScroll\n\t\t\t\t);\n\t\t\t\tresizeObserver.disconnect();\n\t\t\t};\n\t\t}, [ listEl ] );\n\n\t\tconst mergedListRef = useMergeRefs( [\n\t\t\tforwardedRef,\n\t\t\t( el: HTMLDivElement | null ) => setListEl( el ),\n\t\t] );\n\n\t\treturn (\n\t\t\t<_Tabs.List\n\t\t\t\tref={ mergedListRef }\n\t\t\t\tactivateOnFocus={ activateOnFocus }\n\t\t\t\tdata-select-on-move={ activateOnFocus ? 'true' : 'false' }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tstyles.tablist,\n\t\t\t\t\toverflow.first && styles[ 'is-overflowing-first' ],\n\t\t\t\t\toverflow.last && styles[ 'is-overflowing-last' ],\n\t\t\t\t\tstyles[ `is-${ variant }-variant` ],\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t\t{ ...otherProps }\n\t\t\t\ttabIndex={\n\t\t\t\t\totherProps.tabIndex ??\n\t\t\t\t\t( overflow.isScrolling ? -1 : undefined )\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t\t<_Tabs.Indicator className={ styles.indicator } />\n\t\t\t</_Tabs.List>\n\t\t);\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAAgD;AAChD,kBAAiB;AACjB,kBAA8B;AAC9B,qBAA6B;;;ACH7B,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,
|
|
4
|
+
"sourcesContent": ["import { forwardRef, useEffect, useState } from '@wordpress/element';\nimport clsx from 'clsx';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport { useMergeRefs } from '@wordpress/compose';\nimport styles from './style.module.css';\nimport type { TabListProps } from './types';\n\n// Account for sub-pixel rounding errors.\nconst SCROLL_EPSILON = 1;\n\n/**\n * Groups the individual tab buttons.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const List = forwardRef< HTMLDivElement, TabListProps >(\n\tfunction TabList(\n\t\t{\n\t\t\tchildren,\n\t\t\tvariant = 'default',\n\t\t\tclassName,\n\t\t\tactivateOnFocus,\n\t\t\trender,\n\t\t\t...otherProps\n\t\t},\n\t\tforwardedRef\n\t) {\n\t\tconst [ listEl, setListEl ] = useState< HTMLDivElement | null >( null );\n\t\tconst [ overflow, setOverflow ] = useState< {\n\t\t\tfirst: boolean;\n\t\t\tlast: boolean;\n\t\t\tisScrolling: boolean;\n\t\t} >( {\n\t\t\tfirst: false,\n\t\t\tlast: false,\n\t\t\tisScrolling: false,\n\t\t} );\n\n\t\t// Check if list is overflowing when it scrolls or resizes.\n\t\tuseEffect( () => {\n\t\t\tif ( ! listEl ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst measureOverflow = () => {\n\t\t\t\tconst { scrollWidth, clientWidth, scrollLeft } = listEl;\n\t\t\t\tconst maxScroll = Math.max( scrollWidth - clientWidth, 0 );\n\t\t\t\tconst direction =\n\t\t\t\t\tlistEl.dir ||\n\t\t\t\t\t( typeof window !== 'undefined'\n\t\t\t\t\t\t? window.getComputedStyle( listEl ).direction\n\t\t\t\t\t\t: 'ltr' );\n\n\t\t\t\tconst scrollFromStart =\n\t\t\t\t\tdirection === 'rtl' && scrollLeft < 0\n\t\t\t\t\t\t? // In RTL layouts, scrollLeft is typically 0 at the visual \"start\"\n\t\t\t\t\t\t // (right edge) and becomes negative toward the \"end\" (left edge).\n\t\t\t\t\t\t // Normalize value for correct first/last detection logic.\n\t\t\t\t\t\t -scrollLeft\n\t\t\t\t\t\t: scrollLeft;\n\n\t\t\t\t// Use SCROLL_EPSILON to handle subpixel rendering differences.\n\t\t\t\tsetOverflow( {\n\t\t\t\t\tfirst: scrollFromStart > SCROLL_EPSILON,\n\t\t\t\t\tlast: scrollFromStart < maxScroll - SCROLL_EPSILON,\n\t\t\t\t\tisScrolling: scrollWidth > clientWidth,\n\t\t\t\t} );\n\t\t\t};\n\n\t\t\tconst resizeObserver = new ResizeObserver( measureOverflow );\n\t\t\tresizeObserver.observe( listEl );\n\n\t\t\tlet scrollTick = false;\n\t\t\tconst throttleMeasureOverflowOnScroll = () => {\n\t\t\t\tif ( ! scrollTick ) {\n\t\t\t\t\trequestAnimationFrame( () => {\n\t\t\t\t\t\tmeasureOverflow();\n\t\t\t\t\t\tscrollTick = false;\n\t\t\t\t\t} );\n\t\t\t\t\tscrollTick = true;\n\t\t\t\t}\n\t\t\t};\n\t\t\tlistEl.addEventListener(\n\t\t\t\t'scroll',\n\t\t\t\tthrottleMeasureOverflowOnScroll,\n\t\t\t\t{ passive: true }\n\t\t\t);\n\n\t\t\t// Initial check.\n\t\t\tmeasureOverflow();\n\n\t\t\treturn () => {\n\t\t\t\tlistEl.removeEventListener(\n\t\t\t\t\t'scroll',\n\t\t\t\t\tthrottleMeasureOverflowOnScroll\n\t\t\t\t);\n\t\t\t\tresizeObserver.disconnect();\n\t\t\t};\n\t\t}, [ listEl ] );\n\n\t\tconst mergedListRef = useMergeRefs( [\n\t\t\tforwardedRef,\n\t\t\t( el: HTMLDivElement | null ) => setListEl( el ),\n\t\t] );\n\n\t\treturn (\n\t\t\t<_Tabs.List\n\t\t\t\tref={ mergedListRef }\n\t\t\t\tactivateOnFocus={ activateOnFocus }\n\t\t\t\tdata-select-on-move={ activateOnFocus ? 'true' : 'false' }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tstyles.tablist,\n\t\t\t\t\toverflow.first && styles[ 'is-overflowing-first' ],\n\t\t\t\t\toverflow.last && styles[ 'is-overflowing-last' ],\n\t\t\t\t\tstyles[ `is-${ variant }-variant` ],\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t\t{ ...otherProps }\n\t\t\t\ttabIndex={\n\t\t\t\t\totherProps.tabIndex ??\n\t\t\t\t\t( overflow.isScrolling ? -1 : undefined )\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t\t<_Tabs.Indicator className={ styles.indicator } />\n\t\t\t</_Tabs.List>\n\t\t);\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='abbf48f53e']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"abbf48f53e\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong,#6c6c6c);bottom:0;height:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px));left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active,#eaeaea);border-radius:var(--wpds-border-radius-sm,2px);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\\n\\t\\t&[data-orientation=vertical]{border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);cursor:var(--wpds-cursor-control,pointer);display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);font-size:var(--wpds-font-size-md,13px);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled,#8a8a8a);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e)}&:after{border-radius:var(--wpds-border-radius-sm,2px);opacity:0;outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg,16px);scroll-margin:24px;&:after{content:\\\"\\\";inset:var(--wpds-dimension-padding-md,12px)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm,8px) var(--wpds-dimension-padding-md,12px)}[data-orientation=vertical][data-select-on-move=false] &:after{content:\\\"\\\";inset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs, 4px)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\\n\\t\\t\\t[role=tab]:is([aria-selected=true])\\n\\t\\t\\t&{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline:2px solid #0000;outline-offset:0}}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"tablist\":\"_7313adbc8a112e90__tablist\",\"is-overflowing-first\":\"_9f2ac729c68a735a__is-overflowing-first\",\"is-overflowing-last\":\"_81c799c1f3cdd261__is-overflowing-last\",\"is-minimal-variant\":\"_59228b5227f38a99__is-minimal-variant\",\"indicator\":\"_1c37dcfaa1ad8cda__indicator\",\"tab\":\"a5fd8814f195aa5e__tab\",\"tab-children\":\"_5dfc77e6edd345d4__tab-children\",\"tab-chevron\":\"_4a20e969d15e5ac1__tab-chevron\",\"tabpanel\":\"_49f4bf715948892a__tabpanel\"};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAAgD;AAChD,kBAAiB;AACjB,kBAA8B;AAC9B,qBAA6B;;;ACH7B,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,ixJAAyyJ,CAAC;AACp1J,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,WAAU,8BAA6B,wBAAuB,2CAA0C,uBAAsB,0CAAyC,sBAAqB,yCAAwC,aAAY,gCAA+B,OAAM,yBAAwB,gBAAe,mCAAkC,eAAc,kCAAiC,YAAW,8BAA6B;;;ADqGlc;AAnGH,IAAM,iBAAiB;AAQhB,IAAM,WAAO;AAAA,EACnB,SAAS,QACR;AAAA,IACC;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACJ,GACA,cACC;AACD,UAAM,CAAE,QAAQ,SAAU,QAAI,yBAAmC,IAAK;AACtE,UAAM,CAAE,UAAU,WAAY,QAAI,yBAI7B;AAAA,MACJ,OAAO;AAAA,MACP,MAAM;AAAA,MACN,aAAa;AAAA,IACd,CAAE;AAGF,kCAAW,MAAM;AAChB,UAAK,CAAE,QAAS;AACf;AAAA,MACD;AAEA,YAAM,kBAAkB,MAAM;AAC7B,cAAM,EAAE,aAAa,aAAa,WAAW,IAAI;AACjD,cAAM,YAAY,KAAK,IAAK,cAAc,aAAa,CAAE;AACzD,cAAM,YACL,OAAO,QACL,OAAO,WAAW,cACjB,OAAO,iBAAkB,MAAO,EAAE,YAClC;AAEJ,cAAM,kBACL,cAAc,SAAS,aAAa;AAAA;AAAA;AAAA;AAAA,UAIjC,CAAC;AAAA,YACD;AAGJ,oBAAa;AAAA,UACZ,OAAO,kBAAkB;AAAA,UACzB,MAAM,kBAAkB,YAAY;AAAA,UACpC,aAAa,cAAc;AAAA,QAC5B,CAAE;AAAA,MACH;AAEA,YAAM,iBAAiB,IAAI,eAAgB,eAAgB;AAC3D,qBAAe,QAAS,MAAO;AAE/B,UAAI,aAAa;AACjB,YAAM,kCAAkC,MAAM;AAC7C,YAAK,CAAE,YAAa;AACnB,gCAAuB,MAAM;AAC5B,4BAAgB;AAChB,yBAAa;AAAA,UACd,CAAE;AACF,uBAAa;AAAA,QACd;AAAA,MACD;AACA,aAAO;AAAA,QACN;AAAA,QACA;AAAA,QACA,EAAE,SAAS,KAAK;AAAA,MACjB;AAGA,sBAAgB;AAEhB,aAAO,MAAM;AACZ,eAAO;AAAA,UACN;AAAA,UACA;AAAA,QACD;AACA,uBAAe,WAAW;AAAA,MAC3B;AAAA,IACD,GAAG,CAAE,MAAO,CAAE;AAEd,UAAM,oBAAgB,6BAAc;AAAA,MACnC;AAAA,MACA,CAAE,OAA+B,UAAW,EAAG;AAAA,IAChD,CAAE;AAEF,WACC;AAAA,MAAC,YAAAA,KAAM;AAAA,MAAN;AAAA,QACA,KAAM;AAAA,QACN;AAAA,QACA,uBAAsB,kBAAkB,SAAS;AAAA,QACjD,eAAY,YAAAC;AAAA,UACX,cAAO;AAAA,UACP,SAAS,SAAS,cAAQ,sBAAuB;AAAA,UACjD,SAAS,QAAQ,cAAQ,qBAAsB;AAAA,UAC/C,cAAQ,MAAO,OAAQ,UAAW;AAAA,UAClC;AAAA,QACD;AAAA,QACE,GAAG;AAAA,QACL,UACC,WAAW,aACT,SAAS,cAAc,KAAK;AAAA,QAG7B;AAAA;AAAA,UACF,4CAAC,YAAAD,KAAM,WAAN,EAAgB,WAAY,cAAO,WAAY;AAAA;AAAA;AAAA,IACjD;AAAA,EAEF;AACD;",
|
|
6
6
|
"names": ["_Tabs", "clsx"]
|
|
7
7
|
}
|
package/build/tabs/panel.cjs
CHANGED
|
@@ -36,12 +36,13 @@ module.exports = __toCommonJS(panel_exports);
|
|
|
36
36
|
var import_element = require("@wordpress/element");
|
|
37
37
|
var import_clsx = __toESM(require("clsx"));
|
|
38
38
|
var import_tabs = require("@base-ui/react/tabs");
|
|
39
|
+
var import_context = require("./context.cjs");
|
|
39
40
|
|
|
40
41
|
// packages/ui/src/tabs/style.module.css
|
|
41
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
42
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='abbf48f53e']")) {
|
|
42
43
|
const style = document.createElement("style");
|
|
43
|
-
style.setAttribute("data-wp-hash", "
|
|
44
|
-
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong,#6c6c6c);bottom:0;height:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px));left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active,#eaeaea);border-radius:var(--wpds-border-radius-sm,2px);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\n &[data-orientation=vertical]{border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);cursor:pointer;display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wpds-font-size-md,13px);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled,#8a8a8a);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e)}&:after{border-radius:var(--wpds-border-radius-sm,2px);opacity:0;outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg,16px);scroll-margin:24px;&:after{content:"";inset:var(--wpds-dimension-padding-md,12px)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm,8px) var(--wpds-dimension-padding-md,12px)}[data-orientation=vertical][data-select-on-move=false] &:after{content:"";inset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs, 4px)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\n [role=tab]:is([aria-selected=true])\n &{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline:2px solid #0000;outline-offset:0}}}'));
|
|
44
|
+
style.setAttribute("data-wp-hash", "abbf48f53e");
|
|
45
|
+
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong,#6c6c6c);bottom:0;height:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px));left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active,#eaeaea);border-radius:var(--wpds-border-radius-sm,2px);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\n &[data-orientation=vertical]{border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);cursor:var(--wpds-cursor-control,pointer);display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wpds-font-size-md,13px);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled,#8a8a8a);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e)}&:after{border-radius:var(--wpds-border-radius-sm,2px);opacity:0;outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg,16px);scroll-margin:24px;&:after{content:"";inset:var(--wpds-dimension-padding-md,12px)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm,8px) var(--wpds-dimension-padding-md,12px)}[data-orientation=vertical][data-select-on-move=false] &:after{content:"";inset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs, 4px)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\n [role=tab]:is([aria-selected=true])\n &{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline:2px solid #0000;outline-offset:0}}}'));
|
|
45
46
|
document.head.appendChild(style);
|
|
46
47
|
}
|
|
47
48
|
var style_default = { "tablist": "_7313adbc8a112e90__tablist", "is-overflowing-first": "_9f2ac729c68a735a__is-overflowing-first", "is-overflowing-last": "_81c799c1f3cdd261__is-overflowing-last", "is-minimal-variant": "_59228b5227f38a99__is-minimal-variant", "indicator": "_1c37dcfaa1ad8cda__indicator", "tab": "a5fd8814f195aa5e__tab", "tab-children": "_5dfc77e6edd345d4__tab-children", "tab-chevron": "_4a20e969d15e5ac1__tab-chevron", "tabpanel": "_49f4bf715948892a__tabpanel" };
|
|
@@ -50,6 +51,7 @@ var style_default = { "tablist": "_7313adbc8a112e90__tablist", "is-overflowing-f
|
|
|
50
51
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
51
52
|
var Panel = (0, import_element.forwardRef)(
|
|
52
53
|
function TabPanel({ className, ...otherProps }, forwardedRef) {
|
|
54
|
+
(0, import_context.useRegisterPanel)();
|
|
53
55
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
54
56
|
import_tabs.Tabs.Panel,
|
|
55
57
|
{
|
package/build/tabs/panel.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/tabs/panel.tsx", "../../src/tabs/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import { forwardRef } from '@wordpress/element';\nimport clsx from 'clsx';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport styles from './style.module.css';\nimport type { TabPanelProps } from './types';\n\n/**\n * A panel displayed when the corresponding tab is active.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const Panel = forwardRef< HTMLDivElement, TabPanelProps >(\n\tfunction TabPanel( { className, ...otherProps }, forwardedRef ) {\n\t\treturn (\n\t\t\t<_Tabs.Panel\n\t\t\t\tref={ forwardedRef }\n\t\t\t\tclassName={ clsx( styles.tabpanel, className ) }\n\t\t\t\t{ ...otherProps }\n\t\t\t/>\n\t\t);\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA2B;AAC3B,kBAAiB;AACjB,kBAA8B;;;
|
|
4
|
+
"sourcesContent": ["import { forwardRef } from '@wordpress/element';\nimport clsx from 'clsx';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport { useRegisterPanel } from './context';\nimport styles from './style.module.css';\nimport type { TabPanelProps } from './types';\n\n/**\n * A panel displayed when the corresponding tab is active.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const Panel = forwardRef< HTMLDivElement, TabPanelProps >(\n\tfunction TabPanel( { className, ...otherProps }, forwardedRef ) {\n\t\tuseRegisterPanel();\n\n\t\treturn (\n\t\t\t<_Tabs.Panel\n\t\t\t\tref={ forwardedRef }\n\t\t\t\tclassName={ clsx( styles.tabpanel, className ) }\n\t\t\t\t{ ...otherProps }\n\t\t\t/>\n\t\t);\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='abbf48f53e']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"abbf48f53e\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong,#6c6c6c);bottom:0;height:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px));left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active,#eaeaea);border-radius:var(--wpds-border-radius-sm,2px);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\\n\\t\\t&[data-orientation=vertical]{border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);cursor:var(--wpds-cursor-control,pointer);display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);font-size:var(--wpds-font-size-md,13px);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled,#8a8a8a);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e)}&:after{border-radius:var(--wpds-border-radius-sm,2px);opacity:0;outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg,16px);scroll-margin:24px;&:after{content:\\\"\\\";inset:var(--wpds-dimension-padding-md,12px)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm,8px) var(--wpds-dimension-padding-md,12px)}[data-orientation=vertical][data-select-on-move=false] &:after{content:\\\"\\\";inset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs, 4px)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\\n\\t\\t\\t[role=tab]:is([aria-selected=true])\\n\\t\\t\\t&{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline:2px solid #0000;outline-offset:0}}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"tablist\":\"_7313adbc8a112e90__tablist\",\"is-overflowing-first\":\"_9f2ac729c68a735a__is-overflowing-first\",\"is-overflowing-last\":\"_81c799c1f3cdd261__is-overflowing-last\",\"is-minimal-variant\":\"_59228b5227f38a99__is-minimal-variant\",\"indicator\":\"_1c37dcfaa1ad8cda__indicator\",\"tab\":\"a5fd8814f195aa5e__tab\",\"tab-children\":\"_5dfc77e6edd345d4__tab-children\",\"tab-chevron\":\"_4a20e969d15e5ac1__tab-chevron\",\"tabpanel\":\"_49f4bf715948892a__tabpanel\"};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA2B;AAC3B,kBAAiB;AACjB,kBAA8B;AAC9B,qBAAiC;;;ACHjC,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,ixJAAyyJ,CAAC;AACp1J,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,WAAU,8BAA6B,wBAAuB,2CAA0C,uBAAsB,0CAAyC,sBAAqB,yCAAwC,aAAY,gCAA+B,OAAM,yBAAwB,gBAAe,mCAAkC,eAAc,kCAAiC,YAAW,8BAA6B;;;ADYlc;AALI,IAAM,YAAQ;AAAA,EACpB,SAAS,SAAU,EAAE,WAAW,GAAG,WAAW,GAAG,cAAe;AAC/D,yCAAiB;AAEjB,WACC;AAAA,MAAC,YAAAA,KAAM;AAAA,MAAN;AAAA,QACA,KAAM;AAAA,QACN,eAAY,YAAAC,SAAM,cAAO,UAAU,SAAU;AAAA,QAC3C,GAAG;AAAA;AAAA,IACN;AAAA,EAEF;AACD;",
|
|
6
6
|
"names": ["_Tabs", "clsx"]
|
|
7
7
|
}
|
package/build/tabs/root.cjs
CHANGED
|
@@ -25,10 +25,11 @@ __export(root_exports, {
|
|
|
25
25
|
module.exports = __toCommonJS(root_exports);
|
|
26
26
|
var import_element = require("@wordpress/element");
|
|
27
27
|
var import_tabs = require("@base-ui/react/tabs");
|
|
28
|
+
var import_context = require("./context.cjs");
|
|
28
29
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
29
30
|
var Root = (0, import_element.forwardRef)(
|
|
30
31
|
function TabsRoot({ ...otherProps }, forwardedRef) {
|
|
31
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tabs.Tabs.Root, { ref: forwardedRef, ...otherProps });
|
|
32
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_context.TabsValidationProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tabs.Tabs.Root, { ref: forwardedRef, ...otherProps }) });
|
|
32
33
|
}
|
|
33
34
|
);
|
|
34
35
|
// Annotate the CommonJS export names for ESM import in node:
|
package/build/tabs/root.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/tabs/root.tsx"],
|
|
4
|
-
"sourcesContent": ["import { forwardRef } from '@wordpress/element';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport type { TabRootProps } from './types';\n\n/**\n * Groups the tabs and the corresponding panels.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const Root = forwardRef< HTMLDivElement, TabRootProps >(\n\tfunction TabsRoot( { ...otherProps }, forwardedRef ) {\n\t\treturn <_Tabs.Root ref={ forwardedRef } { ...otherProps }
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA2B;AAC3B,kBAA8B;
|
|
4
|
+
"sourcesContent": ["import { forwardRef } from '@wordpress/element';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport { TabsValidationProvider } from './context';\nimport type { TabRootProps } from './types';\n\n/**\n * Groups the tabs and the corresponding panels.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const Root = forwardRef< HTMLDivElement, TabRootProps >(\n\tfunction TabsRoot( { ...otherProps }, forwardedRef ) {\n\t\treturn (\n\t\t\t<TabsValidationProvider>\n\t\t\t\t<_Tabs.Root ref={ forwardedRef } { ...otherProps } />\n\t\t\t</TabsValidationProvider>\n\t\t);\n\t}\n);\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA2B;AAC3B,kBAA8B;AAC9B,qBAAuC;AAanC;AAJG,IAAM,WAAO;AAAA,EACnB,SAAS,SAAU,EAAE,GAAG,WAAW,GAAG,cAAe;AACpD,WACC,4CAAC,yCACA,sDAAC,YAAAA,KAAM,MAAN,EAAW,KAAM,cAAiB,GAAG,YAAa,GACpD;AAAA,EAEF;AACD;",
|
|
6
6
|
"names": ["_Tabs"]
|
|
7
7
|
}
|
package/build/tabs/tab.cjs
CHANGED
|
@@ -38,12 +38,13 @@ var import_clsx = __toESM(require("clsx"));
|
|
|
38
38
|
var import_tabs = require("@base-ui/react/tabs");
|
|
39
39
|
var import_icons = require("@wordpress/icons");
|
|
40
40
|
var import_icon = require("../icon/index.cjs");
|
|
41
|
+
var import_context = require("./context.cjs");
|
|
41
42
|
|
|
42
43
|
// packages/ui/src/tabs/style.module.css
|
|
43
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
44
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='abbf48f53e']")) {
|
|
44
45
|
const style = document.createElement("style");
|
|
45
|
-
style.setAttribute("data-wp-hash", "
|
|
46
|
-
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong,#6c6c6c);bottom:0;height:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px));left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active,#eaeaea);border-radius:var(--wpds-border-radius-sm,2px);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\n &[data-orientation=vertical]{border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);cursor:pointer;display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wpds-font-size-md,13px);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled,#8a8a8a);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e)}&:after{border-radius:var(--wpds-border-radius-sm,2px);opacity:0;outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg,16px);scroll-margin:24px;&:after{content:"";inset:var(--wpds-dimension-padding-md,12px)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm,8px) var(--wpds-dimension-padding-md,12px)}[data-orientation=vertical][data-select-on-move=false] &:after{content:"";inset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs, 4px)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\n [role=tab]:is([aria-selected=true])\n &{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline:2px solid #0000;outline-offset:0}}}'));
|
|
46
|
+
style.setAttribute("data-wp-hash", "abbf48f53e");
|
|
47
|
+
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong,#6c6c6c);bottom:0;height:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px));left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active,#eaeaea);border-radius:var(--wpds-border-radius-sm,2px);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\n &[data-orientation=vertical]{border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);cursor:var(--wpds-cursor-control,pointer);display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wpds-font-size-md,13px);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled,#8a8a8a);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e)}&:after{border-radius:var(--wpds-border-radius-sm,2px);opacity:0;outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg,16px);scroll-margin:24px;&:after{content:"";inset:var(--wpds-dimension-padding-md,12px)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm,8px) var(--wpds-dimension-padding-md,12px)}[data-orientation=vertical][data-select-on-move=false] &:after{content:"";inset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs, 4px)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\n [role=tab]:is([aria-selected=true])\n &{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline:2px solid #0000;outline-offset:0}}}'));
|
|
47
48
|
document.head.appendChild(style);
|
|
48
49
|
}
|
|
49
50
|
var style_default = { "tablist": "_7313adbc8a112e90__tablist", "is-overflowing-first": "_9f2ac729c68a735a__is-overflowing-first", "is-overflowing-last": "_81c799c1f3cdd261__is-overflowing-last", "is-minimal-variant": "_59228b5227f38a99__is-minimal-variant", "indicator": "_1c37dcfaa1ad8cda__indicator", "tab": "a5fd8814f195aa5e__tab", "tab-children": "_5dfc77e6edd345d4__tab-children", "tab-chevron": "_4a20e969d15e5ac1__tab-chevron", "tabpanel": "_49f4bf715948892a__tabpanel" };
|
|
@@ -51,6 +52,7 @@ var style_default = { "tablist": "_7313adbc8a112e90__tablist", "is-overflowing-f
|
|
|
51
52
|
// packages/ui/src/tabs/tab.tsx
|
|
52
53
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
53
54
|
var Tab = (0, import_element.forwardRef)(function Tab2({ className, children, ...otherProps }, forwardedRef) {
|
|
55
|
+
(0, import_context.useRegisterTab)();
|
|
54
56
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
55
57
|
import_tabs.Tabs.Tab,
|
|
56
58
|
{
|
package/build/tabs/tab.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/tabs/tab.tsx", "../../src/tabs/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import { forwardRef } from '@wordpress/element';\nimport clsx from 'clsx';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport { chevronRight } from '@wordpress/icons';\nimport { Icon } from '../icon';\nimport styles from './style.module.css';\nimport type { TabProps } from './types';\n\n/**\n * An individual interactive tab button that toggles the corresponding panel.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const Tab = forwardRef< HTMLButtonElement, TabProps >( function Tab(\n\t{ className, children, ...otherProps },\n\tforwardedRef\n) {\n\treturn (\n\t\t<_Tabs.Tab\n\t\t\tref={ forwardedRef }\n\t\t\tclassName={ clsx( styles.tab, className ) }\n\t\t\t{ ...otherProps }\n\t\t>\n\t\t\t<span className={ styles[ 'tab-children' ] }>{ children }</span>\n\t\t\t<Icon icon={ chevronRight } className={ styles[ 'tab-chevron' ] } />\n\t\t</_Tabs.Tab>\n\t);\n} );\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA2B;AAC3B,kBAAiB;AACjB,kBAA8B;AAC9B,mBAA6B;AAC7B,kBAAqB;;;
|
|
4
|
+
"sourcesContent": ["import { forwardRef } from '@wordpress/element';\nimport clsx from 'clsx';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport { chevronRight } from '@wordpress/icons';\nimport { Icon } from '../icon';\nimport { useRegisterTab } from './context';\nimport styles from './style.module.css';\nimport type { TabProps } from './types';\n\n/**\n * An individual interactive tab button that toggles the corresponding panel.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const Tab = forwardRef< HTMLButtonElement, TabProps >( function Tab(\n\t{ className, children, ...otherProps },\n\tforwardedRef\n) {\n\tuseRegisterTab();\n\n\treturn (\n\t\t<_Tabs.Tab\n\t\t\tref={ forwardedRef }\n\t\t\tclassName={ clsx( styles.tab, className ) }\n\t\t\t{ ...otherProps }\n\t\t>\n\t\t\t<span className={ styles[ 'tab-children' ] }>{ children }</span>\n\t\t\t<Icon icon={ chevronRight } className={ styles[ 'tab-chevron' ] } />\n\t\t</_Tabs.Tab>\n\t);\n} );\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='abbf48f53e']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"abbf48f53e\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong,#6c6c6c);bottom:0;height:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px));left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active,#eaeaea);border-radius:var(--wpds-border-radius-sm,2px);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\\n\\t\\t&[data-orientation=vertical]{border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);cursor:var(--wpds-cursor-control,pointer);display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);font-size:var(--wpds-font-size-md,13px);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled,#8a8a8a);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e)}&:after{border-radius:var(--wpds-border-radius-sm,2px);opacity:0;outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg,16px);scroll-margin:24px;&:after{content:\\\"\\\";inset:var(--wpds-dimension-padding-md,12px)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm,8px) var(--wpds-dimension-padding-md,12px)}[data-orientation=vertical][data-select-on-move=false] &:after{content:\\\"\\\";inset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs, 4px)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\\n\\t\\t\\t[role=tab]:is([aria-selected=true])\\n\\t\\t\\t&{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline:2px solid #0000;outline-offset:0}}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"tablist\":\"_7313adbc8a112e90__tablist\",\"is-overflowing-first\":\"_9f2ac729c68a735a__is-overflowing-first\",\"is-overflowing-last\":\"_81c799c1f3cdd261__is-overflowing-last\",\"is-minimal-variant\":\"_59228b5227f38a99__is-minimal-variant\",\"indicator\":\"_1c37dcfaa1ad8cda__indicator\",\"tab\":\"a5fd8814f195aa5e__tab\",\"tab-children\":\"_5dfc77e6edd345d4__tab-children\",\"tab-chevron\":\"_4a20e969d15e5ac1__tab-chevron\",\"tabpanel\":\"_49f4bf715948892a__tabpanel\"};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA2B;AAC3B,kBAAiB;AACjB,kBAA8B;AAC9B,mBAA6B;AAC7B,kBAAqB;AACrB,qBAA+B;;;ACL/B,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,ixJAAyyJ,CAAC;AACp1J,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,WAAU,8BAA6B,wBAAuB,2CAA0C,uBAAsB,0CAAyC,sBAAqB,yCAAwC,aAAY,gCAA+B,OAAM,yBAAwB,gBAAe,mCAAkC,eAAc,kCAAiC,YAAW,8BAA6B;;;ADgBnc;AAPK,IAAM,UAAM,2BAA2C,SAASA,KACtE,EAAE,WAAW,UAAU,GAAG,WAAW,GACrC,cACC;AACD,qCAAe;AAEf,SACC;AAAA,IAAC,YAAAC,KAAM;AAAA,IAAN;AAAA,MACA,KAAM;AAAA,MACN,eAAY,YAAAC,SAAM,cAAO,KAAK,SAAU;AAAA,MACtC,GAAG;AAAA,MAEL;AAAA,oDAAC,UAAK,WAAY,cAAQ,cAAe,GAAM,UAAU;AAAA,QACzD,4CAAC,oBAAK,MAAO,2BAAe,WAAY,cAAQ,aAAc,GAAI;AAAA;AAAA;AAAA,EACnE;AAEF,CAAE;",
|
|
6
6
|
"names": ["Tab", "_Tabs", "clsx"]
|
|
7
7
|
}
|
package/build/text/text.cjs
CHANGED
|
@@ -38,9 +38,9 @@ var import_clsx = __toESM(require("clsx"));
|
|
|
38
38
|
var import_element = require("@wordpress/element");
|
|
39
39
|
|
|
40
40
|
// packages/ui/src/text/style.module.css
|
|
41
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
41
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='8bc43893d6']")) {
|
|
42
42
|
const style = document.createElement("style");
|
|
43
|
-
style.setAttribute("data-wp-hash", "
|
|
43
|
+
style.setAttribute("data-wp-hash", "8bc43893d6");
|
|
44
44
|
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._14437cfb77831647__heading-2xl{font-size:var(--wpds-font-size-2xl,32px);line-height:var(--wpds-font-line-height-2xl,40px)}._14437cfb77831647__heading-2xl,._3c78b7fa9b4072dd__heading-xl{font-family:var(--wpds-font-family-heading,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-weight:var(--wpds-font-weight-medium,499)}._3c78b7fa9b4072dd__heading-xl{font-size:var(--wpds-font-size-xl,20px);line-height:var(--wpds-font-line-height-md,24px)}.aa58f227716bcde2__heading-lg{font-size:var(--wpds-font-size-lg,15px)}.aa58f227716bcde2__heading-lg,.fc4da56d8dfe52c4__heading-md{font-family:var(--wpds-font-family-heading,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-weight:var(--wpds-font-weight-medium,499);line-height:var(--wpds-font-line-height-sm,20px)}.fc4da56d8dfe52c4__heading-md{font-size:var(--wpds-font-size-md,13px)}.a9b78c7c82e8dff7__heading-sm{font-family:var(--wpds-font-family-heading,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wpds-font-size-xs,11px);font-weight:var(--wpds-font-weight-medium,499);line-height:var(--wpds-font-line-height-xs,16px);text-transform:uppercase}._305ff559e52180d5__body-xl{font-size:var(--wpds-font-size-xl,20px);line-height:var(--wpds-font-line-height-xl,32px)}._305ff559e52180d5__body-xl,.ca1aa3fc2029e958__body-lg{font-family:var(--wpds-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-weight:var(--wpds-font-weight-regular,400)}.ca1aa3fc2029e958__body-lg{font-size:var(--wpds-font-size-lg,15px);line-height:var(--wpds-font-line-height-md,24px)}._131101940be12424__body-md{font-size:var(--wpds-font-size-md,13px);line-height:var(--wpds-font-line-height-sm,20px)}._0e8d87a42c1f75fa__body-sm,._131101940be12424__body-md{font-family:var(--wpds-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-weight:var(--wpds-font-weight-regular,400)}._0e8d87a42c1f75fa__body-sm{font-size:var(--wpds-font-size-sm,12px);line-height:var(--wpds-font-line-height-xs,16px)}}'));
|
|
45
45
|
document.head.appendChild(style);
|
|
46
46
|
}
|
package/build/text/text.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/text/text.tsx", "../../src/text/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import { useRender, mergeProps } from '@base-ui/react';\nimport clsx from 'clsx';\nimport { forwardRef } from '@wordpress/element';\nimport { type TextProps } from './types';\nimport styles from './style.module.css';\n\n/**\n * A text component for rendering content with predefined typographic variants.\n * Built on design tokens for consistent typography across the UI.\n */\nexport const Text = forwardRef< HTMLSpanElement, TextProps >( function Text(\n\t{ variant = 'body-md', render, className, ...props },\n\tref\n) {\n\tconst element = useRender( {\n\t\trender,\n\t\tdefaultTagName: 'span',\n\t\tref,\n\t\tprops: mergeProps< 'span' >( props, {\n\t\t\tclassName: clsx( styles[ variant ], className ),\n\t\t} ),\n\t} );\n\n\treturn element;\n} );\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='
|
|
4
|
+
"sourcesContent": ["import { useRender, mergeProps } from '@base-ui/react';\nimport clsx from 'clsx';\nimport { forwardRef } from '@wordpress/element';\nimport { type TextProps } from './types';\nimport styles from './style.module.css';\n\n/**\n * A text component for rendering content with predefined typographic variants.\n * Built on design tokens for consistent typography across the UI.\n */\nexport const Text = forwardRef< HTMLSpanElement, TextProps >( function Text(\n\t{ variant = 'body-md', render, className, ...props },\n\tref\n) {\n\tconst element = useRender( {\n\t\trender,\n\t\tdefaultTagName: 'span',\n\t\tref,\n\t\tprops: mergeProps< 'span' >( props, {\n\t\t\tclassName: clsx( styles[ variant ], className ),\n\t\t} ),\n\t} );\n\n\treturn element;\n} );\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='8bc43893d6']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"8bc43893d6\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._14437cfb77831647__heading-2xl{font-size:var(--wpds-font-size-2xl,32px);line-height:var(--wpds-font-line-height-2xl,40px)}._14437cfb77831647__heading-2xl,._3c78b7fa9b4072dd__heading-xl{font-family:var(--wpds-font-family-heading,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);font-weight:var(--wpds-font-weight-medium,499)}._3c78b7fa9b4072dd__heading-xl{font-size:var(--wpds-font-size-xl,20px);line-height:var(--wpds-font-line-height-md,24px)}.aa58f227716bcde2__heading-lg{font-size:var(--wpds-font-size-lg,15px)}.aa58f227716bcde2__heading-lg,.fc4da56d8dfe52c4__heading-md{font-family:var(--wpds-font-family-heading,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);font-weight:var(--wpds-font-weight-medium,499);line-height:var(--wpds-font-line-height-sm,20px)}.fc4da56d8dfe52c4__heading-md{font-size:var(--wpds-font-size-md,13px)}.a9b78c7c82e8dff7__heading-sm{font-family:var(--wpds-font-family-heading,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);font-size:var(--wpds-font-size-xs,11px);font-weight:var(--wpds-font-weight-medium,499);line-height:var(--wpds-font-line-height-xs,16px);text-transform:uppercase}._305ff559e52180d5__body-xl{font-size:var(--wpds-font-size-xl,20px);line-height:var(--wpds-font-line-height-xl,32px)}._305ff559e52180d5__body-xl,.ca1aa3fc2029e958__body-lg{font-family:var(--wpds-font-family-body,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);font-weight:var(--wpds-font-weight-regular,400)}.ca1aa3fc2029e958__body-lg{font-size:var(--wpds-font-size-lg,15px);line-height:var(--wpds-font-line-height-md,24px)}._131101940be12424__body-md{font-size:var(--wpds-font-size-md,13px);line-height:var(--wpds-font-line-height-sm,20px)}._0e8d87a42c1f75fa__body-sm,._131101940be12424__body-md{font-family:var(--wpds-font-family-body,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);font-weight:var(--wpds-font-weight-regular,400)}._0e8d87a42c1f75fa__body-sm{font-size:var(--wpds-font-size-sm,12px);line-height:var(--wpds-font-line-height-xs,16px)}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"heading-2xl\":\"_14437cfb77831647__heading-2xl\",\"heading-xl\":\"_3c78b7fa9b4072dd__heading-xl\",\"heading-lg\":\"aa58f227716bcde2__heading-lg\",\"heading-md\":\"fc4da56d8dfe52c4__heading-md\",\"heading-sm\":\"a9b78c7c82e8dff7__heading-sm\",\"body-xl\":\"_305ff559e52180d5__body-xl\",\"body-lg\":\"ca1aa3fc2029e958__body-lg\",\"body-md\":\"_131101940be12424__body-md\",\"body-sm\":\"_0e8d87a42c1f75fa__body-sm\"};\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAsC;AACtC,kBAAiB;AACjB,qBAA2B;;;ACF3B,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,g0EAA43E,CAAC;AACv6E,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,eAAc,kCAAiC,cAAa,iCAAgC,cAAa,gCAA+B,cAAa,gCAA+B,cAAa,gCAA+B,WAAU,8BAA6B,WAAU,6BAA4B,WAAU,8BAA6B,WAAU,6BAA4B;;;ADInY,IAAM,WAAO,2BAA0C,SAASA,MACtE,EAAE,UAAU,WAAW,QAAQ,WAAW,GAAG,MAAM,GACnD,KACC;AACD,QAAM,cAAU,wBAAW;AAAA,IAC1B;AAAA,IACA,gBAAgB;AAAA,IAChB;AAAA,IACA,WAAO,yBAAsB,OAAO;AAAA,MACnC,eAAW,YAAAC,SAAM,cAAQ,OAAQ,GAAG,SAAU;AAAA,IAC/C,CAAE;AAAA,EACH,CAAE;AAEF,SAAO;AACR,CAAE;",
|
|
6
6
|
"names": ["Text", "clsx"]
|
|
7
7
|
}
|
package/build/tooltip/popup.cjs
CHANGED
|
@@ -40,18 +40,18 @@ var import_theme = require("@wordpress/theme");
|
|
|
40
40
|
var import_lock_unlock = require("../lock-unlock.cjs");
|
|
41
41
|
|
|
42
42
|
// packages/ui/src/utils/css/resets.module.css
|
|
43
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
43
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='e3ae230cea']")) {
|
|
44
44
|
const style = document.createElement("style");
|
|
45
|
-
style.setAttribute("data-wp-hash", "
|
|
45
|
+
style.setAttribute("data-wp-hash", "e3ae230cea");
|
|
46
46
|
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._336cd3e4e743482f__box-sizing{box-sizing:border-box;*,:after,:before{box-sizing:inherit}}}"));
|
|
47
47
|
document.head.appendChild(style);
|
|
48
48
|
}
|
|
49
49
|
var resets_default = { "box-sizing": "_336cd3e4e743482f__box-sizing" };
|
|
50
50
|
|
|
51
51
|
// packages/ui/src/tooltip/style.module.css
|
|
52
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
52
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='2dfee26b7e']")) {
|
|
53
53
|
const style = document.createElement("style");
|
|
54
|
-
style.setAttribute("data-wp-hash", "
|
|
54
|
+
style.setAttribute("data-wp-hash", "2dfee26b7e");
|
|
55
55
|
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._480b748dd3510e64__positioner{z-index:var(--wp-ui-tooltip-z-index,initial)}._50096b232db7709d__popup{background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border-radius:var(--wpds-border-radius-sm,2px);box-shadow:var(--wpds-elevation-sm,0 1px 2px 0 #0000000d,0 2px 3px 0 #0000000a,0 6px 6px 0 #00000008,0 8px 8px 0 #00000005);color:var(--wpds-color-fg-content-neutral,#1e1e1e);font-family:var(--wpds-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wpds-font-size-sm,12px);line-height:1.4;padding:var(--wpds-dimension-padding-xs,4px) var(--wpds-dimension-padding-sm,8px)}}'));
|
|
56
56
|
document.head.appendChild(style);
|
|
57
57
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/tooltip/popup.tsx", "../../src/utils/css/resets.module.css", "../../src/tooltip/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import clsx from 'clsx';\nimport { Tooltip } from '@base-ui/react/tooltip';\nimport { forwardRef } from '@wordpress/element';\nimport {\n\ttype ThemeProvider as ThemeProviderType,\n\tprivateApis as themePrivateApis,\n} from '@wordpress/theme';\nimport type { PopupProps } from './types';\nimport { unlock } from '../lock-unlock';\nimport resetStyles from '../utils/css/resets.module.css';\nimport styles from './style.module.css';\n\nconst ThemeProvider: typeof ThemeProviderType =\n\tunlock( themePrivateApis ).ThemeProvider;\n\nconst Popup = forwardRef< HTMLDivElement, PopupProps >( function TooltipPopup(\n\t{\n\t\talign = 'center',\n\t\tside = 'top',\n\t\tsideOffset = 4,\n\t\tchildren,\n\t\tclassName,\n\t\tstyle,\n\t\t...props\n\t},\n\tref\n) {\n\treturn (\n\t\t<Tooltip.Portal>\n\t\t\t<Tooltip.Positioner\n\t\t\t\talign={ align }\n\t\t\t\tside={ side }\n\t\t\t\tsideOffset={ sideOffset }\n\t\t\t\tstyle={ style }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tresetStyles[ 'box-sizing' ],\n\t\t\t\t\tclassName,\n\t\t\t\t\tstyles.positioner\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t{ /* This should ideally use whatever dark color makes sense,\n\t\t\t\tand not be hardcoded to #1e1e1e. The solutions would be to:\n\t\t\t\t - review the design of the tooltip, in case we want to stop\n\t\t\t\t hardcoding it to a dark background\n\t\t\t\t - create new semantic tokens as needed (aliasing either the \"inverted\n\t\t\t\t\t bg\" or \"perma-dark bg\" private tokens) and have Tooltip.Popup use\n\t\t\t\t them;\n\t\t\t\t - remove the hardcoded `bg` setting from the `ThemeProvider` below\n\t\t\t\t\t*/ }\n\t\t\t\t<ThemeProvider color={ { bg: '#1e1e1e' } }>\n\t\t\t\t\t<Tooltip.Popup\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tclassName={ styles.popup }\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</Tooltip.Popup>\n\t\t\t\t</ThemeProvider>\n\t\t\t</Tooltip.Positioner>\n\t\t</Tooltip.Portal>\n\t);\n} );\n\nexport { Popup };\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='
|
|
4
|
+
"sourcesContent": ["import clsx from 'clsx';\nimport { Tooltip } from '@base-ui/react/tooltip';\nimport { forwardRef } from '@wordpress/element';\nimport {\n\ttype ThemeProvider as ThemeProviderType,\n\tprivateApis as themePrivateApis,\n} from '@wordpress/theme';\nimport type { PopupProps } from './types';\nimport { unlock } from '../lock-unlock';\nimport resetStyles from '../utils/css/resets.module.css';\nimport styles from './style.module.css';\n\nconst ThemeProvider: typeof ThemeProviderType =\n\tunlock( themePrivateApis ).ThemeProvider;\n\nconst Popup = forwardRef< HTMLDivElement, PopupProps >( function TooltipPopup(\n\t{\n\t\talign = 'center',\n\t\tside = 'top',\n\t\tsideOffset = 4,\n\t\tchildren,\n\t\tclassName,\n\t\tstyle,\n\t\t...props\n\t},\n\tref\n) {\n\treturn (\n\t\t<Tooltip.Portal>\n\t\t\t<Tooltip.Positioner\n\t\t\t\talign={ align }\n\t\t\t\tside={ side }\n\t\t\t\tsideOffset={ sideOffset }\n\t\t\t\tstyle={ style }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tresetStyles[ 'box-sizing' ],\n\t\t\t\t\tclassName,\n\t\t\t\t\tstyles.positioner\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t{ /* This should ideally use whatever dark color makes sense,\n\t\t\t\tand not be hardcoded to #1e1e1e. The solutions would be to:\n\t\t\t\t - review the design of the tooltip, in case we want to stop\n\t\t\t\t hardcoding it to a dark background\n\t\t\t\t - create new semantic tokens as needed (aliasing either the \"inverted\n\t\t\t\t\t bg\" or \"perma-dark bg\" private tokens) and have Tooltip.Popup use\n\t\t\t\t them;\n\t\t\t\t - remove the hardcoded `bg` setting from the `ThemeProvider` below\n\t\t\t\t\t*/ }\n\t\t\t\t<ThemeProvider color={ { bg: '#1e1e1e' } }>\n\t\t\t\t\t<Tooltip.Popup\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tclassName={ styles.popup }\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</Tooltip.Popup>\n\t\t\t\t</ThemeProvider>\n\t\t\t</Tooltip.Positioner>\n\t\t</Tooltip.Portal>\n\t);\n} );\n\nexport { Popup };\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='e3ae230cea']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"e3ae230cea\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._336cd3e4e743482f__box-sizing{box-sizing:border-box;*,:after,:before{box-sizing:inherit}}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"box-sizing\":\"_336cd3e4e743482f__box-sizing\"};\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='2dfee26b7e']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"2dfee26b7e\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._480b748dd3510e64__positioner{z-index:var(--wp-ui-tooltip-z-index,initial)}._50096b232db7709d__popup{background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border-radius:var(--wpds-border-radius-sm,2px);box-shadow:var(--wpds-elevation-sm,0 1px 2px 0 #0000000d,0 2px 3px 0 #0000000a,0 6px 6px 0 #00000008,0 8px 8px 0 #00000005);color:var(--wpds-color-fg-content-neutral,#1e1e1e);font-family:var(--wpds-font-family-body,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);font-size:var(--wpds-font-size-sm,12px);line-height:1.4;padding:var(--wpds-dimension-padding-xs,4px) var(--wpds-dimension-padding-sm,8px)}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"positioner\":\"_480b748dd3510e64__positioner\",\"popup\":\"_50096b232db7709d__popup\"};\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAiB;AACjB,qBAAwB;AACxB,qBAA2B;AAC3B,mBAGO;AAEP,yBAAuB;;;ACRvB,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,kMAAkM,CAAC;AAC7O,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,iBAAQ,EAAC,cAAa,gCAA+B;;;ACN5D,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,6wBAAyxB,CAAC;AACp0B,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,cAAa,iCAAgC,SAAQ,2BAA0B;;;AF4C1F;AAtCL,IAAM,oBACL,2BAAQ,aAAAA,WAAiB,EAAE;AAE5B,IAAM,YAAQ,2BAA0C,SAAS,aAChE;AAAA,EACC,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GACA,KACC;AACD,SACC,4CAAC,uBAAQ,QAAR,EACA;AAAA,IAAC,uBAAQ;AAAA,IAAR;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAY,YAAAC;AAAA,QACX,eAAa,YAAa;AAAA,QAC1B;AAAA,QACA,cAAO;AAAA,MACR;AAAA,MAWA,sDAAC,iBAAc,OAAQ,EAAE,IAAI,UAAU,GACtC;AAAA,QAAC,uBAAQ;AAAA,QAAR;AAAA,UACA;AAAA,UACA,WAAY,cAAO;AAAA,UACjB,GAAG;AAAA,UAEH;AAAA;AAAA,MACH,GACD;AAAA;AAAA,EACD,GACD;AAEF,CAAE;",
|
|
6
6
|
"names": ["themePrivateApis", "clsx"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/tooltip/root.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Tooltip } from '@base-ui/react/tooltip';\nimport type { RootProps } from './types';\n\nfunction Root( props: RootProps ) {\n\treturn <Tooltip.Root { ...props } />;\n}\n\nexport { Root };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAAwB;
|
|
4
|
+
"sourcesContent": ["import { Tooltip } from '@base-ui/react/tooltip';\nimport type { RootProps } from './types';\n\n/**\n * `Tooltip` is used to visually show the label of an icon button, or other such interactive controls\n * that don't have a visual text label.\n *\n * Tooltips are not available on touch devices, and thus should not be used for infotips,\n * descriptions, or dynamic status messages.\n *\n * The tooltip itself does not provide any accessible labeling, so when using the\n * `Tooltip` primitive you must ensure that the trigger is accessibly labeled (e.g. with an `aria-label`).\n *\n * See also: [IconButton](https://wordpress.github.io/gutenberg/?path=/docs/design-system-components-iconbutton--docs)\n */\nfunction Root( props: RootProps ) {\n\treturn <Tooltip.Root { ...props } />;\n}\n\nexport { Root };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAAwB;AAgBhB;AADR,SAAS,KAAM,OAAmB;AACjC,SAAO,4CAAC,uBAAQ,MAAR,EAAe,GAAG,OAAQ;AACnC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// packages/ui/src/utils/use-deprioritized-initial-focus.ts
|
|
21
|
+
var use_deprioritized_initial_focus_exports = {};
|
|
22
|
+
__export(use_deprioritized_initial_focus_exports, {
|
|
23
|
+
useDeprioritizedInitialFocus: () => useDeprioritizedInitialFocus
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(use_deprioritized_initial_focus_exports);
|
|
26
|
+
var import_element = require("@wordpress/element");
|
|
27
|
+
var import_tabbable = require("tabbable");
|
|
28
|
+
var getTabbableOptions = () => ({
|
|
29
|
+
getShadowRoot: true,
|
|
30
|
+
displayCheck: typeof ResizeObserver === "function" && ResizeObserver.toString().includes("[native code]") ? "full" : "none"
|
|
31
|
+
});
|
|
32
|
+
function useDeprioritizedInitialFocus({
|
|
33
|
+
initialFocus,
|
|
34
|
+
deprioritizedAttribute
|
|
35
|
+
}) {
|
|
36
|
+
const popupRef = (0, import_element.useRef)(null);
|
|
37
|
+
const resolvedInitialFocus = (0, import_element.useMemo)(() => {
|
|
38
|
+
if (initialFocus !== void 0 && initialFocus !== true) {
|
|
39
|
+
return initialFocus;
|
|
40
|
+
}
|
|
41
|
+
return (interactionType) => {
|
|
42
|
+
if (interactionType === "touch") {
|
|
43
|
+
return popupRef.current ?? true;
|
|
44
|
+
}
|
|
45
|
+
const popup = popupRef.current;
|
|
46
|
+
if (!popup) {
|
|
47
|
+
return true;
|
|
48
|
+
}
|
|
49
|
+
const tabbables = (0, import_tabbable.tabbable)(popup, getTabbableOptions());
|
|
50
|
+
for (const el of tabbables) {
|
|
51
|
+
if (el instanceof HTMLElement && !el.hasAttribute(deprioritizedAttribute)) {
|
|
52
|
+
return el;
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
return true;
|
|
56
|
+
};
|
|
57
|
+
}, [initialFocus, deprioritizedAttribute]);
|
|
58
|
+
return { resolvedInitialFocus, popupRef };
|
|
59
|
+
}
|
|
60
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
61
|
+
0 && (module.exports = {
|
|
62
|
+
useDeprioritizedInitialFocus
|
|
63
|
+
});
|
|
64
|
+
//# sourceMappingURL=use-deprioritized-initial-focus.cjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/utils/use-deprioritized-initial-focus.ts"],
|
|
4
|
+
"sourcesContent": ["import type { Dialog as _Dialog } from '@base-ui/react/dialog';\nimport { useMemo, useRef } from '@wordpress/element';\nimport { tabbable } from 'tabbable';\n\n/**\n * Derived from Base UI's `Dialog.Popup.Props['initialFocus']`.\n * The same type is shared by all Base UI overlay popups (Dialog, Popover, etc.).\n */\ntype InitialFocus = _Dialog.Popup.Props[ 'initialFocus' ];\n\n/**\n * Options matching Base UI's internal tabbable configuration.\n * @see https://github.com/floating-ui/floating-ui/blob/master/packages/react/src/utils/tabbable.ts\n */\nconst getTabbableOptions = () => ( {\n\tgetShadowRoot: true,\n\tdisplayCheck:\n\t\ttypeof ResizeObserver === 'function' &&\n\t\tResizeObserver.toString().includes( '[native code]' )\n\t\t\t? ( 'full' as const )\n\t\t\t: ( 'none' as const ),\n} );\n\n/**\n * Returns a resolved `initialFocus` value that deprioritizes elements\n * marked with a given data attribute (e.g. a close icon), and an internal\n * ref that must be merged onto the popup element.\n *\n * When `initialFocus` is `undefined` or `true` (the default behavior),\n * the hook replaces it with a callback that:\n * 1. On touch interactions \u2014 focuses the popup element itself (preventing\n * the virtual keyboard on Android), matching Base UI's default.\n * 2. On other interactions \u2014 returns the first tabbable element that does\n * *not* carry `deprioritizedAttribute`. Falls back to Base UI's default\n * when the deprioritized element is the only tabbable element.\n *\n * All other `initialFocus` values (`false`, `RefObject`, callback) pass\n * through unchanged.\n *\n * @param props\n * @param props.initialFocus The consumer-provided `initialFocus` value.\n * @param props.deprioritizedAttribute The data attribute whose elements should be deprioritized.\n */\nexport function useDeprioritizedInitialFocus( {\n\tinitialFocus,\n\tdeprioritizedAttribute,\n}: {\n\tinitialFocus: InitialFocus;\n\tdeprioritizedAttribute: string;\n} ) {\n\tconst popupRef = useRef< HTMLDivElement >( null );\n\n\tconst resolvedInitialFocus = useMemo( (): InitialFocus => {\n\t\tif ( initialFocus !== undefined && initialFocus !== true ) {\n\t\t\treturn initialFocus;\n\t\t}\n\n\t\treturn ( interactionType ): HTMLElement | boolean | null => {\n\t\t\tif ( interactionType === 'touch' ) {\n\t\t\t\treturn popupRef.current ?? true;\n\t\t\t}\n\n\t\t\tconst popup = popupRef.current;\n\t\t\tif ( ! popup ) {\n\t\t\t\treturn true;\n\t\t\t}\n\n\t\t\tconst tabbables = tabbable( popup, getTabbableOptions() );\n\t\t\tfor ( const el of tabbables ) {\n\t\t\t\tif (\n\t\t\t\t\tel instanceof HTMLElement &&\n\t\t\t\t\t! el.hasAttribute( deprioritizedAttribute )\n\t\t\t\t) {\n\t\t\t\t\treturn el;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn true;\n\t\t};\n\t}, [ initialFocus, deprioritizedAttribute ] );\n\n\treturn { resolvedInitialFocus, popupRef };\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,qBAAgC;AAChC,sBAAyB;AAYzB,IAAM,qBAAqB,OAAQ;AAAA,EAClC,eAAe;AAAA,EACf,cACC,OAAO,mBAAmB,cAC1B,eAAe,SAAS,EAAE,SAAU,eAAgB,IAC/C,SACA;AACP;AAsBO,SAAS,6BAA8B;AAAA,EAC7C;AAAA,EACA;AACD,GAGI;AACH,QAAM,eAAW,uBAA0B,IAAK;AAEhD,QAAM,2BAAuB,wBAAS,MAAoB;AACzD,QAAK,iBAAiB,UAAa,iBAAiB,MAAO;AAC1D,aAAO;AAAA,IACR;AAEA,WAAO,CAAE,oBAAmD;AAC3D,UAAK,oBAAoB,SAAU;AAClC,eAAO,SAAS,WAAW;AAAA,MAC5B;AAEA,YAAM,QAAQ,SAAS;AACvB,UAAK,CAAE,OAAQ;AACd,eAAO;AAAA,MACR;AAEA,YAAM,gBAAY,0BAAU,OAAO,mBAAmB,CAAE;AACxD,iBAAY,MAAM,WAAY;AAC7B,YACC,cAAc,eACd,CAAE,GAAG,aAAc,sBAAuB,GACzC;AACD,iBAAO;AAAA,QACR;AAAA,MACD;AAEA,aAAO;AAAA,IACR;AAAA,EACD,GAAG,CAAE,cAAc,sBAAuB,CAAE;AAE5C,SAAO,EAAE,sBAAsB,SAAS;AACzC;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -27,9 +27,9 @@ var import_react = require("@base-ui/react");
|
|
|
27
27
|
var import_element = require("@wordpress/element");
|
|
28
28
|
|
|
29
29
|
// packages/ui/src/visually-hidden/style.module.css
|
|
30
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
30
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='c46e8cb841']")) {
|
|
31
31
|
const style = document.createElement("style");
|
|
32
|
-
style.setAttribute("data-wp-hash", "
|
|
32
|
+
style.setAttribute("data-wp-hash", "c46e8cb841");
|
|
33
33
|
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}"));
|
|
34
34
|
document.head.appendChild(style);
|
|
35
35
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/visually-hidden/visually-hidden.tsx", "../../src/visually-hidden/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef } from '@wordpress/element';\nimport type { VisuallyHiddenProps } from './types';\nimport styles from './style.module.css';\n\n/**\n * Visually hides content while keeping it accessible to screen readers.\n * Useful when providing context that's only meaningful to assistive technology.\n */\nexport const VisuallyHidden = forwardRef< HTMLDivElement, VisuallyHiddenProps >(\n\tfunction VisuallyHidden( { render, ...restProps }, ref ) {\n\t\tconst element = useRender( {\n\t\t\trender,\n\t\t\tref,\n\t\t\tprops: mergeProps< 'div' >(\n\t\t\t\t{ className: styles[ 'visually-hidden' ] },\n\t\t\t\trestProps\n\t\t\t),\n\t\t} );\n\n\t\treturn element;\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='
|
|
4
|
+
"sourcesContent": ["import { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef } from '@wordpress/element';\nimport type { VisuallyHiddenProps } from './types';\nimport styles from './style.module.css';\n\n/**\n * Visually hides content while keeping it accessible to screen readers.\n * Useful when providing context that's only meaningful to assistive technology.\n */\nexport const VisuallyHidden = forwardRef< HTMLDivElement, VisuallyHiddenProps >(\n\tfunction VisuallyHidden( { render, ...restProps }, ref ) {\n\t\tconst element = useRender( {\n\t\t\trender,\n\t\t\tref,\n\t\t\tprops: mergeProps< 'div' >(\n\t\t\t\t{ className: styles[ 'visually-hidden' ] },\n\t\t\t\trestProps\n\t\t\t),\n\t\t} );\n\n\t\treturn element;\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='c46e8cb841']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"c46e8cb841\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"visually-hidden\":\"f37b9e2e191ebd66__visually-hidden\"};\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAsC;AACtC,qBAA2B;;;ACD3B,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,0RAA0R,CAAC;AACrU,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,mBAAkB,oCAAmC;;;ADG9D,IAAM,qBAAiB;AAAA,EAC7B,SAASA,gBAAgB,EAAE,QAAQ,GAAG,UAAU,GAAG,KAAM;AACxD,UAAM,cAAU,wBAAW;AAAA,MAC1B;AAAA,MACA;AAAA,MACA,WAAO;AAAA,QACN,EAAE,WAAW,cAAQ,iBAAkB,EAAE;AAAA,QACzC;AAAA,MACD;AAAA,IACD,CAAE;AAEF,WAAO;AAAA,EACR;AACD;",
|
|
6
6
|
"names": ["VisuallyHidden"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/alert-dialog/context.tsx"],
|
|
4
|
+
"sourcesContent": ["import { createContext } from '@wordpress/element';\nimport type { RootProps } from './types';\n\ntype Intent = NonNullable< RootProps[ 'intent' ] >;\n\ninterface AlertDialogContextValue {\n\tintent: Intent;\n}\n\nconst AlertDialogContext = createContext< AlertDialogContextValue >( {\n\tintent: 'default',\n} );\n\nexport { AlertDialogContext };\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,qBAAqB;AAS9B,IAAM,qBAAqB,cAA0C;AAAA,EACpE,QAAQ;AACT,CAAE;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|