openshain 0.3.1 → 0.4.0

package/src/tui/controller.ts

@@ -1,4 +1,12 @@
-import { connectInMemory, createSession, type Session, type TurnResult } from "@openshain/agent";
+import {
+  type ApprovalAnswer,
+  type ApprovalChoice,
+  connectInMemory,
+  createSession,
+  type HeldApproval,
+  type Session,
+  type TurnResult,
+} from "@openshain/agent";
 import {
   type Event,
   loadConfig,
@@ -10,8 +18,9 @@ import {
 import { createMcpServer } from "@openshain/mcp";
 import { toolsList } from "../commands/tools.ts";
 import { workList, workShow } from "../commands/work.ts";
-import { plain } from "../format.ts";
+import { describeInput, plain } from "../format.ts";
 import { statusLabel } from "../labels.ts";
+import { type PreviewLine, previewCall } from "../preview.ts";
 import { progressLine, report } from "../report.ts";
 import { LOGO_ROWS, VERSION } from "./banner.ts";
 
@@ -41,6 +50,19 @@ export interface ControllerState {
   busy: boolean;
   /** A question a work is asking; the next line the person types answers it. */
   question?: string;
+  /** A call held for approval; the person picks one of its choices before the work goes on. */
+  approval?: {
+    approvalId: string;
+    title: string;
+    ruleId: string;
+    preview: PreviewLine[];
+    choices: { key: ApprovalChoice | "reject_with_reason"; label: string }[];
+    at: number;
+  };
+  /** After "no, and tell the agent why": the next line the person types is that reason. */
+  reason?: string;
+  /** Lines typed while the screen was busy. They are sent in order once it is free. */
+  queued: string[];
   closed: boolean;
   status: {
     company: string;
@@ -60,6 +82,10 @@ export interface Controller {
   submit(line: string): Promise<void>;
   /** Ctrl-C: stops the running work, taking back a question it waits on; false when nothing was running. */
   interrupt(): boolean;
+  /** Moves the highlight in the approval choices. */
+  moveApproval(delta: number): void;
+  /** Answers the approval being shown: the highlighted choice, or the one given. */
+  decideApproval(choice?: ApprovalChoice | "reject_with_reason"): void;
   /** Stops whatever is running, then ends the session. A second call waits for the same close. */
   close(): Promise<void>;
 }
@@ -73,6 +99,9 @@ const HELP = [
   "/work list         Work の一覧",
   "/work show <id>    Work の詳細",
   "/work resume <id>  止まった Work を候補にする。次の依頼がそれに沿えば続ける",
+  "/approvals         承認待ちの一覧",
+  "/approve <id>      承認して実行する。/reject <id> [理由] で拒否する",
+  "/review <id> approve|reject  資格者の判断を記録する。名前と本文を順に聞く",
   "/tools             使える Tool",
   "/quit              終わる",
   "↑ ↓                前に送った行を入力欄に呼び戻す。いちばん下は新しい入力",
@@ -81,10 +110,21 @@ const HELP = [
   "Ctrl-C             動いている Work を止める。質問待ちなら質問を取り下げる。何も動いていなければ終わる",
 ];
 
+/** The choices the screen offers for a held call, in the order they are shown. */
+const APPROVAL_CHOICES: { key: ApprovalChoice | "reject_with_reason"; label: string }[] = [
+  { key: "approve", label: "はい。実行する" },
+  { key: "always", label: "はい。この会話では同じ規則の呼び出しを常に承認する" },
+  { key: "reject", label: "いいえ。実行しない" },
+  { key: "reject_with_reason", label: "いいえ。理由を伝えて実行しない" },
+];
+
 /** What the session's model hears when the person stops a work that waits for their answer. */
 const QUESTION_WITHDRAWN =
   "the person stopped the work while it waited for their answer; the question is still pending and the work can be resumed";
 
+/** What the loop hears when the person leaves a held call undecided. */
+const APPROVAL_WITHDRAWN = "the person left the approval undecided";
+
 /**
  * The state behind the screen: a session, the works it starts, and the lines to show. The
  * conversation reaches the runtime only as an MCP client of the workspace's own server, the way
@@ -121,6 +161,7 @@ export async function createController(options: ControllerOptions): Promise<Cont
     entries: [],
     busy: false,
     closed: false,
+    queued: [],
     status: {
       company: config.company.name,
       model: `${config.model.provider}/${config.model.model}`,
@@ -151,11 +192,23 @@ export async function createController(options: ControllerOptions): Promise<Cont
   };
 
   let pending: { resolve: (text: string) => void; reject: (reason: Error) => void } | undefined;
+  let deciding:
+    | { resolve: (answer: ApprovalAnswer) => void; reject: (reason: Error) => void }
+    | undefined;
   let aborter: AbortController | undefined;
   let running: Promise<void> | undefined;
   let closing: Promise<void> | undefined;
   const names = new Map<string, string>();
 
+  /** Asks the person for one line and waits for it. The next line they type is the answer. */
+  const askLine = (question: string): Promise<string> => {
+    state.question = question;
+    push("question", question);
+    notify();
+    return new Promise((resolve, reject) => {
+      pending = { resolve, reject };
+    });
+  };
   const ask = (workId: WorkId, question: string): Promise<string> => {
     state.question = question;
     push("question", `${question}(${workId})`);
@@ -163,6 +216,51 @@ export async function createController(options: ControllerOptions): Promise<Cont
       pending = { resolve, reject };
     });
   };
+  /** Shows a held call and waits for the person to pick one of the choices. */
+  const askApproval = async (approval: HeldApproval): Promise<ApprovalAnswer> => {
+    const preview = await previewCall(workspaceRoot, {
+      name: approval.name,
+      input: approval.input,
+    }).catch((err) => [{ kind: "note", text: message(err) } as PreviewLine]);
+    const title = `${approval.name} ${describeInput(approval.input)}`.trimEnd();
+    state.approval = {
+      approvalId: approval.approvalId,
+      title,
+      ruleId: approval.ruleId,
+      preview,
+      choices: APPROVAL_CHOICES,
+      at: 0,
+    };
+    push("question", `承認が要ります: ${title}`);
+    for (const line of preview) {
+      push(
+        "progress",
+        `${line.kind === "added" ? "+ " : line.kind === "removed" ? "- " : "  "}${line.text}`,
+      );
+    }
+    return new Promise<ApprovalAnswer>((resolve, reject) => {
+      deciding = { resolve, reject };
+    });
+  };
+  /** Settles the approval being shown, or takes it back when there is no choice. */
+  const settleApproval = (choice?: ApprovalChoice, comment?: string) => {
+    const waiting = deciding;
+    deciding = undefined;
+    if (state.reason !== undefined) {
+      delete state.reason;
+      notify();
+    }
+    if (state.approval !== undefined) {
+      const decided = choice ? APPROVAL_CHOICES.find((c) => c.key === choice)?.label : undefined;
+      delete state.approval;
+      if (decided) push("line", `> ${decided}`);
+      notify();
+    }
+    if (!waiting) return;
+    if (choice === undefined) waiting.reject(new Error(APPROVAL_WITHDRAWN));
+    else waiting.resolve({ choice, ...(comment !== undefined && comment !== "" && { comment }) });
+  };
+
   /** Answers the pending question, or takes it back when there is no answer. */
   const settleQuestion = (answer?: string) => {
     const waiting = pending;
@@ -182,6 +280,8 @@ export async function createController(options: ControllerOptions): Promise<Cont
   };
 
   let sessionId: WorkId | undefined;
+  /** Summaries of the works completed in this turn, until the agent reports them itself. */
+  let unreported: string[] = [];
   const session: Session = await createSession(client, {
     model,
     config,
@@ -211,6 +311,12 @@ export async function createController(options: ControllerOptions): Promise<Cont
           id: workId,
           status: event.type === "work.completed" ? "completed" : "failed",
         };
+        if (event.type === "work.completed") {
+          // Held, not shown: the agent is the one who tells the person what happened. It is
+          // shown only if the turn ends without the agent saying anything (see submit).
+          const { summary } = (event as Event<"work.completed">).payload;
+          if (summary.trim() !== "") unreported.push(summary.trim());
+        }
         return closingLines(workId);
       }
       // The work_* calls are the loop's own bookkeeping; the closing lines already say the work ended.
@@ -229,6 +335,7 @@ export async function createController(options: ControllerOptions): Promise<Cont
       else notify();
     },
     onInput: ask,
+    onApproval: askApproval,
   });
   sessionId = session.id;
   state.status.agentName = session.agentName;
