@iowarp/clio-coder 0.3.1 → 0.3.2

package/src/interactive/interactive-input-runtime.ts

@@ -1,6 +1,6 @@
 import { getTerminationCoordinator } from "../core/termination.js";
 import type { ClioKeybinding } from "../domains/config/keybindings.js";
-import { isKeyRelease } from "../engine/tui.js";
+import { isKeyRelease, type Keybinding } from "../engine/tui.js";
 import {
 	type ApplicationClock,
 	type ApplicationController,
@@ -12,6 +12,7 @@ import {
 } from "./application-controller.js";
 import { createLeaderKeyController, type LeaderTarget } from "./leader-key.js";
 import { type OverlayState, routeOverlayKey } from "./overlay-lifecycle.js";
+import type { RenderInputAction } from "./render-trace.js";
 
 export interface InteractiveInputKeyActionDeps {
 	matches: (data: string, id: ClioKeybinding) => boolean;
@@ -20,6 +21,8 @@ export interface InteractiveInputKeyActionDeps {
 	requestShutdown: () => void;
 	toggleStatus: () => void;
 	toggleDispatchBoard: () => void;
+	openTasks: () => void;
+	openDecisions: () => void;
 	backgroundDispatch: () => void;
 	openModelSelector: () => void;
 	openTree: () => void;
@@ -33,12 +36,13 @@ export interface InteractiveInputKeyActionDeps {
 	toggleAllThinkingExpansion: () => void;
 	openExternalEditor: () => void;
 	queueFollowUp: () => void;
+	interruptWithMessage: () => void;
 	restoreQueuedFollowUps: () => void;
 }
 
 export interface InteractiveInputRuntimeDeps {
 	keybindings: {
-		matches(data: string, id: ClioKeybinding): boolean;
+		matches(data: string, id: Keybinding): boolean;
 		leaderTargets(): ReadonlyArray<LeaderTarget>;
 	};
 	dispatchAction: (id: ClioKeybinding, deps: InteractiveInputKeyActionDeps) => boolean;
@@ -61,10 +65,14 @@ export interface InteractiveInputRuntimeDeps {
 		toggleDispatchBoardOverlay(): void;
 		openModelOverlayState(): void;
 		openTreeOverlayState(): void;
+		openTasksOverlayState(): void;
+		openDecisionsOverlayState(): void;
 	};
 	refreshFooter: () => void;
 	/** Armed/disarmed transitions of the Ctrl+G leader, for the footer indicator. */
 	onLeaderStateChange?: (pending: boolean) => void;
+	/** Armed/disarmed transitions of the Ctrl+C double tap, for the same indicator row. */
+	onShutdownArmedChange?: (armed: boolean) => void;
 	dispatchBoard: {
 		selectPrevious(): void;
 		selectNext(): void;
@@ -78,6 +86,7 @@ export interface InteractiveInputRuntimeDeps {
 	editorSubmit: {
 		openExternalEditorForInput(): void;
 		queueFollowUpFromEditor(): void;
+		interruptFromEditor(): void;
 		restoreQueuedFollowUpsToEditor(): void;
 	};
 	requestRender: () => void;
@@ -106,12 +115,14 @@ export interface InteractiveInputRuntimeDeps {
 		disposeSubscriptions(): void;
 	};
 	stopUi: () => void;
+	beforeStopUi?: () => Promise<void>;
 	cancelParkedCalls: (reason: string) => void;
 	onShutdown: () => Promise<void>;
 	reportShutdownFailure?: (step: string, error: unknown) => void;
 	/** Defaults to the process termination coordinator's drain phase. */
-	registerTerminalTeardown?: (teardown: () => void) => void;
+	registerTerminalTeardown?: (teardown: () => void | Promise<void>) => void;
 	registerInputListener: (listener: (data: string) => ApplicationInputResult) => void;
+	onInputIngress?: (action: RenderInputAction, data: string) => void;
 	intervalsToClear?: ReadonlyArray<ApplicationIntervalHandle>;
 	clock?: ApplicationClock;
 	signals?: ApplicationSignalCoordinator;
@@ -133,6 +144,8 @@ export function createInteractiveInputRuntime(deps: InteractiveInputRuntimeDeps)
 		requestShutdown: () => void controller.shutdown(),
 		toggleStatus: deps.overlay.toggleFooterDashboardState,
 		toggleDispatchBoard: deps.overlay.toggleDispatchBoardOverlay,
+		openTasks: deps.overlay.openTasksOverlayState,
+		openDecisions: deps.overlay.openDecisionsOverlayState,
 		backgroundDispatch: deps.actions.backgroundActiveDispatch,
 		openModelSelector: deps.overlay.openModelOverlayState,
 		openTree: deps.overlay.openTreeOverlayState,
@@ -161,6 +174,7 @@ export function createInteractiveInputRuntime(deps: InteractiveInputRuntimeDeps)
 		},
 		openExternalEditor: deps.editorSubmit.openExternalEditorForInput,
 		queueFollowUp: deps.editorSubmit.queueFollowUpFromEditor,
+		interruptWithMessage: deps.editorSubmit.interruptFromEditor,
 		restoreQueuedFollowUps: deps.editorSubmit.restoreQueuedFollowUpsToEditor,
 	});
 	const leaderKeys = createLeaderKeyController({
@@ -212,6 +226,9 @@ export function createInteractiveInputRuntime(deps: InteractiveInputRuntimeDeps)
 				},
 				(input, id) => deps.keybindings.matches(input, id),
 			),
+		matchesEditorHistory: (data) =>
+			deps.keybindings.matches(data, "tui.editor.historyPrevious") ||
+			deps.keybindings.matches(data, "tui.editor.historyNext"),
 		matchesAction: (data, id) => deps.keybindings.matches(data, id),
 		dispatchAction: (id) => deps.dispatchAction(id, keyActionDeps()),
 		cancelActiveEditorBash: deps.cancelActiveEditorBash,
@@ -220,6 +237,13 @@ export function createInteractiveInputRuntime(deps: InteractiveInputRuntimeDeps)
 		getEditorText: () => deps.editor.getText(),
 		clearEditor: () => deps.editor.setText(""),
 		requestRender: deps.requestRender,
+		// The footer pulls the flag when it refreshes, so the refresh has to land
+		// before the controller asks for the frame. The controller owns the render
+		// request on this path, which is why this hook does not make one.
+		onShutdownArmedChange: (armed) => {
+			deps.onShutdownArmedChange?.(armed);
+			deps.refreshFooter();
+		},
 		closeOverlay: () => deps.overlay.closeOverlay(),
 		listNotifications: () => deps.notifications.list(),
 		dismissNotification: (id) => deps.notifications.dismiss(id),
@@ -242,6 +266,7 @@ export function createInteractiveInputRuntime(deps: InteractiveInputRuntimeDeps)
 			() => deps.shutdown.disposeSubscriptions(),
 		],
 		stopUi: deps.stopUi,
+		...(deps.beforeStopUi ? { beforeStopUi: deps.beforeStopUi } : {}),
 		cancelParkedCalls: deps.cancelParkedCalls,
 		onShutdown: deps.onShutdown,
 		registerTerminalTeardown:
@@ -256,6 +281,27 @@ export function createInteractiveInputRuntime(deps: InteractiveInputRuntimeDeps)
 				);
 			}),
 	});
