@astryxdesign/core 0.1.9-canary.ae1eaed → 0.1.9-canary.d2d84f8
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 +6 -8
- 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/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/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 +2 -0
- 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 +2 -0
- 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 +2 -0
- 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 +5 -13
- package/dist/astryx.umd.js +47 -47
- package/dist/astryx.umd.js.map +3 -3
- package/package.json +1 -1
- package/src/Avatar/Avatar.tsx +6 -9
- 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/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/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 +15 -0
- package/src/FileInput/FileInput.test.tsx +23 -0
- package/src/FileInput/FileInput.tsx +10 -0
- 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 +23 -0
- package/src/NumberInput/NumberInput.tsx +10 -0
- 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 +23 -0
- package/src/TextInput/TextInput.tsx +10 -0
- 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/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;AAmID,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,+
|
|
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;AAmID,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
|
/**
|
|
@@ -452,15 +452,13 @@ export function Avatar({
|
|
|
452
452
|
value: numericSize,
|
|
453
453
|
children: rootElement
|
|
454
454
|
});
|
|
455
|
-
if (!showTooltip) {
|
|
456
|
-
return avatarElement;
|
|
457
|
-
}
|
|
458
455
|
|
|
459
|
-
//
|
|
460
|
-
//
|
|
461
|
-
//
|
|
456
|
+
// Always return the same structure so the avatar keeps its position in the
|
|
457
|
+
// React tree regardless of the tooltip flag — toggling it must not remount
|
|
458
|
+
// the avatar subtree (and lose image-load state). The tooltip is a sibling
|
|
459
|
+
// (no wrapper DOM); the hook's ref is already on the root via `rootRef`.
|
|
462
460
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
463
|
-
children: [avatarElement, tooltipHook.renderTooltip(trimmedTooltip)]
|
|
461
|
+
children: [avatarElement, showTooltip ? tooltipHook.renderTooltip(trimmedTooltip) : null]
|
|
464
462
|
});
|
|
465
463
|
}
|
|
466
464
|
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", {
|
|
@@ -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":"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"}
|
|
@@ -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();
|
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;AAMlB,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;AA0N9C,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,+BAkYhB;yBA7Ze,SAAS"}
|
|
@@ -182,6 +182,7 @@ export function FileInput({
|
|
|
182
182
|
isRequired = false,
|
|
183
183
|
isLoading = false,
|
|
184
184
|
status: statusProp,
|
|
185
|
+
statusVariant = 'attached',
|
|
185
186
|
description,
|
|
186
187
|
placeholder,
|
|
187
188
|
mode = 'input',
|
|
@@ -424,6 +425,7 @@ export function FileInput({
|
|
|
424
425
|
message: status.message,
|
|
425
426
|
messageID: status.message ? statusMessageID : undefined
|
|
426
427
|
} : undefined,
|
|
428
|
+
statusVariant: statusVariant,
|
|
427
429
|
labelTooltip: labelTooltip,
|
|
428
430
|
width: width,
|
|
429
431
|
children: [/*#__PURE__*/_jsxs("div", {
|
|
@@ -347,7 +347,7 @@ export function Lightbox({
|
|
|
347
347
|
},
|
|
348
348
|
children: [/*#__PURE__*/_jsx("div", {
|
|
349
349
|
...{
|
|
350
|
-
className: "x10l6tqk xyx6v2t
|
|
350
|
+
className: "x10l6tqk xyx6v2t x1mcfs9z x1vjfegm"
|
|
351
351
|
},
|
|
352
352
|
children: /*#__PURE__*/_jsx(IconButton, {
|
|
353
353
|
icon: /*#__PURE__*/_jsx(Icon, {
|
|
@@ -362,7 +362,7 @@ export function Lightbox({
|
|
|
362
362
|
})
|
|
363
363
|
}), isGallery && /*#__PURE__*/_jsx("div", {
|
|
364
364
|
...{
|
|
365
|
-
className: "x10l6tqk xwa60dl x1cb1t30 x1vjfegm
|
|
365
|
+
className: "x10l6tqk xwa60dl x1cb1t30 x1vjfegm x1ybfrjj"
|
|
366
366
|
},
|
|
367
367
|
children: /*#__PURE__*/_jsx(IconButton, {
|
|
368
368
|
icon: /*#__PURE__*/_jsx(Icon, {
|
|
@@ -432,7 +432,7 @@ export function Lightbox({
|
|
|
432
432
|
})]
|
|
433
433
|
}), isGallery && /*#__PURE__*/_jsx("div", {
|
|
434
434
|
...{
|
|
435
|
-
className: "x10l6tqk xwa60dl x1cb1t30 x1vjfegm
|
|
435
|
+
className: "x10l6tqk xwa60dl x1cb1t30 x1vjfegm x1mcfs9z"
|
|
436
436
|
},
|
|
437
437
|
children: /*#__PURE__*/_jsx(IconButton, {
|
|
438
438
|
icon: /*#__PURE__*/_jsx(Icon, {
|
|
@@ -448,7 +448,7 @@ export function Lightbox({
|
|
|
448
448
|
})
|
|
449
449
|
}), isGallery && mediaArray.length > 1 && /*#__PURE__*/_jsxs("div", {
|
|
450
450
|
...{
|
|
451
|
-
className: "x10l6tqk xyx6v2t
|
|
451
|
+
className: "x10l6tqk xyx6v2t x1ybfrjj x9e3rv5 xjm74w1 xw6l6zx x1vjfegm"
|
|
452
452
|
},
|
|
453
453
|
children: [index + 1, " / ", mediaArray.length]
|
|
454
454
|
})]
|
|
@@ -13,6 +13,7 @@
|
|
|
13
13
|
*/
|
|
14
14
|
import React, { type ReactNode } from 'react';
|
|
15
15
|
import { type IconType } from '../Icon';
|
|
16
|
+
import { type FieldStatusVariant } from '../Field';
|
|
16
17
|
import type { MultiSelectorOptionType, MultiSelectorOptionData, MultiSelectorStatus } from './types';
|
|
17
18
|
import type { BaseProps } from '../BaseProps';
|
|
18
19
|
import type { SizeValue } from '../utils/types';
|
|
@@ -113,6 +114,13 @@ export interface MultiSelectorProps<T extends MultiSelectorOptionType = MultiSel
|
|
|
113
114
|
* Status indicator for the selector.
|
|
114
115
|
*/
|
|
115
116
|
status?: MultiSelectorStatus;
|
|
117
|
+
/**
|
|
118
|
+
* How the status message is placed relative to the input.
|
|
119
|
+
* - 'attached': message overlaps directly below the input (bordered treatment)
|
|
120
|
+
* - 'detached': message floats below as a separate element with spacing
|
|
121
|
+
* @default 'attached'
|
|
122
|
+
*/
|
|
123
|
+
statusVariant?: FieldStatusVariant;
|
|
116
124
|
/**
|
|
117
125
|
* Width of the field. Numbers are treated as pixels, strings are used as-is
|
|
118
126
|
* (e.g. `'100%'`). Sizes the whole field (label, control, and status) so they
|
|
@@ -198,7 +206,7 @@ export interface MultiSelectorProps<T extends MultiSelectorOptionType = MultiSel
|
|
|
198
206
|
* />
|
|
199
207
|
* ```
|
|
200
208
|
*/
|
|
201
|
-
export declare function MultiSelector<T extends MultiSelectorOptionType>({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, options, value, onChange, changeAction, isLoading, placeholder: placeholderFromProps, size: sizeProp, status, labelTooltip, startIcon, hasClear, hasSelectAll, selectAllLabel: selectAllLabelFromProps, hasSearch, searchPlaceholder: searchPlaceholderFromProps, triggerDisplay, maxBadges, renderOption, isDefaultOpen, 'data-testid': testId, htmlName, width, xstyle, className, style, }: MultiSelectorProps<T>): React.JSX.Element;
|
|
209
|
+
export declare function MultiSelector<T extends MultiSelectorOptionType>({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, options, value, onChange, changeAction, isLoading, placeholder: placeholderFromProps, size: sizeProp, status, statusVariant, labelTooltip, startIcon, hasClear, hasSelectAll, selectAllLabel: selectAllLabelFromProps, hasSearch, searchPlaceholder: searchPlaceholderFromProps, triggerDisplay, maxBadges, renderOption, isDefaultOpen, 'data-testid': testId, htmlName, width, xstyle, className, style, }: MultiSelectorProps<T>): React.JSX.Element;
|
|
202
210
|
export declare namespace MultiSelector {
|
|
203
211
|
var displayName: string;
|
|
204
212
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelector.d.ts","sourceRoot":"","sources":["../../src/MultiSelector/MultiSelector.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,EASZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"MultiSelector.d.ts","sourceRoot":"","sources":["../../src/MultiSelector/MultiSelector.tsx"],"names":[],"mappings":"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"}
|
|
@@ -203,6 +203,7 @@ export function MultiSelector({
|
|
|
203
203
|
placeholder: placeholderFromProps,
|
|
204
204
|
size: sizeProp,
|
|
205
205
|
status,
|
|
206
|
+
statusVariant = 'attached',
|
|
206
207
|
labelTooltip,
|
|
207
208
|
startIcon,
|
|
208
209
|
hasClear = false,
|
|
@@ -863,6 +864,7 @@ export function MultiSelector({
|
|
|
863
864
|
message: status.message,
|
|
864
865
|
messageID: status.message ? statusMessageId : undefined
|
|
865
866
|
} : undefined,
|
|
867
|
+
statusVariant: statusVariant,
|
|
866
868
|
labelTooltip: labelTooltip,
|
|
867
869
|
width: width,
|
|
868
870
|
children: multiSelectorContent
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
*/
|
|
14
14
|
import { type FocusEvent, type KeyboardEvent, type ReactNode } from 'react';
|
|
15
15
|
import * as stylex from '@stylexjs/stylex';
|
|
16
|
-
import { type InputStatus } from '../Field';
|
|
16
|
+
import { type InputStatus, type FieldStatusVariant } from '../Field';
|
|
17
17
|
import { type IconType } from '../Icon';
|
|
18
18
|
declare const sizeStyles: Readonly<{
|
|
19
19
|
readonly sm: Readonly<{
|
|
@@ -97,6 +97,13 @@ interface NumberInputPropsBase extends Omit<BaseProps, 'onChange' | 'defaultValu
|
|
|
97
97
|
* If message is provided, displays a floating message box below the input.
|
|
98
98
|
*/
|
|
99
99
|
status?: InputStatus;
|
|
100
|
+
/**
|
|
101
|
+
* How the status message is placed relative to the input.
|
|
102
|
+
* - 'attached': message overlaps directly below the input (bordered treatment)
|
|
103
|
+
* - 'detached': message floats below as a separate element with spacing
|
|
104
|
+
* @default 'attached'
|
|
105
|
+
*/
|
|
106
|
+
statusVariant?: FieldStatusVariant;
|
|
100
107
|
/**
|
|
101
108
|
* The size of the input.
|
|
102
109
|
* - 'sm': Compact size (28px height)
|
|
@@ -207,7 +214,7 @@ export type NumberInputProps = NumberInputPropsNonClearable | NumberInputPropsCl
|
|
|
207
214
|
* <NumberInput label="Price" value={price} onChange={setPrice} min={0} step={0.01} />
|
|
208
215
|
* ```
|
|
209
216
|
*/
|
|
210
|
-
export declare function NumberInput({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, startIcon, labelIcon, status, size: sizeProp, onChange, value, placeholder, labelTooltip, hasAutoFocus, htmlName, autoComplete, min, max, step, units, isIntegerOnly, onFocus, onBlur, hasClear, onEnter, onKeyDown, width, xstyle, className, style, ref, ...rest }: NumberInputProps): import("react").JSX.Element;
|
|
217
|
+
export declare function NumberInput({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, startIcon, labelIcon, status, statusVariant, size: sizeProp, onChange, value, placeholder, labelTooltip, hasAutoFocus, htmlName, autoComplete, min, max, step, units, isIntegerOnly, onFocus, onBlur, hasClear, onEnter, onKeyDown, width, xstyle, className, style, ref, ...rest }: NumberInputProps): import("react").JSX.Element;
|
|
211
218
|
export declare namespace NumberInput {
|
|
212
219
|
var displayName: string;
|
|
213
220
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../src/NumberInput/NumberInput.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAML,KAAK,UAAU,EACf,KAAK,aAAa,EAClB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAU3C,OAAO,EAEL,KAAK,WAAW,
|
|
1
|
+
{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../src/NumberInput/NumberInput.tsx"],"names":[],"mappings":"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"}
|