ionbase-ui 0.22.0 → 0.25.0

package/dist/components/ConfidenceIndicator.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+const LEVEL_TEXT = {
+    low: 'Low confidence',
+    medium: 'Medium confidence',
+    high: 'High confidence',
+};
+/**
+ * ConfidenceIndicator — how much to trust the thing next to it.
+ *
+ * THERE IS NO PERCENTAGE PROP, AND THERE WILL NOT BE ONE
+ *
+ * "87% confident" reads as a measurement. Almost nowhere is it one: it is
+ * usually a softmax score, a heuristic, or a number a model produced about
+ * itself — none of which are calibrated probabilities, and all of which invite
+ * a reader to treat two digits of precision as real. Three levels cannot
+ * overclaim in that way.
+ *
+ * `basis` IS REQUIRED FOR THE SAME REASON. A level with nothing behind it is
+ * decoration that changes behaviour: people act on "high confidence" whether or
+ * not anything justifies it. Making the justification a required prop is the
+ * only enforcement available here, and it is a type error rather than a policy
+ * — which is the strongest kind this system can offer.
+ *
+ * It renders as text plus a three-bar meter, never the meter alone. The bars
+ * differ in filled COUNT, not only in colour, so the reading survives greyscale
+ * and forced-colours mode.
+ */
+export const ConfidenceIndicator = forwardRef(({ level, basis, label, className, ...rest }, ref) => {
+    const filled = level === 'high' ? 3 : level === 'medium' ? 2 : 1;
+    return (_jsxs("span", { ...rest, ref: ref, "data-level": level, className: ['ion-confidence', `ion-confidence--${level}`, className || '']
+            .filter(Boolean)
+            .join(' '), children: [_jsx("span", { className: "ion-confidence__meter", "aria-hidden": "true", children: [0, 1, 2].map((i) => (_jsx("span", { className: [
+                        'ion-confidence__bar',
+                        i < filled ? 'ion-confidence__bar--on' : '',
+                    ]
+                        .filter(Boolean)
+                        .join(' ') }, i))) }), _jsx("span", { className: "ion-confidence__label", children: label ?? LEVEL_TEXT[level] }), _jsx("span", { className: "ion-confidence__basis", children: basis })] }));
+});
+ConfidenceIndicator.displayName = 'ConfidenceIndicator';
+//# sourceMappingURL=ConfidenceIndicator.js.map

package/dist/components/ConfidenceIndicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConfidenceIndicator.js","sourceRoot":"","sources":["../../src/components/ConfidenceIndicator.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAoB1C,MAAM,UAAU,GAAoC;IAClD,GAAG,EAAE,gBAAgB;IACrB,MAAM,EAAE,mBAAmB;IAC3B,IAAI,EAAE,iBAAiB;CACxB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,UAAU,CAG3C,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,EAAE,EAAE;IACrD,MAAM,MAAM,GAAG,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACjE,OAAO,CACL,mBACM,IAAI,EACR,GAAG,EAAE,GAAG,gBACI,KAAK,EACjB,SAAS,EAAE,CAAC,gBAAgB,EAAE,mBAAmB,KAAK,EAAE,EAAE,SAAS,IAAI,EAAE,CAAC;aACvE,MAAM,CAAC,OAAO,CAAC;aACf,IAAI,CAAC,GAAG,CAAC,aAEZ,eAAM,SAAS,EAAC,uBAAuB,iBAAa,MAAM,YACvD,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CACpB,eAEE,SAAS,EAAE;wBACT,qBAAqB;wBACrB,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,EAAE;qBAC5C;yBACE,MAAM,CAAC,OAAO,CAAC;yBACf,IAAI,CAAC,GAAG,CAAC,IANP,CAAC,CAON,CACH,CAAC,GACG,EACP,eAAM,SAAS,EAAC,uBAAuB,YACpC,KAAK,IAAI,UAAU,CAAC,KAAK,CAAC,GACtB,EACP,eAAM,SAAS,EAAC,uBAAuB,YAAE,KAAK,GAAQ,IACjD,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC"}

package/dist/components/StreamingText.d.ts

