@astryxdesign/core 0.5.2-canary.e4f8e4e → 0.5.2-canary.edc0cfc

package/dist/AppShell/AppShell.d.ts

@@ -3,7 +3,7 @@ import React from 'react';
  * @file AppShell.tsx
  * @input Uses React, Layout, LayoutHeader, LayoutPanel, LayoutContent, StyleX
  * @output Exports AppShell component and AppShellProps type
- * @position Application-level layout shell — the top-level wrapper for any app.
+ * @position Page shell for an application — the top-level wrapper for any app.
  *   Composes Layout internally to provide header, sideNav, and main content areas.
  *   Use for any app that needs a top nav, side navigation, and scrollable content.
  *
@@ -175,7 +175,7 @@ export interface AppShellProps extends BaseProps<HTMLDivElement> {
     topNav?: ReactNode;
 }
 /**
- * Application-level layout shell. Provides the structural frame for an app:
+ * Page shell for an application. Provides the structural frame for an app:
  * top navigation, side navigation, and main content area.
  *
  * Slot-based API with `topNav`, `sideNav`, `banner`, and `children`.

package/dist/AppShell/AppShell.js

@@ -8,7 +8,7 @@ import React from 'react';
  * @file AppShell.tsx
  * @input Uses React, Layout, LayoutHeader, LayoutPanel, LayoutContent, StyleX
  * @output Exports AppShell component and AppShellProps type
- * @position Application-level layout shell — the top-level wrapper for any app.
+ * @position Page shell for an application — the top-level wrapper for any app.
  *   Composes Layout internally to provide header, sideNav, and main content areas.
  *   Use for any app that needs a top nav, side navigation, and scrollable content.
  *
@@ -199,7 +199,7 @@ const styles = {
 // =============================================================================
 
 /**
- * Application-level layout shell. Provides the structural frame for an app:
+ * Page shell for an application. Provides the structural frame for an app:
  * top navigation, side navigation, and main content area.
  *
  * Slot-based API with `topNav`, `sideNav`, `banner`, and `children`.

package/dist/Chat/ChatToolCalls.d.ts

@@ -1,6 +1,6 @@
 /**
  * @file ChatToolCalls.tsx
- * @input Uses React, StyleX, theme tokens
+ * @input Uses React, StyleX, semantic icon registry, theme tokens
  * @output Exports ChatToolCalls component
  * @position Chat component — displays tool/function call invocations
  *

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

@@ -1 +1 @@
-{"version":3,"file":"ChatToolCalls.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatToolCalls.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,EAA+B,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAC1E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAwB5C,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC;AAE9E,MAAM,WAAW,gBAAgB;IAC/B,0BAA0B;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,2FAA2F;IAC3F,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,mEAAmE;IACnE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qEAAqE;IACrE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8DAA8D;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6DAA6D;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oFAAoF;IACpF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,mFAAmF;IACnF,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,6FAA6F;IAC7F,YAAY,CAAC,EAAE,SAAS,CAAC;CAC1B;AAED,MAAM,WAAW,kBAAmB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACnE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,+BAA+B;IAC/B,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAC1B,6EAA6E;IAC7E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8DAA8D;IAC9D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wEAAwE;IACxE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;CAClD;AAkbD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,4BAgKtD;yBAhKe,aAAa"}
+{"version":3,"file":"ChatToolCalls.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatToolCalls.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,EAA+B,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAC1E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAwB5C,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC;AAE9E,MAAM,WAAW,gBAAgB;IAC/B,0BAA0B;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,2FAA2F;IAC3F,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,mEAAmE;IACnE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qEAAqE;IACrE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8DAA8D;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6DAA6D;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oFAAoF;IACpF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,mFAAmF;IACnF,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,6FAA6F;IAC7F,YAAY,CAAC,EAAE,SAAS,CAAC;CAC1B;AAED,MAAM,WAAW,kBAAmB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACnE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,+BAA+B;IAC/B,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAC1B,6EAA6E;IAC7E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8DAA8D;IAC9D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wEAAwE;IACxE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;CAClD;AAkaD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,4BA2JtD;yBA3Je,aAAa"}

package/dist/Chat/ChatToolCalls.js

@@ -4,7 +4,7 @@
 
 /**
  * @file ChatToolCalls.tsx
- * @input Uses React, StyleX, theme tokens
+ * @input Uses React, StyleX, semantic icon registry, theme tokens
  * @output Exports ChatToolCalls component
  * @position Chat component — displays tool/function call invocations
  *
@@ -32,7 +32,7 @@ import { useTranslator } from "../i18n/index.js";
 // =============================================================================
 // Types
 // =============================================================================
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // =============================================================================
 // =============================================================================
 // Styles
@@ -93,8 +93,8 @@ const styles = {
 const STATUS_ICON_NAMES = {
   pending: 'clock',
   running: null,
-  complete: 'check',
-  error: 'close'
+  complete: 'success',
+  error: 'error'
 };
 const STATUS_STYLES = {
   pending: styles.colorPending,
@@ -168,21 +168,10 @@ function CallRow({
         size: "sm",
         shade: "subtle",
         "aria-hidden": "true"
-      }) : /*#__PURE__*/_jsxs(_Fragment, {
-        children: [/*#__PURE__*/_jsx("span", {
-          ...{
-            className: "x10l6tqk x10a8y8t x1pjcqnp xtwfq29 x1xyvc85"
-          }
-        }), /*#__PURE__*/_jsx("span", {
-          ...{
-            className: "x1n2onr6 x3nfvp2"
-          },
-          children: /*#__PURE__*/_jsx(Icon, {
-            icon: STATUS_ICON_NAMES[status] ?? 'check',
-            size: "xsm",
-            color: "inherit"
-          })
-        })]
+      }) : /*#__PURE__*/_jsx(Icon, {
+        icon: STATUS_ICON_NAMES[status] ?? 'success',
+        size: "xsm",
+        color: "inherit"
       }), /*#__PURE__*/_jsx(VisuallyHidden, {
         children: statusAnnouncement
       })]
