pi-better-harness 0.3.16 → 0.3.18

package/node_modules/pi-better-background-tasks/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-better-background-tasks",
-  "version": "0.2.14",
+  "version": "0.2.15",
   "description": "Pi extension for durable background shell tasks, watchers, logs, and status inspection.",
   "license": "MIT",
   "type": "module",

package/node_modules/pi-better-background-tasks/src/shared-navigator.ts

@@ -1,4 +1,5 @@
 import type { ExtensionContext } from "@earendil-works/pi-coding-agent";
+import { truncateToWidth as piTruncateToWidth, visibleWidth as piVisibleWidth } from "@earendil-works/pi-tui";
 import type { Component } from "@earendil-works/pi-tui";
 import { createRenderScheduler, type RenderScheduler } from "./shared-render-scheduler.ts";
 
@@ -280,10 +281,10 @@ function refreshMainListWidget(): void {
   }) : undefined;
   const changed = nextSignature !== s.lastMainListSignature;
   s.lastMainListSignature = nextSignature;
-  s.lastMainListLines = rows.length ? buildMainListLines(rows, MAIN_LIST_FALLBACK_WIDTH, deps.truncate, themeFg(ctx), {
+  s.lastMainListLines = rows.length ? ["", ...buildMainListLines(rows, MAIN_LIST_FALLBACK_WIDTH, deps.truncate, themeFg(ctx), {
     selectedId: s.mainListFocused ? s.mainListSelectedId : undefined,
     focused: s.mainListFocused === true,
-  }) : undefined;
+  })] : undefined;
   if (!rows.length) {
     if (!s.mainListWidgetInstalled) return;
     try { (ctx.ui as any).setWidget?.(MAIN_LIST_WIDGET_KEY, undefined); } catch { /* ignore */ }
@@ -323,10 +324,10 @@ function createMainListWidget(tui: { requestRender?(): void }, theme: unknown, d
         state().lastMainListLines = undefined;
         return [];
       }
-      const lines = buildMainListLines(rows, renderWidth(width), deps.truncate, themeFgFromTheme(theme), {
+      const lines = ["", ...buildMainListLines(rows, renderWidth(width), deps.truncate, themeFgFromTheme(theme), {
         selectedId: state().mainListFocused ? state().mainListSelectedId : undefined,
         focused: state().mainListFocused === true,
-      });
+      })];
       state().lastMainListLines = lines;
       return lines;
     },
@@ -1269,7 +1270,8 @@ export function wrapLogText(text: string, width: number): string[] {
       continue;
     }
     const sourceIndent = source.match(/^[ \t]*/)?.[0] ?? "";
