@aragon-agent/cli 0.4.3

package/dist/ui/entries/ToolPreview.js

@@ -0,0 +1,144 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { PREVIEW_TRUNCATION_MARK } from '../../agent/reducer.js';
+/**
+ * Classify a unified-diff line. Meta prefixes (`@@`, `---`, `+++`) are tested
+ * FIRST so a `--- path` header is not mis-read as a single-char removal (P2-8);
+ * the `Applied edit to <path>:` lead-in falls through to `context`.
+ */
+export function classifyDiffLine(line) {
+    if (line.startsWith('@@') || line.startsWith('---') || line.startsWith('+++'))
+        return 'meta';
+    if (line.startsWith('+'))
+        return 'add';
+    if (line.startsWith('-'))
+        return 'remove';
+    return 'context';
+}
+const BASH_FOOTER_RE = /^\[(?:exit code (\d+)|signal (\w+))\]$/;
+/**
+ * Derive the bash badge. The exit status is authoritative (the tool returns an
+ * error result iff the exit code is non-zero), so the label is `exit 0` /
+ * `failed` from `status`; a real `[exit code N]` / `[signal X]` last line is
+ * parsed best-effort for the exact number, falling back to the status label
+ * when the footer was truncated out of the stored preview (P1-2).
+ */
+export function bashBadge(status, preview) {
+    const ok = status === 'done';
+    const lines = preview.split('\n').map((l) => l.trimEnd()).filter((l) => l.length > 0);
+    const last = lines[lines.length - 1] ?? '';
+    const m = BASH_FOOTER_RE.exec(last);
+    if (m) {
+        if (m[1] !== undefined)
+            return { text: `exit ${m[1]}`, ok };
+        return { text: `signal ${m[2]}`, ok };
+    }
+    return { text: ok ? 'exit 0' : status === 'error' ? 'failed' : 'pending', ok };
+}
+const WRITE_RE = /^Wrote (\d+) bytes to (.+)$/;
+/** Parse the real `Wrote <n> bytes to <path>` result — bytes+path only (P2-7). */
+export function parseWriteFile(text) {
+    const line = text.split('\n').find((l) => l.trim().length > 0) ?? '';
+    const m = WRITE_RE.exec(line.trim());
+    if (!m)
+        return null;
+    return { bytes: Number.parseInt(m[1], 10), path: m[2] };
+}
+/** Parse a real `list_dir` row (`dir <name>/` / `file <name> (<n>b)`) (P2-9). */
+export function parseListRow(line) {
+    const dir = /^dir\s+(.*?)\/?\s*$/.exec(line);
+    if (dir)
+        return { kind: 'dir', name: dir[1].trimEnd() };
+    const file = /^file\s+(.*?)(?:\s+\((\d+b)\))?\s*$/.exec(line);
+    if (file)
+        return { kind: 'file', name: file[1].trimEnd(), size: file[2] };
+    return null;
+}
+function diffColor(cls, theme) {
+    switch (cls) {
+        case 'add':
+            return theme.diff.add;
+        case 'remove':
+            return theme.diff.remove;
+        case 'meta':
+            return theme.diff.meta;
+        case 'context':
+            return theme.diff.context;
+    }
+}
+function renderDiff(lines, theme) {
+    return lines.map((line, i) => (_jsx(Text, { color: diffColor(classifyDiffLine(line), theme), children: line.length > 0 ? line : ' ' }, i)));
+}
+function renderWrite(lines, theme) {
+    const parsed = parseWriteFile(lines.join('\n'));
+    if (!parsed)
+        return renderPlain(lines, theme, false);
+    return [
+        _jsxs(Text, { color: theme.diff.add, children: ["+ wrote ", parsed.path, " (", parsed.bytes, " B)"] }, "w"),
+    ];
+}
+function renderRead(lines, theme) {
+    // Numbered lines are `%5d  content`; dim the 7-char gutter, keep content plain.
+    return lines.map((line, i) => (_jsxs(Text, { children: [_jsx(Text, { color: theme.muted, children: line.slice(0, 7) }), line.slice(7)] }, i)));
+}
+function renderBash(lines, theme) {
+    return lines.map((line, i) => {
+        // The truncation marker is compared against the constant the reducer
+        // actually writes. These used to be two independently spelled `…` literals;
+        // once the producer moved to ASCII, a re-spelled copy here would have
+        // stopped matching and quietly lost the dimming.
+        const dim = line.startsWith('$ ') ||
+            BASH_FOOTER_RE.test(line.trimEnd()) ||
+            line === PREVIEW_TRUNCATION_MARK;
+        return (_jsx(Text, { color: dim ? theme.muted : undefined, children: line.length > 0 ? line : ' ' }, i));
+    });
+}
+function renderList(lines, theme) {
+    return lines.map((line, i) => {
+        const row = parseListRow(line);
+        if (!row)
+            return _jsx(Text, { children: line }, i);
+        if (row.kind === 'dir') {
+            return (_jsx(Text, { children: _jsxs(Text, { color: theme.accent, children: [row.name, "/"] }) }, i));
+        }
+        return (_jsxs(Text, { children: [row.name, row.size ? _jsxs(Text, { color: theme.muted, children: [" (", row.size, ")"] }) : null] }, i));
+    });
+}
+function renderGlob(lines, theme) {
+    // Flat relative paths — dim the directory portion of each path.
+    return lines.map((line, i) => {
+        const slash = line.lastIndexOf('/');
+        if (slash < 0)
+            return _jsx(Text, { children: line }, i);
+        return (_jsxs(Text, { children: [_jsx(Text, { color: theme.muted, children: line.slice(0, slash + 1) }), line.slice(slash + 1)] }, i));
+    });
+}
+function renderPlain(lines, theme, error) {
+    return lines.map((line, i) => (_jsx(Text, { color: error ? theme.toolError : theme.muted, children: line.length > 0 ? line : ' ' }, i)));
+}
+export function ToolPreview({ name, lines, theme, isError }) {
+    let body;
+    switch (name) {
+        case 'edit_file':
+            body = renderDiff(lines, theme);
+            break;
+        case 'write_file':
+            body = renderWrite(lines, theme);
+            break;
+        case 'read_file':
+            body = renderRead(lines, theme);
+            break;
+        case 'bash':
+            body = renderBash(lines, theme);
+            break;
+        case 'list_dir':
+            body = renderList(lines, theme);
+            break;
+        case 'glob':
+            body = renderGlob(lines, theme);
+            break;
+        default:
+            body = renderPlain(lines, theme, isError);
+    }
+    return _jsx(Box, { flexDirection: "column", children: body });
+}

