@aragon-agent/cli 0.5.4 → 0.5.8

package/dist/ui/App.js

@@ -11,7 +11,7 @@ import { Box, Text, useApp, useInput, useStdout } from 'ink';
 import { initialViewState, reduceEvent, viewReducer, } from '../agent/reducer.js';
 import { mergeDeltas } from '../agent/coalesce.js';
 import { computeCost } from '../agent/usage.js';
-import { parseMaxTokensInput, DEFAULT_TRANSCRIPT_WINDOW, } from '../config/schema.js';
+import { parseMaxTokensInput, DEFAULT_TRANSCRIPT_RETAIN, DEFAULT_TRANSCRIPT_WINDOW, } from '../config/schema.js';
 import { updatePersistedConfig } from '../config/store.js';
 import { appendPrompt, loadPromptHistory } from '../config/prompt-history.js';
 import { bumpSubmitCount, setMouseNoticeSeen } from '../config/ui-state.js';
@@ -29,10 +29,18 @@ import { PromptInput } from './PromptInput.js';
 import { Composer } from './Composer.js';
 import { StatusBar } from './StatusBar.js';
 import { TeamPanel } from './TeamPanel.js';
+import { TodoPanel } from './TodoPanel.js';
+import { TodoStrip } from './TodoStrip.js';
 import { ToastStack } from './ToastStack.js';
 import { AppShell } from './layout/AppShell.js';
 import { ScrollViewport } from './layout/ScrollViewport.js';
+import { todoRailRows, todoRailWidth } from './layout/rail.js';
+import { TODO_LIMITS } from '../todo/limits.js';
+import { advanceBudget, decideFollowThrough, emptyBudget, } from '../todo/follow-through.js';
 import { useTerminalSize } from './layout/useTerminalSize.js';
+import { useHeightStore } from './use-height-store.js';
+import { useRenderGovernor } from './use-render-governor.js';
+import { setPerfResetHook, setPerfSnapshotProvider } from '../commands/perf.js';
 import { frameHeight, MIN_FULLSCREEN_ROWS } from './layout/frame.js';
 import { HINT_MIN_ROWS, viewportRows as computeViewportRows } from './layout/budget.js';
 import { UNMEASURED_GEOMETRY } from './layout/regions.js';
@@ -85,13 +93,23 @@ export function resolveSettingsMaxTokens(raw, previous) {
         toast: ['warn', 'Max tokens must be a number or "auto".'],
     };
 }
