@volter-ai-dev/supercode-ui 0.1.0

package/embed.mjs

@@ -0,0 +1,972 @@
+// src/embed.jsx
+import { render } from "preact";
+
+// src/components.jsx
+import MarkdownIt from "markdown-it";
+import { useEffect, useId, useLayoutEffect, useMemo, useRef, useState } from "preact/hooks";
+
+// core.mjs
+var HARNESS_NAMES = Object.freeze({
+  "claude-code": "Claude Code",
+  codex: "Codex",
+  opencode: "OpenCode",
+  pi: "Pi",
+  grok: "Grok"
+});
+var DEFAULT_LABELS = Object.freeze({
+  chats: "Chats",
+  newChat: "New chat",
+  searchChats: "Search chats",
+  askAgent: "Ask your agent\u2026",
+  continueHere: "Continue here",
+  joinLive: "Join live",
+  forkHere: "Fork here"
+});
+var EMPTY_UI_STATE = Object.freeze({
+  pill: Object.freeze({ tone: "off", label: "connecting\u2026" }),
+  startup: "connecting",
+  transcript: Object.freeze([]),
+  busy: false,
+  operation: null,
+  needsInput: false,
+  harness: "",
+  mode: "none",
+  strategy: null,
+  canSend: false,
+  canResume: false,
+  canBranch: false,
+  canAttach: false,
+  canDetach: false,
+  canOpenTerminal: false,
+  canExport: false,
+  canReduce: false,
+  canInterrupt: false,
+  canRespond: false,
+  messaging: null,
+  workspace: "",
+  taskPlan: Object.freeze({ source: "none", items: Object.freeze([]), residueCount: 0, observedAt: null }),
+  semantics: Object.freeze({ fidelity: null, residue: Object.freeze([]), residueCount: 0, parseErrors: 0, rawRecords: 0, subagents: Object.freeze([]) }),
+  terminalHandoff: null,
+  exportBackTarget: null,
+  exportReceipt: null,
+  reductionReceipt: null,
+  error: null,
+  recoverable: false,
+  harnesses: Object.freeze([]),
+  history: Object.freeze({ sessionLimit: 0, hasMoreSessions: false, transcriptLimit: 120, hasEarlier: false }),
+  savedDraft: "",
+  attention: Object.freeze([]),
+  sessions: Object.freeze([]),
+  attached: null,
+  owned: null,
+  attachError: null
+});
+var ROLES = /* @__PURE__ */ new Set(["system", "user", "assistant", "tool", "reasoning", "request", "notice"]);
+var MODES = /* @__PURE__ */ new Set(["none", "control", "mirror"]);
+var STRATEGIES = /* @__PURE__ */ new Set(["start", "resume", "attach", "branch"]);
+var STARTUP = /* @__PURE__ */ new Set(["connecting", "starting", "discovering", "ready"]);
+var FIDELITY = /* @__PURE__ */ new Set(["byte_lossless", "value_lossless", "semantic"]);
+function record(value) {
+  return value !== null && typeof value === "object" && !Array.isArray(value) ? value : null;
+}
+function string(value, fallback = "") {
+  return typeof value === "string" ? value : fallback;
+}
+function number(value, fallback = 0) {
+  return typeof value === "number" && Number.isFinite(value) ? value : fallback;
+}
+function nullableNumber(value) {
+  return typeof value === "number" && Number.isFinite(value) ? value : null;
+}
+function readTranscript(value) {
+  if (!Array.isArray(value)) return [];
+  const result = [];
+  for (const candidate of value) {
+    const item = record(candidate);
+    if (!item || typeof item.id !== "string" || typeof item.text !== "string" || !ROLES.has(item.role)) continue;
+    const entry = {
+      id: item.id,
+      role: item.role,
+      text: item.text,
+      ts: nullableNumber(item.ts),
+      truncated: item.truncated === true
+    };
+    for (const key of ["label", "arguments", "resultText", "code"]) {
+      if (typeof item[key] === "string") entry[key] = item[key];
+    }
+    if (["pending", "completed", "error"].includes(item.status)) entry.status = item.status;
+    if (typeof item.streaming === "boolean") entry.streaming = item.streaming;
+    if (Array.isArray(item.context)) {
+      entry.context = item.context.flatMap((raw) => {
+        const context = record(raw);
+        return context && typeof context.label === "string" && typeof context.detail === "string" ? [{
+          ...typeof context.id === "string" ? { id: context.id } : {},
+          ...typeof context.kind === "string" ? { kind: context.kind } : {},
+          label: context.label,
+          detail: context.detail
+        }] : [];
+      });
+    }
+    const request = record(item.request);
+    if (request && typeof request.requestKind === "string" && typeof request.payloadText === "string") {
+      entry.request = {
+        requestId: request.requestId,
+        requestKind: request.requestKind,
+        payloadText: request.payloadText,
+        options: Array.isArray(request.options) ? request.options.flatMap((raw) => {
+          const option = record(raw);
+          return option && typeof option.optionId === "string" && typeof option.name === "string" ? [{ optionId: option.optionId, name: option.name, kind: string(option.kind, "other") }] : [];
+        }) : [],
+        cancellable: request.cancellable === true,
+        status: request.status === "responded" ? "responded" : "pending",
+        resolution: record(request.resolution)
+      };
+    }
+    result.push(entry);
+  }
+  return result;
+}
+function readSessions(value) {
+  if (!Array.isArray(value)) return [];
+  return value.flatMap((raw) => {
+    const row = record(raw);
+    if (!row || typeof row.key !== "string" || typeof row.harness !== "string") return [];
+    return [{
+      key: row.key,
+      harness: row.harness,
+      name: string(row.name),
+      cwd: string(row.cwd),
+      title: string(row.title),
+      age: string(row.age),
+      updatedAt: nullableNumber(row.updatedAt),
+      messages: nullableNumber(row.messages),
+      active: row.active === true,
+      live: row.live === true,
+      runtimeStatus: row.runtimeStatus === "busy" || row.runtimeStatus === "idle" ? row.runtimeStatus : null
+    }];
+  });
+}
+function readAttached(value) {
+  const item = record(value);
+  if (!item || typeof item.harness !== "string") return null;
+  return { key: string(item.key), harness: item.harness, name: string(item.name), cwd: string(item.cwd), title: string(item.title) };
+}
+function readTaskPlan(value) {
+  const plan = record(value);
+  if (!plan) return { ...EMPTY_UI_STATE.taskPlan, items: [] };
+  return {
+    source: ["codex-update-plan", "claude-tasks", "opencode-todos"].includes(plan.source) ? plan.source : "none",
+    items: Array.isArray(plan.items) ? plan.items.flatMap((raw) => {
+      const item = record(raw);
+      if (!item || typeof item.id !== "string" || typeof item.title !== "string") return [];
+      return [{
+        id: item.id,
+        title: item.title,
+        status: ["pending", "in_progress", "completed", "cancelled", "unknown"].includes(item.status) ? item.status : "unknown",
+        ...typeof item.nativeStatus === "string" ? { nativeStatus: item.nativeStatus } : {},
+        ...Array.isArray(item.blockedBy) ? { blockedBy: item.blockedBy.filter((value2) => typeof value2 === "string") } : {}
+      }];
+    }) : [],
+    residueCount: number(plan.residueCount),
+    observedAt: nullableNumber(plan.observedAt)
+  };
+}
+function readSemantics(value) {
+  const semantics = record(value);
+  if (!semantics) return { ...EMPTY_UI_STATE.semantics, residue: [], subagents: [] };
+  return {
+    fidelity: FIDELITY.has(semantics.fidelity) ? semantics.fidelity : null,
+    residue: Array.isArray(semantics.residue) ? semantics.residue.filter((item) => typeof item === "string") : [],
+    residueCount: number(semantics.residueCount),
+    parseErrors: number(semantics.parseErrors),
+    rawRecords: number(semantics.rawRecords),
+    subagents: Array.isArray(semantics.subagents) ? semantics.subagents.flatMap((raw) => {
+      const child = record(raw);
+      if (!child || typeof child.id !== "string" || typeof child.source !== "string") return [];
+      return [{ id: child.id, source: child.source, model: typeof child.model === "string" ? child.model : null, messages: number(child.messages), fidelity: FIDELITY.has(child.fidelity) ? child.fidelity : "semantic" }];
+    }) : []
+  };
+}
+function normalizeUiState(value) {
+  const raw = record(value) ?? {};
+  const pill = record(raw.pill);
+  const history = record(raw.history);
+  const attachError = record(raw.attachError);
+  return {
+    pill: { tone: ["live", "warn", "dead"].includes(pill?.tone) ? pill.tone : "off", label: string(pill?.label, "connecting\u2026") },
+    startup: STARTUP.has(raw.startup) ? raw.startup : "connecting",
+    transcript: readTranscript(raw.transcript),
+    busy: raw.busy === true,
+    operation: typeof raw.operation === "string" ? raw.operation : null,
+    needsInput: raw.needsInput === true,
+    harness: string(raw.harness),
+    mode: MODES.has(raw.mode) ? raw.mode : "none",
+    strategy: STRATEGIES.has(raw.strategy) ? raw.strategy : null,
+    canSend: raw.canSend === true,
+    canResume: raw.canResume === true,
+    canBranch: raw.canBranch === true,
+    canAttach: raw.canAttach === true,
+    canDetach: raw.canDetach === true,
+    canOpenTerminal: raw.canOpenTerminal === true,
+    canExport: raw.canExport === true,
+    canReduce: raw.canReduce === true,
+    canInterrupt: raw.canInterrupt === true,
+    canRespond: raw.canRespond === true,
+    messaging: raw.messaging === "live_peer" ? "live_peer" : null,
+    workspace: string(raw.workspace),
+    taskPlan: readTaskPlan(raw.taskPlan),
+    semantics: readSemantics(raw.semantics),
+    terminalHandoff: record(raw.terminalHandoff),
+    exportBackTarget: typeof raw.exportBackTarget === "string" ? raw.exportBackTarget : null,
+    exportReceipt: record(raw.exportReceipt),
+    reductionReceipt: record(raw.reductionReceipt),
+    error: typeof raw.error === "string" ? raw.error : null,
+    recoverable: raw.recoverable === true,
+    harnesses: Array.isArray(raw.harnesses) ? raw.harnesses.flatMap((candidate) => {
+      const item = record(candidate);
+      return item && typeof item.id === "string" ? [{ id: item.id, label: string(item.label, harnessDisplayName(item.id)), installed: item.installed === true, startable: item.startable === true, reason: typeof item.reason === "string" ? item.reason : null }] : [];
+    }) : [],
+    history: { sessionLimit: number(history?.sessionLimit), hasMoreSessions: history?.hasMoreSessions === true, transcriptLimit: number(history?.transcriptLimit, 120), hasEarlier: history?.hasEarlier === true },
+    savedDraft: string(raw.savedDraft),
+    attention: Array.isArray(raw.attention) ? raw.attention.flatMap((candidate) => {
+      const item = record(candidate);
+      return item && typeof item.key === "string" && ["unseen", "finished", "failed"].includes(item.kind) ? [{ key: item.key, kind: item.kind, ...typeof item.preview === "string" ? { preview: item.preview } : {} }] : [];
+    }) : [],
+    sessions: readSessions(raw.sessions),
+    attached: readAttached(raw.attached),
+    owned: readAttached(raw.owned),
+    attachError: attachError && typeof attachError.key === "string" && typeof attachError.message === "string" ? { key: attachError.key, message: attachError.message } : null
+  };
+}
+function harnessDisplayName(id) {
+  return HARNESS_NAMES[id] ?? id;
+}
+function sessionDisplayName(session) {
+  const title = session.title?.trim();
+  return title && title !== session.name ? title : session.name || "Untitled chat";
+}
+function sessionActivity(state, row) {
+  if (state.needsInput && row.active) return "needs-input";
+  if (state.busy && row.active) return "working";
+  const attention = state.attention.find((item) => item.key === row.key)?.kind;
+  if (attention) return attention;
+  if (row.runtimeStatus === "busy") return "working";
+  if (row.live || row.runtimeStatus === "idle") return "recent";
+  return "idle";
+}
+function filterSessions(rows, query) {
+  const needle = query.trim().toLocaleLowerCase();
+  if (!needle) return [...rows];
+  return rows.filter((row) => [row.name, row.title, row.cwd, row.harness, harnessDisplayName(row.harness)].some((value) => value.toLocaleLowerCase().includes(needle)));
+}
+function groupConversation(entries) {
+  const blocks = [];
+  for (const entry of entries) {
+    if (entry.role !== "tool") {
+      blocks.push({ kind: "entry", id: entry.id, entry });
+      continue;
+    }
+    const previous = blocks.at(-1);
+    if (previous?.kind === "activity") previous.entries.push(entry);
+    else blocks.push({ kind: "activity", id: `activity:${entry.id}`, entries: [entry] });
+  }
+  return blocks;
+}
+function toolCategory(entry) {
+  const name = entry.label?.toLocaleLowerCase() ?? "";
+  if (/read|view|open_file|list_dir/.test(name)) return "read";
+  if (/search|find|grep|glob/.test(name)) return "search";
+  if (/edit|write|patch|replace|create_file/.test(name)) return "edit";
+  if (/test|typecheck|lint|build/.test(name)) return "test";
+  if (/terminal|bash|shell|command|exec/.test(name)) return /\b(test|typecheck|lint|build)\b/i.test(entry.arguments ?? "") ? "test" : "command";
+  if (/browser|web|fetch|url/.test(name)) return "web";
+  if (/subagent|spawn|task/.test(name)) return "agent";
+  return "other";
+}
+function toolTarget(argumentsText) {
+  if (!argumentsText) return "";
+  try {
+    const args = JSON.parse(argumentsText);
+    for (const key of ["file_path", "target_file", "path", "command", "cmd", "query", "pattern", "url"]) {
+      if (typeof args?.[key] === "string") return args[key];
+    }
+  } catch {
+    return argumentsText.length > 120 ? `${argumentsText.slice(0, 117)}\u2026` : argumentsText;
+  }
+  return "";
+}
+function compactToolTarget(target, workspace) {
+  const prefix = workspace && !workspace.endsWith("/") ? `${workspace}/` : workspace;
+  return prefix && target.startsWith(prefix) ? target.slice(prefix.length) : target;
+}
+function activitySummary(entries) {
+  const counts = /* @__PURE__ */ new Map();
+  for (const entry of entries) counts.set(toolCategory(entry), (counts.get(toolCategory(entry)) ?? 0) + 1);
+  if ([...counts.keys()].every((key) => key === "read" || key === "search")) return `Explored ${entries.length} ${entries.length === 1 ? "item" : "items"}`;
+  const labels = { edit: "changed", test: "tests/builds", command: "commands", read: "reads", search: "searches", web: "web", agent: "agents", other: "other" };
+  return `Activity \xB7 ${Object.entries(labels).flatMap(([key, label]) => counts.has(key) ? [`${counts.get(key)} ${label}`] : []).join(" \xB7 ")}`;
+}
+function canContinueHere(state) {
+  if (state.mode !== "mirror" || state.canSend) return false;
+  const row = state.attached?.key ? state.sessions.find((item) => item.key === state.attached.key) : null;
+  return state.canResume && row?.runtimeStatus !== "busy" && row?.runtimeStatus !== "idle";
+}
+function operationLabel(operation) {
+  if (!operation) return "";
+  const labels = { discover: "Refreshing chats\u2026", attach: "Opening chat\u2026", resume: "Continuing here\u2026", branch: "Starting continuation\u2026", reduce: "Reducing context and verifying reversibility\u2026", terminal: "Preparing terminal handoff\u2026", export: "Exporting losslessly\u2026", refresh: "Retrying\u2026" };
+  return labels[operation] ?? `${operation.replaceAll("_", " ")}\u2026`;
+}
+function terminalCommand(handoff) {
+  const quote = (value) => /^[A-Za-z0-9_./:@%+=,-]+$/.test(value) ? value : `'${value.replaceAll("'", "'\\''")}'`;
+  return [handoff.program, ...handoff.arguments].map(quote).join(" ");
+}
+function isSendKey(event) {
+  return event.key === "Enter" && !event.shiftKey && !event.isComposing;
+}
+
+// src/components.jsx
+import { jsx, jsxs } from "preact/jsx-runtime";
+var markdown = new MarkdownIt({ html: false, linkify: true, breaks: false });
+var defaultLinkOpen = markdown.renderer.rules.link_open;
+markdown.renderer.rules.link_open = (tokens, index, options, env, self) => {
+  tokens[index]?.attrSet("target", "_blank");
+  tokens[index]?.attrSet("rel", "noreferrer noopener");
+  return defaultLinkOpen ? defaultLinkOpen(tokens, index, options, env, self) : self.renderToken(tokens, index, options);
+};
+var LOGOS = {
+  "claude-code": {
+    viewBox: "-1 3.5 26 18",
+    paths: [
+      ["path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M20.998 10.949H24v3.102h-3v3.028h-1.487V20H18v-2.921h-1.487V20H15v-2.921H9V20H7.488v-2.921H6V20H4.487v-2.921H3V14.05H0V10.95h3V5h17.998v5.949zM6 10.949h1.488V8.102H6v2.847zm10.51 0H18V8.102h-1.49v2.847z" }]
+    ]
+  },
+  codex: {
+    viewBox: "-1 -1 26 26",
+    paths: [
+      ["path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M8.086.457a6.105 6.105 0 013.046-.415c1.333.153 2.521.72 3.564 1.7a.117.117 0 00.107.029c1.408-.346 2.762-.224 4.061.366l.063.03.154.076c1.357.703 2.33 1.77 2.918 3.198.278.679.418 1.388.421 2.126a5.655 5.655 0 01-.18 1.631.167.167 0 00.04.155 5.982 5.982 0 011.578 2.891c.385 1.901-.01 3.615-1.183 5.14l-.182.22a6.063 6.063 0 01-2.934 1.851.162.162 0 00-.108.102c-.255.736-.511 1.364-.987 1.992-1.199 1.582-2.962 2.462-4.948 2.451-1.583-.008-2.986-.587-4.21-1.736a.145.145 0 00-.14-.032c-.518.167-1.04.191-1.604.185a5.924 5.924 0 01-2.595-.622 6.058 6.058 0 01-2.146-1.781c-.203-.269-.404-.522-.551-.821a7.74 7.74 0 01-.495-1.283 6.11 6.11 0 01-.017-3.064.166.166 0 00.008-.074.115.115 0 00-.037-.064 5.958 5.958 0 01-1.38-2.202 5.196 5.196 0 01-.333-1.589 6.915 6.915 0 01.188-2.132c.45-1.484 1.309-2.648 2.577-3.493.282-.188.55-.334.802-.438.286-.12.573-.22.861-.304a.129.129 0 00.087-.087A6.016 6.016 0 015.635 2.31C6.315 1.464 7.132.846 8.086.457zm-.804 7.85a.848.848 0 00-1.473.842l1.694 2.965-1.688 2.848a.849.849 0 001.46.864l1.94-3.272a.849.849 0 00.007-.854l-1.94-3.393zm5.446 6.24a.849.849 0 000 1.695h4.848a.849.849 0 000-1.696h-4.848z" }]
+    ]
+  },
+  grok: {
+    viewBox: "-1 -1 26 26",
+    paths: [["path", { d: "M9.27 15.29l7.978-5.897c.391-.29.95-.177 1.137.272.98 2.369.542 5.215-1.41 7.169-1.951 1.954-4.667 2.382-7.149 1.406l-2.711 1.257c3.889 2.661 8.611 2.003 11.562-.953 2.341-2.344 3.066-5.539 2.388-8.42l.006.007c-.983-4.232.242-5.924 2.75-9.383.06-.082.12-.164.179-.248l-3.301 3.305v-.01L9.267 15.292M7.623 16.723c-2.792-2.67-2.31-6.801.071-9.184 1.761-1.763 4.647-2.483 7.166-1.425l2.705-1.25a7.808 7.808 0 00-1.829-1A8.975 8.975 0 005.984 5.83c-2.533 2.536-3.33 6.436-1.962 9.764 1.022 2.487-.653 4.246-2.34 6.022-.599.63-1.199 1.259-1.682 1.925l7.62-6.815" }]]
+  },
+  opencode: { viewBox: "2.5 0 19 24", paths: [["path", { d: "M16 6H8v12h8V6zm4 16H4V2h16v20z" }]] },
+  pi: {
+    viewBox: "0 0 24 24",
+    paths: [
+      ["path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M1 1h16.5v11H12v5.5H6.5V23H1V1zm5.5 5.5V12H12V6.5H6.5z" }],
+      ["path", { d: "M17.5 12H23v11h-5.5V12z" }]
+    ]
+  }
+};
+function Markdown({ value }) {
+  const html = useMemo(() => markdown.render(value), [value]);
+  return /* @__PURE__ */ jsx("div", { class: "scui-markdown", dangerouslySetInnerHTML: { __html: html } });
+}
+function HarnessLogo({ id, activity, size = 28, onMissingLogo }) {
+  const logo = LOGOS[id];
+  useEffect(() => {
+    if (!logo) onMissingLogo?.(id);
+  }, [id, logo, onMissingLogo]);
+  if (!logo) return null;
+  return /* @__PURE__ */ jsxs("span", { class: "scui-logo", "data-harness": id, "data-activity": activity, style: `--scui-logo-size:${size}px`, "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("svg", { viewBox: logo.viewBox, focusable: "false", children: logo.paths.map(([Tag, props], index) => /* @__PURE__ */ jsx(Tag, { ...props }, index)) }),
+    activity && activity !== "idle" ? /* @__PURE__ */ jsx("i", {}) : null
+  ] });
+}
+function LoadingStatus({ state, compact = false }) {
+  const copy = {
+    connecting: ["Connecting to coding agents", "Checking installed harnesses and capabilities.", 0],
+    starting: [`Starting ${harnessDisplayName(state.harness) || "coding agent"}`, "Opening a controlled session in this workspace.", 1],
+    discovering: ["Loading recent sessions", "Scanning native session stores without loading full transcripts.", 2],
+    ready: ["Ready", "Coding sessions are up to date.", 3]
+  }[state.startup];
+  return /* @__PURE__ */ jsxs("div", { class: `scui-loading${compact ? " scui-loading-compact" : ""}`, role: "status", "aria-busy": state.startup !== "ready", children: [
+    /* @__PURE__ */ jsx("span", { class: "scui-orbit", "aria-hidden": "true", children: /* @__PURE__ */ jsx("i", {}) }),
+    /* @__PURE__ */ jsxs("span", { class: "scui-loading-copy", children: [
+      /* @__PURE__ */ jsx("strong", { children: copy[0] }),
+      /* @__PURE__ */ jsx("small", { children: copy[1] })
+    ] }),
+    /* @__PURE__ */ jsx("span", { class: "scui-progress", "aria-hidden": "true", children: [1, 2, 3].map((step) => /* @__PURE__ */ jsx("i", { "data-progress": step <= copy[2] ? "done" : step === copy[2] + 1 ? "current" : "waiting" }, step)) })
+  ] });
+}
+function RequestCard({ entry, adapter, canRespond }) {
+  const request = entry.request;
+  if (!request) return null;
+  if (request.status === "responded") {
+    return /* @__PURE__ */ jsxs("div", { class: "scui-request-done", children: [
+      "\u2713 Request answered \xB7 ",
+      request.resolution?.name ?? request.requestKind
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("section", { class: "scui-request", "aria-label": `${request.requestKind} needs input`, children: [
+    /* @__PURE__ */ jsx("strong", { children: "Agent needs input" }),
+    /* @__PURE__ */ jsx(Markdown, { value: request.payloadText || entry.text }),
+    /* @__PURE__ */ jsxs("div", { class: "scui-request-actions", children: [
+      request.options.map((option) => /* @__PURE__ */ jsx("button", { type: "button", disabled: !canRespond, onClick: () => adapter.onIntent({ action: "respond", requestId: request.requestId, optionId: option.optionId }), children: option.name }, option.optionId)),
+      request.cancellable ? /* @__PURE__ */ jsx("button", { type: "button", disabled: !canRespond, onClick: () => adapter.onIntent({ action: "respond", requestId: request.requestId, optionId: null }), children: "Cancel" }) : null
+    ] })
+  ] });
+}
+function ContextDisclosure({ context }) {
+  if (!context?.length) return null;
+  return /* @__PURE__ */ jsxs("details", { class: "scui-context", children: [
+    /* @__PURE__ */ jsxs("summary", { children: [
+      "Context \xB7 ",
+      context.length
+    ] }),
+    /* @__PURE__ */ jsx("div", { children: context.map((item, index) => /* @__PURE__ */ jsxs("p", { children: [
+      /* @__PURE__ */ jsx("strong", { children: item.label }),
+      /* @__PURE__ */ jsx("span", { children: item.detail })
+    ] }, item.id ?? index)) })
+  ] });
+}
+function TranscriptEntry({ entry, state, adapter }) {
+  if (entry.role === "request") return /* @__PURE__ */ jsx(RequestCard, { entry, adapter, canRespond: state.canRespond });
+  if (entry.role === "reasoning") {
+    return /* @__PURE__ */ jsxs("details", { class: "scui-reasoning", open: entry.streaming, children: [
+      /* @__PURE__ */ jsx("summary", { children: entry.streaming ? "Reasoning\u2026" : "Reasoning" }),
+      /* @__PURE__ */ jsx(Markdown, { value: entry.text })
+    ] });
+  }
+  if (entry.role === "notice" || entry.role === "system") return /* @__PURE__ */ jsx("div", { class: "scui-notice", "data-code": entry.code, children: entry.text });
+  return /* @__PURE__ */ jsxs("article", { class: "scui-message", "data-role": entry.role, children: [
+    /* @__PURE__ */ jsx(Markdown, { value: entry.text }),
+    /* @__PURE__ */ jsx(ContextDisclosure, { context: entry.context }),
+    entry.truncated ? /* @__PURE__ */ jsx("small", { class: "scui-truncated", children: "Entry truncated by host \xB7 load native session for the complete value" }) : null
+  ] });
+}
+function ToolRow({ entry, workspace }) {
+  const [open, setOpen] = useState(entry.status === "pending");
+  const detailId = useId();
+  const target = compactToolTarget(toolTarget(entry.arguments), workspace);
+  const hasDetail = Boolean(entry.arguments || entry.resultText);
+  const category = toolCategory(entry);
+  return /* @__PURE__ */ jsxs("div", { class: "scui-tool", "data-status": entry.status ?? "completed", "data-category": category, children: [
+    /* @__PURE__ */ jsxs("button", { type: "button", class: "scui-tool-head", disabled: !hasDetail, "aria-expanded": hasDetail ? open : void 0, "aria-controls": hasDetail ? detailId : void 0, onClick: () => hasDetail && setOpen((value) => !value), children: [
+      /* @__PURE__ */ jsx("span", { class: "scui-tool-glyph", "aria-hidden": "true", children: { read: "\u25A4", search: "\u2315", edit: "\u270E", command: ">_", test: "\u25C7", web: "\u25CE", agent: "\u2659", other: "\u25C6" }[category] }),
+      /* @__PURE__ */ jsx("strong", { children: entry.label?.split(/__|\//).at(-1)?.replaceAll("_", " ") || "Tool" }),
+      target ? /* @__PURE__ */ jsx("span", { class: "scui-tool-target", title: toolTarget(entry.arguments), children: target }) : null,
+      /* @__PURE__ */ jsx("span", { class: "scui-spacer" }),
+      /* @__PURE__ */ jsx("span", { "aria-label": entry.status ?? "completed", children: entry.status === "pending" ? "\u25CC" : entry.status === "error" ? "\xD7" : "\u2713" })
+    ] }),
+    hasDetail && open ? /* @__PURE__ */ jsxs("div", { id: detailId, class: "scui-tool-detail", children: [
+      entry.arguments ? /* @__PURE__ */ jsxs("pre", { children: [
+        /* @__PURE__ */ jsx("b", { children: "Input" }),
+        "\n",
+        entry.arguments
+      ] }) : null,
+      entry.resultText ? /* @__PURE__ */ jsxs("pre", { "data-error": entry.status === "error", children: [
+        /* @__PURE__ */ jsx("b", { children: "Output" }),
+        "\n",
+        entry.resultText,
+        entry.truncated ? "\n[truncated]" : ""
+      ] }) : null
+    ] }) : null
+  ] });
+}
+function ActivityGroup({ entries, state }) {
+  const active = entries.some((entry) => entry.status === "pending");
+  const [open, setOpen] = useState(active);
+  const id = useId();
+  useEffect(() => {
+    if (active) setOpen(true);
+  }, [active]);
+  return /* @__PURE__ */ jsxs("section", { class: "scui-activity", children: [
+    /* @__PURE__ */ jsxs("button", { class: "scui-activity-head", type: "button", "aria-expanded": open, "aria-controls": id, onClick: () => setOpen((value) => !value), children: [
+      /* @__PURE__ */ jsx("span", { class: "scui-fold", "data-open": open, children: "\u203A" }),
+      /* @__PURE__ */ jsx("strong", { children: activitySummary(entries) }),
+      /* @__PURE__ */ jsx("span", { class: "scui-spacer" }),
+      /* @__PURE__ */ jsxs("small", { children: [
+        entries.filter((entry) => entry.status === "completed").length,
+        "/",
+        entries.length
+      ] })
+    ] }),
+    open ? /* @__PURE__ */ jsx("div", { id, children: entries.map((entry) => /* @__PURE__ */ jsx(ToolRow, { entry, workspace: state.workspace }, entry.id)) }) : null
+  ] });
+}
+function TaskPlan({ plan }) {
+  if (!plan.items.length) return null;
+  const complete = plan.items.filter((item) => item.status === "completed" || item.status === "cancelled").length;
+  return /* @__PURE__ */ jsxs("details", { class: "scui-plan", children: [
+    /* @__PURE__ */ jsxs("summary", { children: [
+      /* @__PURE__ */ jsx("span", { children: "Plan" }),
+      /* @__PURE__ */ jsxs("small", { children: [
+        complete,
+        "/",
+        plan.items.length
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("ol", { children: plan.items.map((item) => /* @__PURE__ */ jsxs("li", { "data-status": item.status, children: [
+      /* @__PURE__ */ jsx("i", { "aria-hidden": "true" }),
+      " ",
+      /* @__PURE__ */ jsx("span", { children: item.title })
+    ] }, item.id)) })
+  ] });
+}
+function SessionDetails({ semantics }) {
+  if (!semantics.fidelity && !semantics.residueCount && !semantics.parseErrors && !semantics.subagents.length) return null;
+  return /* @__PURE__ */ jsxs("details", { class: "scui-details", children: [
+    /* @__PURE__ */ jsx("summary", { children: "Session details" }),
+    /* @__PURE__ */ jsxs("div", { children: [
+      semantics.fidelity ? /* @__PURE__ */ jsxs("p", { children: [
+        /* @__PURE__ */ jsx("strong", { children: "Fidelity" }),
+        /* @__PURE__ */ jsx("span", { children: semantics.fidelity.replaceAll("_", " ") })
+      ] }) : null,
+      /* @__PURE__ */ jsxs("p", { children: [
+        /* @__PURE__ */ jsx("strong", { children: "Native records" }),
+        /* @__PURE__ */ jsx("span", { children: semantics.rawRecords })
+      ] }),
+      semantics.residueCount ? /* @__PURE__ */ jsxs("p", { children: [
+        /* @__PURE__ */ jsx("strong", { children: "Residue" }),
+        /* @__PURE__ */ jsxs("span", { children: [
+          semantics.residueCount,
+          " retained"
+        ] })
+      ] }) : null,
+      semantics.parseErrors ? /* @__PURE__ */ jsxs("p", { children: [
+        /* @__PURE__ */ jsx("strong", { children: "Parse diagnostics" }),
+        /* @__PURE__ */ jsx("span", { children: semantics.parseErrors })
+      ] }) : null,
+      semantics.subagents.map((agent) => /* @__PURE__ */ jsxs("p", { children: [
+        /* @__PURE__ */ jsxs("strong", { children: [
+          agent.source,
+          " subagent"
+        ] }),
+        /* @__PURE__ */ jsxs("span", { children: [
+          agent.messages,
+          " messages \xB7 ",
+          agent.fidelity.replaceAll("_", " ")
+        ] })
+      ] }, agent.id))
+    ] })
+  ] });
+}
+var conversationMemory = /* @__PURE__ */ new Map();
+var composerMemory = /* @__PURE__ */ new Map();
+function Conversation({ state, adapter, components = {}, slots = {}, memoryKey = state.attached?.key || `${state.harness}:${state.workspace}`, pending = null }) {
+  const scroller = useRef(null);
+  const remembered = conversationMemory.get(memoryKey) ?? { top: null, atBottom: true };
+  const [atBottom, setAtBottom] = useState(remembered.atBottom);
+  const earlierAnchor = useRef(null);
+  const restored = useRef(false);
+  const blocks = groupConversation(state.transcript);
+  const Entry = components.TranscriptEntry ?? TranscriptEntry;
+  const Group = components.ActivityGroup ?? ActivityGroup;
+  const Before = slots.beforeConversation;
+  const After = slots.afterConversation;
+  const Empty = slots.emptyConversation;
+  const pin = () => {
+    if (!scroller.current) return;
+    scroller.current.scrollTop = scroller.current.scrollHeight;
+    setAtBottom(true);
+    conversationMemory.set(memoryKey, { top: scroller.current.scrollTop, atBottom: true });
+  };
+  useLayoutEffect(() => {
+    const element = scroller.current;
+    if (!element) return;
+    const anchor = earlierAnchor.current;
+    if (anchor && state.transcript.length > anchor.entries) {
+      element.scrollTop = anchor.top + (element.scrollHeight - anchor.height);
+      earlierAnchor.current = null;
+      conversationMemory.set(memoryKey, { top: element.scrollTop, atBottom: false });
+      return;
+    }
+    if (!restored.current) {
+      restored.current = true;
+      if (remembered.top !== null && !remembered.atBottom) element.scrollTop = remembered.top;
+      else pin();
+    } else if (atBottom) pin();
+  }, [memoryKey, state.transcript.length, state.busy]);
+  return /* @__PURE__ */ jsxs("div", { class: "scui-conversation-wrap", children: [
+    /* @__PURE__ */ jsx("div", { class: "scui-conversation", ref: scroller, tabIndex: 0, "aria-label": "Conversation", onScroll: (event) => {
+      const element = event.currentTarget;
+      const bottom = element.scrollHeight - element.scrollTop - element.clientHeight <= 64;
+      setAtBottom(bottom);
+      conversationMemory.set(memoryKey, { top: element.scrollTop, atBottom: bottom });
+    }, children: /* @__PURE__ */ jsxs("div", { children: [
+      Before ? /* @__PURE__ */ jsx(Before, { state, adapter, value: null }) : null,
+      /* @__PURE__ */ jsx(TaskPlan, { plan: state.taskPlan }),
+      /* @__PURE__ */ jsx(SessionDetails, { semantics: state.semantics }),
+      state.history.hasEarlier ? /* @__PURE__ */ jsx("button", { class: "scui-load", type: "button", disabled: Boolean(state.operation), onClick: () => {
+        const element = scroller.current;
+        if (element) earlierAnchor.current = { height: element.scrollHeight, top: element.scrollTop, entries: state.transcript.length };
+        setAtBottom(false);
+        adapter.onIntent({ action: "loadEarlier" });
+      }, children: "Load earlier messages" }) : null,
+      !blocks.length && state.startup !== "ready" ? /* @__PURE__ */ jsx(LoadingStatus, { state }) : null,
+      !blocks.length && state.startup === "ready" ? Empty ? /* @__PURE__ */ jsx(Empty, { state, adapter, value: null }) : /* @__PURE__ */ jsx("div", { class: "scui-empty", children: state.error ?? (state.harness ? `${harnessDisplayName(state.harness)} is listening. Say something.` : "No transcript yet.") }) : null,
+      blocks.map((block) => block.kind === "activity" ? /* @__PURE__ */ jsx(Group, { value: block.entries, entries: block.entries, state, adapter }, block.id) : /* @__PURE__ */ jsx(Entry, { value: block.entry, entry: block.entry, state, adapter }, block.id)),
+      pending ? /* @__PURE__ */ jsxs("article", { class: "scui-message scui-pending", "data-role": "user", children: [
+        /* @__PURE__ */ jsx(Markdown, { value: pending }),
+        /* @__PURE__ */ jsx("small", { children: state.error && !state.busy ? "Not sent" : "Sending\u2026" })
+      ] }) : null,
+      state.busy ? /* @__PURE__ */ jsxs("div", { class: "scui-working", role: "status", children: [
+        /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\u2726" }),
+        /* @__PURE__ */ jsx("i", {}),
+        /* @__PURE__ */ jsx("i", {}),
+        /* @__PURE__ */ jsx("i", {}),
+        /* @__PURE__ */ jsxs("small", { children: [
+          harnessDisplayName(state.harness),
+          " is working"
+        ] })
+      ] }) : null,
+      After ? /* @__PURE__ */ jsx(After, { state, adapter, value: null }) : null
+    ] }) }),
+    !atBottom ? /* @__PURE__ */ jsx("button", { class: "scui-latest", type: "button", onClick: pin, children: "\u2193 Latest" }) : null
+  ] });
+}
+function SessionRow({ row, state, onOpen }) {
+  const activity = sessionActivity(state, row);
+  const preview = state.attention.find((item) => item.key === row.key)?.preview;
+  return /* @__PURE__ */ jsxs("button", { class: "scui-session", "data-active": row.active, "data-activity": activity, type: "button", onClick: () => onOpen(row), children: [
+    /* @__PURE__ */ jsx(HarnessLogo, { id: row.harness, activity, size: 34 }),
+    /* @__PURE__ */ jsxs("span", { class: "scui-session-copy", children: [
+      /* @__PURE__ */ jsxs("span", { children: [
+        /* @__PURE__ */ jsx("strong", { children: sessionDisplayName(row) }),
+        /* @__PURE__ */ jsx("small", { children: row.age })
+      ] }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        /* @__PURE__ */ jsx("b", { children: harnessDisplayName(row.harness) }),
+        /* @__PURE__ */ jsx("small", { children: preview || row.cwd || row.name })
+      ] }),
+      state.attachError?.key === row.key ? /* @__PURE__ */ jsx("em", { children: state.attachError.message }) : null
+    ] })
+  ] });
+}
+function SessionList({ state, adapter, onOpen, onNew, onClose, components = {}, labels = DEFAULT_LABELS }) {
+  const [query, setQuery] = useState("");
+  const rows = filterSessions(state.sessions, query);
+  const Row = components.SessionRow ?? SessionRow;
+  return /* @__PURE__ */ jsxs("section", { class: "scui-list", children: [
+    /* @__PURE__ */ jsxs("header", { class: "scui-head", children: [
+      /* @__PURE__ */ jsxs("span", { children: [
+        /* @__PURE__ */ jsx("strong", { children: labels.chats }),
+        /* @__PURE__ */ jsxs("small", { children: [
+          state.sessions.length,
+          " recent conversations"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("button", { type: "button", "aria-label": labels.newChat, disabled: !state.harnesses.some((item) => item.startable), onClick: onNew, children: "\uFF0B" }),
+      onClose ? /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "Close", onClick: onClose, children: "\xD7" }) : null
+    ] }),
+    state.startup !== "ready" ? /* @__PURE__ */ jsx(LoadingStatus, { state, compact: rows.length > 0 }) : null,
+    state.sessions.length > 4 ? /* @__PURE__ */ jsxs("label", { class: "scui-search", children: [
+      /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\u2315" }),
+      /* @__PURE__ */ jsx("input", { type: "search", "aria-label": labels.searchChats, placeholder: labels.searchChats, value: query, onInput: (event) => setQuery(event.currentTarget.value) }),
+      /* @__PURE__ */ jsx("small", { children: rows.length })
+    ] }) : null,
+    /* @__PURE__ */ jsxs("div", { class: "scui-session-rows", children: [
+      !rows.length && state.startup === "ready" ? /* @__PURE__ */ jsx("div", { class: "scui-empty", children: query ? "No chats match your search." : state.error ?? "No coding chats found." }) : null,
+      rows.map((row) => /* @__PURE__ */ jsx(Row, { value: row, row, state, adapter, onOpen }, row.key)),
+      state.history.hasMoreSessions ? /* @__PURE__ */ jsx("button", { class: "scui-load", type: "button", onClick: () => adapter.onIntent({ action: "loadSessions" }), children: "Load older chats" }) : null
+    ] })
+  ] });
+}
+function ContinuationBar({ state, adapter, labels = DEFAULT_LABELS }) {
+  if (state.mode !== "mirror" || state.canSend) return null;
+  const attached = state.attached;
+  const row = attached?.key ? state.sessions.find((item) => item.key === attached.key) : null;
+  const activeElsewhere = row?.runtimeStatus === "busy" || row?.runtimeStatus === "idle";
+  const resume = canContinueHere(state);
+  const join = state.canAttach;
+  const branch = state.canBranch;
+  if (!resume && !join && !branch) return /* @__PURE__ */ jsx("div", { class: "scui-continuation", children: /* @__PURE__ */ jsxs("span", { children: [
+    /* @__PURE__ */ jsx("strong", { children: activeElsewhere ? "Active elsewhere" : "Read-only" }),
+    /* @__PURE__ */ jsx("small", { children: "This session cannot be continued by an available harness." })
+  ] }) });
+  return /* @__PURE__ */ jsxs("div", { class: "scui-continuation", children: [
+    /* @__PURE__ */ jsxs("span", { children: [
+      /* @__PURE__ */ jsx("strong", { children: activeElsewhere ? "Active elsewhere" : "Read-only" }),
+      /* @__PURE__ */ jsx("small", { children: join ? "Join the proven live runtime without taking it over." : resume ? `Resume this ${harnessDisplayName(state.harness)} session here.` : "Start an independent continuation." })
+    ] }),
+    /* @__PURE__ */ jsx("button", { type: "button", disabled: Boolean(state.operation), onClick: () => adapter.onIntent(join ? { action: "join" } : resume ? { action: "resume" } : { action: "branch" }), children: join ? labels.joinLive : resume ? labels.continueHere : labels.forkHere })
+  ] });
+}
+function Composer({ state, adapter, labels = DEFAULT_LABELS, memoryKey = state.attached?.key || `${state.harness}:${state.workspace}`, onPending }) {
+  const remembered = composerMemory.get(memoryKey) ?? { draft: state.savedDraft, queue: [] };
+  const [draft, setDraft] = useState(remembered.draft);
+  const [queue, setQueue] = useState(remembered.queue);
+  const textarea = useRef(null);
+  useEffect(() => {
+    if (!state.busy && state.canSend && queue.length) {
+      const [next, ...rest] = queue;
+      setQueue(rest);
+      composerMemory.set(memoryKey, { draft, queue: rest });
+      onPending?.(next);
+      adapter.onIntent({ action: "send", text: next });
+    }
+  }, [adapter, draft, memoryKey, onPending, queue, state.busy, state.canSend]);
+  useEffect(() => {
+    const timer = setTimeout(() => adapter.onIntent({ action: "draft", text: draft }), 250);
+    return () => clearTimeout(timer);
+  }, [adapter, draft]);
+  const send = () => {
+    const text = draft.trim();
+    if (!text) return;
+    if (state.busy) setQueue((items) => {
+      const next = [...items, text];
+      composerMemory.set(memoryKey, { draft: "", queue: next });
+      return next;
+    });
+    else if (state.canSend) {
+      onPending?.(text);
+      adapter.onIntent({ action: "send", text });
+    } else return;
+    setDraft("");
+    composerMemory.set(memoryKey, { draft: "", queue: state.busy ? [...queue, text] : queue });
+  };
+  return /* @__PURE__ */ jsxs("div", { class: "scui-compose", children: [
+    queue.length ? /* @__PURE__ */ jsxs("div", { class: "scui-queue", children: [
+      /* @__PURE__ */ jsxs("strong", { children: [
+        queue.length,
+        " queued"
+      ] }),
+      queue.map((item, index) => /* @__PURE__ */ jsxs("span", { children: [
+        item,
+        /* @__PURE__ */ jsx("button", { "aria-label": `Remove queued message ${index + 1}`, onClick: () => setQueue((items) => items.filter((_, itemIndex) => itemIndex !== index)), children: "\xD7" })
+      ] }, `${index}:${item}`))
+    ] }) : null,
+    /* @__PURE__ */ jsxs("div", { class: "scui-envelope", children: [
+      /* @__PURE__ */ jsx("textarea", { ref: textarea, rows: 1, "aria-label": `Message ${harnessDisplayName(state.harness) || "agent"}`, placeholder: state.startup !== "ready" ? "Connecting\u2026" : state.busy ? "Queue a follow-up\u2026" : labels.askAgent, value: draft, disabled: state.mode !== "control" && !state.canSend, onInput: (event) => {
+        const value = event.currentTarget.value;
+        setDraft(value);
+        composerMemory.set(memoryKey, { draft: value, queue });
+      }, onKeyDown: (event) => {
+        if (isSendKey(event)) {
+          event.preventDefault();
+          send();
+        }
+      } }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        state.busy ? /* @__PURE__ */ jsx("button", { class: "scui-stop", type: "button", "aria-label": "Stop agent", disabled: !state.canInterrupt, onClick: () => adapter.onIntent({ action: "interrupt" }), children: "\u25A0" }) : null,
+        /* @__PURE__ */ jsx("button", { class: "scui-send", type: "button", "aria-label": state.busy ? "Queue message" : "Send message", disabled: !draft.trim() || !state.busy && !state.canSend, onClick: send, children: state.busy ? "+" : "\u2191" })
+      ] })
+    ] })
+  ] });
+}
+function Receipt({ state, adapter }) {
+  const receipt = state.reductionReceipt;
+  if (receipt) return /* @__PURE__ */ jsx("div", { class: "scui-receipt", children: /* @__PURE__ */ jsxs("span", { children: [
+    /* @__PURE__ */ jsx("strong", { children: "Reduced and verified" }),
+    /* @__PURE__ */ jsxs("small", { children: [
+      receipt.sourceTokens.toLocaleString(),
+      " \u2192 ",
+      receipt.reducedTokens.toLocaleString(),
+      " tokens \xB7 ",
+      receipt.ratio.toFixed(1),
+      "\xD7 \xB7 reversible"
+    ] })
+  ] }) });
+  if (state.exportReceipt) return /* @__PURE__ */ jsxs("div", { class: "scui-receipt", children: [
+    /* @__PURE__ */ jsxs("span", { children: [
+      /* @__PURE__ */ jsxs("strong", { children: [
+        "Lossless export ready \xB7 ",
+        harnessDisplayName(state.exportReceipt.targetHarness)
+      ] }),
+      /* @__PURE__ */ jsxs("small", { children: [
+        state.exportReceipt.path,
+        " \xB7 ",
+        state.exportReceipt.files,
+        " files"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("button", { type: "button", onClick: () => adapter.copyText?.(state.exportReceipt.path), children: "Copy path" })
+  ] });
+  if (state.terminalHandoff) return /* @__PURE__ */ jsxs("div", { class: "scui-receipt", children: [
+    /* @__PURE__ */ jsxs("span", { children: [
+      /* @__PURE__ */ jsx("strong", { children: "Terminal handoff ready" }),
+      /* @__PURE__ */ jsx("small", { children: state.terminalHandoff.cwd })
+    ] }),
+    /* @__PURE__ */ jsx("button", { type: "button", onClick: () => adapter.copyText?.(terminalCommand(state.terminalHandoff)), children: "Copy command" })
+  ] });
+  return null;
+}
+function ChatHeader({ state, adapter, onBack, onNew, onClose }) {
+  const harness = state.attached?.harness ?? state.harness;
+  const targets = state.harnesses.filter((item) => item.startable);
+  const title = state.attached ? sessionDisplayName(state.attached) : harnessDisplayName(harness) || "Agent chat";
+  const status = state.needsInput ? "Needs input" : state.busy ? "Working" : state.mode === "mirror" ? "Read-only" : "Ready";
+  const menu = state.canDetach || state.canOpenTerminal || state.canBranch || state.canAttach || state.canExport || state.canReduce;
+  return /* @__PURE__ */ jsxs("header", { class: "scui-head scui-chat-head", children: [
+    /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "Back to chats", onClick: onBack, children: "\u2039" }),
+    /* @__PURE__ */ jsx(HarnessLogo, { id: harness, size: 28 }),
+    /* @__PURE__ */ jsxs("span", { children: [
+      /* @__PURE__ */ jsx("strong", { children: title }),
+      /* @__PURE__ */ jsxs("small", { children: [
+        harnessDisplayName(harness),
+        " \xB7 ",
+        status
+      ] })
+    ] }),
+    menu ? /* @__PURE__ */ jsxs("details", { class: "scui-menu", children: [
+      /* @__PURE__ */ jsx("summary", { "aria-label": "Conversation actions", children: "\u2022\u2022\u2022" }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        state.canDetach ? /* @__PURE__ */ jsx("button", { onClick: () => adapter.onIntent({ action: "detach" }), children: "Detach to read-only" }) : null,
+        state.canOpenTerminal ? /* @__PURE__ */ jsx("button", { onClick: () => adapter.onIntent({ action: "terminal" }), children: "Prepare terminal handoff" }) : null,
+        state.canReduce ? targets.map((target) => /* @__PURE__ */ jsx("button", { onClick: () => adapter.onIntent({ action: "reduce", targetHarness: target.id }), children: target.id === state.harness ? `Reduce and continue in ${target.label}` : `Reduce and switch to ${target.label}` }, `reduce:${target.id}`)) : null,
+        state.canBranch ? targets.map((target) => /* @__PURE__ */ jsx("button", { onClick: () => adapter.onIntent({ action: "branch", targetHarness: target.id }), children: target.id === state.harness ? `Fork in ${target.label}` : `Continue with ${target.label}` }, `branch:${target.id}`)) : null,
+        state.canExport && state.exportBackTarget ? /* @__PURE__ */ jsxs("button", { onClick: () => adapter.onIntent({ action: "export", targetHarness: state.exportBackTarget }), children: [
+          "Export back to ",
+          harnessDisplayName(state.exportBackTarget)
+        ] }) : null
+      ] })
+    ] }) : null,
+    /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "New chat", onClick: onNew, children: "\uFF0B" }),
+    onClose ? /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "Close", onClick: onClose, children: "\xD7" }) : null
+  ] });
+}
+function Chat({ state, adapter, onBack, onNew, onClose, components, slots, labels }) {
+  const Header = slots.header;
+  const memoryKey = state.attached?.key || `${state.harness}:${state.workspace}`;
+  const [pending, setPending] = useState(null);
+  const acknowledged = useRef(/* @__PURE__ */ new Set());
+  useEffect(() => {
+    setPending(null);
+  }, [memoryKey]);
+  useEffect(() => {
+    if (pending && state.transcript.some((entry) => entry.role === "user" && entry.text.trim() === pending.trim())) setPending(null);
+  }, [pending, state.transcript]);
+  useEffect(() => {
+    const key = state.attached?.key;
+    if (!key || !state.attention.some((item) => item.key === key)) {
+      if (key) acknowledged.current.delete(key);
+      return;
+    }
+    if (!acknowledged.current.has(key)) {
+      acknowledged.current.add(key);
+      adapter.onIntent({ action: "ack", key });
+    }
+  }, [adapter, state.attached?.key, state.attention]);
+  return /* @__PURE__ */ jsxs("section", { class: "scui-chat", children: [
+    Header ? /* @__PURE__ */ jsx(Header, { state, adapter, value: null }) : /* @__PURE__ */ jsx(ChatHeader, { state, adapter, onBack, onNew, onClose }),
+    operationLabel(state.operation) ? /* @__PURE__ */ jsxs("div", { class: "scui-operation", role: "status", children: [
+      /* @__PURE__ */ jsx("i", {}),
+      operationLabel(state.operation)
+    ] }) : null,
+    state.error ? /* @__PURE__ */ jsxs("div", { class: "scui-error", role: "alert", children: [
+      /* @__PURE__ */ jsx("span", { children: state.error }),
+      state.recoverable ? /* @__PURE__ */ jsx("button", { onClick: () => adapter.onIntent({ action: "refresh" }), children: "Retry" }) : null
+    ] }) : null,
+    /* @__PURE__ */ jsx(Receipt, { state, adapter }),
+    /* @__PURE__ */ jsx(Conversation, { state, adapter, components, slots, memoryKey, pending }, memoryKey),
+    /* @__PURE__ */ jsx(ContinuationBar, { state, adapter, labels }),
+    state.mode !== "mirror" || state.canSend ? /* @__PURE__ */ jsx(Composer, { state, adapter, labels, memoryKey, onPending: setPending }, memoryKey) : null
+  ] });
+}
+function NewChat({ state, adapter, onBack, onClose, onStarted, labels }) {
+  const startable = state.harnesses.filter((item) => item.startable);
+  const [harness, setHarness] = useState(startable[0]?.id ?? "");
+  const [draft, setDraft] = useState("");
+  const [starting, setStarting] = useState(false);
+  useEffect(() => {
+    if (starting && (state.busy || state.transcript.length)) onStarted();
+  }, [onStarted, starting, state.busy, state.transcript.length]);
+  useEffect(() => {
+    if (starting && state.error && !state.busy && !state.operation) setStarting(false);
+  }, [starting, state.busy, state.error, state.operation]);
+  const send = () => {
+    const text = draft.trim();
+    if (!text || !harness || starting) return;
+    setStarting(true);
+    adapter.onIntent({ action: "new", harness, text });
+  };
+  return /* @__PURE__ */ jsxs("section", { class: "scui-chat", children: [
+    /* @__PURE__ */ jsxs("header", { class: "scui-head", children: [
+      /* @__PURE__ */ jsx("button", { "aria-label": "Back", onClick: onBack, children: "\u2039" }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        /* @__PURE__ */ jsx("strong", { children: labels.newChat }),
+        /* @__PURE__ */ jsx("small", { children: "No session is created until you send" })
+      ] }),
+      onClose ? /* @__PURE__ */ jsx("button", { "aria-label": "Close", onClick: onClose, children: "\xD7" }) : null
+    ] }),
+    /* @__PURE__ */ jsxs("div", { class: "scui-new", children: [
+      /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\u2726" }),
+      /* @__PURE__ */ jsx("strong", { children: "What should the agent build or fix?" }),
+      /* @__PURE__ */ jsx("small", { children: "Choose a coding harness and send the first message." })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { class: "scui-compose", children: [
+      /* @__PURE__ */ jsxs("label", { class: "scui-harness-picker", children: [
+        /* @__PURE__ */ jsx(HarnessLogo, { id: harness, size: 24 }),
+        /* @__PURE__ */ jsx("span", { children: "Coding harness" }),
+        /* @__PURE__ */ jsx("select", { value: harness, disabled: starting, onChange: (event) => setHarness(event.currentTarget.value), children: state.harnesses.map((item) => /* @__PURE__ */ jsxs("option", { value: item.id, disabled: !item.startable, children: [
+          item.label,
+          item.startable ? "" : " \xB7 unavailable"
+        ] }, item.id)) })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { class: "scui-envelope", children: [
+        /* @__PURE__ */ jsx("textarea", { rows: 3, "aria-label": "Message coding agent", placeholder: startable.length ? "What should the agent do?" : "No coding harness is available", value: draft, disabled: !startable.length || starting, onInput: (event) => setDraft(event.currentTarget.value), onKeyDown: (event) => {
+          if (isSendKey(event)) {
+            event.preventDefault();
+            send();
+          }
+        } }),
+        /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx("button", { class: "scui-send", disabled: !draft.trim() || !harness || starting, onClick: send, children: starting ? "\u25CC" : "\u2191" }) })
+      ] })
+    ] })
+  ] });
+}
+function SupercodeMessenger({ state: stateInput, adapter, class: className = "", initialView, labels, components = {}, slots = {} }) {
+  const state = normalizeUiState(stateInput);
+  const copy = { ...DEFAULT_LABELS, ...labels };
+  const [view, setView] = useState(initialView ?? (state.attention.length ? "list" : state.attached || state.transcript.length ? "chat" : "list"));
+  const [opening, setOpening] = useState(null);
+  useEffect(() => {
+    if (!opening) return;
+    if (state.attached?.key === opening.key) {
+      setOpening(null);
+      setView("chat");
+    } else if (state.attachError?.key === opening.key) {
+      setOpening(null);
+    }
+  }, [opening, state.attachError?.key, state.attached?.key]);
+  const open = (row) => {
+    setOpening(row);
+    adapter.onIntent({ action: "ack", key: row.key });
+    adapter.onIntent({ action: "attach", key: row.key });
+  };
+  const close = () => adapter.onClose?.();
+  return /* @__PURE__ */ jsxs("main", { class: `scui-root ${className}`, "data-view": view, "data-mode": state.mode, "aria-label": "Supercode messenger", children: [
+    view === "list" ? /* @__PURE__ */ jsx(SessionList, { state, adapter, onOpen: open, onNew: () => setView("new"), onClose: adapter.onClose ? close : void 0, components, labels: copy }) : null,
+    view === "new" ? /* @__PURE__ */ jsx(NewChat, { state, adapter, onBack: () => setView("list"), onClose: adapter.onClose ? close : void 0, onStarted: () => setView("chat"), labels: copy }) : null,
+    view === "chat" ? /* @__PURE__ */ jsx(Chat, { state, adapter, onBack: () => setView("list"), onNew: () => setView("new"), onClose: adapter.onClose ? close : void 0, components, slots, labels: copy }) : null,
+    opening ? /* @__PURE__ */ jsxs("div", { class: "scui-opening", role: "status", "aria-busy": "true", children: [
+      /* @__PURE__ */ jsx(HarnessLogo, { id: opening.harness, size: 34 }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        /* @__PURE__ */ jsxs("strong", { children: [
+          "Opening ",
+          sessionDisplayName(opening)
+        ] }),
+        /* @__PURE__ */ jsx("small", { children: "Loading the latest transcript window\u2026" })
+      ] }),
+      /* @__PURE__ */ jsx("i", {})
+    ] }) : null,
+    slots.footer ? /* @__PURE__ */ jsx(slots.footer, { state, adapter, value: copy }) : null
+  ] });
+}
+
+// src/embed.jsx
+import { jsx as jsx2 } from "preact/jsx-runtime";
+function mountSupercodeMessenger(element, options) {
+  if (!(element instanceof Element)) throw new TypeError("mountSupercodeMessenger requires an Element");
+  let state = options.state;
+  const draw = () => render(/* @__PURE__ */ jsx2(SupercodeMessenger, { ...options, state }), element);
+  options.adapter.onIntent({ action: "mounted" });
+  draw();
+  return {
+    update(nextState) {
+      state = nextState;
+      draw();
+    },
+    unmount() {
+      render(null, element);
+    },
+    focus() {
+      element.querySelector("textarea, input, button, [tabindex]")?.focus({ preventScroll: true });
+    }
+  };
+}
+export {
+  mountSupercodeMessenger
+};