package/dist/ui/entries/UserEntry.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Render a user message entry.
+ *
+ * The role glyph, the gutter rail and the inter-entry spacing all belong to
+ * `EntryFrame` now (§4.3), so this component renders content and nothing else.
+ * That is also why it takes no `caps`: it has no glyph of its own left to
+ * degrade.
+ */
+import React from 'react';
+import type { Theme } from '../theme.js';
+export declare function UserEntry({ text, theme }: {
+    text: string;
+    theme: Theme;
+}): React.ReactElement;

package/dist/ui/entries/UserEntry.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+export function UserEntry({ text, theme }) {
+    return (_jsx(Box, { flexDirection: "column", children: text.split('\n').map((line, i) => (_jsx(Text, { color: theme.user, bold: i === 0, children: line }, i))) }));
+}

package/dist/ui/exit-snapshot.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Module-level single-slot snapshot — the ONE way view state crosses the React
+ * boundary out to `cli.tsx` (spec §4.4, review P1-3).
+ *
+ * Why not `useImperativeHandle` / a ref callback: two of the four restore paths
+ * (`process.on('exit')` and the signal hooks) are process-level, and by the time
+ * they run the component tree may already be unmounted or mid-unmount. A module
+ * variable stays readable for the whole process lifetime; a React channel does
+ * not.
+ *
+ * Writes are overwriting, not appending: `entries` is passed by reference, so
+ * publishing costs one object literal per view-state change.
+ */
+import type { Entry, UsageTotal } from '../agent/reducer.js';
+export interface ExitSnapshot {
+    entries: Entry[];
+    usageTotal: UsageTotal;
+    provider: string;
+    model: string;
+    startedAt: number;
+}
+/** Called by `App` after every view-state change. Synchronous, side-effect free. */
+export declare function publishExitSnapshot(next: ExitSnapshot): void;
+/** Called by `cli.tsx` after `restore()`. `undefined` ⇒ skip the replay entirely. */
+export declare function readExitSnapshot(): ExitSnapshot | undefined;
+/** Test-only reset so specs do not leak state into one another. */
+export declare function clearExitSnapshot(): void;

