@astryxdesign/core 0.6.3-canary.1b199ad β 0.6.3-canary.1f30d4e
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.map +1 -1
- package/dist/Avatar/Avatar.js +33 -12
- package/dist/Chat/ChatComposerInput.d.ts.map +1 -1
- package/dist/Chat/ChatComposerInput.js +1 -1
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts +2 -0
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuItem.d.ts +8 -1
- package/dist/DropdownMenu/DropdownMenuItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuItem.js +3 -1
- package/dist/DropdownMenu/DropdownMenuRadioItem.d.ts +2 -0
- package/dist/DropdownMenu/DropdownMenuRadioItem.d.ts.map +1 -1
- package/dist/DropdownMenu/MenuBottomSheetActionList.d.ts.map +1 -1
- package/dist/DropdownMenu/MenuBottomSheetActionList.js +6 -2
- package/dist/astryx.css +1 -1
- package/dist/theme/defineTheme.d.ts +3 -0
- package/dist/theme/defineTheme.d.ts.map +1 -1
- package/dist/theme/defineTheme.js +4 -1
- package/dist/theme/generateThemeRules.d.ts +2 -0
- package/dist/theme/generateThemeRules.d.ts.map +1 -1
- package/dist/theme/generateThemeRules.js +3 -1
- package/dist/theme/themeAdaptations.d.ts +5 -3
- package/dist/theme/themeAdaptations.d.ts.map +1 -1
- package/dist/theme/themeAdaptations.js +33 -5
- package/package.json +3 -3
- package/src/Avatar/Avatar.doc.mjs +1 -1
- package/src/Avatar/Avatar.test.tsx +30 -0
- package/src/Avatar/Avatar.tsx +38 -14
- package/src/Chat/ChatComposerInput.tsx +12 -1
- package/src/Collapsible/Collapsible.spec.md +9 -7
- package/src/Collapsible/Collapsible.test.tsx +0 -78
- package/src/Collapsible/CollapsibleGroup.test.tsx +0 -83
- package/src/Collapsible/__tests__/Collapsible.a11y.chromium.spec.ts +182 -0
- package/src/Collapsible/__tests__/Collapsible.a11y.states.ts +117 -0
- package/src/Collapsible/__tests__/Collapsible.a11y.test.tsx +140 -0
- package/src/DropdownMenu/DropdownMenu.test.tsx +51 -0
- package/src/DropdownMenu/DropdownMenuCheckboxItem.doc.mjs +8 -0
- package/src/DropdownMenu/DropdownMenuCheckboxItem.tsx +2 -0
- package/src/DropdownMenu/DropdownMenuItem.doc.mjs +12 -0
- package/src/DropdownMenu/DropdownMenuItem.tsx +9 -0
- package/src/DropdownMenu/DropdownMenuRadioItem.doc.mjs +8 -0
- package/src/DropdownMenu/DropdownMenuRadioItem.tsx +2 -0
- package/src/DropdownMenu/DropdownMenuSelectable.test.tsx +40 -0
- package/src/DropdownMenu/MenuBottomSheetActionList.tsx +9 -3
- package/src/NumberInput/__tests__/NumberInput.a11y.chromium.spec.ts +91 -0
- package/src/NumberInput/__tests__/NumberInput.a11y.renders.tsx +77 -0
- package/src/NumberInput/__tests__/NumberInput.a11y.states.ts +117 -0
- package/src/NumberInput/__tests__/NumberInput.a11y.test.tsx +98 -0
- package/src/theme/defineTheme.ts +4 -0
- package/src/theme/generateThemeRules.ts +3 -0
- package/src/theme/themeAdaptations.test.ts +211 -1
- package/src/theme/themeAdaptations.ts +50 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAqB3C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AA4BrD;;;;;;GAMG;AACH,KAAK,eAAe,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEzD;;GAEG;AACH,KAAK,iBAAiB,GACpB,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEzE;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,eAAe,GAAG,iBAAiB,CAAC;AAE7D;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE1D;;GAEG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CAgBpD;AASD,eAAO,MAAM,WAAW;;;;;;;;;;EAUtB,CAAC;AA6IH,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;;;;;;;;OAYG;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;
|
|
1
|
+
{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAqB3C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AA4BrD;;;;;;GAMG;AACH,KAAK,eAAe,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEzD;;GAEG;AACH,KAAK,iBAAiB,GACpB,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEzE;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,eAAe,GAAG,iBAAiB,CAAC;AAE7D;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE1D;;GAEG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CAgBpD;AASD,eAAO,MAAM,WAAW;;;;;;;;;;EAUtB,CAAC;AA6IH,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;;;;;;;;OAYG;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;AA6ID;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,MAAM,CAAC,EACrB,GAAG,EACH,aAAa,EAAE,MAAM,EACrB,WAAW,EACX,IAAI,EACJ,IAAW,EACX,KAAgB,EAChB,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,+BAyVb;yBA7We,MAAM"}
|
package/dist/Avatar/Avatar.js
CHANGED
|
@@ -230,23 +230,41 @@ const groupDynamicStyles = {
|
|
|
230
230
|
}]
|
|
231
231
|
};
|
|
232
232
|
/**
|
|
233
|
-
*
|
|
234
|
-
*
|
|
233
|
+
* A character that can stand for a word in initials: a letter, a digit, or an
|
|
234
|
+
* emoji. Punctuation and other symbols, such as `(`, `"` or `-`, cannot.
|
|
235
|
+
*/
|
|
236
|
+
const INITIAL_CHARACTER = /[\p{L}\p{N}\p{Extended_Pictographic}\p{Regional_Indicator}]/u;
|
|
237
|
+
|
|
238
|
+
/**
|
|
239
|
+
* The first character of a word that can stand for it in initials, skipping
|
|
240
|
+
* leading punctuation, or '' when the word has none (a lone `-` or `()`).
|
|
241
|
+
*/
|
|
242
|
+
function initialCharacter(word) {
|
|
243
|
+
const index = word.search(INITIAL_CHARACTER);
|
|
244
|
+
return index === -1 ? '' : firstCharacter(word.slice(index));
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
/**
|
|
248
|
+
* Generates initials from a name string: the first letter, digit or emoji of
|
|
249
|
+
* the first and last words. Words with none of those, such as a lone `-`, are
|
|
250
|
+
* skipped, and leading punctuation within a word is ignored. Returns '' when
|
|
251
|
+
* no word yields an initial.
|
|
235
252
|
* @example
|
|
236
253
|
* ```
|
|
237
|
-
* getInitials('John Doe')
|
|
238
|
-
* getInitials('Alice')
|
|
254
|
+
* getInitials('John Doe') // 'JD'
|
|
255
|
+
* getInitials('Alice') // 'A'
|
|
256
|
+
* getInitials('Northwind Workbench (automation)') // 'NA'
|
|
239
257
|
* ```
|
|
240
258
|
*/
|
|
241
259
|
function getInitials(name) {
|
|
242
|
-
const
|
|
243
|
-
if (
|
|
260
|
+
const initials = name.trim().split(/\s+/).map(initialCharacter).filter(initial => initial !== '');
|
|
261
|
+
if (initials.length === 0) {
|
|
244
262
|
return '';
|
|
245
263
|
}
|
|
246
|
-
if (
|
|
247
|
-
return
|
|
264
|
+
if (initials.length === 1) {
|
|
265
|
+
return initials[0].toUpperCase();
|
|
248
266
|
}
|
|
249
|
-
return (
|
|
267
|
+
return (initials[0] + initials[initials.length - 1]).toUpperCase();
|
|
250
268
|
}
|
|
251
269
|
|
|
252
270
|
/**
|
|
@@ -390,8 +408,11 @@ export function Avatar({
|
|
|
390
408
|
// truthy), leaving an empty plate behind a blank accessible name.
|
|
391
409
|
const meaningfulName = meaningful(name);
|
|
392
410
|
const meaningfulAlt = meaningful(alt);
|
|
393
|
-
|
|
394
|
-
|
|
411
|
+
// A name made only of punctuation ("β", "()") still names the avatar, but
|
|
412
|
+
// yields no initials; it falls back to the default icon, not an empty plate.
|
|
413
|
+
const initials = meaningfulName ? getInitials(meaningfulName) : '';
|
|
414
|
+
const showInitials = !showImage && !showFallbackImage && initials !== '';
|
|
415
|
+
const showIcon = !showImage && !showFallbackImage && initials === '';
|
|
395
416
|
|
|
396
417
|
// A meaningful accessible name comes from `alt`/`name`, composed with the
|
|
397
418
|
// status element's `label` when one is present ("Jane Doe, Online") β the
|
|
@@ -540,7 +561,7 @@ export function Avatar({
|
|
|
540
561
|
...mergeProps(themeProps('avatar-fallback', {
|
|
541
562
|
size: resolvedSize
|
|
542
563
|
}), stylex.props(styles.fallback, dynamicStyles.fontSize(numericSize))),
|
|
543
|
-
children:
|
|
564
|
+
children: initials
|
|
544
565
|
}), showIcon && /*#__PURE__*/_jsx("div", {
|
|
545
566
|
...mergeProps(themeProps('avatar-fallback', {
|
|
546
567
|
size: resolvedSize
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatComposerInput.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatComposerInput.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"ChatComposerInput.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatComposerInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -60,6 +60,8 @@ export interface DropdownMenuCheckboxItemProps extends Omit<BaseProps, 'onChange
|
|
|
60
60
|
* @default false
|
|
61
61
|
*/
|
|
62
62
|
hasCloseOnSelect?: boolean;
|
|
63
|
+
/** Ref forwarded to the row root β the element carrying `role="menuitemcheckbox"`. */
|
|
64
|
+
ref?: React.Ref<HTMLElement>;
|
|
63
65
|
/**
|
|
64
66
|
* Content to render after the label and description, such as a keyboard
|
|
65
67
|
* shortcut hint or badge.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuCheckboxItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuCheckboxItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAErE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAOtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA4C5C,MAAM,WAAW,6BAA8B,SAAQ,IAAI,CACzD,SAAS,EACT,UAAU,GAAG,MAAM,GAAG,cAAc,GAAG,UAAU,CAClD;IACC;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B;;OAEG;IACH,KAAK,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,wBAAwB,CAAC,EACvC,KAAK,EACL,WAAW,EACX,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,UAAkB,EAClB,gBAAwB,EACxB,UAAU,EACV,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,6BAA6B,+BA0D/B;yBAvEe,wBAAwB"}
|
|
1
|
+
{"version":3,"file":"DropdownMenuCheckboxItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuCheckboxItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAErE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAOtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA4C5C,MAAM,WAAW,6BAA8B,SAAQ,IAAI,CACzD,SAAS,EACT,UAAU,GAAG,MAAM,GAAG,cAAc,GAAG,UAAU,CAClD;IACC;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B;;OAEG;IACH,KAAK,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,sFAAsF;IACtF,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,wBAAwB,CAAC,EACvC,KAAK,EACL,WAAW,EACX,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,UAAkB,EAClB,gBAAwB,EACxB,UAAU,EACV,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,6BAA6B,+BA0D/B;yBAvEe,wBAAwB"}
|
|
@@ -47,6 +47,13 @@ export interface DropdownMenuItemProps extends Pick<BaseProps, 'xstyle' | 'class
|
|
|
47
47
|
* the error color for dangerous actions (e.g. Delete). @default 'default'
|
|
48
48
|
*/
|
|
49
49
|
variant?: 'default' | 'destructive';
|
|
50
|
+
/**
|
|
51
|
+
* Ref forwarded to the row root β the element carrying `role="menuitem"`.
|
|
52
|
+
* Lets a caller register the row with an element-keyed observer (an
|
|
53
|
+
* IntersectionObserver for an impression, a measurement, a debug overlay)
|
|
54
|
+
* the way `Item` and `DropdownMenuDivider` already allow.
|
|
55
|
+
*/
|
|
56
|
+
ref?: React.Ref<HTMLElement>;
|
|
50
57
|
}
|
|
51
58
|
/**
|
|
52
59
|
* An interactive dropdown menu item with icon, label, and optional description.
|
|
@@ -62,7 +69,7 @@ export interface DropdownMenuItemProps extends Pick<BaseProps, 'xstyle' | 'class
|
|
|
62
69
|
* </DropdownMenu>
|
|
63
70
|
* ```
|
|
64
71
|
*/
|
|
65
|
-
export declare function DropdownMenuItem({ icon, label, description, onClick, isDisabled, endContent, hasCloseOnSelect, variant, xstyle, className, style, }: DropdownMenuItemProps): import("react").JSX.Element;
|
|
72
|
+
export declare function DropdownMenuItem({ icon, label, description, onClick, isDisabled, endContent, hasCloseOnSelect, variant, xstyle, className, style, ref, }: DropdownMenuItemProps): import("react").JSX.Element;
|
|
66
73
|
export declare namespace DropdownMenuItem {
|
|
67
74
|
var displayName: string;
|
|
68
75
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAErE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAStD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAuD5C,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CACjD,SAAS,EACT,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC,wCAAwC;IACxC,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,0BAA0B;IAC1B,KAAK,EAAE,SAAS,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,0CAA0C;IAC1C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,mDAAmD;IACnD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gEAAgE;IAChE,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"DropdownMenuItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAErE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAStD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAuD5C,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CACjD,SAAS,EACT,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC,wCAAwC;IACxC,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,0BAA0B;IAC1B,KAAK,EAAE,SAAS,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,0CAA0C;IAC1C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,mDAAmD;IACnD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gEAAgE;IAChE,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;IACpC;;;;;OAKG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CAC9B;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,KAAK,EACL,WAAW,EACX,OAAO,EACP,UAAkB,EAClB,UAAU,EACV,gBAAuB,EACvB,OAAmB,EACnB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,GACJ,EAAE,qBAAqB,+BA2DvB;yBAxEe,gBAAgB"}
|
|
@@ -100,7 +100,8 @@ export function DropdownMenuItem({
|
|
|
100
100
|
variant = 'default',
|
|
101
101
|
xstyle,
|
|
102
102
|
className,
|
|
103
|
-
style
|
|
103
|
+
style,
|
|
104
|
+
ref
|
|
104
105
|
}) {
|
|
105
106
|
const ctx = useDropdownMenuContext();
|
|
106
107
|
const menuSize = ctx?.menuSize ?? 'md';
|
|
@@ -116,6 +117,7 @@ export function DropdownMenuItem({
|
|
|
116
117
|
const handlePointerMove = useCallback(e => focusMenuItemOnHover(e, isDisabled), [isDisabled]);
|
|
117
118
|
const isDestructive = variant === 'destructive';
|
|
118
119
|
return /*#__PURE__*/_jsx(Item, {
|
|
120
|
+
ref: ref,
|
|
119
121
|
role: "menuitem",
|
|
120
122
|
tabIndex: isDisabled ? undefined : -1,
|
|
121
123
|
onPointerMove: handlePointerMove,
|
|
@@ -50,6 +50,8 @@ export interface DropdownMenuRadioItemProps extends Omit<BaseProps, 'role' | 'ar
|
|
|
50
50
|
* metadata.
|
|
51
51
|
*/
|
|
52
52
|
endContent?: ReactNode;
|
|
53
|
+
/** Ref forwarded to the row root β the element carrying `role="menuitemradio"`. */
|
|
54
|
+
ref?: React.Ref<HTMLElement>;
|
|
53
55
|
}
|
|
54
56
|
/**
|
|
55
57
|
* A single option in a DropdownMenuRadioGroup (role="menuitemradio").
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuRadioItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuRadioItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAErE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAOtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA4C5C,MAAM,WAAW,0BAA2B,SAAQ,IAAI,CACtD,SAAS,EACT,MAAM,GAAG,cAAc,GAAG,UAAU,CACrC;IACC;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"DropdownMenuRadioItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuRadioItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAErE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAOtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA4C5C,MAAM,WAAW,0BAA2B,SAAQ,IAAI,CACtD,SAAS,EACT,MAAM,GAAG,cAAc,GAAG,UAAU,CACrC;IACC;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,mFAAmF;IACnF,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CAC9B;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,KAAK,EACL,WAAW,EACX,IAAI,EACJ,UAAkB,EAClB,UAAU,EACV,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,0BAA0B,+BAmE5B;yBA9Ee,qBAAqB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuBottomSheetActionList.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/MenuBottomSheetActionList.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAC,oBAAoB,EAAE,kBAAkB,EAAC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"MenuBottomSheetActionList.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/MenuBottomSheetActionList.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAC,oBAAoB,EAAE,kBAAkB,EAAC,MAAM,gBAAgB,CAAC;AA4B7E,wBAAgB,yBAAyB,CAAC,EACxC,KAAK,EACL,QAAQ,EACR,aAAa,GACd,EAAE;IACD,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAC5B,QAAQ,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC/C,aAAa,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;CACrD,+BAwFA;yBAhGe,yBAAyB"}
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
/**
|
|
6
6
|
* @file MenuBottomSheetActionList.tsx
|
|
7
7
|
* @input Uses menu data entries and callbacks for selection and drill-in
|
|
8
|
-
* @output Internal touch-friendly action list
|
|
8
|
+
* @output Internal touch-friendly action list with row-aligned section headings
|
|
9
9
|
* @position Shared implementation for menu bottom-sheet presentations
|
|
10
10
|
*/
|
|
11
11
|
import * as stylex from '@stylexjs/stylex';
|
|
@@ -28,6 +28,10 @@ const styles = {
|
|
|
28
28
|
divider: {
|
|
29
29
|
kqGvvJ: "xsq74q5",
|
|
30
30
|
$$css: true
|
|
31
|
+
},
|
|
32
|
+
sectionHeading: {
|
|
33
|
+
kg3NbH: "xrrkdod",
|
|
34
|
+
$$css: true
|
|
31
35
|
}
|
|
32
36
|
};
|
|
33
37
|
function getItemKey(item, index) {
|
|
@@ -84,7 +88,6 @@ export function MenuBottomSheetActionList({
|
|
|
84
88
|
}
|
|
85
89
|
if ('type' in option && option.type === 'section') {
|
|
86
90
|
return /*#__PURE__*/_jsx("li", {
|
|
87
|
-
role: "presentation",
|
|
88
91
|
...{
|
|
89
92
|
className: "x3ct3a4"
|
|
90
93
|
},
|
|
@@ -96,6 +99,7 @@ export function MenuBottomSheetActionList({
|
|
|
96
99
|
},
|
|
97
100
|
children: [option.title && /*#__PURE__*/_jsx(Heading, {
|
|
98
101
|
level: 4,
|
|
102
|
+
xstyle: styles.sectionHeading,
|
|
99
103
|
children: option.title
|
|
100
104
|
}), /*#__PURE__*/_jsx(List, {
|
|
101
105
|
density: "spacious",
|
package/dist/astryx.css
CHANGED
|
@@ -1681,10 +1681,10 @@
|
|
|
1681
1681
|
.x1ov3xa9:not(#\#):not(#\#):not(#\#):not(#\#){min-height:100dvh}
|
|
1682
1682
|
.xz65tgg:not(#\#):not(#\#):not(#\#):not(#\#){min-height:200px}
|
|
1683
1683
|
.xisnujt:not(#\#):not(#\#):not(#\#):not(#\#){min-height:20px}
|
|
1684
|
-
.xe0957l:not(#\#):not(#\#):not(#\#):not(#\#){min-height:22px}
|
|
1685
1684
|
.xjwf9q1:not(#\#):not(#\#):not(#\#):not(#\#){min-height:24px}
|
|
1686
1685
|
.xe0p6wg:not(#\#):not(#\#):not(#\#):not(#\#){min-height:28px}
|
|
1687
1686
|
.x21xpn4:not(#\#):not(#\#):not(#\#):not(#\#){min-height:32px}
|
|
1687
|
+
.xf5fbcm:not(#\#):not(#\#):not(#\#):not(#\#){min-height:calc(22px + 2 * var(--spacing-1))}
|
|
1688
1688
|
.x121v3j4:not(#\#):not(#\#):not(#\#):not(#\#){min-height:min-content}
|
|
1689
1689
|
.x1xf4nls:not(#\#):not(#\#):not(#\#):not(#\#){min-height:var(--size-element-lg)}
|
|
1690
1690
|
.x1uogy3y:not(#\#):not(#\#):not(#\#):not(#\#){min-height:var(--size-element-md)}
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* defineTheme β Create an Astryx theme from a flat token map.
|
|
3
3
|
*
|
|
4
|
+
* Adaptations resolve against the effective root axes and components, retaining
|
|
5
|
+
* authored component pins without repeating root typography defaults.
|
|
6
|
+
*
|
|
4
7
|
* Two distribution modes:
|
|
5
8
|
* - Unbuilt: Theme generates CSS and injects a <style> tag at runtime
|
|
6
9
|
* - Built: `astryx theme build` pre-compiles to a CSS file; Theme just
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"defineTheme.d.ts","sourceRoot":"","sources":["../../src/theme/defineTheme.ts"],"names":[],"mappings":"AAEA
|
|
1
|
+
{"version":3,"file":"defineTheme.d.ts","sourceRoot":"","sources":["../../src/theme/defineTheme.ts"],"names":[],"mappings":"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"}
|
|
@@ -3,6 +3,9 @@
|
|
|
3
3
|
/**
|
|
4
4
|
* defineTheme β Create an Astryx theme from a flat token map.
|
|
5
5
|
*
|
|
6
|
+
* Adaptations resolve against the effective root axes and components, retaining
|
|
7
|
+
* authored component pins without repeating root typography defaults.
|
|
8
|
+
*
|
|
6
9
|
* Two distribution modes:
|
|
7
10
|
* - Unbuilt: Theme generates CSS and injects a <style> tag at runtime
|
|
8
11
|
* - Built: `astryx theme build` pre-compiles to a CSS file; Theme just
|
|
@@ -233,7 +236,7 @@ export function defineTheme(input) {
|
|
|
233
236
|
// the root scale while preserving the base rule's authored intent.
|
|
234
237
|
const __axes = resolveThemeGenerativeAxes(base?.__axes, ownAxes);
|
|
235
238
|
const __adaptations = normalizeThemeAdaptations(input.name, base?.__adaptations, input.adaptations);
|
|
236
|
-
const __adaptationRules = resolveThemeAdaptationRules(input.name, __adaptations, __axes, tokens, localTokenContract?.localTokens);
|
|
239
|
+
const __adaptationRules = resolveThemeAdaptationRules(input.name, __adaptations, __axes, tokens, localTokenContract?.localTokens, components);
|
|
237
240
|
|
|
238
241
|
// Icons β input icons override base icons
|
|
239
242
|
const icons = input.icons && base?.icons ? {
|
|
@@ -4,6 +4,8 @@
|
|
|
4
4
|
* Shared logic for generating CSS rules from a resolved theme definition,
|
|
5
5
|
* including one component-leaf lowering path for root, adaptation, and
|
|
6
6
|
* media-surface values plus condition-correct Heading weight precedence guards.
|
|
7
|
+
* Built adaptation metadata resolves against the same root component defaults
|
|
8
|
+
* as defineTheme, so scale-only rules do not reset authored component styles.
|
|
7
9
|
* Used by both the runtime path (Theme injects <style>) and the build
|
|
8
10
|
* path (`astryx theme build` pre-compiles to CSS files).
|
|
9
11
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"generateThemeRules.d.ts","sourceRoot":"","sources":["../../src/theme/generateThemeRules.ts"],"names":[],"mappings":"AAEA
|
|
1
|
+
{"version":3,"file":"generateThemeRules.d.ts","sourceRoot":"","sources":["../../src/theme/generateThemeRules.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,OAAO,KAAK,EAAC,iBAAiB,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AAqHnE;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B,+EAA+E;IAC/E,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,kFAAkF;IAClF,KAAK,EAAE,MAAM,EAAE,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,SAAS,EAAE,MAAM,CAAC;CACnB;AAmUD;;;;;GAKG;AACH;;;;;;;GAOG;AACH,MAAM,WAAW,eAAe;IAC9B,sCAAsC;IACtC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC/B,yCAAyC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACrC,0CAA0C;IAC1C,UAAU,CAAC,EAAE,iBAAiB,CAAC;CAChC;AAED,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,eAAe,EACtB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,MAAM,EAAE,CAiDV;AAoZD;;;;;;;;;GASG;AACH,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,eAAe,CAejB;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,MAAM,CAmDR;AA+CD;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,cAAc,CAqFhB;AAOD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,4BAA4B,IAAI,MAAM,CAKrD;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,cAAc,CAoChB"}
|
|
@@ -6,6 +6,8 @@
|
|
|
6
6
|
* Shared logic for generating CSS rules from a resolved theme definition,
|
|
7
7
|
* including one component-leaf lowering path for root, adaptation, and
|
|
8
8
|
* media-surface values plus condition-correct Heading weight precedence guards.
|
|
9
|
+
* Built adaptation metadata resolves against the same root component defaults
|
|
10
|
+
* as defineTheme, so scale-only rules do not reset authored component styles.
|
|
9
11
|
* Used by both the runtime path (Theme injects <style>) and the build
|
|
10
12
|
* path (`astryx theme build` pre-compiles to CSS files).
|
|
11
13
|
*
|
|
@@ -841,7 +843,7 @@ export function generateAdaptationCSS(theme, warnings) {
|
|
|
841
843
|
// Validate retained metadata even when it has no rules (and therefore emits
|
|
842
844
|
// no CSS): width points remain observable through AppShell and inheritance.
|
|
843
845
|
const normalizedAdaptations = theme.__adaptations === undefined ? undefined : normalizeThemeAdaptations(theme.name, theme.__adaptations, undefined);
|
|
844
|
-
const rules = theme.__adaptationRules ?? (normalizedAdaptations ? resolveThemeAdaptationRules(theme.name, normalizedAdaptations, theme.__axes ?? {}, theme.tokens, theme.localTokens) : undefined);
|
|
846
|
+
const rules = theme.__adaptationRules ?? (normalizedAdaptations ? resolveThemeAdaptationRules(theme.name, normalizedAdaptations, theme.__axes ?? {}, theme.tokens, theme.localTokens, theme.components) : undefined);
|
|
845
847
|
if (!rules || rules.length === 0) {
|
|
846
848
|
return {
|
|
847
849
|
prose: '',
|
|
@@ -7,8 +7,10 @@
|
|
|
7
7
|
* Adaptations are deliberately closed and ordered. Width points are fixed names,
|
|
8
8
|
* sparse rules and reserved token routing are rejected during normalization,
|
|
9
9
|
* condition fields are ANDed, and rule order is the precedence model: every
|
|
10
|
-
* matching rule writes after the root theme and later matching writes win.
|
|
11
|
-
*
|
|
10
|
+
* matching rule writes after the root theme and later matching writes win.
|
|
11
|
+
* Invariant type-scale component defaults already declared at root are omitted;
|
|
12
|
+
* authored rule leaves and generated token writes retain their cascade order.
|
|
13
|
+
* Token cycles are judged after each reachable ordered cascade is complete.
|
|
12
14
|
*
|
|
13
15
|
* SYNC: When modified, update:
|
|
14
16
|
* - /packages/core/src/theme/defineTheme.ts (`DefineThemeInput.adaptations`)
|
|
@@ -123,5 +125,5 @@ export declare function normalizeThemeAdaptations(themeName: string, inherited:
|
|
|
123
125
|
*/
|
|
124
126
|
export declare function resolveThemeGenerativeAxes(inherited: ThemeGenerativeAxes | undefined, own: ThemeGenerativeAxes): ThemeGenerativeAxes;
|
|
125
127
|
/** Lower ordered normalized rules to concrete CSS writes. */
|
|
126
|
-
export declare function resolveThemeAdaptationRules(themeName: string, adaptations: NormalizedThemeAdaptations, axes: ThemeGenerativeAxes, rootTokens: Record<string, string>, rootLocalTokens: Record<string, string> | undefined): ResolvedThemeAdaptationRule[] | undefined;
|
|
128
|
+
export declare function resolveThemeAdaptationRules(themeName: string, adaptations: NormalizedThemeAdaptations, axes: ThemeGenerativeAxes, rootTokens: Record<string, string>, rootLocalTokens: Record<string, string> | undefined, rootComponents?: ComponentStyleMap): ResolvedThemeAdaptationRule[] | undefined;
|
|
127
129
|
//# sourceMappingURL=themeAdaptations.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"themeAdaptations.d.ts","sourceRoot":"","sources":["../../src/theme/themeAdaptations.ts"],"names":[],"mappings":"AAEA
|
|
1
|
+
{"version":3,"file":"themeAdaptations.d.ts","sourceRoot":"","sources":["../../src/theme/themeAdaptations.ts"],"names":[],"mappings":"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"}
|
|
@@ -9,8 +9,10 @@
|
|
|
9
9
|
* Adaptations are deliberately closed and ordered. Width points are fixed names,
|
|
10
10
|
* sparse rules and reserved token routing are rejected during normalization,
|
|
11
11
|
* condition fields are ANDed, and rule order is the precedence model: every
|
|
12
|
-
* matching rule writes after the root theme and later matching writes win.
|
|
13
|
-
*
|
|
12
|
+
* matching rule writes after the root theme and later matching writes win.
|
|
13
|
+
* Invariant type-scale component defaults already declared at root are omitted;
|
|
14
|
+
* authored rule leaves and generated token writes retain their cascade order.
|
|
15
|
+
* Token cycles are judged after each reachable ordered cascade is complete.
|
|
14
16
|
*
|
|
15
17
|
* SYNC: When modified, update:
|
|
16
18
|
* - /packages/core/src/theme/defineTheme.ts (`DefineThemeInput.adaptations`)
|
|
@@ -572,13 +574,39 @@ export function resolveThemeGenerativeAxes(inherited, own) {
|
|
|
572
574
|
};
|
|
573
575
|
}
|
|
574
576
|
|
|
577
|
+
/**
|
|
578
|
+
* Type-scale component generation is invariant var() wiring, not scale values.
|
|
579
|
+
* Keep root declarations (including authored pins) in the root cascade instead
|
|
580
|
+
* of resetting them in a rule that only changes tokens. Fill missing root paths
|
|
581
|
+
* for rule-only scales, and retain every authored rule leaf, even when it equals
|
|
582
|
+
* the root: that write may intentionally undo an earlier matching rule.
|
|
583
|
+
*
|
|
584
|
+
* SYNC: expandTypeScale.ts (generateTypeScaleComponents)
|
|
585
|
+
*/
|
|
586
|
+
function omitRootTypeScaleDefaults(resolved, root, authored) {
|
|
587
|
+
if (!resolved || !root) {
|
|
588
|
+
return resolved;
|
|
589
|
+
}
|
|
590
|
+
const components = {};
|
|
591
|
+
for (const [component, rules] of Object.entries(resolved)) {
|
|
592
|
+
for (const [key, styles] of Object.entries(rules)) {
|
|
593
|
+
const writes = Object.fromEntries(Object.entries(styles).filter(([property]) => root[component]?.[key]?.[property] === undefined || Object.hasOwn(authored?.[component]?.[key] ?? {}, property)));
|
|
594
|
+
if (Object.keys(writes).length > 0) {
|
|
595
|
+
(components[component] ??= {})[key] = writes;
|
|
596
|
+
}
|
|
597
|
+
}
|
|
598
|
+
}
|
|
599
|
+
return Object.keys(components).length > 0 ? components : undefined;
|
|
600
|
+
}
|
|
601
|
+
|
|
575
602
|
/** Lower ordered normalized rules to concrete CSS writes. */
|
|
576
|
-
export function resolveThemeAdaptationRules(themeName, adaptations, axes, rootTokens, rootLocalTokens) {
|
|
603
|
+
export function resolveThemeAdaptationRules(themeName, adaptations, axes, rootTokens, rootLocalTokens, rootComponents) {
|
|
577
604
|
if (adaptations.rules.length === 0) {
|
|
578
605
|
return undefined;
|
|
579
606
|
}
|
|
580
607
|
const resolvedRules = adaptations.rules.map((rule, index) => {
|
|
581
|
-
const
|
|
608
|
+
const input = valueToThemeInput(themeName, index, rule.value, axes);
|
|
609
|
+
const resolved = resolveThemeValues(input, undefined,
|
|
582
610
|
// Authored adaptation values are a new surface with no legacy
|
|
583
611
|
// acceptance to preserve, so a malformed token is rejected here rather
|
|
584
612
|
// than emitted. The root path stays lenient for compatibility.
|
|
@@ -603,7 +631,7 @@ export function resolveThemeAdaptationRules(themeName, adaptations, axes, rootTo
|
|
|
603
631
|
query: mediaQueryForCondition(themeName, index, rule.when, adaptations.widthBreakpoints),
|
|
604
632
|
tokens: resolved.tokens,
|
|
605
633
|
localTokens,
|
|
606
|
-
components: resolved.components
|
|
634
|
+
components: input.typography?.scale ? omitRootTypeScaleDefaults(resolved.components, rootComponents, rule.value.components) : resolved.components
|
|
607
635
|
};
|
|
608
636
|
});
|
|
609
637
|
assertNoReachableTokenCycles(themeName, adaptations.widthBreakpoints, rootTokens, rootLocalTokens, resolvedRules);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@astryxdesign/core",
|
|
3
|
-
"version": "0.6.3-canary.
|
|
3
|
+
"version": "0.6.3-canary.1f30d4e",
|
|
4
4
|
"displayName": "Astryx Core",
|
|
5
5
|
"description": "The component library. Accessible, themeable React components with built-in spacing, dark mode, and StyleX styling.",
|
|
6
6
|
"author": "Meta Open Source",
|
|
@@ -692,8 +692,8 @@
|
|
|
692
692
|
"react-dom": ">=19.0.0"
|
|
693
693
|
},
|
|
694
694
|
"devDependencies": {
|
|
695
|
-
"@astryxdesign/a11y-spec": "0.6.3-canary.
|
|
696
|
-
"@astryxdesign/cli": "0.6.3-canary.
|
|
695
|
+
"@astryxdesign/a11y-spec": "0.6.3-canary.1f30d4e",
|
|
696
|
+
"@astryxdesign/cli": "0.6.3-canary.1f30d4e",
|
|
697
697
|
"@babel/cli": "^7.29.7",
|
|
698
698
|
"@babel/core": "^7.29.7",
|
|
699
699
|
"@babel/preset-react": "^7.29.7",
|
|
@@ -23,7 +23,7 @@ export const docs = {
|
|
|
23
23
|
],
|
|
24
24
|
anatomy: [
|
|
25
25
|
{name: 'Photo', required: false, description: 'The profile image, loaded from the src URL. Shown when available.'},
|
|
26
|
-
{name: 'Initials', required: false, description: '
|
|
26
|
+
{name: 'Initials', required: false, description: 'The first letter, digit or emoji of the first and last words of the name; punctuation is skipped. Shown when no photo is available. A name with no letters, digits or emoji shows the default icon instead.'},
|
|
27
27
|
{name: 'Default icon', required: false, description: 'A generic person silhouette. Shown when there is no photo or name.'},
|
|
28
28
|
{name: 'Status dot', required: false, description: 'A small indicator in the bottom-right corner showing availability (online, away, busy). Each variant pairs colour with a distinct shape so status does not rely on colour alone.'},
|
|
29
29
|
],
|
|
@@ -103,6 +103,36 @@ describe('Avatar', () => {
|
|
|
103
103
|
expect(screen.getByTestId('avatar')).toHaveTextContent('π¨βπ©βπ§βπ¦A');
|
|
104
104
|
});
|
|
105
105
|
|
|
106
|
+
describe('initials come from letters, digits and emoji, not punctuation', () => {
|
|
107
|
+
it.each([
|
|
108
|
+
['Northwind Workbench (automation)', 'NA'],
|
|
109
|
+
['Ada "The Countess" Lovelace', 'AL'],
|
|
110
|
+
['βAdaβ Lovelace', 'AL'],
|
|
111
|
+
['Ada - Lovelace', 'AL'],
|
|
112
|
+
['Ada Lovelace β', 'AL'],
|
|
113
|
+
['Mary-Jane Watson', 'MW'],
|
|
114
|
+
['(Ada)', 'A'],
|
|
115
|
+
['Alice', 'A'],
|
|
116
|
+
['R2 D2', 'RD'],
|
|
117
|
+
['3M', '3'],
|
|
118
|
+
['Γ©mile zola', 'ΓZ'],
|
|
119
|
+
['π Ada', 'πA'],
|
|
120
|
+
['Ada (π)', 'Aπ'],
|
|
121
|
+
])('%s renders %s', (name, expected) => {
|
|
122
|
+
render(<Avatar name={name} data-testid="avatar" />);
|
|
123
|
+
expect(screen.getByTestId('avatar').textContent).toBe(expected);
|
|
124
|
+
});
|
|
125
|
+
|
|
126
|
+
it('falls through to the default icon when no word yields an initial', () => {
|
|
127
|
+
render(<Avatar name="- ()" data-testid="a" />);
|
|
128
|
+
const el = screen.getByTestId('a');
|
|
129
|
+
expect(el.querySelector('svg')).not.toBeNull();
|
|
130
|
+
expect(el).toHaveTextContent('');
|
|
131
|
+
// The name still names the avatar.
|
|
132
|
+
expect(screen.getByRole('img', {name: '- ()'})).toBeInTheDocument();
|
|
133
|
+
});
|
|
134
|
+
});
|
|
135
|
+
|
|
106
136
|
it('retries a new src after a previous src failed to load', () => {
|
|
107
137
|
const {rerender} = render(
|
|
108
138
|
<Avatar name="Ada" src="https://example.com/broken.jpg" />,
|
package/src/Avatar/Avatar.tsx
CHANGED
|
@@ -384,25 +384,46 @@ export interface AvatarProps extends BaseProps<HTMLDivElement> {
|
|
|
384
384
|
}
|
|
385
385
|
|
|
386
386
|
/**
|
|
387
|
-
*
|
|
388
|
-
*
|
|
387
|
+
* A character that can stand for a word in initials: a letter, a digit, or an
|
|
388
|
+
* emoji. Punctuation and other symbols, such as `(`, `"` or `-`, cannot.
|
|
389
|
+
*/
|
|
390
|
+
const INITIAL_CHARACTER =
|
|
391
|
+
/[\p{L}\p{N}\p{Extended_Pictographic}\p{Regional_Indicator}]/u;
|
|
392
|
+
|
|
393
|
+
/**
|
|
394
|
+
* The first character of a word that can stand for it in initials, skipping
|
|
395
|
+
* leading punctuation, or '' when the word has none (a lone `-` or `()`).
|
|
396
|
+
*/
|
|
397
|
+
function initialCharacter(word: string): string {
|
|
398
|
+
const index = word.search(INITIAL_CHARACTER);
|
|
399
|
+
return index === -1 ? '' : firstCharacter(word.slice(index));
|
|
400
|
+
}
|
|
401
|
+
|
|
402
|
+
/**
|
|
403
|
+
* Generates initials from a name string: the first letter, digit or emoji of
|
|
404
|
+
* the first and last words. Words with none of those, such as a lone `-`, are
|
|
405
|
+
* skipped, and leading punctuation within a word is ignored. Returns '' when
|
|
406
|
+
* no word yields an initial.
|
|
389
407
|
* @example
|
|
390
408
|
* ```
|
|
391
|
-
* getInitials('John Doe')
|
|
392
|
-
* getInitials('Alice')
|
|
409
|
+
* getInitials('John Doe') // 'JD'
|
|
410
|
+
* getInitials('Alice') // 'A'
|
|
411
|
+
* getInitials('Northwind Workbench (automation)') // 'NA'
|
|
393
412
|
* ```
|
|
394
413
|
*/
|
|
395
414
|
function getInitials(name: string): string {
|
|
396
|
-
const
|
|
397
|
-
|
|
415
|
+
const initials = name
|
|
416
|
+
.trim()
|
|
417
|
+
.split(/\s+/)
|
|
418
|
+
.map(initialCharacter)
|
|
419
|
+
.filter(initial => initial !== '');
|
|
420
|
+
if (initials.length === 0) {
|
|
398
421
|
return '';
|
|
399
422
|
}
|
|
400
|
-
if (
|
|
401
|
-
return
|
|
423
|
+
if (initials.length === 1) {
|
|
424
|
+
return initials[0].toUpperCase();
|
|
402
425
|
}
|
|
403
|
-
return (
|
|
404
|
-
firstCharacter(words[0]) + firstCharacter(words[words.length - 1])
|
|
405
|
-
).toUpperCase();
|
|
426
|
+
return (initials[0] + initials[initials.length - 1]).toUpperCase();
|
|
406
427
|
}
|
|
407
428
|
|
|
408
429
|
/**
|
|
@@ -554,8 +575,11 @@ export function Avatar({
|
|
|
554
575
|
// truthy), leaving an empty plate behind a blank accessible name.
|
|
555
576
|
const meaningfulName = meaningful(name);
|
|
556
577
|
const meaningfulAlt = meaningful(alt);
|
|
557
|
-
|
|
558
|
-
|
|
578
|
+
// A name made only of punctuation ("β", "()") still names the avatar, but
|
|
579
|
+
// yields no initials; it falls back to the default icon, not an empty plate.
|
|
580
|
+
const initials = meaningfulName ? getInitials(meaningfulName) : '';
|
|
581
|
+
const showInitials = !showImage && !showFallbackImage && initials !== '';
|
|
582
|
+
const showIcon = !showImage && !showFallbackImage && initials === '';
|
|
559
583
|
|
|
560
584
|
// A meaningful accessible name comes from `alt`/`name`, composed with the
|
|
561
585
|
// status element's `label` when one is present ("Jane Doe, Online") β the
|
|
@@ -753,7 +777,7 @@ export function Avatar({
|
|
|
753
777
|
dynamicStyles.fontSize(numericSize),
|
|
754
778
|
),
|
|
755
779
|
)}>
|
|
756
|
-
{
|
|
780
|
+
{initials}
|
|
757
781
|
</div>
|
|
758
782
|
)}
|
|
759
783
|
{showIcon && (
|
|
@@ -238,7 +238,18 @@ const styles = stylex.create({
|
|
|
238
238
|
position: 'relative',
|
|
239
239
|
display: 'flex',
|
|
240
240
|
flexDirection: 'column',
|
|
241
|
-
|
|
241
|
+
// The single-line floor, not just the line-height: `editable` and
|
|
242
|
+
// `placeholder` both add `spacingVars['--spacing-1']` padding on the
|
|
243
|
+
// block axis on top of their shared line-height, and normally that's
|
|
244
|
+
// what keeps the root this tall (the editable region reserves its own
|
|
245
|
+
// padded box even when empty). A disabled, empty editable stops
|
|
246
|
+
// reserving that empty line at all in Chromium (contentEditable=false
|
|
247
|
+
// collapses to just its padding), and the absolutely positioned
|
|
248
|
+
// placeholder that would otherwise stand in for it doesn't contribute
|
|
249
|
+
// to layout height β so without this explicit floor accounting for the
|
|
250
|
+
// same padding, the root shrinks by that padding's height the moment
|
|
251
|
+
// isDisabled flips true, moving anything bottom-aligned beside it.
|
|
252
|
+
minHeight: `calc(${LINE_HEIGHT_PX}px + 2 * ${spacingVars['--spacing-1']})`,
|
|
242
253
|
},
|
|
243
254
|
editable: {
|
|
244
255
|
outline: 'none',
|