agentic-assistant 0.6.0 → 0.7.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # Changelog
 
+## 0.7.0
+
+Changed
+
+- The chat panel has the agentic-design 0.5 calm look. Cards and messages have soft borders. The text field, buttons, approval prompt, and warnings keep a strong edge. The panel reads the `--agd-*` space, radius, type, control-size, and shadow tokens, each with a fallback. The focus ring is 2px (was 3px). A disabled button has a dashed edge.
+- BREAKING: panel class names use the `agd-` prefix. Your `.aa-*` overrides stop applying without an error. Migration: `.aa-panel` is now `.agd-assistant`, and each part is `.agd-assistant__<part>` (`.aa-button` is `.agd-assistant__button`, `.aa-primary` is `.agd-assistant__primary`). Rename any override in your own CSS. The `--aa-*` variables keep their names. New variables: `--aa-edge` sets the strong edge, `--aa-border` is now the soft border, and `--aa-hover-bg`, `--aa-accent-hover`, and `--aa-shadow` set the hover and shadow. If you override `--aa-bg` or `--aa-accent`, also set `--aa-hover-bg` and `--aa-accent-hover`, so hover text stays readable.
+- The label on every part the assistant makes reads "AI-generated" (it read "Machine-made"). It stays visible and is real text, so a screen reader reads it. The `data-machine-made` attribute does not change.
+
+## 0.6.1
+
+Patch. No change to the SDK, CLI or HTTP shape.
+
+Changed
+
+- `agentic-identity` is `^0.8.0`. The lockfile follows. The 0.8.0 additions (`tokens create`, `delegations create`) are not used here.
+- `agentic-design` dev and peer dependency is `^0.5.0`. Version 0.5.0 changes token values only (colors, sizes, radii, shadows). Token names and the `agd-` prefix do not change. This package reads only `--agd-color-*` tokens.
+
 ## 0.6.0
 
 Changed

package/README.md