package/dist/ui/exit-snapshot.js

@@ -0,0 +1,26 @@
+/**
+ * Module-level single-slot snapshot — the ONE way view state crosses the React
+ * boundary out to `cli.tsx` (spec §4.4, review P1-3).
+ *
+ * Why not `useImperativeHandle` / a ref callback: two of the four restore paths
+ * (`process.on('exit')` and the signal hooks) are process-level, and by the time
+ * they run the component tree may already be unmounted or mid-unmount. A module
+ * variable stays readable for the whole process lifetime; a React channel does
+ * not.
+ *
+ * Writes are overwriting, not appending: `entries` is passed by reference, so
+ * publishing costs one object literal per view-state change.
+ */
+let snapshot;
+/** Called by `App` after every view-state change. Synchronous, side-effect free. */
+export function publishExitSnapshot(next) {
+    snapshot = next;
+}
+/** Called by `cli.tsx` after `restore()`. `undefined` ⇒ skip the replay entirely. */
+export function readExitSnapshot() {
+    return snapshot;
+}
+/** Test-only reset so specs do not leak state into one another. */
+export function clearExitSnapshot() {
+    snapshot = undefined;
+}

package/dist/ui/gauge.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Context gauge builder (spec §3.4). Pure: turns a percentage into a block bar
+ * plus a threshold-based fill colour, with an ASCII fallback when the terminal
+ * has no Unicode. Kept out of the `.tsx` so it is unit-testable without Ink.
+ */
+import type { Theme } from './theme.js';
+import type { TermCapabilities } from './capabilities.js';
+export interface Gauge {
+    /** The filled portion of the bar. */
+    filled: string;
+    /** The empty (track) portion of the bar. */
+    empty: string;
+    /** Fill colour chosen by threshold (`theme.gauge.*`). */
+    fillColor: string | undefined;
+    /** Track colour (`theme.gauge.track`). */
+    trackColor: string | undefined;
+    /** Clamped percentage 0–100. */
+    pct: number;
+}
+/**
+ * Build a `width`-cell gauge for `pct` (0–100). Uses block glyphs on Unicode
+ * terminals and `#`/`-` otherwise (e.g. `[######----]`).
+ */
+export declare function buildGauge(pct: number, width: number, theme: Theme, caps: TermCapabilities): Gauge;

package/dist/ui/gauge.js

@@ -0,0 +1,36 @@
+/**
+ * Context gauge builder (spec §3.4). Pure: turns a percentage into a block bar
+ * plus a threshold-based fill colour, with an ASCII fallback when the terminal
+ * has no Unicode. Kept out of the `.tsx` so it is unit-testable without Ink.
+ */
+import { pickGlyphs } from './glyphs.js';
+/** Pick the fill colour by threshold: <60 low · 60–85 mid · >85 high. */
+function thresholdColor(pct, theme) {
+    if (pct > 85)
+        return theme.gauge.high;
+    if (pct >= 60)
+        return theme.gauge.mid;
+    return theme.gauge.low;
+}
+/**
+ * Build a `width`-cell gauge for `pct` (0–100). Uses block glyphs on Unicode
+ * terminals and `#`/`-` otherwise (e.g. `[######----]`).
+ */
+export function buildGauge(pct, width, theme, caps) {
+    const clamped = Math.max(0, Math.min(100, Math.round(pct)));
+    const cells = Math.max(1, width);
+    const filledCells = Math.max(0, Math.min(cells, Math.round((clamped / 100) * cells)));
+    // Was `caps.unicode ? '█' : '#'` inline. The branch was correct but the
+    // literals still had to move: leaving even a well-formed pair here would mean
+    // the A-1 scan needs an exception, and exceptions get copied (§4.1).
+    const glyphs = pickGlyphs(caps);
+    const full = glyphs.gaugeFull;
+    const empty = glyphs.gaugeEmpty;
+    return {
+        filled: full.repeat(filledCells),
+        empty: empty.repeat(cells - filledCells),
+        fillColor: thresholdColor(clamped, theme),
+        trackColor: theme.gauge.track,
+        pct: clamped,
+    };
+}

