klyro 0.1.55 → 0.1.57

package/dist/agent/anthropic-adapter.js

@@ -115,6 +115,8 @@ async function* streamAnthropic(req, opts) {
     const toolBuffers = new Map();
     // Map content_block index → tool_use id (persists after tool completes to handle late deltas)
     const indexToToolId = new Map();
+    // Active thinking-block index (Anthropic reasoning channel).
+    const thinkingState = { idx: null };
     // message_stop already yields message_end — don't emit a second one at EOF.
     let sawMessageEnd = false;
     try {
@@ -153,7 +155,7 @@ async function* streamAnthropic(req, opts) {
                 catch {
                     continue;
                 }
-                const out = translateSse(e.event, parsed, toolBuffers, indexToToolId);
+                const out = translateSse(e.event, parsed, toolBuffers, indexToToolId, thinkingState);
                 for (const ev of out) {
                     if (ev.kind === 'message_end')
                         sawMessageEnd = true;
@@ -173,7 +175,7 @@ async function* streamAnthropic(req, opts) {
     if (!sawMessageEnd)
         yield { kind: 'message_end', finishReason: 'stop' };
 }
-function translateSse(event, parsed, toolBuffers, indexToToolId) {
+function translateSse(event, parsed, toolBuffers, indexToToolId, thinking) {
     const out = [];
     switch (event) {
         case 'content_block_start': {
@@ -185,6 +187,9 @@ function translateSse(event, parsed, toolBuffers, indexToToolId) {
                     indexToToolId.set(idx, block.id);
                 out.push({ kind: 'tool_call_start', id: block.id, name: block.name });
             }
+            else if ((block?.type === 'thinking' || block?.type === 'redacted_thinking') && thinking && idx !== undefined) {
+                thinking.idx = idx;
+            }
             return out;
         }
         case 'content_block_delta': {
@@ -193,6 +198,9 @@ function translateSse(event, parsed, toolBuffers, indexToToolId) {
             if (delta?.type === 'text_delta' && typeof delta.text === 'string') {
                 out.push({ kind: 'text_delta', text: delta.text });
             }
+            else if (delta?.type === 'thinking_delta' && typeof delta.thinking === 'string' && delta.thinking) {
+                out.push({ kind: 'thinking_delta', text: delta.thinking });
+            }
             else if (delta?.type === 'input_json_delta' && typeof delta.partial_json === 'string') {
                 const id = findToolIdByIndex(index, toolBuffers, indexToToolId);
                 if (id) {
@@ -207,6 +215,8 @@ function translateSse(event, parsed, toolBuffers, indexToToolId) {
         }
         case 'content_block_stop': {
             const index = parsed.index;
+            if (thinking && index !== undefined && index === thinking.idx)
+                thinking.idx = null;
             const id = findToolIdByIndex(index, toolBuffers, indexToToolId);
             if (id) {
                 toolBuffers.delete(id);

package/dist/agent/provider-adapter.d.ts

@@ -15,6 +15,9 @@ import type { Message } from './message.js';
 export type StreamEvent = {
     kind: 'text_delta';
     text: string;
+} | {
+    kind: 'thinking_delta';
+    text: string;
 } | {
     kind: 'message_start';
     id?: string;

package/dist/agent/provider-adapter.js

@@ -239,6 +239,14 @@ async function* streamChatCompletions(url, opts, req, fetchImpl) {
                         if (typeof text === 'string' && text) {
                             yield { kind: 'text_delta', text };
                         }
+                        // Reasoning channel (DeepSeek-R1 / OpenRouter / vLLM et al. send
+                        // `reasoning_content`; some proxies use `reasoning`). Shown dimmed
+                        // while working, discarded when the answer completes.
+                        const thinking = delta?.reasoning_content ??
+                            delta?.reasoning;
+                        if (typeof thinking === 'string' && thinking) {
+                            yield { kind: 'thinking_delta', text: thinking };
+                        }
                         for (const tc of choice.delta.tool_calls ?? []) {
                             if (tc.id && tc.function?.name) {
                                 toolIds.set(tc.index, tc.id);

package/dist/agent/runtime.d.ts

@@ -106,6 +106,9 @@ export type RuntimeEvent = {
 } | {
     kind: 'text_delta';
     text: string;
+} | {
+    kind: 'thinking_delta';
+    text: string;
 } | {
     kind: 'tool_call_start';
     id: string;

package/dist/agent/runtime.js

@@ -236,6 +236,9 @@ export async function run(opts, deps) {
         };
         const events = deps.adapter.stream(req);
         let textBuf = '';
+        // Thinking is ephemeral: streamed to the UI live, never stored in the
+        // transcript, and cleared when the turn's answer completes.
+        let thinkingBuf = '';
         const pendingToolCalls = new Map();
         let lastFinishReason;
         for await (const ev of events) {
@@ -245,6 +248,10 @@ export async function run(opts, deps) {
                 textBuf += ev.text;
                 emit?.({ kind: 'text_delta', text: ev.text });
             }
+            else if (ev.kind === 'thinking_delta') {
+                thinkingBuf += ev.text;
+                emit?.({ kind: 'thinking_delta', text: ev.text });
+            }
             else if (ev.kind === 'tool_call_start') {
                 pendingToolCalls.set(ev.id, { id: ev.id, name: ev.name, argsJson: '' });
                 emit?.({ kind: 'tool_call_start', id: ev.id, name: ev.name });

package/dist/cli/repl.js

@@ -144,6 +144,23 @@ export async function startRepl(opts = {}) {
         else
             pendingQueue.push({ kind: 'delta', text });
     }
+    // Ephemeral reasoning display (light-white while working, gone on response).
+    function queuedThinking(text) {
+        if (!text)
+            return;
+        if (isMounted && directHooks)
+            directHooks.appendThinkingDelta(text);
+        else
+            pendingQueue.push({ kind: 'thinking', text });
+    }
+    function clearThinking() {
+        for (let i = pendingQueue.length - 1; i >= 0; i--) {
+            if (pendingQueue[i]?.kind === 'thinking')
+                pendingQueue.splice(i, 1);
+        }
+        if (isMounted && directHooks)
+            directHooks.clearThinking();
+    }
     // Tool results patch the running start-item in place (App.updateTool) so a
     // group resolves to done/error with its real latency instead of ticking
     // forever. Falls back to a standalone item if the start item is gone.
@@ -404,10 +421,13 @@ export async function startRepl(opts = {}) {
                     text += ev.text;
                     queuedDelta(ev.text);
                 }
+                else if (ev.kind === 'thinking_delta')
+                    queuedThinking(ev.text);
                 else if (ev.kind === 'error')
                     throw new Error(ev.message);
             }
             lastAssistantText = text;
+            clearThinking();
             queuedStatus({ status: 'done' });
             return text;
         }
@@ -454,6 +474,8 @@ export async function startRepl(opts = {}) {
                     hooks.appendDelta(ev.text);
                 else if (ev.kind === 'toolupdate')
                     hooks.updateTool(ev.idCall, ev.patch);
+                else if (ev.kind === 'thinking')
+                    hooks.appendThinkingDelta(ev.text);
                 else
                     hooks.append(ev.item);
             }
@@ -523,10 +545,13 @@ export async function startRepl(opts = {}) {
                         simpleText += ev.text;
                         queuedDelta(ev.text);
                     }
+                    else if (ev.kind === 'thinking_delta')
+                        queuedThinking(ev.text);
                     else if (ev.kind === 'error')
                         throw new Error(ev.message);
                 }
                 lastAssistantText = simpleText;
+                clearThinking();
                 queuedStatus({ status: 'done' });
                 return;
             }
@@ -553,11 +578,15 @@ export async function startRepl(opts = {}) {
                 onEvent: (ev) => {
                     if (ev.kind === 'step_start') {
                         queuedStatus({ step: ev.step });
+                        clearThinking(); // fresh reasoning display per step
                     }
                     else if (ev.kind === 'text_delta') {
                         // single appendDelta path — App merges into one assistant item (Q→A order, no duplication)
                         queuedDelta(ev.text);
                     }
+                    else if (ev.kind === 'thinking_delta') {
+                        queuedThinking(ev.text);
+                    }
                     else if (ev.kind === 'verification_started') {
                         queuedAppend({ id: `vrfy-${Date.now()}`, kind: 'text', text: `[verify] running \`${ev.command}\``, role: 'assistant' });
                         queuedStatus({ status: 'running' });
@@ -630,6 +659,8 @@ export async function startRepl(opts = {}) {
                         }
                     }
                     else if (ev.kind === 'final_text') {
+                        // Response arrived: thinking display goes away, only the answer stays.
+                        clearThinking();
                         // streamingId is closed by status change; no extra handling needed
                     }
                     else if (ev.kind === 'usage') {

package/dist/tui/app.d.ts

@@ -29,6 +29,8 @@ export interface AppProps {
         scrollToTop: () => void;
         transcript: TranscriptScrollHandle;
         updateTool: (idCall: string, patch: ToolResultPatch) => void;
+        appendThinkingDelta: (text: string) => void;
+        clearThinking: () => void;
     }) => void;
     version?: string;
     isFullscreen?: boolean;

package/dist/tui/app.js

@@ -27,7 +27,7 @@ function Header({ cwd, model, version, width }) {
         }
     }, [cwd]);
     const showLinks = width >= 120;
-    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsxs(Text, { bold: true, color: tokens.colors.accent, children: ["KLYRO  v", version] }), showLinks ? _jsx(Text, { color: tokens.colors.dim, children: "\u2502  /help   /config   /clear   /exit" }) : null] }), _jsxs(Text, { color: tokens.colors.dim, children: [model, "  \u00B7  ", cwd] }), branch ? _jsxs(Text, { color: tokens.colors.dim, children: ["\u2387  ", branch] }) : null] }));
+    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, flexShrink: 0, children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsxs(Text, { bold: true, color: tokens.colors.accent, children: ["KLYRO  v", version] }), showLinks ? _jsx(Text, { color: tokens.colors.dim, children: "\u2502  /help   /config   /clear   /exit" }) : null] }), _jsxs(Text, { color: tokens.colors.dim, children: [model, "  \u00B7  ", cwd] }), branch ? _jsxs(Text, { color: tokens.colors.dim, children: ["\u2387  ", branch] }) : null] }));
 }
 function verbForTool(name) {
     if (name === 'read_file')
@@ -259,6 +259,9 @@ export function App(props) {
             else if (it.kind === 'text') {
                 out.push({ key: it.id, desc: { kind: 'assistant', text: it.text }, groupIndex: gi, tail: null });
             }
+            else if (it.kind === 'thinking') {
+                out.push({ key: it.id, desc: { kind: 'reasoning', text: it.text }, groupIndex: gi, tail: null });
+            }
             else if (it.kind === 'error') {
                 out.push({ key: it.id, desc: { kind: 'error', message: it.message }, groupIndex: gi, tail: null });
             }
@@ -393,8 +396,30 @@ export function App(props) {
             setTranscript((prev) => [...prev, { id, kind: 'text', text, role: 'assistant' }]);
         }
     }, []);
-    useEffect(() => { if (status.status !== 'running')
-        streamingIdRef.current = null; }, [status.status]);
+    // Ephemeral reasoning display: merges into one transient item (never in
+    // context/persistence); removed when the turn's answer completes.
+    const thinkingIdRef = useRef(null);
+    const appendThinkingDelta = useCallback((text) => {
+        if (!text)
+            return;
+        const tid = thinkingIdRef.current;
+        if (tid)
+            setTranscript((prev) => { const idx = prev.findIndex((x) => x.id === tid); if (idx === -1)
+                return [...prev, { id: tid, kind: 'thinking', text }]; const cur = prev[idx]; const copy = [...prev]; copy[idx] = { ...cur, text: cur.text + text }; return copy; });
+        else {
+            const id = nextId('thinking');
+            thinkingIdRef.current = id;
+            setTranscript((prev) => [...prev, { id, kind: 'thinking', text }]);
+        }
+    }, []);
+    const clearThinking = useCallback(() => {
+        thinkingIdRef.current = null;
+        setTranscript((prev) => (prev.some((x) => x.kind === 'thinking') ? prev.filter((x) => x.kind !== 'thinking') : prev));
+    }, []);
+    useEffect(() => { if (status.status !== 'running') {
+        streamingIdRef.current = null;
+        thinkingIdRef.current = null;
+    } }, [status.status]);
     const updateStatus = useCallback((s) => setStatus((p) => ({ ...p, ...s })), []);
     const updatePlan = useCallback((p) => setPlan(p), []);
     // Tool results patch the running start-item IN PLACE (no second item, so a
@@ -439,7 +464,7 @@ export function App(props) {
     }), []);
     const onMountedRef = useRef(props.onMounted);
     useEffect(() => { onMountedRef.current = props.onMounted; }, [props.onMounted]);