-	deps.registerInputListener(controller.handleInput);
+	deps.registerInputListener((data) => {
+		deps.onInputIngress?.(classifyInputAction(data, deps), data);
+		return controller.handleInput(data);
+	});
 	return controller;
 }
+
+function classifyInputAction(data: string, deps: InteractiveInputRuntimeDeps): RenderInputAction {
+	if (data.length === 0 || isKeyRelease(data)) return "no-visual-change";
+	if (deps.keybindings.matches(data, "tui.input.submit")) return "submit";
+	const sgrMousePrefix = `${String.fromCharCode(27)}[<`;
+	if (
+		data.startsWith(`${sgrMousePrefix}64;`) ||
+		data.startsWith(`${sgrMousePrefix}65;`) ||
+		deps.keybindings.matches(data, "tui.altScreen.pageUp") ||
+		deps.keybindings.matches(data, "tui.altScreen.pageDown") ||
+		deps.keybindings.matches(data, "tui.editor.pageUp") ||
+		deps.keybindings.matches(data, "tui.editor.pageDown")
+	) {
+		return "scroll";
+	}
+	if (deps.overlay.getState() !== "closed") return "overlay";
+	return "editor";
+}

package/src/interactive/interactive-presentation.ts

@@ -1,18 +1,24 @@
+import { performance } from "node:perf_hooks";
 import type { ClioSettings } from "../core/config.js";
 import type { SafeEventBus } from "../core/event-bus.js";
 import type { ContextState } from "../domains/context/index.js";
 import type { DispatchContract } from "../domains/dispatch/contract.js";
 import type { TaskMemoryOperatorStatus } from "../domains/memory/index.js";