package/dist/ui/glyphs.d.ts

@@ -0,0 +1,87 @@
+/**
+ * Glyphs — the SINGLE SOURCE OF TRUTH for every user-visible non-ASCII
+ * character in `src/ui/**` (spec §4.1).
+ *
+ * `capabilities.ts` already decides whether the terminal can render Unicode, and
+ * the theme already carried an `ASCII_SYMBOLS` table — but 16 files wrote their
+ * glyphs as bare literals and bypassed the whole mechanism, so a legacy
+ * `cmd.exe` showed mojibake for the prompt caret, the assistant marker, every
+ * list bullet, the scroll indicator and all four overlay titles.
+ *
+ * The fix is structural rather than per-site: EVERY glyph lives in one of the
+ * two tables below, components read them through `pickGlyphs(caps)`, and
+ * `glyphs.test.ts` runs a static scan that fails the build if any other file
+ * under the scanned tree grows a non-ASCII literal again.
+ *
+ * THIS FILE AND `Logo.tsx`'s art block are the only two files allowed to hold
+ * non-ASCII literals under `src/ui/**` (plus the explicit `agent/headless.ts`
+ * exemption). Adding a third exception means the guard rail stops guarding —
+ * add a field here instead.
+ */
+import type { TermCapabilities } from './capabilities.js';
+export interface Glyphs {
+    user: string;
+    assistant: string;
+    thinking: string;
+    toolPending: string;
+    toolRunning: string;
+    toolDone: string;
+    toolError: string;
+    info: string;
+    warn: string;
+    error: string;
+    bullet: string;
+    /** Static spinner glyph (reduced motion / no-Unicode fallback). */
+    spinnerStill: string;
+    gaugeFull: string;
+    gaugeEmpty: string;
+    keyOn: string;
+    keyOff: string;
+    wordmark: string;
+    ellipsis: string;
+    emDash: string;
+    midDot: string;
+    arrowUp: string;
+    arrowDown: string;
+    arrowLeft: string;
+    arrowRight: string;
+    check: string;
+    times: string;
+    caret: string;
+    steer: string;
+    enterKey: string;
+    /**
+     * The Shift+Enter CHORD, not the modifier alone.
+     *
+     * Concatenating a separate `shiftKey` + `enterKey` works in the Unicode tier
+     * but spells "ShiftEnter" in ASCII: the modifier symbol carries an implicit
+     * "+" that the word does not. One field per chord keeps both tiers readable.
+     */
+    shiftEnter: string;
+    /** Horizontal rule fill used by the markdown `---` block (§4.7). */
+    hrule: string;
+    railVertical: string;
+    railBranch: string;
+    railEnd: string;
+    /** Redaction dot for `maskSecret` in the settings screen (§4.1 tier B). */
+    maskDot: string;
+    /**
+     * Ink `borderStyle` name for every boxed region (composer, completion popup,
+     * overlay frame).
+     *
+     * Not a glyph we spell ourselves, which is exactly why it was missed: Ink
+     * draws `round` borders from `cli-boxes`, and those are Unicode. Every one of
+     * our own literals could degrade perfectly and a legacy console would still
+     * show a frame of mojibake around the input. `classic` is the ASCII box.
+     */
+    boxStyle: 'round' | 'classic';
+    tool: Readonly<Record<string, string>>;
+    toolDefault: string;
+}
+/**
+ * The glyph set for a terminal. Memoized on `caps.unicode` — the only input —
+ * so the returned object is referentially stable and safe in `useMemo` deps.
+ */
+export declare function pickGlyphs(caps: TermCapabilities): Glyphs;
+/** Per-tool icon with the shared fallback (formerly `ToolCard::toolGlyph`). */
+export declare function toolGlyph(glyphs: Glyphs, name: string): string;

