@aragon-agent/cli 0.6.29 → 0.6.31

package/dist/ui/App.js

@@ -16,13 +16,13 @@ import { computeCost } from '../agent/usage.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, setMouseNoticeVersion, setVtInputNoticeVersion, } from '../config/ui-state.js';
+import { bumpSubmitCount, setMouseNoticeVersion, setScrollModeNoticeVersion, setVtInputNoticeVersion, } from '../config/ui-state.js';
 import { getLogger } from '../logging/logger.js';
 import { isTerminalStatus } from '../proc/types.js';
 import { getSecrets } from '../logging/secret-registry.js';
 import { redactText } from '../logging/redact.js';
 import { resolveTuiCapabilities } from './capabilities.js';
-import { useStartupNotices, MOUSE_NOTICE_VERSION, VT_INPUT_NOTICE_VERSION, } from './use-startup-notices.js';
+import { useStartupNotices, MOUSE_NOTICE_VERSION, SCROLL_MODE_NOTICE_VERSION, VT_INPUT_NOTICE_VERSION, } from './use-startup-notices.js';
 import { getTheme } from './theme.js';
 import { pickGlyphs } from './glyphs.js';
 import { Header } from './Header.js';
@@ -38,6 +38,9 @@ import { BottomStatusRow } from './BottomStatusRow.js';
 // Only the updater's pure visibility predicate enters the status detail plan.
 import { shouldRenderUpdateLine } from '../update/types.js';
 import { AppShell } from './layout/AppShell.js';
+import { ScrollbackShell } from './ScrollbackShell.js';
+import { useScrollbackView } from './scrollback/use-scrollback-view.js';
+import { buildExitSummary } from './scrollback/exit-summary.js';
 import { ScrollViewport } from './layout/ScrollViewport.js';
 import { buildTodoRailLayout } from './layout/todo-layout.js';
 import { buildTeamPanelLayout } from './layout/team-panel.js';
@@ -132,7 +135,11 @@ function seedViewState(seed) {
         ? viewReducer(base, { type: 'restoreEntries', entries: seed.entries })
         : base;
 }