-    useEffect(() => { onMountedRef.current?.({ append, appendDelta, updateStatus, updatePlan, clearTranscript, scrollLines, scrollToBottom, scrollHalfPage, scrollToTop, transcript: transcriptHandle, updateTool }); globalThis.__klyroAppAppend = append; globalThis.__klyroAppendDelta = appendDelta; globalThis.__klyroAppStatus = updateStatus; globalThis.__klyroAppPlan = updatePlan; return () => { delete globalThis.__klyroAppAppend; delete globalThis.__klyroAppendDelta; delete globalThis.__klyroAppStatus; delete globalThis.__klyroAppPlan; }; }, [append, appendDelta, updateStatus, updatePlan, clearTranscript, scrollLines, scrollToBottom, scrollHalfPage, scrollToTop, transcriptHandle, updateTool]);
+    useEffect(() => { onMountedRef.current?.({ append, appendDelta, updateStatus, updatePlan, clearTranscript, scrollLines, scrollToBottom, scrollHalfPage, scrollToTop, transcript: transcriptHandle, updateTool, appendThinkingDelta, clearThinking }); globalThis.__klyroAppAppend = append; globalThis.__klyroAppendDelta = appendDelta; globalThis.__klyroAppStatus = updateStatus; globalThis.__klyroAppPlan = updatePlan; globalThis.__klyroAppendThinking = appendThinkingDelta; globalThis.__klyroClearThinking = clearThinking; return () => { delete globalThis.__klyroAppAppend; delete globalThis.__klyroAppendDelta; delete globalThis.__klyroAppStatus; delete globalThis.__klyroAppPlan; delete globalThis.__klyroAppendThinking; delete globalThis.__klyroClearThinking; }; }, [append, appendDelta, updateStatus, updatePlan, clearTranscript, scrollLines, scrollToBottom, scrollHalfPage, scrollToTop, transcriptHandle, updateTool, appendThinkingDelta, clearThinking]);
     const toggleGroup = (id) => setExpandedGroups((prev) => { const n = new Set(prev); if (n.has(id))
         n.delete(id);
     else
@@ -714,6 +739,9 @@ export function App(props) {
                                     // prose — render markdown, not raw **, with proper wrap and guide
                                     return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsxs(Box, { children: [_jsxs(Text, { color: tokens.colors.guide, children: ["  ", g('guide'), "   "] }), _jsxs(Text, { color: tokens.colors.accent, children: [g('agentBullet'), " Klyro"] })] }), _jsx(Box, { paddingLeft: 2, flexDirection: "column", children: _jsxs(Box, { children: [_jsxs(Text, { color: tokens.colors.dim, children: ["  ", g('guide'), "   "] }), _jsx(Box, { flexGrow: 1, children: _jsx(MarkdownText, { text: it.text }) })] }) })] }, it.id));
                                 }