@@ -365,21 +354,10 @@ export function ChatToolCalls(props) {
             size: "sm",
             shade: "subtle",
             "aria-hidden": "true"
-          }) : /*#__PURE__*/_jsxs(_Fragment, {
-            children: [/*#__PURE__*/_jsx("span", {
-              ...{
-                className: "x10l6tqk x10a8y8t x1pjcqnp xtwfq29 x1xyvc85"
-              }
-            }), /*#__PURE__*/_jsx("span", {
-              ...{
-                className: "x1n2onr6 x3nfvp2"
-              },
-              children: /*#__PURE__*/_jsx(Icon, {
-                icon: STATUS_ICON_NAMES[latestStatus] ?? 'check',
-                size: "xsm",
-                color: "inherit"
-              })
-            })]
+          }) : /*#__PURE__*/_jsx(Icon, {
+            icon: STATUS_ICON_NAMES[latestStatus] ?? 'success',
+            size: "xsm",
+            color: "inherit"
           }), /*#__PURE__*/_jsx(VisuallyHidden, {
             children: latestStatusAnnouncement
           })]

package/dist/Layout/Layout.d.ts

@@ -2,10 +2,10 @@
  * @file Layout.tsx
  * @input Uses React, stack/stackItem utilities, LayoutAreaContext, LayoutSlotsContext
  * @output Exports Layout component and LayoutProps, LayoutHeight types
- * @position Page shell and app layout — use for any page with a header, sidebar, or content area.
- *   Building a page with a sidebar? Use Layout with start/end slots.
+ * @position General five-slot layout primitive for arranging header, start, content, end, and footer regions.
+ *   Building a page area with a side panel? Use Layout with start/end slots.
  *   Need a header + scrollable content? Use Layout with header + content slots.
- *   Manages padding collapse, scroll containment, and responsive slot sizing automatically.
+ *   AppShell owns the page shell and app-wide navigation behavior.
  *
  * SYNC: When modified, update these files to stay in sync:
  * - /packages/core/src/Layout/Layout.doc.mjs