@@ -0,0 +1,47 @@
+import React from 'react';
+export interface StreamingTextProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+    /** The text so far. Re-render with more of it; this component appends nothing. */
+    children?: React.ReactNode;
+    /** More is still arriving. Shows the cursor and marks the region busy. */
+    isStreaming?: boolean;
+    /**
+     * Rows of height to hold while the text is short, so the page below does not
+     * climb the screen as tokens arrive. Costs blank space at the start and buys
+     * a layout that does not move under a reader.
+     */
+    minLines?: number;
+    /** Accessible name for the region. */
+    label?: string;
+    /** Hide the trailing cursor. The text still marks itself busy. */
+    hideCursor?: boolean;
+}
+/**
+ * StreamingText — model output arriving a token at a time.
+ *
+ * IT IS NOT A LIVE REGION, AND THAT IS THE WHOLE DESIGN
+ *
+ * The obvious implementation — `aria-live="polite"` on the container — is the
+ * one that makes a screen reader unusable. Every token mutation queues an
+ * announcement, so the user hears the answer re-read, stuttered, dozens of
+ * times, and cannot get ahead of it. `aria-live="off"` is not an oversight
+ * here; it is the accessible choice.
+ *
+ * What it does instead: `aria-busy` while streaming, so assistive tech knows
+ * the region is unsettled and can wait. The text is ordinary readable content
+ * throughout — a screen-reader user navigates into it whenever they want,
+ * exactly like sighted users reading ahead of the cursor.
+ *
+ * ANNOUNCING COMPLETION IS THE CALLER'S CALL, not this component's. Some
+ * surfaces want "response complete"; a chat with ten turns on screen does not
+ * want ten of them. Render your own `role="status"` when you want it.
+ *
+ * THE HEIGHT IS RESERVED, NOT ANIMATED. `minLines` holds space in `lh` units so
+ * the content below stays still. A container that grows token by token drags
+ * the whole page, which is worse for someone using magnification than the wait.
+ *
+ * The cursor is CSS and `aria-hidden`. It stops blinking under
+ * `prefers-reduced-motion` — a blinking element is a WCAG 2.3.1 concern and a
+ * genuine problem for some vestibular and attention conditions.
+ */
+export declare const StreamingText: React.ForwardRefExoticComponent<StreamingTextProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=StreamingText.d.ts.map

package/dist/components/StreamingText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StreamingText.d.ts","sourceRoot":"","sources":["../../src/components/StreamingText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAC9C,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,UAAU,CACX;IACC,kFAAkF;IAClF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,0EAA0E;IAC1E,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sCAAsC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kEAAkE;IAClE,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,eAAO,MAAM,aAAa,2FA4CzB,CAAC"}

package/dist/components/StreamingText.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+/**
+ * StreamingText — model output arriving a token at a time.
+ *
+ * IT IS NOT A LIVE REGION, AND THAT IS THE WHOLE DESIGN
+ *
+ * The obvious implementation — `aria-live="polite"` on the container — is the
+ * one that makes a screen reader unusable. Every token mutation queues an
+ * announcement, so the user hears the answer re-read, stuttered, dozens of
+ * times, and cannot get ahead of it. `aria-live="off"` is not an oversight
+ * here; it is the accessible choice.
+ *
+ * What it does instead: `aria-busy` while streaming, so assistive tech knows
+ * the region is unsettled and can wait. The text is ordinary readable content
+ * throughout — a screen-reader user navigates into it whenever they want,
+ * exactly like sighted users reading ahead of the cursor.
+ *
+ * ANNOUNCING COMPLETION IS THE CALLER'S CALL, not this component's. Some
+ * surfaces want "response complete"; a chat with ten turns on screen does not
+ * want ten of them. Render your own `role="status"` when you want it.
+ *
+ * THE HEIGHT IS RESERVED, NOT ANIMATED. `minLines` holds space in `lh` units so
+ * the content below stays still. A container that grows token by token drags
+ * the whole page, which is worse for someone using magnification than the wait.
+ *
+ * The cursor is CSS and `aria-hidden`. It stops blinking under
+ * `prefers-reduced-motion` — a blinking element is a WCAG 2.3.1 concern and a
+ * genuine problem for some vestibular and attention conditions.
+ */
+export const StreamingText = forwardRef(({ children, isStreaming = false, minLines, label, hideCursor = false, className, style, ...rest }, ref) => (_jsxs("div", { ...rest, ref: ref, "aria-busy": isStreaming || undefined, "aria-live": "off", "aria-label": label, role: label ? 'region' : undefined, "data-streaming": isStreaming || undefined, style: minLines
+        ? {
+            '--ion-streaming-min-lines': minLines,
+            ...style,
+        }
+        : style, className: [
+        'ion-streaming-text',
+        minLines ? 'ion-streaming-text--reserved' : '',
+        className || '',
+    ]
+        .filter(Boolean)
+        .join(' '), children: [children, isStreaming && !hideCursor && (_jsx("span", { className: "ion-streaming-text__cursor", "aria-hidden": "true" }))] })));
+StreamingText.displayName = 'StreamingText';
+//# sourceMappingURL=StreamingText.js.map

package/dist/components/StreamingText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StreamingText.js","sourceRoot":"","sources":["../../src/components/StreamingText.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAsB1C;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,UAAU,CACrC,CACE,EACE,QAAQ,EACR,WAAW,GAAG,KAAK,EACnB,QAAQ,EACR,KAAK,EACL,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EACD,GAAG,EACH,EAAE,CAAC,CACH,kBACM,IAAI,EACR,GAAG,EAAE,GAAG,eACG,WAAW,IAAI,SAAS,eACzB,KAAK,gBACH,KAAK,EACjB,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,oBAClB,WAAW,IAAI,SAAS,EACxC,KAAK,EACH,QAAQ;QACN,CAAC,CAAE;YACC,2BAA2B,EAAE,QAAQ;YACrC,GAAG,KAAK;SACe;QAC3B,CAAC,CAAC,KAAK,EAEX,SAAS,EAAE;QACT,oBAAoB;QACpB,QAAQ,CAAC,CAAC,CAAC,8BAA8B,CAAC,CAAC,CAAC,EAAE;QAC9C,SAAS,IAAI,EAAE;KAChB;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,aAEX,QAAQ,EACR,WAAW,IAAI,CAAC,UAAU,IAAI,CAC7B,eAAM,SAAS,EAAC,4BAA4B,iBAAa,MAAM,GAAG,CACnE,IACG,CACP,CACF,CAAC;AAEF,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC"}