@@ -118,11 +118,11 @@ import "agentic-assistant/react.css";
 />;
 ```
 
-The panel colors are `agentic-design` tokens (`--agd-color-*`), so load `agentic-design/tokens.css` once, as above. The panel then follows your light or dark theme. Without the tokens the panel uses system colors. Set all `--agd-color-*` tokens or none: a partial set can give a pair that fails contrast. To set your own colors, override the `--aa-*` variables on `.aa-panel`.
+The panel colors are `agentic-design` tokens (`--agd-color-*`), so load `agentic-design/tokens.css` once, as above. The panel also reads the `--agd-*` space, radius, type, control-size, and shadow tokens from the same file. Each one has a fallback. The panel then follows your light or dark theme. Without the tokens the panel uses system colors, and buttons show no hover change. Set all `--agd-color-*` tokens or none: a partial set can give a pair that fails contrast. To set your own colors, override the `--aa-*` variables on `.agd-assistant`. If you override `--aa-bg` or `--aa-accent`, also set `--aa-hover-bg` and `--aa-accent-hover`.
 
-The panel streams the answer, shows each tool call as a card, and shows an approval prompt with the exact arguments. Every message, card, and prompt that the assistant makes carries a visible "Machine-made" label. Tool output is shown as text and never as HTML. The panel does not hold a model, a key, or a gate. It needs `react` 18 or newer.
+The panel streams the answer, shows each tool call as a card, and shows an approval prompt with the exact arguments. Every message, card, and prompt that the assistant makes carries a visible "AI-generated" label. Tool output is shown as text and never as HTML. The panel does not hold a model, a key, or a gate. It needs `react` 18 or newer.
 
-The look comes from plain CSS variables (`--aa-bg`, `--aa-fg`, `--aa-accent`, and others). Set them on `.aa-panel` or a parent. The sheet loads no font, image, or file from another host. A prompt that the run left open (after Stop or an error) is closed and marked expired. Closing the panel stops the run.
+The look comes from plain CSS variables (`--aa-bg`, `--aa-fg`, `--aa-accent`, and others). Set them on `.agd-assistant`. The sheet loads no font, image, or file from another host. A prompt that the run left open (after Stop or an error) is closed and marked expired. Closing the panel stops the run.
 
 ## Use the CLI
 

package/dist/{chunk-UJIYGGF5.js → chunk-BMIWTDEX.js}

@@ -2,12 +2,12 @@ import {
   describeFailure,
   runChat,
   runRemote
-} from "./chunk-WDZUIVU7.js";
+} from "./chunk-RC3FA7MX.js";
 import {
   VERSION,
   provenanceLabel,
   provenanceMarker
-} from "./chunk-4YOTNHWM.js";
+} from "./chunk-VIFRLQO3.js";
 
 // src/mcp-server.ts
 import { Server } from "@modelcontextprotocol/sdk/server/index.js";

package/dist/{chunk-IXOE6XPI.js → chunk-GY5OOKGO.js}

@@ -1,6 +1,6 @@
 import {
   ProviderError
-} from "./chunk-4YOTNHWM.js";
+} from "./chunk-VIFRLQO3.js";
 
 // src/providers/anthropic.ts
 import Anthropic from "@anthropic-ai/sdk";

package/dist/{chunk-4N722U3I.js → chunk-NN5JJFPL.js}

@@ -4,7 +4,7 @@ import {
   hasScope,
   parseScope,
   runAssistant
-} from "./chunk-4YOTNHWM.js";
+} from "./chunk-VIFRLQO3.js";
 
 // src/api.ts
 import { PRINCIPAL_KINDS } from "agentic-identity";

package/dist/{chunk-WDZUIVU7.js → chunk-RC3FA7MX.js}

@@ -5,7 +5,7 @@ import {
   AnthropicProvider,
   checkBaseUrl,
   isLoopback
-} from "./chunk-IXOE6XPI.js";
+} from "./chunk-GY5OOKGO.js";
 import {
   PrincipalError,
   ProviderError,
@@ -17,7 +17,7 @@ import {
   digestCall,
   printable,
   runAssistant
-} from "./chunk-4YOTNHWM.js";
+} from "./chunk-VIFRLQO3.js";
 import {
   AssistantApiError,
   createClient

package/dist/{chunk-4YOTNHWM.js → chunk-VIFRLQO3.js}

@@ -1,6 +1,6 @@
 // src/version.ts
 import { createRequire } from "module";
-var VERSION = true ? "0.6.0" : readPackageVersion();
+var VERSION = true ? "0.7.0" : readPackageVersion();
 
 // src/approvals.ts
 import { createHash, randomUUID } from "crypto";

package/dist/cli.js

@@ -7,15 +7,15 @@ import {
   readTextFile,
   runChat,
   runRemote
-} from "./chunk-WDZUIVU7.js";
+} from "./chunk-RC3FA7MX.js";
 import "./chunk-HYT732TN.js";
-import "./chunk-IXOE6XPI.js";
+import "./chunk-GY5OOKGO.js";
 import {
   TOOL_RISKS,
   VERSION,
   printable,
   provenanceLabel
-} from "./chunk-4YOTNHWM.js";
+} from "./chunk-VIFRLQO3.js";
 import "./chunk-QTIEDY3V.js";
 
 // src/cli.ts
@@ -327,7 +327,7 @@ async function runCli(argv, io = defaultIo()) {
     for (const skip of setup.skipped.slice(0, MAX_SKIPPED_LINES)) io.err(`skipped tool ${oneLine(skip.name, 100)}: ${oneLine(skip.reason, 200)}`);
     if (setup.skipped.length > MAX_SKIPPED_LINES) io.err(`skipped ${setup.skipped.length - MAX_SKIPPED_LINES} more tools`);
     if (parsed.command === "mcp") {
-      const { startAssistantMcp } = await import("./mcp-server-SYJM77VO.js");
+      const { startAssistantMcp } = await import("./mcp-server-SWAWVH77.js");
       await startAssistantMcp(setup, remote, { approve: parsed.allowApprove ?? false });
       return 0;
     }

package/dist/demo.js

@@ -1,15 +1,15 @@
 import {
   createStaticTokenAuth,
   createWorker
-} from "./chunk-4N722U3I.js";
+} from "./chunk-NN5JJFPL.js";
 import {
   AnthropicProvider
-} from "./chunk-IXOE6XPI.js";
+} from "./chunk-GY5OOKGO.js";
 import {
   ToolRegistry,
   VERSION,
   hasScope
-} from "./chunk-4YOTNHWM.js";
+} from "./chunk-VIFRLQO3.js";
 
 // src/demo-page.ts
 var DEMO_CSP = "default-src 'none'; style-src 'unsafe-inline'; script-src 'unsafe-inline'; connect-src 'self'; base-uri 'none'; form-action 'none'; frame-ancestors 'none'";

package/dist/index.js

@@ -1,7 +1,7 @@
 import {
   createAssistantMcpServer,
   startAssistantMcp
-} from "./chunk-UJIYGGF5.js";
+} from "./chunk-BMIWTDEX.js";
 import {
   ConfigError,
   FallbackProvider,
@@ -10,13 +10,13 @@ import {
   connectMcpTools,
   parseTarget,
   runChat
-} from "./chunk-WDZUIVU7.js";
+} from "./chunk-RC3FA7MX.js";
 import "./chunk-HYT732TN.js";
 import {
   AnthropicProvider,
   DEFAULT_ANTHROPIC_MODEL,
   PRICING_CHECKED_ON
-} from "./chunk-IXOE6XPI.js";
+} from "./chunk-GY5OOKGO.js";
 import {
   ACTIONS,
   DATA_NOTICE,
@@ -40,7 +40,7 @@ import {
   provenanceMarker,
   runAssistant,
   scopeCovers
-} from "./chunk-4YOTNHWM.js";
+} from "./chunk-VIFRLQO3.js";
 import "./chunk-QTIEDY3V.js";
 export {
   ACTIONS,

package/dist/{mcp-server-SYJM77VO.js → mcp-server-SWAWVH77.js}

@@ -1,11 +1,11 @@
 import {
   createAssistantMcpServer,
   startAssistantMcp
-} from "./chunk-UJIYGGF5.js";
-import "./chunk-WDZUIVU7.js";
+} from "./chunk-BMIWTDEX.js";
+import "./chunk-RC3FA7MX.js";
 import "./chunk-HYT732TN.js";
-import "./chunk-IXOE6XPI.js";
-import "./chunk-4YOTNHWM.js";
+import "./chunk-GY5OOKGO.js";
+import "./chunk-VIFRLQO3.js";
 import "./chunk-QTIEDY3V.js";
 export {
   createAssistantMcpServer,

package/dist/react.css

@@ -1,13 +1,17 @@
 /* Plain CSS variables. They read the agentic-design tokens (--agd-color-*), so load
-   agentic-design/tokens.css once on the page. Override --aa-* on .aa-panel or a parent to match your app.
+   agentic-design/tokens.css once on the page. Override --aa-* on .agd-assistant to match your app.
    Without the tokens, each variable falls back to a system color, so focus and borders stay visible.
-   Every token pair meets WCAG 2.2 AA contrast in light and dark; src/react/styles.test.ts checks it.
+   The look is calm. Cards have soft borders. The text field, buttons, approval prompt, and warnings have a strong edge.
+   Space, radius, type, control size, and shadow come from the --agd-* tokens. Each has a fallback.
+   Each text, edge, and focus pair meets WCAG 2.2 AA contrast in light and dark; src/react/styles.test.ts checks them.
+   --aa-border is decoration only and is not checked, so do not use it for an edge people must see.
    No remote fonts or images. */
-.aa-panel {
+.agd-assistant {
   --aa-bg: var(--agd-color-surface, Canvas);
   --aa-fg: var(--agd-color-text, CanvasText);
   --aa-muted: var(--agd-color-text-muted, CanvasText);
-  --aa-border: var(--agd-color-border-strong, CanvasText);
+  --aa-border: var(--agd-color-border, CanvasText);
+  --aa-edge: var(--agd-color-border-strong, CanvasText);
   --aa-accent: var(--agd-color-accent, LinkText);
   --aa-accent-fg: var(--agd-color-text-on-accent, Canvas);
   --aa-focus: var(--agd-color-focus, LinkText);
@@ -17,6 +21,9 @@
   --aa-warn-bg: var(--agd-color-warning-subtle, Canvas);
   --aa-warn-fg: var(--agd-color-warning-text, CanvasText);
   --aa-danger: var(--agd-color-danger, LinkText);
+  --aa-hover-bg: var(--agd-color-surface-hover, Canvas);
+  --aa-accent-hover: var(--agd-color-accent-hover, LinkText);
+  --aa-shadow: var(--agd-shadow-raised, none);
 
   display: flex;
   flex-direction: column;
@@ -26,35 +33,39 @@
   background: var(--aa-bg);
   color: var(--aa-fg);
   border: 1px solid var(--aa-border);
-  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+  border-radius: var(--agd-radius-lg, 1rem);
+  font-family: var(--agd-font-family-sans, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
   font-size: 1rem;
-  line-height: 1.5;
+  line-height: var(--agd-line-height-normal, 1.55);
 }
-.aa-panel *, .aa-panel *::before, .aa-panel *::after { box-sizing: border-box; }
-.aa-header { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--aa-border); }
-.aa-title { margin: 0; font-size: 1.125rem; }
-.aa-log { flex: 1; overflow-y: auto; padding: 0.75rem; display: flex; flex-direction: column; gap: 0.75rem; }
-.aa-empty { color: var(--aa-muted); margin: 0; }
-.aa-msg { padding: 0.5rem 0.75rem; border: 1px solid var(--aa-border); border-radius: 0.5rem; }
-.aa-assistant { background: var(--aa-card-bg); }
-.aa-who { margin: 0 0 0.25rem; font-weight: 600; color: var(--aa-muted); }
-.aa-text { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
-.aa-badge { display: inline-block; padding: 0 0.5rem; border-radius: 0.25rem; background: var(--aa-machine-bg); color: var(--aa-machine-fg); font-size: 0.875rem; font-weight: 600; border: 1px solid var(--aa-machine-fg); }
-.aa-card, .aa-approval { padding: 0.5rem 0.75rem; border: 1px solid var(--aa-border); border-radius: 0.5rem; background: var(--aa-card-bg); }
-.aa-card-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
-.aa-status { color: var(--aa-muted); font-weight: 600; }
-.aa-pre { margin: 0.25rem 0 0; padding: 0.5rem; max-height: 12rem; overflow: auto; background: var(--aa-bg); border: 1px solid var(--aa-border); white-space: pre-wrap; overflow-wrap: anywhere; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 0.875rem; }
-.aa-approval { background: var(--aa-warn-bg); color: var(--aa-warn-fg); border-width: 2px; border-color: var(--aa-warn-fg); }
-.aa-approval-title { margin: 0 0 0.25rem; font-size: 1rem; display: flex; align-items: center; gap: 0.5rem; }
-.aa-warn { color: var(--aa-danger); background: var(--aa-bg); padding: 0.25rem 0.5rem; border: 2px solid var(--aa-danger); border-radius: 0.25rem; }
-.aa-notice { margin: 0; padding: 0.5rem 0.75rem; border: 1px solid var(--aa-border); border-radius: 0.5rem; }
-.aa-composer { display: flex; flex-direction: column; gap: 0.5rem; padding: 0.75rem; border-top: 1px solid var(--aa-border); }
-.aa-label { font-weight: 600; }
-.aa-input { width: 100%; resize: vertical; padding: 0.5rem; font: inherit; color: var(--aa-fg); background: var(--aa-bg); border: 1px solid var(--aa-border); border-radius: 0.25rem; }
-.aa-actions { display: flex; gap: 0.5rem; margin-top: 0.5rem; }
-.aa-composer .aa-actions { margin-top: 0; }
-.aa-button { min-height: 2rem; min-width: 2rem; padding: 0.25rem 1rem; font: inherit; font-weight: 600; color: var(--aa-fg); background: var(--aa-bg); border: 2px solid var(--aa-border); border-radius: 0.25rem; cursor: pointer; }
-.aa-button.aa-primary { color: var(--aa-accent-fg); background: var(--aa-accent); border-color: var(--aa-accent); }
-.aa-button:disabled { cursor: not-allowed; opacity: 0.6; }
-.aa-panel :focus-visible { outline: 3px solid var(--aa-focus); outline-offset: 2px; }
-@media (forced-colors: active) { .aa-badge, .aa-button, .aa-approval, .aa-warn { border: 2px solid CanvasText; } }
+.agd-assistant *, .agd-assistant *::before, .agd-assistant *::after { box-sizing: border-box; }
+.agd-assistant__header { display: flex; align-items: center; gap: var(--agd-space-2, 0.5rem); padding: var(--agd-space-3, 0.75rem) var(--agd-space-4, 1rem); border-bottom: 1px solid var(--aa-border); }
+.agd-assistant__title { margin: 0; font-size: var(--agd-font-size-lg, 1.125rem); font-weight: 600; }
+.agd-assistant__log { flex: 1; overflow-y: auto; padding: var(--agd-space-4, 1rem); display: flex; flex-direction: column; gap: var(--agd-space-3, 0.75rem); }
+.agd-assistant__empty { color: var(--aa-muted); margin: 0; }
+/* .agd-assistant__user is a hook for host overrides. It has no style of its own. */
+.agd-assistant__msg { padding: var(--agd-space-3, 0.75rem) var(--agd-space-4, 1rem); border: 1px solid var(--aa-border); border-radius: var(--agd-radius-md, 0.5rem); }
+.agd-assistant__assistant { background: var(--aa-card-bg); }
+.agd-assistant__who { margin: 0 0 var(--agd-space-1, 0.25rem); font-size: var(--agd-font-size-sm, 0.875rem); font-weight: 600; color: var(--aa-muted); }
+.agd-assistant__text { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
+.agd-assistant__badge { display: inline-block; padding: 0 var(--agd-space-2, 0.5rem); border-radius: var(--agd-radius-full, 9999px); background: var(--aa-machine-bg); color: var(--aa-machine-fg); font-size: var(--agd-font-size-xs, 0.75rem); font-weight: 600; line-height: 1.5rem; border: 1px solid transparent; }
+.agd-assistant__card, .agd-assistant__approval { padding: var(--agd-space-3, 0.75rem) var(--agd-space-4, 1rem); border: 1px solid var(--aa-border); border-radius: var(--agd-radius-md, 0.5rem); background: var(--aa-card-bg); }
+.agd-assistant__card-head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--agd-space-2, 0.5rem); }
+.agd-assistant__status { color: var(--aa-muted); font-size: var(--agd-font-size-sm, 0.875rem); font-weight: 600; }
+.agd-assistant__pre { margin: var(--agd-space-1, 0.25rem) 0 0; padding: var(--agd-space-2, 0.5rem); max-height: 12rem; overflow: auto; background: var(--aa-bg); border: 1px solid var(--aa-edge); border-radius: var(--agd-radius-sm, 0.25rem); white-space: pre-wrap; overflow-wrap: anywhere; font-family: var(--agd-font-family-mono, ui-monospace, Menlo, Consolas, monospace); font-size: var(--agd-font-size-sm, 0.875rem); }
+.agd-assistant__approval { background: var(--aa-warn-bg); color: var(--aa-warn-fg); border-width: 2px; border-color: var(--aa-warn-fg); box-shadow: var(--aa-shadow); }
+.agd-assistant__approval-title { margin: 0 0 var(--agd-space-1, 0.25rem); font-size: 1rem; display: flex; align-items: center; gap: var(--agd-space-2, 0.5rem); }
+.agd-assistant__warn { color: var(--aa-danger); background: var(--aa-bg); padding: var(--agd-space-1, 0.25rem) var(--agd-space-2, 0.5rem); border: 2px solid var(--aa-danger); border-radius: var(--agd-radius-sm, 0.25rem); }
+.agd-assistant__notice { margin: 0; padding: var(--agd-space-3, 0.75rem) var(--agd-space-4, 1rem); border: 1px solid var(--aa-border); border-radius: var(--agd-radius-md, 0.5rem); }
+.agd-assistant__composer { display: flex; flex-direction: column; gap: var(--agd-space-2, 0.5rem); padding: var(--agd-space-4, 1rem); border-top: 1px solid var(--aa-border); }
+.agd-assistant__label { font-size: var(--agd-font-size-sm, 0.875rem); font-weight: 600; }
+.agd-assistant__input { width: 100%; resize: vertical; padding: var(--agd-space-2, 0.5rem) var(--agd-space-3, 0.75rem); font: inherit; color: var(--aa-fg); background: var(--aa-bg); border: 1px solid var(--aa-edge); border-radius: var(--agd-radius-md, 0.5rem); }
+.agd-assistant__actions { display: flex; gap: var(--agd-space-2, 0.5rem); margin-top: var(--agd-space-2, 0.5rem); }
+.agd-assistant__composer .agd-assistant__actions { margin-top: 0; }
+.agd-assistant__button { min-height: var(--agd-size-control, 2.25rem); min-width: 2rem; padding: var(--agd-space-1, 0.25rem) var(--agd-space-4, 1rem); font: inherit; font-weight: 600; color: var(--aa-fg); background: var(--aa-bg); border: 1px solid var(--aa-edge); border-radius: var(--agd-radius-md, 0.5rem); cursor: pointer; }
+.agd-assistant__button.agd-assistant__primary { color: var(--aa-accent-fg); background: var(--aa-accent); border-color: var(--aa-accent); }
+.agd-assistant__button:hover:not(:disabled) { background: var(--aa-hover-bg); }
+.agd-assistant__button.agd-assistant__primary:hover:not(:disabled) { background: var(--aa-accent-hover); border-color: var(--aa-accent-hover); }
+.agd-assistant__button:disabled { cursor: not-allowed; opacity: 0.6; border-style: dashed; }
+.agd-assistant :focus-visible { outline: 2px solid var(--aa-focus); outline-offset: 2px; }
+@media (forced-colors: active) { .agd-assistant, .agd-assistant__badge, .agd-assistant__button, .agd-assistant__approval, .agd-assistant__warn, .agd-assistant__msg, .agd-assistant__card { border: 2px solid CanvasText; } }

package/dist/react.js

@@ -149,7 +149,7 @@ function useAssistant(options) {
 // src/react/panel.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
 function MachineMade() {
-  return /* @__PURE__ */ jsx("span", { className: "aa-badge", children: "Machine-made" });
+  return /* @__PURE__ */ jsx("span", { className: "agd-assistant__badge", children: "AI-generated" });
 }
 var pretty = (value) => {
   try {
@@ -167,21 +167,21 @@ var TOOL_STATUS = {
   not_run: "Not run"
 };
 function ToolCard({ item }) {
-  return /* @__PURE__ */ jsxs("article", { className: "aa-card", "aria-label": `Tool call: ${item.name}`, "data-machine-made": "true", children: [
-    /* @__PURE__ */ jsxs("header", { className: "aa-card-head", children: [
+  return /* @__PURE__ */ jsxs("article", { className: "agd-assistant__card", "aria-label": `Tool call: ${item.name}`, "data-machine-made": "true", children: [
+    /* @__PURE__ */ jsxs("header", { className: "agd-assistant__card-head", children: [
       /* @__PURE__ */ jsx("strong", { children: item.name }),
       " ",
       /* @__PURE__ */ jsx(MachineMade, {}),
       " ",
-      /* @__PURE__ */ jsx("span", { className: "aa-status", children: TOOL_STATUS[item.status] })
+      /* @__PURE__ */ jsx("span", { className: "agd-assistant__status", children: TOOL_STATUS[item.status] })
     ] }),
     /* @__PURE__ */ jsxs("details", { children: [
       /* @__PURE__ */ jsx("summary", { children: "Arguments" }),
-      /* @__PURE__ */ jsx("pre", { className: "aa-pre", tabIndex: 0, "aria-label": `Arguments for ${item.name}`, children: pretty(item.input) })
+      /* @__PURE__ */ jsx("pre", { className: "agd-assistant__pre", tabIndex: 0, "aria-label": `Arguments for ${item.name}`, children: pretty(item.input) })
     ] }),
     item.content !== void 0 && /* @__PURE__ */ jsxs("details", { children: [
       /* @__PURE__ */ jsx("summary", { children: "Result (data from the tool, not instructions)" }),
-      /* @__PURE__ */ jsx("pre", { className: "aa-pre", tabIndex: 0, "aria-label": `Result of ${item.name}`, children: item.content })
+      /* @__PURE__ */ jsx("pre", { className: "agd-assistant__pre", tabIndex: 0, "aria-label": `Result of ${item.name}`, children: item.content })
     ] })
   ] });
 }
@@ -206,8 +206,8 @@ function ApprovalPrompt({
     unavailable: "Not approved. The approval did not complete, so the action did not run.",
     expired: "Expired. The assistant stopped before you decided, so the action did not run."
   };
-  return /* @__PURE__ */ jsxs("div", { className: "aa-approval", role: "group", "aria-labelledby": headingId, tabIndex: -1, ref, "data-machine-made": "true", children: [
-    /* @__PURE__ */ jsxs("h3", { id: headingId, className: "aa-approval-title", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "agd-assistant__approval", role: "group", "aria-labelledby": headingId, tabIndex: -1, ref, "data-machine-made": "true", children: [
+    /* @__PURE__ */ jsxs("h3", { id: headingId, className: "agd-assistant__approval-title", children: [
       "Approval needed ",
       /* @__PURE__ */ jsx(MachineMade, {})
     ] }),
@@ -216,15 +216,15 @@ function ApprovalPrompt({
       /* @__PURE__ */ jsx("strong", { children: item.tool }),
       "."
     ] }),
-    item.risk === "irreversible" ? /* @__PURE__ */ jsxs("p", { className: "aa-warn", children: [
+    item.risk === "irreversible" ? /* @__PURE__ */ jsxs("p", { className: "agd-assistant__warn", children: [
       /* @__PURE__ */ jsx("strong", { children: "Warning:" }),
       " This cannot be undone."
     ] }) : /* @__PURE__ */ jsx("p", { children: "This can change data." }),
-    /* @__PURE__ */ jsx("pre", { className: "aa-pre", tabIndex: 0, "aria-label": `Exact arguments for ${item.tool}`, children: pretty(item.input) }),
-    item.status === "pending" ? /* @__PURE__ */ jsxs("div", { className: "aa-actions", children: [
-      /* @__PURE__ */ jsx("button", { type: "button", className: "aa-button aa-primary", disabled: item.busy, "aria-label": `Approve ${item.tool}`, onClick: () => answer(true), children: "Approve" }),
-      /* @__PURE__ */ jsx("button", { type: "button", className: "aa-button", disabled: item.busy, "aria-label": `Decline ${item.tool}`, onClick: () => answer(false), children: "Decline" })
-    ] }) : /* @__PURE__ */ jsx("p", { className: "aa-status", children: outcome[item.status] })
+    /* @__PURE__ */ jsx("pre", { className: "agd-assistant__pre", tabIndex: 0, "aria-label": `Exact arguments for ${item.tool}`, children: pretty(item.input) }),
+    item.status === "pending" ? /* @__PURE__ */ jsxs("div", { className: "agd-assistant__actions", children: [
+      /* @__PURE__ */ jsx("button", { type: "button", className: "agd-assistant__button agd-assistant__primary", disabled: item.busy, "aria-label": `Approve ${item.tool}`, onClick: () => answer(true), children: "Approve" }),
+      /* @__PURE__ */ jsx("button", { type: "button", className: "agd-assistant__button", disabled: item.busy, "aria-label": `Decline ${item.tool}`, onClick: () => answer(false), children: "Decline" })
+    ] }) : /* @__PURE__ */ jsx("p", { className: "agd-assistant__status", children: outcome[item.status] })
   ] });
 }
 function AssistantPanel({ title = "AI assistant", run, decide }) {
@@ -250,15 +250,15 @@ function AssistantPanel({ title = "AI assistant", run, decide }) {
       submit();
     }
   };
-  return /* @__PURE__ */ jsxs("section", { className: "aa-panel", "aria-label": title, children: [
-    /* @__PURE__ */ jsxs("header", { className: "aa-header", children: [
-      /* @__PURE__ */ jsx("h2", { className: "aa-title", children: title }),
+  return /* @__PURE__ */ jsxs("section", { className: "agd-assistant", "aria-label": title, children: [
+    /* @__PURE__ */ jsxs("header", { className: "agd-assistant__header", children: [
+      /* @__PURE__ */ jsx("h2", { className: "agd-assistant__title", children: title }),
       /* @__PURE__ */ jsx(MachineMade, {})
     ] }),
     /* @__PURE__ */ jsxs(
       "div",
       {
-        className: "aa-log",
+        className: "agd-assistant__log",
         role: "log",
         "aria-live": "polite",
         "aria-relevant": "additions text",
@@ -270,28 +270,28 @@ function AssistantPanel({ title = "AI assistant", run, decide }) {
           pinned.current = el.scrollHeight - el.scrollTop - el.clientHeight < 24;
         },
         children: [
-          items.length === 0 && /* @__PURE__ */ jsx("p", { className: "aa-empty", children: "Ask the assistant to help. It acts only with your permissions, and it asks you before a risky action." }),
+          items.length === 0 && /* @__PURE__ */ jsx("p", { className: "agd-assistant__empty", children: "Ask the assistant to help. It acts only with your permissions, and it asks you before a risky action." }),
           items.map((item) => {
             switch (item.kind) {
               case "user":
-                return /* @__PURE__ */ jsxs("div", { className: "aa-msg aa-user", children: [
-                  /* @__PURE__ */ jsx("p", { className: "aa-who", children: "You" }),
-                  /* @__PURE__ */ jsx("p", { className: "aa-text", children: item.text })
+                return /* @__PURE__ */ jsxs("div", { className: "agd-assistant__msg agd-assistant__user", children: [
+                  /* @__PURE__ */ jsx("p", { className: "agd-assistant__who", children: "You" }),
+                  /* @__PURE__ */ jsx("p", { className: "agd-assistant__text", children: item.text })
                 ] }, item.id);
               case "assistant":
-                return /* @__PURE__ */ jsxs("div", { className: "aa-msg aa-assistant", "data-machine-made": "true", "aria-busy": item.streaming, children: [
-                  /* @__PURE__ */ jsxs("p", { className: "aa-who", children: [
+                return /* @__PURE__ */ jsxs("div", { className: "agd-assistant__msg agd-assistant__assistant", "data-machine-made": "true", "aria-busy": item.streaming, children: [
+                  /* @__PURE__ */ jsxs("p", { className: "agd-assistant__who", children: [
                     "Assistant ",
                     /* @__PURE__ */ jsx(MachineMade, {})
                   ] }),
-                  /* @__PURE__ */ jsx("p", { className: "aa-text", children: item.text })
+                  /* @__PURE__ */ jsx("p", { className: "agd-assistant__text", children: item.text })
                 ] }, item.id);
               case "tool":
                 return /* @__PURE__ */ jsx(ToolCard, { item }, item.id);
               case "approval":
                 return /* @__PURE__ */ jsx(ApprovalPrompt, { item, decide: decideRequest, focusComposer: () => input.current?.focus() }, item.id);
               case "notice":
-                return /* @__PURE__ */ jsxs("p", { className: "aa-notice", children: [
+                return /* @__PURE__ */ jsxs("p", { className: "agd-assistant__notice", children: [
                   /* @__PURE__ */ jsx("strong", { children: "Notice:" }),
                   " ",
                   item.text
@@ -304,17 +304,17 @@ function AssistantPanel({ title = "AI assistant", run, decide }) {
     /* @__PURE__ */ jsxs(
       "form",
       {
-        className: "aa-composer",
+        className: "agd-assistant__composer",
         onSubmit: (event) => {
           event.preventDefault();
           submit();
         },
         children: [
-          /* @__PURE__ */ jsx("label", { htmlFor: inputId, className: "aa-label", children: "Message the assistant" }),
-          /* @__PURE__ */ jsx("textarea", { id: inputId, className: "aa-input", rows: 3, value: draft, ref: input, onChange: (event) => setDraft(event.target.value), onKeyDown }),
-          /* @__PURE__ */ jsxs("div", { className: "aa-actions", children: [
-            /* @__PURE__ */ jsx("button", { type: "submit", className: "aa-button aa-primary", disabled: running || draft.trim() === "", children: "Send" }),
-            running && /* @__PURE__ */ jsx("button", { type: "button", className: "aa-button", onClick: stop, children: "Stop" })
+          /* @__PURE__ */ jsx("label", { htmlFor: inputId, className: "agd-assistant__label", children: "Message the assistant" }),
+          /* @__PURE__ */ jsx("textarea", { id: inputId, className: "agd-assistant__input", rows: 3, value: draft, ref: input, onChange: (event) => setDraft(event.target.value), onKeyDown }),
+          /* @__PURE__ */ jsxs("div", { className: "agd-assistant__actions", children: [
+            /* @__PURE__ */ jsx("button", { type: "submit", className: "agd-assistant__button agd-assistant__primary", disabled: running || draft.trim() === "", children: "Send" }),
+            running && /* @__PURE__ */ jsx("button", { type: "button", className: "agd-assistant__button", onClick: stop, children: "Stop" })
           ] })
         ]
       }

package/dist/worker.js

@@ -3,8 +3,8 @@ import {
   createAssistantApi,
   createStaticTokenAuth,
   createWorker
-} from "./chunk-4N722U3I.js";
-import "./chunk-4YOTNHWM.js";
+} from "./chunk-NN5JJFPL.js";
+import "./chunk-VIFRLQO3.js";
 export {
   APPROVER_SCOPE,
   createAssistantApi,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agentic-assistant",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "An AI assistant that acts inside your apps with the user's own permissions.",
   "keywords": [
     "assistant",
@@ -74,7 +74,7 @@
   "dependencies": {
     "@anthropic-ai/sdk": "^1.3.0",
     "@modelcontextprotocol/sdk": "^1.32.2",
-    "agentic-identity": "^0.7.0",
+    "agentic-identity": "^0.8.0",
     "ajv": "^8.20.0"
   },
   "devDependencies": {
@@ -84,7 +84,7 @@
     "@types/node": "^22.0.0",
     "@types/react": "^19.3.0",
     "@types/react-dom": "^19.3.0",
-    "agentic-design": "^0.4.0",
+    "agentic-design": "^0.5.0",
     "jsdom": "^30.1.3",
     "react": "^19.3.1",
     "react-dom": "^19.3.1",
@@ -94,7 +94,7 @@
     "wrangler": "^4.155.0"
   },
   "peerDependencies": {
-    "agentic-design": "^0.4.0",
+    "agentic-design": "^0.5.0",
     "react": ">=18"
   },
   "peerDependenciesMeta": {