-import type { ObservabilityContract, ObservabilitySnapshot } from "../domains/observability/index.js";
+import type {
+	ObservabilityContract,
+	ObservabilitySnapshot,
+	TokenThroughputSnapshot,
+} from "../domains/observability/index.js";
 import { type ProvidersContract, resolveModelRuntimeCapabilitiesForProviders } from "../domains/providers/index.js";
 import type { ResourcesContract } from "../domains/resources/index.js";
 import { getMarketplaceSkills } from "../domains/resources/skills/marketplace.js";
+import { ceilChars, contentChars } from "../domains/session/context-accounting.js";
 import type { SessionContract, TaskBoardSnapshot } from "../domains/session/index.js";
 import type { Component, TUI } from "../engine/tui.js";
-import type { ChatLoop } from "./chat-loop.js";
+import type { ChatLoop, ChatLoopEvent } from "./chat-loop.js";
 import { type ChatPanel, createChatPanel } from "./chat-panel.js";
 import { type CoalescingChatRenderer, createCoalescingChatRenderer } from "./chat-renderer.js";
-import { ClioEditor } from "./clio-editor.js";
+import { ClioEditor, type EditorChrome } from "./clio-editor.js";
 import { createCommandOutputRunIo } from "./command-output.js";
 import { createContextActivityStore } from "./context-activity.js";
 import { createDispatchBoardStore, createDispatchBoardView, type DispatchBoardView } from "./dispatch-board.js";
@@ -29,6 +35,8 @@ import type { SessionTranscript } from "./session-transcript.js";
 import { createSlashCommandAutocompleteProvider } from "./slash-autocomplete.js";
 import { parseSlashCommand, type RunIo } from "./slash-commands.js";
 import { createStatusController, type StatusController, type TurnSummary } from "./status/index.js";
+import type { SmoothStreamingMode } from "./stream-pacer.js";
+import { processAutoPacingAllowed, resolveSmoothStreamingMode } from "./stream-pacing-policy.js";
 import { formatTargetLabel } from "./theme/index.js";
 import { createWelcomeDashboard, type WelcomeDashboardComponent } from "./welcome-dashboard.js";
 import type { WorkspaceFacts } from "./workspace-facts.js";