package/dist/ui/glyphs.js

@@ -0,0 +1,127 @@
+/**
+ * Glyphs — the SINGLE SOURCE OF TRUTH for every user-visible non-ASCII
+ * character in `src/ui/**` (spec §4.1).
+ *
+ * `capabilities.ts` already decides whether the terminal can render Unicode, and
+ * the theme already carried an `ASCII_SYMBOLS` table — but 16 files wrote their
+ * glyphs as bare literals and bypassed the whole mechanism, so a legacy
+ * `cmd.exe` showed mojibake for the prompt caret, the assistant marker, every
+ * list bullet, the scroll indicator and all four overlay titles.
+ *
+ * The fix is structural rather than per-site: EVERY glyph lives in one of the
+ * two tables below, components read them through `pickGlyphs(caps)`, and
+ * `glyphs.test.ts` runs a static scan that fails the build if any other file
+ * under the scanned tree grows a non-ASCII literal again.
+ *
+ * THIS FILE AND `Logo.tsx`'s art block are the only two files allowed to hold
+ * non-ASCII literals under `src/ui/**` (plus the explicit `agent/headless.ts`
+ * exemption). Adding a third exception means the guard rail stops guarding —
+ * add a field here instead.
+ */
+const UNICODE_GLYPHS = {
+    user: '›',
+    assistant: '●',
+    thinking: '✱',
+    toolPending: '◦',
+    toolRunning: '◍',
+    toolDone: '✔',
+    toolError: '✖',
+    info: 'ℹ',
+    warn: '▲',
+    error: '✖',
+    bullet: '•',
+    spinnerStill: '·',
+    gaugeFull: '█',
+    gaugeEmpty: '░',
+    keyOn: '●',
+    keyOff: '○',
+    wordmark: '◇',
+    ellipsis: '…',
+    emDash: '—',
+    midDot: '·',
+    arrowUp: '↑',
+    arrowDown: '↓',
+    arrowLeft: '←',
+    arrowRight: '→',
+    check: '✓',
+    times: '×',
+    caret: '❯',
+    steer: '⇢',
+    enterKey: '⏎',
+    shiftEnter: '⇧⏎',
+    hrule: '─',
+    railVertical: '│',
+    railBranch: '├',
+    railEnd: '╰',
+    maskDot: '•',
+    boxStyle: 'round',
+    tool: {
+        read_file: '▤',
+        write_file: '✎',
+        edit_file: '✎',
+        bash: '❯',
+        glob: '⌕',
+        grep: '⌕',
+        list_dir: '▤',
+    },
+    toolDefault: '•',
+};
+const ASCII_GLYPHS = {
+    user: '>',
+    assistant: '*',
+    thinking: '*',
+    toolPending: 'o',
+    toolRunning: '*',
+    toolDone: '[ok]',
+    toolError: '[x]',
+    info: 'i',
+    warn: '!',
+    error: 'x',
+    bullet: '-',
+    spinnerStill: '*',
+    gaugeFull: '#',
+    gaugeEmpty: '-',
+    keyOn: '*',
+    keyOff: 'o',
+    wordmark: '<>',
+    ellipsis: '...',
+    emDash: '--',
+    midDot: '-',
+    arrowUp: '^',
+    arrowDown: 'v',
+    arrowLeft: '<',
+    arrowRight: '->',
+    check: '*',
+    times: 'x',
+    caret: '>',
+    steer: '>>',
+    enterKey: 'Enter',
+    shiftEnter: 'Shift+Enter',
+    hrule: '-',
+    railVertical: '|',
+    railBranch: '|',
+    railEnd: '\\',
+    maskDot: '*',
+    boxStyle: 'classic',
+    tool: {
+        read_file: '=',
+        write_file: '+',
+        edit_file: '+',
+        bash: '>',
+        glob: '/',
+        grep: '/',
+        list_dir: '=',
+    },
+    toolDefault: '*',
+};
+/**
+ * The glyph set for a terminal. Memoized on `caps.unicode` — the only input —
+ * so the returned object is referentially stable and safe in `useMemo` deps.
+ */
+export function pickGlyphs(caps) {
+    return caps.unicode ? UNICODE_GLYPHS : ASCII_GLYPHS;
+}
+/** Per-tool icon with the shared fallback (formerly `ToolCard::toolGlyph`). */
+export function toolGlyph(glyphs, name) {
+    return glyphs.tool[name] ?? glyphs.toolDefault;
+}

