pi-minimal 0.3.0 → 0.4.0

package/release-notes.md

@@ -1,32 +1,23 @@
 ### Added
-- `codemode` renders as a tool row: `✓ code  3 calls · plan_tracker ×2, bash … 54 lines · 1.2s`,
-  with one child row per nested call. Built-in tools inside a script read exactly like their
-  top-level rows (`bash` shows its command); other tools show up to three scalar arguments as
-  `key=value` instead of raw JSON. Children update live while the script runs. The script source
-  and output appear only on `ctrl+o`, in plain dim text, so syntax colours no longer compete with
-  status colours. A failed nested call or script error shows its first line under the row, like
-  `bash`. Previously codemode fell through to pi-core's default panel: a background slab with the
-  highlighted script, JSON arguments, an output preview and a `Took …` timer.
 
-### Changed
-- `minimal-dark` contrast: `dim` (verbs, outcomes, tool output) L 48 % → 56 % and `thinkingText`
-  52 % → 58 %, estimated ~3.1:1 → ~4.4:1 and ~3.7:1 → ~4.8:1 on the background. They were within
-  4 % of each other and below WCAG's 4.5:1 text target. `faint` 34 % → 36 %.
-- `minimal-dark` keeps syntax colours off the status hues: `syntaxFunction` was warning-yellow
-  (now lavender) and `syntaxNumber` was success-green (now teal), so code no longer looks like a
-  spinner or a check mark.
-- `minimal-dark` draws no background behind pending/successful tool output (`toolPendingBg`,
-  `toolSuccessBg` → `bg`). Tools pi-minimal does not restyle yet (`subagent`, MCP tools) lose
-  their slab; failures keep `toolErrorBg`.
+- `editDiff` setting in `pi-minimal.json`: controls whether an `edit` row shows the
+  change itself. `"expanded"` (default) shows the unified diff in the `│`-ruled
+  block when the row is expanded with `ctrl+o`, where the bare "Successfully
+  replaced" text used to be. `"always"` shows it inline as soon as the edit lands,
+  capped at 40 lines with `… N more lines (ctrl+o)` for the rest. `"never"` keeps
+  the stats-only row. Lines use the theme's `toolDiffAdded` / `toolDiffRemoved` /
+  `toolDiffContext` colours and keep pi's line-number gutter; when one line
+  replaces one line, only the changed tokens are inverse-highlighted, as in pi's
+  own edit renderer. Failed edits and results without a diff are unchanged.
 
 ## What's Changed
-* feat: render codemode as a tool row; raise minimal-dark contrast (0.3.0) by @raviy06 in https://github.com/raviy06/pi-minimal/pull/15
+* feat: editDiff setting — show edit diffs always, never, or behind ctrl+o (0.4.0) by @raviy06 in https://github.com/raviy06/pi-minimal/pull/18
 
 
-**Full Changelog**: https://github.com/raviy06/pi-minimal/compare/v0.2.3...v0.3.0
+**Full Changelog**: https://github.com/raviy06/pi-minimal/compare/v0.3.1...v0.4.0
 
 ---
 **Install / upgrade**
 ```bash
-pi install npm:pi-minimal@0.3.0   # or: pi update --extensions
+pi install npm:pi-minimal@0.4.0   # or: pi update --extensions
 ```

package/src/config.ts

@@ -2,12 +2,18 @@ import { readFileSync } from "node:fs"
 import { join } from "node:path"
 import { CONFIG_DIR_NAME } from "@earendil-works/pi-coding-agent"
 
