@falkenslab/agent-kit 0.10.1

package/dist/tui/ink/PromptInput.js

@@ -0,0 +1,333 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext, useLayoutEffect, useReducer, useRef } from "react";
+import { Box, Text, useInput, useStdout } from "ink";
+import stringWidth from "string-width";
+import { fitWidth, stripAnsi } from "./lineBuffer.js";
+import { liveWidth } from "./sessionModel.js";
+import { isMouseReport } from "./fullscreen.js";
+import { CursorContext } from "./terminalCursor.js";
+import { isFocusReport } from "./terminalStatus.js";
+import { matchingFiles, mentionAt } from "./fileMentions.js";
+import { continueLine, createPasteRegistry, cursorLine, deleteBack, deleteWordBack, insert, isBlockPaste, killToLineEnd, moveLine, normalizePaste, searchHistory, toLineEnd, toLineStart, wordLeft, wordRight, } from "./promptEditing.js";
+import * as ui from "../ui.js";
+const MAX_SUGGESTIONS = 6;
+/** Commands (names without "/") a partial "/name" line could still become. */
+export function matchingCommands(value, commands) {
+    if (!value.startsWith("/") || /\s/.test(value))
+        return [];
+    const typed = value.slice(1);
+    return commands.filter((name) => name.startsWith(typed));
+}
+/** Tab: completes a unique match (plus a space for its arguments), else the common prefix. */
+export function completeCommand(value, commands) {
+    const matches = matchingCommands(value, commands);
+    if (matches.length === 0)
+        return value;
+    if (matches.length === 1)
+        return `/${matches[0]} `;
+    let prefix = matches[0];
+    for (const name of matches) {
+        while (!name.startsWith(prefix))
+            prefix = prefix.slice(0, -1);
+    }
+    return `/${prefix}`;
+}
+/**
+ * The slice [start, end) of a `length`-character line shown in `room` columns, keeping the
+ * cursor in view: like the live area, the prompt must never reach the terminal's edge (see
+ * lineBuffer.ts), so a long line scrolls sideways, with "…" on each cut side.
+ */
+export function visibleWindow(length, cursor, room) {
+    if (length + 1 <= room)
+        return [0, length];
+    const span = Math.max(1, room - 2); // one column for each possible "…"
+    const start = Math.min(Math.max(0, cursor + 1 - span), Math.max(0, length + 1 - span));
+    return [start, Math.min(length, start + span)];
+}
+/** The shortcuts panel, opened with "?" on an empty prompt. */
+export const SHORTCUTS = [
+    "Enter send  ·  \\ + Enter or Ctrl+J new line  ·  Tab complete or take the suggestion",
+    "↑/↓ history  ·  Ctrl+R search history  ·  ↑ on an empty prompt edits the last queued message",
+    "Ctrl+W delete word  ·  Ctrl+K to line end  ·  Ctrl+U clear  ·  Ctrl+←/→ move by word",
+    "@ mention a file  ·  /copy copy the last reply  ·  Shift+Tab switch mode  ·  Ctrl+O unfold tool calls",
+    "Esc interrupt  ·  Ctrl+C interrupt or exit  ·  PgUp/PgDn or wheel scroll  ·  Ctrl+End bottom",
+    "Drag to select, right-click to copy (full screen)",
+];
+// A paste can reach us in several chunks; pieces this close together extend the same one.
+const PASTE_CHUNK_MS = 100;
+const PASTE_TOKEN_BEFORE = /\[Pasted text #\d+ \+\d+ lines?\]$/;
+/**
+ * The chat's prompt: history (↑/↓), "/command" completion and suggestions (Tab), pasted
+ * blocks folded into a token, multi-line input (`\` + Enter or Ctrl+J), word and line
+ * shortcuts (Ctrl+W/K/U, Ctrl+←/→, Home/End, Ctrl+A/E), reverse history search (Ctrl+R)
+ * and taking a queued line back (↑ on an empty prompt). Written here rather than taken from
+ * @inkjs/ui because its TextInput is uncontrolled. Backspace also arrives as `delete` on
+ * Windows terminals, so both erase backwards.
+ */
+export function PromptInput({ label, inset = 0, suggestion, history, commands, onSubmit, onExit, onRecallQueued, files = [] }) {
+    // Kept in a ref, not in state: two keystrokes can arrive before React re-renders, and a
+    // handler reading state would apply the second one to a stale value.
+    const state = useRef({
+        value: "",
+        cursor: 0,
+        historyIndex: null,
+        draft: "",
+        search: null,
+        lastPaste: null,
+        showHelp: false,
+    });
+    const pastes = useRef(createPasteRegistry()).current;
+    const [, rerender] = useReducer((n) => n + 1, 0);
+    function apply(next) {
+        state.current.value = next.value;
+        state.current.cursor = next.cursor;
+    }
+    function replace(next) {
+        apply({ value: next, cursor: next.length });
+    }
+    /** A key while Ctrl+R's search is on: Ctrl+R finds an older match, Enter (or any other key) takes it, Esc cancels. */
+    function handleSearch(search, input, key) {
+        const current = state.current;
+        const finish = (take) => {
+            current.search = null;
+            if (take && search.index >= 0)
+                replace(history[search.index]);
+            else
+                apply(search.saved);
+        };
+        if (key.ctrl && input === "r") {
+            const older = searchHistory(history, search.query, search.index >= 0 ? search.index : history.length);
+            if (older >= 0)
+                search.index = older;
+        }
+        else if (key.escape) {
+            finish(false);
+        }
+        else if (key.return) {
+            finish(true);
+        }
+        else if (key.backspace || key.delete) {
+            search.query = search.query.slice(0, -1);
+            search.index = searchHistory(history, search.query);
+        }
+        else if (input && !key.ctrl && !key.meta) {
+            search.query += input;
+            search.index = searchHistory(history, search.query);
+        }
+        else {
+            finish(true);
+        }
+    }
+    function handlePaste(input) {
+        const current = state.current;
+        const text = normalizePaste(input);
+        const now = Date.now();
+        const last = current.lastPaste;
+        const before = current.value.slice(0, current.cursor);
+        // Typing sends one character at a time: only a multi-character chunk can be more of a paste.
+        if (last && input.length > 1 && now - last.at < PASTE_CHUNK_MS && before.endsWith(last.token)) {
+            // The rest of the same paste: grow its token in place.
+            const token = pastes.extend(last.token, text);
+            const start = current.cursor - last.token.length;
+            apply({ value: current.value.slice(0, start) + token + current.value.slice(current.cursor), cursor: start + token.length });
+            current.lastPaste = { token, at: now };
+        }
+        else if (isBlockPaste(text)) {
+            const token = pastes.add(text);
+            apply(insert(current, token));
+            current.lastPaste = { token, at: now };
+        }
+        else {
+            apply(insert(current, text));
+        }
+    }
+    useInput((input, key) => {
+        // In full screen the mouse is reported as input (wheel, selection): never type it.
+        // Nor the terminal's focus reports (see terminalStatus.ts).
+        if (isMouseReport(input) || isFocusReport(input))
+            return;
+        const current = state.current;
+        if (current.showHelp) {
+            current.showHelp = false; // any key closes the shortcuts panel
+            rerender();
+            return;
+        }
+        if (current.search) {
+            handleSearch(current.search, input, key);
+            rerender();
+            return;
+        }
+        const { value, cursor } = current;
+        if (key.return) {
+            const continued = continueLine(current);
+            if (continued) {
+                apply(continued);
+                rerender();
+                return;
+            }
+            replace("");
+            current.historyIndex = null;
+            rerender();
+            onSubmit(pastes.expand(value));
+            return;
+        }
+        if (input === "\n" && !key.ctrl) {
+            apply(insert(current, "\n")); // Ctrl+J: a line break without sending
+        }
+        else if (key.ctrl && input === "d") {
+            if (value === "")
+                onExit();
+            return;
+        }
+        else if (key.ctrl && input === "u") {
+            replace(""); // clears the whole prompt
+            current.historyIndex = null;
+        }
+        else if (key.ctrl && input === "w") {
+            apply(deleteWordBack(current));
+        }
+        else if (key.ctrl && input === "k") {
+            apply(killToLineEnd(current));
+        }
+        else if (key.ctrl && input === "r") {
+            current.search = { query: "", index: -1, saved: { value, cursor } };
+        }
+        else if (key.upArrow) {
+            const moved = moveLine(current, -1);
+            if (moved) {
+                apply(moved);
+            }
+            else if (value === "" && onRecallQueued) {
+                const queued = onRecallQueued();
+                if (queued !== null)
+                    replace(queued);
+                else
+                    return upHistory();
+            }
+            else {
+                return upHistory();
+            }
+        }
+        else if (key.downArrow) {
+            const moved = moveLine(current, 1);
+            if (moved)
+                apply(moved);
+            else
+                return downHistory();
+        }
+        else if (key.tab) {
+            if (key.shift)
+                return; // Shift+Tab switches the mode (see runChatInk.tsx)
+            // An @mention completes to a file; an empty prompt takes the suggestion; otherwise
+            // Tab completes a "/command".
+            const mention = mentionAt(value, cursor);
+            const file = mention ? matchingFiles(files, mention.query, 1)[0] : undefined;
+            if (mention && file) {
+                const completed = `@${file} `;
+                apply({ value: value.slice(0, mention.start) + completed + value.slice(cursor), cursor: mention.start + completed.length });
+            }
+            else {
+                replace(value === "" && suggestion ? suggestion : completeCommand(value, commands));
+            }
+        }
+        else if (key.leftArrow) {
+            apply(key.ctrl ? wordLeft(current) : { value, cursor: Math.max(0, cursor - 1) });
+        }
+        else if (key.rightArrow) {
+            apply(key.ctrl ? wordRight(current) : { value, cursor: Math.min(value.length, cursor + 1) });
+        }
+        else if (key.home || (key.ctrl && input === "a")) {
+            apply(toLineStart(current));
+        }
+        else if (key.end || (key.ctrl && input === "e")) {
+            apply(toLineEnd(current));
+        }
+        else if (key.backspace || key.delete) {
+            // A pasted block goes away whole.
+            const token = PASTE_TOKEN_BEFORE.exec(value.slice(0, cursor))?.[0];
+            apply(token ? { value: value.slice(0, cursor - token.length) + value.slice(cursor), cursor: cursor - token.length } : deleteBack(current));
+        }
+        else if (key.ctrl || key.meta || key.escape || !input) {
+            return;
+        }
+        else if (value === "" && input === "?") {
+            current.showHelp = true;
+        }
+        else {
+            handlePaste(input);
+        }
+        rerender();
+    });
+    function upHistory() {
+        const current = state.current;
+        if (history.length === 0)
+            return;
+        if (current.historyIndex === null)
+            current.draft = current.value;
+        current.historyIndex = current.historyIndex === null ? history.length - 1 : Math.max(0, current.historyIndex - 1);
+        replace(history[current.historyIndex]);
+        rerender();
+    }
+    function downHistory() {
+        const current = state.current;
+        if (current.historyIndex === null)
+            return;
+        current.historyIndex++;
+        if (current.historyIndex < history.length) {
+            replace(history[current.historyIndex]);
+        }
+        else {
+            current.historyIndex = null;
+            replace(current.draft);
+        }
+        rerender();
+    }
+    const { value, cursor, search, showHelp } = state.current;
+    const { stdout } = useStdout();
+    const width = liveWidth(stdout.columns) - inset;
+    const labelWidth = stringWidth(stripAnsi(label));
+    const room = width - labelWidth;
+    const ghost = suggestion ? `${suggestion}  (tab)` : null;
+    // Suggestions give way on a short terminal: the live area must stay shorter than it.
+    const maxSuggestions = Math.min(MAX_SUGGESTIONS, Math.max(0, (stdout.rows || 24) - 10));
+    const mention = mentionAt(value, cursor);
+    const suggestions = mention
+        ? matchingFiles(files, mention.query, maxSuggestions).map((file) => `@${file}`)
+        : value.includes("\n")
+            ? []
+            : matchingCommands(value, commands).slice(0, maxSuggestions).map((name) => `/${name}`);
+    // With a cursor controller (full screen) the terminal's own cursor sits in the line;
+    // without one, the character under the cursor is drawn inverted.
+    const cursorController = useContext(CursorContext);
+    const cursorLineRef = useRef(null);
+    let rows;
+    let cursorColumn;
+    if (search) {
+        const prefix = `(reverse-i-search)'${search.query}': `;
+        const match = search.index >= 0 ? history[search.index] : "";
+        cursorColumn = Math.min(stringWidth(prefix) - 3, width - 1);
+        rows = [
+            _jsx(Box, { ref: cursorLineRef, children: _jsx(Text, { children: fitWidth(`${ui.dim(prefix)}${match.replace(/\n/g, " ")}`, width) }) }, "search"),
+        ];
+    }
+    else {
+        const lines = value.split("\n");
+        const at = cursorLine({ value, cursor });
+        cursorColumn = 0;
+        rows = lines.map((line, i) => {
+            const prefix = i === 0 ? label : " ".repeat(labelWidth);
+            const isCursorLine = i === at.line;
+            const [start, end] = visibleWindow(line.length, isCursorLine ? at.column : 0, room);
+            if (isCursorLine)
+                cursorColumn = labelWidth + (start > 0 ? 1 : 0) + stringWidth(line.slice(start, at.column));
+            const col = at.column;
+            return (_jsx(Box, { ref: isCursorLine ? cursorLineRef : undefined, children: _jsxs(Text, { children: [prefix, start > 0 ? "…" : "", isCursorLine ? line.slice(start, col) : line.slice(start, end), isCursorLine ? (cursorController ? line.slice(col, col + 1) : _jsx(Text, { inverse: true, children: line[col] ?? " " })) : "", isCursorLine ? line.slice(col + 1, end) : "", end < line.length ? "…" : "", value === "" && ghost ? ui.dim(fitWidth(ghost, Math.max(1, room - 1))) : ""] }) }, i));
+        });
+    }
+    useLayoutEffect(() => {
+        if (cursorController && cursorLineRef.current)
+            cursorController.setTarget({ node: cursorLineRef.current, column: cursorColumn });
+    });
+    useLayoutEffect(() => () => cursorController?.setTarget(null), [cursorController]);
+    return (_jsxs(Box, { flexDirection: "column", children: [rows, suggestions.map((item) => (_jsx(Text, { children: ui.dim(fitWidth(`  ${item}`, width)) }, item))), showHelp ? SHORTCUTS.map((line) => _jsx(Text, { children: ui.dim(fitWidth(`  ${line}`, width)) }, line)) : null] }));
+}

package/dist/tui/ink/SessionView.d.ts

@@ -0,0 +1,42 @@
+import { type ReactNode } from "react";
+import type { ApprovalPrompt } from "../../core/interaction.js";
+import type { Mode } from "../../core/agentSpec.js";
+import type { SessionUsage } from "../../core/runner.js";
+import { type SessionModel } from "./sessionModel.js";
+import type { InkInteraction } from "./inkInteraction.js";
+/** Replaces the default preview (title and lines) of an approval panel; the choices stay. */
+export type RenderApproval = (prompt: ApprovalPrompt) => ReactNode;
+/**
+ * The preview's lines, capped so the whole live area stays shorter than the terminal: Ink
+ * clears the entire screen (scrollback included) to redraw anything taller, and a step-gate
+ * preview carries the tool's parameters, which can be a whole file.
+ */
+export declare function previewLines(lines: readonly string[], terminalRows: number | undefined): string[];
+export declare function statusText(mode: Mode | undefined, turns: number, usage: SessionUsage | null, extra?: {
+    contextPercent?: number | null;
+    modeSwitchable?: boolean;
+}): string;
+export interface SessionViewProps {
+    model: SessionModel;
+    interaction: InkInteraction;
+    renderApproval?: RenderApproval;
+    mode?: Mode;
+    /** Leaves only the history, so the last frame Ink leaves on screen is just the scrollback. */
+    closed?: boolean;
+    /**
+     * Draws the whole terminal: the history in a scrollable view above the live area, instead
+     * of in the terminal's own scrollback. The caller switches the terminal to the alternate
+     * screen (see fullscreen.ts's enterFullscreen()).
+     */
+    fullscreen?: boolean;
+    /** Full screen only: lines pinned above the history (see header.ts's headerLines()). */
+    header?: string[];
+    /** Full screen only: receives the text selected with the mouse (e.g. to set the clipboard). */
+    onCopy?: (text: string) => void;
+    /** The mode can be switched (Shift+Tab): the status bar says so. */
+    modeSwitchable?: boolean;
+    /** Shown under the live area when no checkpoint is waiting (the chat's input). */
+    children?: ReactNode;
+}
+/** History, line in progress, current action, checkpoint panel and status bar. */
+export declare function SessionView({ model, interaction, renderApproval, mode, closed, fullscreen, header, onCopy, modeSwitchable, children }: SessionViewProps): import("react").JSX.Element | null;

package/dist/tui/ink/SessionView.js

@@ -0,0 +1,223 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useReducer, useRef, useState, useSyncExternalStore } from "react";
+import { Box, measureElement, Static, Text, useInput, useStdout } from "ink";
+import { Select } from "@inkjs/ui";
+import { liveWidth } from "./sessionModel.js";
+import { createRowCache, highlightRow, isMouseReport, mouseEvents, rowsBelow, scrollBy, selectedText, visibleRows, userBarRows, } from "./fullscreen.js";
+import { framePosition } from "./terminalCursor.js";
+import { isFocusReport } from "./terminalStatus.js";
+import { fitWidth, stripAnsi } from "./lineBuffer.js";
+import * as ui from "../ui.js";
+// Numbered as in the Claude Code CLI's permission prompt; the digits and y/n/q answer too.
+const DECISION_OPTIONS = [
+    { label: "1. Yes", value: "y" },
+    { label: "2. No", value: "n" },
+    { label: "3. Stop", value: "q" },
+];
+const MANUAL_OPTIONS = [{ label: "1. Done, continue", value: "continue" }];
+const DECISION_KEYS = { "1": "y", "2": "n", "3": "q", y: "y", n: "n", q: "q" };
+const ACCENT_HEX = "#d77757";
+/**
+ * The preview's lines, capped so the whole live area stays shorter than the terminal: Ink
+ * clears the entire screen (scrollback included) to redraw anything taller, and a step-gate
+ * preview carries the tool's parameters, which can be a whole file.
+ */
+export function previewLines(lines, terminalRows) {
+    const all = lines.flatMap((line) => line.split("\n"));
+    const max = Math.max(3, (terminalRows || 24) - 12);
+    return all.length <= max ? all : [...all.slice(0, max - 1), ui.dim(`… (${all.length - max + 1} more lines)`)];
+}
+function CheckpointPanel({ checkpoint, renderApproval }) {
+    const decision = checkpoint.kind === "decision";
+    useInput((input) => {
+        const key = input.toLowerCase();
+        if (decision && DECISION_KEYS[key])
+            checkpoint.answer(DECISION_KEYS[key]);
+        else if (!decision && key === "1")
+            checkpoint.answer("");
+    });
+    const { prompt } = checkpoint;
+    const { stdout } = useStdout();
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: ACCENT_HEX, paddingX: 1, children: [renderApproval ? (renderApproval(prompt)) : (_jsxs(_Fragment, { children: [_jsx(Text, { bold: true, children: prompt.title }), previewLines(prompt.lines, stdout.rows).map((line, index) => (_jsx(Text, { children: line }, index))), !decision && prompt.question ? _jsx(Text, { dimColor: true, children: prompt.question }) : null] })), decision ? (_jsx(Box, { marginTop: 1, children: _jsx(Text, { children: "Do you want to proceed?" }) })) : null, _jsx(Box, { marginTop: decision ? 0 : 1, children: _jsx(Select, { options: decision ? DECISION_OPTIONS : MANUAL_OPTIONS, onChange: (value) => checkpoint.answer(decision ? value : "") }, checkpoint.id) })] }));
+}
+function formatTokens(count) {
+    return count >= 1000 ? `${(count / 1000).toFixed(1)}k` : String(count);
+}
+export function statusText(mode, turns, usage, extra = {}) {
+    const parts = [
+        ...(mode ? [`⏵⏵ ${mode}${extra.modeSwitchable ? " (shift+tab)" : ""}`] : []),
+        `${turns} ${turns === 1 ? "turn" : "turns"}`,
+        ...(usage ? [`${formatTokens(usage.inputTokens)} in / ${formatTokens(usage.outputTokens)} out`] : []),
+        ...(extra.contextPercent != null ? [`context ${Math.round(extra.contextPercent)}%`] : []),
+    ];
+    return parts.join(" · ");
+}
+// No emoji-capable characters: Windows Terminal draws ✳ (U+2733) as a green emoji.
+const WORKING_GLYPHS = ["·", "✢", "✱", "✶", "✻", "✽", "✻", "✶", "✱", "✢"];
+/** The spinner line, as in the Claude Code CLI: an animated glyph, what it's doing, how long it's been at it. */
+function Working({ label, startedAt, width }) {
+    const [tick, setTick] = useState(0);
+    useEffect(() => {
+        const timer = setInterval(() => setTick((n) => n + 1), 120);
+        return () => clearInterval(timer);
+    }, []);
+    const seconds = startedAt === null ? 0 : Math.floor((Date.now() - startedAt) / 1000);
+    const glyph = WORKING_GLYPHS[tick % WORKING_GLYPHS.length];
+    return _jsx(Text, { children: fitWidth(`${ui.working(`${glyph} ${label}`)} ${ui.dim(`(${seconds}s · esc to interrupt)`)}`, width) });
+}
+/** Line in progress, checkpoint panel or spinner, the input, and the status bar. */
+function LiveArea({ session, checkpoint, renderApproval, mode, width, statusExtra, modeSwitchable, children }) {
+    // The mode in the spinner's color; the rest dim.
+    const plain = statusText(mode, session.turns, session.usage, { contextPercent: session.contextPercent, modeSwitchable }) + (statusExtra ? ` · ${statusExtra}` : "");
+    const cut = mode ? plain.indexOf(" · ") : -1;
+    const status = cut > 0 ? ui.working(plain.slice(0, cut)) + ui.dim(plain.slice(cut)) : ui.dim(plain);
+    return (_jsxs(Box, { flexDirection: "column", flexShrink: 0, width: width, marginTop: session.liveGap ? 1 : 0, children: [stripAnsi(session.live) ? _jsx(Text, { children: session.live }) : null, checkpoint ? (_jsx(CheckpointPanel, { checkpoint: checkpoint, renderApproval: renderApproval })) : session.busy ? (
+            // Always one blank line above the spinner: from this margin, or from the live area's
+            // own when a separator is pending and nothing is written above the spinner yet.
+            _jsxs(Box, { flexDirection: "column", marginTop: stripAnsi(session.live) || !session.liveGap ? 1 : 0, children: [_jsx(Working, { label: session.activity ?? "Thinking…", startedAt: session.turnStartedAt, width: width }), session.subagentActivity ? _jsx(Text, { dimColor: true, children: fitWidth(`  ↳ ${session.subagentActivity}`, width) }) : null] })) : null, checkpoint ? null : children, _jsx(Text, { children: fitWidth(status, width) })] }));
+}
+/** A history line for the inline view: the human's line as a bar, a tool group unfolded with Ctrl+O. */
+function inlineItem(item, expanded, width) {
+    if (item.kind === "user")
+        return userBarRows(item.text, width).join("\n");
+    if (expanded && item.expanded)
+        return item.expanded.join("\n");
+    return item.text || " ";
+}
+/** The terminal's size, re-read on resize (Ink re-lays out on resize but doesn't re-render components). */
+function useTerminalSize() {
+    const { stdout } = useStdout();
+    const [, rerender] = useReducer((n) => n + 1, 0);
+    useEffect(() => {
+        stdout.on("resize", rerender);
+        return () => void stdout.off("resize", rerender);
+    }, [stdout]);
+    return { columns: stdout.columns || 80, rows: stdout.rows || 24 };
+}
+const WHEEL_ROWS = 3;
+/**
+ * The full-screen layout: a frame exactly as tall as the terminal (so Ink redraws it whole
+ * from the top every time, never relative to where it thinks the cursor is — a shorter frame
+ * left stale copies behind on Windows Terminal) and one column narrower. The history fills
+ * what the live area leaves, bottom-aligned, and scrolls on its own: PageUp/PageDown and the
+ * wheel move it, Ctrl+End or typing brings it back to the bottom, and output arriving while
+ * scrolled up doesn't move it.
+ */
+function FullscreenSession({ session, checkpoint, renderApproval, mode, header, onCopy, modeSwitchable, children, }) {
+    const { columns, rows } = useTerminalSize();
+    const width = liveWidth(columns);
+    const rowCache = useRef(createRowCache()).current;
+    const wrapped = rowCache(session.items, width, session.expanded);
+    const total = wrapped.rows.length;
+    const historyRef = useRef(null);
+    const [historyHeight, setHistoryHeight] = useState(rows);
+    useEffect(() => {
+        if (!historyRef.current)
+            return;
+        const { height } = measureElement(historyRef.current);
+        if (height !== historyHeight)
+            setHistoryHeight(height);
+    });
+    const [anchor, setAnchor] = useState(null);
+    // Mirrored in a ref: mouse reports can arrive faster than React re-renders.
+    const [selection, setSelectionState] = useState(null);
+    const selectionRef = useRef(null);
+    function setSelection(next) {
+        selectionRef.current = next;
+        setSelectionState(next);
+    }
+    const dragging = useRef(false);
+    const [copied, setCopied] = useState(null);
+    // Rows are re-wrapped when the width changes, so a row index no longer means the same
+    // place: go back to the bottom, and drop the selection.
+    useEffect(() => {
+        setAnchor(null);
+        setSelection(null);
+    }, [width]);
+    useEffect(() => {
+        if (!copied)
+            return;
+        const timer = setTimeout(() => setCopied(null), 3000);
+        return () => clearTimeout(timer);
+    }, [copied]);
+    const [start, end] = visibleRows(total, historyHeight, anchor);
+    /** The history cell under a screen cell (clamped to the rows shown), or null outside the history. */
+    function cellAt(x, y, clamp) {
+        if (!historyRef.current || end === start)
+            return null;
+        const box = framePosition(historyRef.current);
+        const firstY = box.y + historyHeight - (end - start); // the rows are bottom-aligned
+        let offset = y - firstY;
+        if (offset < 0 || offset >= end - start) {
+            if (!clamp)
+                return null;
+            offset = Math.min(end - start - 1, Math.max(0, offset));
+        }
+        return { row: start + offset, col: Math.max(0, x - box.x) };
+    }
+    function handleMouse(text) {
+        for (const event of mouseEvents(text)) {
+            if (event.kind === "wheel-up" || event.kind === "wheel-down") {
+                const steps = event.kind === "wheel-up" ? -WHEEL_ROWS : WHEEL_ROWS;
+                setAnchor((a) => scrollBy(a, steps, total, historyHeight));
+            }
+            else if (event.kind === "press") {
+                const cell = cellAt(event.x, event.y, false);
+                dragging.current = cell !== null;
+                setSelection(cell ? { anchor: cell, focus: cell } : null);
+            }
+            else if (event.kind === "drag" && dragging.current && selectionRef.current) {
+                const cell = cellAt(event.x, event.y, true);
+                if (cell)
+                    setSelection({ anchor: selectionRef.current.anchor, focus: cell });
+            }
+            else if (event.kind === "release" && dragging.current && selectionRef.current) {
+                dragging.current = false;
+                const cell = cellAt(event.x, event.y, true);
+                const final = cell ? { anchor: selectionRef.current.anchor, focus: cell } : selectionRef.current;
+                // A click without a drag clears the selection; a drag leaves it selected.
+                setSelection(final.anchor.row === final.focus.row && final.anchor.col === final.focus.col ? null : final);
+            }
+            else if (event.kind === "right" && selectionRef.current) {
+                // As in Windows Terminal: a right-click copies the selection and clears it.
+                const text = selectedText(wrapped, selectionRef.current);
+                setSelection(null);
+                if (text && onCopy) {
+                    onCopy(text);
+                    setCopied(`copied ${text.length} ${text.length === 1 ? "character" : "characters"}`);
+                }
+            }
+        }
+    }
+    useInput((text, key) => {
+        const page = Math.max(1, historyHeight - 1);
+        if (isMouseReport(text))
+            handleMouse(text);
+        else if (isFocusReport(text))
+            return;
+        else if (key.pageUp)
+            setAnchor((a) => scrollBy(a, -page, total, historyHeight));
+        else if (key.pageDown)
+            setAnchor((a) => scrollBy(a, page, total, historyHeight));
+        else if (key.ctrl && key.end)
+            setAnchor(null);
+        else if (text && !key.ctrl && !key.meta && !key.escape)
+            setAnchor(null); // typing
+    });
+    const below = rowsBelow(anchor, total);
+    const statusExtra = [anchor === null ? null : `↓ ${below} more ${below === 1 ? "line" : "lines"} (Ctrl+End)`, copied]
+        .filter(Boolean)
+        .join(" · ");
+    return (_jsxs(Box, { flexDirection: "column", width: columns - 1, height: rows, children: [header && header.length > 0 ? (_jsx(Box, { flexDirection: "column", flexShrink: 0, marginBottom: 1, children: header.map((line, i) => (_jsx(Text, { wrap: "truncate-end", children: line || " " }, i))) })) : null, _jsx(Box, { ref: historyRef, flexDirection: "column", flexGrow: 1, flexShrink: 1, overflow: "hidden", justifyContent: "flex-end", children: wrapped.rows.slice(start, end).map((row, i) => (_jsx(Text, { wrap: "truncate-end", children: highlightRow(row, selection, start + i) || " " }, start + i))) }), _jsx(LiveArea, { session: session, checkpoint: checkpoint, renderApproval: renderApproval, mode: mode, width: width, statusExtra: statusExtra || undefined, modeSwitchable: modeSwitchable, children: children })] }));
+}
+/** History, line in progress, current action, checkpoint panel and status bar. */
+export function SessionView({ model, interaction, renderApproval, mode, closed, fullscreen, header, onCopy, modeSwitchable, children }) {
+    const session = useSyncExternalStore(model.subscribe, model.getSnapshot);
+    const checkpoint = useSyncExternalStore(interaction.subscribe, interaction.getSnapshot);
+    // Nothing in the live area may reach the terminal's edge (see lineBuffer.ts).
+    const width = liveWidth(useStdout().stdout.columns);
+    if (fullscreen) {
+        return closed ? null : (_jsx(FullscreenSession, { session: session, checkpoint: checkpoint, renderApproval: renderApproval, mode: mode, header: header, onCopy: onCopy, modeSwitchable: modeSwitchable, children: children }));
+    }
+    return (_jsxs(_Fragment, { children: [_jsx(Static, { items: session.items, children: (item) => _jsx(Text, { children: inlineItem(item, session.expanded, width) }, item.id) }), closed ? null : (_jsx(LiveArea, { session: session, checkpoint: checkpoint, renderApproval: renderApproval, mode: mode, width: width, modeSwitchable: modeSwitchable, children: children }))] }));
+}

