@oh-my-pi/pi-coding-agent 3.14.0 → 3.15.0

package/src/core/tools/web-search/render.ts

@@ -10,17 +10,11 @@ import type { Theme } from "../../../modes/interactive/theme/theme";
 import type { RenderResultOptions } from "../../custom-tools/types";
 import type { WebSearchResponse } from "./types";
 
-// Tree formatting constants
-const TREE_MID = "├─";
-const TREE_END = "└─";
-const TREE_PIPE = "│";
-const TREE_SPACE = " ";
-const TREE_HOOK = "⎿";
-
 /** Truncate text to max length with ellipsis */
-export function truncate(text: string, maxLen: number): string {
+export function truncate(text: string, maxLen: number, ellipsis: string): string {
 	if (text.length <= maxLen) return text;
-	return `${text.slice(0, maxLen - 1)}…`;
+	const sliceLen = Math.max(0, maxLen - ellipsis.length);
+	return `${text.slice(0, sliceLen)}${ellipsis}`;
 }
 
 /** Extract domain from URL */
@@ -51,9 +45,55 @@ export function formatAge(ageSeconds: number | null | undefined): string {
 }
 
 /** Get first N lines of text as preview */
-export function getPreviewLines(text: string, maxLines: number, maxLineLen: number): string[] {
+export function getPreviewLines(text: string, maxLines: number, maxLineLen: number, ellipsis: string): string[] {
 	const lines = text.split("\n").filter((l) => l.trim());
-	return lines.slice(0, maxLines).map((l) => truncate(l.trim(), maxLineLen));
+	return lines.slice(0, maxLines).map((l) => truncate(l.trim(), maxLineLen, ellipsis));
+}
+
+const MAX_COLLAPSED_ANSWER_LINES = 3;
+const MAX_EXPANDED_ANSWER_LINES = 12;
+const MAX_ANSWER_LINE_LEN = 110;
+const MAX_SNIPPET_LINES = 2;
+const MAX_SNIPPET_LINE_LEN = 110;
+const MAX_RELATED_QUESTIONS = 6;
+const MAX_QUERY_PREVIEW = 2;
+const MAX_QUERY_LEN = 90;
+const MAX_REQUEST_ID_LEN = 36;
+
+function formatCount(label: string, count: number): string {
+	const safeCount = Number.isFinite(count) ? count : 0;
+	return `${safeCount} ${label}${safeCount === 1 ? "" : "s"}`;
+}
+
+function renderFallbackText(contentText: string, expanded: boolean, theme: Theme): Component {
+	const lines = contentText.split("\n").filter((line) => line.trim());
+	const maxLines = expanded ? lines.length : 6;
+	const displayLines = lines.slice(0, maxLines).map((line) => truncate(line.trim(), 110, theme.format.ellipsis));
+	const remaining = lines.length - displayLines.length;
+
+	const headerIcon = theme.fg("warning", theme.status.warning);
+	const expandHint = expanded ? "" : theme.fg("dim", " (Ctrl+O to expand)");
+	let text = `${headerIcon} ${theme.fg("toolTitle", "Web Search")}${expandHint}`;
+
+	if (displayLines.length === 0) {
+		text += `\n ${theme.fg("dim", theme.tree.last)} ${theme.fg("muted", "No response data")}`;
+		return new Text(text, 0, 0);
+	}
+
+	for (let i = 0; i < displayLines.length; i++) {
+		const isLast = i === displayLines.length - 1 && remaining === 0;
+		const branch = isLast ? theme.tree.last : theme.tree.branch;
+		text += `\n ${theme.fg("dim", branch)} ${theme.fg("dim", displayLines[i])}`;
+	}
+
+	if (!expanded && remaining > 0) {
+		text += `\n ${theme.fg("dim", theme.tree.last)} ${theme.fg(
+			"muted",
+			`${theme.format.ellipsis} ${remaining} more line${remaining === 1 ? "" : "s"}`,
+		)}`;
+	}
+
+	return new Text(text, 0, 0);
 }
 
 export interface WebSearchRenderDetails {
@@ -75,95 +115,245 @@ export function renderWebSearchResult(
 		return new Text(theme.fg("error", `Error: ${details.error}`), 0, 0);
 	}
 
+	const rawText = result.content?.find((block) => block.type === "text")?.text?.trim() ?? "";
 	const response = details?.response;
 	if (!response) {
-		return new Text(theme.fg("error", "No response data"), 0, 0);
+		return renderFallbackText(rawText, expanded, theme);
 	}
 
-	const sources = response.sources ?? [];
+	const sources = Array.isArray(response.sources) ? response.sources : [];
 	const sourceCount = sources.length;
-	const _modelName = response.model ?? response.provider;
+	const citations = Array.isArray(response.citations) ? response.citations : [];
+	const citationCount = citations.length;
+	const related = Array.isArray(response.relatedQuestions)
+		? response.relatedQuestions.filter((item) => typeof item === "string")
+		: [];
+	const relatedCount = related.length;
+	const searchQueries = Array.isArray(response.searchQueries)
+		? response.searchQueries.filter((item) => typeof item === "string")
+		: [];
 	const provider = response.provider;
 
-	// Build header: ● Web Search (provider/model) · N sources
-	const icon = sourceCount > 0 ? theme.fg("success", "●") : theme.fg("warning", "●");
+	// Build header: status icon Web Search (provider) · counts
+	const providerLabel =
+		provider === "anthropic"
+			? "Anthropic"
+			: provider === "perplexity"
+				? "Perplexity"
+				: provider === "exa"
+					? "Exa"
+					: "Unknown";
+	const headerIcon =
+		sourceCount > 0 ? theme.fg("success", theme.status.success) : theme.fg("warning", theme.status.warning);
 	const expandHint = expanded ? "" : theme.fg("dim", " (Ctrl+O to expand)");
-	const providerLabel = provider === "anthropic" ? "Anthropic" : "Perplexity";
-	let text = `${icon} ${theme.fg("toolTitle", "Web Search")} ${theme.fg("dim", `(${providerLabel})`)} · ${theme.fg(
+	let text = `${headerIcon} ${theme.fg("toolTitle", "Web Search")} ${theme.fg("dim", `(${providerLabel})`)}${theme.sep.dot}${theme.fg(
 		"dim",
-		`${sourceCount} source${sourceCount !== 1 ? "s" : ""}`,
+		formatCount("source", sourceCount),
 	)}${expandHint}`;
 
 	// Get answer text
-	const contentText = response.answer ?? result.content[0]?.text ?? "";
+	const answerText = typeof response.answer === "string" ? response.answer.trim() : "";
+	const contentText = answerText || rawText;
+	const totalAnswerLines = contentText ? contentText.split("\n").filter((l) => l.trim()).length : 0;
+	const answerLimit = expanded ? MAX_EXPANDED_ANSWER_LINES : MAX_COLLAPSED_ANSWER_LINES;
+	const answerPreview = contentText
+		? getPreviewLines(contentText, answerLimit, MAX_ANSWER_LINE_LEN, theme.format.ellipsis)
+		: [];
 
 	if (!expanded) {
-		// Collapsed view: show 2-3 preview lines of answer
-		const previewLines = getPreviewLines(contentText, 3, 100);
-		for (const line of previewLines) {
-			text += `\n ${theme.fg("dim", TREE_PIPE)}  ${theme.fg("dim", line)}`;
-		}
-		const totalLines = contentText.split("\n").filter((l) => l.trim()).length;
-		if (totalLines > 3) {
-			text += `\n ${theme.fg("dim", TREE_PIPE)}  ${theme.fg("muted", `… ${totalLines - 3} more lines`)}`;
-		}
+		const answerTitle = `${theme.fg("accent", theme.status.info)} ${theme.fg("accent", "Answer")}`;
+		text += `\n ${theme.fg("dim", theme.tree.vertical)} ${answerTitle}`;
 
-		// Show source count summary
-		if (sourceCount > 0) {
-			text += `\n ${theme.fg("dim", TREE_END)} ${theme.fg(
+		if (answerPreview.length === 0) {
+			text += `\n ${theme.fg("dim", theme.tree.vertical)} ${theme.fg("dim", `${theme.tree.hook} `)}${theme.fg(
 				"muted",
-				`${sourceCount} source${sourceCount !== 1 ? "s" : ""}`,
+				"No answer text returned",
 			)}`;
+		} else {
+			for (const line of answerPreview) {
+				text += `\n ${theme.fg("dim", theme.tree.vertical)} ${theme.fg("dim", `${theme.tree.hook} `)}${theme.fg(
+					"dim",
+					line,
+				)}`;
+			}
 		}
-	} else {
-		// Expanded view: full answer + source tree
-		const answerLines = contentText.split("\n");
-		for (const line of answerLines) {
-			text += `\n ${theme.fg("dim", TREE_PIPE)}  ${line}`;
+
+		const remaining = totalAnswerLines - answerPreview.length;
+		if (remaining > 0) {
+			text += `\n ${theme.fg("dim", theme.tree.vertical)} ${theme.fg("dim", `${theme.tree.hook} `)}${theme.fg(
+				"muted",
+				`${theme.format.ellipsis} ${remaining} more line${remaining === 1 ? "" : "s"}`,
+			)}`;
 		}
 
-		// Render sources as tree
-		const hasRelatedQuestions = response.relatedQuestions && response.relatedQuestions.length > 0;
+		const summary = [
+			formatCount("source", sourceCount),
+			formatCount("citation", citationCount),
+			formatCount("related", relatedCount),
+		].join(theme.sep.dot);
+		text += `\n ${theme.fg("dim", theme.tree.last)} ${theme.fg("muted", summary)}`;
+		return new Text(text, 0, 0);
+	}
 
-		if (sourceCount > 0) {
-			text += `\n ${theme.fg("dim", TREE_PIPE)}`;
-			const sourcesBranch = hasRelatedQuestions ? TREE_MID : TREE_END;
-			text += `\n ${theme.fg("dim", sourcesBranch)} ${theme.fg("accent", "Sources")}`;
+	const answerLines = answerPreview.length > 0 ? answerPreview : ["No answer text returned"];
+	const answerSectionLines = answerLines.map((line) =>
+		line === "No answer text returned" ? theme.fg("muted", line) : theme.fg("text", line),
+	);
+	const remainingAnswer = totalAnswerLines - answerPreview.length;
+	if (remainingAnswer > 0) {
+		answerSectionLines.push(
+			theme.fg("muted", `${theme.format.ellipsis} ${remainingAnswer} more line${remainingAnswer === 1 ? "" : "s"}`),
+		);
+	}
 
-			for (let i = 0; i < sources.length; i++) {
-				const src = sources[i];
-				const isLast = i === sources.length - 1;
-				const branch = isLast ? TREE_END : TREE_MID;
-				const cont = isLast ? TREE_SPACE : TREE_PIPE;
-				const indent = hasRelatedQuestions ? TREE_PIPE : TREE_SPACE;
+	const sourceLines: string[] = [];
+	if (sourceCount === 0) {
+		sourceLines.push(theme.fg("muted", "No sources returned"));
+	} else {
+		for (const src of sources) {
+			const titleText =
+				typeof src.title === "string" && src.title.trim()
+					? src.title
+					: typeof src.url === "string" && src.url.trim()
+						? src.url
+						: "Untitled";
+			const title = truncate(titleText, 70, theme.format.ellipsis);
+			const url = typeof src.url === "string" ? src.url : "";
+			const domain = url ? getDomain(url) : "";
+			const age = formatAge(src.ageSeconds) || (typeof src.publishedDate === "string" ? src.publishedDate : "");
+			const metaParts: string[] = [];
+			if (domain) {
+				metaParts.push(theme.fg("dim", `(${domain})`));
+			}
+			if (typeof src.author === "string" && src.author.trim()) {
+				metaParts.push(theme.fg("muted", src.author));
+			}
+			if (age) {
+				metaParts.push(theme.fg("muted", age));
+			}
+			const metaSep = theme.fg("dim", theme.sep.dot);
+			const metaSuffix = metaParts.length > 0 ? ` ${metaParts.join(metaSep)}` : "";
+			sourceLines.push(`${theme.fg("accent", title)}${metaSuffix}`);
 
-				// Title + domain + age
-				const title = truncate(src.title, 60);
-				const domain = getDomain(src.url);
-				const age = formatAge(src.ageSeconds) || src.publishedDate;
-				const agePart = age ? theme.fg("muted", ` · ${age}`) : "";
+			const snippetText = typeof src.snippet === "string" ? src.snippet : "";
+			if (snippetText.trim()) {
+				const snippetLines = getPreviewLines(
+					snippetText,
+					MAX_SNIPPET_LINES,
+					MAX_SNIPPET_LINE_LEN,
+					theme.format.ellipsis,
+				);
+				for (const snippetLine of snippetLines) {
+					sourceLines.push(theme.fg("muted", `${theme.format.dash} ${snippetLine}`));
+				}
+			}
 
-				text += `\n ${theme.fg("dim", indent)} ${theme.fg("dim", branch)} ${theme.fg("accent", title)} ${theme.fg(
-					"dim",
-					`(${domain})`,
-				)}${agePart}`;
-				text += `\n ${theme.fg("dim", indent)} ${theme.fg("dim", `${cont}  ${TREE_HOOK} `)}${theme.fg(
-					"mdLinkUrl",
-					src.url,
-				)}`;
+			if (url) {
+				sourceLines.push(theme.fg("mdLinkUrl", url));
 			}
 		}
+	}
 
-		// Render related questions (Perplexity only)
-		if (hasRelatedQuestions) {
-			text += `\n ${theme.fg("dim", TREE_END)} ${theme.fg("accent", "Related Questions")}`;
-			const questions = response.relatedQuestions!;
-			for (let i = 0; i < questions.length; i++) {
-				const question = questions[i];
-				const isLast = i === questions.length - 1;
-				const branch = isLast ? TREE_END : TREE_MID;
-				text += `\n ${theme.fg("dim", TREE_SPACE)} ${theme.fg("dim", branch)} ${theme.fg("muted", question)}`;
-			}
+	const relatedLines: string[] = [];
+	if (relatedCount === 0) {
+		relatedLines.push(theme.fg("muted", "No related questions"));
+	} else {
+		const maxRelated = Math.min(MAX_RELATED_QUESTIONS, related.length);
+		for (let i = 0; i < maxRelated; i++) {
+			relatedLines.push(theme.fg("muted", `${theme.format.dash} ${related[i]}`));
+		}
+		if (relatedCount > maxRelated) {
+			relatedLines.push(
+				theme.fg(
+					"muted",
+					`${theme.format.ellipsis} ${relatedCount - maxRelated} more question${
+						relatedCount - maxRelated === 1 ? "" : "s"
+					}`,
+				),
+			);
+		}
+	}
+
+	const metaLines: string[] = [];
+	metaLines.push(`${theme.fg("muted", "Provider:")} ${theme.fg("text", providerLabel)}`);
+	if (response.model) {
+		metaLines.push(`${theme.fg("muted", "Model:")} ${theme.fg("text", response.model)}`);
+	}
+	metaLines.push(`${theme.fg("muted", "Sources:")} ${theme.fg("text", String(sourceCount))}`);
+	if (citationCount > 0) {
+		metaLines.push(`${theme.fg("muted", "Citations:")} ${theme.fg("text", String(citationCount))}`);
+	}
+	if (relatedCount > 0) {
+		metaLines.push(`${theme.fg("muted", "Related:")} ${theme.fg("text", String(relatedCount))}`);
+	}
+	if (response.usage) {
+		const usageParts: string[] = [];
+		if (response.usage.inputTokens !== undefined) usageParts.push(`in ${response.usage.inputTokens}`);
+		if (response.usage.outputTokens !== undefined) usageParts.push(`out ${response.usage.outputTokens}`);
+		if (response.usage.totalTokens !== undefined) usageParts.push(`total ${response.usage.totalTokens}`);
+		if (response.usage.searchRequests !== undefined) usageParts.push(`search ${response.usage.searchRequests}`);
+		if (usageParts.length > 0) {
+			metaLines.push(`${theme.fg("muted", "Usage:")} ${theme.fg("text", usageParts.join(theme.sep.dot))}`);
+		}
+	}
+	if (response.requestId) {
+		metaLines.push(
+			`${theme.fg("muted", "Request:")} ${theme.fg(
+				"text",
+				truncate(response.requestId, MAX_REQUEST_ID_LEN, theme.format.ellipsis),
+			)}`,
+		);
+	}
+	if (searchQueries.length > 0) {
+		metaLines.push(`${theme.fg("muted", "Search queries:")} ${theme.fg("text", String(searchQueries.length))}`);
+		const queryPreview = searchQueries.slice(0, MAX_QUERY_PREVIEW);
+		for (const q of queryPreview) {
+			metaLines.push(theme.fg("muted", `${theme.format.dash} ${truncate(q, MAX_QUERY_LEN, theme.format.ellipsis)}`));
+		}
+		if (searchQueries.length > MAX_QUERY_PREVIEW) {
+			metaLines.push(
+				theme.fg(
+					"muted",
+					`${theme.format.ellipsis} ${searchQueries.length - MAX_QUERY_PREVIEW} more query${
+						searchQueries.length - MAX_QUERY_PREVIEW === 1 ? "" : "s"
+					}`,
+				),
+			);
+		}
+	}
+
+	const sections: Array<{ title: string; icon: string; lines: string[] }> = [
+		{
+			title: "Answer",
+			icon: theme.fg("accent", theme.status.info),
+			lines: answerSectionLines,
+		},
+		{
+			title: "Sources",
+			icon: sourceCount > 0 ? theme.fg("success", theme.status.success) : theme.fg("warning", theme.status.warning),
+			lines: sourceLines,
+		},
+		{
+			title: "Related",
+			icon: relatedCount > 0 ? theme.fg("accent", theme.status.info) : theme.fg("warning", theme.status.warning),
+			lines: relatedLines,
+		},
+		{
+			title: "Meta",
+			icon: theme.fg("accent", theme.status.info),
+			lines: metaLines,
+		},
+	];
+
+	for (let i = 0; i < sections.length; i++) {
+		const section = sections[i];
+		const isLast = i === sections.length - 1;
+		const branch = isLast ? theme.tree.last : theme.tree.branch;
+		const indent = isLast ? " " : theme.tree.vertical;
+
+		text += `\n ${theme.fg("dim", branch)} ${section.icon} ${theme.fg("accent", section.title)}`;
+		for (const line of section.lines) {
+			text += `\n ${theme.fg("dim", indent)} ${theme.fg("dim", `${theme.tree.hook} `)}${line}`;
 		}
 	}
 
@@ -176,7 +366,7 @@ export function renderWebSearchCall(
 	theme: Theme,
 ): Component {
 	const provider = args.provider ?? "auto";
-	const query = truncate(args.query, 80);
+	const query = truncate(args.query, 80, theme.format.ellipsis);
 	const text = `${theme.fg("toolTitle", "Web Search")} ${theme.fg("dim", `(${provider})`)} ${theme.fg("muted", query)}`;
 	return new Text(text, 0, 0);
 }

package/src/core/tools/write.ts

@@ -1,5 +1,6 @@
 import type { AgentTool } from "@oh-my-pi/pi-agent-core";
 import { Type } from "@sinclair/typebox";
+import writeDescription from "../../prompts/tools/write.md" with { type: "text" };
 import { type FileDiagnosticsResult, type WritethroughCallback, writethroughNoop } from "./lsp/index";
 import { resolveToCwd } from "./path-utils";
 
@@ -26,14 +27,7 @@ export function createWriteTool(
 	return {
 		name: "write",
 		label: "Write",
-		description: `Writes a file to the local filesystem.
-
-Usage:
-- This tool will overwrite the existing file if there is one at the provided path.
-- If this is an existing file, you MUST use the read tool first to read the file's contents. This tool will fail if you did not read the file first.
-- ALWAYS prefer editing existing files in the codebase. NEVER write new files unless explicitly required.
-- NEVER proactively create documentation files (*.md) or README files. Only create documentation files if explicitly requested by the User.
-- Only use emojis if the user explicitly requests it. Avoid writing emojis to files unless asked.`,
+		description: writeDescription,
 		parameters: writeSchema,
 		execute: async (
 			_toolCallId: string,

package/src/main.ts

@@ -176,15 +176,15 @@ function getChangelogForDisplay(parsed: Args, settingsManager: SettingsManager):
 	return undefined;
 }
 
-function createSessionManager(parsed: Args, cwd: string): SessionManager | undefined {
+async function createSessionManager(parsed: Args, cwd: string): Promise<SessionManager | undefined> {
 	if (parsed.noSession) {
 		return SessionManager.inMemory();
 	}
 	if (parsed.session) {
-		return SessionManager.open(parsed.session, parsed.sessionDir);
+		return await SessionManager.open(parsed.session, parsed.sessionDir);
 	}
 	if (parsed.continue) {
-		return SessionManager.continueRecent(cwd, parsed.sessionDir);
+		return await SessionManager.continueRecent(cwd, parsed.sessionDir);
 	}
 	// --resume is handled separately (needs picker UI)
 	// If --session-dir provided without --continue/--resume, create new session there
@@ -294,6 +294,10 @@ async function buildSessionOptions(
 export async function main(args: string[]) {
 	time("start");
 
+	// Initialize theme early with defaults (CLI commands need symbols)
+	// Will be re-initialized with user preferences later
+	initTheme();
+
 	// Handle plugin subcommand before regular parsing
 	const pluginCmd = parsePluginArgs(args);
 	if (pluginCmd) {
@@ -385,7 +389,7 @@ export async function main(args: string[]) {
 		settingsManager.applyOverrides({ modelRoles: roleOverrides });
 	}
 
-	initTheme(settingsManager.getTheme(), isInteractive);
+	initTheme(settingsManager.getTheme(), isInteractive, settingsManager.getSymbolPreset());
 	time("initTheme");
 
 	let scopedModels: ScopedModel[] = [];
@@ -396,7 +400,7 @@ export async function main(args: string[]) {
 	}
 
 	// Create session manager based on CLI flags
-	let sessionManager = createSessionManager(parsed, cwd);
+	let sessionManager = await createSessionManager(parsed, cwd);
 	time("createSessionManager");
 
 	// Handle --resume: show session picker
@@ -413,7 +417,7 @@ export async function main(args: string[]) {
 			console.log(chalk.dim("No session selected"));
 			return;
 		}
-		sessionManager = SessionManager.open(selectedPath);
+		sessionManager = await SessionManager.open(selectedPath);
 	}
 
 	const sessionOptions = await buildSessionOptions(parsed, scopedModels, sessionManager, modelRegistry);

package/src/modes/cleanup.ts

@@ -0,0 +1,23 @@
+/**
+ * Async cleanup registry for graceful shutdown on signals.
+ */
+
+/** Registry of async cleanup callbacks to run on shutdown/signals */
+const asyncCleanupCallbacks: (() => Promise<void>)[] = [];
+
+/**
+ * Register an async cleanup callback to be run on process signals (SIGINT, SIGTERM, SIGHUP).
+ * Returns an unsubscribe function.
+ */
+export function registerAsyncCleanup(callback: () => Promise<void>): () => void {
+	asyncCleanupCallbacks.push(callback);
+	return () => {
+		const index = asyncCleanupCallbacks.indexOf(callback);
+		if (index >= 0) asyncCleanupCallbacks.splice(index, 1);
+	};
+}
+
+/** Run all registered async cleanup callbacks, settling all promises */
+export async function runAsyncCleanup(): Promise<void> {
+	await Promise.allSettled(asyncCleanupCallbacks.map((cb) => cb()));
+}

package/src/modes/index.ts

@@ -3,6 +3,7 @@
  */
 
 import { emergencyTerminalRestore } from "@oh-my-pi/pi-tui";
+import { runAsyncCleanup } from "./cleanup";
 
 /**
  * Install handlers that restore terminal state on crash/signal.
@@ -13,17 +14,21 @@ export function installTerminalCrashHandlers(): void {
 		emergencyTerminalRestore();
 	};
 
-	// Signals
+	// Signals - run async cleanup before exit
+	process.on("SIGINT", () => {
+		cleanup();
+		void runAsyncCleanup().finally(() => process.exit(128 + 2));
+	});
 	process.on("SIGTERM", () => {
 		cleanup();
-		process.exit(128 + 15);
+		void runAsyncCleanup().finally(() => process.exit(128 + 15));
 	});
 	process.on("SIGHUP", () => {
 		cleanup();
-		process.exit(128 + 1);
+		void runAsyncCleanup().finally(() => process.exit(128 + 1));
 	});
 
-	// Crashes
+	// Crashes - exit immediately (async cleanup may not be safe in corrupted state)
 	process.on("uncaughtException", (err) => {
 		cleanup();
 		console.error("Uncaught exception:", err);

package/src/modes/interactive/components/bash-execution.ts

@@ -10,7 +10,7 @@ import {
 	type TruncationResult,
 	truncateTail,
 } from "../../../core/tools/truncate";
-import { theme } from "../theme/theme";
+import { getSymbolTheme, theme } from "../theme/theme";
 import { DynamicBorder } from "./dynamic-border";
 import { truncateToVisualLines } from "./visual-truncate";
 
@@ -55,7 +55,8 @@ export class BashExecutionComponent extends Container {
 			ui,
 			(spinner) => theme.fg("bashMode", spinner),
 			(text) => theme.fg("muted", text),
-			"Running... (esc to cancel)",
+			`Running${theme.format.ellipsis} (esc to cancel)`,
+			getSymbolTheme().spinnerFrames,
 		);
 		this.contentContainer.addChild(this.loader);
 
@@ -159,7 +160,9 @@ export class BashExecutionComponent extends Container {
 
 			// Show how many lines are hidden (collapsed preview)
 			if (hiddenLineCount > 0) {
-				statusParts.push(theme.fg("dim", `... ${hiddenLineCount} more lines (ctrl+o to expand)`));
+				statusParts.push(
+					theme.fg("dim", `${theme.format.ellipsis} ${hiddenLineCount} more lines (ctrl+o to expand)`),
+				);
 			}
 
 			if (this.status === "cancelled") {

package/src/modes/interactive/components/branch-summary-message.ts

@@ -24,7 +24,7 @@ export class BranchSummaryMessageComponent extends Box {
 	private updateDisplay(): void {
 		this.clear();
 
-		const label = theme.fg("customMessageLabel", `\x1b[1m[branch]\x1b[22m`);
+		const label = theme.fg("customMessageLabel", theme.bold("[branch]"));
 		this.addChild(new Text(label, 0, 0));
 		this.addChild(new Spacer(1));
 

package/src/modes/interactive/components/compaction-summary-message.ts

@@ -25,7 +25,7 @@ export class CompactionSummaryMessageComponent extends Box {
 		this.clear();
 
 		const tokenStr = this.message.tokensBefore.toLocaleString();
-		const label = theme.fg("customMessageLabel", `\x1b[1m[compaction]\x1b[22m`);
+		const label = theme.fg("customMessageLabel", theme.bold("[compaction]"));
 		this.addChild(new Text(label, 0, 0));
 		this.addChild(new Spacer(1));
 

package/src/modes/interactive/components/dynamic-border.ts

@@ -20,6 +20,6 @@ export class DynamicBorder implements Component {
 	}
 
 	render(width: number): string[] {
-		return [this.color("─".repeat(Math.max(1, width)))];
+		return [this.color(theme.boxSharp.horizontal.repeat(Math.max(1, width)))];
 	}
 }

package/src/modes/interactive/components/extensions/extension-dashboard.ts

@@ -117,18 +117,17 @@ export class ExtensionDashboard extends Container {
 				label += ` (${tab.count})`;
 			}
 
-			// Apply strikethrough for disabled providers
-			const displayLabel = isDisabled ? `${label.split("").join("\u0336")}\u0336` : label;
+			const displayLabel = isDisabled ? `${theme.status.disabled} ${label}` : label;
 
 			if (isActive) {
 				// Active tab: background highlight
 				parts.push(theme.bg("selectedBg", ` ${displayLabel} `));
 			} else if (isDisabled) {
-				// Disabled provider: strikethrough + dim
+				// Disabled provider: dim
 				parts.push(theme.fg("dim", ` ${displayLabel} `));
 			} else if (isEmpty) {
 				// Empty enabled provider: very dim, unselectable
-				parts.push(`\x1b[38;5;238m ${label} \x1b[0m`);
+				parts.push(theme.fg("dim", ` ${label} `));
 			} else {
 				// Normal enabled provider
 				parts.push(theme.fg("muted", ` ${label} `));
@@ -278,7 +277,7 @@ class TwoColumnBody implements Component {
 
 		const maxLines = Math.max(leftLines.length, rightLines.length);
 		const combined: string[] = [];
-		const separator = theme.fg("dim", " │ ");
+		const separator = theme.fg("dim", ` ${theme.boxSharp.vertical} `);
 
 		for (let i = 0; i < maxLines; i++) {
 			const left = truncateToWidth(leftLines[i] ?? "", leftWidth);