@tt-a1i/openpi 0.4.0 → 0.5.0

package/extensions/subagents/src/manager.ts

@@ -27,6 +27,7 @@ import {
   Stream,
 } from "effect";
 import type { SubagentBackend, SubagentSession } from "./backend.ts";
+import type { AgentToolRenderer } from "../../shared/agent-tool-renderer.ts";
 import { BackendRegistry } from "./backend.ts";
 import type {
   BackendName,
@@ -63,7 +64,7 @@ const ENTRY_CLOSE_TIMEOUT_MS = 10_000;
  * First-response watchdog: a run whose provider accepts the request but
  * never emits an assistant event is settled as a failure so it cannot
  * occupy a concurrency slot forever. Matches the workflow runner's
- * FIRST_RESPONSE_TIMEOUT_MS (extensions/workflows/runner.ts).
+ * MODEL_PROGRESS_TIMEOUT_MS (extensions/workflows/runner.ts).
  */
 export const FIRST_RESPONSE_TIMEOUT_MS = 45_000;
 const ERROR_TEXT_MAX_LENGTH = 4_096;
@@ -92,6 +93,9 @@ function appendTranscript(snapshot: MutableSnapshot, item: TranscriptItem) {
       snapshot.transcript.length - MAX_TRANSCRIPT_ITEMS,
     );
   }
+  // Monotonic version so UI projections can detect transcript changes by
+  // O(1) comparison instead of scanning the mutable array.
+  snapshot.transcriptVersion++;
 }
 
 // --- Internal state -----------------------------------------------------------
