@astryxdesign/core 0.7.2-canary.d150f78 → 0.7.2-canary.d216097

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.
Files changed (169) hide show
  1. package/dist/AppShell/AppShell.d.ts.map +1 -1
  2. package/dist/AppShell/AppShell.js +40 -1
  3. package/dist/AspectRatio/AspectRatio.d.ts +6 -8
  4. package/dist/AspectRatio/AspectRatio.d.ts.map +1 -1
  5. package/dist/AspectRatio/AspectRatio.js +44 -3
  6. package/dist/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
  7. package/dist/Breadcrumbs/BreadcrumbItem.js +5 -2
  8. package/dist/Chat/ChatLayoutScrollButton.d.ts.map +1 -1
  9. package/dist/Chat/ChatLayoutScrollButton.js +1 -0
  10. package/dist/CommandPalette/CommandPaletteInput.d.ts +1 -1
  11. package/dist/CommandPalette/CommandPaletteInput.d.ts.map +1 -1
  12. package/dist/CommandPalette/CommandPaletteInput.js +37 -5
  13. package/dist/ContextMenu/ContextMenu.d.ts.map +1 -1
  14. package/dist/ContextMenu/ContextMenu.js +5 -2
  15. package/dist/DropdownMenu/DropdownMenu.d.ts +1 -1
  16. package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
  17. package/dist/DropdownMenu/DropdownMenu.js +82 -10
  18. package/dist/DropdownMenu/DropdownMenuContext.d.ts +17 -0
  19. package/dist/DropdownMenu/DropdownMenuContext.d.ts.map +1 -1
  20. package/dist/DropdownMenu/DropdownMenuContext.js +21 -0
  21. package/dist/DropdownMenu/DropdownMenuGroup.d.ts +6 -4
  22. package/dist/DropdownMenu/DropdownMenuGroup.d.ts.map +1 -1
  23. package/dist/DropdownMenu/DropdownMenuGroup.js +4 -3
  24. package/dist/DropdownMenu/DropdownMenuSubMenu.d.ts.map +1 -1
  25. package/dist/DropdownMenu/DropdownMenuSubMenu.js +15 -4
  26. package/dist/DropdownMenu/lazyMenuBottomSheet.d.ts +24 -0
  27. package/dist/DropdownMenu/lazyMenuBottomSheet.d.ts.map +1 -0
  28. package/dist/DropdownMenu/lazyMenuBottomSheet.js +46 -0
  29. package/dist/EmptyState/EmptyState.d.ts.map +1 -1
  30. package/dist/EmptyState/EmptyState.js +4 -10
  31. package/dist/Field/Field.d.ts +1 -1
  32. package/dist/Field/Field.d.ts.map +1 -1
  33. package/dist/Field/Field.js +8 -4
  34. package/dist/Grid/GridSpan.d.ts.map +1 -1
  35. package/dist/Grid/GridSpan.js +1 -0
  36. package/dist/Heading/Heading.d.ts.map +1 -1
  37. package/dist/Heading/Heading.js +4 -2
  38. package/dist/MetadataList/MetadataList.d.ts.map +1 -1
  39. package/dist/MetadataList/MetadataList.js +5 -1
  40. package/dist/MetadataList/MetadataListContext.d.ts +1 -1
  41. package/dist/MetadataList/MetadataListContext.d.ts.map +1 -1
  42. package/dist/MobileNav/MobileNav.d.ts +9 -0
  43. package/dist/MobileNav/MobileNav.d.ts.map +1 -1
  44. package/dist/MobileNav/MobileNav.js +30 -3
  45. package/dist/RadioList/RadioList.d.ts +1 -1
  46. package/dist/RadioList/RadioList.d.ts.map +1 -1
  47. package/dist/RadioList/RadioList.js +6 -2
  48. package/dist/SideNav/SideNavItem.d.ts +8 -1
  49. package/dist/SideNav/SideNavItem.d.ts.map +1 -1
  50. package/dist/SideNav/SideNavItem.js +71 -9
  51. package/dist/Text/Text.d.ts.map +1 -1
  52. package/dist/Text/Text.js +4 -2
  53. package/dist/ToggleButton/ToggleButton.d.ts +3 -2
  54. package/dist/ToggleButton/ToggleButton.d.ts.map +1 -1
  55. package/dist/ToggleButton/ToggleButton.js +12 -1
  56. package/dist/TopNav/TopNavMegaMenu.d.ts.map +1 -1
  57. package/dist/TopNav/TopNavMegaMenu.js +3 -3
  58. package/dist/TopNav/TopNavMenu.d.ts.map +1 -1
  59. package/dist/TopNav/TopNavMenu.js +3 -3
  60. package/dist/TreeList/TreeList.d.ts.map +1 -1
  61. package/dist/TreeList/TreeList.js +1 -0
  62. package/dist/TreeList/TreeListBranches.d.ts.map +1 -1
  63. package/dist/TreeList/TreeListBranches.js +2 -2
  64. package/dist/TreeList/TreeListItem.d.ts.map +1 -1
  65. package/dist/TreeList/TreeListItem.js +57 -9
  66. package/dist/astryx.css +16 -1
  67. package/dist/hooks/useMenuHover.d.ts.map +1 -1
  68. package/dist/hooks/useMenuHover.js +18 -13
  69. package/package.json +3 -3
  70. package/scripts/agent-doc-state.mjs +38 -0
  71. package/scripts/postinstall.mjs +1 -1
  72. package/src/AppShell/AppShell.tsx +45 -1
  73. package/src/AspectRatio/AspectRatio.test.tsx +44 -43
  74. package/src/AspectRatio/AspectRatio.tsx +38 -18
  75. package/src/AspectRatio/__tests__/AspectRatioFitLayers.a11y.browser.spec.ts +157 -0
  76. package/src/Avatar/Avatar.doc.mjs +5 -3
  77. package/src/AvatarGroup/AvatarGroup.doc.mjs +3 -2
  78. package/src/Breadcrumbs/BreadcrumbItem.tsx +4 -1
  79. package/src/Breadcrumbs/Breadcrumbs.test.tsx +30 -1
  80. package/src/Card/Card.doc.mjs +1 -1
  81. package/src/Chat/ChatLayoutScrollButton.test.tsx +13 -0
  82. package/src/Chat/ChatLayoutScrollButton.tsx +4 -2
  83. package/src/Chat/__tests__/ChatLayoutScrollButton.a11y.chromium.spec.ts +64 -19
  84. package/src/Chat/__tests__/ChatMessageMetadata.a11y.chromium.spec.ts +3 -1
  85. package/src/Code/Code.doc.mjs +1 -0
  86. package/src/CommandPalette/CommandPalette.doc.mjs +2 -0
  87. package/src/CommandPalette/CommandPaletteInput.test.tsx +53 -4
  88. package/src/CommandPalette/CommandPaletteInput.tsx +33 -3
  89. package/src/CommandPalette/__tests__/CommandPaletteInputAudit.a11y.chromium.spec.ts +335 -0
  90. package/src/CommandPalette/__tests__/CommandPaletteItemAudit.a11y.chromium.spec.ts +292 -0
  91. package/src/ContextMenu/ContextMenu.doc.mjs +2 -3
  92. package/src/ContextMenu/ContextMenu.test.tsx +6 -1
  93. package/src/ContextMenu/ContextMenu.tsx +4 -1
  94. package/src/ContextMenu/__tests__/ContextMenuAudit.a11y.chromium.spec.ts +438 -0
  95. package/src/Drawer/Drawer.doc.mjs +1 -0
  96. package/src/DropdownMenu/DropdownMenu.ssr.test.tsx +57 -0
  97. package/src/DropdownMenu/DropdownMenu.test.tsx +58 -6
  98. package/src/DropdownMenu/DropdownMenu.tsx +81 -10
  99. package/src/DropdownMenu/DropdownMenuContext.tsx +24 -0
  100. package/src/DropdownMenu/DropdownMenuDivider.spec.md +192 -0
  101. package/src/DropdownMenu/DropdownMenuGroup.doc.mjs +169 -10
  102. package/src/DropdownMenu/DropdownMenuGroup.tsx +6 -4
  103. package/src/DropdownMenu/DropdownMenuLazySheet.test.tsx +126 -0
  104. package/src/DropdownMenu/DropdownMenuSubMenu.test.tsx +185 -0
  105. package/src/DropdownMenu/DropdownMenuSubMenu.tsx +17 -3
  106. package/src/DropdownMenu/__tests__/DropdownMenuDividerAudit.a11y.chromium.spec.ts +280 -0
  107. package/src/DropdownMenu/__tests__/DropdownMenuGroupAudit.a11y.chromium.spec.ts +334 -0
  108. package/src/DropdownMenu/__tests__/warmMenuBottomSheet.tsx +43 -0
  109. package/src/DropdownMenu/lazyMenuBottomSheet.ts +71 -0
  110. package/src/EmptyState/EmptyState.doc.mjs +3 -2
  111. package/src/EmptyState/EmptyState.spec.md +189 -0
  112. package/src/EmptyState/EmptyState.test.tsx +74 -3
  113. package/src/EmptyState/EmptyState.tsx +4 -8
  114. package/src/Field/Field.doc.mjs +14 -8
  115. package/src/Field/Field.spec.md +217 -0
  116. package/src/Field/Field.test.tsx +60 -2
  117. package/src/Field/Field.tsx +17 -8
  118. package/src/Field/FieldLabel.doc.mjs +133 -26
  119. package/src/Field/FieldLabel.spec.md +172 -0
  120. package/src/Field/__tests__/FieldLabelAudit.a11y.chromium.spec.ts +296 -0
  121. package/src/Grid/GridSpan.tsx +3 -0
  122. package/src/Heading/Heading.test.tsx +57 -0
  123. package/src/Heading/Heading.tsx +6 -2
  124. package/src/Icon/Icon.doc.mjs +36 -0
  125. package/src/Layout/LayoutHeader.doc.mjs +5 -0
  126. package/src/MetadataList/MetadataList.doc.mjs +3 -3
  127. package/src/MetadataList/MetadataList.test.tsx +38 -0
  128. package/src/MetadataList/MetadataList.tsx +8 -1
  129. package/src/MetadataList/MetadataListContext.tsx +1 -1
  130. package/src/MobileNav/MobileNav.tsx +30 -3
  131. package/src/MobileNav/MobileNavCloseEdgeCases.test.tsx +173 -15
  132. package/src/MoreMenu/MoreMenu.test.tsx +5 -1
  133. package/src/ProgressBar/ProgressBar.doc.mjs +1 -0
  134. package/src/RadioList/RadioList.fr10.test.tsx +45 -2
  135. package/src/RadioList/RadioList.tsx +4 -1
  136. package/src/Resizable/useResizable.doc.mjs +2 -0
  137. package/src/ScrollableArea/ScrollableArea.doc.mjs +1 -1
  138. package/src/SideNav/SideNav.spec.md +227 -0
  139. package/src/SideNav/SideNav.test.tsx +179 -0
  140. package/src/SideNav/SideNavItem.doc.mjs +2 -2
  141. package/src/SideNav/SideNavItem.tsx +96 -17
  142. package/src/Slider/Slider.spec.md +39 -18
  143. package/src/Spinner/Spinner.doc.mjs +1 -1
  144. package/src/Text/Text.test.tsx +57 -0
  145. package/src/Text/Text.tsx +6 -2
  146. package/src/TimeInput/TimeInput.fr10.test.tsx +15 -0
  147. package/src/Timestamp/Timestamp.doc.mjs +1 -1
  148. package/src/ToggleButton/ToggleButton.test.tsx +95 -0
  149. package/src/ToggleButton/ToggleButton.tsx +12 -1
  150. package/src/ToggleButton/ToggleButtonGroup.doc.mjs +4 -0
  151. package/src/Toolbar/Toolbar.test.tsx +0 -8
  152. package/src/Toolbar/__tests__/Toolbar.a11y.chromium.spec.ts +163 -0
  153. package/src/Toolbar/__tests__/Toolbar.a11y.renders.tsx +63 -0
  154. package/src/Toolbar/__tests__/Toolbar.a11y.states.ts +142 -0
  155. package/src/Toolbar/__tests__/Toolbar.a11y.test.tsx +126 -0
  156. package/src/TopNav/TopNavMegaMenu.test.tsx +22 -0
  157. package/src/TopNav/TopNavMegaMenu.tsx +7 -3
  158. package/src/TopNav/TopNavMenu.test.tsx +19 -0
  159. package/src/TopNav/TopNavMenu.tsx +11 -3
  160. package/src/TreeList/TreeList.doc.mjs +1 -0
  161. package/src/TreeList/TreeList.test.tsx +327 -6
  162. package/src/TreeList/TreeList.tsx +5 -1
  163. package/src/TreeList/TreeListBranches.tsx +6 -0
  164. package/src/TreeList/TreeListItem.tsx +88 -13
  165. package/src/docPropLiterals.test.ts +36 -10
  166. package/src/hooks/useMenuHover.ts +18 -13
  167. package/src/postinstall.test.mjs +46 -0
  168. package/src/reset.css +0 -29
  169. package/src/theme/derivedVarRegistry.test.ts +4 -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;AAmBf,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;AAwBhD;;;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,qBA6Zf;yBA5ae,QAAQ"}
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: isMobileNavOpen ? 'visible' : 'hidden',
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 sizing ships as zero-specificity baseline rules
84
- * in `reset.css`, keyed on the `data-astryx-aspect-ratio-override`
85
- * attribute the component sets on the child's direct parent. Any styles
86
- * the child sets itself still win, so children that already size
87
- * themselves keep their behavior. When omitted, the child is left
88
- * unstyled (the pre-existing contract). `fit` is structural, not visual,
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;;;;;;;;;;;;GAYG;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;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,GAAG,CAAC,EAAE,cAAc,CAAC;IAErB;;;;;;;OAOG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAgDD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;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,+BA4BlB;yBAtCe,WAAW"}
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
- 1: {
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,EAGL,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"}
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: menuContent
457
+ children: /*#__PURE__*/_jsx(DropdownMenuRootOpenContext, {
458
+ value: popover.isOpen,
459
+ children: menuContent
460
+ })
458
461
  })
