@north-light/crouter 0.3.170 → 0.3.172

package/dist/clients/attach/input/controller.d.ts

@@ -1,6 +1,7 @@
 import type { CustomEditor } from '@earendil-works/pi-coding-agent';
 import type { Component, KeybindingsManager, TUI } from '@earendil-works/pi-tui';
 import { type BrokerDataFrame, type ClientRole, type BrokerSnapshot, type ClientToBroker, type RpcExtensionUIRequest, type RpcExtensionUIResponse } from '../../../core/runtime/broker-protocol.js';
+import type { CopyTarget } from '../render/transcript-copy.js';
 import type { ReadOpRequest } from '../../../core/broker-client/index.js';
 import { type Picker, type PickerControls } from '../overlays/pickers.js';
 export interface InputControllerHooks {
@@ -33,12 +34,23 @@ export interface InputControllerHooks {
     /** OPTIONAL: toggle the GRAPH overlay — forwarded to the slash context so
      *  `/graph` opens/closes it (Unit Q wires it from runAttach). */
     onGraph?: () => void;
+    /** OPTIONAL: toggle the human inbox surface — forwarded to the slash context so `/inbox` opens/closes it. */
+    onInbox?: () => void;
+    /** OPTIONAL: toggle the Help overlay — forwarded to the slash context so
+     *  `/hotkeys` opens/closes it. */
+    onHelp?: () => void;
     /** OPTIONAL: detach the viewer — forwarded to the slash context so `/quit`
      *  tears down the TUI/socket (the engine keeps running). Wired by viewer.ts. */
     onQuit?: () => void;
     /** OPTIONAL: copy the last assistant message to the clipboard — forwarded to
      *  the slash context so `/copy` works. Wired by viewer.ts (it owns ChatView). */
     onCopy?: () => void;
+    /** OPTIONAL: copy a viewer-local transcript target — forwarded to the slash
+     *  context so `/copy-message`, `/copy-tool`, and `/copy-transcript` work. */
+    onCopyTarget?: (target: CopyTarget) => void;
+    /** OPTIONAL: toggle mouse wheel reporting — forwarded to the slash context so
+     *  `/mouse` can change viewer-local mouse state. */
+    onToggleMouse?: () => void;
     /** OPTIONAL: recolor the editor's name chip — forwarded to the slash context
      *  so `/color` paints it (`null` clears). Wired by viewer.ts (it owns the
      *  TitledEditor). */
@@ -79,6 +91,9 @@ export interface InputControllerHooks {
      *  by viewer.ts to `cliClient().sendMessage`; absent (e.g. remote attach) →
      *  the dormant-submit path is disabled and prompts fall through as before. */
     onDormantSubmit?: (text: string) => void;
+    /** OPTIONAL: a real prompt or steer was accepted from the editor, including a
+     *  dormant wake-message submit. Slash commands and bash submissions do not fire it. */
+    onPromptSent?: () => void;
 }
 export declare class InputController {
     private readonly tui;
@@ -122,6 +137,10 @@ export declare class InputController {
      *  key listener owns rather than the editor's action table. Public so that
      *  binding rides the gate above instead of going straight to the socket. */
     cycleLadder(direction: 'forward' | 'backward'): void;
+    /** Send viewer-owned text without touching the editor or its history. The
+     *  broker aborts an active turn before starting this prompt, so a whip never
+     *  waits in pi's steering queue behind the work it is meant to replace. */
+    sendInterrupting(text: string): boolean;
     /** Render extension UI requests from the broker. Blocking dialogs route their
      *  answer back to the broker; non-blocking notify requests become the viewer's
      *  normal notice line and NOTHING else — a notify must never tear down an

package/dist/clients/attach/input/controller.js

@@ -20,6 +20,7 @@ import { BROKER_READ_CAPS, encodeFrame, } from '../../../core/runtime/broker-pro
 import { isBlockingDialog, renderDialog } from '../overlays/dialogs.js';
 import { readClipboardImage, writeClipboardImageToFile } from './clipboard-image.js';
 import { dispatchSlashCommand, isSlashCommand, readOnlySlashRefusal } from '../slash/dispatch.js';
+import { classifySubmit } from '../../conversation/submit.js';
 import { buildForkPicker, buildModelPicker, buildScopedModelsPicker, buildSessionPicker, buildSettingsPicker, buildTreePicker, } from '../overlays/pickers.js';
 import { buildMcpPicker, readMcpServers, startMcpServerAction, MCP_EMPTY_STATE_HINT } from '../overlays/mcp.js';
 import { buildFileReviewPicker } from '../overlays/file-review.js';
@@ -123,6 +124,12 @@ export class InputController {
     cycleLadder(direction) {
         this.emitCommand({ type: 'cycle_ladder', direction });
     }
+    /** Send viewer-owned text without touching the editor or its history. The
+     *  broker aborts an active turn before starting this prompt, so a whip never
+     *  waits in pi's steering queue behind the work it is meant to replace. */
+    sendInterrupting(text) {
+        return this.emitDrive({ type: 'prompt', text, interrupt: true });
+    }
     /** Render extension UI requests from the broker. Blocking dialogs route their
      *  answer back to the broker; non-blocking notify requests become the viewer's
      *  normal notice line and NOTHING else — a notify must never tear down an
@@ -240,8 +247,12 @@ export class InputController {
             remote: this.hooks.remote,
             role: this.hooks.role,
             onGraph: this.hooks.onGraph,
+            onInbox: this.hooks.onInbox,
+            onHelp: this.hooks.onHelp,
             onQuit: this.hooks.onQuit,
             onCopy: this.hooks.onCopy,
+            onCopyTarget: this.hooks.onCopyTarget,
+            onToggleMouse: this.hooks.onToggleMouse,
             onColor: this.hooks.onColor,
             onNodeMetadata: this.hooks.onNodeMetadata,
             onFoldTools: this.hooks.onFoldTools,
@@ -425,7 +436,13 @@ export class InputController {
     /** Open the transcript-backed file-review picker. The caller owns the popup
      *  process and cursor insertion; this controller only owns picker lifetime. */
     openFileReviewPicker(candidates, cwd, onChoose) {
-        this.showPicker((controls) => buildFileReviewPicker(candidates, cwd, onChoose, controls.close, (message) => this.notify(message)));
+        this.showPicker((controls) => buildFileReviewPicker(candidates, cwd, (file) => {
+            // The review mounts a full-pane surface and takes focus. Close this
+            // picker first so its editor-focus restoration cannot steal focus
+            // back from the newly mounted review.
+            controls.close();
+            onChoose(file);
+        }, controls.close, (message) => this.notify(message)));
     }
     /** Open a viewer-local auth picker (login/logout) — uses the same showPicker
      *  machinery as read-op pickers, but with a locally-built component (no read-op
@@ -465,56 +482,73 @@ export class InputController {
                 return;
             }
         }
-        // Node dormant → there is NO broker to drive. Rather than emit a prompt/steer
-        // frame into a dead socket (the old "I typed and nothing happened" trap),
-        // deliver the text as a wake message: it revives the node and lands as the
-        // first thing it reads, and the reconnect supervisor repaints the live pane.
-        // Local-only — remote attach leaves onDormantSubmit unwired, so prompts fall
-        // through unchanged there. Slash commands are dispatched above and don't reach
-        // here, so `/quit`-style local commands keep working while dormant.
-        if (this.hooks.isDormant?.() === true && this.hooks.onDormantSubmit !== undefined) {
+        // Classify the remaining cases: dormant, bash, prompt/steer.
+        const isDormant = this.hooks.isDormant?.() === true;
+        const onDormantSubmit = this.hooks.onDormantSubmit;
+        const classification = classifySubmit(text, {
+            isDormant,
+            canWakeDormant: isDormant && onDormantSubmit !== undefined,
+            isStreaming: this.state?.isStreaming === true,
+        });
+        if (classification.kind === 'empty')
+            return;
+        if (classification.kind === 'dormant') {
+            // Node dormant → there is NO broker to drive. Rather than emit a prompt/steer
+            // frame into a dead socket (the old "I typed and nothing happened" trap),
+            // deliver the text as a wake message: it revives the node and lands as the
+            // first thing it reads, and the reconnect supervisor repaints the live pane.
+            // Local-only — remote attach leaves onDormantSubmit unwired, so prompts fall
+            // through unchanged there. Slash commands are dispatched above and don't reach
+            // here, so `/quit`-style local commands keep working while dormant.
             // Raw text (whitespace and all) — not `trimmed` — per Major 4: emptiness is
             // judged on the trimmed view above, but what's actually delivered is the
             // human's exact typed content, same as the prompt/steer frame below.
-            const expanded = this.expandImagePlaceholders(text);
-            this.hooks.onDormantSubmit(expanded);
-            this.editor.addToHistory(trimmed);
+            if (onDormantSubmit === undefined)
+                return;
+            const expanded = this.expandImagePlaceholders(classification.text);
+            onDormantSubmit(expanded);
+            this.editor.addToHistory(classification.trimmed);
             this.editor.setText('');
             this.clearPastedImages();
+            this.hooks.onPromptSent?.();
             return;
         }
-        // `!cmd` / `!!cmd` → run bash in the engine and inject output into context,
-        // WITHOUT starting an agent turn (pi-native `!` semantics). `!!` withholds
-        // the output from the LLM. The broker relays the run as bash_* frames.
-        if (trimmed.startsWith('!')) {
-            const excludeFromContext = trimmed.startsWith('!!');
-            const command = trimmed.slice(excludeFromContext ? 2 : 1).trim();
-            if (command === '')
-                return; // bare `!`/`!!`: nothing to run
-            if (!this.emitDrive({ type: 'bash', command, excludeFromContext }))
+        if (classification.kind === 'bash') {
+            // `!cmd` / `!!cmd` → run bash in the engine and inject output into context,
+            // WITHOUT starting an agent turn (pi-native `!` semantics). `!!` withholds
+            // the output from the LLM. The broker relays the run as bash_* frames.
+            if (!this.emitDrive({ type: 'bash', command: classification.command, excludeFromContext: classification.excludeFromContext }))
                 return;
-            this.editor.addToHistory(trimmed);
+            this.editor.addToHistory(classification.trimmed);
             this.editor.setText('');
             return;
         }
-        // Submit-while-streaming = steer (pi-native parity): interject into the
-        // running turn instead of queueing a fresh prompt. `isStreaming` is the
+        // An unrecognized slash command belongs to the engine's extension runner.
+        // `dispatchSlashCommand` returned false above, so route it exactly like
+        // ordinary text instead of dropping the classifier's intermediate `slash`
+        // result. Submit-while-streaming = steer (pi-native parity): interject into
+        // the running turn instead of queueing a fresh prompt. `isStreaming` is the
         // broker snapshot's busy signal; the broker routes `steer` → session.steer()
         // and `prompt` → session.prompt(). Idle / no state yet → prompt (safe default).
         // Classification above (slash/dormant/bash/emptiness) reads the TRIMMED
         // view, but the frame itself carries the exact editor text (post image-
         // placeholder substitution) — leading/trailing whitespace is the human's,
         // not ours to discard.
-        const expanded = this.expandImagePlaceholders(text);
-        const busy = this.state?.isStreaming === true;
-        const frame = busy
+        const delivery = classification.kind === 'slash'
+            ? (this.state?.isStreaming === true ? 'steer' : 'prompt')
+            : classification.kind;
+        if (delivery !== 'steer' && delivery !== 'prompt')
+            return;
+        const expanded = this.expandImagePlaceholders(classification.kind === 'slash' ? text : classification.text);
+        const frame = delivery === 'steer'
             ? { type: 'steer', text: expanded }
             : { type: 'prompt', text: expanded };
         if (!this.emitDrive(frame))
             return; // refused or too large — no frame emitted
-        this.editor.addToHistory(trimmed);
+        this.editor.addToHistory(classification.trimmed);
         this.editor.setText('');
         this.clearPastedImages();
+        this.hooks.onPromptSent?.();
     }
     handleFollowUp() {
         const text = this.editor.getText();

package/dist/clients/attach/input/titled-editor.d.ts

@@ -144,16 +144,12 @@ export declare class TitledEditor extends CustomEditor {
     /** Pre-styled context string painted into the RIGHT of the top border (cwd /
      *  branch / git status). Already colorized by the caller; empty → omitted. */
     info: string;
-    /** Editor-mode badge painted into the bottom-right of the outline. Empty → omitted. */
-    mode: string;
     /** Node and workspace badge painted at the far bottom-right of the outline. */
     contextBadge: string;
     /** Paint the chip solid so the name reads as a label sitting on the border
      *  rule. Defaults to the reverse-video chip; viewer.ts swaps in a
      *  thinking-colored background (bold white text) on each state update. */
     titleStyle: (s: string) => string;
-    /** Editor-mode badge colorizer, matched to the current mode type. */
-    modeStyle: (s: string) => string;
     /** Node and workspace badge colorizer, matched to the editor frame. */
     contextBadgeStyle: (s: string) => string;
     /** Whether the hosting tmux pane / terminal window has FOCUS (terminal focus

package/dist/clients/attach/input/titled-editor.js

@@ -640,16 +640,12 @@ export class TitledEditor extends CustomEditor {
     /** Pre-styled context string painted into the RIGHT of the top border (cwd /
      *  branch / git status). Already colorized by the caller; empty → omitted. */
     info = '';
-    /** Editor-mode badge painted into the bottom-right of the outline. Empty → omitted. */
-    mode = '';
     /** Node and workspace badge painted at the far bottom-right of the outline. */
     contextBadge = '';
     /** Paint the chip solid so the name reads as a label sitting on the border
      *  rule. Defaults to the reverse-video chip; viewer.ts swaps in a
      *  thinking-colored background (bold white text) on each state update. */
     titleStyle = defaultTitleStyle;
-    /** Editor-mode badge colorizer, matched to the current mode type. */
-    modeStyle = defaultTitleStyle;
     /** Node and workspace badge colorizer, matched to the editor frame. */
     contextBadgeStyle = defaultTitleStyle;
     /** Whether the hosting tmux pane / terminal window has FOCUS (terminal focus
@@ -784,12 +780,8 @@ export class TitledEditor extends CustomEditor {
             // border color.
             lines[0] = composeTopBorder(width, this.title, this.info, this.titleStyle, (s) => this.borderColor(s));
         }
-        if ((this.mode || this.contextBadge) && lines.length > 0) {
-            // Context stays at the far edge; an active editor mode sits immediately
-            // to its left as the local state badge for this input surface.
-            const modeBadge = this.mode ? this.modeStyle(this.mode) : '';
-            const contextBadge = this.contextBadge ? this.contextBadgeStyle(this.contextBadge) : '';
-            const badge = modeBadge + contextBadge;
+        if (this.contextBadge && lines.length > 0) {
+            const badge = this.contextBadgeStyle(this.contextBadge);
             const badgeWidth = visibleWidth(badge);
             if (badgeWidth + 2 < width) {
                 const last = lines.length - 1;

package/dist/clients/attach/overlays/file-review.d.ts

@@ -1,9 +1,13 @@
-import type { AccessoryOutcome } from '@crouton-kit/humanloop';
+import type { TUI } from '@earendil-works/pi-tui';
+import type { CanvasSource } from '../../../core/canvas/source.js';
+import type { SurfaceHost } from '../../surfaces/host.js';
 import type { Picker } from './pickers.js';
-import { extractFilePaths } from '../visible-paths.js';
+import { extractFilePaths } from '#core/human/visible-paths';
 export declare function buildFileReviewPicker(candidates: readonly string[], cwd: string, onChoose: (file: string) => void, close: () => void, notify: (message: string) => void): Picker;
-export declare function launchFileReview(file: string, cwd: string, opts: {
-    onDone: (outcome: AccessoryOutcome) => void;
+export declare function launchFileReview(host: SurfaceHost, file: string, opts: {
+    originNodeId: string;
+    tui: TUI;
+    canvasSource: CanvasSource;
     onNotice: (message: string) => void;
-}): void;
+}): Promise<void>;
 export { extractFilePaths };

package/dist/clients/attach/overlays/file-review.js

@@ -1,13 +1,10 @@
-import { execFile } from 'node:child_process';
-import { existsSync, mkdtempSync, readFileSync, rmSync } from 'node:fs';
-import { homedir, tmpdir } from 'node:os';
+import { homedir } from 'node:os';
 import { isAbsolute, join, relative, resolve } from 'node:path';
-import { fileURLToPath } from 'node:url';
 import { Input, SelectList, getKeybindings, } from '@earendil-works/pi-tui';
 import { getSelectListTheme } from '@earendil-works/pi-coding-agent';
-import { shellQuote } from '../../../core/runtime/placement-tmux.js';
-import { surfaceTmuxStyleArgs } from '../../../core/runtime/surface-bg.js';
-import { checkReviewableFile, extractFilePaths } from '../visible-paths.js';
+import { openComposedReview } from '../../inbox/review/launch.js';
+import { createReviewClient } from '../../inbox/review/review-client.js';
+import { checkReviewableFile, extractFilePaths } from '#core/human/visible-paths';
 const MAX_VISIBLE_ROWS = 12;
 function labelForPath(file, cwd) {
     const rel = relative(cwd, file);
@@ -103,79 +100,21 @@ class FileReviewPicker {
             this.notify(check.reason);
             return;
         }
-        this.close();
         this.onChoose(file);
+        this.close();
     }
 }
 export function buildFileReviewPicker(candidates, cwd, onChoose, close, notify) {
     const picker = new FileReviewPicker(candidates, cwd, onChoose, close, notify);
     return { component: picker, focus: picker };
 }
-function parseOutcome(path, notify) {
-    let text;
-    try {
-        text = readFileSync(path, 'utf8');
-    }
-    catch {
-        return { kind: 'cancel' };
-    }
-    let raw;
-    try {
-        raw = JSON.parse(text);
-    }
-    catch {
-        notify('File review result was invalid');
-        return { kind: 'cancel' };
-    }
-    if (typeof raw !== 'object' || raw === null || !('kind' in raw)) {
-        notify('File review result was invalid');
-        return { kind: 'cancel' };
-    }
-    const result = raw;
-    if (result.kind === 'cancel')
-        return { kind: 'cancel' };
-    if ((result.kind === 'insert' || result.kind === 'copy') && typeof result.text === 'string') {
-        return { kind: result.kind, text: result.text };
-    }
-    notify('File review result was invalid');
-    return { kind: 'cancel' };
-}
-export function launchFileReview(file, cwd, opts) {
-    let dir;
-    try {
-        dir = mkdtempSync(join(tmpdir(), 'crtr-review-'));
-    }
-    catch (err) {
-        opts.onNotice(`Could not prepare file review: ${err instanceof Error ? err.message : String(err)}`);
-        return;
-    }
-    const result = join(dir, 'result.json');
-    // Run the humanloop CLI we depend on, not whatever `hl` is first on PATH: a global hl
-    // older than our exact pin has no `review file` leaf and the popup dies on an unknown command.
-    const hlCli = fileURLToPath(import.meta.resolve('@crouton-kit/humanloop/cli'));
-    const cmd = `cd ${shellQuote(cwd)} && exec ${shellQuote(process.execPath)} ${shellQuote(hlCli)} review file --path ${shellQuote(file)} --cwd ${shellQuote(cwd)} --result ${shellQuote(result)}`;
+export async function launchFileReview(host, file, opts) {
     try {
-        execFile('tmux', ['display-popup', '-E', '-T', ' file review ', '-w', '90%', '-h', '85%', ...surfaceTmuxStyleArgs(), cmd], (err) => {
-            try {
-                if (err && !existsSync(result)) {
-                    opts.onNotice(`File review did not run: ${err.message}`);
-                    opts.onDone({ kind: 'cancel' });
-                    return;
-                }
-                const outcome = parseOutcome(result, opts.onNotice);
-                opts.onDone(outcome);
-            }
-            catch (err) {
-                opts.onNotice(`Could not finish file review: ${err instanceof Error ? err.message : String(err)}`);
-            }
-            finally {
-                rmSync(dir, { recursive: true, force: true });
-            }
-        });
+        const review = await createReviewClient().createInline({ originNodeId: opts.originNodeId, file });
+        await openComposedReview(host, { reviewId: review.reviewId, tui: opts.tui, canvasSource: opts.canvasSource });
     }
     catch (err) {
-        rmSync(dir, { recursive: true, force: true });
-        opts.onNotice(`Could not open file review: ${err instanceof Error ? err.message : String(err)}`);
+        opts.onNotice(err instanceof Error ? err.message : String(err));
     }
 }
 export { extractFilePaths };

package/dist/clients/attach/overlays/help.d.ts

@@ -0,0 +1,33 @@
+import { type Component, type TUI } from '@earendil-works/pi-tui';
+import type { AttachPalette } from '../config.js';
+import type { AttachBindings } from '../session/bindings.js';
+/** A bounded, focused reference for the attach viewer's viewport controls. */
+export declare class HelpOverlay implements Component {
+    private readonly tui;
+    private readonly pal;
+    private handle;
+    private bindings;
+    private scrollTop;
+    private lastContentRows;
+    constructor(tui: TUI, pal: AttachPalette);
+    /** Re-resolve key spellings after `/reload` (mirrors GraphOverlay.setBindings). */
+    setBindings(bindings: AttachBindings): void;
+    toggle(): void;
+    close(): void;
+    isOpen(): boolean;
+    invalidate(): void;
+    render(width: number): string[];
+    handleInput(data: string): boolean;
+    private open;
+    private matchesBinding;
+    private scrollBy;
+    private pageSize;
+    private body;
+    private lines;
+    private binding;
+    private wrap;
+    private style;
+    private boxRow;
+    private borderRow;
+    private renderNarrow;
+}

package/dist/clients/attach/overlays/help.js

@@ -0,0 +1,204 @@
+import { matchesKey, truncateToWidth, visibleWidth, } from '@earendil-works/pi-tui';
+import { ATTACH_CONTROL_BINDINGS, BINDING_CATALOG, formatBinding, matchesPiTuiInput, } from '../../../core/keybindings/index.js';
+const HEIGHT_PCT = 0.72;
+const OVERLAY_OPTIONS = { anchor: 'center', width: '72%', minWidth: 48, maxHeight: '72%', margin: 1 };
+/** A bounded, focused reference for the attach viewer's viewport controls. */
+export class HelpOverlay {
+    tui;
+    pal;
+    handle;
+    bindings;
+    scrollTop = 0;
+    lastContentRows = 1;
+    constructor(tui, pal) {
+        this.tui = tui;
+        this.pal = pal;
+    }
+    /** Re-resolve key spellings after `/reload` (mirrors GraphOverlay.setBindings). */
+    setBindings(bindings) {
+        this.bindings = bindings;
+        if (this.handle !== undefined)
+            this.tui.requestRender();
+    }
+    toggle() {
+        if (this.handle === undefined)
+            this.open();
+        else
+            this.close();
+    }
+    close() {
+        if (this.handle === undefined)
+            return;
+        this.handle.hide();
+        this.handle = undefined;
+        this.tui.requestRender();
+    }
+    isOpen() {
+        return this.handle !== undefined;
+    }
+    invalidate() {
+        if (this.handle !== undefined)
+            this.tui.requestRender();
+    }
+    render(width) {
+        const panelWidth = Math.max(1, width);
+        if (panelWidth < 5)
+            return this.renderNarrow(panelWidth);
+        const innerWidth = panelWidth - 4;
+        const allLines = this.body(innerWidth);
+        const terminalRows = Math.max(1, this.tui.terminal.rows);
+        const maxPanelHeight = Math.max(3, Math.min(Math.floor(terminalRows * HEIGHT_PCT), Math.max(3, terminalRows - 2)));
+        const bodyRows = Math.max(1, maxPanelHeight - 2);
+        const overflow = allLines.length > bodyRows;
+        const contentRows = overflow && bodyRows >= 3 ? bodyRows - 2 : 1;
+        this.lastContentRows = contentRows;
+        this.scrollTop = Math.max(0, Math.min(this.scrollTop, Math.max(0, allLines.length - contentRows)));
+        const end = Math.min(allLines.length, this.scrollTop + contentRows);
+        const body = [];
+        if (overflow && bodyRows >= 3) {
+            body.push(this.scrollTop > 0 ? this.pal.muted(`↑ ${this.scrollTop} more`) : '');
+        }
+        body.push(...allLines.slice(this.scrollTop, end));
+        if (overflow && bodyRows >= 3) {
+            body.push(end < allLines.length ? this.pal.muted(`↓ ${allLines.length - end} more`) : '');
+        }
+        else if (overflow && bodyRows === 2) {
+            body.push(end < allLines.length ? this.pal.muted(`↓ ${allLines.length - end} more`) : '');
+        }
+        while (body.length < bodyRows)
+            body.push('');
+        const title = this.pal.bold(this.pal.accent('⌨ attach help'));
+        const hint = this.pal.muted('esc dismiss · ↑↓ scroll');
+        return [
+            this.borderRow('╭', '╮', title, panelWidth),
+            ...body.map((line) => this.boxRow(line, panelWidth)),
+            this.borderRow('╰', '╯', hint, panelWidth),
+        ].map(this.pal.surface);
+    }
+    handleInput(data) {
+        if (matchesKey(data, 'escape') || matchesKey(data, 'q')) {
+            this.close();
+            return true;
+        }
+        if (matchesKey(data, 'up') || this.matchesBinding('crtr.attach.scroll.up', data))
+            return this.scrollBy(-1);
+        if (matchesKey(data, 'down') || this.matchesBinding('crtr.attach.scroll.down', data))
+            return this.scrollBy(1);
+        if (matchesKey(data, 'pageUp') || this.matchesBinding('crtr.attach.scroll.page-up', data))
+            return this.scrollBy(-this.pageSize());
+        if (matchesKey(data, 'pageDown') || this.matchesBinding('crtr.attach.scroll.page-down', data))
+            return this.scrollBy(this.pageSize());
+        return true;
+    }
+    open() {
+        this.scrollTop = 0;
+        this.handle = this.tui.showOverlay(this, OVERLAY_OPTIONS);
+    }
+    matchesBinding(id, data) {
+        return this.bindings !== undefined && matchesPiTuiInput(this.bindings, id, data, (input, gesture) => matchesKey(input, gesture));
+    }
+    scrollBy(lines) {
+        const lineCount = this.body(Math.max(1, this.tui.terminal.columns - 4)).length;
+        const maxTop = Math.max(0, lineCount - this.lastContentRows);
+        const next = Math.max(0, Math.min(maxTop, this.scrollTop + lines));
+        if (next !== this.scrollTop) {
+            this.scrollTop = next;
+            this.tui.requestRender();
+        }
+        return true;
+    }
+    pageSize() {
+        return Math.max(1, this.lastContentRows - 1);
+    }
+    body(width) {
+        return this.lines().flatMap((line) => this.wrap(line.text, width).map((text) => this.style(text, line.style)));
+    }
+    lines() {
+        const binding = (id, description) => ({
+            text: `${this.binding(id)}  ${description}`,
+            style: 'plain',
+        });
+        const heading = (text) => ({ text, style: 'heading' });
+        const muted = (text) => ({ text, style: 'muted' });
+        const blank = { text: '', style: 'plain' };
+        const otherKeys = ATTACH_CONTROL_BINDINGS.map(({ actionId }) => {
+            const name = BINDING_CATALOG.find((definition) => definition.id === actionId)?.name ?? actionId;
+            return binding(actionId, name);
+        });
+        return [
+            heading('Scrolling'),
+            binding('crtr.attach.scroll.up', 'scroll one line up'),
+            binding('crtr.attach.scroll.down', 'scroll one line down'),
+            binding('crtr.attach.scroll.page-up', 'scroll one page up'),
+            binding('crtr.attach.scroll.page-down', 'scroll one page down'),
+            binding('crtr.attach.scroll.live', 'return to the live bottom'),
+            muted('mouse wheel (when reporting is on)'),
+            blank,
+            heading('Selection and copy'),
+            { text: 'prefix + [  tmux copy-mode selects and copies the visible screenful; it works even while mouse reporting is on.', style: 'plain' },
+            { text: 'Option-drag (iTerm2, Terminal.app) or Shift-drag (Ghostty, Alacritty, xterm) makes a true terminal selection that bypasses mouse reporting.', style: 'plain' },
+            { text: 'Block-copy commands copy transcript content and are not capped at one screenful.', style: 'plain' },
+            blank,
+            heading('Copy commands'),
+            { text: '/copy  last assistant message.', style: 'plain' },
+            { text: `/copy-message (${this.binding('crtr.attach.copy.message')})  newest copyable block entirely visible in the viewport; otherwise the newest one that intersects it.`, style: 'plain' },
+            { text: "/copy-tool  newest tool call's result text.", style: 'plain' },
+            { text: "/copy-transcript  every copyable block's text, oldest to newest, joined by blank lines.", style: 'plain' },
+            blank,
+            heading('Mouse'),
+            { text: `/mouse or ${this.binding('crtr.attach.mouse.toggle')}  toggle mouse wheel scrolling. Turning it off restores tmux drag-select and copy-mode mouse.`, style: 'plain' },
+            blank,
+            heading('Other attach keys'),
+            ...otherKeys,
+        ];
+    }
+    binding(id) {
+        return this.bindings === undefined ? 'Loading…' : formatBinding(this.bindings, id);
+    }
+    wrap(text, width) {
+        if (text === '')
+            return [''];
+        const limit = Math.max(1, width);
+        const words = text.split(/\s+/);
+        const lines = [];
+        let current = '';
+        for (const word of words) {
+            const candidate = current === '' ? word : `${current} ${word}`;
+            if (current !== '' && visibleWidth(candidate) > limit) {
+                lines.push(truncateToWidth(current, limit, '', true));
+                current = `  ${word}`;
+            }
+            else {
+                current = candidate;
+            }
+        }
+        if (current !== '')
+            lines.push(truncateToWidth(current, limit, '', true));
+        return lines;
+    }
+    style(text, style) {
+        switch (style) {
+            case 'heading': return this.pal.bold(this.pal.accent(text));
+            case 'muted': return this.pal.muted(text);
+            case 'plain': return text;
+        }
+    }
+    boxRow(content, width) {
+        const innerWidth = width - 4;
+        const clipped = truncateToWidth(content, innerWidth, '', true);
+        const padding = ' '.repeat(Math.max(0, innerWidth - visibleWidth(clipped)));
+        return `${this.pal.border('│')} ${clipped}${padding} ${this.pal.border('│')}`;
+    }
+    borderRow(left, right, label, width) {
+        if (width < 6)
+            return truncateToWidth(`${this.pal.border(left)}${label}${this.pal.border(right)}`, width, '', true);
+        const span = width - 5;
+        const clipped = truncateToWidth(label, span, '…');
+        const fill = Math.max(0, width - 5 - visibleWidth(clipped));
+        return `${this.pal.border(`${left}─`)} ${clipped} ${this.pal.border('─'.repeat(fill) + right)}`;
+    }
+    renderNarrow(width) {
+        const title = truncateToWidth(this.pal.bold(this.pal.accent('help')), width, '', true);
+        return [this.pal.surface(title)];
+    }
+}

package/dist/clients/attach/render/activity-slot.d.ts

@@ -0,0 +1,4 @@
+import { Container } from '@earendil-works/pi-tui';
+export declare class ActivitySlot extends Container {
+    render(width: number): string[];
+}

package/dist/clients/attach/render/activity-slot.js

@@ -0,0 +1,13 @@
+// render/activity-slot.ts — the viewer-owned fixed activity row.
+//
+// pi's Loader prepends an empty line because its native placement is inline in
+// a flowing transcript. The fixed cockpit already owns spacing, so this slot
+// removes that margin and keeps Working/Compacting/Retrying flush with the next
+// bottom-region row.
+import { Container } from '@earendil-works/pi-tui';
+export class ActivitySlot extends Container {
+    render(width) {
+        const lines = super.render(width);
+        return lines[0] === '' ? lines.slice(1) : lines;
+    }
+}