@wordpress/ui 0.12.1-next.v.202604201441.0 → 0.13.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 +59 -2
- package/CONTRIBUTING.md +34 -0
- package/build/alert-dialog/index.cjs +3 -0
- package/build/alert-dialog/index.cjs.map +2 -2
- package/build/alert-dialog/popup.cjs +194 -59
- package/build/alert-dialog/popup.cjs.map +3 -3
- package/build/alert-dialog/portal.cjs +38 -0
- package/build/alert-dialog/portal.cjs.map +7 -0
- package/build/alert-dialog/types.cjs.map +1 -1
- package/build/badge/badge.cjs +84 -5
- package/build/badge/badge.cjs.map +3 -3
- package/build/button/button.cjs +90 -20
- package/build/button/button.cjs.map +3 -3
- package/build/button/icon.cjs.map +2 -2
- package/build/button/index.cjs +1 -0
- package/build/button/index.cjs.map +3 -3
- package/build/button/types.cjs.map +1 -1
- package/build/card/content.cjs +84 -5
- package/build/card/content.cjs.map +3 -3
- package/build/card/full-bleed.cjs +84 -5
- package/build/card/full-bleed.cjs.map +3 -3
- package/build/card/header.cjs +84 -5
- package/build/card/header.cjs.map +3 -3
- package/build/card/root.cjs +86 -10
- package/build/card/root.cjs.map +3 -3
- package/build/collapsible-card/content.cjs +90 -7
- package/build/collapsible-card/content.cjs.map +3 -3
- package/build/collapsible-card/header.cjs +131 -52
- package/build/collapsible-card/header.cjs.map +3 -3
- package/build/dialog/content.cjs +161 -0
- package/build/dialog/content.cjs.map +7 -0
- package/build/dialog/context.cjs +12 -56
- package/build/dialog/context.cjs.map +2 -2
- package/build/dialog/description.cjs +138 -0
- package/build/dialog/description.cjs.map +7 -0
- package/build/dialog/footer.cjs +86 -6
- package/build/dialog/footer.cjs.map +3 -3
- package/build/dialog/header.cjs +86 -6
- package/build/dialog/header.cjs.map +3 -3
- package/build/dialog/index.cjs +9 -0
- package/build/dialog/index.cjs.map +2 -2
- package/build/dialog/popup.cjs +102 -11
- package/build/dialog/popup.cjs.map +3 -3
- package/build/dialog/portal.cjs +38 -0
- package/build/dialog/portal.cjs.map +7 -0
- package/build/dialog/root.cjs +3 -2
- package/build/dialog/root.cjs.map +2 -2
- package/build/dialog/title.cjs +85 -6
- package/build/dialog/title.cjs.map +3 -3
- package/build/dialog/types.cjs.map +1 -1
- package/build/drawer/action.cjs +48 -0
- package/build/drawer/action.cjs.map +7 -0
- package/build/drawer/close-icon.cjs +58 -0
- package/build/drawer/close-icon.cjs.map +7 -0
- package/build/drawer/content.cjs +170 -0
- package/build/drawer/content.cjs.map +7 -0
- package/build/drawer/context.cjs +44 -0
- package/build/drawer/context.cjs.map +7 -0
- package/build/drawer/description.cjs +47 -0
- package/build/drawer/description.cjs.map +7 -0
- package/build/drawer/footer.cjs +144 -0
- package/build/drawer/footer.cjs.map +7 -0
- package/build/drawer/header.cjs +144 -0
- package/build/drawer/header.cjs.map +7 -0
- package/build/drawer/index.cjs +61 -0
- package/build/drawer/index.cjs.map +7 -0
- package/build/drawer/popup.cjs +182 -0
- package/build/drawer/popup.cjs.map +7 -0
- package/build/drawer/portal.cjs +38 -0
- package/build/drawer/portal.cjs.map +7 -0
- package/build/drawer/root.cjs +49 -0
- package/build/drawer/root.cjs.map +7 -0
- package/build/drawer/title.cjs +149 -0
- package/build/drawer/title.cjs.map +7 -0
- package/build/drawer/trigger.cjs +38 -0
- package/build/drawer/trigger.cjs.map +7 -0
- package/build/drawer/types.cjs +19 -0
- package/build/drawer/types.cjs.map +7 -0
- package/build/empty-state/actions.cjs +84 -5
- package/build/empty-state/actions.cjs.map +3 -3
- package/build/empty-state/description.cjs +84 -5
- package/build/empty-state/description.cjs.map +3 -3
- package/build/empty-state/icon.cjs +84 -5
- package/build/empty-state/icon.cjs.map +3 -3
- package/build/empty-state/root.cjs +84 -5
- package/build/empty-state/root.cjs.map +3 -3
- package/build/empty-state/title.cjs +84 -5
- package/build/empty-state/title.cjs.map +3 -3
- package/build/empty-state/visual.cjs +84 -5
- package/build/empty-state/visual.cjs.map +3 -3
- package/build/form/index.cjs +3 -1
- package/build/form/index.cjs.map +2 -2
- package/build/form/primitives/autocomplete/clear.cjs +62 -0
- package/build/form/primitives/autocomplete/clear.cjs.map +7 -0
- package/build/form/primitives/autocomplete/collection.cjs +38 -0
- package/build/form/primitives/autocomplete/collection.cjs.map +7 -0
- package/build/form/primitives/autocomplete/empty.cjs +146 -0
- package/build/form/primitives/autocomplete/empty.cjs.map +7 -0
- package/build/form/primitives/autocomplete/index.cjs +64 -0
- package/build/form/primitives/autocomplete/index.cjs.map +7 -0
- package/build/form/primitives/autocomplete/input-group.cjs +36 -0
- package/build/form/primitives/autocomplete/input-group.cjs.map +7 -0
- package/build/form/primitives/autocomplete/input.cjs +47 -0
- package/build/form/primitives/autocomplete/input.cjs.map +7 -0
- package/build/form/primitives/autocomplete/item.cjs +157 -0
- package/build/form/primitives/autocomplete/item.cjs.map +7 -0
- package/build/form/primitives/autocomplete/list-body.cjs +136 -0
- package/build/form/primitives/autocomplete/list-body.cjs.map +7 -0
- package/build/form/primitives/autocomplete/list.cjs +146 -0
- package/build/form/primitives/autocomplete/list.cjs.map +7 -0
- package/build/form/primitives/autocomplete/popup.cjs +175 -0
- package/build/form/primitives/autocomplete/popup.cjs.map +7 -0
- package/build/form/primitives/autocomplete/portal.cjs +38 -0
- package/build/form/primitives/autocomplete/portal.cjs.map +7 -0
- package/build/form/primitives/autocomplete/root.cjs +35 -0
- package/build/form/primitives/autocomplete/root.cjs.map +7 -0
- package/build/form/primitives/autocomplete/types.cjs +19 -0
- package/build/form/primitives/autocomplete/types.cjs.map +7 -0
- package/build/form/primitives/autocomplete/value.cjs +35 -0
- package/build/form/primitives/autocomplete/value.cjs.map +7 -0
- package/build/form/primitives/field/description.cjs +86 -10
- package/build/form/primitives/field/description.cjs.map +3 -3
- package/build/form/primitives/field/details.cjs +84 -5
- package/build/form/primitives/field/details.cjs.map +3 -3
- package/build/form/primitives/field/label.cjs +84 -5
- package/build/form/primitives/field/label.cjs.map +3 -3
- package/build/form/primitives/field/root.cjs +84 -5
- package/build/form/primitives/field/root.cjs.map +3 -3
- package/build/form/primitives/fieldset/description.cjs +86 -10
- package/build/form/primitives/fieldset/description.cjs.map +3 -3
- package/build/form/primitives/fieldset/details.cjs +84 -5
- package/build/form/primitives/fieldset/details.cjs.map +3 -3
- package/build/form/primitives/fieldset/legend.cjs +84 -5
- package/build/form/primitives/fieldset/legend.cjs.map +3 -3
- package/build/form/primitives/fieldset/root.cjs +84 -5
- package/build/form/primitives/fieldset/root.cjs.map +3 -3
- package/build/form/primitives/index.cjs +3 -0
- package/build/form/primitives/index.cjs.map +2 -2
- package/build/form/primitives/input/input.cjs +88 -15
- package/build/form/primitives/input/input.cjs.map +3 -3
- package/build/form/primitives/input-layout/input-layout.cjs +88 -15
- package/build/form/primitives/input-layout/input-layout.cjs.map +3 -3
- package/build/form/primitives/input-layout/slot.cjs +84 -5
- package/build/form/primitives/input-layout/slot.cjs.map +3 -3
- package/build/form/primitives/select/index.cjs +3 -0
- package/build/form/primitives/select/index.cjs.map +2 -2
- package/build/form/primitives/select/item.cjs +88 -13
- package/build/form/primitives/select/item.cjs.map +3 -3
- package/build/form/primitives/select/popup.cjs +97 -23
- package/build/form/primitives/select/popup.cjs.map +3 -3
- package/build/form/primitives/select/portal.cjs +38 -0
- package/build/form/primitives/select/portal.cjs.map +7 -0
- package/build/form/primitives/select/root.cjs.map +2 -2
- package/build/form/primitives/select/trigger.cjs +98 -16
- package/build/form/primitives/select/trigger.cjs.map +3 -3
- package/build/form/primitives/select/types.cjs.map +1 -1
- package/build/form/primitives/textarea/textarea.cjs +86 -10
- package/build/form/primitives/textarea/textarea.cjs.map +3 -3
- package/build/form/select-control/context.cjs +37 -0
- package/build/form/select-control/context.cjs.map +7 -0
- package/build/form/select-control/index.cjs +39 -0
- package/build/form/select-control/index.cjs.map +7 -0
- package/build/form/select-control/item.cjs +41 -0
- package/build/form/select-control/item.cjs.map +7 -0
- package/build/form/select-control/select-control.cjs +75 -0
- package/build/form/select-control/select-control.cjs.map +7 -0
- package/build/form/select-control/types.cjs +19 -0
- package/build/form/select-control/types.cjs.map +7 -0
- package/build/form/types.cjs.map +1 -1
- package/build/icon-button/icon-button.cjs +86 -6
- package/build/icon-button/icon-button.cjs.map +3 -3
- package/build/icon-button/types.cjs.map +1 -1
- package/build/index.cjs +3 -0
- package/build/index.cjs.map +2 -2
- package/build/link/link.cjs +90 -20
- package/build/link/link.cjs.map +3 -3
- package/build/notice/action-button.cjs +84 -5
- package/build/notice/action-button.cjs.map +3 -3
- package/build/notice/action-link.cjs +84 -5
- package/build/notice/action-link.cjs.map +3 -3
- package/build/notice/actions.cjs +84 -5
- package/build/notice/actions.cjs.map +3 -3
- package/build/notice/close-icon.cjs +84 -5
- package/build/notice/close-icon.cjs.map +3 -3
- package/build/notice/description.cjs +84 -5
- package/build/notice/description.cjs.map +3 -3
- package/build/notice/root.cjs +86 -10
- package/build/notice/root.cjs.map +3 -3
- package/build/notice/title.cjs +84 -5
- package/build/notice/title.cjs.map +3 -3
- package/build/popover/arrow.cjs +85 -6
- package/build/popover/arrow.cjs.map +3 -3
- package/build/popover/context.cjs +4 -56
- package/build/popover/context.cjs.map +2 -2
- package/build/popover/description.cjs +1 -24
- package/build/popover/description.cjs.map +4 -4
- package/build/popover/index.cjs +3 -0
- package/build/popover/index.cjs.map +2 -2
- package/build/popover/popup.cjs +96 -23
- package/build/popover/popup.cjs.map +3 -3
- package/build/popover/portal.cjs +38 -0
- package/build/popover/portal.cjs.map +7 -0
- package/build/popover/root.cjs.map +1 -1
- package/build/popover/title.cjs +92 -2
- package/build/popover/title.cjs.map +3 -3
- package/build/popover/types.cjs.map +1 -1
- package/build/stack/stack.cjs +84 -5
- package/build/stack/stack.cjs.map +3 -3
- package/build/tabs/list.cjs +84 -5
- package/build/tabs/list.cjs.map +3 -3
- package/build/tabs/panel.cjs +86 -10
- package/build/tabs/panel.cjs.map +3 -3
- package/build/tabs/tab.cjs +84 -5
- package/build/tabs/tab.cjs.map +3 -3
- package/build/text/text.cjs +88 -12
- package/build/text/text.cjs.map +3 -3
- package/build/tooltip/index.cjs +6 -0
- package/build/tooltip/index.cjs.map +2 -2
- package/build/tooltip/popup.cjs +114 -46
- package/build/tooltip/popup.cjs.map +4 -4
- package/build/tooltip/portal.cjs +38 -0
- package/build/tooltip/portal.cjs.map +7 -0
- package/build/tooltip/positioner.cjs +159 -0
- package/build/tooltip/positioner.cjs.map +7 -0
- package/build/tooltip/provider.cjs +2 -2
- package/build/tooltip/provider.cjs.map +3 -3
- package/build/tooltip/root.cjs.map +3 -3
- package/build/tooltip/trigger.cjs +2 -2
- package/build/tooltip/trigger.cjs.map +3 -3
- package/build/tooltip/types.cjs.map +1 -1
- package/build/utils/create-overlay-modal-context.cjs +48 -0
- package/build/utils/create-overlay-modal-context.cjs.map +7 -0
- package/build/utils/create-overlay-title-validation.cjs +93 -0
- package/build/utils/create-overlay-title-validation.cjs.map +7 -0
- package/build/utils/render-slot-with-children.cjs +34 -0
- package/build/utils/render-slot-with-children.cjs.map +7 -0
- package/build/utils/use-deprioritized-initial-focus.cjs +8 -8
- package/build/utils/use-deprioritized-initial-focus.cjs.map +2 -2
- package/build/utils/use-overlay-scroll-state-attributes.cjs +140 -0
- package/build/utils/use-overlay-scroll-state-attributes.cjs.map +7 -0
- package/build/visually-hidden/visually-hidden.cjs +89 -6
- package/build/visually-hidden/visually-hidden.cjs.map +3 -3
- package/build-module/alert-dialog/index.mjs +2 -0
- package/build-module/alert-dialog/index.mjs.map +2 -2
- package/build-module/alert-dialog/popup.mjs +198 -60
- package/build-module/alert-dialog/popup.mjs.map +3 -3
- package/build-module/alert-dialog/portal.mjs +13 -0
- package/build-module/alert-dialog/portal.mjs.map +7 -0
- package/build-module/badge/badge.mjs +84 -5
- package/build-module/badge/badge.mjs.map +3 -3
- package/build-module/button/button.mjs +90 -20
- package/build-module/button/button.mjs.map +3 -3
- package/build-module/button/icon.mjs.map +2 -2
- package/build-module/button/index.mjs +3 -2
- package/build-module/button/index.mjs.map +2 -2
- package/build-module/card/content.mjs +84 -5
- package/build-module/card/content.mjs.map +3 -3
- package/build-module/card/full-bleed.mjs +84 -5
- package/build-module/card/full-bleed.mjs.map +3 -3
- package/build-module/card/header.mjs +84 -5
- package/build-module/card/header.mjs.map +3 -3
- package/build-module/card/root.mjs +86 -10
- package/build-module/card/root.mjs.map +3 -3
- package/build-module/collapsible-card/content.mjs +90 -7
- package/build-module/collapsible-card/content.mjs.map +3 -3
- package/build-module/collapsible-card/header.mjs +131 -52
- package/build-module/collapsible-card/header.mjs.map +3 -3
- package/build-module/dialog/content.mjs +126 -0
- package/build-module/dialog/content.mjs.map +7 -0
- package/build-module/dialog/context.mjs +10 -63
- package/build-module/dialog/context.mjs.map +2 -2
- package/build-module/dialog/description.mjs +113 -0
- package/build-module/dialog/description.mjs.map +7 -0
- package/build-module/dialog/footer.mjs +86 -6
- package/build-module/dialog/footer.mjs.map +3 -3
- package/build-module/dialog/header.mjs +86 -6
- package/build-module/dialog/header.mjs.map +3 -3
- package/build-module/dialog/index.mjs +6 -0
- package/build-module/dialog/index.mjs.map +2 -2
- package/build-module/dialog/popup.mjs +104 -13
- package/build-module/dialog/popup.mjs.map +3 -3
- package/build-module/dialog/portal.mjs +13 -0
- package/build-module/dialog/portal.mjs.map +7 -0
- package/build-module/dialog/root.mjs +3 -2
- package/build-module/dialog/root.mjs.map +2 -2
- package/build-module/dialog/title.mjs +85 -6
- package/build-module/dialog/title.mjs.map +3 -3
- package/build-module/drawer/action.mjs +23 -0
- package/build-module/drawer/action.mjs.map +7 -0
- package/build-module/drawer/close-icon.mjs +33 -0
- package/build-module/drawer/close-icon.mjs.map +7 -0
- package/build-module/drawer/content.mjs +135 -0
- package/build-module/drawer/content.mjs.map +7 -0
- package/build-module/drawer/context.mjs +16 -0
- package/build-module/drawer/context.mjs.map +7 -0
- package/build-module/drawer/description.mjs +22 -0
- package/build-module/drawer/description.mjs.map +7 -0
- package/build-module/drawer/footer.mjs +109 -0
- package/build-module/drawer/footer.mjs.map +7 -0
- package/build-module/drawer/header.mjs +109 -0
- package/build-module/drawer/header.mjs.map +7 -0
- package/build-module/drawer/index.mjs +26 -0
- package/build-module/drawer/index.mjs.map +7 -0
- package/build-module/drawer/popup.mjs +149 -0
- package/build-module/drawer/popup.mjs.map +7 -0
- package/build-module/drawer/portal.mjs +13 -0
- package/build-module/drawer/portal.mjs.map +7 -0
- package/build-module/drawer/root.mjs +24 -0
- package/build-module/drawer/root.mjs.map +7 -0
- package/build-module/drawer/title.mjs +124 -0
- package/build-module/drawer/title.mjs.map +7 -0
- package/build-module/drawer/trigger.mjs +13 -0
- package/build-module/drawer/trigger.mjs.map +7 -0
- package/build-module/drawer/types.mjs +1 -0
- package/build-module/drawer/types.mjs.map +7 -0
- package/build-module/empty-state/actions.mjs +84 -5
- package/build-module/empty-state/actions.mjs.map +3 -3
- package/build-module/empty-state/description.mjs +84 -5
- package/build-module/empty-state/description.mjs.map +3 -3
- package/build-module/empty-state/icon.mjs +84 -5
- package/build-module/empty-state/icon.mjs.map +3 -3
- package/build-module/empty-state/root.mjs +84 -5
- package/build-module/empty-state/root.mjs.map +3 -3
- package/build-module/empty-state/title.mjs +84 -5
- package/build-module/empty-state/title.mjs.map +3 -3
- package/build-module/empty-state/visual.mjs +84 -5
- package/build-module/empty-state/visual.mjs.map +3 -3
- package/build-module/form/index.mjs +1 -0
- package/build-module/form/index.mjs.map +2 -2
- package/build-module/form/primitives/autocomplete/clear.mjs +37 -0
- package/build-module/form/primitives/autocomplete/clear.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/collection.mjs +13 -0
- package/build-module/form/primitives/autocomplete/collection.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/empty.mjs +111 -0
- package/build-module/form/primitives/autocomplete/empty.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/index.mjs +28 -0
- package/build-module/form/primitives/autocomplete/index.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/input-group.mjs +11 -0
- package/build-module/form/primitives/autocomplete/input-group.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/input.mjs +22 -0
- package/build-module/form/primitives/autocomplete/input.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/item.mjs +122 -0
- package/build-module/form/primitives/autocomplete/item.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/list-body.mjs +111 -0
- package/build-module/form/primitives/autocomplete/list-body.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/list.mjs +111 -0
- package/build-module/form/primitives/autocomplete/list.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/popup.mjs +142 -0
- package/build-module/form/primitives/autocomplete/popup.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/portal.mjs +13 -0
- package/build-module/form/primitives/autocomplete/portal.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/root.mjs +10 -0
- package/build-module/form/primitives/autocomplete/root.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/types.mjs +1 -0
- package/build-module/form/primitives/autocomplete/types.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/value.mjs +10 -0
- package/build-module/form/primitives/autocomplete/value.mjs.map +7 -0
- package/build-module/form/primitives/field/description.mjs +86 -10
- package/build-module/form/primitives/field/description.mjs.map +3 -3
- package/build-module/form/primitives/field/details.mjs +84 -5
- package/build-module/form/primitives/field/details.mjs.map +3 -3
- package/build-module/form/primitives/field/label.mjs +84 -5
- package/build-module/form/primitives/field/label.mjs.map +3 -3
- package/build-module/form/primitives/field/root.mjs +84 -5
- package/build-module/form/primitives/field/root.mjs.map +3 -3
- package/build-module/form/primitives/fieldset/description.mjs +86 -10
- package/build-module/form/primitives/fieldset/description.mjs.map +3 -3
- package/build-module/form/primitives/fieldset/details.mjs +84 -5
- package/build-module/form/primitives/fieldset/details.mjs.map +3 -3
- package/build-module/form/primitives/fieldset/legend.mjs +84 -5
- package/build-module/form/primitives/fieldset/legend.mjs.map +3 -3
- package/build-module/form/primitives/fieldset/root.mjs +84 -5
- package/build-module/form/primitives/fieldset/root.mjs.map +3 -3
- package/build-module/form/primitives/index.mjs +2 -0
- package/build-module/form/primitives/index.mjs.map +2 -2
- package/build-module/form/primitives/input/input.mjs +88 -15
- package/build-module/form/primitives/input/input.mjs.map +3 -3
- package/build-module/form/primitives/input-layout/input-layout.mjs +88 -15
- package/build-module/form/primitives/input-layout/input-layout.mjs.map +3 -3
- package/build-module/form/primitives/input-layout/slot.mjs +84 -5
- package/build-module/form/primitives/input-layout/slot.mjs.map +3 -3
- package/build-module/form/primitives/select/index.mjs +2 -0
- package/build-module/form/primitives/select/index.mjs.map +2 -2
- package/build-module/form/primitives/select/item.mjs +88 -13
- package/build-module/form/primitives/select/item.mjs.map +3 -3
- package/build-module/form/primitives/select/popup.mjs +97 -23
- package/build-module/form/primitives/select/popup.mjs.map +3 -3
- package/build-module/form/primitives/select/portal.mjs +13 -0
- package/build-module/form/primitives/select/portal.mjs.map +7 -0
- package/build-module/form/primitives/select/root.mjs.map +2 -2
- package/build-module/form/primitives/select/trigger.mjs +98 -16
- package/build-module/form/primitives/select/trigger.mjs.map +3 -3
- package/build-module/form/primitives/textarea/textarea.mjs +86 -10
- package/build-module/form/primitives/textarea/textarea.mjs.map +3 -3
- package/build-module/form/select-control/context.mjs +11 -0
- package/build-module/form/select-control/context.mjs.map +7 -0
- package/build-module/form/select-control/index.mjs +14 -0
- package/build-module/form/select-control/index.mjs.map +7 -0
- package/build-module/form/select-control/item.mjs +16 -0
- package/build-module/form/select-control/item.mjs.map +7 -0
- package/build-module/form/select-control/select-control.mjs +50 -0
- package/build-module/form/select-control/select-control.mjs.map +7 -0
- package/build-module/form/select-control/types.mjs +1 -0
- package/build-module/form/select-control/types.mjs.map +7 -0
- package/build-module/icon-button/icon-button.mjs +86 -6
- package/build-module/icon-button/icon-button.mjs.map +3 -3
- package/build-module/index.mjs +2 -0
- package/build-module/index.mjs.map +2 -2
- package/build-module/link/link.mjs +90 -20
- package/build-module/link/link.mjs.map +3 -3
- package/build-module/notice/action-button.mjs +84 -5
- package/build-module/notice/action-button.mjs.map +3 -3
- package/build-module/notice/action-link.mjs +84 -5
- package/build-module/notice/action-link.mjs.map +3 -3
- package/build-module/notice/actions.mjs +84 -5
- package/build-module/notice/actions.mjs.map +3 -3
- package/build-module/notice/close-icon.mjs +84 -5
- package/build-module/notice/close-icon.mjs.map +3 -3
- package/build-module/notice/description.mjs +84 -5
- package/build-module/notice/description.mjs.map +3 -3
- package/build-module/notice/root.mjs +86 -10
- package/build-module/notice/root.mjs.map +3 -3
- package/build-module/notice/title.mjs +84 -5
- package/build-module/notice/title.mjs.map +3 -3
- package/build-module/popover/arrow.mjs +85 -6
- package/build-module/popover/arrow.mjs.map +3 -3
- package/build-module/popover/context.mjs +4 -63
- package/build-module/popover/context.mjs.map +2 -2
- package/build-module/popover/description.mjs +1 -14
- package/build-module/popover/description.mjs.map +3 -3
- package/build-module/popover/index.mjs +2 -0
- package/build-module/popover/index.mjs.map +2 -2
- package/build-module/popover/popup.mjs +97 -24
- package/build-module/popover/popup.mjs.map +3 -3
- package/build-module/popover/portal.mjs +13 -0
- package/build-module/popover/portal.mjs.map +7 -0
- package/build-module/popover/root.mjs.map +1 -1
- package/build-module/popover/title.mjs +92 -2
- package/build-module/popover/title.mjs.map +3 -3
- package/build-module/stack/stack.mjs +84 -5
- package/build-module/stack/stack.mjs.map +3 -3
- package/build-module/tabs/list.mjs +84 -5
- package/build-module/tabs/list.mjs.map +3 -3
- package/build-module/tabs/panel.mjs +86 -10
- package/build-module/tabs/panel.mjs.map +3 -3
- package/build-module/tabs/tab.mjs +84 -5
- package/build-module/tabs/tab.mjs.map +3 -3
- package/build-module/text/text.mjs +88 -12
- package/build-module/text/text.mjs.map +3 -3
- package/build-module/tooltip/index.mjs +4 -0
- package/build-module/tooltip/index.mjs.map +2 -2
- package/build-module/tooltip/popup.mjs +115 -47
- package/build-module/tooltip/popup.mjs.map +3 -3
- package/build-module/tooltip/portal.mjs +13 -0
- package/build-module/tooltip/portal.mjs.map +7 -0
- package/build-module/tooltip/positioner.mjs +124 -0
- package/build-module/tooltip/positioner.mjs.map +7 -0
- package/build-module/tooltip/provider.mjs +3 -3
- package/build-module/tooltip/provider.mjs.map +2 -2
- package/build-module/tooltip/root.mjs +2 -2
- package/build-module/tooltip/root.mjs.map +2 -2
- package/build-module/tooltip/trigger.mjs +3 -3
- package/build-module/tooltip/trigger.mjs.map +2 -2
- package/build-module/utils/create-overlay-modal-context.mjs +23 -0
- package/build-module/utils/create-overlay-modal-context.mjs.map +7 -0
- package/build-module/utils/create-overlay-title-validation.mjs +75 -0
- package/build-module/utils/create-overlay-title-validation.mjs.map +7 -0
- package/build-module/utils/render-slot-with-children.mjs +9 -0
- package/build-module/utils/render-slot-with-children.mjs.map +7 -0
- package/build-module/utils/use-deprioritized-initial-focus.mjs +9 -9
- package/build-module/utils/use-deprioritized-initial-focus.mjs.map +2 -2
- package/build-module/utils/use-overlay-scroll-state-attributes.mjs +114 -0
- package/build-module/utils/use-overlay-scroll-state-attributes.mjs.map +7 -0
- package/build-module/visually-hidden/visually-hidden.mjs +89 -6
- package/build-module/visually-hidden/visually-hidden.mjs.map +3 -3
- package/build-types/alert-dialog/index.d.ts +1 -0
- package/build-types/alert-dialog/index.d.ts.map +1 -1
- package/build-types/alert-dialog/popup.d.ts.map +1 -1
- package/build-types/alert-dialog/portal.d.ts +9 -0
- package/build-types/alert-dialog/portal.d.ts.map +1 -0
- package/build-types/alert-dialog/root.d.ts +1 -1
- package/build-types/alert-dialog/root.d.ts.map +1 -1
- package/build-types/alert-dialog/stories/index.story.d.ts +28 -0
- package/build-types/alert-dialog/stories/index.story.d.ts.map +1 -1
- package/build-types/alert-dialog/types.d.ts +25 -3
- package/build-types/alert-dialog/types.d.ts.map +1 -1
- package/build-types/badge/stories/choosing-intent.story.d.ts.map +1 -1
- package/build-types/badge/stories/index.story.d.ts.map +1 -1
- package/build-types/button/button.d.ts +3 -0
- package/build-types/button/button.d.ts.map +1 -1
- package/build-types/button/icon.d.ts +1 -8
- package/build-types/button/icon.d.ts.map +1 -1
- package/build-types/button/index.d.ts +6 -5
- package/build-types/button/index.d.ts.map +1 -1
- package/build-types/button/stories/index.story.d.ts.map +1 -1
- package/build-types/button/types.d.ts +7 -0
- package/build-types/button/types.d.ts.map +1 -1
- package/build-types/card/stories/index.story.d.ts.map +1 -1
- package/build-types/collapsible/panel.d.ts +1 -1
- package/build-types/collapsible/root.d.ts +1 -1
- package/build-types/collapsible/stories/index.story.d.ts.map +1 -1
- package/build-types/collapsible/trigger.d.ts +1 -1
- package/build-types/collapsible-card/content.d.ts.map +1 -1
- package/build-types/collapsible-card/header.d.ts +6 -0
- package/build-types/collapsible-card/header.d.ts.map +1 -1
- package/build-types/collapsible-card/stories/index.story.d.ts +8 -0
- package/build-types/collapsible-card/stories/index.story.d.ts.map +1 -1
- package/build-types/dialog/content.d.ts +17 -0
- package/build-types/dialog/content.d.ts.map +1 -0
- package/build-types/dialog/context.d.ts +11 -16
- package/build-types/dialog/context.d.ts.map +1 -1
- package/build-types/dialog/description.d.ts +9 -0
- package/build-types/dialog/description.d.ts.map +1 -0
- package/build-types/dialog/footer.d.ts +8 -1
- package/build-types/dialog/footer.d.ts.map +1 -1
- package/build-types/dialog/header.d.ts +8 -1
- package/build-types/dialog/header.d.ts.map +1 -1
- package/build-types/dialog/index.d.ts +4 -1
- package/build-types/dialog/index.d.ts.map +1 -1
- package/build-types/dialog/popup.d.ts +2 -0
- package/build-types/dialog/popup.d.ts.map +1 -1
- package/build-types/dialog/portal.d.ts +10 -0
- package/build-types/dialog/portal.d.ts.map +1 -0
- package/build-types/dialog/root.d.ts +14 -4
- package/build-types/dialog/root.d.ts.map +1 -1
- package/build-types/dialog/stories/index.story.d.ts +29 -6
- package/build-types/dialog/stories/index.story.d.ts.map +1 -1
- package/build-types/dialog/types.d.ts +60 -7
- package/build-types/dialog/types.d.ts.map +1 -1
- package/build-types/drawer/action.d.ts +8 -0
- package/build-types/drawer/action.d.ts.map +1 -0
- package/build-types/drawer/close-icon.d.ts +8 -0
- package/build-types/drawer/close-icon.d.ts.map +1 -0
- package/build-types/drawer/content.d.ts +24 -0
- package/build-types/drawer/content.d.ts.map +1 -0
- package/build-types/drawer/context.d.ts +20 -0
- package/build-types/drawer/context.d.ts.map +1 -0
- package/build-types/drawer/description.d.ts +9 -0
- package/build-types/drawer/description.d.ts.map +1 -0
- package/build-types/drawer/footer.d.ts +15 -0
- package/build-types/drawer/footer.d.ts.map +1 -0
- package/build-types/drawer/header.d.ts +15 -0
- package/build-types/drawer/header.d.ts.map +1 -0
- package/build-types/drawer/index.d.ts +13 -0
- package/build-types/drawer/index.d.ts.map +1 -0
- package/build-types/drawer/popup.d.ts +15 -0
- package/build-types/drawer/popup.d.ts.map +1 -0
- package/build-types/drawer/portal.d.ts +10 -0
- package/build-types/drawer/portal.d.ts.map +1 -0
- package/build-types/drawer/root.d.ts +21 -0
- package/build-types/drawer/root.d.ts.map +1 -0
- package/build-types/drawer/stories/index.story.d.ts +63 -0
- package/build-types/drawer/stories/index.story.d.ts.map +1 -0
- package/build-types/drawer/test/index.test.d.ts +2 -0
- package/build-types/drawer/test/index.test.d.ts.map +1 -0
- package/build-types/drawer/title.d.ts +22 -0
- package/build-types/drawer/title.d.ts.map +1 -0
- package/build-types/drawer/trigger.d.ts +7 -0
- package/build-types/drawer/trigger.d.ts.map +1 -0
- package/build-types/drawer/types.d.ts +146 -0
- package/build-types/drawer/types.d.ts.map +1 -0
- package/build-types/empty-state/stories/index.story.d.ts.map +1 -1
- package/build-types/form/index.d.ts +1 -0
- package/build-types/form/index.d.ts.map +1 -1
- package/build-types/form/input-control/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/autocomplete/clear.d.ts +13 -0
- package/build-types/form/primitives/autocomplete/clear.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/collection.d.ts +3 -0
- package/build-types/form/primitives/autocomplete/collection.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/empty.d.ts +10 -0
- package/build-types/form/primitives/autocomplete/empty.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/index.d.ts +13 -0
- package/build-types/form/primitives/autocomplete/index.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/input-group.d.ts +16 -0
- package/build-types/form/primitives/autocomplete/input-group.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/input.d.ts +3 -0
- package/build-types/form/primitives/autocomplete/input.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/item.d.ts +10 -0
- package/build-types/form/primitives/autocomplete/item.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/list-body.d.ts +13 -0
- package/build-types/form/primitives/autocomplete/list-body.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/list.d.ts +11 -0
- package/build-types/form/primitives/autocomplete/list.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/popup.d.ts +11 -0
- package/build-types/form/primitives/autocomplete/popup.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/portal.d.ts +8 -0
- package/build-types/form/primitives/autocomplete/portal.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/root.d.ts +8 -0
- package/build-types/form/primitives/autocomplete/root.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/stories/fixtures.d.ts +8 -0
- package/build-types/form/primitives/autocomplete/stories/fixtures.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/stories/index.story.d.ts +41 -0
- package/build-types/form/primitives/autocomplete/stories/index.story.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/test/index.test.d.ts +2 -0
- package/build-types/form/primitives/autocomplete/test/index.test.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/types.d.ts +44 -0
- package/build-types/form/primitives/autocomplete/types.d.ts.map +1 -0
- package/build-types/form/primitives/autocomplete/value.d.ts +3 -0
- package/build-types/form/primitives/autocomplete/value.d.ts.map +1 -0
- package/build-types/form/primitives/field/control.d.ts +2 -2
- package/build-types/form/primitives/field/description.d.ts +1 -1
- package/build-types/form/primitives/field/details.d.ts +1 -1
- package/build-types/form/primitives/field/label.d.ts +3 -3
- package/build-types/form/primitives/field/root.d.ts +3 -3
- package/build-types/form/primitives/field/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/fieldset/description.d.ts +1 -1
- package/build-types/form/primitives/fieldset/details.d.ts +1 -1
- package/build-types/form/primitives/fieldset/legend.d.ts +1 -1
- package/build-types/form/primitives/fieldset/root.d.ts +1 -1
- package/build-types/form/primitives/fieldset/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/index.d.ts +1 -0
- package/build-types/form/primitives/index.d.ts.map +1 -1
- package/build-types/form/primitives/input/input.d.ts +5 -5
- package/build-types/form/primitives/input/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/input-layout/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/select/index.d.ts +1 -0
- package/build-types/form/primitives/select/index.d.ts.map +1 -1
- package/build-types/form/primitives/select/item.d.ts +3 -3
- package/build-types/form/primitives/select/item.d.ts.map +1 -1
- package/build-types/form/primitives/select/popup.d.ts +2 -3
- package/build-types/form/primitives/select/popup.d.ts.map +1 -1
- package/build-types/form/primitives/select/portal.d.ts +8 -0
- package/build-types/form/primitives/select/portal.d.ts.map +1 -0
- package/build-types/form/primitives/select/root.d.ts +12 -1
- package/build-types/form/primitives/select/root.d.ts.map +1 -1
- package/build-types/form/primitives/select/stories/index.story.d.ts +22 -11
- package/build-types/form/primitives/select/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/select/trigger.d.ts +5 -4
- package/build-types/form/primitives/select/trigger.d.ts.map +1 -1
- package/build-types/form/primitives/select/types.d.ts +19 -6
- package/build-types/form/primitives/select/types.d.ts.map +1 -1
- package/build-types/form/primitives/textarea/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/textarea/textarea.d.ts +2 -2
- package/build-types/form/select-control/context.d.ts +3 -0
- package/build-types/form/select-control/context.d.ts.map +1 -0
- package/build-types/form/select-control/index.d.ts +20 -0
- package/build-types/form/select-control/index.d.ts.map +1 -0
- package/build-types/form/select-control/item.d.ts +6 -0
- package/build-types/form/select-control/item.d.ts.map +1 -0
- package/build-types/form/select-control/select-control.d.ts +11 -0
- package/build-types/form/select-control/select-control.d.ts.map +1 -0
- package/build-types/form/select-control/stories/index.story.d.ts +40 -0
- package/build-types/form/select-control/stories/index.story.d.ts.map +1 -0
- package/build-types/form/select-control/test/index.test.d.ts +2 -0
- package/build-types/form/select-control/test/index.test.d.ts.map +1 -0
- package/build-types/form/select-control/types.d.ts +40 -0
- package/build-types/form/select-control/types.d.ts.map +1 -0
- package/build-types/form/types.d.ts +1 -1
- package/build-types/form/types.d.ts.map +1 -1
- package/build-types/icon/stories/index.story.d.ts.map +1 -1
- package/build-types/icon-button/icon-button.d.ts +2 -1
- package/build-types/icon-button/icon-button.d.ts.map +1 -1
- package/build-types/icon-button/stories/index.story.d.ts +5 -0
- package/build-types/icon-button/stories/index.story.d.ts.map +1 -1
- package/build-types/icon-button/types.d.ts +8 -0
- package/build-types/icon-button/types.d.ts.map +1 -1
- package/build-types/index.d.ts +1 -0
- package/build-types/index.d.ts.map +1 -1
- package/build-types/link/stories/index.story.d.ts +2 -3
- package/build-types/link/stories/index.story.d.ts.map +1 -1
- package/build-types/notice/stories/index.story.d.ts.map +1 -1
- package/build-types/popover/context.d.ts +6 -13
- package/build-types/popover/context.d.ts.map +1 -1
- package/build-types/popover/description.d.ts +0 -1
- package/build-types/popover/description.d.ts.map +1 -1
- package/build-types/popover/index.d.ts +2 -1
- package/build-types/popover/index.d.ts.map +1 -1
- package/build-types/popover/popup.d.ts +3 -2
- package/build-types/popover/popup.d.ts.map +1 -1
- package/build-types/popover/portal.d.ts +9 -0
- package/build-types/popover/portal.d.ts.map +1 -0
- package/build-types/popover/root.d.ts +2 -2
- package/build-types/popover/stories/index.story.d.ts +22 -14
- package/build-types/popover/stories/index.story.d.ts.map +1 -1
- package/build-types/popover/title.d.ts.map +1 -1
- package/build-types/popover/types.d.ts +8 -15
- package/build-types/popover/types.d.ts.map +1 -1
- package/build-types/stack/stories/index.story.d.ts.map +1 -1
- package/build-types/tabs/context.d.ts +1 -1
- package/build-types/tabs/context.d.ts.map +1 -1
- package/build-types/tabs/list.d.ts +2 -2
- package/build-types/tabs/panel.d.ts +1 -1
- package/build-types/tabs/root.d.ts +1 -1
- package/build-types/tabs/stories/index.story.d.ts.map +1 -1
- package/build-types/tabs/tab.d.ts +1 -1
- package/build-types/text/stories/index.story.d.ts.map +1 -1
- package/build-types/tooltip/index.d.ts +3 -1
- package/build-types/tooltip/index.d.ts.map +1 -1
- package/build-types/tooltip/popup.d.ts.map +1 -1
- package/build-types/tooltip/portal.d.ts +8 -0
- package/build-types/tooltip/portal.d.ts.map +1 -0
- package/build-types/tooltip/positioner.d.ts +9 -0
- package/build-types/tooltip/positioner.d.ts.map +1 -0
- package/build-types/tooltip/provider.d.ts +1 -1
- package/build-types/tooltip/provider.d.ts.map +1 -1
- package/build-types/tooltip/stories/index.story.d.ts +28 -2
- package/build-types/tooltip/stories/index.story.d.ts.map +1 -1
- package/build-types/tooltip/stories/usage-guidelines.story.d.ts.map +1 -1
- package/build-types/tooltip/trigger.d.ts.map +1 -1
- package/build-types/tooltip/types.d.ts +20 -7
- package/build-types/tooltip/types.d.ts.map +1 -1
- package/build-types/utils/create-overlay-modal-context.d.ts +14 -0
- package/build-types/utils/create-overlay-modal-context.d.ts.map +1 -0
- package/build-types/utils/create-overlay-title-validation.d.ts +15 -0
- package/build-types/utils/create-overlay-title-validation.d.ts.map +1 -0
- package/build-types/utils/render-slot-with-children.d.ts +24 -0
- package/build-types/utils/render-slot-with-children.d.ts.map +1 -0
- package/build-types/utils/use-deprioritized-initial-focus.d.ts +9 -8
- package/build-types/utils/use-deprioritized-initial-focus.d.ts.map +1 -1
- package/build-types/utils/use-overlay-scroll-state-attributes.d.ts +85 -0
- package/build-types/utils/use-overlay-scroll-state-attributes.d.ts.map +1 -0
- package/build-types/visually-hidden/stories/index.story.d.ts.map +1 -1
- package/build-types/visually-hidden/visually-hidden.d.ts +4 -20
- package/build-types/visually-hidden/visually-hidden.d.ts.map +1 -1
- package/package.json +14 -13
- package/src/alert-dialog/index.ts +1 -0
- package/src/alert-dialog/popup.tsx +114 -45
- package/src/alert-dialog/portal.tsx +17 -0
- package/src/alert-dialog/stories/index.story.tsx +129 -1
- package/src/alert-dialog/style.module.css +13 -4
- package/src/alert-dialog/test/index.test.tsx +329 -3
- package/src/alert-dialog/types.ts +30 -3
- package/src/badge/stories/index.story.tsx +6 -0
- package/src/button/button.tsx +3 -0
- package/src/button/icon.tsx +1 -8
- package/src/button/index.ts +5 -6
- package/src/button/stories/index.story.tsx +10 -0
- package/src/button/types.ts +8 -0
- package/src/card/stories/index.story.tsx +7 -0
- package/src/collapsible/stories/index.story.tsx +7 -0
- package/src/collapsible-card/content.tsx +12 -1
- package/src/collapsible-card/header.tsx +55 -42
- package/src/collapsible-card/stories/index.story.tsx +62 -0
- package/src/collapsible-card/style.module.css +36 -4
- package/src/collapsible-card/test/index.test.tsx +60 -1
- package/src/dialog/content.tsx +47 -0
- package/src/dialog/context.tsx +14 -111
- package/src/dialog/description.tsx +27 -0
- package/src/dialog/footer.tsx +10 -2
- package/src/dialog/header.tsx +10 -2
- package/src/dialog/index.ts +16 -1
- package/src/dialog/popup.tsx +27 -8
- package/src/dialog/portal.tsx +18 -0
- package/src/dialog/root.tsx +22 -5
- package/src/dialog/stories/index.story.tsx +200 -48
- package/src/dialog/style.module.css +76 -44
- package/src/dialog/test/index.test.tsx +632 -12
- package/src/dialog/types.ts +64 -6
- package/src/drawer/action.tsx +28 -0
- package/src/drawer/close-icon.tsx +33 -0
- package/src/drawer/content.tsx +65 -0
- package/src/drawer/context.tsx +29 -0
- package/src/drawer/description.tsx +25 -0
- package/src/drawer/footer.tsx +34 -0
- package/src/drawer/header.tsx +34 -0
- package/src/drawer/index.ts +25 -0
- package/src/drawer/popup.tsx +99 -0
- package/src/drawer/portal.tsx +18 -0
- package/src/drawer/root.tsx +41 -0
- package/src/drawer/stories/index.story.tsx +550 -0
- package/src/drawer/style.module.css +356 -0
- package/src/drawer/test/index.test.tsx +1153 -0
- package/src/drawer/title.tsx +53 -0
- package/src/drawer/trigger.tsx +14 -0
- package/src/drawer/types.ts +174 -0
- package/src/empty-state/stories/index.story.tsx +7 -0
- package/src/form/index.ts +1 -0
- package/src/form/input-control/stories/index.story.tsx +7 -0
- package/src/form/primitives/autocomplete/clear.tsx +35 -0
- package/src/form/primitives/autocomplete/collection.tsx +13 -0
- package/src/form/primitives/autocomplete/empty.tsx +17 -0
- package/src/form/primitives/autocomplete/index.ts +12 -0
- package/src/form/primitives/autocomplete/input-group.tsx +16 -0
- package/src/form/primitives/autocomplete/input.tsx +20 -0
- package/src/form/primitives/autocomplete/item.tsx +24 -0
- package/src/form/primitives/autocomplete/list-body.tsx +23 -0
- package/src/form/primitives/autocomplete/list.tsx +17 -0
- package/src/form/primitives/autocomplete/popup.tsx +42 -0
- package/src/form/primitives/autocomplete/portal.tsx +16 -0
- package/src/form/primitives/autocomplete/root.tsx +11 -0
- package/src/form/primitives/autocomplete/stories/fixtures.ts +35 -0
- package/src/form/primitives/autocomplete/stories/index.story.tsx +445 -0
- package/src/form/primitives/autocomplete/style.module.css +7 -0
- package/src/form/primitives/autocomplete/test/index.test.tsx +162 -0
- package/src/form/primitives/autocomplete/types.ts +74 -0
- package/src/form/primitives/autocomplete/value.tsx +6 -0
- package/src/form/primitives/field/stories/index.story.tsx +12 -5
- package/src/form/primitives/fieldset/stories/index.story.tsx +10 -3
- package/src/form/primitives/index.ts +1 -0
- package/src/form/primitives/input/stories/index.story.tsx +7 -0
- package/src/form/primitives/input-layout/stories/index.story.tsx +8 -1
- package/src/form/primitives/select/index.ts +1 -0
- package/src/form/primitives/select/item.tsx +1 -2
- package/src/form/primitives/select/popup.tsx +34 -37
- package/src/form/primitives/select/portal.tsx +16 -0
- package/src/form/primitives/select/root.tsx +13 -2
- package/src/form/primitives/select/stories/index.story.tsx +152 -67
- package/src/form/primitives/select/test/index.test.tsx +130 -8
- package/src/form/primitives/select/trigger.tsx +11 -8
- package/src/form/primitives/select/types.ts +22 -7
- package/src/form/primitives/textarea/stories/index.story.tsx +7 -0
- package/src/form/select-control/context.tsx +9 -0
- package/src/form/select-control/index.ts +14 -0
- package/src/form/select-control/item.tsx +13 -0
- package/src/form/select-control/select-control.tsx +65 -0
- package/src/form/select-control/stories/index.story.tsx +220 -0
- package/src/form/select-control/test/index.test.tsx +196 -0
- package/src/form/select-control/types.ts +50 -0
- package/src/form/types.ts +1 -1
- package/src/icon/stories/index.story.tsx +7 -0
- package/src/icon-button/icon-button.tsx +2 -1
- package/src/icon-button/stories/index.story.tsx +20 -0
- package/src/icon-button/types.ts +9 -0
- package/src/index.ts +1 -0
- package/src/link/stories/index.story.tsx +12 -11
- package/src/link/style.module.css +2 -1
- package/src/notice/stories/index.story.tsx +7 -0
- package/src/popover/context.tsx +6 -105
- package/src/popover/description.tsx +1 -5
- package/src/popover/index.ts +2 -1
- package/src/popover/popup.tsx +15 -16
- package/src/popover/portal.tsx +17 -0
- package/src/popover/root.tsx +2 -2
- package/src/popover/stories/index.story.tsx +61 -24
- package/src/popover/style.module.css +34 -27
- package/src/popover/test/index.test.tsx +46 -7
- package/src/popover/title.tsx +3 -2
- package/src/popover/types.ts +10 -15
- package/src/stack/stories/index.story.tsx +6 -0
- package/src/tabs/stories/index.story.tsx +15 -1
- package/src/text/stories/index.story.tsx +6 -0
- package/src/text/style.module.css +25 -0
- package/src/text/text.tsx +2 -2
- package/src/tooltip/index.ts +3 -1
- package/src/tooltip/popup.tsx +32 -44
- package/src/tooltip/portal.tsx +16 -0
- package/src/tooltip/positioner.tsx +36 -0
- package/src/tooltip/provider.tsx +3 -3
- package/src/tooltip/root.tsx +2 -2
- package/src/tooltip/stories/index.story.tsx +97 -9
- package/src/tooltip/stories/usage-guidelines.story.tsx +5 -0
- package/src/tooltip/style.module.css +12 -12
- package/src/tooltip/test/index.test.tsx +9 -3
- package/src/tooltip/trigger.tsx +3 -7
- package/src/tooltip/types.ts +26 -9
- package/src/utils/create-overlay-modal-context.tsx +34 -0
- package/src/utils/create-overlay-title-validation.tsx +116 -0
- package/src/utils/css/dropdown-motion.module.css +3 -3
- package/src/utils/css/item-popup.module.css +14 -24
- package/src/utils/css/overlay-chrome.module.css +239 -0
- package/src/utils/css/select-trigger.module.css +5 -2
- package/src/utils/render-slot-with-children.ts +31 -0
- package/src/utils/test/use-deprioritized-initial-focus.test.tsx +3 -3
- package/src/utils/use-deprioritized-initial-focus.ts +23 -17
- package/src/utils/use-overlay-scroll-state-attributes.ts +272 -0
- package/src/visually-hidden/stories/index.story.tsx +7 -0
- package/src/visually-hidden/visually-hidden.tsx +9 -21
|
@@ -8,37 +8,126 @@ import {
|
|
|
8
8
|
} from "@wordpress/theme";
|
|
9
9
|
import { unlock } from "../lock-unlock.mjs";
|
|
10
10
|
import { useDeprioritizedInitialFocus } from "../utils/use-deprioritized-initial-focus.mjs";
|
|
11
|
-
import {
|
|
11
|
+
import { SCROLL_CONTAINER_ATTR } from "../utils/use-overlay-scroll-state-attributes.mjs";
|
|
12
|
+
import { renderSlotWithChildren } from "../utils/render-slot-with-children.mjs";
|
|
13
|
+
import { DialogValidationProvider, useDialogModal } from "./context.mjs";
|
|
14
|
+
import { Portal } from "./portal.mjs";
|
|
15
|
+
|
|
16
|
+
// packages/style-runtime/src/index.ts
|
|
17
|
+
var STYLE_HASH_ATTRIBUTE = "data-wp-hash";
|
|
18
|
+
function getRuntime() {
|
|
19
|
+
const globalScope = globalThis;
|
|
20
|
+
if (globalScope.__wpStyleRuntime) {
|
|
21
|
+
return globalScope.__wpStyleRuntime;
|
|
22
|
+
}
|
|
23
|
+
globalScope.__wpStyleRuntime = {
|
|
24
|
+
documents: /* @__PURE__ */ new Map(),
|
|
25
|
+
styles: /* @__PURE__ */ new Map(),
|
|
26
|
+
injectedStyles: /* @__PURE__ */ new WeakMap()
|
|
27
|
+
};
|
|
28
|
+
if (typeof document !== "undefined") {
|
|
29
|
+
registerDocument(document);
|
|
30
|
+
}
|
|
31
|
+
return globalScope.__wpStyleRuntime;
|
|
32
|
+
}
|
|
33
|
+
function documentContainsStyleHash(targetDocument, hash) {
|
|
34
|
+
if (!targetDocument.head) {
|
|
35
|
+
return false;
|
|
36
|
+
}
|
|
37
|
+
for (const style of targetDocument.head.querySelectorAll(
|
|
38
|
+
`style[${STYLE_HASH_ATTRIBUTE}]`
|
|
39
|
+
)) {
|
|
40
|
+
if (style.getAttribute(STYLE_HASH_ATTRIBUTE) === hash) {
|
|
41
|
+
return true;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
return false;
|
|
45
|
+
}
|
|
46
|
+
function injectStyle(targetDocument, hash, css) {
|
|
47
|
+
if (!targetDocument.head) {
|
|
48
|
+
return;
|
|
49
|
+
}
|
|
50
|
+
const runtime = getRuntime();
|
|
51
|
+
let injectedStyles = runtime.injectedStyles.get(targetDocument);
|
|
52
|
+
if (!injectedStyles) {
|
|
53
|
+
injectedStyles = /* @__PURE__ */ new Set();
|
|
54
|
+
runtime.injectedStyles.set(targetDocument, injectedStyles);
|
|
55
|
+
}
|
|
56
|
+
if (injectedStyles.has(hash)) {
|
|
57
|
+
return;
|
|
58
|
+
}
|
|
59
|
+
if (documentContainsStyleHash(targetDocument, hash)) {
|
|
60
|
+
injectedStyles.add(hash);
|
|
61
|
+
return;
|
|
62
|
+
}
|
|
63
|
+
const style = targetDocument.createElement("style");
|
|
64
|
+
style.setAttribute(STYLE_HASH_ATTRIBUTE, hash);
|
|
65
|
+
style.appendChild(targetDocument.createTextNode(css));
|
|
66
|
+
targetDocument.head.appendChild(style);
|
|
67
|
+
injectedStyles.add(hash);
|
|
68
|
+
}
|
|
69
|
+
function registerDocument(targetDocument) {
|
|
70
|
+
const runtime = getRuntime();
|
|
71
|
+
runtime.documents.set(
|
|
72
|
+
targetDocument,
|
|
73
|
+
(runtime.documents.get(targetDocument) ?? 0) + 1
|
|
74
|
+
);
|
|
75
|
+
for (const [hash, css] of runtime.styles) {
|
|
76
|
+
injectStyle(targetDocument, hash, css);
|
|
77
|
+
}
|
|
78
|
+
return () => {
|
|
79
|
+
const count = runtime.documents.get(targetDocument);
|
|
80
|
+
if (count === void 0) {
|
|
81
|
+
return;
|
|
82
|
+
}
|
|
83
|
+
if (count <= 1) {
|
|
84
|
+
runtime.documents.delete(targetDocument);
|
|
85
|
+
return;
|
|
86
|
+
}
|
|
87
|
+
runtime.documents.set(targetDocument, count - 1);
|
|
88
|
+
};
|
|
89
|
+
}
|
|
90
|
+
function registerStyle(hash, css) {
|
|
91
|
+
const runtime = getRuntime();
|
|
92
|
+
runtime.styles.set(hash, css);
|
|
93
|
+
for (const targetDocument of runtime.documents.keys()) {
|
|
94
|
+
injectStyle(targetDocument, hash, css);
|
|
95
|
+
}
|
|
96
|
+
}
|
|
12
97
|
|
|
13
98
|
// packages/ui/src/dialog/style.module.css
|
|
14
|
-
if (typeof
|
|
15
|
-
|
|
16
|
-
style.setAttribute("data-wp-hash", "7d3678184b");
|
|
17
|
-
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;[data-wpds-theme-provider-id]:has(>._8acaa98861620d4d__popup){display:block}@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)}}'));
|
|
18
|
-
document.head.appendChild(style);
|
|
99
|
+
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") {
|
|
100
|
+
registerStyle("a400076f01", '@layer wp-ui-components{.f1c50237c4787636__header{min-height:32px;padding-block:var(--wpds-dimension-padding-2xl,24px) var(--wpds-dimension-gap-lg,16px)}._579f95efdec92a66__footer,.f1c50237c4787636__header{align-items:center;display:flex;gap:var(--wpds-dimension-gap-sm,8px);padding-inline:var(--wpds-dimension-padding-2xl,24px)}._579f95efdec92a66__footer{justify-content:flex-end;padding-block:var(--wpds-dimension-gap-lg,16px) var(--wpds-dimension-padding-2xl,24px)}._5371cc08aad82574__title{--_gcd-heading-color:var(--wpds-color-fg-content-neutral,#1e1e1e);--_gcd-heading-margin:0 auto 0 0;color:var(--wpds-color-fg-content-neutral,#1e1e1e);margin-inline-end:auto;&:dir(rtl){--_gcd-heading-margin:0 0 0 auto}}._766d9011d37ce2d9__content{flex:1 1 auto;min-block-size:0;overflow-block:auto;overflow-inline:hidden;padding:var(--wpds-dimension-padding-2xl,24px);&:focus-visible{outline-offset:calc(var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px))*-1)}}.f1c50237c4787636__header:has(~._766d9011d37ce2d9__content){border-block-end:1px solid #0000;padding-block-end:calc(var(--wpds-dimension-gap-lg, 16px) - 1px)}.f1c50237c4787636__header~._766d9011d37ce2d9__content{padding-block-start:0}._766d9011d37ce2d9__content~._579f95efdec92a66__footer{border-block-start:1px solid #0000;padding-block-start:calc(var(--wpds-dimension-gap-lg, 16px) - 1px)}._766d9011d37ce2d9__content:has(~._579f95efdec92a66__footer){padding-block-end:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header,._766d9011d37ce2d9__content>[data-drawer-content]>.f1c50237c4787636__header{padding-inline:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header:first-child,._766d9011d37ce2d9__content>[data-drawer-content]>.f1c50237c4787636__header:first-child{padding-block-start:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer,._766d9011d37ce2d9__content>[data-drawer-content]>._579f95efdec92a66__footer{padding-inline:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer:last-child,._766d9011d37ce2d9__content>[data-drawer-content]>._579f95efdec92a66__footer:last-child{padding-block-end:0}.f1c50237c4787636__header:has(~[data-wp-ui-overlay-scroll-container][data-wp-ui-overlay-scrolled-from-top]){border-block-end-color:var(--wpds-color-stroke-surface-neutral,#dbdbdb)}[data-wp-ui-overlay-scroll-container][data-wp-ui-overlay-scrolled-from-bottom]~._579f95efdec92a66__footer{border-block-start-color:var(--wpds-color-stroke-surface-neutral,#dbdbdb)}[data-wp-ui-overlay-modal] [data-wp-ui-overlay-scroll-container]{overscroll-behavior:contain}}@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 var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-subtle,cubic-bezier(.15,0,.15,1))}}._8acaa98861620d4d__popup{--viewport-inset:var(--wpds-dimension-padding-2xl,24px);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);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);display:flex;flex-direction:column;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(100dvh - var(--viewport-inset)*2);min-width:var(--wpds-dimension-surface-width-sm,320px);overflow:hidden;position:fixed;top:50%;transform:translate(-50%,-50%);width:calc(100vw - var(--viewport-inset)*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 var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-expressive,cubic-bezier(.25,0,0,1)),transform var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-expressive,cubic-bezier(.25,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:100dvh}}._074affe4c56b4f2f__backdrop~* ._8acaa98861620d4d__popup{border-color:#0000}@media (forced-colors:active){._074affe4c56b4f2f__backdrop~* ._8acaa98861620d4d__popup,._8acaa98861620d4d__popup{border-color:CanvasText}}._76fb3b28fcbd45fc__header [data-wp-ui-dialog-close-icon]{margin-inline-start:auto}.d9d6da914ef0a77c__description{margin-bottom:var(--wpds-dimension-gap-lg,16px)}}');
|
|
19
101
|
}
|
|
20
|
-
var style_default = { "
|
|
102
|
+
var style_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 f1c50237c4787636__header", "footer": "_00eeb4f220cddae3__footer _579f95efdec92a66__footer", "title": "f636832002af749e__title _5371cc08aad82574__title", "content": "_101038da9af7162f__content _766d9011d37ce2d9__content", "description": "d9d6da914ef0a77c__description" };
|
|
21
103
|
|
|
22
104
|
// packages/ui/src/dialog/popup.tsx
|
|
23
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
105
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
24
106
|
var ThemeProvider = unlock(themePrivateApis).ThemeProvider;
|
|
25
107
|
var CLOSE_ICON_ATTR = "data-wp-ui-dialog-close-icon";
|
|
26
108
|
var Popup = forwardRef(function DialogPopup({
|
|
27
109
|
className,
|
|
28
|
-
|
|
110
|
+
portal,
|
|
111
|
+
children,
|
|
29
112
|
size = "medium",
|
|
30
113
|
initialFocus,
|
|
31
114
|
finalFocus,
|
|
32
|
-
children,
|
|
33
115
|
...props
|
|
34
116
|
}, ref) {
|
|
35
117
|
const { resolvedInitialFocus, popupRef } = useDeprioritizedInitialFocus({
|
|
36
118
|
initialFocus,
|
|
37
|
-
|
|
119
|
+
deprioritizedAttributes: [CLOSE_ICON_ATTR, SCROLL_CONTAINER_ATTR]
|
|
38
120
|
});
|
|
39
121
|
const mergedRef = useMergeRefs([ref, popupRef]);
|
|
40
|
-
|
|
41
|
-
|
|
122
|
+
const modal = useDialogModal();
|
|
123
|
+
const portalChildren = /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
124
|
+
modal === true && /* @__PURE__ */ jsx(
|
|
125
|
+
_Dialog.Backdrop,
|
|
126
|
+
{
|
|
127
|
+
className: style_default.backdrop,
|
|
128
|
+
"data-testid": "dialog-backdrop"
|
|
129
|
+
}
|
|
130
|
+
),
|
|
42
131
|
/* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(
|
|
43
132
|
_Dialog.Popup,
|
|
44
133
|
{
|
|
@@ -51,10 +140,12 @@ var Popup = forwardRef(function DialogPopup({
|
|
|
51
140
|
initialFocus: resolvedInitialFocus,
|
|
52
141
|
finalFocus,
|
|
53
142
|
...props,
|
|
143
|
+
"data-wp-ui-overlay-modal": modal === true ? "" : void 0,
|
|
54
144
|
children: /* @__PURE__ */ jsx(DialogValidationProvider, { children })
|
|
55
145
|
}
|
|
56
146
|
) })
|
|
57
147
|
] });
|
|
148
|
+
return renderSlotWithChildren(portal, /* @__PURE__ */ jsx(Portal, {}), portalChildren);
|
|
58
149
|
});
|
|
59
150
|
export {
|
|
60
151
|
Popup
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../src/dialog/popup.tsx", "../../src/dialog/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import { Dialog as _Dialog } from '@base-ui/react/dialog';\nimport clsx from 'clsx';\nimport { forwardRef } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\nimport {\n\ttype ThemeProvider as ThemeProviderType,\n\tprivateApis as themePrivateApis,\n} from '@wordpress/theme';\nimport { unlock } from '../lock-unlock';\nimport { useDeprioritizedInitialFocus } from '../utils/use-deprioritized-initial-focus';\nimport { DialogValidationProvider } from './context';\nimport styles from './style.module.css';\nimport type { PopupProps } from './types';\n\nconst ThemeProvider: typeof ThemeProviderType =\n\tunlock( themePrivateApis ).ThemeProvider;\n\nconst CLOSE_ICON_ATTR = 'data-wp-ui-dialog-close-icon';\n\n/**\n * Renders the dialog popup element that contains the dialog content.\n * Uses a portal to render outside the DOM hierarchy.\n */\nconst Popup = forwardRef< HTMLDivElement, PopupProps >( function DialogPopup(\n\t{\n\t\tclassName,\n\t\tcontainer,\n\t\tsize = 'medium',\n\t\tinitialFocus,\n\t\tfinalFocus,\n\t\tchildren,\n\t\t...props\n\t},\n\tref\n) {\n\tconst { resolvedInitialFocus, popupRef } = useDeprioritizedInitialFocus( {\n\t\tinitialFocus,\n\t\tdeprioritizedAttribute: CLOSE_ICON_ATTR,\n\t} );\n\tconst mergedRef = useMergeRefs( [ ref, popupRef ] );\n\n\treturn (\n\t\t<_Dialog.Portal container={ container }>\n\t\t\t<_Dialog.Backdrop className={ styles.backdrop } />\n\t\t\t<ThemeProvider>\n\t\t\t\t<_Dialog.Popup\n\t\t\t\t\tref={ mergedRef }\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\tstyles.popup,\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\tstyles[ `is-${ size }` ]\n\t\t\t\t\t) }\n\t\t\t\t\tinitialFocus={ resolvedInitialFocus }\n\t\t\t\t\tfinalFocus={ finalFocus }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t<DialogValidationProvider>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</DialogValidationProvider>\n\t\t\t\t</_Dialog.Popup>\n\t\t\t</ThemeProvider>\n\t\t</_Dialog.Portal>\n\t);\n} );\n\nexport { Popup };\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='7d3678184b']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"7d3678184b\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;[data-wpds-theme-provider-id]:has(>._8acaa98861620d4d__popup){display:block}@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 {\"popup\":\"_8acaa98861620d4d__popup\",\"backdrop\":\"_074affe4c56b4f2f__backdrop\",\"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"],
|
|
5
|
-
"mappings": ";AAAA,SAAS,UAAU,eAAe;AAClC,OAAO,UAAU;AACjB,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB;AAC7B;AAAA,EAEC,eAAe;AAAA,OACT;AACP,SAAS,cAAc;AACvB,SAAS,oCAAoC;AAC7C,SAAS,
|
|
3
|
+
"sources": ["../../src/dialog/popup.tsx", "../../../style-runtime/src/index.ts", "../../src/dialog/style.module.css"],
|
|
4
|
+
"sourcesContent": ["import { Dialog as _Dialog } from '@base-ui/react/dialog';\nimport clsx from 'clsx';\nimport { forwardRef } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\nimport {\n\ttype ThemeProvider as ThemeProviderType,\n\tprivateApis as themePrivateApis,\n} from '@wordpress/theme';\nimport { unlock } from '../lock-unlock';\nimport { useDeprioritizedInitialFocus } from '../utils/use-deprioritized-initial-focus';\nimport { SCROLL_CONTAINER_ATTR } from '../utils/use-overlay-scroll-state-attributes';\nimport { renderSlotWithChildren } from '../utils/render-slot-with-children';\nimport { DialogValidationProvider, useDialogModal } from './context';\nimport { Portal } from './portal';\nimport styles from './style.module.css';\nimport type { PopupProps } from './types';\n\nconst ThemeProvider: typeof ThemeProviderType =\n\tunlock( themePrivateApis ).ThemeProvider;\n\nconst CLOSE_ICON_ATTR = 'data-wp-ui-dialog-close-icon';\n\n/**\n * Renders the dialog popup element that contains the dialog content.\n * Uses a portal to render outside the DOM hierarchy.\n *\n * When `portal` is omitted, defaults to `Dialog.Portal`.\n */\nconst Popup = forwardRef< HTMLDivElement, PopupProps >( function DialogPopup(\n\t{\n\t\tclassName,\n\t\tportal,\n\t\tchildren,\n\t\tsize = 'medium',\n\t\tinitialFocus,\n\t\tfinalFocus,\n\t\t...props\n\t},\n\tref\n) {\n\tconst { resolvedInitialFocus, popupRef } = useDeprioritizedInitialFocus( {\n\t\tinitialFocus,\n\t\tdeprioritizedAttributes: [ CLOSE_ICON_ATTR, SCROLL_CONTAINER_ATTR ],\n\t} );\n\tconst mergedRef = useMergeRefs( [ ref, popupRef ] );\n\tconst modal = useDialogModal();\n\n\tconst portalChildren = (\n\t\t<>\n\t\t\t{ /*\n\t\t\t * Only render a backdrop for fully modal dialogs. Non-modal dialogs\n\t\t\t * should not dim the page, and `trap-focus` keeps outside pointer\n\t\t\t * interactions enabled, so a backdrop would misrepresent that mode.\n\t\t\t */ }\n\t\t\t{ modal === true && (\n\t\t\t\t<_Dialog.Backdrop\n\t\t\t\t\tclassName={ styles.backdrop }\n\t\t\t\t\tdata-testid=\"dialog-backdrop\"\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<ThemeProvider>\n\t\t\t\t<_Dialog.Popup\n\t\t\t\t\tref={ mergedRef }\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\tstyles.popup,\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\tstyles[ `is-${ size }` ]\n\t\t\t\t\t) }\n\t\t\t\t\tinitialFocus={ resolvedInitialFocus }\n\t\t\t\t\tfinalFocus={ finalFocus }\n\t\t\t\t\t{ ...props }\n\t\t\t\t\tdata-wp-ui-overlay-modal={ modal === true ? '' : undefined }\n\t\t\t\t>\n\t\t\t\t\t<DialogValidationProvider>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</DialogValidationProvider>\n\t\t\t\t</_Dialog.Popup>\n\t\t\t</ThemeProvider>\n\t\t</>\n\t);\n\n\treturn renderSlotWithChildren( portal, <Portal />, portalChildren );\n} );\n\nexport { Popup };\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"a400076f01\", \"@layer wp-ui-components{.f1c50237c4787636__header{min-height:32px;padding-block:var(--wpds-dimension-padding-2xl,24px) var(--wpds-dimension-gap-lg,16px)}._579f95efdec92a66__footer,.f1c50237c4787636__header{align-items:center;display:flex;gap:var(--wpds-dimension-gap-sm,8px);padding-inline:var(--wpds-dimension-padding-2xl,24px)}._579f95efdec92a66__footer{justify-content:flex-end;padding-block:var(--wpds-dimension-gap-lg,16px) var(--wpds-dimension-padding-2xl,24px)}._5371cc08aad82574__title{--_gcd-heading-color:var(--wpds-color-fg-content-neutral,#1e1e1e);--_gcd-heading-margin:0 auto 0 0;color:var(--wpds-color-fg-content-neutral,#1e1e1e);margin-inline-end:auto;&:dir(rtl){--_gcd-heading-margin:0 0 0 auto}}._766d9011d37ce2d9__content{flex:1 1 auto;min-block-size:0;overflow-block:auto;overflow-inline:hidden;padding:var(--wpds-dimension-padding-2xl,24px);&:focus-visible{outline-offset:calc(var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px))*-1)}}.f1c50237c4787636__header:has(~._766d9011d37ce2d9__content){border-block-end:1px solid #0000;padding-block-end:calc(var(--wpds-dimension-gap-lg, 16px) - 1px)}.f1c50237c4787636__header~._766d9011d37ce2d9__content{padding-block-start:0}._766d9011d37ce2d9__content~._579f95efdec92a66__footer{border-block-start:1px solid #0000;padding-block-start:calc(var(--wpds-dimension-gap-lg, 16px) - 1px)}._766d9011d37ce2d9__content:has(~._579f95efdec92a66__footer){padding-block-end:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header,._766d9011d37ce2d9__content>[data-drawer-content]>.f1c50237c4787636__header{padding-inline:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header:first-child,._766d9011d37ce2d9__content>[data-drawer-content]>.f1c50237c4787636__header:first-child{padding-block-start:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer,._766d9011d37ce2d9__content>[data-drawer-content]>._579f95efdec92a66__footer{padding-inline:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer:last-child,._766d9011d37ce2d9__content>[data-drawer-content]>._579f95efdec92a66__footer:last-child{padding-block-end:0}.f1c50237c4787636__header:has(~[data-wp-ui-overlay-scroll-container][data-wp-ui-overlay-scrolled-from-top]){border-block-end-color:var(--wpds-color-stroke-surface-neutral,#dbdbdb)}[data-wp-ui-overlay-scroll-container][data-wp-ui-overlay-scrolled-from-bottom]~._579f95efdec92a66__footer{border-block-start-color:var(--wpds-color-stroke-surface-neutral,#dbdbdb)}[data-wp-ui-overlay-modal] [data-wp-ui-overlay-scroll-container]{overscroll-behavior:contain}}@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 var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-subtle,cubic-bezier(.15,0,.15,1))}}._8acaa98861620d4d__popup{--viewport-inset:var(--wpds-dimension-padding-2xl,24px);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);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);display:flex;flex-direction:column;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(100dvh - var(--viewport-inset)*2);min-width:var(--wpds-dimension-surface-width-sm,320px);overflow:hidden;position:fixed;top:50%;transform:translate(-50%,-50%);width:calc(100vw - var(--viewport-inset)*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 var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-expressive,cubic-bezier(.25,0,0,1)),transform var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-expressive,cubic-bezier(.25,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:100dvh}}._074affe4c56b4f2f__backdrop~* ._8acaa98861620d4d__popup{border-color:#0000}@media (forced-colors:active){._074affe4c56b4f2f__backdrop~* ._8acaa98861620d4d__popup,._8acaa98861620d4d__popup{border-color:CanvasText}}._76fb3b28fcbd45fc__header [data-wp-ui-dialog-close-icon]{margin-inline-start:auto}.d9d6da914ef0a77c__description{margin-bottom:var(--wpds-dimension-gap-lg,16px)}}\");\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 f1c50237c4787636__header\",\"footer\":\"_00eeb4f220cddae3__footer _579f95efdec92a66__footer\",\"title\":\"f636832002af749e__title _5371cc08aad82574__title\",\"content\":\"_101038da9af7162f__content _766d9011d37ce2d9__content\",\"description\":\"d9d6da914ef0a77c__description\"};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// packages/ui/src/dialog/portal.tsx
|
|
2
|
+
import { Dialog as _Dialog } from "@base-ui/react/dialog";
|
|
3
|
+
import { forwardRef } from "@wordpress/element";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
var Portal = forwardRef(
|
|
6
|
+
function DialogPortal(props, ref) {
|
|
7
|
+
return /* @__PURE__ */ jsx(_Dialog.Portal, { ref, ...props });
|
|
8
|
+
}
|
|
9
|
+
);
|
|
10
|
+
export {
|
|
11
|
+
Portal
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=portal.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/dialog/portal.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Dialog as _Dialog } from '@base-ui/react/dialog';\nimport { forwardRef } from '@wordpress/element';\nimport type { PortalProps } from './types';\n\n/**\n * Root element that portals `Dialog` overlay content (`Backdrop`, inner\n * `Popup`, etc.) outside the DOM hierarchy. Pass to `Dialog.Popup`'s\n * `portal` prop to customize `container`, `className`, `style`, and other\n * Base UI portal options. When `portal` is omitted, `Dialog.Popup` uses this\n * component with default props.\n */\nconst Portal = forwardRef< HTMLDivElement, PortalProps >(\n\tfunction DialogPortal( props, ref ) {\n\t\treturn <_Dialog.Portal ref={ ref } { ...props } />;\n\t}\n);\n\nexport { Portal };\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,kBAAkB;AAYlB;AAFT,IAAM,SAAS;AAAA,EACd,SAAS,aAAc,OAAO,KAAM;AACnC,WAAO,oBAAC,QAAQ,QAAR,EAAe,KAAc,GAAG,OAAQ;AAAA,EACjD;AACD;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
// packages/ui/src/dialog/root.tsx
|
|
2
2
|
import { Dialog as _Dialog } from "@base-ui/react/dialog";
|
|
3
|
+
import { DialogModalProvider } from "./context.mjs";
|
|
3
4
|
import { jsx } from "react/jsx-runtime";
|
|
4
|
-
function Root(props) {
|
|
5
|
-
return /* @__PURE__ */ jsx(_Dialog.Root, { ...props });
|
|
5
|
+
function Root({ modal = true, children, ...props }) {
|
|
6
|
+
return /* @__PURE__ */ jsx(_Dialog.Root, { modal, ...props, children: /* @__PURE__ */ jsx(DialogModalProvider, { modal, children }) });
|
|
6
7
|
}
|
|
7
8
|
export {
|
|
8
9
|
Root
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/dialog/root.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Dialog as _Dialog } from '@base-ui/react/dialog';\nimport type { RootProps } from './types';\n\n/**\n *
|
|
5
|
-
"mappings": ";AAAA,SAAS,UAAU,eAAe;
|
|
4
|
+
"sourcesContent": ["import { Dialog as _Dialog } from '@base-ui/react/dialog';\nimport { DialogModalProvider } from './context';\nimport type { RootProps } from './types';\n\n/**\n * An ARIA-compliant dialog that opens on top of the entire page.\n *\n * Every dialog must include a `Dialog.Title` component for accessibility \u2014 it\n * serves as both the visible heading and the accessible label for the dialog.\n *\n * Always include a visible close button, either `Dialog.CloseIcon` or a clear\n * dismissing action button. If your dialog has a \"Cancel\" button in the footer,\n * the close icon may be redundant and create confusion about what clicking \"X\"\n * means.\n *\n * Use `Dialog.CloseIcon` for informational dialogs where dismissing is safe and\n * expected. For dialogs requiring explicit user choice (especially destructive\n * actions), omit the close icon and rely on footer action buttons like \"Cancel\"\n * and \"Confirm\" instead.\n */\nfunction Root( { modal = true, children, ...props }: RootProps ) {\n\treturn (\n\t\t<_Dialog.Root modal={ modal } { ...props }>\n\t\t\t<DialogModalProvider modal={ modal }>\n\t\t\t\t{ children }\n\t\t\t</DialogModalProvider>\n\t\t</_Dialog.Root>\n\t);\n}\n\nexport { Root };\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,2BAA2B;AAsBjC;AAHH,SAAS,KAAM,EAAE,QAAQ,MAAM,UAAU,GAAG,MAAM,GAAe;AAChE,SACC,oBAAC,QAAQ,MAAR,EAAa,OAAkB,GAAG,OAClC,8BAAC,uBAAoB,OAClB,UACH,GACD;AAEF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -5,14 +5,93 @@ import { forwardRef, useEffect, useRef } from "@wordpress/element";
|
|
|
5
5
|
import { Text } from "../text/index.mjs";
|
|
6
6
|
import { useDialogValidationContext } from "./context.mjs";
|
|
7
7
|
|
|
8
|
+
// packages/style-runtime/src/index.ts
|
|
9
|
+
var STYLE_HASH_ATTRIBUTE = "data-wp-hash";
|
|
10
|
+
function getRuntime() {
|
|
11
|
+
const globalScope = globalThis;
|
|
12
|
+
if (globalScope.__wpStyleRuntime) {
|
|
13
|
+
return globalScope.__wpStyleRuntime;
|
|
14
|
+
}
|
|
15
|
+
globalScope.__wpStyleRuntime = {
|
|
16
|
+
documents: /* @__PURE__ */ new Map(),
|
|
17
|
+
styles: /* @__PURE__ */ new Map(),
|
|
18
|
+
injectedStyles: /* @__PURE__ */ new WeakMap()
|
|
19
|
+
};
|
|
20
|
+
if (typeof document !== "undefined") {
|
|
21
|
+
registerDocument(document);
|
|
22
|
+
}
|
|
23
|
+
return globalScope.__wpStyleRuntime;
|
|
24
|
+
}
|
|
25
|
+
function documentContainsStyleHash(targetDocument, hash) {
|
|
26
|
+
if (!targetDocument.head) {
|
|
27
|
+
return false;
|
|
28
|
+
}
|
|
29
|
+
for (const style of targetDocument.head.querySelectorAll(
|
|
30
|
+
`style[${STYLE_HASH_ATTRIBUTE}]`
|
|
31
|
+
)) {
|
|
32
|
+
if (style.getAttribute(STYLE_HASH_ATTRIBUTE) === hash) {
|
|
33
|
+
return true;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
return false;
|
|
37
|
+
}
|
|
38
|
+
function injectStyle(targetDocument, hash, css) {
|
|
39
|
+
if (!targetDocument.head) {
|
|
40
|
+
return;
|
|
41
|
+
}
|
|
42
|
+
const runtime = getRuntime();
|
|
43
|
+
let injectedStyles = runtime.injectedStyles.get(targetDocument);
|
|
44
|
+
if (!injectedStyles) {
|
|
45
|
+
injectedStyles = /* @__PURE__ */ new Set();
|
|
46
|
+
runtime.injectedStyles.set(targetDocument, injectedStyles);
|
|
47
|
+
}
|
|
48
|
+
if (injectedStyles.has(hash)) {
|
|
49
|
+
return;
|
|
50
|
+
}
|
|
51
|
+
if (documentContainsStyleHash(targetDocument, hash)) {
|
|
52
|
+
injectedStyles.add(hash);
|
|
53
|
+
return;
|
|
54
|
+
}
|
|
55
|
+
const style = targetDocument.createElement("style");
|
|
56
|
+
style.setAttribute(STYLE_HASH_ATTRIBUTE, hash);
|
|
57
|
+
style.appendChild(targetDocument.createTextNode(css));
|
|
58
|
+
targetDocument.head.appendChild(style);
|
|
59
|
+
injectedStyles.add(hash);
|
|
60
|
+
}
|
|
61
|
+
function registerDocument(targetDocument) {
|
|
62
|
+
const runtime = getRuntime();
|
|
63
|
+
runtime.documents.set(
|
|
64
|
+
targetDocument,
|
|
65
|
+
(runtime.documents.get(targetDocument) ?? 0) + 1
|
|
66
|
+
);
|
|
67
|
+
for (const [hash, css] of runtime.styles) {
|
|
68
|
+
injectStyle(targetDocument, hash, css);
|
|
69
|
+
}
|
|
70
|
+
return () => {
|
|
71
|
+
const count = runtime.documents.get(targetDocument);
|
|
72
|
+
if (count === void 0) {
|
|
73
|
+
return;
|
|
74
|
+
}
|
|
75
|
+
if (count <= 1) {
|
|
76
|
+
runtime.documents.delete(targetDocument);
|
|
77
|
+
return;
|
|
78
|
+
}
|
|
79
|
+
runtime.documents.set(targetDocument, count - 1);
|
|
80
|
+
};
|
|
81
|
+
}
|
|
82
|
+
function registerStyle(hash, css) {
|
|
83
|
+
const runtime = getRuntime();
|
|
84
|
+
runtime.styles.set(hash, css);
|
|
85
|
+
for (const targetDocument of runtime.documents.keys()) {
|
|
86
|
+
injectStyle(targetDocument, hash, css);
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
|
|
8
90
|
// packages/ui/src/dialog/style.module.css
|
|
9
|
-
if (typeof
|
|
10
|
-
|
|
11
|
-
style.setAttribute("data-wp-hash", "7d3678184b");
|
|
12
|
-
style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;[data-wpds-theme-provider-id]:has(>._8acaa98861620d4d__popup){display:block}@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)}}'));
|
|
13
|
-
document.head.appendChild(style);
|
|
91
|
+
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") {
|
|
92
|
+
registerStyle("a400076f01", '@layer wp-ui-components{.f1c50237c4787636__header{min-height:32px;padding-block:var(--wpds-dimension-padding-2xl,24px) var(--wpds-dimension-gap-lg,16px)}._579f95efdec92a66__footer,.f1c50237c4787636__header{align-items:center;display:flex;gap:var(--wpds-dimension-gap-sm,8px);padding-inline:var(--wpds-dimension-padding-2xl,24px)}._579f95efdec92a66__footer{justify-content:flex-end;padding-block:var(--wpds-dimension-gap-lg,16px) var(--wpds-dimension-padding-2xl,24px)}._5371cc08aad82574__title{--_gcd-heading-color:var(--wpds-color-fg-content-neutral,#1e1e1e);--_gcd-heading-margin:0 auto 0 0;color:var(--wpds-color-fg-content-neutral,#1e1e1e);margin-inline-end:auto;&:dir(rtl){--_gcd-heading-margin:0 0 0 auto}}._766d9011d37ce2d9__content{flex:1 1 auto;min-block-size:0;overflow-block:auto;overflow-inline:hidden;padding:var(--wpds-dimension-padding-2xl,24px);&:focus-visible{outline-offset:calc(var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px))*-1)}}.f1c50237c4787636__header:has(~._766d9011d37ce2d9__content){border-block-end:1px solid #0000;padding-block-end:calc(var(--wpds-dimension-gap-lg, 16px) - 1px)}.f1c50237c4787636__header~._766d9011d37ce2d9__content{padding-block-start:0}._766d9011d37ce2d9__content~._579f95efdec92a66__footer{border-block-start:1px solid #0000;padding-block-start:calc(var(--wpds-dimension-gap-lg, 16px) - 1px)}._766d9011d37ce2d9__content:has(~._579f95efdec92a66__footer){padding-block-end:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header,._766d9011d37ce2d9__content>[data-drawer-content]>.f1c50237c4787636__header{padding-inline:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header:first-child,._766d9011d37ce2d9__content>[data-drawer-content]>.f1c50237c4787636__header:first-child{padding-block-start:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer,._766d9011d37ce2d9__content>[data-drawer-content]>._579f95efdec92a66__footer{padding-inline:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer:last-child,._766d9011d37ce2d9__content>[data-drawer-content]>._579f95efdec92a66__footer:last-child{padding-block-end:0}.f1c50237c4787636__header:has(~[data-wp-ui-overlay-scroll-container][data-wp-ui-overlay-scrolled-from-top]){border-block-end-color:var(--wpds-color-stroke-surface-neutral,#dbdbdb)}[data-wp-ui-overlay-scroll-container][data-wp-ui-overlay-scrolled-from-bottom]~._579f95efdec92a66__footer{border-block-start-color:var(--wpds-color-stroke-surface-neutral,#dbdbdb)}[data-wp-ui-overlay-modal] [data-wp-ui-overlay-scroll-container]{overscroll-behavior:contain}}@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 var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-subtle,cubic-bezier(.15,0,.15,1))}}._8acaa98861620d4d__popup{--viewport-inset:var(--wpds-dimension-padding-2xl,24px);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);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);display:flex;flex-direction:column;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(100dvh - var(--viewport-inset)*2);min-width:var(--wpds-dimension-surface-width-sm,320px);overflow:hidden;position:fixed;top:50%;transform:translate(-50%,-50%);width:calc(100vw - var(--viewport-inset)*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 var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-expressive,cubic-bezier(.25,0,0,1)),transform var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-expressive,cubic-bezier(.25,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:100dvh}}._074affe4c56b4f2f__backdrop~* ._8acaa98861620d4d__popup{border-color:#0000}@media (forced-colors:active){._074affe4c56b4f2f__backdrop~* ._8acaa98861620d4d__popup,._8acaa98861620d4d__popup{border-color:CanvasText}}._76fb3b28fcbd45fc__header [data-wp-ui-dialog-close-icon]{margin-inline-start:auto}.d9d6da914ef0a77c__description{margin-bottom:var(--wpds-dimension-gap-lg,16px)}}');
|
|
14
93
|
}
|
|
15
|
-
var style_default = { "
|
|
94
|
+
var style_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 f1c50237c4787636__header", "footer": "_00eeb4f220cddae3__footer _579f95efdec92a66__footer", "title": "f636832002af749e__title _5371cc08aad82574__title", "content": "_101038da9af7162f__content _766d9011d37ce2d9__content", "description": "d9d6da914ef0a77c__description" };
|
|
16
95
|
|
|
17
96
|
// packages/ui/src/dialog/title.tsx
|
|
18
97
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../src/dialog/title.tsx", "../../src/dialog/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import { Dialog as _Dialog } from '@base-ui/react/dialog';\nimport { useMergeRefs } from '@wordpress/compose';\nimport { forwardRef, useEffect, useRef } from '@wordpress/element';\nimport { Text } from '../text';\nimport { useDialogValidationContext } from './context';\nimport styles from './style.module.css';\nimport type { TitleProps } from './types';\n\n/**\n * Renders the dialog title. This component is required for accessibility\n * and serves as both the visible heading and the accessible label for\n * the dialog.\n *\n * **Required** \u2014 every dialog must include a `Dialog.Title`, even if\n * visually hidden. The rendered element is linked to the popup via\n * `aria-labelledby`. Renders an `<h2>` by default.\n *\n * To visually hide the title while keeping it accessible, wrap it with\n * `VisuallyHidden` using the `render` prop:\n *\n * ```jsx\n * <VisuallyHidden render={ <Dialog.Title /> }>\n * Accessible title text\n * </VisuallyHidden>\n * ```\n */\nconst Title = forwardRef< HTMLHeadingElement, TitleProps >(\n\tfunction DialogTitle( { children, ...props }, forwardedRef ) {\n\t\tconst validationContext = useDialogValidationContext();\n\t\tconst internalRef = useRef< HTMLHeadingElement >( null );\n\t\tconst mergedRef = useMergeRefs( [ internalRef, forwardedRef ] );\n\n\t\tuseEffect( () => {\n\t\t\tif ( validationContext ) {\n\t\t\t\treturn validationContext.registerTitle( internalRef.current );\n\t\t\t}\n\t\t\treturn undefined;\n\t\t}, [ validationContext ] );\n\n\t\treturn (\n\t\t\t<Text\n\t\t\t\tref={ mergedRef }\n\t\t\t\tvariant=\"heading-xl\"\n\t\t\t\trender={ <_Dialog.Title { ...props } /> }\n\t\t\t\tclassName={ styles.title }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</Text>\n\t\t);\n\t}\n);\n\nexport { Title };\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='7d3678184b']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"7d3678184b\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;[data-wpds-theme-provider-id]:has(>._8acaa98861620d4d__popup){display:block}@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 {\"popup\":\"_8acaa98861620d4d__popup\",\"backdrop\":\"_074affe4c56b4f2f__backdrop\",\"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"],
|
|
5
|
-
"mappings": ";AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,oBAAoB;AAC7B,SAAS,YAAY,WAAW,cAAc;AAC9C,SAAS,YAAY;AACrB,SAAS,kCAAkC;;;
|
|
3
|
+
"sources": ["../../src/dialog/title.tsx", "../../../style-runtime/src/index.ts", "../../src/dialog/style.module.css"],
|
|
4
|
+
"sourcesContent": ["import { Dialog as _Dialog } from '@base-ui/react/dialog';\nimport { useMergeRefs } from '@wordpress/compose';\nimport { forwardRef, useEffect, useRef } from '@wordpress/element';\nimport { Text } from '../text';\nimport { useDialogValidationContext } from './context';\nimport styles from './style.module.css';\nimport type { TitleProps } from './types';\n\n/**\n * Renders the dialog title. This component is required for accessibility\n * and serves as both the visible heading and the accessible label for\n * the dialog.\n *\n * **Required** \u2014 every dialog must include a `Dialog.Title`, even if\n * visually hidden. The rendered element is linked to the popup via\n * `aria-labelledby`. Renders an `<h2>` by default.\n *\n * To visually hide the title while keeping it accessible, wrap it with\n * `VisuallyHidden` using the `render` prop:\n *\n * ```jsx\n * <VisuallyHidden render={ <Dialog.Title /> }>\n * Accessible title text\n * </VisuallyHidden>\n * ```\n */\nconst Title = forwardRef< HTMLHeadingElement, TitleProps >(\n\tfunction DialogTitle( { children, ...props }, forwardedRef ) {\n\t\tconst validationContext = useDialogValidationContext();\n\t\tconst internalRef = useRef< HTMLHeadingElement >( null );\n\t\tconst mergedRef = useMergeRefs( [ internalRef, forwardedRef ] );\n\n\t\tuseEffect( () => {\n\t\t\tif ( validationContext ) {\n\t\t\t\treturn validationContext.registerTitle( internalRef.current );\n\t\t\t}\n\t\t\treturn undefined;\n\t\t}, [ validationContext ] );\n\n\t\treturn (\n\t\t\t<Text\n\t\t\t\tref={ mergedRef }\n\t\t\t\tvariant=\"heading-xl\"\n\t\t\t\trender={ <_Dialog.Title { ...props } /> }\n\t\t\t\tclassName={ styles.title }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</Text>\n\t\t);\n\t}\n);\n\nexport { Title };\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"a400076f01\", \"@layer wp-ui-components{.f1c50237c4787636__header{min-height:32px;padding-block:var(--wpds-dimension-padding-2xl,24px) var(--wpds-dimension-gap-lg,16px)}._579f95efdec92a66__footer,.f1c50237c4787636__header{align-items:center;display:flex;gap:var(--wpds-dimension-gap-sm,8px);padding-inline:var(--wpds-dimension-padding-2xl,24px)}._579f95efdec92a66__footer{justify-content:flex-end;padding-block:var(--wpds-dimension-gap-lg,16px) var(--wpds-dimension-padding-2xl,24px)}._5371cc08aad82574__title{--_gcd-heading-color:var(--wpds-color-fg-content-neutral,#1e1e1e);--_gcd-heading-margin:0 auto 0 0;color:var(--wpds-color-fg-content-neutral,#1e1e1e);margin-inline-end:auto;&:dir(rtl){--_gcd-heading-margin:0 0 0 auto}}._766d9011d37ce2d9__content{flex:1 1 auto;min-block-size:0;overflow-block:auto;overflow-inline:hidden;padding:var(--wpds-dimension-padding-2xl,24px);&:focus-visible{outline-offset:calc(var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px))*-1)}}.f1c50237c4787636__header:has(~._766d9011d37ce2d9__content){border-block-end:1px solid #0000;padding-block-end:calc(var(--wpds-dimension-gap-lg, 16px) - 1px)}.f1c50237c4787636__header~._766d9011d37ce2d9__content{padding-block-start:0}._766d9011d37ce2d9__content~._579f95efdec92a66__footer{border-block-start:1px solid #0000;padding-block-start:calc(var(--wpds-dimension-gap-lg, 16px) - 1px)}._766d9011d37ce2d9__content:has(~._579f95efdec92a66__footer){padding-block-end:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header,._766d9011d37ce2d9__content>[data-drawer-content]>.f1c50237c4787636__header{padding-inline:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header:first-child,._766d9011d37ce2d9__content>[data-drawer-content]>.f1c50237c4787636__header:first-child{padding-block-start:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer,._766d9011d37ce2d9__content>[data-drawer-content]>._579f95efdec92a66__footer{padding-inline:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer:last-child,._766d9011d37ce2d9__content>[data-drawer-content]>._579f95efdec92a66__footer:last-child{padding-block-end:0}.f1c50237c4787636__header:has(~[data-wp-ui-overlay-scroll-container][data-wp-ui-overlay-scrolled-from-top]){border-block-end-color:var(--wpds-color-stroke-surface-neutral,#dbdbdb)}[data-wp-ui-overlay-scroll-container][data-wp-ui-overlay-scrolled-from-bottom]~._579f95efdec92a66__footer{border-block-start-color:var(--wpds-color-stroke-surface-neutral,#dbdbdb)}[data-wp-ui-overlay-modal] [data-wp-ui-overlay-scroll-container]{overscroll-behavior:contain}}@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 var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-subtle,cubic-bezier(.15,0,.15,1))}}._8acaa98861620d4d__popup{--viewport-inset:var(--wpds-dimension-padding-2xl,24px);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);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);display:flex;flex-direction:column;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(100dvh - var(--viewport-inset)*2);min-width:var(--wpds-dimension-surface-width-sm,320px);overflow:hidden;position:fixed;top:50%;transform:translate(-50%,-50%);width:calc(100vw - var(--viewport-inset)*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 var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-expressive,cubic-bezier(.25,0,0,1)),transform var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-expressive,cubic-bezier(.25,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:100dvh}}._074affe4c56b4f2f__backdrop~* ._8acaa98861620d4d__popup{border-color:#0000}@media (forced-colors:active){._074affe4c56b4f2f__backdrop~* ._8acaa98861620d4d__popup,._8acaa98861620d4d__popup{border-color:CanvasText}}._76fb3b28fcbd45fc__header [data-wp-ui-dialog-close-icon]{margin-inline-start:auto}.d9d6da914ef0a77c__description{margin-bottom:var(--wpds-dimension-gap-lg,16px)}}\");\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 f1c50237c4787636__header\",\"footer\":\"_00eeb4f220cddae3__footer _579f95efdec92a66__footer\",\"title\":\"f636832002af749e__title _5371cc08aad82574__title\",\"content\":\"_101038da9af7162f__content _766d9011d37ce2d9__content\",\"description\":\"d9d6da914ef0a77c__description\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,oBAAoB;AAC7B,SAAS,YAAY,WAAW,cAAc;AAC9C,SAAS,YAAY;AACrB,SAAS,kCAAkC;;;ACM3C,IAAM,uBAAuB;AAU7B,SAAS,aAAa;AACrB,QAAM,cAAc;AAEpB,MAAK,YAAY,kBAAmB;AACnC,WAAO,YAAY;AAAA,EACpB;AAEA,cAAY,mBAAmB;AAAA,IAC9B,WAAW,oBAAI,IAAI;AAAA,IACnB,QAAQ,oBAAI,IAAI;AAAA,IAChB,gBAAgB,oBAAI,QAAQ;AAAA,EAC7B;AAEA,MAAK,OAAO,aAAa,aAAc;AACtC,qBAAkB,QAAS;AAAA,EAC5B;AAEA,SAAO,YAAY;AACpB;AAUA,SAAS,0BACR,gBACA,MACU;AACV,MAAK,CAAE,eAAe,MAAO;AAC5B,WAAO;AAAA,EACR;AAEA,aAAY,SAAS,eAAe,KAAK;AAAA,IACxC,SAAU,oBAAqB;AAAA,EAChC,GAAI;AACH,QAAK,MAAM,aAAc,oBAAqB,MAAM,MAAO;AAC1D,aAAO;AAAA,IACR;AAAA,EACD;AAEA,SAAO;AACR;AAUA,SAAS,YAAa,gBAA0B,MAAc,KAAc;AAC3E,MAAK,CAAE,eAAe,MAAO;AAC5B;AAAA,EACD;AAEA,QAAM,UAAU,WAAW;AAC3B,MAAI,iBAAiB,QAAQ,eAAe,IAAK,cAAe;AAEhE,MAAK,CAAE,gBAAiB;AACvB,qBAAiB,oBAAI,IAAI;AACzB,YAAQ,eAAe,IAAK,gBAAgB,cAAe;AAAA,EAC5D;AAEA,MAAK,eAAe,IAAK,IAAK,GAAI;AACjC;AAAA,EACD;AAKA,MAAK,0BAA2B,gBAAgB,IAAK,GAAI;AACxD,mBAAe,IAAK,IAAK;AACzB;AAAA,EACD;AAEA,QAAM,QAAQ,eAAe,cAAe,OAAQ;AACpD,QAAM,aAAc,sBAAsB,IAAK;AAC/C,QAAM,YAAa,eAAe,eAAgB,GAAI,CAAE;AACxD,iBAAe,KAAK,YAAa,KAAM;AACvC,iBAAe,IAAK,IAAK;AAC1B;AAaO,SAAS,iBAAkB,gBAA2B;AAC5D,QAAM,UAAU,WAAW;AAE3B,UAAQ,UAAU;AAAA,IACjB;AAAA,KACE,QAAQ,UAAU,IAAK,cAAe,KAAK,KAAM;AAAA,EACpD;AAEA,aAAY,CAAE,MAAM,GAAI,KAAK,QAAQ,QAAS;AAC7C,gBAAa,gBAAgB,MAAM,GAAI;AAAA,EACxC;AAEA,SAAO,MAAM;AACZ,UAAM,QAAQ,QAAQ,UAAU,IAAK,cAAe;AAEpD,QAAK,UAAU,QAAY;AAC1B;AAAA,IACD;AAEA,QAAK,SAAS,GAAI;AACjB,cAAQ,UAAU,OAAQ,cAAe;AACzC;AAAA,IACD;AAEA,YAAQ,UAAU,IAAK,gBAAgB,QAAQ,CAAE;AAAA,EAClD;AACD;AAaO,SAAS,cAAe,MAAc,KAAc;AAC1D,QAAM,UAAU,WAAW;AAE3B,UAAQ,OAAO,IAAK,MAAM,GAAI;AAE9B,aAAY,kBAAkB,QAAQ,UAAU,KAAK,GAAI;AACxD,gBAAa,gBAAgB,MAAM,GAAI;AAAA,EACxC;AACD;;;ACpKA,IAAI,OAAO,YAAY,eAAe,QAAQ,IAAI,aAAa,QAAQ;AACtE,gBAAc,cAAc,omKAAgnK;AAC7oK;AACA,IAAO,gBAAQ,EAAC,YAAW,+BAA8B,SAAQ,4BAA2B,YAAW,+BAA8B,aAAY,gCAA+B,YAAW,+BAA8B,cAAa,gCAA+B,WAAU,6BAA4B,UAAS,sDAAqD,UAAS,uDAAsD,SAAQ,oDAAmD,WAAU,yDAAwD,eAAc,gCAA+B;;;AFuCrkB;AAjBb,IAAM,QAAQ;AAAA,EACb,SAAS,YAAa,EAAE,UAAU,GAAG,MAAM,GAAG,cAAe;AAC5D,UAAM,oBAAoB,2BAA2B;AACrD,UAAM,cAAc,OAA8B,IAAK;AACvD,UAAM,YAAY,aAAc,CAAE,aAAa,YAAa,CAAE;AAE9D,cAAW,MAAM;AAChB,UAAK,mBAAoB;AACxB,eAAO,kBAAkB,cAAe,YAAY,OAAQ;AAAA,MAC7D;AACA,aAAO;AAAA,IACR,GAAG,CAAE,iBAAkB,CAAE;AAEzB,WACC;AAAA,MAAC;AAAA;AAAA,QACA,KAAM;AAAA,QACN,SAAQ;AAAA,QACR,QAAS,oBAAC,QAAQ,OAAR,EAAgB,GAAG,OAAQ;AAAA,QACrC,WAAY,cAAO;AAAA,QAEjB;AAAA;AAAA,IACH;AAAA,EAEF;AACD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
// packages/ui/src/drawer/action.tsx
|
|
2
|
+
import { Drawer as _Drawer } from "@base-ui/react/drawer";
|
|
3
|
+
import { forwardRef } from "@wordpress/element";
|
|
4
|
+
import { Button } from "../button/index.mjs";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
6
|
+
var Action = forwardRef(
|
|
7
|
+
function DrawerAction({ render, disabled, loading, ...props }, ref) {
|
|
8
|
+
const resolvedDisabled = disabled ?? loading;
|
|
9
|
+
return /* @__PURE__ */ jsx(
|
|
10
|
+
_Drawer.Close,
|
|
11
|
+
{
|
|
12
|
+
ref,
|
|
13
|
+
render: /* @__PURE__ */ jsx(Button, { render, loading }),
|
|
14
|
+
disabled: resolvedDisabled,
|
|
15
|
+
...props
|
|
16
|
+
}
|
|
17
|
+
);
|
|
18
|
+
}
|
|
19
|
+
);
|
|
20
|
+
export {
|
|
21
|
+
Action
|
|
22
|
+
};
|
|
23
|
+
//# sourceMappingURL=action.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/drawer/action.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Drawer as _Drawer } from '@base-ui/react/drawer';\nimport { forwardRef } from '@wordpress/element';\nimport { Button } from '../button';\nimport type { ActionProps } from './types';\n\n/**\n * Renders a button that closes the drawer when clicked.\n * Accepts all Button component props for styling.\n */\nconst Action = forwardRef< HTMLButtonElement, ActionProps >(\n\tfunction DrawerAction( { render, disabled, loading, ...props }, ref ) {\n\t\t// Resolve `disabled` the same way Button does so that\n\t\t// _Drawer.Close's internal useButton (which controls\n\t\t// aria-disabled) stays in sync with the rendered Button.\n\t\tconst resolvedDisabled = disabled ?? loading;\n\n\t\treturn (\n\t\t\t<_Drawer.Close\n\t\t\t\tref={ ref }\n\t\t\t\trender={ <Button render={ render } loading={ loading } /> }\n\t\t\t\tdisabled={ resolvedDisabled }\n\t\t\t\t{ ...props }\n\t\t\t/>\n\t\t);\n\t}\n);\n\nexport { Action };\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,kBAAkB;AAC3B,SAAS,cAAc;AAiBV;AAVb,IAAM,SAAS;AAAA,EACd,SAAS,aAAc,EAAE,QAAQ,UAAU,SAAS,GAAG,MAAM,GAAG,KAAM;AAIrE,UAAM,mBAAmB,YAAY;AAErC,WACC;AAAA,MAAC,QAAQ;AAAA,MAAR;AAAA,QACA;AAAA,QACA,QAAS,oBAAC,UAAO,QAAkB,SAAoB;AAAA,QACvD,UAAW;AAAA,QACT,GAAG;AAAA;AAAA,IACN;AAAA,EAEF;AACD;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
// packages/ui/src/drawer/close-icon.tsx
|
|
2
|
+
import { Drawer as _Drawer } from "@base-ui/react/drawer";
|
|
3
|
+
import { forwardRef } from "@wordpress/element";
|
|
4
|
+
import { __ } from "@wordpress/i18n";
|
|
5
|
+
import { close } from "@wordpress/icons";
|
|
6
|
+
import { IconButton } from "../icon-button/index.mjs";
|
|
7
|
+
import { jsx } from "react/jsx-runtime";
|
|
8
|
+
var CloseIcon = forwardRef(
|
|
9
|
+
function DrawerCloseIcon({ icon, label, ...props }, ref) {
|
|
10
|
+
return /* @__PURE__ */ jsx(
|
|
11
|
+
_Drawer.Close,
|
|
12
|
+
{
|
|
13
|
+
ref,
|
|
14
|
+
render: /* @__PURE__ */ jsx(
|
|
15
|
+
IconButton,
|
|
16
|
+
{
|
|
17
|
+
variant: "minimal",
|
|
18
|
+
size: "compact",
|
|
19
|
+
tone: "neutral",
|
|
20
|
+
...props,
|
|
21
|
+
icon: icon ?? close,
|
|
22
|
+
label: label ?? __("Close"),
|
|
23
|
+
"data-wp-ui-drawer-close-icon": ""
|
|
24
|
+
}
|
|
25
|
+
)
|
|
26
|
+
}
|
|
27
|
+
);
|
|
28
|
+
}
|
|
29
|
+
);
|
|
30
|
+
export {
|
|
31
|
+
CloseIcon
|
|
32
|
+
};
|
|
33
|
+
//# sourceMappingURL=close-icon.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/drawer/close-icon.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Drawer as _Drawer } from '@base-ui/react/drawer';\nimport { forwardRef } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { IconButton } from '../icon-button';\nimport type { CloseIconProps } from './types';\n\n/**\n * Renders an icon button that closes the drawer when clicked.\n * Provides a default close icon and accessible label.\n */\nconst CloseIcon = forwardRef< HTMLButtonElement, CloseIconProps >(\n\tfunction DrawerCloseIcon( { icon, label, ...props }, ref ) {\n\t\treturn (\n\t\t\t<_Drawer.Close\n\t\t\t\tref={ ref }\n\t\t\t\trender={\n\t\t\t\t\t<IconButton\n\t\t\t\t\t\tvariant=\"minimal\"\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\ttone=\"neutral\"\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\ticon={ icon ?? close }\n\t\t\t\t\t\tlabel={ label ?? __( 'Close' ) }\n\t\t\t\t\t\tdata-wp-ui-drawer-close-icon=\"\"\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t/>\n\t\t);\n\t}\n);\n\nexport { CloseIcon };\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,kBAAkB;AAC3B,SAAS,UAAU;AACnB,SAAS,aAAa;AACtB,SAAS,kBAAkB;AAatB;AANL,IAAM,YAAY;AAAA,EACjB,SAAS,gBAAiB,EAAE,MAAM,OAAO,GAAG,MAAM,GAAG,KAAM;AAC1D,WACC;AAAA,MAAC,QAAQ;AAAA,MAAR;AAAA,QACA;AAAA,QACA,QACC;AAAA,UAAC;AAAA;AAAA,YACA,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,MAAK;AAAA,YACH,GAAG;AAAA,YACL,MAAO,QAAQ;AAAA,YACf,OAAQ,SAAS,GAAI,OAAQ;AAAA,YAC7B,gCAA6B;AAAA;AAAA,QAC9B;AAAA;AAAA,IAEF;AAAA,EAEF;AACD;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|