package/dist/ui/gradient.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Gradient wordmark helper (spec §3.2). Pure: interpolates an RGB gradient
+ * across a short string using chalk. Below ansi-256 (or with no stops) it
+ * returns the text unchanged so the header falls back to a bold single-color
+ * wordmark. No new runtime dependency — `chalk` is already present.
+ */
+/**
+ * Render `text` with a per-character gradient across `stops` (hex colors).
+ * Returns the text unchanged when `colorLevel < 2` or `stops` is empty.
+ */
+export declare function gradientLine(text: string, stops: string[], colorLevel: 0 | 1 | 2 | 3): string;

package/dist/ui/gradient.js

@@ -0,0 +1,50 @@
+/**
+ * Gradient wordmark helper (spec §3.2). Pure: interpolates an RGB gradient
+ * across a short string using chalk. Below ansi-256 (or with no stops) it
+ * returns the text unchanged so the header falls back to a bold single-color
+ * wordmark. No new runtime dependency — `chalk` is already present.
+ */
+import { Chalk } from 'chalk';
+/** Parse a `#rrggbb` (or `#rgb`) string into an `[r, g, b]` triple. */
+function parseHex(hex) {
+    let h = hex.replace('#', '').trim();
+    if (h.length === 3)
+        h = h[0] + h[0] + h[1] + h[1] + h[2] + h[2];
+    const n = Number.parseInt(h, 16);
+    if (!Number.isFinite(n))
+        return [255, 255, 255];
+    return [(n >> 16) & 0xff, (n >> 8) & 0xff, n & 0xff];
+}
+function lerp(a, b, t) {
+    return Math.round(a + (b - a) * t);
+}
+/** Interpolate a colour at position `t` ∈ [0,1] across the RGB `stops`. */
+function colorAt(stops, t) {
+    if (stops.length === 1)
+        return stops[0];
+    const clamped = Math.max(0, Math.min(1, t));
+    const scaled = clamped * (stops.length - 1);
+    const idx = Math.min(stops.length - 2, Math.floor(scaled));
+    const local = scaled - idx;
+    const from = stops[idx];
+    const to = stops[idx + 1];
+    return [lerp(from[0], to[0], local), lerp(from[1], to[1], local), lerp(from[2], to[2], local)];
+}
+/**
+ * Render `text` with a per-character gradient across `stops` (hex colors).
+ * Returns the text unchanged when `colorLevel < 2` or `stops` is empty.
+ */
+export function gradientLine(text, stops, colorLevel) {
+    if (colorLevel < 2 || stops.length === 0 || text.length === 0)
+        return text;
+    const rgbStops = stops.map(parseHex);
+    const c = new Chalk({ level: colorLevel === 3 ? 3 : 2 });
+    const chars = [...text];
+    const denom = chars.length > 1 ? chars.length - 1 : 1;
+    return chars
+        .map((ch, i) => {
+        const [r, g, b] = colorAt(rgbStops, i / denom);
+        return c.rgb(r, g, b)(ch);
+    })
+        .join('');
+}

package/dist/ui/layout/AppShell.d.ts

@@ -0,0 +1,24 @@
+/**
+ * AppShell (spec §4.3) — the frame that makes R2 true.
+ *
+ * In `fullscreen` the root box has a FIXED height of `frameHeight(rows)` and the
+ * middle viewport is the only `flexGrow` child, so the bottom chrome (toast /
+ * composer / status bar) is physically the last thing on the screen from the
+ * very first frame — empty session, long session, mid-scroll, overlay open.
+ *
+ * In `inline` the same children are emitted in the same order with no height
+ * constraint, i.e. byte-for-byte the v0.2.0 document-flow behavior.
+ */
+import React from 'react';
+import { type RenderMode } from './frame.js';
+export interface AppShellProps {
+    mode: RenderMode;
+    rows: number;
+    cols: number;
+    header: React.ReactNode;
+    viewport: React.ReactNode;
+    toast: React.ReactNode;
+    composer: React.ReactNode;
+    status: React.ReactNode;
+}
+export declare function AppShell({ mode, rows, cols, header, viewport, toast, composer, status, }: AppShellProps): React.ReactElement;

