@wordpress/ui 0.9.1-next.v.202603102151.0 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +42 -1
- package/CONTRIBUTING.md +31 -0
- package/README.md +106 -0
- package/build/alert-dialog/context.cjs +34 -0
- package/build/alert-dialog/context.cjs.map +7 -0
- package/build/alert-dialog/index.cjs +37 -0
- package/build/alert-dialog/index.cjs.map +7 -0
- package/build/alert-dialog/popup.cjs +93 -0
- package/build/alert-dialog/popup.cjs.map +7 -0
- package/build/alert-dialog/root.cjs +52 -0
- package/build/alert-dialog/root.cjs.map +7 -0
- package/build/alert-dialog/trigger.cjs +48 -0
- package/build/alert-dialog/trigger.cjs.map +7 -0
- package/build/alert-dialog/types.cjs +19 -0
- package/build/alert-dialog/types.cjs.map +7 -0
- package/build/badge/badge.cjs +3 -3
- package/build/badge/badge.cjs.map +2 -2
- package/build/button/button.cjs +9 -9
- package/build/button/button.cjs.map +2 -2
- package/build/card/content.cjs +3 -3
- package/build/card/content.cjs.map +2 -2
- package/build/card/full-bleed.cjs +3 -3
- package/build/card/full-bleed.cjs.map +2 -2
- package/build/card/header.cjs +3 -3
- package/build/card/header.cjs.map +2 -2
- package/build/card/root.cjs +5 -5
- package/build/card/root.cjs.map +2 -2
- package/build/card/title.cjs +26 -13
- package/build/card/title.cjs.map +3 -3
- package/build/collapsible/index.cjs +37 -0
- package/build/collapsible/index.cjs.map +7 -0
- package/build/collapsible/panel.cjs +38 -0
- package/build/collapsible/panel.cjs.map +7 -0
- package/build/collapsible/root.cjs +38 -0
- package/build/collapsible/root.cjs.map +7 -0
- package/build/collapsible/trigger.cjs +38 -0
- package/build/collapsible/trigger.cjs.map +7 -0
- package/build/collapsible/types.cjs +19 -0
- package/build/collapsible/types.cjs.map +7 -0
- package/build/collapsible-card/content.cjs +26 -5
- package/build/collapsible-card/content.cjs.map +4 -4
- package/build/collapsible-card/context.cjs +35 -0
- package/build/collapsible-card/context.cjs.map +7 -0
- package/build/collapsible-card/header-description.cjs +52 -0
- package/build/collapsible-card/header-description.cjs.map +7 -0
- package/build/collapsible-card/header.cjs +57 -38
- package/build/collapsible-card/header.cjs.map +3 -3
- package/build/collapsible-card/index.cjs +3 -0
- package/build/collapsible-card/index.cjs.map +2 -2
- package/build/collapsible-card/root.cjs +4 -4
- package/build/collapsible-card/root.cjs.map +2 -2
- package/build/collapsible-card/types.cjs.map +1 -1
- package/build/dialog/action.cjs +4 -2
- package/build/dialog/action.cjs.map +2 -2
- package/build/dialog/close-icon.cjs +2 -1
- package/build/dialog/close-icon.cjs.map +2 -2
- package/build/dialog/footer.cjs +3 -3
- package/build/dialog/footer.cjs.map +2 -2
- package/build/dialog/header.cjs +3 -3
- package/build/dialog/header.cjs.map +2 -2
- package/build/dialog/popup.cjs +22 -5
- package/build/dialog/popup.cjs.map +2 -2
- package/build/dialog/title.cjs +3 -3
- package/build/dialog/title.cjs.map +2 -2
- package/build/dialog/types.cjs.map +1 -1
- package/build/empty-state/actions.cjs +66 -0
- package/build/empty-state/actions.cjs.map +7 -0
- package/build/empty-state/description.cjs +66 -0
- package/build/empty-state/description.cjs.map +7 -0
- package/build/empty-state/icon.cjs +69 -0
- package/build/empty-state/icon.cjs.map +7 -0
- package/build/empty-state/index.cjs +46 -0
- package/build/empty-state/index.cjs.map +7 -0
- package/build/empty-state/root.cjs +66 -0
- package/build/empty-state/root.cjs.map +7 -0
- package/build/empty-state/title.cjs +68 -0
- package/build/empty-state/title.cjs.map +7 -0
- package/build/empty-state/types.cjs +19 -0
- package/build/empty-state/types.cjs.map +7 -0
- package/build/empty-state/visual.cjs +66 -0
- package/build/empty-state/visual.cjs.map +7 -0
- package/build/form/index.cjs +27 -0
- package/build/form/index.cjs.map +7 -0
- package/build/form/input-control/index.cjs +31 -0
- package/build/form/input-control/index.cjs.map +7 -0
- package/build/form/input-control/input-control.cjs +50 -0
- package/build/form/input-control/input-control.cjs.map +7 -0
- package/build/form/input-control/types.cjs +19 -0
- package/build/form/input-control/types.cjs.map +7 -0
- package/build/form/primitives/field/description.cjs +2 -2
- package/build/form/primitives/field/description.cjs.map +1 -1
- package/build/form/primitives/field/details.cjs +2 -2
- package/build/form/primitives/field/details.cjs.map +1 -1
- package/build/form/primitives/field/label.cjs +2 -2
- package/build/form/primitives/field/label.cjs.map +1 -1
- package/build/form/primitives/field/root.cjs +4 -4
- package/build/form/primitives/field/root.cjs.map +2 -2
- package/build/form/primitives/fieldset/description.cjs +2 -2
- package/build/form/primitives/fieldset/description.cjs.map +1 -1
- package/build/form/primitives/fieldset/details.cjs +2 -2
- package/build/form/primitives/fieldset/details.cjs.map +1 -1
- package/build/form/primitives/fieldset/legend.cjs +2 -2
- package/build/form/primitives/fieldset/legend.cjs.map +1 -1
- package/build/form/primitives/fieldset/root.cjs +2 -2
- package/build/form/primitives/fieldset/root.cjs.map +1 -1
- package/build/form/primitives/input/input.cjs +6 -6
- package/build/form/primitives/input/input.cjs.map +2 -2
- package/build/form/primitives/input-layout/input-layout.cjs +4 -4
- package/build/form/primitives/input-layout/input-layout.cjs.map +1 -1
- package/build/form/primitives/input-layout/slot.cjs +5 -4
- package/build/form/primitives/input-layout/slot.cjs.map +2 -2
- package/build/form/primitives/select/item.cjs +5 -5
- package/build/form/primitives/select/item.cjs.map +2 -2
- package/build/form/primitives/select/popup.cjs +7 -7
- package/build/form/primitives/select/popup.cjs.map +2 -2
- package/build/form/primitives/select/trigger.cjs +7 -7
- package/build/form/primitives/select/trigger.cjs.map +2 -2
- package/build/form/primitives/textarea/textarea.cjs +3 -3
- package/build/form/primitives/textarea/textarea.cjs.map +2 -2
- package/build/form/types.cjs +19 -0
- package/build/form/types.cjs.map +7 -0
- package/build/icon-button/icon-button.cjs +2 -2
- package/build/icon-button/icon-button.cjs.map +1 -1
- package/build/index.cjs +11 -2
- package/build/index.cjs.map +2 -2
- package/build/link/link.cjs +8 -8
- package/build/link/link.cjs.map +2 -2
- package/build/notice/action-button.cjs +2 -2
- package/build/notice/action-button.cjs.map +1 -1
- package/build/notice/action-link.cjs +2 -2
- package/build/notice/action-link.cjs.map +1 -1
- package/build/notice/actions.cjs +2 -2
- package/build/notice/actions.cjs.map +1 -1
- package/build/notice/close-icon.cjs +2 -2
- package/build/notice/close-icon.cjs.map +1 -1
- package/build/notice/description.cjs +2 -2
- package/build/notice/description.cjs.map +1 -1
- package/build/notice/index.cjs.map +1 -1
- package/build/notice/root.cjs +4 -4
- package/build/notice/root.cjs.map +1 -1
- package/build/notice/title.cjs +2 -2
- package/build/notice/title.cjs.map +1 -1
- package/build/stack/stack.cjs +2 -2
- package/build/stack/stack.cjs.map +1 -1
- package/build/tabs/context.cjs +121 -0
- package/build/tabs/context.cjs.map +7 -0
- package/build/tabs/list.cjs +3 -3
- package/build/tabs/list.cjs.map +2 -2
- package/build/tabs/panel.cjs +5 -3
- package/build/tabs/panel.cjs.map +2 -2
- package/build/tabs/root.cjs +2 -1
- package/build/tabs/root.cjs.map +2 -2
- package/build/tabs/tab.cjs +5 -3
- package/build/tabs/tab.cjs.map +2 -2
- package/build/text/text.cjs +2 -2
- package/build/text/text.cjs.map +1 -1
- package/build/tooltip/popup.cjs +4 -4
- package/build/tooltip/popup.cjs.map +1 -1
- package/build/tooltip/root.cjs.map +2 -2
- package/build/utils/use-deprioritized-initial-focus.cjs +64 -0
- package/build/utils/use-deprioritized-initial-focus.cjs.map +7 -0
- package/build/visually-hidden/visually-hidden.cjs +2 -2
- package/build/visually-hidden/visually-hidden.cjs.map +1 -1
- package/build-module/alert-dialog/context.mjs +9 -0
- package/build-module/alert-dialog/context.mjs.map +7 -0
- package/build-module/alert-dialog/index.mjs +10 -0
- package/build-module/alert-dialog/index.mjs.map +7 -0
- package/build-module/alert-dialog/popup.mjs +58 -0
- package/build-module/alert-dialog/popup.mjs.map +7 -0
- package/build-module/alert-dialog/root.mjs +27 -0
- package/build-module/alert-dialog/root.mjs.map +7 -0
- package/build-module/alert-dialog/trigger.mjs +13 -0
- package/build-module/alert-dialog/trigger.mjs.map +7 -0
- package/build-module/alert-dialog/types.mjs +1 -0
- package/build-module/alert-dialog/types.mjs.map +7 -0
- package/build-module/badge/badge.mjs +3 -3
- package/build-module/badge/badge.mjs.map +2 -2
- package/build-module/button/button.mjs +9 -9
- package/build-module/button/button.mjs.map +2 -2
- package/build-module/card/content.mjs +3 -3
- package/build-module/card/content.mjs.map +2 -2
- package/build-module/card/full-bleed.mjs +3 -3
- package/build-module/card/full-bleed.mjs.map +2 -2
- package/build-module/card/header.mjs +3 -3
- package/build-module/card/header.mjs.map +2 -2
- package/build-module/card/root.mjs +5 -5
- package/build-module/card/root.mjs.map +2 -2
- package/build-module/card/title.mjs +16 -13
- package/build-module/card/title.mjs.map +2 -2
- package/build-module/collapsible/index.mjs +10 -0
- package/build-module/collapsible/index.mjs.map +7 -0
- package/build-module/collapsible/panel.mjs +13 -0
- package/build-module/collapsible/panel.mjs.map +7 -0
- package/build-module/collapsible/root.mjs +13 -0
- package/build-module/collapsible/root.mjs.map +7 -0
- package/build-module/collapsible/trigger.mjs +13 -0
- package/build-module/collapsible/trigger.mjs.map +7 -0
- package/build-module/collapsible/types.mjs +1 -0
- package/build-module/collapsible/types.mjs.map +7 -0
- package/build-module/collapsible-card/content.mjs +25 -4
- package/build-module/collapsible-card/content.mjs.map +3 -3
- package/build-module/collapsible-card/context.mjs +10 -0
- package/build-module/collapsible-card/context.mjs.map +7 -0
- package/build-module/collapsible-card/header-description.mjs +27 -0
- package/build-module/collapsible-card/header-description.mjs.map +7 -0
- package/build-module/collapsible-card/header.mjs +59 -40
- package/build-module/collapsible-card/header.mjs.map +3 -3
- package/build-module/collapsible-card/index.mjs +2 -0
- package/build-module/collapsible-card/index.mjs.map +2 -2
- package/build-module/collapsible-card/root.mjs +3 -3
- package/build-module/collapsible-card/root.mjs.map +2 -2
- package/build-module/dialog/action.mjs +4 -2
- package/build-module/dialog/action.mjs.map +2 -2
- package/build-module/dialog/close-icon.mjs +2 -1
- package/build-module/dialog/close-icon.mjs.map +2 -2
- package/build-module/dialog/footer.mjs +3 -3
- package/build-module/dialog/footer.mjs.map +2 -2
- package/build-module/dialog/header.mjs +3 -3
- package/build-module/dialog/header.mjs.map +2 -2
- package/build-module/dialog/popup.mjs +22 -5
- package/build-module/dialog/popup.mjs.map +2 -2
- package/build-module/dialog/title.mjs +3 -3
- package/build-module/dialog/title.mjs.map +2 -2
- package/build-module/empty-state/actions.mjs +31 -0
- package/build-module/empty-state/actions.mjs.map +7 -0
- package/build-module/empty-state/description.mjs +31 -0
- package/build-module/empty-state/description.mjs.map +7 -0
- package/build-module/empty-state/icon.mjs +34 -0
- package/build-module/empty-state/icon.mjs.map +7 -0
- package/build-module/empty-state/index.mjs +16 -0
- package/build-module/empty-state/index.mjs.map +7 -0
- package/build-module/empty-state/root.mjs +31 -0
- package/build-module/empty-state/root.mjs.map +7 -0
- package/build-module/empty-state/title.mjs +33 -0
- package/build-module/empty-state/title.mjs.map +7 -0
- package/build-module/empty-state/types.mjs +1 -0
- package/build-module/empty-state/types.mjs.map +7 -0
- package/build-module/empty-state/visual.mjs +31 -0
- package/build-module/empty-state/visual.mjs.map +7 -0
- package/build-module/form/index.mjs +4 -0
- package/build-module/form/index.mjs.map +7 -0
- package/build-module/form/input-control/index.mjs +6 -0
- package/build-module/form/input-control/index.mjs.map +7 -0
- package/build-module/form/input-control/input-control.mjs +25 -0
- package/build-module/form/input-control/input-control.mjs.map +7 -0
- package/build-module/form/input-control/types.mjs +1 -0
- package/build-module/form/input-control/types.mjs.map +7 -0
- package/build-module/form/primitives/field/description.mjs +2 -2
- package/build-module/form/primitives/field/description.mjs.map +1 -1
- package/build-module/form/primitives/field/details.mjs +2 -2
- package/build-module/form/primitives/field/details.mjs.map +1 -1
- package/build-module/form/primitives/field/label.mjs +2 -2
- package/build-module/form/primitives/field/label.mjs.map +1 -1
- package/build-module/form/primitives/field/root.mjs +4 -4
- package/build-module/form/primitives/field/root.mjs.map +2 -2
- package/build-module/form/primitives/fieldset/description.mjs +2 -2
- package/build-module/form/primitives/fieldset/description.mjs.map +1 -1
- package/build-module/form/primitives/fieldset/details.mjs +2 -2
- package/build-module/form/primitives/fieldset/details.mjs.map +1 -1
- package/build-module/form/primitives/fieldset/legend.mjs +2 -2
- package/build-module/form/primitives/fieldset/legend.mjs.map +1 -1
- package/build-module/form/primitives/fieldset/root.mjs +2 -2
- package/build-module/form/primitives/fieldset/root.mjs.map +1 -1
- package/build-module/form/primitives/input/input.mjs +6 -6
- package/build-module/form/primitives/input/input.mjs.map +2 -2
- package/build-module/form/primitives/input-layout/input-layout.mjs +4 -4
- package/build-module/form/primitives/input-layout/input-layout.mjs.map +1 -1
- package/build-module/form/primitives/input-layout/slot.mjs +5 -4
- package/build-module/form/primitives/input-layout/slot.mjs.map +2 -2
- package/build-module/form/primitives/select/item.mjs +5 -5
- package/build-module/form/primitives/select/item.mjs.map +2 -2
- package/build-module/form/primitives/select/popup.mjs +7 -7
- package/build-module/form/primitives/select/popup.mjs.map +2 -2
- package/build-module/form/primitives/select/trigger.mjs +7 -7
- package/build-module/form/primitives/select/trigger.mjs.map +2 -2
- package/build-module/form/primitives/textarea/textarea.mjs +3 -3
- package/build-module/form/primitives/textarea/textarea.mjs.map +2 -2
- package/build-module/form/types.mjs +1 -0
- package/build-module/form/types.mjs.map +7 -0
- package/build-module/icon-button/icon-button.mjs +2 -2
- package/build-module/icon-button/icon-button.mjs.map +1 -1
- package/build-module/index.mjs +7 -1
- package/build-module/index.mjs.map +2 -2
- package/build-module/link/link.mjs +8 -8
- package/build-module/link/link.mjs.map +2 -2
- package/build-module/notice/action-button.mjs +2 -2
- package/build-module/notice/action-button.mjs.map +1 -1
- package/build-module/notice/action-link.mjs +2 -2
- package/build-module/notice/action-link.mjs.map +1 -1
- package/build-module/notice/actions.mjs +2 -2
- package/build-module/notice/actions.mjs.map +1 -1
- package/build-module/notice/close-icon.mjs +2 -2
- package/build-module/notice/close-icon.mjs.map +1 -1
- package/build-module/notice/description.mjs +2 -2
- package/build-module/notice/description.mjs.map +1 -1
- package/build-module/notice/index.mjs.map +1 -1
- package/build-module/notice/root.mjs +4 -4
- package/build-module/notice/root.mjs.map +1 -1
- package/build-module/notice/title.mjs +2 -2
- package/build-module/notice/title.mjs.map +1 -1
- package/build-module/stack/stack.mjs +2 -2
- package/build-module/stack/stack.mjs.map +1 -1
- package/build-module/tabs/context.mjs +101 -0
- package/build-module/tabs/context.mjs.map +7 -0
- package/build-module/tabs/list.mjs +3 -3
- package/build-module/tabs/list.mjs.map +2 -2
- package/build-module/tabs/panel.mjs +5 -3
- package/build-module/tabs/panel.mjs.map +2 -2
- package/build-module/tabs/root.mjs +2 -1
- package/build-module/tabs/root.mjs.map +2 -2
- package/build-module/tabs/tab.mjs +5 -3
- package/build-module/tabs/tab.mjs.map +2 -2
- package/build-module/text/text.mjs +2 -2
- package/build-module/text/text.mjs.map +1 -1
- package/build-module/tooltip/popup.mjs +4 -4
- package/build-module/tooltip/popup.mjs.map +1 -1
- package/build-module/tooltip/root.mjs.map +2 -2
- package/build-module/utils/use-deprioritized-initial-focus.mjs +39 -0
- package/build-module/utils/use-deprioritized-initial-focus.mjs.map +7 -0
- package/build-module/visually-hidden/visually-hidden.mjs +2 -2
- package/build-module/visually-hidden/visually-hidden.mjs.map +1 -1
- package/build-types/alert-dialog/context.d.ts +8 -0
- package/build-types/alert-dialog/context.d.ts.map +1 -0
- package/build-types/alert-dialog/index.d.ts +4 -0
- package/build-types/alert-dialog/index.d.ts.map +1 -0
- package/build-types/alert-dialog/popup.d.ts +4 -0
- package/build-types/alert-dialog/popup.d.ts.map +1 -0
- package/build-types/alert-dialog/root.d.ts +24 -0
- package/build-types/alert-dialog/root.d.ts.map +1 -0
- package/build-types/alert-dialog/stories/index.story.d.ts +44 -0
- package/build-types/alert-dialog/stories/index.story.d.ts.map +1 -0
- package/build-types/alert-dialog/test/index.test.d.ts +2 -0
- package/build-types/alert-dialog/test/index.test.d.ts.map +1 -0
- package/build-types/alert-dialog/trigger.d.ts +6 -0
- package/build-types/alert-dialog/trigger.d.ts.map +1 -0
- package/build-types/alert-dialog/types.d.ts +70 -0
- package/build-types/alert-dialog/types.d.ts.map +1 -0
- package/build-types/card/title.d.ts.map +1 -1
- package/build-types/collapsible/index.d.ts +5 -0
- package/build-types/collapsible/index.d.ts.map +1 -0
- package/build-types/collapsible/panel.d.ts +16 -0
- package/build-types/collapsible/panel.d.ts.map +1 -0
- package/build-types/collapsible/root.d.ts +15 -0
- package/build-types/collapsible/root.d.ts.map +1 -0
- package/build-types/collapsible/stories/index.story.d.ts +18 -0
- package/build-types/collapsible/stories/index.story.d.ts.map +1 -0
- package/build-types/collapsible/test/index.test.d.ts +2 -0
- package/build-types/collapsible/test/index.test.d.ts.map +1 -0
- package/build-types/collapsible/trigger.d.ts +15 -0
- package/build-types/collapsible/trigger.d.ts.map +1 -0
- package/build-types/collapsible/types.d.ts +22 -0
- package/build-types/collapsible/types.d.ts.map +1 -0
- package/build-types/collapsible-card/content.d.ts.map +1 -1
- package/build-types/collapsible-card/context.d.ts +4 -0
- package/build-types/collapsible-card/context.d.ts.map +1 -0
- package/build-types/collapsible-card/header-description.d.ts +15 -0
- package/build-types/collapsible-card/header-description.d.ts.map +1 -0
- package/build-types/collapsible-card/header.d.ts.map +1 -1
- package/build-types/collapsible-card/index.d.ts +2 -1
- package/build-types/collapsible-card/index.d.ts.map +1 -1
- package/build-types/collapsible-card/stories/index.story.d.ts +10 -0
- package/build-types/collapsible-card/stories/index.story.d.ts.map +1 -1
- package/build-types/collapsible-card/types.d.ts +21 -0
- package/build-types/collapsible-card/types.d.ts.map +1 -1
- package/build-types/dialog/action.d.ts.map +1 -1
- package/build-types/dialog/close-icon.d.ts.map +1 -1
- package/build-types/dialog/popup.d.ts.map +1 -1
- package/build-types/dialog/stories/index.story.d.ts +0 -6
- package/build-types/dialog/stories/index.story.d.ts.map +1 -1
- package/build-types/dialog/types.d.ts +5 -5
- package/build-types/dialog/types.d.ts.map +1 -1
- package/build-types/empty-state/actions.d.ts +7 -0
- package/build-types/empty-state/actions.d.ts.map +1 -0
- package/build-types/empty-state/description.d.ts +7 -0
- package/build-types/empty-state/description.d.ts.map +1 -0
- package/build-types/empty-state/icon.d.ts +7 -0
- package/build-types/empty-state/icon.d.ts.map +1 -0
- package/build-types/empty-state/index.d.ts +8 -0
- package/build-types/empty-state/index.d.ts.map +1 -0
- package/build-types/empty-state/root.d.ts +6 -0
- package/build-types/empty-state/root.d.ts.map +1 -0
- package/build-types/empty-state/stories/index.story.d.ts +8 -0
- package/build-types/empty-state/stories/index.story.d.ts.map +1 -0
- package/build-types/empty-state/test/actions.test.d.ts +2 -0
- package/build-types/empty-state/test/actions.test.d.ts.map +1 -0
- package/build-types/empty-state/test/description.test.d.ts +2 -0
- package/build-types/empty-state/test/description.test.d.ts.map +1 -0
- package/build-types/empty-state/test/icon.test.d.ts +2 -0
- package/build-types/empty-state/test/icon.test.d.ts.map +1 -0
- package/build-types/empty-state/test/root.test.d.ts +2 -0
- package/build-types/empty-state/test/root.test.d.ts.map +1 -0
- package/build-types/empty-state/test/title.test.d.ts +2 -0
- package/build-types/empty-state/test/title.test.d.ts.map +1 -0
- package/build-types/empty-state/test/visual.test.d.ts +2 -0
- package/build-types/empty-state/test/visual.test.d.ts.map +1 -0
- package/build-types/empty-state/title.d.ts +6 -0
- package/build-types/empty-state/title.d.ts.map +1 -0
- package/build-types/empty-state/types.d.ts +40 -0
- package/build-types/empty-state/types.d.ts.map +1 -0
- package/build-types/empty-state/visual.d.ts +7 -0
- package/build-types/empty-state/visual.d.ts.map +1 -0
- package/build-types/form/index.d.ts +3 -0
- package/build-types/form/index.d.ts.map +1 -0
- package/build-types/form/input-control/index.d.ts +2 -0
- package/build-types/form/input-control/index.d.ts.map +1 -0
- package/build-types/form/input-control/input-control.d.ts +6 -0
- package/build-types/form/input-control/input-control.d.ts.map +1 -0
- package/build-types/form/input-control/stories/index.story.d.ts +16 -0
- package/build-types/form/input-control/stories/index.story.d.ts.map +1 -0
- package/build-types/form/input-control/test/index.test.d.ts +2 -0
- package/build-types/form/input-control/test/index.test.d.ts.map +1 -0
- package/build-types/form/input-control/types.d.ts +4 -0
- package/build-types/form/input-control/types.d.ts.map +1 -0
- package/build-types/form/primitives/field/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/fieldset/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/input/stories/index.story.d.ts +2 -0
- package/build-types/form/primitives/input/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/input-layout/slot.d.ts.map +1 -1
- package/build-types/form/primitives/input-layout/stories/index.story.d.ts +5 -0
- package/build-types/form/primitives/input-layout/stories/index.story.d.ts.map +1 -1
- package/build-types/form/stories/shared.d.ts +3 -0
- package/build-types/form/stories/shared.d.ts.map +1 -0
- package/build-types/form/types.d.ts +30 -0
- package/build-types/form/types.d.ts.map +1 -0
- package/build-types/index.d.ts +4 -1
- package/build-types/index.d.ts.map +1 -1
- package/build-types/notice/index.d.ts +0 -1
- package/build-types/notice/index.d.ts.map +1 -1
- package/build-types/tabs/context.d.ts +26 -0
- package/build-types/tabs/context.d.ts.map +1 -0
- package/build-types/tabs/panel.d.ts.map +1 -1
- package/build-types/tabs/root.d.ts.map +1 -1
- package/build-types/tabs/tab.d.ts.map +1 -1
- package/build-types/tooltip/root.d.ts +12 -0
- package/build-types/tooltip/root.d.ts.map +1 -1
- package/build-types/tooltip/stories/index.story.d.ts.map +1 -1
- package/build-types/utils/test/use-deprioritized-initial-focus.test.d.ts +2 -0
- package/build-types/utils/test/use-deprioritized-initial-focus.test.d.ts.map +1 -0
- package/build-types/utils/use-deprioritized-initial-focus.d.ts +35 -0
- package/build-types/utils/use-deprioritized-initial-focus.d.ts.map +1 -0
- package/package.json +17 -16
- package/src/alert-dialog/context.tsx +14 -0
- package/src/alert-dialog/index.ts +3 -0
- package/src/alert-dialog/popup.tsx +58 -0
- package/src/alert-dialog/root.tsx +48 -0
- package/src/alert-dialog/stories/index.story.tsx +254 -0
- package/src/alert-dialog/style.module.css +10 -0
- package/src/alert-dialog/test/index.test.tsx +537 -0
- package/src/alert-dialog/trigger.tsx +15 -0
- package/src/alert-dialog/types.ts +83 -0
- package/src/badge/style.module.css +5 -2
- package/src/button/style.module.css +2 -0
- package/src/card/stories/index.story.tsx +1 -1
- package/src/card/style.module.css +5 -7
- package/src/card/title.tsx +12 -11
- package/src/collapsible/index.ts +5 -0
- package/src/collapsible/panel.tsx +16 -0
- package/src/collapsible/root.tsx +15 -0
- package/src/collapsible/stories/index.story.tsx +108 -0
- package/src/collapsible/test/index.test.tsx +228 -0
- package/src/collapsible/trigger.tsx +15 -0
- package/src/collapsible/types.ts +24 -0
- package/src/collapsible-card/content.tsx +17 -4
- package/src/collapsible-card/context.ts +7 -0
- package/src/collapsible-card/header-description.tsx +43 -0
- package/src/collapsible-card/header.tsx +50 -45
- package/src/collapsible-card/index.ts +2 -1
- package/src/collapsible-card/root.tsx +1 -1
- package/src/collapsible-card/stories/index.story.tsx +99 -1
- package/src/collapsible-card/style.module.css +49 -4
- package/src/collapsible-card/test/index.test.tsx +107 -40
- package/src/collapsible-card/types.ts +22 -0
- package/src/dialog/action.tsx +8 -2
- package/src/dialog/close-icon.tsx +1 -0
- package/src/dialog/popup.tsx +21 -2
- package/src/dialog/stories/index.story.tsx +0 -28
- package/src/dialog/style.module.css +5 -5
- package/src/dialog/test/index.test.tsx +117 -0
- package/src/dialog/types.ts +11 -5
- package/src/empty-state/actions.tsx +24 -0
- package/src/empty-state/description.tsx +27 -0
- package/src/empty-state/icon.tsx +24 -0
- package/src/empty-state/index.ts +8 -0
- package/src/empty-state/root.tsx +23 -0
- package/src/empty-state/stories/index.story.tsx +64 -0
- package/src/empty-state/style.module.css +53 -0
- package/src/empty-state/test/actions.test.tsx +18 -0
- package/src/empty-state/test/description.test.tsx +13 -0
- package/src/empty-state/test/icon.test.tsx +13 -0
- package/src/empty-state/test/root.test.tsx +13 -0
- package/src/empty-state/test/title.test.tsx +13 -0
- package/src/empty-state/test/visual.test.tsx +17 -0
- package/src/empty-state/title.tsx +23 -0
- package/src/empty-state/types.ts +45 -0
- package/src/empty-state/visual.tsx +24 -0
- package/src/form/index.ts +3 -0
- package/src/form/input-control/index.ts +1 -0
- package/src/form/input-control/input-control.tsx +33 -0
- package/src/form/input-control/stories/index.story.tsx +163 -0
- package/src/form/input-control/test/index.test.tsx +53 -0
- package/src/form/input-control/types.ts +5 -0
- package/src/form/primitives/field/root.tsx +2 -2
- package/src/form/primitives/field/stories/index.story.tsx +2 -7
- package/src/form/primitives/fieldset/stories/index.story.tsx +2 -7
- package/src/form/primitives/input/stories/index.story.tsx +7 -0
- package/src/form/primitives/input-layout/slot.tsx +6 -2
- package/src/form/primitives/input-layout/stories/index.story.tsx +22 -1
- package/src/form/primitives/stories/overview.mdx +15 -0
- package/src/form/primitives/textarea/textarea.tsx +1 -1
- package/src/form/stories/shared.tsx +19 -0
- package/src/form/types.ts +34 -0
- package/src/index.ts +4 -1
- package/src/notice/index.ts +0 -2
- package/src/notice/style.module.css +1 -1
- package/src/tabs/context.tsx +170 -0
- package/src/tabs/panel.tsx +3 -0
- package/src/tabs/root.tsx +6 -1
- package/src/tabs/style.module.css +1 -1
- package/src/tabs/tab.tsx +3 -0
- package/src/tabs/test/index.test.tsx +162 -0
- package/src/tooltip/root.tsx +12 -0
- package/src/tooltip/stories/index.story.tsx +20 -15
- package/src/utils/css/focus.module.css +4 -2
- package/src/utils/css/item-popup.module.css +1 -0
- package/src/utils/css/select-trigger.module.css +1 -0
- package/src/utils/test/use-deprioritized-initial-focus.test.tsx +230 -0
- package/src/utils/use-deprioritized-initial-focus.ts +83 -0
- package/AGENTS.md +0 -9
- package/CLAUDE.md +0 -1
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
// packages/ui/src/utils/use-deprioritized-initial-focus.ts
|
|
2
|
+
import { useMemo, useRef } from "@wordpress/element";
|
|
3
|
+
import { tabbable } from "tabbable";
|
|
4
|
+
var getTabbableOptions = () => ({
|
|
5
|
+
getShadowRoot: true,
|
|
6
|
+
displayCheck: typeof ResizeObserver === "function" && ResizeObserver.toString().includes("[native code]") ? "full" : "none"
|
|
7
|
+
});
|
|
8
|
+
function useDeprioritizedInitialFocus({
|
|
9
|
+
initialFocus,
|
|
10
|
+
deprioritizedAttribute
|
|
11
|
+
}) {
|
|
12
|
+
const popupRef = useRef(null);
|
|
13
|
+
const resolvedInitialFocus = useMemo(() => {
|
|
14
|
+
if (initialFocus !== void 0 && initialFocus !== true) {
|
|
15
|
+
return initialFocus;
|
|
16
|
+
}
|
|
17
|
+
return (interactionType) => {
|
|
18
|
+
if (interactionType === "touch") {
|
|
19
|
+
return popupRef.current ?? true;
|
|
20
|
+
}
|
|
21
|
+
const popup = popupRef.current;
|
|
22
|
+
if (!popup) {
|
|
23
|
+
return true;
|
|
24
|
+
}
|
|
25
|
+
const tabbables = tabbable(popup, getTabbableOptions());
|
|
26
|
+
for (const el of tabbables) {
|
|
27
|
+
if (el instanceof HTMLElement && !el.hasAttribute(deprioritizedAttribute)) {
|
|
28
|
+
return el;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
return true;
|
|
32
|
+
};
|
|
33
|
+
}, [initialFocus, deprioritizedAttribute]);
|
|
34
|
+
return { resolvedInitialFocus, popupRef };
|
|
35
|
+
}
|
|
36
|
+
export {
|
|
37
|
+
useDeprioritizedInitialFocus
|
|
38
|
+
};
|
|
39
|
+
//# sourceMappingURL=use-deprioritized-initial-focus.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/utils/use-deprioritized-initial-focus.ts"],
|
|
4
|
+
"sourcesContent": ["import type { Dialog as _Dialog } from '@base-ui/react/dialog';\nimport { useMemo, useRef } from '@wordpress/element';\nimport { tabbable } from 'tabbable';\n\n/**\n * Derived from Base UI's `Dialog.Popup.Props['initialFocus']`.\n * The same type is shared by all Base UI overlay popups (Dialog, Popover, etc.).\n */\ntype InitialFocus = _Dialog.Popup.Props[ 'initialFocus' ];\n\n/**\n * Options matching Base UI's internal tabbable configuration.\n * @see https://github.com/floating-ui/floating-ui/blob/master/packages/react/src/utils/tabbable.ts\n */\nconst getTabbableOptions = () => ( {\n\tgetShadowRoot: true,\n\tdisplayCheck:\n\t\ttypeof ResizeObserver === 'function' &&\n\t\tResizeObserver.toString().includes( '[native code]' )\n\t\t\t? ( 'full' as const )\n\t\t\t: ( 'none' as const ),\n} );\n\n/**\n * Returns a resolved `initialFocus` value that deprioritizes elements\n * marked with a given data attribute (e.g. a close icon), and an internal\n * ref that must be merged onto the popup element.\n *\n * When `initialFocus` is `undefined` or `true` (the default behavior),\n * the hook replaces it with a callback that:\n * 1. On touch interactions \u2014 focuses the popup element itself (preventing\n * the virtual keyboard on Android), matching Base UI's default.\n * 2. On other interactions \u2014 returns the first tabbable element that does\n * *not* carry `deprioritizedAttribute`. Falls back to Base UI's default\n * when the deprioritized element is the only tabbable element.\n *\n * All other `initialFocus` values (`false`, `RefObject`, callback) pass\n * through unchanged.\n *\n * @param props\n * @param props.initialFocus The consumer-provided `initialFocus` value.\n * @param props.deprioritizedAttribute The data attribute whose elements should be deprioritized.\n */\nexport function useDeprioritizedInitialFocus( {\n\tinitialFocus,\n\tdeprioritizedAttribute,\n}: {\n\tinitialFocus: InitialFocus;\n\tdeprioritizedAttribute: string;\n} ) {\n\tconst popupRef = useRef< HTMLDivElement >( null );\n\n\tconst resolvedInitialFocus = useMemo( (): InitialFocus => {\n\t\tif ( initialFocus !== undefined && initialFocus !== true ) {\n\t\t\treturn initialFocus;\n\t\t}\n\n\t\treturn ( interactionType ): HTMLElement | boolean | null => {\n\t\t\tif ( interactionType === 'touch' ) {\n\t\t\t\treturn popupRef.current ?? true;\n\t\t\t}\n\n\t\t\tconst popup = popupRef.current;\n\t\t\tif ( ! popup ) {\n\t\t\t\treturn true;\n\t\t\t}\n\n\t\t\tconst tabbables = tabbable( popup, getTabbableOptions() );\n\t\t\tfor ( const el of tabbables ) {\n\t\t\t\tif (\n\t\t\t\t\tel instanceof HTMLElement &&\n\t\t\t\t\t! el.hasAttribute( deprioritizedAttribute )\n\t\t\t\t) {\n\t\t\t\t\treturn el;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn true;\n\t\t};\n\t}, [ initialFocus, deprioritizedAttribute ] );\n\n\treturn { resolvedInitialFocus, popupRef };\n}\n"],
|
|
5
|
+
"mappings": ";AACA,SAAS,SAAS,cAAc;AAChC,SAAS,gBAAgB;AAYzB,IAAM,qBAAqB,OAAQ;AAAA,EAClC,eAAe;AAAA,EACf,cACC,OAAO,mBAAmB,cAC1B,eAAe,SAAS,EAAE,SAAU,eAAgB,IAC/C,SACA;AACP;AAsBO,SAAS,6BAA8B;AAAA,EAC7C;AAAA,EACA;AACD,GAGI;AACH,QAAM,WAAW,OAA0B,IAAK;AAEhD,QAAM,uBAAuB,QAAS,MAAoB;AACzD,QAAK,iBAAiB,UAAa,iBAAiB,MAAO;AAC1D,aAAO;AAAA,IACR;AAEA,WAAO,CAAE,oBAAmD;AAC3D,UAAK,oBAAoB,SAAU;AAClC,eAAO,SAAS,WAAW;AAAA,MAC5B;AAEA,YAAM,QAAQ,SAAS;AACvB,UAAK,CAAE,OAAQ;AACd,eAAO;AAAA,MACR;AAEA,YAAM,YAAY,SAAU,OAAO,mBAAmB,CAAE;AACxD,iBAAY,MAAM,WAAY;AAC7B,YACC,cAAc,eACd,CAAE,GAAG,aAAc,sBAAuB,GACzC;AACD,iBAAO;AAAA,QACR;AAAA,MACD;AAEA,aAAO;AAAA,IACR;AAAA,EACD,GAAG,CAAE,cAAc,sBAAuB,CAAE;AAE5C,SAAO,EAAE,sBAAsB,SAAS;AACzC;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -3,9 +3,9 @@ import { mergeProps, useRender } from "@base-ui/react";
|
|
|
3
3
|
import { forwardRef } from "@wordpress/element";
|
|
4
4
|
|
|
5
5
|
// packages/ui/src/visually-hidden/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='c46e8cb841']")) {
|
|
7
7
|
const style = document.createElement("style");
|
|
8
|
-
style.setAttribute("data-wp-hash", "
|
|
8
|
+
style.setAttribute("data-wp-hash", "c46e8cb841");
|
|
9
9
|
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}"));
|
|
10
10
|
document.head.appendChild(style);
|
|
11
11
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/visually-hidden/visually-hidden.tsx", "../../src/visually-hidden/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef } from '@wordpress/element';\nimport type { VisuallyHiddenProps } from './types';\nimport styles from './style.module.css';\n\n/**\n * Visually hides content while keeping it accessible to screen readers.\n * Useful when providing context that's only meaningful to assistive technology.\n */\nexport const VisuallyHidden = forwardRef< HTMLDivElement, VisuallyHiddenProps >(\n\tfunction VisuallyHidden( { render, ...restProps }, ref ) {\n\t\tconst element = useRender( {\n\t\t\trender,\n\t\t\tref,\n\t\t\tprops: mergeProps< 'div' >(\n\t\t\t\t{ className: styles[ 'visually-hidden' ] },\n\t\t\t\trestProps\n\t\t\t),\n\t\t} );\n\n\t\treturn element;\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='
|
|
4
|
+
"sourcesContent": ["import { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef } from '@wordpress/element';\nimport type { VisuallyHiddenProps } from './types';\nimport styles from './style.module.css';\n\n/**\n * Visually hides content while keeping it accessible to screen readers.\n * Useful when providing context that's only meaningful to assistive technology.\n */\nexport const VisuallyHidden = forwardRef< HTMLDivElement, VisuallyHiddenProps >(\n\tfunction VisuallyHidden( { render, ...restProps }, ref ) {\n\t\tconst element = useRender( {\n\t\t\trender,\n\t\t\tref,\n\t\t\tprops: mergeProps< 'div' >(\n\t\t\t\t{ className: styles[ 'visually-hidden' ] },\n\t\t\t\trestProps\n\t\t\t),\n\t\t} );\n\n\t\treturn element;\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='c46e8cb841']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"c46e8cb841\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"visually-hidden\":\"f37b9e2e191ebd66__visually-hidden\"};\n"],
|
|
5
5
|
"mappings": ";AAAA,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,0RAA0R,CAAC;AACrU,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,mBAAkB,oCAAmC;;;ADG9D,IAAM,iBAAiB;AAAA,EAC7B,SAASA,gBAAgB,EAAE,QAAQ,GAAG,UAAU,GAAG,KAAM;AACxD,UAAM,UAAU,UAAW;AAAA,MAC1B;AAAA,MACA;AAAA,MACA,OAAO;AAAA,QACN,EAAE,WAAW,cAAQ,iBAAkB,EAAE;AAAA,QACzC;AAAA,MACD;AAAA,IACD,CAAE;AAEF,WAAO;AAAA,EACR;AACD;",
|
|
6
6
|
"names": ["VisuallyHidden"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { RootProps } from './types';
|
|
2
|
+
type Intent = NonNullable<RootProps['intent']>;
|
|
3
|
+
interface AlertDialogContextValue {
|
|
4
|
+
intent: Intent;
|
|
5
|
+
}
|
|
6
|
+
declare const AlertDialogContext: import("react").Context<AlertDialogContextValue>;
|
|
7
|
+
export { AlertDialogContext };
|
|
8
|
+
//# sourceMappingURL=context.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/context.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,KAAK,MAAM,GAAG,WAAW,CAAE,SAAS,CAAE,QAAQ,CAAE,CAAE,CAAC;AAEnD,UAAU,uBAAuB;IAChC,MAAM,EAAE,MAAM,CAAC;CACf;AAED,QAAA,MAAM,kBAAkB,kDAErB,CAAC;AAEJ,OAAO,EAAE,kBAAkB,EAAE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"popup.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/popup.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,QAAA,MAAM,KAAK,uGA+CV,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import type { RootProps } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* A dialog that requires a user response to proceed.
|
|
4
|
+
*
|
|
5
|
+
* Use `AlertDialog.Trigger` to render a button that opens the dialog.
|
|
6
|
+
* Use `AlertDialog.Popup` to render the dialog content.
|
|
7
|
+
* The `AlertDialog.Trigger` is optional — the dialog can also be controlled
|
|
8
|
+
* via `open` / `onOpenChange` props.
|
|
9
|
+
*
|
|
10
|
+
* ## Use cases
|
|
11
|
+
*
|
|
12
|
+
* - **Default intent**: Standard confirmation dialog for reversible actions.
|
|
13
|
+
* - **Irreversible intent**: Confirmation dialog for irreversible actions that
|
|
14
|
+
* cannot be undone. The confirm button uses error/danger coloring.
|
|
15
|
+
*
|
|
16
|
+
* For use cases outside the standard confirm/cancel pattern, use the lower-level
|
|
17
|
+
* `Dialog` component directly.
|
|
18
|
+
*
|
|
19
|
+
* See the [Destructive Actions guidelines](?path=/docs/design-system-patterns-destructive-actions--docs)
|
|
20
|
+
* for more details on when to use each pattern.
|
|
21
|
+
*/
|
|
22
|
+
declare function Root({ intent, children, open, onOpenChange, defaultOpen, }: RootProps): import("react").JSX.Element;
|
|
23
|
+
export { Root };
|
|
24
|
+
//# sourceMappingURL=root.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/root.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC;;;;;;;;;;;;;;;;;;;GAmBG;AACH,iBAAS,IAAI,CAAE,EACd,MAAkB,EAClB,QAAQ,EACR,IAAI,EACJ,YAAY,EACZ,WAAW,GACX,EAAE,SAAS,+BAcX;AAED,OAAO,EAAE,IAAI,EAAE,CAAC"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { AlertDialog } from '../..';
|
|
3
|
+
declare const meta: Meta<typeof AlertDialog.Root>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof AlertDialog.Root>;
|
|
6
|
+
/**
|
|
7
|
+
* Standard confirmation dialog for reversible actions. The dialog can be
|
|
8
|
+
* dismissed via Escape key or the cancel/confirm buttons. Backdrop click
|
|
9
|
+
* is blocked.
|
|
10
|
+
*/
|
|
11
|
+
export declare const Default: Story;
|
|
12
|
+
/**
|
|
13
|
+
* Confirmation dialog for irreversible actions that cannot be undone.
|
|
14
|
+
* The confirm button uses error/danger coloring.
|
|
15
|
+
*/
|
|
16
|
+
export declare const Irreversible: Story;
|
|
17
|
+
/**
|
|
18
|
+
* Example with custom button text for both confirm and cancel buttons.
|
|
19
|
+
*/
|
|
20
|
+
export declare const CustomButtonText: Story;
|
|
21
|
+
/**
|
|
22
|
+
* Example showing composition with a menu. The `AlertDialog.Trigger` is
|
|
23
|
+
* composed with Base UI's `Menu.Item` using the `render` prop, allowing the
|
|
24
|
+
* menu item to directly trigger the alert dialog.
|
|
25
|
+
*
|
|
26
|
+
* Note: the example currently uses the `Menu` component from BaseUI, although
|
|
27
|
+
* consumers should not use BaseUI directly and instead use the DS `Menu`
|
|
28
|
+
* component (not ready yet).
|
|
29
|
+
*/
|
|
30
|
+
export declare const MenuTrigger: Story;
|
|
31
|
+
/**
|
|
32
|
+
* Consumer-driven async confirm flow. The consumer uses controlled mode to
|
|
33
|
+
* keep the dialog open while the async operation is in progress, and passes
|
|
34
|
+
* `loading` to show a spinner on the confirm button and disable the cancel
|
|
35
|
+
* button.
|
|
36
|
+
*/
|
|
37
|
+
export declare const AsyncConfirm: Story;
|
|
38
|
+
/**
|
|
39
|
+
* The `AlertDialog.Trigger` element is not necessary when the open state is
|
|
40
|
+
* controlled externally. This is useful when the dialog needs to be opened
|
|
41
|
+
* from code or from a non-standard trigger element.
|
|
42
|
+
*/
|
|
43
|
+
export declare const Controlled: Story;
|
|
44
|
+
//# sourceMappingURL=index.story.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/alert-dialog/stories/index.story.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAI5D,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,WAAW,CAAC,IAAI,CAUxC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,WAAW,CAAC,IAAI,CAAE,CAAC;AAEjD;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,KAcrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,YAAY,EAAE,KAgB1B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAiB9B,CAAC;AAuBF;;;;;;;;GAQG;AACH,eAAO,MAAM,WAAW,EAAE,KAkDzB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,YAAY,EAAE,KA4C1B,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,UAAU,EAAE,KA0BxB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.test.d.ts","sourceRoot":"","sources":["../../../src/alert-dialog/test/index.test.tsx"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Renders a button that opens the alert dialog when clicked.
|
|
3
|
+
*/
|
|
4
|
+
declare const Trigger: import("react").ForwardRefExoticComponent<import("../dialog/types").TriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
5
|
+
export { Trigger };
|
|
6
|
+
//# sourceMappingURL=trigger.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"trigger.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/trigger.tsx"],"names":[],"mappings":"AAKA;;GAEG;AACH,QAAA,MAAM,OAAO,sIAIZ,CAAC;AAEF,OAAO,EAAE,OAAO,EAAE,CAAC"}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
import type { AlertDialog as _AlertDialog } from '@base-ui/react/alert-dialog';
|
|
2
|
+
import type { ReactNode } from 'react';
|
|
3
|
+
import type { TriggerProps as DialogTriggerProps } from '../dialog/types';
|
|
4
|
+
export interface RootProps extends Pick<_AlertDialog.Root.Props, 'open' | 'onOpenChange' | 'defaultOpen'> {
|
|
5
|
+
/**
|
|
6
|
+
* The content to be rendered inside the component. Typically includes
|
|
7
|
+
* `AlertDialog.Trigger` and `AlertDialog.Popup`.
|
|
8
|
+
*/
|
|
9
|
+
children: ReactNode;
|
|
10
|
+
/**
|
|
11
|
+
* The semantic intent of the dialog, which determines its styling.
|
|
12
|
+
*
|
|
13
|
+
* All intents use `role="alertdialog"`, are always modal, and block
|
|
14
|
+
* backdrop click dismissal. Escape key and the cancel/confirm buttons
|
|
15
|
+
* still dismiss the dialog.
|
|
16
|
+
*
|
|
17
|
+
* - `'default'`: Standard confirmation dialog for reversible actions.
|
|
18
|
+
* - `'irreversible'`: Confirmation dialog for irreversible actions that
|
|
19
|
+
* cannot be undone. The confirm button uses error/danger coloring.
|
|
20
|
+
*
|
|
21
|
+
* @default 'default'
|
|
22
|
+
*/
|
|
23
|
+
intent?: 'default' | 'irreversible';
|
|
24
|
+
}
|
|
25
|
+
export type TriggerProps = DialogTriggerProps;
|
|
26
|
+
export interface PopupProps {
|
|
27
|
+
/**
|
|
28
|
+
* The title displayed in the dialog header. This serves as both the
|
|
29
|
+
* visible heading and the accessible label for the dialog.
|
|
30
|
+
*/
|
|
31
|
+
title: string;
|
|
32
|
+
/**
|
|
33
|
+
* The message content displayed in the dialog body.
|
|
34
|
+
*/
|
|
35
|
+
children: ReactNode;
|
|
36
|
+
/**
|
|
37
|
+
* Callback fired when the user confirms the action.
|
|
38
|
+
*/
|
|
39
|
+
onConfirm: () => void;
|
|
40
|
+
/**
|
|
41
|
+
* Custom text for the confirm button.
|
|
42
|
+
*
|
|
43
|
+
* @default 'OK'
|
|
44
|
+
*/
|
|
45
|
+
confirmButtonText?: string;
|
|
46
|
+
/**
|
|
47
|
+
* Custom text for the cancel button.
|
|
48
|
+
*
|
|
49
|
+
* @default 'Cancel'
|
|
50
|
+
*/
|
|
51
|
+
cancelButtonText?: string;
|
|
52
|
+
/**
|
|
53
|
+
* Whether the confirm action is in a loading state (e.g. an async
|
|
54
|
+
* operation is in progress). When `true`, the confirm button shows a
|
|
55
|
+
* spinner and the cancel button is disabled.
|
|
56
|
+
*
|
|
57
|
+
* **Important:** Passing this prop — even as `false` — opts into
|
|
58
|
+
* manual-close mode: the confirm button will no longer auto-close the
|
|
59
|
+
* dialog. The consumer is responsible for setting `open={false}` when
|
|
60
|
+
* the operation completes. Omit the prop entirely for the default
|
|
61
|
+
* auto-close-on-confirm behavior.
|
|
62
|
+
*
|
|
63
|
+
* To implement an async confirm flow, use controlled mode
|
|
64
|
+
* (`open` / `onOpenChange`) and manage the loading state externally:
|
|
65
|
+
* prevent closing in `onOpenChange` while loading, and set
|
|
66
|
+
* `open={false}` once the operation completes.
|
|
67
|
+
*/
|
|
68
|
+
loading?: boolean;
|
|
69
|
+
}
|
|
70
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,IAAI,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC/E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,YAAY,IAAI,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAE1E,MAAM,WAAW,SAChB,SAAQ,IAAI,CACX,YAAY,CAAC,IAAI,CAAC,KAAK,EACvB,MAAM,GAAG,cAAc,GAAG,aAAa,CACvC;IACD;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;;;;;;OAYG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,cAAc,CAAC;CACpC;AAED,MAAM,MAAM,YAAY,GAAG,kBAAkB,CAAC;AAE9C,MAAM,WAAW,UAAU;IAC1B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,SAAS,EAAE,MAAM,IAAI,CAAC;IAEtB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;;;;;;;;;;;;OAeG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CAClB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../src/card/title.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../src/card/title.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C;;;GAGG;AACH,eAAO,MAAM,KAAK,uGAYjB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/collapsible/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A panel with the collapsible contents. Hidden when collapsed, visible
|
|
3
|
+
* when expanded.
|
|
4
|
+
*
|
|
5
|
+
* `Collapsible` is a collection of React components that combine to render
|
|
6
|
+
* a collapsible panel controlled by a button.
|
|
7
|
+
*/
|
|
8
|
+
export declare const Panel: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react").CollapsiblePanelProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref">, "className" | "children" | "render"> & {
|
|
9
|
+
className?: string;
|
|
10
|
+
render?: ((props: import("react").HTMLAttributes<any> & {
|
|
11
|
+
ref?: import("react").Ref<any> | undefined;
|
|
12
|
+
}) => React.ReactElement<unknown>) | React.ReactElement<Record<string, unknown>>;
|
|
13
|
+
} & {
|
|
14
|
+
children?: import("react").ReactNode;
|
|
15
|
+
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
16
|
+
//# sourceMappingURL=panel.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"panel.d.ts","sourceRoot":"","sources":["../../src/collapsible/panel.tsx"],"names":[],"mappings":"AAIA;;;;;;GAMG;AACH,eAAO,MAAM,KAAK;;;;;;;kDAIjB,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Groups all parts of the collapsible.
|
|
3
|
+
*
|
|
4
|
+
* `Collapsible` is a collection of React components that combine to render
|
|
5
|
+
* a collapsible panel controlled by a button.
|
|
6
|
+
*/
|
|
7
|
+
export declare const Root: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react").CollapsibleRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref">, "className" | "children" | "render"> & {
|
|
8
|
+
className?: string;
|
|
9
|
+
render?: ((props: import("react").HTMLAttributes<any> & {
|
|
10
|
+
ref?: import("react").Ref<any> | undefined;
|
|
11
|
+
}) => React.ReactElement<unknown>) | React.ReactElement<Record<string, unknown>>;
|
|
12
|
+
} & {
|
|
13
|
+
children?: import("react").ReactNode;
|
|
14
|
+
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
15
|
+
//# sourceMappingURL=root.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../src/collapsible/root.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,eAAO,MAAM,IAAI;;;;;;;kDAIhB,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import * as Collapsible from '../index';
|
|
3
|
+
declare const meta: Meta<typeof Collapsible.Root>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof Collapsible.Root>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const DefaultOpen: Story;
|
|
8
|
+
export declare const Disabled: Story;
|
|
9
|
+
/**
|
|
10
|
+
* When `hiddenUntilFound` is set on `Collapsible.Panel`, the collapsed content
|
|
11
|
+
* remains in the DOM using the `hidden="until-found"` HTML attribute instead of
|
|
12
|
+
* being removed entirely. This lets the browser's native page search (Ctrl/Cmd+F)
|
|
13
|
+
* find text inside collapsed panels and automatically expand them to reveal the
|
|
14
|
+
* match — improving discoverability without sacrificing the collapsed layout.
|
|
15
|
+
*/
|
|
16
|
+
export declare const HiddenUntilFound: Story;
|
|
17
|
+
export declare const Controlled: Story;
|
|
18
|
+
//# sourceMappingURL=index.story.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/collapsible/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,KAAK,WAAW,MAAM,UAAU,CAAC;AAExC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,WAAW,CAAC,IAAI,CAOxC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,WAAW,CAAC,IAAI,CAAE,CAAC;AAEjD,eAAO,MAAM,OAAO,EAAE,KAWrB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAazB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAYtB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAsB9B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAkBxB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.test.d.ts","sourceRoot":"","sources":["../../../src/collapsible/test/index.test.tsx"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A button that opens and closes the collapsible panel.
|
|
3
|
+
*
|
|
4
|
+
* `Collapsible` is a collection of React components that combine to render
|
|
5
|
+
* a collapsible panel controlled by a button.
|
|
6
|
+
*/
|
|
7
|
+
export declare const Trigger: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react").CollapsibleTriggerProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>, "ref">, "className" | "children" | "render"> & {
|
|
8
|
+
className?: string;
|
|
9
|
+
render?: ((props: import("react").HTMLAttributes<any> & {
|
|
10
|
+
ref?: import("react").Ref<any> | undefined;
|
|
11
|
+
}) => React.ReactElement<unknown>) | React.ReactElement<Record<string, unknown>>;
|
|
12
|
+
} & {
|
|
13
|
+
children?: import("react").ReactNode;
|
|
14
|
+
} & import("react").RefAttributes<HTMLButtonElement>>;
|
|
15
|
+
//# sourceMappingURL=trigger.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"trigger.d.ts","sourceRoot":"","sources":["../../src/collapsible/trigger.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,eAAO,MAAM,OAAO;;;;;;;qDAInB,CAAC"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
import type { Collapsible as _Collapsible } from '@base-ui/react/collapsible';
|
|
3
|
+
import type { ComponentProps } from '../utils/types';
|
|
4
|
+
export type RootProps = ComponentProps<typeof _Collapsible.Root> & {
|
|
5
|
+
/**
|
|
6
|
+
* The content to be rendered inside the component.
|
|
7
|
+
*/
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
};
|
|
10
|
+
export type TriggerProps = ComponentProps<typeof _Collapsible.Trigger> & {
|
|
11
|
+
/**
|
|
12
|
+
* The content to be rendered inside the component.
|
|
13
|
+
*/
|
|
14
|
+
children?: ReactNode;
|
|
15
|
+
};
|
|
16
|
+
export type PanelProps = ComponentProps<typeof _Collapsible.Panel> & {
|
|
17
|
+
/**
|
|
18
|
+
* The content to be rendered inside the component.
|
|
19
|
+
*/
|
|
20
|
+
children?: ReactNode;
|
|
21
|
+
};
|
|
22
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/collapsible/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,WAAW,IAAI,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC9E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD,MAAM,MAAM,SAAS,GAAG,cAAc,CAAE,OAAO,YAAY,CAAC,IAAI,CAAE,GAAG;IACpE;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,cAAc,CAAE,OAAO,YAAY,CAAC,OAAO,CAAE,GAAG;IAC1E;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,cAAc,CAAE,OAAO,YAAY,CAAC,KAAK,CAAE,GAAG;IACtE;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"content.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/content.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"content.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/content.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C;;;GAGG;AACH,eAAO,MAAM,OAAO,yGAqBnB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/context.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,0BAA0B;sBACpB,CAAE,EAAE,EAAE,MAAM,GAAG,SAAS,KAAM,IAAI;EAGlD,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { HeaderDescriptionProps } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* Secondary content placed in the collapsible card header that describes
|
|
4
|
+
* the trigger button via `aria-describedby`. Use it for supplementary
|
|
5
|
+
* information such as status badges or summary values.
|
|
6
|
+
*
|
|
7
|
+
* The content is visually rendered but marked `aria-hidden` so that
|
|
8
|
+
* assistive technologies consume it only through the `aria-describedby`
|
|
9
|
+
* relationship on the trigger, avoiding double announcements.
|
|
10
|
+
*
|
|
11
|
+
* Avoid interactive elements (buttons, links, inputs) inside this
|
|
12
|
+
* component — the entire header is the toggle trigger.
|
|
13
|
+
*/
|
|
14
|
+
export declare const HeaderDescription: import("react").ForwardRefExoticComponent<HeaderDescriptionProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
15
|
+
//# sourceMappingURL=header-description.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"header-description.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/header-description.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAEtD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,iBAAiB,mHA0B3B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/header.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;;;;;;;GAQG;AACH,eAAO,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/header.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;;;;;;;GAQG;AACH,eAAO,MAAM,MAAM,wGAuDlB,CAAC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { Root } from './root';
|
|
2
2
|
import { Header } from './header';
|
|
3
|
+
import { HeaderDescription } from './header-description';
|
|
3
4
|
import { Content } from './content';
|
|
4
|
-
export { Root, Header, Content };
|
|
5
|
+
export { Root, Header, HeaderDescription, Content };
|
|
5
6
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,iBAAiB,EAAE,OAAO,EAAE,CAAC"}
|
|
@@ -15,6 +15,16 @@ export declare const InitiallyOpened: Story;
|
|
|
15
15
|
* A disabled collapsible card cannot be toggled by the user.
|
|
16
16
|
*/
|
|
17
17
|
export declare const Disabled: Story;
|
|
18
|
+
/**
|
|
19
|
+
* Multiple collapsible cards stacked vertically, simulating a typical
|
|
20
|
+
* settings-panel or FAQ-style layout.
|
|
21
|
+
*/
|
|
22
|
+
export declare const Stacked: Story;
|
|
23
|
+
/**
|
|
24
|
+
* A collapsible card with a `HeaderDescription` that provides supplementary
|
|
25
|
+
* information (e.g. status, summary) as an `aria-describedby` relationship.
|
|
26
|
+
*/
|
|
27
|
+
export declare const WithHeaderDescription: Story;
|
|
18
28
|
/**
|
|
19
29
|
* Visual comparison: a `CollapsibleCard` (open) next to a regular `Card`
|
|
20
30
|
* to verify identical spacing and layout.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/collapsible-card/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,KAAK,eAAe,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/collapsible-card/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,KAAK,eAAe,MAAM,UAAU,CAAC;AAyB5C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,eAAe,CAAC,IAAI,CAQ5C,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,eAAe,CAAC,IAAI,CAAE,CAAC;AAErD;;GAEG;AACH,eAAO,MAAM,OAAO,EAAE,KAqBrB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,EAAE,KAkB7B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAetB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,OAAO,EAAE,KA6CrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,qBAAqB,EAAE,KAuCnC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc,EAAE,KA4C5B,CAAC"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { ReactNode } from 'react';
|
|
2
|
+
import type { PanelProps } from '../collapsible/types';
|
|
2
3
|
import type { ComponentProps } from '../utils/types';
|
|
3
4
|
export interface RootProps extends ComponentProps<'div'> {
|
|
4
5
|
/**
|
|
@@ -33,10 +34,30 @@ export interface HeaderProps extends ComponentProps<'div'> {
|
|
|
33
34
|
*/
|
|
34
35
|
children?: ReactNode;
|
|
35
36
|
}
|
|
37
|
+
export interface HeaderDescriptionProps extends ComponentProps<'div'> {
|
|
38
|
+
/**
|
|
39
|
+
* Secondary content that describes the header trigger via
|
|
40
|
+
* `aria-describedby`. Rendered visually but marked `aria-hidden`
|
|
41
|
+
* so assistive technologies consume it only through the description
|
|
42
|
+
* relationship, avoiding double announcements.
|
|
43
|
+
*
|
|
44
|
+
* Avoid interactive elements — the entire header is the toggle trigger.
|
|
45
|
+
*/
|
|
46
|
+
children?: ReactNode;
|
|
47
|
+
}
|
|
36
48
|
export interface ContentProps extends ComponentProps<'div'> {
|
|
37
49
|
/**
|
|
38
50
|
* The content to be rendered inside the collapsible content area.
|
|
39
51
|
*/
|
|
40
52
|
children?: ReactNode;
|
|
53
|
+
/**
|
|
54
|
+
* Allows the browser’s built-in page search to find and expand the panel contents.
|
|
55
|
+
*
|
|
56
|
+
* Overrides the `keepMounted` prop and uses `hidden="until-found"`
|
|
57
|
+
* to hide the element without removing it from the DOM.
|
|
58
|
+
*
|
|
59
|
+
* @default true
|
|
60
|
+
*/
|
|
61
|
+
hiddenUntilFound?: PanelProps['hiddenUntilFound'];
|
|
41
62
|
}
|
|
42
63
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAE,KAAK,CAAE;IACzD;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAE,IAAI,EAAE,OAAO,KAAM,IAAI,CAAC;IACzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAE,KAAK,CAAE;IAC3D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAE,KAAK,CAAE;IAC5D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAE,KAAK,CAAE;IACzD;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAE,IAAI,EAAE,OAAO,KAAM,IAAI,CAAC;IACzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAE,KAAK,CAAE;IAC3D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,sBAAuB,SAAQ,cAAc,CAAE,KAAK,CAAE;IACtE;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAE,KAAK,CAAE;IAC5D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;;;OAOG;IACH,gBAAgB,CAAC,EAAE,UAAU,CAAE,kBAAkB,CAAE,CAAC;CACpD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"action.d.ts","sourceRoot":"","sources":["../../src/dialog/action.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;;GAGG;AACH,QAAA,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"action.d.ts","sourceRoot":"","sources":["../../src/dialog/action.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;;GAGG;AACH,QAAA,MAAM,MAAM,2GAgBX,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"close-icon.d.ts","sourceRoot":"","sources":["../../src/dialog/close-icon.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;;GAGG;AACH,QAAA,MAAM,SAAS,
|
|
1
|
+
{"version":3,"file":"close-icon.d.ts","sourceRoot":"","sources":["../../src/dialog/close-icon.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;;GAGG;AACH,QAAA,MAAM,SAAS,8GAmBd,CAAC;AAEF,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popup.d.ts","sourceRoot":"","sources":["../../src/dialog/popup.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"popup.d.ts","sourceRoot":"","sources":["../../src/dialog/popup.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAO1C;;;GAGG;AACH,QAAA,MAAM,KAAK,uGAuCR,CAAC;AAEJ,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
|
@@ -8,12 +8,6 @@ type Story = StoryObj<typeof Dialog.Root>;
|
|
|
8
8
|
* what happens when clicking the close icon.
|
|
9
9
|
*/
|
|
10
10
|
export declare const _Default: Story;
|
|
11
|
-
/**
|
|
12
|
-
* A confirmation dialog that intentionally omits the close icon. The user
|
|
13
|
-
* must explicitly choose "Cancel" or "Confirm" to make their intent clear,
|
|
14
|
-
* since it is not obvious what would happen when clicking a close icon.
|
|
15
|
-
*/
|
|
16
|
-
export declare const ConfirmDialog: Story;
|
|
17
11
|
export declare const AllSizes: Story;
|
|
18
12
|
/**
|
|
19
13
|
* Popovers in Gutenberg are managed with explicit z-index values, which can create
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/dialog/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAG5D,OAAO,KAAK,MAAM,MAAM,UAAU,CAAC;AAEnC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,MAAM,CAAC,IAAI,CAqCnC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,MAAM,CAAC,IAAI,CAAE,CAAC;AAE5C;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,KAsBtB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/dialog/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAG5D,OAAO,KAAK,MAAM,MAAM,UAAU,CAAC;AAEnC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,MAAM,CAAC,IAAI,CAqCnC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,MAAM,CAAC,IAAI,CAAE,CAAC;AAE5C;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,KAsBtB,CAAC;AAuEF,eAAO,MAAM,QAAQ,EAAE,KAItB,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAG9B,CAAC"}
|