+/** When an `edit` row shows its diff: inline as soon as the edit lands, never, or only while expanded with ctrl+o. */
+export type EditDiffMode = "always" | "never" | "expanded"
+export const EDIT_DIFF_MODES: readonly EditDiffMode[] = ["always", "never", "expanded"]
+
 export type PiMinimalConfig = {
 	hideGauntletWidgets: boolean
+	editDiff: EditDiffMode
 }
 
 const DEFAULTS: PiMinimalConfig = {
 	hideGauntletWidgets: true,
+	editDiff: "expanded",
 }
 
 export function loadPiMinimalConfig(options: {
@@ -44,16 +50,20 @@ function applyLayer(config: PiMinimalConfig, path: string): void {
 		return
 	}
 
+	// Each key is validated on its own so one bad value does not discard the rest of the layer.
 	const record = parsed as Record<string, unknown>
-	if (!Object.hasOwn(record, "hideGauntletWidgets")) {
-		return
+	if (Object.hasOwn(record, "hideGauntletWidgets")) {
+		const value = record.hideGauntletWidgets
+		if (typeof value === "boolean") config.hideGauntletWidgets = value
+		else console.error(`pi-minimal: hideGauntletWidgets must be a boolean in ${path}`)
 	}
-
-	const value = record.hideGauntletWidgets
-	if (typeof value !== "boolean") {
-		console.error(`pi-minimal: hideGauntletWidgets must be a boolean in ${path}`)
-		return
+	if (Object.hasOwn(record, "editDiff")) {
+		const value = record.editDiff
+		if (isEditDiffMode(value)) config.editDiff = value
+		else console.error(`pi-minimal: editDiff must be one of ${EDIT_DIFF_MODES.map((mode) => `"${mode}"`).join(", ")} in ${path}`)
 	}
+}
 
-	config.hideGauntletWidgets = value
+function isEditDiffMode(value: unknown): value is EditDiffMode {
+	return typeof value === "string" && (EDIT_DIFF_MODES as readonly string[]).includes(value)
 }

package/src/index.ts

@@ -7,7 +7,8 @@ import { bindFooterContributionEvents } from "./footer-contribution-events.js"
 import { installCwd } from "./cwd.js"
 import { listSiblings, parseAgentList, parseTabList, type Sibling } from "./herdr.js"
 import { hideGauntletWidgets } from "./tracker.js"
-import { installToolRenderers, stopLiveWatch } from "./tools.js"
+import { installToolRenderers, setEditDiffMode, stopLiveWatch } from "./tools.js"
+import { setSessionCwd } from "./tool-rows.js"
 import { applyReclaim, reclaimPolicy, type ReclaimReason } from "./reclaim.js"
 import { installWorkingStatus } from "./working-status.js"
 import { installTurnRule } from "./turn-rule.js"
@@ -166,7 +167,9 @@ export default function piMinimalExtension(pi: ExtensionAPI): void {
       projectTrusted: ctx.isProjectTrusted(),
     })
     hideWidgets = config.hideGauntletWidgets
+    setEditDiffMode(config.editDiff)
     currentCwd = ctx.cwd
+    setSessionCwd(ctx.cwd)
     try {
       const settings = SettingsManager.create(ctx.cwd, undefined, { projectTrusted: ctx.isProjectTrusted() })
       setChromeMargin(settings.getOutputPad())

package/src/tool-rows.ts

@@ -31,9 +31,46 @@ export function shortName(path: string): string {
   return parts.slice(-2).join("/")
 }
 
+let sessionCwd: string | undefined
+let homeDir: string | undefined = process.env.HOME
+
+/** The session cwd, so `cd <cwd> && \u2026` can be dropped from bash rows. */
+export function setSessionCwd(cwd: string | undefined, home = process.env.HOME): void {
+  sessionCwd = cwd
+  homeDir = home
+}
+
+const CD_PREFIX = /^cd\s+("[^"]+"|'[^']+'|\S+)\s*&&\s*/
+
+function expandHome(path: string): string {
+  const unquoted = path.replace(/^(["'])(.*)\1$/, "$2").replace(/\/+$/, "")
+  if (homeDir && (unquoted === "~" || unquoted.startsWith("~/"))) return homeDir + unquoted.slice(1)
+  return unquoted
+}
+
+/**
+ * The item column of a bash row. Long agent commands usually start with `cd <repo> && `, which
+ * pushes the part that differs between rows off the screen: drop it when it is the session cwd,
+ * otherwise shorten it to the directory name (`pi-subagents \u203a sed -n \u2026`). Multi-line
+ * commands (heredocs, scripts) say how many lines follow instead of ending at `<<'EOF'`.
+ */
+export function bashItem(command: string): string {
+  const lines = command.replace(/\r/g, "").trim().split("\n")
+  let first = lines[0]?.trim() ?? ""
+  const cd = CD_PREFIX.exec(first)
+  if (cd && first.length > cd[0].length) {
+    const target = expandHome(cd[1])
+    const rest = first.slice(cd[0].length)
+    const cwd = sessionCwd?.replace(/\/+$/, "")
+    first = cwd && target === cwd ? rest : `${target.split("/").filter(Boolean).at(-1) ?? target} \u203a ${rest}`
+  }
+  const more = lines.slice(1).filter((line) => line.trim()).length
+  return more > 0 ? `${first} \u00b7 +${more} line${more === 1 ? "" : "s"}` : first
+}
+
 export function toolItem(kind: ToolKind, args: ToolArgs | undefined): string {
   if (kind === "bash") {
-    const command = typeof args?.command === "string" ? args.command.split("\n")[0]?.trim() ?? "" : ""
+    const command = typeof args?.command === "string" ? bashItem(args.command) : ""
     return command || "bash"
   }
   if (kind === "grep" || kind === "find") {

package/src/tools.ts

@@ -3,9 +3,10 @@ import { Container, truncateToWidth, visibleWidth } from "@earendil-works/pi-tui
 import { rowIsRunning } from "./activity.js"
 import * as chrome from "./chrome.js"
 import { callSummary, codemodeOutcome, nestedCalls, nestedItem, scriptOutput, type NestedCall } from "./codemode-rows.js"
+import { diffWords } from "diff"
+import type { EditDiffMode } from "./config.js"
 import { createLiveWatch } from "./live-watch.js"
 import {
-
   bashBody,
   formatDuration,
   formatOutcome,
@@ -52,6 +53,15 @@ const live = createLiveWatch(400)
 const rowIndent = () => margin() + 1
 /** Max lines of output shown when a row is expanded. */
 const EXPANDED_MAX_LINES = 400
+/** Max diff lines shown inline under an edit row with `editDiff: "always"`; ctrl+o shows the rest. */
+const INLINE_DIFF_MAX_LINES = 40
+
+let editDiffMode: EditDiffMode = "expanded"
+
+/** Applies the `editDiff` setting; read at session start, so a change needs a new session or /reload. */
+export function setEditDiffMode(mode: EditDiffMode): void {
+  editDiffMode = mode
+}
 
 export function stopLiveWatch(): void {
   live.stop()
@@ -99,6 +109,86 @@ function outputBlock(kind: ToolKind, result: ToolResultLike | undefined, theme:
   }
 }
 
+function editDiffText(result: ToolResultLike | undefined): string | undefined {
+  const details = result?.details as { diff?: unknown } | undefined
+  return typeof details?.diff === "string" && details.diff.trim() ? details.diff : undefined
+}
+
+type DiffLine = { prefix: "+" | "-" | " "; lineNum: string; content: string }
+
+/** pi's edit diff lines: "+123 content", "-123 content", " 123 context"; anything else (e.g. "...") is a separator. */
+function parseDiffLine(line: string): DiffLine | undefined {
+  const match = /^([+\- ])(\s*\d*) (.*)$/.exec(line)
+  if (!match) return undefined
+  return { prefix: match[1] as DiffLine["prefix"], lineNum: match[2]!, content: match[3]!.replace(/\t/g, "   ") }
+}
+
+/** Word-level diff of a 1:1 replacement; changed tokens are inverted, leading indentation is left alone, as in pi. */
+function highlightPair(removed: string, added: string, theme: Theme): { removed: string; added: string } {
+  let out = { removed: "", added: "" }
+  let firstRemoved = true
+  let firstAdded = true
+  for (const part of diffWords(removed, added)) {
+    if (part.removed || part.added) {
+      const key = part.removed ? "removed" : "added"
+      let value = part.value
+      if (part.removed ? firstRemoved : firstAdded) {
+        const ws = /^(\s*)/.exec(value)?.[1] ?? ""
+        value = value.slice(ws.length)
+        out = { ...out, [key]: out[key] + ws }
+        if (part.removed) firstRemoved = false
+        else firstAdded = false
+      }
+      if (value) out = { ...out, [key]: out[key] + theme.inverse(value) }
+    } else {
+      out = { removed: out.removed + part.value, added: out.added + part.value }
+    }
+  }
+  return out
+}
+
+/** Colours pi's edit diff like pi does: theme diff colours per line, inverse on changed tokens of single-line replacements. */
+function colorDiffLines(lines: string[], theme: Theme): string[] {
+  const out: string[] = []
+  for (let i = 0; i < lines.length; ) {
+    const parsed = parseDiffLine(lines[i]!)
+    if (!parsed) { out.push(theme.fg("toolDiffContext", lines[i]!)); i++; continue }
+    if (parsed.prefix === " ") { out.push(theme.fg("toolDiffContext", ` ${parsed.lineNum} ${parsed.content}`)); i++; continue }
+    const removed: DiffLine[] = []
+    const added: DiffLine[] = []
+    for (let p = parseDiffLine(lines[i] ?? ""); p?.prefix === "-"; p = parseDiffLine(lines[++i] ?? "")) removed.push(p)
+    for (let p = parseDiffLine(lines[i] ?? ""); p?.prefix === "+"; p = parseDiffLine(lines[++i] ?? "")) added.push(p)
+    if (removed.length === 1 && added.length === 1) {
+      const pair = highlightPair(removed[0]!.content, added[0]!.content, theme)
+      out.push(theme.fg("toolDiffRemoved", `-${removed[0]!.lineNum} ${pair.removed}`))
+      out.push(theme.fg("toolDiffAdded", `+${added[0]!.lineNum} ${pair.added}`))
+      continue
+    }
+    for (const line of removed) out.push(theme.fg("toolDiffRemoved", `-${line.lineNum} ${line.content}`))
+    for (const line of added) out.push(theme.fg("toolDiffAdded", `+${line.lineNum} ${line.content}`))
+  }
+  return out
+}
+
+/** The edit's diff in the `│`-ruled block. Inline views are capped; expanded views show up to the usual limit. */
+function diffBlock(diff: string, theme: Theme, expanded: boolean) {
+  const all = diff.replace(/\n$/, "").split("\n")
+  const max = expanded ? EXPANDED_MAX_LINES : INLINE_DIFF_MAX_LINES
+  const lines = colorDiffLines(all.length > max ? all.slice(0, max) : all, theme)
+  const hidden = all.length - lines.length
+  const indent = " ".repeat(rowIndent() + 2)
+  const rule = theme.fg("borderMuted", "│")
+  return {
+    render(width: number): string[] {
+      const inner = Math.max(0, width - indent.length - 2)
+      const out = lines.map((line) => `${indent}${rule} ${truncateToWidth(line, inner)}`)
+      if (hidden > 0) out.push(`${indent}${rule} ${theme.fg("dim", `… ${hidden} more lines${expanded ? "" : " (ctrl+o)"}`)}`)
+      return out
+    },
+    invalidate() {},
+  }
+}
+
 function errorLineBlock(line: string | undefined, theme: Theme) {
   if (!line) return undefined
   const indent = " ".repeat(rowIndent() + 2)
@@ -196,14 +286,135 @@ export function compactRenderers(kind: ToolKind): ToolRenderers {
         live.unwatch(liveId(renderContext, toolItem(kind, renderContext.args)))
       }
       const container = new Container()
+      const expanded = Boolean((options as RenderOptions).expanded)
       const errorLine = errorLineBlock(renderContext.state.outcome?.errorLine, theme)
-      if (errorLine && !(options as RenderOptions).expanded) container.addChild(errorLine)
-      if ((options as RenderOptions).expanded) container.addChild(outputBlock(kind, typedResult, theme))
+      if (errorLine && !expanded) container.addChild(errorLine)
+      const diff = kind === "edit" && !renderContext.isError && !renderContext.isPartial ? editDiffText(typedResult) : undefined
+      const showDiff = diff !== undefined && (editDiffMode === "always" || (editDiffMode === "expanded" && expanded))
+      if (showDiff) container.addChild(diffBlock(diff, theme, expanded))
+      else if (expanded) container.addChild(outputBlock(kind, typedResult, theme))
       return container
     },
   }
 }
 
+/** One `glyph verb item … outcome` line in the tool-row grid, shared by every self-rendered row. */
+function rowLine(theme: Theme, width: number, status: RowStatus, frame: 0 | 1, verb: string, item: string, right: string): string {
+	const inner = Math.max(8, width - rowIndent())
+	const row = layoutRow(inner, verb, item, right)
+	const rightColor = status === "running" ? "warning" : status === "error" ? "error" : "dim"
+	return (
+		" ".repeat(rowIndent()) +
+		theme.fg(statusColor(status), rowGlyph(status, frame)) +
+		" " +
+		theme.fg("dim", row.verb) +
+		" " +
+		theme.fg(status === "error" ? "text" : "muted", row.item) +
+		" ".repeat(row.gap) +
+		theme.fg(rightColor, row.outcome)
+	)
+}
+
+/** Longest first result line shown verbatim as an outcome; longer results show a line count. */
+const OUTCOME_TEXT_MAX = 24
+
+/** `mcp` for MCP tools, `agent` for subagent tools, `tool` for anything else. */
+export function genericVerb(toolName: string): string {
+	if (toolName.startsWith("mcp__")) return "mcp"
+	if (/subagent/.test(toolName)) return "agent"
+	return "tool"
+}
+
+/** `server · tool key=value …` for MCP tools, `name key=value …` for the rest. */
+export function genericItem(toolName: string, args: unknown): string {
+	let json: string
+	try {
+		json = JSON.stringify(args ?? {}) ?? ""
+	} catch {
+		json = ""
+	}
+	const params = nestedItem({ name: toolName, args: json })
+	const mcp = /^mcp__(.+?)__(.+)$/.exec(toolName)
+	const label = mcp ? `${mcp[1]} \u00b7 ${mcp[2]}` : toolName
+	return params ? `${label} ${params}` : label
+}
+
+export function genericOutcome(result: ToolResultLike | undefined, isError: boolean, durationMs: number | undefined): Outcome {
+	const text = resultText(result)
+	const dur = formatDuration(durationMs)
+	const join = (...parts: string[]) => parts.filter(Boolean).join(" \u00b7 ")
+	const lines = text.split("\n").filter((line) => line.trim().length > 0)
+	if (isError) return { text: join("failed", dur), errorLine: lines[0]?.trim() ?? "" }
+	if (lines.length === 0) return { text: join("ok", dur) }
+	const first = lines[0].trim()
+	if (lines.length === 1 && visibleWidth(first) <= OUTCOME_TEXT_MAX) return { text: join(first, dur) }
+	return { text: join(`${lines.length} line${lines.length === 1 ? "" : "s"}`, dur) }
+}
+
+/**
+ * A one-line row for tools that bring no renderer of their own (most MCP tools,
+ * `subagents_enable`): `\u2713 mcp   re_mcp \u00b7 query_prometheus query=\u2026   12 lines \u00b7 1.4s`.
+ * Without it they fall through to pi-core's default: bold name, JSON arguments, a text preview.
+ */
+export function genericRenderers(toolName: string): ToolRenderers {
+	const verb = genericVerb(toolName)
+	return {
+		renderShell: "self",
+		renderCall(args, theme, rawContext) {
+			const context = rawContext as RenderContext
+			const id = context.toolCallId || toolName
+			const item = genericItem(toolName, args)
+			const running = rowIsRunning(context)
+			context.state.running = running
+			if (running) {
+				context.state.startedAt ??= Date.now()
+				live.watch(id, context.invalidate)
+			} else live.unwatch(id)
+			return {
+				render(width: number): string[] {
+					const status = rowStatus(context)
+					const frame = status === "running" && live.has(id) ? live.frame : 0
+					const right =
+						status === "running"
+							? context.state.startedAt
+								? formatDuration(Date.now() - context.state.startedAt)
+								: ""
+							: (context.state.outcome?.text ?? "")
+					return [rowLine(theme, width, status, frame, verb, item, right)]
+				},
+				invalidate() {},
+			}
+		},
+		renderResult(result, options, theme, rawContext) {
+			const context = rawContext as RenderContext
+			const typed = result as ToolResultLike
+			if (!context.isPartial) {
+				context.state.done = true
+				context.state.running = false
+				context.state.outcome = genericOutcome(typed, Boolean(context.isError), context.durationMs)
+				live.unwatch(context.toolCallId || toolName)
+			}
+			const container = new Container()
+			const expanded = Boolean((options as RenderOptions).expanded)
+			const errorLine = context.state.outcome?.errorLine
+			if (errorLine && !expanded) container.addChild(errorLineBlock(errorLine, theme)!)
+			if (expanded) {
+				const text = resultText(typed)
+				if (text) {
+					const indent = " ".repeat(rowIndent() + 2)
+					container.addChild({ render: (width: number) => ruledLines(text, width, theme, indent), invalidate() {} })
+				}
+			}
+			return container
+		},
+	}
+}
+
+/** True when a tool definition draws its own call or result. */
+function hasOwnRenderer(definition: ToolRenderers | undefined): boolean {
+	return typeof definition?.renderCall === "function" || typeof definition?.renderResult === "function"
+}
+
 /** Max nested calls shown under a collapsed codemode row; the rest are counted. */
 const NESTED_PREVIEW = 8
 /** Width of the nested tool-name column. */
@@ -255,19 +466,7 @@ export function codemodeRenderers(): ToolRenderers {
 					const calls = state.calls ?? []
 					const right =
 						status === "running" ? (state.startedAt ? formatDuration(Date.now() - state.startedAt) : "") : (state.outcome?.text ?? "")
-					const inner = Math.max(8, width - rowIndent())
-					const row = layoutRow(inner, "code", callSummary(calls), right)
-					const rightColor = status === "running" ? "warning" : status === "error" ? "error" : "dim"
-					const lines = [
-						" ".repeat(rowIndent()) +
-							theme.fg(statusColor(status), rowGlyph(status, frame)) +
-							" " +
-							theme.fg("dim", row.verb) +
-							" " +
-							theme.fg(status === "error" ? "text" : "muted", row.item) +
-							" ".repeat(row.gap) +
-							theme.fg(rightColor, row.outcome),
-					]
+					const lines = [rowLine(theme, width, status, frame, "code", callSummary(calls), right)]
 					const expanded = Boolean(context.expanded)
 					const shown = expanded ? calls : calls.slice(-NESTED_PREVIEW)
 					const childIndent = " ".repeat(rowIndent() + 4)
@@ -347,7 +546,10 @@ export function installToolRenderers(pi: ExtensionAPI): void {
   if (typeof pi.registerToolRenderer !== "function") return
   pi.registerToolRenderer((toolName, next) => {
     if (toolName === "codemode") return codemodeRenderers()
-    if (!isToolKind(toolName)) return next()
-    return compactRenderers(toolName)
+    if (isToolKind(toolName)) return compactRenderers(toolName)
+    // Tools that draw themselves (subagent's live view, gauntlet's trackers) keep their look.
+    const definition = next()
+    if (hasOwnRenderer(definition)) return definition
+    return { ...definition, ...genericRenderers(toolName) }
   })
 }

package/src/tracker.ts

@@ -67,19 +67,24 @@ export function formatTrackerLines(
   }
   if (tasks && tasks.length > 0) {
     const done = tasks.filter((t) => t.status === "complete").length
-    const icons = tasks
-      .map((t) => {
-        if (t.status === "complete") return theme.fg("success", "✓")
-        if (t.status === "in_progress") return theme.fg("warning", "→")
-        if (t.status === "failed") return theme.fg("error", "✗")
-        return theme.fg("dim", "○")
-      })
-      .join("")
+    // One segment per task, coloured by status, so the list reads as a single bar instead of a
+    // row of check marks. Past 12 tasks the bar is scaled to 10 segments (status order kept).
+    const segment = (status: string | undefined) => {
+      if (status === "complete") return theme.fg("success", "▰")
+      if (status === "in_progress") return theme.fg("warning", "▰")
+      if (status === "failed") return theme.fg("error", "▰")
+      return theme.fg("dim", "▱")
+    }
+    const shown =
+      tasks.length <= 12
+        ? tasks.map((t) => t.status)
+        : Array.from({ length: 10 }, (_, i) => tasks[Math.floor((i * tasks.length) / 10)]?.status)
+    const icons = shown.map(segment).join("")
     const current =
       tasks.find((t) => t.status === "in_progress") ?? tasks.find((t) => t.status === "pending")
     const name = current ? theme.fg("text", ` ${current.name}`) : ""
     lines.push(
-      `${theme.fg("muted", "Tasks")} ${icons} ${theme.fg("dim", `(${done}/${tasks.length})`)}${name}`,
+      `${theme.fg("muted", "Tasks")} ${icons} ${theme.fg("dim", `${done}/${tasks.length}`)}${name}`,
     )
   }
   return lines

package/src/transcript.ts

@@ -1,51 +1,106 @@
 import type { ExtensionAPI } from "@earendil-works/pi-coding-agent"
+import { visibleWidth } from "@earendil-works/pi-tui"
 
 export const THINKING_GUTTER = "┊ "
 
 const FENCE = /^\s*(```|~~~)/
 const BLOCK_START = /^\s*(#{1,6}\s|[-*+]\s|\d+[.)]\s|>|\||```|~~~|---\s*$|\*\*\*\s*$|___\s*$)/
+/** Below this width wrapping would only make thinking harder to read; prefix source lines instead. */
+const MIN_WRAP_WIDTH = 20
+/** An inline code span stays whole; everything else splits on spaces. */
+const TOKEN = /`[^`]*`|[^\s`]+|`/g
+
+function stripGutter(line: string): string {
+	return line.startsWith(THINKING_GUTTER) ? line.slice(THINKING_GUTTER.length) : line
+}
+
+/** Split a word wider than `room` into `room`-wide pieces (URLs, long paths). */
+function splitWide(word: string, room: number): string[] {
+	if (word.startsWith("`") || visibleWidth(word) <= room) return [word]
+	const pieces: string[] = []
+	let piece = ""
+	for (const char of word) {
+		if (visibleWidth(piece + char) > room) {
+			pieces.push(piece)
+			piece = ""
+		}
+		piece += char
+	}
+	if (piece) pieces.push(piece)
+	return pieces
+}
+
+/**
+ * Greedy word wrap at `room` cells. Markdown markers (`*`, backticks) count toward the width
+ * but are removed when rendered, so lines can only come out shorter than `room`, never wider.
+ */
+export function wrapLine(line: string, room: number): string[] {
+	const words = (line.match(TOKEN) ?? []).flatMap((word) => splitWide(word, room))
+	if (words.length === 0) return [""]
+	const out: string[] = []
+	let current = ""
+	for (const word of words) {
+		if (!current) current = word
+		else if (visibleWidth(current) + 1 + visibleWidth(word) <= room) current += ` ${word}`
+		else {
+			out.push(current)
+			current = word
+		}
+	}
+	out.push(current)
+	return out
+}
 
 /**
- * Prefix the first line of every plain paragraph in thinking Markdown with a gutter glyph.
- * Lines that start a Markdown block (heading, list, quote, table, fence, rule) are left alone so
- * they keep parsing, and nothing inside a fenced code block is touched.
+ * Put the thinking gutter on every rendered line of every plain paragraph, so thinking reads as a
+ * column beside prose rather than a bullet on its first line. With `width` (the content width the
+ * host will render at) paragraph lines are pre-wrapped to `width - 2` so wrapped lines carry the
+ * gutter too; pi-tui keeps single newlines as line breaks. Without a usable width only source
+ * lines are prefixed.
+ *
+ * Block syntax (heading, list, quote, table, fence, rule) is left untouched so it still parses,
+ * including a list or quote that interrupts a paragraph, and nothing inside fenced code changes.
  */
-export function gutterThinking(markdown: string): string {
-  if (!markdown) return markdown
-  const lines = markdown.split("\n")
-  const out: string[] = []
-  let inFence = false
-  let atParagraphStart = true
-  for (const line of lines) {
-    if (FENCE.test(line)) {
-      inFence = !inFence
-      out.push(line)
-      atParagraphStart = !inFence
-      continue
-    }
-    if (inFence) {
-      out.push(line)
-      continue
-    }
-    if (line.trim() === "") {
-      out.push(line)
-      atParagraphStart = true
-      continue
-    }
-    if (atParagraphStart && !BLOCK_START.test(line) && !line.startsWith(THINKING_GUTTER)) {
-      out.push(`${THINKING_GUTTER}${line}`)
-    } else {
-      out.push(line)
-    }
-    atParagraphStart = false
-  }
-  return out.join("\n")
+export function gutterThinking(markdown: string, width?: number): string {
+	if (!markdown) return markdown
+	const room = width !== undefined && width >= MIN_WRAP_WIDTH ? width - visibleWidth(THINKING_GUTTER) : undefined
+	const out: string[] = []
+	let inFence = false
+	/** "para": inside a plain paragraph; "block": inside block syntax until the next blank line. */
+	let mode: "none" | "para" | "block" = "none"
+	for (const line of markdown.split("\n")) {
+		if (FENCE.test(line)) {
+			inFence = !inFence
+			out.push(line)
+			mode = "none"
+			continue
+		}
+		if (inFence) {
+			out.push(line)
+			continue
+		}
+		if (line.trim() === "") {
+			out.push(line)
+			mode = "none"
+			continue
+		}
+		const body = stripGutter(line)
+		if (mode === "block" || BLOCK_START.test(body)) {
+			out.push(line)
+			mode = "block"
+			continue
+		}
+		mode = "para"
+		if (room === undefined) out.push(`${THINKING_GUTTER}${body}`)
+		else for (const piece of wrapLine(body, room)) out.push(`${THINKING_GUTTER}${piece}`)
+	}
+	return out.join("\n")
 }
 
 export function installTranscript(pi: ExtensionAPI): void {
-  if (typeof pi.registerMarkdownTransformer !== "function") return
-  pi.registerMarkdownTransformer((markdown, context) => {
-    if (context.messageType !== "assistant-thinking") return markdown
-    return gutterThinking(markdown)
-  })
+	if (typeof pi.registerMarkdownTransformer !== "function") return
+	pi.registerMarkdownTransformer((markdown, context) => {
+		if (context.messageType !== "assistant-thinking") return markdown
+		return gutterThinking(markdown, context.availableWidth)
+	})
 }

package/test/codemode-rows.test.ts

@@ -21,7 +21,7 @@ test("parseArgs reads complete JSON and recovers keys from a preview cut at 200
 })
 
 test("nestedItem reads built-ins like their top-level rows and others as key=value", () => {
-	assert.equal(nestedItem({ name: "bash", args: '{"command":"git status\\ngit diff","timeout":10}' }), "git status")
+	assert.equal(nestedItem({ name: "bash", args: '{"command":"git status\\ngit diff","timeout":10}' }), "git status · +1 line")
 	assert.equal(nestedItem({ name: "read", args: '{"path":"/a/b/c/file.ts"}' }), "c/file.ts")
 	assert.equal(
 		nestedItem({ name: "plan_tracker", args: '{"action":"update","index":6,"status":"complete"}' }),