package/dist/components/index.d.ts

@@ -46,4 +46,16 @@ export { ScrollProgress } from './ScrollProgress.js';
 export type { ScrollProgressProps, ScrollProgressSection, } from './ScrollProgress.js';
 export { FullCard } from './FullCard.js';
 export type { FullCardProps, FullCardAlignment, FullCardHeadingLevel, } from './FullCard.js';
+export { AgentStop } from './AgentStop.js';
+export type { AgentStopProps, AgentStopSize } from './AgentStop.js';
+export { ApprovalGate } from './ApprovalGate.js';
+export type { ApprovalGateProps, ApprovalGateRisk, ApprovalGateStatus, } from './ApprovalGate.js';
+export { StreamingText } from './StreamingText.js';
+export type { StreamingTextProps } from './StreamingText.js';
+export { AgentActivity, AgentActivityStep } from './AgentActivity.js';
+export type { AgentActivityProps, AgentActivityStepProps, AgentActivityStatus, } from './AgentActivity.js';
+export { Citation, CitationList, CitationListItem } from './Citation.js';
+export type { CitationProps, CitationListProps, CitationListItemProps, } from './Citation.js';
+export { ConfidenceIndicator } from './ConfidenceIndicator.js';
+export type { ConfidenceIndicatorProps, ConfidenceLevel, } from './ConfidenceIndicator.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"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"}

package/dist/components/index.js

@@ -22,4 +22,10 @@ export { NavItem } from './NavItem.js';
 export { Table, TableHead, TableBody, TableRow, TableCell } from './Table.js';
 export { ScrollProgress } from './ScrollProgress.js';
 export { FullCard } from './FullCard.js';
+export { AgentStop } from './AgentStop.js';
+export { ApprovalGate } from './ApprovalGate.js';
+export { StreamingText } from './StreamingText.js';
+export { AgentActivity, AgentActivityStep } from './AgentActivity.js';
+export { Citation, CitationList, CitationListItem } from './Citation.js';
+export { ConfidenceIndicator } from './ConfidenceIndicator.js';
 //# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAOnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAMzC,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAO/C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE3C,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAOlD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAO3C,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAS5D,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAU9E,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAKrD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAOnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAMzC,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAO/C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE3C,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAOlD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAO3C,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAS5D,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAU9E,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAKrD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAMzC,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE3C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAMjD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAMtE,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAMzE,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC"}

package/dist/figma-descriptions.json

