@wordpress/ui 0.11.0 → 0.12.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 +46 -0
- package/README.md +4 -4
- package/build/alert-dialog/index.cjs +3 -0
- package/build/alert-dialog/index.cjs.map +2 -2
- package/build/alert-dialog/popup.cjs +120 -55
- 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/collapsible-card/content.cjs +9 -5
- package/build/collapsible-card/content.cjs.map +2 -2
- package/build/collapsible-card/header.cjs +14 -4
- package/build/collapsible-card/header.cjs.map +3 -3
- package/build/dialog/content.cjs +85 -0
- package/build/dialog/content.cjs.map +7 -0
- package/build/dialog/context.cjs +12 -44
- package/build/dialog/context.cjs.map +2 -2
- package/build/dialog/description.cjs +59 -0
- package/build/dialog/description.cjs.map +7 -0
- package/build/dialog/footer.cjs +5 -4
- package/build/dialog/footer.cjs.map +2 -2
- package/build/dialog/header.cjs +5 -4
- package/build/dialog/header.cjs.map +2 -2
- package/build/dialog/index.cjs +9 -0
- package/build/dialog/index.cjs.map +2 -2
- package/build/dialog/popup.cjs +21 -9
- package/build/dialog/popup.cjs.map +2 -2
- 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 +9 -6
- package/build/dialog/title.cjs.map +2 -2
- 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 +86 -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 +65 -0
- package/build/drawer/footer.cjs.map +7 -0
- package/build/drawer/header.cjs +65 -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 +103 -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 +70 -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/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 +67 -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 +81 -0
- package/build/form/primitives/autocomplete/item.cjs.map +7 -0
- package/build/form/primitives/autocomplete/list-body.cjs +57 -0
- package/build/form/primitives/autocomplete/list-body.cjs.map +7 -0
- package/build/form/primitives/autocomplete/list.cjs +67 -0
- package/build/form/primitives/autocomplete/list.cjs.map +7 -0
- package/build/form/primitives/autocomplete/popup.cjs +102 -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/index.cjs +3 -0
- package/build/form/primitives/index.cjs.map +2 -2
- 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 +4 -5
- package/build/form/primitives/select/item.cjs.map +2 -2
- package/build/form/primitives/select/popup.cjs +12 -11
- package/build/form/primitives/select/popup.cjs.map +2 -2
- package/build/form/primitives/select/portal.cjs +38 -0
- package/build/form/primitives/select/portal.cjs.map +7 -0
- package/build/form/primitives/select/types.cjs.map +1 -1
- package/build/index.cjs +3 -0
- package/build/index.cjs.map +2 -2
- package/build/link/link.cjs +8 -18
- package/build/link/link.cjs.map +2 -2
- package/build/link/types.cjs.map +1 -1
- package/build/notice/action-button.cjs +3 -3
- package/build/notice/action-button.cjs.map +2 -2
- package/build/notice/action-link.cjs +8 -7
- package/build/notice/action-link.cjs.map +2 -2
- package/build/notice/actions.cjs +3 -3
- package/build/notice/actions.cjs.map +2 -2
- package/build/notice/close-icon.cjs +3 -3
- package/build/notice/close-icon.cjs.map +2 -2
- package/build/notice/description.cjs +3 -3
- package/build/notice/description.cjs.map +2 -2
- package/build/notice/root.cjs +3 -3
- package/build/notice/root.cjs.map +2 -2
- package/build/notice/title.cjs +3 -3
- package/build/notice/title.cjs.map +2 -2
- package/build/popover/arrow.cjs +4 -4
- package/build/popover/arrow.cjs.map +2 -2
- package/build/popover/context.cjs +4 -44
- 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 +15 -15
- package/build/popover/popup.cjs.map +2 -2
- 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 +18 -4
- package/build/popover/title.cjs.map +3 -3
- package/build/popover/types.cjs.map +1 -1
- package/build/tabs/context.cjs +9 -22
- package/build/tabs/context.cjs.map +2 -2
- package/build/tabs/list.cjs +4 -4
- package/build/tabs/list.cjs.map +2 -2
- package/build/tabs/panel.cjs +19 -6
- package/build/tabs/panel.cjs.map +3 -3
- package/build/tabs/tab.cjs +4 -4
- package/build/tabs/tab.cjs.map +2 -2
- package/build/text/text.cjs +2 -2
- package/build/text/text.cjs.map +2 -2
- package/build/tooltip/index.cjs +3 -0
- package/build/tooltip/index.cjs.map +2 -2
- package/build/tooltip/popup.cjs +11 -14
- package/build/tooltip/popup.cjs.map +3 -3
- package/build/tooltip/portal.cjs +38 -0
- package/build/tooltip/portal.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-portal-with-children.cjs +37 -0
- package/build/utils/render-portal-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/utils/use-schedule-validation.cjs +59 -0
- package/build/utils/use-schedule-validation.cjs.map +7 -0
- package/build/visually-hidden/visually-hidden.cjs +5 -1
- package/build/visually-hidden/visually-hidden.cjs.map +2 -2
- 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 +124 -56
- 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/collapsible-card/content.mjs +9 -5
- package/build-module/collapsible-card/content.mjs.map +2 -2
- package/build-module/collapsible-card/header.mjs +14 -4
- package/build-module/collapsible-card/header.mjs.map +3 -3
- package/build-module/dialog/content.mjs +50 -0
- package/build-module/dialog/content.mjs.map +7 -0
- package/build-module/dialog/context.mjs +10 -51
- package/build-module/dialog/context.mjs.map +2 -2
- package/build-module/dialog/description.mjs +34 -0
- package/build-module/dialog/description.mjs.map +7 -0
- package/build-module/dialog/footer.mjs +5 -4
- package/build-module/dialog/footer.mjs.map +2 -2
- package/build-module/dialog/header.mjs +5 -4
- package/build-module/dialog/header.mjs.map +2 -2
- package/build-module/dialog/index.mjs +6 -0
- package/build-module/dialog/index.mjs.map +2 -2
- package/build-module/dialog/popup.mjs +23 -11
- package/build-module/dialog/popup.mjs.map +2 -2
- 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 +10 -7
- package/build-module/dialog/title.mjs.map +2 -2
- 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 +51 -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 +30 -0
- package/build-module/drawer/footer.mjs.map +7 -0
- package/build-module/drawer/header.mjs +30 -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 +70 -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 +45 -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/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 +32 -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 +46 -0
- package/build-module/form/primitives/autocomplete/item.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/list-body.mjs +32 -0
- package/build-module/form/primitives/autocomplete/list-body.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/list.mjs +32 -0
- package/build-module/form/primitives/autocomplete/list.mjs.map +7 -0
- package/build-module/form/primitives/autocomplete/popup.mjs +69 -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/value.mjs +10 -0
- package/build-module/form/primitives/autocomplete/value.mjs.map +7 -0
- package/build-module/form/primitives/index.mjs +2 -0
- package/build-module/form/primitives/index.mjs.map +2 -2
- 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 +4 -5
- package/build-module/form/primitives/select/item.mjs.map +2 -2
- package/build-module/form/primitives/select/popup.mjs +12 -11
- package/build-module/form/primitives/select/popup.mjs.map +2 -2
- package/build-module/form/primitives/select/portal.mjs +13 -0
- package/build-module/form/primitives/select/portal.mjs.map +7 -0
- package/build-module/index.mjs +2 -0
- package/build-module/index.mjs.map +2 -2
- package/build-module/link/link.mjs +8 -18
- package/build-module/link/link.mjs.map +2 -2
- package/build-module/notice/action-button.mjs +3 -3
- package/build-module/notice/action-button.mjs.map +2 -2
- package/build-module/notice/action-link.mjs +8 -7
- package/build-module/notice/action-link.mjs.map +2 -2
- package/build-module/notice/actions.mjs +3 -3
- package/build-module/notice/actions.mjs.map +2 -2
- package/build-module/notice/close-icon.mjs +3 -3
- package/build-module/notice/close-icon.mjs.map +2 -2
- package/build-module/notice/description.mjs +3 -3
- package/build-module/notice/description.mjs.map +2 -2
- package/build-module/notice/root.mjs +3 -3
- package/build-module/notice/root.mjs.map +2 -2
- package/build-module/notice/title.mjs +3 -3
- package/build-module/notice/title.mjs.map +2 -2
- package/build-module/popover/arrow.mjs +4 -4
- package/build-module/popover/arrow.mjs.map +2 -2
- package/build-module/popover/context.mjs +4 -51
- 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 +16 -16
- package/build-module/popover/popup.mjs.map +2 -2
- 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 +19 -5
- package/build-module/popover/title.mjs.map +3 -3
- package/build-module/tabs/context.mjs +11 -24
- package/build-module/tabs/context.mjs.map +2 -2
- package/build-module/tabs/list.mjs +4 -4
- package/build-module/tabs/list.mjs.map +2 -2
- package/build-module/tabs/panel.mjs +19 -6
- package/build-module/tabs/panel.mjs.map +3 -3
- package/build-module/tabs/tab.mjs +4 -4
- package/build-module/tabs/tab.mjs.map +2 -2
- package/build-module/text/text.mjs +2 -2
- package/build-module/text/text.mjs.map +2 -2
- package/build-module/tooltip/index.mjs +2 -0
- package/build-module/tooltip/index.mjs.map +2 -2
- package/build-module/tooltip/popup.mjs +14 -17
- package/build-module/tooltip/popup.mjs.map +2 -2
- package/build-module/tooltip/portal.mjs +13 -0
- package/build-module/tooltip/portal.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-portal-with-children.mjs +12 -0
- package/build-module/utils/render-portal-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/utils/use-schedule-validation.mjs +34 -0
- package/build-module/utils/use-schedule-validation.mjs.map +7 -0
- package/build-module/visually-hidden/visually-hidden.mjs +5 -1
- package/build-module/visually-hidden/visually-hidden.mjs.map +2 -2
- 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/stories/index.story.d.ts +29 -1
- 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/index.story.d.ts.map +1 -1
- package/build-types/card/stories/index.story.d.ts.map +1 -1
- package/build-types/collapsible/stories/index.story.d.ts.map +1 -1
- package/build-types/collapsible-card/content.d.ts.map +1 -1
- package/build-types/collapsible-card/header.d.ts.map +1 -1
- 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 +3 -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/title.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 +21 -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 +16 -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 +1 -1
- package/build-types/empty-state/stories/index.story.d.ts.map +1 -1
- package/build-types/form/input-control/stories/index.story.d.ts +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/stories/index.story.d.ts +1 -1
- package/build-types/form/primitives/field/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/fieldset/stories/index.story.d.ts +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/stories/index.story.d.ts +1 -1
- 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 +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.map +1 -1
- package/build-types/form/primitives/select/popup.d.ts +1 -2
- 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/stories/index.story.d.ts +14 -6
- package/build-types/form/primitives/select/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/select/types.d.ts +7 -2
- package/build-types/form/primitives/select/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/link.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/link/types.d.ts +1 -2
- package/build-types/link/types.d.ts.map +1 -1
- package/build-types/notice/action-link.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 +23 -15
- 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.map +1 -1
- package/build-types/tabs/panel.d.ts.map +1 -1
- package/build-types/tabs/stories/index.story.d.ts +1 -1
- package/build-types/tabs/stories/index.story.d.ts.map +1 -1
- package/build-types/text/stories/index.story.d.ts.map +1 -1
- package/build-types/tooltip/index.d.ts +2 -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/provider.d.ts +1 -1
- package/build-types/tooltip/provider.d.ts.map +1 -1
- package/build-types/tooltip/stories/index.story.d.ts +18 -1
- 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 +11 -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-portal-with-children.d.ts +16 -0
- package/build-types/utils/render-portal-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/utils/use-schedule-validation.d.ts +13 -0
- package/build-types/utils/use-schedule-validation.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 +12 -12
- 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 +123 -3
- 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/choosing-intent.story.tsx +1 -1
- package/src/badge/stories/index.story.tsx +1 -0
- package/src/card/stories/index.story.tsx +1 -0
- package/src/collapsible/stories/index.story.tsx +1 -0
- package/src/collapsible-card/content.tsx +12 -1
- package/src/collapsible-card/header.tsx +2 -0
- package/src/collapsible-card/stories/index.story.tsx +1 -0
- package/src/collapsible-card/style.module.css +16 -4
- package/src/dialog/content.tsx +47 -0
- package/src/dialog/context.tsx +14 -98
- 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 +28 -8
- package/src/dialog/portal.tsx +18 -0
- package/src/dialog/root.tsx +22 -5
- package/src/dialog/stories/index.story.tsx +195 -51
- package/src/dialog/style.module.css +73 -23
- package/src/dialog/test/index.test.tsx +849 -149
- package/src/dialog/title.tsx +6 -4
- 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 +50 -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 +100 -0
- package/src/drawer/portal.tsx +18 -0
- package/src/drawer/root.tsx +41 -0
- package/src/drawer/stories/index.story.tsx +543 -0
- package/src/drawer/style.module.css +324 -0
- package/src/drawer/test/index.test.tsx +1097 -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 +2 -1
- package/src/form/input-control/stories/index.story.tsx +4 -1
- 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 +437 -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 +1 -1
- package/src/form/primitives/fieldset/stories/index.story.tsx +1 -1
- package/src/form/primitives/index.ts +1 -0
- package/src/form/primitives/input/stories/index.story.tsx +2 -1
- package/src/form/primitives/input-layout/stories/index.story.tsx +2 -1
- package/src/form/primitives/select/index.ts +1 -0
- package/src/form/primitives/select/item.tsx +0 -1
- package/src/form/primitives/select/popup.tsx +34 -37
- package/src/form/primitives/select/portal.tsx +16 -0
- package/src/form/primitives/select/stories/index.story.tsx +21 -7
- package/src/form/primitives/select/test/index.test.tsx +7 -3
- package/src/form/primitives/select/types.ts +9 -2
- package/src/index.ts +1 -0
- package/src/link/link.tsx +12 -26
- package/src/link/stories/index.story.tsx +6 -11
- package/src/link/style.module.css +5 -17
- package/src/link/test/index.test.tsx +31 -27
- package/src/link/types.ts +1 -2
- package/src/notice/action-link.tsx +7 -4
- package/src/notice/style.module.css +5 -5
- package/src/popover/context.tsx +6 -89
- package/src/popover/description.tsx +1 -5
- package/src/popover/index.ts +2 -1
- package/src/popover/popup.tsx +17 -15
- package/src/popover/portal.tsx +17 -0
- package/src/popover/root.tsx +2 -2
- package/src/popover/stories/index.story.tsx +56 -25
- package/src/popover/style.module.css +33 -4
- package/src/popover/test/index.test.tsx +189 -74
- package/src/popover/title.tsx +9 -5
- package/src/popover/types.ts +10 -15
- package/src/stack/stories/index.story.tsx +1 -0
- package/src/tabs/context.tsx +14 -34
- package/src/tabs/panel.tsx +7 -2
- package/src/tabs/stories/index.story.tsx +2 -1
- package/src/tabs/style.module.css +0 -17
- package/src/tabs/test/index.test.tsx +7 -3
- package/src/text/stories/index.story.tsx +1 -0
- package/src/text/text.tsx +2 -2
- package/src/tooltip/index.ts +2 -1
- package/src/tooltip/popup.tsx +24 -28
- package/src/tooltip/portal.tsx +16 -0
- package/src/tooltip/provider.tsx +3 -3
- package/src/tooltip/root.tsx +2 -2
- package/src/tooltip/stories/index.story.tsx +39 -1
- package/src/tooltip/stories/usage-guidelines.story.tsx +5 -1
- package/src/tooltip/style.module.css +12 -0
- package/src/tooltip/test/index.test.tsx +9 -3
- package/src/tooltip/trigger.tsx +3 -7
- package/src/tooltip/types.ts +13 -7
- package/src/utils/create-overlay-modal-context.tsx +34 -0
- package/src/utils/create-overlay-title-validation.tsx +116 -0
- package/src/utils/css/item-popup.module.css +9 -11
- package/src/utils/css/overlay-chrome.module.css +222 -0
- package/src/utils/render-portal-with-children.ts +27 -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/utils/use-schedule-validation.ts +45 -0
- package/src/visually-hidden/stories/index.story.tsx +1 -0
- package/src/visually-hidden/visually-hidden.tsx +9 -21
- package/build/types/css-modules.d.cjs +0 -2
- package/build/types/react.d.cjs +0 -5
- package/build/types/react.d.cjs.map +0 -7
- package/build-module/types/css-modules.d.mjs +0 -1
- package/build-module/types/react.d.mjs +0 -3
- package/build-module/types/react.d.mjs.map +0 -7
- package/src/types/css-modules.d.ts +0 -4
- package/src/types/react.d.ts +0 -7
- /package/build-module/{types/css-modules.d.mjs.map → drawer/types.mjs.map} +0 -0
- /package/{build/types/css-modules.d.cjs.map → build-module/form/primitives/autocomplete/types.mjs.map} +0 -0
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/drawer/header.tsx", "../../src/drawer/style.module.css"],
|
|
4
|
+
"sourcesContent": ["import { mergeProps, useRender } from '@base-ui/react';\nimport clsx from 'clsx';\nimport { forwardRef } from '@wordpress/element';\nimport styles from './style.module.css';\nimport type { HeaderProps } from './types';\n\n/**\n * Renders the header section of the drawer, typically containing\n * the heading and close button.\n *\n * Defaults to a native `<header>` element for richer semantics (heading-level\n * scanning, and banner landmark navigation where screen readers expose\n * landmarks nested in dialogs). Pass `render` to opt out of the default tag.\n *\n * The header is pinned to the top of the popup by default. To let it scroll\n * with the body instead, render it *inside* `Drawer.Content`.\n */\nconst Header = forwardRef< HTMLElement, HeaderProps >( function DrawerHeader(\n\t{ className, render, ...props },\n\tref\n) {\n\tconst element = useRender( {\n\t\tdefaultTagName: 'header',\n\t\trender,\n\t\tref,\n\t\tprops: mergeProps< 'header' >( props, {\n\t\t\tclassName: clsx( styles.header, className ),\n\t\t} ),\n\t} );\n\n\treturn element;\n} );\n\nexport { Header };\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='7b0e336948']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"7b0e336948\");\n\tstyle.appendChild(document.createTextNode(\"@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{padding-inline:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header:first-child{padding-block-start:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer{padding-inline:0}._766d9011d37ce2d9__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;[data-wpds-theme-provider-id]:has(>._882277c289298491__popup){display:block}@layer wp-ui-components{._07e459cfa0254522__backdrop{--backdrop-opacity:0.35;background-color:#000;inset:0;min-height:100dvh;opacity:calc(var(--backdrop-opacity)*(1 - var(--drawer-swipe-progress)));position:fixed;z-index:var(--wp-ui-drawer-z-index,initial);@supports (-webkit-touch-callout:none){position:absolute}&[data-ending-style],&[data-starting-style]{opacity:0}@media not (prefers-reduced-motion){transition:opacity .45s cubic-bezier(.32,.72,0,1);&[data-ending-style]{pointer-events:none;transition-duration:calc(var(--drawer-swipe-strength)*.4s)}&[data-swiping]{transition-duration:0ms}}}.f1cf22f966cf516e__viewport{inset:0;pointer-events:none;position:fixed;z-index:var(--wp-ui-drawer-z-index,initial)}._882277c289298491__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);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);line-height:var(--wpds-typography-line-height-md,24px);outline:0;overflow:hidden;pointer-events:auto;position:fixed;touch-action:auto;z-index:var(--wp-ui-drawer-z-index,initial);&[data-open],&[data-swiping]{will-change:transform;@media not (prefers-reduced-motion){transition:transform .45s cubic-bezier(.32,.72,0,1);&[data-ending-style]{transition-duration:calc(var(--drawer-swipe-strength)*.4s)}&[data-swiping]{transition-duration:0ms}}}&.e758b2a0572e1951__is-small{--popup-size:var(--wpds-dimension-surface-width-sm,320px)}&._21ddafd99d004b84__is-medium{--popup-size:var(--wpds-dimension-surface-width-md,400px)}&._78636e3fdcb75c3b__is-large{--popup-size:var(--wpds-dimension-surface-width-lg,560px)}&.b2960a80aa46d1f9__is-stretch{--popup-size:var(--stretch-size)}&._949cc180111d609b__is-auto{--popup-size:auto}&[data-swiping]{user-select:none}&[data-swipe-direction=left]{--stretch-size:calc(100vw - var(--viewport-inset));border-end-end-radius:var(--wpds-border-radius-lg,8px);border-start-end-radius:var(--wpds-border-radius-lg,8px);bottom:0;left:0;max-width:calc(100vw - var(--viewport-inset));top:0;transform:translateX(var(--drawer-swipe-movement-x));width:var(--popup-size);&[data-ending-style],&[data-starting-style]{transform:translateX(-100%)}}&[data-swipe-direction=right]{--stretch-size:calc(100vw - var(--viewport-inset));border-end-start-radius:var(--wpds-border-radius-lg,8px);border-start-start-radius:var(--wpds-border-radius-lg,8px);bottom:0;max-width:calc(100vw - var(--viewport-inset));right:0;top:0;transform:translateX(var(--drawer-swipe-movement-x));width:var(--popup-size);&[data-ending-style],&[data-starting-style]{transform:translateX(100%)}}&[data-swipe-direction=down]{--stretch-size:calc(100dvh - var(--viewport-inset));border-start-end-radius:var(--wpds-border-radius-lg,8px);border-start-start-radius:var(--wpds-border-radius-lg,8px);bottom:0;height:var(--popup-size);left:0;max-height:calc(100dvh - var(--viewport-inset));right:0;transform:translateY(var(--drawer-swipe-movement-y));&[data-ending-style],&[data-starting-style]{transform:translateY(100%)}}&[data-swipe-direction=up]{--stretch-size:calc(100dvh - var(--viewport-inset));border-end-end-radius:var(--wpds-border-radius-lg,8px);border-end-start-radius:var(--wpds-border-radius-lg,8px);height:var(--popup-size);left:0;max-height:calc(100dvh - var(--viewport-inset));right:0;top:0;transform:translateY(var(--drawer-swipe-movement-y));&[data-ending-style],&[data-starting-style]{transform:translateY(-100%)}}}._07e459cfa0254522__backdrop~* ._882277c289298491__popup{border-color:#0000}@media (forced-colors:active){._07e459cfa0254522__backdrop~* ._882277c289298491__popup,._882277c289298491__popup{border-color:CanvasText}}.e84af91dc76cf84f__header [data-wp-ui-drawer-close-icon]{margin-inline-start:auto}._882277c289298491__popup[data-swipe-direction=left] .c7c17b6b2378b2ee__content{padding-left:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-left))}._882277c289298491__popup[data-swipe-direction=right] .c7c17b6b2378b2ee__content{padding-right:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-right))}._882277c289298491__popup[data-swipe-direction=up]>.e84af91dc76cf84f__header{padding-top:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-top))}._882277c289298491__popup[data-swipe-direction=down]>._1136b31b67a81245__footer{padding-bottom:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-bottom))}._882277c289298491__popup[data-swipe-direction=up]>.c7c17b6b2378b2ee__content:first-child{padding-top:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-top))}._882277c289298491__popup[data-swipe-direction=down]>.c7c17b6b2378b2ee__content:last-child{padding-bottom:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-bottom))}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"popup\":\"_882277c289298491__popup\",\"backdrop\":\"_07e459cfa0254522__backdrop\",\"viewport\":\"f1cf22f966cf516e__viewport\",\"is-small\":\"e758b2a0572e1951__is-small\",\"is-medium\":\"_21ddafd99d004b84__is-medium\",\"is-large\":\"_78636e3fdcb75c3b__is-large\",\"is-stretch\":\"b2960a80aa46d1f9__is-stretch\",\"is-auto\":\"_949cc180111d609b__is-auto\",\"header\":\"e84af91dc76cf84f__header f1c50237c4787636__header\",\"footer\":\"_1136b31b67a81245__footer _579f95efdec92a66__footer\",\"title\":\"_0dab095165fca096__title _5371cc08aad82574__title\",\"content\":\"c7c17b6b2378b2ee__content _766d9011d37ce2d9__content\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,YAAY,iBAAiB;AACtC,OAAO,UAAU;AACjB,SAAS,kBAAkB;;;ACF3B,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,05OAAs6O,CAAC;AACj9O,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,SAAQ,4BAA2B,YAAW,+BAA8B,YAAW,8BAA6B,YAAW,8BAA6B,aAAY,gCAA+B,YAAW,+BAA8B,cAAa,gCAA+B,WAAU,8BAA6B,UAAS,qDAAoD,UAAS,uDAAsD,SAAQ,qDAAoD,WAAU,uDAAsD;;;ADW3kB,IAAM,SAAS,WAAwC,SAAS,aAC/D,EAAE,WAAW,QAAQ,GAAG,MAAM,GAC9B,KACC;AACD,QAAM,UAAU,UAAW;AAAA,IAC1B,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA,OAAO,WAAwB,OAAO;AAAA,MACrC,WAAW,KAAM,cAAO,QAAQ,SAAU;AAAA,IAC3C,CAAE;AAAA,EACH,CAAE;AAEF,SAAO;AACR,CAAE;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
// packages/ui/src/drawer/index.ts
|
|
2
|
+
import { Action } from "./action.mjs";
|
|
3
|
+
import { CloseIcon } from "./close-icon.mjs";
|
|
4
|
+
import { Content } from "./content.mjs";
|
|
5
|
+
import { Description } from "./description.mjs";
|
|
6
|
+
import { Footer } from "./footer.mjs";
|
|
7
|
+
import { Header } from "./header.mjs";
|
|
8
|
+
import { Popup } from "./popup.mjs";
|
|
9
|
+
import { Portal } from "./portal.mjs";
|
|
10
|
+
import { Root } from "./root.mjs";
|
|
11
|
+
import { Title } from "./title.mjs";
|
|
12
|
+
import { Trigger } from "./trigger.mjs";
|
|
13
|
+
export {
|
|
14
|
+
Action,
|
|
15
|
+
CloseIcon,
|
|
16
|
+
Content,
|
|
17
|
+
Description,
|
|
18
|
+
Footer,
|
|
19
|
+
Header,
|
|
20
|
+
Popup,
|
|
21
|
+
Portal,
|
|
22
|
+
Root,
|
|
23
|
+
Title,
|
|
24
|
+
Trigger
|
|
25
|
+
};
|
|
26
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/drawer/index.ts"],
|
|
4
|
+
"sourcesContent": ["import { Action } from './action';\nimport { CloseIcon } from './close-icon';\nimport { Content } from './content';\nimport { Description } from './description';\nimport { Footer } from './footer';\nimport { Header } from './header';\nimport { Popup } from './popup';\nimport { Portal } from './portal';\nimport { Root } from './root';\nimport { Title } from './title';\nimport { Trigger } from './trigger';\n\nexport {\n\tAction,\n\tCloseIcon,\n\tContent,\n\tDescription,\n\tFooter,\n\tHeader,\n\tPopup,\n\tPortal,\n\tRoot,\n\tTitle,\n\tTrigger,\n};\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,eAAe;AACxB,SAAS,mBAAmB;AAC5B,SAAS,cAAc;AACvB,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,aAAa;AACtB,SAAS,eAAe;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
// packages/ui/src/drawer/popup.tsx
|
|
2
|
+
import { Drawer as _Drawer } from "@base-ui/react/drawer";
|
|
3
|
+
import clsx from "clsx";
|
|
4
|
+
import { forwardRef } from "@wordpress/element";
|
|
5
|
+
import { useMergeRefs } from "@wordpress/compose";
|
|
6
|
+
import {
|
|
7
|
+
privateApis as themePrivateApis
|
|
8
|
+
} from "@wordpress/theme";
|
|
9
|
+
import { unlock } from "../lock-unlock.mjs";
|
|
10
|
+
import { useDeprioritizedInitialFocus } from "../utils/use-deprioritized-initial-focus.mjs";
|
|
11
|
+
import { SCROLL_CONTAINER_ATTR } from "../utils/use-overlay-scroll-state-attributes.mjs";
|
|
12
|
+
import { renderPortalWithChildren } from "../utils/render-portal-with-children.mjs";
|
|
13
|
+
import { DrawerValidationProvider, useDrawerModal } from "./context.mjs";
|
|
14
|
+
import { Portal } from "./portal.mjs";
|
|
15
|
+
|
|
16
|
+
// packages/ui/src/drawer/style.module.css
|
|
17
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='7b0e336948']")) {
|
|
18
|
+
const style = document.createElement("style");
|
|
19
|
+
style.setAttribute("data-wp-hash", "7b0e336948");
|
|
20
|
+
style.appendChild(document.createTextNode('@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{padding-inline:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header:first-child{padding-block-start:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer{padding-inline:0}._766d9011d37ce2d9__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;[data-wpds-theme-provider-id]:has(>._882277c289298491__popup){display:block}@layer wp-ui-components{._07e459cfa0254522__backdrop{--backdrop-opacity:0.35;background-color:#000;inset:0;min-height:100dvh;opacity:calc(var(--backdrop-opacity)*(1 - var(--drawer-swipe-progress)));position:fixed;z-index:var(--wp-ui-drawer-z-index,initial);@supports (-webkit-touch-callout:none){position:absolute}&[data-ending-style],&[data-starting-style]{opacity:0}@media not (prefers-reduced-motion){transition:opacity .45s cubic-bezier(.32,.72,0,1);&[data-ending-style]{pointer-events:none;transition-duration:calc(var(--drawer-swipe-strength)*.4s)}&[data-swiping]{transition-duration:0ms}}}.f1cf22f966cf516e__viewport{inset:0;pointer-events:none;position:fixed;z-index:var(--wp-ui-drawer-z-index,initial)}._882277c289298491__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);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);line-height:var(--wpds-typography-line-height-md,24px);outline:0;overflow:hidden;pointer-events:auto;position:fixed;touch-action:auto;z-index:var(--wp-ui-drawer-z-index,initial);&[data-open],&[data-swiping]{will-change:transform;@media not (prefers-reduced-motion){transition:transform .45s cubic-bezier(.32,.72,0,1);&[data-ending-style]{transition-duration:calc(var(--drawer-swipe-strength)*.4s)}&[data-swiping]{transition-duration:0ms}}}&.e758b2a0572e1951__is-small{--popup-size:var(--wpds-dimension-surface-width-sm,320px)}&._21ddafd99d004b84__is-medium{--popup-size:var(--wpds-dimension-surface-width-md,400px)}&._78636e3fdcb75c3b__is-large{--popup-size:var(--wpds-dimension-surface-width-lg,560px)}&.b2960a80aa46d1f9__is-stretch{--popup-size:var(--stretch-size)}&._949cc180111d609b__is-auto{--popup-size:auto}&[data-swiping]{user-select:none}&[data-swipe-direction=left]{--stretch-size:calc(100vw - var(--viewport-inset));border-end-end-radius:var(--wpds-border-radius-lg,8px);border-start-end-radius:var(--wpds-border-radius-lg,8px);bottom:0;left:0;max-width:calc(100vw - var(--viewport-inset));top:0;transform:translateX(var(--drawer-swipe-movement-x));width:var(--popup-size);&[data-ending-style],&[data-starting-style]{transform:translateX(-100%)}}&[data-swipe-direction=right]{--stretch-size:calc(100vw - var(--viewport-inset));border-end-start-radius:var(--wpds-border-radius-lg,8px);border-start-start-radius:var(--wpds-border-radius-lg,8px);bottom:0;max-width:calc(100vw - var(--viewport-inset));right:0;top:0;transform:translateX(var(--drawer-swipe-movement-x));width:var(--popup-size);&[data-ending-style],&[data-starting-style]{transform:translateX(100%)}}&[data-swipe-direction=down]{--stretch-size:calc(100dvh - var(--viewport-inset));border-start-end-radius:var(--wpds-border-radius-lg,8px);border-start-start-radius:var(--wpds-border-radius-lg,8px);bottom:0;height:var(--popup-size);left:0;max-height:calc(100dvh - var(--viewport-inset));right:0;transform:translateY(var(--drawer-swipe-movement-y));&[data-ending-style],&[data-starting-style]{transform:translateY(100%)}}&[data-swipe-direction=up]{--stretch-size:calc(100dvh - var(--viewport-inset));border-end-end-radius:var(--wpds-border-radius-lg,8px);border-end-start-radius:var(--wpds-border-radius-lg,8px);height:var(--popup-size);left:0;max-height:calc(100dvh - var(--viewport-inset));right:0;top:0;transform:translateY(var(--drawer-swipe-movement-y));&[data-ending-style],&[data-starting-style]{transform:translateY(-100%)}}}._07e459cfa0254522__backdrop~* ._882277c289298491__popup{border-color:#0000}@media (forced-colors:active){._07e459cfa0254522__backdrop~* ._882277c289298491__popup,._882277c289298491__popup{border-color:CanvasText}}.e84af91dc76cf84f__header [data-wp-ui-drawer-close-icon]{margin-inline-start:auto}._882277c289298491__popup[data-swipe-direction=left] .c7c17b6b2378b2ee__content{padding-left:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-left))}._882277c289298491__popup[data-swipe-direction=right] .c7c17b6b2378b2ee__content{padding-right:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-right))}._882277c289298491__popup[data-swipe-direction=up]>.e84af91dc76cf84f__header{padding-top:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-top))}._882277c289298491__popup[data-swipe-direction=down]>._1136b31b67a81245__footer{padding-bottom:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-bottom))}._882277c289298491__popup[data-swipe-direction=up]>.c7c17b6b2378b2ee__content:first-child{padding-top:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-top))}._882277c289298491__popup[data-swipe-direction=down]>.c7c17b6b2378b2ee__content:last-child{padding-bottom:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-bottom))}}'));
|
|
21
|
+
document.head.appendChild(style);
|
|
22
|
+
}
|
|
23
|
+
var style_default = { "popup": "_882277c289298491__popup", "backdrop": "_07e459cfa0254522__backdrop", "viewport": "f1cf22f966cf516e__viewport", "is-small": "e758b2a0572e1951__is-small", "is-medium": "_21ddafd99d004b84__is-medium", "is-large": "_78636e3fdcb75c3b__is-large", "is-stretch": "b2960a80aa46d1f9__is-stretch", "is-auto": "_949cc180111d609b__is-auto", "header": "e84af91dc76cf84f__header f1c50237c4787636__header", "footer": "_1136b31b67a81245__footer _579f95efdec92a66__footer", "title": "_0dab095165fca096__title _5371cc08aad82574__title", "content": "c7c17b6b2378b2ee__content _766d9011d37ce2d9__content" };
|
|
24
|
+
|
|
25
|
+
// packages/ui/src/drawer/popup.tsx
|
|
26
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
27
|
+
var ThemeProvider = unlock(themePrivateApis).ThemeProvider;
|
|
28
|
+
var CLOSE_ICON_ATTR = "data-wp-ui-drawer-close-icon";
|
|
29
|
+
var Popup = forwardRef(function DrawerPopup({ className, portal, children, size, initialFocus, finalFocus, ...props }, ref) {
|
|
30
|
+
const { resolvedInitialFocus, popupRef } = useDeprioritizedInitialFocus({
|
|
31
|
+
initialFocus,
|
|
32
|
+
deprioritizedAttributes: [CLOSE_ICON_ATTR, SCROLL_CONTAINER_ATTR]
|
|
33
|
+
});
|
|
34
|
+
const mergedRef = useMergeRefs([ref, popupRef]);
|
|
35
|
+
const modal = useDrawerModal();
|
|
36
|
+
const portalChildren = /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
37
|
+
modal === true && /* @__PURE__ */ jsx(
|
|
38
|
+
_Drawer.Backdrop,
|
|
39
|
+
{
|
|
40
|
+
className: style_default.backdrop,
|
|
41
|
+
"data-testid": "drawer-backdrop"
|
|
42
|
+
}
|
|
43
|
+
),
|
|
44
|
+
/* @__PURE__ */ jsx(_Drawer.Viewport, { className: style_default.viewport, children: /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(
|
|
45
|
+
_Drawer.Popup,
|
|
46
|
+
{
|
|
47
|
+
ref: mergedRef,
|
|
48
|
+
className: (state) => {
|
|
49
|
+
const isVertical = state.swipeDirection === "up" || state.swipeDirection === "down";
|
|
50
|
+
const resolvedSize = size ?? (isVertical ? "auto" : "medium");
|
|
51
|
+
return clsx(
|
|
52
|
+
style_default.popup,
|
|
53
|
+
className,
|
|
54
|
+
style_default[`is-${resolvedSize}`]
|
|
55
|
+
);
|
|
56
|
+
},
|
|
57
|
+
initialFocus: resolvedInitialFocus,
|
|
58
|
+
finalFocus,
|
|
59
|
+
...props,
|
|
60
|
+
"data-wp-ui-overlay-modal": modal === true ? "" : void 0,
|
|
61
|
+
children: /* @__PURE__ */ jsx(DrawerValidationProvider, { children })
|
|
62
|
+
}
|
|
63
|
+
) }) })
|
|
64
|
+
] });
|
|
65
|
+
return renderPortalWithChildren(portal, /* @__PURE__ */ jsx(Portal, {}), portalChildren);
|
|
66
|
+
});
|
|
67
|
+
export {
|
|
68
|
+
Popup
|
|
69
|
+
};
|
|
70
|
+
//# sourceMappingURL=popup.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/drawer/popup.tsx", "../../src/drawer/style.module.css"],
|
|
4
|
+
"sourcesContent": ["import { Drawer as _Drawer } from '@base-ui/react/drawer';\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 { renderPortalWithChildren } from '../utils/render-portal-with-children';\nimport { DrawerValidationProvider, useDrawerModal } 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-drawer-close-icon';\n\n/**\n * Renders the drawer popup element that contains the drawer content.\n * Uses a portal to render outside the DOM hierarchy.\n *\n * When `portal` is omitted, defaults to `Drawer.Portal`. Portal merging is\n * handled by `renderPortalWithChildren` (shared with other overlay `Popup`s).\n *\n * The popup is a flex column; scroll ownership lives on `Drawer.Content`,\n * which children are expected to render. Without it, long body content will\n * clip instead of scrolling and Base UI's swipe-dismiss-on-scroll-edge\n * logic on up/down drawers cannot engage.\n */\nconst Popup = forwardRef< HTMLDivElement, PopupProps >( function DrawerPopup(\n\t{ className, portal, children, size, initialFocus, finalFocus, ...props },\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 = useDrawerModal();\n\n\tconst portalChildren = (\n\t\t<>\n\t\t\t{ /*\n\t\t\t * Only render a backdrop for fully modal drawers. Non-modal drawers\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<_Drawer.Backdrop\n\t\t\t\t\tclassName={ styles.backdrop }\n\t\t\t\t\tdata-testid=\"drawer-backdrop\"\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<_Drawer.Viewport className={ styles.viewport }>\n\t\t\t\t{ /*\n\t\t\t\t * ThemeProvider wraps _Drawer.Popup directly (matching Dialog\n\t\t\t\t * and Popover) so the `display: contents` focus-trap workaround\n\t\t\t\t * selector in the CSS module actually targets this subtree.\n\t\t\t\t */ }\n\t\t\t\t<ThemeProvider>\n\t\t\t\t\t<_Drawer.Popup\n\t\t\t\t\t\tref={ mergedRef }\n\t\t\t\t\t\tclassName={ ( state ) => {\n\t\t\t\t\t\t\tconst isVertical =\n\t\t\t\t\t\t\t\tstate.swipeDirection === 'up' ||\n\t\t\t\t\t\t\t\tstate.swipeDirection === 'down';\n\t\t\t\t\t\t\tconst resolvedSize =\n\t\t\t\t\t\t\t\tsize ?? ( isVertical ? 'auto' : 'medium' );\n\n\t\t\t\t\t\t\treturn clsx(\n\t\t\t\t\t\t\t\tstyles.popup,\n\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\tstyles[ `is-${ resolvedSize }` ]\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tinitialFocus={ resolvedInitialFocus }\n\t\t\t\t\t\tfinalFocus={ finalFocus }\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\tdata-wp-ui-overlay-modal={\n\t\t\t\t\t\t\tmodal === true ? '' : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DrawerValidationProvider>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</DrawerValidationProvider>\n\t\t\t\t\t</_Drawer.Popup>\n\t\t\t\t</ThemeProvider>\n\t\t\t</_Drawer.Viewport>\n\t\t</>\n\t);\n\n\treturn renderPortalWithChildren( portal, <Portal />, portalChildren );\n} );\n\nexport { Popup };\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='7b0e336948']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"7b0e336948\");\n\tstyle.appendChild(document.createTextNode(\"@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{padding-inline:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header:first-child{padding-block-start:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer{padding-inline:0}._766d9011d37ce2d9__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;[data-wpds-theme-provider-id]:has(>._882277c289298491__popup){display:block}@layer wp-ui-components{._07e459cfa0254522__backdrop{--backdrop-opacity:0.35;background-color:#000;inset:0;min-height:100dvh;opacity:calc(var(--backdrop-opacity)*(1 - var(--drawer-swipe-progress)));position:fixed;z-index:var(--wp-ui-drawer-z-index,initial);@supports (-webkit-touch-callout:none){position:absolute}&[data-ending-style],&[data-starting-style]{opacity:0}@media not (prefers-reduced-motion){transition:opacity .45s cubic-bezier(.32,.72,0,1);&[data-ending-style]{pointer-events:none;transition-duration:calc(var(--drawer-swipe-strength)*.4s)}&[data-swiping]{transition-duration:0ms}}}.f1cf22f966cf516e__viewport{inset:0;pointer-events:none;position:fixed;z-index:var(--wp-ui-drawer-z-index,initial)}._882277c289298491__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);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);line-height:var(--wpds-typography-line-height-md,24px);outline:0;overflow:hidden;pointer-events:auto;position:fixed;touch-action:auto;z-index:var(--wp-ui-drawer-z-index,initial);&[data-open],&[data-swiping]{will-change:transform;@media not (prefers-reduced-motion){transition:transform .45s cubic-bezier(.32,.72,0,1);&[data-ending-style]{transition-duration:calc(var(--drawer-swipe-strength)*.4s)}&[data-swiping]{transition-duration:0ms}}}&.e758b2a0572e1951__is-small{--popup-size:var(--wpds-dimension-surface-width-sm,320px)}&._21ddafd99d004b84__is-medium{--popup-size:var(--wpds-dimension-surface-width-md,400px)}&._78636e3fdcb75c3b__is-large{--popup-size:var(--wpds-dimension-surface-width-lg,560px)}&.b2960a80aa46d1f9__is-stretch{--popup-size:var(--stretch-size)}&._949cc180111d609b__is-auto{--popup-size:auto}&[data-swiping]{user-select:none}&[data-swipe-direction=left]{--stretch-size:calc(100vw - var(--viewport-inset));border-end-end-radius:var(--wpds-border-radius-lg,8px);border-start-end-radius:var(--wpds-border-radius-lg,8px);bottom:0;left:0;max-width:calc(100vw - var(--viewport-inset));top:0;transform:translateX(var(--drawer-swipe-movement-x));width:var(--popup-size);&[data-ending-style],&[data-starting-style]{transform:translateX(-100%)}}&[data-swipe-direction=right]{--stretch-size:calc(100vw - var(--viewport-inset));border-end-start-radius:var(--wpds-border-radius-lg,8px);border-start-start-radius:var(--wpds-border-radius-lg,8px);bottom:0;max-width:calc(100vw - var(--viewport-inset));right:0;top:0;transform:translateX(var(--drawer-swipe-movement-x));width:var(--popup-size);&[data-ending-style],&[data-starting-style]{transform:translateX(100%)}}&[data-swipe-direction=down]{--stretch-size:calc(100dvh - var(--viewport-inset));border-start-end-radius:var(--wpds-border-radius-lg,8px);border-start-start-radius:var(--wpds-border-radius-lg,8px);bottom:0;height:var(--popup-size);left:0;max-height:calc(100dvh - var(--viewport-inset));right:0;transform:translateY(var(--drawer-swipe-movement-y));&[data-ending-style],&[data-starting-style]{transform:translateY(100%)}}&[data-swipe-direction=up]{--stretch-size:calc(100dvh - var(--viewport-inset));border-end-end-radius:var(--wpds-border-radius-lg,8px);border-end-start-radius:var(--wpds-border-radius-lg,8px);height:var(--popup-size);left:0;max-height:calc(100dvh - var(--viewport-inset));right:0;top:0;transform:translateY(var(--drawer-swipe-movement-y));&[data-ending-style],&[data-starting-style]{transform:translateY(-100%)}}}._07e459cfa0254522__backdrop~* ._882277c289298491__popup{border-color:#0000}@media (forced-colors:active){._07e459cfa0254522__backdrop~* ._882277c289298491__popup,._882277c289298491__popup{border-color:CanvasText}}.e84af91dc76cf84f__header [data-wp-ui-drawer-close-icon]{margin-inline-start:auto}._882277c289298491__popup[data-swipe-direction=left] .c7c17b6b2378b2ee__content{padding-left:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-left))}._882277c289298491__popup[data-swipe-direction=right] .c7c17b6b2378b2ee__content{padding-right:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-right))}._882277c289298491__popup[data-swipe-direction=up]>.e84af91dc76cf84f__header{padding-top:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-top))}._882277c289298491__popup[data-swipe-direction=down]>._1136b31b67a81245__footer{padding-bottom:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-bottom))}._882277c289298491__popup[data-swipe-direction=up]>.c7c17b6b2378b2ee__content:first-child{padding-top:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-top))}._882277c289298491__popup[data-swipe-direction=down]>.c7c17b6b2378b2ee__content:last-child{padding-bottom:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-bottom))}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"popup\":\"_882277c289298491__popup\",\"backdrop\":\"_07e459cfa0254522__backdrop\",\"viewport\":\"f1cf22f966cf516e__viewport\",\"is-small\":\"e758b2a0572e1951__is-small\",\"is-medium\":\"_21ddafd99d004b84__is-medium\",\"is-large\":\"_78636e3fdcb75c3b__is-large\",\"is-stretch\":\"b2960a80aa46d1f9__is-stretch\",\"is-auto\":\"_949cc180111d609b__is-auto\",\"header\":\"e84af91dc76cf84f__header f1c50237c4787636__header\",\"footer\":\"_1136b31b67a81245__footer _579f95efdec92a66__footer\",\"title\":\"_0dab095165fca096__title _5371cc08aad82574__title\",\"content\":\"c7c17b6b2378b2ee__content _766d9011d37ce2d9__content\"};\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,6BAA6B;AACtC,SAAS,gCAAgC;AACzC,SAAS,0BAA0B,sBAAsB;AACzD,SAAS,cAAc;;;ACbvB,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,05OAAs6O,CAAC;AACj9O,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,SAAQ,4BAA2B,YAAW,+BAA8B,YAAW,8BAA6B,YAAW,8BAA6B,aAAY,gCAA+B,YAAW,+BAA8B,cAAa,gCAA+B,WAAU,8BAA6B,UAAS,qDAAoD,UAAS,uDAAsD,SAAQ,qDAAoD,WAAU,uDAAsD;;;ADwCzkB,mBAOE,KAPF;AA7BF,IAAM,gBACL,OAAQ,gBAAiB,EAAE;AAE5B,IAAM,kBAAkB;AAcxB,IAAM,QAAQ,WAA0C,SAAS,YAChE,EAAE,WAAW,QAAQ,UAAU,MAAM,cAAc,YAAY,GAAG,MAAM,GACxE,KACC;AACD,QAAM,EAAE,sBAAsB,SAAS,IAAI,6BAA8B;AAAA,IACxE;AAAA,IACA,yBAAyB,CAAE,iBAAiB,qBAAsB;AAAA,EACnE,CAAE;AACF,QAAM,YAAY,aAAc,CAAE,KAAK,QAAS,CAAE;AAClD,QAAM,QAAQ,eAAe;AAE7B,QAAM,iBACL,iCAMG;AAAA,cAAU,QACX;AAAA,MAAC,QAAQ;AAAA,MAAR;AAAA,QACA,WAAY,cAAO;AAAA,QACnB,eAAY;AAAA;AAAA,IACb;AAAA,IAED,oBAAC,QAAQ,UAAR,EAAiB,WAAY,cAAO,UAMpC,8BAAC,iBACA;AAAA,MAAC,QAAQ;AAAA,MAAR;AAAA,QACA,KAAM;AAAA,QACN,WAAY,CAAE,UAAW;AACxB,gBAAM,aACL,MAAM,mBAAmB,QACzB,MAAM,mBAAmB;AAC1B,gBAAM,eACL,SAAU,aAAa,SAAS;AAEjC,iBAAO;AAAA,YACN,cAAO;AAAA,YACP;AAAA,YACA,cAAQ,MAAO,YAAa,EAAG;AAAA,UAChC;AAAA,QACD;AAAA,QACA,cAAe;AAAA,QACf;AAAA,QACE,GAAG;AAAA,QACL,4BACC,UAAU,OAAO,KAAK;AAAA,QAGvB,8BAAC,4BACE,UACH;AAAA;AAAA,IACD,GACD,GACD;AAAA,KACD;AAGD,SAAO,yBAA0B,QAAQ,oBAAC,UAAO,GAAI,cAAe;AACrE,CAAE;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// packages/ui/src/drawer/portal.tsx
|
|
2
|
+
import { Drawer as _Drawer } from "@base-ui/react/drawer";
|
|
3
|
+
import { forwardRef } from "@wordpress/element";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
var Portal = forwardRef(
|
|
6
|
+
function DrawerPortal(props, ref) {
|
|
7
|
+
return /* @__PURE__ */ jsx(_Drawer.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/drawer/portal.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Drawer as _Drawer } from '@base-ui/react/drawer';\nimport { forwardRef } from '@wordpress/element';\nimport type { PortalProps } from './types';\n\n/**\n * Root element that portals `Drawer` overlay content (`Backdrop`, `Viewport`\n * with the inner `Popup`, etc.) outside the DOM hierarchy. Pass to\n * `Drawer.Popup`'s `portal` prop to customize `container`, `className`,\n * `style`, and other Base UI portal options. When `portal` is omitted,\n * `Drawer.Popup` uses this component with default props.\n */\nconst Portal = forwardRef< HTMLDivElement, PortalProps >(\n\tfunction DrawerPortal( props, ref ) {\n\t\treturn <_Drawer.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
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
// packages/ui/src/drawer/root.tsx
|
|
2
|
+
import { Drawer as _Drawer } from "@base-ui/react/drawer";
|
|
3
|
+
import { DrawerModalProvider } from "./context.mjs";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
function Root({
|
|
6
|
+
modal = true,
|
|
7
|
+
swipeDirection = "left",
|
|
8
|
+
children,
|
|
9
|
+
...props
|
|
10
|
+
}) {
|
|
11
|
+
return /* @__PURE__ */ jsx(
|
|
12
|
+
_Drawer.Root,
|
|
13
|
+
{
|
|
14
|
+
modal,
|
|
15
|
+
swipeDirection,
|
|
16
|
+
...props,
|
|
17
|
+
children: /* @__PURE__ */ jsx(DrawerModalProvider, { modal, children })
|
|
18
|
+
}
|
|
19
|
+
);
|
|
20
|
+
}
|
|
21
|
+
export {
|
|
22
|
+
Root
|
|
23
|
+
};
|
|
24
|
+
//# sourceMappingURL=root.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/drawer/root.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Drawer as _Drawer } from '@base-ui/react/drawer';\nimport { DrawerModalProvider } from './context';\nimport type { RootProps } from './types';\n\n/**\n * An ARIA-compliant drawer that slides in from a viewport edge, with\n * swipe-to-dismiss gestures.\n *\n * Every drawer must include a `Drawer.Title` component for accessibility \u2014 it\n * serves as both the visible heading and the accessible label for the drawer.\n *\n * Always include a visible close affordance, either `Drawer.CloseIcon` or a\n * clear dismissing action button. If your drawer has a \"Cancel\" button in the\n * footer, the close icon may be redundant and create confusion about what\n * clicking \"X\" means.\n *\n * Use `Drawer.CloseIcon` for informational drawers where dismissing is safe\n * and expected. For drawers requiring explicit user choice (especially\n * destructive actions), omit the close icon and rely on footer action buttons\n * like \"Cancel\" and \"Confirm\" instead.\n */\nfunction Root( {\n\tmodal = true,\n\tswipeDirection = 'left',\n\tchildren,\n\t...props\n}: RootProps ) {\n\treturn (\n\t\t<_Drawer.Root\n\t\t\tmodal={ modal }\n\t\t\tswipeDirection={ swipeDirection }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t<DrawerModalProvider modal={ modal }>\n\t\t\t\t{ children }\n\t\t\t</DrawerModalProvider>\n\t\t</_Drawer.Root>\n\t);\n}\n\nexport { Root };\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,2BAA2B;AAgCjC;AAZH,SAAS,KAAM;AAAA,EACd,QAAQ;AAAA,EACR,iBAAiB;AAAA,EACjB;AAAA,EACA,GAAG;AACJ,GAAe;AACd,SACC;AAAA,IAAC,QAAQ;AAAA,IAAR;AAAA,MACA;AAAA,MACA;AAAA,MACE,GAAG;AAAA,MAEL,8BAAC,uBAAoB,OAClB,UACH;AAAA;AAAA,EACD;AAEF;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
// packages/ui/src/drawer/title.tsx
|
|
2
|
+
import { Drawer as _Drawer } from "@base-ui/react/drawer";
|
|
3
|
+
import { useMergeRefs } from "@wordpress/compose";
|
|
4
|
+
import { forwardRef, useEffect, useRef } from "@wordpress/element";
|
|
5
|
+
import { Text } from "../text/index.mjs";
|
|
6
|
+
import { useDrawerValidationContext } from "./context.mjs";
|
|
7
|
+
|
|
8
|
+
// packages/ui/src/drawer/style.module.css
|
|
9
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='7b0e336948']")) {
|
|
10
|
+
const style = document.createElement("style");
|
|
11
|
+
style.setAttribute("data-wp-hash", "7b0e336948");
|
|
12
|
+
style.appendChild(document.createTextNode('@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{padding-inline:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header:first-child{padding-block-start:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer{padding-inline:0}._766d9011d37ce2d9__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;[data-wpds-theme-provider-id]:has(>._882277c289298491__popup){display:block}@layer wp-ui-components{._07e459cfa0254522__backdrop{--backdrop-opacity:0.35;background-color:#000;inset:0;min-height:100dvh;opacity:calc(var(--backdrop-opacity)*(1 - var(--drawer-swipe-progress)));position:fixed;z-index:var(--wp-ui-drawer-z-index,initial);@supports (-webkit-touch-callout:none){position:absolute}&[data-ending-style],&[data-starting-style]{opacity:0}@media not (prefers-reduced-motion){transition:opacity .45s cubic-bezier(.32,.72,0,1);&[data-ending-style]{pointer-events:none;transition-duration:calc(var(--drawer-swipe-strength)*.4s)}&[data-swiping]{transition-duration:0ms}}}.f1cf22f966cf516e__viewport{inset:0;pointer-events:none;position:fixed;z-index:var(--wp-ui-drawer-z-index,initial)}._882277c289298491__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);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);line-height:var(--wpds-typography-line-height-md,24px);outline:0;overflow:hidden;pointer-events:auto;position:fixed;touch-action:auto;z-index:var(--wp-ui-drawer-z-index,initial);&[data-open],&[data-swiping]{will-change:transform;@media not (prefers-reduced-motion){transition:transform .45s cubic-bezier(.32,.72,0,1);&[data-ending-style]{transition-duration:calc(var(--drawer-swipe-strength)*.4s)}&[data-swiping]{transition-duration:0ms}}}&.e758b2a0572e1951__is-small{--popup-size:var(--wpds-dimension-surface-width-sm,320px)}&._21ddafd99d004b84__is-medium{--popup-size:var(--wpds-dimension-surface-width-md,400px)}&._78636e3fdcb75c3b__is-large{--popup-size:var(--wpds-dimension-surface-width-lg,560px)}&.b2960a80aa46d1f9__is-stretch{--popup-size:var(--stretch-size)}&._949cc180111d609b__is-auto{--popup-size:auto}&[data-swiping]{user-select:none}&[data-swipe-direction=left]{--stretch-size:calc(100vw - var(--viewport-inset));border-end-end-radius:var(--wpds-border-radius-lg,8px);border-start-end-radius:var(--wpds-border-radius-lg,8px);bottom:0;left:0;max-width:calc(100vw - var(--viewport-inset));top:0;transform:translateX(var(--drawer-swipe-movement-x));width:var(--popup-size);&[data-ending-style],&[data-starting-style]{transform:translateX(-100%)}}&[data-swipe-direction=right]{--stretch-size:calc(100vw - var(--viewport-inset));border-end-start-radius:var(--wpds-border-radius-lg,8px);border-start-start-radius:var(--wpds-border-radius-lg,8px);bottom:0;max-width:calc(100vw - var(--viewport-inset));right:0;top:0;transform:translateX(var(--drawer-swipe-movement-x));width:var(--popup-size);&[data-ending-style],&[data-starting-style]{transform:translateX(100%)}}&[data-swipe-direction=down]{--stretch-size:calc(100dvh - var(--viewport-inset));border-start-end-radius:var(--wpds-border-radius-lg,8px);border-start-start-radius:var(--wpds-border-radius-lg,8px);bottom:0;height:var(--popup-size);left:0;max-height:calc(100dvh - var(--viewport-inset));right:0;transform:translateY(var(--drawer-swipe-movement-y));&[data-ending-style],&[data-starting-style]{transform:translateY(100%)}}&[data-swipe-direction=up]{--stretch-size:calc(100dvh - var(--viewport-inset));border-end-end-radius:var(--wpds-border-radius-lg,8px);border-end-start-radius:var(--wpds-border-radius-lg,8px);height:var(--popup-size);left:0;max-height:calc(100dvh - var(--viewport-inset));right:0;top:0;transform:translateY(var(--drawer-swipe-movement-y));&[data-ending-style],&[data-starting-style]{transform:translateY(-100%)}}}._07e459cfa0254522__backdrop~* ._882277c289298491__popup{border-color:#0000}@media (forced-colors:active){._07e459cfa0254522__backdrop~* ._882277c289298491__popup,._882277c289298491__popup{border-color:CanvasText}}.e84af91dc76cf84f__header [data-wp-ui-drawer-close-icon]{margin-inline-start:auto}._882277c289298491__popup[data-swipe-direction=left] .c7c17b6b2378b2ee__content{padding-left:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-left))}._882277c289298491__popup[data-swipe-direction=right] .c7c17b6b2378b2ee__content{padding-right:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-right))}._882277c289298491__popup[data-swipe-direction=up]>.e84af91dc76cf84f__header{padding-top:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-top))}._882277c289298491__popup[data-swipe-direction=down]>._1136b31b67a81245__footer{padding-bottom:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-bottom))}._882277c289298491__popup[data-swipe-direction=up]>.c7c17b6b2378b2ee__content:first-child{padding-top:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-top))}._882277c289298491__popup[data-swipe-direction=down]>.c7c17b6b2378b2ee__content:last-child{padding-bottom:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-bottom))}}'));
|
|
13
|
+
document.head.appendChild(style);
|
|
14
|
+
}
|
|
15
|
+
var style_default = { "popup": "_882277c289298491__popup", "backdrop": "_07e459cfa0254522__backdrop", "viewport": "f1cf22f966cf516e__viewport", "is-small": "e758b2a0572e1951__is-small", "is-medium": "_21ddafd99d004b84__is-medium", "is-large": "_78636e3fdcb75c3b__is-large", "is-stretch": "b2960a80aa46d1f9__is-stretch", "is-auto": "_949cc180111d609b__is-auto", "header": "e84af91dc76cf84f__header f1c50237c4787636__header", "footer": "_1136b31b67a81245__footer _579f95efdec92a66__footer", "title": "_0dab095165fca096__title _5371cc08aad82574__title", "content": "c7c17b6b2378b2ee__content _766d9011d37ce2d9__content" };
|
|
16
|
+
|
|
17
|
+
// packages/ui/src/drawer/title.tsx
|
|
18
|
+
import { jsx } from "react/jsx-runtime";
|
|
19
|
+
var Title = forwardRef(
|
|
20
|
+
function DrawerTitle({ children, ...props }, forwardedRef) {
|
|
21
|
+
const validationContext = useDrawerValidationContext();
|
|
22
|
+
const internalRef = useRef(null);
|
|
23
|
+
const mergedRef = useMergeRefs([internalRef, forwardedRef]);
|
|
24
|
+
useEffect(() => {
|
|
25
|
+
if (validationContext) {
|
|
26
|
+
return validationContext.registerTitle(internalRef.current);
|
|
27
|
+
}
|
|
28
|
+
return void 0;
|
|
29
|
+
}, [validationContext]);
|
|
30
|
+
return /* @__PURE__ */ jsx(
|
|
31
|
+
Text,
|
|
32
|
+
{
|
|
33
|
+
ref: mergedRef,
|
|
34
|
+
variant: "heading-xl",
|
|
35
|
+
render: /* @__PURE__ */ jsx(_Drawer.Title, { ...props }),
|
|
36
|
+
className: style_default.title,
|
|
37
|
+
children
|
|
38
|
+
}
|
|
39
|
+
);
|
|
40
|
+
}
|
|
41
|
+
);
|
|
42
|
+
export {
|
|
43
|
+
Title
|
|
44
|
+
};
|
|
45
|
+
//# sourceMappingURL=title.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/drawer/title.tsx", "../../src/drawer/style.module.css"],
|
|
4
|
+
"sourcesContent": ["import { Drawer as _Drawer } from '@base-ui/react/drawer';\nimport { useMergeRefs } from '@wordpress/compose';\nimport { forwardRef, useEffect, useRef } from '@wordpress/element';\nimport { Text } from '../text';\nimport { useDrawerValidationContext } from './context';\nimport styles from './style.module.css';\nimport type { TitleProps } from './types';\n\n/**\n * Renders the drawer title. This component is required for accessibility\n * and serves as both the visible heading and the accessible label for\n * the drawer.\n *\n * **Required** \u2014 every drawer must include a `Drawer.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={ <Drawer.Title /> }>\n * Accessible title text\n * </VisuallyHidden>\n * ```\n */\nconst Title = forwardRef< HTMLHeadingElement, TitleProps >(\n\tfunction DrawerTitle( { children, ...props }, forwardedRef ) {\n\t\tconst validationContext = useDrawerValidationContext();\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={ <_Drawer.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='7b0e336948']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"7b0e336948\");\n\tstyle.appendChild(document.createTextNode(\"@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{padding-inline:0}._766d9011d37ce2d9__content>.f1c50237c4787636__header:first-child{padding-block-start:0}._766d9011d37ce2d9__content>._579f95efdec92a66__footer{padding-inline:0}._766d9011d37ce2d9__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;[data-wpds-theme-provider-id]:has(>._882277c289298491__popup){display:block}@layer wp-ui-components{._07e459cfa0254522__backdrop{--backdrop-opacity:0.35;background-color:#000;inset:0;min-height:100dvh;opacity:calc(var(--backdrop-opacity)*(1 - var(--drawer-swipe-progress)));position:fixed;z-index:var(--wp-ui-drawer-z-index,initial);@supports (-webkit-touch-callout:none){position:absolute}&[data-ending-style],&[data-starting-style]{opacity:0}@media not (prefers-reduced-motion){transition:opacity .45s cubic-bezier(.32,.72,0,1);&[data-ending-style]{pointer-events:none;transition-duration:calc(var(--drawer-swipe-strength)*.4s)}&[data-swiping]{transition-duration:0ms}}}.f1cf22f966cf516e__viewport{inset:0;pointer-events:none;position:fixed;z-index:var(--wp-ui-drawer-z-index,initial)}._882277c289298491__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);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);line-height:var(--wpds-typography-line-height-md,24px);outline:0;overflow:hidden;pointer-events:auto;position:fixed;touch-action:auto;z-index:var(--wp-ui-drawer-z-index,initial);&[data-open],&[data-swiping]{will-change:transform;@media not (prefers-reduced-motion){transition:transform .45s cubic-bezier(.32,.72,0,1);&[data-ending-style]{transition-duration:calc(var(--drawer-swipe-strength)*.4s)}&[data-swiping]{transition-duration:0ms}}}&.e758b2a0572e1951__is-small{--popup-size:var(--wpds-dimension-surface-width-sm,320px)}&._21ddafd99d004b84__is-medium{--popup-size:var(--wpds-dimension-surface-width-md,400px)}&._78636e3fdcb75c3b__is-large{--popup-size:var(--wpds-dimension-surface-width-lg,560px)}&.b2960a80aa46d1f9__is-stretch{--popup-size:var(--stretch-size)}&._949cc180111d609b__is-auto{--popup-size:auto}&[data-swiping]{user-select:none}&[data-swipe-direction=left]{--stretch-size:calc(100vw - var(--viewport-inset));border-end-end-radius:var(--wpds-border-radius-lg,8px);border-start-end-radius:var(--wpds-border-radius-lg,8px);bottom:0;left:0;max-width:calc(100vw - var(--viewport-inset));top:0;transform:translateX(var(--drawer-swipe-movement-x));width:var(--popup-size);&[data-ending-style],&[data-starting-style]{transform:translateX(-100%)}}&[data-swipe-direction=right]{--stretch-size:calc(100vw - var(--viewport-inset));border-end-start-radius:var(--wpds-border-radius-lg,8px);border-start-start-radius:var(--wpds-border-radius-lg,8px);bottom:0;max-width:calc(100vw - var(--viewport-inset));right:0;top:0;transform:translateX(var(--drawer-swipe-movement-x));width:var(--popup-size);&[data-ending-style],&[data-starting-style]{transform:translateX(100%)}}&[data-swipe-direction=down]{--stretch-size:calc(100dvh - var(--viewport-inset));border-start-end-radius:var(--wpds-border-radius-lg,8px);border-start-start-radius:var(--wpds-border-radius-lg,8px);bottom:0;height:var(--popup-size);left:0;max-height:calc(100dvh - var(--viewport-inset));right:0;transform:translateY(var(--drawer-swipe-movement-y));&[data-ending-style],&[data-starting-style]{transform:translateY(100%)}}&[data-swipe-direction=up]{--stretch-size:calc(100dvh - var(--viewport-inset));border-end-end-radius:var(--wpds-border-radius-lg,8px);border-end-start-radius:var(--wpds-border-radius-lg,8px);height:var(--popup-size);left:0;max-height:calc(100dvh - var(--viewport-inset));right:0;top:0;transform:translateY(var(--drawer-swipe-movement-y));&[data-ending-style],&[data-starting-style]{transform:translateY(-100%)}}}._07e459cfa0254522__backdrop~* ._882277c289298491__popup{border-color:#0000}@media (forced-colors:active){._07e459cfa0254522__backdrop~* ._882277c289298491__popup,._882277c289298491__popup{border-color:CanvasText}}.e84af91dc76cf84f__header [data-wp-ui-drawer-close-icon]{margin-inline-start:auto}._882277c289298491__popup[data-swipe-direction=left] .c7c17b6b2378b2ee__content{padding-left:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-left))}._882277c289298491__popup[data-swipe-direction=right] .c7c17b6b2378b2ee__content{padding-right:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-right))}._882277c289298491__popup[data-swipe-direction=up]>.e84af91dc76cf84f__header{padding-top:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-top))}._882277c289298491__popup[data-swipe-direction=down]>._1136b31b67a81245__footer{padding-bottom:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-bottom))}._882277c289298491__popup[data-swipe-direction=up]>.c7c17b6b2378b2ee__content:first-child{padding-top:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-top))}._882277c289298491__popup[data-swipe-direction=down]>.c7c17b6b2378b2ee__content:last-child{padding-bottom:max(var(--wpds-dimension-padding-2xl,24px),env(safe-area-inset-bottom))}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"popup\":\"_882277c289298491__popup\",\"backdrop\":\"_07e459cfa0254522__backdrop\",\"viewport\":\"f1cf22f966cf516e__viewport\",\"is-small\":\"e758b2a0572e1951__is-small\",\"is-medium\":\"_21ddafd99d004b84__is-medium\",\"is-large\":\"_78636e3fdcb75c3b__is-large\",\"is-stretch\":\"b2960a80aa46d1f9__is-stretch\",\"is-auto\":\"_949cc180111d609b__is-auto\",\"header\":\"e84af91dc76cf84f__header f1c50237c4787636__header\",\"footer\":\"_1136b31b67a81245__footer _579f95efdec92a66__footer\",\"title\":\"_0dab095165fca096__title _5371cc08aad82574__title\",\"content\":\"c7c17b6b2378b2ee__content _766d9011d37ce2d9__content\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,oBAAoB;AAC7B,SAAS,YAAY,WAAW,cAAc;AAC9C,SAAS,YAAY;AACrB,SAAS,kCAAkC;;;ACJ3C,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,05OAAs6O,CAAC;AACj9O,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,SAAQ,4BAA2B,YAAW,+BAA8B,YAAW,8BAA6B,YAAW,8BAA6B,aAAY,gCAA+B,YAAW,+BAA8B,cAAa,gCAA+B,WAAU,8BAA6B,UAAS,qDAAoD,UAAS,uDAAsD,SAAQ,qDAAoD,WAAU,uDAAsD;;;ADqC9jB;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
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// packages/ui/src/drawer/trigger.tsx
|
|
2
|
+
import { Drawer as _Drawer } from "@base-ui/react/drawer";
|
|
3
|
+
import { forwardRef } from "@wordpress/element";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
var Trigger = forwardRef(
|
|
6
|
+
function DrawerTrigger(props, ref) {
|
|
7
|
+
return /* @__PURE__ */ jsx(_Drawer.Trigger, { ref, ...props });
|
|
8
|
+
}
|
|
9
|
+
);
|
|
10
|
+
export {
|
|
11
|
+
Trigger
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=trigger.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/drawer/trigger.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Drawer as _Drawer } from '@base-ui/react/drawer';\nimport { forwardRef } from '@wordpress/element';\nimport type { TriggerProps } from './types';\n\n/**\n * Renders a button that opens the drawer popup when clicked.\n */\nconst Trigger = forwardRef< HTMLButtonElement, TriggerProps >(\n\tfunction DrawerTrigger( props, ref ) {\n\t\treturn <_Drawer.Trigger ref={ ref } { ...props } />;\n\t}\n);\n\nexport { Trigger };\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,kBAAkB;AAQlB;AAFT,IAAM,UAAU;AAAA,EACf,SAAS,cAAe,OAAO,KAAM;AACpC,WAAO,oBAAC,QAAQ,SAAR,EAAgB,KAAc,GAAG,OAAQ;AAAA,EAClD;AACD;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=types.mjs.map
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
// packages/ui/src/form/primitives/autocomplete/clear.tsx
|
|
2
|
+
import { Autocomplete as _Autocomplete } from "@base-ui/react/autocomplete";
|
|
3
|
+
import { forwardRef } from "@wordpress/element";
|
|
4
|
+
import { closeSmall } from "@wordpress/icons";
|
|
5
|
+
import { __ } from "@wordpress/i18n";
|
|
6
|
+
import { IconButton } from "../../../icon-button/index.mjs";
|
|
7
|
+
import { jsx } from "react/jsx-runtime";
|
|
8
|
+
var DEFAULT_RENDER = ({
|
|
9
|
+
"aria-label": ariaLabel = __("Clear"),
|
|
10
|
+
...props
|
|
11
|
+
}) => /* @__PURE__ */ jsx(
|
|
12
|
+
IconButton,
|
|
13
|
+
{
|
|
14
|
+
icon: closeSmall,
|
|
15
|
+
size: "small",
|
|
16
|
+
variant: "minimal",
|
|
17
|
+
tone: "neutral",
|
|
18
|
+
label: ariaLabel,
|
|
19
|
+
...props
|
|
20
|
+
}
|
|
21
|
+
);
|
|
22
|
+
var Clear = forwardRef(
|
|
23
|
+
function Clear2({ render = DEFAULT_RENDER, ...restProps }, ref) {
|
|
24
|
+
return /* @__PURE__ */ jsx(
|
|
25
|
+
_Autocomplete.Clear,
|
|
26
|
+
{
|
|
27
|
+
ref,
|
|
28
|
+
render,
|
|
29
|
+
...restProps
|
|
30
|
+
}
|
|
31
|
+
);
|
|
32
|
+
}
|
|
33
|
+
);
|
|
34
|
+
export {
|
|
35
|
+
Clear
|
|
36
|
+
};
|
|
37
|
+
//# sourceMappingURL=clear.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/form/primitives/autocomplete/clear.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Autocomplete as _Autocomplete } from '@base-ui/react/autocomplete';\nimport { forwardRef } from '@wordpress/element';\nimport { closeSmall } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\nimport { IconButton } from '../../../icon-button';\nimport type { AutocompleteClearProps } from './types';\n\nconst DEFAULT_RENDER = ( {\n\t'aria-label': ariaLabel = __( 'Clear' ),\n\t...props\n}: AutocompleteClearProps ) => (\n\t<IconButton\n\t\ticon={ closeSmall }\n\t\tsize=\"small\"\n\t\tvariant=\"minimal\"\n\t\ttone=\"neutral\"\n\t\tlabel={ ariaLabel }\n\t\t{ ...props }\n\t/>\n);\n\n/**\n * A button that clears the input value.\n */\nexport const Clear = forwardRef< HTMLButtonElement, AutocompleteClearProps >(\n\tfunction Clear( { render = DEFAULT_RENDER, ...restProps }, ref ) {\n\t\treturn (\n\t\t\t<_Autocomplete.Clear\n\t\t\t\tref={ ref }\n\t\t\t\trender={ render }\n\t\t\t\t{ ...restProps }\n\t\t\t/>\n\t\t);\n\t}\n);\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,gBAAgB,qBAAqB;AAC9C,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,UAAU;AACnB,SAAS,kBAAkB;AAO1B;AAJD,IAAM,iBAAiB,CAAE;AAAA,EACxB,cAAc,YAAY,GAAI,OAAQ;AAAA,EACtC,GAAG;AACJ,MACC;AAAA,EAAC;AAAA;AAAA,IACA,MAAO;AAAA,IACP,MAAK;AAAA,IACL,SAAQ;AAAA,IACR,MAAK;AAAA,IACL,OAAQ;AAAA,IACN,GAAG;AAAA;AACN;AAMM,IAAM,QAAQ;AAAA,EACpB,SAASA,OAAO,EAAE,SAAS,gBAAgB,GAAG,UAAU,GAAG,KAAM;AAChE,WACC;AAAA,MAAC,cAAc;AAAA,MAAd;AAAA,QACA;AAAA,QACA;AAAA,QACE,GAAG;AAAA;AAAA,IACN;AAAA,EAEF;AACD;",
|
|
6
|
+
"names": ["Clear"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// packages/ui/src/form/primitives/autocomplete/collection.tsx
|
|
2
|
+
import { Autocomplete as _Autocomplete } from "@base-ui/react/autocomplete";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
function Collection({
|
|
5
|
+
children,
|
|
6
|
+
...restProps
|
|
7
|
+
}) {
|
|
8
|
+
return /* @__PURE__ */ jsx(_Autocomplete.Collection, { ...restProps, children });
|
|
9
|
+
}
|
|
10
|
+
export {
|
|
11
|
+
Collection
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=collection.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/form/primitives/autocomplete/collection.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Autocomplete as _Autocomplete } from '@base-ui/react/autocomplete';\nimport type { AutocompleteCollectionProps } from './types';\n\nexport function Collection( {\n\tchildren,\n\t...restProps\n}: AutocompleteCollectionProps ) {\n\treturn (\n\t\t<_Autocomplete.Collection { ...restProps }>\n\t\t\t{ children }\n\t\t</_Autocomplete.Collection>\n\t);\n}\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,gBAAgB,qBAAqB;AAQ5C;AALK,SAAS,WAAY;AAAA,EAC3B;AAAA,EACA,GAAG;AACJ,GAAiC;AAChC,SACC,oBAAC,cAAc,YAAd,EAA2B,GAAG,WAC5B,UACH;AAEF;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
// packages/ui/src/form/primitives/autocomplete/empty.tsx
|
|
2
|
+
import { Autocomplete as _Autocomplete } from "@base-ui/react/autocomplete";
|
|
3
|
+
import clsx from "clsx";
|
|
4
|
+
import { forwardRef } from "@wordpress/element";
|
|
5
|
+
|
|
6
|
+
// packages/ui/src/utils/css/item-popup.module.css
|
|
7
|
+
if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='cdb73ecc03']")) {
|
|
8
|
+
const style = document.createElement("style");
|
|
9
|
+
style.setAttribute("data-wp-hash", "cdb73ecc03");
|
|
10
|
+
style.appendChild(document.createTextNode('@layer wp-ui-utilities{._380b81b8f79fb10f__dropdown-motion{--wp-ui-dropdown-slide-distance:4px;--wp-ui-dropdown-slide-duration:200ms;--wp-ui-dropdown-slide-easing:cubic-bezier(0,0,0,1);--wp-ui-dropdown-fade-duration:80ms;--wp-ui-dropdown-fade-easing:linear;@media not (prefers-reduced-motion){transition-duration:var(--wp-ui-dropdown-slide-duration),var(--wp-ui-dropdown-fade-duration);transition-property:transform,opacity;transition-timing-function:var(--wp-ui-dropdown-slide-easing),var(--wp-ui-dropdown-fade-easing);will-change:transform,opacity}opacity:0;&[data-side=bottom]{transform:translateY(calc(var(--wp-ui-dropdown-slide-distance)*-1))}&[data-side=top]{transform:translateY(var(--wp-ui-dropdown-slide-distance))}&[data-side=left]{transform:translateX(var(--wp-ui-dropdown-slide-distance))}&[data-side=right]{transform:translateX(calc(var(--wp-ui-dropdown-slide-distance)*-1))}&[data-open]:not([data-starting-style]){opacity:1;transform:translate(0)}}}@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._234b520016b4e56f__popup{--wp-ui-popup-padding:4px;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-md,4px);box-shadow:var(--wpds-elevation-md,0 2px 3px 0 #0000000d,0 4px 5px 0 #0000000a,0 12px 12px 0 #00000008,0 16px 16px 0 #00000005);color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);display:grid;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);grid-template-areas:"header" "main";grid-template-rows:auto minmax(0,1fr);line-height:1.4;max-height:min(var(--available-height),480px,60dvh);max-width:var(--available-width);min-width:var(--anchor-width)}.f43dc7c768d7b622__list{display:grid;grid-area:main;grid-template-areas:"scrollable" "footer";grid-template-rows:minmax(0,1fr) auto}._233cd60cdb84a2ef__list-scrollable-container{grid-area:scrollable;overflow-block:auto;overscroll-behavior:contain;scroll-padding-block:var(--wp-ui-popup-padding);&:not(:empty){padding-block:var(--wp-ui-popup-padding)}}.ec4db6f0122263e7__list-footer{grid-area:footer;padding-block:var(--wp-ui-popup-padding);._233cd60cdb84a2ef__list-scrollable-container:not(:empty)+&{border-block-start:var(--wpds-border-width-xs,1px) solid var(--wpds-color-stroke-surface-neutral,#dbdbdb)}}._684ccb7988365b4f__item{--wp-ui-popup-item-height:40px;--wp-ui-popup-item-padding-inline:12px;--wp-ui-popup-item-padding-block:4px;align-items:center;border-radius:var(--wpds-border-radius-sm,2px);cursor:var(--wpds-cursor-control,pointer);display:flex;gap:var(--wpds-dimension-gap-xs,4px);justify-content:flex-start;margin-inline:var(--wp-ui-popup-padding);min-height:var(--wp-ui-popup-item-height);padding-block:var(--wp-ui-popup-item-padding-block);padding-inline-end:var(--wp-ui-popup-item-padding-inline);padding-inline-start:calc(var(--wp-ui-popup-item-padding-inline) - 4px);user-select:none;&.f181b98b0d33282a__is-size-compact{--wp-ui-popup-item-height:32px;--wp-ui-popup-item-padding-inline:8px}&._38f7faff93c61958__is-size-small{--wp-ui-popup-item-height:24px;--wp-ui-popup-item-padding-inline:8px;--wp-ui-popup-item-padding-block:2px}&:not([data-selected]){._92fbe4765dfad5ee__item-indicator-icon{opacity:0}}&[data-highlighted]:not([aria-disabled=true]){background-color:var(--wpds-color-bg-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);@media (forced-colors:active){outline:1px solid Highlight}}&[aria-disabled=true]{color:var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d);@media (forced-colors:active){color:GrayText}}}._92fbe4765dfad5ee__item-indicator-icon{flex-shrink:0}._06c7ff39d2f685b9__empty:not(:empty){--wp-ui-popup-empty-min-height:40px;--wp-ui-popup-empty-padding-inline:12px;align-items:center;color:var(--wpds-color-fg-content-neutral-weak,#707070);display:flex;grid-area:main;min-height:var(--wp-ui-popup-empty-min-height);padding-inline:var(--wp-ui-popup-empty-padding-inline)}}'));
|
|
11
|
+
document.head.appendChild(style);
|
|
12
|
+
}
|
|
13
|
+
var item_popup_default = { "popup": "_234b520016b4e56f__popup _380b81b8f79fb10f__dropdown-motion", "list": "f43dc7c768d7b622__list", "list-scrollable-container": "_233cd60cdb84a2ef__list-scrollable-container", "list-footer": "ec4db6f0122263e7__list-footer", "item": "_684ccb7988365b4f__item", "is-size-compact": "f181b98b0d33282a__is-size-compact", "is-size-small": "_38f7faff93c61958__is-size-small", "item-indicator-icon": "_92fbe4765dfad5ee__item-indicator-icon", "empty": "_06c7ff39d2f685b9__empty" };
|
|
14
|
+
|
|
15
|
+
// packages/ui/src/form/primitives/autocomplete/empty.tsx
|
|
16
|
+
import { jsx } from "react/jsx-runtime";
|
|
17
|
+
var Empty = forwardRef(
|
|
18
|
+
function Empty2({ className, ...restProps }, ref) {
|
|
19
|
+
return /* @__PURE__ */ jsx(
|
|
20
|
+
_Autocomplete.Empty,
|
|
21
|
+
{
|
|
22
|
+
className: clsx(item_popup_default.empty, className),
|
|
23
|
+
ref,
|
|
24
|
+
...restProps
|
|
25
|
+
}
|
|
26
|
+
);
|
|
27
|
+
}
|
|
28
|
+
);
|
|
29
|
+
export {
|
|
30
|
+
Empty
|
|
31
|
+
};
|
|
32
|
+
//# sourceMappingURL=empty.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/form/primitives/autocomplete/empty.tsx", "../../../../src/utils/css/item-popup.module.css"],
|
|
4
|
+
"sourcesContent": ["import { Autocomplete as _Autocomplete } from '@base-ui/react/autocomplete';\nimport clsx from 'clsx';\nimport { forwardRef } from '@wordpress/element';\nimport type { AutocompleteEmptyProps } from './types';\nimport itemPopupStyles from '../../../utils/css/item-popup.module.css';\n\nexport const Empty = forwardRef< HTMLDivElement, AutocompleteEmptyProps >(\n\tfunction Empty( { className, ...restProps }, ref ) {\n\t\treturn (\n\t\t\t<_Autocomplete.Empty\n\t\t\t\tclassName={ clsx( itemPopupStyles.empty, className ) }\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...restProps }\n\t\t\t/>\n\t\t);\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='cdb73ecc03']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"cdb73ecc03\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities{._380b81b8f79fb10f__dropdown-motion{--wp-ui-dropdown-slide-distance:4px;--wp-ui-dropdown-slide-duration:200ms;--wp-ui-dropdown-slide-easing:cubic-bezier(0,0,0,1);--wp-ui-dropdown-fade-duration:80ms;--wp-ui-dropdown-fade-easing:linear;@media not (prefers-reduced-motion){transition-duration:var(--wp-ui-dropdown-slide-duration),var(--wp-ui-dropdown-fade-duration);transition-property:transform,opacity;transition-timing-function:var(--wp-ui-dropdown-slide-easing),var(--wp-ui-dropdown-fade-easing);will-change:transform,opacity}opacity:0;&[data-side=bottom]{transform:translateY(calc(var(--wp-ui-dropdown-slide-distance)*-1))}&[data-side=top]{transform:translateY(var(--wp-ui-dropdown-slide-distance))}&[data-side=left]{transform:translateX(var(--wp-ui-dropdown-slide-distance))}&[data-side=right]{transform:translateX(calc(var(--wp-ui-dropdown-slide-distance)*-1))}&[data-open]:not([data-starting-style]){opacity:1;transform:translate(0)}}}@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._234b520016b4e56f__popup{--wp-ui-popup-padding:4px;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-md,4px);box-shadow:var(--wpds-elevation-md,0 2px 3px 0 #0000000d,0 4px 5px 0 #0000000a,0 12px 12px 0 #00000008,0 16px 16px 0 #00000005);color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);display:grid;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);grid-template-areas:\\\"header\\\" \\\"main\\\";grid-template-rows:auto minmax(0,1fr);line-height:1.4;max-height:min(var(--available-height),480px,60dvh);max-width:var(--available-width);min-width:var(--anchor-width)}.f43dc7c768d7b622__list{display:grid;grid-area:main;grid-template-areas:\\\"scrollable\\\" \\\"footer\\\";grid-template-rows:minmax(0,1fr) auto}._233cd60cdb84a2ef__list-scrollable-container{grid-area:scrollable;overflow-block:auto;overscroll-behavior:contain;scroll-padding-block:var(--wp-ui-popup-padding);&:not(:empty){padding-block:var(--wp-ui-popup-padding)}}.ec4db6f0122263e7__list-footer{grid-area:footer;padding-block:var(--wp-ui-popup-padding);._233cd60cdb84a2ef__list-scrollable-container:not(:empty)+&{border-block-start:var(--wpds-border-width-xs,1px) solid var(--wpds-color-stroke-surface-neutral,#dbdbdb)}}._684ccb7988365b4f__item{--wp-ui-popup-item-height:40px;--wp-ui-popup-item-padding-inline:12px;--wp-ui-popup-item-padding-block:4px;align-items:center;border-radius:var(--wpds-border-radius-sm,2px);cursor:var(--wpds-cursor-control,pointer);display:flex;gap:var(--wpds-dimension-gap-xs,4px);justify-content:flex-start;margin-inline:var(--wp-ui-popup-padding);min-height:var(--wp-ui-popup-item-height);padding-block:var(--wp-ui-popup-item-padding-block);padding-inline-end:var(--wp-ui-popup-item-padding-inline);padding-inline-start:calc(var(--wp-ui-popup-item-padding-inline) - 4px);user-select:none;&.f181b98b0d33282a__is-size-compact{--wp-ui-popup-item-height:32px;--wp-ui-popup-item-padding-inline:8px}&._38f7faff93c61958__is-size-small{--wp-ui-popup-item-height:24px;--wp-ui-popup-item-padding-inline:8px;--wp-ui-popup-item-padding-block:2px}&:not([data-selected]){._92fbe4765dfad5ee__item-indicator-icon{opacity:0}}&[data-highlighted]:not([aria-disabled=true]){background-color:var(--wpds-color-bg-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));color:var(--wpds-color-fg-interactive-neutral,#1e1e1e);@media (forced-colors:active){outline:1px solid Highlight}}&[aria-disabled=true]{color:var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d);@media (forced-colors:active){color:GrayText}}}._92fbe4765dfad5ee__item-indicator-icon{flex-shrink:0}._06c7ff39d2f685b9__empty:not(:empty){--wp-ui-popup-empty-min-height:40px;--wp-ui-popup-empty-padding-inline:12px;align-items:center;color:var(--wpds-color-fg-content-neutral-weak,#707070);display:flex;grid-area:main;min-height:var(--wp-ui-popup-empty-min-height);padding-inline:var(--wp-ui-popup-empty-padding-inline)}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"popup\":\"_234b520016b4e56f__popup _380b81b8f79fb10f__dropdown-motion\",\"list\":\"f43dc7c768d7b622__list\",\"list-scrollable-container\":\"_233cd60cdb84a2ef__list-scrollable-container\",\"list-footer\":\"ec4db6f0122263e7__list-footer\",\"item\":\"_684ccb7988365b4f__item\",\"is-size-compact\":\"f181b98b0d33282a__is-size-compact\",\"is-size-small\":\"_38f7faff93c61958__is-size-small\",\"item-indicator-icon\":\"_92fbe4765dfad5ee__item-indicator-icon\",\"empty\":\"_06c7ff39d2f685b9__empty\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,gBAAgB,qBAAqB;AAC9C,OAAO,UAAU;AACjB,SAAS,kBAAkB;;;ACF3B,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,sqIAA0rI,CAAC;AACruI,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,qBAAQ,EAAC,SAAQ,+DAA8D,QAAO,0BAAyB,6BAA4B,gDAA+C,eAAc,iCAAgC,QAAO,2BAA0B,mBAAkB,qCAAoC,iBAAgB,oCAAmC,uBAAsB,0CAAyC,SAAQ,2BAA0B;;;ADGvd;AAHI,IAAM,QAAQ;AAAA,EACpB,SAASA,OAAO,EAAE,WAAW,GAAG,UAAU,GAAG,KAAM;AAClD,WACC;AAAA,MAAC,cAAc;AAAA,MAAd;AAAA,QACA,WAAY,KAAM,mBAAgB,OAAO,SAAU;AAAA,QACnD;AAAA,QACE,GAAG;AAAA;AAAA,IACN;AAAA,EAEF;AACD;",
|
|
6
|
+
"names": ["Empty"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
// packages/ui/src/form/primitives/autocomplete/index.ts
|
|
2
|
+
import { Clear } from "./clear.mjs";
|
|
3
|
+
import { Collection } from "./collection.mjs";
|
|
4
|
+
import { Empty } from "./empty.mjs";
|
|
5
|
+
import { InputGroup } from "./input-group.mjs";
|
|
6
|
+
import { Input } from "./input.mjs";
|
|
7
|
+
import { Item } from "./item.mjs";
|
|
8
|
+
import { List } from "./list.mjs";
|
|
9
|
+
import { ListBody } from "./list-body.mjs";
|
|
10
|
+
import { Portal } from "./portal.mjs";
|
|
11
|
+
import { Popup } from "./popup.mjs";
|
|
12
|
+
import { Root } from "./root.mjs";
|
|
13
|
+
import { Value } from "./value.mjs";
|
|
14
|
+
export {
|
|
15
|
+
Clear,
|
|
16
|
+
Collection,
|
|
17
|
+
Empty,
|
|
18
|
+
Input,
|
|
19
|
+
InputGroup,
|
|
20
|
+
Item,
|
|
21
|
+
List,
|
|
22
|
+
ListBody,
|
|
23
|
+
Popup,
|
|
24
|
+
Portal,
|
|
25
|
+
Root,
|
|
26
|
+
Value
|
|
27
|
+
};
|
|
28
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/form/primitives/autocomplete/index.ts"],
|
|
4
|
+
"sourcesContent": ["export { Clear } from './clear';\nexport { Collection } from './collection';\nexport { Empty } from './empty';\nexport { InputGroup } from './input-group';\nexport { Input } from './input';\nexport { Item } from './item';\nexport { List } from './list';\nexport { ListBody } from './list-body';\nexport { Portal } from './portal';\nexport { Popup } from './popup';\nexport { Root } from './root';\nexport { Value } from './value';\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,aAAa;AACtB,SAAS,kBAAkB;AAC3B,SAAS,aAAa;AACtB,SAAS,kBAAkB;AAC3B,SAAS,aAAa;AACtB,SAAS,YAAY;AACrB,SAAS,YAAY;AACrB,SAAS,gBAAgB;AACzB,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,YAAY;AACrB,SAAS,aAAa;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
// packages/ui/src/form/primitives/autocomplete/input-group.tsx
|
|
2
|
+
import { Autocomplete as _Autocomplete } from "@base-ui/react/autocomplete";
|
|
3
|
+
import { forwardRef } from "@wordpress/element";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
var InputGroup = forwardRef(function InputGroup2(props, ref) {
|
|
6
|
+
return /* @__PURE__ */ jsx(_Autocomplete.InputGroup, { ref, ...props });
|
|
7
|
+
});
|
|
8
|
+
export {
|
|
9
|
+
InputGroup
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=input-group.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/form/primitives/autocomplete/input-group.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Autocomplete as _Autocomplete } from '@base-ui/react/autocomplete';\nimport { forwardRef } from '@wordpress/element';\nimport type { AutocompleteInputGroupProps } from './types';\n\n/**\n * Wrapper around `Autocomplete.Input` that defines the visual control\n * boundary when the input is composed with prefix/suffix slots or other\n * elements. Without this wrapper, the popup anchors to the bare `<input>`\n * instead of the full control. Also adds `role=\"group\"`.\n */\nexport const InputGroup = forwardRef<\n\tHTMLDivElement,\n\tAutocompleteInputGroupProps\n>( function InputGroup( props, ref ) {\n\treturn <_Autocomplete.InputGroup ref={ ref } { ...props } />;\n} );\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,gBAAgB,qBAAqB;AAC9C,SAAS,kBAAkB;AAanB;AAJD,IAAM,aAAa,WAGvB,SAASA,YAAY,OAAO,KAAM;AACpC,SAAO,oBAAC,cAAc,YAAd,EAAyB,KAAc,GAAG,OAAQ;AAC3D,CAAE;",
|
|
6
|
+
"names": ["InputGroup"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
// packages/ui/src/form/primitives/autocomplete/input.tsx
|
|
2
|
+
import { Autocomplete as _Autocomplete } from "@base-ui/react/autocomplete";
|
|
3
|
+
import { forwardRef } from "@wordpress/element";
|
|
4
|
+
import { Input as InputPrimitive } from "../input/index.mjs";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
6
|
+
var DEFAULT_RENDER = (props) => /* @__PURE__ */ jsx(InputPrimitive, { ...props });
|
|
7
|
+
var Input = forwardRef(
|
|
8
|
+
function Input2({ render = DEFAULT_RENDER, ...restProps }, ref) {
|
|
9
|
+
return /* @__PURE__ */ jsx(
|
|
10
|
+
_Autocomplete.Input,
|
|
11
|
+
{
|
|
12
|
+
ref,
|
|
13
|
+
render,
|
|
14
|
+
...restProps
|
|
15
|
+
}
|
|
16
|
+
);
|
|
17
|
+
}
|
|
18
|
+
);
|
|
19
|
+
export {
|
|
20
|
+
Input
|
|
21
|
+
};
|
|
22
|
+
//# sourceMappingURL=input.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/form/primitives/autocomplete/input.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Autocomplete as _Autocomplete } from '@base-ui/react/autocomplete';\nimport { forwardRef } from '@wordpress/element';\nimport { Input as InputPrimitive } from '../input';\nimport type { AutocompleteInputProps } from './types';\n\nconst DEFAULT_RENDER = ( props: AutocompleteInputProps ) => (\n\t<InputPrimitive { ...props } />\n);\n\nexport const Input = forwardRef< HTMLInputElement, AutocompleteInputProps >(\n\tfunction Input( { render = DEFAULT_RENDER, ...restProps }, ref ) {\n\t\treturn (\n\t\t\t<_Autocomplete.Input\n\t\t\t\tref={ ref }\n\t\t\t\trender={ render }\n\t\t\t\t{ ...restProps }\n\t\t\t/>\n\t\t);\n\t}\n);\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,gBAAgB,qBAAqB;AAC9C,SAAS,kBAAkB;AAC3B,SAAS,SAAS,sBAAsB;AAIvC;AADD,IAAM,iBAAiB,CAAE,UACxB,oBAAC,kBAAiB,GAAG,OAAQ;AAGvB,IAAM,QAAQ;AAAA,EACpB,SAASA,OAAO,EAAE,SAAS,gBAAgB,GAAG,UAAU,GAAG,KAAM;AAChE,WACC;AAAA,MAAC,cAAc;AAAA,MAAd;AAAA,QACA;AAAA,QACA;AAAA,QACE,GAAG;AAAA;AAAA,IACN;AAAA,EAEF;AACD;",
|
|
6
|
+
"names": ["Input"]
|
|
7
|
+
}
|