castle-web-cli 0.4.59 → 0.4.60

package/dist/chat-client.js

@@ -11,26 +11,26 @@
 // because the popover lives outside the React root.
 function applyBackendSegs(settings) {
     const segs = [
-        ['agent-router-seg', settings.router],
-        ['agent-tasks-seg', settings.tasks],
-        ['agent-model-seg', settings.claudeModel],
+        ["agent-router-seg", settings.router],
+        ["agent-tasks-seg", settings.tasks],
+        ["agent-model-seg", settings.claudeModel],
     ];
     for (const [segId, value] of segs) {
         if (!value)
             continue;
         for (const button of document.querySelectorAll(`#${segId} button`)) {
-            button.classList.toggle('active', (button.dataset.backend ?? button.dataset.model) === value);
+            button.classList.toggle("active", (button.dataset.backend ?? button.dataset.model) === value);
         }
     }
 }
-const TERMINAL_TASK_STATUSES = ['done', 'failed', 'interrupted'];
-const ATTACHMENT_URL_PREFIX = '/__castle/agent/attachments/';
+const TERMINAL_TASK_STATUSES = ["done", "failed", "interrupted"];
+const ATTACHMENT_URL_PREFIX = "/__castle/agent/attachments/";
 function renderMarkdown(text) {
     try {
         return { __html: marked.parse(text, { breaks: true }) };
     }
     catch {
-        return { __html: '' };
+        return { __html: "" };
     }
 }
 //
