@astryxdesign/core 0.3.0-canary.ec85ba0 → 0.3.0-canary.ee705d8

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 (120) hide show
  1. package/dist/Chat/ChatDictationButton.d.ts.map +1 -1
  2. package/dist/Chat/ChatDictationButton.js +2 -1
  3. package/dist/Chat/ChatLayoutScrollButton.d.ts.map +1 -1
  4. package/dist/Chat/ChatLayoutScrollButton.js +2 -1
  5. package/dist/Chat/ChatSendButton.d.ts.map +1 -1
  6. package/dist/Chat/ChatSendButton.js +4 -3
  7. package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
  8. package/dist/CheckboxInput/CheckboxInput.js +1 -0
  9. package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
  10. package/dist/CodeBlock/CodeBlock.js +40 -47
  11. package/dist/CommandPalette/CommandPaletteItem.d.ts +1 -1
  12. package/dist/CommandPalette/CommandPaletteItem.d.ts.map +1 -1
  13. package/dist/CommandPalette/CommandPaletteItem.js +6 -3
  14. package/dist/CommandPalette/CommandPaletteList.js +1 -1
  15. package/dist/ComplexSelector/ComplexSelector.d.ts +1 -1
  16. package/dist/ComplexSelector/ComplexSelector.d.ts.map +1 -1
  17. package/dist/ComplexSelector/ComplexSelector.js +11 -8
  18. package/dist/ContextMenu/ContextMenu.js +1 -1
  19. package/dist/EmptyState/EmptyState.js +1 -1
  20. package/dist/Indicator/CheckIndicator.d.ts +2 -2
  21. package/dist/Indicator/CheckIndicator.d.ts.map +1 -1
  22. package/dist/Indicator/CheckIndicator.js +51 -13
  23. package/dist/Indicator/CheckboxIndicator.d.ts +1 -1
  24. package/dist/Indicator/CheckboxIndicator.d.ts.map +1 -1
  25. package/dist/Indicator/CheckboxIndicator.js +4 -4
  26. package/dist/Indicator/RadioIndicator.d.ts +1 -1
  27. package/dist/Indicator/RadioIndicator.d.ts.map +1 -1
  28. package/dist/Indicator/RadioIndicator.js +8 -8
  29. package/dist/Indicator/index.d.ts +1 -1
  30. package/dist/Indicator/index.d.ts.map +1 -1
  31. package/dist/Indicator/indicatorRegistry.d.ts +38 -3
  32. package/dist/Indicator/indicatorRegistry.d.ts.map +1 -1
  33. package/dist/Indicator/indicatorRegistry.js +42 -2
  34. package/dist/Indicator/types.d.ts +20 -2
  35. package/dist/Indicator/types.d.ts.map +1 -1
  36. package/dist/Indicator/useIndicator.d.ts +8 -2
  37. package/dist/Indicator/useIndicator.d.ts.map +1 -1
  38. package/dist/Indicator/useIndicator.js +7 -1
  39. package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
  40. package/dist/MultiSelector/MultiSelector.js +18 -8
  41. package/dist/NumberInput/NumberInput.d.ts +10 -1
  42. package/dist/NumberInput/NumberInput.d.ts.map +1 -1
  43. package/dist/NumberInput/NumberInput.js +7 -5
  44. package/dist/Switch/Switch.d.ts.map +1 -1
  45. package/dist/Switch/Switch.js +1 -0
  46. package/dist/TextArea/TextArea.d.ts +10 -1
  47. package/dist/TextArea/TextArea.d.ts.map +1 -1
  48. package/dist/TextArea/TextArea.js +12 -4
  49. package/dist/TextInput/TextInput.d.ts +10 -1
  50. package/dist/TextInput/TextInput.d.ts.map +1 -1
  51. package/dist/TextInput/TextInput.js +6 -4
  52. package/dist/Timestamp/TimestampHoverCard.d.ts.map +1 -1
  53. package/dist/Timestamp/TimestampHoverCard.js +16 -34
  54. package/dist/TopNav/TopNavMegaMenu.d.ts +7 -0
  55. package/dist/TopNav/TopNavMegaMenu.d.ts.map +1 -1
  56. package/dist/TopNav/TopNavMegaMenu.js +67 -20
  57. package/dist/astryx.css +1 -2
  58. package/dist/astryx.umd.js +55 -55
  59. package/dist/astryx.umd.js.map +4 -4
  60. package/dist/hooks/index.d.ts +2 -0
  61. package/dist/hooks/index.d.ts.map +1 -1
  62. package/dist/hooks/index.js +1 -0
  63. package/dist/hooks/useClipboard.d.ts +59 -0
  64. package/dist/hooks/useClipboard.d.ts.map +1 -0
  65. package/dist/hooks/useClipboard.js +106 -0
  66. package/dist/hooks/useTreeFocus.d.ts.map +1 -1
  67. package/dist/hooks/useTreeFocus.js +9 -3
  68. package/package.json +2 -2
  69. package/src/Chat/Chat.doc.mjs +2 -0
  70. package/src/Chat/ChatDictationButton.tsx +7 -1
  71. package/src/Chat/ChatLayoutScrollButton.tsx +7 -1
  72. package/src/Chat/ChatSendButton.tsx +2 -3
  73. package/src/CheckboxInput/CheckboxInput.test.tsx +32 -0
  74. package/src/CheckboxInput/CheckboxInput.tsx +1 -0
  75. package/src/CodeBlock/CodeBlock.doc.mjs +1 -0
  76. package/src/CodeBlock/CodeBlock.test.tsx +24 -0
  77. package/src/CodeBlock/CodeBlock.tsx +30 -61
  78. package/src/CommandPalette/CommandPaletteItem.tsx +7 -4
  79. package/src/CommandPalette/CommandPaletteList.tsx +2 -2
  80. package/src/ComplexSelector/ComplexSelector.tsx +10 -9
  81. package/src/ContextMenu/ContextMenu.tsx +1 -1
  82. package/src/DateInput/DateInput.doc.mjs +1 -1
  83. package/src/DateRangeInput/DateRangeInput.doc.mjs +1 -1
  84. package/src/DateTimeInput/DateTimeInput.doc.mjs +1 -1
  85. package/src/EmptyState/EmptyState.tsx +2 -2
  86. package/src/Indicator/CheckIndicator.tsx +68 -12
  87. package/src/Indicator/CheckboxIndicator.tsx +11 -5
  88. package/src/Indicator/Indicator.doc.mjs +16 -7
  89. package/src/Indicator/Indicator.test.tsx +224 -0
  90. package/src/Indicator/RadioIndicator.tsx +29 -19
  91. package/src/Indicator/index.ts +4 -1
  92. package/src/Indicator/indicatorRegistry.test.tsx +106 -0
  93. package/src/Indicator/indicatorRegistry.ts +52 -4
  94. package/src/Indicator/types.ts +23 -2
  95. package/src/Indicator/useIndicator.ts +13 -3
  96. package/src/MultiSelector/MultiSelector.doc.mjs +5 -0
  97. package/src/MultiSelector/MultiSelector.test.tsx +117 -0
  98. package/src/MultiSelector/MultiSelector.tsx +66 -54
  99. package/src/NumberInput/NumberInput.doc.mjs +18 -2
  100. package/src/NumberInput/NumberInput.test.tsx +112 -0
  101. package/src/NumberInput/NumberInput.tsx +15 -4
  102. package/src/ProgressBar/ProgressBar.doc.mjs +1 -1
  103. package/src/Switch/Switch.test.tsx +32 -0
  104. package/src/Switch/Switch.tsx +1 -0
  105. package/src/TextArea/TextArea.doc.mjs +18 -2
  106. package/src/TextArea/TextArea.test.tsx +145 -0
  107. package/src/TextArea/TextArea.tsx +20 -4
  108. package/src/TextInput/TextInput.doc.mjs +18 -2
  109. package/src/TextInput/TextInput.test.tsx +112 -0
  110. package/src/TextInput/TextInput.tsx +14 -3
  111. package/src/Timestamp/TimestampHoverCard.tsx +13 -35
  112. package/src/TopNav/TopNavMegaMenu.test.tsx +433 -33
  113. package/src/TopNav/TopNavMegaMenu.tsx +83 -24
  114. package/src/hooks/index.ts +3 -0
  115. package/src/hooks/useClipboard.doc.mjs +86 -0
  116. package/src/hooks/useClipboard.test.tsx +151 -0
  117. package/src/hooks/useClipboard.ts +135 -0
  118. package/src/hooks/useTreeFocus.test.tsx +50 -0
  119. package/src/hooks/useTreeFocus.ts +14 -3
  120. package/src/i18n/InternationalizationProvider.doc.mjs +7 -2