@@ -0,0 +1,147 @@
+{
+  "version": "0.25.0",
+  "begin": "───── CODE · ionbase-ui ─────",
+  "end": "───── end code ─────",
+  "blocks": {
+    "21:461": {
+      "figmaComponent": "Button",
+      "component": "Button",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Button } from 'ionbase-ui';\n<Button variant=\"primary-brand\" size=\"sm\">Label</Button>\n\nPROPERTIES\n  Type → variant: Primary Brand=primary-brand, Primary Neutral=primary-neutral, Primary Soft=primary-soft, Secondary=secondary, Tertiary=tertiary, Destructive=destructive, Success=success\n  Size → size: Small=sm, Medium=md, Large=lg, XLarge=xl\n  State → isDisabled (Disabled only)\n  Label → children\n  Leading Icon → startIcon\n  Trailing Icon → endIcon\n  Show Leading Icon → startIcon\n  Show Trailing Icon → endIcon\n\nNOTES\n  State: Default, Hover, Pressed and Focus are CSS and React Aria — :hover, :focus-visible, data-pressed — not props. Only Disabled is one.\n  Leading Icon: wrap in Icon; omit Icon's label, the button text names it\n  Trailing Icon: same\n  Show Leading Icon: an absent prop is the switch — React needs no Show boolean, so false means omit startIcon\n  Show Trailing Icon: same\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/button/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "623:151": {
+      "figmaComponent": "Icon Button",
+      "component": "Button",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Button } from 'ionbase-ui';\n<Button variant=\"primary-brand\" size=\"sm\" aria-label=\"…\" />\n\nPROPERTIES\n  Type → variant: Primary Brand=primary-brand, Primary Neutral=primary-neutral, Primary Soft=primary-soft, Secondary=secondary, Tertiary=tertiary, Destructive=destructive, Success=success\n  Size → size: Small=sm, Medium=md, Large=lg, XLarge=xl\n  State → isDisabled (Disabled only)\n  Icon → startIcon\n\nNot a separate component in code: an icon-only Button. It is the one case where aria-label is required, because there is no text to name it.\n\nNOTES\n  State: as Button\n  Icon: with Icon's own label omitted — the Button's aria-label carries the name\n  Shape: Figma draws a square and a circle variant; code has no shape prop. A round icon button is a className, not an API.\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/button/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "80:275": {
+      "figmaComponent": "Input",
+      "component": "Input",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Input } from 'ionbase-ui';\n<Input size=\"lg\" label=\"…\" />\n\nPROPERTIES\n  Size → size: Small=sm, Medium=md, Large=lg\n  State → isInvalid (Invalid only)\n  Value → value\n  Leading Icon → leadingIcon\n  Trailing Icon → trailingIcon\n  Show Leading Icon → leadingIcon\n  Show Trailing Icon → trailingIcon\n\nNOTES\n  State: Hover, Focus and Filled are CSS or content. Disabled is isDisabled, Read-only is isReadOnly — both react-aria props rather than this axis.\n  Value: or defaultValue when uncontrolled; Figma's text is placeholder content, not necessarily a value\n  Show Leading Icon: false means omit the prop\n  Show Trailing Icon: false means omit the prop\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/input/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "80:372": {
+      "figmaComponent": "Input/Phone",
+      "component": "PhoneInput",
+      "block": "───── CODE · ionbase-ui ─────\nimport { PhoneInput } from 'ionbase-ui';\n<PhoneInput size=\"lg\" label=\"…\" />\n\nPROPERTIES\n  Size → size: Small=sm, Medium=md, Large=lg\n  Dial Code → dialCode\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/phone-input/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "82:379": {
+      "figmaComponent": "Select",
+      "component": "Select",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Select } from 'ionbase-ui';\n<Select size=\"lg\" label=\"…\" />\n\nPROPERTIES\n  Size → size: Small=sm, Medium=md, Large=lg\n  State → isInvalid (Invalid only)\n  Value → placeholder\n\nNOTES\n  State: Hover, Focus and Filled are CSS or content; Disabled is isDisabled\n  Value: Figma's text is the collapsed display value. In code that is `placeholder` when nothing is chosen; once something is, the label comes from the `options` array.\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/select/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "87:350": {
+      "figmaComponent": "Checkbox",
+      "component": "Checkbox",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Checkbox } from 'ionbase-ui';\n<Checkbox size=\"sm\" intent=\"brand\">Label</Checkbox>\n\nPROPERTIES\n  Size → size: Small=sm, Medium=md, Large=lg\n  Color → intent: Brand=brand, Neutral=neutral, Danger=danger\n  State → isIndeterminate (Indeterminate, Indeterminate-disabled only)\n  Label → children\n  Show Label → children\n\nNOTES\n  State: Checked is `checked`/`defaultChecked`, and the -disabled halves are isDisabled. One Figma axis, three code props, which is why it is not a single mapping.\n  Show Label: false means a bare box — and then aria-label becomes required\n  Focused: a drawn focus ring. In code it is :focus-visible, which the browser owns.\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/checkbox/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "89:314": {
+      "figmaComponent": "Radio",
+      "component": "Radio",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Radio } from 'ionbase-ui';\n<Radio size=\"lg\" intent=\"brand\" value={…}>Label</Radio>\n\nPROPERTIES\n  Size → size: Small=sm, Medium=md, Large=lg\n  Color → intent: Brand=brand, Neutral=neutral, Danger=danger\n  Label → children\n  Show Label → children\n\nNOTES\n  State: Selected/Unselected is the RadioGroup's value, not a prop on the Radio — a radio cannot own its own selection\n  Show Label: false means aria-label is required\n  Focused: drawn focus ring; :focus-visible in code\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/radio/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "88:323": {
+      "figmaComponent": "Toggle",
+      "component": "Toggle",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Toggle } from 'ionbase-ui';\n<Toggle size=\"sm\" intent=\"brand\">Label</Toggle>\n\nPROPERTIES\n  Size → size: Small=sm, Medium=md, Large=lg\n  Color → intent: Brand=brand, Neutral=neutral, Danger=danger\n  Label → children\n  Show Label → children\n\nNOTES\n  State: On/Off is `checked`/`defaultChecked` on the underlying input, not a Toggle prop\n  Show Label: false means aria-label is required\n  Focused: drawn focus ring; :focus-visible in code\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/toggle/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "152:73": {
+      "figmaComponent": "Badge",
+      "component": "Badge",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Badge } from 'ionbase-ui';\n<Badge intent=\"neutral\">Label</Badge>\n\nPROPERTIES\n  Intent → intent: Neutral=neutral, Primary=primary, Success=success, Warning=warning, Error=error, Information=information\n  Label → children\n  Show Label → children\n  Show Dot → dot\n  Show Icon → icon\n  Swap Icon → icon\n\nNOTES\n  Show Icon: false means omit icon; dot wins when both are set\n  Size: Figma draws three sizes; code has no size prop. Badge inherits its type from the text it labels — the same call Link makes.\n  Shape: Pill and Rounded are one radius token apart and code ships the pill only. Add the prop when a real screen needs both, not before.\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/badge/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "812:1902": {
+      "figmaComponent": "Alert",
+      "component": "Alert",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Alert } from 'ionbase-ui';\n<Alert intent=\"information\" emphasis=\"subtle\" layout=\"inline\">Label</Alert>\n\nPROPERTIES\n  Intent → intent: Neutral=neutral, Primary=primary, Success=success, Warning=warning, Error=error, Information=information\n  Emphasis → emphasis: Subtle=subtle, Solid=solid\n  Layout → layout: Inline=inline, Banner=banner\n  Title → title\n  Show Title → title\n  Message → children\n  Show Icon → hideIcon\n  Show Dismiss → onDismiss\n  Show Actions → actions\n\nNOTES\n  Show Title: false means omit title\n  Show Icon: inverted — Figma's Show Icon false is hideIcon true\n  Show Dismiss: the dismiss button appears when a handler is passed; there is no boolean\n  Show Actions: an absent prop is the switch\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/alert/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "820:1655": {
+      "figmaComponent": "Toast",
+      "component": "Toast",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Toast } from 'ionbase-ui';\n<Toast intent=\"information\" onDismiss={…} id={…} />\n\nPROPERTIES\n  Intent → intent: Neutral=neutral, Primary=primary, Success=success, Warning=warning, Error=error, Information=information\n  Title → title\n  Show Title → title\n  Message → message\n  Show Message → message\n  Show Action → action\n  Show Dismiss → dismissLabel\n\nNOTES\n  Show Action: one action only — a second belongs in a Modal\n  Show Dismiss: the dismiss control is always rendered; only its label is configurable\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/toast/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "774:1516": {
+      "figmaComponent": "Link",
+      "component": "Link",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Link } from 'ionbase-ui';\n<Link variant=\"inline\">Label</Link>\n\nPROPERTIES\n  Type → variant: Inline=inline, Standalone=standalone\n  State → isDisabled (Disabled only)\n  Label → children\n  Leading Icon → startIcon\n  Trailing Icon → endIcon\n  Show Leading Icon → startIcon\n  Show Trailing Icon → endIcon\n\nNOTES\n  State: Hover and Focus are CSS; Visited is :visited, which no prop can set\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/link/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "53:13": {
+      "figmaComponent": "Nav Item",
+      "component": "NavItem",
+      "block": "───── CODE · ionbase-ui ─────\nimport { NavItem } from 'ionbase-ui';\n<NavItem>Label</NavItem>\n\nPROPERTIES\n  Label → children\n  Icon → icon\n  Show Chevron → showChevron\n\nNOTES\n  State: Default and Hover are CSS and React Aria's useHover, not props\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/nav-item/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "82:306": {
+      "figmaComponent": "Menu",
+      "component": "Menu",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Menu } from 'ionbase-ui';\n<Menu />\n\nNOTES\n  Type: Single and Multi describe how many items may be selected, which is the caller's state. Menu renders the surface and holds no selection of its own.\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/menu/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "639:2634": {
+      "figmaComponent": "Menu Item",
+      "component": "MenuItem",
+      "block": "───── CODE · ionbase-ui ─────\nimport { MenuItem } from 'ionbase-ui';\n<MenuItem>Label</MenuItem>\n\nPROPERTIES\n  Status → isSelected (Selected, Selected Primary only)\n  Text → children\n  Show Icon → icon\n  Select Icon → icon\n\nNOTES\n  Status: Hover is CSS. Selected Primary is a second selected styling Figma draws and code does not yet ship.\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/menu-item/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "157:126": {
+      "figmaComponent": "Tabs",
+      "component": "Tabs",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Tabs } from 'ionbase-ui';\n<Tabs type=\"pill\" orientation=\"horizontal\" aria-label=\"…\" />\n\nPROPERTIES\n  Type → type: Pill=pill, Underline=underline\n  Orientation → orientation: Horizontal=horizontal, Vertical=vertical\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/tabs/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "156:259": {
+      "figmaComponent": "Tabs Item",
+      "component": "TabItem",
+      "block": "───── CODE · ionbase-ui ─────\nimport { TabItem } from 'ionbase-ui';\n<TabItem key=\"billing\" title=\"Billing\">Panel content</TabItem>\n\nTabItem is a collection item and takes no props of its own. Type, Size and State belong to the parent Tabs or to its selection state, which is why almost everything here is ignored rather than mapped.\n\nNOTES\n  Label: TabItem's label is its `title` collection prop. It is not a typed prop the TypeScript checker can see, so there is nothing here to verify against — see TabItem's contract.\n  Type: set on the parent Tabs, not per item\n  Size: set on the parent Tabs, not per item\n  State: selection is the Tabs collection's state; Disabled is disabledKeys on Tabs\n  Show Label: a tab without a label is a tab that cannot be named\n  Show Leading Icon: not yet in the code component\n  Leading Icon: not yet in the code component\n  Show Trailing: not yet in the code component\n  Trailing: not yet in the code component\n  Focused: drawn focus ring; :focus-visible in code\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/tab-item/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "174:103": {
+      "figmaComponent": "Table Cell",
+      "component": "TableCell",
+      "block": "───── CODE · ionbase-ui ─────\nimport { TableCell } from 'ionbase-ui';\n<TableCell align=\"leading\" />\n\nPROPERTIES\n  Type → header (Header only)\n  Align → align: Leading=leading, Trailing=trailing\n  Show Divider → showDivider\n  Content → children\n  Show Content → children\n\nNOTES\n  Type: Body is the default <td>\n  Density: density is set once on Table and reaches the cell through CSS — a per-cell prop could disagree with its own table\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/table-cell/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "175:605": {
+      "figmaComponent": "Table Row",
+      "component": "TableRow",
+      "block": "───── CODE · ionbase-ui ─────\nimport { TableRow } from 'ionbase-ui';\n<TableRow />\n\nPROPERTIES\n  State → isSelected (Selected, Selected-Hover only)\n  Show Selection → selection\n\nNOTES\n  State: Hover is CSS\n  Show Selection: takes the Checkbox's own props, not a boolean — a selectable row needs checked/onChange wiring\n  Density: set once on Table; see Table Cell\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/table-row/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "74:164": {
+      "figmaComponent": "Avatar",
+      "component": "Avatar",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Avatar } from 'ionbase-ui';\n<Avatar size=\"lg\" shape=\"circle\" />\n\nPROPERTIES\n  Size → size: Mini=mini, Small=sm, Medium=md, Large=lg\n  Shape → shape: Circle=circle, Square=square\n  Type → src (Image only)\n  Initials → initials\n  Icon → icon\n\nNOTES\n  Type: code picks by precedence rather than a type prop: src, then initials, then icon. Character means pass initials, Icon means pass icon.\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/avatar/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "74:279": {
+      "figmaComponent": "Avatar Group",
+      "component": "AvatarGroup",
+      "block": "───── CODE · ionbase-ui ─────\nimport { AvatarGroup } from 'ionbase-ui';\n<AvatarGroup size=\"lg\" shape=\"circle\" />\n\nPROPERTIES\n  Size → size: Mini=mini, Small=sm, Medium=md, Large=lg\n  Shape → shape: Circle=circle, Square=square\n  Show Overflow → max\n  Show Avatar 3 → children\n  Show Avatar 4 → children\n\nNOTES\n  Show Overflow: the +N avatar appears when children exceed max\n  Show Avatar 3: Figma needs a boolean per slot; React just renders fewer children\n  Show Avatar 4: same\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/avatar-group/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "126:22724": {
+      "figmaComponent": "Border",
+      "component": "Divider",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Divider } from 'ionbase-ui';\n<Divider orientation=\"vertical\" />\n\nPROPERTIES\n  Style → orientation: Horizontal=horizontal, Vertical=vertical\n\nFigma calls it Border; the code component is Divider, because it renders an <hr> and an <hr> is a thematic break rather than an edge.\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/divider/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "52:21369": {
+      "figmaComponent": "Logo-Ionbase",
+      "component": "Logo",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Logo } from 'ionbase-ui';\n<Logo size=\"sm\" wordmark=\"vector\" />\n\nPROPERTIES\n  Size → size: Small=sm, Large=lg\n  Type → wordmark: Logo=vector, Icon=text\n\nNOTES\n  Type: the names invert: Figma's Logo is the serif vector wordmark, Figma's Icon is live Host Grotesk text\n  Property: the Name axis renders placeholder text in an unbound colour — leftover debug content, not a real asset. LogoMark covers the no-wordmark case.\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/logo/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "792:1537": {
+      "figmaComponent": "Modal",
+      "component": "Modal",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Modal } from 'ionbase-ui';\n<Modal size=\"sm\" align=\"left\" title={…} />\n\nPROPERTIES\n  Size → size: Small=sm, Medium=md, Large=lg, Fullscreen=fullscreen\n  Align → align: Left=left, Center=center\n  Title → title\n  Description → description\n  Show Description → description\n  Show Close → showClose\n  Show Body → children\n  Show Footer → footer\n  Show Media → media\n  Media → media\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/modal/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "825:1853": {
+      "figmaComponent": "Popover",
+      "component": "Popover",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Popover } from 'ionbase-ui';\n<Popover placement=\"bottom\" size=\"sm\">…</Popover>\n\nPROPERTIES\n  Placement → placement: Top=top, Bottom=bottom, Left=left, Right=right\n  Size → size: Small=sm, Medium=md, Large=lg\n  Title → title\n  Show Header → title\n  Body → content\n  Show Body → content\n  Show Close → showClose\n  Show Footer → footer\n  Show Arrow → hideArrow\n\nNOTES\n  Show Arrow: inverted — Show Arrow false is hideArrow true\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/popover/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "801:68": {
+      "figmaComponent": "Tooltip",
+      "component": "Tooltip",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Tooltip } from 'ionbase-ui';\n<Tooltip placement=\"top\" label={…}>…</Tooltip>\n\nPROPERTIES\n  Placement → placement: Top=top, Bottom=bottom, Left=left, Right=right\n  Label → label\n  Title → title\n  Show Title → title\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/tooltip/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "592:857": {
+      "figmaComponent": "Full Card",
+      "component": "FullCard",
+      "block": "───── CODE · ionbase-ui ─────\nimport { FullCard } from 'ionbase-ui';\n<FullCard alignment=\"right\" headline={…} />\n\nPROPERTIES\n  Row Reverse → alignment: True=left, False=right\n  Headline → headline\n  Description → description\n  Show Description → description\n  Eyebrow → eyebrow\n  Show Eyebrow → eyebrow\n  Actions → actions\n  Show Actions → actions\n  Media → media\n\nNOTES\n  Row Reverse: Figma's boolean reverses the row; the code prop names which side the MEDIA sits on\n  Media: pass the screenshot itself — the component draws the frame\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/full-card/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    },
+    "69:335": {
+      "figmaComponent": "Header",
+      "component": "Header",
+      "block": "───── CODE · ionbase-ui ─────\nimport { Header } from 'ionbase-ui';\n<Header />\n\nPROPERTIES\n  Device → open (Mobile-Open, Mobile-Closed only)\n  Center Slot → center\n  End Slot → end\n  Show Center Slot → center\n  Show End Slot → end\n\nNOTES\n  Device: Figma spells one four-way axis; code splits it in two. Desktop/Tablet/Mobile is a media query the browser already answers, and only Open/Closed is a prop.\n  End Slot: a duplicate slot in the Figma component\n\nFull contract: https://raza-ahmed.github.io/ionbase-design-system/components/header/index.html.md\nGenerated from ionbase-ui@0.25.0. Edit the code, not this block.\n───── end code ─────"
+    }
+  }
+}