-export function App({ controller, version, initialOverlay, initialPrompt, confirmBridge, humanInputBridge, mouseSource, vtInputWarning, updateBridge, pasteBridge, terminal, initialEntries, session, sessionBridge, sessionNotice, }) {
+export function App({ controller, version, initialOverlay, initialPrompt, confirmBridge, humanInputBridge, mouseSource, vtInputWarning, updateBridge, pasteBridge, terminal, scrollMode = 'app', scrollback, initialEntries, session, sessionBridge, sessionNotice, }) {
+    const native = scrollMode === 'native' && scrollback !== undefined;
+    /** Set when the native writer swallowed repeated tall frames; cleared by a resize. */
+    const [guardTripped, setGuardTripped] = useState(false);
+    const scrollbackViewRef = useRef(null);
     const { exit } = useApp();
     const { stdout } = useStdout();
     const size = useTerminalSize();
@@ -164,8 +171,8 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
      * can never step past the window and skip content. The unsafe direction is the
      * one that matters, and it is unreachable.
      */
-    const overlayPage = overlayPageSize(dimensions.viewportRows, cols);
-    const tooSmall = dimensions.inactive;
+    const overlayPage = overlayPageSize(dimensions.viewportRows + (native ? 1 : 0), cols);
+    const tooSmall = dimensions.inactive || (native && guardTripped);
     // --- Render governor (tui-render-performance L4). ------------------------
     //
     // FIRST, BEFORE ANY OTHER WORK IN THIS BODY. The hook stamps
@@ -1054,6 +1061,8 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
             nodeVersion: vtInputWarning.nodeVersion,
             onSeen: () => setVtInputNoticeVersion(VT_INPUT_NOTICE_VERSION),
         }
+        : undefined, native
+        ? { onSeen: () => setScrollModeNoticeVersion(SCROLL_MODE_NOTICE_VERSION) }
         : undefined);
     // --- Exit snapshot: the only way state reaches cli.tsx (§4.4). ----------
     useEffect(() => {
@@ -1491,6 +1500,7 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
         ...(sessionBridge?.branch ? { branch: sessionBridge.branch } : {}),
         dispatch: (action) => {
             if (action.type === 'resetConversation' || action.type === 'restoreEntries') {
+                scrollbackViewRef.current?.notifyReset(action.type === 'resetConversation' ? 'clear' : 'restore');
                 metrics.current = createRunMetrics();
                 manualMetrics.current = createRunMetrics();
                 setScrollResetKey((n) => n + 1);
@@ -1541,6 +1551,7 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
             }
             : {}),
         ...(terminal?.writeForeign ? { writeForeign: terminal.writeForeign } : {}),
+        ...(native ? { nativeScroll: true } : {}),
     });
     /**
      * Submitting a prompt no longer touches `config.json` at all — it appends one
@@ -2042,7 +2053,9 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
             setRedrawNonce((n) => n + 1);
             return;
         }
-        {
+        // Native mode has no scrollable viewport: the terminal owns scrolling, so these
+        // keys are left alone. An open overlay is application content and keeps them.
+        if (!native || stateRef.current.overlay) {
             if (key.pageUp) {
                 scrollBy('pageUp');
                 return;
@@ -2063,10 +2076,12 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
         if (key.ctrl && (input === 't' || input === 'T')) {
             const revealing = !stateRef.current.thinkingVisible;
             dispatch({ type: 'toggleThinking' });
+            // Printed history never changes, so say what the toggle actually reaches.
+            const scope = native ? ' Applies to new messages.' : '';
             if (!revealing)
-                toast('info', 'Thinking hidden.');
+                toast('info', `Thinking hidden.${scope}`);
             else
-                toast('info', 'Thinking shown.');
+                toast('info', `Thinking shown.${scope}`);
             return;
         }
         if (key.ctrl && (input === 'o' || input === 'O')) {
@@ -2090,7 +2105,13 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
                 e.kind === 'team' ||
                 e.kind === 'compaction' ||
                 (e.kind === 'service' && !e.terminal));
-            if (last)
+            // Native mode cannot rewrite what is already printed, so it PRINTS an expanded
+            // copy as a new block instead of toggling the old one (spec 4.7).
+            if (last && native) {
+                if (!scrollbackViewRef.current?.reprintExpanded(last.id))
+                    toast('info', 'Nothing to expand.');
+            }
+            else if (last)
                 dispatch({ type: 'toggleExpand', id: last.id });
             // WIDENED FROM `No tool output to expand.`: with three expandable kinds the
             // old wording would be wrong in two of the three empty cases.
@@ -2243,7 +2264,6 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
     const frameBudget = buildFrameBudget({ rows, cols, draftRows,
         popupRows: overlay ? 0 : popupRows, statusExpanded });
     const viewportBudget = frameBudget.viewportRows;
-    const overlayMaxRows = viewportBudget;
     const composerBaseRows = 0;
     const baseRail = buildTodoRailLayout({
         cols: cols - 1, panelEnabled: cfg.todo.panel, overlayOpen: false,
@@ -2263,9 +2283,49 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
         itemCount: state.todos?.items.length ?? 0, viewportBudget,
         teamRows: teamLayout.rowCount, queueRows: queueLayout.rows, popupRows: 0, composerBaseRows,
     });
-    const { visible: showRail, width: railWidth, rows: railRows, contentCols } = railLayout;
+    const { visible: railVisible, width: railWidth, rows: railRows, contentCols } = railLayout;
+    // No fixed frame means no side rail in native mode (N4); the status chip carries it.
+    const showRail = railVisible && !native;
     const transcriptEntries = useMemo(() => selectTranscriptEntries(state.entries, state.pendingSteering), [state.entries, state.pendingSteering]);
-    const overlayNode = overlay === 'queue' ? (_jsx(QueueOverlay, { pending: state.pendingSteering, cols: cols, maxRows: overlayMaxRows, scrollOffset: overlayScroll, onScrollClamp: setOverlayScroll, theme: theme, caps: caps })) : 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, { isActive: !tooSmall, registry: controller.getModelRegistry(), currentProvider: cfg.provider, currentModel: cfg.model, maxRows: overlayMaxRows, cols: cols, theme: theme, caps: caps, onSelect: handleModelSelect })) : overlay === 'settings' ? (_jsx(SettingsScreen, { isActive: !tooSmall, initial: {
+    // --- Native scroll (tui-native-terminal-scroll). -----------------------------
+    //
+    // ALWAYS CALLED, INERT WHEN `enabled` IS FALSE: hooks cannot be conditional, and
+    // an inert hook is what keeps `scrollMode: 'app'` byte-identical (I-S9).
+    const viewCols = native ? Math.max(1, cols - 1) : cols;
+    const header = (_jsx(Header, { columns: viewCols, statusExpanded: statusExpanded, scrolledLines: scrolledLines, overlayOpen: overlay !== null, cwd: controller.getCwd(), provider: cfg.provider, model: cfg.model, hasKey: hasKey, variant: pickHeaderVariant(cols), theme: theme, caps: caps }));
+    // 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: pickOpenerVariant(native ? Math.max(0, rows - 8) : viewportBudget, native ? viewCols : contentCols), version: version, cwd: controller.getCwd(), hasKey: hasKey, viewportRows: native ? Math.max(0, rows - 8) : viewportBudget, theme: theme, caps: caps })) : null;
+    const scrollbackView = useScrollbackView({
+        enabled: native, bridge: scrollback, entries: state.entries, runActive: running,
+        theme, caps, density: cfg.density, thinkingVisible: state.thinkingVisible,
+        reducedMotion, rows, cols, headerNode: header, openerNode: opener,
+        overlayOpen: overlay !== null, draftRows, popupRows: overlay ? 0 : popupRows,
+        statusExpanded, forceInactive: native && guardTripped,
+    });
+    scrollbackViewRef.current = scrollbackView;
+    // The two hooks `cli.tsx` calls from OUTSIDE React: the exit summary (every exit
+    // path, some of which run after this tree is gone, so it reads refs, never state)
+    // and the writer's tall-frame guard. A resize clears the degraded state.
+    useLayoutEffect(() => {
+        if (!native || !scrollback)
+            return undefined;
+        scrollback.getSummaryRows = () => {
+            const live = controller.getConfig();
+            return buildExitSummary({
+                entries: stateRef.current.entries, usageTotal: stateRef.current.usageTotal,
+                provider: live.provider, model: live.model, elapsedMs: Date.now() - startedAt.current,
+                ...(identityRef.current ? { sessionId: identityRef.current.id } : {}), glyphs,
+            });
+        };
+        scrollback.onGuardTrip = () => setGuardTripped(true);
+        return () => { scrollback.onGuardTrip = null; };
+    }, [native, scrollback, controller, glyphs]);
+    useEffect(() => { setGuardTripped(false); }, [rows, cols]);
+    const nativeBudget = native ? scrollbackView.budget : null;
+    const overlayMaxRows = nativeBudget ? nativeBudget.overlayRows : viewportBudget;
+    const overlayNode = overlay === 'queue' ? (_jsx(QueueOverlay, { pending: state.pendingSteering, cols: viewCols, maxRows: overlayMaxRows, scrollOffset: overlayScroll, onScrollClamp: setOverlayScroll, theme: theme, caps: caps })) : overlay === 'help' ? (_jsx(OverlayFrame, { title: "Help", hint: `Esc close ${glyphs.midDot} PgUp/PgDn scroll`, maxRows: overlayMaxRows, cols: viewCols, rows: helpRows(theme, caps, native), scrollOffset: overlayScroll, onScrollClamp: setOverlayScroll, theme: theme, caps: caps })) : overlay === 'model' ? (_jsx(ModelPicker, { isActive: !tooSmall, registry: controller.getModelRegistry(), currentProvider: cfg.provider, currentModel: cfg.model, maxRows: overlayMaxRows, cols: viewCols, theme: theme, caps: caps, onSelect: handleModelSelect })) : overlay === 'settings' ? (_jsx(SettingsScreen, { isActive: !tooSmall, initial: {
             provider: cfg.provider,
             model: cfg.model,
             baseUrl: cfg.baseUrl ?? '',
@@ -2299,15 +2359,10 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
             // the save handler cannot disagree about what `(inherit)` means.
             ...fastSettingsFrom(cfg.fast),
             ...compactionSettingsFrom(cfg.compaction),
-        }, apiKeys: cfg.apiKeys, maxRows: overlayMaxRows, cols: cols, scrollOffset: overlayScroll, onScrollClamp: setOverlayScroll, theme: theme, caps: caps, draft: settingsDraft, probe: probe, onProfileSave: handleProfileSave, onReload: () => controller.createModelSettingsDraft(), onClose: () => dispatch({ type: 'setOverlay', overlay: null }), 
+        }, apiKeys: cfg.apiKeys, maxRows: overlayMaxRows, cols: viewCols, scrollOffset: overlayScroll, onScrollClamp: setOverlayScroll, theme: theme, caps: caps, draft: settingsDraft, probe: probe, onProfileSave: handleProfileSave, onReload: () => controller.createModelSettingsDraft(), onClose: () => dispatch({ type: 'setOverlay', overlay: null }), 
         // Read from `cfg` (render scope, re-read every frame), so `/retry off`
         // while the screen is open shows the new value on the next paint.
-        retrySummary: cfg.retry.enabled && cfg.retry.maxRetries > 0 ? String(cfg.retry.maxRetries) : 'off' })) : overlay === 'confirm' && confirmState ? (_jsx(ConfirmDialog, { isActive: !tooSmall, state: confirmState, maxRows: overlayMaxRows, cols: cols, theme: theme, caps: caps, onClose: closeConfirm })) : overlay === 'question' && humanRequest?.kind === 'questions' ? (_jsx(QuestionOverlay, { isActive: !tooSmall, questions: humanRequest.questions, maxRows: overlayMaxRows, cols: cols, theme: theme, caps: caps, onSubmit: (answers) => resolveHuman({ kind: 'answers', answers, cancelled: false }) })) : overlay === 'plan' && humanRequest?.kind === 'plan' ? (_jsx(PlanReviewOverlay, { isActive: !tooSmall, plan: humanRequest.plan, maxRows: overlayMaxRows, cols: cols, scrollOffset: overlayScroll, onScrollClamp: setOverlayScroll, theme: theme, caps: caps, onVerdict: handlePlanVerdict })) : null;
-    const header = (_jsx(Header, { columns: cols, statusExpanded: statusExpanded, scrolledLines: scrolledLines, overlayOpen: overlay !== null, cwd: controller.getCwd(), provider: cfg.provider, model: cfg.model, hasKey: hasKey, variant: pickHeaderVariant(cols), theme: theme, caps: caps }));
-    // 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: pickOpenerVariant(viewportBudget, contentCols), version: version, cwd: controller.getCwd(), hasKey: hasKey, viewportRows: viewportBudget, theme: theme, caps: caps })) : null;
+        retrySummary: cfg.retry.enabled && cfg.retry.maxRetries > 0 ? String(cfg.retry.maxRetries) : 'off' })) : overlay === 'confirm' && confirmState ? (_jsx(ConfirmDialog, { isActive: !tooSmall, state: confirmState, maxRows: overlayMaxRows, cols: viewCols, theme: theme, caps: caps, onClose: closeConfirm })) : overlay === 'question' && humanRequest?.kind === 'questions' ? (_jsx(QuestionOverlay, { isActive: !tooSmall, questions: humanRequest.questions, maxRows: overlayMaxRows, cols: viewCols, theme: theme, caps: caps, onSubmit: (answers) => resolveHuman({ kind: 'answers', answers, cancelled: false }) })) : overlay === 'plan' && humanRequest?.kind === 'plan' ? (_jsx(PlanReviewOverlay, { isActive: !tooSmall, plan: humanRequest.plan, maxRows: overlayMaxRows, cols: viewCols, scrollOffset: overlayScroll, onScrollClamp: setOverlayScroll, theme: theme, caps: caps, onVerdict: handlePlanVerdict })) : null;
     const density = cfg.density;
     const transcriptWindow = cfg.transcriptWindow ?? DEFAULT_TRANSCRIPT_WINDOW;
     // The fixed status bar remains visible underneath every overlay and toast.
@@ -2326,8 +2381,8 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
         heightsMeasured: heights.stats().measured,
         heightsEstimated: heights.stats().estimated,
         cols: contentCols,
-        mode: 'fullscreen',
-        viewportRows: viewportBudget,
+        mode: native ? 'native' : 'fullscreen',
+        viewportRows: nativeBudget ? nativeBudget.liveRows : viewportBudget,
         offset: scrolledLines,
         // A getter: the bridge's `frameReady` and geometry change outside React renders.
         get scrollbar() {
@@ -2376,7 +2431,7 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
             level: latestToast.level === 'success' ? 'info' : latestToast.level } : undefined,
     });
     const statusInput = {
-        columns: cols, phase: state.runPhase, pendingCount: state.pendingSteering.length,
+        columns: viewCols, phase: state.runPhase, pendingCount: state.pendingSteering.length,
         context: state.context, usageTotal: state.usageTotal, thinkingLevel: cfg.thinkingLevel,
         elapsedMs, tokPerSec, speedKnown, activeTool: state.activeTool, runOutcome: state.runOutcome,
         waitingForConfirmation: !!humanRequest || !!confirmState,
@@ -2392,7 +2447,7 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
         ...feedbackProjection,
     };
     const details = planStatusDetail({ status: statusInput, model: cfg.model, provider: cfg.provider,
-        hints: { interactionPhase: interactionPhase.current, cols, completion, overlay,
+        hints: { interactionPhase: interactionPhase.current, cols: viewCols, completion, overlay,
             selectionPending: selectionController?.hasPendingSelection() ?? false,
             copyInFlight: copyState.busy, copyCleanupPending: copyState.cleanupPending,
             hasDraft: hasDraftRef.current, services: liveServices,
@@ -2403,43 +2458,48 @@ export function App({ controller, version, initialOverlay, initialPrompt, confir
     const team = state.team ? (_jsx(TeamPanel, { snapshot: state.team, layout: teamLayout, rows: rows, cols: contentCols, reducedMotion: viewReducedMotion, theme: theme, caps: caps })) : null;
     const rail = showRail && state.todos ? (_jsx(TodoPanel, { snapshot: state.todos, width: railWidth, rows: railRows, running: running, reducedMotion: viewReducedMotion, theme: theme, caps: caps })) : null;
     const viewport = (_jsxs(ScrollViewport, { active: overlay === null && !tooSmall, overlay: overlayNode, footer: _jsxs(_Fragment, { children: [team, _jsx(QueuePanel, { layout: queueLayout, theme: theme })] }), rail: rail, scrollbar: terminal?.scrollbar, resetKey: scrollResetKey, intent: scrollIntent, pinToBottomNonce: pinToBottomNonce, onScrolledLinesChange: setScrolledLines, onViewportShiftChange: onViewportShiftChange, onGeometryChange: onGeometryChange, geometryKey: `${rows}:${cols}:${viewportBudget}:${frameBudget.composerSlotRows}:${frameBudget.statusRows}:${contentCols}:${overlay}:${tooSmall}`, tailRowsRef: tailSink, hold: selectionHold, resumeMs: cfg.scrollResumeMs, showScrollIndicator: true, cols: contentCols, theme: theme, caps: caps, children: [opener, _jsx(TranscriptList, { entries: transcriptEntries, expandedToolIds: state.expandedToolIds, thinkingVisible: state.thinkingVisible, reducedMotion: viewReducedMotion, density: density, nowSec: nowSec, theme: theme, caps: caps, windowSize: transcriptWindow, cols: contentCols, heights: heights, mountedSink: mountedCount, tailSink: tailSink })] }));
-    return (_jsx(AppShell, { inactive: tooSmall, placeholder: _jsxs(Text, { wrap: "truncate", color: theme.noticeWarn, children: [glyphs.warn, " Terminal too small - needs at least 40 columns and 12 rows."] }), rows: rows, cols: cols, header: header, viewport: viewport, viewportRows: frameBudget.viewportRows, composer: composer, composerSlotRows: frameBudget.composerSlotRows, statusRows: frameBudget.statusRows, details: _jsx(BottomStatusRow, { plan: details, columns: cols, theme: theme }), status: _jsx(StatusBar, { columns: cols, speedKnown: speedKnown, ...feedbackProjection, interruptPhase: interruptGesture.current.phase, pendingSteering: state.pendingSteering, runPhase: state.runPhase, activeTool: state.activeTool, runOutcome: state.runOutcome, reducedMotion: reducedMotion, ...(sessionId ? { sessionId } : {}), waitingForConfirmation: !!humanRequest || !!confirmState, stopping: interruptGesture.current.phase === 'stopping', interruptHint: interruptGesture.current.phase === 'stopping'
-                ? 'Esc force-stop' : 'Esc x2 interrupt', model: cfg.model, provider: cfg.provider, usageTotal: state.usageTotal, 
-            // ONE OBJECT INSTEAD OF FOUR PARALLEL PROPS (§4.3). The four were a
-            // projection of "many sources of truth" into the props layer, and a
-            // caller could update three of them; a single reading cannot be
-            // partially stale. The window and its `known` flag now travel INSIDE
-            // it, resolved by the meter - which is what makes the user's
-            // `contextWindow` override reach the bar.
-            context: state.context, 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' &&
-                            r.phase !== 'failed' && r.phase !== 'aborted').length,
-                        total: state.team.runs.length,
-                    },
-                }
-                : {}), ...(state.todos && !showRail
-                ? { todoActive: { done: state.todos.doneCount, total: state.todos.total } }
-                : {}), ...(liveServices > 0 ? { servicesActive: { live: liveServices } } : {}), ...(state.fast?.live ? { fastActive: { inFlight: state.fast.inFlight } } : {}), 
-            // Manual compaction starts before its next snapshot is published.
-            compactionActive: { inFlight: statusInput.compacting ?? false }, ...(controller.isCompactionEnabled()
-                ? {
-                    gaugeMarks: {
-                        warn: cfg.compaction.warnThreshold * 100,
-                        high: cfg.compaction.threshold * 100,
-                    },
-                }
-                : {}), ...(state.retry
-                ? {
-                    retryActive: {
-                        attempt: state.retry.attempt,
-                        max: state.retry.maxRetries,
-                        // Recomputed at RENDER from the absolute `resumeAt`, which is
-                        // what keeps the chip and the transcript card showing the same
-                        // number without either of them owning a second clock.
-                        secondsLeft: secondsLeft(state.retry.resumeAt, Date.now()),
-                    },
-                }
-                : {}) }) }));
+    const detailsNode = _jsx(BottomStatusRow, { plan: details, columns: viewCols, theme: theme });
+    const statusNode = (_jsx(StatusBar, { columns: viewCols, speedKnown: speedKnown, ...feedbackProjection, interruptPhase: interruptGesture.current.phase, pendingSteering: state.pendingSteering, runPhase: state.runPhase, activeTool: state.activeTool, runOutcome: state.runOutcome, reducedMotion: reducedMotion, ...(sessionId ? { sessionId } : {}), waitingForConfirmation: !!humanRequest || !!confirmState, stopping: interruptGesture.current.phase === 'stopping', interruptHint: interruptGesture.current.phase === 'stopping'
+            ? 'Esc force-stop' : 'Esc x2 interrupt', model: cfg.model, provider: cfg.provider, usageTotal: state.usageTotal, 
+        // ONE OBJECT INSTEAD OF FOUR PARALLEL PROPS (§4.3). The four were a
+        // projection of "many sources of truth" into the props layer, and a
+        // caller could update three of them; a single reading cannot be
+        // partially stale. The window and its `known` flag now travel INSIDE
+        // it, resolved by the meter - which is what makes the user's
+        // `contextWindow` override reach the bar.
+        context: state.context, 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' &&
+                        r.phase !== 'failed' && r.phase !== 'aborted').length,
+                    total: state.team.runs.length,
+                },
+            }
+            : {}), ...(state.todos && !showRail
+            ? { todoActive: { done: state.todos.doneCount, total: state.todos.total } }
+            : {}), ...(liveServices > 0 ? { servicesActive: { live: liveServices } } : {}), ...(state.fast?.live ? { fastActive: { inFlight: state.fast.inFlight } } : {}), 
+        // Manual compaction starts before its next snapshot is published.
+        compactionActive: { inFlight: statusInput.compacting ?? false }, ...(controller.isCompactionEnabled()
+            ? {
+                gaugeMarks: {
+                    warn: cfg.compaction.warnThreshold * 100,
+                    high: cfg.compaction.threshold * 100,
+                },
+            }
+            : {}), ...(state.retry
+            ? {
+                retryActive: {
+                    attempt: state.retry.attempt,
+                    max: state.retry.maxRetries,
+                    // Recomputed at RENDER from the absolute `resumeAt`, which is
+                    // what keeps the chip and the transcript card showing the same
+                    // number without either of them owning a second clock.
+                    secondsLeft: secondsLeft(state.retry.resumeAt, Date.now()),
+                },
+            }
+            : {}) }));
+    if (nativeBudget) {
+        return (_jsx(ScrollbackShell, { budget: nativeBudget, overlay: overlayNode, liveTailLines: scrollbackView.liveTailLines, composer: composer, status: statusNode, details: detailsNode, placeholder: _jsxs(Text, { wrap: "truncate", color: theme.noticeWarn, children: [glyphs.warn, " Terminal too small - needs at least 40 columns and 12 rows."] }), theme: theme }));
+    }
+    return (_jsx(AppShell, { inactive: tooSmall, placeholder: _jsxs(Text, { wrap: "truncate", color: theme.noticeWarn, children: [glyphs.warn, " Terminal too small - needs at least 40 columns and 12 rows."] }), rows: rows, cols: cols, header: header, viewport: viewport, viewportRows: frameBudget.viewportRows, composer: composer, composerSlotRows: frameBudget.composerSlotRows, statusRows: frameBudget.statusRows, details: detailsNode, status: statusNode }));
 }

package/dist/ui/ScrollbackShell.d.ts

@@ -0,0 +1,28 @@
+/**
+ * ScrollbackShell — the bounded LIVE REGION of native-scroll mode
+ * (tui-native-terminal-scroll §4.6).
+ *
+ * The full-screen `AppShell` fills the whole terminal; this shell is only as tall as
+ * `budget.liveRows` (the root box height IS that number: giving it the frame height
+ * would make the "small region" a whole screen again, and Ink would then repaint a
+ * screenful per frame). Everything settled has already been printed into the
+ * terminal's own scrollback above it.
+ *
+ * Top to bottom: [overlay | streaming preview] -> composer -> status (-> details).
+ */
+import React from 'react';
+import type { Theme } from './theme.js';
+import type { ScrollbackBudget } from './scrollback/budget.js';
+export interface ScrollbackShellProps {
+    budget: ScrollbackBudget;
+    /** Shown instead of the preview when an overlay is open. */
+    overlay: React.ReactNode | null;
+    /** Plain preview rows, bottom-aligned just above the composer. */
+    liveTailLines: readonly string[];
+    composer: React.ReactNode;
+    status: React.ReactNode;
+    details?: React.ReactNode;
+    placeholder: React.ReactNode;
+    theme: Theme;
+}
+export declare function ScrollbackShell({ budget, overlay, liveTailLines, composer, status, details, placeholder, theme, }: ScrollbackShellProps): React.ReactElement;