459
462
  }), {
460
463
  placement: 'below',
@@ -1 +1 @@
1
- {"version":3,"file":"ChatLayoutScrollButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatLayoutScrollButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,MAAM,WAAW,2BAA4B,SAAQ,IAAI,CACvD,SAAS,CAAC,cAAc,CAAC,EACzB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qCAAqC;IACrC,SAAS,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qBAAqB;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAsED;;;;;;;GAOG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,GAAG,EACH,SAAS,EACT,KAAK,EACL,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,2BAA2B,qBAuC7B;yBAhDe,sBAAsB"}
1
+ {"version":3,"file":"ChatLayoutScrollButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatLayoutScrollButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,MAAM,WAAW,2BAA4B,SAAQ,IAAI,CACvD,SAAS,CAAC,cAAc,CAAC,EACzB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qCAAqC;IACrC,SAAS,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qBAAqB;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAuED;;;;;;;GAOG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,GAAG,EACH,SAAS,EACT,KAAK,EACL,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,2BAA2B,qBAwC7B;yBAjDe,sBAAsB"}
@@ -89,6 +89,7 @@ export function ChatLayoutScrollButton({
89
89
  ...mergeProps(stylex.props(styles.wrapper, xstyle), className, style),
90
90
  ...rest,
91
91
  children: /*#__PURE__*/_jsx("div", {
92
+ inert: !isVisible,
92
93
  ...mergeProps(themeProps('chat-layout-scroll-button'), {
93
94
  0: {
94
95
  className: "xawy1a7 xb3r6kr xjspbzw x1prclbq x14hfi27 x1ueg155 xrgg2z9 xlr8y92 x2rcmwa x12w9bfk xg01cxk x47corl xlshs6z x1jys5uj"
@@ -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,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAarE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAkE5C,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,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,wBAAwB,+BA2I1B;yBAzJe,mBAAmB"}
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;AAoCrC,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,qBAoelB;yBAzfe,WAAW"}
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: resolvedMenuContent
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,6 +1,6 @@
1
1
  /**
2
2
  * @file DropdownMenu.tsx
3
- * @input Uses React, StyleX, usePopover, MenuBottomSheet, Button, List,
3
+ * @input Uses React, StyleX, usePopover, MenuBottomSheet (lazy), Button, List,
4
4
  * useListFocus, and the shared viewport-safe menu-width resolver
5
5
  * @output Exports DropdownMenu with caller-selected popover or bottom-sheet
6
6
  * presentation
@@ -1 +1 @@
1
- {"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenu.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAS,KAAK,WAAW,EAAC,MAAM,WAAW,CAAC;AAKnD,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,oBAAoB,CAAC;AA0B9D,OAAO,EAEL,KAAK,oBAAoB,EAC1B,MAAM,kCAAkC,CAAC;AAO1C,OAAO,KAAK,EAAC,cAAc,EAAE,cAAc,EAAC,MAAM,mBAAmB,CAAC;AAStE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAmQ5C;;;;;;;GAOG;AACH,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAChD,qBAAqB,EACnB,MAAM,GACN,SAAS,GACT,YAAY,GACZ,SAAS,GACT,aAAa,GACb,YAAY,GACZ,kBAAkB,GAClB,MAAM,GACN,QAAQ,GACR,KAAK,CACR;IACC;;;;;;OAMG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,6BAA6B;IAC7B,KAAK,EAAE,SAAS,CAAC;IACjB;;;;OAIG;IACH,KAAK,CAAC,EAAE,kBAAkB,EAAE,CAAC;CAC9B;AAED;;;GAGG;AACH,MAAM,WAAW,uBAAuB;IACtC,IAAI,EAAE,SAAS,CAAC;CACjB;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,SAAS,CAAC;IAChB,0EAA0E;IAC1E,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,oBAAoB,EAAE,CAAC;CAC/B;AAED,MAAM,MAAM,kBAAkB,GAC5B,oBAAoB,GAAG,uBAAuB,GAAG,mBAAmB,CAAC;AAMvE,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;AAEnE,MAAM,MAAM,wBAAwB,GAAG,oBAAoB,CAAC;AAE5D;;;;;;GAMG;AACH,MAAM,WAAW,wBAAwB;IACvC,yEAAyE;IACzE,GAAG,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAC3C,yDAAyD;IACzD,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACxD,cAAc,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/D,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAChE,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC9D,SAAS,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC7D,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACxD,eAAe,EAAE,MAAM,GAAG,QAAQ,CAAC;IACnC,eAAe,EAAE,OAAO,CAAC;IACzB,eAAe,EAAE,MAAM,CAAC;CACzB;AAED,UAAU,qBAAsB,SAAQ,SAAS;IAC/C;;;OAGG;IACH,MAAM,CAAC,EAAE,uBAAuB,CAAC;IACjC;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,KAAK,SAAS,CAAC;IAC/D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,UAAU,qBAAsB,SAAQ,qBAAqB;IAC3D;;;;;OAKG;IACH,YAAY,CAAC,EAAE,wBAAwB,CAAC;IACxC,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,UAAU,yBAA0B,SAAQ,qBAAqB;IAC/D,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,MAAM,iBAAiB,GAC3B,qBAAqB,GAAG,yBAAyB,CAAC;AAiuCpD,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,qBA4CpD;yBA5Ce,YAAY"}
@@ -4,7 +4,7 @@
4
4
 
5
5
  /**
6
6
  * @file DropdownMenu.tsx
7
- * @input Uses React, StyleX, usePopover, MenuBottomSheet, Button, List,
7
+ * @input Uses React, StyleX, usePopover, MenuBottomSheet (lazy), Button, List,
8
8
  * useListFocus, and the shared viewport-safe menu-width resolver
9
9
  * @output Exports DropdownMenu with caller-selected popover or bottom-sheet
10
10
  * presentation
@@ -42,7 +42,7 @@ import { Heading } from "../Heading/index.js";
42
42
  import { Icon } from "../Icon/index.js";
43
43
  import { renderDropdownItems } from "./renderDropdownItems.js";
44
44
  import { MENU_ITEM_ROLES, MENU_ITEM_SELECTOR, MENU_BOUNDARY_SELECTOR, activateMenuItem } from "./menuItemRoles.js";
45
- import { DropdownMenuContext } from "./DropdownMenuContext.js";
45
+ import { DropdownMenuContext, DropdownMenuRootOpenContext } from "./DropdownMenuContext.js";
46
46
  import { useIsomorphicLayoutEffect } from "../hooks/useIsomorphicLayoutEffect.js";
47
47
  import { useListFocus } from "../hooks/useListFocus.js";
48
48
  import { useMenuPress } from "../hooks/useMenuPress.js";
@@ -58,8 +58,8 @@ import { resolveMenuWidth } from "./menuWidth.js";
58
58
  import "../Layer/layerViewportInset.stylex.js";
59
59
  import { layerViewportInset } from "../Layer/layerViewportInset.stylex.js";
60
60
  import { useAdaptivePresentation } from "../hooks/useAdaptivePresentation.js";
61
- import { MenuBottomSheet } from "./MenuBottomSheet.js";
62
- import { MenuBottomSheetActionList } from "./MenuBottomSheetActionList.js";
61
+ // Loaded on demand: only the bottom-sheet presentation renders the sheet.
62
+ import { MenuBottomSheet, MenuBottomSheetActionList } from "./lazyMenuBottomSheet.js";
63
63
  import { layerAnimations } from "../Layer/layerAnimations.stylex.js";
64
64
  import "../theme/tokens.stylex.js";
65
65
  import { spacingVars, colorVars, radiusVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
@@ -491,12 +491,41 @@ function DropdownMenuBottomSheet({
491
491
  if (!isOpen || openModalityRef.current !== 'keyboard') {
492
492
  return;
493
493
  }
494
- const frame = requestAnimationFrame(() => {
495
- actionListRef.current?.querySelector('button:not(:disabled), a[href]')?.focus({
496
- preventScroll: true
494
+ const findFirstAction = () => actionListRef.current?.querySelector('button:not(:disabled), a[href]') ?? null;
495
+ let observer = null;
496
+ let frame = requestAnimationFrame(() => {
497
+ const action = findFirstAction();
498
+ if (action != null) {
499
+ action.focus({
500
+ preventScroll: true
501
+ });
502
+ return;
503
+ }
504
+ // The sheet loads on demand, so a keyboard open can arrive before its
505
+ // rows exist. Wait for them, then focus a frame later so the sheet's
506
+ // own open-focus has already run.
507
+ observer = new MutationObserver(() => {
508
+ const loaded = findFirstAction();
509
+ if (loaded == null) {
510
+ return;
511
+ }
512
+ observer?.disconnect();
513
+ observer = null;
514
+ frame = requestAnimationFrame(() => {
515
+ loaded.focus({
516
+ preventScroll: true
517
+ });
518
+ });
519
+ });
520
+ observer.observe(document.body, {
521
+ childList: true,
522
+ subtree: true
497
523
  });
498
524
  });
499
- return () => cancelAnimationFrame(frame);
525
+ return () => {
526
+ cancelAnimationFrame(frame);
527
+ observer?.disconnect();
528
+ };
500
529
  }, [currentItems, isOpen]);
501
530
  useEffect(() => {
502
531
  if (!isOpen) {
@@ -693,6 +722,43 @@ function DropdownMenuPopover({
693
722
  // above it ends the gesture in flight through this ref.
694
723
  const cancelMenuPressRef = useRef(() => {});
695
724
 
725
+ // Submenu flyouts are `popover="manual"` elements nested inside the menu's
726
+ // `popover="auto"` element, so the browser's light dismiss of the menu never
727
+ // reaches them: without a sweep they keep their open state and their
728
+ // top-layer entry while the menu is hidden, and re-anchor to the viewport
729
+ // corner when the menu reopens (#6893). Closing them through the popover
730
+ // API lets useLayer's toggle handling reset their state. Only flyouts that
731
+ // are actually open are touched: `:popover-open` ships wherever
732
+ // `hidePopover` does (they are one API), and the display fallback keeps its
733
+ // own open signal (`display: block`) so it is guarded the same way.
734
+ const hideOpenFlyouts = useCallback(() => {
735
+ const menuPopover = contentRef.current;
736
+ if (!menuPopover) {
737
+ return;
738
+ }
739
+ // Innermost first: hiding a flyout may unmount the flyouts nested inside
740
+ // it, and a detached element no longer has the toggle listener that
741
+ // resets its open state.
742
+ const flyouts = [...menuPopover.querySelectorAll('[popover]')].reverse();
743
+ for (const flyout of flyouts) {
744
+ if (typeof flyout.hidePopover === 'function') {
745
+ if (flyout.matches(':popover-open')) {
746
+ flyout.hidePopover();
747
+ }
748
+ } else if (flyout.style.display === 'block') {
749
+ flyout.style.display = 'none';
750
+ const toggle = new Event('toggle', {
751
+ bubbles: false
752
+ });
753
+ Object.defineProperty(toggle, 'newState', {
754
+ value: 'closed',
755
+ configurable: true
756
+ });
757
+ flyout.dispatchEvent(toggle);
758
+ }
759
+ }
760
+ }, []);
761
+
696
762
  // Focus lands somewhere stated when the menu closes. A press outside that
697
763
  // landed on a focusable control has already moved focus there; leave it.
698
764
  // Otherwise — a row acted, Escape, a press on nothing — focus returns to
@@ -700,6 +766,9 @@ function DropdownMenuPopover({
700
766
  // keyboard (the modality tracker decides; the suppressed style hides the
701
767
  // pointer case, which Safari would otherwise paint after a touch pick).
702
768
  const handleLayerHide = useCallback(() => {
769
+ // Whatever closed the menu — light dismiss, the dismissal stack, Escape
770
+ // or a controlled close — its flyouts close with it.
771
+ hideOpenFlyouts();
703
772
  if (suppressControlledRollbackHideRef.current) {
704
773
  suppressControlledRollbackHideRef.current = false;
705
774
  return;
@@ -728,7 +797,7 @@ function DropdownMenuPopover({
728
797
  focusForLastInput(trigger, {
729
798
  preventScroll: true
730
799
  });
731
- }, [isControlled, onOpenChange, prepareFocusReturn]);
800
+ }, [hideOpenFlyouts, isControlled, onOpenChange, prepareFocusReturn]);
732
801
 
733
802
  // Defer item focus until the layer has committed open, so focus restore
734
803
  // captures the trigger instead of the first menu item.
@@ -1260,7 +1329,10 @@ function DropdownMenuPopover({
1260
1329
  value: hasRegions,
1261
1330
  children: /*#__PURE__*/_jsx(DropdownMenuContext, {
1262
1331
  value: contextValue,
1263
- children: menuContent
1332
+ children: /*#__PURE__*/_jsx(DropdownMenuRootOpenContext, {
1333
+ value: isOpen,
1334
+ children: menuContent
1335
+ })
1264
1336
  })
1265
1337
  })
1266
1338
  })), {
@@ -43,6 +43,23 @@ export interface DropdownMenuContextValue {
43
43
  */
44
44
  menuLabel?: string;
45
45
  }
46
+ /**
47
+ * Whether the root menu of this layer tree is open; internal companion to
48
+ * `DropdownMenuContext`, on its own unexported context so the public
49
+ * `DropdownMenuContextValue` surface stays unchanged. A sub-menu's hover
50
+ * intent must die with the menu: a hover-open scheduled on its trigger
51
+ * before the menu closed from elsewhere would otherwise fire into the
52
+ * hidden menu and reopen the flyout behind it (#6893). `null` means no
53
+ * signal, treated as open, matching providers that have no state to give.
54
+ * @internal
55
+ */
56
+ export declare const DropdownMenuRootOpenContext: import("react").Context<boolean | null>;
57
+ /**
58
+ * Whether the root menu backing these compound items is open. True when no
59
+ * provider gave a signal.
60
+ * @internal
61
+ */
62
+ export declare function useDropdownMenuRootOpen(): boolean;
46
63
  export declare const DropdownMenuContext: import("react").Context<DropdownMenuContextValue | null>;
47
64
  /**
48
65
  * Hook for compound menu items to access menu state.
@@ -1 +1 @@
1
- {"version":3,"file":"DropdownMenuContext.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuContext.tsx"],"names":[],"mappings":"AAmBA,uDAAuD;AACvD,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAElD;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,mBAAmB;IAClC;;;;;OAKG;IACH,cAAc,EAAE,OAAO,CAAC;IACxB,4EAA4E;IAC5E,SAAS,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACjC,wEAAwE;IACxE,IAAI,EAAE,WAAW,GAAG,IAAI,CAAC;IACzB,2DAA2D;IAC3D,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,kDAAkD;IAClD,GAAG,EAAE,MAAM,IAAI,CAAC;CACjB;AAED,MAAM,WAAW,wBAAwB;IACvC,uEAAuE;IACvE,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,yCAAyC;IACzC,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,sEAAsE;IACtE,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,mBAAmB,0DACiC,CAAC;AAGlE;;;GAGG;AACH,wBAAgB,sBAAsB,IAAI,wBAAwB,GAAG,IAAI,CAExE;AAMD,MAAM,WAAW,kCAAkC;IACjD,iDAAiD;IACjD,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,uEAAuE;IACvE,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,qEAAqE;IACrE,gBAAgB,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,6BAA6B,oEACsB,CAAC;AAGjE;;;GAGG;AACH,wBAAgB,gCAAgC,IAAI,kCAAkC,GAAG,IAAI,CAE5F"}
1
+ {"version":3,"file":"DropdownMenuContext.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuContext.tsx"],"names":[],"mappings":"AAmBA,uDAAuD;AACvD,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAElD;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,mBAAmB;IAClC;;;;;OAKG;IACH,cAAc,EAAE,OAAO,CAAC;IACxB,4EAA4E;IAC5E,SAAS,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACjC,wEAAwE;IACxE,IAAI,EAAE,WAAW,GAAG,IAAI,CAAC;IACzB,2DAA2D;IAC3D,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,kDAAkD;IAClD,GAAG,EAAE,MAAM,IAAI,CAAC;CACjB;AAED,MAAM,WAAW,wBAAwB;IACvC,uEAAuE;IACvE,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,yCAAyC;IACzC,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,sEAAsE;IACtE,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,2BAA2B,yCAEjC,CAAC;AAGR;;;;GAIG;AACH,wBAAgB,uBAAuB,IAAI,OAAO,CAEjD;AAED,eAAO,MAAM,mBAAmB,0DACiC,CAAC;AAGlE;;;GAGG;AACH,wBAAgB,sBAAsB,IAAI,wBAAwB,GAAG,IAAI,CAExE;AAMD,MAAM,WAAW,kCAAkC;IACjD,iDAAiD;IACjD,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,uEAAuE;IACvE,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,qEAAqE;IACrE,gBAAgB,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,6BAA6B,oEACsB,CAAC;AAGjE;;;GAGG;AACH,wBAAgB,gCAAgC,IAAI,kCAAkC,GAAG,IAAI,CAE5F"}
@@ -32,6 +32,27 @@ import { createLayerScopedContext } from "../Layer/layerScopedContext.js";
32
32
  * @internal
33
33
  */
34
34
 
35
+ /**
36
+ * Whether the root menu of this layer tree is open; internal companion to
37
+ * `DropdownMenuContext`, on its own unexported context so the public
38
+ * `DropdownMenuContextValue` surface stays unchanged. A sub-menu's hover
39
+ * intent must die with the menu: a hover-open scheduled on its trigger
40
+ * before the menu closed from elsewhere would otherwise fire into the
41
+ * hidden menu and reopen the flyout behind it (#6893). `null` means no
42
+ * signal, treated as open, matching providers that have no state to give.
43
+ * @internal
44
+ */
45
+ export const DropdownMenuRootOpenContext = createLayerScopedContext(null);
46
+ DropdownMenuRootOpenContext.displayName = 'DropdownMenuRootOpenContext';
47
+
48
+ /**
49
+ * Whether the root menu backing these compound items is open. True when no
50
+ * provider gave a signal.
51
+ * @internal
52
+ */
53
+ export function useDropdownMenuRootOpen() {
54
+ return use(DropdownMenuRootOpenContext) !== false;
55
+ }
35
56
  export const DropdownMenuContext = createLayerScopedContext(null);
36
57
  DropdownMenuContext.displayName = 'DropdownMenuContext';
37
58
 
@@ -23,7 +23,8 @@ import type { BaseProps } from '../BaseProps';
23
23
  export interface DropdownMenuGroupProps extends Pick<BaseProps, 'xstyle' | 'className' | 'style'> {
24
24
  /**
25
25
  * Heading shown above the group's rows and used as the group's accessible
26
- * name (`aria-labelledby`). Omit it for an unnamed group.
26
+ * name (`aria-labelledby`). Omit it for an unnamed group. Keep this content
27
+ * non-interactive; controls belong in DropdownMenu's `header` or `footer`.
27
28
  */
28
29
  title?: ReactNode;
29
30
  /** The rows of the group: menu items, selectable items, sub-menus. */
@@ -34,9 +35,10 @@ export interface DropdownMenuGroupProps extends Pick<BaseProps, 'xstyle' | 'clas
34
35
  /**
35
36
  * A titled group of menu rows.
36
37
  *
37
- * Renders `role="group"` named by its heading. The heading is plain text, not
38
- * a `menuitem`, so it is never a stop in the menu's arrow-key order and
39
- * typeahead never lands on it. The compound peer of
38
+ * Renders `role="group"` named by its heading. The heading is not a
39
+ * `menuitem`, so arrow-key navigation and typeahead skip it. Keep heading
40
+ * content non-interactive; place controls in DropdownMenu's `header` or
41
+ * `footer`. The compound peer of
40
42
  * `{type: 'section', title, items}` in the `items` data API.
41
43
  *
42
44
  * @example