-/** Merge pending delta actions ~33 ms and flush the coalescer buffer. */
-const COALESCE_MS = 33;
 export function App({ controller, version, mode, initialOverlay, initialPrompt, confirmBridge, humanInputBridge, mouseSource, geometryOverride, }) {
     const { exit } = useApp();
     const { stdout } = useStdout();
     const fullscreen = mode === 'fullscreen';
     const { rows, cols } = useTerminalSize();
+    // --- Render governor (tui-render-performance L4). ------------------------
+    //
+    // FIRST, BEFORE ANY OTHER WORK IN THIS BODY. The hook stamps
+    // `performance.now()` during render and reads it again in a layout effect, so
+    // the span it measures is only the whole commit if nothing precedes it here.
+    const cfg = controller.getConfig();
+    const governor = useRenderGovernor({
+        enabled: cfg.renderGovernor,
+        maxIntervalMs: cfg.maxRenderIntervalMs,
+    });
+    /** The transcript height cache, owned here and read by `TranscriptList` (L3). */
+    const heights = useHeightStore();
     const [state, dispatch] = useReducer(viewReducer, undefined, initialViewState);
     const [elapsedMs, setElapsedMs] = useState(0);
     const [confirmState, setConfirmState] = useState(null);
@@ -119,7 +137,6 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
     // the completion list are memoized against it, so a skill installed mid-session
     // gets its `/<name>` command and its autocomplete entry immediately.
     const [skillsNonce, setSkillsNonce] = useState(0);
-    const cfg = controller.getConfig();
     const caps = useMemo(() => {
         const detected = detectCapabilities(process.env, stdout);
         return {
@@ -144,6 +161,80 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
     const pendingHuman = useRef(new Set());
     /** Written by `AppShell`'s layout effect, read at wheel-event time (§4.5). */
     const geometryRef = useRef(UNMEASURED_GEOMETRY);
+    /**
+     * What `/perf` reports. Assigned during render, exactly like `stateRef` above,
+     * because a slash command runs outside the render pass and a value captured in
+     * an effect closure would be one commit stale on every readout.
+     */
+    const perfRef = useRef(null);
+    /**
+     * How many entries `TranscriptList` actually mounted this frame.
+     *
+     * A ref written during the child's render, not state: this is the number
+     * `render-budget.test.tsx` gates on (AC-1 / AC-9), and turning it into state
+     * would make reading the render budget cost a render.
+     */
+    const mountedCount = useRef(0);
+    // --- Follow-through (todo-plan-followthrough §3.4). ---------------------
+    //
+    // THREE REFS AND NO VIEW STATE, DELIBERATELY (§5.2). Every field added to
+    // `ViewState` is a field `restoreEntries`, `/clear`, `/reset` and the session
+    // round-trip each have to have an opinion about, and none of them has an
+    // opinion about a 3-second timer.
+    const budgetRef = useRef(emptyBudget());
+    const followTimer = useRef(null);
+    /** True while the run in flight was started by the grace timer, not the user. */
+    const autoContinuationRef = useRef(false);
+    /**
+     * WHY THE END REASON TRAVELS IN A REF THIS FEATURE OWNS (C-11 / D-17).
+     *
+     * `ViewState.aborted` / `.errorNoticed` are the DEFINITION of the end reason —
+     * `runEnd` reads exactly that pair for its own silent-failure guard — but the
+     * reducer is not a safe CHANNEL for it, because the answer is needed inside a
+     * controller callback rather than during a render.
+     *
+     * Reading `stateRef.current` there happens to work under Ink 5 only because
+     * Ink mounts a LEGACY root (`ink.js`: `createContainer(rootNode, 0 …)`), so a
+     * dispatch from a promise context flushes synchronously. Under a concurrent
+     * root — an Ink major bump, or its `experimental` renderer — React 18's
+     * automatic batching returns, and a provider stream error emitted as
+     * `message_update` immediately before `agent_end` (core throws in the loop and
+     * emits `agent_end` from `runLoopWithLifecycle`'s `finally`, microtasks apart)
+     * would still read `errorNoticed: false`. That auto-continues into a run that
+     * just failed authentication: silent, and billable.
+     *
+     * So this ref is mutated in the SAME SYNCHRONOUS CALLBACK that dispatches the
+     * corresponding action, and the reducer fields stay as the cross-check.
+     */
+    const endReasonRef = useRef({
+        aborted: false,
+        errored: false,
+    });
+    /**
+     * Disarm an armed continuation. Idempotent; NEVER touches the budget — a
+     * cancelled continuation was never issued, so it must not be charged (AC-18).
+     *
+     * Three callers and there must be no fourth: `Esc` in the idle branch, the
+     * first line of `submitMessage`, and the subscription effect's cleanup.
+     */
+    const cancelFollowThrough = useCallback(() => {
+        if (followTimer.current) {
+            clearTimeout(followTimer.current);
+            followTimer.current = null;
+        }
+    }, []);
+    /**
+     * `submitMessage` as of the LATEST render, for the grace timer.
+     *
+     * The subscription effect below never re-runs (its deps are stable by
+     * construction), so a direct call would close over the mount render's binding
+     * forever. That binding happens to be functionally correct today because
+     * `submitMessage` reads everything mutable through refs — which is exactly the
+     * kind of "happens to be correct" this feature has already had to unwind once
+     * (P1-1, P1-6). Assigned during render, the same discipline `stateRef` uses
+     * twenty lines up.
+     */
+    const submitRef = useRef(() => { });
     /**
      * THE SINGLE SETTLE PATH for a human request. Idempotent per entry, and it
      * clears the overlay as its last act.
@@ -184,6 +275,8 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
     // --- Streaming coalescer + controller subscription. --------------------
     const pending = useRef([]);
     const flushTimer = useRef(null);
+    /** Alias so the subscription effect below reads one stable ref, not a hook. */
+    const governorInterval = governor.intervalMs;
     const flushPending = useCallback(() => {
         if (flushTimer.current) {
             clearTimeout(flushTimer.current);
@@ -200,10 +293,21 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
         const unsubscribe = controller.subscribe((event) => {
             const cost = controller.getModelInfo().cost;
             for (const action of reduceEvent(event, cost)) {
+                // MUTATED HERE, ONE INSTANT BEFORE THE ACTION THAT SETS
+                // `ViewState.errorNoticed`, rather than read back from the reducer one
+                // commit later (C-11). This is the whole of the batching-independence
+                // guarantee: `agent_end` can follow this action in the same tick with no
+                // render in between, and AC-40 asserts exactly that sequence.
+                if (action.type === 'notice' && action.level === 'error') {
+                    endReasonRef.current.errored = true;
+                }
                 if (action.type === 'textDelta' || action.type === 'thinkingDelta') {
                     pending.current.push(action);
                     if (!flushTimer.current) {
-                        flushTimer.current = setTimeout(() => flushPending(), COALESCE_MS);
+                        // READ FROM THE REF AT ARM TIME (L4). This effect's dependency list
+                        // never changes by construction, so a captured number would be
+                        // pinned to the mount render and the ladder would move nothing.
+                        flushTimer.current = setTimeout(() => flushPending(), governorInterval.current);
                     }
                 }
                 else {
@@ -220,6 +324,69 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
             // Without it, an aborted run leaves a plan card on screen whose `a` key
             // silently flips the session to build, with no visible cause.
             cancelPendingHuman();
+            // --- Follow-through (todo-plan-followthrough §3.4). ------------------
+            //
+            // Round 1 printed one notice here and stopped, under a good argument
+            // ("auto-continuation is an unbounded cost loop wearing a helpful hat").
+            // That judgement is not overturned: the loop is BOUNDED first, by two
+            // structural counters, and only then permitted — opt-in, and off by
+            // default, so `followThrough: 'notify'` reproduces the old notice byte for
+            // byte (AC-1).
+            const todos = controller.getTodoSnapshot();
+            budgetRef.current = advanceBudget(budgetRef.current, todos, autoContinuationRef.current);
+            autoContinuationRef.current = false;
+            const decision = decideFollowThrough({
+                // FROM THE CONTROLLER, NOT FROM `cfg` (P1-1). This effect's dependency
+                // list never changes, so it closes over the `cfg` object from the render
+                // in which it mounted — and `setTodoConfig` builds a NEW object, which
+                // that closure will never see. `cfg.todo.followThrough` would therefore
+                // be pinned to the launch value for the whole session and
+                // `/todo follow auto` would report success and do nothing. Note the
+                // asymmetry with `showStrip` further down, which is right to use `cfg`
+                // because it runs in render scope where `cfg` is re-read every frame.
+                mode: controller.getTodoConfig().followThrough,
+                snapshot: todos,
+                runEnd: { ...endReasonRef.current },
+                budget: budgetRef.current,
+                interactive: true,
+            });
+            endReasonRef.current = { aborted: false, errored: false };
+            if (decision.kind === 'notify') {
+                dispatch({ type: 'notice', level: decision.level, text: decision.text });
+            }
+            else if (decision.kind === 'continue') {
+                dispatch({ type: 'notice', level: 'info', text: decision.notice });
+                // NO LIVE COUNTDOWN (D-10). The notice is written once and does not
+                // tick: a 10 Hz re-render of the whole frame to animate a number is the
+                // repaint cost this package refuses elsewhere, and Ink's two dedupe
+                // gates mean the alternative is not free either.
+                cancelFollowThrough(); // I-3: at most one armed continuation, ever
+                followTimer.current = setTimeout(() => {
+                    followTimer.current = null;
+                    // TWO RE-CHECKS AT FIRE TIME, not only at decision time. The grace
+                    // window is 3 s and the user can type in it (C-6): without the first,
+                    // a fired continuation would either be swallowed into
+                    // `controller.steer()` (the quiet failure) or reach
+                    // `controller.prompt()`, which REJECTS while running.
+                    if (controller.isRunning())
+                        return;
+                    const live = controller.getTodoSnapshot();
+                    if (!live || live.doneCount >= live.total)
+                        return; // the list moved
+                    budgetRef.current = { ...budgetRef.current, used: budgetRef.current.used + 1 };
+                    autoContinuationRef.current = true;
+                    // COUNTS ONLY, NEVER ITEM TEXT (D-19), and only at the fire point —
+                    // the quiet paths must stay quiet.
+                    getLogger().debug('agent', 'todo_follow', {
+                        used: budgetRef.current.used,
+                        noProgressStreak: budgetRef.current.noProgressStreak,
+                        total: live.total,
+                        done: live.doneCount,
+                        mode: 'auto',
+                    });
+                    submitRef.current(decision.message, { userInitiated: false });
+                }, decision.graceMs);
+            }
             // A deferred `plan -> build` becomes real here and nowhere else (§3.2).
             const applied = controller.applyPendingMode();
             if (applied) {
@@ -233,9 +400,13 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
         });
         return () => {
             flushPending();
+            // An armed continuation must not outlive the tree that armed it (AC-21):
+            // the timer would fire into an unmounted App and `submitRef.current` would
+            // prompt a controller nobody is rendering.
+            cancelFollowThrough();
             unsubscribe();
         };
-    }, [controller, flushPending, cancelPendingHuman]);
+    }, [controller, flushPending, cancelPendingHuman, cancelFollowThrough]);
     // --- Team-mode event stream (team-subagents §5.2 / §3.9). --------------
     //
     // A SEPARATE SUBSCRIPTION, not a branch in the one above: `TeamEvent` is
@@ -292,6 +463,34 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
             controller.dispose();
         };
     }, [controller]);
+    // --- Todo event stream (todo-plan-execution §3.8 / §5.2). --------------
+    //
+    // A THIRD SUBSCRIPTION, for the reason the team one records: `TodoEvent` is
+    // deliberately not a member of core's `AgentEvent` union (D-11), so it cannot
+    // arrive through `controller.subscribe`.
+    //
+    // NOT ROUTED THROUGH THE STREAMING COALESCER either. That buffer exists to
+    // merge text/thinking deltas; a `todo_write` is one deliberate act per step,
+    // and delaying the one surface the user is watching a long task through would
+    // be exactly backwards.
+    useEffect(() => {
+        return controller.subscribeTodos((event) => {
+            switch (event.type) {
+                case 'updated':
+                    dispatch({ type: 'todoUpdate', snapshot: event.snapshot });
+                    break;
+                case 'cleared':
+                    dispatch({ type: 'todoCleared' });
+                    break;
+                case 'rejected':
+                    // THE COMPENSATING PATH FOR SUPPRESSING THE TOOL CARD (§3.8). Without
+                    // it, the one case where `todo_write` produces nothing visible would
+                    // be the case that most needs to be visible.
+                    dispatch({ type: 'notice', level: 'warn', text: event.reason });
+                    break;
+            }
+        });
+    }, [controller]);
     // --- Elapsed timer + tokens/sec baseline while running. ----------------
     useEffect(() => {
         if (state.status !== 'running') {
@@ -342,7 +541,12 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
         // `state.json`, not `config.json`: whether a one-shot notice has been shown
         // is bookkeeping, and the comment on the old persisted key said so.
         onSeen: () => setMouseNoticeSeen(true),
-    });
+    }, 
+    // Present only when `loadConfig` had to raise the user's own
+    // `transcriptRetain` to `transcriptWindow` (tui-render-performance §5.1).
+    cfg.transcriptRetainRequested !== undefined
+        ? { requested: cfg.transcriptRetainRequested, resolved: cfg.transcriptRetain }
+        : undefined);
     // --- Exit snapshot: the only way state reaches cli.tsx (§4.4). ----------
     useEffect(() => {
         publishExitSnapshot({
@@ -351,8 +555,30 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
             provider: cfg.provider,
             model: cfg.model,
             startedAt: startedAt.current,
+            // Carried so the exit replay can say what the retain ring removed. A
+            // transcript that silently omits entries is worse than one that names the
+            // count (K-6).
+            droppedEntries: state.droppedEntries,
+        });
+    }, [state.entries, state.usageTotal, state.droppedEntries, cfg.provider, cfg.model]);
+    // --- `/perf` snapshot channel (tui-render-performance §5.4). ------------
+    //
+    // The deps are the two `useCallback`d members, NOT the handle objects: both
+    // hooks return a fresh literal per render, so depending on them would re-run
+    // this effect on every frame.
+    const governorReset = governor.reset;
+    const heightsClear = heights.clear;
+    useEffect(() => {
+        setPerfSnapshotProvider(() => perfRef.current);
+        setPerfResetHook(() => {
+            governorReset();
+            heightsClear();
         });
-    }, [state.entries, state.usageTotal, cfg.provider, cfg.model]);
+        return () => {
+            setPerfSnapshotProvider(null);
+            setPerfResetHook(null);
+        };
+    }, [governorReset, heightsClear]);
     // --- Confirm bridge (confirmTools mode + skill approvals). -------------
     useEffect(() => {
         if (!confirmBridge)
@@ -495,9 +721,12 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
         toast,
         persistConfig,
         exit: doExit,
-        submit: (text) => submitMessage(text),
+        submit: (text, opts) => submitMessage(text, opts),
         refreshSkills: () => setSkillsNonce((n) => n + 1),
         applyAgentMode: applyMode,
+        // Read at command time, so `/todo status` reports the live count rather than
+        // whatever it was when this context was built.
+        followBudget: budgetRef.current,
     });
     /**
      * Submitting a prompt no longer touches `config.json` at all — it appends one
@@ -527,13 +756,26 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
      * `handleSubmit` would re-parse it as input and, for a body that happens to
      * start with `/`, recurse into command dispatch.
      */
