@astryxdesign/core 0.1.9-canary.ae1eaed → 0.1.9-canary.b25b262
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Avatar/Avatar.d.ts +1 -1
- package/dist/Avatar/Avatar.d.ts.map +1 -1
- package/dist/Avatar/Avatar.js +12 -13
- package/dist/Banner/Banner.js +2 -2
- package/dist/Button/Button.js +2 -2
- package/dist/Chat/ChatComposerInput.js +1 -1
- package/dist/Chat/ChatLayout.js +4 -4
- package/dist/Chat/useTriggerMenu.js +2 -2
- package/dist/Citation/Citation.d.ts +22 -1
- package/dist/Citation/Citation.d.ts.map +1 -1
- package/dist/Citation/Citation.js +20 -6
- package/dist/CodeBlock/CodeBlock.js +1 -1
- package/dist/CommandPalette/CommandPaletteItem.js +1 -1
- package/dist/DateInput/DateInput.d.ts +9 -2
- package/dist/DateInput/DateInput.d.ts.map +1 -1
- package/dist/DateInput/DateInput.js +2 -0
- package/dist/DateRangeInput/DateRangeInput.d.ts +9 -2
- package/dist/DateRangeInput/DateRangeInput.d.ts.map +1 -1
- package/dist/DateRangeInput/DateRangeInput.js +3 -1
- package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
- package/dist/DateTimeInput/DateTimeInput.js +8 -2
- package/dist/DropdownMenu/DropdownMenuItem.js +1 -1
- package/dist/Field/FieldLabel.js +2 -2
- package/dist/FieldStatus/FieldStatus.d.ts +7 -0
- package/dist/FieldStatus/FieldStatus.d.ts.map +1 -1
- package/dist/FieldStatus/FieldStatus.js +37 -3
- package/dist/FileInput/FileInput.d.ts +9 -2
- package/dist/FileInput/FileInput.d.ts.map +1 -1
- package/dist/FileInput/FileInput.js +32 -18
- package/dist/Lightbox/Lightbox.js +4 -4
- package/dist/MultiSelector/MultiSelector.d.ts +9 -1
- package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.js +2 -0
- package/dist/NavMenu/NavHeadingMenuItem.js +1 -1
- package/dist/NumberInput/NumberInput.d.ts +9 -2
- package/dist/NumberInput/NumberInput.d.ts.map +1 -1
- package/dist/NumberInput/NumberInput.js +8 -1
- package/dist/PowerSearch/PowerSearch.d.ts +9 -2
- package/dist/PowerSearch/PowerSearch.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearch.js +2 -0
- package/dist/Selector/Selector.d.ts +8 -0
- package/dist/Selector/Selector.d.ts.map +1 -1
- package/dist/Selector/Selector.js +3 -1
- package/dist/TabList/Tab.js +2 -2
- package/dist/TabList/TabMenu.js +1 -1
- package/dist/Table/TableCell.js +3 -3
- package/dist/Table/TableHeaderCell.js +3 -3
- package/dist/Table/plugins/stickyColumns/useTableStickyColumns.js +1 -1
- package/dist/TextArea/TextArea.d.ts +9 -1
- package/dist/TextArea/TextArea.d.ts.map +1 -1
- package/dist/TextArea/TextArea.js +2 -0
- package/dist/TextInput/TextInput.d.ts +9 -2
- package/dist/TextInput/TextInput.d.ts.map +1 -1
- package/dist/TextInput/TextInput.js +6 -1
- package/dist/Thumbnail/Thumbnail.js +2 -2
- package/dist/TimeInput/TimeInput.d.ts +9 -2
- package/dist/TimeInput/TimeInput.d.ts.map +1 -1
- package/dist/TimeInput/TimeInput.js +2 -0
- package/dist/Tokenizer/Tokenizer.d.ts +9 -2
- package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
- package/dist/Tokenizer/Tokenizer.js +2 -0
- package/dist/TreeList/TreeListItem.js +1 -1
- package/dist/Typeahead/BaseTypeahead.js +1 -1
- package/dist/Typeahead/Typeahead.d.ts +9 -2
- package/dist/Typeahead/Typeahead.d.ts.map +1 -1
- package/dist/Typeahead/Typeahead.js +2 -0
- package/dist/astryx.css +8 -13
- package/dist/astryx.umd.js +47 -47
- package/dist/astryx.umd.js.map +4 -4
- package/dist/hooks/isRtlElement.d.ts +18 -0
- package/dist/hooks/isRtlElement.d.ts.map +1 -0
- package/dist/hooks/isRtlElement.js +27 -0
- package/dist/hooks/useGridFocus.d.ts +6 -1
- package/dist/hooks/useGridFocus.d.ts.map +1 -1
- package/dist/hooks/useGridFocus.js +12 -9
- package/dist/hooks/useListFocus.d.ts +6 -1
- package/dist/hooks/useListFocus.d.ts.map +1 -1
- package/dist/hooks/useListFocus.js +12 -4
- package/dist/theme/derivedVarRegistry.d.ts.map +1 -1
- package/dist/theme/derivedVarRegistry.js +13 -0
- package/locales/en.json +4 -0
- package/locales/pseudo.json +3 -0
- package/package.json +1 -1
- package/src/Avatar/Avatar.doc.mjs +12 -0
- package/src/Avatar/Avatar.test.tsx +13 -0
- package/src/Avatar/Avatar.tsx +24 -13
- package/src/Banner/Banner.tsx +6 -6
- package/src/Button/Button.tsx +2 -2
- package/src/Chat/ChatComposerInput.tsx +2 -2
- package/src/Chat/ChatLayout.tsx +4 -4
- package/src/Chat/useTriggerMenu.tsx +1 -1
- package/src/Citation/Citation.doc.mjs +4 -3
- package/src/Citation/Citation.test.tsx +97 -0
- package/src/Citation/Citation.tsx +43 -11
- package/src/CodeBlock/CodeBlock.tsx +1 -1
- package/src/CommandPalette/CommandPaletteItem.tsx +1 -1
- package/src/DateInput/DateInput.doc.mjs +15 -0
- package/src/DateInput/DateInput.test.tsx +23 -0
- package/src/DateInput/DateInput.tsx +10 -0
- package/src/DateRangeInput/DateRangeInput.doc.mjs +8 -0
- package/src/DateRangeInput/DateRangeInput.test.tsx +23 -0
- package/src/DateRangeInput/DateRangeInput.tsx +13 -3
- package/src/DateTimeInput/DateTimeInput.doc.mjs +16 -1
- package/src/DateTimeInput/DateTimeInput.test.tsx +112 -0
- package/src/DateTimeInput/DateTimeInput.tsx +28 -16
- package/src/DropdownMenu/DropdownMenuItem.tsx +1 -1
- package/src/Field/FieldLabel.tsx +1 -1
- package/src/FieldStatus/FieldStatus.test.tsx +72 -0
- package/src/FieldStatus/FieldStatus.tsx +42 -2
- package/src/FileInput/FileInput.doc.mjs +17 -2
- package/src/FileInput/FileInput.test.tsx +83 -9
- package/src/FileInput/FileInput.tsx +40 -26
- package/src/Lightbox/Lightbox.tsx +4 -4
- package/src/MultiSelector/MultiSelector.doc.mjs +9 -0
- package/src/MultiSelector/MultiSelector.test.tsx +23 -0
- package/src/MultiSelector/MultiSelector.tsx +10 -0
- package/src/NavMenu/NavHeadingMenuItem.tsx +1 -1
- package/src/NumberInput/NumberInput.doc.mjs +15 -0
- package/src/NumberInput/NumberInput.test.tsx +71 -0
- package/src/NumberInput/NumberInput.tsx +20 -2
- package/src/PowerSearch/PowerSearch.doc.mjs +15 -0
- package/src/PowerSearch/PowerSearch.test.tsx +23 -0
- package/src/PowerSearch/PowerSearch.tsx +10 -1
- package/src/Selector/Selector.doc.mjs +7 -0
- package/src/Selector/Selector.test.tsx +23 -0
- package/src/Selector/Selector.tsx +11 -1
- package/src/TabList/Tab.tsx +2 -2
- package/src/TabList/TabMenu.tsx +2 -2
- package/src/Table/TableCell.tsx +3 -3
- package/src/Table/TableHeaderCell.tsx +3 -3
- package/src/Table/plugins/stickyColumns/useTableStickyColumns.tsx +1 -1
- package/src/TextArea/TextArea.doc.mjs +15 -0
- package/src/TextArea/TextArea.test.tsx +23 -0
- package/src/TextArea/TextArea.tsx +10 -0
- package/src/TextInput/TextInput.doc.mjs +15 -0
- package/src/TextInput/TextInput.test.tsx +44 -0
- package/src/TextInput/TextInput.tsx +13 -1
- package/src/Thumbnail/Thumbnail.tsx +1 -1
- package/src/TimeInput/TimeInput.doc.mjs +15 -0
- package/src/TimeInput/TimeInput.test.tsx +23 -0
- package/src/TimeInput/TimeInput.tsx +10 -0
- package/src/Tokenizer/Tokenizer.doc.mjs +15 -0
- package/src/Tokenizer/Tokenizer.test.tsx +23 -0
- package/src/Tokenizer/Tokenizer.tsx +10 -0
- package/src/TreeList/TreeList.test.tsx +9 -9
- package/src/TreeList/TreeListItem.tsx +1 -1
- package/src/Typeahead/BaseTypeahead.tsx +1 -1
- package/src/Typeahead/Typeahead.doc.mjs +7 -0
- package/src/Typeahead/Typeahead.test.tsx +23 -0
- package/src/Typeahead/Typeahead.tsx +10 -0
- package/src/hooks/isRtlElement.ts +27 -0
- package/src/hooks/useGridFocus.doc.mjs +3 -3
- package/src/hooks/useGridFocus.test.tsx +41 -0
- package/src/hooks/useGridFocus.ts +21 -10
- package/src/hooks/useListFocus.doc.mjs +3 -3
- package/src/hooks/useListFocus.test.tsx +67 -1
- package/src/hooks/useListFocus.ts +21 -5
- package/src/reset.css +0 -26
- package/src/reset.test.ts +60 -0
- package/src/theme/derivedVarRegistry.test.ts +1 -0
- package/src/theme/derivedVarRegistry.ts +6 -0
- package/src/theme/generateThemeRules.test.ts +42 -0
package/dist/Avatar/Avatar.d.ts
CHANGED
|
@@ -21,7 +21,7 @@ import type { LinkComponentType } from '../Link/types';
|
|
|
21
21
|
*
|
|
22
22
|
* Avatar uses the same abbreviated scale as Icon (`xsm`/`sm`/`md`/`lg`/`xl`),
|
|
23
23
|
* but the values are larger because avatars align with media rather than
|
|
24
|
-
* glyphs. The tiers
|
|
24
|
+
* glyphs. The tiers follow the standard avatar size scale.
|
|
25
25
|
*/
|
|
26
26
|
type AvatarNamedSize = 'xsm' | 'sm' | 'md' | 'lg' | 'xl';
|
|
27
27
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAoB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAc5C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AA2BrD;;;;;;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;
|
|
1
|
+
{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAoB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAc5C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AA2BrD;;;;;;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;AAiJD,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;;;OAGG;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;AAsCD;;;;;;;;;;;;;;;;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,+BAsOb;yBAzPe,MAAM"}
|
package/dist/Avatar/Avatar.js
CHANGED
|
@@ -58,7 +58,7 @@ const INITIALS_FONT_SIZE_RATIO = 0.4;
|
|
|
58
58
|
*
|
|
59
59
|
* Avatar uses the same abbreviated scale as Icon (`xsm`/`sm`/`md`/`lg`/`xl`),
|
|
60
60
|
* but the values are larger because avatars align with media rather than
|
|
61
|
-
* glyphs. The tiers
|
|
61
|
+
* glyphs. The tiers follow the standard avatar size scale.
|
|
62
62
|
*/
|
|
63
63
|
|
|
64
64
|
/**
|
|
@@ -99,6 +99,7 @@ const styles = {
|
|
|
99
99
|
kVAEAm: "x1n2onr6",
|
|
100
100
|
k1xSpc: "x3nfvp2",
|
|
101
101
|
kmuXW: "x2lah0s",
|
|
102
|
+
kaIpWk: "xjspbzw",
|
|
102
103
|
$$css: true
|
|
103
104
|
},
|
|
104
105
|
content: {
|
|
@@ -116,10 +117,10 @@ const styles = {
|
|
|
116
117
|
kjj79g: "xl56j7k",
|
|
117
118
|
kzqmXN: "xh8yej3",
|
|
118
119
|
kZKoxP: "x5yr21d",
|
|
119
|
-
kWkggS: "
|
|
120
|
-
kMwMTN: "
|
|
120
|
+
kWkggS: "xelv01g",
|
|
121
|
+
kMwMTN: "xicfil",
|
|
121
122
|
kMv6JI: "x9ynric",
|
|
122
|
-
k63SB2: "
|
|
123
|
+
k63SB2: "xi08x9w",
|
|
123
124
|
kP9fke: "xtvhhri",
|
|
124
125
|
$$css: true
|
|
125
126
|
},
|
|
@@ -175,7 +176,7 @@ const dynamicStyles = {
|
|
|
175
176
|
"--x-height": (val => typeof val === "number" ? val + "px" : val != null ? val : undefined)(size)
|
|
176
177
|
}],
|
|
177
178
|
fontSize: size => [_temp, {
|
|
178
|
-
"--x-fontSize": (val => typeof val === "number" ? val + "px" : val != null ? val : undefined)(size * INITIALS_FONT_SIZE_RATIO)
|
|
179
|
+
"--x-fontSize": (val => typeof val === "number" ? val + "px" : val != null ? val : undefined)(`var(--_avatar-fallback-font-size, ${size * INITIALS_FONT_SIZE_RATIO}px)`)
|
|
179
180
|
}],
|
|
180
181
|
statusPosition: size => [_temp2, {
|
|
181
182
|
"--x-bottom": (val => typeof val === "number" ? val + "px" : val != null ? val : undefined)(size * CIRCLE_EDGE_OFFSET_RATIO),
|
|
@@ -372,7 +373,7 @@ export function Avatar({
|
|
|
372
373
|
children: getInitials(name)
|
|
373
374
|
}), showIcon && /*#__PURE__*/_jsx("div", {
|
|
374
375
|
...{
|
|
375
|
-
className: "x78zum5 x6s0dn4 xl56j7k xh8yej3 x5yr21d
|
|
376
|
+
className: "x78zum5 x6s0dn4 xl56j7k xh8yej3 x5yr21d xelv01g xicfil x9ynric xi08x9w xtvhhri"
|
|
376
377
|
},
|
|
377
378
|
children: /*#__PURE__*/_jsx(DefaultIcon, {
|
|
378
379
|
size: numericSize
|
|
@@ -452,15 +453,13 @@ export function Avatar({
|
|
|
452
453
|
value: numericSize,
|
|
453
454
|
children: rootElement
|
|
454
455
|
});
|
|
455
|
-
if (!showTooltip) {
|
|
456
|
-
return avatarElement;
|
|
457
|
-
}
|
|
458
456
|
|
|
459
|
-
//
|
|
460
|
-
//
|
|
461
|
-
//
|
|
457
|
+
// Always return the same structure so the avatar keeps its position in the
|
|
458
|
+
// React tree regardless of the tooltip flag — toggling it must not remount
|
|
459
|
+
// the avatar subtree (and lose image-load state). The tooltip is a sibling
|
|
460
|
+
// (no wrapper DOM); the hook's ref is already on the root via `rootRef`.
|
|
462
461
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
463
|
-
children: [avatarElement, tooltipHook.renderTooltip(trimmedTooltip)]
|
|
462
|
+
children: [avatarElement, showTooltip ? tooltipHook.renderTooltip(trimmedTooltip) : null]
|
|
464
463
|
});
|
|
465
464
|
}
|
|
466
465
|
Avatar.displayName = 'Avatar';
|
package/dist/Banner/Banner.js
CHANGED
|
@@ -392,10 +392,10 @@ export function Banner({
|
|
|
392
392
|
status
|
|
393
393
|
}), {
|
|
394
394
|
0: {
|
|
395
|
-
className: "x1de1mus x8o8v82 x1pzlopt
|
|
395
|
+
className: "x1de1mus x8o8v82 x1pzlopt xgbv0en xw8tdv1 x92x3c3 x1t7ytsu x18b5jzi x1q0q8m5 x1j92z86 x1gejf6u xw8gpjh"
|
|
396
396
|
},
|
|
397
397
|
1: {
|
|
398
|
-
className: "x1de1mus x8o8v82 x1pzlopt
|
|
398
|
+
className: "x1de1mus x8o8v82 x1pzlopt xgbv0en xw8tdv1 x92x3c3 x1t7ytsu x18b5jzi x1q0q8m5 x1j92z86 x1gejf6u xw8gpjh xv76oww x1padx2d"
|
|
399
399
|
}
|
|
400
400
|
}[!!isCard << 0]),
|
|
401
401
|
children: children
|
package/dist/Button/Button.js
CHANGED
|
@@ -467,10 +467,10 @@ export function Button({
|
|
|
467
467
|
children: [isLoadingState && /*#__PURE__*/_jsx("span", {
|
|
468
468
|
...{
|
|
469
469
|
0: {
|
|
470
|
-
className: "x10l6tqk x13vifvy
|
|
470
|
+
className: "x10l6tqk x13vifvy x1o0tod xtijo5x x1ey2m1c xrvj5dj x1ku5rj1"
|
|
471
471
|
},
|
|
472
472
|
1: {
|
|
473
|
-
className: "x10l6tqk x13vifvy
|
|
473
|
+
className: "x10l6tqk x13vifvy x1o0tod xtijo5x x1ey2m1c xrvj5dj x1ku5rj1 xqcmdr3 xb2rp9n xskzprw x17yabm6 x14q22ui"
|
|
474
474
|
}
|
|
475
475
|
}[!!delaySpinner << 0],
|
|
476
476
|
"aria-hidden": "true",
|
|
@@ -458,7 +458,7 @@ export function ChatComposerInput(props) {
|
|
|
458
458
|
...rest,
|
|
459
459
|
children: [isEmpty && /*#__PURE__*/_jsx("div", {
|
|
460
460
|
...{
|
|
461
|
-
className: "x10l6tqk x13vifvy
|
|
461
|
+
className: "x10l6tqk x13vifvy x1o0tod xtijo5x x47corl xv1l7n4 xjm74w1 x6pjikd x19v9tvf x9ynric x87ps6o x9epnlk"
|
|
462
462
|
},
|
|
463
463
|
"aria-hidden": "true",
|
|
464
464
|
children: placeholder
|
package/dist/Chat/ChatLayout.js
CHANGED
|
@@ -69,8 +69,8 @@ const styles = {
|
|
|
69
69
|
blurLayer: {
|
|
70
70
|
kVAEAm: "x10l6tqk",
|
|
71
71
|
krVfgx: "x1ey2m1c",
|
|
72
|
-
|
|
73
|
-
|
|
72
|
+
kLqNvP: "x1o0tod",
|
|
73
|
+
kt4wiu: "xtijo5x",
|
|
74
74
|
kfzvcC: "x47corl",
|
|
75
75
|
k6WDB: "xvn2z4z",
|
|
76
76
|
keRtuK: "x67t5t6",
|
|
@@ -258,10 +258,10 @@ export function ChatLayout({
|
|
|
258
258
|
}), /*#__PURE__*/_jsxs("div", {
|
|
259
259
|
...{
|
|
260
260
|
0: {
|
|
261
|
-
className: "x1ey2m1c
|
|
261
|
+
className: "x1ey2m1c x1o0tod xtijo5x x1ja2u2z xc8icb0 x47corl xixxii4"
|
|
262
262
|
},
|
|
263
263
|
1: {
|
|
264
|
-
className: "x1ey2m1c
|
|
264
|
+
className: "x1ey2m1c x1o0tod xtijo5x x1ja2u2z xc8icb0 x47corl x7wzq59"
|
|
265
265
|
}
|
|
266
266
|
}[!!isSelfScrolling << 0],
|
|
267
267
|
children: [scrollButton === undefined ? defaultScrollButton : scrollButton, /*#__PURE__*/_jsx("div", {
|
|
@@ -466,10 +466,10 @@ export function useTriggerMenu(options) {
|
|
|
466
466
|
})),
|
|
467
467
|
...{
|
|
468
468
|
0: {
|
|
469
|
-
className: "x9f619 x78zum5 x6s0dn4 xh8yej3 xlsj2fj xh6dtrn x1ypdohk x1a2a7pz xjbqb8w
|
|
469
|
+
className: "x9f619 x78zum5 x6s0dn4 xh8yej3 xlsj2fj xh6dtrn x1ypdohk x1a2a7pz xjbqb8w x1yc453h x9ynric xjm74w1 xw6l6zx x1tgivj0"
|
|
470
470
|
},
|
|
471
471
|
1: {
|
|
472
|
-
className: "x9f619 x78zum5 x6s0dn4 xh8yej3 xlsj2fj xh6dtrn x1ypdohk x1a2a7pz
|
|
472
|
+
className: "x9f619 x78zum5 x6s0dn4 xh8yej3 xlsj2fj xh6dtrn x1ypdohk x1a2a7pz x1yc453h x9ynric xjm74w1 xw6l6zx x1tgivj0 x1lmrjuc"
|
|
473
473
|
}
|
|
474
474
|
}[!!(idx === state.highlightedIndex) << 0],
|
|
475
475
|
children: trigger?.renderItem ? trigger.renderItem(item) : /*#__PURE__*/_jsx("span", {
|
|
@@ -6,14 +6,35 @@
|
|
|
6
6
|
*
|
|
7
7
|
* SYNC: When modified, update these files to stay in sync:
|
|
8
8
|
* - /packages/core/src/Citation/index.ts (exports if types change)
|
|
9
|
+
* - /packages/core/src/Citation/Citation.doc.mjs (props table, features)
|
|
10
|
+
* - /packages/core/src/Citation/Citation.test.tsx (tests for new/changed behavior)
|
|
11
|
+
* - /apps/storybook/stories/Citation.stories.tsx (storybook stories)
|
|
9
12
|
* - /packages/cli/templates/blocks/components/Citation/ (showcase blocks)
|
|
10
13
|
*/
|
|
11
14
|
import type React from 'react';
|
|
15
|
+
import type { ReactNode } from 'react';
|
|
12
16
|
import type { BaseProps } from '../BaseProps';
|
|
13
17
|
export interface CitationSource {
|
|
14
18
|
title?: string;
|
|
15
19
|
url?: string;
|
|
16
|
-
|
|
20
|
+
/**
|
|
21
|
+
* Image URL for a favicon or source logo, rendered as `<img src>` inside the
|
|
22
|
+
* icon circle. This is the idiomatic field for image sources (mirrors
|
|
23
|
+
* `Avatar`/`Thumbnail` `src`). When both `src` and a non-string `icon` are
|
|
24
|
+
* provided, `icon` wins.
|
|
25
|
+
*/
|
|
26
|
+
src?: string;
|
|
27
|
+
/**
|
|
28
|
+
* Source icon shown before the label text (label variant only). Accepts:
|
|
29
|
+
* - a React node / Astryx `<Icon>` / SVG element — rendered as-is, or
|
|
30
|
+
* - a string image URL — rendered as `<img src>` for backward compatibility
|
|
31
|
+
* with callers that passed a favicon URL here.
|
|
32
|
+
*
|
|
33
|
+
* Note: unlike icon slots elsewhere in the system, a bare string is treated
|
|
34
|
+
* as an image URL (not a semantic icon name) to preserve the original
|
|
35
|
+
* favicon behavior. Pass an Astryx `<Icon>` (or other node) for a real icon.
|
|
36
|
+
*/
|
|
37
|
+
icon?: ReactNode;
|
|
17
38
|
}
|
|
18
39
|
export interface CitationProps extends BaseProps<HTMLElement> {
|
|
19
40
|
ref?: React.Ref<HTMLElement>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Citation.d.ts","sourceRoot":"","sources":["../../src/Citation/Citation.tsx"],"names":[],"mappings":"AAIA
|
|
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;AA2GD,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"}
|
|
@@ -10,6 +10,9 @@
|
|
|
10
10
|
*
|
|
11
11
|
* SYNC: When modified, update these files to stay in sync:
|
|
12
12
|
* - /packages/core/src/Citation/index.ts (exports if types change)
|
|
13
|
+
* - /packages/core/src/Citation/Citation.doc.mjs (props table, features)
|
|
14
|
+
* - /packages/core/src/Citation/Citation.test.tsx (tests for new/changed behavior)
|
|
15
|
+
* - /apps/storybook/stories/Citation.stories.tsx (storybook stories)
|
|
13
16
|
* - /packages/cli/templates/blocks/components/Citation/ (showcase blocks)
|
|
14
17
|
*/
|
|
15
18
|
import * as stylex from '@stylexjs/stylex';
|
|
@@ -18,6 +21,7 @@ import { colorVars, spacingVars, radiusVars, typeScaleVars, fontWeightVars, bord
|
|
|
18
21
|
import { mergeProps } from "../utils/index.js";
|
|
19
22
|
import { themeProps } from "../utils/themeProps.js";
|
|
20
23
|
import { useTranslator } from "../i18n/index.js";
|
|
24
|
+
import { renderIconSlot } from "../Icon/index.js";
|
|
21
25
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
22
26
|
const styles = {
|
|
23
27
|
label: {
|
|
@@ -100,7 +104,15 @@ export function Citation({
|
|
|
100
104
|
const t = useTranslator();
|
|
101
105
|
const title = source.title ?? String(number);
|
|
102
106
|
const href = source.url;
|
|
103
|
-
|
|
107
|
+
|
|
108
|
+
// Resolve the source icon. A non-string `icon` node renders as-is (an Astryx
|
|
109
|
+
// <Icon>, SVG, avatar, etc.). Otherwise fall back to an image URL: `src`, or
|
|
110
|
+
// a legacy string passed to `icon` (back-compat — favicon URLs still render
|
|
111
|
+
// as <img>). The icon is decorative; the accessible name comes solely from
|
|
112
|
+
// the element's aria-label, so nothing is double-announced.
|
|
113
|
+
const iconNode = source.icon != null && typeof source.icon !== 'string' ? source.icon : null;
|
|
114
|
+
const imageSrc = source.src ?? (typeof source.icon === 'string' ? source.icon : undefined);
|
|
115
|
+
const hasIcon = iconNode != null || imageSrc != null;
|
|
104
116
|
const Tag = href ? 'a' : 'span';
|
|
105
117
|
// `doc-noteref` is a reference role — only appropriate on the interactive
|
|
106
118
|
// link form. On a plain (unlinked) span it is not a permitted role
|
|
@@ -146,15 +158,17 @@ export function Citation({
|
|
|
146
158
|
...linkProps,
|
|
147
159
|
...mergeProps(themeProps('citation', {
|
|
148
160
|
variant
|
|
149
|
-
}), stylex.props(styles.label,
|
|
150
|
-
children: [
|
|
161
|
+
}), stylex.props(styles.label, hasIcon && styles.labelWithIcon, href != null && styles.labelHover, href != null && styles.labelInteractive, xstyle), className, style),
|
|
162
|
+
children: [hasIcon && /*#__PURE__*/_jsx("span", {
|
|
163
|
+
"aria-hidden": "true",
|
|
151
164
|
...{
|
|
152
165
|
className: "x3nfvp2 x6s0dn4 xl56j7k x12xnipv x6b6gus xjspbzw x10xzikg x1litavf x1y0btm7 x14i3s5s xb3r6kr x2lah0s"
|
|
153
166
|
},
|
|
154
|
-
children:
|
|
155
|
-
|
|
167
|
+
children: iconNode != null ? renderIconSlot(iconNode, {
|
|
168
|
+
size: 'sm'
|
|
169
|
+
}) : /*#__PURE__*/_jsx("img", {
|
|
170
|
+
src: imageSrc,
|
|
156
171
|
alt: "",
|
|
157
|
-
"aria-hidden": "true",
|
|
158
172
|
...{
|
|
159
173
|
className: "x1ad1g3v x9gl9lo"
|
|
160
174
|
}
|
|
@@ -480,7 +480,7 @@ export function CodeBlock({
|
|
|
480
480
|
className: "x3nfvp2 x6s0dn4 xl56j7k x9epnlk x3kzqx6 xx3sua9 xjbqb8w xe9uy6x x1mjzq1q x1ypdohk x14ju556"
|
|
481
481
|
},
|
|
482
482
|
1: {
|
|
483
|
-
className: "x3nfvp2 x6s0dn4 xl56j7k x9epnlk x3kzqx6 xx3sua9 xjbqb8w xe9uy6x x1mjzq1q x1ypdohk x14ju556 x10l6tqk xctzyg
|
|
483
|
+
className: "x3nfvp2 x6s0dn4 xl56j7k x9epnlk x3kzqx6 xx3sua9 xjbqb8w xe9uy6x x1mjzq1q x1ypdohk x14ju556 x10l6tqk xctzyg x72tfeb"
|
|
484
484
|
}
|
|
485
485
|
}[!!!showHeader << 0],
|
|
486
486
|
children: copyIcon
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as stylex from '@stylexjs/stylex';
|
|
2
|
-
import { type InputStatus } from '../Field';
|
|
2
|
+
import { type InputStatus, type FieldStatusVariant } from '../Field';
|
|
3
3
|
import { type ISODateString } from '../Calendar';
|
|
4
4
|
import type { TimestampFormat } from '../Timestamp';
|
|
5
5
|
declare const sizeStyles: Readonly<{
|
|
@@ -136,6 +136,13 @@ export interface DateInputProps extends Omit<BaseProps, 'onChange' | 'defaultVal
|
|
|
136
136
|
* If message is provided, displays below the input.
|
|
137
137
|
*/
|
|
138
138
|
status?: InputStatus;
|
|
139
|
+
/**
|
|
140
|
+
* How the status message is placed relative to the input.
|
|
141
|
+
* - 'attached': message overlaps directly below the input (bordered treatment)
|
|
142
|
+
* - 'detached': message floats below as a separate element with spacing
|
|
143
|
+
* @default 'attached'
|
|
144
|
+
*/
|
|
145
|
+
statusVariant?: FieldStatusVariant;
|
|
139
146
|
/**
|
|
140
147
|
* Width of the field. Numbers are treated as pixels, strings are used as-is
|
|
141
148
|
* (e.g. `'100%'`). Sizes the whole field (label, control, and status) so they
|
|
@@ -200,7 +207,7 @@ export interface DateInputProps extends Omit<BaseProps, 'onChange' | 'defaultVal
|
|
|
200
207
|
* />
|
|
201
208
|
* ```
|
|
202
209
|
*/
|
|
203
|
-
export declare function DateInput({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, value, onChange, changeAction, isLoading, min, max, dateConstraints, placeholder: placeholderFromProps, size: sizeProp, status, labelTooltip, hasClear, numberOfMonths, format, width, xstyle, className, style, ref, ...rest }: DateInputProps): import("react").JSX.Element;
|
|
210
|
+
export declare function DateInput({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, value, onChange, changeAction, isLoading, min, max, dateConstraints, placeholder: placeholderFromProps, size: sizeProp, status, statusVariant, labelTooltip, hasClear, numberOfMonths, format, width, xstyle, className, style, ref, ...rest }: DateInputProps): import("react").JSX.Element;
|
|
204
211
|
export declare namespace DateInput {
|
|
205
212
|
var displayName: string;
|
|
206
213
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../src/DateInput/DateInput.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAU3C,OAAO,EAEL,KAAK,WAAW,
|
|
1
|
+
{"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../src/DateInput/DateInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -101,6 +101,7 @@ export function DateInput({
|
|
|
101
101
|
placeholder: placeholderFromProps,
|
|
102
102
|
size: sizeProp,
|
|
103
103
|
status,
|
|
104
|
+
statusVariant = 'attached',
|
|
104
105
|
labelTooltip,
|
|
105
106
|
hasClear = false,
|
|
106
107
|
numberOfMonths = 1,
|
|
@@ -451,6 +452,7 @@ export function DateInput({
|
|
|
451
452
|
message: status.message,
|
|
452
453
|
messageID: status.message ? statusMessageID : undefined
|
|
453
454
|
} : undefined,
|
|
455
|
+
statusVariant: statusVariant,
|
|
454
456
|
labelTooltip: labelTooltip,
|
|
455
457
|
width: width,
|
|
456
458
|
children: inputWrapper
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { type InputStatus } from '../Field';
|
|
1
|
+
import { type InputStatus, type FieldStatusVariant } from '../Field';
|
|
2
2
|
import { type ISODateString, type DateRange } from '../Calendar';
|
|
3
3
|
import type { BaseProps } from '../BaseProps';
|
|
4
4
|
import type { SizeValue } from '../utils/types';
|
|
@@ -116,6 +116,13 @@ export interface DateRangeInputProps extends Omit<BaseProps, 'onChange' | 'defau
|
|
|
116
116
|
* Status indicator for the input.
|
|
117
117
|
*/
|
|
118
118
|
status?: InputStatus;
|
|
119
|
+
/**
|
|
120
|
+
* How the status message is placed relative to the input.
|
|
121
|
+
* - 'attached': message overlaps directly below the input (bordered treatment)
|
|
122
|
+
* - 'detached': message floats below as a separate element with spacing
|
|
123
|
+
* @default 'attached'
|
|
124
|
+
*/
|
|
125
|
+
statusVariant?: FieldStatusVariant;
|
|
119
126
|
/**
|
|
120
127
|
* Width of the field. Numbers are treated as pixels, strings are used as-is
|
|
121
128
|
* (e.g. `'100%'`). Sizes the whole field (label, control, and status) so they
|
|
@@ -148,7 +155,7 @@ export interface DateRangeInputProps extends Omit<BaseProps, 'onChange' | 'defau
|
|
|
148
155
|
* />
|
|
149
156
|
* ```
|
|
150
157
|
*/
|
|
151
|
-
export declare function DateRangeInput({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, value, onChange, changeAction, isLoading, min, max, dateConstraints, presets, hasClear, placeholder: placeholderFromProps, size: sizeProp, status, labelTooltip, numberOfMonths, width, xstyle, className, style, ref, ...rest }: DateRangeInputProps): import("react").JSX.Element;
|
|
158
|
+
export declare function DateRangeInput({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, value, onChange, changeAction, isLoading, min, max, dateConstraints, presets, hasClear, placeholder: placeholderFromProps, size: sizeProp, status, statusVariant, labelTooltip, numberOfMonths, width, xstyle, className, style, ref, ...rest }: DateRangeInputProps): import("react").JSX.Element;
|
|
152
159
|
export declare namespace DateRangeInput {
|
|
153
160
|
var displayName: string;
|
|
154
161
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../src/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"AAqCA,OAAO,EAEL,KAAK,WAAW,
|
|
1
|
+
{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../src/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"AAqCA,OAAO,EAEL,KAAK,WAAW,EAMhB,KAAK,kBAAkB,EACxB,MAAM,UAAU,CAAC;AAGlB,OAAO,EAAW,KAAK,aAAa,EAAE,KAAK,SAAS,EAAC,MAAM,aAAa,CAAC;AAIzE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAK9C,YAAY,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AAE3C,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,SAAS,CAAC;CAC3B;AAED,MAAM,MAAM,kBAAkB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEpD,YAAY,EACV,WAAW,IAAI,oBAAoB,EACnC,eAAe,IAAI,wBAAwB,GAC5C,MAAM,UAAU,CAAC;AAqIlB,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAC/C,SAAS,EACT,UAAU,GAAG,cAAc,CAC5B;IACC,0CAA0C;IAC1C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAEnC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,KAAK,EAAE,SAAS,GAAG,IAAI,CAAC;IAExB;;;OAGG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI,KAAK,IAAI,CAAC;IAE5C;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAEjE;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB;;OAEG;IACH,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB;;;OAGG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC;IAEzD;;OAEG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC;IAEzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAE1B;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,kBAAkB,CAAC;IAEnC;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CACxB;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,eAAe,EACf,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,eAAe,EACf,OAAO,EACP,QAAe,EACf,WAAW,EAAE,oBAAoB,EACjC,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,aAA0B,EAC1B,YAAY,EACZ,cAAkB,EAClB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,mBAAmB,+BAgRrB;yBA7Se,cAAc"}
|
|
@@ -104,6 +104,7 @@ export function DateRangeInput({
|
|
|
104
104
|
placeholder: placeholderFromProps,
|
|
105
105
|
size: sizeProp,
|
|
106
106
|
status,
|
|
107
|
+
statusVariant = 'attached',
|
|
107
108
|
labelTooltip,
|
|
108
109
|
numberOfMonths = 2,
|
|
109
110
|
width,
|
|
@@ -202,6 +203,7 @@ export function DateRangeInput({
|
|
|
202
203
|
message: status.message,
|
|
203
204
|
messageID: status.message ? statusMessageID : undefined
|
|
204
205
|
} : undefined,
|
|
206
|
+
statusVariant: statusVariant,
|
|
205
207
|
labelTooltip: labelTooltip,
|
|
206
208
|
width: width,
|
|
207
209
|
children: [/*#__PURE__*/_jsxs("div", {
|
|
@@ -299,7 +301,7 @@ export function DateRangeInput({
|
|
|
299
301
|
role: "group",
|
|
300
302
|
"aria-label": t('@astryx.dateRangeInput.presetDateRanges'),
|
|
301
303
|
...{
|
|
302
|
-
className: "x78zum5 xdt5ytf xzye2dw x1b2ylru
|
|
304
|
+
className: "x78zum5 xdt5ytf xzye2dw x1b2ylru xw8tdv1 x18b5jzi xl0t3rv x1d77m7x"
|
|
303
305
|
},
|
|
304
306
|
children: presets.map(preset => {
|
|
305
307
|
const presetRange = preset.getRange();
|
|
@@ -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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"}
|
|
@@ -496,7 +496,10 @@ export function DateTimeInput({
|
|
|
496
496
|
}), stylex.props(styles.row, xstyle), className, style),
|
|
497
497
|
children: [/*#__PURE__*/_jsxs("div", {
|
|
498
498
|
ref: popover.triggerRef,
|
|
499
|
-
...
|
|
499
|
+
...mergeProps(themeProps('date-time-input-date-segment', {
|
|
500
|
+
size,
|
|
501
|
+
status: status?.type ?? null
|
|
502
|
+
}), stylex.props(inputWrapperStyles.base, sizeStyles[size], styles.dateWrapper, isEffectivelyDisabled && inputWrapperStyles.disabled, status && inputStatusBorderStyles[status.type], status && inputStatusHoverShadowStyles[status.type], status && inputStatusFocusWithinStyles[status.type])),
|
|
500
503
|
children: [/*#__PURE__*/_jsx("button", {
|
|
501
504
|
type: "button",
|
|
502
505
|
onClick: handleCalendarToggle,
|
|
@@ -587,7 +590,10 @@ export function DateTimeInput({
|
|
|
587
590
|
ref: timeContainerRef,
|
|
588
591
|
onClick: handleTimeWrapperClick,
|
|
589
592
|
onMouseUp: handleTimeWrapperMouseUp,
|
|
590
|
-
...
|
|
593
|
+
...mergeProps(themeProps('date-time-input-time-segment', {
|
|
594
|
+
size,
|
|
595
|
+
status: status?.type ?? null
|
|
596
|
+
}), stylex.props(inputWrapperStyles.base, sizeStyles[size], styles.timeWrapper, isEffectivelyDisabled && inputWrapperStyles.disabled, status && inputStatusBorderStyles[status.type], status && inputStatusHoverShadowStyles[status.type], status && inputStatusFocusWithinStyles[status.type])),
|
|
591
597
|
children: [/*#__PURE__*/_jsx("div", {
|
|
592
598
|
...{
|
|
593
599
|
className: "x78zum5 x6s0dn4 xl56j7k x2lah0s"
|
package/dist/Field/FieldLabel.js
CHANGED
|
@@ -42,7 +42,7 @@ const styles = {
|
|
|
42
42
|
ksu8eU: "xng3xce",
|
|
43
43
|
kMcinP: "xzpqnlu",
|
|
44
44
|
kZKoxP: "xjm9jq1",
|
|
45
|
-
|
|
45
|
+
kLqNvP: "x1o0tod",
|
|
46
46
|
kogj98: "xkdpibf",
|
|
47
47
|
kVQacm: "xb3r6kr",
|
|
48
48
|
kmVPX3: "x1717udv",
|
|
@@ -134,7 +134,7 @@ export function FieldLabel({
|
|
|
134
134
|
className: "x9ynric x141an7d x1ltkj2j x1sodnla xv1l7n4"
|
|
135
135
|
},
|
|
136
136
|
1: {
|
|
137
|
-
className: "x9ynric x141an7d x1ltkj2j x1sodnla xv1l7n4 xng3xce xzpqnlu xjm9jq1
|
|
137
|
+
className: "x9ynric x141an7d x1ltkj2j x1sodnla xv1l7n4 xng3xce xzpqnlu xjm9jq1 x1o0tod xkdpibf xb3r6kr x1717udv x47corl x10l6tqk x13vifvy x87ps6o xuxw1ft x1i1rx1s"
|
|
138
138
|
}
|
|
139
139
|
}[!!isLabelHidden << 0],
|
|
140
140
|
children: description
|
|
@@ -43,6 +43,13 @@ export interface FieldStatusProps extends BaseProps<HTMLDivElement> {
|
|
|
43
43
|
/**
|
|
44
44
|
* A status message component for form fields.
|
|
45
45
|
*
|
|
46
|
+
* The `detached` variant renders a leading status icon before the message so
|
|
47
|
+
* status is not conveyed by color or position alone (WCAG 1.4.1). The icon is
|
|
48
|
+
* decorative for assistive tech (`aria-hidden`): the message text already names
|
|
49
|
+
* the status in words and is announced through the live region. The `attached`
|
|
50
|
+
* variant keeps its status affordance on the bordered input, so it renders no
|
|
51
|
+
* icon here to avoid a duplicate.
|
|
52
|
+
*
|
|
46
53
|
* Screen-reader announcements go through the persistent `useAnnounce` live
|
|
47
54
|
* regions (assertive for errors, polite otherwise) rather than `role`/
|
|
48
55
|
* `aria-live` on the rendered element. Live regions that mount together with
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldStatus.d.ts","sourceRoot":"","sources":["../../src/FieldStatus/FieldStatus.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAU5C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"FieldStatus.d.ts","sourceRoot":"","sources":["../../src/FieldStatus/FieldStatus.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAU5C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,gBAAgB,CAAC;AAiEpD;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,IAAI,CAAC;IACf,QAAQ,EAAE,IAAI,CAAC;CAChB;AAED;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG,MAAM,qBAAqB,CAAC;AAE7D,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACjE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,IAAI,EAAE,eAAe,CAAC;IACtB;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,IAAI,EACJ,OAAO,EACP,EAAE,EACF,OAAoB,EACpB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,gBAAgB,qBA2ClB;yBArDe,WAAW"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
4
|
* @file FieldStatus.tsx
|
|
5
|
-
* @input Uses React, stylex, theme tokens, useAnnounce
|
|
5
|
+
* @input Uses React, stylex, theme tokens, useAnnounce, Icon
|
|
6
6
|
* @output Exports FieldStatus component, FieldStatusProps
|
|
7
7
|
* @position Core implementation; consumed by Field, Switch, CheckboxInput, and the FieldStatus entrypoint
|
|
8
8
|
*
|
|
@@ -24,7 +24,18 @@ import "../theme/tokens.stylex.js";
|
|
|
24
24
|
import { colorVars, radiusVars, spacingVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
|
|
25
25
|
import { useEntryAnimation } from "../hooks/useEntryAnimation.js";
|
|
26
26
|
import { themeProps } from "../utils/themeProps.js";
|
|
27
|
-
import {
|
|
27
|
+
import { Icon } from "../Icon/index.js";
|
|
28
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
29
|
+
/**
|
|
30
|
+
* Maps each status type to its status glyph. Mirrors the mapping the input
|
|
31
|
+
* controls already use for the on-field status affordance, so the detached
|
|
32
|
+
* message shows the same icon a consumer sees elsewhere for that status.
|
|
33
|
+
*/
|
|
34
|
+
const statusIconMap = {
|
|
35
|
+
warning: 'warning',
|
|
36
|
+
error: 'error',
|
|
37
|
+
success: 'success'
|
|
38
|
+
};
|
|
28
39
|
const styles = {
|
|
29
40
|
base: {
|
|
30
41
|
kMv6JI: "x9ynric",
|
|
@@ -88,6 +99,13 @@ const colorStyles = {
|
|
|
88
99
|
/**
|
|
89
100
|
* A status message component for form fields.
|
|
90
101
|
*
|
|
102
|
+
* The `detached` variant renders a leading status icon before the message so
|
|
103
|
+
* status is not conveyed by color or position alone (WCAG 1.4.1). The icon is
|
|
104
|
+
* decorative for assistive tech (`aria-hidden`): the message text already names
|
|
105
|
+
* the status in words and is announced through the live region. The `attached`
|
|
106
|
+
* variant keeps its status affordance on the bordered input, so it renders no
|
|
107
|
+
* icon here to avoid a duplicate.
|
|
108
|
+
*
|
|
91
109
|
* Screen-reader announcements go through the persistent `useAnnounce` live
|
|
92
110
|
* regions (assertive for errors, polite otherwise) rather than `role`/
|
|
93
111
|
* `aria-live` on the rendered element. Live regions that mount together with
|
|
@@ -140,7 +158,23 @@ export function FieldStatus({
|
|
|
140
158
|
type,
|
|
141
159
|
variant
|
|
142
160
|
}), stylex.props(styles.base, entryStyle, variant === 'attached' ? styles.attached : styles.detached, colorStyles[type], xstyle), className, style),
|
|
143
|
-
children:
|
|
161
|
+
children: variant === 'detached' ? /*#__PURE__*/_jsxs("span", {
|
|
162
|
+
...{
|
|
163
|
+
className: "x78zum5 x1cy8zhl xzye2dw"
|
|
164
|
+
},
|
|
165
|
+
children: [/*#__PURE__*/_jsx("span", {
|
|
166
|
+
...{
|
|
167
|
+
className: "x1ltkj2j x2lah0s"
|
|
168
|
+
},
|
|
169
|
+
children: /*#__PURE__*/_jsx(Icon, {
|
|
170
|
+
icon: statusIconMap[type],
|
|
171
|
+
size: "sm",
|
|
172
|
+
color: "inherit"
|
|
173
|
+
})
|
|
174
|
+
}), /*#__PURE__*/_jsx("span", {
|
|
175
|
+
children: message
|
|
176
|
+
})]
|
|
177
|
+
}) : message
|
|
144
178
|
});
|
|
145
179
|
}
|
|
146
180
|
FieldStatus.displayName = 'FieldStatus';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { type InputStatus } from '../Field';
|
|
1
|
+
import { type InputStatus, type FieldStatusVariant } from '../Field';
|
|
2
2
|
export type { InputStatus as FileInputStatus, InputStatusType as FileInputStatusType, } from '../Field';
|
|
3
3
|
import type { BaseProps } from '../BaseProps';
|
|
4
4
|
import type { SizeValue } from '../utils/types';
|
|
@@ -86,6 +86,13 @@ export interface FileInputProps extends Omit<BaseProps, 'onChange' | 'defaultVal
|
|
|
86
86
|
* Validation status for the input.
|
|
87
87
|
*/
|
|
88
88
|
status?: InputStatus;
|
|
89
|
+
/**
|
|
90
|
+
* How the status message is placed relative to the input.
|
|
91
|
+
* - 'attached': message overlaps directly below the input (bordered treatment)
|
|
92
|
+
* - 'detached': message floats below as a separate element with spacing
|
|
93
|
+
* @default 'attached'
|
|
94
|
+
*/
|
|
95
|
+
statusVariant?: FieldStatusVariant;
|
|
89
96
|
/**
|
|
90
97
|
* Description text displayed below the label.
|
|
91
98
|
*/
|
|
@@ -126,7 +133,7 @@ export interface FileInputProps extends Omit<BaseProps, 'onChange' | 'defaultVal
|
|
|
126
133
|
* <FileInput label="Resume" value={file} onChange={setFile} accept=".pdf" />
|
|
127
134
|
* ```
|
|
128
135
|
*/
|
|
129
|
-
export declare function FileInput({ label, isLabelHidden, value, onChange, changeAction, accept, isMultiple, maxSize, maxFiles, isDisabled, disabledMessage, isRequired, isLoading, status: statusProp, description, placeholder, mode, isOptional, labelTooltip, width, xstyle, className, style, ref, ...rest }: FileInputProps): import("react").JSX.Element;
|
|
136
|
+
export declare function FileInput({ label, isLabelHidden, value, onChange, changeAction, accept, isMultiple, maxSize, maxFiles, isDisabled, disabledMessage, isRequired, isLoading, status: statusProp, statusVariant, description, placeholder, mode, isOptional, labelTooltip, width, xstyle, className, style, ref, ...rest }: FileInputProps): import("react").JSX.Element;
|
|
130
137
|
export declare namespace FileInput {
|
|
131
138
|
var displayName: string;
|
|
132
139
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileInput.d.ts","sourceRoot":"","sources":["../../src/FileInput/FileInput.tsx"],"names":[],"mappings":"AAsCA,OAAO,EAGL,KAAK,WAAW,
|
|
1
|
+
{"version":3,"file":"FileInput.d.ts","sourceRoot":"","sources":["../../src/FileInput/FileInput.tsx"],"names":[],"mappings":"AAsCA,OAAO,EAGL,KAAK,WAAW,EAEhB,KAAK,kBAAkB,EACxB,MAAM,UAAU,CAAC;AAOlB,YAAY,EACV,WAAW,IAAI,eAAe,EAC9B,eAAe,IAAI,mBAAmB,GACvC,MAAM,UAAU,CAAC;AAElB,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AA+M9C,MAAM,WAAW,cAAe,SAAQ,IAAI,CAC1C,SAAS,EACT,UAAU,GAAG,cAAc,GAAG,OAAO,CACtC;IACC,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,KAAK,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG,IAAI,CAAC;IAC5B;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG,IAAI,KAAK,IAAI,CAAC;IAChD;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG,IAAI,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9D;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;IAC5B;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,aAAqB,EACrB,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,UAAkB,EAClB,OAAO,EACP,QAAQ,EACR,UAAkB,EAClB,eAAe,EACf,UAAkB,EAClB,SAAiB,EACjB,MAAM,EAAE,UAAU,EAClB,aAA0B,EAC1B,WAAW,EACX,WAAW,EACX,IAAc,EACd,UAAkB,EAClB,YAAY,EACZ,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,cAAc,+BAgZhB;yBA3ae,SAAS"}
|