+                                // Ephemeral reasoning: light-white while working, removed on response.
+                                if (it.kind === 'thinking')
+                                    return _jsx(Box, { paddingLeft: 2, marginBottom: 1, children: _jsx(Text, { wrap: "wrap", color: tokens.colors.dim, children: it.text }) }, it.id);
                                 if (it.kind === 'error')
                                     return _jsx(Box, { paddingLeft: 2, marginBottom: 1, children: _jsxs(Text, { color: tokens.colors.err, children: ["  ", g('guide'), "   ", g('failure'), " ", it.message] }) }, it.id);
                                 if (it.kind === 'policy')
@@ -723,5 +751,5 @@ export function App(props) {
                                 if (it.kind === 'diff')
                                     return (_jsxs(Box, { flexDirection: "column", paddingLeft: 2, marginBottom: 1, children: [_jsx(Text, { bold: true, color: tokens.colors.soft, children: it.summary ?? 'Diff' }), it.hunks.map((h, i) => (_jsxs(Box, { flexDirection: "column", marginTop: 0, children: [_jsx(Text, { color: tokens.colors.soft, children: h.path }), h.lines.map((l, j) => (_jsxs(Text, { wrap: "wrap", color: l.kind === 'add' ? tokens.colors.ok : l.kind === 'remove' ? tokens.colors.err : tokens.colors.dim, children: [l.kind === 'add' ? '+ ' : l.kind === 'remove' ? '- ' : '  ', l.text] }, j)))] }, i)))] }, it.id));
                                 return null;
-                            }) : null, showThinking && status.status === 'running' && !streamingIdRef.current ? (_jsxs(Box, { paddingLeft: 2, marginBottom: 1, children: [_jsxs(Text, { color: tokens.colors.guide, children: ["  ", g('guide'), "   "] }), _jsxs(Text, { color: tokens.colors.accent, children: [_jsx(Spinner, { type: "dots" }), " "] }), _jsx(Text, { color: tokens.colors.dim, children: "Thinking... (esc to cancel)" }), _jsxs(Text, { color: tokens.colors.dim, children: ["  ", (elapsed / 1000).toFixed(1), "s"] })] })) : null, showPlan && plan.length > 0 ? (_jsxs(Box, { flexDirection: "column", paddingLeft: 2, marginTop: 0, marginBottom: 1, children: [_jsxs(Box, { children: [_jsxs(Text, { color: tokens.colors.guide, children: ["  ", g('guide'), "   "] }), _jsxs(Text, { bold: true, children: [g('todoPlan'), " Plan  ", plan.filter((p) => p.status === 'done').length, "/", plan.length] })] }), plan.slice(0, 8).map((p, i) => (_jsxs(Box, { children: [_jsxs(Text, { color: tokens.colors.guide, children: ["  ", g('guide'), "   "] }), _jsxs(Text, { color: p.status === 'done' ? tokens.colors.ok : p.status === 'in_progress' ? tokens.colors.accent : tokens.colors.dim, children: [p.status === 'done' ? g('todoDone') : p.status === 'in_progress' ? g('todoActive') : g('todoPending'), " ", i + 1, ". ", p.title] })] }, p.id)))] })) : null, showQueued && queuedInputs.length > 0 ? (_jsx(Box, { flexDirection: "column", paddingLeft: 2, marginBottom: 1, children: queuedInputs.map((q, i) => (_jsxs(Text, { color: tokens.colors.dim, children: ["queued: ", q.slice(0, 60), i === 0 ? '  esc to drop' : ''] }, i))) })) : null] }), isFullscreen ? (_jsx(Box, { flexDirection: "column", width: 1, marginLeft: 1, children: Array.from({ length: trackH }).map((_, i) => (_jsx(Text, { color: i === thumbPos ? tokens.colors.accent : tokens.colors.guide, children: i === thumbPos ? '●' : '│' }, i))) })) : null] }), pinned && pendingNew > 0 ? (_jsx(Box, { justifyContent: "flex-end", paddingX: 1, marginTop: -1, children: _jsxs(Text, { backgroundColor: tokens.colors.accentSoft, color: tokens.colors.accent, bold: true, children: [' ↓ ', pendingNew >= 1000 ? '999+ new' : `${pendingNew} new`, ' '] }) })) : null, slashSuggest.length > 0 ? (_jsxs(Box, { flexDirection: "column", paddingLeft: 2, children: [slashSuggest.map((s, i) => (_jsxs(Text, { color: i === 0 ? tokens.colors.accent : tokens.colors.dim, children: [i === 0 ? '▸' : ' ', " /", s.name, "  \u2014 ", s.hint] }, s.name))), _jsx(Text, { color: tokens.colors.dim, children: "  tab to complete" })] })) : null, _jsx(ApprovalModal, { bridge: bridge }), _jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: tokens.colors.guide, children: g('rule').repeat(Math.max(10, width - 2)) }), _jsxs(Box, { children: [_jsxs(Text, { color: tokens.colors.accent, bold: true, children: [g('prompt'), " "] }), _jsxs(Text, { wrap: "wrap", children: [input || _jsx(Text, { color: tokens.colors.dim, children: "Message Klyro..." }), "|"] })] }), _jsx(Text, { color: tokens.colors.guide, children: g('rule').repeat(Math.max(10, width - 2)) })] }), _jsxs(Box, { justifyContent: "space-between", children: [_jsxs(Text, { color: tokens.colors.dim, children: [status.status === 'running' ? (_jsxs(Text, { color: tokens.colors.accent, children: [_jsx(Spinner, { type: "dots" }), " working  \u00B7  "] })) : null, baseHints, maxTop > 0 && isFullscreen ? '  ·  PgUp/Dn scroll' : ''] }), _jsxs(Text, { color: tokens.colors.dim, children: [cost > 0 ? `$${cost.toFixed(2)} · ` : '', ctxPct, "% ctx \u00B7 ", status.model, status.status === 'running' ? ' ●' : ''] })] })] }));
+                            }) : null, showThinking && status.status === 'running' && !streamingIdRef.current ? (_jsxs(Box, { paddingLeft: 2, marginBottom: 1, children: [_jsxs(Text, { color: tokens.colors.guide, children: ["  ", g('guide'), "   "] }), _jsxs(Text, { color: tokens.colors.accent, children: [_jsx(Spinner, { type: "dots" }), " "] }), _jsx(Text, { color: tokens.colors.dim, children: "Thinking... (esc to cancel)" }), _jsxs(Text, { color: tokens.colors.dim, children: ["  ", (elapsed / 1000).toFixed(1), "s"] })] })) : null, showPlan && plan.length > 0 ? (_jsxs(Box, { flexDirection: "column", paddingLeft: 2, marginTop: 0, marginBottom: 1, children: [_jsxs(Box, { children: [_jsxs(Text, { color: tokens.colors.guide, children: ["  ", g('guide'), "   "] }), _jsxs(Text, { bold: true, children: [g('todoPlan'), " Plan  ", plan.filter((p) => p.status === 'done').length, "/", plan.length] })] }), plan.slice(0, 8).map((p, i) => (_jsxs(Box, { children: [_jsxs(Text, { color: tokens.colors.guide, children: ["  ", g('guide'), "   "] }), _jsxs(Text, { color: p.status === 'done' ? tokens.colors.ok : p.status === 'in_progress' ? tokens.colors.accent : tokens.colors.dim, children: [p.status === 'done' ? g('todoDone') : p.status === 'in_progress' ? g('todoActive') : g('todoPending'), " ", i + 1, ". ", p.title] })] }, p.id)))] })) : null, showQueued && queuedInputs.length > 0 ? (_jsx(Box, { flexDirection: "column", paddingLeft: 2, marginBottom: 1, children: queuedInputs.map((q, i) => (_jsxs(Text, { color: tokens.colors.dim, children: ["queued: ", q.slice(0, 60), i === 0 ? '  esc to drop' : ''] }, i))) })) : null] }), isFullscreen ? (_jsx(Box, { flexDirection: "column", width: 1, marginLeft: 1, children: Array.from({ length: trackH }).map((_, i) => (_jsx(Text, { color: i === thumbPos ? tokens.colors.accent : tokens.colors.guide, children: i === thumbPos ? '●' : '│' }, i))) })) : null] }), pinned && pendingNew > 0 ? (_jsx(Box, { justifyContent: "flex-end", paddingX: 1, marginTop: -1, flexShrink: 0, children: _jsxs(Text, { backgroundColor: tokens.colors.accentSoft, color: tokens.colors.accent, bold: true, children: [' ↓ ', pendingNew >= 1000 ? '999+ new' : `${pendingNew} new`, ' '] }) })) : null, slashSuggest.length > 0 ? (_jsxs(Box, { flexDirection: "column", paddingLeft: 2, flexShrink: 0, children: [slashSuggest.map((s, i) => (_jsxs(Text, { color: i === 0 ? tokens.colors.accent : tokens.colors.dim, children: [i === 0 ? '▸' : ' ', " /", s.name, "  \u2014 ", s.hint] }, s.name))), _jsx(Text, { color: tokens.colors.dim, children: "  tab to complete" })] })) : null, _jsx(ApprovalModal, { bridge: bridge }), _jsxs(Box, { flexDirection: "column", flexShrink: 0, children: [_jsx(Text, { color: tokens.colors.guide, children: g('rule').repeat(Math.max(10, width - 2)) }), _jsxs(Box, { children: [_jsxs(Text, { color: tokens.colors.accent, bold: true, children: [g('prompt'), " "] }), _jsxs(Text, { wrap: "wrap", children: [input || _jsx(Text, { color: tokens.colors.dim, children: "Message Klyro..." }), "|"] })] }), _jsx(Text, { color: tokens.colors.guide, children: g('rule').repeat(Math.max(10, width - 2)) })] }), _jsxs(Box, { justifyContent: "space-between", flexShrink: 0, children: [_jsxs(Text, { color: tokens.colors.dim, children: [status.status === 'running' ? (_jsxs(Text, { color: tokens.colors.accent, children: [_jsx(Spinner, { type: "dots" }), " working  \u00B7  "] })) : null, baseHints, maxTop > 0 && isFullscreen ? '  ·  PgUp/Dn scroll' : ''] }), _jsxs(Text, { color: tokens.colors.dim, children: [cost > 0 ? `$${cost.toFixed(2)} · ` : '', ctxPct, "% ctx \u00B7 ", status.model, status.status === 'running' ? ' ●' : ''] })] })] }));
 }