-    const submitMessage = (message) => {
+    const submitMessage = (message, opts = {}) => {
+        // A USER MESSAGE IS A NEW INTENT AND OUTRANKS A QUEUED ONE (AC-19). First
+        // line, before the steering branch: a message typed during the grace window
+        // must be the one that runs, whichever branch it takes.
+        cancelFollowThrough();
         if (stateRef.current.status === 'running') {
             controller.steer(message);
             toast('info', 'Steering queued.');
             return;
         }
-        recordPrompt(message);
+        // `userInitiated: false` skips TWO things and both are wanted: the
+        // prompt-history append, and the `submitCount` bump that drives the
+        // composer's hint fade. An auto-continuation demonstrates nothing about what
+        // the user has learned, so suppressing the fade is correct rather than
+        // incidental — which is why the parameter is named for the CAUSE (P2-8).
+        if (opts.userInitiated !== false)
+            recordPrompt(message);
+        // Mirrors where the reducer clears its own copies, in the same action
+        // (C-11): a new turn's end reason must not inherit the previous one's.
+        endReasonRef.current = { aborted: false, errored: false };
         dispatch({ type: 'submit', text: message });
         const pre = controller.preflight();
         if (!pre.ok) {
@@ -544,6 +786,7 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
         // Fire-and-forget: events drive the UI. prompt() never rejects.
         void controller.prompt(message);
     };
+    submitRef.current = submitMessage;
     const handleSubmit = async (raw) => {
         // Submitting is an unconditional "take me to the newest output" (§4.5).
         setPinToBottomNonce((n) => n + 1);
@@ -782,8 +1025,24 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
             }
             if (stateRef.current.status === 'running') {
                 controller.abort();
+                // Next to `abortMark`, in the same callback, for the reason
+                // `endReasonRef`'s own comment gives (C-11). D-5 turns this into
+                // silence at `agent_end`: the user's Esc is the statement, and
+                // restating what they interrupted is the CLI arguing.
+                endReasonRef.current.aborted = true;
                 dispatch({ type: 'abortMark' });
                 toast('info', 'Run aborted.');
+                return;
+            }
+            // IDLE. Today this branch does nothing at all, which is what makes it free
+            // to take (R-4). OVERLAY PRECEDENCE IS UNCHANGED AND DELIBERATE (P2-9):
+            // the block above returns while an overlay is open, so with one open the
+            // first Esc closes the overlay and the second cancels the continuation.
+            // Reaching past it would make "close this dialog" silently also mean
+            // "abandon the plan".
+            if (followTimer.current) {
+                cancelFollowThrough();
+                toast('info', 'Auto-continue cancelled.');
             }
             return;
         }
@@ -802,6 +1061,40 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
     // tells `OverlayFrame` to render everything and show no position indicator.
     const viewportBudget = computeViewportRows(rows);
     const overlayMaxRows = fullscreen ? viewportBudget : Number.POSITIVE_INFINITY;
+    // --- The todo rail (todo-plan-execution §3.9). --------------------------
+    //
+    // ONE NUMBER FOR THE GATE AND FOR THE LAYOUT (I-10). `railRows` is both what
+    // decides whether the panel mounts and what the panel lays out against; a
+    // panel that mounts on one number and renders against another shows nothing
+    // and reports nothing. `todoRailRows` is NOT `viewportBudget`: the live team
+    // roster costs up to 8 rows inside `AppShell`'s measured bottom box that the
+    // budget knows nothing about (P1-3).
+    const railRows = todoRailRows(viewportBudget, state.team !== null);
+    const railWidth = todoRailWidth(cols);
+    const showRail = fullscreen && // non-goal 4: inline mode has no fixed frame
+        cfg.todo.panel && // `/todo panel off`, persisted
+        overlay === null && // a modal owns the screen (D-7)
+        state.todos !== null && // no list -> no furniture, zero layout cost
+        railWidth > 0 && // too narrow (under 80 columns)
+        railRows >= TODO_LIMITS.panelMinRows; // too short to say anything useful
+    // The inline plan strip (todo-plan-followthrough §3.7 / W2).
+    //
+    // DELIBERATELY NOT `!showRail`, which is true for FOUR different reasons and
+    // three of them mean "do not draw this". `cfg.todo.panel` is included because
+    // `--no-todo-panel` means "keep the planning, drop the display" and a strip is
+    // a display. Overlays are NOT consulted: inline mode's overlays are part of
+    // the document flow, not a modal that owns the screen.
+    //
+    // `cfg` is the right read here and `controller.getTodoConfig()` would be
+    // needless — this runs in RENDER scope, where `cfg` is re-read every frame.
+    // The asymmetry with the `agent_end` handler above is the whole of P1-1.
+    const showStrip = !fullscreen && cfg.todo.panel && state.todos !== null;
+    // Every consumer INSIDE the viewport slot switches to this; the header,
+    // composer, status bar, toasts and every overlay keep the full frame width
+    // (C-7). Overlays keep it because `showRail` already includes `overlay ===
+    // null`: splitting the screen with a status panel behind a modal is both worse
+    // design and a second source of width-contract bugs in six components.
+    const contentCols = cols - (showRail ? railWidth : 0);
     const overlayNode = overlay === 'help' ? (_jsx(OverlayFrame, { title: "Help", hint: `Esc close ${glyphs.midDot} PgUp/PgDn scroll`, maxRows: overlayMaxRows, cols: cols, rows: helpRows(theme, caps), scrollOffset: overlayScroll, onScrollClamp: setOverlayScroll, theme: theme, caps: caps })) : overlay === 'model' ? (_jsx(ModelPicker, { registry: controller.getModelRegistry(), currentProvider: cfg.provider, currentModel: cfg.model, maxRows: overlayMaxRows, cols: cols, theme: theme, caps: caps, onSelect: handleModelSelect })) : overlay === 'settings' ? (_jsx(SettingsScreen, { initial: {
             provider: cfg.provider,
             model: cfg.model,
@@ -834,15 +1127,34 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
     // The wordmark + getting-started card now live INSIDE the viewport, as its
     // first block of content, so they scroll away instead of being yanked out of
     // the header the moment the first message lands.
-    const opener = empty ? (_jsx(SessionOpener, { variant: fullscreen ? pickOpenerVariant(viewportBudget, cols, caps) : 'none', version: version, cwd: controller.getCwd(), hasKey: hasKey, viewportRows: fullscreen ? viewportBudget : Number.POSITIVE_INFINITY, theme: theme, caps: caps })) : null;
+    const opener = empty ? (_jsx(SessionOpener, { variant: fullscreen ? pickOpenerVariant(viewportBudget, contentCols, caps) : 'none', version: version, cwd: controller.getCwd(), hasKey: hasKey, viewportRows: fullscreen ? viewportBudget : Number.POSITIVE_INFINITY, theme: theme, caps: caps })) : null;
     const density = cfg.density;
-    const viewport = fullscreen ? (overlayNode ? (_jsx(Box, { flexDirection: "column", flexGrow: 1, overflow: "hidden", children: overlayNode })) : (_jsxs(ScrollViewport, { intent: scrollIntent, pinToBottomNonce: pinToBottomNonce, onScrolledLinesChange: setScrolledLines, showScrollIndicator: true, theme: theme, caps: caps, children: [opener, _jsx(TranscriptList, { entries: state.entries, expandedToolIds: state.expandedToolIds, thinkingVisible: state.thinkingVisible, reducedMotion: reducedMotion, density: density, theme: theme, caps: caps, windowSize: cfg.transcriptWindow ?? DEFAULT_TRANSCRIPT_WINDOW })] }))) : (_jsxs(_Fragment, { children: [opener, _jsx(Transcript, { entries: state.entries, expandedToolIds: state.expandedToolIds, thinkingVisible: state.thinkingVisible, reducedMotion: reducedMotion, density: density, theme: theme, caps: caps }), overlayNode] }));
+    const transcriptWindow = cfg.transcriptWindow ?? DEFAULT_TRANSCRIPT_WINDOW;
+    // Assigned during render so `/perf` reads the CURRENT frame (see `perfRef`).
+    // `mountedEntries` is the same number `render-budget.test.tsx` asserts (AC-9).
+    perfRef.current = {
+        rung: governor.rung,
+        intervalMs: governor.intervalMs.current,
+        lastCommitMs: governor.lastCommitMs(),
+        governorEnabled: cfg.renderGovernor,
+        totalEntries: state.entries.length,
+        retain: cfg.transcriptRetain ?? DEFAULT_TRANSCRIPT_RETAIN,
+        droppedEntries: state.droppedEntries,
+        mountedEntries: mountedCount.current,
+        heightsMeasured: heights.stats().measured,
+        heightsEstimated: heights.stats().estimated,
+        cols: contentCols,
+        mode: fullscreen ? 'fullscreen' : 'inline',
+        viewportRows: fullscreen ? viewportBudget : rows,
+        offset: scrolledLines,
+    };
+    const viewport = fullscreen ? (overlayNode ? (_jsx(Box, { flexDirection: "column", flexGrow: 1, overflow: "hidden", children: overlayNode })) : (_jsxs(ScrollViewport, { intent: scrollIntent, pinToBottomNonce: pinToBottomNonce, onScrolledLinesChange: setScrolledLines, showScrollIndicator: true, cols: contentCols, theme: theme, caps: caps, children: [opener, _jsx(TranscriptList, { entries: state.entries, expandedToolIds: state.expandedToolIds, thinkingVisible: state.thinkingVisible, reducedMotion: reducedMotion, density: density, theme: theme, caps: caps, windowSize: transcriptWindow, cols: contentCols, heights: heights, mountedSink: mountedCount })] }))) : (_jsxs(_Fragment, { children: [opener, _jsx(Transcript, { entries: state.entries, expandedToolIds: state.expandedToolIds, thinkingVisible: state.thinkingVisible, reducedMotion: reducedMotion, density: density, theme: theme, caps: caps }), overlayNode] }));
     // The completion popup lives inside the bottom chrome and can add up to 9
     // rows; unbounded, it pushes the status bar past the frame height where
     // `overflow: hidden` clips it away (R-14 / M-14). Cap it against the viewport.
     const popupMaxRows = fullscreen ? Math.max(1, viewportBudget - 4) : undefined;
     const composer = fullscreen ? (_jsx(Composer, { isActive: overlay === null, running: state.status === 'running', history: promptHistory, commands: commandOptions, cwd: controller.getCwd(), showHint: rows >= HINT_MIN_ROWS, submitCount: cfg.submitCount, hintsEnabled: cfg.hints, agentMode: state.agentMode, popupMaxRows: popupMaxRows, historyIntent: historyIntent, theme: theme, caps: caps, onSubmit: (text) => void handleSubmit(text), onHelp: () => dispatch({ type: 'setOverlay', overlay: 'help' }) })) : (_jsx(Box, { marginTop: 1, children: _jsx(PromptInput, { isActive: overlay === null, running: state.status === 'running', history: promptHistory, commands: commandOptions, cwd: controller.getCwd(), agentMode: state.agentMode, theme: theme, caps: caps, onSubmit: (text) => void handleSubmit(text), onHelp: () => dispatch({ type: 'setOverlay', overlay: 'help' }) }) }));
-    return (_jsx(AppShell, { mode: mode, rows: rows, cols: cols, geometryRef: geometryRef, header: header, viewport: viewport, team: state.team ? (_jsx(TeamPanel, { snapshot: state.team, rows: rows, cols: cols, reducedMotion: reducedMotion, theme: theme, caps: caps })) : null, toast: _jsx(ToastStack, { toasts: state.toasts, theme: theme, mode: mode }), composer: composer, status: _jsx(StatusBar, { model: cfg.model, provider: cfg.provider, usageTotal: state.usageTotal, contextTokens: state.contextTokens, contextWindow: modelInfo.contextWindow, contextWindowKnown: modelKnown, status: state.status, elapsedMs: elapsedMs, thinkingLevel: cfg.thinkingLevel, tokPerSec: tokPerSec, theme: theme, caps: caps, scrolledLines: scrolledLines, redrawNonce: redrawNonce, agentMode: state.agentMode, pendingAgentMode: state.pendingAgentMode, ...(state.team
+    return (_jsx(AppShell, { mode: mode, rows: rows, cols: cols, geometryRef: geometryRef, header: header, viewport: viewport, team: state.team ? (_jsx(TeamPanel, { snapshot: state.team, rows: rows, cols: cols, reducedMotion: reducedMotion, theme: theme, caps: caps })) : null, rail: showRail && state.todos ? (_jsx(TodoPanel, { snapshot: state.todos, width: railWidth, rows: railRows, running: state.status === 'running', reducedMotion: reducedMotion, theme: theme, caps: caps })) : null, strip: showStrip && state.todos ? (_jsx(TodoStrip, { snapshot: state.todos, cols: cols, theme: theme, caps: caps })) : null, toast: _jsx(ToastStack, { toasts: state.toasts, theme: theme, mode: mode }), composer: composer, status: _jsx(StatusBar, { model: cfg.model, provider: cfg.provider, usageTotal: state.usageTotal, contextTokens: state.contextTokens, contextWindow: modelInfo.contextWindow, contextWindowKnown: modelKnown, status: state.status, elapsedMs: elapsedMs, thinkingLevel: cfg.thinkingLevel, tokPerSec: tokPerSec, theme: theme, caps: caps, scrolledLines: scrolledLines, redrawNonce: redrawNonce, agentMode: state.agentMode, pendingAgentMode: state.pendingAgentMode, ecoRung: governor.rung, ...(state.team
                 ? {
                     teamActive: {
                         running: state.team.runs.filter((r) => r.phase !== 'queued' && r.phase !== 'done' &&
@@ -850,5 +1162,7 @@ export function App({ controller, version, mode, initialOverlay, initialPrompt,
                         total: state.team.runs.length,
                     },
                 }
+                : {}), ...(state.todos && !showRail
+                ? { todoActive: { done: state.todos.doneCount, total: state.todos.total } }
                 : {}) }) }));
 }

package/dist/ui/Markdown.d.ts

@@ -7,7 +7,13 @@
  * *italic* / `code` / ~~strike~~. Anything else renders as plain text. Still
  * intentionally small — not a CommonMark implementation.
  *
- * The grammar lives in `markdown-blocks.ts`; this file only renders.
+ * The grammar lives in `markdown-blocks.ts`; this file only renders. That was
+ * true of the file header long before it was true of the file
+ * (tui-render-performance R2): the block grammar used to run here, in the render
+ * body, on every frame. Both expensive halves are now memoised on the input
+ * string — `parseMarkdownCached` for the AST, `highlightCached` for the ANSI —
+ * while theme and glyphs stay render-time, so `/theme` still takes effect
+ * immediately (K-5).
  */
 import React from 'react';
 import type { Theme } from './theme.js';

package/dist/ui/Markdown.js

@@ -1,54 +1,27 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Text } from 'ink';
-import { highlight } from 'cli-highlight';
 import { pickGlyphs } from './glyphs.js';
 import { railBorderProps } from './layout/Gutter.js';
-import { formatTable, isRule, isTableDivider, parseHeading, parseInline, parseTableRow, tableAlignments, } from './markdown-blocks.js';
-const FENCE = /^```(\w*)\s*$/;
+import { highlightCached, parseMarkdownCached } from './render-cache.js';
+import { formatTable, isRule, parseHeading, parseInline, } from './markdown-blocks.js';
 /** Width of the `---` rule. Fixed so it cannot force a wrap on narrow frames. */
 const RULE_WIDTH = 24;
 export function Markdown({ text, theme, caps }) {
     const glyphs = pickGlyphs(caps);
-    const lines = text.split('\n');
-    const blocks = [];
-    let i = 0;
-    let key = 0;
-    while (i < lines.length) {
-        const line = lines[i] ?? '';
-        const fence = FENCE.exec(line.trim());
-        if (fence) {
-            const lang = fence[1] || '';
-            const codeLines = [];
-            i += 1;
-            while (i < lines.length && !FENCE.test((lines[i] ?? '').trim())) {
-                codeLines.push(lines[i] ?? '');
-                i += 1;
-            }
-            i += 1; // skip closing fence
-            blocks.push(_jsx(CodeBlock, { code: codeLines.join('\n'), lang: lang, theme: theme, glyphs: glyphs }, `b${key++}`));
-            continue;
-        }
-        // A pipe row followed by a divider row starts a table; consume the run.
-        const headerCells = parseTableRow(line);
-        if (headerCells && i + 1 < lines.length && isTableDivider(lines[i + 1] ?? '')) {
-            const align = tableAlignments(lines[i + 1] ?? '');
-            const rows = [headerCells];
-            i += 2;
-            while (i < lines.length) {
-                const cells = parseTableRow(lines[i] ?? '');
-                if (!cells)
-                    break;
-                rows.push(cells);
-                i += 1;
-            }
-            const formatted = formatTable(rows, align);
-            blocks.push(_jsx(Box, { flexDirection: "column", children: formatted.map((row, r) => (_jsx(Text, { wrap: "truncate", bold: r === 0, color: r === 0 ? theme.accent : undefined, children: row }, r))) }, `b${key++}`));
-            continue;
+    const blocks = parseMarkdownCached(text);
+    return (_jsx(Box, { flexDirection: "column", children: blocks.map((block, i) => renderBlock(block, i, theme, glyphs)) }));
+}
+function renderBlock(block, key, theme, glyphs) {
+    switch (block.kind) {
+        case 'code':
+            return (_jsx(CodeBlock, { code: block.code, lang: block.lang, theme: theme, glyphs: glyphs }, `b${key}`));
+        case 'table': {
+            const formatted = formatTable(block.rows, block.align);
+            return (_jsx(Box, { flexDirection: "column", children: formatted.map((row, r) => (_jsx(Text, { wrap: "truncate", bold: r === 0, color: r === 0 ? theme.accent : undefined, children: row }, r))) }, `b${key}`));
         }
-        blocks.push(_jsx(InlineLine, { line: line, theme: theme, glyphs: glyphs }, `b${key++}`));
-        i += 1;
+        default:
+            return _jsx(InlineLine, { line: block.text, theme: theme, glyphs: glyphs }, `b${key}`);
     }
-    return _jsx(Box, { flexDirection: "column", children: blocks });
 }
 /**
  * Fenced code. The round border is gone (§4.3): nested inside a tool card it
@@ -57,13 +30,7 @@ export function Markdown({ text, theme, caps }) {
  * code" boundary for 1 column and 0 rows.
  */
 function CodeBlock({ code, lang, theme, glyphs, }) {
-    let rendered = code;
-    try {
-        rendered = highlight(code, { language: lang || undefined, ignoreIllegals: true });
-    }
-    catch {
-        rendered = code;
-    }
+    const rendered = highlightCached(code, lang);
     return (_jsxs(Box, { flexDirection: "column", flexShrink: 0, paddingLeft: 1, ...railBorderProps(glyphs.railVertical, theme.border), children: [lang.length > 0 && (_jsx(Text, { color: theme.chip.fg, backgroundColor: theme.chip.bg, children: ` ${lang} ` })), _jsx(Text, { children: rendered })] }));
 }
 /** Six heading levels used to render identically; now they carry three weights. */

package/dist/ui/StatusBar.d.ts

@@ -70,6 +70,37 @@ interface StatusBarProps {
         running: number;
         total: number;
     };
+    /**
+     * Live todo counts (todo-plan-execution §6.3), or absent.
+     *
+     * `App` sends this ONLY when a list exists AND the rail does not: with the
+     * rail on screen the numbers are already there in a larger typeface, and
+     * duplicating them costs the context gauge columns it cannot spare. This is
+     * therefore the INLINE-MODE and NARROW-TERMINAL fallback for R-d, which is
+     * exactly why it is here rather than being folded into the rail's own gate.
+     *
+     * Degrades below `TODO_LIMITS.statusCompactCols` from `todo 2/7` to `[2/7]`,
+     * the same treatment and the same justification as the team counter's
+     * `agents 3/5` -> `[3]`. See the note on `agentMode` for why that rule does
+     * NOT apply to the mode word.
+     */
+    todoActive?: {
+        done: number;
+        total: number;
+    };
+    /**
+     * Render-governor rung (tui-render-performance L4). `> 0` renders a muted
+     * `eco` chip.
+     *
+     * I-L4-2 — THE GOVERNOR IS USER-VISIBLE, and this is where. A user who cannot
+     * see why the stream got chunkier will conclude the model got slower, and
+     * degrading silently is the one thing a claim of robustness cannot afford.
+     * It sits in the RIGHT cluster next to the other derived numbers and is
+     * suppressed on a narrow terminal, which is the `teamActive` treatment rather
+     * than the `agentMode` one: the mode must never be unreportable, whereas an
+     * eco chip on a 50-column terminal costs the context gauge more than it says.
+     */
+    ecoRung?: number;
 }
 export declare function StatusBar(props: StatusBarProps): React.ReactElement;
 export {};