@astryxdesign/core 0.4.1-canary.9e8a72a → 0.4.1-canary.aeb66f5

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 (152) hide show
  1. package/dist/Avatar/Avatar.d.ts +4 -1
  2. package/dist/Avatar/Avatar.d.ts.map +1 -1
  3. package/dist/Avatar/Avatar.js +19 -23
  4. package/dist/AvatarGroup/AvatarGroupOverflow.d.ts.map +1 -1
  5. package/dist/AvatarGroup/AvatarGroupOverflow.js +7 -2
  6. package/dist/Button/Button.d.ts.map +1 -1
  7. package/dist/Button/Button.js +9 -7
  8. package/dist/Chat/ChatMessage.d.ts +7 -0
  9. package/dist/Chat/ChatMessage.d.ts.map +1 -1
  10. package/dist/Chat/ChatMessageBubble.d.ts +13 -1
  11. package/dist/Chat/ChatMessageBubble.d.ts.map +1 -1
  12. package/dist/Chat/ChatMessageBubble.js +19 -1
  13. package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
  14. package/dist/CheckboxInput/CheckboxInput.js +5 -0
  15. package/dist/CommandPalette/CommandPaletteFooter.d.ts.map +1 -1
  16. package/dist/CommandPalette/CommandPaletteFooter.js +5 -3
  17. package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
  18. package/dist/DateTimeInput/DateTimeInput.js +2 -2
  19. package/dist/DropdownMenu/DropdownMenuSubMenu.d.ts.map +1 -1
  20. package/dist/DropdownMenu/DropdownMenuSubMenu.js +19 -15
  21. package/dist/HoverCard/HoverCard.d.ts +1 -1
  22. package/dist/HoverCard/HoverCard.d.ts.map +1 -1
  23. package/dist/HoverCard/HoverCard.js +5 -13
  24. package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
  25. package/dist/HoverCard/useHoverCard.js +6 -5
  26. package/dist/InputGroup/groupStyles.d.ts.map +1 -1
  27. package/dist/InputGroup/groupStyles.js +7 -2
  28. package/dist/Layer/layerHost.d.ts +24 -0
  29. package/dist/Layer/layerHost.d.ts.map +1 -0
  30. package/dist/Layer/layerHost.js +79 -0
  31. package/dist/Layer/useLayer.d.ts +14 -6
  32. package/dist/Layer/useLayer.d.ts.map +1 -1
  33. package/dist/Layer/useLayer.js +158 -30
  34. package/dist/RadioList/RadioListItem.d.ts.map +1 -1
  35. package/dist/RadioList/RadioListItem.js +5 -0
  36. package/dist/SideNav/SideNavHeading.d.ts.map +1 -1
  37. package/dist/SideNav/SideNavHeading.js +19 -8
  38. package/dist/SideNav/SideNavItem.d.ts.map +1 -1
  39. package/dist/SideNav/SideNavItem.js +6 -1
  40. package/dist/Slider/Slider.d.ts.map +1 -1
  41. package/dist/Slider/Slider.js +56 -15
  42. package/dist/Switch/Switch.d.ts.map +1 -1
  43. package/dist/Switch/Switch.js +5 -0
  44. package/dist/Thumbnail/Thumbnail.d.ts.map +1 -1
  45. package/dist/Thumbnail/Thumbnail.js +5 -0
  46. package/dist/TopNav/TopNavHeading.d.ts.map +1 -1
  47. package/dist/TopNav/TopNavHeading.js +14 -6
  48. package/dist/TopNav/TopNavMegaMenu.d.ts.map +1 -1
  49. package/dist/TopNav/TopNavMegaMenu.js +24 -92
  50. package/dist/TopNav/TopNavMenu.d.ts.map +1 -1
  51. package/dist/TopNav/TopNavMenu.js +8 -3
  52. package/dist/astryx.css +11 -7
  53. package/dist/astryx.umd.js +49 -49
  54. package/dist/astryx.umd.js.map +4 -4
  55. package/dist/hooks/index.d.ts +1 -1
  56. package/dist/hooks/index.d.ts.map +1 -1
  57. package/dist/hooks/index.js +1 -1
  58. package/dist/hooks/useFocusTrap.d.ts.map +1 -1
  59. package/dist/hooks/useFocusTrap.js +16 -2
  60. package/dist/hooks/useMenuHover.d.ts +50 -5
  61. package/dist/hooks/useMenuHover.d.ts.map +1 -1
  62. package/dist/hooks/useMenuHover.js +171 -51
  63. package/dist/theme/defineTheme.d.ts +8 -2
  64. package/dist/theme/defineTheme.d.ts.map +1 -1
  65. package/dist/theme/defineTheme.js +8 -1
  66. package/dist/theme/derivedVarRegistry.d.ts.map +1 -1
  67. package/dist/theme/derivedVarRegistry.js +7 -0
  68. package/dist/theme/expandColorScale.d.ts.map +1 -1
  69. package/dist/theme/expandColorScale.js +1 -0
  70. package/dist/theme/expandMotionScale.d.ts +1 -0
  71. package/dist/theme/expandMotionScale.d.ts.map +1 -1
  72. package/dist/theme/expandMotionScale.js +1 -0
  73. package/dist/theme/expandRadiusScale.d.ts +1 -0
  74. package/dist/theme/expandRadiusScale.d.ts.map +1 -1
  75. package/dist/theme/expandRadiusScale.js +1 -0
  76. package/dist/theme/expandTypeScale.d.ts +1 -0
  77. package/dist/theme/expandTypeScale.d.ts.map +1 -1
  78. package/dist/theme/expandTypeScale.js +1 -0
  79. package/dist/theme/tokens.stylex.d.ts +3 -1
  80. package/dist/theme/tokens.stylex.d.ts.map +1 -1
  81. package/dist/theme/tokens.stylex.js +3 -1
  82. package/locales/en.json +80 -0
  83. package/locales/pseudo.json +60 -0
  84. package/package.json +2 -2
  85. package/src/Avatar/Avatar.doc.mjs +5 -2
  86. package/src/Avatar/Avatar.test.tsx +51 -0
  87. package/src/Avatar/Avatar.tsx +30 -20
  88. package/src/AvatarGroup/AvatarGroup.doc.mjs +1 -1
  89. package/src/AvatarGroup/AvatarGroup.test.tsx +14 -0
  90. package/src/AvatarGroup/AvatarGroupOverflow.tsx +3 -2
  91. package/src/Button/Button.tsx +5 -3
  92. package/src/ButtonGroup/ButtonGroup.test.tsx +7 -4
  93. package/src/Card/Card.doc.mjs +2 -0
  94. package/src/Chat/Chat.doc.mjs +4 -1
  95. package/src/Chat/ChatMessage.doc.mjs +3 -3
  96. package/src/Chat/ChatMessage.tsx +7 -0
  97. package/src/Chat/ChatMessageBubble.doc.mjs +7 -0
  98. package/src/Chat/ChatMessageBubble.test.tsx +95 -6
  99. package/src/Chat/ChatMessageBubble.tsx +25 -0
  100. package/src/CheckboxInput/CheckboxInput.tsx +20 -0
  101. package/src/CodeBlock/CodeBlock.doc.mjs +3 -0
  102. package/src/CommandPalette/CommandPaletteFooter.tsx +6 -3
  103. package/src/DateTimeInput/DateTimeInput.tsx +4 -2
  104. package/src/DropdownMenu/DropdownMenuSubMenu.test.tsx +72 -1
  105. package/src/DropdownMenu/DropdownMenuSubMenu.tsx +24 -20
  106. package/src/HoverCard/HoverCard.doc.mjs +3 -3
  107. package/src/HoverCard/HoverCard.test.tsx +283 -55
  108. package/src/HoverCard/HoverCard.tsx +5 -13
  109. package/src/HoverCard/useHoverCard.tsx +8 -11
  110. package/src/InputGroup/groupStyles.ts +7 -8
  111. package/src/Item/Item.doc.mjs +4 -0
  112. package/src/Layer/layerHost.test.ts +99 -0
  113. package/src/Layer/layerHost.ts +141 -0
  114. package/src/Layer/useLayer.doc.mjs +14 -4
  115. package/src/Layer/useLayer.test.tsx +332 -7
  116. package/src/Layer/useLayer.tsx +235 -36
  117. package/src/MobileNav/MobileNav.doc.mjs +7 -0
  118. package/src/RadioList/RadioListItem.tsx +20 -0
  119. package/src/SideNav/SideNav.test.tsx +90 -3
  120. package/src/SideNav/SideNavCollapseButton.doc.mjs +2 -2
  121. package/src/SideNav/SideNavHeading.tsx +25 -15
  122. package/src/SideNav/SideNavItem.tsx +5 -0
  123. package/src/Slider/Slider.test.tsx +69 -33
  124. package/src/Slider/Slider.tsx +65 -13
  125. package/src/Switch/Switch.tsx +20 -0
  126. package/src/TabList/TabList.doc.mjs +3 -0
  127. package/src/Text/Text.doc.mjs +1 -1
  128. package/src/Thumbnail/Thumbnail.doc.mjs +3 -0
  129. package/src/Thumbnail/Thumbnail.tsx +10 -0
  130. package/src/Timestamp/Timestamp.test.tsx +40 -22
  131. package/src/Toolbar/Toolbar.test.tsx +14 -14
  132. package/src/TopNav/TopNav.test.tsx +86 -1
  133. package/src/TopNav/TopNavHeading.tsx +21 -14
  134. package/src/TopNav/TopNavMegaMenu.tsx +25 -104
  135. package/src/TopNav/TopNavMenu.tsx +6 -2
  136. package/src/TreeList/TreeList.doc.mjs +1 -0
  137. package/src/hooks/index.ts +5 -1
  138. package/src/hooks/useFocusTrap.test.tsx +16 -0
  139. package/src/hooks/useFocusTrap.ts +20 -2
  140. package/src/hooks/useMenuHover.test.tsx +364 -0
  141. package/src/hooks/useMenuHover.ts +243 -47
  142. package/src/theme/defineTheme.ts +9 -0
  143. package/src/theme/derivedVarRegistry.test.ts +78 -12
  144. package/src/theme/derivedVarRegistry.ts +4 -0
  145. package/src/theme/expandColorScale.ts +1 -0
  146. package/src/theme/expandMotionScale.ts +1 -0
  147. package/src/theme/expandRadiusScale.ts +1 -0
  148. package/src/theme/expandTypeScale.ts +1 -0
  149. package/src/theme/themingTargets.test.ts +152 -26
  150. package/src/theme/tokens.stylex.ts +3 -1
  151. package/src/theme/tokens.test.ts +12 -0
  152. package/src/theme/useTheme.test.tsx +18 -0