package/dist/tui/app.test.js

@@ -94,6 +94,34 @@ describe('App', () => {
         }
         return out;
     }
+    // Polling assertions: hook-driven updates flush on React's schedule, so
+    // fixed sleeps flake under load. Poll the frame instead.
+    async function waitForMatch(getFrame, re, timeout = 4000) {
+        const start = Date.now();
+        let frame = '';
+        for (;;) {
+            frame = getFrame() ?? '';
+            if (re.test(frame))
+                return frame;
+            if (Date.now() - start > timeout) {
+                throw new Error(`timed out waiting for ${re}\nlast frame:\n${frame.slice(0, 2000)}`);
+            }
+            await new Promise((r) => setTimeout(r, 25));
+        }
+    }
+    async function waitForAbsent(getFrame, re, timeout = 4000) {
+        const start = Date.now();
+        let frame = '';
+        for (;;) {
+            frame = getFrame() ?? '';
+            if (!re.test(frame))
+                return frame;
+            if (Date.now() - start > timeout) {
+                throw new Error(`timed out waiting for absence of ${re}\nlast frame:\n${frame.slice(0, 2000)}`);
+            }
+            await new Promise((r) => setTimeout(r, 25));
+        }
+    }
     // ANSI sequences Ink's parse-keypress recognizes.
     const KEY_HOME = '\x1b[H';
     const KEY_END = '\x1b[F';
