@oh-my-pi/pi-coding-agent 8.0.20 → 8.2.0

package/src/tools/read.ts

@@ -1,27 +1,28 @@
-import { homedir } from "node:os";
+import * as os from "node:os";
 import path from "node:path";
 import type { AgentTool, AgentToolContext, AgentToolResult, AgentToolUpdateCallback } from "@oh-my-pi/pi-agent-core";
 import type { ImageContent, TextContent } from "@oh-my-pi/pi-ai";
-import { CONFIG_DIR_NAME } from "@oh-my-pi/pi-coding-agent/config";
-import { renderPromptTemplate } from "@oh-my-pi/pi-coding-agent/config/prompt-templates";
-import type { RenderResultOptions } from "@oh-my-pi/pi-coding-agent/extensibility/custom-tools/types";
-import type { Theme } from "@oh-my-pi/pi-coding-agent/modes/theme/theme";
-import readDescription from "@oh-my-pi/pi-coding-agent/prompts/tools/read.md" with { type: "text" };
-import type { ToolSession } from "@oh-my-pi/pi-coding-agent/sdk";
-import type { OutputMeta } from "@oh-my-pi/pi-coding-agent/tools/output-meta";
-import { ToolAbortError, ToolError, throwIfAborted } from "@oh-my-pi/pi-coding-agent/tools/tool-errors";
-import { formatDimensionNote, resizeImage } from "@oh-my-pi/pi-coding-agent/utils/image-resize";
-import { detectSupportedImageMimeTypeFromFile } from "@oh-my-pi/pi-coding-agent/utils/mime";
-import { ensureTool } from "@oh-my-pi/pi-coding-agent/utils/tools-manager";
 import type { Component } from "@oh-my-pi/pi-tui";
 import { Text } from "@oh-my-pi/pi-tui";
 import { ptree } from "@oh-my-pi/pi-utils";
 import { Type } from "@sinclair/typebox";
+import { CONFIG_DIR_NAME } from "../config";
+import { renderPromptTemplate } from "../config/prompt-templates";
+import type { RenderResultOptions } from "../extensibility/custom-tools/types";
+import { getLanguageFromPath, type Theme } from "../modes/theme/theme";
+import readDescription from "../prompts/tools/read.md" with { type: "text" };
+import type { ToolSession } from "../sdk";
+import { renderCodeCell, renderOutputBlock, renderStatusLine } from "../tui";
+import { formatDimensionNote, resizeImage } from "../utils/image-resize";
+import { detectSupportedImageMimeTypeFromFile } from "../utils/mime";
+import { ensureTool } from "../utils/tools-manager";
 import { runFd } from "./find";
 import { applyListLimit } from "./list-limit";
 import { LsTool } from "./ls";
+import type { OutputMeta } from "./output-meta";
 import { resolveReadPath, resolveToCwd } from "./path-utils";
 import { shortenPath, wrapBrackets } from "./render-utils";
