@wordpress/ui 0.9.1-next.v.202603161435.0 → 0.11.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 +76 -1
- package/CONTRIBUTING.md +180 -0
- package/README.md +34 -6
- package/build/alert-dialog/context.cjs +39 -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 +165 -0
- package/build/alert-dialog/popup.cjs.map +7 -0
- package/build/alert-dialog/root.cjs +152 -0
- package/build/alert-dialog/root.cjs.map +7 -0
- package/build/alert-dialog/trigger.cjs +38 -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 +14 -14
- package/build/badge/badge.cjs.map +2 -2
- package/build/button/button.cjs +18 -8
- package/build/button/button.cjs.map +3 -3
- package/build/card/content.cjs +4 -4
- package/build/card/content.cjs.map +2 -2
- package/build/card/full-bleed.cjs +4 -4
- package/build/card/full-bleed.cjs.map +2 -2
- package/build/card/header.cjs +4 -4
- package/build/card/header.cjs.map +2 -2
- package/build/card/root.cjs +6 -6
- package/build/card/root.cjs.map +2 -2
- package/build/card/title.cjs +14 -21
- package/build/card/title.cjs.map +3 -3
- package/build/collapsible-card/content.cjs +24 -3
- 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 +39 -18
- package/build/collapsible-card/header.cjs.map +2 -2
- package/build/collapsible-card/index.cjs +3 -0
- package/build/collapsible-card/index.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 +24 -6
- package/build/dialog/popup.cjs.map +2 -2
- package/build/dialog/title.cjs +10 -19
- package/build/dialog/title.cjs.map +3 -3
- 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 +69 -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 +71 -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 +17 -4
- package/build/form/primitives/field/description.cjs.map +3 -3
- package/build/form/primitives/field/details.cjs +4 -4
- package/build/form/primitives/field/details.cjs.map +2 -2
- package/build/form/primitives/field/label.cjs +8 -8
- package/build/form/primitives/field/label.cjs.map +2 -2
- package/build/form/primitives/field/root.cjs +2 -2
- package/build/form/primitives/field/root.cjs.map +1 -1
- package/build/form/primitives/fieldset/description.cjs +20 -4
- package/build/form/primitives/fieldset/description.cjs.map +3 -3
- package/build/form/primitives/fieldset/details.cjs +3 -3
- package/build/form/primitives/fieldset/details.cjs.map +2 -2
- package/build/form/primitives/fieldset/legend.cjs +8 -7
- package/build/form/primitives/fieldset/legend.cjs.map +2 -2
- 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 +23 -7
- package/build/form/primitives/input/input.cjs.map +3 -3
- package/build/form/primitives/input-layout/input-layout.cjs +15 -5
- package/build/form/primitives/input-layout/input-layout.cjs.map +3 -3
- package/build/form/primitives/input-layout/slot.cjs +6 -5
- 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 +9 -9
- package/build/form/primitives/select/popup.cjs.map +2 -2
- package/build/form/primitives/select/trigger.cjs +6 -6
- package/build/form/primitives/select/trigger.cjs.map +2 -2
- package/build/form/primitives/select/types.cjs.map +1 -1
- package/build/form/primitives/textarea/textarea.cjs +23 -4
- package/build/form/primitives/textarea/textarea.cjs.map +3 -3
- 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 +18 -8
- package/build/link/link.cjs.map +3 -3
- package/build/notice/action-button.cjs +3 -3
- package/build/notice/action-button.cjs.map +2 -2
- package/build/notice/action-link.cjs +3 -3
- package/build/notice/action-link.cjs.map +2 -2
- package/build/notice/actions.cjs +3 -3
- package/build/notice/actions.cjs.map +2 -2
- package/build/notice/close-icon.cjs +3 -3
- package/build/notice/close-icon.cjs.map +2 -2
- package/build/notice/description.cjs +3 -3
- package/build/notice/description.cjs.map +2 -2
- package/build/notice/index.cjs.map +1 -1
- package/build/notice/root.cjs +5 -5
- package/build/notice/root.cjs.map +2 -2
- package/build/notice/title.cjs +3 -3
- package/build/notice/title.cjs.map +2 -2
- package/build/popover/arrow.cjs +94 -0
- package/build/popover/arrow.cjs.map +7 -0
- package/build/popover/close.cjs +45 -0
- package/build/popover/close.cjs.map +7 -0
- package/build/popover/context.cjs +76 -0
- package/build/popover/context.cjs.map +7 -0
- package/build/popover/description.cjs +70 -0
- package/build/popover/description.cjs.map +7 -0
- package/build/popover/index.cjs +49 -0
- package/build/popover/index.cjs.map +7 -0
- package/build/popover/popup.cjs +138 -0
- package/build/popover/popup.cjs.map +7 -0
- package/build/popover/root.cjs +35 -0
- package/build/popover/root.cjs.map +7 -0
- package/build/popover/title.cjs +56 -0
- package/build/popover/title.cjs.map +7 -0
- package/build/popover/trigger.cjs +38 -0
- package/build/popover/trigger.cjs.map +7 -0
- package/build/popover/types.cjs +19 -0
- package/build/popover/types.cjs.map +7 -0
- 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 -4
- 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 +20 -5
- package/build/text/text.cjs.map +3 -3
- package/build/tooltip/popup.cjs +7 -6
- package/build/tooltip/popup.cjs.map +2 -2
- package/build/tooltip/root.cjs.map +2 -2
- package/build/tooltip/types.cjs.map +1 -1
- package/build/utils/types.cjs.map +1 -1
- 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 +2 -2
- package/build-module/alert-dialog/context.mjs +14 -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 +132 -0
- package/build-module/alert-dialog/popup.mjs.map +7 -0
- package/build-module/alert-dialog/root.mjs +133 -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 +14 -14
- package/build-module/badge/badge.mjs.map +2 -2
- package/build-module/button/button.mjs +18 -8
- package/build-module/button/button.mjs.map +3 -3
- package/build-module/card/content.mjs +4 -4
- package/build-module/card/content.mjs.map +2 -2
- package/build-module/card/full-bleed.mjs +4 -4
- package/build-module/card/full-bleed.mjs.map +2 -2
- package/build-module/card/header.mjs +4 -4
- package/build-module/card/header.mjs.map +2 -2
- package/build-module/card/root.mjs +6 -6
- package/build-module/card/root.mjs.map +2 -2
- package/build-module/card/title.mjs +14 -21
- package/build-module/card/title.mjs.map +3 -3
- package/build-module/collapsible-card/content.mjs +24 -3
- 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 +40 -19
- package/build-module/collapsible-card/header.mjs.map +2 -2
- package/build-module/collapsible-card/index.mjs +2 -0
- package/build-module/collapsible-card/index.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 +24 -6
- package/build-module/dialog/popup.mjs.map +2 -2
- package/build-module/dialog/title.mjs +10 -9
- 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 +34 -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 +36 -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 +17 -4
- package/build-module/form/primitives/field/description.mjs.map +3 -3
- package/build-module/form/primitives/field/details.mjs +4 -4
- package/build-module/form/primitives/field/details.mjs.map +2 -2
- package/build-module/form/primitives/field/label.mjs +8 -8
- package/build-module/form/primitives/field/label.mjs.map +2 -2
- package/build-module/form/primitives/field/root.mjs +2 -2
- package/build-module/form/primitives/field/root.mjs.map +1 -1
- package/build-module/form/primitives/fieldset/description.mjs +20 -4
- package/build-module/form/primitives/fieldset/description.mjs.map +3 -3
- package/build-module/form/primitives/fieldset/details.mjs +3 -3
- package/build-module/form/primitives/fieldset/details.mjs.map +2 -2
- package/build-module/form/primitives/fieldset/legend.mjs +8 -7
- package/build-module/form/primitives/fieldset/legend.mjs.map +2 -2
- 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 +23 -7
- package/build-module/form/primitives/input/input.mjs.map +3 -3
- package/build-module/form/primitives/input-layout/input-layout.mjs +15 -5
- package/build-module/form/primitives/input-layout/input-layout.mjs.map +3 -3
- package/build-module/form/primitives/input-layout/slot.mjs +6 -5
- 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 +9 -9
- package/build-module/form/primitives/select/popup.mjs.map +2 -2
- package/build-module/form/primitives/select/trigger.mjs +6 -6
- package/build-module/form/primitives/select/trigger.mjs.map +2 -2
- package/build-module/form/primitives/textarea/textarea.mjs +23 -4
- package/build-module/form/primitives/textarea/textarea.mjs.map +3 -3
- 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 +18 -8
- package/build-module/link/link.mjs.map +3 -3
- package/build-module/notice/action-button.mjs +3 -3
- package/build-module/notice/action-button.mjs.map +2 -2
- package/build-module/notice/action-link.mjs +3 -3
- package/build-module/notice/action-link.mjs.map +2 -2
- package/build-module/notice/actions.mjs +3 -3
- package/build-module/notice/actions.mjs.map +2 -2
- package/build-module/notice/close-icon.mjs +3 -3
- package/build-module/notice/close-icon.mjs.map +2 -2
- package/build-module/notice/description.mjs +3 -3
- package/build-module/notice/description.mjs.map +2 -2
- package/build-module/notice/index.mjs.map +1 -1
- package/build-module/notice/root.mjs +5 -5
- package/build-module/notice/root.mjs.map +2 -2
- package/build-module/notice/title.mjs +3 -3
- package/build-module/notice/title.mjs.map +2 -2
- package/build-module/popover/arrow.mjs +59 -0
- package/build-module/popover/arrow.mjs.map +7 -0
- package/build-module/popover/close.mjs +20 -0
- package/build-module/popover/close.mjs.map +7 -0
- package/build-module/popover/context.mjs +57 -0
- package/build-module/popover/context.mjs.map +7 -0
- package/build-module/popover/description.mjs +35 -0
- package/build-module/popover/description.mjs.map +7 -0
- package/build-module/popover/index.mjs +18 -0
- package/build-module/popover/index.mjs.map +7 -0
- package/build-module/popover/popup.mjs +105 -0
- package/build-module/popover/popup.mjs.map +7 -0
- package/build-module/popover/root.mjs +10 -0
- package/build-module/popover/root.mjs.map +7 -0
- package/build-module/popover/title.mjs +31 -0
- package/build-module/popover/title.mjs.map +7 -0
- package/build-module/popover/trigger.mjs +13 -0
- package/build-module/popover/trigger.mjs.map +7 -0
- package/build-module/popover/types.mjs +1 -0
- package/build-module/popover/types.mjs.map +7 -0
- 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 -4
- 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 +20 -5
- package/build-module/text/text.mjs.map +3 -3
- package/build-module/tooltip/popup.mjs +7 -6
- package/build-module/tooltip/popup.mjs.map +2 -2
- 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 +2 -2
- package/build-types/alert-dialog/context.d.ts +11 -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 +18 -0
- package/build-types/alert-dialog/root.d.ts.map +1 -0
- package/build-types/alert-dialog/stories/index.story.d.ts +56 -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 +7 -0
- package/build-types/alert-dialog/trigger.d.ts.map +1 -0
- package/build-types/alert-dialog/types.d.ts +105 -0
- package/build-types/alert-dialog/types.d.ts.map +1 -0
- package/build-types/badge/badge.d.ts.map +1 -1
- package/build-types/button/button.d.ts.map +1 -1
- package/build-types/card/stories/index.story.d.ts.map +1 -1
- package/build-types/card/title.d.ts.map +1 -1
- package/build-types/collapsible/panel.d.ts +2 -1
- package/build-types/collapsible/panel.d.ts.map +1 -1
- package/build-types/collapsible/root.d.ts +2 -1
- package/build-types/collapsible/root.d.ts.map +1 -1
- package/build-types/collapsible/trigger.d.ts +2 -1
- package/build-types/collapsible/trigger.d.ts.map +1 -1
- 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 +8 -6
- package/build-types/dialog/stories/index.story.d.ts.map +1 -1
- package/build-types/dialog/title.d.ts +12 -2
- package/build-types/dialog/title.d.ts.map +1 -1
- package/build-types/dialog/types.d.ts +13 -6
- 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/description.d.ts +2 -1
- package/build-types/form/primitives/field/description.d.ts.map +1 -1
- package/build-types/form/primitives/field/details.d.ts +2 -1
- package/build-types/form/primitives/field/details.d.ts.map +1 -1
- package/build-types/form/primitives/field/label.d.ts +2 -1
- package/build-types/form/primitives/field/label.d.ts.map +1 -1
- package/build-types/form/primitives/field/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/fieldset/description.d.ts +2 -1
- package/build-types/form/primitives/fieldset/description.d.ts.map +1 -1
- package/build-types/form/primitives/fieldset/details.d.ts +2 -1
- package/build-types/form/primitives/fieldset/details.d.ts.map +1 -1
- package/build-types/form/primitives/fieldset/legend.d.ts +2 -1
- package/build-types/form/primitives/fieldset/legend.d.ts.map +1 -1
- package/build-types/form/primitives/fieldset/root.d.ts +2 -1
- package/build-types/form/primitives/fieldset/root.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/input.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/input-layout.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/primitives/select/item.d.ts +6 -2
- package/build-types/form/primitives/select/item.d.ts.map +1 -1
- package/build-types/form/primitives/select/popup.d.ts +11 -1
- package/build-types/form/primitives/select/popup.d.ts.map +1 -1
- package/build-types/form/primitives/select/trigger.d.ts +12 -2
- package/build-types/form/primitives/select/trigger.d.ts.map +1 -1
- package/build-types/form/primitives/select/types.d.ts +13 -3
- package/build-types/form/primitives/select/types.d.ts.map +1 -1
- package/build-types/form/primitives/textarea/textarea.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/link/link.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/popover/arrow.d.ts +10 -0
- package/build-types/popover/arrow.d.ts.map +1 -0
- package/build-types/popover/close.d.ts +11 -0
- package/build-types/popover/close.d.ts.map +1 -0
- package/build-types/popover/context.d.ts +22 -0
- package/build-types/popover/context.d.ts.map +1 -0
- package/build-types/popover/description.d.ts +10 -0
- package/build-types/popover/description.d.ts.map +1 -0
- package/build-types/popover/index.d.ts +9 -0
- package/build-types/popover/index.d.ts.map +1 -0
- package/build-types/popover/popup.d.ts +11 -0
- package/build-types/popover/popup.d.ts.map +1 -0
- package/build-types/popover/root.d.ts +37 -0
- package/build-types/popover/root.d.ts.map +1 -0
- package/build-types/popover/stories/index.story.d.ts +211 -0
- package/build-types/popover/stories/index.story.d.ts.map +1 -0
- package/build-types/popover/stories/utils.d.ts +25 -0
- package/build-types/popover/stories/utils.d.ts.map +1 -0
- package/build-types/popover/test/index.test.d.ts +2 -0
- package/build-types/popover/test/index.test.d.ts.map +1 -0
- package/build-types/popover/title.d.ts +20 -0
- package/build-types/popover/title.d.ts.map +1 -0
- package/build-types/popover/trigger.d.ts +10 -0
- package/build-types/popover/trigger.d.ts.map +1 -0
- package/build-types/popover/types.d.ts +83 -0
- package/build-types/popover/types.d.ts.map +1 -0
- package/build-types/tabs/context.d.ts +26 -0
- package/build-types/tabs/context.d.ts.map +1 -0
- package/build-types/tabs/list.d.ts +2 -1
- package/build-types/tabs/list.d.ts.map +1 -1
- package/build-types/tabs/panel.d.ts +2 -1
- package/build-types/tabs/panel.d.ts.map +1 -1
- package/build-types/tabs/root.d.ts +2 -1
- package/build-types/tabs/root.d.ts.map +1 -1
- package/build-types/tabs/tab.d.ts +2 -1
- package/build-types/tabs/tab.d.ts.map +1 -1
- package/build-types/text/stories/index.story.d.ts +4 -0
- package/build-types/text/stories/index.story.d.ts.map +1 -1
- package/build-types/text/text.d.ts.map +1 -1
- package/build-types/tooltip/popup.d.ts.map +1 -1
- package/build-types/tooltip/root.d.ts +13 -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/tooltip/stories/usage-guidelines.story.d.ts +21 -0
- package/build-types/tooltip/stories/usage-guidelines.story.d.ts.map +1 -0
- package/build-types/tooltip/types.d.ts +4 -0
- package/build-types/tooltip/types.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/types.d.ts +6 -2
- package/build-types/utils/types.d.ts.map +1 -1
- package/build-types/utils/use-deprioritized-initial-focus.d.ts +36 -0
- package/build-types/utils/use-deprioritized-initial-focus.d.ts.map +1 -0
- package/build-types/visually-hidden/stories/index.story.d.ts +7 -0
- package/build-types/visually-hidden/stories/index.story.d.ts.map +1 -1
- package/build-types/visually-hidden/visually-hidden.d.ts +34 -0
- package/build-types/visually-hidden/visually-hidden.d.ts.map +1 -1
- package/package.json +17 -16
- package/src/alert-dialog/context.tsx +22 -0
- package/src/alert-dialog/index.ts +3 -0
- package/src/alert-dialog/popup.tsx +116 -0
- package/src/alert-dialog/root.tsx +226 -0
- package/src/alert-dialog/stories/index.story.tsx +305 -0
- package/src/alert-dialog/style.module.css +21 -0
- package/src/alert-dialog/test/index.test.tsx +1509 -0
- package/src/alert-dialog/trigger.tsx +15 -0
- package/src/alert-dialog/types.ts +119 -0
- package/src/badge/badge.tsx +11 -14
- package/src/badge/style.module.css +0 -4
- package/src/button/button.tsx +2 -0
- package/src/button/style.module.css +9 -3
- package/src/card/stories/index.story.tsx +4 -5
- package/src/card/style.module.css +4 -10
- package/src/card/test/index.test.tsx +17 -1
- package/src/card/title.tsx +14 -12
- package/src/collapsible-card/content.tsx +16 -3
- package/src/collapsible-card/context.ts +7 -0
- package/src/collapsible-card/header-description.tsx +43 -0
- package/src/collapsible-card/header.tsx +47 -24
- package/src/collapsible-card/index.ts +2 -1
- package/src/collapsible-card/stories/index.story.tsx +102 -4
- package/src/collapsible-card/style.module.css +34 -2
- package/src/collapsible-card/test/index.test.tsx +96 -9
- 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 +23 -3
- package/src/dialog/stories/index.story.tsx +33 -28
- package/src/dialog/style.module.css +18 -14
- package/src/dialog/test/index.test.tsx +180 -4
- package/src/dialog/title.tsx +21 -9
- package/src/dialog/types.ts +20 -6
- package/src/empty-state/actions.tsx +24 -0
- package/src/empty-state/description.tsx +31 -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 +26 -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 +26 -0
- package/src/empty-state/test/visual.test.tsx +17 -0
- package/src/empty-state/title.tsx +29 -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/description.tsx +6 -1
- package/src/form/primitives/field/details.tsx +4 -2
- package/src/form/primitives/field/label.tsx +9 -5
- package/src/form/primitives/field/stories/index.story.tsx +2 -7
- package/src/form/primitives/field/test/index.test.tsx +11 -0
- package/src/form/primitives/fieldset/description.tsx +9 -1
- package/src/form/primitives/fieldset/legend.tsx +9 -4
- package/src/form/primitives/fieldset/stories/index.story.tsx +2 -7
- package/src/form/primitives/fieldset/test/index.test.tsx +22 -0
- package/src/form/primitives/input/input.tsx +6 -1
- package/src/form/primitives/input/stories/index.story.tsx +7 -0
- package/src/form/primitives/input/style.module.css +4 -0
- package/src/form/primitives/input-layout/input-layout.tsx +2 -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/input-layout/style.module.css +3 -3
- package/src/form/primitives/select/popup.tsx +5 -2
- package/src/form/primitives/select/test/index.test.tsx +60 -1
- package/src/form/primitives/select/types.ts +14 -4
- package/src/form/primitives/stories/overview.mdx +15 -0
- package/src/form/primitives/textarea/textarea.tsx +11 -2
- package/src/form/stories/shared.tsx +21 -0
- package/src/form/types.ts +34 -0
- package/src/index.ts +4 -1
- package/src/link/link.tsx +2 -0
- package/src/link/style.module.css +11 -1
- package/src/notice/index.ts +0 -2
- package/src/notice/style.module.css +6 -6
- package/src/popover/arrow.tsx +49 -0
- package/src/popover/close.tsx +24 -0
- package/src/popover/context.tsx +100 -0
- package/src/popover/description.tsx +29 -0
- package/src/popover/index.ts +9 -0
- package/src/popover/popup.tsx +106 -0
- package/src/popover/root.tsx +41 -0
- package/src/popover/stories/index.story.tsx +1315 -0
- package/src/popover/stories/utils.tsx +91 -0
- package/src/popover/style.module.css +64 -0
- package/src/popover/test/index.test.tsx +727 -0
- package/src/popover/title.tsx +47 -0
- package/src/popover/trigger.tsx +17 -0
- package/src/popover/types.ts +113 -0
- package/src/tabs/context.tsx +170 -0
- package/src/tabs/list.tsx +0 -1
- package/src/tabs/panel.tsx +3 -0
- package/src/tabs/root.tsx +6 -1
- package/src/tabs/style.module.css +3 -3
- package/src/tabs/tab.tsx +3 -0
- package/src/tabs/test/index.test.tsx +162 -0
- package/src/text/stories/index.story.tsx +4 -2
- package/src/text/style.module.css +62 -36
- package/src/text/test/index.test.tsx +1 -4
- package/src/text/text.tsx +8 -1
- package/src/tooltip/popup.tsx +2 -1
- package/src/tooltip/root.tsx +13 -0
- package/src/tooltip/stories/index.story.tsx +20 -15
- package/src/tooltip/stories/usage-guidelines.mdx +91 -0
- package/src/tooltip/stories/usage-guidelines.story.tsx +119 -0
- package/src/tooltip/style.module.css +2 -2
- package/src/tooltip/test/index.test.tsx +61 -0
- package/src/tooltip/types.ts +5 -0
- package/src/utils/css/field.module.css +12 -9
- package/src/utils/css/focus.module.css +7 -5
- package/src/utils/css/global-css-defense.module.css +117 -0
- package/src/utils/css/item-popup.module.css +3 -2
- 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/types.ts +7 -2
- package/src/utils/use-deprioritized-initial-focus.ts +84 -0
- package/src/visually-hidden/stories/index.story.tsx +25 -0
- package/src/visually-hidden/visually-hidden.tsx +34 -0
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/alert-dialog/popup.tsx", "../../src/dialog/style.module.css", "../../src/alert-dialog/style.module.css"],
|
|
4
|
+
"sourcesContent": ["import { AlertDialog as _AlertDialog } from '@base-ui/react/alert-dialog';\nimport clsx from 'clsx';\nimport { forwardRef, useContext } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\ttype ThemeProvider as ThemeProviderType,\n\tprivateApis as themePrivateApis,\n} from '@wordpress/theme';\n\nimport { Button } from '../button';\nimport dialogStyles from '../dialog/style.module.css';\nimport { unlock } from '../lock-unlock';\nimport { Stack } from '../stack';\nimport { Text } from '../text';\nimport { AlertDialogContext } from './context';\nimport alertDialogStyles from './style.module.css';\nimport type { PopupProps } from './types';\n\nconst ThemeProvider: typeof ThemeProviderType =\n\tunlock( themePrivateApis ).ThemeProvider;\n\nconst Popup = forwardRef< HTMLDivElement, PopupProps >(\n\tfunction AlertDialogPopup(\n\t\t{\n\t\t\tclassName,\n\t\t\tcontainer,\n\t\t\tintent = 'default',\n\t\t\ttitle,\n\t\t\tdescription,\n\t\t\tchildren,\n\t\t\tconfirmButtonText = __( 'OK' ),\n\t\t\tcancelButtonText = __( 'Cancel' ),\n\t\t\t...props\n\t\t},\n\t\tref\n\t) {\n\t\tconst { phase, showSpinner, errorMessage, confirm } =\n\t\t\tuseContext( AlertDialogContext );\n\n\t\tconst confirmClassName =\n\t\t\tintent === 'irreversible'\n\t\t\t\t? alertDialogStyles[ 'irreversible-action' ]\n\t\t\t\t: undefined;\n\n\t\tconst buttonsDisabled = phase !== 'idle' || undefined;\n\n\t\treturn (\n\t\t\t<_AlertDialog.Portal container={ container }>\n\t\t\t\t<_AlertDialog.Backdrop className={ dialogStyles.backdrop } />\n\t\t\t\t<ThemeProvider>\n\t\t\t\t\t<_AlertDialog.Popup\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\tdialogStyles.popup,\n\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\tdialogStyles[ 'is-medium' ]\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\t\t\tgap=\"sm\"\n\t\t\t\t\t\t\tclassName={ alertDialogStyles.header }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\t\tvariant=\"heading-xl\"\n\t\t\t\t\t\t\t\trender={ <_AlertDialog.Title /> }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t{ description && (\n\t\t\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\t\t\tvariant=\"body-md\"\n\t\t\t\t\t\t\t\t\trender={ <_AlertDialog.Description /> }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ description }\n\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t<Stack direction=\"column\" gap=\"md\">\n\t\t\t\t\t\t\t<div className={ dialogStyles.footer }>\n\t\t\t\t\t\t\t\t<_AlertDialog.Close\n\t\t\t\t\t\t\t\t\trender={ <Button variant=\"minimal\" /> }\n\t\t\t\t\t\t\t\t\tdisabled={ buttonsDisabled }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ cancelButtonText }\n\t\t\t\t\t\t\t\t</_AlertDialog.Close>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName={ confirmClassName }\n\t\t\t\t\t\t\t\t\tonClick={ confirm }\n\t\t\t\t\t\t\t\t\tloading={ showSpinner || undefined }\n\t\t\t\t\t\t\t\t\tdisabled={ buttonsDisabled }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ confirmButtonText }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{ errorMessage && (\n\t\t\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\t\t\tvariant=\"body-sm\"\n\t\t\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\t\t\talertDialogStyles[ 'error-message' ]\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ errorMessage }\n\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</_AlertDialog.Popup>\n\t\t\t\t</ThemeProvider>\n\t\t\t</_AlertDialog.Portal>\n\t\t);\n\t}\n);\n\nexport { Popup };\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='0289d42d13']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"0289d42d13\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._074affe4c56b4f2f__backdrop{background-color:#00000059;inset:0;position:fixed;z-index:var(--wp-ui-dialog-z-index,initial);&[data-ending-style],&[data-starting-style]{opacity:0}&[data-open]{opacity:1}@media not (prefers-reduced-motion){transition:opacity .2s ease-out}}._8acaa98861620d4d__popup{background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border-radius:var(--wpds-border-radius-lg,8px);box-shadow:var(--wpds-elevation-lg,0 5px 15px 0 #00000014,0 15px 27px 0 #00000012,0 30px 36px 0 #0000000a,0 50px 43px 0 #00000005);box-sizing:border-box;color:var(--wpds-color-fg-content-neutral,#1e1e1e);font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);font-size:var(--wpds-typography-font-size-md,13px);left:50%;line-height:var(--wpds-typography-line-height-md,24px);max-height:calc(100vh - var(--wpds-dimension-padding-2xl, 24px)*2);min-width:var(--wpds-dimension-surface-width-sm,320px);overflow:auto;padding:var(--wpds-dimension-padding-2xl,24px);position:fixed;top:50%;transform:translate(-50%,-50%);width:calc(100vw - var(--wpds-dimension-padding-2xl, 24px)*2);z-index:var(--wp-ui-dialog-z-index,initial);&[data-ending-style],&[data-starting-style]{opacity:0;transform:translate(-50%,-50%) scale(.9)}@media not (prefers-reduced-motion){transition:opacity .2s cubic-bezier(1,0,.2,1),transform .2s cubic-bezier(1,0,.2,1);&[data-open]{transition:opacity .2s cubic-bezier(.29,0,0,1),transform .2s cubic-bezier(.29,0,0,1)}}@media (min-width:480px){min-width:var(--wpds-dimension-surface-width-md,400px)}&._7acfa67ebf092988__is-small{max-width:var(--wpds-dimension-surface-width-md,400px)}&._1eeeed880cb5769d__is-medium{max-width:var(--wpds-dimension-surface-width-lg,560px)}&._99f900b2267e22d0__is-large{max-width:var(--wpds-dimension-surface-width-2xl,960px)}&.b49f7ff9c06fe387__is-stretch{max-width:none}&.dcd4c2f5036cbf1a__is-full{height:100vh}}._76fb3b28fcbd45fc__header{align-items:center;display:flex;gap:var(--wpds-dimension-gap-sm,8px);margin-bottom:var(--wpds-dimension-gap-lg,16px)}.f636832002af749e__title{--_gcd-heading-margin:0 auto 0 0;margin-inline-end:auto;&:dir(rtl){--_gcd-heading-margin:0 0 0 auto}}._00eeb4f220cddae3__footer{align-items:center;display:flex;gap:var(--wpds-dimension-gap-sm,8px);justify-content:flex-end;margin-top:var(--wpds-dimension-gap-lg,16px);padding-top:var(--wpds-dimension-padding-lg,16px)}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"backdrop\":\"_074affe4c56b4f2f__backdrop\",\"popup\":\"_8acaa98861620d4d__popup\",\"is-small\":\"_7acfa67ebf092988__is-small\",\"is-medium\":\"_1eeeed880cb5769d__is-medium\",\"is-large\":\"_99f900b2267e22d0__is-large\",\"is-stretch\":\"b49f7ff9c06fe387__is-stretch\",\"is-full\":\"dcd4c2f5036cbf1a__is-full\",\"header\":\"_76fb3b28fcbd45fc__header\",\"title\":\"f636832002af749e__title\",\"footer\":\"_00eeb4f220cddae3__footer\"};\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='113a8b8edd']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"113a8b8edd\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._837a6eb481252f50__header{margin-bottom:var(--wpds-dimension-gap-lg,16px)}.dbff6618234a2a93__error-message{align-self:flex-end;color:var(--wpds-color-fg-content-error,#470000)}}@layer wp-ui-compositions{._2ddc2fc9155a1dad__irreversible-action{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-error-strong,#cc1818);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-error-strong-active,#b90000);--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-error-strong,#f2efef);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-error-strong-active,#f2efef)}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"header\":\"_837a6eb481252f50__header\",\"error-message\":\"dbff6618234a2a93__error-message\",\"irreversible-action\":\"_2ddc2fc9155a1dad__irreversible-action\"};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["style_default", "style_default"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
// packages/ui/src/alert-dialog/root.tsx
|
|
2
|
+
import { AlertDialog as _AlertDialog } from "@base-ui/react/alert-dialog";
|
|
3
|
+
import { speak } from "@wordpress/a11y";
|
|
4
|
+
import {
|
|
5
|
+
useCallback,
|
|
6
|
+
useEffect,
|
|
7
|
+
useMemo,
|
|
8
|
+
useRef,
|
|
9
|
+
useState
|
|
10
|
+
} from "@wordpress/element";
|
|
11
|
+
import { AlertDialogContext } from "./context.mjs";
|
|
12
|
+
import { jsx } from "react/jsx-runtime";
|
|
13
|
+
function isThenable(value) {
|
|
14
|
+
return value !== null && value !== void 0 && typeof value.then === "function";
|
|
15
|
+
}
|
|
16
|
+
function Root({
|
|
17
|
+
children,
|
|
18
|
+
open: openProp,
|
|
19
|
+
onOpenChange,
|
|
20
|
+
defaultOpen,
|
|
21
|
+
onConfirm
|
|
22
|
+
}) {
|
|
23
|
+
const [internalOpen, setInternalOpen] = useState(defaultOpen ?? false);
|
|
24
|
+
const [phase, setPhase] = useState("idle");
|
|
25
|
+
const [showSpinner, setShowSpinner] = useState(false);
|
|
26
|
+
const [errorMessage, setErrorMessage] = useState();
|
|
27
|
+
const actionsRef = useRef(null);
|
|
28
|
+
const onConfirmRef = useRef(onConfirm);
|
|
29
|
+
onConfirmRef.current = onConfirm;
|
|
30
|
+
const phaseRef = useRef(phase);
|
|
31
|
+
phaseRef.current = phase;
|
|
32
|
+
const confirmIdRef = useRef(0);
|
|
33
|
+
const effectiveOpen = openProp ?? internalOpen;
|
|
34
|
+
useEffect(() => {
|
|
35
|
+
if (effectiveOpen && phase === "closing") {
|
|
36
|
+
phaseRef.current = "idle";
|
|
37
|
+
setPhase("idle");
|
|
38
|
+
setShowSpinner(false);
|
|
39
|
+
}
|
|
40
|
+
}, [effectiveOpen, phase]);
|
|
41
|
+
const handleOpenChange = useCallback(
|
|
42
|
+
(nextOpen, eventDetails) => {
|
|
43
|
+
if (!nextOpen && phaseRef.current === "pending") {
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
if (!nextOpen && phaseRef.current === "idle") {
|
|
47
|
+
phaseRef.current = "closing";
|
|
48
|
+
setPhase("closing");
|
|
49
|
+
}
|
|
50
|
+
setInternalOpen(nextOpen);
|
|
51
|
+
onOpenChange?.(nextOpen, eventDetails);
|
|
52
|
+
},
|
|
53
|
+
[onOpenChange]
|
|
54
|
+
);
|
|
55
|
+
const confirm = useCallback(async () => {
|
|
56
|
+
if (phaseRef.current !== "idle") {
|
|
57
|
+
return;
|
|
58
|
+
}
|
|
59
|
+
phaseRef.current = "pending";
|
|
60
|
+
setPhase("pending");
|
|
61
|
+
setErrorMessage(void 0);
|
|
62
|
+
const id = ++confirmIdRef.current;
|
|
63
|
+
try {
|
|
64
|
+
const rawResult = onConfirmRef.current?.();
|
|
65
|
+
if (isThenable(rawResult)) {
|
|
66
|
+
setShowSpinner(true);
|
|
67
|
+
}
|
|
68
|
+
const result = await Promise.resolve(rawResult);
|
|
69
|
+
if (confirmIdRef.current !== id) {
|
|
70
|
+
return;
|
|
71
|
+
}
|
|
72
|
+
if (result?.error) {
|
|
73
|
+
phaseRef.current = "idle";
|
|
74
|
+
setPhase("idle");
|
|
75
|
+
setShowSpinner(false);
|
|
76
|
+
setErrorMessage(result.error);
|
|
77
|
+
speak(result.error, "assertive");
|
|
78
|
+
return;
|
|
79
|
+
}
|
|
80
|
+
const shouldClose = result?.close !== false;
|
|
81
|
+
if (shouldClose) {
|
|
82
|
+
phaseRef.current = "closing";
|
|
83
|
+
setPhase("closing");
|
|
84
|
+
actionsRef.current?.close();
|
|
85
|
+
} else {
|
|
86
|
+
phaseRef.current = "idle";
|
|
87
|
+
setPhase("idle");
|
|
88
|
+
setShowSpinner(false);
|
|
89
|
+
}
|
|
90
|
+
} catch (error) {
|
|
91
|
+
if (confirmIdRef.current !== id) {
|
|
92
|
+
return;
|
|
93
|
+
}
|
|
94
|
+
phaseRef.current = "idle";
|
|
95
|
+
setPhase("idle");
|
|
96
|
+
setShowSpinner(false);
|
|
97
|
+
console.error(error);
|
|
98
|
+
}
|
|
99
|
+
}, []);
|
|
100
|
+
const handleOpenChangeComplete = useCallback((open) => {
|
|
101
|
+
if (!open) {
|
|
102
|
+
confirmIdRef.current++;
|
|
103
|
+
phaseRef.current = "idle";
|
|
104
|
+
setPhase("idle");
|
|
105
|
+
setShowSpinner(false);
|
|
106
|
+
setErrorMessage(void 0);
|
|
107
|
+
}
|
|
108
|
+
}, []);
|
|
109
|
+
const contextValue = useMemo(
|
|
110
|
+
() => ({
|
|
111
|
+
phase,
|
|
112
|
+
showSpinner,
|
|
113
|
+
errorMessage,
|
|
114
|
+
confirm
|
|
115
|
+
}),
|
|
116
|
+
[phase, showSpinner, errorMessage, confirm]
|
|
117
|
+
);
|
|
118
|
+
return /* @__PURE__ */ jsx(
|
|
119
|
+
_AlertDialog.Root,
|
|
120
|
+
{
|
|
121
|
+
open: effectiveOpen,
|
|
122
|
+
defaultOpen,
|
|
123
|
+
onOpenChange: handleOpenChange,
|
|
124
|
+
onOpenChangeComplete: handleOpenChangeComplete,
|
|
125
|
+
actionsRef,
|
|
126
|
+
children: /* @__PURE__ */ jsx(AlertDialogContext.Provider, { value: contextValue, children })
|
|
127
|
+
}
|
|
128
|
+
);
|
|
129
|
+
}
|
|
130
|
+
export {
|
|
131
|
+
Root
|
|
132
|
+
};
|
|
133
|
+
//# sourceMappingURL=root.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/alert-dialog/root.tsx"],
|
|
4
|
+
"sourcesContent": ["import { AlertDialog as _AlertDialog } from '@base-ui/react/alert-dialog';\nimport { speak } from '@wordpress/a11y';\nimport {\n\tuseCallback,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n\nimport { AlertDialogContext } from './context';\nimport type { Phase } from './context';\nimport type { RootProps } from './types';\n\nfunction isThenable( value: unknown ): value is PromiseLike< unknown > {\n\treturn (\n\t\tvalue !== null &&\n\t\tvalue !== undefined &&\n\t\ttypeof ( value as PromiseLike< unknown > ).then === 'function'\n\t);\n}\n\n/**\n * A dialog that requires a user response to proceed.\n *\n * Use `AlertDialog.Trigger` to render a button that opens the dialog.\n * Use `AlertDialog.Popup` to render the dialog content.\n * The `AlertDialog.Trigger` is optional \u2014 the dialog can also be controlled\n * via `open` / `onOpenChange` props.\n *\n * For use cases outside the standard confirm/cancel pattern, use the lower-level\n * `Dialog` component directly.\n *\n * See the [Destructive Actions guidelines](https://wordpress.github.io/gutenberg/?path=/docs/design-system-patterns-destructive-actions--docs)\n * for more details on when to use each pattern.\n */\nfunction Root( {\n\tchildren,\n\topen: openProp,\n\tonOpenChange,\n\tdefaultOpen,\n\tonConfirm,\n}: RootProps ) {\n\tconst [ internalOpen, setInternalOpen ] = useState( defaultOpen ?? false );\n\n\t// Internal state machine for the confirm-and-close lifecycle.\n\t//\n\t// Phase transitions:\n\t//\n\t// idle \u2500\u2500> pending \u2500\u2500> closing \u2500\u2500> idle\n\t// (confirm (success, (animation\n\t// clicked) close) complete)\n\t//\n\t// idle \u2500\u2500> pending \u2500\u2500> idle\n\t// (confirm (error, or\n\t// clicked) {close:false})\n\t//\n\t// idle \u2500\u2500> closing \u2500\u2500> idle\n\t// (cancel/ (animation\n\t// escape) complete)\n\t//\n\t// `showSpinner` tracks whether the confirm button shows a loading\n\t// indicator. It is orthogonal to `phase`:\n\t//\n\t// Scenario | pending | closing\n\t// --------------------------+---------+---------\n\t// Sync onConfirm | false | false\n\t// Async onConfirm (success) | true | true\n\t// Async onConfirm (error) | true | n/a (-> idle)\n\t// Cancel / Escape | n/a | false\n\t//\n\t// Buttons are disabled whenever phase !== 'idle'.\n\t// Dismiss (Escape / Cancel) is blocked during 'pending'.\n\tconst [ phase, setPhase ] = useState< Phase >( 'idle' );\n\tconst [ showSpinner, setShowSpinner ] = useState( false );\n\tconst [ errorMessage, setErrorMessage ] = useState< string >();\n\n\tconst actionsRef = useRef< _AlertDialog.Root.Actions | null >( null );\n\n\tconst onConfirmRef = useRef( onConfirm );\n\tonConfirmRef.current = onConfirm;\n\n\t// Ref keeps phase accessible synchronously from callbacks that may\n\t// run between a setState call and the subsequent React re-render.\n\tconst phaseRef = useRef( phase );\n\tphaseRef.current = phase;\n\n\t// Generation counter \u2014 safety net for the edge case where the component\n\t// unmounts while an async confirm is in flight. Also incremented when\n\t// the dialog finishes closing, so a stale promise settling after a\n\t// dismiss+reopen cycle is silently discarded.\n\tconst confirmIdRef = useRef( 0 );\n\n\tconst effectiveOpen = openProp ?? internalOpen;\n\n\t// Safety net: if the consumer keeps `open={true}` after a confirm\n\t// (i.e. does not react to `onOpenChange`), the phase would be stuck\n\t// at 'closing'. Detect the contradiction and reset to idle.\n\tuseEffect( () => {\n\t\tif ( effectiveOpen && phase === 'closing' ) {\n\t\t\tphaseRef.current = 'idle';\n\t\t\tsetPhase( 'idle' );\n\t\t\tsetShowSpinner( false );\n\t\t}\n\t}, [ effectiveOpen, phase ] );\n\n\tconst handleOpenChange = useCallback(\n\t\t(\n\t\t\tnextOpen: boolean,\n\t\t\teventDetails: _AlertDialog.Root.ChangeEventDetails\n\t\t) => {\n\t\t\t// Block dismiss while a confirm action is pending.\n\t\t\tif ( ! nextOpen && phaseRef.current === 'pending' ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! nextOpen && phaseRef.current === 'idle' ) {\n\t\t\t\tphaseRef.current = 'closing';\n\t\t\t\tsetPhase( 'closing' );\n\t\t\t}\n\n\t\t\tsetInternalOpen( nextOpen );\n\t\t\tonOpenChange?.( nextOpen, eventDetails );\n\t\t},\n\t\t[ onOpenChange ]\n\t);\n\n\tconst confirm = useCallback( async () => {\n\t\tif ( phaseRef.current !== 'idle' ) {\n\t\t\treturn;\n\t\t}\n\n\t\tphaseRef.current = 'pending';\n\t\tsetPhase( 'pending' );\n\t\tsetErrorMessage( undefined );\n\n\t\tconst id = ++confirmIdRef.current;\n\n\t\ttry {\n\t\t\tconst rawResult = onConfirmRef.current?.();\n\n\t\t\t// Show spinner only for async handlers (Promises).\n\t\t\t// Sync handlers resolve in the same tick \u2014 no spinner needed.\n\t\t\tif ( isThenable( rawResult ) ) {\n\t\t\t\tsetShowSpinner( true );\n\t\t\t}\n\n\t\t\tconst result = await Promise.resolve( rawResult );\n\n\t\t\t// Discard if the component unmounted or the dialog was\n\t\t\t// dismissed and reopened while the promise was in flight.\n\t\t\tif ( confirmIdRef.current !== id ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// An error message implies the dialog should stay open.\n\t\t\tif ( result?.error ) {\n\t\t\t\tphaseRef.current = 'idle';\n\t\t\t\tsetPhase( 'idle' );\n\t\t\t\tsetShowSpinner( false );\n\t\t\t\tsetErrorMessage( result.error );\n\t\t\t\tspeak( result.error, 'assertive' );\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst shouldClose = result?.close !== false;\n\n\t\t\tif ( shouldClose ) {\n\t\t\t\tphaseRef.current = 'closing';\n\t\t\t\tsetPhase( 'closing' );\n\t\t\t\tactionsRef.current?.close();\n\t\t\t} else {\n\t\t\t\tphaseRef.current = 'idle';\n\t\t\t\tsetPhase( 'idle' );\n\t\t\t\tsetShowSpinner( false );\n\t\t\t}\n\t\t} catch ( error ) {\n\t\t\tif ( confirmIdRef.current !== id ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tphaseRef.current = 'idle';\n\t\t\tsetPhase( 'idle' );\n\t\t\tsetShowSpinner( false );\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.error( error );\n\t\t}\n\t}, [] );\n\n\tconst handleOpenChangeComplete = useCallback( ( open: boolean ) => {\n\t\tif ( ! open ) {\n\t\t\t// Invalidate any in-flight async so a stale promise settling\n\t\t\t// after dismiss+reopen doesn't close the new session.\n\t\t\tconfirmIdRef.current++;\n\t\t\tphaseRef.current = 'idle';\n\t\t\tsetPhase( 'idle' );\n\t\t\tsetShowSpinner( false );\n\t\t\tsetErrorMessage( undefined );\n\t\t}\n\t}, [] );\n\n\tconst contextValue = useMemo(\n\t\t() => ( {\n\t\t\tphase,\n\t\t\tshowSpinner,\n\t\t\terrorMessage,\n\t\t\tconfirm,\n\t\t} ),\n\t\t[ phase, showSpinner, errorMessage, confirm ]\n\t);\n\n\treturn (\n\t\t<_AlertDialog.Root\n\t\t\topen={ effectiveOpen }\n\t\t\tdefaultOpen={ defaultOpen }\n\t\t\tonOpenChange={ handleOpenChange }\n\t\t\tonOpenChangeComplete={ handleOpenChangeComplete }\n\t\t\tactionsRef={ actionsRef }\n\t\t>\n\t\t\t<AlertDialogContext.Provider value={ contextValue }>\n\t\t\t\t{ children }\n\t\t\t</AlertDialogContext.Provider>\n\t\t</_AlertDialog.Root>\n\t);\n}\n\nexport { Root };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// packages/ui/src/alert-dialog/trigger.tsx
|
|
2
|
+
import { AlertDialog as _AlertDialog } from "@base-ui/react/alert-dialog";
|
|
3
|
+
import { forwardRef } from "@wordpress/element";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
var Trigger = forwardRef(
|
|
6
|
+
function AlertDialogTrigger(props, ref) {
|
|
7
|
+
return /* @__PURE__ */ jsx(_AlertDialog.Trigger, { ref, ...props });
|
|
8
|
+
}
|
|
9
|
+
);
|
|
10
|
+
export {
|
|
11
|
+
Trigger
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=trigger.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/alert-dialog/trigger.tsx"],
|
|
4
|
+
"sourcesContent": ["import { AlertDialog as _AlertDialog } from '@base-ui/react/alert-dialog';\nimport { forwardRef } from '@wordpress/element';\n\nimport type { TriggerProps } from './types';\n\n/**\n * Renders a button that opens the alert dialog when clicked.\n */\nconst Trigger = forwardRef< HTMLButtonElement, TriggerProps >(\n\tfunction AlertDialogTrigger( props, ref ) {\n\t\treturn <_AlertDialog.Trigger ref={ ref } { ...props } />;\n\t}\n);\n\nexport { Trigger };\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,eAAe,oBAAoB;AAC5C,SAAS,kBAAkB;AASlB;AAFT,IAAM,UAAU;AAAA,EACf,SAAS,mBAAoB,OAAO,KAAM;AACzC,WAAO,oBAAC,aAAa,SAAb,EAAqB,KAAc,GAAG,OAAQ;AAAA,EACvD;AACD;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=types.mjs.map
|
|
@@ -1,33 +1,33 @@
|
|
|
1
1
|
// packages/ui/src/badge/badge.tsx
|
|
2
|
-
import { useRender, mergeProps } from "@base-ui/react";
|
|
3
2
|
import clsx from "clsx";
|
|
4
3
|
import { forwardRef } from "@wordpress/element";
|
|
5
4
|
|
|
6
5
|
// packages/ui/src/badge/style.module.css
|
|
7
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
6
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='d6a685e1aa']")) {
|
|
8
7
|
const style = document.createElement("style");
|
|
9
|
-
style.setAttribute("data-wp-hash", "
|
|
10
|
-
style.appendChild(document.createTextNode(
|
|
8
|
+
style.setAttribute("data-wp-hash", "d6a685e1aa");
|
|
9
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._96e6251aad1a6136__badge{border-radius:var(--wpds-border-radius-lg,8px);padding-block:var(--wpds-dimension-padding-xs,4px);padding-inline:var(--wpds-dimension-padding-sm,8px)}._99f7158cb520f750__is-high-intent{background-color:var(--wpds-color-bg-surface-error,#f6e6e3);color:var(--wpds-color-fg-content-error,#470000)}.c20ebef2365bc8b7__is-medium-intent{background-color:var(--wpds-color-bg-surface-warning,#fde6be);color:var(--wpds-color-fg-content-warning,#2e1900)}._365e1626c6202e52__is-low-intent{background-color:var(--wpds-color-bg-surface-caution,#fee995);color:var(--wpds-color-fg-content-caution,#281d00)}._33f8198127ddf4ef__is-stable-intent{background-color:var(--wpds-color-bg-surface-success,#c6f7cd);color:var(--wpds-color-fg-content-success,#002900)}._04c1aca8fc449412__is-informational-intent{background-color:var(--wpds-color-bg-surface-info,#deebfa);color:var(--wpds-color-fg-content-info,#001b4f)}._90726e69d495ec19__is-draft-intent{background-color:var(--wpds-color-bg-surface-neutral-weak,#f4f4f4);color:var(--wpds-color-fg-content-neutral,#1e1e1e)}._898f4a544993bd39__is-none-intent{background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border:var(--wpds-border-width-xs,1px) solid var(--wpds-color-stroke-surface-neutral,#dbdbdb);color:var(--wpds-color-fg-content-neutral,#1e1e1e);padding-block:calc(var(--wpds-dimension-padding-xs, 4px) - var(--wpds-border-width-xs, 1px));padding-inline:calc(var(--wpds-dimension-padding-sm, 8px) - var(--wpds-border-width-xs, 1px))}}"));
|
|
11
10
|
document.head.appendChild(style);
|
|
12
11
|
}
|
|
13
12
|
var style_default = { "badge": "_96e6251aad1a6136__badge", "is-high-intent": "_99f7158cb520f750__is-high-intent", "is-medium-intent": "c20ebef2365bc8b7__is-medium-intent", "is-low-intent": "_365e1626c6202e52__is-low-intent", "is-stable-intent": "_33f8198127ddf4ef__is-stable-intent", "is-informational-intent": "_04c1aca8fc449412__is-informational-intent", "is-draft-intent": "_90726e69d495ec19__is-draft-intent", "is-none-intent": "_898f4a544993bd39__is-none-intent" };
|
|
14
13
|
|
|
15
14
|
// packages/ui/src/badge/badge.tsx
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
15
|
+
import { Text } from "../text/index.mjs";
|
|
16
|
+
import { jsx } from "react/jsx-runtime";
|
|
17
|
+
var Badge = forwardRef(function Badge2({ intent = "none", className, ...props }, ref) {
|
|
18
|
+
return /* @__PURE__ */ jsx(
|
|
19
|
+
Text,
|
|
20
|
+
{
|
|
21
|
+
ref,
|
|
22
22
|
className: clsx(
|
|
23
23
|
style_default.badge,
|
|
24
24
|
style_default[`is-${intent}-intent`],
|
|
25
25
|
className
|
|
26
26
|
),
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
27
|
+
...props,
|
|
28
|
+
variant: "body-sm"
|
|
29
|
+
}
|
|
30
|
+
);
|
|
31
31
|
});
|
|
32
32
|
export {
|
|
33
33
|
Badge
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/badge/badge.tsx", "../../src/badge/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import
|
|
5
|
-
"mappings": ";AAAA,
|
|
4
|
+
"sourcesContent": ["import clsx from 'clsx';\nimport { forwardRef } from '@wordpress/element';\nimport { type BadgeProps } from './types';\nimport styles from './style.module.css';\nimport { Text } from '../text';\n\n/**\n * A badge component for displaying labels with semantic intent.\n */\nexport const Badge = forwardRef< HTMLSpanElement, BadgeProps >( function Badge(\n\t{ intent = 'none', className, ...props },\n\tref\n) {\n\treturn (\n\t\t<Text\n\t\t\tref={ ref }\n\t\t\tclassName={ clsx(\n\t\t\t\tstyles.badge,\n\t\t\t\tstyles[ `is-${ intent }-intent` ],\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\t{ ...props }\n\t\t\tvariant=\"body-sm\"\n\t\t/>\n\t);\n} );\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='d6a685e1aa']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"d6a685e1aa\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._96e6251aad1a6136__badge{border-radius:var(--wpds-border-radius-lg,8px);padding-block:var(--wpds-dimension-padding-xs,4px);padding-inline:var(--wpds-dimension-padding-sm,8px)}._99f7158cb520f750__is-high-intent{background-color:var(--wpds-color-bg-surface-error,#f6e6e3);color:var(--wpds-color-fg-content-error,#470000)}.c20ebef2365bc8b7__is-medium-intent{background-color:var(--wpds-color-bg-surface-warning,#fde6be);color:var(--wpds-color-fg-content-warning,#2e1900)}._365e1626c6202e52__is-low-intent{background-color:var(--wpds-color-bg-surface-caution,#fee995);color:var(--wpds-color-fg-content-caution,#281d00)}._33f8198127ddf4ef__is-stable-intent{background-color:var(--wpds-color-bg-surface-success,#c6f7cd);color:var(--wpds-color-fg-content-success,#002900)}._04c1aca8fc449412__is-informational-intent{background-color:var(--wpds-color-bg-surface-info,#deebfa);color:var(--wpds-color-fg-content-info,#001b4f)}._90726e69d495ec19__is-draft-intent{background-color:var(--wpds-color-bg-surface-neutral-weak,#f4f4f4);color:var(--wpds-color-fg-content-neutral,#1e1e1e)}._898f4a544993bd39__is-none-intent{background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border:var(--wpds-border-width-xs,1px) solid var(--wpds-color-stroke-surface-neutral,#dbdbdb);color:var(--wpds-color-fg-content-neutral,#1e1e1e);padding-block:calc(var(--wpds-dimension-padding-xs, 4px) - var(--wpds-border-width-xs, 1px));padding-inline:calc(var(--wpds-dimension-padding-sm, 8px) - var(--wpds-border-width-xs, 1px))}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"badge\":\"_96e6251aad1a6136__badge\",\"is-high-intent\":\"_99f7158cb520f750__is-high-intent\",\"is-medium-intent\":\"c20ebef2365bc8b7__is-medium-intent\",\"is-low-intent\":\"_365e1626c6202e52__is-low-intent\",\"is-stable-intent\":\"_33f8198127ddf4ef__is-stable-intent\",\"is-informational-intent\":\"_04c1aca8fc449412__is-informational-intent\",\"is-draft-intent\":\"_90726e69d495ec19__is-draft-intent\",\"is-none-intent\":\"_898f4a544993bd39__is-none-intent\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,kBAAkB;;;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,ykDAAykD,CAAC;AACpnD,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,SAAQ,4BAA2B,kBAAiB,qCAAoC,oBAAmB,sCAAqC,iBAAgB,oCAAmC,oBAAmB,uCAAsC,2BAA0B,8CAA6C,mBAAkB,sCAAqC,kBAAiB,oCAAmC;;;ADF9b,SAAS,YAAY;AAUnB;AALK,IAAM,QAAQ,WAA2C,SAASA,OACxE,EAAE,SAAS,QAAQ,WAAW,GAAG,MAAM,GACvC,KACC;AACD,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,WAAY;AAAA,QACX,cAAO;AAAA,QACP,cAAQ,MAAO,MAAO,SAAU;AAAA,QAChC;AAAA,MACD;AAAA,MACE,GAAG;AAAA,MACL,SAAQ;AAAA;AAAA,EACT;AAEF,CAAE;",
|
|
6
6
|
"names": ["Badge"]
|
|
7
7
|
}
|
|
@@ -6,32 +6,41 @@ import { forwardRef, useEffect } from "@wordpress/element";
|
|
|
6
6
|
import { __ } from "@wordpress/i18n";
|
|
7
7
|
|
|
8
8
|
// packages/ui/src/button/style.module.css
|
|
9
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
9
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='26d90ece4e']")) {
|
|
10
10
|
const style = document.createElement("style");
|
|
11
|
-
style.setAttribute("data-wp-hash", "
|
|
12
|
-
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._97b0fc33c028be1a__button,.abbb272e2ce49bd6__is-unstyled{appearance:none;padding:0}._97b0fc33c028be1a__button{--wp-ui-button-font-weight:499;--wp-ui-button-background-color:var(--wpds-color-bg-interactive-brand-strong,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-brand-strong-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 93%,#000));--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-strong-disabled,#
|
|
11
|
+
style.setAttribute("data-wp-hash", "26d90ece4e");
|
|
12
|
+
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._97b0fc33c028be1a__button,.abbb272e2ce49bd6__is-unstyled{appearance:none;padding:0}._97b0fc33c028be1a__button{--wp-ui-button-font-weight:499;--wp-ui-button-background-color:var(--wpds-color-bg-interactive-brand-strong,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-brand-strong-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 93%,#000));--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-strong-disabled,#e6e6e6);--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-brand-strong,#fff);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-brand-strong-active,#fff);--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-strong-disabled,#8d8d8d);--wp-ui-button-padding-inline:var(--wpds-dimension-padding-md,12px);--wp-ui-button-height:40px;--wp-ui-button-aspect-ratio:auto;--wp-ui-button-font-size:var(--wpds-typography-font-size-md,13px);--wp-ui-button-min-width:calc(4ch + var(--wp-ui-button-padding-inline)*2);--wp-ui-button-border-color:var(--wp-ui-button-background-color);--wp-ui-button-border-color-active:var(--wp-ui-button-background-color-active);--wp-ui-button-border-color-disabled:var(--wp-ui-button-background-color-disabled);--_gcd-button-font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);--_gcd-button-font-size:var(--wp-ui-button-font-size);--_gcd-button-font-weight:var(--wp-ui-button-font-weight);align-items:center;aspect-ratio:var(--wp-ui-button-aspect-ratio);background-clip:padding-box;background-color:var(--wp-ui-button-background-color);border-color:var(--wp-ui-button-border-color);border-radius:var(--wpds-border-radius-sm,2px);border-style:solid;border-width:1px;color:var(--wp-ui-button-foreground-color);cursor:var(--wpds-cursor-control,pointer);display:inline-flex;font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wp-ui-button-font-size);font-weight:var(--wp-ui-button-font-weight);gap:var(--wpds-dimension-gap-sm,8px);height:var(--wp-ui-button-height);justify-content:center;line-height:var(--wpds-typography-line-height-sm,20px);min-width:var(--wp-ui-button-min-width);padding-inline:var(--wp-ui-button-padding-inline);position:relative;text-decoration:none;@media not (prefers-reduced-motion){transition:color .1s ease-out;*{transition:opacity .1s ease-out}}&[href]{cursor:pointer}[href]{color:inherit;text-decoration:inherit}&:not([data-disabled]):is(:hover,:active,:focus){background-color:var(--wp-ui-button-background-color-active);border-color:var(--wp-ui-button-border-color-active);color:var(--wp-ui-button-foreground-color-active)}&[data-disabled]:not(._914b42f315c0e580__is-loading){background-color:var(--wp-ui-button-background-color-disabled);border-color:var(--wp-ui-button-border-color-disabled);color:var(--wp-ui-button-foreground-color-disabled);@media (forced-colors:active){border-bottom-color:GrayText;border-left-color:GrayText;border-right-color:GrayText;border-top-color:GrayText;color:GrayText}}&:before{aspect-ratio:1;border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid;border-block-end-color:#0000;border-block-start-color:var(--wp-ui-button-foreground-color);border-inline-end-color:var(--wp-ui-button-foreground-color);border-inline-start-color:#0000;border-radius:50%;box-sizing:border-box;content:"";display:block;height:var(--wp-ui-button-font-size);inset-inline-start:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);@media not (prefers-reduced-motion){transition:opacity .1s ease-out}}}._908205475f9f2a92__is-small{--wp-ui-button-padding-inline:var(--wpds-dimension-padding-sm,8px);--wp-ui-button-height:24px}.dd460c965226cc77__is-brand{&._62d5a778b7b258ee__is-outline,&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-brand,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-brand-active,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-brand-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000);--wp-ui-button-border-color:var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-border-color-active:var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 85%,#000));--wp-ui-button-border-color-disabled:var(--wpds-color-stroke-interactive-neutral-disabled,#dbdbdb)}&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-brand-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000)}}.e722a8f96726aa99__is-neutral{&.b50b3358c5fb4d0b__is-solid{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-strong,#2d2d2d);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-strong-active,#1e1e1e);--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-strong-disabled,#e6e6e6);--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-neutral-strong,#f0f0f0);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-neutral-strong-active,#f0f0f0);--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-strong-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline,&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e);--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-weak-active,#ededed);--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000);--wp-ui-button-border-color:var(--wpds-color-stroke-interactive-neutral,#8d8d8d);--wp-ui-button-border-color-active:var(--wpds-color-stroke-interactive-neutral-active,#6e6e6e);--wp-ui-button-border-color-disabled:var(--wpds-color-stroke-interactive-neutral-disabled,#dbdbdb)}&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-weak-active,#ededed);--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000)}}.abbb272e2ce49bd6__is-unstyled{background:none;border:none;min-width:unset}.cf59cf1b69629838__is-compact{--wp-ui-button-height:32px}._914b42f315c0e580__is-loading{color:#0000;&:not([data-disabled]):is(:hover,:active,:focus){color:#0000}*{opacity:0}&:before{opacity:1;transition-delay:.05s;@media not (prefers-reduced-motion){animation:_5a1d53da6f830c8d__loading-animation 1s linear infinite}}}[aria-pressed=true].ad0619a3217c6a5b__is-minimal.e722a8f96726aa99__is-neutral{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-strong,#2d2d2d);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-strong,#2d2d2d);--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-neutral-strong,#f0f0f0);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-neutral-strong,#f0f0f0)}}@keyframes _5a1d53da6f830c8d__loading-animation{0%{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(1turn)}}'));
|
|
13
13
|
document.head.appendChild(style);
|
|
14
14
|
}
|
|
15
15
|
var style_default = { "button": "_97b0fc33c028be1a__button", "is-unstyled": "abbb272e2ce49bd6__is-unstyled", "is-loading": "_914b42f315c0e580__is-loading", "is-small": "_908205475f9f2a92__is-small", "is-brand": "dd460c965226cc77__is-brand", "is-outline": "_62d5a778b7b258ee__is-outline", "is-minimal": "ad0619a3217c6a5b__is-minimal", "is-neutral": "e722a8f96726aa99__is-neutral", "is-solid": "b50b3358c5fb4d0b__is-solid", "is-compact": "cf59cf1b69629838__is-compact", "loading-animation": "_5a1d53da6f830c8d__loading-animation" };
|
|
16
16
|
|
|
17
17
|
// packages/ui/src/utils/css/resets.module.css
|
|
18
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
18
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='e3ae230cea']")) {
|
|
19
19
|
const style = document.createElement("style");
|
|
20
|
-
style.setAttribute("data-wp-hash", "
|
|
20
|
+
style.setAttribute("data-wp-hash", "e3ae230cea");
|
|
21
21
|
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}}}"));
|
|
22
22
|
document.head.appendChild(style);
|
|
23
23
|
}
|
|
24
24
|
var resets_default = { "box-sizing": "_336cd3e4e743482f__box-sizing" };
|
|
25
25
|
|
|
26
26
|
// packages/ui/src/utils/css/focus.module.css
|
|
27
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
27
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='2a5ab8f3a7']")) {
|
|
28
28
|
const style = document.createElement("style");
|
|
29
|
-
style.setAttribute("data-wp-hash", "
|
|
30
|
-
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._08e8a2e44959f892__outset-ring--focus,._970d04df7376df67__outset-ring--focus-within-except-active,.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible,.cd83dfc2126a0846__outset-ring--focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active,.ecadb9e080e2dfa5__outset-ring--focus-parent-visible{@media not (prefers-reduced-motion){transition:outline .1s ease-out
|
|
29
|
+
style.setAttribute("data-wp-hash", "2a5ab8f3a7");
|
|
30
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._08e8a2e44959f892__outset-ring--focus,._970d04df7376df67__outset-ring--focus-within-except-active,.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible,.cd83dfc2126a0846__outset-ring--focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active,.ecadb9e080e2dfa5__outset-ring--focus-parent-visible{@media not (prefers-reduced-motion){--_gcd-a-transition:outline 0.1s ease-out;transition:outline .1s ease-out}outline:0 solid #0000;outline-offset:1px}._08e8a2e44959f892__outset-ring--focus:focus,._970d04df7376df67__outset-ring--focus-within-except-active:focus-within:not(:has(:active)),.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible:focus-within:has(:focus-visible),.cd83dfc2126a0846__outset-ring--focus-within:focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible:focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active:focus:not(:active),:focus-visible .ecadb9e080e2dfa5__outset-ring--focus-parent-visible{--_gcd-a-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));--_gcd-div-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));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))}}"));
|
|
31
31
|
document.head.appendChild(style);
|
|
32
32
|
}
|
|
33
33
|
var focus_default = { "outset-ring--focus": "_08e8a2e44959f892__outset-ring--focus", "outset-ring--focus-except-active": "e25b2bdd7aa21721__outset-ring--focus-except-active", "outset-ring--focus-visible": "d0541bc9dd9dc7b6__outset-ring--focus-visible", "outset-ring--focus-within": "cd83dfc2126a0846__outset-ring--focus-within", "outset-ring--focus-within-except-active": "_970d04df7376df67__outset-ring--focus-within-except-active", "outset-ring--focus-within-visible": "c5cb3ee4bddaa8e4__outset-ring--focus-within-visible", "outset-ring--focus-parent-visible": "ecadb9e080e2dfa5__outset-ring--focus-parent-visible" };
|
|
34
34
|
|
|
35
|
+
// packages/ui/src/utils/css/global-css-defense.module.css
|
|
36
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='1fb29d3a3c']")) {
|
|
37
|
+
const style = document.createElement("style");
|
|
38
|
+
style.setAttribute("data-wp-hash", "1fb29d3a3c");
|
|
39
|
+
style.appendChild(document.createTextNode("._6defc79820e382c6__button{box-sizing:var(--_gcd-button-box-sizing,border-box);font-family:var(--_gcd-button-font-family,inherit);font-size:var(--_gcd-button-font-size,inherit);font-weight:var(--_gcd-button-font-weight,inherit)}.d2cff2e5dea83bd1__input{box-sizing:var(--_gcd-input-box-sizing,border-box);font-family:var(--_gcd-input-font-family,inherit);font-size:var(--_gcd-input-font-size,inherit);font-weight:var(--_gcd-input-font-weight,inherit);margin:var(--_gcd-input-margin,0);&:is(textarea,[type=text],[type=password],[type=color],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){background-color:var(--_gcd-input-background-color,#0000);border:var(--_gcd-input-border,none);border-radius:var(--_gcd-input-border-radius,0);box-shadow:var(--_gcd-input-box-shadow,0 0 0 #0000);color:var(--_gcd-input-color,var(--wpds-color-fg-interactive-neutral,#1e1e1e));&:focus{border-color:var(--_gcd-input-border-color-focus,var(--wp-admin-theme-color));box-shadow:var(--_gcd-input-box-shadow-focus,none);outline:var(--_gcd-input-outline-focus,none)}&:disabled{background:var(--_gcd-input-background-disabled,#0000);border-color:var(--_gcd-input-border-color-disabled,#0000);box-shadow:var(--_gcd-input-box-shadow-disabled,none);color:var(--_gcd-input-color-disabled,var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d))}&::placeholder{color:var(--_gcd-input-placeholder-color,var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d))}}&:is(textarea,[type=text],[type=password],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){line-height:var(--_gcd-input-line-height,inherit);min-height:var(--_gcd-input-min-height,auto);padding:var(--_gcd-input-padding,0)}}._547d86373d02e108__textarea{box-sizing:var(--_gcd-textarea-box-sizing,border-box);overflow:var(--_gcd-textarea-overflow,auto);resize:var(--_gcd-textarea-resize,block)}._8c15fd0ed9f28ba4__div{outline:var(--_gcd-div-outline,0 solid #0000)}p._43cec3e1eec1066d__p{font-size:var(--_gcd-p-font-size,13px);line-height:var(--_gcd-p-line-height,1.5);margin:var(--_gcd-p-margin,0)}:is(h1,h2,h3,h4,h5,h6).e97669c6d9a38497__heading{color:var(--_gcd-heading-color,var(--wpds-color-fg-content-neutral,#1e1e1e));font-size:var(--_gcd-heading-font-size,inherit);font-weight:var(--_gcd-heading-font-weight,var(--wpds-typography-font-weight-medium,499));margin:var(--_gcd-heading-margin,0)}._2c0831b0499dbd6e__a,._2c0831b0499dbd6e__a:is(:hover,:focus,:active){border-radius:var(--_gcd-a-border-radius,0);box-shadow:var(--_gcd-a-box-shadow,none);color:var(--_gcd-a-color,inherit);outline:var(--_gcd-a-outline,0 solid #0000);transition:var(--_gcd-a-transition,none)}"));
|
|
40
|
+
document.head.appendChild(style);
|
|
41
|
+
}
|
|
42
|
+
var global_css_defense_default = { "button": "_6defc79820e382c6__button", "input": "d2cff2e5dea83bd1__input", "textarea": "_547d86373d02e108__textarea", "div": "_8c15fd0ed9f28ba4__div", "p": "_43cec3e1eec1066d__p", "heading": "e97669c6d9a38497__heading", "a": "_2c0831b0499dbd6e__a" };
|
|
43
|
+
|
|
35
44
|
// packages/ui/src/button/button.tsx
|
|
36
45
|
import { jsx } from "react/jsx-runtime";
|
|
37
46
|
var Button = forwardRef(
|
|
@@ -48,6 +57,7 @@ var Button = forwardRef(
|
|
|
48
57
|
...props
|
|
49
58
|
}, ref) {
|
|
50
59
|
const mergedClassName = clsx(
|
|
60
|
+
global_css_defense_default.button,
|
|
51
61
|
resets_default["box-sizing"],
|
|
52
62
|
focus_default["outset-ring--focus-except-active"],
|
|
53
63
|
variant !== "unstyled" && style_default.button,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../src/button/button.tsx", "../../src/button/style.module.css", "../../src/utils/css/resets.module.css", "../../src/utils/css/focus.module.css"],
|
|
4
|
-
"sourcesContent": ["import { Button as _Button } from '@base-ui/react/button';\nimport clsx from 'clsx';\nimport { speak } from '@wordpress/a11y';\nimport { forwardRef, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { type ButtonProps } from './types';\nimport styles from './style.module.css';\nimport resetStyles from '../utils/css/resets.module.css';\nimport focusStyles from '../utils/css/focus.module.css';\n\nexport const Button = forwardRef< HTMLButtonElement, ButtonProps >(\n\tfunction Button(\n\t\t{\n\t\t\ttone = 'brand',\n\t\t\tvariant = 'solid',\n\t\t\tsize = 'default',\n\t\t\tclassName,\n\t\t\tfocusableWhenDisabled = true,\n\t\t\tdisabled,\n\t\t\tloading,\n\t\t\tloadingAnnouncement = __( 'Loading' ),\n\t\t\tchildren,\n\t\t\t...props\n\t\t},\n\t\tref\n\t) {\n\t\tconst mergedClassName = clsx(\n\t\t\tresetStyles[ 'box-sizing' ],\n\t\t\tfocusStyles[ 'outset-ring--focus-except-active' ],\n\t\t\tvariant !== 'unstyled' && styles.button,\n\t\t\tstyles[ `is-${ tone }` ],\n\t\t\tstyles[ `is-${ variant }` ],\n\t\t\tstyles[ `is-${ size }` ],\n\t\t\tloading && styles[ 'is-loading' ],\n\t\t\tclassName\n\t\t);\n\n\t\t// Announce loading state to assistive technology\n\t\tuseEffect( () => {\n\t\t\tif ( loading && loadingAnnouncement ) {\n\t\t\t\tspeak( loadingAnnouncement );\n\t\t\t}\n\t\t}, [ loading, loadingAnnouncement ] );\n\n\t\treturn (\n\t\t\t<_Button\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ mergedClassName }\n\t\t\t\tfocusableWhenDisabled={ focusableWhenDisabled }\n\t\t\t\tdisabled={ disabled ?? loading }\n\t\t\t\t{ ...props }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</_Button>\n\t\t);\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='e0722a616e']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"e0722a616e\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._97b0fc33c028be1a__button,.abbb272e2ce49bd6__is-unstyled{appearance:none;padding:0}._97b0fc33c028be1a__button{--wp-ui-button-font-weight:499;--wp-ui-button-background-color:var(--wpds-color-bg-interactive-brand-strong,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-brand-strong-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 93%,#000));--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-strong-disabled,#e2e2e2);--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-brand-strong,#fff);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-brand-strong-active,#fff);--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-strong-disabled,#8a8a8a);--wp-ui-button-padding-inline:var(--wpds-dimension-padding-md,12px);--wp-ui-button-height:40px;--wp-ui-button-aspect-ratio:auto;--wp-ui-button-font-size:var(--wpds-font-size-md,13px);--wp-ui-button-min-width:calc(4ch + var(--wp-ui-button-padding-inline)*2);--wp-ui-button-border-color:var(--wp-ui-button-background-color);--wp-ui-button-border-color-active:var(--wp-ui-button-background-color-active);--wp-ui-button-border-color-disabled:var(--wp-ui-button-background-color-disabled);align-items:center;aspect-ratio:var(--wp-ui-button-aspect-ratio);background-clip:padding-box;background-color:var(--wp-ui-button-background-color);border-color:var(--wp-ui-button-border-color);border-radius:var(--wpds-border-radius-sm,2px);border-style:solid;border-width:1px;color:var(--wp-ui-button-foreground-color);display:inline-flex;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(--wp-ui-button-font-size);font-weight:var(--wp-ui-button-font-weight);gap:var(--wpds-dimension-gap-sm,8px);height:var(--wp-ui-button-height);justify-content:center;line-height:var(--wpds-font-line-height-sm,20px);min-width:var(--wp-ui-button-min-width);padding-inline:var(--wp-ui-button-padding-inline);position:relative;text-decoration:none;@media not (prefers-reduced-motion){transition:color .1s ease-out;*{transition:opacity .1s ease-out}}&[href]{cursor:pointer}[href]{color:inherit;text-decoration:inherit}&:not([data-disabled]):is(:hover,:active,:focus){background-color:var(--wp-ui-button-background-color-active);border-color:var(--wp-ui-button-border-color-active);color:var(--wp-ui-button-foreground-color-active)}&[data-disabled]:not(._914b42f315c0e580__is-loading){background-color:var(--wp-ui-button-background-color-disabled);border-color:var(--wp-ui-button-border-color-disabled);color:var(--wp-ui-button-foreground-color-disabled);@media (forced-colors:active){border-bottom-color:GrayText;border-left-color:GrayText;border-right-color:GrayText;border-top-color:GrayText;color:GrayText}}&:before{aspect-ratio:1;border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid;border-block-end-color:#0000;border-block-start-color:var(--wp-ui-button-foreground-color);border-inline-end-color:var(--wp-ui-button-foreground-color);border-inline-start-color:#0000;border-radius:50%;box-sizing:border-box;content:\\\"\\\";display:block;height:var(--wp-ui-button-font-size);inset-inline-start:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);@media not (prefers-reduced-motion){transition:opacity .1s ease-out}}}._908205475f9f2a92__is-small{--wp-ui-button-padding-inline:var(--wpds-dimension-padding-sm,8px);--wp-ui-button-height:24px}.dd460c965226cc77__is-brand{&._62d5a778b7b258ee__is-outline,&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-brand,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-brand-active,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-disabled,#8a8a8a)}&._62d5a778b7b258ee__is-outline{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-brand-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000);--wp-ui-button-border-color:var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-border-color-active:var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 85%,#000));--wp-ui-button-border-color-disabled:var(--wpds-color-stroke-interactive-neutral-disabled,#d8d8d8)}&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-brand-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000)}}.e722a8f96726aa99__is-neutral{&.b50b3358c5fb4d0b__is-solid{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-strong,#2d2d2d);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-strong-active,#1e1e1e);--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-strong-disabled,#e2e2e2);--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-neutral-strong,#f0f0f0);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-neutral-strong-active,#f0f0f0);--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-strong-disabled,#8a8a8a)}&._62d5a778b7b258ee__is-outline,&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e);--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-disabled,#8a8a8a)}&._62d5a778b7b258ee__is-outline{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-weak-active,#eaeaea);--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000);--wp-ui-button-border-color:var(--wpds-color-stroke-interactive-neutral,#8a8a8a);--wp-ui-button-border-color-active:var(--wpds-color-stroke-interactive-neutral-active,#6c6c6c);--wp-ui-button-border-color-disabled:var(--wpds-color-stroke-interactive-neutral-disabled,#d8d8d8)}&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-weak-active,#eaeaea);--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000)}}.abbb272e2ce49bd6__is-unstyled{background:none;border:none;min-width:unset}.cf59cf1b69629838__is-compact{--wp-ui-button-height:32px}._914b42f315c0e580__is-loading{color:#0000;&:not([data-disabled]):is(:hover,:active,:focus){color:#0000}*{opacity:0}&:before{opacity:1;transition-delay:.05s;@media not (prefers-reduced-motion){animation:_5a1d53da6f830c8d__loading-animation 1s linear infinite}}}[aria-pressed=true].ad0619a3217c6a5b__is-minimal.e722a8f96726aa99__is-neutral{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-strong,#2d2d2d);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-strong,#2d2d2d);--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-neutral-strong,#f0f0f0);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-neutral-strong,#f0f0f0)}}@keyframes _5a1d53da6f830c8d__loading-animation{0%{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(1turn)}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"button\":\"_97b0fc33c028be1a__button\",\"is-unstyled\":\"abbb272e2ce49bd6__is-unstyled\",\"is-loading\":\"_914b42f315c0e580__is-loading\",\"is-small\":\"_908205475f9f2a92__is-small\",\"is-brand\":\"dd460c965226cc77__is-brand\",\"is-outline\":\"_62d5a778b7b258ee__is-outline\",\"is-minimal\":\"ad0619a3217c6a5b__is-minimal\",\"is-neutral\":\"e722a8f96726aa99__is-neutral\",\"is-solid\":\"b50b3358c5fb4d0b__is-solid\",\"is-compact\":\"cf59cf1b69629838__is-compact\",\"loading-animation\":\"_5a1d53da6f830c8d__loading-animation\"};\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='671ebfc62d']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"671ebfc62d\");\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='6db1282653']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"6db1282653\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._08e8a2e44959f892__outset-ring--focus,._970d04df7376df67__outset-ring--focus-within-except-active,.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible,.cd83dfc2126a0846__outset-ring--focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active,.ecadb9e080e2dfa5__outset-ring--focus-parent-visible{@media not (prefers-reduced-motion){transition:outline .1s ease-out}outline-color:#0000;outline-offset:1px;outline-style:solid;outline-width:0}._08e8a2e44959f892__outset-ring--focus:focus,._970d04df7376df67__outset-ring--focus-within-except-active:focus-within:not(:has(:active)),.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible:focus-within:has(:focus-visible),.cd83dfc2126a0846__outset-ring--focus-within:focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible:focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active:focus:not(:active),:focus-visible .ecadb9e080e2dfa5__outset-ring--focus-parent-visible{outline-color:var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline-width:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"outset-ring--focus\":\"_08e8a2e44959f892__outset-ring--focus\",\"outset-ring--focus-except-active\":\"e25b2bdd7aa21721__outset-ring--focus-except-active\",\"outset-ring--focus-visible\":\"d0541bc9dd9dc7b6__outset-ring--focus-visible\",\"outset-ring--focus-within\":\"cd83dfc2126a0846__outset-ring--focus-within\",\"outset-ring--focus-within-except-active\":\"_970d04df7376df67__outset-ring--focus-within-except-active\",\"outset-ring--focus-within-visible\":\"c5cb3ee4bddaa8e4__outset-ring--focus-within-visible\",\"outset-ring--focus-parent-visible\":\"ecadb9e080e2dfa5__outset-ring--focus-parent-visible\"};\n"],
|
|
5
|
-
"mappings": ";AAAA,SAAS,UAAU,eAAe;AAClC,OAAO,UAAU;AACjB,SAAS,aAAa;AACtB,SAAS,YAAY,iBAAiB;AACtC,SAAS,UAAU;;;ACJnB,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,
|
|
3
|
+
"sources": ["../../src/button/button.tsx", "../../src/button/style.module.css", "../../src/utils/css/resets.module.css", "../../src/utils/css/focus.module.css", "../../src/utils/css/global-css-defense.module.css"],
|
|
4
|
+
"sourcesContent": ["import { Button as _Button } from '@base-ui/react/button';\nimport clsx from 'clsx';\nimport { speak } from '@wordpress/a11y';\nimport { forwardRef, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { type ButtonProps } from './types';\nimport styles from './style.module.css';\nimport resetStyles from '../utils/css/resets.module.css';\nimport focusStyles from '../utils/css/focus.module.css';\nimport defenseStyles from '../utils/css/global-css-defense.module.css';\n\nexport const Button = forwardRef< HTMLButtonElement, ButtonProps >(\n\tfunction Button(\n\t\t{\n\t\t\ttone = 'brand',\n\t\t\tvariant = 'solid',\n\t\t\tsize = 'default',\n\t\t\tclassName,\n\t\t\tfocusableWhenDisabled = true,\n\t\t\tdisabled,\n\t\t\tloading,\n\t\t\tloadingAnnouncement = __( 'Loading' ),\n\t\t\tchildren,\n\t\t\t...props\n\t\t},\n\t\tref\n\t) {\n\t\tconst mergedClassName = clsx(\n\t\t\tdefenseStyles.button,\n\t\t\tresetStyles[ 'box-sizing' ],\n\t\t\tfocusStyles[ 'outset-ring--focus-except-active' ],\n\t\t\tvariant !== 'unstyled' && styles.button,\n\t\t\tstyles[ `is-${ tone }` ],\n\t\t\tstyles[ `is-${ variant }` ],\n\t\t\tstyles[ `is-${ size }` ],\n\t\t\tloading && styles[ 'is-loading' ],\n\t\t\tclassName\n\t\t);\n\n\t\t// Announce loading state to assistive technology\n\t\tuseEffect( () => {\n\t\t\tif ( loading && loadingAnnouncement ) {\n\t\t\t\tspeak( loadingAnnouncement );\n\t\t\t}\n\t\t}, [ loading, loadingAnnouncement ] );\n\n\t\treturn (\n\t\t\t<_Button\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ mergedClassName }\n\t\t\t\tfocusableWhenDisabled={ focusableWhenDisabled }\n\t\t\t\tdisabled={ disabled ?? loading }\n\t\t\t\t{ ...props }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</_Button>\n\t\t);\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='26d90ece4e']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"26d90ece4e\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._97b0fc33c028be1a__button,.abbb272e2ce49bd6__is-unstyled{appearance:none;padding:0}._97b0fc33c028be1a__button{--wp-ui-button-font-weight:499;--wp-ui-button-background-color:var(--wpds-color-bg-interactive-brand-strong,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-brand-strong-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 93%,#000));--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-strong-disabled,#e6e6e6);--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-brand-strong,#fff);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-brand-strong-active,#fff);--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-strong-disabled,#8d8d8d);--wp-ui-button-padding-inline:var(--wpds-dimension-padding-md,12px);--wp-ui-button-height:40px;--wp-ui-button-aspect-ratio:auto;--wp-ui-button-font-size:var(--wpds-typography-font-size-md,13px);--wp-ui-button-min-width:calc(4ch + var(--wp-ui-button-padding-inline)*2);--wp-ui-button-border-color:var(--wp-ui-button-background-color);--wp-ui-button-border-color-active:var(--wp-ui-button-background-color-active);--wp-ui-button-border-color-disabled:var(--wp-ui-button-background-color-disabled);--_gcd-button-font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);--_gcd-button-font-size:var(--wp-ui-button-font-size);--_gcd-button-font-weight:var(--wp-ui-button-font-weight);align-items:center;aspect-ratio:var(--wp-ui-button-aspect-ratio);background-clip:padding-box;background-color:var(--wp-ui-button-background-color);border-color:var(--wp-ui-button-border-color);border-radius:var(--wpds-border-radius-sm,2px);border-style:solid;border-width:1px;color:var(--wp-ui-button-foreground-color);cursor:var(--wpds-cursor-control,pointer);display:inline-flex;font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif);font-size:var(--wp-ui-button-font-size);font-weight:var(--wp-ui-button-font-weight);gap:var(--wpds-dimension-gap-sm,8px);height:var(--wp-ui-button-height);justify-content:center;line-height:var(--wpds-typography-line-height-sm,20px);min-width:var(--wp-ui-button-min-width);padding-inline:var(--wp-ui-button-padding-inline);position:relative;text-decoration:none;@media not (prefers-reduced-motion){transition:color .1s ease-out;*{transition:opacity .1s ease-out}}&[href]{cursor:pointer}[href]{color:inherit;text-decoration:inherit}&:not([data-disabled]):is(:hover,:active,:focus){background-color:var(--wp-ui-button-background-color-active);border-color:var(--wp-ui-button-border-color-active);color:var(--wp-ui-button-foreground-color-active)}&[data-disabled]:not(._914b42f315c0e580__is-loading){background-color:var(--wp-ui-button-background-color-disabled);border-color:var(--wp-ui-button-border-color-disabled);color:var(--wp-ui-button-foreground-color-disabled);@media (forced-colors:active){border-bottom-color:GrayText;border-left-color:GrayText;border-right-color:GrayText;border-top-color:GrayText;color:GrayText}}&:before{aspect-ratio:1;border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid;border-block-end-color:#0000;border-block-start-color:var(--wp-ui-button-foreground-color);border-inline-end-color:var(--wp-ui-button-foreground-color);border-inline-start-color:#0000;border-radius:50%;box-sizing:border-box;content:\\\"\\\";display:block;height:var(--wp-ui-button-font-size);inset-inline-start:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);@media not (prefers-reduced-motion){transition:opacity .1s ease-out}}}._908205475f9f2a92__is-small{--wp-ui-button-padding-inline:var(--wpds-dimension-padding-sm,8px);--wp-ui-button-height:24px}.dd460c965226cc77__is-brand{&._62d5a778b7b258ee__is-outline,&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-brand,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-brand-active,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-brand-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000);--wp-ui-button-border-color:var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-border-color-active:var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 85%,#000));--wp-ui-button-border-color-disabled:var(--wpds-color-stroke-interactive-neutral-disabled,#dbdbdb)}&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-brand-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000)}}.e722a8f96726aa99__is-neutral{&.b50b3358c5fb4d0b__is-solid{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-strong,#2d2d2d);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-strong-active,#1e1e1e);--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-strong-disabled,#e6e6e6);--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-neutral-strong,#f0f0f0);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-neutral-strong-active,#f0f0f0);--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-strong-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline,&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-neutral-active,#1e1e1e);--wp-ui-button-foreground-color-disabled:var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-weak-active,#ededed);--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000);--wp-ui-button-border-color:var(--wpds-color-stroke-interactive-neutral,#8d8d8d);--wp-ui-button-border-color-active:var(--wpds-color-stroke-interactive-neutral-active,#6e6e6e);--wp-ui-button-border-color-disabled:var(--wpds-color-stroke-interactive-neutral-disabled,#dbdbdb)}&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-weak-active,#ededed);--wp-ui-button-background-color-disabled:var(--wpds-color-bg-interactive-neutral-weak-disabled,#0000)}}.abbb272e2ce49bd6__is-unstyled{background:none;border:none;min-width:unset}.cf59cf1b69629838__is-compact{--wp-ui-button-height:32px}._914b42f315c0e580__is-loading{color:#0000;&:not([data-disabled]):is(:hover,:active,:focus){color:#0000}*{opacity:0}&:before{opacity:1;transition-delay:.05s;@media not (prefers-reduced-motion){animation:_5a1d53da6f830c8d__loading-animation 1s linear infinite}}}[aria-pressed=true].ad0619a3217c6a5b__is-minimal.e722a8f96726aa99__is-neutral{--wp-ui-button-background-color:var(--wpds-color-bg-interactive-neutral-strong,#2d2d2d);--wp-ui-button-background-color-active:var(--wpds-color-bg-interactive-neutral-strong,#2d2d2d);--wp-ui-button-foreground-color:var(--wpds-color-fg-interactive-neutral-strong,#f0f0f0);--wp-ui-button-foreground-color-active:var(--wpds-color-fg-interactive-neutral-strong,#f0f0f0)}}@keyframes _5a1d53da6f830c8d__loading-animation{0%{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(1turn)}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"button\":\"_97b0fc33c028be1a__button\",\"is-unstyled\":\"abbb272e2ce49bd6__is-unstyled\",\"is-loading\":\"_914b42f315c0e580__is-loading\",\"is-small\":\"_908205475f9f2a92__is-small\",\"is-brand\":\"dd460c965226cc77__is-brand\",\"is-outline\":\"_62d5a778b7b258ee__is-outline\",\"is-minimal\":\"ad0619a3217c6a5b__is-minimal\",\"is-neutral\":\"e722a8f96726aa99__is-neutral\",\"is-solid\":\"b50b3358c5fb4d0b__is-solid\",\"is-compact\":\"cf59cf1b69629838__is-compact\",\"loading-animation\":\"_5a1d53da6f830c8d__loading-animation\"};\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='2a5ab8f3a7']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"2a5ab8f3a7\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._08e8a2e44959f892__outset-ring--focus,._970d04df7376df67__outset-ring--focus-within-except-active,.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible,.cd83dfc2126a0846__outset-ring--focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active,.ecadb9e080e2dfa5__outset-ring--focus-parent-visible{@media not (prefers-reduced-motion){--_gcd-a-transition:outline 0.1s ease-out;transition:outline .1s ease-out}outline:0 solid #0000;outline-offset:1px}._08e8a2e44959f892__outset-ring--focus:focus,._970d04df7376df67__outset-ring--focus-within-except-active:focus-within:not(:has(:active)),.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible:focus-within:has(:focus-visible),.cd83dfc2126a0846__outset-ring--focus-within:focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible:focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active:focus:not(:active),:focus-visible .ecadb9e080e2dfa5__outset-ring--focus-parent-visible{--_gcd-a-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));--_gcd-div-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));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))}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"outset-ring--focus\":\"_08e8a2e44959f892__outset-ring--focus\",\"outset-ring--focus-except-active\":\"e25b2bdd7aa21721__outset-ring--focus-except-active\",\"outset-ring--focus-visible\":\"d0541bc9dd9dc7b6__outset-ring--focus-visible\",\"outset-ring--focus-within\":\"cd83dfc2126a0846__outset-ring--focus-within\",\"outset-ring--focus-within-except-active\":\"_970d04df7376df67__outset-ring--focus-within-except-active\",\"outset-ring--focus-within-visible\":\"c5cb3ee4bddaa8e4__outset-ring--focus-within-visible\",\"outset-ring--focus-parent-visible\":\"ecadb9e080e2dfa5__outset-ring--focus-parent-visible\"};\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='1fb29d3a3c']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"1fb29d3a3c\");\n\tstyle.appendChild(document.createTextNode(\"._6defc79820e382c6__button{box-sizing:var(--_gcd-button-box-sizing,border-box);font-family:var(--_gcd-button-font-family,inherit);font-size:var(--_gcd-button-font-size,inherit);font-weight:var(--_gcd-button-font-weight,inherit)}.d2cff2e5dea83bd1__input{box-sizing:var(--_gcd-input-box-sizing,border-box);font-family:var(--_gcd-input-font-family,inherit);font-size:var(--_gcd-input-font-size,inherit);font-weight:var(--_gcd-input-font-weight,inherit);margin:var(--_gcd-input-margin,0);&:is(textarea,[type=text],[type=password],[type=color],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){background-color:var(--_gcd-input-background-color,#0000);border:var(--_gcd-input-border,none);border-radius:var(--_gcd-input-border-radius,0);box-shadow:var(--_gcd-input-box-shadow,0 0 0 #0000);color:var(--_gcd-input-color,var(--wpds-color-fg-interactive-neutral,#1e1e1e));&:focus{border-color:var(--_gcd-input-border-color-focus,var(--wp-admin-theme-color));box-shadow:var(--_gcd-input-box-shadow-focus,none);outline:var(--_gcd-input-outline-focus,none)}&:disabled{background:var(--_gcd-input-background-disabled,#0000);border-color:var(--_gcd-input-border-color-disabled,#0000);box-shadow:var(--_gcd-input-box-shadow-disabled,none);color:var(--_gcd-input-color-disabled,var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d))}&::placeholder{color:var(--_gcd-input-placeholder-color,var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d))}}&:is(textarea,[type=text],[type=password],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){line-height:var(--_gcd-input-line-height,inherit);min-height:var(--_gcd-input-min-height,auto);padding:var(--_gcd-input-padding,0)}}._547d86373d02e108__textarea{box-sizing:var(--_gcd-textarea-box-sizing,border-box);overflow:var(--_gcd-textarea-overflow,auto);resize:var(--_gcd-textarea-resize,block)}._8c15fd0ed9f28ba4__div{outline:var(--_gcd-div-outline,0 solid #0000)}p._43cec3e1eec1066d__p{font-size:var(--_gcd-p-font-size,13px);line-height:var(--_gcd-p-line-height,1.5);margin:var(--_gcd-p-margin,0)}:is(h1,h2,h3,h4,h5,h6).e97669c6d9a38497__heading{color:var(--_gcd-heading-color,var(--wpds-color-fg-content-neutral,#1e1e1e));font-size:var(--_gcd-heading-font-size,inherit);font-weight:var(--_gcd-heading-font-weight,var(--wpds-typography-font-weight-medium,499));margin:var(--_gcd-heading-margin,0)}._2c0831b0499dbd6e__a,._2c0831b0499dbd6e__a:is(:hover,:focus,:active){border-radius:var(--_gcd-a-border-radius,0);box-shadow:var(--_gcd-a-box-shadow,none);color:var(--_gcd-a-color,inherit);outline:var(--_gcd-a-outline,0 solid #0000);transition:var(--_gcd-a-transition,none)}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"button\":\"_6defc79820e382c6__button\",\"input\":\"d2cff2e5dea83bd1__input\",\"textarea\":\"_547d86373d02e108__textarea\",\"div\":\"_8c15fd0ed9f28ba4__div\",\"p\":\"_43cec3e1eec1066d__p\",\"heading\":\"e97669c6d9a38497__heading\",\"a\":\"_2c0831b0499dbd6e__a\"};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Button"]
|
|
7
7
|
}
|
|
@@ -3,13 +3,13 @@ import { mergeProps, useRender } from "@base-ui/react";
|
|
|
3
3
|
import { forwardRef } from "@wordpress/element";
|
|
4
4
|
|
|
5
5
|
// packages/ui/src/card/style.module.css
|
|
6
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
6
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='14f5e9ddeb']")) {
|
|
7
7
|
const style = document.createElement("style");
|
|
8
|
-
style.setAttribute("data-wp-hash", "
|
|
9
|
-
style.appendChild(document.createTextNode(
|
|
8
|
+
style.setAttribute("data-wp-hash", "14f5e9ddeb");
|
|
9
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._02872bf298eadc43__root{--wp-ui-card-padding:var(--wpds-dimension-padding-2xl,24px);--wp-ui-card-header-content-gap:var(--wpds-dimension-gap-xl,24px);--wp-ui-card-header-content-margin:calc(var(--wp-ui-card-header-content-gap) - var(--wp-ui-card-padding));background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border:1px solid var(--wpds-color-stroke-surface-neutral-weak,#e4e4e4);border-radius:var(--wpds-border-radius-lg,8px);color:var(--wpds-color-fg-content-neutral,#1e1e1e);display:flex;flex-direction:column;overflow:clip}._5dffdaf2a6e669ac__content,.bbccc92e6ba5662d__header{padding:var(--wp-ui-card-padding);&:not(:first-child):not(:last-child){padding-block-end:0}}.bbccc92e6ba5662d__header+._5dffdaf2a6e669ac__content{margin-block-start:var(--wp-ui-card-header-content-margin);padding-block-start:0}.c1fa192587e1b4a6__fullbleed{margin-inline:calc(var(--wp-ui-card-padding)*-1);width:calc(100% + var(--wp-ui-card-padding)*2)}}"));
|
|
10
10
|
document.head.appendChild(style);
|
|
11
11
|
}
|
|
12
|
-
var style_default = { "root": "_02872bf298eadc43__root", "header": "bbccc92e6ba5662d__header", "content": "_5dffdaf2a6e669ac__content", "fullbleed": "c1fa192587e1b4a6__fullbleed"
|
|
12
|
+
var style_default = { "root": "_02872bf298eadc43__root", "header": "bbccc92e6ba5662d__header", "content": "_5dffdaf2a6e669ac__content", "fullbleed": "c1fa192587e1b4a6__fullbleed" };
|
|
13
13
|
|
|
14
14
|
// packages/ui/src/card/content.tsx
|
|
15
15
|
var Content = forwardRef(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/card/content.tsx", "../../src/card/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef } from '@wordpress/element';\nimport styles from './style.module.css';\nimport type { ContentProps } from './types';\n\n/**\n * The main content area of the card.\n */\nexport const Content = forwardRef< HTMLDivElement, ContentProps >(\n\tfunction CardContent( { render, ...props }, ref ) {\n\t\tconst element = useRender( {\n\t\t\tdefaultTagName: 'div',\n\t\t\trender,\n\t\t\tref,\n\t\t\tprops: mergeProps< 'div' >( { className: styles.content }, props ),\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='
|
|
5
|
-
"mappings": ";AAAA,SAAS,YAAY,iBAAiB;AACtC,SAAS,kBAAkB;;;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,
|
|
4
|
+
"sourcesContent": ["import { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef } from '@wordpress/element';\nimport styles from './style.module.css';\nimport type { ContentProps } from './types';\n\n/**\n * The main content area of the card.\n */\nexport const Content = forwardRef< HTMLDivElement, ContentProps >(\n\tfunction CardContent( { render, ...props }, ref ) {\n\t\tconst element = useRender( {\n\t\t\tdefaultTagName: 'div',\n\t\t\trender,\n\t\t\tref,\n\t\t\tprops: mergeProps< 'div' >( { className: styles.content }, props ),\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='14f5e9ddeb']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"14f5e9ddeb\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._02872bf298eadc43__root{--wp-ui-card-padding:var(--wpds-dimension-padding-2xl,24px);--wp-ui-card-header-content-gap:var(--wpds-dimension-gap-xl,24px);--wp-ui-card-header-content-margin:calc(var(--wp-ui-card-header-content-gap) - var(--wp-ui-card-padding));background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border:1px solid var(--wpds-color-stroke-surface-neutral-weak,#e4e4e4);border-radius:var(--wpds-border-radius-lg,8px);color:var(--wpds-color-fg-content-neutral,#1e1e1e);display:flex;flex-direction:column;overflow:clip}._5dffdaf2a6e669ac__content,.bbccc92e6ba5662d__header{padding:var(--wp-ui-card-padding);&:not(:first-child):not(:last-child){padding-block-end:0}}.bbccc92e6ba5662d__header+._5dffdaf2a6e669ac__content{margin-block-start:var(--wp-ui-card-header-content-margin);padding-block-start:0}.c1fa192587e1b4a6__fullbleed{margin-inline:calc(var(--wp-ui-card-padding)*-1);width:calc(100% + var(--wp-ui-card-padding)*2)}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"root\":\"_02872bf298eadc43__root\",\"header\":\"bbccc92e6ba5662d__header\",\"content\":\"_5dffdaf2a6e669ac__content\",\"fullbleed\":\"c1fa192587e1b4a6__fullbleed\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,YAAY,iBAAiB;AACtC,SAAS,kBAAkB;;;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,4hCAA4hC,CAAC;AACvkC,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,QAAO,2BAA0B,UAAS,4BAA2B,WAAU,8BAA6B,aAAY,8BAA6B;;;ADE9J,IAAM,UAAU;AAAA,EACtB,SAAS,YAAa,EAAE,QAAQ,GAAG,MAAM,GAAG,KAAM;AACjD,UAAM,UAAU,UAAW;AAAA,MAC1B,gBAAgB;AAAA,MAChB;AAAA,MACA;AAAA,MACA,OAAO,WAAqB,EAAE,WAAW,cAAO,QAAQ,GAAG,KAAM;AAAA,IAClE,CAAE;AAEF,WAAO;AAAA,EACR;AACD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -3,13 +3,13 @@ import { mergeProps, useRender } from "@base-ui/react";
|
|
|
3
3
|
import { forwardRef } from "@wordpress/element";
|
|
4
4
|
|
|
5
5
|
// packages/ui/src/card/style.module.css
|
|
6
|
-
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='
|
|
6
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='14f5e9ddeb']")) {
|
|
7
7
|
const style = document.createElement("style");
|
|
8
|
-
style.setAttribute("data-wp-hash", "
|
|
9
|
-
style.appendChild(document.createTextNode(
|
|
8
|
+
style.setAttribute("data-wp-hash", "14f5e9ddeb");
|
|
9
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._02872bf298eadc43__root{--wp-ui-card-padding:var(--wpds-dimension-padding-2xl,24px);--wp-ui-card-header-content-gap:var(--wpds-dimension-gap-xl,24px);--wp-ui-card-header-content-margin:calc(var(--wp-ui-card-header-content-gap) - var(--wp-ui-card-padding));background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border:1px solid var(--wpds-color-stroke-surface-neutral-weak,#e4e4e4);border-radius:var(--wpds-border-radius-lg,8px);color:var(--wpds-color-fg-content-neutral,#1e1e1e);display:flex;flex-direction:column;overflow:clip}._5dffdaf2a6e669ac__content,.bbccc92e6ba5662d__header{padding:var(--wp-ui-card-padding);&:not(:first-child):not(:last-child){padding-block-end:0}}.bbccc92e6ba5662d__header+._5dffdaf2a6e669ac__content{margin-block-start:var(--wp-ui-card-header-content-margin);padding-block-start:0}.c1fa192587e1b4a6__fullbleed{margin-inline:calc(var(--wp-ui-card-padding)*-1);width:calc(100% + var(--wp-ui-card-padding)*2)}}"));
|
|
10
10
|
document.head.appendChild(style);
|
|
11
11
|
}
|
|
12
|
-
var style_default = { "root": "_02872bf298eadc43__root", "header": "bbccc92e6ba5662d__header", "content": "_5dffdaf2a6e669ac__content", "fullbleed": "c1fa192587e1b4a6__fullbleed"
|
|
12
|
+
var style_default = { "root": "_02872bf298eadc43__root", "header": "bbccc92e6ba5662d__header", "content": "_5dffdaf2a6e669ac__content", "fullbleed": "c1fa192587e1b4a6__fullbleed" };
|
|
13
13
|
|
|
14
14
|
// packages/ui/src/card/full-bleed.tsx
|
|
15
15
|
var FullBleed = forwardRef(
|