sideagent 0.2.0 → 0.4.0

package/dist/index.js

@@ -1,41 +1,65 @@
-// src/client/AgentChat.tsx
 import {
-  AssistantRuntimeProvider,
-  ComposerPrimitive,
-  MessagePrimitive,
-  ThreadPrimitive,
-  useLocalRuntime
-} from "@assistant-ui/react";
+  PUBLISHABLE_KEY_HEADER,
+  parsePublishableKey,
+  publishableEndpoint
+} from "./chunk-73FXXOAR.js";
+
+// src/client/AgentChat.tsx
 import {
-  CheckCircledIcon,
   ChatBubbleIcon,
-  ChevronRightIcon,
-  ArrowLeftIcon,
-  ArrowUpIcon,
   CounterClockwiseClockIcon,
   Cross2Icon,
-  CrossCircledIcon,
-  ExternalLinkIcon,
-  FileTextIcon,
-  ExclamationTriangleIcon,
   OpenInNewWindowIcon,
   PlusIcon,
-  ReloadIcon,
-  TrashIcon,
   ViewVerticalIcon
 } from "@radix-ui/react-icons";
-import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
-import Markdown from "react-markdown";
-import remarkGfm from "remark-gfm";
+import {
+  useCallback,
+  useContext as useContext3,
+  useEffect as useEffect2,
+  useMemo as useMemo2,
+  useRef as useRef2,
+  useState as useState3
+} from "react";
 
-// src/client/hooks.ts
-function safely(fn) {
+// src/client/Chat.tsx
+import {
+  AssistantRuntimeProvider,
+  ComposerPrimitive,
+  ThreadPrimitive,
+  useLocalRuntime
+} from "@assistant-ui/react";
+import { ArrowUpIcon } from "@radix-ui/react-icons";
+import { useMemo, useRef, useState } from "react";
+
+// src/client/ApprovalCard.tsx
+import { ChevronRightIcon, ExclamationTriangleIcon } from "@radix-ui/react-icons";
+
+// src/client/format.ts
+var pretty = (v) => {
   try {
-    fn?.();
-  } catch (err) {
-    console.error("[sideagent] hook threw:", err);
+    return JSON.stringify(v, null, 2);
+  } catch {
+    return String(v);
   }
-}
+};
+var ago = (t) => {
+  const s = Math.round((t - Date.now()) / 1e3);
+  const rtf = new Intl.RelativeTimeFormat(void 0, { numeric: "auto" });
+  const a = Math.abs(s);
+  if (a < 60) return rtf.format(s, "second");
+  if (a < 3600) return rtf.format(Math.round(s / 60), "minute");
+  if (a < 86400) return rtf.format(Math.round(s / 3600), "hour");
+  return rtf.format(Math.round(s / 86400), "day");
+};
+var httpUrl = (u) => {
+  try {
+    const url = new URL(String(u));
+    return url.protocol === "http:" || url.protocol === "https:" ? url.toString() : null;
+  } catch {
+    return null;
+  }
+};
 
 // src/client/results.tsx
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -113,364 +137,262 @@ function ResultView({ result }) {
   return /* @__PURE__ */ jsx("div", { children: formatCell(result) });
 }
 
