@fosterg4/pi-subagent 1.0.2 → 1.0.4

package/index.ts

@@ -35,12 +35,16 @@ import {
 	formatAgentList,
 } from "./agents.ts";
 import { type ValidationResult, validateSchema } from "./validate.ts";
+import { fmt, usageLine, sumUsage } from "./utils.ts";
+import { AgentWidget, type WidgetEntry } from "./ui.ts";
 
 const MAX_PARALLEL_TASKS = 8;
 const MAX_CONCURRENCY = 4;
 const PER_TASK_OUTPUT_CAP = 50 * 1024;
 
+/* eslint-disable @typescript-eslint/no-unused-vars */
 
+interface UsageStats {
 	input: number;
 	output: number;
 	cacheRead: number;
@@ -233,6 +237,7 @@ async function runSingleAgent(
 	signal: AbortSignal | undefined,
 	onUpdate: OnUpdateCallback | undefined,
 	makeDetails: (results: SingleResult[]) => SubagentDetails,
+	onStats?: (stats: { turns: number; tokens: number }) => void,
 ): Promise<SingleResult> {
 	const agent = agents.find((a) => a.name === agentName);
 
@@ -370,6 +375,8 @@ async function runSingleAgent(
 							currentResult.usage.cost += usage.cost?.total || 0;
 							currentResult.usage.contextTokens = usage.totalTokens || 0;
 						}
+						const total = currentResult.usage.input + currentResult.usage.output + currentResult.usage.cacheRead;
+						onStats?.({ turns: currentResult.usage.turns, tokens: total });
 						if (!currentResult.model && msg.model)
 							currentResult.model = msg.model;
 						if (msg.stopReason) currentResult.stopReason = msg.stopReason;
@@ -637,8 +644,18 @@ export default function (pi: ExtensionAPI) {
 			if (params.chain && params.chain.length > 0) {
 				const results: SingleResult[] = [];
 				let previousStructured: Record<string, unknown> | undefined;
+				let widgetHandle: ReturnType<typeof pi.ui.custom> | undefined;
+
+				const closeWidget = () => {
+					if (widgetHandle) {
+						widgetHandle.close();
+						widgetHandle = undefined;
+					}
+				};
 
 				for (let i = 0; i < params.chain.length; i++) {
+					closeWidget();
+
 					const step = params.chain[i];
 					let taskWithContext = step.task;
 
@@ -648,13 +665,26 @@ export default function (pi: ExtensionAPI) {
 							/\{previous\}/g,
 							JSON.stringify(previousStructured, null, 2),
 						);
-					} else {
+					} else if (i > 0) {
 						taskWithContext = taskWithContext.replace(
 							/\{previous\}/g,
 							getFinalOutput(results[i - 1]?.messages ?? ""),
 						);
 					}
 
+					// Spawn live widget for this step
+					if (ctx.hasUI) {
+						const widget = new AgentWidget();
+						widget.addAgent(step.agent, step.task.replace(/\{[^}]+\}/g, "").trim());
+						widgetHandle = ctx.ui.custom(widget, { overlay: true });
+					}
+
+					const stepStats = (stats: { turns: number; tokens: number }) => {
+						if (widgetHandle) {
+							widgetHandle.requestRender();
+						}
+					};
+
 					const chainUpdate: OnUpdateCallback | undefined = onUpdate
 						? (partial) => {
 								const currentResult = partial.details?.results[0];
@@ -678,6 +708,7 @@ export default function (pi: ExtensionAPI) {
 						signal,
 						chainUpdate,
 						makeDetails("chain"),
+						stepStats,
 					);
 					results.push(result);
 
@@ -694,6 +725,7 @@ export default function (pi: ExtensionAPI) {
 					}
 
 					if (isFailedResult(result)) {
+						closeWidget();
 						const errorMsg = getResultOutput(result);
 						return {
 							content: [
@@ -708,6 +740,8 @@ export default function (pi: ExtensionAPI) {
 					}
 				}
 
+				closeWidget();
+
 				const lastResult = results[results.length - 1];
 				return {
 					content: [
@@ -954,11 +988,13 @@ export default function (pi: ExtensionAPI) {
 				return theme.fg("error", "\u2717");
 			};
 
-			// --- Single mode ---
+		// --- Single mode ---
 			if (details.mode === "single" && details.results.length === 1) {
 				const r = details.results[0];
 				const status = getStatusText(r);
 				const finalOutput = getFinalOutputText(r.messages);
+				const usage = usageLine(r.usage);
+				const usg = usage ? theme.fg("dim", usage) : "";
 
 				if (expanded) {
 					const container = new Container();
@@ -969,6 +1005,10 @@ export default function (pi: ExtensionAPI) {
 						container.addChild(new Spacer(1));
 						container.addChild(new Markdown(finalOutput.trim(), 0, 0, mdTheme));
 					}
+					if (usg) {
+						container.addChild(new Spacer(1));
+						container.addChild(new Text(usg, 0, 0));
+					}
 					return container;
 				}
 
@@ -981,6 +1021,7 @@ export default function (pi: ExtensionAPI) {
 				} else {
 					text += `\n${theme.fg("muted", "(no output)")}`;
 				}
+				if (usg) text += `\n${usg}`;
 				return new Text(text, 0, 0);
 			}
 
@@ -991,6 +1032,8 @@ export default function (pi: ExtensionAPI) {
 				const allOk = details.results.every((r) => r.exitCode === 0);
 				const icon = allOk ? theme.fg("success", "\u2713") : theme.fg("error", "\u2717");
 				const steps = details.results.map((r) => r.agent).join(" \u2192 ");
+				const total = sumUsage(details.results);
+				const totalUsg = usageLine(total);
 
 				if (expanded) {
 					const container = new Container();
@@ -999,18 +1042,19 @@ export default function (pi: ExtensionAPI) {
 					);
 					for (const r of details.results) {
 						const out = getFinalOutputText(r.messages);
+						const stepUsage = usageLine(r.usage);
+						const stepUsg = stepUsage ? theme.fg("dim", stepUsage) : "";
+						const label = `${getStatusText(r)} ${theme.fg("accent", r.agent)}${r.model ? theme.fg("muted", ` \u00B7 ${r.model}`) : ""}${stepUsg ? "  " + stepUsg : ""}`;
 						if (out) {
 							container.addChild(new Spacer(1));
-							container.addChild(
-								new Text(
-									`${getStatusText(r)} ${theme.fg("accent", r.agent)}${r.model ? theme.fg("muted", ` \u00B7 ${r.model}`) : ""}`,
-									0,
-									0,
-								),
-							);
+							container.addChild(new Text(label, 0, 0));
 							container.addChild(new Markdown(out.trim(), 0, 0, mdTheme));
 						}
 					}
+					if (totalUsg && details.results.length > 1) {
+						container.addChild(new Spacer(1));
+						container.addChild(new Text(totalUsg, 0, 0));
+					}
 					return container;
 				}
 
@@ -1023,6 +1067,7 @@ export default function (pi: ExtensionAPI) {
 				} else {
 					text += `\n${theme.fg("muted", "(no output)")}`;
 				}
+				if (totalUsg) text += `\n${totalUsg}`;
 				return new Text(text, 0, 0);
 			}
 
@@ -1039,6 +1084,8 @@ export default function (pi: ExtensionAPI) {
 
 				if (expanded && running === 0) {
 					const container = new Container();
+					const total = sumUsage(details.results);
+					const totalUsg = usageLine(total);
 					container.addChild(
 						new Text(
 							`${icon} ${theme.fg("accent", `${done} tasks`)}`,
@@ -1048,11 +1095,13 @@ export default function (pi: ExtensionAPI) {
 					);
 					for (const r of details.results) {
 						const out = getFinalOutputText(r.messages);
+						const stepUsage = usageLine(r.usage);
+						const stepUsg = stepUsage ? theme.fg("dim", stepUsage) : "";
 						if (out) {
 							container.addChild(new Spacer(1));
 							container.addChild(
 								new Text(
-									`${getStatusText(r)} ${theme.fg("accent", r.agent)}`,
+									`${getStatusText(r)} ${theme.fg("accent", r.agent)}${stepUsg ? "  " + stepUsg : ""}`,
 									0,
 									0,
 								),
@@ -1060,11 +1109,19 @@ export default function (pi: ExtensionAPI) {
 							container.addChild(new Markdown(out.trim(), 0, 0, mdTheme));
 						}
 					}
+					if (totalUsg && details.results.length > 1) {
+						container.addChild(new Spacer(1));
+						container.addChild(new Text(totalUsg, 0, 0));
+					}
 					return container;
 				}
 
+				const usg = usageLine(sumUsage(details.results));
 				let text = `${icon} ${theme.fg("accent", `${done}/${details.results.length} tasks`)}`;
-				if (running === 0 && !expanded) text += theme.fg("muted", " (Ctrl+O to expand)");
+				if (running === 0) {
+					if (usg) text += `\n${usg}`;
+					if (!expanded) text += theme.fg("muted", " (Ctrl+O to expand)");
+				}
 				return new Text(text, 0, 0);
 			}
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fosterg4/pi-subagent",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "Delegate tasks to specialized subagents with isolated context windows, structured JSON handoff, contract schemas, and live TUI streaming",
   "keywords": [
     "pi-package",

package/ui.ts

@@ -0,0 +1,176 @@
+/**
+ * Claude Code-style live progress widget for subagent execution.
+ *
+ * Renders a compact overlay showing spinner + agent name + stats.
+ * Designed to be used with pi's ctx.ui.custom(…) overlay system.
+ *
+ * Usage:
+ *   const widget = new AgentWidget();
+ *   widget.addAgent("scout", "Find auth files");
+ *   const handle = ctx.ui.custom(widget, { overlay: true });
+ *   widget.updateAgent("scout", { turns: 3, tokens: 12400, elapsedMs: 4100 });
+ *   handle.close();
+ */
+
+import { Container, Spacer, Text } from "@earendil-works/pi-tui";
+import { fmt } from "./utils.ts";
+
+// ---------------------------------------------------------------------------
+// Types
+// ---------------------------------------------------------------------------
+
+export type AgentStatus = "running" | "done" | "error";
+
+export interface WidgetEntry {
+	name: string;
+	task: string;
+	status: AgentStatus;
+	turns: number;
+	tokens: number;
+	contextUsagePct?: number;
+	elapsedMs: number;
+	model?: string;
+}
+
+// ---------------------------------------------------------------------------
+// Spinner
+// ---------------------------------------------------------------------------
+
+const SPINNER_FRAMES = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
+
+// ---------------------------------------------------------------------------
+// Helpers
+// ---------------------------------------------------------------------------
+
+function formatTime(ms: number): string {
+	const s = ms / 1000;
+	if (s < 10) return `${s.toFixed(1)}s`;
+	if (s < 60) return `${Math.round(s)}s`;
+	const m = Math.floor(s / 60);
+	const sec = Math.round(s % 60);
+	return `${m}m${sec}s`;
+}
+
+function statusIcon(status: AgentStatus, frame: number): string {
+	switch (status) {
+		case "done":
+			return "✓";
+		case "error":
+			return "✗";
+		case "running":
+		default:
+			return SPINNER_FRAMES[frame % SPINNER_FRAMES.length];
+	}
+}
+
+// ---------------------------------------------------------------------------
+// Widget
+// ---------------------------------------------------------------------------
+
+export class AgentWidget {
+	private entries: WidgetEntry[] = [];
+	private frame = 0;
+	private startTimes: Map<string, number> = new Map();
+	private cachedWidth?: number;
+	private cachedLines?: string[];
+
+	addAgent(name: string, task: string): void {
+		const exists = this.entries.find((e) => e.name === name);
+		if (exists) return;
+		this.entries.push({
+			name,
+			task,
+			status: "running",
+			turns: 0,
+			tokens: 0,
+			elapsedMs: 0,
+		});
+		this.startTimes.set(name, Date.now());
+		this.invalidate();
+	}
+
+	updateAgent(name: string, update: Partial<WidgetEntry>): void {
+		const entry = this.entries.find((e) => e.name === name);
+		if (!entry) return;
+		Object.assign(entry, update);
+		entry.elapsedMs = Date.now() - (this.startTimes.get(name) ?? Date.now());
+		this.invalidate();
+	}
+
+	removeAgent(name: string): void {
+		this.entries = this.entries.filter((e) => e.name !== name);
+		this.startTimes.delete(name);
+		this.invalidate();
+	}
+
+	getAgent(name: string): WidgetEntry | undefined {
+		return this.entries.find((e) => e.name === name);
+	}
+
+	invalidate(): void {
+		this.cachedWidth = undefined;
+		this.cachedLines = undefined;
+	}
+
+	render(width: number): string[] {
+		if (this.cachedLines && this.cachedWidth === width) {
+			return this.cachedLines;
+		}
+
+		const lines: string[] = [];
+
+		if (this.entries.length === 0) {
+			this.cachedWidth = width;
+			this.cachedLines = [];
+			return [];
+		}
+
+		// Header
+		lines.push("● Agents");
+
+		for (const entry of this.entries) {
+			const icon = statusIcon(entry.status, this.frame);
+			const parts: string[] = [];
+
+			// Turns
+			if (entry.turns > 0) parts.push(`↻${entry.turns}`);
+
+			// Tokens
+			if (entry.tokens > 0) {
+				const tokStr = fmt(entry.tokens);
+				parts.push(`${tokStr} token`);
+				if (entry.contextUsagePct !== undefined && entry.contextUsagePct > 0) {
+					parts.push(`(${entry.contextUsagePct}%)`);
+				}
+			}
+
+			// Time
+			if (entry.elapsedMs > 0) parts.push(formatTime(entry.elapsedMs));
+
+			// Model
+			if (entry.model) parts.push(entry.model);
+
+			const stats = parts.length > 0 ? ` · ${parts.join(" · ")}` : "";
+
+			let line = ` ${icon} ${entry.name}${stats}`;
+			if (line.length > width) {
+				line = line.slice(0, width - 1) + "…";
+			}
+			lines.push(line);
+
+			// Activity sub-line
+			if (entry.task && entry.status === "running") {
+				const preview =
+					entry.task.length > 60
+						? `${entry.task.slice(0, 57)}…`
+						: entry.task;
+				lines.push(`  ⎿  ${preview}`);
+			}
+		}
+
+		this.frame++;
+		this.cachedWidth = width;
+		this.cachedLines = lines;
+		return lines;
+	}
+}

package/utils.ts

@@ -0,0 +1,37 @@
+/**
+ * Shared formatting helpers — testable without pi runtime deps
+ */
+
+import type { UsageStats } from "./index.ts";
+
+export function fmt(n: number): string {
+	if (n < 1000) return n.toString();
+	if (n < 10000) return (n / 1000).toFixed(1) + "k";
+	if (n < 1000000) return Math.round(n / 1000) + "k";
+	return (n / 1000000).toFixed(1) + "M";
+}
+
+export function usageLine(u: UsageStats): string {
+	const parts: string[] = [];
+	if (u.input) parts.push("\u2191" + fmt(u.input));
+	if (u.output) parts.push("\u2193" + fmt(u.output));
+	if (u.cacheRead) {
+		parts.push("R" + fmt(u.cacheRead));
+		const total = u.input + u.cacheRead;
+		if (total > 0) parts.push("CH" + ((u.cacheRead / total) * 100).toFixed(1) + "%");
+	}
+	if (u.cost) parts.push("$" + u.cost.toFixed(4));
+	return parts.join(" ");
+}
+
+export function sumUsage(results: ReadonlyArray<{ usage: UsageStats }>): UsageStats {
+	const u: UsageStats = { input: 0, output: 0, cacheRead: 0, cacheWrite: 0, cost: 0, contextTokens: 0, turns: 0 };
+	for (const r of results) {
+		u.input += r.usage.input;
+		u.output += r.usage.output;
+		u.cacheRead += r.usage.cacheRead;
+		u.cacheWrite += r.usage.cacheWrite;
+		u.cost += r.usage.cost;
+	}
+	return u;
+}