@@ -39,40 +39,44 @@ function renderMarkdown(text) {
 // run the terminal side (lazy PTY spawn, focus).
 //
 function focusChatInput() {
-    document.getElementById('chat-input')?.focus();
+    document.getElementById("chat-input")?.focus();
 }
 function initPanelChrome() {
-    const viewButtons = Array.from(document.querySelectorAll('#panel-view-seg button'));
+    const viewButtons = Array.from(document.querySelectorAll("#panel-view-seg button"));
     const applyView = (view) => {
-        document.body.classList.toggle('term-view', view === 'terminal');
+        document.body.classList.toggle("term-view", view === "terminal");
         for (const button of viewButtons) {
-            button.classList.toggle('active', button.dataset.view === view);
+            button.classList.toggle("active", button.dataset.view === view);
         }
         try {
-            localStorage.setItem('castle-panel-view', view);
+            localStorage.setItem("castle-panel-view", view);
         }
         catch {
             /* storage disabled */
         }
     };
-    document.addEventListener('castle-panel-view', (event) => {
-        const detail = event.detail;
+    document.addEventListener("castle-panel-view", (event) => {
+        const detail = event
+            .detail;
         if (!detail)
             return;
-        const view = detail.view === 'terminal' ? 'terminal' : 'chat';
+        const view = detail.view === "terminal" ? "terminal" : "chat";
         applyView(view);
-        if (view === 'chat' && detail.focus)
+        if (view === "chat" && detail.focus)
             focusChatInput();
     });
     for (const button of viewButtons) {
-        button.addEventListener('click', () => {
-            const view = button.dataset.view === 'terminal' ? 'terminal' : 'chat';
-            document.dispatchEvent(new CustomEvent('castle-panel-view', { detail: { view, focus: true } }));
+        button.addEventListener("click", () => {
+            const view = button.dataset.view === "terminal" ? "terminal" : "chat";
+            document.dispatchEvent(new CustomEvent("castle-panel-view", { detail: { view, focus: true } }));
         });
     }
-    let storedView = 'chat';
+    let storedView = "chat";
     try {
-        storedView = localStorage.getItem('castle-panel-view') === 'terminal' ? 'terminal' : 'chat';
+        storedView =
+            localStorage.getItem("castle-panel-view") === "terminal"
+                ? "terminal"
+                : "chat";
     }
     catch {
         /* storage disabled */
@@ -81,35 +85,36 @@ function initPanelChrome() {
     // When the panel is toggled open onto the chat view, focus the input.
     // ide-client's own click handler runs first and flips term-open; check the
     // final state a tick later.
-    document.getElementById('term-toggle')?.addEventListener('click', () => {
+    document.getElementById("term-toggle")?.addEventListener("click", () => {
         window.setTimeout(() => {
-            if (document.body.classList.contains('term-open') &&
-                !document.body.classList.contains('term-view')) {
+            if (document.body.classList.contains("term-open") &&
+                !document.body.classList.contains("term-view")) {
                 focusChatInput();
             }
         }, 0);
     });
-    const progressButtons = Array.from(document.querySelectorAll('#chat-progress-seg button'));
+    const progressButtons = Array.from(document.querySelectorAll("#chat-progress-seg button"));
     const applyProgressStyle = (style) => {
-        document.body.classList.toggle('progress-bars', style === 'bar');
+        document.body.classList.toggle("progress-bars", style === "bar");
         for (const button of progressButtons) {
-            button.classList.toggle('active', button.dataset.progress === style);
+            button.classList.toggle("active", button.dataset.progress === style);
         }
         try {
-            localStorage.setItem('castle-progress-style', style);
+            localStorage.setItem("castle-progress-style", style);
         }
         catch {
             /* storage disabled */
         }
     };
     for (const button of progressButtons) {
-        button.addEventListener('click', () => {
-            applyProgressStyle(button.dataset.progress === 'bar' ? 'bar' : 'pie');
+        button.addEventListener("click", () => {
+            applyProgressStyle(button.dataset.progress === "bar" ? "bar" : "pie");
         });
     }
-    let storedStyle = 'pie';
+    let storedStyle = "pie";
     try {
-        storedStyle = localStorage.getItem('castle-progress-style') === 'bar' ? 'bar' : 'pie';
+        storedStyle =
+            localStorage.getItem("castle-progress-style") === "bar" ? "bar" : "pie";
     }
     catch {
         /* storage disabled */
@@ -118,17 +123,19 @@ function initPanelChrome() {
     // Backend / model segs: clicks become events the React app forwards to the
     // server (the state lives in .castle/agent/settings.json).
     const serverSegs = [
-        ['agent-router-seg', 'router'],
-        ['agent-tasks-seg', 'tasks'],
-        ['agent-model-seg', 'claudeModel'],
+        ["agent-router-seg", "router"],
+        ["agent-tasks-seg", "tasks"],
+        ["agent-model-seg", "claudeModel"],
     ];
     for (const [segId, segKey] of serverSegs) {
         for (const button of document.querySelectorAll(`#${segId} button`)) {
-            button.addEventListener('click', () => {
+            button.addEventListener("click", () => {
                 const value = button.dataset.backend ?? button.dataset.model;
                 if (!value)
                     return;
-                document.dispatchEvent(new CustomEvent('castle-set-backend', { detail: { key: segKey, value } }));
+                document.dispatchEvent(new CustomEvent("castle-set-backend", {
+                    detail: { key: segKey, value },
+                }));
             });
         }
     }
@@ -137,7 +144,7 @@ function initPanelChrome() {
 // React app.
 //
 function applyServerEvent(ev, setMessages, setTasks, setFeeds) {
-    if (ev.type === 'hello') {
+    if (ev.type === "hello") {
         const messages = ev.messages ?? [];
         const tasks = ev.tasks ?? [];
         const feeds = ev.feeds ?? {};
@@ -147,40 +154,45 @@ function applyServerEvent(ev, setMessages, setTasks, setFeeds) {
         if (ev.settings)
             applyBackendSegs(ev.settings);
     }
-    else if (ev.type === 'task-feed' && ev.id) {
+    else if (ev.type === "task-feed" && ev.id) {
         const id = ev.id;
-        const entry = ev.entry ?? '';
-        setFeeds((prev) => ({ ...prev, [id]: [...(prev[id] ?? []).slice(-79), entry] }));
+        const entry = ev.entry ?? "";
+        setFeeds((prev) => ({
+            ...prev,
+            [id]: [...(prev[id] ?? []).slice(-79), entry],
+        }));
     }
-    else if (ev.type === 'settings' && ev.settings) {
+    else if (ev.type === "settings" && ev.settings) {
         applyBackendSegs(ev.settings);
     }
-    else if (ev.type === 'message-add' && ev.message) {
+    else if (ev.type === "message-add" && ev.message) {
         const message = ev.message;
         setMessages((prev) => [...prev, message]);
     }
-    else if (ev.type === 'message-delta' && ev.id) {
-        setMessages((prev) => prev.map((m) => (m.id === ev.id ? { ...m, text: m.text + (ev.delta ?? '') } : m)));
+    else if (ev.type === "message-delta" && ev.id) {
+        setMessages((prev) => prev.map((m) => m.id === ev.id ? { ...m, text: m.text + (ev.delta ?? "") } : m));
     }
-    else if (ev.type === 'message-activity' && ev.id) {
-        setMessages((prev) => prev.map((m) => (m.id === ev.id ? { ...m, activity: ev.activity ?? null } : m)));
+    else if (ev.type === "message-activity" && ev.id) {
+        setMessages((prev) => prev.map((m) => m.id === ev.id ? { ...m, activity: ev.activity ?? null } : m));
     }
-    else if (ev.type === 'message-done' && ev.id) {
+    else if (ev.type === "message-done" && ev.id) {
         setMessages((prev) => prev.map((m) => m.id === ev.id
             ? {
                 ...m,
-                text: ev.text ?? '',
-                status: ev.status ?? 'done',
+                text: ev.text ?? "",
+                status: ev.status ?? "done",
                 activity: null,
                 interrupted: ev.interrupted === true,
             }
             : m));
     }
-    else if (ev.type === 'task-update' && ev.task) {
+    else if (ev.type === "task-update" && ev.task) {
         const task = ev.task;
         setTasks((prev) => {
             const known = prev.some((t) => t.id === task.id);
-            const next = known ? prev.map((t) => (t.id === task.id ? task : t)) : [...prev, task];
+            const next = known
+                ? prev.map((t) => (t.id === task.id ? task : t))
+                : [...prev, task];
             return next.sort((a, b) => a.createdAt.localeCompare(b.createdAt));
         });
         if (TERMINAL_TASK_STATUSES.includes(task.status)) {
@@ -194,6 +206,53 @@ function applyServerEvent(ev, setMessages, setTasks, setFeeds) {
         }
     }
 }
+// Drop "[Reading X]" lines whose file is edited anywhere -- a read that's later
+// followed by an edit of the same file is redundant; just show the edit.
+function rollupFeed(lines) {
+    const editRe = /^\[Editing (.+)\]$/;
+    const readRe = /^\[Reading (.+)\]$/;
+    const edited = new Set();
+    for (const line of lines) {
+        const m = editRe.exec(line.trim());
+        if (m)
+            for (const f of m[1].split(", "))
+                edited.add(f);
+    }
+    const out = [];
+    for (const line of lines) {
+        const r = readRe.exec(line.trim());
+        if (r) {
+            const keep = r[1].split(", ").filter((f) => !edited.has(f));
+            if (keep.length === 0)
+                continue;
+            out.push(`[Reading ${keep.join(", ")}]`);
+            continue;
+        }
+        out.push(line);
+    }
+    return out;
+}
+// Collapse consecutive same-verb tool actions into one comma-separated line:
+// "[Editing A]" then "[Editing B]" -> "[Editing A, B]". Only word verbs merge
+// (Editing/Reading/...), so prose stays separate.
+function coalesceFeed(lines) {
+    const toolRe = /^\[([A-Za-z]+)\s+(.+)\]$/;
+    const out = [];
+    for (const line of lines) {
+        const m = toolRe.exec(line.trim());
+        if (m) {
+            const prev = out.length ? toolRe.exec(out[out.length - 1].trim()) : null;
+            if (prev && prev[1] === m[1]) {
+                if (!prev[2].split(", ").includes(m[2])) {
+                    out[out.length - 1] = `[${m[1]} ${prev[2]}, ${m[2]}]`;
+                }
+                continue;
+            }
+        }
+        out.push(line);
+    }
+    return out;
+}
 function TaskFeed(props) {
     const hostRef = React.useRef(null);
     React.useLayoutEffect(() => {
@@ -201,30 +260,66 @@ function TaskFeed(props) {
         if (host)
             host.scrollTop = host.scrollHeight;
     }, [props.lines]);
-    return (React.createElement("div", { className: "task-feed", ref: hostRef, onClick: (event) => event.stopPropagation() }, props.lines.map((line, index) => (React.createElement("div", { key: index }, line)))));
+    return (React.createElement("div", { className: "task-feed", ref: hostRef, onClick: (event) => event.stopPropagation() }, coalesceFeed(rollupFeed(props.lines)).map((line, index) => {
+        // Tool actions arrive bracketed (e.g. "[Editing Ball.jsx]"); render
+        // those as indented monospace. Everything else is the agent's prose --
+        // markdown-render it so **bold** / `code` show through.
+        const tool = /^\[(.+)\]$/.exec(line.trim());
+        if (tool) {
+            return (React.createElement("div", { key: index, className: "task-feed-tool" }, tool[1]));
+        }
+        return (React.createElement("div", { key: index, className: "task-feed-msg", dangerouslySetInnerHTML: renderMarkdown(line) }));
+    })));
+}
+// Stopwatch label: "7m 23s" (or just "23s" under a minute). Counts whole seconds.
+function fmtDuration(ms) {
+    const total = Math.max(0, Math.round(ms / 1000));
+    const m = Math.floor(total / 60);
+    const s = total % 60;
+    return m > 0 ? `${m}m ${s}s` : `${s}s`;
 }
 function TaskRow(props) {
     const { task, onAck } = props;
     const [expanded, setExpanded] = React.useState(false);
+    // Live stopwatch: re-render every second while running so the elapsed time
+    // ticks up; on finish the effect clears and the time freezes at the total.
+    const [nowMs, setNowMs] = React.useState(() => Date.now());
+    React.useEffect(() => {
+        if (task.status !== "running")
+            return undefined;
+        const timer = setInterval(() => setNowMs(Date.now()), 1000);
+        return () => clearInterval(timer);
+    }, [task.status]);
+    const startedMs = task.startedAt ? Date.parse(task.startedAt) : null;
+    const finishedMs = task.finishedAt ? Date.parse(task.finishedAt) : null;
     const finished = TERMINAL_TASK_STATUSES.includes(task.status);
     // A full circle means "click me to check off". A still-running task never
     // fills completely, even if its agent already reports 100.
-    const pct = task.status === 'done' ? 100 : finished ? task.progress : Math.min(task.progress, 95);
-    const notes = task.notes.trim() || task.resultSummary?.trim() || '(no notes from the agent yet)';
-    return (React.createElement("div", { className: `task-card${task.status === 'waiting' ? ' waiting' : ''}`, onClick: () => setExpanded(!expanded) },
+    const pct = task.status === "done"
+        ? 100
+        : finished
+            ? task.progress
+            : Math.min(task.progress, 95);
+    const notes = task.notes.trim() || task.resultSummary?.trim() || "";
+    return (React.createElement("div", { className: `task-card${task.status === "waiting" ? " waiting" : ""}`, onClick: () => setExpanded(!expanded) },
         React.createElement("div", { className: "task-row" },
-            React.createElement("span", { className: `task-pie${finished ? ' task-ack-pie' : ''}`, title: finished ? 'tested -- check off' : undefined, style: { background: `conic-gradient(#000000 ${pct}%, #eaeef2 0)` }, onClick: finished
+            React.createElement("span", { className: `task-pie${finished ? " task-ack-pie" : ""}`, title: finished ? "tested -- check off" : undefined, style: { background: `conic-gradient(#000000 ${pct}%, #eaeef2 0)` }, onClick: finished
                     ? (event) => {
                         event.stopPropagation();
                         onAck(task.id, false);
                     }
                     : undefined }),
             React.createElement("span", { className: "task-title" }, task.title),
-            task.status !== 'done' ? (React.createElement("span", { className: `task-status ${task.status}` }, task.status === 'running' ? `${pct}%` : task.status)) : null),
+            task.status === "running" && startedMs != null ? (React.createElement("span", { className: "task-time" }, fmtDuration(nowMs - startedMs))) : task.status === "done" &&
+                startedMs != null &&
+                finishedMs != null ? (React.createElement("span", { className: "task-time" }, fmtDuration(finishedMs - startedMs))) : task.status !== "done" ? (React.createElement("span", { className: `task-status ${task.status}` }, task.status)) : null),
         React.createElement("div", { className: "task-bar" },
             React.createElement("div", { style: { width: `${pct}%` } })),
-        expanded && task.status === 'running' && props.feed && props.feed.length > 0 ? (React.createElement(TaskFeed, { lines: props.feed })) : null,
-        expanded && task.status !== 'running' ? (React.createElement("div", { className: "task-notes", dangerouslySetInnerHTML: renderMarkdown(notes) })) : null));
+        expanded &&
+            task.status === "running" &&
+            props.feed &&
+            props.feed.length > 0 ? (React.createElement(TaskFeed, { lines: props.feed })) : null,
+        expanded && task.status !== "running" && notes ? (React.createElement("div", { className: "task-notes", dangerouslySetInnerHTML: renderMarkdown(notes) })) : null));
 }
 function TaskBoard(props) {
     // Hide only tasks that are acknowledged AND finished. An active
@@ -239,28 +334,30 @@ function Message(props) {
     const { msg } = props;
     // A reply that was nothing but task directives strips to empty -- the board
     // already shows the spawn, so don't render an empty husk of a card.
-    if (msg.role === 'assistant' && msg.status !== 'streaming' && !msg.text.trim()) {
+    if (msg.role === "assistant" &&
+        msg.status !== "streaming" &&
+        !msg.text.trim()) {
         return null;
     }
-    if (msg.role === 'log') {
+    if (msg.role === "log") {
         return React.createElement("div", { className: "msg msg-log" }, msg.text);
     }
-    if (msg.role === 'user') {
+    if (msg.role === "user") {
         return (React.createElement("div", { className: "msg msg-user" },
             (msg.attachments ?? []).map((name) => (React.createElement("img", { key: name, className: "msg-image", src: `${ATTACHMENT_URL_PREFIX}${name}`, alt: "" }))),
             msg.text ? React.createElement("div", { className: "msg-text" }, msg.text) : null));
     }
-    const classes = ['msg', 'msg-assistant'];
-    if (msg.status === 'streaming')
-        classes.push('streaming');
-    if (msg.status === 'error')
-        classes.push('msg-error');
-    return (React.createElement("div", { className: classes.join(' ') },
+    const classes = ["msg", "msg-assistant"];
+    if (msg.status === "streaming")
+        classes.push("streaming");
+    if (msg.status === "error")
+        classes.push("msg-error");
+    return (React.createElement("div", { className: classes.join(" ") },
         React.createElement("div", { className: "msg-text", dangerouslySetInnerHTML: renderMarkdown(msg.text) }),
-        msg.status === 'streaming' && msg.activity ? (React.createElement("div", { className: "msg-activity" },
+        msg.status === "streaming" && msg.activity ? (React.createElement("div", { className: "msg-activity" },
             msg.activity,
             "...")) : null,
-        msg.interrupted ? React.createElement("div", { className: "msg-interrupted" }, "interrupted by your next message") : null));
+        msg.interrupted ? (React.createElement("div", { className: "msg-interrupted" }, "interrupted by your next message")) : null));
 }
 function MessageList(props) {
     const hostRef = React.useRef(null);
@@ -280,7 +377,8 @@ function MessageList(props) {
         if (!host)
             return;
         const observer = new ResizeObserver(() => {
-            host.scrollTop = host.scrollHeight - host.clientHeight - fromBottomRef.current;
+            host.scrollTop =
+                host.scrollHeight - host.clientHeight - fromBottomRef.current;
         });
         observer.observe(host);
         return () => observer.disconnect();
@@ -289,7 +387,8 @@ function MessageList(props) {
         const host = hostRef.current;
         if (!host)
             return;
-        fromBottomRef.current = host.scrollHeight - host.scrollTop - host.clientHeight;
+        fromBottomRef.current =
+            host.scrollHeight - host.scrollTop - host.clientHeight;
         pinnedRef.current = fromBottomRef.current < 48;
     };
     return (React.createElement("div", { id: "chat-messages", ref: hostRef, onScroll: handleScroll },
@@ -298,25 +397,25 @@ function MessageList(props) {
 }
 function readImageFiles(files, add) {
     for (const file of Array.from(files)) {
-        if (!file.type.startsWith('image/'))
+        if (!file.type.startsWith("image/"))
             continue;
         const reader = new FileReader();
         reader.onload = () => {
-            if (typeof reader.result === 'string')
+            if (typeof reader.result === "string")
                 add({ name: file.name, dataUrl: reader.result });
         };
         reader.readAsDataURL(file);
     }
 }
 function InputRow(props) {
-    const [value, setValue] = React.useState('');
+    const [value, setValue] = React.useState("");
     const [pending, setPending] = React.useState([]);
     const inputRef = React.useRef(null);
     const autosize = () => {
         const el = inputRef.current;
         if (!el)
             return;
-        el.style.height = 'auto';
+        el.style.height = "auto";
         el.style.height = `${Math.min(el.scrollHeight, 120)}px`;
     };
     React.useLayoutEffect(autosize, [value]);
@@ -328,7 +427,7 @@ function InputRow(props) {
         if (!text && pending.length === 0)
             return;
         props.onSend(text, pending);
-        setValue('');
+        setValue("");
         setPending([]);
     };
     return (React.createElement(React.Fragment, null,
@@ -341,7 +440,10 @@ function InputRow(props) {
                         readImageFiles(files, addImage);
                     }
                 }, onKeyDown: (event) => {
-                    if (event.key === 'Enter' && !event.shiftKey && !event.metaKey && !event.altKey) {
+                    if (event.key === "Enter" &&
+                        !event.shiftKey &&
+                        !event.metaKey &&
+                        !event.altKey) {
                         event.preventDefault();
                         send();
                     }
@@ -354,7 +456,7 @@ function App() {
     const [feeds, setFeeds] = React.useState({});
     const sendRef = React.useRef(() => undefined);
     React.useEffect(() => {
-        const wsProtocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
+        const wsProtocol = window.location.protocol === "https:" ? "wss:" : "ws:";
         const wsUrl = `${wsProtocol}//${window.location.host}/__castle/agent`;
         let ws = null;
         let alive = true;
@@ -368,11 +470,11 @@ function App() {
                 outbox.push(data);
         };
         const connect = () => {
-            if (!alive || document.visibilityState === 'hidden')
+            if (!alive || document.visibilityState === "hidden")
                 return;
             const sock = new WebSocket(wsUrl);
             ws = sock;
-            sock.addEventListener('open', () => {
+            sock.addEventListener("open", () => {
                 retryMs = 500;
                 while (outbox.length > 0 && sock.readyState === sock.OPEN) {
                     const queued = outbox.shift();
@@ -380,7 +482,7 @@ function App() {
                         sock.send(queued);
                 }
             });
-            sock.addEventListener('message', (event) => {
+            sock.addEventListener("message", (event) => {
                 try {
                     applyServerEvent(JSON.parse(String(event.data)), setMessages, setTasks, setFeeds);
                 }
@@ -388,7 +490,7 @@ function App() {
                     /* malformed frame */
                 }
             });
-            sock.addEventListener('close', () => {
+            sock.addEventListener("close", () => {
                 if (ws !== sock)
                     return;
                 ws = null;
@@ -399,36 +501,37 @@ function App() {
             });
         };
         const onVisibility = () => {
-            if (document.visibilityState !== 'hidden' && !ws)
+            if (document.visibilityState !== "hidden" && !ws)
                 connect();
         };
         const onSetBackend = (event) => {
-            const detail = event.detail;
+            const detail = event
+                .detail;
             if (!detail?.key || !detail.value)
                 return;
-            sendRef.current({ type: 'set-settings', [detail.key]: detail.value });
+            sendRef.current({ type: "set-settings", [detail.key]: detail.value });
         };
-        document.addEventListener('visibilitychange', onVisibility);
-        document.addEventListener('castle-set-backend', onSetBackend);
+        document.addEventListener("visibilitychange", onVisibility);
+        document.addEventListener("castle-set-backend", onSetBackend);
         connect();
         return () => {
             alive = false;
-            document.removeEventListener('visibilitychange', onVisibility);
-            document.removeEventListener('castle-set-backend', onSetBackend);
+            document.removeEventListener("visibilitychange", onVisibility);
+            document.removeEventListener("castle-set-backend", onSetBackend);
             ws?.close();
         };
     }, []);
     return (React.createElement(React.Fragment, null,
-        React.createElement(TaskBoard, { tasks: tasks, feeds: feeds, onAck: (id, rejected) => sendRef.current({ type: 'task-ack', id, rejected }) }),
+        React.createElement(TaskBoard, { tasks: tasks, feeds: feeds, onAck: (id, rejected) => sendRef.current({ type: "task-ack", id, rejected }) }),
         React.createElement(MessageList, { messages: messages }),
-        React.createElement(InputRow, { onSend: (text, images) => sendRef.current({ type: 'user-message', text, images }) })));
+        React.createElement(InputRow, { onSend: (text, images) => sendRef.current({ type: "user-message", text, images }) })));
 }
 initPanelChrome();
-const chatHost = document.getElementById('chat-host');
+const chatHost = document.getElementById("chat-host");
 if (chatHost) {
     ReactDOM.createRoot(chatHost).render(React.createElement(App, null));
-    if (document.body.classList.contains('term-open') &&
-        !document.body.classList.contains('term-view')) {
+    if (document.body.classList.contains("term-open") &&
+        !document.body.classList.contains("term-view")) {
         window.setTimeout(focusChatInput, 0);
     }
 }

package/dist/ide.d.ts

@@ -1,6 +1,6 @@
-import * as http from 'http';
-import { Duplex } from 'stream';
-import { type RawData } from 'ws';
+import * as http from "http";
+import { Duplex } from "stream";
+import { type RawData } from "ws";
 export declare const IDE_ASSET_PREFIX = "/__castle/ide/";
 export declare const PTY_WS_PATH = "/__castle/pty";
 export declare const DECK_FOCUS_SCRIPT: string;