package/dist/ui/ScrollbackShell.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+export function ScrollbackShell({ budget, overlay, liveTailLines, composer, status, details, placeholder, theme, }) {
+    const width = budget.contentCols;
+    if (budget.inactive) {
+        return (_jsx(Box, { flexDirection: "column", height: budget.liveRows, width: width, overflow: "hidden", flexShrink: 0, children: budget.liveRows > 0 ? placeholder : null }));
+    }
+    const tail = liveTailLines.slice(-budget.liveTailRows);
+    return (_jsxs(Box, { flexDirection: "column", height: budget.liveRows, width: width, overflow: "hidden", flexShrink: 0, children: [budget.overlayRows > 0 && (_jsx(Box, { flexDirection: "column", height: budget.overlayRows, flexShrink: 0, overflow: "hidden", children: overlay })), budget.liveTailRows > 0 && (_jsx(Box, { flexDirection: "column", height: budget.liveTailRows, flexShrink: 0, justifyContent: "flex-end", overflow: "hidden", children: tail.map((line, index) => (_jsx(Text, { wrap: "truncate", color: theme.muted, children: line }, index))) })), _jsx(Box, { flexDirection: "column", height: budget.composerSlotRows, justifyContent: "flex-end", flexShrink: 0, overflow: "hidden", children: composer }), _jsx(Box, { height: budget.statusRows > 0 ? 1 : 0, flexShrink: 0, overflow: "hidden", children: status }), budget.statusRows === 2 && (_jsx(Box, { height: 1, flexShrink: 0, overflow: "hidden", children: details }))] }));
+}

