@astryxdesign/core 0.6.3-canary.f22695a → 0.6.3

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 (118) hide show
  1. package/dist/Button/Button.d.ts.map +1 -1
  2. package/dist/Button/Button.js +28 -13
  3. package/dist/Chat/ChatLayout.d.ts +0 -19
  4. package/dist/Chat/ChatLayout.d.ts.map +1 -1
  5. package/dist/Chat/ChatLayout.js +0 -19
  6. package/dist/Chat/ChatLayoutScrollButton.d.ts.map +1 -1
  7. package/dist/Chat/ChatLayoutScrollButton.js +34 -44
  8. package/dist/Citation/Citation.d.ts +1 -1
  9. package/dist/Citation/Citation.d.ts.map +1 -1
  10. package/dist/Citation/Citation.js +2 -3
  11. package/dist/CodeBlock/highlightRanges.d.ts.map +1 -1
  12. package/dist/CodeBlock/highlightRanges.js +3 -14
  13. package/dist/Icon/Icon.d.ts +31 -6
  14. package/dist/Icon/Icon.d.ts.map +1 -1
  15. package/dist/Icon/Icon.js +71 -8
  16. package/dist/Link/useLinkComponent.d.ts +15 -5
  17. package/dist/Link/useLinkComponent.d.ts.map +1 -1
  18. package/dist/Link/useLinkComponent.js +51 -34
  19. package/dist/Markdown/Markdown.js +2 -2
  20. package/dist/Markdown/url.d.ts +0 -2
  21. package/dist/Markdown/url.d.ts.map +1 -1
  22. package/dist/Markdown/url.js +2 -8
  23. package/dist/PowerSearch/PowerSearchValueEditor.d.ts.map +1 -1
  24. package/dist/PowerSearch/PowerSearchValueEditor.js +0 -5
  25. package/dist/TopNav/TopNavMenu.d.ts +1 -1
  26. package/dist/TopNav/TopNavMenu.d.ts.map +1 -1
  27. package/dist/TopNav/TopNavMenu.js +2 -3
  28. package/dist/astryx.css +4 -2
  29. package/dist/hooks/useClickableContainer.d.ts +1 -10
  30. package/dist/hooks/useClickableContainer.d.ts.map +1 -1
  31. package/dist/hooks/useClickableContainer.js +4 -15
  32. package/dist/index.d.ts +0 -1
  33. package/dist/index.d.ts.map +1 -1
  34. package/dist/index.js +0 -3
  35. package/dist/theme/generateThemeRules.d.ts +7 -13
  36. package/dist/theme/generateThemeRules.d.ts.map +1 -1
  37. package/dist/theme/generateThemeRules.js +35 -131
  38. package/package.json +4 -9
  39. package/src/Button/Button.doc.mjs +5 -5
  40. package/src/Button/Button.tsx +13 -15
  41. package/src/Chat/ChatLayout.doc.mjs +4 -12
  42. package/src/Chat/ChatLayout.test.tsx +0 -28
  43. package/src/Chat/ChatLayout.tsx +0 -19
  44. package/src/Chat/ChatLayoutScrollButton.test.tsx +0 -31
  45. package/src/Chat/ChatLayoutScrollButton.tsx +14 -31
  46. package/src/Citation/Citation.doc.mjs +2 -2
  47. package/src/Citation/Citation.test.tsx +0 -17
  48. package/src/Citation/Citation.tsx +2 -4
  49. package/src/ClickableCard/ClickableCard.doc.mjs +2 -2
  50. package/src/CodeBlock/highlightRanges.test.ts +1 -143
  51. package/src/CodeBlock/highlightRanges.ts +5 -15
  52. package/src/Icon/Icon.doc.mjs +5 -7
  53. package/src/Icon/Icon.spec.md +40 -81
  54. package/src/Icon/Icon.test.tsx +3 -6
  55. package/src/Icon/Icon.tsx +68 -20
  56. package/src/IconButton/IconButton.doc.mjs +3 -3
  57. package/src/IconButton/IconButton.test.tsx +0 -40
  58. package/src/Item/Item.doc.mjs +2 -2
  59. package/src/Link/Link.doc.mjs +4 -6
  60. package/src/Link/LinkProvider.doc.mjs +2 -2
  61. package/src/Link/useLinkComponent.test.tsx +0 -333
  62. package/src/Link/useLinkComponent.ts +57 -29
  63. package/src/List/ListItem.doc.mjs +2 -2
  64. package/src/Markdown/Markdown.doc.mjs +2 -2
  65. package/src/Markdown/Markdown.spec.md +15 -19
  66. package/src/Markdown/Markdown.test.tsx +0 -52
  67. package/src/Markdown/Markdown.tsx +2 -2
  68. package/src/Markdown/parser.test.ts +0 -20
  69. package/src/Markdown/url.ts +3 -9
  70. package/src/PowerSearch/PowerSearchValueEditor.test.tsx +0 -51
  71. package/src/PowerSearch/PowerSearchValueEditor.tsx +0 -4
  72. package/src/Token/Token.doc.mjs +2 -2
  73. package/src/TopNav/TopNavMenu.doc.mjs +2 -2
  74. package/src/TopNav/TopNavMenu.test.tsx +0 -30
  75. package/src/TopNav/TopNavMenu.tsx +2 -7
  76. package/src/hooks/useClickableContainer.ts +4 -20
  77. package/src/index.ts +0 -3
  78. package/src/tailwind-theme.css +6 -0
  79. package/src/theme/Theme.test.tsx +0 -32
  80. package/src/theme/generateThemeRules.test.ts +2 -470
  81. package/src/theme/generateThemeRules.ts +51 -219
  82. package/src/theme/tokenValueCompat.test.ts +1 -4
  83. package/dist/Icon/IconDefaultSizeContext.d.ts +0 -4
  84. package/dist/Icon/IconDefaultSizeContext.d.ts.map +0 -1
  85. package/dist/Icon/IconDefaultSizeContext.js +0 -18
  86. package/dist/Icon/IconSize.stylex.d.ts +0 -65
  87. package/dist/Icon/IconSize.stylex.d.ts.map +0 -1
  88. package/dist/Icon/IconSize.stylex.js +0 -75
  89. package/dist/Timer/Timer.d.ts +0 -49
  90. package/dist/Timer/Timer.d.ts.map +0 -1
  91. package/dist/Timer/Timer.js +0 -158
  92. package/dist/Timer/index.d.ts +0 -9
  93. package/dist/Timer/index.d.ts.map +0 -1
  94. package/dist/Timer/index.js +0 -10
  95. package/dist/theme/declarationBoundary.d.ts +0 -17
  96. package/dist/theme/declarationBoundary.d.ts.map +0 -1
  97. package/dist/theme/declarationBoundary.js +0 -343
  98. package/dist/utils/safeUrl.d.ts +0 -11
  99. package/dist/utils/safeUrl.d.ts.map +0 -1
  100. package/dist/utils/safeUrl.js +0 -78
  101. package/src/Chat/ChatLayout.spec.md +0 -271
  102. package/src/Chat/ChatLayoutScrollButton.spec.md +0 -338
  103. package/src/Chat/__tests__/ChatLayoutScrollButton.a11y.chromium.spec.ts +0 -514
  104. package/src/Chat/__tests__/ChatLayoutScrollButtonSurface.a11y.chromium.spec.ts +0 -740
  105. package/src/Icon/IconDefaultSizeContext.ts +0 -23
  106. package/src/Icon/IconSize.stylex.ts +0 -70
  107. package/src/Link/__tests__/Link.navigation.a11y.chromium.spec.ts +0 -261
  108. package/src/Markdown/Markdown.renderBoundary.test.tsx +0 -72
  109. package/src/Timer/Timer.doc.mjs +0 -183
  110. package/src/Timer/Timer.spec.md +0 -215
  111. package/src/Timer/Timer.test.tsx +0 -302
  112. package/src/Timer/Timer.tsx +0 -258
  113. package/src/Timer/index.ts +0 -11
  114. package/src/hooks/useClickableContainer.test.tsx +0 -236
  115. package/src/theme/declarationBoundary.test.ts +0 -126
  116. package/src/theme/declarationBoundary.ts +0 -347
  117. package/src/utils/safeUrl.test.ts +0 -88
  118. package/src/utils/safeUrl.ts +0 -85