-// src/client/styles.ts
-var CSS = `
-.sa-root{
-  --sa-bg:var(--sideagent-bg,#ffffff);
-  --sa-fg:var(--sideagent-fg,#171717);
-  --sa-muted:var(--sideagent-muted,#6b6b6b);
-  --sa-border:var(--sideagent-border,#e5e5e5);
-  --sa-surface:var(--sideagent-surface,#f5f5f5);
-  --sa-accent:var(--sideagent-accent,#171717);
-  --sa-accent-fg:var(--sideagent-accent-fg,#ffffff);
-  --sa-danger:var(--sideagent-danger,#b42318);
-  --sa-radius:var(--sideagent-radius,10px);
-  --sa-font:var(--sideagent-font,inherit);
-  color-scheme:light;
+// src/client/ApprovalCard.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function summaryFields(args) {
+  const a = args && typeof args === "object" ? args : {};
+  const body = a.body && typeof a.body === "object" && !Array.isArray(a.body) ? a.body : {};
+  const { body: _body, ...rest } = a;
+  return Object.entries({ ...rest, ...body }).filter(([, v]) => ["string", "number", "boolean"].includes(typeof v)).map(([k, v]) => [humanize(k), String(v)]);
 }
-@media (prefers-color-scheme:dark){
-  .sa-root[data-theme=auto]{
-    --sa-bg:var(--sideagent-bg,#171717);--sa-fg:var(--sideagent-fg,#f5f5f5);--sa-muted:var(--sideagent-muted,#a3a3a3);
-    --sa-border:var(--sideagent-border,#2e2e2e);--sa-surface:var(--sideagent-surface,#262626);
-    --sa-accent:var(--sideagent-accent,#f5f5f5);--sa-accent-fg:var(--sideagent-accent-fg,#171717);color-scheme:dark}
+function ApprovalCard({ event, onDecide }) {
+  const action = humanize(event.operationId).toLowerCase();
+  const fields = summaryFields(event.args);
+  return /* @__PURE__ */ jsxs2("div", { className: "sa-approval", role: "alertdialog", "aria-label": "Approval needed", children: [
+    /* @__PURE__ */ jsxs2("strong", { className: "sa-approval-title", children: [
+      /* @__PURE__ */ jsx2(ExclamationTriangleIcon, {}),
+      " Confirm before I continue"
+    ] }),
+    /* @__PURE__ */ jsxs2("p", { className: "sa-approval-text", children: [
+      "I'd like to ",
+      /* @__PURE__ */ jsx2("strong", { children: action }),
+      ". Nothing changes until you approve."
+    ] }),
+    fields.length > 0 && /* @__PURE__ */ jsx2("dl", { className: "sa-fields", children: fields.map(([k, v]) => /* @__PURE__ */ jsxs2("div", { className: "sa-field", children: [
+      /* @__PURE__ */ jsx2("dt", { children: k }),
+      /* @__PURE__ */ jsx2("dd", { children: v })
+    ] }, k)) }),
+    /* @__PURE__ */ jsxs2("details", { className: "sa-details", children: [
+      /* @__PURE__ */ jsxs2("summary", { children: [
+        /* @__PURE__ */ jsx2(ChevronRightIcon, {}),
+        " Details"
+      ] }),
+      /* @__PURE__ */ jsxs2("pre", { children: [
+        event.method,
+        " ",
+        event.path,
+        "\n",
+        pretty(event.args)
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs2("div", { className: "sa-row", children: [
+      /* @__PURE__ */ jsx2("button", { className: "sa-btn sa-btn-primary", onClick: () => onDecide("approve"), children: "Approve" }),
+      /* @__PURE__ */ jsx2("button", { className: "sa-btn", onClick: () => onDecide("reject"), children: "Reject" })
+    ] })
+  ] });
 }
-:is(.dark,[data-theme=dark],[data-bs-theme=dark]) .sa-root[data-theme=auto],
-.sa-root[data-theme=dark]{
-  --sa-bg:var(--sideagent-bg,#171717);--sa-fg:var(--sideagent-fg,#f5f5f5);--sa-muted:var(--sideagent-muted,#a3a3a3);
-  --sa-border:var(--sideagent-border,#2e2e2e);--sa-surface:var(--sideagent-surface,#262626);
-  --sa-accent:var(--sideagent-accent,#f5f5f5);--sa-accent-fg:var(--sideagent-accent-fg,#171717);color-scheme:dark}
-.sa-root{font-family:var(--sa-font);font-size:14px;line-height:1.5;color:var(--sa-fg);box-sizing:border-box;-webkit-font-smoothing:antialiased}
-.sa-root *{box-sizing:border-box}
-.sa-panel{display:flex;flex-direction:column;background:var(--sa-bg);border:1px solid var(--sa-border);overflow:hidden}
-.sa-floating .sa-panel{position:fixed;right:16px;bottom:80px;width:min(400px,calc(100vw - 32px));height:min(600px,calc(100vh - 104px));border-radius:calc(var(--sa-radius) + 4px);box-shadow:0 8px 30px rgba(0,0,0,.12);z-index:2147483000}
-.sa-sidebar .sa-panel{position:fixed;top:0;right:0;bottom:0;width:min(400px,100vw);border-width:0 0 0 1px;z-index:2147483000}
-.sa-shell{display:flex;height:100dvh;width:100%;min-width:0}
-.sa-shell-main{flex:1;min-width:0;overflow:auto}
-.sa-docked{display:contents}
-.sa-docked .sa-panel{position:relative;flex:none;max-width:70vw;height:100%;border-width:0 0 0 1px;z-index:auto}
-.sa-resizer{position:absolute;top:0;bottom:0;left:-3px;width:7px;cursor:col-resize;touch-action:none;z-index:1}
-.sa-resizer::after{content:"";position:absolute;top:0;bottom:0;left:3px;width:2px;background:transparent;transition:background .15s}
-.sa-resizer:hover::after,.sa-resizer:focus-visible::after,.sa-resizing .sa-resizer::after{background:var(--sa-muted)}
-.sa-resizer:focus-visible{outline:none}
-.sa-resizing{user-select:none;cursor:col-resize}
-.sa-fab{position:fixed;right:16px;bottom:16px;width:48px;height:48px;border-radius:50%;border:0;background:var(--sa-accent);color:var(--sa-accent-fg);cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.2);z-index:2147483000}
-.sa-header{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid var(--sa-border)}
-.sa-title{font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
-.sa-btn{border:1px solid var(--sa-border);background:transparent;color:var(--sa-fg);border-radius:calc(var(--sa-radius) - 2px);padding:4px 9px;min-height:28px;font:inherit;font-size:12px;cursor:pointer}
-.sa-btn:hover{background:var(--sa-surface)}
-.sa-btn[aria-pressed=true]{background:var(--sa-surface);border-color:var(--sa-muted)}
-.sa-btn-primary{background:var(--sa-accent);color:var(--sa-accent-fg);border-color:var(--sa-accent)}
-.sa-btn-primary:hover{background:var(--sa-accent);opacity:.88}
-.sa-btn:disabled{opacity:.5;cursor:not-allowed}
-.sa-root :is(button,textarea):focus-visible{outline:2px solid var(--sa-fg);outline-offset:2px}
-.sa-viewport{flex:1;overflow-y:auto;padding:14px 12px;display:flex;flex-direction:column;gap:10px}
-.sa-empty{color:var(--sa-muted);text-align:center;margin:auto;padding:24px}
-.sa-msg{max-width:90%;white-space:pre-wrap;word-break:break-word}
-.sa-user{align-self:flex-end;background:var(--sa-surface);padding:7px 12px;border-radius:calc(var(--sa-radius) + 4px)}
-.sa-assistant{align-self:flex-start}
-.sa-md{white-space:normal;min-width:0}
-.sa-md>:first-child{margin-top:0}.sa-md>:last-child{margin-bottom:0}
-.sa-md :is(p,ul,ol,pre,table,blockquote){margin:0 0 .6em}
-.sa-md :is(ul,ol){padding-left:1.4em}
-.sa-md :is(h1,h2,h3,h4){font-size:1em;font-weight:600;margin:.8em 0 .3em}
-.sa-md a{color:inherit;text-decoration:underline}
-.sa-md code{font-family:ui-monospace,monospace;font-size:.9em;background:var(--sa-surface);padding:1px 4px;border-radius:4px}
-.sa-md pre{background:var(--sa-surface);padding:8px 10px;border-radius:calc(var(--sa-radius) - 2px);overflow-x:auto}
-.sa-md pre code{background:none;padding:0}
-.sa-md blockquote{border-left:3px solid var(--sa-border);padding-left:10px;color:var(--sa-muted);margin-left:0}
-.sa-md table{border-collapse:collapse;display:block;overflow-x:auto}
-.sa-md :is(th,td){border:1px solid var(--sa-border);padding:3px 8px;text-align:left}
-.sa-icon-btn{display:inline-grid;place-items:center;min-width:28px;padding:4px}
-.sa-icon-btn svg{width:15px;height:15px}
-.sa-tool{align-self:stretch;border:1px solid var(--sa-border);border-radius:var(--sa-radius);padding:8px 10px;font-size:13px;min-width:0}
-.sa-tool-head{display:flex;align-items:center;gap:6px;font-weight:600;font-size:12.5px;margin-bottom:6px}
-.sa-tool[data-state=done] .sa-tool-head svg{color:var(--sa-muted)}
-.sa-tool[data-state=error] .sa-tool-head,.sa-tool[data-state=rejected] .sa-tool-head{color:var(--sa-danger)}
-.sa-spin{animation:sa-rot 1s linear infinite}
-@keyframes sa-rot{to{transform:rotate(360deg)}}
-@media (prefers-reduced-motion:reduce){.sa-spin{animation:none}}
-.sa-table-wrap{overflow:auto;max-height:240px;border:1px solid var(--sa-border);border-radius:calc(var(--sa-radius) - 2px)}
-.sa-table{border-collapse:collapse;width:100%;font-size:12.5px}
-.sa-table th,.sa-table td{padding:5px 9px;text-align:left;white-space:nowrap;border-bottom:1px solid var(--sa-border)}
-.sa-table th{position:sticky;top:0;background:var(--sa-surface);font-weight:600;color:var(--sa-muted)}
-.sa-table tr:last-child td{border-bottom:0}
-.sa-table .sa-num{text-align:right;font-variant-numeric:tabular-nums}
-.sa-more{color:var(--sa-muted);font-size:12px;margin-top:4px}
-.sa-fields{margin:0;display:grid;gap:4px}
-.sa-field{display:grid;grid-template-columns:minmax(80px,35%) 1fr;gap:8px}
-.sa-field dt{color:var(--sa-muted)}
-.sa-field dd{margin:0;word-break:break-word}
-.sa-list{margin:0;padding-left:18px}
-.sa-sources{margin:0;padding:0;list-style:none;display:grid;gap:4px}
-.sa-sources li{display:flex;align-items:center;gap:6px}
-.sa-sources svg{flex:none;color:var(--sa-muted)}
-.sa-sources a{color:inherit;text-decoration:underline;text-underline-offset:2px;display:inline-flex;align-items:center;gap:4px}
-.sa-details{margin-top:6px}
-.sa-details summary{cursor:pointer;color:var(--sa-muted);font-size:12px;list-style:none;display:flex;align-items:center;gap:2px}
-.sa-details summary::-webkit-details-marker{display:none}
-.sa-details[open] summary svg{transform:rotate(90deg)}
-.sa-details pre{margin:6px 0 0;white-space:pre-wrap;word-break:break-word;max-height:160px;overflow:auto;font-size:11.5px}
-.sa-approval-title{display:flex;align-items:center;gap:6px}
-.sa-approval{margin:0 12px 8px;border:1px solid var(--sa-fg);border-radius:var(--sa-radius);padding:10px;background:var(--sa-surface)}
-.sa-approval pre{margin:6px 0;white-space:pre-wrap;word-break:break-word;max-height:120px;overflow:auto;font-size:12px}
-.sa-approval-text{margin:6px 0}
-.sa-approval .sa-fields{margin:0 0 6px}
-.sa-approval .sa-row{margin-top:8px}
-.sa-row{display:flex;gap:8px}
-.sa-composer{display:flex;flex-direction:column;gap:4px;margin:0 12px 12px;padding:10px 10px 8px 14px;border:1px solid var(--sa-border);border-radius:18px;background:var(--sa-surface)}
-.sa-input{width:100%;resize:none;border:0;background:transparent;padding:2px 0;font:inherit;color:inherit;max-height:160px}
-.sa-root .sa-input:focus-visible{outline:none}
-.sa-input::placeholder{color:var(--sa-muted)}
-.sa-composer-bar{display:flex;align-items:center;justify-content:space-between;gap:8px}
-.sa-hint{color:var(--sa-muted);font-size:12px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
-.sa-send{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:0;background:var(--sa-accent);color:var(--sa-accent-fg);cursor:pointer}
-.sa-send:hover{opacity:.88}
-.sa-send:disabled{opacity:.35;cursor:not-allowed}
-.sa-send svg{width:16px;height:16px}
-.sa-chatwrap{display:flex;flex-direction:column;flex:1;min-height:0}
-.sa-chatwrap[hidden]{display:none}
-.sa-history{gap:6px}
-.sa-back{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;margin-bottom:4px}
-.sa-thread{display:flex;gap:6px;align-items:stretch}
-.sa-thread-open{flex:1;min-width:0;text-align:left;border:1px solid var(--sa-border);background:transparent;color:inherit;border-radius:var(--sa-radius);padding:8px 10px;font:inherit;cursor:pointer;display:flex;flex-direction:column;gap:2px}
-.sa-thread-open:hover{background:var(--sa-surface)}
-.sa-thread-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
-.sa-error{color:var(--sa-danger)}
-`;
 