package/dist/figma-map.json

@@ -1,6 +1,6 @@
 {
   "package": "ionbase-ui",
-  "version": "0.22.0",
+  "version": "0.25.0",
   "figmaFile": "gaLbGd0QNb1fUl6BjSpfBA",
   "figmaExported": "2026-08-21",
   "usage": "Given a Figma node id or component name, look it up here for the React component, its import, and how each Figma property maps onto a real prop. Every mapping is verified against both the Figma export and the TypeScript API on each build.",
@@ -598,6 +598,7 @@
       "import": "import { TabItem } from 'ionbase-ui';",
       "docs": "components/tab-item/index.html.md",
       "note": "TabItem is a collection item and takes no props of its own. Type, Size and State belong to the parent Tabs or to its selection state, which is why almost everything here is ignored rather than mapped.",
+      "example": "<TabItem key=\"billing\" title=\"Billing\">Panel content</TabItem>",
       "props": {
         "Label#156:216": {
           "ignore": "TabItem's label is its `title` collection prop. It is not a typed prop the TypeScript checker can see, so there is nothing here to verify against — see TabItem's contract."
@@ -1613,6 +1614,7 @@
       "import": "import { TabItem } from 'ionbase-ui';",
       "docs": "components/tab-item/index.html.md",
       "note": "TabItem is a collection item and takes no props of its own. Type, Size and State belong to the parent Tabs or to its selection state, which is why almost everything here is ignored rather than mapped.",
+      "example": "<TabItem key=\"billing\" title=\"Billing\">Panel content</TabItem>",
       "props": {
         "Label#156:216": {
           "ignore": "TabItem's label is its `title` collection prop. It is not a typed prop the TypeScript checker can see, so there is nothing here to verify against — see TabItem's contract."

package/dist/meta/AgentActivity.json

@@ -0,0 +1,103 @@
+{
+  "name": "AgentActivity",
+  "source": "src/components/AgentActivity.tsx",
+  "propsType": "AgentActivityProps",
+  "description": "AgentActivity — what the agent is doing, in plain language.\n\nAn ordered list, because the steps happened in an order and a screen reader\nshould say \"3 of 7\". Not a log viewer: this is the account a person reads to\ndecide whether to let the run continue, so the text belongs in their\nlanguage — \"Searched the invoice archive\", not `searchIndex(q, {limit:50})`.\n\nSTATUS IS NEVER CARRIED BY THE ICON ALONE. Every step renders its status as\ntext as well as a glyph. The glyphs differ in shape rather than only in\ncolour, so the list survives greyscale, colour blindness and forced-colours\nmode — WCAG 1.4.1, which a row of coloured dots fails outright.\n\nONE POLITE ANNOUNCEMENT PER STEP, not one per render. The active step's text\nis announced when it changes, so a user who is not watching still knows where\nthe run has got to. Watching the DOM instead would re-announce on every\nunrelated update, which is the failure mode that makes people turn logs off.",
+  "import": "import { AgentActivity } from 'ionbase-ui';",
+  "status": "stable",
+  "summary": "An ordered, plain-language log of what the agent is doing. Status is text and shape, never colour alone.",
+  "useWhen": [
+    "a run takes long enough that the user needs to know where it has got to",
+    "a person will decide whether to let it continue — which means they need to read what it did"
+  ],
+  "useInstead": [
+    {
+      "when": "the output is prose rather than steps",
+      "use": "StreamingText"
+    },
+    {
+      "when": "you need a decision, not a report",
+      "use": "ApprovalGate"
+    },
+    {
+      "when": "it is one finished outcome",
+      "use": "Alert"
+    }
+  ],
+  "composition": {
+    "order": [
+      "AgentActivity",
+      "AgentActivityStep"
+    ],
+    "note": "An <ol>, so a screen reader can say \"3 of 7\" and the order is structural rather than typed into each row.",
+    "example": "<AgentActivity><AgentActivityStep status=\"done\">Searched the invoice archive</AgentActivityStep><AgentActivityStep status=\"active\">Reading 12 matches</AgentActivityStep></AgentActivity>"
+  },
+  "a11y": {
+    "role": "list",
+    "guarantees": [
+      "every step renders its status as visually hidden text as well as a glyph, and the glyphs differ in shape rather than only in colour — a row of coloured dots fails WCAG 1.4.1 outright",
+      "the active step is announced once, when it changes, in a polite live region",
+      "the active step's spinner stops under `prefers-reduced-motion`"
+    ],
+    "requires": [
+      "step text in the user's language — \"Searched the invoice archive\", not a function signature",
+      "`announceActive={false}` when several logs are on screen, or they narrate over each other"
+    ],
+    "notes": [
+      "The active step is read out of the children rather than taken as a prop. Two sources for one fact is how they come to disagree."
+    ]
+  },
+  "antiPatterns": [
+    {
+      "dont": "raw tool calls or JSON as the step label",
+      "why": "this is the account a person reads to decide whether to let the run continue"
+    },
+    {
+      "dont": "more than one step with `status=\"active\"`",
+      "why": "the announcement names one thing, and two claims about what is happening now cannot both be true"
+    },
+    {
+      "dont": "several announcing logs on one screen",
+      "do": "`announceActive={false}` on all but one",
+      "why": "they interrupt each other and the user turns the whole thing off"
+    }
+  ],
+  "stylesheet": "src/styles/agent-activity.css",
+  "tokens": [
+    "--font-family-sans",
+    "--icon-error",
+    "--icon-primary",
+    "--icon-size-sm",
+    "--icon-success",
+    "--icon-tertiary",
+    "--spacing-2",
+    "--spacing-8",
+    "--text-default",
+    "--text-error",
+    "--text-secondary",
+    "--text-tertiary",
+    "--type-body-sm",
+    "--type-body-sm-line-height",
+    "--type-caption",
+    "--type-caption-line-height"
+  ],
+  "props": {
+    "children": {
+      "type": "React.ReactNode",
+      "required": false,
+      "origin": "own"
+    },
+    "announceActive": {
+      "type": "boolean | undefined",
+      "required": false,
+      "origin": "own",
+      "description": "Announce the step that just became active, once, in a polite live region.\n\nOn by default because the whole point of an activity log is knowing what\nthe agent is doing without watching it. Turn it off when several logs are\non screen at once, or they narrate over each other."
+    }
+  },
+  "propCounts": {
+    "own": 2,
+    "aria": 0,
+    "dom": 277,
+    "other": 0
+  }
+}

package/dist/meta/AgentActivityStep.json

@@ -0,0 +1,117 @@
+{
+  "name": "AgentActivityStep",
+  "source": "src/components/AgentActivity.tsx",
+  "propsType": "AgentActivityStepProps",
+  "import": "import { AgentActivityStep } from 'ionbase-ui';",
+  "status": "stable",
+  "summary": "One step in an activity log: what happened, in the user's language, with a status carried by shape and text.",
+  "useWhen": [
+    "a child of AgentActivity — it is not usable elsewhere"
+  ],
+  "useInstead": [
+    {
+      "when": "it is a row in a dropdown",
+      "use": "MenuItem"
+    },
+    {
+      "when": "it is a data row",
+      "use": "TableRow"
+    }
+  ],
+  "variants": {
+    "status": {
+      "pending": {
+        "use": "the default — queued, not started"
+      },
+      "active": {
+        "use": "happening now. Only one step should carry it"
+      },
+      "done": {
+        "use": "finished successfully"
+      },
+      "failed": {
+        "use": "did not finish. Say why in `detail`"
+      },
+      "skipped": {
+        "use": "deliberately not run — a branch not taken, a cached result"
+      }
+    }
+  },
+  "slots": {
+    "children": {
+      "accepts": "text",
+      "note": "the step in plain language"
+    },
+    "detail": {
+      "accepts": "text",
+      "note": "the result, a count, a tool name — whatever makes the step checkable"
+    }
+  },
+  "a11y": {
+    "guarantees": [
+      "the status name is rendered as visually hidden text, so it is never carried by the glyph's colour alone",
+      "each status has a differently shaped glyph, which survives greyscale and forced-colours mode"
+    ]
+  },
+  "antiPatterns": [
+    {
+      "dont": "`failed` with no `detail`",
+      "why": "a failure the reader cannot diagnose is just a red mark"
+    },
+    {
+      "dont": "using it outside AgentActivity",
+      "why": "it renders an <li>, which is only valid inside a list"
+    }
+  ],
+  "stylesheet": "src/styles/agent-activity.css",
+  "tokens": [
+    "--font-family-sans",
+    "--icon-error",
+    "--icon-primary",
+    "--icon-size-sm",
+    "--icon-success",
+    "--icon-tertiary",
+    "--spacing-2",
+    "--spacing-8",
+    "--text-default",
+    "--text-error",
+    "--text-secondary",
+    "--text-tertiary",
+    "--type-body-sm",
+    "--type-body-sm-line-height",
+    "--type-caption",
+    "--type-caption-line-height"
+  ],
+  "props": {
+    "children": {
+      "type": "React.ReactNode",
+      "required": false,
+      "origin": "own",
+      "description": "What the agent did, in the user's language. Not a function name."
+    },
+    "status": {
+      "type": "AgentActivityStatus | undefined",
+      "required": false,
+      "origin": "own",
+      "values": [
+        "pending",
+        "active",
+        "done",
+        "failed",
+        "skipped"
+      ]
+    },
+    "detail": {
+      "type": "React.ReactNode",
+      "required": false,
+      "origin": "own",
+      "description": "The result, a tool name, a count — whatever makes the step checkable."
+    }
+  },
+  "propCounts": {
+    "own": 3,
+    "aria": 0,
+    "dom": 278,
+    "other": 0
+  }
+}