package/dist/ui/frame-differ.d.ts

@@ -150,5 +150,17 @@ export interface FrameDiffer {
      * appears one frame later instead of never.
      */
     repaint(): string;
+    /**
+     * The stream was resized. Optional (tui-native-terminal-scroll §5.1): the
+     * full-screen differ does not implement it and is invalidated instead, which is
+     * its existing behaviour; the scrollback writer keeps its cache for a reflow
+     * estimate.
+     */
+    onResize?(): void;
+    /**
+     * An own write that moves neither a cell nor the cursor (OSC 52 copy). Optional
+     * for the same reason: absent, the write invalidates the cache as before.
+     */
+    cursorNeutralWrite?(): void;
 }
 export declare function createFrameDiffer(options: FrameDifferOptions): FrameDiffer;

package/dist/ui/overlays/HelpOverlay.d.ts

@@ -14,4 +14,4 @@ import React from 'react';
 import type { Theme } from '../theme.js';
 import type { TermCapabilities } from '../capabilities.js';
 /** Build the overlay's rows. Exported so `app.test.tsx` can count them. */
-export declare function helpRows(theme: Theme, caps: TermCapabilities): React.ReactElement[];
+export declare function helpRows(theme: Theme, caps: TermCapabilities, native?: boolean): React.ReactElement[];

