@vincemakes/kiso-tui 0.1.39 → 0.1.41

package/dist/compositor.js

@@ -8,7 +8,8 @@
  * The model:
  *  - cells (the CLI's mutation surface) → components → lines;
  *  - `lines[] + commitIndex` (the scrollback fork — the departure from
- *    pi): a line COMMITS (leaves the live region) via the real-LF
+ *    the reference implementation's model): a line COMMITS (leaves the
+ *    live region) via the real-LF
  *    scroll at the last row (`\x1b[1B\n` — CUP-free) when its cell is
  *    DONE and the region needs the room. Committed bytes are never
  *    re-emitted — the native scrollback gets them, reflow-safe, and
@@ -19,8 +20,8 @@
  *    commits the oldest live line regardless of done-ness — the one
  *    sharp edge (asserted by the VT-emulator gate);
  *  - two crash invariants: ① every emitted line's visible width ≤ W
- *    (components fold; a violation THROWS with diagnostics — pi
- *    tui-main-screen.ts:447-473, no silent truncate); ② every steady-
+ *    (components fold; a violation THROWS with diagnostics — the
+ *    no-silent-truncate ruling); ② every steady-
  *    frame CUP lands in the CONTENT area (rows ≤ H−4−menu — the
  *    committed band, the stale/gap ELs, and the LIVE lines at their
  *    model rows; fix C's sanctioned reinterpretation, ADR-0046) — the
@@ -43,7 +44,9 @@
  */
 import { truncateDiff } from "./diff.js";
 import { displayWidth } from "./editor.js";
-import { Container, ROLLUP_NOUN, SPINNER, bodySpacing, boxBottom, boxTop, cellComponent, foldLine, statusLine, turnFold, visibleWidth, } from "./components.js";
+import { leadWidth } from "./width.js"; // W23: the ONE width authority (the editor, #inputRow, and editCol share it)
+import { panelAffordance, panelBlockRows, panelLead, panelStatus } from "./approval-panel.js";
+import { Container, ROLLUP_NOUN, SPINNER, bodySpacing, boxBottom, boxTop, cellComponent, foldLine, pendingQueueRows, statusLine, turnFold, visibleWidth, } from "./components.js";
 import { bannerLines, escapeTerminal, foldResult, foldThinking, palette, renderTerminalGap, renderToolSummary, toolTarget } from "./render.js";
 /** The cursor marker — an APC private sequence the focus component
  *  embeds at the edit position; the compositor strips it and moves
@@ -72,6 +75,7 @@ export class Body {
     #fullRedraw = false; // the first frame / resize — the CUP path
     #lastLiveTop = 0; // the recorded live region top — the resize clear starts here
     #lastLiveRows = 0; // the recorded live row count (incl. the chrome)
+    #lastSkip = 0; // the last frame's window top in model rows — the A8b scroll's leaving-count base
     #lastH = 0;
     #frameTimer = null;
     #spinnerTimer = null;
@@ -100,10 +104,19 @@ export class Body {
     #status = "";
     #statusHint = null;
     #tail = "";
-    #question = null;
+    // W21: the panel's bound state — the PanelSelect slot occupant (the
+    // old ApprovalPrompt's question slot retires with it): while a
+    // panel is up it replaces the live region, owns the input lead, and
+    // derives the status row (the CLI's painting status yields).
+    #panelState = null;
     #inputState = () => ({ line: "", cursor: 0 });
     #inputPrompt = "";
     #menuState = null;
+    // W22: the pending-turn queue's bound state — the CLI's live slots
+    // (chat.ts); the chips render in the menu-rows family (above the
+    // box top), the live caps shrink by their rows, and the status
+    // row's right hint shows the count while any turn waits.
+    #queueState = () => [];
     constructor(opts) {
         this.#opts = opts;
         this.#write = opts.write ?? ((s) => process.stdout.write(s));
@@ -114,14 +127,20 @@ export class Body {
         compositorRef = this;
         // the Dock façade's bindings may arrive BEFORE this construction
         // (the CLI binds the editor state in makeLineInput, then constructs
-        // the Body) — the buffered bindings apply here, or the input row
-        // would never render the typed line.
-        if (dockBindings !== null) {
+        // the Body) — the LIVE binding buffer applies here, or the input
+        // row would never render the typed line. W21: the buffer is a
+        // mutable object the bind methods update in place — order-agnostic
+        // (the old snapshot froze `menu` at bindInput time and the menu
+        // silently never bound in the real CLI; the e2e gates bind the
+        // Body directly and could not see it).
+        if (dockBindings.state !== null)
             this.#inputState = dockBindings.state;
-            this.#inputPrompt = dockBindings.prompt;
+        this.#inputPrompt = dockBindings.prompt;
+        if (dockBindings.menu !== null)
             this.#menuState = dockBindings.menu;
-            dockBindings = null;
-        }
+        this.#panelState = dockBindings.panel;
+        if (dockBindings.queue !== null)
+            this.#queueState = dockBindings.queue;
     }
     /** Live re-check — a TTY whose size lands after construction flips in. */
     #isActive() {
@@ -140,8 +159,9 @@ export class Body {
         this.#closeOpenThinking();
         this.#closeOpenText();
         // W14: the turn boundary — the record the fold-hold's release
-        // state machine reads; the cell carries the record's index.
-        this.#turns.push({ ended: false, hasText: false, thoughtSeconds: 0, reads: 0, edits: 0, others: new Map(), folded: false });
+        // state machine reads; the cell carries the record's index. A9:
+        // the user's own words ride the record — the fold's leading chip.
+        this.#turns.push({ ended: false, hasText: false, thoughtSeconds: 0, reads: 0, edits: 0, others: new Map(), words: text, folded: false });
         this.#cells.push({ kind: "user", text, done: true, turn: this.#turns.length - 1 });
         this.#mark();
     }
@@ -189,7 +209,7 @@ export class Body {
             }
         }
         this.#toolCells.set(callId, this.#cells.length);
