@astryxdesign/core 0.1.8-canary.2b00618 → 0.1.8-canary.3290b8a

package/dist/Avatar/AvatarStatusDot.d.ts

@@ -24,6 +24,13 @@ import type { BaseProps } from '../BaseProps';
  *   }
  * }
  * ```
+ *
+ * Custom variants render no background fill, no ink colour, and no built-in
+ * shape glyph — the theme must supply the fill and, if it passes an `icon`,
+ * a `color` for it to paint with. It should also supply a non-colour mark
+ * so the status is not distinguishable by colour alone (a WCAG 1.4.1
+ * failure): pass `icon`, or theme a glyph onto the dot via
+ * `.astryx-avatar-status-dot[data-variant="..."]` (e.g. a `::before` mark).
  */
 export interface AvatarStatusDotVariantMap {
     success: true;
@@ -37,12 +44,14 @@ export type AvatarStatusDotVariant = keyof AvatarStatusDotVariantMap;
 export interface AvatarStatusDotProps extends BaseProps<HTMLDivElement> {
     ref?: React.Ref<HTMLDivElement>;
     /**
-     * The semantic color variant of the dot.
-     * - `success` — green dot (e.g. online, accepted)
-     * - `neutral` — gray dot (e.g. offline, pending)
-     * - `error` — red dot (e.g. busy, rejected)
+     * The semantic variant of the dot. Each variant pairs a colour with a
+     * distinct built-in shape so status is never conveyed by colour alone
+     * (WCAG 2.1 SC 1.4.1):
+     * - `success` — filled green dot (e.g. online, accepted)
+     * - `neutral` — grey ring (e.g. away, offline, pending)
+     * - `error` — red dot with a minus bar (e.g. busy, do not disturb)
      *
-     * Matches the `variant` convention from `StatusDot`.
+     * Matches the `variant` naming convention from `StatusDot`.
      * @default 'success'
      */
     variant?: AvatarStatusDotVariant;
@@ -50,6 +59,11 @@ export interface AvatarStatusDotProps extends BaseProps<HTMLDivElement> {
      * Accessible label for the status dot.
      * Describes the meaning of the indicator for screen readers
      * (e.g. "Online", "Accepted", "John Doe is busy").
+     *
+     * Note: inside an Avatar the label is currently not announced — the
+     * Avatar root is `role="img"`, which prunes descendant semantics.
+     * Pass it anyway; composing status into the avatar's accessible name
+     * is a planned Avatar-level fix.
      */
     label?: string;
     /**
@@ -58,6 +72,14 @@ export interface AvatarStatusDotProps extends BaseProps<HTMLDivElement> {
      * The icon is automatically sized to fit the dot and hidden
      * at the smallest avatar sizes where there isn't enough room.
      *
+     * A rendered icon replaces the variant's built-in shape glyph, so use a
+     * different icon per status — the same icon on every variant leaves the
+     * statuses distinguishable by colour alone (WCAG 1.4.1). At the smallest
+     * avatar sizes the built-in glyph still shows instead of the icon.
+     * Booleans and empty strings are ignored (safe for `cond && <Icon />`),
+     * but a component that renders nothing still counts as an icon and
+     * suppresses the glyph.
+     *
      * @example
      * ```
      * <AvatarStatusDot variant="success" label="Verified" icon={<CheckIcon />} />
