@astryxdesign/core 0.7.2-canary.f16dc9f → 0.7.2-canary.f2b60a0
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/dist/AppShell/AppShell.d.ts.map +1 -1
- package/dist/AppShell/AppShell.js +40 -1
- package/dist/AspectRatio/AspectRatio.d.ts +6 -8
- package/dist/AspectRatio/AspectRatio.d.ts.map +1 -1
- package/dist/AspectRatio/AspectRatio.js +44 -3
- package/dist/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
- package/dist/Breadcrumbs/BreadcrumbItem.js +5 -2
- package/dist/CheckboxInput/CheckboxInput.d.ts +1 -1
- package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
- package/dist/CheckboxInput/CheckboxInput.js +3 -1
- package/dist/CheckboxList/CheckboxListItem.d.ts +9 -1
- package/dist/CheckboxList/CheckboxListItem.d.ts.map +1 -1
- package/dist/CheckboxList/CheckboxListItem.js +4 -2
- package/dist/CommandPalette/CommandPaletteInput.d.ts +1 -1
- package/dist/CommandPalette/CommandPaletteInput.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPaletteInput.js +37 -5
- package/dist/ContextMenu/ContextMenu.d.ts.map +1 -1
- package/dist/ContextMenu/ContextMenu.js +5 -2
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +20 -8
- package/dist/Drawer/Drawer.d.ts +191 -0
- package/dist/Drawer/Drawer.d.ts.map +1 -0
- package/dist/Drawer/Drawer.js +382 -0
- package/dist/Drawer/DrawerHeader.d.ts +85 -0
- package/dist/Drawer/DrawerHeader.d.ts.map +1 -0
- package/dist/Drawer/DrawerHeader.js +134 -0
- package/dist/Drawer/index.d.ts +11 -0
- package/dist/Drawer/index.d.ts.map +1 -0
- package/dist/Drawer/index.js +11 -0
- package/dist/Drawer/useDrawerDialogPresence.d.ts +42 -0
- package/dist/Drawer/useDrawerDialogPresence.d.ts.map +1 -0
- package/dist/Drawer/useDrawerDialogPresence.js +236 -0
- package/dist/DropdownMenu/DropdownMenu.d.ts +1 -1
- package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenu.js +83 -11
- package/dist/DropdownMenu/DropdownMenuContext.d.ts +17 -0
- package/dist/DropdownMenu/DropdownMenuContext.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuContext.js +21 -0
- package/dist/DropdownMenu/DropdownMenuDivider.d.ts +5 -3
- package/dist/DropdownMenu/DropdownMenuDivider.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuDivider.js +7 -3
- package/dist/DropdownMenu/DropdownMenuSubMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuSubMenu.js +19 -8
- package/dist/DropdownMenu/lazyMenuBottomSheet.d.ts +24 -0
- package/dist/DropdownMenu/lazyMenuBottomSheet.d.ts.map +1 -0
- package/dist/DropdownMenu/lazyMenuBottomSheet.js +46 -0
- package/dist/EmptyState/EmptyState.d.ts.map +1 -1
- package/dist/EmptyState/EmptyState.js +4 -10
- package/dist/Field/Field.d.ts +1 -1
- package/dist/Field/Field.d.ts.map +1 -1
- package/dist/Field/Field.js +8 -4
- package/dist/Grid/GridSpan.d.ts.map +1 -1
- package/dist/Grid/GridSpan.js +1 -0
- package/dist/Heading/Heading.d.ts.map +1 -1
- package/dist/Heading/Heading.js +4 -2
- package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
- package/dist/HoverCard/useHoverCard.js +10 -2
- package/dist/Item/Item.d.ts +6 -2
- package/dist/Item/Item.d.ts.map +1 -1
- package/dist/Item/Item.js +19 -4
- package/dist/Layer/layerViewportInset.stylex.d.ts +6 -2
- package/dist/Layer/layerViewportInset.stylex.d.ts.map +1 -1
- package/dist/Layer/layerViewportInset.stylex.js +6 -2
- package/dist/Layer/useLayer.d.ts.map +1 -1
- package/dist/Layer/useLayer.js +13 -7
- package/dist/Layer/useLayerDismissal.d.ts +1 -1
- package/dist/Layer/useLayerDismissal.js +1 -1
- package/dist/Layout/container.stylex.d.ts +5 -5
- package/dist/Layout/container.stylex.js +4 -4
- package/dist/List/List.d.ts +46 -19
- package/dist/List/List.d.ts.map +1 -1
- package/dist/List/List.js +28 -10
- package/dist/List/ListContext.d.ts +8 -3
- package/dist/List/ListContext.d.ts.map +1 -1
- package/dist/List/ListContext.js +7 -2
- package/dist/List/ListItem.d.ts +13 -5
- package/dist/List/ListItem.d.ts.map +1 -1
- package/dist/List/ListItem.js +21 -8
- package/dist/List/index.d.ts +1 -1
- package/dist/List/index.d.ts.map +1 -1
- package/dist/Markdown/Markdown.d.ts.map +1 -1
- package/dist/Markdown/Markdown.js +8 -1
- package/dist/Markdown/plugins/frontmatter.d.ts.map +1 -1
- package/dist/Markdown/plugins/frontmatter.js +7 -3
- package/dist/MetadataList/MetadataList.d.ts.map +1 -1
- package/dist/MetadataList/MetadataList.js +5 -1
- package/dist/MetadataList/MetadataListContext.d.ts +1 -1
- package/dist/MetadataList/MetadataListContext.d.ts.map +1 -1
- package/dist/MobileNav/MobileNav.d.ts +9 -0
- package/dist/MobileNav/MobileNav.d.ts.map +1 -1
- package/dist/MobileNav/MobileNav.js +30 -3
- package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.js +22 -8
- package/dist/MultiSelector/OptionActions.a11y.chromium.spec.js +100 -2
- package/dist/Popover/Popover.js +2 -2
- package/dist/RadioList/RadioList.d.ts +1 -1
- package/dist/RadioList/RadioList.d.ts.map +1 -1
- package/dist/RadioList/RadioList.js +6 -2
- package/dist/RadioList/RadioListItem.d.ts +9 -1
- package/dist/RadioList/RadioListItem.d.ts.map +1 -1
- package/dist/RadioList/RadioListItem.js +2 -0
- package/dist/SideNav/SideNavItem.d.ts +8 -1
- package/dist/SideNav/SideNavItem.d.ts.map +1 -1
- package/dist/SideNav/SideNavItem.js +71 -9
- package/dist/TabList/TabMenu.d.ts +2 -2
- package/dist/TabList/TabMenu.d.ts.map +1 -1
- package/dist/TabList/TabMenu.js +6 -3
- package/dist/Text/Text.d.ts.map +1 -1
- package/dist/Text/Text.js +4 -2
- package/dist/Text/useTruncation.d.ts +7 -5
- package/dist/Text/useTruncation.d.ts.map +1 -1
- package/dist/Text/useTruncation.js +16 -5
- package/dist/ToggleButton/ToggleButton.d.ts +3 -2
- package/dist/ToggleButton/ToggleButton.d.ts.map +1 -1
- package/dist/ToggleButton/ToggleButton.js +12 -1
- package/dist/TopNav/TopNavMegaMenu.d.ts.map +1 -1
- package/dist/TopNav/TopNavMegaMenu.js +3 -3
- package/dist/TopNav/TopNavMenu.d.ts.map +1 -1
- package/dist/TopNav/TopNavMenu.js +3 -3
- package/dist/TreeList/TreeList.d.ts.map +1 -1
- package/dist/TreeList/TreeList.js +1 -0
- package/dist/TreeList/TreeListBranches.d.ts.map +1 -1
- package/dist/TreeList/TreeListBranches.js +2 -2
- package/dist/TreeList/TreeListItem.d.ts.map +1 -1
- package/dist/TreeList/TreeListItem.js +57 -9
- package/dist/astryx.css +46 -13
- package/dist/hooks/useEntryAnimation.d.ts +2 -1
- package/dist/hooks/useEntryAnimation.d.ts.map +1 -1
- package/dist/hooks/useEntryAnimation.js +14 -12
- package/dist/hooks/useIsHydrating.d.ts +6 -0
- package/dist/hooks/useIsHydrating.d.ts.map +1 -0
- package/dist/hooks/useIsHydrating.js +30 -0
- package/dist/hooks/useMenuHover.d.ts.map +1 -1
- package/dist/hooks/useMenuHover.js +18 -13
- package/dist/i18n/generated-locales/en.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/en.generated.js +93 -1
- package/dist/i18n/generated-locales/pseudo.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/pseudo.generated.js +93 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/theme/derivedVarRegistry.d.ts.map +1 -1
- package/dist/theme/derivedVarRegistry.js +0 -3
- package/dist/utils/focusOutline.stylex.d.ts +4 -0
- package/dist/utils/focusOutline.stylex.d.ts.map +1 -1
- package/dist/utils/focusOutline.stylex.js +4 -0
- package/dist/utils/plainDate.d.ts.map +1 -1
- package/dist/utils/plainDate.js +15 -9
- package/dist/utils/sharedMutationObserver.d.ts +21 -0
- package/dist/utils/sharedMutationObserver.d.ts.map +1 -0
- package/dist/utils/sharedMutationObserver.js +69 -0
- package/locales/en.json +368 -0
- package/locales/pseudo.json +276 -0
- package/package.json +8 -3
- package/scripts/agent-doc-state.mjs +38 -0
- package/scripts/postinstall.mjs +1 -1
- package/src/AppShell/AppShell.tsx +45 -1
- package/src/AspectRatio/AspectRatio.test.tsx +44 -43
- package/src/AspectRatio/AspectRatio.tsx +38 -18
- package/src/AspectRatio/__tests__/AspectRatioFitLayers.a11y.browser.spec.ts +157 -0
- package/src/Avatar/Avatar.doc.mjs +5 -3
- package/src/AvatarGroup/AvatarGroup.doc.mjs +3 -2
- package/src/Breadcrumbs/BreadcrumbItem.tsx +4 -1
- package/src/Breadcrumbs/Breadcrumbs.test.tsx +30 -1
- package/src/Card/Card.doc.mjs +1 -1
- package/src/Chat/__tests__/ChatMessageMetadata.a11y.chromium.spec.ts +3 -1
- package/src/CheckboxInput/CheckboxInput.test.tsx +34 -0
- package/src/CheckboxInput/CheckboxInput.tsx +3 -1
- package/src/CheckboxList/CheckboxList.test.tsx +22 -0
- package/src/CheckboxList/CheckboxListItem.doc.mjs +16 -0
- package/src/CheckboxList/CheckboxListItem.tsx +10 -0
- package/src/CommandPalette/CommandPaletteInput.test.tsx +53 -4
- package/src/CommandPalette/CommandPaletteInput.tsx +33 -3
- package/src/CommandPalette/__tests__/CommandPaletteInputAudit.a11y.chromium.spec.ts +335 -0
- package/src/CommandPalette/__tests__/CommandPaletteItemAudit.a11y.chromium.spec.ts +292 -0
- package/src/ContextMenu/ContextMenu.doc.mjs +2 -3
- package/src/ContextMenu/ContextMenu.tsx +4 -1
- package/src/ContextMenu/__tests__/ContextMenuAudit.a11y.chromium.spec.ts +438 -0
- package/src/Dialog/Dialog.test.tsx +46 -0
- package/src/Dialog/Dialog.tsx +20 -7
- package/src/Dialog/__tests__/Dialog.a11y.known-failures.ts +0 -14
- package/src/Drawer/Drawer.doc.mjs +472 -0
- package/src/Drawer/Drawer.spec.md +357 -0
- package/src/Drawer/Drawer.test.tsx +1300 -0
- package/src/Drawer/Drawer.tsx +613 -0
- package/src/Drawer/DrawerDirection.test.tsx +127 -0
- package/src/Drawer/DrawerHeader.doc.mjs +293 -0
- package/src/Drawer/DrawerHeader.test.tsx +102 -0
- package/src/Drawer/DrawerHeader.tsx +235 -0
- package/src/Drawer/__tests__/DrawerAudit.a11y.chromium.spec.ts +401 -0
- package/src/Drawer/__tests__/DrawerHeaderAudit.a11y.chromium.spec.ts +297 -0
- package/src/Drawer/index.ts +13 -0
- package/src/Drawer/useDrawerDialogPresence.ts +284 -0
- package/src/DropdownMenu/DropdownMenu.ssr.test.tsx +57 -0
- package/src/DropdownMenu/DropdownMenu.test.tsx +76 -14
- package/src/DropdownMenu/DropdownMenu.tsx +83 -12
- package/src/DropdownMenu/DropdownMenuContext.tsx +24 -0
- package/src/DropdownMenu/DropdownMenuDivider.doc.mjs +2 -2
- package/src/DropdownMenu/DropdownMenuDivider.spec.md +192 -0
- package/src/DropdownMenu/DropdownMenuDivider.tsx +9 -5
- package/src/DropdownMenu/DropdownMenuLazySheet.test.tsx +126 -0
- package/src/DropdownMenu/DropdownMenuSubMenu.test.tsx +185 -0
- package/src/DropdownMenu/DropdownMenuSubMenu.tsx +19 -5
- package/src/DropdownMenu/__tests__/DropdownMenuDividerAudit.a11y.chromium.spec.ts +280 -0
- package/src/DropdownMenu/__tests__/Menu.a11y.chromium.spec.ts +145 -0
- package/src/DropdownMenu/__tests__/Menu.a11y.known-failures.ts +26 -0
- package/src/DropdownMenu/__tests__/Menu.a11y.renders.tsx +65 -0
- package/src/DropdownMenu/__tests__/Menu.a11y.states.ts +138 -0
- package/src/DropdownMenu/__tests__/Menu.a11y.test.tsx +136 -0
- package/src/DropdownMenu/__tests__/warmMenuBottomSheet.tsx +43 -0
- package/src/DropdownMenu/lazyMenuBottomSheet.ts +71 -0
- package/src/EmptyState/EmptyState.doc.mjs +3 -2
- package/src/EmptyState/EmptyState.spec.md +189 -0
- package/src/EmptyState/EmptyState.test.tsx +74 -3
- package/src/EmptyState/EmptyState.tsx +4 -8
- package/src/Field/Field.doc.mjs +14 -8
- package/src/Field/Field.spec.md +217 -0
- package/src/Field/Field.test.tsx +60 -2
- package/src/Field/Field.tsx +17 -8
- package/src/Grid/GridSpan.tsx +3 -0
- package/src/Heading/Heading.test.tsx +57 -0
- package/src/Heading/Heading.tsx +6 -2
- package/src/HoverCard/HoverCard.test.tsx +58 -0
- package/src/HoverCard/useHoverCard.tsx +10 -2
- package/src/Item/Item.doc.mjs +12 -8
- package/src/Item/Item.spec.md +226 -0
- package/src/Item/Item.test.tsx +61 -0
- package/src/Item/Item.tsx +40 -4
- package/src/Layer/layerViewportInset.source-build.test.mjs +90 -0
- package/src/Layer/layerViewportInset.stylex.ts +6 -2
- package/src/Layer/layerViewportInset.test.ts +1 -0
- package/src/Layer/useLayer.tsx +24 -13
- package/src/Layer/useLayerDismissal.ts +1 -1
- package/src/Layout/container.stylex.ts +6 -6
- package/src/List/List.doc.mjs +14 -1
- package/src/List/List.spec.md +129 -77
- package/src/List/List.test.tsx +163 -94
- package/src/List/List.tsx +74 -18
- package/src/List/ListContext.tsx +9 -3
- package/src/List/ListItem.doc.mjs +16 -0
- package/src/List/ListItem.tsx +56 -27
- package/src/List/index.ts +1 -1
- package/src/Markdown/Markdown.tsx +14 -1
- package/src/Markdown/plugins/frontmatter.test.tsx +25 -0
- package/src/Markdown/plugins/frontmatter.ts +7 -3
- package/src/MetadataList/MetadataList.doc.mjs +2 -2
- package/src/MetadataList/MetadataList.test.tsx +38 -0
- package/src/MetadataList/MetadataList.tsx +8 -1
- package/src/MetadataList/MetadataListContext.tsx +1 -1
- package/src/MobileNav/MobileNav.tsx +30 -3
- package/src/MobileNav/MobileNavCloseEdgeCases.test.tsx +173 -15
- package/src/MoreMenu/MoreMenu.test.tsx +5 -1
- package/src/MultiSelector/MultiSelector.test.tsx +159 -0
- package/src/MultiSelector/MultiSelector.tsx +40 -7
- package/src/MultiSelector/OptionActions.a11y.chromium.spec.ts +112 -2
- package/src/Popover/Popover.test.tsx +2 -2
- package/src/Popover/Popover.tsx +4 -4
- package/src/RadioList/RadioList.fr10.test.tsx +45 -2
- package/src/RadioList/RadioList.test.tsx +22 -0
- package/src/RadioList/RadioList.tsx +4 -1
- package/src/RadioList/RadioListItem.doc.mjs +16 -0
- package/src/RadioList/RadioListItem.tsx +10 -1
- package/src/SideNav/SideNav.test.tsx +179 -0
- package/src/SideNav/SideNavItem.doc.mjs +2 -2
- package/src/SideNav/SideNavItem.tsx +96 -17
- package/src/Slider/Slider.spec.md +39 -18
- package/src/TabList/TabList.spec.md +57 -44
- package/src/TabList/TabList.test.tsx +67 -0
- package/src/TabList/TabMenu.doc.mjs +4 -3
- package/src/TabList/TabMenu.tsx +7 -4
- package/src/Text/Text.test.tsx +57 -0
- package/src/Text/Text.tsx +6 -2
- package/src/Text/useTruncation.test.tsx +69 -0
- package/src/Text/useTruncation.ts +16 -5
- package/src/TimeInput/TimeInput.fr10.test.tsx +15 -0
- package/src/ToggleButton/ToggleButton.test.tsx +95 -0
- package/src/ToggleButton/ToggleButton.tsx +12 -1
- package/src/Tooltip/Tooltip.test.tsx +31 -0
- package/src/TopNav/TopNavMegaMenu.test.tsx +22 -0
- package/src/TopNav/TopNavMegaMenu.tsx +7 -3
- package/src/TopNav/TopNavMenu.test.tsx +19 -0
- package/src/TopNav/TopNavMenu.tsx +11 -3
- package/src/TreeList/TreeList.doc.mjs +1 -0
- package/src/TreeList/TreeList.spec.md +29 -17
- package/src/TreeList/TreeList.test.tsx +327 -6
- package/src/TreeList/TreeList.tsx +5 -1
- package/src/TreeList/TreeListBranches.tsx +6 -0
- package/src/TreeList/TreeListItem.tsx +88 -13
- package/src/docPropLiterals.test.ts +36 -10
- package/src/hooks/useEntryAnimation.doc.mjs +4 -4
- package/src/hooks/useEntryAnimation.ssr.test.tsx +143 -0
- package/src/hooks/useEntryAnimation.ts +15 -16
- package/src/hooks/useIsHydrating.test.tsx +70 -0
- package/src/hooks/useIsHydrating.ts +31 -0
- package/src/hooks/useMenuHover.ts +18 -13
- package/src/i18n/generated-locales/en.generated.ts +100 -0
- package/src/i18n/generated-locales/pseudo.generated.ts +100 -0
- package/src/index.ts +1 -0
- package/src/postinstall.test.mjs +46 -0
- package/src/reset.css +0 -29
- package/src/theme/derivedVarRegistry.test.ts +7 -3
- package/src/theme/derivedVarRegistry.ts +0 -3
- package/src/utils/focusOutline.stylex.ts +4 -0
- package/src/utils/plainDate.test.ts +37 -1
- package/src/utils/plainDate.ts +15 -5
- package/src/utils/sharedMutationObserver.test.ts +53 -0
- package/src/utils/sharedMutationObserver.ts +78 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppShell.d.ts","sourceRoot":"","sources":["../../src/AppShell/AppShell.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAQL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"AppShell.d.ts","sourceRoot":"","sources":["../../src/AppShell/AppShell.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAQL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAoBf,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,2BAA2B,CAAC;AACnC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAsChD;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG,mBAAmB,GAAG,MAAM,CAAC;AAE9D;;;;;;;GAOG;AAEH;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,kBAAkB,CAAC;AAEvD;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAEhC;;;;;;;;;;OAUG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAE1B;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;OAOG;IACH,cAAc,CAAC,EAAE,WAAW,CAAC;IAE7B;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEzB;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,eAAe,GAAG,SAAS,CAAC;IAEhD;;;;;;;;;;;;;;;;;;;;;;;;;OAyBG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAkLD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,QAAQ,CAAC,EACvB,OAAoB,EACpB,MAAM,EACN,QAAQ,EACR,cAAc,EACd,aAAa,EAAE,UAAU,EACzB,MAAe,EACf,SAAS,EACT,OAAO,EACP,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,aAAa,qBA0bf;yBAzce,QAAQ"}
|
|
@@ -29,6 +29,7 @@ import { LayoutHeader } from "../Layout/LayoutHeader.js";
|
|
|
29
29
|
import { LayoutPanel } from "../Layout/LayoutPanel.js";
|
|
30
30
|
import { LayoutContent } from "../Layout/LayoutContent.js";
|
|
31
31
|
import { MobileNavToggle } from "../MobileNav/MobileNavToggle.js";
|
|
32
|
+
import { MAX_CLOSE_DELAY_MS as MOBILE_NAV_MAX_CLOSE_DELAY_MS } from "../MobileNav/MobileNav.js";
|
|
32
33
|
import { SideNavRenderContext } from "../SideNav/SideNavRenderContext.js";
|
|
33
34
|
import { TopNavRenderContext } from "../TopNav/TopNavRenderContext.js";
|
|
34
35
|
import { TopNavMobileContentContext } from "../TopNav/TopNavMobileContentContext.js";
|
|
@@ -62,6 +63,20 @@ const ActivityWrapper = HasActivity ? ({
|
|
|
62
63
|
|
|
63
64
|
const MAIN_CONTENT_ID = 'astryx-app-shell-main';
|
|
64
65
|
|
|
66
|
+
/**
|
|
67
|
+
* Extra time, on top of MobileNav's own worst-case close delay, that
|
|
68
|
+
* AppShell waits before flipping its `Activity` boundary to `'hidden'`.
|
|
69
|
+
*
|
|
70
|
+
* React's `Activity` hides its subtree with `display: none !important`
|
|
71
|
+
* synchronously in the same commit as the mode flip, and re-runs the
|
|
72
|
+
* cleanup of every effect inside it — which would otherwise clear
|
|
73
|
+
* MobileNav's own scheduled `dialog.close()` before it fires, or cut off
|
|
74
|
+
* its slide-out CSS transition before it plays (#5701). Waiting strictly
|
|
75
|
+
* longer than MobileNav's own cap, rather than the same duration, means
|
|
76
|
+
* this never turns into a race decided by browser timer-firing order.
|
|
77
|
+
*/
|
|
78
|
+
const ACTIVITY_HIDE_BUFFER_MS = 50;
|
|
79
|
+
|
|
65
80
|
// =============================================================================
|
|
66
81
|
// Types
|
|
67
82
|
// =============================================================================
|
|
@@ -259,6 +274,30 @@ export function AppShell({
|
|
|
259
274
|
const isBelowBreakpoint = useMediaQuery(breakpointQuery, sideNavBreakpoint === 'none' ? false : mobileNavConfig?.defaultIsMobile);
|
|
260
275
|
const [uncontrolledMobileOpen, setUncontrolledMobileOpen] = useState(false);
|
|
261
276
|
const isMobileNavOpen = mobileNavConfig?.isOpen ?? uncontrolledMobileOpen;
|
|
277
|
+
|
|
278
|
+
// Holds the mobile nav's `Activity` boundary visible for a beat after a
|
|
279
|
+
// close, so MobileNav's own close effect gets a real chance to run its
|
|
280
|
+
// slide-out transition and schedule its delayed `dialog.close()` before
|
|
281
|
+
// Activity hides the subtree (#5701). Only the CLOSE is deferred: opening
|
|
282
|
+
// reads `isMobileNavOpen` directly below, so a controlled open is visible in
|
|
283
|
+
// the commit that carries it instead of one effect later.
|
|
284
|
+
const [isMobileNavCloseHeld, setIsMobileNavCloseHeld] = useState(isMobileNavOpen);
|
|
285
|
+
// Arm the hold during render, from the open state itself, so no Effect has
|
|
286
|
+
// to copy props into state; the Effect below only owns the release timer.
|
|
287
|
+
if (isMobileNavOpen && !isMobileNavCloseHeld) {
|
|
288
|
+
setIsMobileNavCloseHeld(true);
|
|
289
|
+
}
|
|
290
|
+
useEffect(() => {
|
|
291
|
+
if (!HasActivity || isMobileNavOpen) {
|
|
292
|
+
return;
|
|
293
|
+
}
|
|
294
|
+
const delayMs = window.matchMedia('(prefers-reduced-motion: reduce)').matches ? 0 : MOBILE_NAV_MAX_CLOSE_DELAY_MS + ACTIVITY_HIDE_BUFFER_MS;
|
|
295
|
+
const timeout = setTimeout(() => {
|
|
296
|
+
setIsMobileNavCloseHeld(false);
|
|
297
|
+
}, delayMs);
|
|
298
|
+
return () => clearTimeout(timeout);
|
|
299
|
+
}, [isMobileNavOpen]);
|
|
300
|
+
const isMobileNavActivityVisible = isMobileNavOpen || isMobileNavCloseHeld;
|
|
262
301
|
const mobileNavOnOpenChange = mobileNavConfig?.onOpenChange;
|
|
263
302
|
const setMobileNavOpen = useCallback(open => {
|
|
264
303
|
if (!mobileNavIsControlled) {
|
|
@@ -520,7 +559,7 @@ export function AppShell({
|
|
|
520
559
|
start: sideNavContent,
|
|
521
560
|
content: mainContent
|
|
522
561
|
}), shouldRenderMobileNavReactNode && mobileNavReactNode, shouldRenderConfigContent && mobileNavConfigContent, isBelowBreakpoint && !mobileNavDisabled && mobileNavReactNode == null && !mobileNavConfigContent && /*#__PURE__*/_jsxs(ActivityWrapper, {
|
|
523
|
-
mode:
|
|
562
|
+
mode: isMobileNavActivityVisible ? 'visible' : 'hidden',
|
|
524
563
|
children: [hasSideNav && !hasTopNav && /*#__PURE__*/_jsx(SideNavRenderContext, {
|
|
525
564
|
value: "drawer",
|
|
526
565
|
children: sideNav
|
|
@@ -7,7 +7,6 @@
|
|
|
7
7
|
* SYNC: When modified, update these files to stay in sync:
|
|
8
8
|
* - /packages/core/src/AspectRatio/AspectRatio.doc.mjs
|
|
9
9
|
* - /packages/core/src/AspectRatio/AspectRatio.test.tsx
|
|
10
|
-
* - /packages/core/src/reset.css (AspectRatio fit baseline rules)
|
|
11
10
|
* - /apps/storybook/stories/AspectRatio.stories.tsx
|
|
12
11
|
* - /packages/cli/assets/templates/blocks/components/AspectRatio/ (showcase blocks)
|
|
13
12
|
*/
|
|
@@ -80,13 +79,12 @@ export interface AspectRatioProps extends BaseProps<HTMLDivElement> {
|
|
|
80
79
|
* (`object-fit: contain`).
|
|
81
80
|
* - `center`: child keeps its natural size, centered in the box.
|
|
82
81
|
*
|
|
83
|
-
* `cover`/`contain` child
|
|
84
|
-
*
|
|
85
|
-
*
|
|
86
|
-
*
|
|
87
|
-
*
|
|
88
|
-
*
|
|
89
|
-
* so it is not exposed on the theming surface.
|
|
82
|
+
* `cover`/`contain` size the child from the component's own styles, in
|
|
83
|
+
* the `astryx-base` cascade layer. Styles in a later layer (Tailwind
|
|
84
|
+
* utilities, `astryx-theme`), unlayered CSS, and inline styles on the
|
|
85
|
+
* child still win. When omitted, the child is left unstyled (the
|
|
86
|
+
* pre-existing contract). `fit` is structural, not visual, so it is not
|
|
87
|
+
* exposed on the theming surface.
|
|
90
88
|
*
|
|
91
89
|
* @example
|
|
92
90
|
* ```
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AspectRatio.d.ts","sourceRoot":"","sources":["../../src/AspectRatio/AspectRatio.tsx"],"names":[],"mappings":"AAEA
|
|
1
|
+
{"version":3,"file":"AspectRatio.d.ts","sourceRoot":"","sources":["../../src/AspectRatio/AspectRatio.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAErC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAI5C;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG,SAAS,CAAC;AAEvD;;;;;;;GAOG;AACH,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE5D,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACjE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;;;;;;;;;;;;OAeG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC;IAEzB;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,GAAG,CAAC,EAAE,cAAc,CAAC;IAErB;;;;;;;OAOG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAkED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAmB,EACnB,GAAG,EACH,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,gBAAgB,+BAgClB;yBA1Ce,WAAW"}
|
|
@@ -9,7 +9,6 @@
|
|
|
9
9
|
* SYNC: When modified, update these files to stay in sync:
|
|
10
10
|
* - /packages/core/src/AspectRatio/AspectRatio.doc.mjs
|
|
11
11
|
* - /packages/core/src/AspectRatio/AspectRatio.test.tsx
|
|
12
|
-
* - /packages/core/src/reset.css (AspectRatio fit baseline rules)
|
|
13
12
|
* - /apps/storybook/stories/AspectRatio.stories.tsx
|
|
14
13
|
* - /packages/cli/assets/templates/blocks/components/AspectRatio/ (showcase blocks)
|
|
15
14
|
*/
|
|
@@ -132,10 +131,52 @@ export function AspectRatio({
|
|
|
132
131
|
0: {
|
|
133
132
|
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d"
|
|
134
133
|
},
|
|
135
|
-
|
|
134
|
+
8: {
|
|
136
135
|
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x78zum5 x6s0dn4 xl56j7k"
|
|
136
|
+
},
|
|
137
|
+
4: {
|
|
138
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d xyz6fim x1m6kvgq"
|
|
139
|
+
},
|
|
140
|
+
12: {
|
|
141
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x78zum5 x6s0dn4 xl56j7k xyz6fim x1m6kvgq"
|
|
142
|
+
},
|
|
143
|
+
2: {
|
|
144
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x492jj3"
|
|
145
|
+
},
|
|
146
|
+
10: {
|
|
147
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x78zum5 x6s0dn4 xl56j7k x492jj3"
|
|
148
|
+
},
|
|
149
|
+
6: {
|
|
150
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d xyz6fim x1m6kvgq x492jj3"
|
|
151
|
+
},
|
|
152
|
+
14: {
|
|
153
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x78zum5 x6s0dn4 xl56j7k xyz6fim x1m6kvgq x492jj3"
|
|
154
|
+
},
|
|
155
|
+
1: {
|
|
156
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x16lv2iq"
|
|
157
|
+
},
|
|
158
|
+
9: {
|
|
159
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x78zum5 x6s0dn4 xl56j7k x16lv2iq"
|
|
160
|
+
},
|
|
161
|
+
5: {
|
|
162
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d xyz6fim x1m6kvgq x16lv2iq"
|
|
163
|
+
},
|
|
164
|
+
13: {
|
|
165
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x78zum5 x6s0dn4 xl56j7k xyz6fim x1m6kvgq x16lv2iq"
|
|
166
|
+
},
|
|
167
|
+
3: {
|
|
168
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x16lv2iq"
|
|
169
|
+
},
|
|
170
|
+
11: {
|
|
171
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x78zum5 x6s0dn4 xl56j7k x16lv2iq"
|
|
172
|
+
},
|
|
173
|
+
7: {
|
|
174
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d xyz6fim x1m6kvgq x16lv2iq"
|
|
175
|
+
},
|
|
176
|
+
15: {
|
|
177
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x78zum5 x6s0dn4 xl56j7k xyz6fim x1m6kvgq x16lv2iq"
|
|
137
178
|
}
|
|
138
|
-
}[!!(fit === 'center') << 0],
|
|
179
|
+
}[!!(fit === 'center') << 3 | !!(fit === 'cover' || fit === 'contain') << 2 | !!(fit === 'cover') << 1 | !!(fit === 'contain') << 0],
|
|
139
180
|
children: children
|
|
140
181
|
})
|
|
141
182
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BreadcrumbItem.d.ts","sourceRoot":"","sources":["../../src/Breadcrumbs/BreadcrumbItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACd,KAAK,UAAU,EAChB,MAAM,OAAO,CAAC;AAWf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAErD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,OAAO,
|
|
1
|
+
{"version":3,"file":"BreadcrumbItem.d.ts","sourceRoot":"","sources":["../../src/Breadcrumbs/BreadcrumbItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACd,KAAK,UAAU,EAChB,MAAM,OAAO,CAAC;AAWf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAErD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,OAAO,EAIL,KAAK,gBAAgB,EACtB,MAAM,qCAAqC,CAAC;AAM7C,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,8BAA8B,CAAC;AAOrE,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAC/C,SAAS,CAAC,aAAa,CAAC,EACxB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IAC/B;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/C;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;;;;;;;;;OAaG;IACH,IAAI,CAAC,EAAE,kBAAkB,EAAE,GAAG,SAAS,CAAC;IACxC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,gBAAgB,CAAC;CAC7B;AAsID;;;;;;;;;;;;;GAaG;AACH,wBAAgB,cAAc,CAAC,EAC7B,GAAG,EACH,EAAE,EACF,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,SAAS,EAAE,aAAa,EACxB,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,mBAAmB,qBAgMrB;yBA/Me,cAAc"}
|
|
@@ -37,7 +37,7 @@ import { useListFocus } from "../hooks/useListFocus.js";
|
|
|
37
37
|
import { useTypeahead } from "../hooks/useTypeahead.js";
|
|
38
38
|
import { layerAnimations } from "../Layer/layerAnimations.stylex.js";
|
|
39
39
|
import { renderDropdownItems } from "../DropdownMenu/renderDropdownItems.js";
|
|
40
|
-
import { DropdownMenuContext } from "../DropdownMenu/DropdownMenuContext.js";
|
|
40
|
+
import { DropdownMenuContext, DropdownMenuRootOpenContext } from "../DropdownMenu/DropdownMenuContext.js";
|
|
41
41
|
import { MENU_ITEM_ROLES, MENU_ITEM_SELECTOR, MENU_BOUNDARY_SELECTOR } from "../DropdownMenu/menuItemRoles.js";
|
|
42
42
|
import { useMergedRefs } from "../hooks/useMergedRefs.js";
|
|
43
43
|
// =============================================================================
|
|
@@ -454,7 +454,10 @@ function BreadcrumbMenuTrigger({
|
|
|
454
454
|
}),
|
|
455
455
|
children: /*#__PURE__*/_jsx(DropdownMenuContext, {
|
|
456
456
|
value: contextValue,
|
|
457
|
-
children:
|
|
457
|
+
children: /*#__PURE__*/_jsx(DropdownMenuRootOpenContext, {
|
|
458
|
+
value: popover.isOpen,
|
|
459
|
+
children: menuContent
|
|
460
|
+
})
|
|
458
461
|
})
|
|
459
462
|
}), {
|
|
460
463
|
placement: 'below',
|
|
@@ -158,7 +158,7 @@ export interface CheckboxInputProps extends Omit<BaseProps, 'onChange'> {
|
|
|
158
158
|
* />
|
|
159
159
|
* ```
|
|
160
160
|
*/
|
|
161
|
-
export declare function CheckboxInput({ label, isLabelHidden, description, onChange, changeAction, isLoading, value, isDisabled, htmlName, disabledMessage, isReadOnly, isOptional, isRequired, size, onFocus, onBlur, labelIcon, status, width, xstyle, className, style, ref, 'aria-describedby': ariaDescribedByProp, ...rest }: CheckboxInputProps): import("react").JSX.Element;
|
|
161
|
+
export declare function CheckboxInput({ id: idProp, label, isLabelHidden, description, onChange, changeAction, isLoading, value, isDisabled, htmlName, disabledMessage, isReadOnly, isOptional, isRequired, size, onFocus, onBlur, labelIcon, status, width, xstyle, className, style, ref, 'aria-describedby': ariaDescribedByProp, ...rest }: CheckboxInputProps): import("react").JSX.Element;
|
|
162
162
|
export declare namespace CheckboxInput {
|
|
163
163
|
var displayName: string;
|
|
164
164
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxInput.d.ts","sourceRoot":"","sources":["../../src/CheckboxInput/CheckboxInput.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAOL,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAS3C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AACtC,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAoHhD,QAAA,MAAM,iBAAiB;;;;;;;;;EASrB,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,iBAAiB,CAAC;AAE/D,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACrE,wDAAwD;IACxD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACxE;;OAEG;IACH,YAAY,CAAC,EAAE,CACb,OAAO,EAAE,OAAO,EAChB,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAC7B,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,KAAK,EAAE,OAAO,GAAG,eAAe,CAAC;IACjC;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpD;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACnD;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAOD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,KAAK,EACL,UAAkB,EAClB,QAAQ,EACR,eAAe,EACf,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,IAAW,EACX,OAAO,EACP,MAAM,EACN,SAAS,EACT,MAAM,EACN,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,kBAAkB,EAAE,mBAAmB,EACvC,GAAG,IAAI,EACR,EAAE,kBAAkB,+
|
|
1
|
+
{"version":3,"file":"CheckboxInput.d.ts","sourceRoot":"","sources":["../../src/CheckboxInput/CheckboxInput.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAOL,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAS3C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AACtC,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAoHhD,QAAA,MAAM,iBAAiB;;;;;;;;;EASrB,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,iBAAiB,CAAC;AAE/D,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACrE,wDAAwD;IACxD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACxE;;OAEG;IACH,YAAY,CAAC,EAAE,CACb,OAAO,EAAE,OAAO,EAChB,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAC7B,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,KAAK,EAAE,OAAO,GAAG,eAAe,CAAC;IACjC;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpD;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACnD;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAOD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,EAAE,EAAE,MAAM,EACV,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,KAAK,EACL,UAAkB,EAClB,QAAQ,EACR,eAAe,EACf,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,IAAW,EACX,OAAO,EACP,MAAM,EACN,SAAS,EACT,MAAM,EACN,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,kBAAkB,EAAE,mBAAmB,EACvC,GAAG,IAAI,EACR,EAAE,kBAAkB,+BAkOpB;yBA7Pe,aAAa"}
|
|
@@ -132,6 +132,7 @@ const dynamicWidthStyles = {
|
|
|
132
132
|
* ```
|
|
133
133
|
*/
|
|
134
134
|
export function CheckboxInput({
|
|
135
|
+
id: idProp,
|
|
135
136
|
label,
|
|
136
137
|
isLabelHidden = false,
|
|
137
138
|
description,
|
|
@@ -161,7 +162,8 @@ export function CheckboxInput({
|
|
|
161
162
|
// The row is the pressable: the overlay's pressed arm reads the row's
|
|
162
163
|
// scope marker, the way the indicator's hover tint does.
|
|
163
164
|
const pressable = usePressFeedback();
|
|
164
|
-
const
|
|
165
|
+
const generatedId = useId();
|
|
166
|
+
const id = idProp || generatedId;
|
|
165
167
|
const descriptionID = useId();
|
|
166
168
|
const statusMessageID = useId();
|
|
167
169
|
// Announce the effective required state (form default included) while the
|
|
@@ -14,7 +14,15 @@
|
|
|
14
14
|
*/
|
|
15
15
|
import { type ReactNode } from 'react';
|
|
16
16
|
import type { BaseProps } from '../BaseProps';
|
|
17
|
+
import type { ItemAlign } from '../Item';
|
|
17
18
|
export interface CheckboxListItemProps extends BaseProps<HTMLLIElement> {
|
|
19
|
+
/**
|
|
20
|
+
* Vertical alignment of the start and end content against the label,
|
|
21
|
+
* forwarded to Item. Use `first-line` to keep the checkbox level with the
|
|
22
|
+
* first line of a wrapped label.
|
|
23
|
+
* @default 'center'
|
|
24
|
+
*/
|
|
25
|
+
align?: ItemAlign;
|
|
18
26
|
/**
|
|
19
27
|
* Primary text label for the item.
|
|
20
28
|
*
|
|
@@ -120,7 +128,7 @@ export interface CheckboxListItemProps extends BaseProps<HTMLLIElement> {
|
|
|
120
128
|
* />
|
|
121
129
|
* ```
|
|
122
130
|
*/
|
|
123
|
-
export declare function CheckboxListItem({ label, 'aria-label': ariaLabel, value, description, endContent, isDisabled: isItemDisabled, isLoading: isItemLoading, isChecked, onCheck, ref, xstyle, className, style, onClick: onClickProp, ...restProps }: CheckboxListItemProps): import("react").JSX.Element;
|
|
131
|
+
export declare function CheckboxListItem({ label, 'aria-label': ariaLabel, value, description, endContent, isDisabled: isItemDisabled, isLoading: isItemLoading, isChecked, onCheck, ref, xstyle, className, style, onClick: onClickProp, align, ...restProps }: CheckboxListItemProps): import("react").JSX.Element;
|
|
124
132
|
export declare namespace CheckboxListItem {
|
|
125
133
|
var displayName: string;
|
|
126
134
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxListItem.d.ts","sourceRoot":"","sources":["../../src/CheckboxList/CheckboxListItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAqB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAIzD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"CheckboxListItem.d.ts","sourceRoot":"","sources":["../../src/CheckboxList/CheckboxListItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAqB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAIzD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,SAAS,CAAC;AAgBvC,MAAM,WAAW,qBAAsB,SAAQ,SAAS,CAAC,aAAa,CAAC;IACrE;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;;;;;;;OAaG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;OAKG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC;IACtC;;;;OAIG;IACH,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;CAChC;AA4BD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,WAAW,EACX,UAAU,EACV,UAAU,EAAE,cAAsB,EAClC,SAAS,EAAE,aAAqB,EAChC,SAAS,EACT,OAAO,EACP,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,KAAK,EACL,GAAG,SAAS,EACb,EAAE,qBAAqB,+BA6IvB;yBA9Je,gBAAgB"}
|
|
@@ -26,11 +26,11 @@ import { ListContext } from "../List/ListContext.js";
|
|
|
26
26
|
import { CheckboxListContext } from "./CheckboxListContext.js";
|
|
27
27
|
import { useTranslator } from "../i18n/index.js";
|
|
28
28
|
import { ItemDescriptionContext } from "../Item/ItemDescriptionContext.js";
|
|
29
|
-
|
|
29
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
30
30
|
// =============================================================================
|
|
31
31
|
// Styles
|
|
32
32
|
// =============================================================================
|
|
33
|
-
|
|
33
|
+
|
|
34
34
|
const styles = {
|
|
35
35
|
selected: {
|
|
36
36
|
kWkggS: "xgcxg3y",
|
|
@@ -103,6 +103,7 @@ export function CheckboxListItem({
|
|
|
103
103
|
className,
|
|
104
104
|
style,
|
|
105
105
|
onClick: onClickProp,
|
|
106
|
+
align,
|
|
106
107
|
...restProps
|
|
107
108
|
}) {
|
|
108
109
|
const t = useTranslator();
|
|
@@ -193,6 +194,7 @@ export function CheckboxListItem({
|
|
|
193
194
|
}) : label,
|
|
194
195
|
description: description,
|
|
195
196
|
endContent: endContent,
|
|
197
|
+
align: align,
|
|
196
198
|
isDisabled: effectiveDisabled
|
|
197
199
|
// Delegate row clicks to the checkbox instead of wiring onClick (which
|
|
198
200
|
// would add an invisible row button = a second tab stop). The checkbox
|
|
@@ -68,7 +68,7 @@ export interface CommandPaletteInputProps extends Omit<BaseProps<HTMLInputElemen
|
|
|
68
68
|
* </CommandPalette>
|
|
69
69
|
* ```
|
|
70
70
|
*/
|
|
71
|
-
export declare function CommandPaletteInput({ value: controlledValue, onValueChange, placeholder: placeholderFromProps, label, hasAutoFocus, endContent, onChange, onKeyDown, ref, xstyle, className, style, ...props }: CommandPaletteInputProps): import("react").JSX.Element;
|
|
71
|
+
export declare function CommandPaletteInput({ value: controlledValue, onValueChange, placeholder: placeholderFromProps, label, hasAutoFocus, endContent, onChange, onKeyDown, onFocus, onBlur, ref, xstyle, className, style, ...props }: CommandPaletteInputProps): import("react").JSX.Element;
|
|
72
72
|
export declare namespace CommandPaletteInput {
|
|
73
73
|
var displayName: string;
|
|
74
74
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CommandPaletteInput.d.ts","sourceRoot":"","sources":["../../src/CommandPalette/CommandPaletteInput.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;GAUG;AAEH,OAAO,
|
|
1
|
+
{"version":3,"file":"CommandPaletteInput.d.ts","sourceRoot":"","sources":["../../src/CommandPalette/CommandPaletteInput.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;GAUG;AAEH,OAAO,EAA2C,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAa/E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAsE5C,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CACpD,SAAS,CAAC,gBAAgB,CAAC,EAC3B,UAAU,CACX;IACC,iEAAiE;IACjE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAElC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAExC;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;;OAIG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;CACvD;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,KAAK,EAAE,eAAe,EACtB,aAAa,EACb,WAAW,EAAE,oBAAoB,EACjC,KAAK,EACL,YAAmB,EACnB,UAAU,EACV,QAAQ,EACR,SAAS,EACT,OAAO,EACP,MAAM,EACN,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,wBAAwB,+BAmK1B;yBAnLe,mBAAmB"}
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
* - /apps/storybook/stories/CommandPaletteInput.stories.tsx
|
|
14
14
|
* - /packages/cli/assets/templates/blocks/components/CommandPalette/ (showcase blocks)
|
|
15
15
|
*/
|
|
16
|
-
import { useCallback, useEffect, useRef } from 'react';
|
|
16
|
+
import { useCallback, useEffect, useRef, useState } from 'react';
|
|
17
17
|
import * as stylex from '@stylexjs/stylex';
|
|
18
18
|
import { Icon } from "../Icon/index.js";
|
|
19
19
|
import { Spinner } from "../Spinner/index.js";
|
|
@@ -23,6 +23,8 @@ import { colorVars, typeScaleVars, spacingVars, typographyVars } from "../theme/
|
|
|
23
23
|
import { useCommandPaletteContext } from "./CommandPaletteContext.js";
|
|
24
24
|
import { useDialogContext } from "../Dialog/DialogContext.js";
|
|
25
25
|
import { themeProps } from "../utils/themeProps.js";
|
|
26
|
+
import { focusOutlineProps } from "../utils/focusOutline.stylex.js";
|
|
27
|
+
import { getInteractionModality, useInteractionModalityTracking } from "../utils/interactionModality.js";
|
|
26
28
|
import { useTranslator } from "../i18n/index.js";
|
|
27
29
|
import { useMergedRefs } from "../hooks/useMergedRefs.js";
|
|
28
30
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
@@ -35,6 +37,20 @@ const styles = {
|
|
|
35
37
|
k8WAf4: "x8o8v82",
|
|
36
38
|
kmuXW: "x2lah0s",
|
|
37
39
|
$$css: true
|
|
40
|
+
},
|
|
41
|
+
input: {
|
|
42
|
+
kUk6DE: "x98rzlu",
|
|
43
|
+
k7Eaqz: "xeuugli",
|
|
44
|
+
kMzoRj: "xc342km",
|
|
45
|
+
ksu8eU: "xng3xce",
|
|
46
|
+
kWkggS: "xjbqb8w",
|
|
47
|
+
kMwMTN: "x1tgivj0",
|
|
48
|
+
kMv6JI: "x9ynric",
|
|
49
|
+
kGuDYH: "xjm74w1 xf9zqsd",
|
|
50
|
+
kLWn49: "xw6l6zx",
|
|
51
|
+
kmVPX3: "x1717udv",
|
|
52
|
+
k8Qsv1: "xeyghm5",
|
|
53
|
+
$$css: true
|
|
38
54
|
}
|
|
39
55
|
};
|
|
40
56
|
/**
|
|
@@ -65,6 +81,8 @@ export function CommandPaletteInput({
|
|
|
65
81
|
endContent,
|
|
66
82
|
onChange,
|
|
67
83
|
onKeyDown,
|
|
84
|
+
onFocus,
|
|
85
|
+
onBlur,
|
|
68
86
|
ref,
|
|
69
87
|
xstyle,
|
|
70
88
|
className,
|
|
@@ -79,6 +97,20 @@ export function CommandPaletteInput({
|
|
|
79
97
|
const hasListbox = ctx ? ctx.selectableItems.length > 0 : true;
|
|
80
98
|
const dialogContext = useDialogContext();
|
|
81
99
|
const inputRef = useRef(null);
|
|
100
|
+
const [isKeyboardFocus, setIsKeyboardFocus] = useState(false);
|
|
101
|
+
|
|
102
|
+
// Text-entry controls match :focus-visible after pointer focus in Chromium.
|
|
103
|
+
// Keep the shared selector, but narrow its ring to focus acquired through
|
|
104
|
+
// keyboard navigation so a click or pointer-opened palette stays unringed.
|
|
105
|
+
useInteractionModalityTracking();
|
|
106
|
+
const handleFocus = useCallback(event => {
|
|
107
|
+
setIsKeyboardFocus(getInteractionModality() === 'keyboard');
|
|
108
|
+
onFocus?.(event);
|
|
109
|
+
}, [onFocus]);
|
|
110
|
+
const handleBlur = useCallback(event => {
|
|
111
|
+
setIsKeyboardFocus(false);
|
|
112
|
+
onBlur?.(event);
|
|
113
|
+
}, [onBlur]);
|
|
82
114
|
|
|
83
115
|
// Use context values as fallback
|
|
84
116
|
const value = controlledValue ?? ctx?.search;
|
|
@@ -134,9 +166,7 @@ export function CommandPaletteInput({
|
|
|
134
166
|
}), /*#__PURE__*/_jsx("input", {
|
|
135
167
|
...props,
|
|
136
168
|
ref: useMergedRefs(ref, inputRef),
|
|
137
|
-
...
|
|
138
|
-
className: "x98rzlu xeuugli xc342km xng3xce x1a2a7pz xjbqb8w x1tgivj0 x9ynric xjm74w1 xf9zqsd xw6l6zx x1717udv xeyghm5"
|
|
139
|
-
},
|
|
169
|
+
...(isKeyboardFocus ? focusOutlineProps.focusVisible(styles.input) : focusOutlineProps.suppressed(styles.input)),
|
|
140
170
|
type: "text",
|
|
141
171
|
role: ctx ? 'combobox' : standaloneRole,
|
|
142
172
|
"aria-expanded": ctx ? ctx.isOpen && hasListbox : callerSets('aria-expanded') ? props['aria-expanded'] : callerOwnsPopup || undefined,
|
|
@@ -153,7 +183,9 @@ export function CommandPaletteInput({
|
|
|
153
183
|
handleValueChange?.(e.target.value);
|
|
154
184
|
onChange?.(e);
|
|
155
185
|
},
|
|
156
|
-
onKeyDown: handleKeyDown
|
|
186
|
+
onKeyDown: handleKeyDown,
|
|
187
|
+
onFocus: handleFocus,
|
|
188
|
+
onBlur: handleBlur
|
|
157
189
|
}), (ctx?.isBusy || hasEndContent) && /*#__PURE__*/_jsxs("span", {
|
|
158
190
|
...{
|
|
159
191
|
className: "x78zum5 x6s0dn4 xzye2dw x2lah0s"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../../src/ContextMenu/ContextMenu.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AAEH,OAAO,KASN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../../src/ContextMenu/ContextMenu.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AAEH,OAAO,KASN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAqCrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAGjD,OAAO,KAAK,EACV,kBAAkB,EAClB,oBAAoB,EACpB,uBAAuB,EACvB,mBAAmB,EACpB,MAAM,8BAA8B,CAAC;AAGtC,OAAO,EAEL,KAAK,oBAAoB,EAC1B,MAAM,kCAAkC,CAAC;AA6G1C,MAAM,MAAM,mBAAmB,GAAG,oBAAoB,CAAC;AAEvD,MAAM,MAAM,sBAAsB,GAAG,uBAAuB,CAAC;AAE7D,MAAM,MAAM,kBAAkB,GAAG,mBAAmB,CAAC;AAErD,MAAM,MAAM,iBAAiB,GAAG,kBAAkB,CAAC;AAMnD,UAAU,oBAAqB,SAAQ,SAAS;IAC9C,oDAAoD;IACpD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IAC3B;;;;;OAKG;IACH,aAAa,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IAC9C,+DAA+D;IAC/D,QAAQ,EAAE,SAAS,CAAC;IACpB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,wCAAwC;IACxC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4EAA4E;IAC5E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,oBAAoB,CAAC;IACpC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,UAAU,oBAAqB,SAAQ,oBAAoB;IACzD,gDAAgD;IAChD,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AAED,UAAU,wBAAyB,SAAQ,oBAAoB;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,+CAA+C;IAC/C,WAAW,EAAE,SAAS,CAAC;CACxB;AAED,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,GAAG,wBAAwB,CAAC;AAM/E;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,SAAS,EACT,IAAW,EACX,KAAK,EAAE,cAAc,EACrB,UAAkB,EAClB,YAAY,EACZ,YAAwB,EACxB,SAAiB,EACjB,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,aAAa,EACb,aAAa,EAAE,iBAAiB,EAChC,YAAY,EAAE,gBAAgB,EAC9B,WAAW,EAAE,eAAe,EAC5B,UAAU,EAAE,cAAc,EAC1B,aAAa,EAAE,iBAAiB,EAChC,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,gBAAgB,qBAselB;yBA3fe,WAAW"}
|
|
@@ -43,7 +43,7 @@ import { LayerDepthProvider } from "../Layer/LayerDepthContext.js";
|
|
|
43
43
|
import { useLayerDismissal } from "../Layer/useLayerDismissal.js";
|
|
44
44
|
import { MenuBottomSheetActionList } from "../DropdownMenu/MenuBottomSheetActionList.js";
|
|
45
45
|
import { renderDropdownItems } from "../DropdownMenu/renderDropdownItems.js";
|
|
46
|
-
import { DropdownMenuContext } from "../DropdownMenu/DropdownMenuContext.js";
|
|
46
|
+
import { DropdownMenuContext, DropdownMenuRootOpenContext } from "../DropdownMenu/DropdownMenuContext.js";
|
|
47
47
|
import { MENU_ITEM_ROLES, MENU_ITEM_SELECTOR, MENU_BOUNDARY_SELECTOR, activateMenuItem } from "../DropdownMenu/menuItemRoles.js";
|
|
48
48
|
import { useMenuOverflow } from "../DropdownMenu/useMenuOverflow.js";
|
|
49
49
|
import { useMenuDrillIn } from "../DropdownMenu/useMenuDrillIn.js";
|
|
@@ -505,7 +505,10 @@ export function ContextMenu({
|
|
|
505
505
|
...mergeProps(themeProps('context-menu'), stylex.props(usesBottomSheet ? styles.sheetMenu : styles.menu, !usesBottomSheet && (hasOverflow ? styles.touchPanYPinchZoom : styles.touchPinchZoom), xstyle), className, style),
|
|
506
506
|
children: /*#__PURE__*/_jsx(DropdownMenuContext, {
|
|
507
507
|
value: contextValue,
|
|
508
|
-
children:
|
|
508
|
+
children: /*#__PURE__*/_jsx(DropdownMenuRootOpenContext, {
|
|
509
|
+
value: isOpen,
|
|
510
|
+
children: resolvedMenuContent
|
|
511
|
+
})
|
|
509
512
|
})
|
|
510
513
|
});
|
|
511
514
|
const renderedBottomSheetContent = itemsProp !== undefined ? /*#__PURE__*/_jsxs("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../src/Dialog/Dialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,
|
|
1
|
+
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../src/Dialog/Dialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA2B5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAMhD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,SAAS,CAAC;AAyB9C;;;;;;GAMG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,gBAAgB,CAAC;AAEnD;;;;;GAKG;AACH,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,CAAC;AAEzD,4EAA4E;AAC5E,UAAU,mBAAmB;IAC3B,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC1B;AAED;;;;;GAKG;AACH,MAAM,WAAW,cAAe,SAAQ,mBAAmB;IACzD,6EAA6E;IAC7E,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,yEAAyE;IACzE,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB;AAuBD,2FAA2F;AAC3F,eAAO,MAAM,uCAAuC;;;;;;;;;;;CAW1C,CAAC;AAoJX;;;;;;;;;GASG;AACH,wBAAgB,4BAA4B,CAAC,QAAQ,EAAE,cAAc;;;;;EAUpE;AAED,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC/D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;OAOG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAC;IAE3C;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE5B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC;IAEpC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,MAAM,CAAC,EACrB,MAAM,EACN,QAAgB,EAChB,YAAY,EACZ,KAAW,EACX,SAAmB,EACnB,QAAQ,EACR,OAAoB,EACpB,OAAgB,EAChB,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,sCAuVb;yBAvWe,MAAM"}
|
package/dist/Dialog/Dialog.js
CHANGED
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
* - /apps/storybook/stories/Dialog.stories.tsx (storybook stories)
|
|
28
28
|
* - /packages/cli/assets/templates/blocks/components/Dialog/ (showcase blocks)
|
|
29
29
|
*/
|
|
30
|
-
import { useCallback, useEffect, useId, useMemo, useRef } from 'react';
|
|
30
|
+
import { useCallback, useEffect, useId, useLayoutEffect, useMemo, useRef } from 'react';
|
|
31
31
|
import * as stylex from '@stylexjs/stylex';
|
|
32
32
|
import { useScrollLock } from "../hooks/useScrollLock.js";
|
|
33
33
|
import { layerTextReset } from "../Layer/layerTextReset.stylex.js";
|
|
@@ -348,11 +348,25 @@ export function Dialog({
|
|
|
348
348
|
}, [titleId, hasConsumerName]);
|
|
349
349
|
const mergedDialogRef = useMergedRefs(ref, attachDialog);
|
|
350
350
|
|
|
351
|
-
// Capture the element that was focused when the dialog opened,
|
|
352
|
-
//
|
|
351
|
+
// Capture the element that was focused when the dialog opened, for
|
|
352
|
+
// directional animation origin and focus restoration on close.
|
|
353
353
|
const triggerElementRef = useRef(null);
|
|
354
354
|
useInteractionModalityTracking();
|
|
355
355
|
|
|
356
|
+
// This runs in a layout effect so the capture lands before any descendant's
|
|
357
|
+
// passive mount effect: all layout effects run before any passive effect,
|
|
358
|
+
// while a child's passive effect runs before this parent's passive effect.
|
|
359
|
+
// Content that mounts in the open commit — e.g. a DialogHeader focusing its
|
|
360
|
+
// own title on mount — would otherwise move document.activeElement inside
|
|
361
|
+
// the dialog before the capture ran, and closing would then restore focus
|
|
362
|
+
// to a detached node, stranding the user's focus on <body>.
|
|
363
|
+
useLayoutEffect(() => {
|
|
364
|
+
if (isInline || !isOpen) {
|
|
365
|
+
return;
|
|
366
|
+
}
|
|
367
|
+
triggerElementRef.current = document.activeElement;
|
|
368
|
+
}, [isOpen, isInline]);
|
|
369
|
+
|
|
356
370
|
// Derive dismissal behavior from purpose
|
|
357
371
|
const allowEscape = purpose !== 'required';
|
|
358
372
|
const allowBackdropClick = purpose === 'info';
|
|
@@ -367,11 +381,9 @@ export function Dialog({
|
|
|
367
381
|
return;
|
|
368
382
|
}
|
|
369
383
|
if (isOpen) {
|
|
370
|
-
//
|
|
371
|
-
//
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
// Set directional CSS custom properties before opening
|
|
384
|
+
// Set directional CSS custom properties before opening. The trigger was
|
|
385
|
+
// captured by the layout effect above, before any descendant effect
|
|
386
|
+
// could move focus.
|
|
375
387
|
const trigger = triggerElementRef.current;
|
|
376
388
|
if (trigger && trigger !== document.body) {
|
|
377
389
|
const dir = getDialogDirection(trigger);
|