@oh-my-pi/pi-coding-agent 15.11.4 → 15.11.7

package/src/modes/controllers/selector-controller.ts

@@ -27,8 +27,14 @@ import {
 	theme,
 } from "../../modes/theme/theme";
 import type { InteractiveModeContext } from "../../modes/types";
+import type { ResetCreditRedeemOutcome } from "../../session/auth-storage";
 import { type SessionInfo, SessionManager } from "../../session/session-manager";
 import { FileSessionStorage } from "../../session/session-storage";
+import {
+	describeRedeemOutcome,
+	type ResetUsageAccount,
+	toResetUsageAccounts,
+} from "../../slash-commands/helpers/reset-usage";
 import { AUTO_THINKING, type ConfiguredThinkingLevel } from "../../thinking";
 import {
 	isImageProviderPreference,
@@ -48,6 +54,7 @@ import { HistorySearchComponent } from "../components/history-search";
 import { ModelSelectorComponent } from "../components/model-selector";
 import { OAuthSelectorComponent } from "../components/oauth-selector";
 import { PluginSelectorComponent } from "../components/plugin-selector";
+import { ResetUsageSelectorComponent } from "../components/reset-usage-selector";
 import { SessionSelectorComponent } from "../components/session-selector";
 import { SettingsSelectorComponent } from "../components/settings-selector";
 import { ToolExecutionComponent } from "../components/tool-execution";
@@ -107,6 +114,9 @@ export class SelectorController {
 					thinkingLevel: this.ctx.session.thinkingLevel,
 					availableThemes,
 					cwd: getProjectDir(),
+					model: this.ctx.session.model,
+					imageBudget: this.ctx.ui.imageBudget,
+					requestRender: () => this.ctx.ui.requestRender(),
 				},
 				{
 					onChange: (id, value) => this.handleSettingChange(id, value),
@@ -306,10 +316,9 @@ export class SelectorController {
 				for (const child of this.ctx.chatContainer.children) {
 					if (child instanceof AssistantMessageComponent) {
 						child.setHideThinkingBlock(value as boolean);
+						child.invalidate();
 					}
 				}
-				this.ctx.chatContainer.clear();
-				this.ctx.rebuildChatFromMessages();
 				break;
 			case "theme": {
 				setTheme(value as string, true).then(result => {
@@ -1091,6 +1100,67 @@ export class SelectorController {
 		});
 	}
 
+	async showResetUsageSelector(): Promise<void> {
+		const session = this.ctx.session;
+		this.ctx.showStatus("Checking saved rate-limit resets…", { dim: true });
+		let statuses: Awaited<ReturnType<typeof session.listResetCredits>>;
+		try {
+			statuses = await session.listResetCredits();
+		} catch (error) {
+			this.ctx.showError(`Could not load saved resets: ${error instanceof Error ? error.message : String(error)}`);
+			return;
+		}
+		const accounts = toResetUsageAccounts(statuses);
+		if (accounts.length === 0) {
+			this.ctx.showStatus("No Codex accounts found. Use /login to add one.");
+			return;
+		}
+		if (!accounts.some(account => account.availableCount > 0)) {
+			this.ctx.showStatus(
+				accounts.some(account => account.error)
+					? "No saved resets available — some accounts couldn't be reached (try /login)."
+					: "No saved rate-limit resets available to spend right now.",
+			);
+			return;
+		}
+		this.showSelector(done => {
+			const selector = new ResetUsageSelectorComponent(
+				accounts,
+				account => {
+					done();
+					void this.#redeemReset(account);
+				},
+				() => {
+					done();
+					this.ctx.ui.requestRender();
+				},
+			);
+			return { component: selector, focus: selector };
+		});
+	}
+
+	async #redeemReset(account: ResetUsageAccount): Promise<void> {
+		this.ctx.showStatus(`Spending 1 saved reset for ${account.label}…`, { dim: true });
+		let outcome: ResetCreditRedeemOutcome;
+		try {
+			outcome = await this.ctx.session.redeemResetCredit(account.target);
+		} catch (error) {
+			this.ctx.showError(
+				`Reset failed for ${account.label}: ${error instanceof Error ? error.message : String(error)}`,
+			);
+			return;
+		}
+		const message = describeRedeemOutcome(outcome, account.label);
+		if (outcome.ok) {
+			this.ctx.showStatus(message);
+			// Refresh the status-line usage so the freshly-reset window shows.
+			this.ctx.statusLine.invalidate();
+			this.ctx.ui.requestRender();
+		} else {
+			this.ctx.showWarning(message);
+		}
+	}
+
 	async showDebugSelector(): Promise<void> {
 		const { DebugSelectorComponent } = await import("../../debug");
 		this.showSelector(done => {

package/src/modes/interactive-mode.ts

@@ -86,8 +86,10 @@ import { BUILTIN_SLASH_COMMAND_RESERVED_NAMES } from "../slash-commands/builtin-
 import { formatDuration } from "../slash-commands/helpers/format";
 import { STTController, type SttState } from "../stt";
 import { discoverTitleSystemPromptFile, resolvePromptInput } from "../system-prompt";
+import { formatTaskId } from "../task/render";
 import type { LspStartupServerInfo } from "../tools";
 import { normalizeLocalScheme } from "../tools/path-utils";
+import { replaceTabs, TRUNCATE_LENGTHS, truncateToWidth } from "../tools/render-utils";
 import { setAutoQaConsentHandler } from "../tools/report-tool-issue";
 import { type ResolveToolDetails, runResolveInvocation } from "../tools/resolve";
 import { formatPhaseDisplayName, selectStickyTodoWindow, todoMatchesAnyDescription } from "../tools/todo";
@@ -132,6 +134,7 @@ import {
 	parseLoopLimitArgs,
 } from "./loop-limit";
 import { OAuthManualInputManager } from "./oauth-manual-input";
+import type { ObservableSession } from "./session-observer-registry";
 import { SessionObserverRegistry } from "./session-observer-registry";
 import { runProviderSetupWizard } from "./setup-wizard/lazy";
 import { interruptHint } from "./shared";
@@ -277,6 +280,41 @@ class StatusContainer extends Container implements NativeScrollbackLiveRegion {
 	}
 }
 
+/**
+ * Build the anchored subagent HUD block: a bold accent "Subagents" header plus
+ * one hooked row per running agent in the same `Id: description` shape the
+ * inline task rows use (muted task preview when no description was given).
+ * Returns an empty array when nothing is running so the container can clear.
+ */
+export function renderSubagentHudLines(sessions: ObservableSession[], columns: number): string[] {
+	const running = sessions.filter(session => session.kind === "subagent" && session.status === "active");
+	if (running.length === 0) return [];
+
+	const indent = "  ";
+	const hook = theme.tree.hook;
+	const dot = theme.styledSymbol("status.done", "accent");
+	const lines = ["", indent + theme.bold(theme.fg("accent", "Subagents"))];
+	running.forEach((session, index) => {
+		const prefix = `${indent}${index === 0 ? hook : " "} `;
+		const displayId = formatTaskId(session.id);
+		let line = `${prefix}${dot} ${theme.fg("accent", theme.bold(displayId))}`;
+		const description = session.description?.trim() || session.progress?.description?.trim();
+		if (description) {
+			const budget = Math.max(TRUNCATE_LENGTHS.SHORT, columns - visibleWidth(prefix) - visibleWidth(displayId) - 6);
+			line += `${theme.fg("accent", ":")} ${theme.fg("accent", truncateToWidth(replaceTabs(description), budget))}`;
+		} else {
+			// No spawn description: fall back to a muted task preview, same as
+			// the inline task rows when a row has no label.
+			const taskPreview = session.progress?.task?.trim();
+			if (taskPreview) {
+				line += ` ${theme.fg("muted", truncateToWidth(replaceTabs(taskPreview), TRUNCATE_LENGTHS.SHORT))}`;
+			}
+		}
+		lines.push(line);
+	});
+	return lines;
+}
+
 export class InteractiveMode implements InteractiveModeContext {
 	session: AgentSession;
 	sessionManager: SessionManager;
@@ -291,6 +329,7 @@ export class InteractiveMode implements InteractiveModeContext {
 	pendingMessagesContainer: Container;
 	statusContainer: Container;
 	todoContainer: Container;
+	subagentContainer: Container;
 	btwContainer: Container;
 	omfgContainer: Container;
 	errorBannerContainer: Container;
@@ -440,6 +479,7 @@ export class InteractiveMode implements InteractiveModeContext {
 		this.pendingMessagesContainer = new Container();
 		this.statusContainer = new StatusContainer();
 		this.todoContainer = new Container();
+		this.subagentContainer = new Container();
 		this.btwContainer = new Container();
 		this.omfgContainer = new Container();
 		this.errorBannerContainer = new Container();
@@ -606,6 +646,7 @@ export class InteractiveMode implements InteractiveModeContext {
 		this.ui.addChild(this.pendingMessagesContainer);
 		this.ui.addChild(this.statusContainer);
 		this.ui.addChild(this.todoContainer);
+		this.ui.addChild(this.subagentContainer);
 		this.ui.addChild(this.btwContainer);
 		this.ui.addChild(this.omfgContainer);
 		this.ui.addChild(this.errorBannerContainer);
@@ -632,6 +673,7 @@ export class InteractiveMode implements InteractiveModeContext {
 			this.#reconcileTodosWithSubagents();
 			this.#syncTodoAutoClearTimer();
 			this.#renderTodoList();
+			this.#renderSubagentList();
 			this.ui.requestRender();
 		});
 
@@ -1120,6 +1162,30 @@ export class InteractiveMode implements InteractiveModeContext {
 		// of restarting the visible conversation (the LLM context still resets).
 		const context = this.session.buildTranscriptSessionContext();
 		this.renderSessionContext(context);
+		// During the pre-streaming window — after `startPendingSubmission` has
+		// optimistically rendered the user's message but before the user
+		// `message_start` event lands it in `session` entries — any rebuild
+		// (e.g. Ctrl+T toggleThinkingBlockVisibility, theme selector) would
+		// otherwise erase the user's just-submitted message until the first
+		// assistant token arrived (#2372). Once `message_start` fires the
+		// signature is cleared by `EventController`, so this replay is a no-op
+		// post-streaming and cannot duplicate.
+		this.#replayOptimisticUserMessage();
+	}
+
+	#replayOptimisticUserMessage(): void {
+		if (!this.optimisticUserMessageSignature) return;
+		const submission = this.#pendingSubmittedInput;
+		if (!submission || submission.cancelled || submission.customType) return;
+		this.addMessageToChat(
+			{
+				role: "user",
+				content: [{ type: "text", text: submission.text }, ...(submission.images ?? [])],
+				attribution: "user",
+				timestamp: Date.now(),
+			},
+			{ imageLinks: submission.imageLinks },
+		);
 	}
 
 	#formatTodoLine(todo: TodoItem, prefix: string, matched: boolean): string {
@@ -1282,6 +1348,19 @@ export class InteractiveMode implements InteractiveModeContext {
 		this.todoContainer.addChild(new Text(lines.join("\n"), 1, 0));
 	}
 
+	/**
+	 * Anchored HUD of in-flight subagents, mirroring the Todos block above the
+	 * editor. Driven entirely by observer-registry change events, so rows appear
+	 * on spawn and the whole block clears itself once the last subagent leaves
+	 * the "active" state.
+	 */
+	#renderSubagentList(): void {
+		this.subagentContainer.clear();
+		const lines = renderSubagentHudLines(this.#observerRegistry.getSessions(), this.ui.terminal.columns);
+		if (lines.length === 0) return;
+		this.subagentContainer.addChild(new Text(lines.join("\n"), 1, 0));
+	}
+
 	async #loadTodoList(): Promise<void> {
 		this.todoPhases = this.session.getTodoPhases();
 		this.#syncTodoAutoClearTimer();
@@ -3235,6 +3314,10 @@ export class InteractiveMode implements InteractiveModeContext {
 		return this.#selectorController.showOAuthSelector(mode, providerId);
 	}
 
+	showResetUsageSelector(): Promise<void> {
+		return this.#selectorController.showResetUsageSelector();
+	}
+
 	showProviderSetup(): Promise<void> {
 		return runProviderSetupWizard(this);
 	}

package/src/modes/session-observer-registry.ts

@@ -10,6 +10,8 @@ export interface ObservableSession {
 	description?: string;
 	status: "active" | "completed" | "failed" | "aborted";
 	sessionFile?: string;
+	parentToolCallId?: string;
+	index?: number;
 	lastUpdate: number;
 	/** Latest progress snapshot from the subagent executor */
 	progress?: AgentProgress;
@@ -26,6 +28,9 @@ export class SessionObserverRegistry {
 	#sessions = new Map<string, ObservableSession>();
 	#listeners = new Set<() => void>();
 	#eventBusUnsubscribers: Array<() => void> = [];
+	#sortOrderById = new Map<string, number>();
+	#parentSortOrderById = new Map<string, number>();
+	#nextSortOrder = 0;
 
 	/** Add a change listener. Returns unsubscribe function. */
 	onChange(cb: () => void): () => void {
@@ -37,8 +42,34 @@ export class SessionObserverRegistry {
 		for (const cb of this.#listeners) cb();
 	}
 
+	#ensureSortOrder(id: string): number {
+		const existing = this.#sortOrderById.get(id);
+		if (existing !== undefined) return existing;
+		const order = this.#nextSortOrder++;
+		this.#sortOrderById.set(id, order);
+		return order;
+	}
+
+	#ensureParentSortOrder(parentToolCallId: string | undefined, order: number): void {
+		if (!parentToolCallId) return;
+		if (this.#parentSortOrderById.has(parentToolCallId)) return;
+		this.#parentSortOrderById.set(parentToolCallId, order);
+	}
+
+	#getStableOrder(session: ObservableSession): number {
+		return this.#sortOrderById.get(session.id) ?? Number.MAX_SAFE_INTEGER;
+	}
+
+	#getGroupOrder(session: ObservableSession): number {
+		const parentOrder = session.parentToolCallId
+			? this.#parentSortOrderById.get(session.parentToolCallId)
+			: undefined;
+		return parentOrder ?? this.#getStableOrder(session);
+	}
+
 	setMainSession(sessionFile?: string): void {
 		const existing = this.#sessions.get("main");
+		this.#ensureSortOrder("main");
 		this.#sessions.set("main", {
 			id: "main",
 			kind: "main",
@@ -53,9 +84,18 @@ export class SessionObserverRegistry {
 	getSessions(): ObservableSession[] {
 		const sessions = [...this.#sessions.values()];
 		sessions.sort((a, b) => {
-			if (a.kind === "main") return -1;
-			if (b.kind === "main") return 1;
-			return a.lastUpdate - b.lastUpdate;
+			if (a.kind === "main" && b.kind !== "main") return -1;
+			if (b.kind === "main" && a.kind !== "main") return 1;
+			if (a.kind === "main" || b.kind === "main") return 0;
+
+			const groupDiff = this.#getGroupOrder(a) - this.#getGroupOrder(b);
+			if (groupDiff !== 0) return groupDiff;
+
+			const aIndex = a.index ?? Number.MAX_SAFE_INTEGER;
+			const bIndex = b.index ?? Number.MAX_SAFE_INTEGER;
+			if (aIndex !== bIndex) return aIndex - bIndex;
+
+			return this.#getStableOrder(a) - this.#getStableOrder(b);
 		});
 		return sessions;
 	}
@@ -71,6 +111,9 @@ export class SessionObserverRegistry {
 	/** Clear all tracked sessions (e.g. on session switch). Keeps EventBus subscriptions and listeners. */
 	resetSessions(): void {
 		this.#sessions.clear();
+		this.#sortOrderById.clear();
+		this.#parentSortOrderById.clear();
+		this.#nextSortOrder = 0;
 		this.#notifyListeners();
 	}
 
@@ -78,6 +121,9 @@ export class SessionObserverRegistry {
 		for (const unsub of this.#eventBusUnsubscribers) unsub();
 		this.#eventBusUnsubscribers = [];
 		this.#sessions.clear();
+		this.#sortOrderById.clear();
+		this.#parentSortOrderById.clear();
+		this.#nextSortOrder = 0;
 		this.#listeners.clear();
 	}
 
@@ -92,10 +138,14 @@ export class SessionObserverRegistry {
 				const status = STATUS_MAP[payload.status];
 				if (!status) return;
 
+				const sortOrder = this.#ensureSortOrder(payload.id);
+				this.#ensureParentSortOrder(payload.parentToolCallId, sortOrder);
 				const existing = this.#sessions.get(payload.id);
 				if (existing) {
 					existing.status = status;
 					existing.lastUpdate = Date.now();
+					existing.index = payload.index;
+					existing.parentToolCallId = payload.parentToolCallId ?? existing.parentToolCallId;
 					if (payload.description) existing.description = payload.description;
 					if (payload.sessionFile) existing.sessionFile = payload.sessionFile;
 				} else {
@@ -107,6 +157,8 @@ export class SessionObserverRegistry {
 						description: payload.description,
 						status,
 						sessionFile: payload.sessionFile,
+						parentToolCallId: payload.parentToolCallId,
+						index: payload.index,
 						lastUpdate: Date.now(),
 					});
 				}
@@ -121,8 +173,12 @@ export class SessionObserverRegistry {
 				const id = progress.id;
 				const existing = this.#sessions.get(id);
 
+				const sortOrder = this.#ensureSortOrder(id);
+				this.#ensureParentSortOrder(payload.parentToolCallId, sortOrder);
 				if (existing) {
 					existing.lastUpdate = Date.now();
+					existing.index = payload.index;
+					existing.parentToolCallId = payload.parentToolCallId ?? existing.parentToolCallId;
 					existing.progress = progress;
 					if (progress.description) existing.description = progress.description;
 					if (payload.sessionFile) existing.sessionFile = payload.sessionFile;
@@ -135,6 +191,8 @@ export class SessionObserverRegistry {
 						description: progress.description,
 						status: "active",
 						sessionFile: payload.sessionFile,
+						parentToolCallId: payload.parentToolCallId,
+						index: payload.index,
 						lastUpdate: Date.now(),
 						progress,
 					});

package/src/modes/setup-wizard/index.ts

@@ -82,6 +82,7 @@ export async function runSetupWizard(
 		maxHeight: "100%",
 		anchor: "top-left",
 		margin: 0,
+		fullscreen: true,
 	});
 	try {
 		await component.run();

package/src/modes/setup-wizard/scenes/glyph.ts

@@ -1,4 +1,4 @@
-import { type SelectItem, SelectList } from "@oh-my-pi/pi-tui";
+import { type SelectItem, SelectList, type SgrMouseEvent } from "@oh-my-pi/pi-tui";
 import { getSelectListTheme, type SymbolPreset, setSymbolPreset, theme } from "../../theme/theme";
 import type { SetupScene, SetupSceneController, SetupSceneHost } from "./types";
 
@@ -29,6 +29,8 @@ class GlyphSceneController implements SetupSceneController {
 	#selectList: SelectList;
 	#previewRequest = 0;
 	#committing = false;
+	/** Render line where the select list begins. */
+	#listRowStart = 0;
 
 	constructor(private readonly host: SetupSceneHost) {
 		this.#selectList = new SelectList(GLYPH_ITEMS, GLYPH_ITEMS.length, getSelectListTheme());
@@ -60,12 +62,28 @@ class GlyphSceneController implements SetupSceneController {
 		this.#selectList.handleInput(data);
 	}
 
+	/** Wheel moves the highlight (live preview); hover lights the row under the pointer; click confirms it. */
+	routeMouse(event: SgrMouseEvent, line: number, _col: number): void {
+		if (this.#committing) return;
+		if (event.wheel !== null) {
+			this.#selectList.handleWheel(event.wheel);
+			return;
+		}
+		const index = this.#selectList.hitTest(line - this.#listRowStart);
+		if (event.motion) {
+			this.#selectList.setHoverIndex(index ?? null);
+			return;
+		}
+		if (event.leftClick && index !== undefined) {
+			this.#selectList.clickItem(index);
+		}
+	}
+
 	render(width: number): readonly string[] {
-		return [
-			theme.fg("muted", "If a row shows boxes, tofu, or misaligned icons, pick another."),
-			"",
-			...this.#selectList.render(width),
-		];
+		const lines = [theme.fg("muted", "If a row shows boxes, tofu, or misaligned icons, pick another."), ""];
+		this.#listRowStart = lines.length;
+		lines.push(...this.#selectList.render(width));
+		return lines;
 	}
 
 	async #commit(preset: SymbolPreset): Promise<void> {

package/src/modes/setup-wizard/scenes/providers.ts

@@ -1,4 +1,4 @@
-import { TabBar } from "@oh-my-pi/pi-tui";
+import { type SgrMouseEvent, TabBar } from "@oh-my-pi/pi-tui";
 import { getTabBarTheme } from "../../shared";
 import { SignInTab } from "./sign-in";
 import type { SetupScene, SetupSceneController, SetupSceneHost, SetupTab } from "./types";
@@ -16,6 +16,8 @@ class ProvidersSceneController implements SetupSceneController {
 
 	#tabs: SetupTab[];
 	#tabBar: TabBar;
+	/** Lines the tab bar occupied in the last render (body starts one blank line below). */
+	#tabRowCount = 1;
 
 	constructor(host: SetupSceneHost) {
 		this.#tabs = [new SignInTab(host), new WebSearchTab(host)];
@@ -52,8 +54,40 @@ class ProvidersSceneController implements SetupSceneController {
 		tab.handleInput(data);
 	}
 
+	/**
+	 * Hit-test mouse reports against the last render: rows inside the tab bar
+	 * hover/switch tabs (suppressed while the active panel is modal, matching
+	 * keyboard tab cycling); everything else forwards to the active panel at
+	 * panel-local coordinates. Wheel always goes to the panel so scrolling
+	 * works regardless of pointer position.
+	 */
+	routeMouse(event: SgrMouseEvent, line: number, col: number): void {
+		const tab = this.#activeTab();
+		if (event.wheel === null && line >= 0 && line < this.#tabRowCount) {
+			if (tab.modal) return;
+			const hit = this.#tabBar.tabAt(line, col);
+			if (event.motion) {
+				this.#tabBar.setHoverTab(hit && !hit.muted ? hit.id : null);
+			} else if (event.leftClick && hit) {
+				this.#tabBar.selectTab(hit.id);
+			}
+			return;
+		}
+		if (event.motion) this.#tabBar.setHoverTab(null);
+		const bodyLine = line - this.#tabRowCount - 1;
+		if (tab.routeMouse) {
+			tab.routeMouse(event, bodyLine, col);
+			return;
+		}
+		if (event.wheel !== null && !tab.modal) {
+			tab.handleInput(event.wheel === -1 ? "\x1b[A" : "\x1b[B");
+		}
+	}
+
 	render(width: number): readonly string[] {
-		return [...this.#tabBar.render(width), "", ...this.#activeTab().render(width)];
+		const tabLines = this.#tabBar.render(width);
+		this.#tabRowCount = tabLines.length;
+		return [...tabLines, "", ...this.#activeTab().render(width)];
 	}
 
 	dispose(): void {

package/src/modes/setup-wizard/scenes/sign-in.ts

@@ -1,7 +1,7 @@
 import type { AuthStorage } from "@oh-my-pi/pi-ai";
 import { PASTE_CODE_LOGIN_PROVIDERS } from "@oh-my-pi/pi-ai";
 import type { OAuthProvider } from "@oh-my-pi/pi-ai/oauth/types";
-import { Input, matchesKey, wrapTextWithAnsi } from "@oh-my-pi/pi-tui";
+import { Input, matchesKey, type SgrMouseEvent, wrapTextWithAnsi } from "@oh-my-pi/pi-tui";
 import { getAgentDbPath } from "@oh-my-pi/pi-utils";
 import { OAuthSelectorComponent } from "../../components/oauth-selector";
 import { theme } from "../../theme/theme";
@@ -35,6 +35,8 @@ export class SignInTab implements SetupTab {
 	#loginAbort: AbortController | undefined;
 	#loggingInProvider: string | undefined;
 	#disposed = false;
+	/** Render line where the provider selector begins. */
+	#selectorRowStart = 2;
 
 	constructor(private readonly host: SetupSceneHost) {
 		this.#authStorage = host.ctx.session.modelRegistry.authStorage;
@@ -68,12 +70,19 @@ export class SignInTab implements SetupTab {
 		this.#selector.handleInput(data);
 	}
 
+	/** Forward mouse to the provider selector; pointer is inert during an active login or code prompt. */
+	routeMouse(event: SgrMouseEvent, line: number, col: number): void {
+		if (this.#loggingInProvider || this.#prompt) return;
+		this.#selector.routeMouse(event, line - this.#selectorRowStart, col);
+	}
+
 	render(width: number): readonly string[] {
 		const lines: string[] = [];
 		if (this.#loggingInProvider) {
 			lines.push(theme.bold(`Signing in to ${this.#loggingInProvider}`));
 		} else {
 			lines.push(theme.fg("muted", "Pick a provider to sign in — you can connect more than one."), "");
+			this.#selectorRowStart = lines.length;
 			lines.push(...this.#selector.render(width));
 		}
 

package/src/modes/setup-wizard/scenes/theme.ts

@@ -1,4 +1,11 @@
-import { padding, type SelectItem, SelectList, truncateToWidth, visibleWidth } from "@oh-my-pi/pi-tui";
+import {
+	padding,
+	type SelectItem,
+	SelectList,
+	type SgrMouseEvent,
+	truncateToWidth,
+	visibleWidth,
+} from "@oh-my-pi/pi-tui";
 import {
 	enableAutoTheme,
 	getAvailableThemes,
@@ -89,6 +96,8 @@ class ThemeSceneController implements SetupSceneController {
 	#message: string | undefined;
 	#previewRequest = 0;
 	#disposed = false;
+	/** Render line where the select list began, or -1 while it is not shown. */
+	#listRowStart = -1;
 	readonly #originalTheme = getCurrentThemeName();
 	readonly #originalSymbolPreset: SymbolPreset;
 	readonly #originalColorBlindMode: boolean;
@@ -117,6 +126,22 @@ class ThemeSceneController implements SetupSceneController {
 		this.#selectList.handleInput(data);
 	}
 
+	/** Wheel moves the highlight (live preview); hover lights the row under the pointer; click confirms it. */
+	routeMouse(event: SgrMouseEvent, line: number, _col: number): void {
+		if (event.wheel !== null) {
+			this.#selectList.handleWheel(event.wheel);
+			return;
+		}
+		const index = this.#listRowStart >= 0 ? this.#selectList.hitTest(line - this.#listRowStart) : undefined;
+		if (event.motion) {
+			this.#selectList.setHoverIndex(index ?? null);
+			return;
+		}
+		if (event.leftClick && index !== undefined) {
+			this.#selectList.clickItem(index);
+		}
+	}
+
 	render(width: number): readonly string[] {
 		const lines = [
 			theme.fg("muted", "Theme changes preview live. Nothing is saved until you press Enter."),
@@ -128,8 +153,10 @@ class ThemeSceneController implements SetupSceneController {
 			"",
 		];
 		if (this.#loadingAllThemes) {
+			this.#listRowStart = -1;
 			lines.push(theme.fg("dim", "Loading themes…"));
 		} else {
+			this.#listRowStart = lines.length;
 			lines.push(...this.#selectList.render(width));
 		}
 		if (this.#message) {

package/src/modes/setup-wizard/scenes/types.ts

@@ -1,4 +1,4 @@
-import type { Component } from "@oh-my-pi/pi-tui";
+import type { Component, SgrMouseEvent } from "@oh-my-pi/pi-tui";
 import type { InteractiveModeContext } from "../../types";
 
 export type SetupSceneResult = "done" | "skipped";
@@ -17,6 +17,13 @@ export interface SetupSceneController extends Component {
 	onMount?(): void | Promise<void>;
 	onUnmount?(): void;
 	dispose?(): void;
+	/**
+	 * Route an SGR mouse report (tracking is on while the wizard holds the
+	 * alternate screen). `line`/`col` are 0-based within this controller's
+	 * last rendered output. When absent, the wizard falls back to synthesizing
+	 * arrow keys from wheel notches.
+	 */
+	routeMouse?(event: SgrMouseEvent, line: number, col: number): void;
 }
 
 /**
@@ -36,6 +43,8 @@ export interface SetupTab {
 	invalidate(): void;
 	/** Called when the tab becomes active (including initial mount). */
 	onActivate?(): void;
+	/** Mouse routing at tab-local coordinates; see {@link SetupSceneController.routeMouse}. */
+	routeMouse?(event: SgrMouseEvent, line: number, col: number): void;
 	dispose(): void;
 }