@@ -69,6 +91,12 @@ export interface AvatarStatusDotProps extends BaseProps<HTMLDivElement> {
  * A status indicator dot that automatically scales to match the parent
  * Avatar's size.
  *
+ * Each variant pairs a colour with a distinct built-in shape (filled dot,
+ * ring, minus bar) so status stays distinguishable without colour
+ * perception (WCAG 2.1 SC 1.4.1). Themes can target the shape glyph via
+ * the `astryx-avatar-status-dot-glyph` class and its `data-shape`
+ * attribute.
+ *
  * Must be used inside an Avatar's `status` prop so it can read
  * the avatar size from context.
  *

package/dist/Avatar/AvatarStatusDot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarStatusDot.d.ts","sourceRoot":"","sources":["../../src/Avatar/AvatarStatusDot.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAE,EAAM,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AACjD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAqC5C;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,IAAI,CAAC;IACd,OAAO,EAAE,IAAI,CAAC;IACd,KAAK,EAAE,IAAI,CAAC;CACb;AAED;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG,MAAM,yBAAyB,CAAC;AAErE,MAAM,WAAW,oBAAqB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACrE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;;OAUG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAkDD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,eAAe,CAAC,EAC9B,GAAG,EACH,OAAmB,EACnB,KAAK,EACL,IAAI,EACJ,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,oBAAoB,qBA6BtB;yBAtCe,eAAe"}
+{"version":3,"file":"AvatarStatusDot.d.ts","sourceRoot":"","sources":["../../src/Avatar/AvatarStatusDot.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAE,EAAM,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AACjD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAiD5C;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,IAAI,CAAC;IACd,OAAO,EAAE,IAAI,CAAC;IACd,KAAK,EAAE,IAAI,CAAC;CACb;AAED;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG,MAAM,yBAAyB,CAAC;AAErE,MAAM,WAAW,oBAAqB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACrE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;;;;;;OAUG;IACH,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;;;;;;;;;;OAkBG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AA2JD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,eAAe,CAAC,EAC9B,GAAG,EACH,OAAmB,EACnB,KAAK,EACL,IAAI,EACJ,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,oBAAoB,qBAyCtB;yBAlDe,eAAe"}

package/dist/Avatar/AvatarStatusDot.js

@@ -19,45 +19,57 @@ import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
 import { colorVars, radiusVars } from "../theme/tokens.stylex.js";
 import { AvatarSizeContext } from "./AvatarSizeContext.js";
-import { mergeProps } from "../utils/index.js";
+import { isRenderable, mergeProps } from "../utils/index.js";
 import { themeProps } from "../utils/themeProps.js";
 
 /**
- * Resolves the status dot size, border width, and icon size based on the
- * avatar size.
+ * Discrete size tier of the status dot, derived from the avatar size.
+ * Keys the built-in shape glyph's stroke weight — see `GLYPH_STROKE_WIDTH`.
+ */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Resolves the status dot size, border width, icon size, and size tier
+ * based on the avatar size.
  *
  * Uses discrete size tiers rather than a continuous ratio so the dot
  * looks intentional at every avatar size:
  *
- *   | Avatar size  | Dot  | Border | Icon |
- *   |--------------|------|--------|------|
- *   | ≤ 36px       | 10px | 1px    | —    |
- *   | 40–72px      | 20px | 2px    | 12px |
- *   | ≥ 96px       | 32px | 4px    | 18px |
+ *   | Avatar size  | Tier   | Dot  | Border | Icon | Field | Glyph stroke |
+ *   |--------------|--------|------|--------|------|-------|--------------|
+ *   | ≤ 36px       | small  | 10px | 1px    | —    | 8px   | 1px          |
+ *   | 40–72px      | medium | 20px | 2px    | 12px | 16px  | 1.5px        |
+ *   | ≥ 96px       | large  | 32px | 4px    | 18px | 24px  | 2px          |
+ *
+ * "Field" is the dot's inner field — the dot minus both borders — that the
+ * shape glyph is drawn into; see `GLYPH_STROKE_WIDTH` for the stroke ladder.
  *
  * Icons are not rendered at the smallest tier — there isn't enough
- * room for them to be legible.
+ * room for them to be legible. The built-in shape glyphs (see
+ * `glyphShapeMap`) do render there, so status stays distinguishable
+ * without colour at every size.
  */
-import { jsx as _jsx } from "react/jsx-runtime";
 function resolveStatusDotSize(avatarSize) {
   if (avatarSize <= 36) {
     return {
       dotSize: 10,
       borderWidth: 1,
-      iconSize: 0
+      iconSize: 0,
+      tier: 'small'
     };
   }
   if (avatarSize <= 72) {
     return {
       dotSize: 20,
       borderWidth: 2,
-      iconSize: 12
+      iconSize: 12,
+      tier: 'medium'
     };
   }
   return {
     dotSize: 32,
     borderWidth: 4,
-    iconSize: 18
+    iconSize: 18,
+    tier: 'large'
   };
 }
 
@@ -73,6 +85,13 @@ function resolveStatusDotSize(avatarSize) {
  *   }
  * }
  * ```
+ *
+ * Custom variants render no background fill, no ink colour, and no built-in
+ * shape glyph — the theme must supply the fill and, if it passes an `icon`,
+ * a `color` for it to paint with. It should also supply a non-colour mark
+ * so the status is not distinguishable by colour alone (a WCAG 1.4.1
+ * failure): pass `icon`, or theme a glyph onto the dot via
+ * `.astryx-avatar-status-dot[data-variant="..."]` (e.g. a `::before` mark).
  */
 
 /**
@@ -92,21 +111,23 @@ const styles = {
   },
   success: {
     kWkggS: "xdsz4j9",
+    kMwMTN: "xrkvqaz",
     $$css: true
   },
   neutral: {
-    kWkggS: "xdomwnj",
+    kWkggS: "x10xzikg",
+    kMwMTN: "xv1l7n4",
     $$css: true
   },
   error: {
     kWkggS: "x1pjz0fi",
+    kMwMTN: "xrkvqaz",
     $$css: true
   },
   icon: {
     k1xSpc: "x78zum5",
     kGNEyG: "x6s0dn4",
     kjj79g: "xl56j7k",
-    kMwMTN: "xrkvqaz",
     kLWn49: "x14ju556",
     $$css: true
   }
@@ -137,10 +158,105 @@ const variantStyleMap = {
   error: styles.error
 };
 
+/**
+ * Built-in shape glyph per variant, so each status differs by shape and not
+ * only by colour (WCAG 2.1 SC 1.4.1). The glyph is a stroked inline SVG
+ * painted in `currentColor`:
+ * - `ring` — a stroked circle on a surface plate; the dot reads as hollow
+ *   (away/offline).
+ * - `minus` — a round-capped bar across the filled dot; the dot reads as
+ *   "do not disturb" (busy).
+ *
+ * `success` stays the plain filled dot — filled, hollow, and barred are the
+ * three distinct fill topologies. Custom augmented variants have no entry
+ * and render no glyph; see the `AvatarStatusDotVariantMap` docs.
+ */
+
+const glyphShapeMap = {
+  neutral: 'ring',
+  error: 'minus'
+};
+
+/**
+ * Glyph stroke weight per tier, in px of the dot's inner field.
+ *
+ * Roughly `field / 12`, floored at 1px so the smallest tier stays visible.
+ * That lands on the 1 / 1.5 / 2 ladder the rest of the system draws with —
+ * `Icon`'s default set strokes at 1.5 in a 24 viewBox, as does the
+ * `CheckboxInput` checkmark — rather than the 25% band a CSS box cutout
+ * produced, which was several times heavier than any other glyph we ship.
+ */
+const GLYPH_STROKE_WIDTH = {
+  small: 1,
+  medium: 1.5,
+  large: 2
+};
+
+/** Fraction of the inner field the minus bar spans, cap to cap. */
+const MINUS_BAR_SPAN = 0.75;
+
+/**
+ * The built-in shape glyph, drawn as a stroked inline SVG in `currentColor`.
+ *
+ * Stroking (rather than a CSS box) is what buys sub-pixel control and round
+ * line caps, so the mark stays intentional at every tier — including the
+ * 10px dot, where a box cutout can only land on whole pixels.
+ *
+ * `viewBox` is one user unit per px of the inner field, so every value here
+ * is literal px.
+ */
+function StatusDotGlyph({
+  shape,
+  field,
+  stroke
+}) {
+  const center = field / 2;
+  return /*#__PURE__*/_jsx("svg", {
+    "aria-hidden": "true",
+    viewBox: `0 0 ${field} ${field}`,
+    width: field,
+    height: field,
+    fill: "none",
+    ...themeProps('avatar-status-dot-glyph', {
+      shape
+    }),
+    children: shape === 'ring' ?
+    /*#__PURE__*/
+    // Radius is to the stroke centreline, so the ring's outer edge lands
+    // exactly on the inner field and never clips against the border.
+    _jsx("circle", {
+      cx: center,
+      cy: center,
+      r: (field - stroke) / 2,
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: stroke
+    }) :
+    /*#__PURE__*/
+    // Ends inset by half the stroke so the round caps land inside the
+    // span rather than overhanging it.
+    _jsx("line", {
+      x1: field * (1 - MINUS_BAR_SPAN) / 2 + stroke / 2,
+      y1: center,
+      x2: field * (1 + MINUS_BAR_SPAN) / 2 - stroke / 2,
+      y2: center,
+      stroke: "currentColor",
+      strokeWidth: stroke,
+      strokeLinecap: "round"
+    })
+  });
+}
+
 /**
  * A status indicator dot that automatically scales to match the parent
  * Avatar's size.
  *
+ * Each variant pairs a colour with a distinct built-in shape (filled dot,
+ * ring, minus bar) so status stays distinguishable without colour
+ * perception (WCAG 2.1 SC 1.4.1). Themes can target the shape glyph via
+ * the `astryx-avatar-status-dot-glyph` class and its `data-shape`
+ * attribute.
+ *
  * Must be used inside an Avatar's `status` prop so it can read
  * the avatar size from context.
  *
@@ -172,9 +288,14 @@ export function AvatarStatusDot({
   const {
     dotSize,
     borderWidth,
-    iconSize
+    iconSize,
+    tier
   } = resolveStatusDotSize(avatarSize);
-  return /*#__PURE__*/_jsx("div", {
+  const showsIcon = isRenderable(icon) && iconSize > 0;
+  // A rendered icon is itself a non-colour mark; overlaying both cutouts in
+  // the dot's small inner field would make each illegible.
+  const glyphShape = showsIcon ? undefined : glyphShapeMap[variant];
+  return /*#__PURE__*/_jsxs("div", {
     ...props,
     ref: ref,
     ...(label ? {
@@ -184,11 +305,15 @@ export function AvatarStatusDot({
     ...mergeProps(themeProps('avatar-status-dot', {
       variant
     }), stylex.props(styles.dot, variantStyleMap[variant], dynamicStyles.size(dotSize, borderWidth), xstyle), className, style),
-    children: icon && iconSize > 0 && /*#__PURE__*/_jsx("span", {
+    children: [showsIcon && /*#__PURE__*/_jsx("span", {
       "aria-hidden": "true",
       ...stylex.props(styles.icon, dynamicStyles.iconSize(iconSize)),
       children: icon
-    })
+    }), glyphShape && /*#__PURE__*/_jsx(StatusDotGlyph, {
+      shape: glyphShape,
+      field: dotSize - borderWidth * 2,
+      stroke: GLYPH_STROKE_WIDTH[tier]
+    })]
   });
 }
 AvatarStatusDot.displayName = 'AvatarStatusDot';

package/dist/Chat/useChatStreamScroll.d.ts

@@ -4,7 +4,8 @@ export interface ChatScrollToBottomOptions {
      * the spring animation. Use for programmatic positioning (opening a
      * conversation, restoring a session) — keep the default `'spring'` for
      * user-initiated scrolls like the scroll-to-bottom button. Mirrors the
-     * DOM's `scrollTo({behavior})`.
+     * DOM's `scrollTo({behavior})`. When the user prefers reduced motion,
+     * `'spring'` also jumps instantly.
      * @default 'spring'
      */
     behavior?: 'instant' | 'spring';

package/dist/Chat/useChatStreamScroll.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useChatStreamScroll.d.ts","sourceRoot":"","sources":["../../src/Chat/useChatStreamScroll.ts"],"names":[],"mappings":"AAiCA,MAAM,WAAW,yBAAyB;IACxC;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;CACjC;AAED,MAAM,WAAW,0BAA0B;IACzC;;OAEG;IACH,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAE/C;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,yBAAyB;IACxC,6DAA6D;IAC7D,YAAY,EAAE,OAAO,CAAC;IAEtB,yDAAyD;IACzD,QAAQ,EAAE,OAAO,CAAC;IAElB,yDAAyD;IACzD,cAAc,EAAE,CAAC,OAAO,CAAC,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAE9D,sFAAsF;IACtF,eAAe,EAAE,CAAC,EAAE,EAAE,WAAW,KAAK,IAAI,CAAC;IAE3C,6CAA6C;IAC7C,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB,0BAA0B;IAC1B,MAAM,EAAE,MAAM,IAAI,CAAC;IAEnB,oEAAoE;IACpE,cAAc,EAAE,MAAM,IAAI,CAAC;IAE3B,mDAAmD;IACnD,mBAAmB,EAAE,MAAM,IAAI,CAAC;CACjC;AAQD,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,OAAc,EACd,aAAkB,EAClB,eAAqB,EACrB,OAAa,EACb,SAAgB,EAChB,IAAW,GACZ,EAAE,0BAA0B,GAAG,yBAAyB,CA4QxD"}
+{"version":3,"file":"useChatStreamScroll.d.ts","sourceRoot":"","sources":["../../src/Chat/useChatStreamScroll.ts"],"names":[],"mappings":"AAoCA,MAAM,WAAW,yBAAyB;IACxC;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;CACjC;AAED,MAAM,WAAW,0BAA0B;IACzC;;OAEG;IACH,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAE/C;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,yBAAyB;IACxC,6DAA6D;IAC7D,YAAY,EAAE,OAAO,CAAC;IAEtB,yDAAyD;IACzD,QAAQ,EAAE,OAAO,CAAC;IAElB,yDAAyD;IACzD,cAAc,EAAE,CAAC,OAAO,CAAC,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAE9D,sFAAsF;IACtF,eAAe,EAAE,CAAC,EAAE,EAAE,WAAW,KAAK,IAAI,CAAC;IAE3C,6CAA6C;IAC7C,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB,0BAA0B;IAC1B,MAAM,EAAE,MAAM,IAAI,CAAC;IAEnB,oEAAoE;IACpE,cAAc,EAAE,MAAM,IAAI,CAAC;IAE3B,mDAAmD;IACnD,mBAAmB,EAAE,MAAM,IAAI,CAAC;CACjC;AAQD,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,OAAc,EACd,aAAkB,EAClB,eAAqB,EACrB,OAAa,EACb,SAAgB,EAChB,IAAW,GACZ,EAAE,0BAA0B,GAAG,yBAAyB,CAyRxD"}

package/dist/Chat/useChatStreamScroll.js

@@ -4,7 +4,7 @@
 
 /**
  * @file useChatStreamScroll.ts
- * @input Uses React refs, state, callbacks
+ * @input Uses React refs, state, callbacks, useMediaQuery
  * @output Exports useChatStreamScroll hook for AI chat scroll behavior
  * @position Utility hook — used by ChatLayout, also usable standalone
  *
@@ -15,6 +15,8 @@
  * - The first fill positions instantly (whether content is present at
  *   mount or arrives async); only subsequent growth springs
  * - `scrollToBottom({behavior: 'instant'})` jumps in one frame, no animation
+ * - Under `prefers-reduced-motion`, every spring path falls back to the
+ *   same instant jump — following still works, it just doesn't animate
  *
  * Uses scroll direction (lastScrollTop comparison) to detect user
  * intent — works for wheel, touch, scrollbar drag, keyboard, everything.
@@ -25,6 +27,7 @@
  * - /packages/core/src/Chat/index.ts (exports)
  */
 import { useCallback, useEffect, useRef, useState } from 'react';
+import { useMediaQuery } from "../hooks/useMediaQuery.js";
 
 // =============================================================================
 // Types
@@ -93,13 +96,6 @@ export function useChatStreamScroll({
     el.scrollTop += velocityRef.current * tickDelta;
     requestAnimationFrame(animate);
   }, [scrollRef, damping, stiffness, mass]);
-  const startAnimation = useCallback(() => {
-    if (!animatingRef.current && lockedRef.current) {
-      animatingRef.current = true;
-      lastTickRef.current = undefined;
-      requestAnimationFrame(animate);
-    }
-  }, [animate]);
 
   // Jump to the bottom in a single frame — cancels any in-flight spring so
   // a later animation tick can't fight the assignment.
@@ -114,6 +110,24 @@ export function useChatStreamScroll({
     el.scrollTop = el.scrollHeight - el.clientHeight;
     lastScrollTopRef.current = el.scrollTop;
   }, [scrollRef]);
+  const prefersReducedMotion = useMediaQuery('(prefers-reduced-motion: reduce)');
+
+  // Every spring entry point (scrollToBottom, lock, scrollIfLocked growth
+  // follow) funnels through here, so this one branch covers them all.
+  const startAnimation = useCallback(() => {
+    if (!lockedRef.current) {
+      return;
+    }
+    if (prefersReducedMotion) {
+      jumpToBottom();
+      return;
+    }
+    if (!animatingRef.current) {
+      animatingRef.current = true;
+      lastTickRef.current = undefined;
+      requestAnimationFrame(animate);
+    }
+  }, [animate, jumpToBottom, prefersReducedMotion]);
 
   // --- Public API ---
 

package/dist/Chat/useSpeechRecognition.d.ts

@@ -47,6 +47,5 @@ export interface UseSpeechRecognitionReturn {
     /** Toggle between start and stop. */
     toggle: () => void;
 }
-export declare function getDefaultAudioContext(): AudioContext;
 export declare function useSpeechRecognition(options?: UseSpeechRecognitionOptions): UseSpeechRecognitionReturn;
 //# sourceMappingURL=useSpeechRecognition.d.ts.map

package/dist/Chat/useSpeechRecognition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSpeechRecognition.d.ts","sourceRoot":"","sources":["../../src/Chat/useSpeechRecognition.ts"],"names":[],"mappings":"AAsBA,MAAM,WAAW,2BAA2B;IAC1C,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4EAA4E;IAC5E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0DAA0D;IAC1D,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,wEAAwE;IACxE,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,kDAAkD;IAClD,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;IAC/C,2DAA2D;IAC3D,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9D,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,8CAA8C;IAC9C,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAC,KAAK,IAAI,CAAC;IAC7D,sCAAsC;IACtC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,IAAI,CAAC;CACpB;AAED,MAAM,WAAW,0BAA0B;IACzC,sDAAsD;IACtD,WAAW,EAAE,OAAO,CAAC;IACrB,+CAA+C;IAC/C,WAAW,EAAE,OAAO,CAAC;IACrB,kDAAkD;IAClD,UAAU,EAAE,OAAO,CAAC;IACpB,iDAAiD;IACjD,MAAM,EAAE,MAAM,CAAC;IACf,qDAAqD;IACrD,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,oDAAoD;IACpD,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,2CAA2C;IAC3C,iBAAiB,EAAE,MAAM,CAAC;IAC1B,gCAAgC;IAChC,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,0CAA0C;IAC1C,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,4CAA4C;IAC5C,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,qCAAqC;IACrC,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAgLD,wBAAgB,sBAAsB,IAAI,YAAY,CAQrD;AAMD,wBAAgB,oBAAoB,CAClC,OAAO,GAAE,2BAAgC,GACxC,0BAA0B,CAqM5B"}
+{"version":3,"file":"useSpeechRecognition.d.ts","sourceRoot":"","sources":["../../src/Chat/useSpeechRecognition.ts"],"names":[],"mappings":"AAsBA,MAAM,WAAW,2BAA2B;IAC1C,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4EAA4E;IAC5E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0DAA0D;IAC1D,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,wEAAwE;IACxE,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,kDAAkD;IAClD,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;IAC/C,2DAA2D;IAC3D,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9D,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,8CAA8C;IAC9C,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAC,KAAK,IAAI,CAAC;IAC7D,sCAAsC;IACtC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,IAAI,CAAC;CACpB;AAED,MAAM,WAAW,0BAA0B;IACzC,sDAAsD;IACtD,WAAW,EAAE,OAAO,CAAC;IACrB,+CAA+C;IAC/C,WAAW,EAAE,OAAO,CAAC;IACrB,kDAAkD;IAClD,UAAU,EAAE,OAAO,CAAC;IACpB,iDAAiD;IACjD,MAAM,EAAE,MAAM,CAAC;IACf,qDAAqD;IACrD,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,oDAAoD;IACpD,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,2CAA2C;IAC3C,iBAAiB,EAAE,MAAM,CAAC;IAC1B,gCAAgC;IAChC,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,0CAA0C;IAC1C,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,4CAA4C;IAC5C,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,qCAAqC;IACrC,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AA8LD,wBAAgB,oBAAoB,CAClC,OAAO,GAAE,2BAAgC,GACxC,0BAA0B,CAqM5B"}

package/dist/Chat/useSpeechRecognition.js

@@ -135,7 +135,7 @@ async function createVolumeAnalyser(getCtx) {
 // =============================================================================
 
 let _sharedAudioCtx = null;
-export function getDefaultAudioContext() {
+function getDefaultAudioContext() {
   if (!_sharedAudioCtx || _sharedAudioCtx.state === 'closed') {
     _sharedAudioCtx = new AudioContext();
   }

package/dist/Icon/Icon.d.ts

@@ -155,12 +155,17 @@ export interface IconProps extends Omit<SVGProps<SVGSVGElement>, 'ref' | 'color'
      * Don't set `label` when an interactive parent (Button, IconButton, link)
      * already names the control — that produces a duplicate announcement.
      *
+     * Meaningful, standalone icon: give it a label.
+     *
      * @example
      * ```
-     * // Meaningful, standalone icon
      * <Icon icon="success" label="Completed" />
+     * ```
+     *
+     * Decorative icon (the default): omit label.
      *
-     * // Decorative icon (default) — omit label
+     * @example
+     * ```
      * <Icon icon="search" />
      * ```
      */

package/dist/Icon/Icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../src/Icon/Icon.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,aAAa,EAAE,KAAK,QAAQ,EAAC,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAG3C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,sBAAsB,CAAC;AAqBnD,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2Df,CAAC;AAEH;;;;;;;;GAQG;AACH,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;EAiBd,CAAC;AAyCH,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,WAAW,CAAC;AACjD,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,UAAU,CAAC;AAE/C;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAAG,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;AAE9D;;;GAGG;AACH,MAAM,WAAW,SAAU,SAAQ,IAAI,CACrC,QAAQ,CAAC,aAAa,CAAC,EACvB,KAAK,GAAG,OAAO,CAChB;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IAC/B;;;;OAIG;IACH,IAAI,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;;;;;;;;;;;;;;;;;;;;;OAuBG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAyBD;;;;;;;GAOG;AACH,wBAAgB,IAAI,CAAC,EACnB,IAAI,EACJ,KAAiB,EACjB,IAAW,EACX,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,SAAS,qBAkCX;yBAzCe,IAAI;;;AA4FpB;;;;;;GAMG;AACH,wBAAgB,cAAc,CAC5B,IAAI,EAAE,KAAK,CAAC,SAAS,GAAG,QAAQ,EAChC,KAAK,CAAC,EAAE;IAAC,IAAI,CAAC,EAAE,QAAQ,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAC,GAC3C,KAAK,CAAC,SAAS,CAYjB"}
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../src/Icon/Icon.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,aAAa,EAAE,KAAK,QAAQ,EAAC,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAG3C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,sBAAsB,CAAC;AAqBnD,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2Df,CAAC;AAEH;;;;;;;;GAQG;AACH,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;EAiBd,CAAC;AAyCH,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,WAAW,CAAC;AACjD,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,UAAU,CAAC;AAE/C;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAAG,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;AAE9D;;;GAGG;AACH,MAAM,WAAW,SAAU,SAAQ,IAAI,CACrC,QAAQ,CAAC,aAAa,CAAC,EACvB,KAAK,GAAG,OAAO,CAChB;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IAC/B;;;;OAIG;IACH,IAAI,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAyBD;;;;;;;GAOG;AACH,wBAAgB,IAAI,CAAC,EACnB,IAAI,EACJ,KAAiB,EACjB,IAAW,EACX,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,SAAS,qBAkCX;yBAzCe,IAAI;;;AA4FpB;;;;;;GAMG;AACH,wBAAgB,cAAc,CAC5B,IAAI,EAAE,KAAK,CAAC,SAAS,GAAG,QAAQ,EAChC,KAAK,CAAC,EAAE;IAAC,IAAI,CAAC,EAAE,QAAQ,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAC,GAC3C,KAAK,CAAC,SAAS,CAYjB"}

package/dist/Stack/stack.stylex.d.ts

@@ -158,15 +158,6 @@ export declare function stack({ crossAlign, direction, gap, mainAlign, wrap, }:
 }> | Readonly<{
     readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "8px">;
     readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "8px">;
-}> | Readonly<{
-    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "2px">;
-    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "2px">;
-}> | Readonly<{
-    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "4px">;
-    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "4px">;
-}> | Readonly<{
-    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "6px">;
-    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "6px">;
 }> | Readonly<{
     readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "12px">;
     readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "12px">;
@@ -179,6 +170,15 @@ export declare function stack({ crossAlign, direction, gap, mainAlign, wrap, }:
 }> | Readonly<{
     readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "24px">;
     readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "24px">;
+}> | Readonly<{
+    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "2px">;
+    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "2px">;
+}> | Readonly<{
+    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "4px">;
+    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "4px">;
+}> | Readonly<{
+    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "6px">;
+    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "6px">;
 }> | Readonly<{
     readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "32px">;
     readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "32px">;

package/dist/Table/plugins/selection/useTableSelection.d.ts

@@ -23,11 +23,12 @@ export interface UseTableSelectionConfig<T extends Record<string, unknown>> {
      * Derive a human-readable identity for a row, used in the row checkbox's
      * hidden label as `Select ${getRowLabel(item)}`. Without it, every row
      * checkbox announces an undifferentiated "Select row" to screen readers.
+     * With `getRowLabel: item => item.name`, checkbox accessible names become
+     * "Select Alice", "Select Bob", and so on.
      *
      * @example
      * ```
      * getRowLabel: item => item.name
-     * // Checkbox accessible names: "Select Alice", "Select Bob", ...
      * ```
      */
     getRowLabel?: (item: T) => string;

package/dist/Table/plugins/selection/useTableSelection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTableSelection.d.ts","sourceRoot":"","sources":["../../../../src/Table/plugins/selection/useTableSelection.tsx"],"names":[],"mappings":"AA+CA,OAAO,KAAK,EAAC,WAAW,EAAkC,MAAM,aAAa,CAAC;AAQ9E,MAAM,WAAW,uBAAuB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACxE,uCAAuC;IACvC,iBAAiB,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAC;IACxC,6EAA6E;IAC7E,YAAY,EAAE,CAAC,KAAK,EAAE;QAAC,IAAI,EAAE,CAAC,CAAC;QAAC,UAAU,EAAE,OAAO,CAAA;KAAC,KAAK,IAAI,CAAC;IAC9D,kDAAkD;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE;QAAC,aAAa,EAAE,OAAO,CAAA;KAAC,KAAK,IAAI,CAAC;IACvD,mDAAmD;IACnD,gBAAgB,EAAE,MAAM,OAAO,CAAC;IAChC,iFAAiF;IACjF,kBAAkB,CAAC,EAAE,MAAM,OAAO,CAAC;IACnC,+FAA+F;IAC/F,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAC;IAC3C,oGAAoG;IACpG,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAC;IACxC;;;;;;;;;;OAUG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;CACnC;AAuND,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACjE,MAAM,EAAE,uBAAuB,CAAC,CAAC,CAAC,GACjC,WAAW,CAAC,CAAC,CAAC,CAmFhB"}
+{"version":3,"file":"useTableSelection.d.ts","sourceRoot":"","sources":["../../../../src/Table/plugins/selection/useTableSelection.tsx"],"names":[],"mappings":"AA+CA,OAAO,KAAK,EAAC,WAAW,EAAkC,MAAM,aAAa,CAAC;AAQ9E,MAAM,WAAW,uBAAuB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACxE,uCAAuC;IACvC,iBAAiB,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAC;IACxC,6EAA6E;IAC7E,YAAY,EAAE,CAAC,KAAK,EAAE;QAAC,IAAI,EAAE,CAAC,CAAC;QAAC,UAAU,EAAE,OAAO,CAAA;KAAC,KAAK,IAAI,CAAC;IAC9D,kDAAkD;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE;QAAC,aAAa,EAAE,OAAO,CAAA;KAAC,KAAK,IAAI,CAAC;IACvD,mDAAmD;IACnD,gBAAgB,EAAE,MAAM,OAAO,CAAC;IAChC,iFAAiF;IACjF,kBAAkB,CAAC,EAAE,MAAM,OAAO,CAAC;IACnC,+FAA+F;IAC/F,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAC;IAC3C,oGAAoG;IACpG,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAC;IACxC;;;;;;;;;;;OAWG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;CACnC;AAuND,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACjE,MAAM,EAAE,uBAAuB,CAAC,CAAC,CAAC,GACjC,WAAW,CAAC,CAAC,CAAC,CAmFhB"}

package/dist/ToggleButton/ToggleButtonGroup.d.ts

@@ -26,7 +26,6 @@ interface ToggleButtonGroupContextValue {
     /** Group disabled state. */
     isDisabled?: boolean;
 }
-export declare const ToggleButtonGroupContext: import("react").Context<ToggleButtonGroupContextValue | null>;
 /**
  * Hook for ToggleButton to read group context.
  * Returns null when used outside a group.

package/dist/ToggleButton/ToggleButtonGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleButtonGroup.d.ts","sourceRoot":"","sources":["../../src/ToggleButton/ToggleButtonGroup.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAA2C,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG/E,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,WAAW,CAAC;AAE1C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAOnD,UAAU,6BAA6B;IACrC,mCAAmC;IACnC,cAAc,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC5B,6BAA6B;IAC7B,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,4DAA4D;IAC5D,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,4BAA4B;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,wBAAwB,+DACsB,CAAC;AAG5D;;;GAGG;AACH,wBAAgB,oBAAoB,IAAI,6BAA6B,GAAG,IAAI,CAE3E;AAsBD,UAAU,0BAA0B;IAClC,8BAA8B;IAC9B,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IAExC;;;;OAIG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IAEtB,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;GAIG;AACH,MAAM,WAAW,4BAA6B,SAAQ,0BAA0B;IAC9E;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB,0DAA0D;IAC1D,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAErB,qCAAqC;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC1C;AAED;;;GAGG;AACH,MAAM,WAAW,8BAA+B,SAAQ,0BAA0B;IAChF,+BAA+B;IAC/B,IAAI,EAAE,UAAU,CAAC;IAEjB,iCAAiC;IACjC,KAAK,EAAE,MAAM,EAAE,CAAC;IAEhB,qCAAqC;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACrC;AAED,8DAA8D;AAC9D,MAAM,MAAM,sBAAsB,GAC9B,4BAA4B,GAC5B,8BAA8B,CAAC;AAMnC;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,sBAAsB,GAC5B,SAAS,CAgEX;yBAlEe,iBAAiB"}
+{"version":3,"file":"ToggleButtonGroup.d.ts","sourceRoot":"","sources":["../../src/ToggleButton/ToggleButtonGroup.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAA2C,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG/E,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,WAAW,CAAC;AAE1C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAOnD,UAAU,6BAA6B;IACrC,mCAAmC;IACnC,cAAc,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC5B,6BAA6B;IAC7B,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,4DAA4D;IAC5D,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,4BAA4B;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAMD;;;GAGG;AACH,wBAAgB,oBAAoB,IAAI,6BAA6B,GAAG,IAAI,CAE3E;AAsBD,UAAU,0BAA0B;IAClC,8BAA8B;IAC9B,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IAExC;;;;OAIG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IAEtB,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;GAIG;AACH,MAAM,WAAW,4BAA6B,SAAQ,0BAA0B;IAC9E;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB,0DAA0D;IAC1D,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAErB,qCAAqC;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC1C;AAED;;;GAGG;AACH,MAAM,WAAW,8BAA+B,SAAQ,0BAA0B;IAChF,+BAA+B;IAC/B,IAAI,EAAE,UAAU,CAAC;IAEjB,iCAAiC;IACjC,KAAK,EAAE,MAAM,EAAE,CAAC;IAEhB,qCAAqC;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACrC;AAED,8DAA8D;AAC9D,MAAM,MAAM,sBAAsB,GAC9B,4BAA4B,GAC5B,8BAA8B,CAAC;AAMnC;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,sBAAsB,GAC5B,SAAS,CAgEX;yBAlEe,iBAAiB"}

package/dist/ToggleButton/ToggleButtonGroup.js

@@ -28,7 +28,7 @@ import { themeProps } from "../utils/themeProps.js";
 // Context
 // =============================================================================
 import { jsx as _jsx } from "react/jsx-runtime";
-export const ToggleButtonGroupContext = /*#__PURE__*/createContext(null);
+const ToggleButtonGroupContext = /*#__PURE__*/createContext(null);
 ToggleButtonGroupContext.displayName = 'ToggleButtonGroupContext';
 
 /**

package/dist/TreeList/TreeListItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TreeListItem.d.ts","sourceRoot":"","sources":["../../src/TreeList/TreeListItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;GAUG;AAEH,OAAO,EAAiB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAcrD,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,iBAAiB,CAAC;AA8NrD,MAAM,WAAW,yBAAyB;IACxC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,eAAe,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IACxC,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,OAAO,EAAE,eAAe,CAAC;IACzB,uEAAuE;IACvE,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B,wEAAwE;IACxE,QAAQ,EAAE,MAAM,CAAC;IACjB,uDAAuD;IACvD,OAAO,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,UAAU,EAAE,OAAO,CAAC;CACrB;AAMD,wBAAgB,YAAY,CAAC,EAC3B,EAAE,EACF,KAAK,EACL,WAAW,EACX,YAAY,EACZ,UAAU,EACV,OAAO,EACP,IAAI,EACJ,MAAM,EACN,UAAkB,EAClB,UAAkB,EAClB,WAAW,EACX,WAAW,EACX,MAAM,EACN,eAAe,EACf,UAAU,EACV,QAAQ,EACR,OAAO,EACP,gBAAgB,EAChB,QAAQ,EACR,OAAO,EACP,UAAU,GACX,EAAE,yBAAyB,+BA+L3B;yBArNe,YAAY"}
+{"version":3,"file":"TreeListItem.d.ts","sourceRoot":"","sources":["../../src/TreeList/TreeListItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;GAUG;AAEH,OAAO,EAAiB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAcrD,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,iBAAiB,CAAC;AA8NrD,MAAM,WAAW,yBAAyB;IACxC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,eAAe,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IACxC,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,OAAO,EAAE,eAAe,CAAC;IACzB,uEAAuE;IACvE,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B,wEAAwE;IACxE,QAAQ,EAAE,MAAM,CAAC;IACjB,uDAAuD;IACvD,OAAO,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,UAAU,EAAE,OAAO,CAAC;CACrB;AAMD,wBAAgB,YAAY,CAAC,EAC3B,EAAE,EACF,KAAK,EACL,WAAW,EACX,YAAY,EACZ,UAAU,EACV,OAAO,EACP,IAAI,EACJ,MAAM,EACN,UAAkB,EAClB,UAAkB,EAClB,WAAW,EACX,WAAW,EACX,MAAM,EACN,eAAe,EACf,UAAU,EACV,QAAQ,EACR,OAAO,EACP,gBAAgB,EAChB,QAAQ,EACR,OAAO,EACP,UAAU,GACX,EAAE,yBAAyB,+BA8N3B;yBApPe,YAAY"}

package/dist/TreeList/TreeListItem.js

@@ -171,9 +171,18 @@ export function TreeListItem({
   const labelAndDescription = /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsx("span", {
       id: labelId,
-      ...{
+      ...mergeProps(
+      // Stable theme target for the item's label text. The label carries no
+      // themeable handle today, so a theme can only reach it through a
+      // fragile structural selector (a content button's first span). This
+      // adds an `astryx-tree-list-item-label` class and reflects the row's
+      // `selected` state so a theme can, e.g., bold just the selected
+      // item's label via `defineTheme`.
+      themeProps('tree-list-item-label', {
+        selected: isSelected ? 'selected' : null
+      }), {
         className: "x1tgivj0"
-      },
+      }),
       children: label
     }), description != null && /*#__PURE__*/_jsx("span", {
       id: descriptionId,
@@ -213,17 +222,27 @@ export function TreeListItem({
     ,
     tabIndex: -1,
     onClick: handleToggle,
-    ...{
+    ...mergeProps(
+    // Stable theme target for the expand/collapse control. `data-tree-toggle`
+    // stays as the functional activation hook; this adds a themeable
+    // `astryx-tree-list-chevron` class and reflects the open/closed state so
+    // a theme can restyle the toggle (and each state) without a fragile
+    // `[data-tree-toggle]` selector.
+    themeProps('tree-list-chevron', {
+      state: isExpanded ? 'expanded' : 'collapsed'
+    }), {
       className: "x78zum5 x6s0dn4 xl56j7k x12xnipv x6b6gus xho7bvi x1ypdohk xv9yike xx3sua9 x11g1kdw xmequkd"
-    },
+    }),
     children: chevronIcon
   }) :
   /*#__PURE__*/
   // Non-interactive chevron only when toggling is not wired up at all
   _jsx("span", {
-    ...{
+    ...mergeProps(themeProps('tree-list-chevron', {
+      state: isExpanded ? 'expanded' : 'collapsed'
+    }), {
       className: "x2lah0s x78zum5 x6s0dn4 xl56j7k x12xnipv x6b6gus xho7bvi x1ypdohk x1717udv xv9yike xx3sua9 x11g1kdw xmequkd"
-    },
+    }),
     children: chevronIcon
   }) : null;
   const innerContent = /*#__PURE__*/_jsxs(_Fragment, {

package/dist/astryx.css

@@ -572,7 +572,6 @@
   .xzyc27v:not(#\#):not(#\#):not(#\#){background-color:var(--color-syntax-background)}
   .x16fr6go:not(#\#):not(#\#):not(#\#){background-color:var(--color-text-disabled)}
   .x19aspcf:not(#\#):not(#\#):not(#\#){background-color:var(--color-text-primary)}
-  .xdomwnj:not(#\#):not(#\#):not(#\#){background-color:var(--color-text-secondary)}
   .xdsb6cv:not(#\#):not(#\#):not(#\#){background-color:var(--color-track)}
   .x24i8r5:not(#\#):not(#\#):not(#\#){background-color:var(--color-warning-muted)}
   .x1q8g9m5:not(#\#):not(#\#):not(#\#){background-color:var(--color-warning)}