@@ -263,14 +291,11 @@ describe('App', () => {
         // Wheel up ×12 (3 lines each = 36 > maxTop 32) → pinned at top.
         for (let i = 0; i < 12; i++)
             captured.scrollLines(-3);
-        await new Promise((r) => setTimeout(r, 50));
-        const top = lastFrame() ?? '';
-        expect(top).toMatch(/MSG-00-tag/);
+        const top = await waitForMatch(lastFrame, /MSG-00-tag/);
         expect(top).not.toMatch(/MSG-24-tag/);
         // scrollToBottom → tail visible again.
         captured.scrollToBottom();
-        await new Promise((r) => setTimeout(r, 50));
-        expect(lastFrame() ?? '').toMatch(/MSG-24-tag/);
+        await waitForMatch(lastFrame, /MSG-24-tag/);
     });
     it('idle Ctrl+C quits (design.md §18)', async () => {
         const onSlash = vi.fn(async () => { });
@@ -342,19 +367,14 @@ describe('App', () => {
         await new Promise((r) => setTimeout(r, 50));
         expect(handle).not.toBeNull();
         handle.runTranscriptCommand('messages_half_page_up');
-        await new Promise((r) => setTimeout(r, 50));
-        let frame = lastFrame() ?? '';
         // Half page (10 lines) up from bottom (row 30 → 20): MSG-24 gone, MSG-14 in view.
-        expect(frame).not.toMatch(/MSG-24-tag/);
-        expect(frame).toMatch(/MSG-14-tag/);
+        await waitForAbsent(lastFrame, /MSG-24-tag/);
+        await waitForMatch(lastFrame, /MSG-14-tag/);
         handle.runTranscriptCommand('messages_first');
-        await new Promise((r) => setTimeout(r, 50));
-        frame = lastFrame() ?? '';
-        expect(frame).toMatch(/MSG-00-tag/);
+        let frame = await waitForMatch(lastFrame, /MSG-00-tag/);
         expect(frame).not.toMatch(/MSG-24-tag/);
         handle.runTranscriptCommand('messages_last');
-        await new Promise((r) => setTimeout(r, 50));
-        expect(lastFrame() ?? '').toMatch(/MSG-24-tag/);
+        await waitForMatch(lastFrame, /MSG-24-tag/);
     });
     it('tool result patches the running item in place (no stale spinner)', async () => {
         let hooks = null;
@@ -364,13 +384,10 @@ describe('App', () => {
         await new Promise((r) => setTimeout(r, 50));
         expect(hooks).not.toBeNull();
         hooks.append({ id: 't1', kind: 'tool', name: 'read_file', id_call: 'c1', args: '{"path":"a.ts"}', status: 'running' });
-        await new Promise((r) => setTimeout(r, 50));
-        expect(lastFrame() ?? '').toMatch(/Read/);
+        await waitForMatch(lastFrame, /Read/);
         hooks.updateTool('c1', { result: 'ok', isError: false, latencyMs: 42, status: 'done' });
-        await new Promise((r) => setTimeout(r, 50));
-        const frame = lastFrame() ?? '';
         // Resolved with real latency — exactly one group (start item patched, no duplicate).
-        expect(frame).toMatch(/42ms/);
+        const frame = await waitForMatch(lastFrame, /42ms/);
         expect(frame.match(/Read/g)?.length ?? 0).toBeLessThanOrEqual(2);
     });
     it('heavy transcript: frame bounded, input and tail visible', async () => {
@@ -405,10 +422,9 @@ describe('App', () => {
             .then((c) => {
             choice = c;
         });
-        await new Promise((r) => setTimeout(r, 80));
         // The modal must actually render — previously it never mounted, so every
         // policy 'ask' hung the runtime forever.
-        expect(lastFrame() ?? '').toMatch(/approval needed/i);
+        await waitForMatch(lastFrame, /approval needed/i);
         expect(bridge.resolve('deny')).toBe(true);
         await pending;
         expect(choice).toBe('deny');
@@ -429,12 +445,78 @@ describe('App', () => {
             } }));
         await new Promise((r) => setTimeout(r, 50));
         hooks.append({ id: 't1', kind: 'tool', name: 'read_file', id_call: 'c1', args: '{"path":"a.ts"}', status: 'running' });
-        await new Promise((r) => setTimeout(r, 120));
         // Running group: spinner next to the verb (braille frame or fallback text).
-        expect(lastFrame() ?? '').toMatch(/⠋|⠙|⠹|⠸|⠼|⠴|⠦|⠧|⠇|⠏|Read/);
+        await waitForMatch(lastFrame, /⠋|⠙|⠹|⠸|⠼|⠴|⠦|⠧|⠇|⠏|Read/);
         hooks.updateTool('c1', { result: 'ok', isError: false, latencyMs: 42, status: 'done' });
+        await waitForMatch(lastFrame, /42ms/);
+    });
+    it('thinking shows dim while working, clears on response', async () => {
+        let hooks = null;
+        const { lastFrame } = render(_jsx(App, { initialModel: "m", maxSteps: 10, cwd: "/test", onPrompt: async () => { }, onSlash: async () => { }, isFullscreen: true, onMounted: (h) => {
+                hooks = { appendThinkingDelta: h.appendThinkingDelta, clearThinking: h.clearThinking };
+            } }));
+        await new Promise((r) => setTimeout(r, 50));
+        expect(hooks).not.toBeNull();
+        hooks.appendThinkingDelta('weighing two approaches... ');
+        hooks.appendThinkingDelta('leaning to the second.');
+        await waitForMatch(lastFrame, /weighing two approaches\.\.\. leaning to the second\./);
+        // Answered: thinking goes away, only the response stays.
+        hooks.clearThinking();
+        await waitForAbsent(lastFrame, /weighing two approaches/);
+    });
+    it('empty state: composer pinned to bottom, header first (TEST 1)', async () => {
+        const { lastFrame } = render(_jsx(App, { initialModel: "m", maxSteps: 10, cwd: "/test", onPrompt: async () => { }, onSlash: async () => { }, isFullscreen: true }));
+        await new Promise((r) => setTimeout(r, 50));
+        const rows = (lastFrame() ?? '').split('\n');
+        expect(rows[0]).toMatch(/KLYRO/);
+        const nonEmpty = rows.map((r, i) => ({ r, i })).filter((x) => x.r.trim().length > 0);
+        const last = nonEmpty[nonEmpty.length - 1];
+        expect(last.r).toMatch(/enter to send|for history|to attach/);
+        const placeholder = rows.findIndex((r) => r.includes('Message Klyro'));
+        expect(placeholder).toBeGreaterThanOrEqual(0);
+        expect(placeholder).toBeLessThan(last.i);
+    });
+    it('multiline input grows upward, status stays last (TEST 5)', async () => {
+        const { stdin, lastFrame } = render(_jsx(App, { initialModel: "m", maxSteps: 10, cwd: "/test", onPrompt: async () => { }, onSlash: async () => { }, isFullscreen: true }));
+        stdin.write('build authentication');
+        await new Promise((r) => setTimeout(r, 20));
+        stdin.write('\x1b[13;2u');
+        await new Promise((r) => setTimeout(r, 20));
+        stdin.write('add tests');
         await new Promise((r) => setTimeout(r, 50));
-        expect(lastFrame() ?? '').toMatch(/42ms/);
+        const rows = (lastFrame() ?? '').split('\n');
+        expect(rows.join('\n')).toContain('build authentication');
+        expect(rows.join('\n')).toContain('add tests');
+        const nonEmpty = rows.map((r, i) => ({ r, i })).filter((x) => x.r.trim().length > 0);
+        const last = nonEmpty[nonEmpty.length - 1];
+        expect(last.r).toMatch(/enter to send|for history|to attach/);
+        expect(rows.length).toBeLessThanOrEqual(32);
+    });
+    it('tool events aggregate, no raw internals leak (TEST 13)', async () => {
+        let hooks = null;
+        const { lastFrame } = render(_jsx(App, { initialModel: "m", maxSteps: 10, cwd: "/test", onPrompt: async () => { }, onSlash: async () => { }, isFullscreen: true, onMounted: (h) => {
+                hooks = { append: h.append, updateTool: h.updateTool };
+            } }));
+        await new Promise((r) => setTimeout(r, 50));
+        const tools = [
+            ['read_file', 'c1', '{"path":"a.ts"}'],
+            ['read_file', 'c2', '{"path":"b.ts"}'],
+            ['read_file', 'c3', '{"path":"c.ts"}'],
+            ['shell_exec', 'c4', '{"command":"npm test"}'],
+            ['shell_exec', 'c5', '{"command":"npm run build"}'],
+        ];
+        for (const [name, id, args] of tools) {
+            hooks.append({ id: `t-${id}`, kind: 'tool', name, id_call: id, args, status: 'running' });
+        }
+        await waitForMatch(lastFrame, /Read 3 files/);
+        for (const [, id] of tools) {
+            hooks.updateTool(id, { result: 'ok', isError: false, latencyMs: 5, status: 'done' });
+        }
+        const frame = await waitForMatch(lastFrame, /Ran 2 commands/);
+        expect(frame).toContain('Read 3 files');
+        expect(frame).not.toContain('tool_call');
+        expect(frame).not.toContain('{"path"');
+        expect(frame).not.toContain('queued:');
     });
     it('Shift+Up / Shift+Down scroll by one line', async () => {
         const { stdin, lastFrame } = render(_jsx(App, { initialModel: "m", maxSteps: 10, cwd: "/test", onPrompt: async () => { }, onSlash: async () => { }, isFullscreen: true, initialTranscript: makeInitialTranscript(25) }));

package/dist/tui/measure.d.ts

@@ -29,6 +29,9 @@ export type BlockDesc = {
 } | {
     kind: 'assistant';
     text: string;
+} | {
+    kind: 'reasoning';
+    text: string;
 } | {
     kind: 'group';
     count: number;

package/dist/tui/measure.js

@@ -70,6 +70,8 @@ export function blockHeight(b, termWidth) {
             return wrapCount(b.text, termWidth) + 1;
         case 'assistant':
             return 1 + wrapCount(b.text, cw) + 1;
+        case 'reasoning':
+            return wrapCount(b.text, cw) + 1;
         case 'group':
             if (!b.expanded)
                 return 1 + 1;
@@ -101,6 +103,8 @@ export function blockSig(b) {
             return `u:${b.text.length}:${b.text.slice(0, 16)}:${b.text.slice(-16)}`;
         case 'assistant':
             return `a:${b.text.length}:${b.text.slice(0, 16)}:${b.text.slice(-16)}`;
+        case 'reasoning':
+            return `th:${b.text.length}:${b.text.slice(0, 16)}:${b.text.slice(-16)}`;
         case 'group':
             return `g:${b.count}:${b.expanded ? 1 : 0}:${b.status}:${b.resultLen}`;
         case 'error':

package/dist/tui/transcript.d.ts

@@ -12,6 +12,10 @@ export type TranscriptItem = {
     kind: 'text';
     text: string;
     role: 'user' | 'assistant';
+} | {
+    id: string;
+    kind: 'thinking';
+    text: string;
 } | {
     id: string;
     kind: 'tool';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "klyro",
-  "version": "0.1.55",
+  "version": "0.1.57",
   "description": "Klyro \u2014 autonomous coding harness CLI that streams from any OpenAI-compatible or Anthropic LLM endpoint.",
   "type": "module",
   "main": "dist/index.js",