@@ -62,6 +62,9 @@ export interface AvatarProps extends BaseProps<HTMLDivElement> {
62
62
  /**
63
63
  * The size of the avatar. A named size (`xsm` 20px, `sm` 24px, `md` 36px,
64
64
  * `lg` 48px, `xl` 128px) or a specific pixel value.
65
+ *
66
+ * Inside an `AvatarGroup` the group's `size` wins: a group sizes its members
67
+ * uniformly, so this prop is ignored there.
65
68
  * @default 'md'
66
69
  */
67
70
  size?: AvatarSize;
@@ -132,7 +135,7 @@ export interface AvatarProps extends BaseProps<HTMLDivElement> {
132
135
  * ```
133
136
  * <Avatar src="/user.jpg" name="John Doe" />
134
137
  * <Avatar name="Jane Smith" size="xl" />
135
- * <Avatar src="/user.jpg" status={<OnlineIndicator />} />
138
+ * <Avatar src="/user.jpg" status={<AvatarStatusDot variant="success" label="Online" />} />
136
139
  * <Avatar name="jsmith" tooltip="Jane Smith, Staff Engineer" />
137
140
  * <Avatar name="Jane" tooltip={false} />
138
141
  * <Avatar src="/user.jpg" name="John Doe" href="/users/john" />
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAoC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AACxE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAe5C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AA4BrD;;;;;;GAMG;AACH,KAAK,eAAe,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEzD;;GAEG;AACH,KAAK,iBAAiB,GACpB,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEzE;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,eAAe,GAAG,iBAAiB,CAAC;AAE7D;;GAEG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CAgBpD;AA4HD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;;;;OAQG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;;;;;;;;;OAWG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC3B;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;CAChD;AA6ED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,MAAM,CAAC,EACrB,GAAG,EACH,aAAa,EAAE,MAAM,EACrB,WAAW,EACX,IAAI,EACJ,IAAW,EACX,GAAG,EACH,MAAM,EACN,OAAc,EACd,IAAI,EACJ,EAAE,EACF,MAAM,EACN,GAAG,EACH,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,+BA0Pb;yBA7Qe,MAAM"}
1
+ {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAoC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AACxE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgB5C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AA4BrD;;;;;;GAMG;AACH,KAAK,eAAe,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEzD;;GAEG;AACH,KAAK,iBAAiB,GACpB,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEzE;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,eAAe,GAAG,iBAAiB,CAAC;AAE7D;;GAEG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CAgBpD;AA6HD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;;;;OAQG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;;;;;;;;;OAWG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC3B;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;CAChD;AA6ED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,MAAM,CAAC,EACrB,GAAG,EACH,aAAa,EAAE,MAAM,EACrB,WAAW,EACX,IAAI,EACJ,IAAW,EACX,GAAG,EACH,MAAM,EACN,OAAc,EACd,IAAI,EACJ,EAAE,EACF,MAAM,EACN,GAAG,EACH,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,+BA+Pb;yBAlRe,MAAM"}
@@ -27,6 +27,7 @@ import { mergeProps, mergeRefs } from "../utils/index.js";
27
27
  import { themeProps } from "../utils/themeProps.js";
28
28
  import { focusOutlineProps } from "../utils/focusOutline.stylex.js";
29
29
  import { useTooltip } from "../Tooltip/useTooltip.js";
30
+ import { useDevWarning } from "../hooks/useDevWarning.js";
30
31
  import { useLinkComponent } from "../Link/useLinkComponent.js";
31
32
  import { useTranslator } from "../i18n/index.js";
32
33
 
@@ -105,15 +106,6 @@ const styles = {
105
106
  kaIpWk: "xjspbzw",
106
107
  $$css: true
107
108
  },
108
- content: {
109
- k1xSpc: "x78zum5",
110
- kGNEyG: "x6s0dn4",
111
- kjj79g: "xl56j7k",
112
- kaIpWk: "xjspbzw",
113
- kVQacm: "xb3r6kr",
114
- kfSwDN: "x87ps6o",
115
- $$css: true
116
- },
117
109
  fallback: {
118
110
  k1xSpc: "x78zum5",
119
111
  kGNEyG: "x6s0dn4",
@@ -287,7 +279,7 @@ function DefaultIcon({
287
279
  * ```
288
280
  * <Avatar src="/user.jpg" name="John Doe" />
289
281
  * <Avatar name="Jane Smith" size="xl" />
290
- * <Avatar src="/user.jpg" status={<OnlineIndicator />} />
282
+ * <Avatar src="/user.jpg" status={<AvatarStatusDot variant="success" label="Online" />} />
291
283
  * <Avatar name="jsmith" tooltip="Jane Smith, Staff Engineer" />
292
284
  * <Avatar name="Jane" tooltip={false} />
293
285
  * <Avatar src="/user.jpg" name="John Doe" href="/users/john" />
@@ -320,8 +312,13 @@ export function Avatar({
320
312
  const [erroredFallbackSrc, setErroredFallbackSrc] = useState(undefined);
321
313
  const showImage = src && erroredSrc !== src;
322
314
  const showFallbackImage = !showImage && fallbackSrc && erroredFallbackSrc !== fallbackSrc;
323
- const showInitials = !showImage && !showFallbackImage && name;
324
- const showIcon = !showImage && !showFallbackImage && !name;
315
+ // A whitespace-only string carries no identity. Without this it produces no
316
+ // initials (getInitials trims to nothing) and no default icon (a space is
317
+ // truthy), leaving an empty plate behind a blank accessible name.
318
+ const meaningfulName = name?.trim() ? name : undefined;
319
+ const meaningfulAlt = alt?.trim() ? alt : undefined;
320
+ const showInitials = !showImage && !showFallbackImage && meaningfulName;
321
+ const showIcon = !showImage && !showFallbackImage && !meaningfulName;
325
322
 
326
323
  // A meaningful accessible name comes from `alt`/`name`, composed with the
327
324
  // status element's `label` when one is present ("Jane Doe, Online") — the
@@ -332,7 +329,7 @@ export function Avatar({
332
329
  // it as `presentation`/`aria-hidden` rather than announcing a meaningless
333
330
  // generic "Avatar" (obs-9).
334
331
  const t = useTranslator();
335
- const nameLabel = alt || name;
332
+ const nameLabel = meaningfulAlt || meaningfulName;
336
333
  const statusLabel = getStatusLabel(status);
337
334
  const accessibleName = nameLabel && statusLabel ? t('@astryx.avatar.nameWithStatus', {
338
335
  name: nameLabel,
@@ -349,7 +346,7 @@ export function Avatar({
349
346
  // - `true` / omitted → the `name` (a whitespace-only name yields nothing)
350
347
  // Note: the *visible* tooltip prefers `name` (not `alt`); the *accessible
351
348
  // name* on the root still uses `alt || name` above, independent of this.
352
- const tooltipContent = tooltip === false ? undefined : typeof tooltip === 'string' ? tooltip : name;
349
+ const tooltipContent = tooltip === false ? undefined : typeof tooltip === 'string' ? tooltip : meaningfulName;
353
350
  const trimmedTooltip = tooltipContent?.trim();
354
351
  const showTooltip = trimmedTooltip != null && trimmedTooltip !== '';
355
352
  // Whether the tooltip text is a consumer-authored override (a custom string)
@@ -385,17 +382,16 @@ export function Avatar({
385
382
  const LinkComponent = useLinkComponent(as);
386
383
 
387
384
  // An interactive control with no accessible name is an unacceptable control
388
- // name. Warn in the same client-safe way sibling components do (Field,
389
- // Timestamp, Popover) — a plain `console.warn`, never gated on `process.env`
390
- // (which is not available on the client in this codebase).
391
- if (isInteractive && !accessibleName) {
392
- console.warn('Avatar: an interactive avatar (with `href` or `onClick`) needs a ' + 'meaningful accessible name. Pass `alt` or `name`.');
393
- }
385
+ // name. `useDevWarning` is the shared guardrail: it warns once per mount
386
+ // rather than on every render, and compiles out of production builds.
387
+ useDevWarning('Avatar', 'an interactive avatar (with `href` or `onClick`) needs a meaningful ' + 'accessible name. Pass `alt` or `name`.', isInteractive && !accessibleName);
394
388
 
395
389
  // The inner visuals are identical across the static and interactive variants.
396
390
  const visualContent = /*#__PURE__*/_jsxs(_Fragment, {
397
391
  children: [/*#__PURE__*/_jsxs("div", {
398
- ...stylex.props(styles.content, dynamicStyles.size(numericSize)),
392
+ ...{
393
+ className: "x78zum5 x6s0dn4 xl56j7k xh8yej3 x5yr21d xjspbzw xb3r6kr x87ps6o"
394
+ },
399
395
  children: [showImage && /*#__PURE__*/_jsx("img", {
400
396
  src: src,
401
397
  alt: "",
@@ -414,7 +410,7 @@ export function Avatar({
414
410
  ...mergeProps(themeProps('avatar-fallback', {
415
411
  size: resolvedSize
416
412
  }), stylex.props(styles.fallback, dynamicStyles.fontSize(numericSize))),
417
- children: getInitials(name)
413
+ children: getInitials(meaningfulName)
418
414
  }), showIcon && /*#__PURE__*/_jsx("div", {
419
415
  ...mergeProps(themeProps('avatar-fallback', {
420
416
  size: resolvedSize
@@ -437,7 +433,7 @@ export function Avatar({
437
433
  // `<a>`/`<button>` and the static `<div>` carry the exact same box.
438
434
  const rootStylexProps = mergeProps(themeProps('avatar', {
439
435
  size: resolvedSize
440
- }), focusOutlineProps.focusVisible(styles.wrapper, isInteractive && styles.interactive, avatarGroup && groupStyles.ring, avatarGroup && groupStyles.overlap, avatarGroup && groupDynamicStyles.overlap(-avatarGroup.overlap), xstyle), className, style);
436
+ }), focusOutlineProps.focusVisible(styles.wrapper, dynamicStyles.size(numericSize), isInteractive && styles.interactive, avatarGroup && groupStyles.ring, avatarGroup && groupStyles.overlap, avatarGroup && groupDynamicStyles.overlap(-avatarGroup.overlap), xstyle), className, style);
441
437
  let rootElement;
442
438
 
443
439
  // `props` is typed for the default `<div>` root (its event handlers are
@@ -1 +1 @@
1
- {"version":3,"file":"AvatarGroupOverflow.d.ts","sourceRoot":"","sources":["../../src/AvatarGroup/AvatarGroupOverflow.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAW5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CACpD,SAAS,CAAC,WAAW,CAAC,EACtB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAoED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,GAAG,EACH,KAAK,EACL,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,wBAAwB,GAAG,SAAS,CA0DtC;yBAnEe,mBAAmB"}
1
+ {"version":3,"file":"AvatarGroupOverflow.d.ts","sourceRoot":"","sources":["../../src/AvatarGroup/AvatarGroupOverflow.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAW5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CACpD,SAAS,CAAC,WAAW,CAAC,EACtB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAoED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,GAAG,EACH,KAAK,EACL,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,wBAAwB,GAAG,SAAS,CA2DtC;yBApEe,mBAAmB"}
@@ -107,6 +107,7 @@ export function AvatarGroupOverflow({
107
107
  }) {
108
108
  const t = useTranslator();
109
109
  const group = useAvatarGroup();
110
+ const size = group?.size ?? 'md';
110
111
  const numericSize = group?.numericSize ?? 36;
111
112
  const overlap = group?.overlap ?? 0;
112
113
  const label = t('@astryx.avatarGroup.overflow', {
@@ -121,7 +122,9 @@ export function AvatarGroupOverflow({
121
122
  ...rest,
122
123
  "aria-label": label,
123
124
  "data-avatar-item": "",
124
- ...mergeProps(themeProps('avatar-group-overflow'), focusOutlineProps.focusVisible(styles.base, styles.button, styles.overlap, dynamicStyles.size(numericSize), dynamicStyles.fontSize(numericSize), dynamicStyles.overlap(-overlap), xstyle), className, style),
125
+ ...mergeProps(themeProps('avatar-group-overflow', {
126
+ size
127
+ }), focusOutlineProps.focusVisible(styles.base, styles.button, styles.overlap, dynamicStyles.size(numericSize), dynamicStyles.fontSize(numericSize), dynamicStyles.overlap(-overlap), xstyle), className, style),
125
128
  children: content
126
129
  });
127
130
  }
@@ -129,7 +132,9 @@ export function AvatarGroupOverflow({
129
132
  ref: ref,
130
133
  ...rest,
131
134
  "aria-label": label,
132
- ...mergeProps(themeProps('avatar-group-overflow'), stylex.props(styles.base, styles.overlap, dynamicStyles.size(numericSize), dynamicStyles.fontSize(numericSize), dynamicStyles.overlap(-overlap), xstyle), className, style),
135
+ ...mergeProps(themeProps('avatar-group-overflow', {
136
+ size
137
+ }), stylex.props(styles.base, styles.overlap, dynamicStyles.size(numericSize), dynamicStyles.fontSize(numericSize), dynamicStyles.overlap(-overlap), xstyle), className, style),
133
138
  children: content
134
139
  });
135
140
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAwB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAC5D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAC,MAAM,gBAAgB,CAAC;AACzD,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAuB3C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAIrD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,SAAS,CAAC;AAuG9C,QAAA,MAAM,UAAU;;;;;;;;;;EAUd,CAAC;AAkFH;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,gBAAgB,CAAC;AAEnD;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,UAAU,CAAC;AAEjD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC/D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC,oDAAoD;IACpD,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,+CAA+C;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IAChD,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;;;OAQG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACrD;;OAEG;IACH,WAAW,CAAC,EAAE,CACZ,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KACnC,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAqJD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,MAAM,CAAC,EACrB,KAAK,EACL,OAAqB,EACrB,IAAI,EAAE,QAAQ,EACd,IAAe,EACf,UAAkB,EAClB,SAAiB,EACjB,eAAuB,EACvB,WAAW,EACX,IAAI,EACJ,UAAkB,EAClB,KAAK,EACL,SAAkB,EAClB,QAAQ,EACR,UAAU,EACV,OAAO,EACP,IAAI,EACJ,EAAE,EACF,MAAM,EACN,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,GAAG,SAAS,CA6OzB;yBAtQe,MAAM"}
1
+ {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
@@ -253,8 +253,10 @@ const loadingStyles = {
253
253
  *
254
254
  * Layers always carry the native `popover` attribute (useLayer.tsx), and a
255
255
  * popover is never an in-flow member — it is `display: none` until shown, then
256
- * promoted to the top layer. So "last member" is: no following element sibling
257
- * that isn't a popover.
256
+ * promoted to the top layer. Context layers also retain an inert `<template>`
257
+ * marker so they can re-resolve their JSX position. Neither element is a group
258
+ * member, so "last member" is: no following element sibling besides those two
259
+ * pieces of layer infrastructure.
258
260
  *
259
261
  * Reading it the other way round — marking the *buttons* and testing for a
260
262
  * marked sibling — is the trap: it silently reclassifies anything it doesn't
@@ -270,13 +272,13 @@ const loadingStyles = {
270
272
  * The leading edge still uses `:first-child` — a member's button always precedes
271
273
  * its own layer, so the first button is genuinely `:first-child`.
272
274
  */
273
- const IS_LAST_ITEM = ':not(:has(~ *:not([popover])))';
275
+ const IS_LAST_ITEM = ':not(:has(~ *:not([popover]):not(template)))';
274
276
  const groupStyles = {
275
277
  horizontal: {
276
278
  krdFHd: "x15mokao x8eehn2",
277
279
  kVL7Gh: "xbiv7yw x1xrp5p4",
278
- kfmiAY: "x1ga7v0g xbfdvlp",
279
- kT0f0o: "x16uus16 xajhecq",
280
+ kfmiAY: "x1ga7v0g x1tzxhge",
281
+ kT0f0o: "x16uus16 x1rmb4wm",
280
282
  k2ei4v: "xgbv0en x1pjv70x",
281
283
  kVhnKS: "x1t7ytsu xyf0ibl",
282
284
  kGJrpR: "x1j92z86",
@@ -285,8 +287,8 @@ const groupStyles = {
285
287
  vertical: {
286
288
  krdFHd: "x15mokao x8eehn2",
287
289
  kfmiAY: "x1ga7v0g x2qxyot",
288
- kVL7Gh: "xbiv7yw x12tyzlf",
289
- kT0f0o: "x16uus16 xajhecq",
290
+ kVL7Gh: "xbiv7yw xturttb",
291
+ kT0f0o: "x16uus16 x1rmb4wm",
290
292
  kEafiO: "x11xkdxz x1g31smg",
291
293
  kPef9Z: "x13fuv20 x1d9v4yf",
292
294
  kLZC3w: "x1pc3f07",
@@ -20,6 +20,13 @@ import type { BaseProps } from '../BaseProps';
20
20
  export interface ChatMessageProps extends BaseProps<HTMLElement> {
21
21
  ref?: React.Ref<HTMLElement>;
22
22
  sender: ChatMessageSender;
23
+ /**
24
+ * Message body — bubbles, tool calls, images, or any free-form content.
25
+ * Custom (non-bubble) children render flush with the message edge; wrap
26
+ * them in a ghost bubble (`<ChatMessageBubble variant="ghost">`) to align
27
+ * them with the bubble's text column, and add `width="100%"` when they
28
+ * should span the full message column.
29
+ */
23
30
  children: ReactNode;
24
31
  avatar?: ReactNode;
25
32
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"ChatMessage.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatMessage.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAiB,MAAM,OAAO,CAAC;AAQrD,OAAO,EAGL,KAAK,iBAAiB,EACtB,KAAK,WAAW,EACjB,MAAM,eAAe,CAAC;AAEvB,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAI5C,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,WAAW,CAAC;IAC9D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B,MAAM,EAAE,iBAAiB,CAAC;IAC1B,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB;AAoFD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,WAAW,CAAC,EAC1B,MAAM,EACN,QAAQ,EACR,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,OAAO,EAAE,WAAW,EACpB,MAAM,EACN,SAAS,EACT,KAAK,EAAE,SAAS,EAChB,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,gBAAgB,+BA2FlB;yBAxGe,WAAW"}
1
+ {"version":3,"file":"ChatMessage.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatMessage.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAiB,MAAM,OAAO,CAAC;AAQrD,OAAO,EAGL,KAAK,iBAAiB,EACtB,KAAK,WAAW,EACjB,MAAM,eAAe,CAAC;AAEvB,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAI5C,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,WAAW,CAAC;IAC9D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B,MAAM,EAAE,iBAAiB,CAAC;IAC1B;;;;;;OAMG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB;AAoFD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,WAAW,CAAC,EAC1B,MAAM,EACN,QAAQ,EACR,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,OAAO,EAAE,WAAW,EACpB,MAAM,EACN,SAAS,EACT,KAAK,EAAE,SAAS,EAChB,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,gBAAgB,+BA2FlB;yBAxGe,WAAW"}
@@ -11,6 +11,9 @@
11
11
  * - If you use bubbles on one side (e.g. assistant), use them consistently
12
12
  * for all messages on that side. Use `ghost` variant for content that
13
13
  * needs alignment without a visual boundary.
14
+ * - For custom content (cards, attachments, citations) that should span
15
+ * the full message column instead of the default width cap, combine
16
+ * `ghost` with `width="100%"` (#2574).
14
17
  * - Put `name` on the first bubble in a message, `metadata` on the last.
15
18
  * - For unbubbled messages, use ChatMessage's `name` and `metadata`
16
19
  * props instead.
@@ -21,6 +24,7 @@
21
24
  * - /packages/cli/assets/templates/blocks/components/ChatMessageBubble/ (block examples)
22
25
  */
23
26
  import type { ReactNode } from 'react';
27
+ import type { SizeValue } from '../utils/types';
24
28
  import type { BaseProps } from '../BaseProps';
25
29
  export type ChatMessageBubbleVariant = 'filled' | 'ghost';
26
30
  export interface ChatMessageBubbleProps extends BaseProps<HTMLDivElement> {
@@ -60,6 +64,14 @@ export interface ChatMessageBubbleProps extends BaseProps<HTMLDivElement> {
60
64
  * Leave unset for standalone bubbles (full radius).
61
65
  */
62
66
  group?: 'first' | 'middle' | 'last';
67
+ /**
68
+ * Width of the bubble.
69
+ * Numbers are treated as pixels, strings are used as-is (e.g. "100%").
70
+ * When set, replaces the default `max(80%, 280px)` width cap; leave unset
71
+ * to keep the cap. Combine with `variant="ghost"` to let custom content
72
+ * (an artifact card, attachments) span the full message column.
73
+ */
74
+ width?: SizeValue;
63
75
  }
64
76
  /**
65
77
  * Styled content container — the chat "bubble."
@@ -78,7 +90,7 @@ export interface ChatMessageBubbleProps extends BaseProps<HTMLDivElement> {
78
90
  * </ChatMessage>
79
91
  * ```
80
92
  */
81
- export declare function ChatMessageBubble({ children, variant, name, metadata, group, xstyle, className, style: styleProp, 'data-testid': testId, ref, ...rest }: ChatMessageBubbleProps): import("react").JSX.Element;
93
+ export declare function ChatMessageBubble({ children, variant, name, metadata, group, width, xstyle, className, style: styleProp, 'data-testid': testId, ref, ...rest }: ChatMessageBubbleProps): import("react").JSX.Element;
82
94
  export declare namespace ChatMessageBubble {
83
95
  var displayName: string;
84
96
  }
@@ -1 +1 @@
1
- {"version":3,"file":"ChatMessageBubble.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatMessageBubble.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAWrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAG5C,MAAM,MAAM,wBAAwB,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE1D,MAAM,WAAW,sBAAuB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACvE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,wBAAwB,CAAC;IAEnC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;CACrC;AA8GD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,OAAkB,EAClB,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EAAE,SAAS,EAChB,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,sBAAsB,+BAyFxB;yBArGe,iBAAiB"}
1
+ {"version":3,"file":"ChatMessageBubble.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatMessageBubble.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAWrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAC9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAG5C,MAAM,MAAM,wBAAwB,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE1D,MAAM,WAAW,sBAAuB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACvE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,wBAAwB,CAAC;IAEnC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAEpC;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAwHD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,OAAkB,EAClB,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EAAE,SAAS,EAChB,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,sBAAsB,+BA0FxB;yBAvGe,iBAAiB"}
@@ -15,6 +15,9 @@
15
15
  * - If you use bubbles on one side (e.g. assistant), use them consistently
16
16
  * for all messages on that side. Use `ghost` variant for content that
17
17
  * needs alignment without a visual boundary.
18
+ * - For custom content (cards, attachments, citations) that should span
19
+ * the full message column instead of the default width cap, combine
20
+ * `ghost` with `width="100%"` (#2574).
18
21
  * - Put `name` on the first bubble in a message, `metadata` on the last.
19
22
  * - For unbubbled messages, use ChatMessage's `name` and `metadata`
20
23
  * props instead.
@@ -144,6 +147,20 @@ const styles = {
144
147
  }
145
148
  };
146
149
 
150
+ // Dynamic styles for sizing props
151
+ const _temp = {
152
+ ks0D6T: "x1x1rfll",
153
+ "$$css": true
154
+ };
155
+ const dynamicStyles = {
156
+ sizing: width => [_temp, {
157
+ kzqmXN: width != null ? "x5lhr3w" : width,
158
+ $$css: true
159
+ }, {
160
+ "--x-width": (val => typeof val === "number" ? val + "px" : val != null ? val : undefined)(width)
161
+ }]
162
+ };
163
+
147
164
  // =============================================================================
148
165
  // Component
149
166
  // =============================================================================
@@ -171,6 +188,7 @@ export function ChatMessageBubble({
171
188
  name,
172
189
  metadata,
173
190
  group,
191
+ width,
174
192
  xstyle,
175
193
  className,
176
194
  style: styleProp,
@@ -199,7 +217,7 @@ export function ChatMessageBubble({
199
217
  sender,
200
218
  variant,
201
219
  density
202
- }), stylex.props(styles.content, density === 'compact' && styles.radiusCompact, senderStyle, paddingStyle, variant === 'ghost' && styles.paddingBlockNone, groupStyle, xstyle), className, styleProp),
220
+ }), stylex.props(styles.content, density === 'compact' && styles.radiusCompact, senderStyle, paddingStyle, variant === 'ghost' && styles.paddingBlockNone, groupStyle, width != null && dynamicStyles.sizing(width), xstyle), className, styleProp),
203
221
  children: children
204
222
  }), metadata && /*#__PURE__*/_jsx("div", {
205
223
  ...stylex.props(metadataPaddingStyle, styles.metadataReducedGap, isUser && styles.alignEnd),
@@ -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;AA0DhD,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,GAAG,IAAI,EACR,EAAE,kBAAkB,+BAmMpB;yBA5Ne,aAAa"}
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;AA8EhD,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,GAAG,IAAI,EACR,EAAE,kBAAkB,+BAmMpB;yBA5Ne,aAAa"}
@@ -57,6 +57,11 @@ const styles = {
57
57
  kSiTet: "xg01cxk",
58
58
  kkrTdU: "x1ypdohk",
59
59
  kY2c9j: "x1vjfegm",
60
+ k7Eaqz: "xkagaj0",
61
+ kAzted: "x80b3aj",
62
+ k87sOh: "xijlfn0",
63
+ kLqNvP: "x1hsn8va",
64
+ k3aq6I: "x8i4i9p",
60
65
  $$css: true
61
66
  },
62
67
  inputDisabled: {
@@ -1 +1 @@
1
- {"version":3,"file":"CommandPaletteFooter.d.ts","sourceRoot":"","sources":["../../src/CommandPalette/CommandPaletteFooter.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAErC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgC5C,MAAM,WAAW,yBAA0B,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC1E,2CAA2C;IAC3C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,QAAQ,EACR,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,yBAAyB,+BA8B3B;yBArCe,oBAAoB"}
1
+ {"version":3,"file":"CommandPaletteFooter.d.ts","sourceRoot":"","sources":["../../src/CommandPalette/CommandPaletteFooter.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAErC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAiC5C,MAAM,WAAW,yBAA0B,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC1E,2CAA2C;IAC3C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,QAAQ,EACR,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,yBAAyB,+BAgC3B;yBAvCe,oBAAoB"}
@@ -18,6 +18,7 @@ import "../theme/tokens.stylex.js";
18
18
  import { colorVars, spacingVars, typeScaleVars, typographyVars } from "../theme/tokens.stylex.js";
19
19
  import { Kbd } from "../Kbd/index.js";
20
20
  import { themeProps } from "../utils/themeProps.js";
21
+ import { useTranslator } from "../i18n/index.js";
21
22
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
22
23
  const styles = {
23
24
  footer: {
@@ -61,6 +62,7 @@ export function CommandPaletteFooter({
61
62
  style,
62
63
  ...props
63
64
  }) {
65
+ const t = useTranslator();
64
66
  return /*#__PURE__*/_jsx("div", {
65
67
  ref: ref,
66
68
  ...mergeProps(themeProps('command-palette-footer'), stylex.props(styles.footer, xstyle), className, style),
@@ -74,21 +76,21 @@ export function CommandPaletteFooter({
74
76
  keys: "up"
75
77
  }), /*#__PURE__*/_jsx(Kbd, {
76
78
  keys: "down"
77
- }), "Navigate"]
79
+ }), t('@astryx.commandPalette.footer.navigate')]
78
80
  }), /*#__PURE__*/_jsxs("span", {
79
81
  ...{
80
82
  className: "x78zum5 x6s0dn4 xzye2dw"
81
83
  },
82
84
  children: [/*#__PURE__*/_jsx(Kbd, {
83
85
  keys: "enter"
84
- }), "Select"]
86
+ }), t('@astryx.commandPalette.footer.select')]
85
87
  }), /*#__PURE__*/_jsxs("span", {
86
88
  ...{
87
89
  className: "x78zum5 x6s0dn4 xzye2dw"
88
90
  },
89
91
  children: [/*#__PURE__*/_jsx(Kbd, {
90
92
  keys: "escape"
91
- }), "Close"]
93
+ }), t('@astryx.commandPalette.footer.close')]
92
94
  })]
93
95
  })
94
96
  });
@@ -1 +1 @@
1
- {"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../../src/DateTimeInput/DateTimeInput.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../../src/DateTimeInput/DateTimeInput.tsx"],"names":[],"mappings":"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"}
@@ -287,10 +287,10 @@ export function DateTimeInput({
287
287
  }, [timePendingInput, hasSeconds, timeMin, timeMax]);
288
288
  const resolvedTimePlaceholder = useMemo(() => {
289
289
  if (isTimeFocused && !timeDisplayValue) {
290
- return hourFormat === '12h' ? 'e.g., 2:30 PM' : 'e.g., 14:30';
290
+ return hourFormat === '12h' ? t('@astryx.dateTimeInput.timeHint12h') : t('@astryx.dateTimeInput.timeHint24h');
291
291
  }
292
292
  return timePlaceholder;
293
- }, [isTimeFocused, timeDisplayValue, hourFormat, timePlaceholder]);
293
+ }, [isTimeFocused, timeDisplayValue, hourFormat, timePlaceholder, t]);
294
294
 
295
295
  // --- Unified change handler ---
296
296
  const fireChange = useCallback(newValue => {
@@ -1 +1 @@
1
- {"version":3,"file":"DropdownMenuSubMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuSubMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAEH,OAAc,EAOZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAoB5D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAqF5C,UAAU,4BAA6B,SAAQ,IAAI,CACjD,SAAS,EACT,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC,2DAA2D;IAC3D,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,8CAA8C;IAC9C,KAAK,EAAE,SAAS,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,yEAAyE;IACzE,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,8CAA8C;IAC9C,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,mCAAmC;IACnC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mCAAmC;IACnC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,wBAAyB,SAAQ,4BAA4B;IAC5E;;;;;;;;OAQG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,wBAAwB,GAC9B,SAAS,CAoVX;yBAtVe,mBAAmB"}
1
+ {"version":3,"file":"DropdownMenuSubMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuSubMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAEH,OAAc,EAOZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAoB5D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAqF5C,UAAU,4BAA6B,SAAQ,IAAI,CACjD,SAAS,EACT,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC,2DAA2D;IAC3D,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,8CAA8C;IAC9C,KAAK,EAAE,SAAS,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,yEAAyE;IACzE,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,8CAA8C;IAC9C,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,mCAAmC;IACnC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mCAAmC;IACnC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,wBAAyB,SAAQ,4BAA4B;IAC5E;;;;;;;;OAQG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,wBAAwB,GAC9B,SAAS,CAwVX;yBA1Ve,mBAAmB"}
@@ -198,9 +198,13 @@ export function DropdownMenuSubMenu(props) {
198
198
 
199
199
  // Hover-intent: entering the trigger opens after a short delay; leaving
200
200
  // either surface closes after a delay. Hover-open does not steal focus.
201
+ // Hover intent and the shared hover→click guard only: this level owns its own
202
+ // click handling, roving focus and typeahead. popover="manual", so the
203
+ // invoker wiring other consumers need does not apply.
201
204
  const {
202
205
  triggerProps,
203
- contentProps
206
+ contentProps,
207
+ confirmHoverOpen
204
208
  } = useMenuHover({
205
209
  show: showLayer,
206
210
  hide: hideLayer,
@@ -213,18 +217,12 @@ export function DropdownMenuSubMenu(props) {
213
217
  }
214
218
  layer.show();
215
219
  if (options?.focusFirst) {
216
- requestAnimationFrame(() => {
217
- // Move focus into the flyout. When it has no focusable items yet
218
- // (e.g. an async submenu showing only a disabled "Loading…" row via
219
- // hasSpinner), focusFirst() finds nothing — fall back to focusing the
220
- // flyout container itself so keyboard ownership still transfers off
221
- // the parent list. Otherwise the parent would keep focus, letting
222
- // arrow keys rove the parent while the empty flyout stays open.
223
- const focusedItem = focusFirst();
224
- if (!focusedItem) {
225
- menuRef.current?.focus();
226
- }
227
- });
220
+ // Synchronous by design — see the focus note in useMenuHover. A
221
+ // still-loading flyout has no focusable item, so fall back to the
222
+ // container: keyboard ownership must leave the parent list either way.
223
+ if (!focusFirst()) {
224
+ menuRef.current?.focus();
225
+ }
228
226
  }
229
227
  }, [canOpen, layer, focusFirst, menuRef]);
230
228
  const close = useCallback(options => {
@@ -244,8 +242,14 @@ export function DropdownMenuSubMenu(props) {
244
242
  if (isDisabled) {
245
243
  return;
246
244
  }
247
- // Click toggles the flyout, moving focus into it on open.
245
+ // Toggles, except for the click that follows a hover-open (#3121).
248
246
  if (isOpen) {
247
+ if (confirmHoverOpen()) {
248
+ if (!focusFirst()) {
249
+ menuRef.current?.focus();
250
+ }
251
+ return;
252
+ }
249
253
  close({
250
254
  focusTrigger: true
251
255
  });
@@ -254,7 +258,7 @@ export function DropdownMenuSubMenu(props) {
254
258
  focusFirst: true
255
259
  });
256
260
  }
257
- }, [isDisabled, isOpen, open, close]);
261
+ }, [isDisabled, isOpen, open, close, confirmHoverOpen, focusFirst, menuRef]);
258
262
  const handleTriggerKeyDown = useCallback(e => {
259
263
  if (isDisabled) {
260
264
  return;
@@ -2,7 +2,7 @@
2
2
  * @file HoverCard.tsx
3
3
  * @input Uses React, useHoverCard hook
4
4
  * @output Exports HoverCard component for hover/focus triggered layers
5
- * @position Layer component; uses inline-safe trigger wrapper and renders the floating layer inline
5
+ * @position Layer component; inline-safe trigger wrapper, floating layer hosted by useLayer
6
6
  *
7
7
  * SYNC: When modified, update these files to stay in sync:
8
8
  * - /packages/core/src/HoverCard/HoverCard.test.tsx
@@ -1 +1 @@
1
- {"version":3,"file":"HoverCard.d.ts","sourceRoot":"","sources":["../../src/HoverCard/HoverCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,EAAsB,KAAK,YAAY,EAAE,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG7E,OAAO,EAAe,KAAK,qBAAqB,EAAC,MAAM,gBAAgB,CAAC;AACxE,OAAO,KAAK,EAAC,cAAc,EAAE,cAAc,EAAC,MAAM,mBAAmB,CAAC;AACtE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAG5C,YAAY,EAAC,qBAAqB,EAAC,MAAM,gBAAgB,CAAC;AAiB1D,MAAM,WAAW,cAAe,SAAQ,IAAI,CAC1C,SAAS,EACT,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,OAAO,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,qBAAqB,CAAC;IAErC;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC;;;;;;;OAOG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAEtC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAiBD;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,OAAO,EACP,SAAmB,EACnB,SAAoB,EACpB,KAAW,EACX,SAAe,EACf,YAAqB,EACrB,SAAgB,EAChB,KAAK,EACL,YAAY,EACZ,kBAA2B,EAC3B,MAAM,EACN,aAAa,EACb,MAAM,EACN,SAAS,EACT,KAAK,GACN,EAAE,cAAc,GAAG,YAAY,CAiH/B;yBAlIe,SAAS"}
1
+ {"version":3,"file":"HoverCard.d.ts","sourceRoot":"","sources":["../../src/HoverCard/HoverCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,EAAsB,KAAK,YAAY,EAAE,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG7E,OAAO,EAAe,KAAK,qBAAqB,EAAC,MAAM,gBAAgB,CAAC;AACxE,OAAO,KAAK,EAAC,cAAc,EAAE,cAAc,EAAC,MAAM,mBAAmB,CAAC;AACtE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAG5C,YAAY,EAAC,qBAAqB,EAAC,MAAM,gBAAgB,CAAC;AAiB1D,MAAM,WAAW,cAAe,SAAQ,IAAI,CAC1C,SAAS,EACT,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,OAAO,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,qBAAqB,CAAC;IAErC;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC;;;;;;;OAOG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAEtC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAiBD;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,OAAO,EACP,SAAmB,EACnB,SAAoB,EACpB,KAAW,EACX,SAAe,EACf,YAAqB,EACrB,SAAgB,EAChB,KAAK,EACL,YAAY,EACZ,kBAA2B,EAC3B,MAAM,EACN,aAAa,EACb,MAAM,EACN,SAAS,EACT,KAAK,GACN,EAAE,cAAc,GAAG,YAAY,CAyG/B;yBA1He,SAAS"}
@@ -6,7 +6,7 @@
6
6
  * @file HoverCard.tsx
7
7
  * @input Uses React, useHoverCard hook
8
8
  * @output Exports HoverCard component for hover/focus triggered layers
9
- * @position Layer component; uses inline-safe trigger wrapper and renders the floating layer inline
9
+ * @position Layer component; inline-safe trigger wrapper, floating layer hosted by useLayer
10
10
  *
11
11
  * SYNC: When modified, update these files to stay in sync:
12
12
  * - /packages/core/src/HoverCard/HoverCard.test.tsx
@@ -127,18 +127,10 @@ export function HoverCard({
127
127
  };
128
128
  }, [textOnly, hoverCard.ref, hoverCard.describedBy]);
129
129
 
130
- // Render the floating layer inline, in the same place on the server and the
131
- // client. The layer is a `popover` element opened via the Popover API, so the
132
- // browser promotes it to the top layer when shown — that already escapes
133
- // ancestor clipping, stacking, and transform containing-block traps, and CSS
134
- // anchor positioning resolves the trigger reference regardless of where the
135
- // element sits in the DOM, so no portal is needed to "escape" layout.
136
- //
137
- // The layer renders as inline-safe phrasing markup (a `<span>`, see
138
- // useHoverCard), which stays put inside a `<p>` instead of being reparented
139
- // by the HTML parser. That keeps the server markup and the first client
140
- // render identical, so there is no hydration mismatch — and it preserves the
141
- // inline-safety guarantee (no block elements injected into a paragraph).
130
+ // While closed, useLayer leaves only an inert <template> marker at this JSX
131
+ // position. When the card needs to open, it uses that marker to keep the
132
+ // final layer inline when the parent is safe or portal it outside a <p>,
133
+ // link, or other ancestor that cannot contain it safely.
142
134
  const renderedHoverCard = hoverCard.renderHoverCard(content, {
143
135
  xstyle,
144
136
  className,
@@ -1 +1 @@
1
- {"version":3,"file":"useHoverCard.d.ts","sourceRoot":"","sources":["../../src/HoverCard/useHoverCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AAEH,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,WAAW,EACjB,MAAM,OAAO,CAAC;AAEf,OAAO,EAEL,KAAK,kBAAkB,EACvB,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,mBAAmB,CAAC;AAgC3B;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEhE,MAAM,WAAW,gBAAgB;IAC/B;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,qBAAqB,CAAC;IAErC;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,GAAG,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAE9B;;;OAGG;IACH,WAAW,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAEtC;;;;OAIG;IACH,cAAc,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAEzC;;;OAGG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;;;;;OAOG;IACH,eAAe,EAAE,CACf,QAAQ,EAAE,SAAS,EACnB,KAAK,CAAC,EAAE,IAAI,CAAC,kBAAkB,EAAE,aAAa,CAAC,KAC5C,SAAS,CAAC;IAEf;;OAEG;IACH,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB;;OAEG;IACH,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAyBD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,YAAY,CAAC,OAAO,GAAE,gBAAqB,GAAG,eAAe,CAiT5E"}
1
+ {"version":3,"file":"useHoverCard.d.ts","sourceRoot":"","sources":["../../src/HoverCard/useHoverCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AAEH,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,WAAW,EACjB,MAAM,OAAO,CAAC;AAEf,OAAO,EAEL,KAAK,kBAAkB,EACvB,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,mBAAmB,CAAC;AA4B3B;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEhE,MAAM,WAAW,gBAAgB;IAC/B;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,qBAAqB,CAAC;IAErC;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,GAAG,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAE9B;;;OAGG;IACH,WAAW,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAEtC;;;;OAIG;IACH,cAAc,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAEzC;;;OAGG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;;;;;OAOG;IACH,eAAe,EAAE,CACf,QAAQ,EAAE,SAAS,EACnB,KAAK,CAAC,EAAE,IAAI,CAAC,kBAAkB,EAAE,aAAa,CAAC,KAC5C,SAAS,CAAC;IAEf;;OAEG;IACH,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB;;OAEG;IACH,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAyBD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,YAAY,CAAC,OAAO,GAAE,gBAAqB,GAAG,eAAe,CAkT5E"}