@@ -105,12 +109,16 @@ interface MutableSnapshot {
   prompt: string;
   cwd: string;
   status: SubagentStatus;
+  outcome?: SubagentSnapshot["outcome"];
+  worktreeBranch?: string;
   createdAt: number;
   settledAt?: number;
   errorText?: string;
   meta: SubagentMeta;
   usage: { tokens?: number; contextWindow?: number };
   transcript: TranscriptItem[];
+  /** Bumped on every transcript mutation; UI caches key on this. */
+  transcriptVersion: number;
   liveAssistant?: { text: string; thinking: string };
   liveTools: LiveToolState[];
   queued: SubagentSnapshot["queued"];
@@ -137,6 +145,8 @@ interface Entry {
 export interface SubagentReadModel {
   list(): ReadonlyArray<SubagentSnapshot>;
   get(id: string): SubagentSnapshot | undefined;
+  /** Native tool projection retained by the live child session, when present. */
+  getToolRenderer?(id: string): AgentToolRenderer | undefined;
   size(): number;
   /** Any-change notification (footer status, dashboard). */
   subscribe(listener: () => void): () => void;
@@ -299,7 +309,20 @@ const makeManager = (config: SubagentManagerConfig = {}) =>
     };
 
     const closeEntryScope = (entry: Entry) =>
-      Scope.close(entry.scope, Exit.void).pipe(Effect.ignore);
+      Scope.close(entry.scope, Exit.void).pipe(
+        Effect.tap(() =>
+          Effect.sync(() => {
+            const receipt = entry.session.cleanupReceipt?.();
+            if (!receipt?.uncertain) return;
+            const current = entry.snapshot.errorText;
+            entry.snapshot.errorText = current
+              ? `${current}; ${receipt.message}`
+              : receipt.message;
+            notify(entry.snapshot.id);
+          }),
+        ),
+        Effect.ignore,
+      );
 
     const pruneSettled = () => {
       if (entries.size <= MAX_TRACKED) return;
@@ -337,11 +360,13 @@ const makeManager = (config: SubagentManagerConfig = {}) =>
       switch (outcome._tag) {
         case "Completed":
           s.status = "done";
+          s.outcome = "completed";
           s.errorText = undefined;
           s.finalText = outcome.finalText.slice(0, FINAL_TEXT_MAX_LENGTH);
           break;
         case "Failed":
           s.status = "error";
+          s.outcome = "failed";
           s.errorText = bounded(outcome.errorText);
           // Never let a failed run report the previous run's successful output.
           s.finalText = (outcome.partialText ?? "").slice(
@@ -351,6 +376,7 @@ const makeManager = (config: SubagentManagerConfig = {}) =>
           break;
         case "Interrupted":
           s.status = "error";
+          s.outcome = "interrupted";
           s.errorText = "Run was aborted";
           s.finalText = (outcome.partialText ?? "").slice(
             0,
@@ -417,6 +443,7 @@ const makeManager = (config: SubagentManagerConfig = {}) =>
         case "RunStarted":
           entry.restarting = false;
           s.status = "running";
+          s.outcome = undefined;
           s.settledAt = undefined;
           s.errorText = undefined;
           armWatchdog(entry);
@@ -578,10 +605,14 @@ const makeManager = (config: SubagentManagerConfig = {}) =>
               prompt: task.prompt,
               cwd: task.cwd,
               status: "running",
+              ...(task.worktree
+                ? { worktreeBranch: task.worktree.branch }
+                : {}),
               createdAt: Date.now(),
               meta,
               usage: { contextWindow: meta.contextWindow },
               transcript: [],
+              transcriptVersion: 0,
               liveTools: [],
               queued: [],
               finalText: "",
@@ -792,6 +823,7 @@ const makeManager = (config: SubagentManagerConfig = {}) =>
     const view: SubagentReadModel = {
       list: () => [...entries.values()].map((entry) => entry.snapshot),
       get: (id) => entries.get(id)?.snapshot,
+      getToolRenderer: (id) => entries.get(id)?.session.toolRenderer,
       size: () => entries.size,
       subscribe: (listener) => {
         listeners.add(listener);

package/extensions/subagents/src/prompt.ts

@@ -285,8 +285,11 @@ export const SUBAGENT_CHECK_PARAMETER_DESCRIPTIONS = {
 export const SUBAGENT_LIST_TOOL_DESCRIPTION =
   "List all subagents (running and finished) with their status.";
 
-/** Builds the child completion/failure wrapper injected into the parent model's context. */
-export function buildSubagentResultMessage(options: {
+const SUBAGENT_RESULT_TRANSPORT_INSTRUCTION =
+  "(This result is already shown to the user. Act on it and relay only the decisions or next steps — do not repeat it verbatim.)";
+
+/** Builds the user-visible child completion/failure projection. */
+export function buildSubagentResultDisplayMessage(options: {
   id: string;
   title: string;
   status: "running" | "done" | "error";
@@ -297,9 +300,34 @@ export function buildSubagentResultMessage(options: {
   let text = `Subagent ${options.id} "${options.title}" ${verb}.`;
   if (options.errorText) text += `\nError: ${options.errorText}`;
   text += `\n\n${options.output}`;
+  return text;
+}
+
+/** Builds the child completion/failure wrapper injected into the parent model's context. */
+export function buildSubagentResultMessage(options: {
+  id: string;
+  title: string;
+  status: "running" | "done" | "error";
+  errorText?: string;
+  output: string;
+}) {
+  let text = buildSubagentResultDisplayMessage(options);
   // This message is already displayed to the user, so tell the parent to act on
   // it rather than reprint it verbatim.
-  text +=
-    "\n\n(This result is already shown to the user. Act on it and relay only the decisions or next steps — do not repeat it verbatim.)";
+  text += `\n\n${SUBAGENT_RESULT_TRANSPORT_INSTRUCTION}`;
   return text;
 }
+
+/** Remove the transport-only suffix from results persisted before the split. */
+export function stripSubagentResultTransportInstruction(content: string) {
+  const separator = `\n\n${SUBAGENT_RESULT_TRANSPORT_INSTRUCTION}`;
+  const withoutBatchedSeparators = content.replaceAll(
+    `${separator}\n\nSubagent `,
+    "\n\nSubagent ",
+  );
+  return (
+    withoutBatchedSeparators.endsWith(separator)
+      ? withoutBatchedSeparators.slice(0, -separator.length)
+      : withoutBatchedSeparators
+  ).trimEnd();
+}

package/extensions/subagents/src/result-artifact.ts

@@ -20,6 +20,7 @@ export interface ResultProjection {
   readonly text: string;
   readonly truncated: boolean;
   readonly artifactPath?: string;
+  readonly artifactSaveFailed?: boolean;
 }
 
 function sliceStartToUtf8Bytes(content: string, maxBytes: number) {
@@ -96,11 +97,13 @@ export function projectResult(
   const tailLines = Math.max(1, options.maxLines - headLines);
 
   let artifactPath: string | undefined;
+  let artifactSaveFailed = false;
   try {
     artifactPath = options.writeArtifact(content);
   } catch {
     // Delivery is more important than the optional recovery cache. The footer
     // below stays explicit so a failed write never advertises a false path.
+    artifactSaveFailed = true;
   }
 
   let bodyBudget = options.maxBytes;
@@ -138,5 +141,6 @@ export function projectResult(
     text,
     truncated: true,
     ...(artifactPath ? { artifactPath } : {}),
+    ...(artifactSaveFailed ? { artifactSaveFailed: true } : {}),
   };
 }

package/extensions/subagents/src/result-delivery.ts

@@ -1,3 +1,5 @@
+import type { ConsumableResultDeliveryQueue } from "../../shared/result-delivery.ts";
+
 export interface SubagentResultDeliveryOptions<T> {
   /** True only when the parent has no run or queued continuation in flight. */
   readonly isIdle: () => boolean;
@@ -46,7 +48,7 @@ export function createSubagentResultDelivery<T extends { id: string }>(
     }
   };
 
-  return {
+  const queue = {
     defer(result: T) {
       pending.set(result.id, result);
       if (options.isIdle()) flush();
@@ -61,5 +63,9 @@ export function createSubagentResultDelivery<T extends { id: string }>(
     clear() {
       pending.clear();
     },
+    size() {
+      return pending.size;
+    },
   };
+  return queue satisfies ConsumableResultDeliveryQueue<T>;
 }

package/extensions/subagents/src/runtime.ts

@@ -11,8 +11,22 @@ import { BackendRegistry, type SubagentBackend } from "./backend.ts";
 import { piBackend } from "./backends/pi.ts";
 import type { BackendName } from "./domain.ts";
 
+/**
+ * Test-only injection seam for extension-level tests that drive real spawns
+ * without a child pi session: production never sets it. The underscore-prefixed
+ * setter name makes any accidental production use self-evidently wrong.
+ */
+let testBackends: readonly SubagentBackend[] | undefined;
+
+/** Test-only: replace the backends the manager can spawn against. */
+export function __setSubagentTestBackends(
+  backends: readonly SubagentBackend[] | undefined,
+) {
+  testBackends = backends;
+}
+
 const BackendRegistryLive = Layer.sync(BackendRegistry, () => {
-  const backends: SubagentBackend[] = [piBackend];
+  const backends: readonly SubagentBackend[] = testBackends ?? [piBackend];
   return new Map<BackendName, SubagentBackend>(
     backends.map((backend) => [backend.name, backend]),
   );

package/extensions/subagents/src/ui/takeover.ts

@@ -2,8 +2,8 @@
  * Takeover UI for subagents (ported from v1, rendering from the synchronous
  * SubagentReadModel instead of live pi sessions):
  * - SubagentDashboard: compact picker docked above the input, listing all subagents.
- * - TakeoverView: full interactive view of one subagent with an input line
- *   to steer/continue it.
+ * - TakeoverView: full read-only view of one subagent; steering remains owned
+ *   by the parent model through the subagent tools.
  */
 
 import type {
@@ -12,22 +12,15 @@ import type {
   Theme,
 } from "@earendil-works/pi-coding-agent";
 import type { Component, Focusable, TUI } from "@earendil-works/pi-tui";
-import { Input, truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
-import {
-  hintLine,
-  panelFrame,
-  type ScreenHint,
-} from "../../../shared/screen-chrome.ts";
+import { truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
+import { AgentSessionPage } from "../../../shared/agent-session-page.ts";
+import { hintLine, panelFrame } from "../../../shared/screen-chrome.ts";
 import { sanitizeTerminalText } from "../../../shared/terminal-text.ts";
 import { formatElapsed, type SubagentSnapshot } from "../domain.ts";
 import { formatContextUtilization } from "../../../shared/context-utilization.ts";
+import { SPINNER_INTERVAL_MS, spinnerFrame } from "../../../shared/spinner.ts";
 import type { SubagentReadModel } from "../manager.ts";
-import {
-  buildTranscriptLines,
-  SPINNER_INTERVAL_MS,
-  spinnerFrame,
-  TranscriptRenderer,
-} from "./transcript.ts";
+import { subagentTranscriptDocument } from "./transcript.ts";
 
 export function sanitizeSubagentDisplayLine(value: string) {
   return sanitizeTerminalText(value).replace(/\s+/g, " ").trim();
@@ -43,7 +36,7 @@ function configuredKeys(
 /**
  * One spinner definition for the whole subagent UI: the dashboard glyph, the
  * takeover header, and the transcript's live tools must animate in step, so the
- * frames and their cadence live in `transcript.ts` and are imported here.
+ * frames and their cadence live in `shared/spinner.ts` and are imported here.
  */
 function statusGlyph(
   snap: SubagentSnapshot,
@@ -69,6 +62,8 @@ function statusGlyph(
 
 export interface TakeoverOptions {
   readonly badge?: string;
+  /** Captured from the parent UI when this child page opens. */
+  readonly toolsExpanded?: boolean;
 }
 
 export async function openSubagentTakeover(
@@ -78,12 +73,24 @@ export async function openSubagentTakeover(
   options?: TakeoverOptions,
 ) {
   if (!view.get(id)) return;
+  const takeoverOptions: TakeoverOptions = {
+    ...options,
+    toolsExpanded: ctx.ui.getToolsExpanded(),
+  };
   await ctx.ui.custom<null>(
     (tui, theme, keybindings, done) =>
-      new TakeoverView(tui, theme, keybindings, id, view, done, options),
+      new TakeoverView(
+        tui,
+        theme,
+        keybindings,
+        id,
+        view,
+        done,
+        takeoverOptions,
+      ),
     {
       overlay: true,
-      overlayOptions: { anchor: "center", width: "100%", maxHeight: "100%" },
+      overlayOptions: { anchor: "top-left", width: "100%", maxHeight: "100%" },
     },
   );
 }
@@ -387,33 +394,18 @@ export class SubagentDashboard implements Component {
 
 // --- Takeover view ------------------------------------------------------------
 
-const TRANSCRIPT_SCROLL_STEP = 6;
-
 export class TakeoverView implements Component, Focusable {
-  private tui: TUI;
-  private theme: Theme;
-  private keybindings: KeybindingsManager;
-  private id: string;
-  private view: SubagentReadModel;
-  private done: (value: null) => void;
-  private options?: TakeoverOptions;
-
-  private input = new Input();
-  private transcriptRenderer = new TranscriptRenderer();
-  /** Scroll offset in lines from the bottom of the transcript. 0 = pinned to bottom. */
-  private scrollOffset = 0;
+  private page: AgentSessionPage;
   private unsubscribe: () => void;
   private renderTimer?: ReturnType<typeof setTimeout>;
   private ticker?: ReturnType<typeof setInterval>;
   private closed = false;
 
-  private _focused = false;
-  get focused(): boolean {
-    return this._focused;
+  get focused() {
+    return this.page.focused;
   }
   set focused(value: boolean) {
-    this._focused = value;
-    this.input.focused = value;
+    this.page.focused = value;
   }
 
   constructor(
@@ -425,46 +417,58 @@ export class TakeoverView implements Component, Focusable {
     done: (value: null) => void,
     options?: TakeoverOptions,
   ) {
-    this.tui = tui;
-    this.theme = theme;
-    this.keybindings = keybindings;
-    this.id = id;
-    this.view = view;
-    this.done = done;
-    this.options = options;
+    this.page = new AgentSessionPage(
+      tui,
+      theme,
+      keybindings,
+      {
+        getState: () => {
+          const snap = view.get(id);
+          if (!snap) return undefined;
+          return {
+            id: snap.id,
+            title: snap.title,
+            status: snap.status,
+            document: subagentTranscriptDocument(
+              snap,
+              view.getToolRenderer?.(id),
+            ),
+            metadata: [
+              options?.badge,
+              snap.meta.modelLabel,
+              formatContextUtilization(snap.usage),
+              formatElapsed(snap),
+            ],
+            errorText: snap.errorText,
+          };
+        },
+        close: () => this.close(done),
+        abort: () => view.requestAbort(id),
+      },
+      { toolsExpanded: options?.toolsExpanded },
+    );
     this.unsubscribe = view.subscribeTo(id, () => {
-      this.refreshTicker();
-      this.scheduleRender();
+      this.refreshTicker(view.get(id), tui);
+      this.scheduleRender(tui);
     });
-    this.refreshTicker();
-    this.input.onSubmit = (value: string) => {
-      const text = value.trim();
-      if (!text) return;
-      this.input.setValue("");
-      this.view.requestSend(this.id, text);
-      this.scrollOffset = 0;
-      this.tui.requestRender();
-    };
+    this.refreshTicker(view.get(id), tui);
   }
 
-  private snap(): SubagentSnapshot | undefined {
-    return this.view.get(this.id);
-  }
-
-  private refreshTicker() {
-    const interval =
-      this.snap()?.status === "running" ? SPINNER_INTERVAL_MS : 1000;
+  private refreshTicker(snap: SubagentSnapshot | undefined, tui: TUI) {
     if (this.ticker) clearInterval(this.ticker);
-    this.ticker = setInterval(() => this.tui.requestRender(), interval);
+    this.ticker = undefined;
+    if (snap?.status === "running") {
+      this.ticker = setInterval(() => tui.requestRender(), SPINNER_INTERVAL_MS);
+    }
   }
 
-  private scheduleRender() {
+  private scheduleRender(tui: TUI) {
     if (this.renderTimer) return;
     // Streaming can emit an event per token. Limit terminal repaints so this
     // view cannot starve input handling or make the child look frozen.
     this.renderTimer = setTimeout(() => {
       this.renderTimer = undefined;
-      if (!this.closed) this.tui.requestRender();
+      if (!this.closed) tui.requestRender();
     }, 50);
   }
 
@@ -478,8 +482,8 @@ export class TakeoverView implements Component, Focusable {
     return true;
   }
 
-  private close() {
-    if (this.cleanup()) this.done(null);
+  private close(done: (value: null) => void) {
+    if (this.cleanup()) done(null);
   }
 
   dispose(): void {
@@ -487,202 +491,14 @@ export class TakeoverView implements Component, Focusable {
   }
 
   handleInput(data: string): void {
-    if (this.keybindings.matches(data, "app.clear")) {
-      const snap = this.snap();
-      if (snap?.status === "running") this.view.requestAbort(this.id);
-      return;
-    }
-    if (
-      this.keybindings.matches(data, "app.interrupt") ||
-      this.keybindings.matches(data, "tui.select.cancel")
-    ) {
-      this.close();
-      return;
-    }
-    if (this.keybindings.matches(data, "tui.editor.cursorUp")) {
-      this.scrollOffset += TRANSCRIPT_SCROLL_STEP;
-      this.tui.requestRender();
-      return;
-    }
-    if (this.keybindings.matches(data, "tui.editor.cursorDown")) {
-      this.scrollOffset = Math.max(
-        0,
-        this.scrollOffset - TRANSCRIPT_SCROLL_STEP,
-      );
-      this.tui.requestRender();
-      return;
-    }
-    if (this.keybindings.matches(data, "tui.editor.pageUp")) {
-      this.scrollOffset += this.viewportHeight();
-      this.tui.requestRender();
-      return;
-    }
-    if (this.keybindings.matches(data, "tui.editor.pageDown")) {
-      this.scrollOffset = Math.max(
-        0,
-        this.scrollOffset - this.viewportHeight(),
-      );
-      this.tui.requestRender();
-      return;
-    }
-    this.input.handleInput(data);
-    this.tui.requestRender();
-  }
-
-  private viewportHeight(): number {
-    const rows = this.tui.terminal.rows || 30;
-    // Top rule, transcript rule, input, key hints, and bottom rule are five
-    // chrome rows. The overlay leaves Pi's final footer row visible.
-    return Math.max(1, rows - 6);
-  }
-
-  private rule(width: number, left = "", right = "") {
-    const fill = "─";
-    const available = Math.max(1, width);
-    const leftWidth = visibleWidth(left);
-    const rightWidth = visibleWidth(right);
-    if (!right || leftWidth + rightWidth + 2 > available) {
-      return truncateToWidth(
-        left + fill.repeat(Math.max(0, available - leftWidth)),
-        available,
-      );
-    }
-    return (
-      left +
-      fill.repeat(Math.max(1, available - leftWidth - rightWidth)) +
-      right
-    );
+    this.page.handleInput(data);
   }
 
   render(width: number): string[] {
-    const theme = this.theme;
-    const now = Date.now();
-    const lines: string[] = [];
-    const snap = this.snap();
-
-    if (!snap) {
-      const border = theme.fg("borderAccent", "─".repeat(Math.max(1, width)));
-      lines.push(
-        border,
-        theme.fg("dim", `${this.id} is no longer tracked`),
-        border,
-      );
-      return lines;
-    }
-
-    const title = sanitizeSubagentDisplayLine(snap.title) || snap.id;
-    const headerLeft =
-      theme.fg("borderAccent", "─ ") +
-      statusGlyph(snap, theme, now) +
-      " " +
-      theme.fg("accent", theme.bold(title)) +
-      theme.fg("borderAccent", " ");
-    const utilization = formatContextUtilization(snap.usage);
-    const metadata = [
-      ...(this.options?.badge
-        ? [theme.fg("muted", sanitizeSubagentDisplayLine(this.options.badge))]
-        : []),
-      theme.fg(
-        "muted",
-        sanitizeSubagentDisplayLine(snap.meta.modelLabel ?? "?") || "?",
-      ),
-      ...(utilization ? [theme.fg("muted", utilization)] : []),
-      theme.fg("muted", formatElapsed(snap)),
-    ];
-    const dot = theme.fg("dim", " · ");
-    while (
-      metadata.length > 1 &&
-      visibleWidth(headerLeft) + visibleWidth(metadata.join(dot)) + 2 > width
-    ) {
-      metadata.shift();
-    }
-    lines.push(
-      this.rule(
-        width,
-        truncateToWidth(
-          headerLeft,
-          Math.max(1, width - visibleWidth(metadata.join(dot)) - 2),
-        ),
-        metadata.join(dot),
-      ),
-    );
-
-    // Fixed-height transcript viewport. Errors consume a row, but scroll state
-    // is represented by the following rule so its height never changes.
-    // `now` is shared with the header glyph so both spinners show one frame.
-    const transcript = buildTranscriptLines(
-      snap,
-      width,
-      theme,
-      this.transcriptRenderer,
-      { now },
-    );
-    const viewport = this.viewportHeight();
-    const errorRows = snap.errorText ? 1 : 0;
-    const transcriptCapacity = Math.max(1, viewport - errorRows);
-    const maxOffset = Math.max(0, transcript.length - transcriptCapacity);
-    if (this.scrollOffset > maxOffset) this.scrollOffset = maxOffset;
-
-    const body: string[] = [];
-    if (snap.errorText) {
-      body.push(
-        truncateToWidth(
-          theme.fg(
-            "error",
-            `error: ${sanitizeSubagentDisplayLine(snap.errorText)}`,
-          ),
-          width,
-        ),
-      );
-    }
-    const end = transcript.length - this.scrollOffset;
-    const visible = transcript.slice(
-      Math.max(0, end - Math.max(1, viewport - body.length)),
-      end,
-    );
-    if (visible.length === 0) body.push(theme.fg("dim", "waiting for output…"));
-    else body.push(...visible);
-    while (body.length < viewport) body.push("");
-    lines.push(...body.slice(0, viewport));
-
-    lines.push(
-      this.rule(
-        width,
-        theme.fg("borderAccent", "─"),
-        this.scrollOffset > 0 ? theme.fg("dim", `↓ ${this.scrollOffset}`) : "",
-      ),
-    );
-    lines.push(...this.input.render(width));
-    const keys = (binding: Parameters<KeybindingsManager["getKeys"]>[0]) =>
-      configuredKeys(this.keybindings, binding);
-    const editing: ScreenHint[] = [
-      [keys("tui.input.submit"), "send"],
-      [keys("app.interrupt"), "back"],
-      [keys("app.clear"), "abort run"],
-      [
-        `${keys("tui.editor.cursorUp")}/${keys("tui.editor.cursorDown")}`,
-        "scroll",
-      ],
-    ];
-    // Same drop-the-page-hint fallback as before, measured on the styled line
-    // so the keys-brighter-than-labels styling cannot change what fits.
-    const full = hintLine(
-      theme,
-      [
-        ...editing,
-        [`${keys("tui.editor.pageUp")}/${keys("tui.editor.pageDown")}`, "page"],
-      ],
-      width,
-    );
-    lines.push(
-      visibleWidth(full) <= width ? full : hintLine(theme, editing, width),
-    );
-    lines.push(this.rule(width, theme.fg("borderAccent", "─")));
-    return lines;
+    return this.page.render(width);
   }
 
   invalidate(): void {
-    this.input.invalidate();
-    this.transcriptRenderer.invalidate();
+    this.page.invalidate();
   }
 }