package/dist/tui/ink/fileMentions.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Files under `root` for `@` mentions, as paths relative to it with forward slashes. Skips
+ * `node_modules` and dot folders (`.git`, `.run`...), and stops at `limit` files so a huge
+ * tree can't stall the chat.
+ */
+export declare function listProjectFiles(root: string, limit?: number): Promise<string[]>;
+/** The `@mention` being typed right before the cursor: where it starts and what follows the `@`. */
+export declare function mentionAt(value: string, cursor: number): {
+    start: number;
+    query: string;
+} | null;
+/** Files containing `query` (case-insensitive), the ones whose name starts with it first, then shorter paths. */
+export declare function matchingFiles(files: readonly string[], query: string, max?: number): string[];

package/dist/tui/ink/fileMentions.js

@@ -0,0 +1,50 @@
+import { readdir } from "node:fs/promises";
+import path from "node:path";
+const SKIPPED = new Set(["node_modules"]);
+/**
+ * Files under `root` for `@` mentions, as paths relative to it with forward slashes. Skips
+ * `node_modules` and dot folders (`.git`, `.run`...), and stops at `limit` files so a huge
+ * tree can't stall the chat.
+ */
+export async function listProjectFiles(root, limit = 5000) {
+    const files = [];
+    const pending = [""];
+    while (pending.length > 0 && files.length < limit) {
+        const dir = pending.shift();
+        let entries;
+        try {
+            entries = await readdir(path.join(root, dir), { withFileTypes: true });
+        }
+        catch {
+            continue;
+        }
+        for (const entry of entries) {
+            if (entry.name.startsWith(".") || SKIPPED.has(entry.name))
+                continue;
+            const relative = dir ? `${dir}/${entry.name}` : entry.name;
+            if (entry.isDirectory())
+                pending.push(relative);
+            else if (entry.isFile())
+                files.push(relative);
+            if (files.length >= limit)
+                break;
+        }
+    }
+    return files.sort();
+}
+/** The `@mention` being typed right before the cursor: where it starts and what follows the `@`. */
+export function mentionAt(value, cursor) {
+    const match = /(^|\s)@([^\s@]*)$/.exec(value.slice(0, cursor));
+    if (!match)
+        return null;
+    return { start: cursor - match[2].length - 1, query: match[2] };
+}
+/** Files containing `query` (case-insensitive), the ones whose name starts with it first, then shorter paths. */
+export function matchingFiles(files, query, max = 6) {
+    const needle = query.toLowerCase();
+    const name = (file) => file.slice(file.lastIndexOf("/") + 1).toLowerCase();
+    return files
+        .filter((file) => file.toLowerCase().includes(needle))
+        .sort((a, b) => Number(!name(a).startsWith(needle)) - Number(!name(b).startsWith(needle)) || a.length - b.length || a.localeCompare(b))
+        .slice(0, max);
+}