@@ -1 +1 @@
1
- {"version":3,"file":"ChatDictationButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatDictationButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAC,0BAA0B,EAAC,MAAM,wBAAwB,CAAC;AAMvE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAO5C,MAAM,WAAW,wBAAyB,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC1E,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC,sEAAsE;IACtE,SAAS,EAAE,0BAA0B,CAAC;IACtC,iCAAiC;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,6EAA6E;IAC7E,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,iCAAiC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAiDD;;;;;;;;GAQG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,GAAG,EACH,SAAS,EACT,IAAW,EACX,uBAA8B,EAC9B,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,wBAAwB,4BAoE1B;yBA9Ee,mBAAmB"}
1
+ {"version":3,"file":"ChatDictationButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatDictationButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAC,0BAA0B,EAAC,MAAM,wBAAwB,CAAC;AAMvE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,MAAM,WAAW,wBAAyB,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC1E,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC,sEAAsE;IACtE,SAAS,EAAE,0BAA0B,CAAC;IACtC,iCAAiC;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,6EAA6E;IAC7E,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,iCAAiC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAiDD;;;;;;;;GAQG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,GAAG,EACH,SAAS,EACT,IAAW,EACX,uBAA8B,EAC9B,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,wBAAwB,4BAyE1B;yBAnFe,mBAAmB"}
@@ -24,6 +24,7 @@ import { colorVars, radiusVars } from "../theme/tokens.stylex.js";
24
24
  import { Button } from "../Button/index.js";
25
25
  import { Icon } from "../Icon/index.js";
26
26
  import { mergeProps } from "../utils/index.js";
27
+ import { themeProps } from "../utils/themeProps.js";
27
28
  import { useTranslator } from "../i18n/index.js";
28
29
 
29
30
  // =============================================================================