-// src/client/transport.ts
-async function* streamChat(body, opts) {
-  const res = await fetch(opts.endpoint, {
-    method: "POST",
-    credentials: opts.credentials ?? "same-origin",
-    headers: { "content-type": "application/json", ...opts.headers },
-    body: JSON.stringify(body),
-    signal: opts.signal
-  });
-  if (!res.ok || !res.body) {
-    let message = `Request failed (${res.status})`;
-    try {
-      const j = await res.json();
-      if (j?.error) message = String(j.error);
-    } catch {
-    }
-    yield { type: "error", code: `http_${res.status}`, message };
-    return;
-  }
-  const reader = res.body.getReader();
-  const decoder = new TextDecoder();
-  let buf = "";
-  for (; ; ) {
-    const { done, value } = await reader.read();
-    if (done) break;
-    buf += decoder.decode(value, { stream: true });
-    let i;
-    while ((i = buf.indexOf("\n\n")) >= 0) {
-      const block = buf.slice(0, i);
-      buf = buf.slice(i + 2);
-      if (block.startsWith("data: ")) yield JSON.parse(block.slice(6));
-    }
-  }
-}
-async function callJson(body, opts) {
-  const res = await fetch(opts.endpoint, {
-    method: "POST",
-    credentials: opts.credentials ?? "same-origin",
-    headers: { "content-type": "application/json", ...opts.headers },
-    body: JSON.stringify(body)
-  });
-  let data = null;
-  try {
-    data = await res.json();
-  } catch {
-  }
-  return { status: res.status, data };
+// src/client/context.ts
+import { createContext, useContext } from "react";
+var DockContext = createContext(false);
+var AgentContext = createContext(null);
+function useAgent() {
+  const ctx = useContext(AgentContext);
+  if (!ctx) throw new Error("useAgent must be used inside <AgentProvider>");
+  return ctx;
 }
+var RenderersContext = createContext(void 0);
 
-// src/client/AgentChat.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var MODE_KEY = "sideagent:mode";
-var WIDTH_KEY = "sideagent:width";
-var threadKey = (endpoint) => `sideagent:thread:${endpoint}`;
-function storeGet(k) {
-  try {
-    return localStorage.getItem(k);
-  } catch {
-    return null;
-  }
-}
-function storeSet(k, v) {
+// src/client/hooks.ts
+function safely(fn) {
   try {
-    if (v === null) localStorage.removeItem(k);
-    else localStorage.setItem(k, v);
-  } catch {
+    fn?.();
+  } catch (err) {
+    console.error("[sideagent] hook threw:", err);
   }
 }
-function toInitialMessages(messages) {
-  return (messages ?? []).map(
-    (m) => m.role === "user" ? { role: "user", content: m.parts.map((p) => ({ type: "text", text: p.type === "text" ? p.text : "" })) } : {
-      role: "assistant",
-      content: m.parts.map(
-        (p) => p.type === "text" ? { type: "text", text: p.text } : { type: "tool-call", toolCallId: p.callId, toolName: p.operationId, args: p.args ?? {}, argsText: pretty(p.args), result: p.result }
-      ),
-      status: { type: "complete", reason: "stop" }
-    }
-  );
-}
 function fireComplete(hooks, ev) {
   const oe = { operationId: ev.operationId, status: ev.status, args: ev.args, result: ev.result };
   safely(() => hooks?.onAnyOperation?.(oe));
   safely(() => hooks?.onOperationComplete?.[ev.operationId]?.(oe));
   for (const tag of ev.invalidates) safely(() => hooks?.onInvalidate?.(tag, oe));
 }
-var ago = (t) => {
-  const s = Math.round((t - Date.now()) / 1e3);
-  const rtf = new Intl.RelativeTimeFormat(void 0, { numeric: "auto" });
-  const a = Math.abs(s);
-  if (a < 60) return rtf.format(s, "second");
-  if (a < 3600) return rtf.format(Math.round(s / 60), "minute");
-  if (a < 86400) return rtf.format(Math.round(s / 3600), "hour");
-  return rtf.format(Math.round(s / 86400), "day");
-};
-var MODES = ["floating", "sidebar"];
-var MIN_WIDTH = 300;
-var DEFAULT_WIDTH = 400;
-var maxWidth = () => Math.max(MIN_WIDTH, Math.min(760, Math.round(window.innerWidth * 0.7)));
-var clampWidth = (w) => Math.min(maxWidth(), Math.max(MIN_WIDTH, Math.round(w)));
-var DockContext = createContext(false);
-var AgentContext = createContext(null);
-function useAgent() {
-  const ctx = useContext(AgentContext);
-  if (!ctx) throw new Error("useAgent must be used inside <AgentProvider>");
-  return ctx;
-}
-function AgentProvider({ children, className, style, ...chat }) {
-  const [open, setOpen] = useState(chat.defaultOpen ?? false);
-  const controls = useMemo(() => ({ open, setOpen }), [open]);
-  return /* @__PURE__ */ jsx2(AgentContext.Provider, { value: controls, children: /* @__PURE__ */ jsx2(DockContext.Provider, { value: true, children: /* @__PURE__ */ jsxs2("div", { className: `sa-shell${className ? ` ${className}` : ""}`, style, children: [
-    /* @__PURE__ */ jsx2("div", { className: "sa-shell-main", children }),
-    /* @__PURE__ */ jsx2(AgentChat, { ...chat })
-  ] }) }) });
-}
-function readMode(fallback) {
-  try {
-    const v = localStorage.getItem(MODE_KEY);
-    return v && MODES.includes(v) ? v : fallback;
-  } catch {
-    return fallback;
-  }
-}
-var pretty = (v) => {
-  try {
-    return JSON.stringify(v, null, 2);
-  } catch {
-    return String(v);
-  }
-};
-var Text = ({ text }) => /* @__PURE__ */ jsx2("span", { children: text });
-var RenderersContext = createContext(void 0);
-var httpUrl = (u) => {
-  try {
-    const url = new URL(String(u));
-    return url.protocol === "http:" || url.protocol === "https:" ? url.toString() : null;
-  } catch {
-    return null;
-  }
-};
+
+// src/client/Messages.tsx
+import { MessagePrimitive } from "@assistant-ui/react";
+import Markdown from "react-markdown";
+import remarkGfm from "remark-gfm";
+
+// src/client/ToolCard.tsx
+import {
+  CheckCircledIcon,
+  ChevronRightIcon as ChevronRightIcon2,
+  CrossCircledIcon,
+  ExternalLinkIcon,
+  FileTextIcon,
+  ReloadIcon
+} from "@radix-ui/react-icons";
+import { useContext as useContext2 } from "react";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var SEARCH_TOOL = "search_knowledge";
 function Sources({ result }) {
   const sources = result?.sources ?? [];
-  if (typeof result?.error === "string") return /* @__PURE__ */ jsx2("div", { className: "sa-error", children: result.error });
-  if (!sources.length) return /* @__PURE__ */ jsx2("div", { className: "sa-more", children: "No relevant sources found." });
-  return /* @__PURE__ */ jsx2("ul", { className: "sa-sources", children: sources.map((s) => {
+  if (typeof result?.error === "string") return /* @__PURE__ */ jsx3("div", { className: "sa-error", children: result.error });
+  if (!sources.length) return /* @__PURE__ */ jsx3("div", { className: "sa-more", children: "No relevant sources found." });
+  return /* @__PURE__ */ jsx3("ul", { className: "sa-sources", children: sources.map((s) => {
     const href = s.url ? httpUrl(s.url) : null;
-    return /* @__PURE__ */ jsxs2("li", { children: [
-      /* @__PURE__ */ jsx2(FileTextIcon, {}),
-      href ? /* @__PURE__ */ jsxs2("a", { href, target: "_blank", rel: "noopener noreferrer", children: [
+    return /* @__PURE__ */ jsxs3("li", { children: [
+      /* @__PURE__ */ jsx3(FileTextIcon, {}),
+      href ? /* @__PURE__ */ jsxs3("a", { href, target: "_blank", rel: "noopener noreferrer", children: [
         s.title,
         " ",
-        /* @__PURE__ */ jsx2(ExternalLinkIcon, {})
-      ] }) : /* @__PURE__ */ jsx2("span", { children: s.title })
+        /* @__PURE__ */ jsx3(ExternalLinkIcon, {})
+      ] }) : /* @__PURE__ */ jsx3("span", { children: s.title })
     ] }, s.id);
   }) });
 }
 function ToolCard(props) {
-  const renderers = useContext(RenderersContext);
+  const renderers = useContext2(RenderersContext);
   const { toolName, args, result } = props;
   const rejected = result?.rejected === true;
   const failed = !rejected && typeof result?.error === "string";
   const running = result === void 0;
   const custom = renderers?.[toolName];
-  return /* @__PURE__ */ jsxs2("div", { className: "sa-tool", "data-state": running ? "running" : rejected ? "rejected" : failed ? "error" : "done", children: [
-    /* @__PURE__ */ jsxs2("div", { className: "sa-tool-head", children: [
-      running ? /* @__PURE__ */ jsx2(ReloadIcon, { className: "sa-spin" }) : rejected || failed ? /* @__PURE__ */ jsx2(CrossCircledIcon, {}) : /* @__PURE__ */ jsx2(CheckCircledIcon, {}),
-      /* @__PURE__ */ jsx2("span", { children: toolName === "search_knowledge" ? "Sources" : humanize(toolName) })
+  return /* @__PURE__ */ jsxs3("div", { className: "sa-tool", "data-state": running ? "running" : rejected ? "rejected" : failed ? "error" : "done", children: [
+    /* @__PURE__ */ jsxs3("div", { className: "sa-tool-head", children: [
+      running ? /* @__PURE__ */ jsx3(ReloadIcon, { className: "sa-spin" }) : rejected || failed ? /* @__PURE__ */ jsx3(CrossCircledIcon, {}) : /* @__PURE__ */ jsx3(CheckCircledIcon, {}),
+      /* @__PURE__ */ jsx3("span", { children: toolName === SEARCH_TOOL ? "Sources" : humanize(toolName) })
     ] }),
-    !running && (custom ? custom({ operationId: toolName, args, result }) : toolName === "search_knowledge" ? /* @__PURE__ */ jsx2(Sources, { result }) : /* @__PURE__ */ jsx2(ResultView, { result })),
-    /* @__PURE__ */ jsxs2("details", { className: "sa-details", children: [
-      /* @__PURE__ */ jsxs2("summary", { children: [
-        /* @__PURE__ */ jsx2(ChevronRightIcon, {}),
+    !running && (custom ? custom({ operationId: toolName, args, result }) : toolName === SEARCH_TOOL ? /* @__PURE__ */ jsx3(Sources, { result }) : /* @__PURE__ */ jsx3(ResultView, { result })),
+    /* @__PURE__ */ jsxs3("details", { className: "sa-details", children: [
+      /* @__PURE__ */ jsxs3("summary", { children: [
+        /* @__PURE__ */ jsx3(ChevronRightIcon2, {}),
         " Details"
       ] }),
-      /* @__PURE__ */ jsx2("pre", { children: pretty(args) }),
-      !running && /* @__PURE__ */ jsx2("pre", { children: pretty(result) })
+      /* @__PURE__ */ jsx3("pre", { children: pretty(args) }),
+      !running && /* @__PURE__ */ jsx3("pre", { children: pretty(result) })
     ] })
   ] });
 }
+
+// src/client/Messages.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Text = ({ text }) => /* @__PURE__ */ jsx4("span", { children: text });
 var mdComponents = {
-  a: ({ node: _n, ...p }) => /* @__PURE__ */ jsx2("a", { ...p, target: "_blank", rel: "noopener noreferrer nofollow" })
+  a: ({ node: _n, ...p }) => /* @__PURE__ */ jsx4("a", { ...p, target: "_blank", rel: "noopener noreferrer nofollow" })
 };
-var UserMessage = () => /* @__PURE__ */ jsx2(MessagePrimitive.Root, { className: "sa-msg sa-user", children: /* @__PURE__ */ jsx2(MessagePrimitive.Parts, { components: { Text } }) });
-var AssistantMessage = () => /* @__PURE__ */ jsx2(MessagePrimitive.Root, { style: { display: "contents" }, children: /* @__PURE__ */ jsx2(
+var UserMessage = () => /* @__PURE__ */ jsx4(MessagePrimitive.Root, { className: "sa-msg sa-user", children: /* @__PURE__ */ jsx4(MessagePrimitive.Parts, { components: { Text } }) });
+var AssistantMessage = () => /* @__PURE__ */ jsx4(MessagePrimitive.Root, { style: { display: "contents" }, children: /* @__PURE__ */ jsx4(
   MessagePrimitive.Parts,
   {
     components: {
-      Text: ({ text }) => text ? /* @__PURE__ */ jsx2("div", { className: "sa-msg sa-assistant sa-md", children: /* @__PURE__ */ jsx2(Markdown, { remarkPlugins: [remarkGfm], components: mdComponents, children: text }) }) : null,
+      Text: ({ text }) => text ? /* @__PURE__ */ jsx4("div", { className: "sa-msg sa-assistant sa-md", children: /* @__PURE__ */ jsx4(Markdown, { remarkPlugins: [remarkGfm], components: mdComponents, children: text }) }) : null,
       tools: { Fallback: ToolCard }
     }
   }
-) });
-function summaryFields(args) {
-  const a = args && typeof args === "object" ? args : {};
-  const body = a.body && typeof a.body === "object" && !Array.isArray(a.body) ? a.body : {};
-  const { body: _body, ...rest } = a;
-  return Object.entries({ ...rest, ...body }).filter(([, v]) => ["string", "number", "boolean"].includes(typeof v)).map(([k, v]) => [humanize(k), String(v)]);
+) });
+
+// src/client/parts.ts
+function upsertTool(parts, callId, patch) {
+  const i = parts.findIndex((p) => p.type === "tool-call" && p.toolCallId === callId);
+  if (i < 0)
+    return [...parts, { type: "tool-call", toolCallId: callId, toolName: "", args: {}, argsText: "{}", ...patch }];
+  return parts.map((p, j) => j === i ? { ...p, ...patch } : p);
+}
+var argsOf = (v) => v ?? {};
+function applyEvent(parts, ev) {
+  switch (ev.type) {
+    case "text.delta": {
+      const tail = parts[parts.length - 1];
+      if (tail?.type === "text") return [...parts.slice(0, -1), { type: "text", text: tail.text + ev.text }];
+      return [...parts, { type: "text", text: ev.text }];
+    }
+    case "approval.request":
+      return upsertTool(parts, ev.callId, {
+        toolName: ev.operationId,
+        args: argsOf(ev.args),
+        argsText: pretty(ev.args)
+      });
+    case "tool.start":
+      return upsertTool(parts, ev.callId, { toolName: ev.operationId });
+    case "tool.rejected":
+      return upsertTool(parts, ev.callId, { toolName: ev.operationId, result: { rejected: true } });
+    case "tool.complete":
+      return upsertTool(parts, ev.callId, {
+        toolName: ev.operationId,
+        args: argsOf(ev.args),
+        argsText: pretty(ev.args),
+        result: ev.result ?? null
+      });
+    case "error":
+      return [...parts, { type: "text", text: `\u26A0 ${ev.message}` }];
+    default:
+      return [...parts];
+  }
+}
+function toInitialMessages(messages) {
+  return (messages ?? []).map(
+    (m) => m.role === "user" ? {
+      role: "user",
+      content: m.parts.map((p) => ({ type: "text", text: p.type === "text" ? p.text : "" }))
+    } : {
+      role: "assistant",
+      content: m.parts.map(
+        (p) => p.type === "text" ? { type: "text", text: p.text } : {
+          type: "tool-call",
+          toolCallId: p.callId,
+          toolName: p.operationId,
+          args: argsOf(p.args),
+          argsText: pretty(p.args),
+          result: p.result
+        }
+      ),
+      status: { type: "complete", reason: "stop" }
+    }
+  );
+}
+
+// src/client/transport.ts
+async function* streamChat(body, opts) {
+  const res = await fetch(opts.endpoint, {
+    method: "POST",
+    credentials: opts.credentials ?? "same-origin",
+    headers: { "content-type": "application/json", ...opts.headers },
+    body: JSON.stringify(body),
+    signal: opts.signal
+  });
+  if (!res.ok || !res.body) {
+    let message = `Request failed (${res.status})`;
+    try {
+      const j = await res.json();
+      if (j?.error) message = String(j.error);
+    } catch {
+    }
+    yield { type: "error", code: `http_${res.status}`, message };
+    return;
+  }
+  const reader = res.body.getReader();
+  const decoder = new TextDecoder();
+  let buf = "";
+  for (; ; ) {
+    const { done, value } = await reader.read();
+    if (done) break;
+    buf += decoder.decode(value, { stream: true });
+    let i;
+    while ((i = buf.indexOf("\n\n")) >= 0) {
+      const block = buf.slice(0, i);
+      buf = buf.slice(i + 2);
+      if (block.startsWith("data: ")) yield JSON.parse(block.slice(6));
+    }
+  }
 }
-function ApprovalCard({ event, onDecide }) {
-  const action = humanize(event.operationId).toLowerCase();
-  const fields = summaryFields(event.args);
-  return /* @__PURE__ */ jsxs2("div", { className: "sa-approval", role: "alertdialog", "aria-label": "Approval needed", children: [
-    /* @__PURE__ */ jsxs2("strong", { className: "sa-approval-title", children: [
-      /* @__PURE__ */ jsx2(ExclamationTriangleIcon, {}),
-      " Confirm before I continue"
-    ] }),
-    /* @__PURE__ */ jsxs2("p", { className: "sa-approval-text", children: [
-      "I'd like to ",
-      /* @__PURE__ */ jsx2("strong", { children: action }),
-      ". Nothing changes until you approve."
-    ] }),
-    fields.length > 0 && /* @__PURE__ */ jsx2("dl", { className: "sa-fields", children: fields.map(([k, v]) => /* @__PURE__ */ jsxs2("div", { className: "sa-field", children: [
-      /* @__PURE__ */ jsx2("dt", { children: k }),
-      /* @__PURE__ */ jsx2("dd", { children: v })
-    ] }, k)) }),
-    /* @__PURE__ */ jsxs2("details", { className: "sa-details", children: [
-      /* @__PURE__ */ jsxs2("summary", { children: [
-        /* @__PURE__ */ jsx2(ChevronRightIcon, {}),
-        " Details"
-      ] }),
-      /* @__PURE__ */ jsxs2("pre", { children: [
-        event.method,
-        " ",
-        event.path,
-        "\n",
-        pretty(event.args)
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs2("div", { className: "sa-row", children: [
-      /* @__PURE__ */ jsx2("button", { className: "sa-btn sa-btn-primary", onClick: () => onDecide("approve"), children: "Approve" }),
-      /* @__PURE__ */ jsx2("button", { className: "sa-btn", onClick: () => onDecide("reject"), children: "Reject" })
-    ] })
-  ] });
+async function callJson(body, opts) {
+  const res = await fetch(opts.endpoint, {
+    method: "POST",
+    credentials: opts.credentials ?? "same-origin",
+    headers: { "content-type": "application/json", ...opts.headers },
+    body: JSON.stringify(body)
+  });
+  let data = null;
+  try {
+    data = await res.json();
+  } catch {
+  }
+  return { status: res.status, data };
 }
+
+// src/client/Chat.tsx
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
 function Chat(props) {
   const { endpoint, hooks, credentials, headers } = props;
   const latest = useRef(props);
@@ -485,53 +407,30 @@ function Chat(props) {
         const last = [...messages].reverse().find((m) => m.role === "user");
         const text = (last?.content ?? []).map((c) => c.type === "text" ? c.text : "").join("\n").trim();
         const ctx = typeof p.context === "function" ? p.context() : p.context;
-        const parts = [];
-        const upsertTool = (callId, patch) => {
-          let part = parts.find((x) => x.type === "tool-call" && x.toolCallId === callId);
-          if (!part) {
-            part = { type: "tool-call", toolCallId: callId, toolName: "", args: {}, argsText: "{}" };
-            parts.push(part);
-          }
-          Object.assign(part, patch);
-        };
+        let parts = [];
         safely(p.hooks?.onTurnStart);
         let body = { threadId: threadId.current, message: text, context: ctx };
         try {
           for (; ; ) {
             let pending;
-            for await (const ev of streamChat(body, { endpoint: p.endpoint, credentials: p.credentials, headers: p.headers, signal: abortSignal })) {
-              switch (ev.type) {
-                case "turn.start":
-                  threadId.current = ev.threadId;
-                  p.onThread(ev.threadId);
-                  break;
-                case "text.delta": {
-                  const tail = parts[parts.length - 1];
-                  if (tail?.type === "text") tail.text += ev.text;
-                  else parts.push({ type: "text", text: ev.text });
-                  break;
-                }
-                case "approval.request":
-                  pending = ev;
-                  upsertTool(ev.callId, { toolName: ev.operationId, args: ev.args, argsText: pretty(ev.args) });
-                  break;
-                case "tool.start":
-                  upsertTool(ev.callId, { toolName: ev.operationId });
-                  break;
-                case "tool.rejected":
-                  upsertTool(ev.callId, { toolName: ev.operationId, result: { rejected: true } });
-                  break;
-                case "tool.complete": {
-                  upsertTool(ev.callId, { toolName: ev.operationId, args: ev.args ?? {}, argsText: pretty(ev.args), result: ev.result ?? null });
-                  fireComplete(p.hooks, ev);
-                  break;
-                }
-                case "error":
-                  parts.push({ type: "text", text: `\u26A0 ${ev.message}` });
-                  safely(() => p.hooks?.onError?.({ code: ev.code, message: ev.message }));
-                  break;
+            for await (const ev of streamChat(body, {
+              endpoint: p.endpoint,
+              credentials: p.credentials,
+              headers: p.headers,
+              signal: abortSignal
+            })) {
+              parts = applyEvent(parts, ev);
+              if (ev.type === "turn.start") {
+                threadId.current = ev.threadId;
+                p.onThread(ev.threadId);
+              } else if (ev.type === "approval.request") {
+                pending = ev;
+              } else if (ev.type === "tool.complete") {
+                fireComplete(p.hooks, ev);
+              } else if (ev.type === "error") {
+                safely(() => p.hooks?.onError?.({ code: ev.code, message: ev.message }));
               }
-              yield { content: parts.map((x) => ({ ...x })) };
+              yield { content: parts };
             }
             if (!pending) break;
             const req = pending;
@@ -547,7 +446,7 @@ function Chat(props) {
           setApproval(null);
           safely(p.hooks?.onTurnEnd);
         }
-        yield { content: parts.map((x) => ({ ...x })) };
+        yield { content: parts };
       }
     }),
     // endpoint/hooks/etc. are read through `latest`, so the adapter stays stable.
@@ -558,7 +457,10 @@ function Chat(props) {
     const req = loadedPending;
     if (!req || !threadId.current) return;
     setLoadedPending(null);
-    for await (const ev of streamChat({ threadId: threadId.current, approval: { token: req.token, decision } }, { endpoint, credentials, headers })) {
+    for await (const ev of streamChat(
+      { threadId: threadId.current, approval: { token: req.token, decision } },
+      { endpoint, credentials, headers }
+    )) {
       if (ev.type === "tool.complete") fireComplete(hooks, ev);
       if (ev.type === "error") safely(() => hooks?.onError?.({ code: ev.code, message: ev.message }));
     }
@@ -566,24 +468,37 @@ function Chat(props) {
   };
   const shownApproval = approval?.event ?? loadedPending;
   const decide = (d) => approval ? approval.decide(d) : void decideLoaded(d);
-  return /* @__PURE__ */ jsx2(RenderersContext.Provider, { value: props.resultRenderers, children: /* @__PURE__ */ jsx2(AssistantRuntimeProvider, { runtime, children: /* @__PURE__ */ jsxs2(ThreadPrimitive.Root, { style: { display: "contents" }, children: [
-    /* @__PURE__ */ jsxs2(ThreadPrimitive.Viewport, { className: "sa-viewport", children: [
-      /* @__PURE__ */ jsx2(ThreadPrimitive.Empty, { children: /* @__PURE__ */ jsx2("div", { className: "sa-empty", children: "Ask me to look things up or make changes. I will ask before changing anything." }) }),
-      /* @__PURE__ */ jsx2(ThreadPrimitive.Messages, { components: { UserMessage, AssistantMessage } })
+  return /* @__PURE__ */ jsx5(RenderersContext.Provider, { value: props.resultRenderers, children: /* @__PURE__ */ jsx5(AssistantRuntimeProvider, { runtime, children: /* @__PURE__ */ jsxs4(ThreadPrimitive.Root, { style: { display: "contents" }, children: [
+    /* @__PURE__ */ jsxs4(ThreadPrimitive.Viewport, { className: "sa-viewport", children: [
+      /* @__PURE__ */ jsx5(ThreadPrimitive.Empty, { children: /* @__PURE__ */ jsx5("div", { className: "sa-empty", children: "Ask me to look things up or make changes. I will ask before changing anything." }) }),
+      /* @__PURE__ */ jsx5(ThreadPrimitive.Messages, { components: { UserMessage, AssistantMessage } })
     ] }),
-    shownApproval && /* @__PURE__ */ jsx2(ApprovalCard, { event: shownApproval, onDecide: decide }),
-    /* @__PURE__ */ jsxs2(ComposerPrimitive.Root, { className: "sa-composer", children: [
-      /* @__PURE__ */ jsx2(ComposerPrimitive.Input, { className: "sa-input", rows: 2, placeholder: props.placeholder ?? "Message\u2026", disabled: !!shownApproval }),
-      /* @__PURE__ */ jsxs2("div", { className: "sa-composer-bar", children: [
-        /* @__PURE__ */ jsx2("span", { className: "sa-hint", children: "Enter to send \xB7 Shift+Enter for a new line" }),
-        /* @__PURE__ */ jsx2(ComposerPrimitive.Send, { className: "sa-send", "aria-label": "Send", title: "Send", children: /* @__PURE__ */ jsx2(ArrowUpIcon, {}) })
+    shownApproval && /* @__PURE__ */ jsx5(ApprovalCard, { event: shownApproval, onDecide: decide }),
+    /* @__PURE__ */ jsxs4(ComposerPrimitive.Root, { className: "sa-composer", children: [
+      /* @__PURE__ */ jsx5(
+        ComposerPrimitive.Input,
+        {
+          className: "sa-input",
+          rows: 2,
+          placeholder: props.placeholder ?? "Message\u2026",
+          disabled: !!shownApproval
+        }
+      ),
+      /* @__PURE__ */ jsxs4("div", { className: "sa-composer-bar", children: [
+        /* @__PURE__ */ jsx5("span", { className: "sa-hint", children: "Enter to send \xB7 Shift+Enter for a new line" }),
+        /* @__PURE__ */ jsx5(ComposerPrimitive.Send, { className: "sa-send", "aria-label": "Send", title: "Send", children: /* @__PURE__ */ jsx5(ArrowUpIcon, {}) })
       ] })
     ] })
   ] }) }) });
 }
+
+// src/client/HistoryList.tsx
+import { ArrowLeftIcon, TrashIcon } from "@radix-ui/react-icons";
+import { useEffect, useState as useState2 } from "react";
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 function HistoryList(props) {
-  const [threads, setThreads] = useState(null);
-  const [error, setError] = useState(false);
+  const [threads, setThreads] = useState2(null);
+  const [error, setError] = useState2(false);
   const opts = { endpoint: props.endpoint, credentials: props.credentials, headers: props.headers };
   useEffect(() => {
     callJson({ action: "threads.list" }, opts).then((r) => r.data?.threads ? setThreads(r.data.threads) : setError(true)).catch(() => setError(true));
@@ -593,38 +508,239 @@ function HistoryList(props) {
     setThreads((t) => t?.filter((x) => x.id !== id) ?? null);
     props.onDeleted(id);
   };
-  return /* @__PURE__ */ jsxs2("div", { className: "sa-viewport sa-history", children: [
-    /* @__PURE__ */ jsxs2("button", { className: "sa-btn sa-back", onClick: props.onClose, children: [
-      /* @__PURE__ */ jsx2(ArrowLeftIcon, {}),
+  return /* @__PURE__ */ jsxs5("div", { className: "sa-viewport sa-history", children: [
+    /* @__PURE__ */ jsxs5("button", { className: "sa-btn sa-back", onClick: props.onClose, children: [
+      /* @__PURE__ */ jsx6(ArrowLeftIcon, {}),
       " Back to chat"
     ] }),
-    error && /* @__PURE__ */ jsx2("div", { className: "sa-error", children: "Could not load history." }),
-    threads === null && !error && /* @__PURE__ */ jsx2("div", { className: "sa-more", children: "Loading\u2026" }),
-    threads?.length === 0 && /* @__PURE__ */ jsx2("div", { className: "sa-empty", children: "No conversations yet." }),
-    threads?.map((t) => /* @__PURE__ */ jsxs2("div", { className: "sa-thread", children: [
-      /* @__PURE__ */ jsxs2("button", { className: "sa-thread-open", onClick: () => props.onOpen(t.id), children: [
-        /* @__PURE__ */ jsx2("span", { className: "sa-thread-title", children: t.title }),
-        /* @__PURE__ */ jsx2("span", { className: "sa-more", children: ago(t.updatedAt) })
+    error && /* @__PURE__ */ jsx6("div", { className: "sa-error", children: "Could not load history." }),
+    threads === null && !error && /* @__PURE__ */ jsx6("div", { className: "sa-more", children: "Loading\u2026" }),
+    threads?.length === 0 && /* @__PURE__ */ jsx6("div", { className: "sa-empty", children: "No conversations yet." }),
+    threads?.map((t) => /* @__PURE__ */ jsxs5("div", { className: "sa-thread", children: [
+      /* @__PURE__ */ jsxs5("button", { className: "sa-thread-open", onClick: () => props.onOpen(t.id), children: [
+        /* @__PURE__ */ jsx6("span", { className: "sa-thread-title", children: t.title }),
+        /* @__PURE__ */ jsx6("span", { className: "sa-more", children: ago(t.updatedAt) })
       ] }),
-      /* @__PURE__ */ jsx2("button", { className: "sa-btn sa-icon-btn", "aria-label": "Delete conversation", title: "Delete", onClick: () => void remove(t.id), children: /* @__PURE__ */ jsx2(TrashIcon, {}) })
+      /* @__PURE__ */ jsx6(
+        "button",
+        {
+          className: "sa-btn sa-icon-btn",
+          "aria-label": "Delete conversation",
+          title: "Delete",
+          onClick: () => void remove(t.id),
+          children: /* @__PURE__ */ jsx6(TrashIcon, {})
+        }
+      )
     ] }, t.id))
   ] });
 }
+
+// src/client/storage.ts
+var MODE_KEY = "sideagent:mode";
+var WIDTH_KEY = "sideagent:width";
+var threadKey = (endpoint) => `sideagent:thread:${endpoint}`;
+var MODES = ["floating", "sidebar"];
+function storeGet(k) {
+  try {
+    return localStorage.getItem(k);
+  } catch {
+    return null;
+  }
+}
+function storeSet(k, v) {
+  try {
+    if (v === null) localStorage.removeItem(k);
+    else localStorage.setItem(k, v);
+  } catch {
+  }
+}
+function readMode(fallback) {
+  const v = storeGet(MODE_KEY);
+  return v && MODES.includes(v) ? v : fallback;
+}
+
+// src/client/styles.ts
+var CSS = `
+.sa-root{
+  --sa-bg:var(--sideagent-bg,#ffffff);
+  --sa-fg:var(--sideagent-fg,#171717);
+  --sa-muted:var(--sideagent-muted,#6b6b6b);
+  --sa-border:var(--sideagent-border,#e5e5e5);
+  --sa-surface:var(--sideagent-surface,#f5f5f5);
+  --sa-accent:var(--sideagent-accent,#171717);
+  --sa-accent-fg:var(--sideagent-accent-fg,#ffffff);
+  --sa-danger:var(--sideagent-danger,#b42318);
+  --sa-radius:var(--sideagent-radius,10px);
+  --sa-font:var(--sideagent-font,inherit);
+  color-scheme:light;
+}
+@media (prefers-color-scheme:dark){
+  .sa-root[data-theme=auto]{
+    --sa-bg:var(--sideagent-bg,#171717);--sa-fg:var(--sideagent-fg,#f5f5f5);--sa-muted:var(--sideagent-muted,#a3a3a3);
+    --sa-border:var(--sideagent-border,#2e2e2e);--sa-surface:var(--sideagent-surface,#262626);
+    --sa-accent:var(--sideagent-accent,#f5f5f5);--sa-accent-fg:var(--sideagent-accent-fg,#171717);color-scheme:dark}
+}
+:is(.dark,[data-theme=dark],[data-bs-theme=dark]) .sa-root[data-theme=auto],
+.sa-root[data-theme=dark]{
+  --sa-bg:var(--sideagent-bg,#171717);--sa-fg:var(--sideagent-fg,#f5f5f5);--sa-muted:var(--sideagent-muted,#a3a3a3);
+  --sa-border:var(--sideagent-border,#2e2e2e);--sa-surface:var(--sideagent-surface,#262626);
+  --sa-accent:var(--sideagent-accent,#f5f5f5);--sa-accent-fg:var(--sideagent-accent-fg,#171717);color-scheme:dark}
+.sa-root{font-family:var(--sa-font);font-size:14px;line-height:1.5;color:var(--sa-fg);box-sizing:border-box;-webkit-font-smoothing:antialiased}
+.sa-root *{box-sizing:border-box}
+.sa-panel{display:flex;flex-direction:column;background:var(--sa-bg);border:1px solid var(--sa-border);overflow:hidden}
+.sa-floating .sa-panel{position:fixed;right:16px;bottom:80px;width:min(400px,calc(100vw - 32px));height:min(600px,calc(100vh - 104px));border-radius:calc(var(--sa-radius) + 4px);box-shadow:0 8px 30px rgba(0,0,0,.12);z-index:2147483000}
+.sa-sidebar .sa-panel{position:fixed;top:0;right:0;bottom:0;width:min(400px,100vw);border-width:0 0 0 1px;z-index:2147483000}
+.sa-shell{display:flex;height:100dvh;width:100%;min-width:0}
+.sa-shell-main{flex:1;min-width:0;overflow:auto}
+.sa-docked{display:contents}
+.sa-docked .sa-panel{position:relative;flex:none;max-width:70vw;height:100%;border-width:0 0 0 1px;z-index:auto}
+.sa-resizer{position:absolute;top:0;bottom:0;left:-3px;width:7px;cursor:col-resize;touch-action:none;z-index:1}
+.sa-resizer::after{content:"";position:absolute;top:0;bottom:0;left:3px;width:2px;background:transparent;transition:background .15s}
+.sa-resizer:hover::after,.sa-resizer:focus-visible::after,.sa-resizing .sa-resizer::after{background:var(--sa-muted)}
+.sa-resizer:focus-visible{outline:none}
+.sa-resizing{user-select:none;cursor:col-resize}
+.sa-fab{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));width:48px;height:48px;border-radius:50%;border:0;background:var(--sa-accent);color:var(--sa-accent-fg);cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.2);z-index:2147483000}
+.sa-header{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid var(--sa-border)}
+.sa-title{font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.sa-btn{border:1px solid var(--sa-border);background:transparent;color:var(--sa-fg);border-radius:calc(var(--sa-radius) - 2px);padding:4px 9px;min-height:28px;font:inherit;font-size:12px;cursor:pointer}
+.sa-btn:hover{background:var(--sa-surface)}
+.sa-btn[aria-pressed=true]{background:var(--sa-surface);border-color:var(--sa-muted)}
+.sa-btn-primary{background:var(--sa-accent);color:var(--sa-accent-fg);border-color:var(--sa-accent)}
+.sa-btn-primary:hover{background:var(--sa-accent);opacity:.88}
+.sa-btn:disabled{opacity:.5;cursor:not-allowed}
+.sa-root :is(button,textarea):focus-visible{outline:2px solid var(--sa-fg);outline-offset:2px}
+.sa-viewport{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:14px 12px;display:flex;flex-direction:column;gap:10px}
+.sa-empty{color:var(--sa-muted);text-align:center;margin:auto;padding:24px}
+.sa-msg{max-width:90%;white-space:pre-wrap;word-break:break-word}
+.sa-user{align-self:flex-end;background:var(--sa-surface);padding:7px 12px;border-radius:calc(var(--sa-radius) + 4px)}
+.sa-assistant{align-self:flex-start}
+.sa-md{white-space:normal;min-width:0}
+.sa-md>:first-child{margin-top:0}.sa-md>:last-child{margin-bottom:0}
+.sa-md :is(p,ul,ol,pre,table,blockquote){margin:0 0 .6em}
+.sa-md :is(ul,ol){padding-left:1.4em}
+.sa-md :is(h1,h2,h3,h4){font-size:1em;font-weight:600;margin:.8em 0 .3em}
+.sa-md a{color:inherit;text-decoration:underline}
+.sa-md code{font-family:ui-monospace,monospace;font-size:.9em;background:var(--sa-surface);padding:1px 4px;border-radius:4px}
+.sa-md pre{background:var(--sa-surface);padding:8px 10px;border-radius:calc(var(--sa-radius) - 2px);overflow-x:auto}
+.sa-md pre code{background:none;padding:0}
+.sa-md blockquote{border-left:3px solid var(--sa-border);padding-left:10px;color:var(--sa-muted);margin-left:0}
+.sa-md table{border-collapse:collapse;display:block;overflow-x:auto}
+.sa-md :is(th,td){border:1px solid var(--sa-border);padding:3px 8px;text-align:left}
+.sa-icon-btn{display:inline-grid;place-items:center;min-width:28px;padding:4px}
+.sa-icon-btn svg{width:15px;height:15px}
+.sa-tool{align-self:stretch;border:1px solid var(--sa-border);border-radius:var(--sa-radius);padding:8px 10px;font-size:13px;min-width:0}
+.sa-tool-head{display:flex;align-items:center;gap:6px;font-weight:600;font-size:12.5px;margin-bottom:6px}
+.sa-tool[data-state=done] .sa-tool-head svg{color:var(--sa-muted)}
+.sa-tool[data-state=error] .sa-tool-head,.sa-tool[data-state=rejected] .sa-tool-head{color:var(--sa-danger)}
+.sa-spin{animation:sa-rot 1s linear infinite}
+@keyframes sa-rot{to{transform:rotate(360deg)}}
+@media (prefers-reduced-motion:reduce){.sa-spin{animation:none}}
+.sa-table-wrap{overflow:auto;max-height:240px;border:1px solid var(--sa-border);border-radius:calc(var(--sa-radius) - 2px)}
+.sa-table{border-collapse:collapse;width:100%;font-size:12.5px}
+.sa-table th,.sa-table td{padding:5px 9px;text-align:left;white-space:nowrap;border-bottom:1px solid var(--sa-border)}
+.sa-table th{position:sticky;top:0;background:var(--sa-surface);font-weight:600;color:var(--sa-muted)}
+.sa-table tr:last-child td{border-bottom:0}
+.sa-table .sa-num{text-align:right;font-variant-numeric:tabular-nums}
+.sa-more{color:var(--sa-muted);font-size:12px;margin-top:4px}
+.sa-fields{margin:0;display:grid;gap:4px}
+.sa-field{display:grid;grid-template-columns:minmax(80px,35%) 1fr;gap:8px}
+.sa-field dt{color:var(--sa-muted)}
+.sa-field dd{margin:0;word-break:break-word}
+.sa-list{margin:0;padding-left:18px}
+.sa-sources{margin:0;padding:0;list-style:none;display:grid;gap:4px}
+.sa-sources li{display:flex;align-items:center;gap:6px}
+.sa-sources svg{flex:none;color:var(--sa-muted)}
+.sa-sources a{color:inherit;text-decoration:underline;text-underline-offset:2px;display:inline-flex;align-items:center;gap:4px}
+.sa-details{margin-top:6px}
+.sa-details summary{cursor:pointer;color:var(--sa-muted);font-size:12px;list-style:none;display:flex;align-items:center;gap:2px}
+.sa-details summary::-webkit-details-marker{display:none}
+.sa-details[open] summary svg{transform:rotate(90deg)}
+.sa-details pre{margin:6px 0 0;white-space:pre-wrap;word-break:break-word;max-height:160px;overflow:auto;font-size:11.5px}
+.sa-approval-title{display:flex;align-items:center;gap:6px}
+.sa-approval{margin:0 12px 8px;border:1px solid var(--sa-fg);border-radius:var(--sa-radius);padding:10px;background:var(--sa-surface)}
+.sa-approval pre{margin:6px 0;white-space:pre-wrap;word-break:break-word;max-height:120px;overflow:auto;font-size:12px}
+.sa-approval-text{margin:6px 0}
+.sa-approval .sa-fields{margin:0 0 6px}
+.sa-approval .sa-row{margin-top:8px}
+.sa-row{display:flex;gap:8px}
+.sa-composer{display:flex;flex-direction:column;gap:4px;margin:0 12px 12px;padding:10px 10px 8px 14px;border:1px solid var(--sa-border);border-radius:18px;background:var(--sa-surface)}
+.sa-input{width:100%;resize:none;border:0;background:transparent;padding:2px 0;font:inherit;color:inherit;max-height:160px}
+.sa-root .sa-input:focus-visible{outline:none}
+.sa-input::placeholder{color:var(--sa-muted)}
+.sa-composer-bar{display:flex;align-items:center;justify-content:space-between;gap:8px}
+.sa-hint{color:var(--sa-muted);font-size:12px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.sa-send{flex:none;margin-left:auto;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:0;background:var(--sa-accent);color:var(--sa-accent-fg);cursor:pointer}
+.sa-send:hover{opacity:.88}
+.sa-send:disabled{opacity:.35;cursor:not-allowed}
+.sa-send svg{width:16px;height:16px}
+.sa-chatwrap{display:flex;flex-direction:column;flex:1;min-height:0}
+.sa-chatwrap[hidden]{display:none}
+.sa-history{gap:6px}
+.sa-back{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;margin-bottom:4px}
+.sa-thread{display:flex;gap:6px;align-items:stretch}
+.sa-thread-open{flex:1;min-width:0;text-align:left;border:1px solid var(--sa-border);background:transparent;color:inherit;border-radius:var(--sa-radius);padding:8px 10px;font:inherit;cursor:pointer;display:flex;flex-direction:column;gap:2px}
+.sa-thread-open:hover{background:var(--sa-surface)}
+.sa-thread-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.sa-error{color:var(--sa-danger)}
+@media (max-width:640px){
+  .sa-root .sa-panel{position:fixed;inset:0;width:auto!important;max-width:none;height:auto;border:0;border-radius:0;box-shadow:none;z-index:2147483000;
+    padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}
+  .sa-resizer,.sa-mode-btn{display:none}
+  .sa-input{font-size:16px}
+  .sa-msg{max-width:100%}
+  .sa-user{max-width:85%}
+  .sa-approval{max-height:55dvh;overflow-y:auto}
+}
+@media (pointer:coarse){
+  .sa-btn{min-height:36px}
+  .sa-icon-btn{min-width:36px}
+  .sa-icon-btn svg{width:17px;height:17px}
+  .sa-send{width:36px;height:36px}
+  .sa-hint{display:none}
+}
+`;
+
+// src/client/target.ts
+function resolveTarget(props) {
+  if (props.publishableKey === void 0) {
+    if (!props.endpoint) throw new Error("sideagent: pass endpoint or publishableKey");
+    return { endpoint: props.endpoint, headers: props.headers };
+  }
+  const parts = parsePublishableKey(props.publishableKey);
+  if (!parts) throw new Error("sideagent: invalid publishableKey");
+  return {
+    // An explicit endpoint wins, e.g. a proxy in front of sideagent Cloud.
+    endpoint: props.endpoint || publishableEndpoint(parts),
+    headers: { ...props.headers, [PUBLISHABLE_KEY_HEADER]: props.publishableKey }
+  };
+}
+
+// src/client/AgentChat.tsx
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+var MIN_WIDTH = 300;
+var DEFAULT_WIDTH = 400;
+var maxWidth = () => Math.max(MIN_WIDTH, Math.min(760, Math.round(window.innerWidth * 0.7)));
+var clampWidth = (w) => Math.min(maxWidth(), Math.max(MIN_WIDTH, Math.round(w)));
 function AgentChat(props) {
-  const [mode, setModeState] = useState(() => readMode(props.mode ?? "floating"));
-  const [localOpen, setLocalOpen] = useState(props.defaultOpen ?? false);
-  const shared = useContext(AgentContext);
+  const target = useMemo2(
+    () => resolveTarget(props),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [props.endpoint, props.publishableKey, props.headers]
+  );
+  const [mode, setModeState] = useState3(() => readMode(props.mode ?? "floating"));
+  const [localOpen, setLocalOpen] = useState3(props.defaultOpen ?? false);
+  const shared = useContext3(AgentContext);
   const open = shared ? shared.open : localOpen;
   const setOpen = shared ? shared.setOpen : setLocalOpen;
-  const [view, setView] = useState("chat");
-  const [session, setSession] = useState({ key: 0 });
-  const [loading, setLoading] = useState(false);
-  const docked = useContext(DockContext) && mode === "sidebar";
-  const [width, setWidth] = useState(() => clampWidth(Number(storeGet(WIDTH_KEY)) || DEFAULT_WIDTH));
-  const [resizing, setResizing] = useState(false);
-  const booted = useRef(false);
-  const key = threadKey(props.endpoint);
-  const opts = { endpoint: props.endpoint, credentials: props.credentials, headers: props.headers };
+  const [view, setView] = useState3("chat");
+  const [session, setSession] = useState3({ key: 0 });
+  const [loading, setLoading] = useState3(false);
+  const docked = useContext3(DockContext) && mode === "sidebar";
+  const [width, setWidth] = useState3(() => clampWidth(Number(storeGet(WIDTH_KEY)) || DEFAULT_WIDTH));
+  const [resizing, setResizing] = useState3(false);
+  const booted = useRef2(false);
+  const key = threadKey(target.endpoint);
+  const opts = { endpoint: target.endpoint, credentials: props.credentials, headers: target.headers };
   const setMode = useCallback((m) => {
     setModeState(m);
     storeSet(MODE_KEY, m);
@@ -649,7 +765,7 @@ function AgentChat(props) {
       }
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [props.endpoint, props.credentials, props.headers]
+    [target, props.credentials]
   );
   const resizeTo = useCallback((w) => {
     const next = clampWidth(w);
@@ -680,73 +796,108 @@ function AgentChat(props) {
     setView("chat");
   };
   const visible = open;
-  useEffect(() => {
+  useEffect2(() => {
     if (!visible || booted.current) return;
     booted.current = true;
     const last = storeGet(key);
     if (last) void openThread(last);
   }, [visible, key, openThread]);
-  return /* @__PURE__ */ jsxs2("div", { className: `sa-root sa-${mode}${docked ? " sa-docked" : ""}${resizing ? " sa-resizing" : ""}`, "data-theme": props.theme ?? "auto", children: [
-    /* @__PURE__ */ jsx2("style", { children: CSS }),
-    !open && /* @__PURE__ */ jsx2("button", { className: "sa-fab", "aria-label": "Open assistant", onClick: () => setOpen(true), children: /* @__PURE__ */ jsx2(ChatBubbleIcon, { width: 22, height: 22 }) }),
-    visible && /* @__PURE__ */ jsxs2("section", { className: "sa-panel", "aria-label": props.title ?? "Assistant", style: docked ? { width } : void 0, children: [
-      docked && /* @__PURE__ */ jsx2(
-        "div",
-        {
-          className: "sa-resizer",
-          role: "separator",
-          "aria-orientation": "vertical",
-          "aria-label": "Resize assistant",
-          "aria-valuemin": MIN_WIDTH,
-          "aria-valuemax": maxWidth(),
-          "aria-valuenow": width,
-          tabIndex: 0,
-          onPointerDown: onHandleDown,
-          onPointerMove: onHandleMove,
-          onPointerUp: onHandleUp,
-          onPointerCancel: onHandleUp,
-          onKeyDown: onHandleKey
-        }
-      ),
-      /* @__PURE__ */ jsxs2("header", { className: "sa-header", children: [
-        /* @__PURE__ */ jsx2("span", { className: "sa-title", children: props.title ?? "Assistant" }),
-        props.allowModeSwitch !== false && /* @__PURE__ */ jsx2(
-          "button",
-          {
-            className: "sa-btn sa-icon-btn",
-            onClick: () => setMode(mode === "floating" ? "sidebar" : "floating"),
-            title: mode === "floating" ? "Dock to sidebar" : "Float",
-            "aria-label": mode === "floating" ? "Dock to sidebar" : "Float",
-            children: mode === "floating" ? /* @__PURE__ */ jsx2(ViewVerticalIcon, {}) : /* @__PURE__ */ jsx2(OpenInNewWindowIcon, {})
-          }
-        ),
-        /* @__PURE__ */ jsx2("button", { className: "sa-btn sa-icon-btn", "aria-pressed": view === "history", onClick: () => setView((v) => v === "history" ? "chat" : "history"), title: "History", "aria-label": "History", children: /* @__PURE__ */ jsx2(CounterClockwiseClockIcon, {}) }),
-        /* @__PURE__ */ jsx2("button", { className: "sa-btn sa-icon-btn", onClick: newChat, title: "New chat", "aria-label": "New chat", children: /* @__PURE__ */ jsx2(PlusIcon, {}) }),
-        /* @__PURE__ */ jsx2("button", { className: "sa-btn sa-icon-btn", onClick: () => setOpen(false), "aria-label": "Close", title: "Close", children: /* @__PURE__ */ jsx2(Cross2Icon, {}) })
-      ] }),
-      view === "history" && /* @__PURE__ */ jsx2(
-        HistoryList,
-        {
-          ...opts,
-          onOpen: (id) => void openThread(id),
-          onClose: () => setView("chat"),
-          onDeleted: (id) => {
-            if (id === session.threadId) newChat();
-          }
-        }
-      ),
-      /* @__PURE__ */ jsx2("div", { className: "sa-chatwrap", hidden: view === "history", children: loading ? /* @__PURE__ */ jsx2("div", { className: "sa-viewport", children: /* @__PURE__ */ jsx2("div", { className: "sa-more", children: "Loading\u2026" }) }) : /* @__PURE__ */ jsx2(
-        Chat,
-        {
-          ...props,
-          session,
-          onThread: (id) => storeSet(key, id),
-          onReload: () => session.threadId && void openThread(session.threadId)
-        },
-        session.key
-      ) })
-    ] })
-  ] });
+  return /* @__PURE__ */ jsxs6(
+    "div",
+    {
+      className: `sa-root sa-${mode}${docked ? " sa-docked" : ""}${resizing ? " sa-resizing" : ""}`,
+      "data-theme": props.theme ?? "auto",
+      children: [
+        /* @__PURE__ */ jsx7("style", { children: CSS }),
+        !open && /* @__PURE__ */ jsx7("button", { className: "sa-fab", "aria-label": "Open assistant", onClick: () => setOpen(true), children: /* @__PURE__ */ jsx7(ChatBubbleIcon, { width: 22, height: 22 }) }),
+        visible && /* @__PURE__ */ jsxs6("section", { className: "sa-panel", "aria-label": props.title ?? "Assistant", style: docked ? { width } : void 0, children: [
+          docked && /* @__PURE__ */ jsx7(
+            "div",
+            {
+              className: "sa-resizer",
+              role: "separator",
+              "aria-orientation": "vertical",
+              "aria-label": "Resize assistant",
+              "aria-valuemin": MIN_WIDTH,
+              "aria-valuemax": maxWidth(),
+              "aria-valuenow": width,
+              tabIndex: 0,
+              onPointerDown: onHandleDown,
+              onPointerMove: onHandleMove,
+              onPointerUp: onHandleUp,
+              onPointerCancel: onHandleUp,
+              onKeyDown: onHandleKey
+            }
+          ),
+          /* @__PURE__ */ jsxs6("header", { className: "sa-header", children: [
+            /* @__PURE__ */ jsx7("span", { className: "sa-title", children: props.title ?? "Assistant" }),
+            props.allowModeSwitch !== false && /* @__PURE__ */ jsx7(
+              "button",
+              {
+                className: "sa-btn sa-icon-btn sa-mode-btn",
+                onClick: () => setMode(mode === "floating" ? "sidebar" : "floating"),
+                title: mode === "floating" ? "Dock to sidebar" : "Float",
+                "aria-label": mode === "floating" ? "Dock to sidebar" : "Float",
+                children: mode === "floating" ? /* @__PURE__ */ jsx7(ViewVerticalIcon, {}) : /* @__PURE__ */ jsx7(OpenInNewWindowIcon, {})
+              }
+            ),
+            /* @__PURE__ */ jsx7(
+              "button",
+              {
+                className: "sa-btn sa-icon-btn",
+                "aria-pressed": view === "history",
+                onClick: () => setView((v) => v === "history" ? "chat" : "history"),
+                title: "History",
+                "aria-label": "History",
+                children: /* @__PURE__ */ jsx7(CounterClockwiseClockIcon, {})
+              }
+            ),
+            /* @__PURE__ */ jsx7("button", { className: "sa-btn sa-icon-btn", onClick: newChat, title: "New chat", "aria-label": "New chat", children: /* @__PURE__ */ jsx7(PlusIcon, {}) }),
+            /* @__PURE__ */ jsx7("button", { className: "sa-btn sa-icon-btn", onClick: () => setOpen(false), "aria-label": "Close", title: "Close", children: /* @__PURE__ */ jsx7(Cross2Icon, {}) })
+          ] }),
+          view === "history" && /* @__PURE__ */ jsx7(
+            HistoryList,
+            {
+              ...opts,
+              onOpen: (id) => void openThread(id),
+              onClose: () => setView("chat"),
+              onDeleted: (id) => {
+                if (id === session.threadId) newChat();
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx7("div", { className: "sa-chatwrap", hidden: view === "history", children: loading ? /* @__PURE__ */ jsx7("div", { className: "sa-viewport", children: /* @__PURE__ */ jsx7("div", { className: "sa-more", children: "Loading\u2026" }) }) : /* @__PURE__ */ jsx7(
+            Chat,
+            {
+              ...props,
+              ...target,
+              session,
+              onThread: (id) => storeSet(key, id),
+              onReload: () => session.threadId && void openThread(session.threadId)
+            },
+            session.key
+          ) })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/client/AgentProvider.tsx
+import { useMemo as useMemo3, useState as useState4 } from "react";
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+function AgentProvider({
+  children,
+  className,
+  style,
+  ...chat
+}) {
+  const [open, setOpen] = useState4(chat.defaultOpen ?? false);
+  const controls = useMemo3(() => ({ open, setOpen }), [open]);
+  return /* @__PURE__ */ jsx8(AgentContext.Provider, { value: controls, children: /* @__PURE__ */ jsx8(DockContext.Provider, { value: true, children: /* @__PURE__ */ jsxs7("div", { className: `sa-shell${className ? ` ${className}` : ""}`, style, children: [
+    /* @__PURE__ */ jsx8("div", { className: "sa-shell-main", children }),
+    /* @__PURE__ */ jsx8(AgentChat, { ...chat })
+  ] }) }) });
 }
 export {
   AgentChat,