@@ -1 +1 @@
1
- {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
@@ -24,8 +24,6 @@ import "../theme/tokens.stylex.js";
24
24
  import { colorVars, sizeVars, spacingVars, radiusVars, borderVars, durationVars, easeVars, fontWeightVars, typeScaleVars, shadowVars, focusVars } from "../theme/tokens.stylex.js";
25
25
  import { Spinner } from "../Spinner/index.js";
26
26
  import { VisuallyHidden } from "../VisuallyHidden/index.js";
27
- import { IconDefaultSizeProvider } from "../Icon/IconDefaultSizeContext.js";
28
- import { iconBoxSizeStyles } from "../Icon/IconSize.stylex.js";
29
27
  import { EDGE_COMP_ATTR } from "../Layout/edgeCompensation.stylex.js";
30
28
  import { useSize } from "../SizeContext/SizeContext.js";
31
29
  import { useButtonGroup } from "../ButtonGroup/ButtonGroupContext.js";
@@ -134,6 +132,32 @@ const sizeStyles = {
134
132
  }
135
133
  };
136
134
 
135
+ /**
136
+ * Icon size per button size.
137
+ * Matches Icon sizing: sm/md=16px, lg=20px.
138
+ * fontSize is set so emoji and text-based icons scale correctly.
139
+ */
140
+ const iconSizeStyles = {
141
+ sm: {
142
+ kzqmXN: "x1kky2od",
143
+ kZKoxP: "xlup9mm",
144
+ kGuDYH: "x1j61zf2",
145
+ $$css: true
146
+ },
147
+ md: {
148
+ kzqmXN: "x1kky2od",
149
+ kZKoxP: "xlup9mm",
150
+ kGuDYH: "x1j61zf2",
151
+ $$css: true
152
+ },
153
+ lg: {
154
+ kzqmXN: "xw4jnvo",
155
+ kZKoxP: "x1qx5ct2",
156
+ kGuDYH: "xwsyq91",
157
+ $$css: true
158
+ }
159
+ };
160
+
137
161
  /**
138
162
  * Resting elevation for floating buttons (e.g. a FAB). `none` is the default
139
163
  * flat button; `low`/`med`/`high` map to the shadow token scale. 'none' stays
@@ -197,11 +221,6 @@ const variants = {
197
221
  * Button size type derived from the sizeStyles StyleX object
198
222
  */
199
223
 
200
- const iconSizeByButtonSize = {
201
- sm: 'sm',
202
- md: 'sm',
203
- lg: 'md'
204
- };
205
224
  const spinnerReveal = "x18re5ia-B";