@@ -87,11 +87,10 @@ export interface LayoutProps extends Omit<BaseProps, 'content'> {
     children?: ReactNode;
 }
 /**
- * Page shell with header, sidebar(s), content, and footer slots.
- * Use this for full-page layouts, app shells, dashboard layouts, or any UI
- * that needs a header bar, side navigation, scrollable content area, or action footer.
- * Can be used standalone for page-level layouts, or inside a container
- * (Card, Section) for content-level layouts.
+ * General layout primitive with header, start, content, end, and footer slots.
+ * Use it to arrange regions within a page or bounded container. AppShell owns
+ * the page shell, app-wide navigation, responsive shell behavior, skip link,
+ * and main landmark.
  *
  * Handles padding collapse between adjacent slots, scroll containment in the
  * content area, and automatic RTL support via CSS logical properties.

package/dist/Layout/Layout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../../src/Layout/Layout.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAU,MAAM,OAAO,CAAC;AAQ9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAO3D;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,MAAM,CAAC;AAgD3C,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,SAAS,EAAE,SAAS,CAAC;IAC7D;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;;;;;;;OASG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;OAEG;IACH,GAAG,CAAC,EAAE,SAAS,CAAC;IAEhB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IAEtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAkBD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,kBAAkB,EAClB,GAAG,EACH,MAAM,EACN,MAAM,EACN,MAAe,EACf,OAAO,EACP,GAAG,EACH,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,GACN,EAAE,WAAW,+BA0Eb;yBAzFe,MAAM"}
+{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../../src/Layout/Layout.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAU,MAAM,OAAO,CAAC;AAQ9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAO3D;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,MAAM,CAAC;AAgD3C,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,SAAS,EAAE,SAAS,CAAC;IAC7D;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;;;;;;;OASG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;OAEG;IACH,GAAG,CAAC,EAAE,SAAS,CAAC;IAEhB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IAEtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAkBD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,kBAAkB,EAClB,GAAG,EACH,MAAM,EACN,MAAM,EACN,MAAe,EACf,OAAO,EACP,GAAG,EACH,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,GACN,EAAE,WAAW,+BA0Eb;yBAzFe,MAAM"}

package/dist/Layout/Layout.js

@@ -6,10 +6,10 @@
  * @file Layout.tsx
  * @input Uses React, stack/stackItem utilities, LayoutAreaContext, LayoutSlotsContext
  * @output Exports Layout component and LayoutProps, LayoutHeight types
- * @position Page shell and app layout — use for any page with a header, sidebar, or content area.
- *   Building a page with a sidebar? Use Layout with start/end slots.
+ * @position General five-slot layout primitive for arranging header, start, content, end, and footer regions.
+ *   Building a page area with a side panel? Use Layout with start/end slots.
  *   Need a header + scrollable content? Use Layout with header + content slots.
- *   Manages padding collapse, scroll containment, and responsive slot sizing automatically.
+ *   AppShell owns the page shell and app-wide navigation behavior.
  *
  * SYNC: When modified, update these files to stay in sync:
  * - /packages/core/src/Layout/Layout.doc.mjs
@@ -104,11 +104,10 @@ function AreaProvider({
 }
 
 /**
- * Page shell with header, sidebar(s), content, and footer slots.
- * Use this for full-page layouts, app shells, dashboard layouts, or any UI
- * that needs a header bar, side navigation, scrollable content area, or action footer.
- * Can be used standalone for page-level layouts, or inside a container
- * (Card, Section) for content-level layouts.
+ * General layout primitive with header, start, content, end, and footer slots.
+ * Use it to arrange regions within a page or bounded container. AppShell owns
+ * the page shell, app-wide navigation, responsive shell behavior, skip link,
+ * and main landmark.
  *
  * Handles padding collapse between adjacent slots, scroll containment in the
  * content area, and automatic RTL support via CSS logical properties.

package/dist/Spinner/Spinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/Spinner/Spinner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAyB5C,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;CAKV,CAAC;AA4TF,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,KAAK,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAExE,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;;;;;;;;;;;;OAaG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;GAWG;AACH,wBAAgB,OAAO,CAAC,EACtB,IAAW,EACX,KAAiB,EACjB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,SAAS,EACb,EAAE,YAAY,+BAuHd;yBAlIe,OAAO"}
+{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/Spinner/Spinner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAyB5C,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;CAKV,CAAC;AAgVF,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,KAAK,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAExE,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;;;;;;;;;;;;OAaG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;GAWG;AACH,wBAAgB,OAAO,CAAC,EACtB,IAAW,EACX,KAAiB,EACjB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,SAAS,EACb,EAAE,YAAY,+BAuHd;yBAlIe,OAAO"}

package/dist/Spinner/Spinner.js

@@ -229,11 +229,11 @@ const styles = {
   spinner: {
     k1xSpc: "xwz0xwf",
     kgQiWS: "x1ku5rj1",
-    kVQacm: "xb3r6kr",
     kXLuUW: "xxymvpz",
     "--_spinner-ring-diameter": "x2lq4xu",
     "--_spinner-ring-stroke": "x10qssua",
     "--_spinner-box-size": "x69vvuq",
+    kmuXW: "x2lah0s",
     $$css: true
   },
   circle: {

package/dist/Table/plugins/rowStatus/useTableRowStatus.d.ts

@@ -6,18 +6,21 @@ import type { TablePlugin } from '../../types';
  */
 export type TableRowStatusColor = 'accent' | 'success' | 'error' | 'warning' | 'red' | 'orange' | 'green' | 'yellow' | 'blue' | 'gray';
 /**
- * A row's status indicator. `color` accepts a semantic status color
- * (mapped to a theme token) or any raw CSS color string as an escape hatch.
- * By default the plugin renders a colored status dot. Provide `icon` to signal
- * status by shape as well as color, which is more accessible when several
- * statuses coexist. `label` is required so the status is never conveyed by
- * color alone — it names the indicator for assistive technology and shows on
- * hover. Return `null` for rows with no status.
+ * A row's status indicator. Semantic status colors (`success`, `warning`,
+ * `error`) resolve to the matching themed semantic icon by default. Palette
+ * colors and raw CSS values retain the neutral dot because color alone cannot
+ * establish an outcome glyph. Provide `icon` to override either default.
+ * `label` is required so the status is never conveyed by color alone — it names
+ * the indicator for assistive technology and shows on hover. Return `null` for
+ * rows with no status.
  */
 export interface TableRowStatus {
     /** Semantic status color (preferred) or a raw CSS color string. */
     color: TableRowStatusColor | (string & {});
-    /** Optional icon rendered as the signifier instead of the dot (shape as an a11y differentiator). */
+    /**
+     * Optional icon override. Semantic status colors use their matching themed
+     * icon by default; palette/raw colors use a dot.
+     */
     icon?: IconName;
     /**
      * Accessible name for the status, announced to assistive technology and
@@ -42,8 +45,8 @@ export interface UseTableRowStatusConfig<T extends Record<string, unknown>> {
 }
 /**
  * Returns a {@link TablePlugin} that prepends a narrow column signaling per-row
- * status: a colored status dot by default, or an icon when `icon` is provided
- * (shape + color is more accessible than color alone).
+ * status: a themed semantic icon for `success`, `warning`, and `error`; a
+ * colored dot for palette/raw colors; or an explicit icon override.
  *
  * @example
  * ```

package/dist/Table/plugins/rowStatus/useTableRowStatus.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTableRowStatus.d.ts","sourceRoot":"","sources":["../../../../src/Table/plugins/rowStatus/useTableRowStatus.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,eAAe,CAAC;AAIlE,OAAO,KAAK,EAAc,WAAW,EAAC,MAAM,aAAa,CAAC;AAE1D;;;GAGG;AACH,MAAM,MAAM,mBAAmB,GAC3B,QAAQ,GACR,SAAS,GACT,OAAO,GACP,SAAS,GACT,KAAK,GACL,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,MAAM,GACN,MAAM,CAAC;AA6BX;;;;;;;;GAQG;AACH,MAAM,WAAW,cAAc;IAC7B,mEAAmE;IACnE,KAAK,EAAE,mBAAmB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAC3C,oGAAoG;IACpG,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAC;CACf;AAED,mDAAmD;AACnD,MAAM,WAAW,uBAAuB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACxE;;;;;;;;;OASG;IACH,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,cAAc,GAAG,IAAI,CAAC;CAC/C;AA2BD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACjE,MAAM,EAAE,uBAAuB,CAAC,CAAC,CAAC,GACjC,WAAW,CAAC,CAAC,CAAC,CAoDhB"}
+{"version":3,"file":"useTableRowStatus.d.ts","sourceRoot":"","sources":["../../../../src/Table/plugins/rowStatus/useTableRowStatus.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,eAAe,CAAC;AAIlE,OAAO,KAAK,EAAc,WAAW,EAAC,MAAM,aAAa,CAAC;AAE1D;;;GAGG;AACH,MAAM,MAAM,mBAAmB,GAC3B,QAAQ,GACR,SAAS,GACT,OAAO,GACP,SAAS,GACT,KAAK,GACL,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,MAAM,GACN,MAAM,CAAC;AAyCX;;;;;;;;GAQG;AACH,MAAM,WAAW,cAAc;IAC7B,mEAAmE;IACnE,KAAK,EAAE,mBAAmB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAC3C;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAC;CACf;AAED,mDAAmD;AACnD,MAAM,WAAW,uBAAuB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACxE;;;;;;;;;OASG;IACH,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,cAAc,GAAG,IAAI,CAAC;CAC/C;AA2BD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACjE,MAAM,EAAE,uBAAuB,CAAC,CAAC,CAAC,GACjC,WAAW,CAAC,CAAC,CAAC,CAuDhB"}

package/dist/Table/plugins/rowStatus/useTableRowStatus.js

@@ -51,13 +51,25 @@ const ICON_COLOR_BY_STATUS = {
 };
 
 /**
- * A row's status indicator. `color` accepts a semantic status color
- * (mapped to a theme token) or any raw CSS color string as an escape hatch.
- * By default the plugin renders a colored status dot. Provide `icon` to signal
- * status by shape as well as color, which is more accessible when several
- * statuses coexist. `label` is required so the status is never conveyed by
- * color alone — it names the indicator for assistive technology and shows on
- * hover. Return `null` for rows with no status.
+ * Semantic statuses resolve through the theme-aware icon registry by default, so
+ * a theme owns both their shape and color. Palette colors and raw CSS values do
+ * not carry outcome semantics, so they retain the neutral dot unless the caller
+ * provides an explicit icon.
+ */
+const DEFAULT_ICON_BY_STATUS = {
+  success: 'success',
+  error: 'error',
+  warning: 'warning'
+};
+
+/**
+ * A row's status indicator. Semantic status colors (`success`, `warning`,
+ * `error`) resolve to the matching themed semantic icon by default. Palette
+ * colors and raw CSS values retain the neutral dot because color alone cannot
+ * establish an outcome glyph. Provide `icon` to override either default.
+ * `label` is required so the status is never conveyed by color alone — it names
+ * the indicator for assistive technology and shows on hover. Return `null` for
+ * rows with no status.
  */
 
 /** Configuration for {@link useTableRowStatus}. */
@@ -91,8 +103,8 @@ const styles = {
 
 /**
  * Returns a {@link TablePlugin} that prepends a narrow column signaling per-row
- * status: a colored status dot by default, or an icon when `icon` is provided
- * (shape + color is more accessible than color alone).
+ * status: a themed semantic icon for `success`, `warning`, and `error`; a
+ * colored dot for palette/raw colors; or an explicit icon override.
  *
  * @example
  * ```
@@ -126,8 +138,9 @@ export function useTableRowStatus(config) {
           if (!status) {
             return null;
           }
-          const signifier = status.icon ? /*#__PURE__*/_jsx(Icon, {
-            icon: status.icon,
+          const icon = status.icon ?? DEFAULT_ICON_BY_STATUS[status.color];
+          const signifier = icon ? /*#__PURE__*/_jsx(Icon, {
+            icon: icon,
             size: "xsm",
             color: ICON_COLOR_BY_STATUS[status.color] ?? 'primary'
           }) : /*#__PURE__*/_jsx("span", {

package/dist/astryx.css

@@ -659,7 +659,6 @@
   .xlp1x4z:not(#\#):not(#\#):not(#\#){backface-visibility:hidden}
   .xx83zyx:not(#\#):not(#\#):not(#\#){background-clip:padding-box}
   .x1rkw3yq:not(#\#):not(#\#):not(#\#){background-color:color-mix(in srgb,white 60%,transparent)}
-  .xtwfq29:not(#\#):not(#\#):not(#\#){background-color:currentColor}
   .xgcd1z6:not(#\#):not(#\#):not(#\#){background-color:inherit}
   .xcpsgoo:not(#\#):not(#\#):not(#\#){background-color:rgba(0,0,0,.5)}
   .xjbqb8w:not(#\#):not(#\#):not(#\#){background-color:transparent}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astryxdesign/core",
-  "version": "0.5.2-canary.e4f8e4e",
+  "version": "0.5.2-canary.edc0cfc",
   "displayName": "Astryx Core",
   "description": "The component library. Accessible, themeable React components with built-in spacing, dark mode, and StyleX styling.",
   "author": "Meta Open Source",
@@ -661,7 +661,7 @@
     "react-dom": ">=19.0.0"
   },
   "devDependencies": {
-    "@astryxdesign/cli": "0.5.2-canary.e4f8e4e",
+    "@astryxdesign/cli": "0.5.2-canary.edc0cfc",
     "@babel/cli": "^8.0.4",
     "@babel/core": "^7.29.7",
     "@babel/preset-react": "^8.0.1",

package/src/AppShell/AppShell.doc.mjs

@@ -10,7 +10,7 @@ export const docs = {
   keywords: ["appshell","layout","scaffold","sidebar","sidenav","topnav","header","navigation","dashboard","shell","page","frame"],
   usage: {
     description:
-      'The outermost layout for an application. Provides slots for top navigation, side navigation, banners, and main content. Use it as the root wrapper for every page. It handles responsive mobile navigation and skip-to-content automatically. Configure side nav collapse on SideNav with its collapsible prop.',
+      'AppShell is the page shell for an application. It provides slots for top navigation, side navigation, banners, and main content. Use it as the root wrapper for every page. It handles responsive mobile navigation and skip-to-content automatically. Configure side nav collapse on SideNav with its collapsible prop.',
     bestPractices: [
       {guidance: true, description: 'Choose the right height: use "fill" for dashboards with internal scrolling and "auto" for pages that grow with content.'},
       {guidance: true, description: 'Set `contentPadding` based on content type: 4 for forms and settings, 0 for tables and dashboards.'},
@@ -21,6 +21,7 @@ export const docs = {
       {guidance: false, description: 'Add your own skip link or <main> element. AppShell already renders both, and a second main landmark makes the first ambiguous.'},
     ],
     anatomy: [
+      {name: 'Page shell', required: true, description: 'Outermost application frame that owns page-level navigation, responsive shell behavior, and the main content landmark.'},
       {name: 'Skip link', required: true, description: 'First focusable element on the page. Visually hidden until focused, then moves focus to the main content area.'},
       {name: 'Banner', required: false, description: 'The banner slot, for system-wide announcements. Renders above the top nav, inside the banner landmark.'},
       {name: 'Top navigation', required: false, description: 'The topNav slot, typically TopNav. Below the mobile breakpoint it becomes a compact bar carrying the nav toggle.'},
@@ -137,7 +138,7 @@ export const docsZh = {
   displayName: 'App Shell',
   usage: {
     description:
-      'The outermost layout for an application. Provides slots for top navigation, side navigation, banners, and main content. Use it as the root wrapper for every page. It handles responsive mobile navigation and skip-to-content automatically. Configure side nav collapse on SideNav with its collapsible prop.',
+      'AppShell is the page shell for an application. It provides slots for top navigation, side navigation, banners, and main content. Use it as the root wrapper for every page. It handles responsive mobile navigation and skip-to-content automatically. Configure side nav collapse on SideNav with its collapsible prop.',
     bestPractices: [
       {guidance: true, description: 'Choose the right height: use "fill" for dashboards with internal scrolling and "auto" for pages that grow with content.'},
       {guidance: true, description: 'Set `contentPadding` based on content type: 4 for forms and settings, 0 for tables and dashboards.'},
@@ -199,7 +200,7 @@ export const docsDense = {
     'app-level layout shell w/ header, side nav, main content; composes Layout internally, replaces Page+PageLayout',
   usage: {
     description:
-      'The outermost layout for an application. Provides slots for top navigation, side navigation, banners, and main content. Use it as the root wrapper for every page. It handles responsive mobile navigation and skip-to-content automatically. Configure side nav collapse on SideNav with its collapsible prop.',
+      'AppShell is the page shell for an application. It provides slots for top navigation, side navigation, banners, and main content. Use it as the root wrapper for every page. It handles responsive mobile navigation and skip-to-content automatically. Configure side nav collapse on SideNav with its collapsible prop.',
     bestPractices: [
       {guidance: true, description: 'Choose the right height: use "fill" for dashboards with internal scrolling and "auto" for pages that grow with content.'},
       {guidance: true, description: 'Set `contentPadding` based on content type: 4 for forms and settings, 0 for tables and dashboards.'},

package/src/AppShell/AppShell.tsx

@@ -8,7 +8,7 @@ import React from 'react';
  * @file AppShell.tsx
  * @input Uses React, Layout, LayoutHeader, LayoutPanel, LayoutContent, StyleX
  * @output Exports AppShell component and AppShellProps type
- * @position Application-level layout shell — the top-level wrapper for any app.
+ * @position Page shell for an application — the top-level wrapper for any app.
  *   Composes Layout internally to provide header, sideNav, and main content areas.
  *   Use for any app that needs a top nav, side navigation, and scrollable content.
  *
@@ -430,7 +430,7 @@ const styles = stylex.create({
 // =============================================================================
 
 /**
- * Application-level layout shell. Provides the structural frame for an app:
+ * Page shell for an application. Provides the structural frame for an app:
  * top navigation, side navigation, and main content area.
  *
  * Slot-based API with `topNav`, `sideNav`, `banner`, and `children`.

package/src/BottomSheet/BottomSheet.doc.mjs

@@ -1,4 +1,33 @@
 // Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/** @type {import('@astryxdesign/cli/authoring').ComponentAnatomyElement[]} */
+const anatomy = [
+  {
+    name: 'Sheet panel',
+    required: true,
+    description:
+      'Painted surface that rises from the bottom edge and contains the sheet.',
+  },
+  {
+    name: 'Content area',
+    required: true,
+    description:
+      'Scrollable area that presents the caller-provided sheet content.',
+  },
+  {
+    name: 'Handle',
+    required: true,
+    description:
+      'Decorative grab affordance and drag region at the top of the panel.',
+  },
+  {
+    name: 'Scrim',
+    required: false,
+    description:
+      'Backdrop that dims and blocks the page in a scrim-backed presentation.',
+  },
+];
+
 /** @type {import('@astryxdesign/cli/authoring').ComponentDoc} */
 
 export const docs = {
@@ -126,6 +155,7 @@ export const docs = {
     },
   ],
   usage: {
+    anatomy,
     description:
       'A mobile touch surface for filters, actions, forms, and detail views that should rise from the bottom of the viewport; use BottomSheetSwitcher for multi-step flows.',
     bestPractices: [
@@ -277,6 +307,7 @@ export const docsDense = {
   description:
     'mobile touch sheet rising from the bottom edge (native <dialog>): grab handle, opt-in transform-based drag-to-resize snap points (snapPoints: viewport fraction, percent or px length), scrolling area resizes to the snapped visible height on release (a peek stop, a quarter of the sheet or less, keeps the full height and slides instead), Dialog-aligned dismissal purpose (info/form/required), purpose-gated swipe-to-dismiss, fully-expanded Tall visual-viewport mobile-keyboard handling, named height scale, modal (default) or non-modal (hasScrim={false}) presentation',
   usage: {
+    anatomy,
     description:
       'Mobile touch surface for filters, actions, forms, and detail views that should rise from the bottom of the viewport; use BottomSheetSwitcher for multi-step flows.',
     bestPractices: [