@@ -69,7 +77,13 @@ export interface InteractivePresentationDeps {
 	sessionTranscript: Pick<SessionTranscript, "liveSessionTurns">;
 	tui: TUI;
 	terminal: { readonly columns: number };
-	mount: (root: Component, editor: Component) => void;
+	mount?: (root: Component, editor: Component) => void;
+	/** Stage 0's exact editor; when present no replacement editor is constructed. */
+	editor?: ClioEditor;
+	/** Stage 0's already-installed keybinding manager and pi-tui global. */
+	keybindings?: ClioKeybindingManager;
+	/** Pending boot submissions remain visible until serial admission removes them. */
+	bootPending?: Component;
 	getSettings?: () => Readonly<ClioSettings>;
 	resources?: Pick<ResourcesContract, "skills">;
 	session?: Pick<SessionContract, "current">;
@@ -80,9 +94,19 @@ export interface InteractivePresentationDeps {
 	getContextState?: (cwd?: string) => ContextState;
 	/** Whether the Ctrl+G leader is armed and waiting for its next key. */
 	getLeaderArmed?: () => boolean;
+	/** Whether a Ctrl+C armed the double tap and its window is still open. */
+	getShutdownArmed?: () => boolean;
 	getCwd?: () => string;
+	resolveVisibleEventSequence?: (event: ChatLoopEvent) => number | null;
+	resolveStreamIngress?: (
+		event: ChatLoopEvent,
+	) => { sequence: number; generation: string | number; ingressAt: number } | null;
+	commitFrame?: (reason?: string) => Promise<unknown>;
+	hasObservedBackpressure?: () => boolean;
+	onSmoothStreamingMode?: (mode: SmoothStreamingMode, pacingActive: boolean) => void;
 	scheduleInterval?: (callback: () => void, intervalMs: number) => PresentationTickerHandle;
 	clearScheduledInterval?: (handle: PresentationTickerHandle) => void;
+	now?: () => number;
 	factories?: Partial<InteractivePresentationFactories>;
 }
 
@@ -107,11 +131,14 @@ export interface InteractivePresentation {
 	announceTaskMemorySeedOffer(): void;
 	collapseWelcomeDashboard(): void;
 	editor: ClioEditor;
+	editorChrome: EditorChrome;
 	dispatchBoard: DispatchBoardView;
 	chatRenderer: CoalescingChatRenderer;
 	io: RunIo;
 	root: Component;
 	getObservabilitySnapshot(): ObservabilitySnapshot;
+	/** Fold one raw chat event into the ephemeral throughput shown only while this turn is active. */
+	recordChatEvent(event: ChatLoopEvent): void;
 	recordToolStart(toolCallId: string, toolName: string): void;
 	recordToolEnd(result: PresentationToolEnd): void;
 	setLastTurnSummary(summary: TurnSummary | null): void;
@@ -175,9 +202,10 @@ function willEnterSteerActiveWork(deps: InteractivePresentationDeps, text: strin
 export function createInteractivePresentation(deps: InteractivePresentationDeps): InteractivePresentation {
 	const factories = { ...DEFAULT_FACTORIES, ...deps.factories };
 	const getCwd = deps.getCwd ?? (() => process.cwd());
+	const now = deps.now ?? performance.now.bind(performance);
 	const requestRender = (): void => deps.tui.requestRender();
 	const settings = deps.getSettings?.() ?? ({ keybindings: {} } as ClioSettings);
-	const keybindings = factories.createKeybindings(settings);
+	const keybindings = deps.keybindings ?? factories.createKeybindings(settings);
 	const { getExtensionStats, getLiveWorkspaceSnapshot, getWorkspaceSnapshot, refreshLiveWorkspaceGit } =
 		deps.workspaceFacts;
 
@@ -223,6 +251,69 @@ export function createInteractivePresentation(deps: InteractivePresentationDeps)
 	let footerToolTruncatedResults = 0;
 	let lastTurnSummary: TurnSummary | null = null;
 	let observabilitySnapshot = deps.observability.snapshot();
+	let liveThroughput: {
+		startedAt: number;
+		firstDeltaAt: number | null;
+		settledOutputTokens: number;
+		partialOutputTokens: number;
+	} | null = null;
+	const recordChatEvent = (event: ChatLoopEvent): void => {
+		if (event.type === "agent_start") {
+			liveThroughput = {
+				startedAt: now(),
+				firstDeltaAt: null,
+				settledOutputTokens: 0,
+				partialOutputTokens: 0,
+			};
+			return;
+		}
+		if (event.type === "agent_end") {
+			liveThroughput = null;
+			return;
+		}
+		if (!liveThroughput) return;
+		if (event.type === "message_start" && event.message?.role === "assistant") {
+			liveThroughput.partialOutputTokens = 0;
+			return;
+		}
+		if (event.type === "message_update") {
+			const update = event.assistantMessageEvent as { type?: unknown; partial?: { content?: unknown; payload?: unknown } };
+			if (
+				update.type !== "text_delta" &&
+				update.type !== "thinking_delta" &&
+				update.type !== "toolcall_start" &&
+				update.type !== "toolcall_delta"
+			) {
+				return;
+			}
+			liveThroughput.firstDeltaAt ??= now();
+			liveThroughput.partialOutputTokens = ceilChars(contentChars(update.partial?.payload ?? update.partial?.content));
+			return;
+		}
+		if (event.type === "message_end" && event.message?.role === "assistant") {
+			const output = (event.message as { usage?: { output?: unknown } }).usage?.output;
+			const reported = typeof output === "number" && Number.isFinite(output) && output > 0 ? output : null;
+			liveThroughput.settledOutputTokens += reported ?? liveThroughput.partialOutputTokens;
+			liveThroughput.partialOutputTokens = 0;
+		}
+	};
+	const currentLiveThroughput = (): TokenThroughputSnapshot | null => {
+		if (!liveThroughput || liveThroughput.firstDeltaAt === null) return null;
+		const outputTokens = liveThroughput.settledOutputTokens + liveThroughput.partialOutputTokens;
+		if (outputTokens <= 0) return null;
+		const at = now();
+		const durationMs = Math.max(1, at - liveThroughput.firstDeltaAt);
+		const settings = deps.getSettings?.();
+		return {
+			tokensPerSecond: outputTokens / (durationMs / 1000),
+			outputTokens,
+			durationMs,
+			ttftMs: Math.max(0, liveThroughput.firstDeltaAt - liveThroughput.startedAt),
+			providerId: settings?.orchestrator?.target ?? "",
+			modelId: settings?.orchestrator?.model ?? "",
+			recordedAt: Date.now(),
+		};
+	};
 	let footer: FooterDashboardPanel;
 	const notifications = factories.createNotificationCenter({
 		onChange: () => {
@@ -256,7 +347,8 @@ export function createInteractivePresentation(deps: InteractivePresentationDeps)
 		getAgentStatus: () => statusController.current(),
 		getTerminalColumns: () => deps.terminal.columns,
 		getSessionTokens: () => observabilitySnapshot.session.tokens,
-		getTokenThroughput: () => observabilitySnapshot.session.latestThroughput,
+		getTokenThroughput: () =>
+			liveThroughput === null ? observabilitySnapshot.session.latestThroughput : currentLiveThroughput(),
 		getSessionCost: () => observabilitySnapshot.session.cost,
 		getContextUsage: () => deps.chat.contextUsage(),
 		getContextLedger: () => deps.chat.contextLedger(),
@@ -265,6 +357,7 @@ export function createInteractivePresentation(deps: InteractivePresentationDeps)
 		...(deps.getTaskMemoryStatus ? { getTaskMemoryStatus: deps.getTaskMemoryStatus } : {}),
 		getContextActivity: () => contextActivityStore.current(),
 		...(deps.getLeaderArmed ? { getLeaderArmed: deps.getLeaderArmed } : {}),
+		...(deps.getShutdownArmed ? { getShutdownArmed: deps.getShutdownArmed } : {}),
 		getToolCounts: () => ({
 			tools: Object.fromEntries(footerToolCounts),
 			errors: footerToolErrors,
@@ -295,7 +388,7 @@ export function createInteractivePresentation(deps: InteractivePresentationDeps)
 		requestRender();
 	});
 
-	const editor = factories.createEditor(deps.tui, {
+	const editorChrome: EditorChrome = {
 		getModelLabel: () => {
 			const current = deps.getSettings?.();
 			// The rail is the narrowest of the three, so it drops the spaces.
@@ -318,7 +411,8 @@ export function createInteractivePresentation(deps: InteractivePresentationDeps)
 		willEnterSteer: (text) => willEnterSteerActiveWork(deps, text),
 		getSubmitKeyLabel: () => formatKeyLabel(keybindings.getKeys("tui.input.submit")[0], "Enter"),
 		getNewlineKeyLabel: () => formatKeyLabel(keybindings.getKeys("tui.input.newLine")[0], "Shift+Enter"),
-	});
+	};
+	const editor = deps.editor ?? factories.createEditor(deps.tui, editorChrome);
 	editor.focused = true;
 	const autocomplete: AutocompleteProvider = factories.createAutocomplete({
 		listSkills: () => ({
@@ -335,20 +429,55 @@ export function createInteractivePresentation(deps: InteractivePresentationDeps)
 	const chatRenderer = factories.createChatRenderer({
 		chatPanel,
 		requestRender,
-		...(renderTrace ? { onDelta: () => renderTrace.recordDelta() } : {}),
+		...(deps.resolveStreamIngress && deps.getSettings
+			? {
+					streamIngress: deps.resolveStreamIngress,
+					getSmoothStreamingMode: () => {
+						const mode = resolveSmoothStreamingMode(deps.getSettings?.().terminal.smoothStreaming ?? "off");
+						const autoAllowed = processAutoPacingAllowed(deps.hasObservedBackpressure?.() ?? false);
+						deps.onSmoothStreamingMode?.(mode, mode === "on" || (mode === "auto" && autoAllowed));
+						return mode;
+					},
+					isAutoPacingAllowed: () => processAutoPacingAllowed(deps.hasObservedBackpressure?.() ?? false),
+					...(deps.commitFrame ? { commitFrame: deps.commitFrame } : {}),
+				}
+			: {}),
+		...(renderTrace
+			? {
+					visibleEventSequence: (event) => deps.resolveVisibleEventSequence?.(event) ?? null,
+					onQueue: (eventSeq, action) => renderTrace.recordQueue(eventSeq, action),
+					onPanelApplied: (eventSeq) => renderTrace.recordPanelApplied(eventSeq),
+				}
+			: {}),
 	});
 	const io = factories.createIo({
-		appendReplayBlock: (renderBlock) => chatPanel.appendReplayBlock(renderBlock),
-		requestRender,
-	});
-	const root = factories.buildLayout({
-		banner,
-		chat: chatPanel,
-		pending: followUpQueuePanel,
-		editor,
-		footer: footer.view,
+		appendReplayBlock: (renderBlock) =>
+			chatRenderer.mutate(() => chatPanel.appendReplayBlock(renderBlock), "command-output"),
+		requestRender: () => {},
 	});
-	deps.mount(root, editor);
+	const pending: Component = deps.bootPending
+		? {
+				render: (width) => [...(deps.bootPending?.render(width) ?? []), ...followUpQueuePanel.render(width)],
+				invalidate: () => {
+					deps.bootPending?.invalidate();
+					followUpQueuePanel.invalidate();
+				},
+			}
+		: followUpQueuePanel;
+	const root = factories.buildLayout(
+		{
+			banner,
+			chat: chatPanel,
+			pending,
+			editor,
+			footer: footer.view,
+		},
+		{
+			mode: settings.terminal?.tuiMode ?? "regular",
+			fullscreenScrollbar: settings.terminal?.fullscreenScrollbar ?? "auto",
+		},
+	);
+	deps.mount?.(root, editor);
 
 	const scheduleInterval = deps.scheduleInterval ?? ((callback, intervalMs) => setInterval(callback, intervalMs));
 	const clearScheduledInterval =
@@ -414,11 +543,13 @@ export function createInteractivePresentation(deps: InteractivePresentationDeps)
 			if (banner.collapseToSessionHeader()) requestRender();
 		},
 		editor,
+		editorChrome,
 		dispatchBoard,
 		chatRenderer,
 		io,
 		root,
 		getObservabilitySnapshot: () => observabilitySnapshot,
+		recordChatEvent,
 		recordToolStart: (toolCallId, toolName) => {
 			footerActiveTools.add(toolCallId);
 			footerToolCounts.set(toolName, (footerToolCounts.get(toolName) ?? 0) + 1);
@@ -438,6 +569,7 @@ export function createInteractivePresentation(deps: InteractivePresentationDeps)
 			footerToolErrors = 0;
 			footerToolTruncatedResults = 0;
 			lastTurnSummary = null;
+			liveThroughput = null;
 			statusController.reset();
 		},
 		stopTickers,