@@ -112,7 +113,7 @@ export function ChatDictationButton({
112
113
  } = SIZE_CONFIG[size];
113
114
  return /*#__PURE__*/_jsxs("span", {
114
115
  ref: ref,
115
- ...mergeProps(stylex.props(styles.wrapper, xstyle), className, style),
116
+ ...mergeProps(themeProps('chat-dictation-button'), stylex.props(styles.wrapper, xstyle), className, style),
116
117
  ...rest,
117
118
  children: [isListening && /*#__PURE__*/_jsx("span", {
118
119
  "aria-hidden": true,
@@ -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;AAY1B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,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;AA2DD;;;;;;;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,qBA6B7B;yBAtCe,sBAAsB"}
1
+ {"version":3,"file":"ChatLayoutScrollButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatLayoutScrollButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,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;AA2DD;;;;;;;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,qBAkC7B;yBA3Ce,sBAAsB"}
@@ -22,6 +22,7 @@ import { colorVars, spacingVars, radiusVars, shadowVars, durationVars, easeVars
22
22
  import { Icon } from "../Icon/index.js";
23
23
  import { Button } from "../Button/index.js";
24
24
  import { mergeProps } from "../utils/index.js";
25
+ import { themeProps } from "../utils/themeProps.js";
25
26
  import { useTranslator } from "../i18n/index.js";
26
27
 
27
28
  // =============================================================================
@@ -76,7 +77,7 @@ export function ChatLayoutScrollButton({
76
77
  const t = useTranslator();
77
78
  return /*#__PURE__*/_jsx("div", {
78
79
  ref: ref,
79
- ...mergeProps(stylex.props(styles.wrapper, xstyle), className, style),
80
+ ...mergeProps(themeProps('chat-layout-scroll-button'), stylex.props(styles.wrapper, xstyle), className, style),
80
81
  ...rest,
81
82
  children: /*#__PURE__*/_jsx("div", {
82
83
  ...{
@@ -1 +1 @@
1
- {"version":3,"file":"ChatSendButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatSendButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAM5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,MAAM,WAAW,mBAAoB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACvE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC,kFAAkF;IAClF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gFAAgF;IAChF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iFAAiF;IACjF,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,mDAAmD;IACnD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,iCAAiC;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACpB;AAiBD;;;;;;;;;;GAUG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,SAAS,CAgDpE;yBAhDe,cAAc"}
1
+ {"version":3,"file":"ChatSendButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatSendButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAM5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,MAAM,WAAW,mBAAoB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACvE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC,kFAAkF;IAClF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gFAAgF;IAChF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iFAAiF;IACjF,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,mDAAmD;IACnD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,iCAAiC;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACpB;AAiBD;;;;;;;;;;GAUG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,SAAS,CA8CpE;yBA9Ce,cAAc"}
@@ -21,6 +21,7 @@ import * as stylex from '@stylexjs/stylex';
21
21
  import { Button } from "../Button/index.js";
22
22
  import { useIcon } from "../Icon/index.js";
23
23
  import { useChatComposerContext } from "./ChatContext.js";
24
+ import { mergeProps } from "../utils/index.js";
24
25
  import { themeProps } from "../utils/themeProps.js";
25
26
  import { useTranslator } from "../i18n/index.js";
26
27
 
@@ -85,9 +86,9 @@ export function ChatSendButton(props) {
85
86
  isDisabled: !isStopShown && isDisabled,
86
87
  onClick: isStopShown ? onStop : handleSend,
87
88
  ...rest,
88
- ...themeProps('chat-send-button'),
89
- className: className,
90
- style: style,
89
+ ...mergeProps(themeProps('chat-send-button'), {
90
+ className
91
+ }, style),
91
92
  xstyle: [styles.root, xstyle]
92
93
  });
93
94
  }
@@ -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,+BAkMpB;yBA3Ne,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;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"}
@@ -233,6 +233,7 @@ export function CheckboxInput({
233
233
  ,
234
234
  disabled: isDisabled && !isFocusableDisabled,
235
235
  "aria-disabled": isFocusableDisabled ? 'true' : undefined,
236
+ form: isFocusableDisabled ? '' : undefined,
236
237
  readOnly: isReadOnly,
237
238
  required: isRequired,
238
239
  onChange: e => {
@@ -1 +1 @@
1
- {"version":3,"file":"CodeBlock.d.ts","sourceRoot":"","sources":["../../src/CodeBlock/CodeBlock.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA4B5C,OAAO,EAAc,KAAK,qBAAqB,EAAC,MAAM,iBAAiB,CAAC;AAmXxE,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,CACV,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,MAAM,KACb;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAC,EAAE,CAAC;IAClD,aAAa,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC5C;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,qBAAqB,CAAC;CACrC;AAqPD;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,QAAsB,EACtB,KAAK,EACL,gBAAuB,EACvB,cAAsB,EACtB,cAAc,EACd,aAAoB,EACpB,MAAM,EACN,SAAiB,EACjB,SAAS,EACT,aAAqB,EACrB,oBAAyB,EACzB,IAAW,EACX,KAAK,EAAE,SAAyB,EAChC,SAAkB,EAClB,SAAS,EAAE,eAAe,EAC1B,aAAsB,EACtB,WAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,cAAc,qBA2OhB;yBAnQe,SAAS"}
1
+ {"version":3,"file":"CodeBlock.d.ts","sourceRoot":"","sources":["../../src/CodeBlock/CodeBlock.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6B5C,OAAO,EAAc,KAAK,qBAAqB,EAAC,MAAM,iBAAiB,CAAC;AAwWxE,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,CACV,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,MAAM,KACb;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAC,EAAE,CAAC;IAClD,aAAa,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC5C;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,qBAAqB,CAAC;CACrC;AAqPD;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,QAAsB,EACtB,KAAK,EACL,gBAAuB,EACvB,cAAsB,EACtB,cAAc,EACd,aAAoB,EACpB,MAAM,EACN,SAAiB,EACjB,SAAS,EACT,aAAqB,EACrB,oBAAyB,EACzB,IAAW,EACX,KAAK,EAAE,SAAyB,EAChC,SAAkB,EAClB,SAAS,EAAE,eAAe,EAC1B,aAAsB,EACtB,WAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,cAAc,qBAsNhB;yBA9Oe,SAAS"}
@@ -14,8 +14,9 @@ import * as stylex from '@stylexjs/stylex';
14
14
  import "../theme/tokens.stylex.js";
15
15
  import { colorVars, spacingVars, radiusVars, typographyVars, fontWeightVars, typeScaleVars, borderVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
16
16
  import { mergeProps } from "../utils/index.js";
17
- import { useAnnounce } from "../hooks/useAnnounce.js";
17
+ import { useClipboard } from "../hooks/useClipboard.js";
18
18
  import { Icon } from "../Icon/index.js";
19
+ import { IconButton } from "../IconButton/index.js";
19
20
  import { tokenize, tokenizeAsync, flatTokensToLines, SYNC_TOKENIZE_THRESHOLD } from "./tokenizer.js";
20
21
  import { ensureHighlightStyles } from "./highlightStyles.js";
21
22
  import { applyHighlightRangesChunked } from "./highlightRanges.js";
@@ -148,6 +149,16 @@ const styles = {
148
149
  sizeMd: {
149
150
  kGuDYH: "xp03k98",
150
151
  $$css: true
152
+ },
153
+ copyButton: {
154
+ kMwMTN: "x1mjzq1q",
155
+ $$css: true
156
+ },
157
+ copyButtonAbsolute: {
158
+ kVAEAm: "x10l6tqk",
159
+ k87sOh: "xctzyg",
160
+ kt4wiu: "x72tfeb",
161
+ $$css: true
151
162
  }
152
163
  };
153
164
 
@@ -437,18 +448,15 @@ export function CodeBlock({
437
448
  ...props
438
449
  }) {
439
450
  const t = useTranslator();
440
- const [copied, setCopied] = useState(false);
441
- const copyResetTimerRef = useRef(null);
442
- const announce = useAnnounce();
443
-
444
- // Clear a pending "copied" reset when the block unmounts.
445
- useEffect(() => {
446
- return () => {
447
- if (copyResetTimerRef.current != null) {
448
- clearTimeout(copyResetTimerRef.current);
449
- }
450
- };
451
- }, []);
451
+ // Owns the clipboard write, the transient copied flag, its reset timer, and
452
+ // the polite copy announcement (a swapped aria-label alone is not reliably
453
+ // announced) — shared with Timestamp via the same hook.
454
+ const {
455
+ copy,
456
+ isCopied: copied
457
+ } = useClipboard({
458
+ announce: t('@astryx.codeBlock.copied')
459
+ });
452
460
  const useSpans = highlightMode === 'spans' || highlightMode === 'auto' && !hasHighlightAPI() || highlightMode === 'auto' && isSafari();
453
461
  const lines = useMemo(() => {
454
462
  const l = code.split('\n');
@@ -460,26 +468,11 @@ export function CodeBlock({
460
468
  const tokenLines = useTokenLines(code, language, customTokenizer);
461
469
  const highlightSet = useMemo(() => highlightLines ? new Set(highlightLines) : null, [highlightLines]);
462
470
  const handleCopy = useCallback(async () => {
463
- try {
464
- await navigator.clipboard.writeText(code);
465
- setCopied(true);
466
- // Swapping the button's aria-label alone isn't reliably announced by
467
- // screen readers, so confirm the copy via a polite live region.
468
- announce(t('@astryx.codeBlock.copied'));
471
+ const didCopy = await copy(code);
472
+ if (didCopy) {
469
473
  onCopy?.();
470
- // Restart the reset timer on every copy — otherwise a rapid re-copy
471
- // is reverted early by the previous click's timer.
472
- if (copyResetTimerRef.current != null) {
473
- clearTimeout(copyResetTimerRef.current);
474
- }
475
- copyResetTimerRef.current = setTimeout(() => {
476
- copyResetTimerRef.current = null;
477
- setCopied(false);
478
- }, 2000);
479
- } catch {
480
- // Clipboard failures leave the copied state unchanged.
481
474
  }
482
- }, [code, onCopy, announce, t]);
475
+ }, [code, copy, onCopy]);
483
476
  const sizeStyle = size === 'sm' ? styles.sizeSm : styles.sizeMd;
484
477
  // Digits in the largest line number — sizes the gutter column width.
485
478
  const maxLineDigits = String(lines.length).length;
@@ -496,28 +489,28 @@ export function CodeBlock({
496
489
  const scrollStyle = maxHeight ? {
497
490
  maxHeight: typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight
498
491
  } : undefined;
499
- const copyIcon = /*#__PURE__*/_jsx(Icon, {
500
- icon: copied ? 'check' : 'copy',
492
+ const copyButtonEl = hasCopyButton ? /*#__PURE__*/_jsx(IconButton, {
493
+ variant: "ghost",
501
494
  size: "sm",
502
- color: "inherit"
503
- });
504
- const copyButtonEl = hasCopyButton ? /*#__PURE__*/_jsx("button", {
505
- type: "button",
495
+ icon: /*#__PURE__*/_jsx(Icon, {
496
+ icon: copied ? 'check' : 'copy',
497
+ size: "sm",
498
+ color: "inherit"
499
+ })
500
+ // A visible "Copy" hover/focus hint via Button's built-in tooltip. It
501
+ // stays "Copy" after copying — the copy → check icon flip is the
502
+ // confirmation, not a tooltip change. The aria-label still swaps to the
503
+ // localized "Copied" for assistive tech, backed by the announcement.
504
+ ,
505
+ tooltip: t('@astryx.codeBlock.copyCode'),
506
+ label: copied ? t('@astryx.codeBlock.copied') : t('@astryx.codeBlock.copyCode'),
506
507
  onClick: e => {
507
508
  // Stop propagation so copying does not toggle the collapsible header.
508
509
  e.stopPropagation();
509
510
  void handleCopy();
510
511
  },
511
- "aria-label": copied ? t('@astryx.codeBlock.copied') : t('@astryx.codeBlock.copyCode'),
512
- ...{
513
- 0: {
514
- className: "x3nfvp2 x6s0dn4 xl56j7k x9epnlk x3kzqx6 xx3sua9 xjbqb8w xe9uy6x x1mjzq1q x1ypdohk x14ju556"
515
- },
516
- 1: {
517
- className: "x3nfvp2 x6s0dn4 xl56j7k x9epnlk x3kzqx6 xx3sua9 xjbqb8w xe9uy6x x1mjzq1q x1ypdohk x14ju556 x10l6tqk xctzyg x72tfeb"
518
- }
519
- }[!!!showHeader << 0],
520
- children: copyIcon
512
+ xstyle: [styles.copyButton, !showHeader && styles.copyButtonAbsolute],
513
+ ...themeProps('codeblock-copy-button')
521
514
  }) : null;
522
515
  const headerEl = showHeader ? /*#__PURE__*/_jsxs("div", {
523
516
  ...{
@@ -52,7 +52,7 @@ export interface CommandPaletteItemProps extends Omit<BaseProps<HTMLDivElement>,
52
52
  * </CommandPaletteItem>
53
53
  * ```
54
54
  */
55
- export declare function CommandPaletteItem({ value, onSelect, isHighlighted: controlledHighlighted, isSelected: controlledSelected, isDisabled, children, ref, xstyle, className, style, ...props }: CommandPaletteItemProps): import("react").JSX.Element;
55
+ export declare function CommandPaletteItem({ value, onSelect, isHighlighted: controlledHighlighted, isSelected: controlledSelected, isDisabled, children, ref, xstyle, className, style, onClick: onClickProp, onMouseEnter: onMouseEnterProp, ...props }: CommandPaletteItemProps): import("react").JSX.Element;
56
56
  export declare namespace CommandPaletteItem {
57
57
  var displayName: string;
58
58
  }
@@ -1 +1 @@
1
- {"version":3,"file":"CommandPaletteItem.d.ts","sourceRoot":"","sources":["../../src/CommandPalette/CommandPaletteItem.tsx"],"names":[],"mappings":"AAGA;;;;;;;;GAQG;AAEH,OAAO,EAA0C,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAwD5C,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CACnD,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,UAAU,CACxB;IACC,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,+EAA+E;IAC/E,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,QAAQ,EACR,aAAa,EAAE,qBAAqB,EACpC,UAAU,EAAE,kBAAkB,EAC9B,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,uBAAuB,+BAkFzB;yBA9Fe,kBAAkB"}
1
+ {"version":3,"file":"CommandPaletteItem.d.ts","sourceRoot":"","sources":["../../src/CommandPalette/CommandPaletteItem.tsx"],"names":[],"mappings":"AAGA;;;;;;;;GAQG;AAEH,OAAO,EAA0C,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAyD5C,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CACnD,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,UAAU,CACxB;IACC,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,+EAA+E;IAC/E,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,QAAQ,EACR,aAAa,EAAE,qBAAqB,EACpC,UAAU,EAAE,kBAAkB,EAC9B,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,gBAAgB,EAC9B,GAAG,KAAK,EACT,EAAE,uBAAuB,+BAkFzB;yBAhGe,kBAAkB"}
@@ -14,6 +14,7 @@
14
14
  import { useCallback, useEffect, useMemo, useRef } from 'react';
15
15
  import * as stylex from '@stylexjs/stylex';
16
16
  import { mergeProps, mergeRefs } from "../utils/index.js";
17
+ import { composeEventHandlers } from "../utils/composeEventHandlers.js";
17
18
  import "../theme/tokens.stylex.js";
18
19
  import { colorVars, spacingVars, radiusVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
19
20
  import { useCommandPaletteContext } from "./CommandPaletteContext.js";
@@ -87,6 +88,8 @@ export function CommandPaletteItem({
87
88
  xstyle,
88
89
  className,
89
90
  style,
91
+ onClick: onClickProp,
92
+ onMouseEnter: onMouseEnterProp,
90
93
  ...props
91
94
  }) {
92
95
  const ctx = useCommandPaletteContext();
@@ -135,15 +138,15 @@ export function CommandPaletteItem({
135
138
  }, [isDisabled, itemIndex, ctx]);
136
139
  return /*#__PURE__*/_jsx("div", {
137
140
  ref: mergeRefs(ref, itemRef),
141
+ ...props,
138
142
  id: ctx && itemIndex >= 0 ? ctx.getItemId(itemIndex) : undefined,
139
143
  role: "option",
140
144
  "aria-selected": isSelected,
141
145
  "aria-disabled": isDisabled || undefined,
142
146
  "data-value": value,
143
- onClick: handleClick,
144
- onMouseEnter: handleMouseEnter,
147
+ onClick: composeEventHandlers(onClickProp, handleClick),
148
+ onMouseEnter: composeEventHandlers(onMouseEnterProp, handleMouseEnter),
145
149
  ...mergeProps(themeProps('command-palette-item'), stylex.props(styles.item, !isDisabled && styles.itemHover, isHighlighted && styles.itemHighlighted, isSelected && styles.itemSelected, isDisabled && styles.itemDisabled, xstyle), className, style),
146
- ...props,
147
150
  children: children
148
151
  });
149
152
  }
@@ -66,11 +66,11 @@ export function CommandPaletteList({
66
66
  const ctx = useCommandPaletteContext();
67
67
  return /*#__PURE__*/_jsx("div", {
68
68
  ref: ref,
69
+ ...props,
69
70
  id: ctx?.listId,
70
71
  role: "listbox",
71
72
  "aria-label": label,
72
73
  ...mergeProps(themeProps('command-palette-list'), stylex.props(styles.list, xstyle), className, style),
73
- ...props,
74
74
  children: children
75
75
  });
76
76
  }
@@ -101,7 +101,7 @@ export interface ComplexSelectorProps<Value> extends Omit<BaseProps<HTMLDivEleme
101
101
  * </ComplexSelector>
102
102
  * ```
103
103
  */
104
- export declare function ComplexSelector<Value>({ label, value, onChange, changeAction, children, triggerLabel, placeholder: placeholderFromProps, isLabelHidden, description, isOptional, isRequired, isDisabled, isLoading, status, statusVariant, labelTooltip, size, width, placement, contentXstyle, xstyle, className, style, 'data-testid': testId, ...props }: ComplexSelectorProps<Value>): React.JSX.Element;
104
+ export declare function ComplexSelector<Value>({ label, value, onChange, changeAction, children, triggerLabel, placeholder: placeholderFromProps, isLabelHidden, description, isOptional, isRequired, isDisabled, isLoading, status, statusVariant, labelTooltip, size, width, placement, contentXstyle, xstyle, className, style, 'data-testid': testId, onClick: onClickProp, ...props }: ComplexSelectorProps<Value>): React.JSX.Element;
105
105
  export declare namespace ComplexSelector {
106
106
  var displayName: string;
107
107
  }
@@ -1 +1 @@
1
- {"version":3,"file":"ComplexSelector.d.ts","sourceRoot":"","sources":["../../src/ComplexSelector/ComplexSelector.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAE,EAKZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AACnD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,EAA4B,KAAK,kBAAkB,EAAC,MAAM,UAAU,CAAC;AAiB5E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAgH9C,MAAM,MAAM,mBAAmB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAErD,MAAM,WAAW,0BAA0B;IACzC,4CAA4C;IAC5C,MAAM,EAAE,OAAO,CAAC;IAChB,iDAAiD;IACjD,MAAM,EAAE,OAAO,CAAC;IAChB,gCAAgC;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,yCAAyC;IACzC,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IACtC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,oBAAoB,CAAC,KAAK,CAAE,SAAQ,IAAI,CACvD,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,UAAU,CACxB;IACC,wDAAwD;IACxD,KAAK,EAAE,MAAM,CAAC;IACd,gCAAgC;IAChC,KAAK,EAAE,KAAK,CAAC;IACb,sDAAsD;IACtD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAClC,kEAAkE;IAClE,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACtD,wEAAwE;IACxE,QAAQ,EAAE,CACR,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,EAChC,KAAK,EAAE,MAAM,IAAI,EACjB,KAAK,EAAE,0BAA0B,KAC9B,SAAS,CAAC;IACf,iDAAiD;IACjD,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,sDAAsD;IACtD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,gDAAgD;IAChD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gCAAgC;IAChC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gCAAgC;IAChC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6BAA6B;IAC7B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,yBAAyB;IACzB,MAAM,CAAC,EAAE,qBAAqB,CAAC;IAC/B,wBAAwB;IACxB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,8BAA8B;IAC9B,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,0BAA0B;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,uBAAuB;IACvB,SAAS,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,KAAK,CAAC;IAChD,qDAAqD;IACrD,aAAa,CAAC,EAAE,YAAY,CAAC;IAC7B,yCAAyC;IACzC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,EACrC,KAAK,EACL,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,QAAQ,EACR,YAAY,EACZ,WAAW,EAAE,oBAAoB,EACjC,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,SAAiB,EACjB,MAAM,EACN,aAA0B,EAC1B,YAAY,EACZ,IAAW,EACX,KAAK,EACL,SAAmB,EACnB,aAAa,EACb,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,KAAK,CAAC,qBAgK7B;yBA1Le,eAAe"}
1
+ {"version":3,"file":"ComplexSelector.d.ts","sourceRoot":"","sources":["../../src/ComplexSelector/ComplexSelector.tsx"],"names":[],"mappings":"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"}
@@ -25,6 +25,8 @@ import { usePopover } from "../Popover/usePopover.js";
25
25
  import "../theme/tokens.stylex.js";
26
26
  import { colorVars, durationVars, easeVars, radiusVars, sizeVars, spacingVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
27
27
  import { mergeProps } from "../utils/index.js";
28
+ import { composeEventHandlers } from "../utils/composeEventHandlers.js";
29
+ import { focusOutlineStyles } from "../utils/focusOutline.stylex.js";
28
30
  import { themeProps } from "../utils/themeProps.js";
29
31
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
30
32
  const styles = {
@@ -123,11 +125,6 @@ const styles = {
123
125
  disabled: {
124
126
  kkrTdU: "x1h6gzvc",
125
127
  $$css: true
126
- },
127
- focusRing: {
128
- k8PahR: "x1oqel4m",
129
- kfQpEX: "x1fanpfn",
130
- $$css: true
131
128
  }
132
129
  };
133
130
  /**
@@ -182,6 +179,7 @@ export function ComplexSelector({
182
179
  className,
183
180
  style,
184
181
  'data-testid': testId,
182
+ onClick: onClickProp,
185
183
  ...props
186
184
  }) {
187
185
  const t = useTranslator();
@@ -228,15 +226,20 @@ export function ComplexSelector({
228
226
  ref: popover.triggerRef,
229
227
  "data-testid": testId,
230
228
  ...props,
231
- onClick: () => {
229
+ onClick: composeEventHandlers(onClickProp, () => {
232
230
  if (!isDisabled) {
233
231
  popover.toggle();
234
232
  }
235
- },
233
+ }),
236
234
  ...mergeProps(themeProps('complex-selector', {
237
235
  size,
238
236
  status: status?.type ?? null
239
- }), stylex.props(inputWrapperStyles.base, styles.triggerContainer, styles[size], styles.focusRing, isDisabled && inputWrapperStyles.disabled, isDisabled && styles.disabled, triggerLabel == null && styles.placeholder, xstyle), className, style),
237
+ }), stylex.props(inputWrapperStyles.base, styles.triggerContainer, styles[size],
238
+ // The ring belongs to the wrapper (the focusable `<button>` sits
239
+ // inside it), but it must still be a KEYBOARD ring: `:focus-within`
240
+ // matched a mouse click on the trigger and drew the outline for
241
+ // pointer users too. `focusWithin` here is `:has(:focus-visible)`.
242
+ focusOutlineStyles.focusWithin, isDisabled && inputWrapperStyles.disabled, isDisabled && styles.disabled, triggerLabel == null && styles.placeholder, xstyle), className, style),
240
243
  children: [/*#__PURE__*/_jsx("button", {
241
244
  id: triggerId,
242
245
  type: "button",
@@ -337,9 +337,9 @@ export function ContextMenu({
337
337
  return /*#__PURE__*/_jsxs(_Fragment, {
338
338
  children: [/*#__PURE__*/_jsxs("div", {
339
339
  ref: mergeRefs(ref, triggerRef),
340
+ ...triggerProps,
340
341
  onContextMenu: handleContextMenu,
341
342
  ...longPressHandlers,
342
- ...triggerProps,
343
343
  "data-testid": testId,
344
344
  ...stylex.props(styles.trigger, ...(triggerXstyle ? Array.isArray(triggerXstyle) ? triggerXstyle : [triggerXstyle] : [])),
345
345
  children: [children, /*#__PURE__*/_jsx("span", {
@@ -77,11 +77,11 @@ export function EmptyState({
77
77
  const HeadingTag = `h${headingLevel}`;
78
78
  return /*#__PURE__*/_jsxs("div", {
79
79
  ref: ref,
80
+ ...props,
80
81
  role: "status",
81
82
  ...mergeProps(themeProps('empty-state', {
82
83
  variant: isCompact ? 'compact' : null
83
84
  }), stylex.props(styles.container, isCompact && styles.containerCompact, xstyle), className, style),
84
- ...props,
85
85
  children: [icon != null && /*#__PURE__*/_jsx("div", {
86
86
  "aria-hidden": "true",
87
87
  children: icon
@@ -6,14 +6,14 @@ import type { IndicatorProps } from './types';
6
6
  * state, or focus behavior; the option or row that hosts it keeps all of that.
7
7
  *
8
8
  * @example
9
- * ```tsx
9
+ * ```
10
10
  * <CheckIndicator state={isSelected ? 'checked' : 'unchecked'} size="sm" />
11
11
  * ```
12
12
  *
13
13
  * Swap every single-selection mark for a radio:
14
14
  *
15
15
  * @example
16
- * ```tsx
16
+ * ```
17
17
  * import {RadioIndicator} from '@astryxdesign/core/Indicator';
18
18
  *
19
19
  * defineTheme({name: 'brand', indicators: {check: RadioIndicator}});
@@ -1 +1 @@
1
- {"version":3,"file":"CheckIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/CheckIndicator.tsx"],"names":[],"mappings":"AAiCA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AAQ5C;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,IAAW,EACX,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,IAAI,EACR,EAAE,cAAc,CAAC,iBAAiB,CAAC,sCA6CnC;yBAvDe,cAAc"}
1
+ {"version":3,"file":"CheckIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/CheckIndicator.tsx"],"names":[],"mappings":"AAoCA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AA6B5C;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,IAAW,EACX,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,IAAI,EACR,EAAE,cAAc,CAAC,iBAAiB,CAAC,sCA6EnC;yBAvFe,cAAc"}
@@ -29,13 +29,36 @@
29
29
  * is an icon, and `astryx-icon` plus the host's target already reach it.
30
30
  */
31
31
 
32
+ import * as stylex from '@stylexjs/stylex';
32
33
  import { Icon } from "../Icon/Icon.js";
34
+ import "../theme/tokens.stylex.js";
35
+ import { colorVars } from "../theme/tokens.stylex.js";
36
+ import { isRenderable, mergeProps } from "../utils/index.js";
33
37
  import { jsx as _jsx } from "react/jsx-runtime";
34
38
  /** The check glyph matches the control sizes the indicator families share. */
35
39
  const iconSizeForIndicator = {
36
40
  sm: 'sm',
37
41
  md: 'sm'
38
42
  };
43
+ const styles = {
44
+ slot: {
45
+ k1xSpc: "x3nfvp2",
46
+ kGNEyG: "x6s0dn4",
47
+ kjj79g: "xl56j7k",
48
+ kmuXW: "x2lah0s",
49
+ kzqmXN: "xcdlrvm",
50
+ kZKoxP: "x1l36t39",
51
+ $$css: true
52
+ },
53
+ enabled: {
54
+ kMwMTN: "xqwr325",
55
+ $$css: true
56
+ },
57
+ disabled: {
58
+ kMwMTN: "xqa6c3m",
59
+ $$css: true
60
+ }
61
+ };
39
62
 
40
63
  /**
41
64
  * The default single-selection mark: a checkmark when chosen, nothing when not.
@@ -44,14 +67,14 @@ const iconSizeForIndicator = {
44
67
  * state, or focus behavior; the option or row that hosts it keeps all of that.
45
68
  *
46
69
  * @example
47
- * ```tsx
70
+ * ```
48
71
  * <CheckIndicator state={isSelected ? 'checked' : 'unchecked'} size="sm" />
49
72
  * ```
50
73
  *
51
74
  * Swap every single-selection mark for a radio:
52
75
  *
53
76
  * @example
54
- * ```tsx
77
+ * ```
55
78
  * import {RadioIndicator} from '@astryxdesign/core/Indicator';
56
79
  *
57
80
  * defineTheme({name: 'brand', indicators: {check: RadioIndicator}});
@@ -70,24 +93,34 @@ export function CheckIndicator({
70
93
  }) {
71
94
  const isChecked = state === 'checked';
72
95
 
73
- // Nothing to draw, and no box to reserve: an unmarked row keeps the layout
74
- // it would have without this indicator.
75
- if (!isChecked) {
76
- return null;
77
- }
78
-
79
96
  // `children` (a pending Spinner, say) replaces the mark but keeps the
80
- // indicator's place, matching the other indicators' contract. There is no
81
- // glyph to put the host's props on in that case, so they go on a span.
82
- if (children != null) {
97
+ // indicator's place, matching the other indicators' contract. It is checked
98
+ // BEFORE `state`: a host passes a busy visual through in whatever state the
99
+ // row happens to be in, and an unchecked listbox row is the common one.
100
+ //
101
+ // `isRenderable`, not `children != null`: the idiom a host actually writes is
102
+ // `children={isBusy && <Spinner/>}`, which passes `false` when it is not
103
+ // busy. `false` is non-null, so a null check takes this branch, renders
104
+ // nothing inside it, and DELETES the mark on a chosen row (#4893).
105
+ //
106
+ // There is no glyph to hang the caller's props on in this branch, so they go
107
+ // on a span — every one of them, so a `data-testid`, an `id`, a handler or
108
+ // an `xstyle` behaves the same whether or not children are present.
109
+ if (isRenderable(children)) {
83
110
  return /*#__PURE__*/_jsx("span", {
111
+ ...rest,
84
112
  ref: ref,
85
113
  "aria-hidden": "true",
86
- className: className,
87
- style: style,
114
+ ...mergeProps(stylex.props(styles.slot, isDisabled ? styles.disabled : styles.enabled, xstyle), className, style),
88
115
  children: children
89
116
  });
90
117
  }
118
+
119
+ // Nothing to draw, and no box to reserve: an unmarked row keeps the layout
120
+ // it would have without this indicator.
121
+ if (!isChecked) {
122
+ return null;
123
+ }
91
124
  return /*#__PURE__*/_jsx(Icon
92
125
  // Spread first so the indicator's own contract (below) wins over any
93
126
  // same-named DOM attribute a caller passed through.
@@ -99,6 +132,11 @@ export function CheckIndicator({
99
132
  // runtime; the cast only reconciles the two declarations.
100
133
  , {
101
134
  ...rest,
135
+ // After the spread, deliberately. Icon puts its own a11y defaults BEFORE
136
+ // `{...props}` as a documented escape hatch (Icon.tsx), which is right
137
+ // for an icon and wrong for an indicator — this one is decorative by
138
+ // contract, so it re-asserts it here rather than inheriting the hatch.
139
+ "aria-hidden": "true",
102
140
  icon: "check",
103
141
  size: iconSizeForIndicator[size],
104
142
  color: isDisabled ? 'disabled' : 'accent'
@@ -11,7 +11,7 @@ import type { IndicatorProps } from './types';
11
11
  * the `checkbox` theme target like any other component.
12
12
  *
13
13
  * @example
14
- * ```tsx
14
+ * ```
15
15
  * <CheckboxIndicator state="indeterminate" size="sm" />
16
16
  * ```
17
17
  */
@@ -1 +1 @@
1
- {"version":3,"file":"CheckboxIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/CheckboxIndicator.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AAwI5C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,IAAW,EACX,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,IAAI,EACR,EAAE,cAAc,CAAC,gBAAgB,CAAC,+BAkElC;yBA5Ee,iBAAiB"}
1
+ {"version":3,"file":"CheckboxIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/CheckboxIndicator.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AAwI5C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,IAAW,EACX,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,IAAI,EACR,EAAE,cAAc,CAAC,gBAAgB,CAAC,+BAwElC;yBAlFe,iBAAiB"}
@@ -11,7 +11,7 @@
11
11
  import * as stylex from '@stylexjs/stylex';
12
12
  import "../theme/tokens.stylex.js";
13
13
  import { borderVars, colorVars, durationVars, easeVars, radiusVars } from "../theme/tokens.stylex.js";
14
- import { mergeProps, themeProps } from "../utils/index.js";
14
+ import { isRenderable, mergeProps, themeProps } from "../utils/index.js";
15
15
  import "./indicator.markers.stylex.js";
16
16
  import { indicatorScope } from "./indicator.markers.stylex.js";
17
17
  import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
@@ -120,7 +120,7 @@ const indeterminateSizeStyles = {
120
120
  * the `checkbox` theme target like any other component.
121
121
  *
122
122
  * @example
123
- * ```tsx
123
+ * ```
124
124
  * <CheckboxIndicator state="indeterminate" size="sm" />
125
125
  * ```
126
126
  */
@@ -139,6 +139,7 @@ export function CheckboxIndicator({
139
139
  const isIndeterminate = state === 'indeterminate';
140
140
  const isCheckedOrIndeterminate = isChecked || isIndeterminate;
141
141
  return /*#__PURE__*/_jsx("span", {
142
+ ...rest,
142
143
  ref: ref,
143
144
  "aria-hidden": "true",
144
145
  ...mergeProps(themeProps('checkbox-indicator', {
@@ -151,8 +152,7 @@ export function CheckboxIndicator({
151
152
  {
152
153
  legacyNames: ['checkbox']
153
154
  }), stylex.props(styles.box, boxSizeStyles[size], isCheckedOrIndeterminate ? styles.checked : styles.unchecked, isDisabled && styles.disabled, isDisabled && !isCheckedOrIndeterminate && styles.disabledUnchecked, xstyle), className, style),
154
- ...rest,
155
- children: children ?? /*#__PURE__*/_jsxs(_Fragment, {
155
+ children: isRenderable(children) ? children : /*#__PURE__*/_jsxs(_Fragment, {
156
156
  children: [/*#__PURE__*/_jsx("svg", {
157
157
  viewBox: "0 0 10 10",
158
158
  ...stylex.props(styles.checkmark, checkmarkSizeStyles[size], isChecked && styles.checkmarkVisible),
@@ -12,7 +12,7 @@ import type { IndicatorProps } from './types';
12
12
  * components whose default is "a checkmark when selected, nothing otherwise".
13
13
  *
14
14
  * @example
15
- * ```tsx
15
+ * ```
16
16
  * <RadioIndicator state="checked" size="md" />
17
17
  * ```
18
18
  */
@@ -1 +1 @@
1
- {"version":3,"file":"RadioIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/RadioIndicator.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AAmG5C;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,IAAW,EACX,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,IAAI,EACR,EAAE,cAAc,CAAC,iBAAiB,CAAC,+BAgDnC;yBA1De,cAAc"}
1
+ {"version":3,"file":"RadioIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/RadioIndicator.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AAuG5C;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,IAAW,EACX,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,IAAI,EACR,EAAE,cAAc,CAAC,iBAAiB,CAAC,+BAqDnC;yBA/De,cAAc"}