package/dist/ui/layout/AppShell.js

@@ -0,0 +1,9 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Box } from 'ink';
+import { frameHeight } from './frame.js';
+export function AppShell({ mode, rows, cols, header, viewport, toast, composer, status, }) {
+    if (mode === 'inline') {
+        return (_jsxs(Box, { flexDirection: "column", children: [header, viewport, toast, composer, status] }));
+    }
+    return (_jsxs(Box, { flexDirection: "column", height: frameHeight(rows), width: cols, overflow: "hidden", children: [_jsx(Box, { flexDirection: "column", flexShrink: 0, children: header }), _jsx(Box, { flexDirection: "column", flexGrow: 1, flexShrink: 1, overflow: "hidden", children: viewport }), _jsxs(Box, { flexDirection: "column", flexShrink: 0, children: [toast, composer, status] })] }));
+}

package/dist/ui/layout/Gutter.d.ts

@@ -0,0 +1,67 @@
+/**
+ * Gutter (spec §4.3) — the two-column left rail every transcript entry sits in.
+ *
+ * Replaces the previous "blank line + round box per entry" idiom, which cost
+ * 3-4 fixed rows for every entry and made one ordinary tool call fill the entire
+ * viewport on a 24-row terminal. The rail carries the role glyph on the first
+ * row and the status colour along the whole entry, so the grouping that the
+ * border used to provide survives at a fraction of the vertical cost.
+ *
+ * INVARIANT I-2 — the content column MUST keep `flexShrink={0}`.
+ * `ScrollViewport` measures content height with `measureElement`; if yoga is
+ * allowed to squeeze this column down to the viewport height, the measurement
+ * reports `content === viewport`, `overflowLines` is permanently 0, and
+ * scrolling stops working with no error anywhere. Read the comment at
+ * `ScrollViewport.tsx:94-99` before touching this. Guarded by A-6.
+ */
+import React from 'react';
+/** Columns reserved for the rail, glyph included. */
+export declare const GUTTER_WIDTH = 2;
+export interface GutterProps {
+    /**
+     * Role marker on the first row (user / assistant / tool status / notice).
+     *
+     * A node rather than a string because while an answer streams the marker IS
+     * the spinner — that used to live inside `AssistantEntry`, and moving the
+     * glyph out here without moving the spinner would have silently dropped the
+     * "something is happening" affordance.
+     */
+    glyph: React.ReactNode;
+    color?: string;
+    children: React.ReactNode;
+}
+export declare function Gutter({ glyph, color, children }: GutterProps): React.ReactElement;
+/**
+ * The one-row gap between turns: a dim rail stub rather than a blank line, so
+ * the eye still follows a continuous left edge across the turn boundary.
+ */
+export declare function RailSpacer({ continuation, color, }: {
+    continuation: string;
+    color?: string;
+}): React.ReactElement;
+/**
+ * A left-only border whose vertical character is the rail glyph.
+ *
+ * Used where a block owns its own lines (tool preview, fenced code) and used to
+ * be wrapped in a round box: the border cost 2 rows plus 2 columns of padding
+ * and nested visibly inside other round boxes. Ink repeats `box.left` for the
+ * measured height of the child, so this is a continuous rail that costs 1 column
+ * and 0 rows.
+ */
+export declare function railBorderProps(rail: string, color?: string): {
+    readonly borderStyle: {
+        readonly topLeft: string;
+        readonly top: "";
+        readonly topRight: "";
+        readonly right: "";
+        readonly bottomRight: "";
+        readonly bottom: "";
+        readonly bottomLeft: string;
+        readonly left: string;
+    };
+    readonly borderTop: false;
+    readonly borderBottom: false;
+    readonly borderRight: false;
+    readonly borderLeft: true;
+    readonly borderColor: string | undefined;
+};