package/dist/ui/overlays/HelpOverlay.js

@@ -2,7 +2,25 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Text } from 'ink';
 import { pickGlyphs } from '../glyphs.js';
 const KEY_PAD = 24;
-function keyRows(times) {
+/**
+ * Rows that only make sense when the APPLICATION scrolls and selects. In native
+ * scroll mode (tui-native-terminal-scroll §4.7) the terminal does both, so they are
+ * dropped and one honest row replaces them.
+ */
+const APP_SCROLL_ROWS = new Set([
+    'Shift+Up / Shift+Down', 'Wheel', 'Shift+Wheel', 'Drag right edge', '^N',
+    'Drag text (left button)', 'Ctrl+C (with a selection)',
+]);
+function keyRows(times, native = false) {
+    const all = allKeyRows(times);
+    if (!native)
+        return all;
+    return all
+        .filter(([key]) => !APP_SCROLL_ROWS.has(key))
+        .map(([key, description]) => key === 'PgUp / PgDn' ? [key, 'Page through an open overlay'] : [key, description])
+        .concat([['Scroll', 'Use your terminal (wheel, Shift+PgUp, scrollbar, search)']]);
+}
+function allKeyRows(times) {
     return [
         ['Enter', 'Submit (idle) / queue steering (running); re-pins to the newest output'],
         ['Alt+Enter / Shift+Enter', 'Newline when supported; the host may intercept either binding'],
@@ -133,13 +151,13 @@ const FAST_ROWS = [
     ['<fast_review>', 'An automated second opinion from the fast model - advice, not the user'],
 ];
 /** Build the overlay's rows. Exported so `app.test.tsx` can count them. */
-export function helpRows(theme, caps) {
+export function helpRows(theme, caps, native = false) {
     const glyphs = pickGlyphs(caps);
     const rows = [];
     const section = (title) => (_jsx(Text, { wrap: "truncate", color: theme.accent, bold: true, children: title }, `s-${title}`));
     const pair = (k, d) => (_jsxs(Text, { wrap: "truncate", children: [_jsx(Text, { color: theme.primary, children: k.padEnd(KEY_PAD) }), _jsx(Text, { color: theme.muted, children: d })] }, `r-${k}`));
     rows.push(section('Keybindings'));
-    for (const [k, d] of keyRows(glyphs.times))
+    for (const [k, d] of keyRows(glyphs.times, native))
         rows.push(pair(k, d));
     rows.push(section('Slash commands'));
     for (const [c, d] of COMMANDS)

package/dist/ui/screen.d.ts

@@ -71,6 +71,22 @@ export interface AltScreenOptions {
  * CI) — writing screen-control sequences into a redirected file corrupts it.
  */
 export declare function enterAltScreen(stdout: NodeJS.WriteStream | undefined, options?: AltScreenOptions): ScreenHandle;
+export interface NativeScreenOptions {
+    /** Same discipline as `AltScreenOptions.bracketedPaste`: a filter that consumes it exists. */
+    readonly bracketedPaste?: boolean;
+}
+/**
+ * Native-scroll mode's counterpart of `enterAltScreen` (tui-native-terminal-scroll
+ * §4.8 / D6): it deliberately does almost nothing. The main buffer stays in use so
+ * the conversation lands in the terminal's own scrollback; there is no alternate
+ * screen, no mouse reporting and no DEC 1007 save/restore.
+ *
+ * The only mode it touches is DEC 2004 (bracketed paste), which changes how input
+ * is encoded and has nothing to do with scrolling. Returns the SAME `ScreenHandle`
+ * shape, so the four idempotent restore paths in `cli.tsx` need not know which mode
+ * is running. A non-TTY stdout is a hard no-op, like `enterAltScreen`.
+ */
+export declare function enterNativeScreen(stdout: NodeJS.WriteStream | undefined, options?: NativeScreenOptions): ScreenHandle;
 /**
  * Replay the session summary into the normal buffer after `restore()`, so the
  * conversation does not evaporate along with the alternate screen.

package/dist/ui/screen.js

@@ -181,6 +181,38 @@ export function enterAltScreen(stdout, options = { mouse: false }) {
         setMouseCapture,
     };
 }
+/**
+ * Native-scroll mode's counterpart of `enterAltScreen` (tui-native-terminal-scroll
+ * §4.8 / D6): it deliberately does almost nothing. The main buffer stays in use so
+ * the conversation lands in the terminal's own scrollback; there is no alternate
+ * screen, no mouse reporting and no DEC 1007 save/restore.
+ *
+ * The only mode it touches is DEC 2004 (bracketed paste), which changes how input
+ * is encoded and has nothing to do with scrolling. Returns the SAME `ScreenHandle`
+ * shape, so the four idempotent restore paths in `cli.tsx` need not know which mode
+ * is running. A non-TTY stdout is a hard no-op, like `enterAltScreen`.
+ */
+export function enterNativeScreen(stdout, options = {}) {
+    if (!stdout || !stdout.isTTY || typeof stdout.write !== 'function')
+        return NOOP_HANDLE;
+    const bracketedPaste = options.bracketedPaste === true;
+    if (bracketedPaste)
+        safeWrite(stdout, ENABLE_BRACKETED_PASTE);
+    let restored = false;
+    return {
+        restore() {
+            if (restored)
+                return;
+            restored = true;
+            // 2004 is FORCED off rather than saved/restored, for the reason recorded at
+            // `DISABLE_BRACKETED_PASTE`. The cursor is shown again because Ink's
+            // log-update hides it and a signal kill never gives it back.
+            safeWrite(stdout, (bracketedPaste ? DISABLE_BRACKETED_PASTE : '') + SHOW_CURSOR);
+        },
+        // No mouse reporting in this mode: nothing to hand back or take again.
+        setMouseCapture() { },
+    };
+}
 /**
  * Replay the session summary into the normal buffer after `restore()`, so the
  * conversation does not evaporate along with the alternate screen.

package/dist/ui/scrollback/budget.d.ts

@@ -0,0 +1,43 @@
+/**
+ * Height budget of the native-scroll LIVE REGION (tui-native-terminal-scroll §4.6).
+ *
+ * I-S1 · `liveRows <= max(0, rows - 1)` for every input. Ink writes
+ * `clearTerminal` (which contains `ESC[3J`, erasing the user's scrollback) as soon
+ * as a frame is as tall as the terminal; a one-row margin is the only thing between
+ * a tidy region and data loss, so it is established by construction here and
+ * enumerated by a property test rather than trusted.
+ *
+ * The composer, popup and status rows come from the SAME `buildFrameBudget` the
+ * full-screen layout uses, so the two modes cannot disagree about how tall the
+ * editor is. What differs is the top: there is no header, so the row it would
+ * occupy joins the pool shared by the overlay and the streaming preview.
+ */
+import { type FrameBudgetInput } from '../layout/budget.js';
+export interface ScrollbackBudgetInput extends FrameBudgetInput {
+    overlayOpen: boolean;
+    /** Preview rows the content would like; the budget grants what fits. */
+    liveTailWanted: number;
+    /** The writer tripped its tall-frame guard: degrade to the placeholder until a resize. */
+    forceInactive?: boolean;
+}
+export interface ScrollbackBudget {
+    rows: number;
+    cols: number;
+    /** Width everything is rendered and printed at (`cols - 1`, D5). */
+    contentCols: number;
+    /** Terminal below the 40x12 floor: the region is a one-row placeholder. */
+    inactive: boolean;
+    statusRows: 0 | 1 | 2;
+    composerRows: number;
+    composerSlotRows: number;
+    composerCols: number;
+    popupRows: number;
+    popupMaxHeight: number;
+    overlayRows: number;
+    liveTailRows: number;
+    /** Rows above the composer: overlay or preview. */
+    topRows: number;
+    /** Total live-region height; what Ink renders. */
+    liveRows: number;
+}
+export declare function buildScrollbackBudget(input: ScrollbackBudgetInput): ScrollbackBudget;

package/dist/ui/scrollback/budget.js

@@ -0,0 +1,44 @@
+/**
+ * Height budget of the native-scroll LIVE REGION (tui-native-terminal-scroll §4.6).
+ *
+ * I-S1 · `liveRows <= max(0, rows - 1)` for every input. Ink writes
+ * `clearTerminal` (which contains `ESC[3J`, erasing the user's scrollback) as soon
+ * as a frame is as tall as the terminal; a one-row margin is the only thing between
+ * a tidy region and data loss, so it is established by construction here and
+ * enumerated by a property test rather than trusted.
+ *
+ * The composer, popup and status rows come from the SAME `buildFrameBudget` the
+ * full-screen layout uses, so the two modes cannot disagree about how tall the
+ * editor is. What differs is the top: there is no header, so the row it would
+ * occupy joins the pool shared by the overlay and the streaming preview.
+ */
+import { buildFrameBudget } from '../layout/budget.js';
+import { SCROLLBACK_LIMITS } from './limits.js';
+export function buildScrollbackBudget(input) {
+    const base = buildFrameBudget(input);
+    const contentCols = Math.max(1, base.cols - 1);
+    if (base.inactive || input.forceInactive === true) {
+        return {
+            rows: base.rows, cols: base.cols, contentCols, inactive: true, statusRows: 0,
+            composerRows: 0, composerSlotRows: 0, composerCols: base.composerCols, popupRows: 0,
+            popupMaxHeight: 0, overlayRows: 0, liveTailRows: 0, topRows: 0,
+            liveRows: Math.max(0, Math.min(1, base.rows - 1)),
+        };
+    }
+    // The full-screen frame spends one row on the header; here it joins the pool.
+    const remaining = Math.max(0, base.viewportRows + base.headerRows);
+    const overlayRows = input.overlayOpen ? remaining : 0;
+    const tailCap = Math.min(SCROLLBACK_LIMITS.maxLiveTailRows, Math.floor(base.rows * SCROLLBACK_LIMITS.liveTailRowShare));
+    const liveTailRows = input.overlayOpen
+        ? 0
+        : Math.max(0, Math.min(Math.floor(input.liveTailWanted), remaining, tailCap));
+    const topRows = overlayRows + liveTailRows;
+    const liveRows = topRows + base.composerSlotRows + base.statusRows;
+    return {
+        rows: base.rows, cols: base.cols, contentCols, inactive: false,
+        statusRows: base.statusRows, composerRows: base.composerRows,
+        composerSlotRows: base.composerSlotRows, composerCols: base.composerCols,
+        popupRows: base.popupRows, popupMaxHeight: base.popupMaxHeight, overlayRows,
+        liveTailRows, topRows, liveRows,
+    };
+}

package/dist/ui/scrollback/drain.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Static-row feed — the queue between the promotion pipeline (which decides an
+ * entry is final) and the scrollback writer (which prints it)
+ * (tui-native-terminal-scroll §4.3 "feed").
+ *
+ * FIFO, bounded. When the writer falls behind and the queue overflows, the OLDEST
+ * pending entries are folded into one ASCII marker and counted: a visible, counted
+ * omission, never a silent one (I-S2). Entries are taken as whole blocks and never
+ * split, so a batch boundary can never land inside one entry's rows.
+ */
+export interface EntryRef {
+    id: string;
+    kind: string;
+}
+export interface ScrollbackDrain {
+    enqueue(rows: readonly string[], meta: EntryRef): void;
+    takeAll(): readonly string[];
+    /** Whole entries only; always takes at least one when anything is pending. */
+    takeUpTo(maxRows: number): readonly string[];
+    /** Rows waiting, including a pending overflow marker. */
+    pending(): number;
+    /** Whole entries waiting (the overflow marker is not an entry). */
+    pendingEntries(): number;
+    /** Entries folded away by overflow, cumulative. */
+    elided(): number;
+    onEnqueue: (() => void) | null;
+    onDrained: (() => void) | null;
+}
+export declare function overflowMarker(count: number): string;
+export declare function createScrollbackDrain(options?: {
+    capacity?: number;
+}): ScrollbackDrain;