@@ -253,6 +360,14 @@ export async function createController(options: ControllerOptions): Promise<Cont
         return "社員エージェントが続けられないと言っています。";
       case "model_error":
         return `model の呼び出しに失敗しました。${result.detail ?? ""}`.trim();
+      case "approval": {
+        const a = result.approval;
+        if (!a) return "承認が要ります。/approvals で確かめてください。";
+        if (a.kind === "review") {
+          return `${a.reviewer?.role ?? "資格者"}の判断が要ります: ${a.name} ${describeInput(a.input)}(${a.approvalId})。Review Package は work/${a.workId}/review/ にあります。返答が届いたら /review ${a.approvalId} approve か /review ${a.approvalId} reject で記録します。`;
+        }
+        return `承認が要ります: ${a.name} ${describeInput(a.input)}(${a.approvalId})。/approve ${a.approvalId} で実行、/reject ${a.approvalId} で拒否します。`;
+      }
       default:
         return undefined;
     }
@@ -277,6 +392,16 @@ export async function createController(options: ControllerOptions): Promise<Cont
     }
   };
 
+  /** Sends what the person typed while the agent was working, oldest first. */
+  const drainQueue = async () => {
+    while (state.queued.length > 0 && !closing) {
+      const [next, ...rest] = state.queued as [string, ...string[]];
+      state.queued = rest;
+      notify();
+      await self.submit(next);
+    }
+  };
+
   const capture = async (fn: (write: (line: string) => void) => Promise<unknown>) => {
     try {
       await fn((line) => push("line", line));
@@ -308,6 +433,60 @@ export async function createController(options: ControllerOptions): Promise<Cont
       } catch (err) {
         push("notice", message(err));
       }
+    } else if (name === "approvals") {
+      try {
+        const held = await session.approvals();
+        if (held.length === 0) push("line", "承認待ちはありません。");
+        for (const a of held) {
+          push("line", `${a.approvalId}  ${a.name} ${describeInput(a.input)}  (${a.workId})`);
+        }
+      } catch (err) {
+        push("notice", message(err));
+      }
+    } else if ((name === "approve" || name === "reject") && sub) {
+      try {
+        const comment = args.slice(1).join(" ");
+        const { text } = await session.decide(sub, name, comment || undefined);
+        push("line", text);
+      } catch (err) {
+        push("notice", message(err));
+      }
+    } else if (name === "approve" || name === "reject") {
+      push("notice", `/${name} には承認の id が要ります。/approvals で確かめてください。`);
+    } else if (name === "review" && sub && (args[1] === "approve" || args[1] === "reject")) {
+      const decision = args[1];
+      try {
+        // The rule already says which role has to decide; the person only says who they are.
+        const held = (await session.approvals()).find((a) => a.approvalId === sub);
+        if (!held)
+          throw new Error(`${sub} は承認待ちにありません。/approvals で確かめてください。`);
+        if (held.kind !== "review") {
+          throw new Error(`${sub} は人の承認待ちです。/approve か /reject で決めます。`);
+        }
+        const role = held.reviewer?.role ?? "reviewer";
+        const who = await askLine(
+          `${role} の名前と資格(例: 田中 太郎 / 税理士)。会社の申告として記録します`,
+        );
+        const [reviewerName, qualification] = who.split("/").map((part) => part.trim());
+        const interpretation = await askLine(
+          decision === "approve" ? "判断の本文(そのまま記録します)" : "認めない理由",
+        );
+        const { text } = await session.review({
+          approvalId: sub,
+          decision,
+          reviewer: {
+            name: reviewerName || who,
+            role,
+            ...(qualification && { qualification }),
+          },
+          interpretation,
+        });
+        push("line", text);
+      } catch (err) {
+        push("notice", message(err));
+      }
+    } else if (name === "review") {
+      push("notice", "/review <id> approve か /review <id> reject の形です。");
     } else if (name === "resume") {
       push(
         "notice",
@@ -322,6 +501,7 @@ export async function createController(options: ControllerOptions): Promise<Cont
     closing ??= (async () => {
       aborter?.abort();
       settleQuestion();
+      settleApproval();
       await running;
       try {
         await session.close();
@@ -336,7 +516,7 @@ export async function createController(options: ControllerOptions): Promise<Cont
     return closing;
   }
 
-  return {
+  const self: Controller = {
     sessionId: session.id,
     state: () => state,
     subscribe(listener) {
@@ -346,6 +526,15 @@ export async function createController(options: ControllerOptions): Promise<Cont
     async submit(line) {
       const text = line.trim();
       if (text === "" || closing) return;
+      if (state.approval) {
+        push("notice", "承認を先に決めてください。数字か ↑↓ と Enter で選びます。");
+        return;
+      }
+      if (state.reason !== undefined) {
+        push("user", text);
+        settleApproval("reject", text);
+        return;
+      }
       if (pending) {
         push("user", text);
         // Everything typed answers the question, except leaving: that takes the question back.
@@ -354,7 +543,10 @@ export async function createController(options: ControllerOptions): Promise<Cont
         return;
       }
       if (state.busy) {
-        push("notice", "いま動いています。止めるなら Ctrl-C。");
+        // Typing while the agent works is not a mistake: the line waits its turn.
+        state.queued = [...state.queued, text];
+        push("notice", `順番待ち(${state.queued.length} 件): ${text}`);
+        notify();
         return;
       }
       if (text.startsWith("/")) {
@@ -363,25 +555,56 @@ export async function createController(options: ControllerOptions): Promise<Cont
         return;
       }
       push("user", text);
+      unreported = [];
       await stoppable(async (signal) => {
         try {
           const result = await session.turn(text, { signal });
-          if (result.reply) push("assistant", result.reply);
+          // What the work recorded is the agent's own writing, so it stands in when the turn
+          // ends with nothing said. Without this the person is left with a work that finished
+          // and no answer, which is what a model that skips its summary leaves behind.
+          const reply = result.reply.trim() === "" ? unreported.join("\n\n") : result.reply;
+          if (reply) push("assistant", reply);
           const note = explain(result);
           if (note) push("notice", note);
         } catch (err) {
           push("notice", message(err));
         }
       });
+      await drainQueue();
     },
     interrupt() {
       if (!aborter) return false;
       aborter.abort();
       settleQuestion();
+      settleApproval();
       return true;
     },
+    moveApproval(delta) {
+      const approval = state.approval;
+      if (!approval) return;
+      const count = approval.choices.length;
+      state.approval = { ...approval, at: (approval.at + delta + count) % count };
+      notify();
+    },
+    decideApproval(choice) {
+      const approval = state.approval;
+      if (!approval) return;
+      const picked = choice ?? approval.choices[approval.at]?.key ?? "reject";
+      if (picked === "reject_with_reason") {
+        // The palette closes and the input box takes the reason; the loop still waits.
+        const shown = APPROVAL_CHOICES.find((c) => c.key === picked)?.label;
+        delete state.approval;
+        state.reason = "実行しない理由(社員エージェントに伝わります)";
+        if (shown) push("line", `> ${shown}`);
+        push("question", state.reason);
+        notify();
+        return;
+      }
+      settleApproval(picked);
+    },
     close,
   };
+  return self;
 }
 
 /** Lines that close a work in the screen: the CLI's closing lines without the summary, which the agent relays. */

package/src/tui/lines.ts

@@ -1,12 +1,14 @@
 import { displayWidth } from "../format.ts";
-import { logoSegments, type Segment } from "./banner.ts";
+import { logoSegments } from "./banner.ts";
 import type { Entry, EntryKind } from "./controller.ts";
+import { markdownRows, type Span } from "./markdown.ts";
 
 export interface ScreenLine {
   kind: EntryKind | "blank";
+  /** The row as plain characters, marker included. */
   text: string;
-  /** Colored pieces of a logo row; the other rows are one color. */
-  segments?: Segment[];
+  /** The row as styled pieces: a logo row, or a reply the screen drew from its markdown. */
+  spans?: Span[];
 }
 
 /** What starts a line of each kind. The continuation lines of a wrapped entry are indented to match. */
@@ -42,6 +44,20 @@ export function wrapText(text: string, width: number): string[] {
   return out;
 }
 
+/**
+ * The rows of one reply, kept until the entry goes or the width changes. The screen redraws
+ * every entry whenever a line is added, and reading markdown is the expensive part of that.
+ */
+const drawn = new WeakMap<Entry, { width: number; rows: Span[][] }>();
+
+export function rowsFor(entry: Entry, width: number): Span[][] {
+  const held = drawn.get(entry);
+  if (held && held.width === width) return held.rows;
+  const rows = markdownRows(entry.text, width);
+  drawn.set(entry, { width, rows });
+  return rows;
+}
+
 /** A blank row goes before an entry that starts something new: a message, a reply, a notice, a question. */
 function startsBlock(kind: EntryKind, previous: EntryKind | undefined): boolean {
   if (previous === undefined) return false;
@@ -59,14 +75,28 @@ export function screenLines(entries: readonly Entry[], width: number): ScreenLin
     if (startsBlock(entry.kind, previous)) lines.push({ kind: "blank", text: "" });
     if (entry.kind === "logo") {
       // Never wrapped: a cut row of the wordmark reads better than a broken one.
-      lines.push({ kind: "logo", text: entry.text, segments: logoSegments(entry.text) });
+      lines.push({ kind: "logo", text: entry.text, spans: logoSegments(entry.text) });
       previous = entry.kind;
       continue;
     }
     const marker = MARKERS[entry.kind];
     const indent = " ".repeat(displayWidth(marker));
-    const body = wrapText(entry.text, Math.max(8, width - displayWidth(marker)));
-    for (const [i, text] of body.entries()) {
+    const room = Math.max(8, width - displayWidth(marker));
+    if (entry.kind === "assistant") {
+      // The reply is written in markdown; the screen draws it rather than showing its marks.
+      for (const [i, row] of rowsFor(entry, room).entries()) {
+        // A row with nothing on it is drawn as an empty one: no marker, no indent, no pieces.
+        if (row.length === 0) {
+          lines.push({ kind: entry.kind, text: "" });
+          continue;
+        }
+        const spans = [{ text: i === 0 ? marker : indent }, ...row];
+        lines.push({ kind: entry.kind, text: spans.map((s) => s.text).join(""), spans });
+      }
+      previous = entry.kind;
+      continue;
+    }
+    for (const [i, text] of wrapText(entry.text, room).entries()) {
       lines.push({ kind: entry.kind, text: (i === 0 ? marker : indent) + text });
     }
     previous = entry.kind;

package/src/tui/markdown.ts

@@ -0,0 +1,214 @@
+import { marked, type Token, type Tokens } from "marked";
+import { displayWidth } from "../format.ts";
+
+/** A piece of a row that carries one style. A row is a list of these, drawn left to right. */
+export interface Span {
+  text: string;
+  color?: string;
+  bold?: boolean;
+  italic?: boolean;
+  dim?: boolean;
+  strikethrough?: boolean;
+}
+
+/** What each part of a reply looks like on the screen. */
+const STYLE = {
+  heading: { bold: true, color: "cyan" },
+  code: { color: "green" },
+  link: { color: "blue" },
+  quote: { dim: true },
+  rule: { dim: true },
+} as const;
+
+const QUOTE_MARKER = "▎ ";
+const CODE_MARKER = "│ ";
+const BULLETS = ["•", "◦", "‣"] as const;
+
+function styled(text: string, style: Omit<Span, "text">): Span {
+  return { text, ...style };
+}
+
+/** The inline tokens of one block, flattened into styled pieces. */
+function inline(tokens: Token[] | undefined, style: Omit<Span, "text">): Span[] {
+  if (!tokens) return [];
+  const spans: Span[] = [];
+  for (const token of tokens) {
+    switch (token.type) {
+      case "strong":
+        spans.push(...inline(token.tokens, { ...style, bold: true }));
+        break;
+      case "em":
+        spans.push(...inline(token.tokens, { ...style, italic: true }));
+        break;
+      case "del":
+        spans.push(...inline(token.tokens, { ...style, strikethrough: true }));
+        break;
+      case "codespan":
+        spans.push(styled((token as Tokens.Codespan).text, { ...style, ...STYLE.code }));
+        break;
+      case "link": {
+        const link = token as Tokens.Link;
+        spans.push(...inline(link.tokens, style));
+        // The label alone hides where the link goes, so the address follows it.
+        if (link.href && link.href !== textOf(link.tokens)) {
+          spans.push(styled(` (${link.href})`, { ...style, ...STYLE.link }));
+        }
+        break;
+      }
+      case "br":
+        spans.push(styled("\n", style));
+        break;
+      case "escape":
+      case "text":
+        spans.push(
+          ...((token as Tokens.Text).tokens
+            ? inline((token as Tokens.Text).tokens, style)
+            : [styled((token as Tokens.Text).text, style)]),
+        );
+        break;
+      default:
+        spans.push(styled((token as { raw: string }).raw, style));
+    }
+  }
+  return spans;
+}
+
+function textOf(tokens: Token[] | undefined): string {
+  return inline(tokens, {})
+    .map((s) => s.text)
+    .join("");
+}
+
+/**
+ * Breaks styled pieces into rows no wider than `width` display columns, the way the rest of the
+ * screen breaks plain text: at the character, so Japanese wraps where it should. Rows after the
+ * first start with `hanging`, which keeps a list item under its own marker.
+ */
+function wrap(spans: Span[], width: number, hanging = ""): Span[][] {
+  const limit = Math.max(4, width);
+  const rows: Span[][] = [];
+  let row: Span[] = [];
+  let used = 0;
+  const indent = () => (hanging === "" ? [] : [{ text: hanging }]);
+  const start = () => {
+    rows.push(row);
+    row = indent();
+    used = displayWidth(hanging);
+  };
+  for (const span of spans) {
+    for (const [i, part] of span.text.split("\n").entries()) {
+      // A line break inside a block starts a row of its own.
+      if (i > 0) start();
+      let piece = "";
+      for (const ch of part) {
+        const w = displayWidth(ch);
+        if (used + w > limit && (row.length > 0 || piece !== "")) {
+          if (piece !== "") row.push({ ...span, text: piece });
+          piece = "";
+          start();
+        }
+        piece += ch;
+        used += w;
+      }
+      if (piece !== "") row.push({ ...span, text: piece });
+    }
+  }
+  rows.push(row);
+  return rows;
+}
+
+/** Puts `prefix` in front of every row, for a quote bar or a code bar. */
+function prefixed(rows: Span[][], prefix: Span): Span[][] {
+  return rows.map((row) => [prefix, ...row]);
+}
+
+function blockRows(tokens: Token[], width: number): Span[][] {
+  const rows: Span[][] = [];
+  for (const token of tokens) {
+    switch (token.type) {
+      case "space":
+        rows.push([]);
+        break;
+      case "heading":
+        rows.push(...wrap(inline(token.tokens, STYLE.heading), width));
+        break;
+      case "paragraph":
+      case "text":
+        rows.push(...wrap(inline(token.tokens ?? [], {}), width));
+        break;
+      case "code": {
+        const marker = styled(CODE_MARKER, STYLE.quote);
+        const body = (token as Tokens.Code).text.split("\n");
+        for (const line of body) {
+          rows.push(...prefixed(wrap([styled(line, STYLE.code)], width - 2), marker));
+        }
+        break;
+      }
+      case "blockquote": {
+        const inner = blockRows((token as Tokens.Blockquote).tokens ?? [], width - 2);
+        rows.push(...prefixed(inner, styled(QUOTE_MARKER, STYLE.quote)));
+        break;
+      }
+      case "list":
+        rows.push(...listRows(token as Tokens.List, width, 0));
+        break;
+      case "hr":
+        rows.push([styled("─".repeat(Math.max(4, width)), STYLE.rule)]);
+        break;
+      case "table":
+        // Aligning columns is its own piece of work; until then the source rows are shown as
+        // they were written, so nothing the model put in the table is lost.
+        for (const line of (token as Tokens.Table).raw.trimEnd().split("\n")) {
+          rows.push(...wrap([{ text: line }], width));
+        }
+        break;
+      default:
+        for (const line of ((token as { raw?: string }).raw ?? "").trimEnd().split("\n")) {
+          rows.push(...wrap([{ text: line }], width));
+        }
+    }
+  }
+  return rows;
+}
+
+function listRows(list: Tokens.List, width: number, depth: number): Span[][] {
+  const rows: Span[][] = [];
+  let number = Number(list.start || 1);
+  for (const item of list.items) {
+    const marker = list.ordered ? `${number++}. ` : `${BULLETS[depth % BULLETS.length]} `;
+    const indent = " ".repeat(displayWidth(marker));
+    const inner: Span[][] = [];
+    for (const token of item.tokens) {
+      if (token.type === "list") {
+        inner.push(...listRows(token as Tokens.List, width - displayWidth(marker), depth + 1));
+      } else {
+        inner.push(...blockRows([token], width - displayWidth(marker)));
+      }
+    }
+    for (const [i, row] of inner.entries()) {
+      rows.push([{ text: i === 0 ? marker : indent }, ...row]);
+    }
+  }
+  return rows;
+}
+
+/**
+ * How much of a reply is read as markdown. Reading it costs more than the square of its length
+ * (10,000 characters take about 0.14 seconds, 20,000 about 0.46, 140,000 over a minute), and the
+ * screen draws on one thread, so a longer reply would hold it. Above this the reply is shown as
+ * plain text: every character is still there, with its marks.
+ */
+const MAX_SOURCE = 20_000;
+
+/**
+ * A reply as rows of styled pieces. The model writes markdown, so the screen shows the emphasis
+ * and the structure instead of the characters that mark them. What this does not draw yet is
+ * shown as it was written, never dropped.
+ */
+export function markdownRows(source: string, width: number): Span[][] {
+  if (source.length > MAX_SOURCE) return wrap([{ text: source }], width);
+  const rows = blockRows(marked.lexer(source), width);
+  while (rows.length > 0 && (rows[0]?.length ?? 0) === 0) rows.shift();
+  while (rows.length > 0 && (rows.at(-1)?.length ?? 0) === 0) rows.pop();
+  return rows.length > 0 ? rows : [[]];
+}