-        this.#cells.push({ kind: "tool", name, input: summary, inputFull: JSON.stringify(input, null, 2), childRoles, state: "pending", isError: false, resultText: "", diff: null, added: 0, removed: 0, startedAt: null, doneAt: null, done: false, expanded: false, turn: this.#turns.length - 1, rolled: null, reason: null });
+        this.#cells.push({ kind: "tool", name, input: summary, inputFull: JSON.stringify(input, null, 2), childRoles, state: "pending", isError: false, resultText: "", diff: null, added: 0, removed: 0, startedAt: null, doneAt: null, done: false, expanded: false, turn: this.#turns.length - 1, rolled: null, reason: null, verdict: null });
         // W14: the turn record's counts — the folded-turn line's terms
         // (reads = read_file, edits = edit_file, the rest in first-call
         // order). The CLI's recap counts the same way (edit_file).
@@ -216,6 +236,24 @@ export class Body {
         }
         this.#mark();
     }
+    /** A5: the approval verdict — the permission_decided event binds into
+     *  the cell (the aggregated head row: name + status + decidedBy in
+     *  ONE row; no free-standing `  approved` orphan). The decision lands
+     *  after the panel closes (the streamed event) — the cell is usually
+     *  running by then; the record rides the settled row (`· approved by
+     *  X` on an extension's auto-approval, `· by X` on its denial). A
+     *  verdict with no live cell is dropped — the registry holds only
+     *  in-flight calls, and the committed cells already told their
+     *  outcome. */
+    toolVerdict(callId, decision, decidedBy, reason) {
+        if (!this.#isActive())
+            return;
+        const cell = this.#toolCell(callId);
+        if (cell !== null && cell.kind === "tool") {
+            cell.verdict = { decision, ...(decidedBy !== undefined ? { decidedBy } : {}), ...(reason !== undefined ? { reason } : {}) };
+            this.#mark();
+        }
+    }
     toolRunning(callId) {
         if (!this.#isActive()) {
             const p = palette();
@@ -597,13 +635,27 @@ export class Body {
         this.#tail = tail;
         this.redraw();
     }
-    showQuestion(question) {
-        this.#question = question;
-        this.redraw();
+    /** The status row's source — W21: while a panel is up, the panel's
+     *  phase status + affordance REPLACE the CLI's painting status (the
+     *  compositor derives both from the bound panel state; the old
+     *  question slot's dim-pending shape is the normal branch's shape
+     *  now). */
+    #statusSource() {
+        const panel = this.#panelState?.() ?? null;
+        if (panel !== null)
+            return { status: panelStatus(panel.view, panel.phase, panel.sel), hint: panelAffordance(panel.view, panel.phase, panel.sel) };
+        // W22: while turns wait in the queue, the right hint shows the
+        // count — the chips below carry the lines themselves.
+        const queued = this.#queueState?.().length ?? 0;
+        if (queued > 0)
+            return { status: this.#status, hint: `+${queued} queued` };
+        return { status: this.#status, hint: this.#statusHint ?? undefined };
     }
-    clearQuestion() {
-        this.#question = null;
-        this.redraw();
+    /** Bind the editor's panel state — the PanelSelect slot occupant
+     *  (W21: the panel replaces the live region + the input lead while
+     *  up; the old ApprovalPrompt's question slot retires with it). */
+    bindApproval(state) {
+        this.#panelState = state;
     }
     /** Bind the CURRENT input line's state — the focus component reads it. */
     bindInput(state, prompt) {
@@ -615,14 +667,25 @@ export class Body {
     bindMenu(state) {
         this.#menuState = state;
     }
+    /** Bind the pending-turn queue — the CLI's live slots (chat.ts):
+     *  the chips render in the menu-rows family, the live caps shrink
+     *  by their rows, and the +N queued hint rides the status row. */
+    bindQueue(state) {
+        this.#queueState = state;
+    }
     /** The input line's edit column — the old dock's API. v6: the CURSOR
      *  derives from the frame's marker; this is the same value computed
      *  from the bound input state (the CLI's BodyOptions.editCol callback
      *  reads it — the marker math never desyncs by construction). */
     editCol() {
-        const inp = this.#inputState();
-        // W6: the box's left wall (2 cols) prefixes the prompt
-        return 2 + displayWidth(this.#inputPrompt.replace(/\x1b\[[0-9;]*m/g, "")) + inp.cursor + 1;
+        const st = this.#inputState();
+        const panel = this.#panelState?.() ?? null;
+        // W23: the frame-derived column — wallL + leadWidth(lead) + cells
+        // + 1 — the SAME formula the marker embeds at (the panel lead when
+        // the panel owns the row; the old prompt-only math desynced the
+        // panel rows' edit column; leadWidth is the ONE authority)
+        const lead = panel !== null ? panelLead(panel.view, panel.phase, panel.sel) : this.#inputPrompt;
+        return 3 + leadWidth(lead) + st.cursor;
     }
     /** The old dock's redraw — the editor's onRender target: mark + the
      *  scheduler (16ms coalescing — the old sync draw coalesces the same). */
@@ -686,6 +749,14 @@ export class Body {
      *  blanks are join artifacts — the count includes them (they are real
      *  screen rows), threaded against the previous sibling's OWN rows. */
     liveCount() {
+        const panel = this.#panelState?.() ?? null;
+        const queueRows = this.#queueRows(this.#opts.width(), this.#opts.height());
+        if (panel !== null) {
+            // W21: the panel's own rows (the cap is exact — the scalar
+            // reflects the screen). W22: the queue chips occupy their
+            // own band — the panel's cap shrinks by their rows.
+            return panelBlockRows(panel.view, panel.phase, panel.sel, this.#opts.width(), Math.max(1, this.#opts.height() - 4 - queueRows.length)).length + CHROME_ROWS + queueRows.length;
+        }
         const live = this.#cells.slice(this.#committed);
         const ctx = { spinnerI: this.#spinnerI, now: Date.now(), height: this.#opts.height() };
         const W = this.#opts.width();
@@ -696,7 +767,7 @@ export class Body {
             lines += bodySpacing(prev, rows).length;
             prev = rows;
         }
-        return lines + CHROME_ROWS + this.#menuRows(W).length;
+        return lines + CHROME_ROWS + this.#menuRows(W).length + queueRows.length;
     }
     /** The lines committed THIS frame — the writes land in the frame's
      *  committed section (the rows just above the live region). */
@@ -750,9 +821,22 @@ export class Body {
         //    W11: the formula's blank above the first live cell hangs off
         //    the last COMMITTED sibling (the join spans the boundary).
         const menuRows = this.#menuRows(W);
-        const chromeRows = CHROME_ROWS + menuRows.length;
+        // W22: the queue chips are the menu-rows family's other occupant
+        // (the band above the box top) — the chrome rows and the live
+        // caps account for both.
+        const queueRows = this.#queueRows(W, H);
+        const chromeRows = CHROME_ROWS + menuRows.length + queueRows.length;
         let liveLines = [];
-        {
+        const panel = this.#panelState?.() ?? null;
+        if (panel !== null) {
+            // W21: the panel REPLACES the running tool's live window — the
+            // bounded block, capped at H−4 (the panel IS the live region;
+            // the W11 blank would separate it from the frozen content).
+            // The cap is exact, so the force-commit loop never fires. W22:
+            // the queue band sits below the panel — the cap shrinks by it.
+            liveLines = panelBlockRows(panel.view, panel.phase, panel.sel, W, Math.max(1, H - 4 - queueRows.length));
+        }
+        else {
             let prev = this.#committed > 0 ? this.#lineCache[this.#committed - 1] : null;
             for (const cell of this.#cells.slice(this.#committed)) {
                 const rows = cellComponent(cell).render(W, ctx);
@@ -762,8 +846,9 @@ export class Body {
         }
         // 3. the FORCE commits — the live region's hard cap H−1: overflow
         //    commits the oldest live cell UNCONDITIONALLY (the one sharp
-        //    edge — the cap scalar is asserted by the gates).
-        while (liveLines.length > H - 4 && this.#committed < this.#cells.length) { // V6-3: the content cap H−4
+        //    edge — the cap scalar is asserted by the gates). W22: the
+        //    queue band shrinks the cap by its rows (empty queue → H−4).
+        while (liveLines.length > H - 4 - queueRows.length && this.#committed < this.#cells.length) { // V6-3: the content cap H−4
             this.#commitCell(this.#committed, W, ctx);
             liveLines = [];
             {
@@ -783,12 +868,25 @@ export class Body {
         // 5. the frame bytes.
         const out = [];
         out.push("\x1b[?2026h"); // synchronized output ON (DEC 2026)
-        if (this.#fullRedraw) {
-            this.#drawFull(out, W, H, liveTop, liveLines, menuRows, ctx);
+        // A8: the bottom-anchored window (the model's last H rows) shifts
+        // DOWN when the live region SHRINKS — the done-fold, the fold-hold
+        // release at the terminal event. The steady path's scroll syncs
+        // exactly N committed lines, but the window moves N + liveDelta:
+        // a shrink with commits (liveTop grows by LESS than N — the scroll
+        // overshoots by liveDelta) slips past the pure-shrink trigger, the
+        // stale pass erases the old live rows, and nothing re-paints the
+        // band between the committed window and the new liveTop (finding
+        // #A8 — the W11-boundary pileup). A GROWTH is safe on the steady
+        // path (the new live's bottom-anchored extent covers the old — the
+        // erased rows are all re-painted); a shrink takes the full-redraw
+        // path: the window re-paints at the model's positions, every row
+        // covered (the V6-1 every-row rule).
+        if (this.#fullRedraw || liveTop > this.#lastLiveTop + this.#committedLinesThisFrame.length || liveRowsTotal < this.#lastLiveRows) {
+            this.#drawFull(out, W, H, liveTop, liveLines, queueRows, menuRows, ctx);
             this.#fullRedraw = false;
         }
         else {
-            this.#drawSteady(out, W, H, liveTop, liveLines, menuRows, ctx);
+            this.#drawSteady(out, W, H, liveTop, liveLines, queueRows, menuRows, ctx);
         }
         out.push("\x1b[?2026l");
         this.#write(out.join(""));
@@ -846,12 +944,16 @@ export class Body {
             if (turn !== undefined && turn.ended && !turn.hasText) {
                 if (!turn.folded) {
                     turn.folded = true;
+                    // A9 (ruling R2, mock A): the user chip rides the fold —
+                    // the words take the fold's width budget (turnFold is
+                    // W-aware — the ONE row never trips invariant ①).
                     return turnFold({
+                        words: turn.words,
                         thoughtSeconds: turn.thoughtSeconds,
                         reads: turn.reads,
                         edits: turn.edits,
                         others: [...turn.others],
-                    });
+                    }, W);
                 }
                 return [];
             }
@@ -938,6 +1040,29 @@ export class Body {
     /** The slot occupant's extra rows — the slash-command menu (above the
      *  status, in the rhythm gap + the content's spare rows — the old
      *  menu's position, slot-shaped). */
+    /** W22: the pending-queue chips — the menu-rows family's other
+     *  occupant (the queue is dense, like the menu; each line is its
+     *  own chip with the □ gutter). */
+    #queueRows(W, H) {
+        const lines = this.#queueState?.() ?? [];
+        if (lines.length === 0)
+            return [];
+        // A8b: the band CAPS so the content keeps its rows — an unbounded
+        // band (the batch flood pastes the whole queue at once) overflowed
+        // the screen: the content cap H−4−queue went negative, the march
+        // painted nothing, and the leaving rows were never on the screen to
+        // scroll — the scrollback lost the turns entirely (finding #A8b —
+        // the queued-flood content loss). The band keeps the first H−9
+        // chips + one "…N more" row (≤ H−8 rows — the content keeps ≥ 4);
+        // the status hint's "+N queued" already carries the count, so the
+        // cap hides nothing the status doesn't show.
+        const keep = Math.max(1, H - 9);
+        if (lines.length <= keep)
+            return pendingQueueRows(lines, W);
+        const p = palette();
+        const hidden = lines.length - keep;
+        return [...pendingQueueRows(lines.slice(0, keep), W), `${p.dim}□ …${hidden} more queued${p.reset}`];
+    }
     #menuRows(W) {
         const menu = this.#menuState?.();
         if (menu === null || menu === undefined || menu.items.length === 0)
@@ -956,32 +1081,32 @@ export class Body {
     /** The focus component's input row — the marker embedded at the
      *  cursor's display column WITHIN THE ROW (the brick/question lead
      *  included), the question/editor/menu variants. The compositor
-     *  strips the marker and moves LEFT by the trailing width — the
-     *  cursor derives from the frame, never from side-channel math.
+     *  strips the marker and returns the frame-derived COLUMN — the
+     *  cursor move lands AT the marker (a CHA — the column is absolute,
+     *  so the move's base is irrelevant; the retired afterW CUB's base
+     *  was the LAST write's end column, which the steady frame's
+     *  gap/stale ELs leave at col 1 — the A3 finding).
      *
      *  W6: the row lives INSIDE the box — the walls are a prefix/suffix
      *  width only, composed AFTER the marker embed (the marker math is
      *  untouched; the marker's row column = the wall + the lead + the
      *  cursor). The content caps at W−4 (the walls' columns) and the
      *  pad completes the row to EXACTLY W — invariant ① throws on
-     *  overflow, so the box row is built full-width, never truncated. */
+     *  overflow, so the box row is built full-width, never truncated.
+     *  W23: the lead width is the ONE authority — leadWidth (width.ts),
+     *  shared with the editor's selfRender/#reflow and editCol. */
     #inputRow(W, _ctx) {
         const st = this.#inputState();
-        let row;
-        if (this.#question !== null) {
-            // the ApprovalPrompt occupant — the question IS the prompt (the
-            // slot swap; the brick returns when the question clears)
-            row = `${this.#question}${st.line}`;
-        }
-        else {
-            row = `${this.#inputPrompt}${st.line}`;
-        }
-        // the lead (the prompt / the question) width — the marker's row
-        // column = leadW + the line cursor (the dockState cursor counts
-        // within the line only)
-        const leadW = visibleWidth(row.slice(0, row.length - st.line.length));
+        const panel = this.#panelState?.() ?? null;
+        // the lead — the panel's phase lead when the panel owns the row
+        // (1-3> / the rule input's "2 Yes, don't ask again for " / the
+        // amend "feedback (deny): "), the bound prompt otherwise
+        const lead = panel !== null ? panelLead(panel.view, panel.phase, panel.sel) : this.#inputPrompt;
+        const leadW = leadWidth(lead);
+        const row = `${lead}${st.line}`;
         // embed the marker at the cursor's display column
         let markerLine = "";
+        let markerCell = 0; // the marker's 0-based cell — the walk's w at the embed
         let w = 0;
         {
             let inserted = false;
@@ -997,6 +1122,7 @@ export class Body {
                 }
                 if (!inserted && w >= leadW + st.cursor) {
                     markerLine += CURSOR_MARKER;
+                    markerCell = w;
                     inserted = true;
                 }
                 const cw = displayWidth(row[i]);
@@ -1007,28 +1133,28 @@ export class Body {
                 i += 1;
             }
             if (!inserted) {
+                // the walk ended before the cursor cell (the box edge) —
+                // the marker rests at the row's end; the move still lands
+                // AT it (the min() of the contract)
                 markerLine += CURSOR_MARKER;
+                markerCell = w;
             }
         }
         const stripped0 = markerLine.replace(CURSOR_MARKER, "");
-        const tailW = visibleWidth(markerLine.slice(markerLine.indexOf(CURSOR_MARKER) + CURSOR_MARKER.length));
         if (W < 4) {
             // the degenerate screen: the box cannot hold its walls — the
             // bare row (the pre-W6 bytes; the fold probe's pass-through
             // line still crashes invariant ① downstream, as before)
-            return { stripped: stripped0, afterW: tailW };
+            return { stripped: stripped0, markerCol: 3 + markerCell };
         }
         // the pad completes the row to W — the content stopped at W−4,
         // so the pad is ≥ 1
         const padW = W - 3 - w;
         const stripped = `\x1b[2m│ \x1b[0m${stripped0}\x1b[2m${" ".repeat(padW)}│\x1b[0m`;
-        // the LEFT move = the width AFTER the cursor-rest cell — the
-        // full-width row parks the terminal cursor at the LAST cell (not
-        // one past the end), so the rest cell IS the first tail cell and
-        // the move = the tail + the pad (the right wall rides inside the
-        // pad's tail)
-        const afterW = tailW + padW;
-        return { stripped, afterW };
+        // W23: the frame-derived column — wallL (2) + the marker's cell
+        // + 1 — the CHA lands the cursor AT the marker from ANY base
+        const markerCol = 3 + markerCell;
+        return { stripped, markerCol };
     }
     /** The full-redraw path (the first frame, the resize repaint) — CUP
      *  allowed here; zero LF; zero \x1b[3J; zero replay. The committed
@@ -1041,7 +1167,7 @@ export class Body {
      *  survive anywhere the draw does not touch; a draw that covers
      *  EVERY row is idempotent: N consecutive resizes end with the same
      *  screen as a single jump to the same size. */
-    #drawFull(out, W, H, liveTop, liveLines, menuRows, ctx) {
+    #drawFull(out, W, H, liveTop, liveLines, queueRows, menuRows, ctx) {
         const committed = this.#committedLinesThisFrame;
         // 0. the FROZEN rows — the re-folded committed content (re-flowed
         //    at the new width by the terminal): re-painted at [1..frozen],
@@ -1058,11 +1184,55 @@ export class Body {
         for (let i = 0; i < this.#committedAtFrameStart; i += 1) {
             frozen.push(...bodySpacing(i > 0 ? this.#lineCache[i - 1] : null, this.#lineCache[i]));
         }
+        // A8: the march is the WINDOW — the model's last H rows. When the
+        // model total (committed + live + chrome) exceeds H, the window's
+        // first row is the model's (total − H + 1)-th line: the lines
+        // above the window belong in the scrollback, and painting them at
+        // rows 1.. would shift every row below by the same (total − H) —
+        // the live region lands past its model position and the box eats
+        // its tail. The bound skips them: the march covers exactly the
+        // window (the committed share + the live + the chrome), r
+        // monotone, every row 1..H re-painted (the V6-1 every-row rule).
+        const all = [...frozen, ...committed, ...liveLines];
+        const skip = Math.max(0, all.length + CHROME_ROWS + queueRows.length + menuRows.length - H);
+        // A8b (the shrink-trigger's completion): the rows that LEAVE the
+        // window scroll into the terminal's scrollback — the LF mechanism
+        // (the steady path's own). Only the rows the paint re-covers (the
+        // overlap with the new window) are EL'd first — the A7 single-copy
+        // discipline; the purely-leaving rows scroll WITH their content
+        // (they are never re-painted — the scrollback is their record).
+        // Without the scroll the shrink frames overwrite the leaving rows
+        // in place — a batch-fed session (the queue drains every turn — a
+        // shrink EVERY frame) loses the scrolled-away turns from the
+        // terminal's scrollback entirely (finding #A8b — the queued-flood
+        // content loss).
+        if (skip > 0) {
+            const leaving = Math.max(0, skip - this.#lastSkip);
+            // A8b (the fresh leaving share): a leaving row whose old-screen
+            // copy is stale — the committed-this-frame lines (their old rows
+            // held the previous live/chrome) — is pre-painted at its OLD row
+            // so the LF scroll carries it into the scrollback; the frozen
+            // leaving rows are already on screen and scroll as-is. The first
+            // overflow frame of a batch: the window's top row is the freshly
+            // committed line, NEVER on the old screen — without the
+            // pre-paint the scroll pushes a blank and the line's only paint
+            // (the clamped march at row 1) is overwritten by its neighbor.
+            if (skip > frozen.length) {
+                const fromIdx = Math.max(0, this.#lastSkip - frozen.length);
+                const top = Math.min(skip - frozen.length, all.length - frozen.length);
+                for (let i = fromIdx; i < top; i += 1) {
+                    out.push(`\x1b[${Math.max(1, frozen.length + i - this.#lastSkip + 1)};1H\x1b[0K${this.#checked(all[frozen.length + i], W)}`);
+                }
+            }
+            if (leaving < skip)
+                out.push(`\x1b[${leaving + 1};1H\x1b[0J`);
+            out.push(`\x1b[${H};1H`);
+            for (let i = 0; i < skip; i += 1)
+                out.push("\n");
+        }
+        this.#lastSkip = skip;
         let r = 1;
-        // one march — the frozen, the committed (this frame's), the live —
-        // in write order, r monotone (three byte-identical loops merged for
-        // the gate; the exact write sequence preserved)
-        for (const line of [...frozen, ...committed, ...liveLines]) {
+        for (const line of all.slice(skip)) {
             out.push(`\x1b[${r};1H\x1b[0K${this.#checked(line, W)}`);
             r += 1;
         }
@@ -1070,7 +1240,13 @@ export class Body {
         for (let rr = r; rr <= H - 4; rr += 1) {
             out.push(`\x1b[${rr};1H\x1b[0K`);
         }
-        const menuTop = H - 3 - menuRows.length;
+        // W22: the queue chips sit directly above the box top (the
+        // "pre-render ABOVE the input row"), the menu above the queue.
+        const queueTop = H - 3 - queueRows.length;
+        const menuTop = H - 3 - queueRows.length - menuRows.length;
+        for (let i = 0; i < queueRows.length; i += 1) {
+            out.push(`\x1b[${queueTop + i};1H\x1b[0K${this.#checked(queueRows[i], W)}`);
+        }
         for (let i = 0; i < menuRows.length; i += 1) {
             out.push(`\x1b[${menuTop + i};1H\x1b[0K${this.#checked(menuRows[i], W)}`);
         }
@@ -1080,36 +1256,97 @@ export class Body {
         const editor = this.#inputRow(W, ctx);
         out.push(`\x1b[${H - 2};1H\x1b[0K${this.#checked(editor.stripped, W)}`);
         out.push(`\x1b[${H - 1};1H\x1b[0K${boxBottom(W)}`);
-        out.push(`\x1b[${H};1H\x1b[0K${this.#checked(statusLine(this.#status, this.#tail, this.#question !== null, W, this.#statusHint ?? undefined), W)}`);
-        // the cursor: up two (the input row at H−2) + left to the marker
+        const statusRow = this.#statusSource();
+        out.push(`\x1b[${H};1H\x1b[0K${this.#checked(statusLine(statusRow.status, this.#tail, W, statusRow.hint), W)}`);
+        // the cursor: up two (the input row at H−2) + the CHA to the
+        // marker's frame-derived column — W23: the afterW CUB retired
+        // (the CHA is absolute — the base is irrelevant; the CUB's base
+        // was the LAST write's end column, which the steady frame's ELs
+        // leave at col 1 — the A3 finding)
         out.push("\x1b[2A");
-        if (editor.afterW > 0)
-            out.push(`\x1b[${editor.afterW}D`);
+        out.push(`\x1b[${editor.markerCol}G`);
     }
     /** The steady-state frame — RELATIVE moves only (invariant ②); the
      *  commits scroll via the CUP-free real LF at the last row, and the
      *  committed lines write in the march's top section (rows
      *  [liveTop−N .. liveTop−1] — the frozen area's bottom). */
-    #drawSteady(out, W, H, liveTop, liveLines, menuRows, ctx) {
+    #drawSteady(out, W, H, liveTop, liveLines, queueRows, menuRows, ctx) {
         const editor = this.#inputRow(W, ctx); // derived from the frame — the marker
         const committed = this.#committedLinesThisFrame;
-        // the jump from the anchor (H−2) straight to the bottom row H,
-        // then N real LFs scroll the screen exactly N rows — ONE per
-        // committed line (the bookkeeping; the stale 1B anchor jumped to
-        // H−1 and the N LFs scrolled only N−1 — the committed section sat
-        // one row short in the scrollback). The bottom-up repaint below
-        // overwrites the scrolled-in rows (the scroll count is screen-
-        // neutral — proven by the emulator probe).
-        out.push("\x1b[2B");
+        // A8b: the steady path's window geometry — the same skip as the full
+        // path's (#lastSkip's formula): the model rows above the window
+        // belong in the scrollback. frozenCount = the committed lines BEFORE
+        // this frame — the lines this frame commits start at model row
+        // frozenCount, so the lines at [frozenCount..skip−1] are the fresh
+        // leaving share (their old-screen copies are stale).
+        const frozenCount = this.#committedLines - committed.length;
+        const skip = Math.max(0, this.#committedLines + liveLines.length + CHROME_ROWS + queueRows.length + menuRows.length - H);
+        const leaving = Math.max(0, skip - this.#lastSkip);
+        // the jump to the bottom row H, then N real LFs scroll the screen
+        // exactly N rows — ONE per committed line (the bookkeeping; the
+        // stale 1B anchor jumped to H−1 and the N LFs scrolled only N−1 —
+        // the committed section sat one row short in the scrollback). The
+        // bottom-up repaint below overwrites the scrolled-in rows (the
+        // scroll count is screen-neutral — proven by the emulator probe).
+        // A7: the scrolled rows carry the PRE-FRAME live copies (the
+        // streamed rendering of the just-committed cells) into the
+        // scrollback — a real terminal keeps them forever, and the
+        // repaint's fresh copy below makes the two copies the reviewer
+        // saw. The old live band is EL'd BEFORE the scroll: the rows that
+        // scroll away are blank, the repaint is the only copy (the old
+        // band's rows are all re-drawn this frame — live CUP, gap ELs,
+        // chrome march — so the erase is invisible).
+        if (committed.length > 0) {
+            // A8b (the steady path's own leaving scroll): the fresh leaving
+            // lines — the committed-this-frame/live lines at model rows
+            // [frozenCount..skip−1], whose old-screen copies are stale (the
+            // previous live/chrome) — are pre-painted at their OLD rows so
+            // the LF scroll carries them into the scrollback. The queued
+            // flood's first frame: the window's top row is the user chip,
+            // never on the old screen — without the pre-paint the scroll
+            // pushes a blank and the chip's ONLY paint (the clamped band at
+            // row 1) is overwritten by its neighbor in the same frame
+            // (finding #A8b — the user chips 1..8 lost from the terminal
+            // state).
+            if (leaving > 0 && skip > frozenCount) {
+                const seq = [...committed, ...liveLines];
+                const top = Math.min(skip - frozenCount, seq.length);
+                for (let i = Math.max(0, this.#lastSkip - frozenCount); i < top; i += 1) {
+                    out.push(`\x1b[${Math.max(1, frozenCount + i - this.#lastSkip + 1)};1H\x1b[0K${this.#checked(seq[i], W)}`);
+                }
+            }
+            const oldBottom = Math.min(H, this.#lastLiveTop + this.#lastLiveRows);
+            // A8b: the EL covers the OVERLAP only — the old live band's rows
+            // the repaint re-draws (the A7 single-copy discipline). The
+            // leaving rows below the overlap scroll WITH their content —
+            // they are never re-painted, the scrollback is their record (the
+            // old code erased them and the scrolled-away rows came up blank —
+            // the A8b content loss).
+            const overlapFrom = Math.max(1, this.#lastLiveTop, leaving + 1);
+            for (let r = overlapFrom; r <= oldBottom; r += 1) {
+                out.push(`\x1b[${r};1H\x1b[0K`);
+            }
+            out.push(`\x1b[${H};1H`); // CUP to the bottom — the absolute scroll base (the ELs moved the cursor)
+        }
+        else {
+            out.push("\x1b[2B"); // the anchor (H−2) to the bottom — no scroll
+        }
         for (let i = 0; i < committed.length; i += 1)
             out.push("\n");
         // the bottom-up repaint, from the last row up — V6-3 + W6: the
         // design §03 chrome: status (H), box bottom (H−1), input (H−2),
         // box top (H−3)
-        out.push(`\x1b[1G\x1b[0K${this.#checked(statusLine(this.#status, this.#tail, this.#question !== null, W, this.#statusHint ?? undefined), W)}`); // H — the status
+        const statusRow = this.#statusSource();
+        out.push(`\x1b[1G\x1b[0K${this.#checked(statusLine(statusRow.status, this.#tail, W, statusRow.hint), W)}`); // H — the status
         out.push(`\x1b[1A\x1b[1G\x1b[0K${boxBottom(W)}`); // H−1 — the box bottom
         out.push(`\x1b[1A\x1b[1G\x1b[0K${this.#checked(editor.stripped, W)}`); // H−2 — the input
         out.push(`\x1b[1A\x1b[1G\x1b[0K${boxTop(W)}`); // H−3 — the box top
+        // W22: the queue chips sit directly above the box top (the
+        // "pre-render ABOVE the input row"), the menu above the queue —
+        // the bottom-up order mirrors the row order.
+        for (let i = queueRows.length - 1; i >= 0; i -= 1) {
+            out.push(`\x1b[1A\x1b[1G\x1b[0K${this.#checked(queueRows[i], W)}`);
+        }
         for (let i = menuRows.length - 1; i >= 0; i -= 1) {
             out.push(`\x1b[1A\x1b[1G\x1b[0K${this.#checked(menuRows[i], W)}`);
         }
@@ -1130,9 +1367,10 @@ export class Body {
         // could).
         // 1. the GAP rows (between the live content and the chrome) — EL'd
         //    so the old content there cannot ghost; the range stops ABOVE
-        //    the menu (the menu's rows at [H−3−menu..H−4] are marched and
-        //    must survive — the unclamped geometry erased them).
-        for (let r = liveTop + liveLines.length; r <= H - 4 - menuRows.length; r += 1) {
+        //    the queue + menu bands (their rows at [H−3−queue−menu..H−4]
+        //    are marched and must survive — the unclamped geometry erased
+        //    them).
+        for (let r = liveTop + liveLines.length; r <= H - 4 - queueRows.length - menuRows.length; r += 1) {
             out.push(`\x1b[${r};1H\x1b[0K`);
         }
         // 2. the STALE rows above the committed section — the scrolled old
@@ -1145,7 +1383,14 @@ export class Body {
         //    CLAMP at 1: a super-tall force-commit's early lines have no
         //    on-screen row (they would need a negative CUP — terminal
         //    undefined behavior); their content stays in the scrollback.
-        for (let i = 0; i < committed.length; i += 1) {
+        //    A8b: the first (skip − frozenCount) lines are ABOVE the new
+        //    window — they were pre-painted and scrolled; re-painting them
+        //    would re-clamp them into row 1 and the band's second line
+        //    overwrites the first in the same frame (the row-1 clamp pile —
+        //    the queued flood lost the user chips 1..8 that way). The
+        //    window's share starts at the line whose model row is the
+        //    window's top (skip).
+        for (let i = Math.max(0, skip - frozenCount); i < committed.length; i += 1) {
             out.push(`\x1b[${Math.max(1, liveTop - committed.length + i)};1H\x1b[0K${this.#checked(committed[i], W)}`);
         }
         // the cursor: down to the anchor (H−2, the input row) + left to the marker —
@@ -1157,18 +1402,27 @@ export class Body {
             ? Math.max(1, liveTop - 1)
             : staleFrom < liveTop
                 ? liveTop - 1
-                : liveTop + liveLines.length <= H - 4 - menuRows.length
-                    ? H - 4 - menuRows.length
+                : liveTop + liveLines.length <= H - 4 - queueRows.length - menuRows.length
+                    ? H - 4 - queueRows.length - menuRows.length
                     : liveLines.length > 0
                         ? liveTop + liveLines.length - 1
                         : menuRows.length > 0
-                            ? H - 3 - menuRows.length
+                            ? H - 3 - menuRows.length - queueRows.length
                             : H - 3;
         const down = H - 2 - lastRow; // the anchor: the input row (H−2)
         if (down > 0)
             out.push(`\x1b[${down}B`);
-        if (editor.afterW > 0)
-            out.push(`\x1b[${editor.afterW}D`);
+        // W23: the CHA to the frame-derived column — the cursor rests AT
+        // the marker from ANY base (the retired afterW CUB clamped at col
+        // 1 — the steady frame's LAST write is the gap/stale EL: the A3
+        // finding; the A5/A8 live lines end mid-row, the ELs at col 1 —
+        // the CHA ignores the base by construction)
+        out.push(`\x1b[${editor.markerCol}G`);
+        // A8b: the steady path moves the window too (the scroll + the
+        // repaint) — record its top so the next full-redraw's leaving count
+        // is the rows the window dropped since the last frame, whatever the
+        // path of the frames between (same formula as `skip` above).
+        this.#lastSkip = skip;
     }
     /** Invariant ①: every emitted line fits the width — a violation is a
      *  CRASH with the diagnostic, never a silent truncate. */
@@ -1210,7 +1464,6 @@ export class Body {
  *  input/menu bindings, which the CLI performs BEFORE the Body exists,
  *  are buffered and applied by the Body's constructor. */
 export class Dock {
-    #menuState = null;
     get active() {
         return compositorRef !== null && compositorRef.active;
     }
@@ -1229,27 +1482,41 @@ export class Dock {
     setTail(tail) {
         compositorRef?.setTail(tail);
     }
-    showQuestion(question) {
-        compositorRef?.showQuestion(question);
-    }
-    clearQuestion() {
-        compositorRef?.clearQuestion();
+    /** W21: bind the editor's panel state — the PanelSelect slot
+     *  occupant (the panel replaces the live region + the input lead
+     *  while up; the old ApprovalPrompt's question slot retires). */
+    bindApproval(state) {
+        if (compositorRef === null) {
+            dockBindings.panel = state; // the live buffer — order-agnostic
+            return;
+        }
+        compositorRef.bindApproval(state);
     }
     bindInput(state, prompt) {
         if (compositorRef === null) {
-            // the Body is constructed AFTER the CLI's makeLineInput — buffer
-            // the binding; the Body's constructor applies it
-            dockBindings = { state, prompt, menu: this.#menuState };
+            dockBindings.state = state; // the live buffer — order-agnostic
+            dockBindings.prompt = prompt;
             return;
         }
         compositorRef.bindInput(state, prompt);
     }
     bindMenu(state) {
-        this.#menuState = state;
-        if (compositorRef === null)
+        if (compositorRef === null) {
+            dockBindings.menu = state;
             return;
+        }
         compositorRef.bindMenu(state);
     }
+    /** W22: bind the pending-turn queue — the chips + the +N queued
+     *  hint (the CLI binds it from chat(); the editor's pop keys ride
+     *  the LineInput's own bindQueue). */
+    bindQueue(state) {
+        if (compositorRef === null) {
+            dockBindings.queue = state;
+            return;
+        }
+        compositorRef.bindQueue(state);
+    }
     editCol() {
         return compositorRef?.editCol() ?? 1;
     }
@@ -1259,6 +1526,10 @@ export class Dock {
 }
 /** The one-compositor registry — the Dock façade routes to it. */
 let compositorRef = null;
-/** The Dock's pre-compositor bindings — the CLI binds the editor state
- *  before the Body exists; the Body's constructor consumes them. */
-let dockBindings = null;
+/** The Dock's pre-compositor bindings — a LIVE object the bind methods
+ *  mutate (the CLI binds the editor state before the Body exists; the
+ *  Body's constructor applies it). W21: order-agnostic by construction
+ *  — the old snapshot froze `menu` at bindInput time and the slash-
+ *  command menu silently never bound in the real CLI (the e2e gates
+ *  bind the Body directly and could not see it). */
+const dockBindings = { state: null, prompt: "", menu: null, panel: null, queue: null };