@code-yeongyu/senpi-codemode 2026.7.28 → 2026.7.29-3

package/CHANGELOG.md

@@ -12,6 +12,75 @@
 
 ### Removed
 
+## [2026.7.29-3] - 2026-07-29
+
+### Breaking Changes
+
+### Added
+
+### Changed
+
+### Fixed
+
+### Removed
+
+## [2026.7.29-2] - 2026-07-29
+
+### Breaking Changes
+
+### Added
+
+### Changed
+
+### Fixed
+
+### Removed
+
+## [2026.7.29] - 2026-07-29
+
+### Breaking Changes
+
+### Added
+
+- Show every live detached eval cell in the interactive footer, using a highlighted `↗ <language> · <title>` status for one cell and a bounded packed summary for multiple cells; clear the status immediately when the final detached cell settles ([#483](https://github.com/code-yeongyu/senpi/pull/483)).
+
+### Changed
+
+### Fixed
+
+- Route reserved `agent()`, `output()`, and `tool_schema()` bridge calls from Python and other subprocess kernels through the reserved HTTP handler instead of attempting to execute nonexistent `__agent__`, `__output__`, and `__schema__` tools; ordinary bridge tool calls remain unchanged ([#462](https://github.com/code-yeongyu/senpi/pull/462)).
+
+### Removed
+
+## [2026.7.28-3] - 2026-07-28
+
+### Breaking Changes
+
+### Added
+
+- Add nested tool-call widgets that render the real call shape of tools invoked from eval cells, with truthful status, duration, and sanitized previews ([#444](https://github.com/code-yeongyu/senpi/pull/444)).
+
+### Changed
+
+### Fixed
+
+### Removed
+
+## [2026.7.28-2] - 2026-07-28
+
+### Breaking Changes
+
+### Added
+
+### Changed
+
+### Fixed
+
+- Start a fresh eval cell when a caller reuses the ID of a terminal cell, preventing completed or failed results from being replayed as though new code had executed ([#439](https://github.com/code-yeongyu/senpi/pull/439)).
+- Omit the eval `took` duration when timing metadata is unavailable, avoiding misleading zero-duration status output for detached or restored cell results ([#439](https://github.com/code-yeongyu/senpi/pull/439)).
+
+### Removed
+
 ## [2026.7.28] - 2026-07-28
 
 ### Breaking Changes

package/README.md

@@ -133,6 +133,10 @@ cell keeps only its own language kernel busy. A new same-language call returns
 a busy error with its cell id and output tail; calls in other languages continue
 normally. Do not re-run the cell.
 
+While any cell is detached, the interactive footer shows a highlighted
+`↗ <language> · <title>` status on the extension status line (the cell id when
+the call had no title), clearing as soon as the last detached cell settles.
+
 Use `eval({ action: "peek", cell_id })` for its state and buffered output, or
 `eval({ action: "stop", cell_id })` to cancel it. Python stop interrupts the
 existing kernel and preserves variables. JavaScript stop kills and restarts its
@@ -185,3 +189,18 @@ Direct real-surface QA drivers live in `scripts/qa-*.ts`: kernel cells
 (`qa-py-cell.ts`, `qa-js-cell.ts`, `qa-rb-cell.ts`, `qa-jl-cell.ts`), end-to-end
 extension execution (`qa-e2e-eval.ts`), and renderer output
 (`qa-render-dump.ts`).
+
+### Nested tool-call widgets
+
+When an eval cell invokes `tool.<name>(...)`, the result panel can render a
+nested widget for the invoked tool. The widget captures bounded args, duration,
+and a sanitized 160 code points result preview; the rendering path is
+always-on and does not depend on any toggle or session flag.
+
+The capture budget is fixed at 30 enriched calls per cell, with a 4096-character
+serialized args budget. Previews are capped at 160 code points, and collapsed
+widgets stay within the 8 lines collapsed widget budget.
+
+Entries without args — including old sessions, reserved/completion rows, and
+calls past the cap — render as plain rows. Edit renders a fallback row by
+design, even when its args are present.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@code-yeongyu/senpi-codemode",
-	"version": "2026.7.28",
+	"version": "2026.7.29-3",
 	"description": "Source-only senpi extension package for codemode evaluation tools",
 	"type": "module",
 	"main": "./src/index.ts",
@@ -29,15 +29,15 @@
 		"access": "public"
 	},
 	"dependencies": {
-		"@babel/parser": "7.29.7",
-		"@earendil-works/pi-ai": "npm:@code-yeongyu/senpi-ai@^2026.7.28",
-		"typebox": "1.1.38"
+		"@babel/parser": "8.0.4",
+		"@earendil-works/pi-ai": "npm:@code-yeongyu/senpi-ai@^2026.7.29-3",
+		"typebox": "1.3.8"
 	},
 	"peerDependencies": {
 		"@code-yeongyu/senpi": "*"
 	},
 	"devDependencies": {
-		"@code-yeongyu/senpi": "2026.7.28"
+		"@code-yeongyu/senpi": "2026.7.29-3"
 	},
 	"keywords": [
 		"senpi",

package/src/extension/eval-status.ts

@@ -0,0 +1,44 @@
+import type { EvalDetachedCellStatusEntry } from "../tool/detached-cell-manager.ts";
+
+export const EVAL_CELLS_STATUS_KEY = "eval-cells";
+
+/** The footer shares one status line with other extensions; keep this brief. */
+const MAX_STATUS_LENGTH = 48;
+/** Same glyph the transcript uses for a detached cell, so the two surfaces read as one state. */
+const DETACHED_GLYPH = "↗";
+
+function truncateEnd(text: string, max: number): string {
+	if (text.length <= max) return text;
+	return `${text.slice(0, Math.max(0, max - 1))}…`;
+}
+
+/**
+ * Fits as many whole labels as possible into the budget, folding the rest into
+ * a `+N more` counter so the detached-cell count is never truncated away.
+ */
+function packLabels(labels: readonly string[], budget: number): string {
+	for (let kept = labels.length; kept >= 1; kept--) {
+		const hiddenCount = labels.length - kept;
+		const tail = hiddenCount > 0 ? ` +${hiddenCount} more` : "";
+		const joined = labels.slice(0, kept).join(", ");
+		if (joined.length + tail.length <= budget) return joined + tail;
+	}
+	const tail = labels.length > 1 ? ` +${labels.length - 1} more` : "";
+	return truncateEnd(labels[0] ?? "", Math.max(1, budget - tail.length)) + tail;
+}
+
+function labelOf(entry: EvalDetachedCellStatusEntry): string {
+	return entry.title === undefined || entry.title.length === 0 ? entry.cellId : entry.title;
+}
+
+/** Brief footer text for the cells still running detached; undefined clears the status. */
+export function formatEvalCellStatus(entries: readonly EvalDetachedCellStatusEntry[]): string | undefined {
+	const first = entries[0];
+	if (first === undefined) return undefined;
+	if (entries.length === 1) {
+		const head = `${DETACHED_GLYPH} ${first.language} · `;
+		return head + truncateEnd(labelOf(first), MAX_STATUS_LENGTH - head.length);
+	}
+	const head = `${DETACHED_GLYPH} eval ${entries.length}: `;
+	return head + packLabels(entries.map(labelOf), MAX_STATUS_LENGTH - head.length);
+}

package/src/extension/runtime-factory.ts

@@ -1,5 +1,6 @@
 import type { ExtensionContext } from "@code-yeongyu/senpi";
 import type { AgentExecuteTool } from "../bridges/agent-bridge.ts";
+import type { EvalSchemaToolInfo } from "../bridges/schema-bridge.ts";
 import type { CompletionRequest, CompletionResult } from "../completion/handler.ts";
 import {
 	type CodemodeSettings,
@@ -23,6 +24,7 @@ import {
 export interface CodemodeRuntimeAPI {
 	readonly executeTool: AgentExecuteTool;
 	getActiveTools(): string[];
+	getAllTools(): readonly EvalSchemaToolInfo[];
 }
 
 export interface RuntimeFactoryOptions {
@@ -71,6 +73,7 @@ export async function createRuntime(
 		availability,
 		artifactsDir: artifacts.dir,
 		executeTool,
+		listTools: () => pi.getAllTools(),
 		complete,
 	});
 	return {

package/src/extension/session-manager.ts

@@ -2,19 +2,28 @@ import { join } from "node:path";
 import type { ExtensionContext } from "@code-yeongyu/senpi";
 import { type BridgeServerHandle, startBridgeServer } from "../bridge/http-server.ts";
 import type { KernelToHostMessage } from "../bridge/protocol.ts";
+import { isReservedToolName, runReservedTool } from "../bridges/reserved-dispatch.ts";
+import type { EvalSchemaToolInfo } from "../bridges/schema-bridge.ts";
 import type { CompletionRequest, CompletionResult } from "../completion/handler.ts";
-import type { CodemodeSettings } from "../config/settings.ts";
+import { type CodemodeSettings, defaultCodemodeSettings } from "../config/settings.ts";
 import type { InterpreterAvailability } from "../interpreters/detect.ts";
 import { JuliaKernel } from "../kernels/jl/kernel.ts";
 import { JavaScriptKernel } from "../kernels/js/context-manager.ts";
 import { PythonKernel } from "../kernels/py/kernel.ts";
 import { RubyKernel } from "../kernels/rb/kernel.ts";
+import { marshalToolResult } from "../tool/image.ts";
 import type { EvalKernel, EvalKernelManager, EvalLanguage, ExecuteTool } from "../tool/types.ts";
 
 export interface CodemodeSessionManager extends EvalKernelManager {
 	dispose(): Promise<void>;
 	complete(request: CompletionRequest, ctx: ExtensionContext): Promise<CompletionResult>;
 	setContext?(ctx: ExtensionContext): void;
+	bridgeEndpoint?(): BridgeEndpoint;
+}
+
+export interface BridgeEndpoint {
+	readonly port: number;
+	readonly token: string;
 }
 
 export interface EvalExecutionTracker {
@@ -32,6 +41,7 @@ export interface CreateCodemodeSessionManagerOptions {
 	/** Session-adjacent directory used for persisted eval artifacts. */
 	readonly artifactsDir?: string;
 	readonly executeTool: ExecuteTool;
+	readonly listTools?: () => readonly EvalSchemaToolInfo[];
 	readonly complete: (request: CompletionRequest, ctx: ExtensionContext) => Promise<CompletionResult>;
 }
 
@@ -75,14 +85,34 @@ class DefaultCodemodeSessionManager implements CodemodeSessionManager {
 
 	async start(): Promise<void> {
 		this.#bridge = await startBridgeServer({
-			onCall: async (request) =>
-				this.#options.executeTool(request.toolName, request.args, { signal: request.signal }),
+			onCall: async (request) => await this.#call(request),
 			onEmit: async () => undefined,
 			onCompletion: async (request) =>
 				this.#options.complete({ prompt: request.prompt, opts: request.opts }, this.#contextFor(request.signal)),
 		});
 	}
 
+	// Subprocess kernels (py/rb/jl) reach the host only through this route, so reserved
+	// helper names must dispatch exactly as the in-process JS path does in tool/cell-handler.ts.
+	// Forwarding them to executeTool made agent() fail with "Unknown tool __agent__".
+	async #call(request: { toolName: string; args: unknown; callId: string; signal: AbortSignal }): Promise<unknown> {
+		if (!isReservedToolName(request.toolName)) {
+			return await this.#options.executeTool(request.toolName, request.args, { signal: request.signal });
+		}
+		const taskTools = this.#options.settings.taskTools ?? defaultCodemodeSettings.taskTools;
+		return await runReservedTool(request.toolName, {
+			callId: request.callId,
+			args: request.args,
+			executeTool: this.#options.executeTool,
+			taskToolName: taskTools.task,
+			taskOutputToolName: taskTools.output,
+			listTools: this.#options.listTools,
+			signal: request.signal,
+			emitStatus: () => {},
+			marshalToolResult,
+		});
+	}
+
 	async getKernel(language: EvalLanguage, onMessage: (message: KernelToHostMessage) => void): Promise<EvalKernel> {
 		if (this.#disposePromise) throw new CodemodeSessionDisposedError();
 		// Persistent kernels are reused across cells, but each cell needs its OWN
@@ -109,6 +139,12 @@ class DefaultCodemodeSessionManager implements CodemodeSessionManager {
 		return await this.#options.complete(request, ctx);
 	}
 
+	bridgeEndpoint(): BridgeEndpoint {
+		const bridge = this.#bridge;
+		if (!bridge) throw new Error("codemode bridge server is not running");
+		return { port: bridge.port, token: bridge.token };
+	}
+
 	setContext(ctx: ExtensionContext): void {
 		this.#context = ctx;
 	}

package/src/index.ts

@@ -5,6 +5,7 @@ import type { EvalSchemaToolInfo } from "./bridges/schema-bridge.ts";
 import { type CompletionRequest, type CompletionResult, createCompletionHandler } from "./completion/handler.ts";
 import { defaultCodemodeSettings } from "./config/settings.ts";
 import { EvalNotifier } from "./extension/eval-notifier.ts";
+import { EVAL_CELLS_STATUS_KEY, formatEvalCellStatus } from "./extension/eval-status.ts";
 import {
 	createExecuteTool,
 	createRuntime,
@@ -13,7 +14,7 @@ import {
 } from "./extension/runtime-factory.ts";
 import type { CodemodeSessionManager, CreateCodemodeSessionManagerOptions } from "./extension/session-manager.ts";
 import { SessionManagerProxy } from "./extension/session-manager-proxy.ts";
-import { EvalDetachedCellManager } from "./tool/detached-cell-manager.ts";
+import { EvalDetachedCellManager, type EvalDetachedCellStatusEntry } from "./tool/detached-cell-manager.ts";
 import { createEvalTool } from "./tool/eval-tool.ts";
 import { renderEvalCall, renderEvalResult } from "./tool/render.ts";
 
@@ -58,6 +59,18 @@ export default function senpiCodemode(pi: CodemodeExtensionAPI, options: SenpiCo
 		getContext: () => activeContext,
 		getMode: () => "wake",
 	});
+	const showDetachedCells = (entries: readonly EvalDetachedCellStatusEntry[]): void => {
+		const ctx = activeContext;
+		if (ctx?.ui?.setStatus === undefined) return;
+		const status = formatEvalCellStatus(entries);
+		const theme = ctx.ui.theme;
+		ctx.ui.setStatus(
+			EVAL_CELLS_STATUS_KEY,
+			status === undefined || ctx.mode !== "tui" || theme === undefined
+				? status
+				: theme.bg("selectedBg", theme.fg("text", status)),
+		);
+	};
 	const registerEvalForRuntime = (
 		runtime: SessionRuntime,
 		modelId: string | undefined,
@@ -101,7 +114,7 @@ export default function senpiCodemode(pi: CodemodeExtensionAPI, options: SenpiCo
 			listTools: () => pi.getAllTools(),
 			complete,
 			settings: defaultCodemodeSettings,
-			cellManager: new EvalDetachedCellManager({ notifier }),
+			cellManager: new EvalDetachedCellManager({ notifier, onStatusChange: showDetachedCells }),
 			executionTracker: manager,
 			renderers,
 			hostLine: hostLine(),
@@ -126,7 +139,11 @@ export default function senpiCodemode(pi: CodemodeExtensionAPI, options: SenpiCo
 		if (!replaced) return;
 		notifier.reset();
 		activeContext = ctx;
-		const cellManager = new EvalDetachedCellManager({ artifactsDir: runtime.artifactsDir, notifier });
+		const cellManager = new EvalDetachedCellManager({
+			artifactsDir: runtime.artifactsDir,
+			notifier,
+			onStatusChange: showDetachedCells,
+		});
 		activeCells = cellManager;
 		activeRuntime = runtime;
 		activeModelId = ctx.model?.id;

package/src/kernels/js/rewrite-imports.ts

@@ -49,7 +49,7 @@ function parseProgram(code: string): ReturnType<typeof parse> | undefined {
 			allowSuperOutsideMethod: true,
 			allowUndeclaredExports: true,
 			errorRecovery: true,
-			plugins: ["typescript", "importAttributes"],
+			plugins: ["typescript"],
 		});
 	} catch (error) {
 		if (error instanceof SyntaxError) return undefined;
@@ -130,6 +130,11 @@ function rewriteImportDeclaration(node: ImportDeclaration): string {
 }
 
 function dynamicImportEdit(node: AstNode): TextEdit | undefined {
+	// Babel 8 parses dynamic import() as an ImportExpression node; Babel 7 used
+	// a CallExpression with an Import callee. Handle both shapes.
+	if (node.type === "ImportExpression") {
+		return { start: node.start, end: node.start + "import".length, text: DYNAMIC_IMPORT_CALLEE };
+	}
 	if (node.type !== "CallExpression") return undefined;
 	const callee = nodeFrom(node.value.callee);
 	if (callee?.type !== "Import") return undefined;

package/src/tool/call-capture.ts

@@ -0,0 +1,93 @@
+import { type AgentToolResult, sanitizeTerminalLabel } from "@code-yeongyu/senpi";
+
+export const MAX_ENRICHED_TOOL_CALLS = 30;
+
+const MAX_ARGUMENT_STRING_CODE_POINTS = 512;
+const MAX_ARGUMENT_ENTRIES = 32;
+const MAX_ARGUMENT_DEPTH = 6;
+const MAX_SERIALIZED_ARGUMENT_LENGTH = 4096;
+const MAX_RESULT_PREVIEW_CODE_POINTS = 160;
+
+type BoundedValue = {
+	readonly value: unknown;
+	readonly truncated: boolean;
+};
+
+export function capCodePoints(text: string, max: number): string {
+	let end = 0;
+	let count = 0;
+	while (count < max && end < text.length) {
+		const firstCodeUnit = text.charCodeAt(end);
+		const secondCodeUnit = text.charCodeAt(end + 1);
+		const isSurrogatePair =
+			firstCodeUnit >= 0xd800 && firstCodeUnit <= 0xdbff && secondCodeUnit >= 0xdc00 && secondCodeUnit <= 0xdfff;
+		end += isSurrogatePair ? 2 : 1;
+		count += 1;
+	}
+	return end === text.length ? text : `${text.slice(0, end)}…`;
+}
+
+function boundValue(value: unknown, depth: number, ancestors: WeakSet<object>): BoundedValue {
+	if (typeof value === "string") {
+		const capped = capCodePoints(value, MAX_ARGUMENT_STRING_CODE_POINTS);
+		return { value: capped, truncated: capped !== value };
+	}
+
+	if (value === null || typeof value !== "object") return { value, truncated: false };
+	if (depth >= MAX_ARGUMENT_DEPTH) return { value: "…", truncated: true };
+	if (ancestors.has(value)) throw new Error("cyclic tool-call arguments");
+
+	ancestors.add(value);
+	try {
+		if (Array.isArray(value)) {
+			const retainedLength = Math.min(value.length, MAX_ARGUMENT_ENTRIES);
+			const clone: unknown[] = [];
+			let truncated = value.length > MAX_ARGUMENT_ENTRIES;
+			for (let index = 0; index < retainedLength; index += 1) {
+				const bounded = boundValue(value[index], depth + 1, ancestors);
+				clone.push(bounded.value);
+				truncated ||= bounded.truncated;
+			}
+			return { value: clone, truncated };
+		}
+
+		const entries: [string, unknown][] = [];
+		let truncated = false;
+		let count = 0;
+		for (const [key, nestedValue] of Object.entries(value)) {
+			if (count >= MAX_ARGUMENT_ENTRIES) {
+				truncated = true;
+				break;
+			}
+			const bounded = boundValue(nestedValue, depth + 1, ancestors);
+			entries.push([key, bounded.value]);
+			truncated ||= bounded.truncated;
+			count += 1;
+		}
+		return { value: Object.fromEntries(entries), truncated };
+	} finally {
+		ancestors.delete(value);
+	}
+}
+
+export function boundToolCallArgs(args: unknown): { args: unknown; truncated: boolean } {
+	try {
+		const bounded = boundValue(args, 0, new WeakSet<object>());
+		const serialized = JSON.stringify(bounded.value);
+		if (typeof serialized !== "string" || serialized.length > MAX_SERIALIZED_ARGUMENT_LENGTH) {
+			return { args: undefined, truncated: true };
+		}
+		return { args: bounded.value, truncated: bounded.truncated };
+	} catch {
+		return { args: undefined, truncated: true };
+	}
+}
+
+export function toolCallResultPreview(result: AgentToolResult<unknown>): string | undefined {
+	for (const part of result.content) {
+		if (part.type !== "text") continue;
+		const preview = sanitizeTerminalLabel(part.text).replace(/\s+/gu, " ").trim();
+		return preview.length === 0 ? undefined : capCodePoints(preview, MAX_RESULT_PREVIEW_CODE_POINTS);
+	}
+	return undefined;
+}

package/src/tool/cell-handler.ts

@@ -1,4 +1,9 @@
-import type { AgentToolResult, AgentToolUpdateCallback, ExtensionContext } from "@code-yeongyu/senpi";
+import {
+	type AgentToolResult,
+	type AgentToolUpdateCallback,
+	type ExtensionContext,
+	sanitizeTerminalLabel,
+} from "@code-yeongyu/senpi";
 import type { KernelToHostMessage } from "../bridge/protocol.ts";
 import type { AgentExecuteTool } from "../bridges/agent-bridge.ts";
 import { isReservedToolName, runReservedTool } from "../bridges/reserved-dispatch.ts";
@@ -7,6 +12,7 @@ import { appendSchemaHint } from "../bridges/schema-hint.ts";
 import type { CompletionRequest, CompletionResult } from "../completion/handler.ts";
 import { handleCompletionToolCall } from "../completion/tool-bridge.ts";
 import type { ResolvedCodemodeSettings } from "../config/settings.ts";
+import { boundToolCallArgs, capCodePoints, MAX_ENRICHED_TOOL_CALLS, toolCallResultPreview } from "./call-capture.ts";
 import {
 	type EvalImageResizer,
 	EvalOutputCollector,
@@ -17,7 +23,19 @@ import {
 import { upsertStatusEvent } from "./status-events.ts";
 import type { EvalKernel, EvalStatusEvent, EvalToolDetails, EvalToolInput } from "./types.ts";
 
-type ResolvedToolReply = { readonly value: unknown; readonly toolCallOk: boolean };
+type ResolvedToolReply = {
+	readonly value: unknown;
+	readonly toolCallOk: boolean;
+	readonly resultPreview?: string;
+	readonly errorText?: string;
+};
+
+type ToolCallEnrichment = {
+	readonly callId: string;
+	readonly args: unknown;
+	readonly startedAt: number;
+	readonly argsTruncated?: true;
+};
 
 const LIVE_OUTPUT_PREVIEW_LINES = 8;
 
@@ -187,20 +205,53 @@ export class CellHandler {
 			this.#emitUpdate(false);
 			return;
 		}
-		await this.#deliverToolReply(message, async () => {
-			const result = await this.#runtime.executeTool(message.toolName, message.args, { signal: this.#state.signal });
-			return { value: marshalToolResult(result), toolCallOk: !toolResultIsError(result) };
-		});
+		const capturedArgs = boundToolCallArgs(message.args);
+		const startedAt = Date.now();
+		await this.#deliverToolReply(
+			message,
+			async () => {
+				const result = await this.#runtime.executeTool(message.toolName, message.args, {
+					signal: this.#state.signal,
+				});
+				const toolCallOk = !toolResultIsError(result);
+				if (toolCallOk) {
+					const resultPreview = toolCallResultPreview(result);
+					return {
+						value: marshalToolResult(result),
+						toolCallOk,
+						...(resultPreview === undefined ? {} : { resultPreview }),
+					};
+				}
+				let errorText: string | undefined;
+				for (const part of result.content) {
+					if (part.type !== "text") continue;
+					errorText = capCodePoints(sanitizeTerminalLabel(part.text), 512);
+					break;
+				}
+				return {
+					value: marshalToolResult(result),
+					toolCallOk,
+					...(errorText === undefined ? {} : { errorText }),
+				};
+			},
+			{
+				callId: message.callId,
+				args: capturedArgs.args,
+				startedAt,
+				...(capturedArgs.truncated ? { argsTruncated: true } : {}),
+			},
+		);
 	}
 
 	async #deliverToolReply(
 		message: Extract<KernelToHostMessage, { type: "tool-call" }>,
 		resolve: () => Promise<ResolvedToolReply>,
+		enrich?: ToolCallEnrichment,
 	): Promise<void> {
 		try {
 			const reply = await resolve();
 			if (!this.#state.active) return;
-			this.#state.toolCalls.push({ name: message.toolName, ok: reply.toolCallOk });
+			this.#pushToolCall(message.toolName, reply.toolCallOk, enrich, reply.resultPreview, reply.errorText);
 			this.#kernel.deliverToolReply({ type: "tool-reply", callId: message.callId, ok: true, value: reply.value });
 		} catch (error) {
 			if (!this.#state.active) return;
@@ -209,7 +260,7 @@ export class CellHandler {
 				message.toolName,
 				this.#toolParameters(message.toolName),
 			);
-			this.#state.toolCalls.push({ name: message.toolName, ok: false, error: text });
+			this.#pushToolCall(message.toolName, false, enrich, undefined, text);
 			this.#kernel.deliverToolReply({
 				type: "tool-reply",
 				callId: message.callId,
@@ -220,6 +271,29 @@ export class CellHandler {
 		this.#emitUpdate(false);
 	}
 
+	#pushToolCall(
+		name: string,
+		ok: boolean,
+		enrich: ToolCallEnrichment | undefined,
+		resultPreview: string | undefined,
+		error: string | undefined,
+	): void {
+		const summary = { name, ok, ...(error === undefined ? {} : { error }) };
+		const enrichedCount = this.#state.toolCalls.filter((toolCall) => toolCall.callId !== undefined).length;
+		if (enrich === undefined || enrichedCount >= MAX_ENRICHED_TOOL_CALLS) {
+			this.#state.toolCalls.push(summary);
+			return;
+		}
+		this.#state.toolCalls.push({
+			...summary,
+			callId: enrich.callId,
+			args: enrich.args,
+			durationMs: Date.now() - enrich.startedAt,
+			...(enrich.argsTruncated === true ? { argsTruncated: true } : {}),
+			...(resultPreview === undefined ? {} : { resultPreview }),
+		});
+	}
+
 	#toolParameters(toolName: string): unknown {
 		return this.#runtime.listTools?.().find((tool) => tool.name === toolName)?.parameters;
 	}

package/src/tool/detached-cell-manager.ts

@@ -41,9 +41,18 @@ export interface EvalDetachedCellNotifier {
 	notify(cells: readonly EvalDetachedCellNotification[]): void;
 }
 
+/** One live detached cell, as shown in the footer status line. */
+export interface EvalDetachedCellStatusEntry {
+	readonly cellId: string;
+	readonly language: EvalLanguage;
+	readonly title?: string;
+}
+
 export interface EvalDetachedCellManagerOptions {
 	readonly artifactsDir?: string;
 	readonly notifier?: EvalDetachedCellNotifier;
+	/** Called with every detached cell whenever that set changes; empty clears the status. */
+	readonly onStatusChange?: (entries: readonly EvalDetachedCellStatusEntry[]) => void;
 }
 
 /**
@@ -56,6 +65,7 @@ export interface EvalDetachedCellManagerOptions {
 export class EvalDetachedCellManager {
 	readonly #artifactsDir: string | undefined;
 	readonly #notifier: EvalDetachedCellNotifier | undefined;
+	readonly #onStatusChange: ((entries: readonly EvalDetachedCellStatusEntry[]) => void) | undefined;
 	readonly #cells = new Map<string, ManagedCell>();
 	readonly #detachedByLanguage = new Map<EvalLanguage, ManagedCell>();
 	#notificationQueue: ManagedCell[] = [];
@@ -64,11 +74,15 @@ export class EvalDetachedCellManager {
 	constructor(options: EvalDetachedCellManagerOptions = {}) {
 		this.#artifactsDir = options.artifactsDir;
 		this.#notifier = options.notifier;
+		this.#onStatusChange = options.onStatusChange;
 	}
 
 	create(cellId: string, input: EvalToolInput): ManagedCell {
 		const existing = this.#cells.get(cellId);
-		if (existing !== undefined) throw new Error(`Eval cell ${cellId} is already managed`);
+		if (existing !== undefined) {
+			if (existing.state === "running" || existing.state === "detached") throw activeCellReuseError(existing);
+			this.#cells.delete(cellId);
+		}
 		const spillPath =
 			this.#artifactsDir === undefined
 				? undefined
@@ -102,6 +116,7 @@ export class EvalDetachedCellManager {
 		if (!cell.canDetach || !this.#transition(cell, "detached")) return false;
 		cell.wasDetached = true;
 		this.#detachedByLanguage.set(cell.input.language, cell);
+		this.#emitStatus();
 		return true;
 	}
 
@@ -161,11 +176,24 @@ export class EvalDetachedCellManager {
 		if (cell.wasDetached && next !== "detached") {
 			if (this.#detachedByLanguage.get(cell.input.language) === cell)
 				this.#detachedByLanguage.delete(cell.input.language);
+			this.#emitStatus();
 			this.#queueNotification(cell);
 		}
 		return true;
 	}
 
+	#emitStatus(): void {
+		const emit = this.#onStatusChange;
+		if (emit === undefined) return;
+		emit(
+			[...this.#detachedByLanguage.values()].map((cell) => ({
+				cellId: cell.cellId,
+				language: cell.input.language,
+				...(cell.input.title === undefined ? {} : { title: cell.input.title }),
+			})),
+		);
+	}
+
 	#queueNotification(cell: ManagedCell): void {
 		if (cell.notificationQueued) return;
 		cell.notificationQueued = true;
@@ -232,6 +260,12 @@ export class EvalDetachedCellManager {
 	}
 }
 
+function activeCellReuseError(cell: ManagedCell): Error {
+	return new Error(
+		`Eval cell ${cell.cellId} from a previous call is still ${cell.state} in the ${cell.input.language} kernel. Use eval({ action: "peek", cell_id: "${cell.cellId}" }) to read it or eval({ action: "stop", cell_id: "${cell.cellId}" }) to end it before its id can be reused.`,
+	);
+}
+
 function allowsTransition(from: EvalDetachedCellState, to: EvalDetachedCellState): boolean {
 	if (from === "running") return to === "detached" || to === "completed" || to === "failed" || to === "cancelled";
 	if (from === "detached") return to === "completed" || to === "failed" || to === "cancelled";

package/src/tool/render.ts

@@ -19,6 +19,7 @@ import {
 	JSON_TREE_SCALAR_LEN_EXPANDED,
 	renderJsonTreeLines,
 } from "./json-tree.ts";
+import { codePointPrefix, formatDuration, renderToolCallWidget } from "./tool-widgets.ts";
 import type {
 	EvalCellResult,
 	EvalInputSchema,
@@ -116,18 +117,6 @@ function appendLines(target: string[], source: readonly string[]): void {
 	for (const line of source) target.push(line);
 }
 
-function codePointPrefix(text: string, maxCodePoints: number): string {
-	let end = 0;
-	for (let count = 0; count < maxCodePoints && end < text.length; count += 1) {
-		const firstCodeUnit = text.charCodeAt(end);
-		const secondCodeUnit = text.charCodeAt(end + 1);
-		const isSurrogatePair =
-			firstCodeUnit >= 0xd800 && firstCodeUnit <= 0xdbff && secondCodeUnit >= 0xdc00 && secondCodeUnit <= 0xdfff;
-		end += isSurrogatePair ? 2 : 1;
-	}
-	return text.slice(0, end);
-}
-
 function renderAllVisualLines(text: string, width: number): string[] {
 	return truncateToVisualLines(text, Number.POSITIVE_INFINITY, width).visualLines.map((line) => line.trimEnd());
 }
@@ -232,18 +221,6 @@ function highlightedCode(code: string, language: EvalLanguage, theme: Theme | un
 	return (theme === undefined ? lines.map((line) => line.replace(/\u001b\[[0-9;]*m/gu, "")) : lines).join("\n");
 }
 
-function formatDuration(milliseconds: number): string {
-	const totalSeconds = Math.floor(Math.max(0, milliseconds) / 1_000);
-	if (totalSeconds < 1) return "<1s";
-	const seconds = totalSeconds % 60;
-	const totalMinutes = Math.floor(totalSeconds / 60);
-	if (totalMinutes < 1) return `${seconds}s`;
-	const minutes = totalMinutes % 60;
-	const hours = Math.floor(totalMinutes / 60);
-	if (hours < 1) return seconds === 0 ? `${minutes}m` : `${minutes}m ${seconds}s`;
-	return minutes === 0 ? `${hours}h` : `${hours}h ${minutes}m`;
-}
-
 function spinner(frame: number | undefined): string {
 	return SPINNER_FRAMES.at((frame ?? 0) % SPINNER_FRAMES.length) ?? SPINNER_FRAMES[0];
 }
@@ -695,6 +672,46 @@ function toolCallRows(details: EvalToolDetails | undefined): ToolCallRow[] {
 	});
 }
 
+function nestedToolCallBlock(
+	details: EvalToolDetails | undefined,
+	theme: Theme | undefined,
+	cwd: string,
+	expanded: boolean,
+): RenderBlock | undefined {
+	const toolCalls = details?.toolCalls;
+	if (theme === undefined || toolCalls === undefined || !toolCalls.some((call) => call.args !== undefined)) {
+		return undefined;
+	}
+	const legacyRows = toolCallRows(details);
+	return {
+		kind: "dynamic",
+		render: (width) => {
+			const retainedCalls = expanded ? toolCalls : toolCalls.slice(-TOOL_CALL_PREVIEW_COUNT);
+			const retainedRows = expanded ? legacyRows : legacyRows.slice(-TOOL_CALL_PREVIEW_COUNT);
+			const skippedCount = toolCalls.length - retainedCalls.length;
+			const toolCallNoun = skippedCount === 1 ? "call" : "calls";
+			const lines =
+				expanded || skippedCount === 0
+					? []
+					: renderAllVisualLines(style(theme, "muted", `${skippedCount} earlier tool ${toolCallNoun}`), width);
+			const legacyBlock: Extract<RenderBlock, { kind: "toolCalls" }> = {
+				kind: "toolCalls",
+				calls: retainedRows,
+				expanded,
+				theme,
+			};
+			for (const [index, call] of retainedCalls.entries()) {
+				if (call.args !== undefined) {
+					appendLines(lines, renderToolCallWidget(call, { cwd, theme, expanded, width }));
+				} else {
+					appendLines(lines, renderToolCall(retainedRows[index], legacyBlock, width));
+				}
+			}
+			return lines;
+		},
+	};
+}
+
 function resultStatus(
 	details: EvalToolDetails | undefined,
 	options: ToolRenderResultOptions,
@@ -732,7 +749,7 @@ function resultMetadata(
 ): RenderBlock[] {
 	const metadata: string[] = [];
 	if (details?.phase) metadata.push(`phase ${details.phase}`);
-	if (!options.isPartial && details) metadata.push(`took ${details.durationMs}ms`);
+	if (!options.isPartial && typeof details?.durationMs === "number") metadata.push(`took ${details.durationMs}ms`);
 	if (metadata.length === 0) return [];
 	return [{ kind: "text", text: style(theme, "muted", metadata.join(" | ")) }];
 }
@@ -824,7 +841,9 @@ export function renderEvalResult(
 			},
 		];
 		const calls = toolCallRows(details);
-		if (calls.length > 0) blocks.push({ kind: "blank" }, { kind: "toolCalls", calls, expanded, theme });
+		const nestedCalls = nestedToolCallBlock(details, theme, context.cwd, expanded);
+		if (calls.length > 0)
+			blocks.push({ kind: "blank" }, nestedCalls ?? { kind: "toolCalls", calls, expanded, theme });
 		component.setBlocks(blocks);
 		return component;
 	}
@@ -888,7 +907,8 @@ export function renderEvalResult(
 		);
 	}
 	const calls = toolCallRows(details);
-	if (calls.length > 0) blocks.push({ kind: "blank" }, { kind: "toolCalls", calls, expanded, theme });
+	const nestedCalls = nestedToolCallBlock(details, theme, context.cwd, expanded);
+	if (calls.length > 0) blocks.push({ kind: "blank" }, nestedCalls ?? { kind: "toolCalls", calls, expanded, theme });
 	if (details?.notice !== undefined)
 		blocks.push({ kind: "blank" }, { kind: "text", text: style(theme, "dim", details.notice) });
 	const warning = formatTruncationWarning(details?.meta) ?? (details?.truncated ? "[eval output truncated]" : null);

package/src/tool/tool-widgets.ts

@@ -0,0 +1,259 @@
+import {
+	createBashToolDefinition,
+	createFindToolDefinition,
+	createGrepToolDefinition,
+	createLsToolDefinition,
+	createReadToolDefinition,
+	createWriteToolDefinition,
+	sanitizeTerminalLabel,
+	type Theme,
+	type ThemeColor,
+	type ToolDefinition,
+	truncateToVisualLines,
+} from "@code-yeongyu/senpi";
+import type { TSchema } from "typebox";
+import { Check } from "typebox/value";
+import type { EvalToolCallSummary } from "./types.ts";
+
+export interface WidgetOptions {
+	readonly cwd: string;
+	readonly theme: Theme | undefined;
+	readonly expanded: boolean;
+	readonly width: number;
+}
+
+type AnyToolDef<TParams extends TSchema, TDetails, TState> = ToolDefinition<TParams, TDetails, TState>;
+type RenderCallOf<TParams extends TSchema, TDetails, TState> = NonNullable<
+	AnyToolDef<TParams, TDetails, TState>["renderCall"]
+>;
+type ToolRenderContext<TParams extends TSchema, TDetails, TState> = Parameters<
+	RenderCallOf<TParams, TDetails, TState>
+>[2];
+type Component<TParams extends TSchema, TDetails, TState> = ReturnType<RenderCallOf<TParams, TDetails, TState>>;
+
+type CoreWidgetName = "bash" | "read" | "write" | "grep" | "find" | "ls";
+type CoreWidgetRenderer = (summary: EvalToolCallSummary, options: WidgetOptions) => string[] | undefined;
+type CoreWidgets = Readonly<Record<CoreWidgetName, CoreWidgetRenderer>>;
+
+const MIN_RENDERER_WIDTH = 20;
+const MAX_RENDERER_LINES = 5;
+const MAX_FALLBACK_ARGUMENT_CODE_POINTS = 120;
+const MAX_COLLAPSED_ERROR_CODE_POINTS = 512;
+const MAX_COLLAPSED_ERROR_LINES = 4;
+const MAX_PREVIEW_LINES = 2;
+const MAX_COLLAPSED_WIDGET_LINES = 8;
+const TOOL_ERROR_OMISSION_MARKER = "[tool error omitted]";
+const WIDGET_TRUNCATION_MARKER = "… (widget truncated)";
+const TERMINAL_ESCAPE_PATTERN =
+	/(?:\u001B\][\s\S]*?(?:\u0007|\u001B\\|\u009C))|[\u001B\u009B][[\]()#;?]*(?:\d{1,4}(?:[;:]\d{0,4})*)?[\dA-PR-TZcf-nq-uy=><~]/g;
+const TERMINAL_CONTROL_PATTERN = /[\u0000-\u0009\u000b-\u001f\u007f-\u009f]+/g;
+const coreWidgetsByCwd = new Map<string, CoreWidgets>();
+
+export function codePointPrefix(text: string, maxCodePoints: number): string {
+	let end = 0;
+	for (let count = 0; count < maxCodePoints && end < text.length; count += 1) {
+		const firstCodeUnit = text.charCodeAt(end);
+		const secondCodeUnit = text.charCodeAt(end + 1);
+		const isSurrogatePair =
+			firstCodeUnit >= 0xd800 && firstCodeUnit <= 0xdbff && secondCodeUnit >= 0xdc00 && secondCodeUnit <= 0xdfff;
+		end += isSurrogatePair ? 2 : 1;
+	}
+	return text.slice(0, end);
+}
+
+export function formatDuration(milliseconds: number): string {
+	const totalSeconds = Math.floor(Math.max(0, milliseconds) / 1_000);
+	if (totalSeconds < 1) return "<1s";
+	const seconds = totalSeconds % 60;
+	const totalMinutes = Math.floor(totalSeconds / 60);
+	if (totalMinutes < 1) return `${seconds}s`;
+	const minutes = totalMinutes % 60;
+	const hours = Math.floor(totalMinutes / 60);
+	if (hours < 1) return seconds === 0 ? `${minutes}m` : `${minutes}m ${seconds}s`;
+	return minutes === 0 ? `${hours}h` : `${hours}h ${minutes}m`;
+}
+
+function style(theme: Theme | undefined, color: ThemeColor, text: string): string {
+	return theme === undefined ? text : theme.fg(color, text);
+}
+
+function renderAllVisualLines(text: string, width: number): string[] {
+	return truncateToVisualLines(text, Number.POSITIVE_INFINITY, width).visualLines.map((line) => line.trimEnd());
+}
+
+function renderFirstVisualLines(text: string, maxLines: number, width: number): string[] {
+	const truncated = truncateToVisualLines(text, maxLines, width);
+	if (truncated.skippedCount === 0) return truncated.visualLines.map((line) => line.trimEnd());
+	return renderAllVisualLines(text, width).slice(0, maxLines);
+}
+
+function indent(lines: readonly string[]): string[] {
+	return lines.map((line) => `  ${line}`);
+}
+
+function renderWith<TParams extends TSchema, TDetails, TState>(
+	definition: ToolDefinition<TParams, TDetails, TState>,
+	summary: EvalToolCallSummary,
+	options: WidgetOptions,
+	initialState: TState,
+): string[] | undefined {
+	let preparedArgs: unknown = summary.args;
+	try {
+		if (definition.prepareArguments !== undefined) preparedArgs = definition.prepareArguments(preparedArgs);
+		if (!Check(definition.parameters, preparedArgs)) return undefined;
+	} catch {
+		return undefined;
+	}
+
+	const theme = options.theme;
+	const innerWidth = options.width - 2;
+	const renderCall = definition.renderCall;
+	if (theme === undefined || innerWidth < MIN_RENDERER_WIDTH || renderCall === undefined) return undefined;
+
+	const context: ToolRenderContext<TParams, TDetails, TState> = {
+		args: preparedArgs,
+		toolCallId: summary.callId ?? summary.name,
+		invalidate: () => {},
+		lastComponent: undefined,
+		state: initialState,
+		cwd: options.cwd,
+		executionStarted: true,
+		argsComplete: true,
+		isPartial: false,
+		expanded: options.expanded,
+		showImages: false,
+		isError: !summary.ok,
+		hasResult: false,
+	};
+
+	try {
+		const component: Component<TParams, TDetails, TState> = renderCall(preparedArgs, theme, context);
+		const renderedLines = component.render(innerWidth).map((line) => line.trimEnd());
+		const retainedLines = renderedLines.slice(0, MAX_RENDERER_LINES);
+		if (renderedLines.length > retainedLines.length) {
+			retainedLines.push(style(theme, "muted", WIDGET_TRUNCATION_MARKER));
+		}
+		return indent(retainedLines);
+	} catch {
+		return undefined;
+	}
+}
+
+function createCoreWidgets(cwd: string): CoreWidgets {
+	const bashDefinition = createBashToolDefinition(cwd);
+	const readDefinition = createReadToolDefinition(cwd);
+	const writeDefinition = createWriteToolDefinition(cwd);
+	const grepDefinition = createGrepToolDefinition(cwd);
+	const findDefinition = createFindToolDefinition(cwd);
+	const lsDefinition = createLsToolDefinition(cwd);
+	const widgets: CoreWidgets = {
+		bash: (summary, options) =>
+			renderWith(bashDefinition, summary, options, {
+				startedAt: undefined,
+				endedAt: undefined,
+				interval: undefined,
+			}),
+		read: (summary, options) => renderWith(readDefinition, summary, options, {}),
+		write: (summary, options) => renderWith(writeDefinition, summary, options, {}),
+		grep: (summary, options) => renderWith(grepDefinition, summary, options, {}),
+		find: (summary, options) => renderWith(findDefinition, summary, options, {}),
+		ls: (summary, options) => renderWith(lsDefinition, summary, options, {}),
+	};
+	return widgets;
+}
+
+function coreWidgetsFor(cwd: string): CoreWidgets {
+	const cached = coreWidgetsByCwd.get(cwd);
+	if (cached !== undefined) return cached;
+	const widgets = createCoreWidgets(cwd);
+	coreWidgetsByCwd.set(cwd, widgets);
+	return widgets;
+}
+
+function isCoreWidgetName(name: string): name is CoreWidgetName {
+	switch (name) {
+		case "bash":
+		case "read":
+		case "write":
+		case "grep":
+		case "find":
+		case "ls":
+			return true;
+		default:
+			return false;
+	}
+}
+
+function compactArguments(args: unknown): string {
+	if (args === undefined) return "";
+	try {
+		const serialized = JSON.stringify(args);
+		if (serialized === undefined) return "";
+		return codePointPrefix(sanitizeTerminalLabel(serialized), MAX_FALLBACK_ARGUMENT_CODE_POINTS);
+	} catch {
+		return "[unserializable args]";
+	}
+}
+
+function renderFallback(summary: EvalToolCallSummary, width: number): string[] {
+	const name = sanitizeTerminalLabel(summary.name);
+	const fallback = `tool.${name}(${compactArguments(summary.args)})`;
+	return indent(renderAllVisualLines(fallback, width));
+}
+
+function renderStatus(summary: EvalToolCallSummary, options: WidgetOptions, width: number): string[] {
+	const icon = style(options.theme, summary.ok ? "success" : "error", summary.ok ? "✓" : "✗");
+	const parts = [icon];
+	if (summary.durationMs !== undefined) parts.push(formatDuration(summary.durationMs));
+	if (summary.argsTruncated) parts.push("(args truncated)");
+	return indent(renderFirstVisualLines(parts.join(" "), 1, width));
+}
+
+function sanitizeTerminalControl(text: string): string {
+	return text.replace(TERMINAL_ESCAPE_PATTERN, "").replace(TERMINAL_CONTROL_PATTERN, " ");
+}
+
+function renderPreview(preview: string, options: WidgetOptions, width: number): string[] {
+	const sanitized = sanitizeTerminalControl(preview);
+	if (sanitized.length === 0) return [];
+	return indent(renderFirstVisualLines(style(options.theme, "muted", sanitized), MAX_PREVIEW_LINES, width));
+}
+
+function renderCollapsedError(error: string, options: WidgetOptions, width: number): string[] {
+	const guardedError = codePointPrefix(error, MAX_COLLAPSED_ERROR_CODE_POINTS);
+	const guardedLines = renderAllVisualLines(style(options.theme, "error", guardedError), width);
+	if (guardedError.length === error.length && guardedLines.length <= MAX_COLLAPSED_ERROR_LINES) {
+		return indent(guardedLines);
+	}
+
+	const markerLines = renderAllVisualLines(style(options.theme, "muted", TOOL_ERROR_OMISSION_MARKER), width);
+	const errorBudget = Math.max(0, MAX_COLLAPSED_ERROR_LINES - markerLines.length);
+	const lines = guardedLines.slice(0, errorBudget);
+	lines.push(...markerLines.slice(0, MAX_COLLAPSED_ERROR_LINES - lines.length));
+	return indent(lines);
+}
+
+function renderError(error: string, options: WidgetOptions, width: number): string[] {
+	const sanitized = sanitizeTerminalControl(error);
+	if (options.expanded) return indent(renderAllVisualLines(style(options.theme, "error", sanitized), width));
+	return renderCollapsedError(sanitized, options, width);
+}
+
+/**
+ * The theme-less fallback is QA-only. Production's gate lives in render.ts:
+ * nestedToolCallBlock routes theme-less renders to legacy rows before this function is called.
+ */
+export function renderToolCallWidget(summary: EvalToolCallSummary, options: WidgetOptions): string[] {
+	const innerWidth = Math.max(1, options.width - 2);
+	const coreLines = isCoreWidgetName(summary.name)
+		? coreWidgetsFor(options.cwd)[summary.name](summary, options)
+		: undefined;
+	const lines = coreLines ?? renderFallback(summary, innerWidth);
+	lines.push(...renderStatus(summary, options, innerWidth));
+	if (summary.ok && summary.resultPreview !== undefined) {
+		lines.push(...renderPreview(summary.resultPreview, options, innerWidth));
+	} else if (!summary.ok && summary.error !== undefined) {
+		lines.push(...renderError(summary.error, options, innerWidth));
+	}
+	return options.expanded ? lines : lines.slice(0, MAX_COLLAPSED_WIDGET_LINES);
+}

package/src/tool/types.ts

@@ -117,6 +117,11 @@ export interface EvalToolCallSummary {
 	readonly name: string;
 	readonly ok: boolean;
 	readonly error?: string;
+	readonly callId?: string;
+	readonly args?: unknown;
+	readonly argsTruncated?: boolean;
+	readonly durationMs?: number;
+	readonly resultPreview?: string;
 }
 
 export type EvalStatusEvent = { readonly op: string } & Readonly<Record<string, unknown>>;