+import { ToolAbortError, ToolError, throwIfAborted } from "./tool-errors";
 import { toolResult } from "./tool-result";
 import {
 	DEFAULT_MAX_BYTES,
@@ -36,7 +37,7 @@ import {
 const CONVERTIBLE_EXTENSIONS = new Set([".pdf", ".doc", ".docx", ".ppt", ".pptx", ".xls", ".xlsx", ".rtf", ".epub"]);
 
 // Remote mount path prefix (sshfs mounts) - skip fuzzy matching to avoid hangs
-const REMOTE_MOUNT_PREFIX = path.join(homedir(), CONFIG_DIR_NAME, "remote") + path.sep;
+const REMOTE_MOUNT_PREFIX = path.join(os.homedir(), CONFIG_DIR_NAME, "remote") + path.sep;
 
 function isRemoteMountPath(absolutePath: string): boolean {
 	return absolutePath.startsWith(REMOTE_MOUNT_PREFIX);
@@ -201,8 +202,8 @@ async function listCandidateFiles(
 		if (output) {
 			const nestedGitignores = output
 				.split("\n")
-				.map((line) => line.replace(/\r$/, "").trim())
-				.filter((line) => line.length > 0);
+				.map(line => line.replace(/\r$/, "").trim())
+				.filter(line => line.length > 0);
 			for (const file of nestedGitignores) {
 				const normalized = file.replace(/\\/g, "/");
 				if (normalized.includes("/node_modules/") || normalized.includes("/.git/")) {
@@ -237,8 +238,8 @@ async function listCandidateFiles(
 
 	const files = output
 		.split("\n")
-		.map((line) => line.replace(/\r$/, "").trim())
-		.filter((line) => line.length > 0);
+		.map(line => line.replace(/\r$/, "").trim())
+		.filter(line => line.length > 0);
 
 	return { files, truncated: files.length >= MAX_FUZZY_CANDIDATES };
 }
@@ -336,7 +337,7 @@ async function findReadPathSuggestions(
 	});
 
 	const listLimit = applyListLimit(matches, { limit: MAX_FUZZY_RESULTS });
-	const suggestions = listLimit.items.map((match) => match.path);
+	const suggestions = listLimit.items.map(match => match.path);
 
 	return { suggestions, scopeLabel, truncated };
 }
@@ -378,6 +379,7 @@ const readSchema = Type.Object({
 export interface ReadToolDetails {
 	truncation?: TruncationResult;
 	redirectedTo?: "ls";
+	resolvedPath?: string;
 	meta?: OutputMeta;
 }
 
@@ -444,7 +446,7 @@ export class ReadTool implements AgentTool<typeof readSchema, ReadToolDetails> {
 
 					if (suggestions?.suggestions.length) {
 						const scopeLabel = suggestions.scopeLabel ? ` in ${suggestions.scopeLabel}` : "";
-						message += `\n\nClosest matches${scopeLabel}:\n${suggestions.suggestions.map((match) => `- ${match}`).join("\n")}`;
+						message += `\n\nClosest matches${scopeLabel}:\n${suggestions.suggestions.map(match => `- ${match}`).join("\n")}`;
 						if (suggestions.truncated) {
 							message += `\n[Search truncated to first ${MAX_FUZZY_CANDIDATES} paths. Refine the path if the match isn't listed.]`;
 						}
@@ -708,11 +710,11 @@ export class ReadTool implements AgentTool<typeof readSchema, ReadToolDetails> {
 
 		// If extraction was used, return directly (no pagination)
 		if (hasExtraction) {
-			let text = resource.content;
+			const details: ReadToolDetails = {};
 			if (resource.sourcePath) {
-				text += `\n\n[Resolved path: ${resource.sourcePath}]`;
+				details.resolvedPath = resource.sourcePath;
 			}
-			return toolResult<ReadToolDetails>().text(text).sourceInternal(url).done();
+			return toolResult(details).text(resource.content).sourceInternal(url).done();
 		}
 
 		// Apply pagination similar to file reading
@@ -806,9 +808,8 @@ export class ReadTool implements AgentTool<typeof readSchema, ReadToolDetails> {
 			details = {};
 		}
 
-		// Append resolved path notice
 		if (resource.sourcePath) {
-			outputText += `\n\n[Resolved path: ${resource.sourcePath}]`;
+			details.resolvedPath = resource.sourcePath;
 		}
 
 		const resultBuilder = toolResult(details).text(outputText).sourceInternal(url);
@@ -837,14 +838,14 @@ export const readToolRenderer = {
 		const offset = args.offset;
 		const limit = args.limit;
 
-		let pathDisplay = filePath ? uiTheme.fg("accent", filePath) : uiTheme.fg("toolOutput", uiTheme.format.ellipsis);
+		let pathDisplay = filePath || uiTheme.format.ellipsis;
 		if (offset !== undefined || limit !== undefined) {
 			const startLine = offset ?? 1;
 			const endLine = limit !== undefined ? startLine + limit - 1 : "";
-			pathDisplay += uiTheme.fg("warning", `:${startLine}${endLine ? `-${endLine}` : ""}`);
+			pathDisplay += `:${startLine}${endLine ? `-${endLine}` : ""}`;
 		}
 
-		const text = `${uiTheme.fg("toolTitle", uiTheme.bold("Read"))} ${pathDisplay}`;
+		const text = renderStatusLine({ icon: "pending", title: "Read", description: pathDisplay }, uiTheme);
 		return new Text(text, 0, 0);
 	},
 
@@ -852,15 +853,24 @@ export const readToolRenderer = {
 		result: { content: Array<{ type: string; text?: string }>; details?: ReadToolDetails },
 		_options: RenderResultOptions,
 		uiTheme: Theme,
-		_args?: ReadRenderArgs,
+		args?: ReadRenderArgs,
 	): Component {
 		const details = result.details;
-		const lines: string[] = [];
-
-		lines.push(uiTheme.fg("dim", "Content hidden"));
+		const contentText = result.content?.find(c => c.type === "text")?.text ?? "";
+		const imageContent = result.content?.find(c => c.type === "image");
+		const rawPath = args?.file_path || args?.path || "";
+		const filePath = shortenPath(rawPath);
+		const lang = getLanguageFromPath(rawPath);
 
+		const warningLines: string[] = [];
 		const truncation = details?.meta?.truncation;
 		const fallback = details?.truncation;
+		if (details?.redirectedTo) {
+			warningLines.push(uiTheme.fg("warning", wrapBrackets(`Redirected to ${details.redirectedTo}`, uiTheme)));
+		}
+		if (details?.resolvedPath) {
+			warningLines.push(uiTheme.fg("dim", wrapBrackets(`Resolved path: ${details.resolvedPath}`, uiTheme)));
+		}
 		if (truncation) {
 			let warning: string;
 			if (fallback?.firstLineExceedsLimit) {
@@ -874,9 +884,58 @@ export const readToolRenderer = {
 			if (truncation.artifactId) {
 				warning += `. Full output: artifact://${truncation.artifactId}`;
 			}
-			lines.push(uiTheme.fg("warning", wrapBrackets(warning, uiTheme)));
+			warningLines.push(uiTheme.fg("warning", wrapBrackets(warning, uiTheme)));
 		}
 
-		return new Text(lines.join("\n"), 0, 0);
+		if (imageContent) {
+			const header = renderStatusLine(
+				{ icon: "success", title: "Read", description: filePath || rawPath || "image" },
+				uiTheme,
+			);
+			const detailLines = contentText ? contentText.split("\n").map(line => uiTheme.fg("toolOutput", line)) : [];
+			const lines = [...detailLines, ...warningLines];
+			return {
+				render: (width: number) =>
+					renderOutputBlock(
+						{
+							header,
+							state: "success",
+							sections: [
+								{
+									label: uiTheme.fg("toolTitle", "Details"),
+									lines: lines.length > 0 ? lines : [uiTheme.fg("dim", "(image)")],
+								},
+							],
+							width,
+						},
+						uiTheme,
+					),
+				invalidate: () => {},
+			};
+		}
+
+		let title = filePath ? `Read ${filePath}` : "Read";
+		if (args?.offset !== undefined || args?.limit !== undefined) {
+			const startLine = args.offset ?? 1;
+			const endLine = args.limit !== undefined ? startLine + args.limit - 1 : "";
+			title += `:${startLine}${endLine ? `-${endLine}` : ""}`;
+		}
+		return {
+			render: (width: number) =>
+				renderCodeCell(
+					{
+						code: contentText,
+						language: lang,
+						title,
+						status: "complete",
+						output: warningLines.length > 0 ? warningLines.join("\n") : undefined,
+						expanded: true,
+						width,
+					},
+					uiTheme,
+				),
+			invalidate: () => {},
+		};
 	},
+	mergeCallAndResult: true,
 };

package/src/tools/render-utils.ts

@@ -4,9 +4,9 @@
  * Provides consistent formatting, truncation, and display patterns across all
  * tool renderers to ensure a unified TUI experience.
  */
-
-import { homedir } from "node:os";
-import type { Theme } from "@oh-my-pi/pi-coding-agent/modes/theme/theme";
+import * as os from "node:os";
+import type { Theme } from "../modes/theme/theme";
+import { getTreeBranch } from "../tui/utils";
 
 // =============================================================================
 // Standardized Display Constants
@@ -61,8 +61,8 @@ export function truncate(text: string, maxLen: number, ellipsis: string): string
  * Get first N lines of text as preview, with each line truncated.
  */
 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, ellipsis));
+	const lines = text.split("\n").filter(l => l.trim());
+	return lines.slice(0, maxLines).map(l => truncate(l.trim(), maxLineLen, ellipsis));
 }
 
 // =============================================================================
@@ -553,7 +553,7 @@ export function truncateDiffByHunk(
 
 	const segments = parseDiffSegments(lines);
 
-	const changeSegments = segments.filter((s) => s.isChange);
+	const changeSegments = segments.filter(s => s.isChange);
 	const changeLineCount = changeSegments.reduce((sum, s) => sum + s.lines.length, 0);
 
 	if (changeLineCount > maxLines) {
@@ -578,7 +578,7 @@ export function truncateDiffByHunk(
 	}
 
 	const contextBudget = maxLines - changeLineCount;
-	const contextSegments = segments.filter((s) => !s.isChange && !s.isEllipsis);
+	const contextSegments = segments.filter(s => !s.isChange && !s.isEllipsis);
 	const totalContextLines = contextSegments.reduce((sum, s) => sum + s.lines.length, 0);
 
 	const kept: string[] = [];
@@ -642,7 +642,7 @@ export function truncateDiffByHunk(
 // =============================================================================
 
 export function shortenPath(filePath: string, homeDir?: string): string {
-	const home = homeDir ?? homedir();
+	const home = homeDir ?? os.homedir();
 	if (home && filePath.startsWith(home)) {
 		return `~${filePath.slice(home.length)}`;
 	}
@@ -667,21 +667,6 @@ function pluralize(label: string, count: number): string {
 // =============================================================================
 // Tree Rendering Utilities
 // =============================================================================
-
-/**
- * Get the branch character for a tree item.
- */
-export function getTreeBranch(isLast: boolean, theme: Theme): string {
-	return isLast ? theme.tree.last : theme.tree.branch;
-}
-
-/**
- * Get the continuation prefix for nested content under a tree item.
- */
-export function getTreeContinuePrefix(isLast: boolean, theme: Theme): string {
-	return isLast ? "   " : `${theme.tree.vertical}  `;
-}
-
 /**
  * Render a list of items with tree branches, handling truncation.
  *

package/src/tools/renderers.ts

@@ -3,14 +3,13 @@
  *
  * These provide rich visualization for tool calls and results in the TUI.
  */
-
-import type { RenderResultOptions } from "@oh-my-pi/pi-coding-agent/extensibility/custom-tools/types";
-import { lspToolRenderer } from "@oh-my-pi/pi-coding-agent/lsp/render";
-import type { Theme } from "@oh-my-pi/pi-coding-agent/modes/theme/theme";
-import { editToolRenderer } from "@oh-my-pi/pi-coding-agent/patch";
-import { taskToolRenderer } from "@oh-my-pi/pi-coding-agent/task/render";
-import { webSearchToolRenderer } from "@oh-my-pi/pi-coding-agent/web/search/render";
 import type { Component } from "@oh-my-pi/pi-tui";
+import type { RenderResultOptions } from "../extensibility/custom-tools/types";
+import { lspToolRenderer } from "../lsp/render";
+import type { Theme } from "../modes/theme/theme";
+import { editToolRenderer } from "../patch";
+import { taskToolRenderer } from "../task/render";
+import { webSearchToolRenderer } from "../web/search/render";
 import { askToolRenderer } from "./ask";
 import { bashToolRenderer } from "./bash";
 import { calculatorToolRenderer } from "./calculator";

package/src/tools/review.ts

@@ -5,12 +5,17 @@
  * Hidden by default - only enabled when explicitly listed in agent's tools.
  * Reviewers finish via `complete` tool with SubmitReviewDetails schema.
  */
-
+// ─────────────────────────────────────────────────────────────────────────────
+// Subprocess tool handlers - registered for extraction/rendering in task tool
+// ─────────────────────────────────────────────────────────────────────────────
+import path from "node:path";
 import type { AgentTool } from "@oh-my-pi/pi-agent-core";
-import type { Theme, ThemeColor } from "@oh-my-pi/pi-coding-agent/modes/theme/theme";
+import { StringEnum } from "@oh-my-pi/pi-ai";
 import type { Component } from "@oh-my-pi/pi-tui";
 import { Container, Text } from "@oh-my-pi/pi-tui";
 import { Type } from "@sinclair/typebox";
+import type { Theme, ThemeColor } from "../modes/theme/theme";
+import { subprocessToolRegistry } from "../task/subprocess-tool-registry";
 
 export type FindingPriority = "P0" | "P1" | "P2" | "P3";
 
@@ -145,17 +150,9 @@ export interface SubmitReviewDetails {
 // Re-export types for external use
 export type { ReportFindingDetails };
 
-// ─────────────────────────────────────────────────────────────────────────────
-// Subprocess tool handlers - registered for extraction/rendering in task tool
-// ─────────────────────────────────────────────────────────────────────────────
-
-import path from "node:path";
-import { StringEnum } from "@oh-my-pi/pi-ai";
-import { subprocessToolRegistry } from "@oh-my-pi/pi-coding-agent/task/subprocess-tool-registry";
-
 // Register report_finding handler
 subprocessToolRegistry.register<ReportFindingDetails>("report_finding", {
-	extractData: (event) => event.result?.details as ReportFindingDetails | undefined,
+	extractData: event => event.result?.details as ReportFindingDetails | undefined,
 
 	renderInline: (data, theme) => {
 		const { label, icon, color } = getPriorityDisplay(data.priority, theme);

package/src/tools/ssh.ts

@@ -1,22 +1,23 @@
 import type { AgentTool, AgentToolContext, AgentToolResult, AgentToolUpdateCallback } from "@oh-my-pi/pi-agent-core";
-import type { SSHHost } from "@oh-my-pi/pi-coding-agent/capability/ssh";
-import { sshCapability } from "@oh-my-pi/pi-coding-agent/capability/ssh";
-import { renderPromptTemplate } from "@oh-my-pi/pi-coding-agent/config/prompt-templates";
-import { loadCapability } from "@oh-my-pi/pi-coding-agent/discovery/index";
-import type { RenderResultOptions } from "@oh-my-pi/pi-coding-agent/extensibility/custom-tools/types";
-import type { Theme } from "@oh-my-pi/pi-coding-agent/modes/theme/theme";
-import sshDescriptionBase from "@oh-my-pi/pi-coding-agent/prompts/tools/ssh.md" with { type: "text" };
-import type { SSHHostInfo } from "@oh-my-pi/pi-coding-agent/ssh/connection-manager";
-import { ensureHostInfo, getHostInfoForHost } from "@oh-my-pi/pi-coding-agent/ssh/connection-manager";
-import { executeSSH } from "@oh-my-pi/pi-coding-agent/ssh/ssh-executor";
-import type { OutputMeta } from "@oh-my-pi/pi-coding-agent/tools/output-meta";
-import { ToolError } from "@oh-my-pi/pi-coding-agent/tools/tool-errors";
 import type { Component } from "@oh-my-pi/pi-tui";
 import { Text } from "@oh-my-pi/pi-tui";
 import { Type } from "@sinclair/typebox";
-import type { ToolSession } from "./index";
+import type { SSHHost } from "../capability/ssh";
+import { sshCapability } from "../capability/ssh";
+import { renderPromptTemplate } from "../config/prompt-templates";
+import { loadCapability } from "../discovery";
+import type { RenderResultOptions } from "../extensibility/custom-tools/types";
+import type { Theme } from "../modes/theme/theme";
+import sshDescriptionBase from "../prompts/tools/ssh.md" with { type: "text" };
+import type { SSHHostInfo } from "../ssh/connection-manager";
+import { ensureHostInfo, getHostInfoForHost } from "../ssh/connection-manager";
+import { executeSSH } from "../ssh/ssh-executor";
+import { renderOutputBlock, renderStatusLine } from "../tui";
+import type { ToolSession } from ".";
+import type { OutputMeta } from "./output-meta";
 import { allocateOutputArtifact, createTailBuffer } from "./output-utils";
-import { ToolUIKit } from "./render-utils";
+import { formatBytes, wrapBrackets } from "./render-utils";
+import { ToolError } from "./tool-errors";
 import { toolResult } from "./tool-result";
 import { DEFAULT_MAX_BYTES } from "./truncate";
 
@@ -31,8 +32,8 @@ export interface SSHToolDetails {
 	meta?: OutputMeta;
 }
 
-function formatHostEntry(host: SSHHost): string {
-	const info = getHostInfoForHost(host);
+async function formatHostEntry(host: SSHHost): Promise<string> {
+	const info = await getHostInfoForHost(host);
 
 	let shell: string;
 	if (!info) {
@@ -57,12 +58,12 @@ function formatHostEntry(host: SSHHost): string {
 	return `- ${host.name} (${host.host}) | ${shell}`;
 }
 
-function formatDescription(hosts: SSHHost[]): string {
+async function formatDescription(hosts: SSHHost[]): Promise<string> {
 	const baseDescription = renderPromptTemplate(sshDescriptionBase);
 	if (hosts.length === 0) {
 		return baseDescription;
 	}
-	const hostList = hosts.map(formatHostEntry).join("\n");
+	const hostList = (await Promise.all(hosts.map(formatHostEntry))).join("\n");
 	return `${baseDescription}\n\nAvailable hosts:\n${hostList}`;
 }
 
@@ -134,17 +135,12 @@ export class SshTool implements AgentTool<typeof sshSchema, SSHToolDetails> {
 	private readonly hostsByName: Map<string, SSHHost>;
 	private readonly hostNames: string[];
 
-	constructor(session: ToolSession, hostNames: string[], hostsByName: Map<string, SSHHost>) {
+	constructor(session: ToolSession, hostNames: string[], hostsByName: Map<string, SSHHost>, description: string) {
 		this.session = session;
 		this.hostNames = hostNames;
 		this.hostsByName = hostsByName;
 		this.allowedHosts = new Set(hostNames);
-
-		const descriptionHosts = hostNames
-			.map((name) => hostsByName.get(name))
-			.filter((host): host is SSHHost => host !== undefined);
-
-		this.description = formatDescription(descriptionHosts);
+		this.description = description;
 	}
 
 	public async execute(
@@ -181,7 +177,7 @@ export class SshTool implements AgentTool<typeof sshSchema, SSHToolDetails> {
 			compatEnabled: hostInfo.compatEnabled,
 			artifactPath,
 			artifactId,
-			onChunk: (chunk) => {
+			onChunk: chunk => {
 				tailBuffer.append(chunk);
 				if (onUpdate) {
 					onUpdate({
@@ -213,7 +209,13 @@ export async function loadSshTool(session: ToolSession): Promise<SshTool | null>
 	if (hostNames.length === 0) {
 		return null;
 	}
-	return new SshTool(session, hostNames, hostsByName);
+
+	const descriptionHosts = hostNames
+		.map(name => hostsByName.get(name))
+		.filter((host): host is SSHHost => host !== undefined);
+	const description = await formatDescription(descriptionHosts);
+
+	return new SshTool(session, hostNames, hostsByName, description);
 }
 
 // =============================================================================
@@ -237,10 +239,9 @@ interface SshRenderContext {
 
 export const sshToolRenderer = {
 	renderCall(args: SshRenderArgs, uiTheme: Theme): Component {
-		const ui = new ToolUIKit(uiTheme);
 		const host = args.host || uiTheme.format.ellipsis;
 		const command = args.command || uiTheme.format.ellipsis;
-		const text = ui.title(`[${host}] $ ${command}`);
+		const text = renderStatusLine({ icon: "pending", title: "SSH", description: `[${host}] $ ${command}` }, uiTheme);
 		return new Text(text, 0, 0);
 	},
 
@@ -251,42 +252,48 @@ export const sshToolRenderer = {
 		},
 		options: RenderResultOptions & { renderContext?: SshRenderContext },
 		uiTheme: Theme,
+		args?: SshRenderArgs,
 	): Component {
-		const ui = new ToolUIKit(uiTheme);
 		const { expanded, renderContext } = options;
 		const details = result.details;
-		const lines: string[] = [];
+		const host = args?.host || uiTheme.format.ellipsis;
+		const command = args?.command || uiTheme.format.ellipsis;
+		const header = renderStatusLine(
+			{ icon: "success", title: "SSH", description: `[${host}] $ ${command}` },
+			uiTheme,
+		);
+		const outputLines: string[] = [];
 
-		const textContent = result.content?.find((c) => c.type === "text")?.text ?? "";
-		const output = textContent.trim();
+		const textContent = result.content?.find(c => c.type === "text")?.text ?? "";
+		const output = textContent.trimEnd();
 
 		if (output) {
 			if (expanded) {
-				const styledOutput = output
-					.split("\n")
-					.map((line) => uiTheme.fg("toolOutput", line))
-					.join("\n");
-				lines.push(styledOutput);
+				outputLines.push(...output.split("\n").map(line => uiTheme.fg("toolOutput", line)));
 			} else if (renderContext?.visualLines) {
 				const { visualLines, skippedCount = 0, totalVisualLines = visualLines.length } = renderContext;
 				if (skippedCount > 0) {
-					lines.push(
+					outputLines.push(
 						uiTheme.fg(
 							"dim",
 							`${uiTheme.format.ellipsis} (${skippedCount} earlier lines, showing ${visualLines.length} of ${totalVisualLines}) (ctrl+o to expand)`,
 						),
 					);
 				}
-				lines.push(...visualLines);
+				const styledVisual = visualLines.map(line =>
+					line.includes("\x1b[") ? line : uiTheme.fg("toolOutput", line),
+				);
+				outputLines.push(...styledVisual);
 			} else {
-				const outputLines = output.split("\n");
+				const outputLinesRaw = output.split("\n");
 				const maxLines = 5;
-				const displayLines = outputLines.slice(0, maxLines);
-				const remaining = outputLines.length - maxLines;
-
-				lines.push(...displayLines.map((line) => uiTheme.fg("toolOutput", line)));
+				const displayLines = outputLinesRaw.slice(0, maxLines);
+				const remaining = outputLinesRaw.length - maxLines;
+				outputLines.push(...displayLines.map(line => uiTheme.fg("toolOutput", line)));
 				if (remaining > 0) {
-					lines.push(uiTheme.fg("dim", `${uiTheme.format.ellipsis} (${remaining} more lines) (ctrl+o to expand)`));
+					outputLines.push(
+						uiTheme.fg("dim", `${uiTheme.format.ellipsis} (${remaining} more lines) (ctrl+o to expand)`),
+					);
 				}
 			}
 		}
@@ -301,12 +308,25 @@ export const sshToolRenderer = {
 				warnings.push(`Truncated: showing ${truncation.outputLines} of ${truncation.totalLines} lines`);
 			} else {
 				warnings.push(
-					`Truncated: ${truncation.outputLines} lines shown (${ui.formatBytes(truncation.outputBytes)} limit)`,
+					`Truncated: ${truncation.outputLines} lines shown (${formatBytes(truncation.outputBytes)} limit)`,
 				);
 			}
-			lines.push(uiTheme.fg("warning", ui.wrapBrackets(warnings.join(". "))));
+			outputLines.push(uiTheme.fg("warning", wrapBrackets(warnings.join(". "), uiTheme)));
 		}
 
-		return new Text(lines.join("\n"), 0, 0);
+		return {
+			render: (width: number) =>
+				renderOutputBlock(
+					{
+						header,
+						state: "success",
+						sections: [{ label: uiTheme.fg("toolTitle", "Output"), lines: outputLines }],
+						width,
+					},
+					uiTheme,
+				),
+			invalidate: () => {},
+		};
 	},
+	mergeCallAndResult: true,
 };