206
225
  const contentHide = "x188b6p3-B";
207
226
 
@@ -438,7 +457,6 @@ export function Button({
438
457
  size,
439
458
  elevation: buttonGroup ? 'none' : elevation
440
459
  }), sharedStylexProps, className, style);
441
- const iconSize = iconSizeByButtonSize[size];
442
460
  const buttonContent = /*#__PURE__*/_jsxs(_Fragment, {
443
461
  children: [isLoadingState && /*#__PURE__*/_jsx("span", {
444
462
  ...{
@@ -458,11 +476,8 @@ export function Button({
458
476
  ...stylex.props(styles.contentWrapper, isLoadingState && (delaySpinner ? loadingStyles.hiddenContentDelayed : loadingStyles.hiddenContent)),
459
477
  "aria-hidden": isLoadingState || undefined,
460
478
  children: [icon && /*#__PURE__*/_jsx("span", {
461
- ...stylex.props(styles.iconWrapper, iconBoxSizeStyles[iconSize]),
462
- children: /*#__PURE__*/_jsx(IconDefaultSizeProvider, {
463
- value: iconSize,
464
- children: icon
465
- })
479
+ ...stylex.props(styles.iconWrapper, iconSizeStyles[size]),
480
+ children: icon
466
481
  }), isIconOnly ? null : /*#__PURE__*/_jsx("span", {
467
482
  ...{
468
483
  className: "xb3r6kr xlyipyv xeuugli"
@@ -70,25 +70,6 @@ export interface ChatLayoutProps extends BaseProps<HTMLDivElement> {
70
70
  */
71
71
  density?: Density;
72
72
  }
73
- /**
74
- * Layout shell for a full chat interface: messages in page flow, composer
75
- * docked to the bottom behind a frosted glass layer, with auto-scroll and a
76
- * scroll-to-bottom button wired in.
77
- *
78
- * @example
79
- * ```
80
- * <ChatLayout
81
- * density="spacious"
82
- * composer={<ChatComposer onSubmit={send} />}
83
- * emptyState={<EmptyState title="No messages yet" />}>
84
- * <ChatMessageList>
85
- * <ChatMessage sender="assistant">
86
- * <ChatMessageBubble>How can I help?</ChatMessageBubble>
87
- * </ChatMessage>
88
- * </ChatMessageList>
89
- * </ChatLayout>
90
- * ```
91
- */
92
73
  export declare function ChatLayout({ children, composer, density, emptyState, scrollButton, scrollRef: externalScrollRef, xstyle, className, style, 'data-testid': testId, ref, ...rest }: ChatLayoutProps): import("react").JSX.Element;
93
74
  export declare namespace ChatLayout {
94
75
  var displayName: string;
@@ -1 +1 @@
1
- {"version":3,"file":"ChatLayout.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatLayout.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAkB,MAAM,OAAO,CAAC;AAGtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAc5C,KAAK,OAAO,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;AAEnD,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;;OAIG;IACH,YAAY,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAEhC;;;;;;;;;;;OAWG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAEhD;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AA4KD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,QAAQ,EACR,OAAoB,EACpB,UAAU,EACV,YAAY,EACZ,SAAS,EAAE,iBAAiB,EAC5B,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,eAAe,+BA4GjB;yBAzHe,UAAU"}
1
+ {"version":3,"file":"ChatLayout.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatLayout.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAkB,MAAM,OAAO,CAAC;AAGtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAc5C,KAAK,OAAO,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;AAEnD,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;;OAIG;IACH,YAAY,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAEhC;;;;;;;;;;;OAWG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAEhD;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AA4KD,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,QAAQ,EACR,OAAoB,EACpB,UAAU,EACV,YAAY,EACZ,SAAS,EAAE,iBAAiB,EAC5B,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,eAAe,+BA4GjB;yBAzHe,UAAU"}
@@ -184,25 +184,6 @@ function hasVisibleContent(children) {
184
184
  // Component
185
185
  // =============================================================================
186
186
 
187
- /**
188
- * Layout shell for a full chat interface: messages in page flow, composer
189
- * docked to the bottom behind a frosted glass layer, with auto-scroll and a
190
- * scroll-to-bottom button wired in.
191
- *
192
- * @example
193
- * ```
194
- * <ChatLayout
195
- * density="spacious"
196
- * composer={<ChatComposer onSubmit={send} />}
197
- * emptyState={<EmptyState title="No messages yet" />}>
198
- * <ChatMessageList>
199
- * <ChatMessage sender="assistant">
200
- * <ChatMessageBubble>How can I help?</ChatMessageBubble>
201
- * </ChatMessage>
202
- * </ChatMessageList>
203
- * </ChatLayout>
204
- * ```
205
- */
206
187
  export function ChatLayout({
207
188
  children,
208
189
  composer,
@@ -1 +1 @@
1
- {"version":3,"file":"ChatLayoutScrollButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatLayoutScrollButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,MAAM,WAAW,2BAA4B,SAAQ,IAAI,CACvD,SAAS,CAAC,cAAc,CAAC,EACzB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qCAAqC;IACrC,SAAS,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qBAAqB;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAsED;;;;;;;GAOG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,GAAG,EACH,SAAS,EACT,KAAK,EACL,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,2BAA2B,qBAuC7B;yBAhDe,sBAAsB"}
1
+ {"version":3,"file":"ChatLayoutScrollButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatLayoutScrollButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;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"}
@@ -18,7 +18,7 @@
18
18
  import React from 'react';
19
19
  import * as stylex from '@stylexjs/stylex';
20
20
  import "../theme/tokens.stylex.js";
21
- import { colorVars, spacingVars, radiusVars, shadowVars, sizeVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
21
+ import { colorVars, spacingVars, radiusVars, shadowVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
22
22
  import { Icon } from "../Icon/index.js";
23
23
  import { Button } from "../Button/index.js";
24
24
  import { mergeProps } from "../utils/index.js";
@@ -75,50 +75,40 @@ export function ChatLayoutScrollButton({
75
75
  ...rest
76
76
  }) {
77
77
  const t = useTranslator();
78
- return (
79
- /*#__PURE__*/
80
- // Two elements, two responsibilities. The outer one centres the pill and
81
- // holds the gap above the composer — spacing outside the pill's border
82
- // box, which the pill cannot own itself. The inner one is the pill: it is
83
- // what a reader sees, so it carries the painted surface AND the public
84
- // theming target. Keeping the target on the outer element would satisfy
85
- // every automated check while leaving a theme styling an invisible
86
- // full-width row (architecture:component-theming-surface INV4).
87
- _jsx("div", {
88
- ref: ref,
89
- ...mergeProps(stylex.props(styles.wrapper, xstyle), className, style),
90
- ...rest,
91
- children: /*#__PURE__*/_jsx("div", {
92
- ...mergeProps(themeProps('chat-layout-scroll-button'), {
93
- 0: {
94
- className: "xawy1a7 xb3r6kr xjspbzw x1prclbq x14hfi27 x1ueg155 xrgg2z9 xlr8y92 x2rcmwa x12w9bfk xg01cxk x47corl xlshs6z x1jys5uj"
95
- },
96
- 2: {
97
- className: "xawy1a7 xb3r6kr xjspbzw x1prclbq x14hfi27 x1ueg155 xrgg2z9 xlr8y92 x2rcmwa x12w9bfk x1hc1fzr x67bb7w xnpuxes x1jys5uj"
98
- },
99
- 1: {
100
- className: "xawy1a7 xb3r6kr xjspbzw x1prclbq x14hfi27 x1ueg155 xrgg2z9 xlr8y92 x2rcmwa x12w9bfk xg01cxk x47corl xlshs6z x1ncir08"
101
- },
102
- 3: {
103
- className: "xawy1a7 xb3r6kr xjspbzw x1prclbq x14hfi27 x1ueg155 xrgg2z9 xlr8y92 x2rcmwa x12w9bfk x1hc1fzr x67bb7w xnpuxes x1ncir08"
104
- }
105
- }[!!isVisible << 1 | !!label << 0]),
106
- children: /*#__PURE__*/_jsx(Button, {
107
- label: label ?? t('@astryx.chatLayoutScrollButton.scrollToBottom'),
108
- "aria-label": label ?? t('@astryx.chatLayoutScrollButton.scrollToBottom'),
109
- icon: /*#__PURE__*/_jsx(Icon, {
110
- icon: "chevronDown",
111
- size: "md"
112
- }),
113
- variant: "ghost",
114
- size: "md",
115
- isIconOnly: !label,
116
- onClick: onClick,
117
- xstyle: [styles.button, label ? styles.buttonWithLabel : null],
118
- children: label ?? undefined
119
- })
78
+ return /*#__PURE__*/_jsx("div", {
79
+ ref: ref,
80
+ ...mergeProps(themeProps('chat-layout-scroll-button'), stylex.props(styles.wrapper, xstyle), className, style),
81
+ ...rest,
82
+ children: /*#__PURE__*/_jsx("div", {
83
+ ...{
84
+ 0: {
85
+ className: "xawy1a7 xb3r6kr xjspbzw x1prclbq x14hfi27 x10w6t97 x1apppo2 xlr8y92 x2rcmwa x12w9bfk xg01cxk x47corl x1x67gh"
86
+ },
87
+ 2: {
88
+ className: "xawy1a7 xb3r6kr xjspbzw x1prclbq x14hfi27 x10w6t97 x1apppo2 xlr8y92 x2rcmwa x12w9bfk x1hc1fzr x67bb7w x1x67gh"
89
+ },
90
+ 1: {
91
+ className: "xawy1a7 xb3r6kr xjspbzw x1prclbq x14hfi27 x10w6t97 x1apppo2 xlr8y92 x2rcmwa x12w9bfk xg01cxk x47corl x1ncir08"
92
+ },
93
+ 3: {
94
+ className: "xawy1a7 xb3r6kr xjspbzw x1prclbq x14hfi27 x10w6t97 x1apppo2 xlr8y92 x2rcmwa x12w9bfk x1hc1fzr x67bb7w x1ncir08"
95
+ }
96
+ }[!!isVisible << 1 | !!label << 0],
97
+ children: /*#__PURE__*/_jsx(Button, {
98
+ label: label ?? t('@astryx.chatLayoutScrollButton.scrollToBottom'),
99
+ "aria-label": label ?? t('@astryx.chatLayoutScrollButton.scrollToBottom'),
100
+ icon: /*#__PURE__*/_jsx(Icon, {
101
+ icon: "chevronDown",
102
+ size: "md"
103
+ }),
104
+ variant: "ghost",
105
+ size: "md",
106
+ isIconOnly: !label,
107
+ onClick: onClick,
108
+ xstyle: [styles.button, label ? styles.buttonWithLabel : null],
109
+ children: label ?? undefined
120
110
  })
121
111
  })
122
- );
112
+ });
123
113
  }
124
114
  ChatLayoutScrollButton.displayName = 'ChatLayoutScrollButton';
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * @file Citation.tsx
3
- * @input Uses React, StyleX, theme tokens, and the shared navigation policy
3
+ * @input Uses React, StyleX, theme tokens
4
4
  * @output Exports Citation component for inline citation references
5
5
  * @position Core implementation; consumed by index.ts
6
6
  *
@@ -1 +1 @@
1
- {"version":3,"file":"Citation.d.ts","sourceRoot":"","sources":["../../src/Citation/Citation.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAcrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,MAAM,WAAW,cAAc;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;OAKG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,WAAW,CAAC;IAC3D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B,MAAM,EAAE,cAAc,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC9B;AAiHD,wBAAgB,QAAQ,CAAC,EACvB,GAAG,EACH,MAAM,EACN,MAAM,EACN,OAAiB,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,aAAa,GAAG,KAAK,CAAC,YAAY,CA4FpC;yBAtGe,QAAQ"}
1
+ {"version":3,"file":"Citation.d.ts","sourceRoot":"","sources":["../../src/Citation/Citation.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAarC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,MAAM,WAAW,cAAc;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;OAKG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,WAAW,CAAC;IAC3D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B,MAAM,EAAE,cAAc,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC9B;AAiHD,wBAAgB,QAAQ,CAAC,EACvB,GAAG,EACH,MAAM,EACN,MAAM,EACN,OAAiB,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,aAAa,GAAG,KAAK,CAAC,YAAY,CA2FpC;yBArGe,QAAQ"}
@@ -4,7 +4,7 @@
4
4
 
5
5
  /**
6
6
  * @file Citation.tsx
7
- * @input Uses React, StyleX, theme tokens, and the shared navigation policy
7
+ * @input Uses React, StyleX, theme tokens
8
8
  * @output Exports Citation component for inline citation references
9
9
  * @position Core implementation; consumed by index.ts
10
10
  *
@@ -19,7 +19,6 @@ import * as stylex from '@stylexjs/stylex';
19
19
  import "../theme/tokens.stylex.js";
20
20
  import { colorVars, spacingVars, radiusVars, typeScaleVars, fontWeightVars, borderVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
21
21
  import { mergeProps } from "../utils/index.js";
22
- import { isSafeUrl } from "../utils/safeUrl.js";
23
22
  import { themeProps } from "../utils/themeProps.js";
24
23
  import { useTranslator } from "../i18n/index.js";
25
24
  import { renderIconSlot } from "../Icon/index.js";
@@ -104,7 +103,7 @@ export function Citation({
104
103
  }) {
105
104
  const t = useTranslator();
106
105
  const title = source.title ?? String(number);
107
- const href = source.url != null && isSafeUrl(source.url) ? source.url : undefined;
106
+ const href = source.url;
108
107
 
109
108
  // Resolve the source icon. A non-string `icon` node renders as-is (an Astryx
110
109
  // <Icon>, SVG, avatar, etc.). Otherwise fall back to an image URL: `src`, or
@@ -1 +1 @@
1
- {"version":3,"file":"highlightRanges.d.ts","sourceRoot":"","sources":["../../src/CodeBlock/highlightRanges.ts"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,KAAK,EAAc,SAAS,EAAC,MAAM,aAAa,CAAC;AAwGxD,UAAU,UAAU;IAClB,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,SAAS,CAAC;CACtB;AAgDD,iBAAS,aAAa,CAAC,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAIjD;AA4BD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,2BAA2B,CACzC,MAAM,EAAE,WAAW,EACnB,UAAU,EAAE,SAAS,EAAE,GACtB,MAAM,IAAI,CAsHZ;AAED;;;;GAIG;AACH,wBAAgB,yBAAyB,CACvC,MAAM,EAAE,WAAW,EACnB,UAAU,EAAE,SAAS,EAAE,EACvB,SAAS,EAAE,MAAM,GAChB,UAAU,EAAE,CAqBd;AAMD;;;;;;;;GAQG;AACH,wBAAgB,wBAAwB,CACtC,EAAE,EAAE,WAAW,EACf,UAAU,EAAE,SAAS,EAAE,GACtB,MAAM,IAAI,CA2DZ;AAeD;;GAEG;AACH,OAAO,EAAC,aAAa,EAAC,CAAC"}
1
+ {"version":3,"file":"highlightRanges.d.ts","sourceRoot":"","sources":["../../src/CodeBlock/highlightRanges.ts"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,KAAK,EAAc,SAAS,EAAC,MAAM,aAAa,CAAC;AA8FxD,UAAU,UAAU;IAClB,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,SAAS,CAAC;CACtB;AAgDD,iBAAS,aAAa,CAAC,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAIjD;AA4BD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,2BAA2B,CACzC,MAAM,EAAE,WAAW,EACnB,UAAU,EAAE,SAAS,EAAE,GACtB,MAAM,IAAI,CAsHZ;AAED;;;;GAIG;AACH,wBAAgB,yBAAyB,CACvC,MAAM,EAAE,WAAW,EACnB,UAAU,EAAE,SAAS,EAAE,EACvB,SAAS,EAAE,MAAM,GAChB,UAAU,EAAE,CAqBd;AAMD;;;;;;;;GAQG;AACH,wBAAgB,wBAAwB,CACtC,EAAE,EAAE,WAAW,EACf,UAAU,EAAE,SAAS,EAAE,GACtB,MAAM,IAAI,CA2DZ;AAeD;;GAEG;AACH,OAAO,EAAC,aAAa,EAAC,CAAC"}
@@ -52,20 +52,9 @@ function ensureDynamicHighlightType(tokenType) {
52
52
  return;
53
53
  }
54
54
  }
55
-
56
- // CSS.escape both generated names before they land in rule text: the
57
- // registry key stays the raw string (a ::highlight() selector matches by
58
- // ident VALUE, escapes and all), so dotted, non-ASCII, `_private`, and
59
- // digit-led token types keep their colours — while nothing a token stream
60
- // carries can step outside its ident and shape the rule.
61
- const name = CSS.escape(`astryx-${tokenType}`);
62
- const colorVar = `var(${CSS.escape(`--color-syntax-${tokenType}`)}, currentColor)`;
63
- try {
64
- dynamicStyleSheet.insertRule(`.astryx-code-block code::highlight(${name}), .astryx-codeeditor code::highlight(${name}) { color: ${colorVar}; }`);
65
- } catch {
66
- // An engine that still refuses the rule costs that type its colour
67
- // (ranges paint with currentColor) — never the whole code block.
68
- }
55
+ const name = `astryx-${tokenType}`;
56
+ const colorVar = `var(--color-syntax-${tokenType}, currentColor)`;
57
+ dynamicStyleSheet.insertRule(`.astryx-code-block code::highlight(${name}), .astryx-codeeditor code::highlight(${name}) { color: ${colorVar}; }`);
69
58
  }
70
59
 
71
60
  // ---------------------------------------------------------------------------
@@ -21,8 +21,6 @@ import React, { type ComponentType, type SVGProps } from 'react';
21
21
  import * as stylex from '@stylexjs/stylex';
22
22
  import type { StyleXStyles } from '@stylexjs/stylex';
23
23
  import type { IconName, NamespacedIconName } from './globalIconRegistry';
24
- import { type IconSize } from './IconSize.stylex';
25
- export type { IconSize } from './IconSize.stylex';
26
24
  declare const colorStyles: Readonly<{
27
25
  readonly primary: Readonly<{
28
26
  readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#0A1317, #DFE2E5)">;
@@ -82,7 +80,35 @@ declare const colorStyles: Readonly<{
82
80
  readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#5B08D8, #7952FF)">;
83
81
  }>;
84
82
  }>;
83
+ /**
84
+ * Size styles for direct SVG icon components.
85
+ * Uses width/height only — SVG components handle their own viewBox scaling.
86
+ *
87
+ * Sizes are expressed in `rem` (relative to the root font-size) so icons scale
88
+ * in step with text when the document font-size changes, matching the rest of
89
+ * the design system's rem-based type scale. Values are the px-equivalents at a
90
+ * 16px root: 12px → 0.75rem, 16px → 1rem, 20px → 1.25rem, 24px → 1.5rem.
91
+ */
92
+ declare const sizeStyles: Readonly<{
93
+ readonly xsm: Readonly<{
94
+ readonly width: stylex.StyleXClassNameFor<"width", "0.75rem">;
95
+ readonly height: stylex.StyleXClassNameFor<"height", "0.75rem">;
96
+ }>;
97
+ readonly sm: Readonly<{
98
+ readonly width: stylex.StyleXClassNameFor<"width", "1rem">;
99
+ readonly height: stylex.StyleXClassNameFor<"height", "1rem">;
100
+ }>;
101
+ readonly md: Readonly<{
102
+ readonly width: stylex.StyleXClassNameFor<"width", "1.25rem">;
103
+ readonly height: stylex.StyleXClassNameFor<"height", "1.25rem">;
104
+ }>;
105
+ readonly lg: Readonly<{
106
+ readonly width: stylex.StyleXClassNameFor<"width", "1.5rem">;
107
+ readonly height: stylex.StyleXClassNameFor<"height", "1.5rem">;
108
+ }>;
109
+ }>;
85
110
  export type IconColor = keyof typeof colorStyles;
111
+ export type IconSize = keyof typeof sizeStyles;
86
112
  /**
87
113
  * Type for icon components that can be passed to Icon.
88
114
  * Use this type when accepting an icon prop in other components.
@@ -114,9 +140,7 @@ export interface IconProps extends Omit<SVGProps<SVGSVGElement>, 'ref' | 'color'
114
140
  * - 'sm': 1rem (16px at a 16px root)
115
141
  * - 'md': 1.25rem (20px at a 16px root)
116
142
  * - 'lg': 1.5rem (24px at a 16px root)
117
- *
118
- * An explicit value wins. When omitted, Icon uses the nearest default supplied
119
- * by an owning Astryx component for its icon slot, then falls back to 'md'.
143
+ * @default 'md'
120
144
  */
121
145
  size?: IconSize;
122
146
  /**
@@ -171,7 +195,7 @@ export interface IconProps extends Omit<SVGProps<SVGSVGElement>, 'ref' | 'color'
171
195
  * <Icon icon="close" size="md" color="primary" />
172
196
  * ```
173
197
  */
174
- export declare function Icon({ icon, color, size: sizeProp, label, ref, className, style, xstyle, ...props }: IconProps): React.JSX.Element;
198
+ export declare function Icon({ icon, color, size, label, ref, className, style, xstyle, ...props }: IconProps): React.JSX.Element;
175
199
  export declare namespace Icon {
176
200
  var displayName: string;
177
201
  }
@@ -186,4 +210,5 @@ export declare function renderIconSlot(icon: React.ReactNode | IconType, props?:
186
210
  size?: IconSize;
187
211
  color?: IconColor;
188
212
  }): React.ReactNode;
213
+ export {};
189
214
  //# sourceMappingURL=Icon.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../src/Icon/Icon.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,aAAa,EAAE,KAAK,QAAQ,EAAC,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAC3C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAInD,OAAO,KAAK,EAAC,QAAQ,EAAE,kBAAkB,EAAC,MAAM,sBAAsB,CAAC;AAIvE,OAAO,EAGL,KAAK,QAAQ,EACd,MAAM,mBAAmB,CAAC;AAE3B,YAAY,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAmBhD,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2Df,CAAC;AAMH,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,WAAW,CAAC;AAEjD;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAAG,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;AAE9D;;;GAGG;AACH,MAAM,WAAW,SAAU,SAAQ,IAAI,CACrC,QAAQ,CAAC,aAAa,CAAC,EACvB,KAAK,GAAG,OAAO,CAChB;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IAC/B;;;;;;OAMG;IACH,IAAI,EAAE,QAAQ,GAAG,QAAQ,GAAG,kBAAkB,CAAC;IAC/C;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;;;OAWG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;CACvB;AAyBD;;;;;;;GAOG;AACH,wBAAgB,IAAI,CAAC,EACnB,IAAI,EACJ,KAAiB,EACjB,IAAI,EAAE,QAAQ,EACd,KAAK,EACL,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,qBAkDX;yBA5De,IAAI;;;AAqIpB;;;;;;GAMG;AACH,wBAAgB,cAAc,CAC5B,IAAI,EAAE,KAAK,CAAC,SAAS,GAAG,QAAQ,EAChC,KAAK,CAAC,EAAE;IAAC,IAAI,CAAC,EAAE,QAAQ,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAC,GAC3C,KAAK,CAAC,SAAS,CAYjB"}
1
+ {"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../src/Icon/Icon.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,aAAa,EAAE,KAAK,QAAQ,EAAC,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAC3C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAInD,OAAO,KAAK,EAAC,QAAQ,EAAE,kBAAkB,EAAC,MAAM,sBAAsB,CAAC;AAqBvE,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2Df,CAAC;AAEH;;;;;;;;GAQG;AACH,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;EAiBd,CAAC;AAyCH,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,WAAW,CAAC;AACjD,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,UAAU,CAAC;AAE/C;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAAG,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;AAE9D;;;GAGG;AACH,MAAM,WAAW,SAAU,SAAQ,IAAI,CACrC,QAAQ,CAAC,aAAa,CAAC,EACvB,KAAK,GAAG,OAAO,CAChB;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IAC/B;;;;;;OAMG;IACH,IAAI,EAAE,QAAQ,GAAG,QAAQ,GAAG,kBAAkB,CAAC;IAC/C;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;;;OAWG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;CACvB;AAyBD;;;;;;;GAOG;AACH,wBAAgB,IAAI,CAAC,EACnB,IAAI,EACJ,KAAiB,EACjB,IAAW,EACX,KAAK,EACL,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,qBA4CX;yBAtDe,IAAI;;;AA+HpB;;;;;;GAMG;AACH,wBAAgB,cAAc,CAC5B,IAAI,EAAE,KAAK,CAAC,SAAS,GAAG,QAAQ,EAChC,KAAK,CAAC,EAAE;IAAC,IAAI,CAAC,EAAE,QAAQ,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAC,GAC3C,KAAK,CAAC,SAAS,CAYjB"}
package/dist/Icon/Icon.js CHANGED
@@ -29,13 +29,11 @@ import { useThemeName } from "../theme/useTheme.js";
29
29
  import { getIcon } from "./globalIconRegistry.js";
30
30
  import { mergeProps } from "../utils/index.js";
31
31
  import { themeProps } from "../utils/themeProps.js";
32
- import { useIconSize } from "./IconDefaultSizeContext.js";
33
- import { iconBoxSizeStyles, iconSizeStyles } from "./IconSize.stylex.js";
34
- import { jsx as _jsx } from "react/jsx-runtime";
32
+
35
33
  // =============================================================================
36
34
  // Styles
37
35
  // =============================================================================
38
-
36
+ import { jsx as _jsx } from "react/jsx-runtime";
39
37
  const styles = {
40
38
  root: {
41
39
  kmuXW: "x2lah0s",
@@ -128,6 +126,72 @@ const colorStyles = {
128
126
  }
129
127
  };
130
128
 
129
+ /**
130
+ * Size styles for direct SVG icon components.
131
+ * Uses width/height only — SVG components handle their own viewBox scaling.
132
+ *
133
+ * Sizes are expressed in `rem` (relative to the root font-size) so icons scale
134
+ * in step with text when the document font-size changes, matching the rest of
135
+ * the design system's rem-based type scale. Values are the px-equivalents at a
136
+ * 16px root: 12px → 0.75rem, 16px → 1rem, 20px → 1.25rem, 24px → 1.5rem.
137
+ */
138
+ const sizeStyles = {
139
+ xsm: {
140
+ kzqmXN: "x1jw3ynk",
141
+ kZKoxP: "xvle69y",
142
+ $$css: true
143
+ },
144
+ sm: {
145
+ kzqmXN: "xcdlrvm",
146
+ kZKoxP: "x1l36t39",
147
+ $$css: true
148
+ },
149
+ md: {
150
+ kzqmXN: "xwqq7k2",
151
+ kZKoxP: "xmll18r",
152
+ $$css: true
153
+ },
154
+ lg: {
155
+ kzqmXN: "xp8d6y2",
156
+ kZKoxP: "xam5rvr",
157
+ $$css: true
158
+ }
159
+ };
160
+
161
+ /**
162
+ * Size styles for string-based (registry) icons.
163
+ * Includes fontSize so that 1em-based icons from the registry scale correctly.
164
+ *
165
+ * Expressed in `rem` for the same reason as {@link sizeStyles} — icons track the
166
+ * root font-size instead of being locked to absolute pixels.
167
+ */
168
+ const spanSizeStyles = {
169
+ xsm: {
170
+ kzqmXN: "x1jw3ynk",
171
+ kZKoxP: "xvle69y",
172
+ kGuDYH: "xboafo0",
173
+ $$css: true
174
+ },
175
+ sm: {
176
+ kzqmXN: "xcdlrvm",
177
+ kZKoxP: "x1l36t39",
178
+ kGuDYH: "x1jchvi3",
179
+ $$css: true
180
+ },
181
+ md: {
182
+ kzqmXN: "xwqq7k2",
183
+ kZKoxP: "xmll18r",
184
+ kGuDYH: "x1603h9y",
185
+ $$css: true
186
+ },
187
+ lg: {
188
+ kzqmXN: "xp8d6y2",
189
+ kZKoxP: "xam5rvr",
190
+ kGuDYH: "xngnso2",
191
+ $$css: true
192
+ }
193
+ };
194
+
131
195
  // =============================================================================
132
196
  // Types
133
197
  // =============================================================================
@@ -177,7 +241,7 @@ function getIconA11yProps(label) {
177
241
  export function Icon({
178
242
  icon,
179
243
  color = 'inherit',
180
- size: sizeProp,
244
+ size = 'md',
181
245
  label,
182
246
  ref,
183
247
  className,
@@ -185,7 +249,6 @@ export function Icon({
185
249
  xstyle,
186
250
  ...props
187
251
  }) {
188
- const size = useIconSize(sizeProp);
189
252
  // Derive ARIA from `label`: decorative (aria-hidden) by default, or a
190
253
  // meaningful image (role="img" + aria-label) when `label` is non-empty.
191
254
  const a11yProps = getIconA11yProps(label);
@@ -216,7 +279,7 @@ export function Icon({
216
279
  ...mergeProps(themeProps('icon', {
217
280
  size,
218
281
  color
219
- }), stylex.props(styles.root, colorStyles[color], iconSizeStyles[size], xstyle), className ?? undefined, style),
282
+ }), stylex.props(styles.root, colorStyles[color], sizeStyles[size], xstyle), className ?? undefined, style),
220
283
  ...props
221
284
  });
222
285
  }
@@ -261,7 +324,7 @@ function IconFromRegistry({
261
324
  ...mergeProps(themeProps('icon', {
262
325
  size,
263
326
  color
264
- }), stylex.props(styles.span, colorStyles[color], iconBoxSizeStyles[size], xstyle), className ?? undefined, style),
327
+ }), stylex.props(styles.span, colorStyles[color], spanSizeStyles[size], xstyle), className ?? undefined, style),
265
328
  children: resolvedIcon
266
329
  });
267
330
  }
@@ -1,13 +1,23 @@
1
1
  import type { LinkComponentType } from './types';
2
2
  /**
3
- * Resolve `as`, then LinkProvider, then a native anchor. Both destination props
4
- * are checked before rendering; accepted structured values retain identity.
5
- * Custom components receive `to={href}` unless an explicit `to` is supplied.
3
+ * Resolves the link component to use.
4
+ *
5
+ * Priority: `as` prop > `LinkProvider` context > native `<a>`.
6
+ *
7
+ * When the resolved component is a custom component (not the native `<a>`),
8
+ * it is wrapped to receive both `href` and `to` props set to the same value.
9
+ * This allows `to`-based routers (React Router, TanStack Router) to work
10
+ * out of the box without a manual adapter.
11
+ *
12
+ * @param as - Per-component override. If provided, takes highest priority.
13
+ * @returns The resolved link component (with `to` injection for custom components).
6
14
  *
7
15
  * @example
8
16
  * ```
9
- * const LinkComponent = useLinkComponent(as);
10
- * return <LinkComponent href="/docs">Documentation</LinkComponent>;
17
+ * function MyComponent({ as }: { as?: LinkComponentType }) {
18
+ * const LinkComponent = useLinkComponent(as);
19
+ * return <LinkComponent href="/foo">Click me</LinkComponent>;
20
+ * }
11
21
  * ```
12
22
  */
13
23
  export declare function useLinkComponent(as?: LinkComponentType): LinkComponentType;
@@ -1 +1 @@
1
- {"version":3,"file":"useLinkComponent.d.ts","sourceRoot":"","sources":["../../src/Link/useLinkComponent.ts"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,SAAS,CAAC;AA+B/C;;;;;;;;;;GAUG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,CAAC,EAAE,iBAAiB,GAAG,iBAAiB,CAI1E"}
1
+ {"version":3,"file":"useLinkComponent.d.ts","sourceRoot":"","sources":["../../src/Link/useLinkComponent.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,SAAS,CAAC;AAgC/C;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,gBAAgB,CAC9B,EAAE,CAAC,EAAE,iBAAiB,GACrB,iBAAiB,CAYnB"}