-    const indent = sourceIndent.replace(/\t/g, "  ");
+    // Leave room for a full-width grapheme even on deeply indented log lines.
+    const indent = sourceIndent.replace(/\t/g, "  ").slice(0, max - 2);
     let remaining = source.slice(sourceIndent.length);
     const contentWidth = Math.max(1, max - visibleWidth(indent));
     if (!remaining) {
@@ -1302,33 +1304,25 @@ function lastDelimiterBreak(value: string): number {
   return last;
 }
 
+const GRAPHEME_SEGMENTER = new Intl.Segmenter(undefined, { granularity: "grapheme" });
+
 function splitVisiblePrefix(value: string, width: number): [string, string] {
   const max = Math.max(0, Math.floor(width));
   let visible = 0;
-  let index = 0;
-  while (index < value.length && visible < max) {
-    if (value[index] === "\u001b" || value[index] === "\u009b") {
-      const match = value.slice(index).match(ANSI_RE);
-      if (match?.index === 0) {
-        index += match[0].length;
-        continue;
-      }
-    }
-    if (value[index] === "<") {
-      const close = value.indexOf(">", index);
-      if (close !== -1) {
-        const tag = value.slice(index, close + 1);
-        if (/^<\/?[a-zA-Z][\w-]*>$/.test(tag) || tag === "</>") {
-          index = close + 1;
-          continue;
-        }
-      }
+  let end = 0;
+  for (const { segment, index } of GRAPHEME_SEGMENTER.segment(value)) {
+    if (index < end) continue;
+    const formatting = value.slice(index).match(FORMATTING_PREFIX_RE);
+    if (formatting) {
+      end = index + formatting[0].length;
+      continue;
     }
-    const codePoint = value.codePointAt(index)!;
-    index += codePoint > 0xFFFF ? 2 : 1;
-    visible += 1;
+    const cells = piVisibleWidth(segment);
+    if (visible + cells > max) break;
+    visible += cells;
+    end = index + segment.length;
   }
-  return [value.slice(0, index), value.slice(index)];
+  return [value.slice(0, end), value.slice(end)];
 }
 
 function cycleLogTailRows(current: number): number {
@@ -1387,44 +1381,19 @@ function safeTruncate(line: string, width: number, truncate: (s: string, width:
 
 const ANSI_RE = new RegExp("[\\u001B\\u009B][[\\]()#;?]*(?:(?:(?:[a-zA-Z\\d]*(?:;[a-zA-Z\\d]*)*)?\\u0007)|(?:(?:\\d{1,4}(?:;\\d{0,4})*)?[\\dA-PR-TZcf-ntqry=><~]))", "g");
 
+const FORMATTING_PREFIX_RE = new RegExp(`^(?:${ANSI_RE.source}|<\\/?[a-zA-Z][\\w-]*>|</>)`);
+
 function visibleWidth(value: string): number {
-  return String(value ?? "")
+  const cleaned = String(value ?? "")
     .replace(ANSI_RE, "")
     .replace(/<\/?[a-zA-Z][\w-]*>/g, "")
-    .replace(/<\/>/g, "")
-    .length;
+    .replace(/<\/>/g, "");
+  return piVisibleWidth(cleaned);
 }
 
 function truncateVisible(value: string, width: number): string {
   const str = String(value ?? "");
   const max = Math.max(0, Math.floor(width || 0));
   if (visibleWidth(str) <= max) return str;
-  let out = "";
-  let vis = 0;
-  let i = 0;
-  while (i < str.length && vis < max) {
-    if (str[i] === "\u001b" || str[i] === "\u009b") {
-      const match = str.slice(i).match(ANSI_RE);
-      if (match && match.index === 0) {
-        out += match[0];
-        i += match[0].length;
-        continue;
-      }
-    }
-    if (str[i] === "<") {
-      const close = str.indexOf(">", i);
-      if (close !== -1) {
-        const tag = str.slice(i, close + 1);
-        if (/^<\/?[a-zA-Z][\w-]*>$/.test(tag) || tag === "</>") {
-          out += tag;
-          i = close + 1;
-          continue;
-        }
-      }
-    }
-    out += str[i];
-    vis += 1;
-    i += 1;
-  }
-  return out;
+  return piTruncateToWidth(str, max);
 }

package/node_modules/pi-better-plan/README.md

@@ -27,6 +27,12 @@ When an explicitly invoked skill declares `workflow-role: coordinator` in its me
 
 For `rush-issues`, call `sync_workflow_plan` with the absolute `.resolve-issues/rush/<run-id>/task-plan.json` path and its persisted `planRevision` after each checkpoint. This binds the active run to the session and displays its fleet stages and actual units in the widget, `/plan`, and `get_plan`. The view reads the file without writing to it; revision mismatches are rejected. The run binding survives Pi session resume, and ownership release restores the prior generic checklist. Other workflow-owned skills retain their own planning and have no generic plan view.
 
+## Plan Display
+
+Native and workflow-synced plans share a `plan` heading, completion counts, aligned identifiers and titles, and status colors. Completed rows use `✓`, active rows `●`, pending rows `○`, and blocked rows `!`. Active and blocked rows also carry text labels; failed workflow rows use `×` and `failed` rather than an active indicator.
+
+Workflow identity, revision, and fleet progress sit on a secondary line that wraps on narrow terminals. `/plan` uses the same styling and shows workflow stage, raw status, worker, dependencies, and notes beneath each issue. Use ↑/↓ to move the selection and Escape or ← to return. The passive widget never captures editor arrow keys.
+
 ## Install
 
 ```sh

package/node_modules/pi-better-plan/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-better-plan",
-  "version": "0.3.2",
+  "version": "0.3.4",
   "description": "Structured execution plans with persistent progress for Pi.",
   "license": "MIT",
   "type": "module",

package/node_modules/pi-better-plan/src/index.ts

@@ -162,10 +162,13 @@ export default function planExtension(pi: ExtensionAPI): void {
             if (displayMode === "hidden") return [];
             if (displayedWorkflowOwner) {
               if (displayedWorkflowOwner !== "rush-issues") return [];
-              return rushPlan ? renderRushPlan(rushPlan, width) : [];
+              const fg = typeof theme?.fg === "function"
+                ? (color: string, value: string) => theme.fg(color as never, value)
+                : undefined;
+              return rushPlan ? ["", ...renderRushPlan(rushPlan, width, false, fg)] : [];
             }
             if (!currentPlan) return [];
-            return renderCompactPlan(currentPlan, width, theme as never);
+            return ["", ...renderCompactPlan(currentPlan, width, theme as never)];
           },
           invalidate() {},
           dispose() {
@@ -189,8 +192,11 @@ export default function planExtension(pi: ExtensionAPI): void {
         ctx.ui.notify(renderRushPlan(plan, 160, true).join("\n"), "info");
         return;
       }
-      await ctx.ui.custom<void>((tui, _theme, _keys, done) => {
-        const component = createRushPlanComponent(plan, () => done());
+      await ctx.ui.custom<void>((tui, theme, _keys, done) => {
+        const fg = typeof theme?.fg === "function"
+          ? (color: string, value: string) => theme.fg(color as never, value)
+          : undefined;
+        const component = createRushPlanComponent(plan, () => done(), fg);
         return { render: (width) => component.render(width), handleInput(data) {
           component.handleInput?.(data);
           tui.requestRender();

package/node_modules/pi-better-plan/src/plan-presentation.ts

@@ -0,0 +1,112 @@
+import type { Component } from "@earendil-works/pi-tui";
+import { matchesKey, truncateToWidth, visibleWidth, wrapTextWithAnsi } from "@earendil-works/pi-tui";
+
+export interface PlanRenderTheme {
+  fg(color: string, value: string): string;
+}
+
+export type DisplayStatus = "completed" | "in_progress" | "pending" | "blocked" | "failed" | "skipped" | "unknown";
+export interface PlanRow {
+  label: string;
+  title: string;
+  status: DisplayStatus;
+  statusLabel?: string;
+  details?: string[];
+}
+export interface PlanPresentation {
+  rows: PlanRow[];
+  metadata?: { text: string; color: string }[][];
+}
+
+export const plainPlanTheme: PlanRenderTheme = { fg: (_color, value) => value };
+
+export function statusStyle(status: DisplayStatus): { glyph: string; color: string; label: string } {
+  switch (status) {
+    case "completed": return { glyph: "✓", color: "success", label: "" };
+    case "in_progress": return { glyph: "●", color: "accent", label: "active" };
+    case "blocked": return { glyph: "!", color: "warning", label: "blocked" };
+    case "failed": return { glyph: "×", color: "error", label: "failed" };
+    case "skipped": return { glyph: "—", color: "dim", label: "skipped" };
+    case "unknown": return { glyph: "?", color: "warning", label: "unknown" };
+    case "pending": return { glyph: "○", color: "dim", label: "" };
+  }
+}
+
+// Keep each piece of external text on one terminal row before measuring it.
+export function planText(value: string): string {
+  return value.replace(/[\r\n\t]/g, " ");
+}
+
+export function renderPlanPresentation(
+  plan: PlanPresentation, width: number, theme: PlanRenderTheme,
+  full = false, selectedIndex = -1,
+): string[] {
+  const size = Math.max(1, Math.floor(width));
+  const count = (status: DisplayStatus) => plan.rows.filter((row) => row.status === status).length;
+  const summary = [`${count("completed")}/${plan.rows.length} complete`];
+  for (const [status, label] of [
+    ["in_progress", "in progress"], ["blocked", "blocked"], ["failed", "failed"],
+    ["skipped", "skipped"], ["unknown", "unknown"],
+  ] as const) {
+    if (count(status)) summary.push(`${count(status)} ${label}`);
+  }
+  if (count("pending") && summary.length === 1) summary.push(`${count("pending")} pending`);
+  const lines = [theme.fg("warning", "plan") + theme.fg("dim", `  ${summary.join(" · ")}`)];
+  for (const metadata of plan.metadata ?? []) {
+    const content = metadata.map((part) => theme.fg(part.color, planText(part.text))).join("");
+    for (const line of wrapTextWithAnsi(content, Math.max(1, size - 2))) lines.push(`  ${line}`);
+  }
+  lines.push("");
+
+  const labelWidth = Math.min(12, Math.max(4, ...plan.rows.map((row) => visibleWidth(planText(row.label)))));
+  const statusWidth = Math.min(24, Math.max(0, ...plan.rows.map((row) =>
+    visibleWidth(planText(row.statusLabel ?? statusStyle(row.status).label)))));
+  for (const [index, row] of plan.rows.entries()) {
+    const style = statusStyle(row.status);
+    const label = truncateToWidth(planText(row.label), labelWidth);
+    const prefix = (index === selectedIndex ? theme.fg("accent", "› ") : "  ") +
+      theme.fg(style.color, style.glyph) + " " + theme.fg("dim", label) +
+      " ".repeat(Math.max(0, labelWidth - visibleWidth(label)) + 2);
+    const titleColor = row.status === "blocked" ? "warning" : row.status === "failed" ? "error" :
+      row.status === "in_progress" ? "text" : "muted";
+    const badge = planText(row.statusLabel ?? style.label);
+    const available = size - visibleWidth(prefix);
+    // At narrow widths use an inline status so it survives title truncation.
+    if (badge && available < statusWidth + 14) {
+      lines.push(prefix + theme.fg(style.color, `${badge} · `) + theme.fg(titleColor, planText(row.title)));
+    } else {
+      const titleWidth = Math.max(0, available - (statusWidth ? statusWidth + 2 : 0));
+      const title = truncateToWidth(planText(row.title), titleWidth);
+      lines.push(prefix + theme.fg(titleColor, title) + (badge
+        ? " ".repeat(Math.max(0, titleWidth - visibleWidth(title)) + 2) + theme.fg(style.color, badge)
+        : ""));
+    }
+    if (full) {
+      for (const detail of row.details ?? []) {
+        const indent = Math.min(visibleWidth(prefix), Math.max(0, size - 4));
+        for (const line of wrapTextWithAnsi(planText(detail), Math.max(1, size - indent))) {
+          lines.push(" ".repeat(indent) + theme.fg("dim", line));
+        }
+      }
+    }
+  }
+  if (full) lines.push("", theme.fg("dim", "↑↓ navigate · esc / ← back"));
+  return lines.map((line) => truncateToWidth(line, size));
+}
+
+export function createPlanPresentationComponent(
+  plan: PlanPresentation, theme: PlanRenderTheme, onClose: () => void,
+): Component {
+  let selected = plan.rows.findIndex((row) => row.status === "in_progress");
+  if (selected < 0) selected = plan.rows.findIndex((row) => row.status !== "completed");
+  if (selected < 0) selected = Math.max(0, plan.rows.length - 1);
+  return {
+    render: (width) => renderPlanPresentation(plan, width, theme, true, selected),
+    handleInput(data) {
+      if (matchesKey(data, "up")) selected = Math.max(0, selected - 1);
+      else if (matchesKey(data, "down")) selected = Math.min(Math.max(0, plan.rows.length - 1), selected + 1);
+      else if (matchesKey(data, "escape") || matchesKey(data, "left") || matchesKey(data, "ctrl+c")) onClose();
+    },
+    invalidate() {},
+  };
+}

package/node_modules/pi-better-plan/src/plan-render.ts

@@ -1,94 +1,28 @@
 import type { Component } from "@earendil-works/pi-tui";
-import { matchesKey, truncateToWidth } from "@earendil-works/pi-tui";
+import {
+  createPlanPresentationComponent, renderPlanPresentation,
+  type PlanPresentation, type PlanRenderTheme,
+} from "./plan-presentation.js";
+import type { PlanSnapshot } from "./types.js";
 
-import { planProgress } from "./plan-state.js";
-import type { PlanSnapshot, PlanStep } from "./types.js";
+export type { PlanRenderTheme } from "./plan-presentation.js";
 
-export interface PlanRenderTheme {
-  fg(color: string, value: string): string;
-}
-
-export function renderCompactPlan(
-  plan: PlanSnapshot,
-  width: number,
-  theme: PlanRenderTheme,
-): string[] {
-  const progress = planProgress(plan);
-  const stateLabel = progress.blocked > 0
-    ? `${progress.blocked} blocked`
-    : progress.state === "complete"
-      ? "complete"
-      : progress.state.replace("_", " ");
-  const lines = [
-    theme.fg(progress.blocked > 0 ? "warning" : "accent", `plan ${progress.completed}/${progress.total} steps`) +
-      theme.fg("dim", ` · ${stateLabel}`),
-  ];
-
-  for (let index = 0; index < plan.steps.length; index += 1) {
-    const item = plan.steps[index]!;
-    lines.push(`  ${stepGlyph(item, theme)} ${index + 1}  ${stepText(item, theme)}`);
-  }
-  lines.push("");
-  return lines.map((line) => truncateToWidth(line, Math.max(1, width)));
-}
-
-export function renderFullPlan(plan: PlanSnapshot, width: number, theme: PlanRenderTheme, selectedIndex = -1): string[] {
-  const progress = planProgress(plan);
-  const heading = `Practical Plan · ${progress.completed}/${progress.total} completed`;
-  const lines = [theme.fg("accent", rule(heading, width)), ""];
-  for (let index = 0; index < plan.steps.length; index += 1) {
-    const item = plan.steps[index]!;
-    const prefix = index === selectedIndex ? theme.fg("accent", "› ") : "  ";
-    lines.push(`${prefix}${stepGlyph(item, theme)}  ${String(index + 1).padStart(2, " ")}  ${stepText(item, theme)}`);
-  }
-  lines.push("", theme.fg("dim", rule("", width)));
-  return lines.map((line) => truncateToWidth(line, Math.max(1, width)));
-}
-
-export function createFullPlanComponent(
-  plan: PlanSnapshot,
-  theme: PlanRenderTheme,
-  onClose: () => void,
-): Component {
-  let selected = planProgress(plan).activeIndex ?? firstIncompleteIndex(plan);
+function presentPlan(plan: PlanSnapshot): PlanPresentation {
   return {
-    render: (width) => renderFullPlan(plan, width, theme, selected),
-    handleInput(data) {
-      if (matchesKey(data, "up")) selected = clampIndex(selected - 1, plan.steps.length);
-      else if (matchesKey(data, "down")) selected = clampIndex(selected + 1, plan.steps.length);
-      else if (matchesKey(data, "escape") || matchesKey(data, "left") || matchesKey(data, "ctrl+c")) onClose();
-    },
-    invalidate() {},
+    rows: plan.steps.map((item, index) => ({
+      label: String(index + 1), title: item.step, status: item.status,
+    })),
   };
 }
 
-function firstIncompleteIndex(plan: PlanSnapshot): number {
-  const index = plan.steps.findIndex((item) => item.status !== "completed");
-  return index >= 0 ? index : Math.max(0, plan.steps.length - 1);
-}
-
-function clampIndex(index: number, total: number): number {
-  return Math.min(Math.max(0, index), Math.max(0, total - 1));
+export function renderCompactPlan(plan: PlanSnapshot, width: number, theme: PlanRenderTheme): string[] {
+  return renderPlanPresentation(presentPlan(plan), width, theme);
 }
 
-function stepGlyph(item: PlanStep, theme: PlanRenderTheme): string {
-  switch (item.status) {
-    case "completed": return theme.fg("success", "✓");
-    case "in_progress": return theme.fg("accent", "●");
-    case "blocked": return theme.fg("warning", "!");
-    case "pending": return theme.fg("dim", "○");
-  }
+export function renderFullPlan(plan: PlanSnapshot, width: number, theme: PlanRenderTheme, selectedIndex = -1): string[] {
+  return renderPlanPresentation(presentPlan(plan), width, theme, true, selectedIndex);
 }
 
-function stepText(item: PlanStep, theme: PlanRenderTheme): string {
-  if (item.status === "completed" || item.status === "pending") return theme.fg("muted", item.step);
-  if (item.status === "blocked") return theme.fg("warning", `BLOCKED · ${item.step}`);
-  return item.step;
+export function createFullPlanComponent(plan: PlanSnapshot, theme: PlanRenderTheme, onClose: () => void): Component {
+  return createPlanPresentationComponent(presentPlan(plan), theme, onClose);
 }
-
-function rule(label: string, width: number): string {
-  const size = Math.max(1, Math.floor(width));
-  if (!label) return "━".repeat(size);
-  const prefix = `━━ ${label} `;
-  return prefix + "━".repeat(Math.max(0, size - prefix.length));
-}

package/node_modules/pi-better-plan/src/workflow-plan.ts

@@ -1,7 +1,10 @@
 import { readFileSync, realpathSync, statSync } from "node:fs";
 import { basename, dirname, isAbsolute, relative, resolve, sep } from "node:path";
 import type { Component } from "@earendil-works/pi-tui";
-import { matchesKey, truncateToWidth } from "@earendil-works/pi-tui";
+import {
+  createPlanPresentationComponent, plainPlanTheme, planText, renderPlanPresentation, statusStyle,
+  type DisplayStatus, type PlanPresentation,
+} from "./plan-presentation.js";
 
 export const WORKFLOW_PLAN_ENTRY = "pi-better-workflow-plan";
 
@@ -98,29 +101,58 @@ export function workflowBinding(entries: Iterable<{ type: string; customType?: s
   return binding;
 }
 
-export function renderRushPlan(plan: RushPlan, width: number, full = false): string[] {
-  const completed = plan.issues.filter((unit) => unit.status === "succeeded").length;
-  const lines = [`rush-issues  rev ${plan.planRevision}  ${completed}/${plan.issues.length} units${plan.spec?.title ? `  ${plan.spec.title}` : ""}`];
-  const fleet = ["explore", "combine", "canary", "review", "cicd"]
-    .map((stage) => `${stage}: ${stage === "canary" && !plan.warehouseCanaryRequired ? "n/a" : plan.fleet[stage]?.status ?? "pending"}`);
-  lines.push(`fleet  ${fleet.join("  ")}`);
-  for (const unit of plan.issues) {
-    const marker = unit.status === "succeeded" ? "✓" : unit.status === "blocked" ? "!" : unit.status === "pending" ? "○" : "●";
-    lines.push(`${marker} #${unit.id} ${unit.title}  [${unit.stage} · ${unit.status}${unit.worker !== undefined ? ` · worker ${unit.worker}` : ""}]`);
-    if (full) {
-      if (unit.dependsOn.length) lines.push(`    after: ${unit.dependsOn.map((id) => `#${id}`).join(", ")}`);
-      if (unit.note) lines.push(`    ${unit.note}`);
-    }
+function workflowStatus(status: string): DisplayStatus {
+  switch (status) {
+    case "succeeded": case "completed": return "completed";
+    case "in-flight": case "in_progress": case "running": case "diagnosing": return "in_progress";
+    case "pending": return "pending";
+    case "blocked": return "blocked";
+    case "failed": return "failed";
+    case "skipped": case "not-applicable": case "cancelled": return "skipped";
+    default: return "unknown";
   }
-  return lines.map((line) => truncateToWidth(line, Math.max(1, width)));
 }
 
-export function createRushPlanComponent(plan: RushPlan, onClose: () => void): Component {
+function presentRushPlan(plan: RushPlan): PlanPresentation {
+  const fleet = ["explore", "combine", "canary", "review", "cicd"].map((stage) => {
+    const status = stage === "canary" && !plan.warehouseCanaryRequired
+      ? "not-applicable" : plan.fleet[stage]?.status ?? "pending";
+    const display = workflowStatus(status);
+    const style = statusStyle(display);
+    return { color: style.color, text: `  ${stage} ${style.glyph}${display === "unknown" ? ` ${planText(status)}` : ""}` };
+  });
+  const metadata = [[{ color: "dim", text: `rush-issues · rev ${plan.planRevision}  ·` }, ...fleet]];
+  if (plan.spec?.title) metadata.push([{ color: "dim", text: plan.spec.title }]);
   return {
-    render: (width) => renderRushPlan(plan, width, true),
-    handleInput(data) {
-      if (matchesKey(data, "escape") || matchesKey(data, "left") || matchesKey(data, "ctrl+c")) onClose();
-    },
-    invalidate() {},
+    metadata,
+    rows: plan.issues.map((unit) => {
+      const status = workflowStatus(unit.status);
+      const details = [`${unit.stage} · ${unit.status}${unit.worker !== undefined ? ` · worker ${unit.worker}` : ""}`];
+      if (unit.dependsOn.length) details.push(`after: ${unit.dependsOn.map((id) => `#${id}`).join(", ")}`);
+      if (unit.note) details.push(unit.note);
+      return {
+        label: `#${unit.id}`, title: unit.title, status, details,
+        ...(status === "unknown" || unit.status === "cancelled" ? { statusLabel: unit.status } : {}),
+      };
+    }),
   };
+}
+
+export function renderRushPlan(
+  plan: RushPlan,
+  width: number,
+  full = false,
+  fg?: (color: string, value: string) => string,
+): string[] {
+  const theme = fg ? { fg } : plainPlanTheme;
+  return renderPlanPresentation(presentRushPlan(plan), width, theme, full);
+}
+
+export function createRushPlanComponent(
+  plan: RushPlan,
+  onClose: () => void,
+  fg?: (color: string, value: string) => string,
+): Component {
+  const theme = fg ? { fg } : plainPlanTheme;
+  return createPlanPresentationComponent(presentRushPlan(plan), theme, onClose);
 }

package/node_modules/pi-better-subagents/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-better-subagents",
-  "version": "0.1.30",
+  "version": "0.1.31",
   "description": "Pi extension for detached, sandboxed subagent runs that keep the foreground session free.",
   "license": "MIT",
   "type": "module",

package/node_modules/pi-better-subagents/shared-navigator.ts

@@ -1,4 +1,5 @@
 import type { ExtensionContext } from "@earendil-works/pi-coding-agent";
+import { truncateToWidth as piTruncateToWidth, visibleWidth as piVisibleWidth } from "@earendil-works/pi-tui";
 import type { Component } from "@earendil-works/pi-tui";
 import { createRenderScheduler, type RenderScheduler } from "./shared-render-scheduler.ts";
 
@@ -280,10 +281,10 @@ function refreshMainListWidget(): void {
   }) : undefined;
   const changed = nextSignature !== s.lastMainListSignature;
   s.lastMainListSignature = nextSignature;
-  s.lastMainListLines = rows.length ? buildMainListLines(rows, MAIN_LIST_FALLBACK_WIDTH, deps.truncate, themeFg(ctx), {
+  s.lastMainListLines = rows.length ? ["", ...buildMainListLines(rows, MAIN_LIST_FALLBACK_WIDTH, deps.truncate, themeFg(ctx), {
     selectedId: s.mainListFocused ? s.mainListSelectedId : undefined,
     focused: s.mainListFocused === true,
-  }) : undefined;
+  })] : undefined;
   if (!rows.length) {
     if (!s.mainListWidgetInstalled) return;
     try { (ctx.ui as any).setWidget?.(MAIN_LIST_WIDGET_KEY, undefined); } catch { /* ignore */ }
@@ -323,10 +324,10 @@ function createMainListWidget(tui: { requestRender?(): void }, theme: unknown, d
         state().lastMainListLines = undefined;
         return [];
       }
-      const lines = buildMainListLines(rows, renderWidth(width), deps.truncate, themeFgFromTheme(theme), {
+      const lines = ["", ...buildMainListLines(rows, renderWidth(width), deps.truncate, themeFgFromTheme(theme), {
         selectedId: state().mainListFocused ? state().mainListSelectedId : undefined,
         focused: state().mainListFocused === true,
-      });
+      })];
       state().lastMainListLines = lines;
       return lines;
     },
@@ -1269,7 +1270,8 @@ export function wrapLogText(text: string, width: number): string[] {
       continue;
     }
     const sourceIndent = source.match(/^[ \t]*/)?.[0] ?? "";
-    const indent = sourceIndent.replace(/\t/g, "  ");
+    // Leave room for a full-width grapheme even on deeply indented log lines.
+    const indent = sourceIndent.replace(/\t/g, "  ").slice(0, max - 2);
     let remaining = source.slice(sourceIndent.length);
     const contentWidth = Math.max(1, max - visibleWidth(indent));
     if (!remaining) {
@@ -1302,33 +1304,25 @@ function lastDelimiterBreak(value: string): number {
   return last;
 }
 
+const GRAPHEME_SEGMENTER = new Intl.Segmenter(undefined, { granularity: "grapheme" });
+
 function splitVisiblePrefix(value: string, width: number): [string, string] {
   const max = Math.max(0, Math.floor(width));
   let visible = 0;
-  let index = 0;
-  while (index < value.length && visible < max) {
-    if (value[index] === "\u001b" || value[index] === "\u009b") {
-      const match = value.slice(index).match(ANSI_RE);
-      if (match?.index === 0) {
-        index += match[0].length;
-        continue;
-      }
-    }
-    if (value[index] === "<") {
-      const close = value.indexOf(">", index);
-      if (close !== -1) {
-        const tag = value.slice(index, close + 1);
-        if (/^<\/?[a-zA-Z][\w-]*>$/.test(tag) || tag === "</>") {
-          index = close + 1;
-          continue;
-        }
-      }
+  let end = 0;
+  for (const { segment, index } of GRAPHEME_SEGMENTER.segment(value)) {
+    if (index < end) continue;
+    const formatting = value.slice(index).match(FORMATTING_PREFIX_RE);
+    if (formatting) {
+      end = index + formatting[0].length;
+      continue;
     }
-    const codePoint = value.codePointAt(index)!;
-    index += codePoint > 0xFFFF ? 2 : 1;
-    visible += 1;
+    const cells = piVisibleWidth(segment);
+    if (visible + cells > max) break;
+    visible += cells;
+    end = index + segment.length;
   }
-  return [value.slice(0, index), value.slice(index)];
+  return [value.slice(0, end), value.slice(end)];
 }
 
 function cycleLogTailRows(current: number): number {
@@ -1387,44 +1381,19 @@ function safeTruncate(line: string, width: number, truncate: (s: string, width:
 
 const ANSI_RE = new RegExp("[\\u001B\\u009B][[\\]()#;?]*(?:(?:(?:[a-zA-Z\\d]*(?:;[a-zA-Z\\d]*)*)?\\u0007)|(?:(?:\\d{1,4}(?:;\\d{0,4})*)?[\\dA-PR-TZcf-ntqry=><~]))", "g");
 
+const FORMATTING_PREFIX_RE = new RegExp(`^(?:${ANSI_RE.source}|<\\/?[a-zA-Z][\\w-]*>|</>)`);
+
 function visibleWidth(value: string): number {
-  return String(value ?? "")
+  const cleaned = String(value ?? "")
     .replace(ANSI_RE, "")
     .replace(/<\/?[a-zA-Z][\w-]*>/g, "")
-    .replace(/<\/>/g, "")
-    .length;
+    .replace(/<\/>/g, "");
+  return piVisibleWidth(cleaned);
 }
 
 function truncateVisible(value: string, width: number): string {
   const str = String(value ?? "");
   const max = Math.max(0, Math.floor(width || 0));
   if (visibleWidth(str) <= max) return str;
-  let out = "";
-  let vis = 0;
-  let i = 0;
-  while (i < str.length && vis < max) {
-    if (str[i] === "\u001b" || str[i] === "\u009b") {
-      const match = str.slice(i).match(ANSI_RE);
-      if (match && match.index === 0) {
-        out += match[0];
-        i += match[0].length;
-        continue;
-      }
-    }
-    if (str[i] === "<") {
-      const close = str.indexOf(">", i);
-      if (close !== -1) {
-        const tag = str.slice(i, close + 1);
-        if (/^<\/?[a-zA-Z][\w-]*>$/.test(tag) || tag === "</>") {
-          out += tag;
-          i = close + 1;
-          continue;
-        }
-      }
-    }
-    out += str[i];
-    vis += 1;
-    i += 1;
-  }
-  return out;
+  return piTruncateToWidth(str, max);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-better-harness",
-  "version": "0.3.16",
+  "version": "0.3.18",
   "description": "Pi extension bundle for a write sandbox, subagents, background tasks, SSH, goals, and structured plans.",
   "license": "MIT",
   "type": "module",
@@ -50,12 +50,12 @@
     "test": "node --test test/*.test.mjs"
   },
   "dependencies": {
-    "pi-better-background-tasks": "0.2.14",
+    "pi-better-background-tasks": "0.2.15",
     "pi-better-goal": "0.4.0",
-    "pi-better-plan": "0.3.2",
+    "pi-better-plan": "0.3.4",
     "pi-better-sandbox": "0.3.0",
     "pi-better-ssh": "0.1.1",
-    "pi-better-subagents": "0.1.30",
+    "pi-better-subagents": "0.1.31",
     "yaml": "^2.9.1"
   },
   "bundledDependencies": [