@code-yeongyu/senpi 2026.9.12-3 → 2026.9.13-2

package/dist/modes/interactive/interactive-mode.js

@@ -7,7 +7,7 @@ import * as os from "node:os";
 import * as path from "node:path";
 import { contentText, modelsAreEqual } from "@earendil-works/pi-ai";
 import * as TuiLayouts from "@earendil-works/pi-tui";
-import { CombinedAutocompleteProvider, Container, fuzzyFilter, getCapabilities, hyperlink, Markdown, matchesKey, outerKittyGraphicsMode, Spacer, sanitizeTerminalLabel, setCapabilityOverrides, setKeybindings, Text, TruncatedText, TuiAltScreen, TuiMainScreen, visibleWidth, } from "@earendil-works/pi-tui";
+import { CombinedAutocompleteProvider, Container, decodeKittyPrintable, fuzzyFilter, getCapabilities, hyperlink, Markdown, matchesKey, outerKittyGraphicsMode, SelectList, Spacer, sanitizeTerminalLabel, setCapabilityOverrides, setKeybindings, Text, TruncatedText, TuiAltScreen, TuiMainScreen, visibleWidth, } from "@earendil-works/pi-tui";
 import chalk from "chalk";
 import { spawn, spawnSync } from "child_process";
 import { APP_COMMAND, APP_NAME, APP_TITLE, BRAND, CONFIG_DIR_NAME, DISPLAY_VERSION, expandTildePath, getAgentDir, getAuthPath, getDebugLogPath, getDocsPath, getShareViewerUrl, } from "../../config.js";
@@ -19,6 +19,7 @@ import { CACHE_TTL_MS, collectCacheMisses, computeCacheWaste, detectCacheMiss, }
 import { resolveChangelogSource } from "../../core/changelog-source.js";
 import { collectEntriesForBranchSummary } from "../../core/compaction/branch-summarization.js";
 import { AssistantEditError, assistantTextEquals } from "../../core/edited-assistant-message.js";
+import { formatUserMessage } from "../../core/extensions/builtin/ask-user/format.js";
 import { buildNoticeBox } from "../../core/extensions/notice/index.js";
 import { FooterDataProvider } from "../../core/footer-data-provider.js";
 import { appendUncaughtCrashLog } from "../../core/hidden-stdout-log.js";
@@ -53,9 +54,11 @@ import { abortedMessageForRendering } from "./aborted-error-label.js";
 import { createChatViewport } from "./chat-viewport.js";
 import { transferCompactionQueue, waitForPromptDisposition, } from "./compaction-queue-transfer.js";
 import { ArminComponent } from "./components/armin.js";
+import { getAskUserAnswerHeaders, parseAskUserAnswerFrame } from "./components/ask-user-answer-chip.js";
 import { matchesAskUserAnswerKey } from "./components/ask-user-answer-key.js";
-import { ASK_USER_WIDGET_KEY, AskUserAsyncWidget, buildCommentResponse, buildTimedOutResponse, } from "./components/ask-user-async-widget.js";
+import { ASK_USER_WIDGET_KEY, AskUserAsyncWidget, buildCommentResponse, buildTimedOutResponse, unansweredIds, } from "./components/ask-user-async-widget.js";
 import { AskUserQuestionComponent } from "./components/ask-user-question.js";
+import { formatCountdownLabel } from "./components/ask-user-question-state.js";
 import { AssistantMessageComponent } from "./components/assistant-message.js";
 import { BashExecutionComponent } from "./components/bash-execution.js";
 import { BorderedLoader } from "./components/bordered-loader.js";
@@ -74,6 +77,7 @@ import { ExtensionSelectorComponent } from "./components/extension-selector.js";
 import { FavoriteModelsSelectorComponent } from "./components/favorite-models-selector.js";
 import { FooterComponent, formatTokens } from "./components/footer.js";
 import { formatKeyText, keyDisplayText, keyHint, keyText, rawKeyHint } from "./components/keybinding-hints.js";
+import { LoadedResourceSection } from "./components/loaded-resource-section.js";
 import { LoginDialogComponent } from "./components/login-dialog.js";
 import { createMermaidMarkdownTransformer } from "./components/mermaid.js";
 import { getModelFullId, mergeFavoritePatternsForPersist, } from "./components/model-favorites.js";
@@ -97,12 +101,13 @@ import { editFileInExternalEditor, editInExternalEditor } from "./external-edito
 import { GrokChrome } from "./grok/chrome.js";
 import { restoreInteractiveStderr, takeOverInteractiveStderr } from "./interactive-stderr-guard.js";
 import { applyKeybindingsFileEdit, seedKeybindingsFile } from "./keybindings-command.js";
+import { buildResourceScopeGroups, formatResourceScopeGroups, getDisplaySourceInfo, getScopeAutocompleteTag, isPackageSourceInfo, isSystemResource, } from "./loaded-resource-scopes.js";
 import { describeLoginFailure } from "./login-outcome.js";
 import { refreshModelCatalogs } from "./model-catalog-refresh.js";
 import { getModelSearchText } from "./model-search.js";
 import { isRiskyMainModel, RISKY_MAIN_MODEL_WARNING } from "./risky-main-model-warning.js";
 import { DEFAULT_SMOOTH_FPS, StreamingRevealController } from "./streaming-reveal.js";
-import { getAvailableThemes, getAvailableThemesWithPaths, getEditorTheme, getMarkdownTheme, getThemeByName, onThemeChange, setRegisteredThemes, stopThemeWatcher, Theme, theme, } from "./theme/theme.js";
+import { getAvailableThemes, getAvailableThemesWithPaths, getEditorTheme, getMarkdownTheme, getSelectListTheme, getThemeByName, onThemeChange, setRegisteredThemes, stopThemeWatcher, Theme, theme, } from "./theme/theme.js";
 import { InteractiveThemeController } from "./theme/theme-controller.js";
 import { buildFavoriteCycleStatusMessage } from "./tips/favorite-messages.js";
 import { recordTipShown } from "./tips/history-writer.js";
@@ -494,6 +499,9 @@ export class InteractiveMode {
             : DEFAULT_SMOOTH_FPS;
         this.ui.setMaxRenderFps(fps);
     }
+    get shownQuestion() {
+        return this.shownQuestionId === undefined ? undefined : this.pendingQuestions.get(this.shownQuestionId);
+    }
     // Convenience accessors
     // The session may be the local AgentSession or the shared-host RPC proxy; the
     // four reads widened on InteractiveSession must be awaited at every call site.
@@ -596,7 +604,11 @@ export class InteractiveMode {
         this.extensionInput = undefined;
         this.extensionEditor = undefined;
         this.askUserQuestion = undefined;
-        this.asyncQuestion = undefined;
+        this.pendingQuestions = new Map();
+        this.pendingOrder = [];
+        this.questionSurface = "collapsed";
+        this.composerDestination = { kind: "chat" };
+        this.questionArrivalEpochMs = Date.now();
         this.extensionTerminalInputSubscriptions = new Set();
         // Extension widgets (components rendered above/below the editor)
         this.extensionWidgetsAbove = new Map();
@@ -724,7 +736,7 @@ export class InteractiveMode {
         if (!sourceInfo) {
             return undefined;
         }
-        const scopePrefix = sourceInfo.scope === "user" ? "u" : sourceInfo.scope === "project" ? "p" : "t";
+        const scopePrefix = getScopeAutocompleteTag(sourceInfo.scope);
         const source = sourceInfo.source.trim();
         if (source === "auto" || source === "local" || source === "cli") {
             return scopePrefix;
@@ -1121,8 +1133,10 @@ export class InteractiveMode {
         return `${APP_TITLE} - ${cwdBasename}`;
     }
     applyTerminalTitle() {
+        const questionHeader = this.shownQuestion?.request.questions[0]?.header ?? this.blockingQuestionHeader;
         this.ui.terminal.setTitle(this.activeToolTerminalTitle ??
             this.activeToolExecutionTerminalTitle ??
+            (questionHeader === undefined ? undefined : `? ${questionHeader}`) ??
             this.extensionTerminalTitle ??
             this.getNormalTerminalTitle());
     }
@@ -1563,84 +1577,16 @@ export class InteractiveMode {
         });
     }
     getDisplaySourceInfo(sourceInfo) {
-        const source = sourceInfo?.source ?? "local";
-        const scope = sourceInfo?.scope ?? "project";
-        if (source === "local") {
-            if (scope === "user") {
-                return { label: "user", color: "muted" };
-            }
-            if (scope === "project") {
-                return { label: "project", color: "muted" };
-            }
-            if (scope === "temporary") {
-                return { label: "path", scopeLabel: "temp", color: "muted" };
-            }
-            return { label: "path", color: "muted" };
-        }
-        if (source === "cli") {
-            return {
-                label: "path",
-                scopeLabel: scope === "temporary" ? "temp" : undefined,
-                color: "muted",
-            };
-        }
-        const scopeLabel = scope === "user" ? "user" : scope === "project" ? "project" : scope === "temporary" ? "temp" : undefined;
-        return { label: source, scopeLabel, color: "accent" };
-    }
-    getScopeGroup(sourceInfo) {
-        const source = sourceInfo?.source ?? "local";
-        const scope = sourceInfo?.scope ?? "project";
-        if (source === "cli" || scope === "temporary")
-            return "path";
-        if (scope === "user")
-            return "user";
-        if (scope === "project")
-            return "project";
-        return "path";
+        return getDisplaySourceInfo(sourceInfo);
     }
     isPackageSource(sourceInfo) {
-        const source = sourceInfo?.source ?? "";
-        return source.startsWith("npm:") || source.startsWith("git:");
+        return isPackageSourceInfo(sourceInfo);
     }
     buildScopeGroups(items) {
-        const groups = {
-            user: { scope: "user", paths: [], packages: new Map() },
-            project: { scope: "project", paths: [], packages: new Map() },
-            path: { scope: "path", paths: [], packages: new Map() },
-        };
-        for (const item of items) {
-            const groupKey = this.getScopeGroup(item.sourceInfo);
-            const group = groups[groupKey];
-            const source = item.sourceInfo?.source ?? "local";
-            if (this.isPackageSource(item.sourceInfo)) {
-                const list = group.packages.get(source) ?? [];
-                list.push(item);
-                group.packages.set(source, list);
-            }
-            else {
-                group.paths.push(item);
-            }
-        }
-        return [groups.project, groups.user, groups.path].filter((group) => group.paths.length > 0 || group.packages.size > 0);
+        return buildResourceScopeGroups(items);
     }
     formatScopeGroups(groups, options) {
-        const lines = [];
-        for (const group of groups) {
-            lines.push(`  ${theme.fg("accent", group.scope)}`);
-            const sortedPaths = [...group.paths].sort((a, b) => a.path.localeCompare(b.path));
-            for (const item of sortedPaths) {
-                lines.push(theme.fg("dim", `    ${options.formatPath(item)}`));
-            }
-            const sortedPackages = Array.from(group.packages.entries()).sort(([a], [b]) => a.localeCompare(b));
-            for (const [source, items] of sortedPackages) {
-                lines.push(`    ${theme.fg("mdLink", source)}`);
-                const sortedPackagePaths = [...items].sort((a, b) => a.path.localeCompare(b.path));
-                for (const item of sortedPackagePaths) {
-                    lines.push(theme.fg("dim", `      ${options.formatPackagePath(item, source)}`));
-                }
-            }
-        }
-        return lines.join("\n");
+        return formatResourceScopeGroups(groups, options);
     }
     findSourceInfoForPath(p, sourceInfos) {
         const exact = sourceInfos.get(p);
@@ -1722,15 +1668,19 @@ export class InteractiveMode {
         const sectionHeader = (name, color = "mdHeading") => theme.fg(color, `[${name}]`);
         const formatCompactList = (items, options) => {
             const labels = items.map((item) => item.trim()).filter((item) => item.length > 0);
+            if (labels.length === 0) {
+                return "";
+            }
             if (options?.sort !== false) {
                 labels.sort((a, b) => a.localeCompare(b));
             }
             return theme.fg("dim", `  ${labels.join(", ")}`);
         };
+        // System resources are left out of the compact body; a section with nothing else to show stays
+        // hidden until the listing is expanded, where the system group lists them.
         const addLoadedSection = (name, collapsedBody, expandedBody = collapsedBody, color = "mdHeading") => {
-            const section = new ExpandableText(() => `${sectionHeader(name, color)}\n${collapsedBody}`, () => `${sectionHeader(name, color)}\n${expandedBody}`, this.getStartupExpansionState(), 0, 0);
+            const section = new LoadedResourceSection(collapsedBody.length === 0 ? "" : `${sectionHeader(name, color)}\n${collapsedBody}`, `${sectionHeader(name, color)}\n${expandedBody}`, this.getStartupExpansionState());
             this.loadedResourcesContainer.addChild(section);
-            this.loadedResourcesContainer.addChild(new Spacer(1));
         };
         const skillsResult = this.session.resourceLoader.getSkills();
         const promptsResult = this.session.resourceLoader.getPrompts();
@@ -1789,7 +1739,7 @@ export class InteractiveMode {
                     formatPath: (item) => this.formatDisplayPath(item.path),
                     formatPackagePath: (item) => this.getShortPath(item.path, item.sourceInfo),
                 });
-                const skillCompactList = formatCompactList(skills.map((skill) => skill.name));
+                const skillCompactList = formatCompactList(skills.filter((skill) => !isSystemResource(skill.sourceInfo)).map((skill) => skill.name));
                 addLoadedSection("Skills", skillCompactList, skillList);
             }
             const templates = this.session.promptTemplates;
@@ -1809,7 +1759,9 @@ export class InteractiveMode {
                         return template ? `/${template.name}` : this.formatDisplayPath(item.path);
                     },
                 });
-                const promptCompactList = formatCompactList(templates.map((template) => `/${template.name}`));
+                const promptCompactList = formatCompactList(templates
+                    .filter((template) => !isSystemResource(template.sourceInfo))
+                    .map((template) => `/${template.name}`));
                 addLoadedSection("Prompts", promptCompactList, templateList);
             }
             if (extensions.length > 0) {
@@ -1818,7 +1770,7 @@ export class InteractiveMode {
                     formatPath: (item) => this.formatExtensionDisplayPath(item.path),
                     formatPackagePath: (item) => this.formatExtensionDisplayPath(this.getShortPath(item.path, item.sourceInfo)),
                 });
-                const extensionCompactList = formatCompactList(this.getCompactExtensionLabels(extensions));
+                const extensionCompactList = formatCompactList(this.getCompactExtensionLabels(extensions.filter((extension) => !isSystemResource(extension.sourceInfo))));
                 addLoadedSection("Extensions", extensionCompactList, extList, "mdHeading");
             }
             // Show loaded themes (excluding built-in)
@@ -1833,7 +1785,9 @@ export class InteractiveMode {
                     formatPath: (item) => this.formatDisplayPath(item.path),
                     formatPackagePath: (item) => this.getShortPath(item.path, item.sourceInfo),
                 });
-                const themeCompactList = formatCompactList(customThemes.map((loadedTheme) => loadedTheme.name ?? this.getCompactPathLabel(loadedTheme.sourcePath, loadedTheme.sourceInfo)));
+                const themeCompactList = formatCompactList(customThemes
+                    .filter((loadedTheme) => !isSystemResource(loadedTheme.sourceInfo))
+                    .map((loadedTheme) => loadedTheme.name ?? this.getCompactPathLabel(loadedTheme.sourcePath, loadedTheme.sourceInfo)));
                 addLoadedSection("Themes", themeCompactList, themeList);
             }
         }
@@ -2144,10 +2098,19 @@ export class InteractiveMode {
             return false;
         };
     }
+    async withBlockedHostDialog(id, label, show) {
+        this.session.emitExtensionEvent("herdr:blocked", { active: true, label, id });
+        try {
+            return await show();
+        }
+        finally {
+            this.session.emitExtensionEvent("herdr:blocked", { active: false, id });
+        }
+    }
     async handleHostUiRequest(request) {
         switch (request.method) {
             case "select": {
-                const value = await this.showExtensionSelector(request.title ?? "", request.options ?? []);
+                const value = await this.withBlockedHostDialog(request.id, request.title ?? "", () => this.showExtensionSelector(request.title ?? "", request.options ?? []));
                 return value === undefined
                     ? { type: "extension_ui_response", id: request.id, cancelled: true }
                     : { type: "extension_ui_response", id: request.id, value };
@@ -2156,16 +2119,16 @@ export class InteractiveMode {
                 return {
                     type: "extension_ui_response",
                     id: request.id,
-                    confirmed: await this.showExtensionConfirm(request.title ?? "", request.message ?? ""),
+                    confirmed: await this.withBlockedHostDialog(request.id, request.title ?? "", () => this.showExtensionConfirm(request.title ?? "", request.message ?? "")),
                 };
             case "input": {
-                const value = await this.showExtensionInput(request.title ?? "", request.placeholder);
+                const value = await this.withBlockedHostDialog(request.id, request.title ?? "", () => this.showExtensionInput(request.title ?? "", request.placeholder));
                 return value === undefined
                     ? { type: "extension_ui_response", id: request.id, cancelled: true }
                     : { type: "extension_ui_response", id: request.id, value };
             }
             case "editor": {
-                const value = await this.showExtensionEditor(request.title ?? "", request.prefill);
+                const value = await this.withBlockedHostDialog(request.id, request.title ?? "", () => this.showExtensionEditor(request.title ?? "", request.prefill));
                 return value === undefined
                     ? { type: "extension_ui_response", id: request.id, cancelled: true }
                     : { type: "extension_ui_response", id: request.id, value };
@@ -2189,6 +2152,7 @@ export class InteractiveMode {
                     timeoutMs: request.timeout ?? 0,
                 }, {
                     timeout: remainingMs,
+                    notifyArrival: request.askedAtMs === undefined || request.askedAtMs >= this.questionArrivalEpochMs,
                     onProgress: (draft) => {
                         lastDraft = draft;
                         if (progressTimer !== undefined)
@@ -2601,11 +2565,13 @@ export class InteractiveMode {
         if (this.askUserQuestion) {
             this.hideQuestionOverlay();
         }
-        this.asyncQuestion?.finish({
-            status: "cancelled",
-            answers: {},
-            unanswered: this.asyncQuestion.request.questions.map((question) => question.id),
-        });
+        for (const state of this.pendingQuestions.values()) {
+            state.finish({
+                status: "cancelled",
+                answers: {},
+                unanswered: state.request.questions.map((question) => question.id),
+            });
+        }
         this.ui.hideOverlay();
         this.clearExtensionTerminalInputListeners();
         this.setExtensionFooter(undefined);
@@ -2759,9 +2725,9 @@ export class InteractiveMode {
     }
     createExtensionUIContext() {
         return {
-            select: (title, options, opts) => this.showExtensionSelector(title, options, opts),
-            confirm: (title, message, opts) => this.showExtensionConfirm(title, message, opts),
-            input: (title, placeholder, opts) => this.showExtensionInput(title, placeholder, opts),
+            select: (title, options, opts) => this.withBlockedHostDialog(crypto.randomUUID(), title, () => this.showExtensionSelector(title, options, opts)),
+            confirm: (title, message, opts) => this.withBlockedHostDialog(crypto.randomUUID(), title, () => this.showExtensionConfirm(title, message, opts)),
+            input: (title, placeholder, opts) => this.withBlockedHostDialog(crypto.randomUUID(), title, () => this.showExtensionInput(title, placeholder, opts)),
             // Async answers are delivered by the ask-user extension, not here: the
             // widget only resolves the question, so the model sees exactly one
             // framed user message no matter which surface answered.
@@ -2787,7 +2753,7 @@ export class InteractiveMode {
             pasteToEditor: (text) => this.editor.handleInput(`\x1b[200~${text}\x1b[201~`),
             setEditorText: (text) => this.editor.setText(text),
             getEditorText: () => this.getExpandedEditorText(),
-            editor: (title, prefill) => this.showExtensionEditor(title, prefill),
+            editor: (title, prefill) => this.withBlockedHostDialog(crypto.randomUUID(), title, () => this.showExtensionEditor(title, prefill)),
             addAutocompleteProvider: (factory) => {
                 this.autocompleteProviderWrappers.push(factory);
                 this.setupAutocompleteProvider();
@@ -2955,6 +2921,8 @@ export class InteractiveMode {
                 opts?.signal?.removeEventListener("abort", onAbort);
                 this.workingMessage = previousWorkingMessage;
                 this.updateWorkingIndicatorMessage();
+                this.blockingQuestionHeader = undefined;
+                this.applyTerminalTitle();
                 this.hideQuestionOverlay();
                 resolve(response);
             };
@@ -2974,11 +2942,16 @@ export class InteractiveMode {
                 return;
             }
             opts?.signal?.addEventListener("abort", onAbort, { once: true });
+            this.blockingQuestionHeader = request.questions[0]?.header;
+            this.applyTerminalTitle();
+            if (opts?.notifyArrival !== false && this.settingsManager.getAskUserSettings().bell)
+                this.ui.terminal.write("\x07");
             this.workingMessage = "Waiting for your answer";
             this.updateWorkingIndicatorMessage();
             this.askUserQuestion = new AskUserQuestionComponent(request, (response) => finish(response), {
                 tui: this.ui,
                 timeoutMs: opts?.timeout ?? request.timeoutMs,
+                getDeadlineAtMs: opts?.getDeadlineAtMs,
                 onProgress: opts?.onProgress,
             });
             this.disposeActiveSelector();
@@ -2994,82 +2967,199 @@ export class InteractiveMode {
     hideQuestionOverlay() {
         this.askUserQuestion?.dispose();
         this.askUserQuestion = undefined;
+        this.questionSurface = "collapsed";
         this.editorContainer.clear();
         this.editorContainer.addChild(this.editor);
         this.ui.setFocus(this.editor);
         this.ui.requestRender();
     }
-    /**
-     * Park a waitForAnswer=false question behind a one-line widget above the
-     * editor. The turn keeps running; the promise settles when the user submits
-     * from the expanded component, types an ordinary reply (comment), the idle
-     * countdown expires, or the caller aborts. A newer async question supersedes
-     * a pending one, which resolves as cancelled.
-     */
+    /** Queue an async request without replacing another request or taking editor focus. */
     showAsyncQuestion(request, opts) {
-        return new Promise((resolve) => {
-            const cancelled = () => ({
+        const existing = this.pendingQuestions.get(request.requestId);
+        if (existing)
+            return existing.completion;
+        const cancelled = () => ({
+            status: "cancelled",
+            answers: {},
+            unanswered: request.questions.map((question) => question.id),
+        });
+        if (opts?.signal?.aborted)
+            return Promise.resolve(cancelled());
+        const completion = Promise.withResolvers();
+        const onAbort = () => state.finish(cancelled());
+        const state = {
+            request,
+            timeoutMs: opts?.timeout ?? request.timeoutMs,
+            askedAtMs: Date.now(),
+            completion: completion.promise,
+            getDeadlineAtMs: opts?.getDeadlineAtMs,
+            onProgress: opts?.onProgress,
+            draft: { answers: {} },
+            finish: (response) => {
+                if (this.pendingQuestions.get(request.requestId) !== state)
+                    return;
+                this.pendingQuestions.delete(request.requestId);
+                this.pendingOrder = this.pendingOrder.filter((id) => id !== request.requestId);
+                opts?.signal?.removeEventListener("abort", onAbort);
+                if (this.composerDestination.kind === "answer" &&
+                    this.composerDestination.requestId === request.requestId) {
+                    this.setComposerReply();
+                    if (this.editor.getText() !== "")
+                        this.showStatus("That question is no longer pending");
+                }
+                if (this.pendingOrder.length === 0 && this.questionSurface === "list") {
+                    this.ui.hideOverlay();
+                    this.questionSurface = "collapsed";
+                }
+                if (this.shownQuestionId === request.requestId) {
+                    if (this.questionSurface === "expanded")
+                        this.hideQuestionOverlay();
+                    this.shownQuestionId = this.pendingOrder[0];
+                }
+                this.refreshAsyncWidget();
+                completion.resolve(response);
+            },
+        };
+        this.pendingQuestions.set(request.requestId, state);
+        this.pendingOrder.push(request.requestId);
+        this.shownQuestionId ??= request.requestId;
+        if (opts?.notifyArrival !== false && this.settingsManager.getAskUserSettings().bell)
+            this.ui.terminal.write("\x07");
+        opts?.signal?.addEventListener("abort", onAbort, { once: true });
+        this.refreshAsyncWidget();
+        return completion.promise;
+    }
+    /** Only the visible surface ticks; extension deadlines remain authoritative. */
+    refreshAsyncWidget() {
+        this.applyTerminalTitle();
+        const state = this.shownQuestion;
+        if (!state || this.questionSurface === "expanded") {
+            this.setExtensionWidget(ASK_USER_WIDGET_KEY, undefined);
+            return;
+        }
+        this.setExtensionWidget(ASK_USER_WIDGET_KEY, (tui) => new AskUserAsyncWidget({
+            request: state.request,
+            draft: state.draft,
+            timeoutMs: state.timeoutMs,
+            getDeadlineAtMs: state.getDeadlineAtMs,
+            pendingCount: this.pendingOrder.length,
+            tui,
+            onExpire: () => state.finish(buildTimedOutResponse(state.request, state.draft, Date.now() - state.askedAtMs)),
+        }));
+    }
+    /** Intercept question chords and first typed input before the editor inserts it. */
+    handleAskUserShortcut(data) {
+        const state = this.shownQuestion;
+        if (!state ||
+            this.askUserQuestion ||
+            this.ui.hasOverlay() ||
+            this.extensionSelector ||
+            this.extensionInput ||
+            this.extensionEditor)
+            return false;
+        if (matchesAskUserAnswerKey(data))
+            return this.expandPendingQuestion();
+        if (this.editor.getText() !== "" ||
+            this.ui.getFocusedComponent() !== this.editor ||
+            this.defaultEditor.isShowingAutocomplete())
+            return false;
+        if (this.keybindings.matches(data, "app.question.next")) {
+            if (this.pendingOrder.length < 2)
+                return false;
+            const index = this.pendingOrder.indexOf(state.request.requestId);
+            this.shownQuestionId = this.pendingOrder[(index + 1) % this.pendingOrder.length];
+            this.refreshAsyncWidget();
+            return true;
+        }
+        const unanswered = unansweredIds(state.request, state.draft);
+        const questionIndex = state.request.questions.findIndex((question) => question.id === unanswered[0]);
+        const question = state.request.questions[questionIndex];
+        if (/^[1-9]$/.test(data) && question?.options[Number(data) - 1]) {
+            this.expandPendingQuestion(state.request.requestId, questionIndex, data);
+            return true;
+        }
+        const printable = decodeKittyPrintable(data) ?? data;
+        if (data.startsWith("\x1b[200~") ||
+            (printable !== "" && !/[\x00-\x1f\x7f]/.test(printable) && !/^[/!]/.test(printable))) {
+            this.setComposerReply(state.request.requestId);
+        }
+        return false;
+    }
+    setComposerReply(requestId) {
+        this.composerDestination = requestId === undefined ? { kind: "chat" } : { kind: "answer", requestId };
+        const state = requestId === undefined ? undefined : this.pendingQuestions.get(requestId);
+        this.defaultEditor.setReplyLabel(state
+            ? theme.fg("muted", `↳ reply to ${state.request.questions[0].header} · ${keyText("app.message.followUp")} sends as message`)
+            : undefined);
+        this.ui.requestRender();
+    }
+    async handleAnswerCommand(argument) {
+        const state = this.shownQuestion;
+        if (!state) {
+            this.showStatus("No question is pending.");
+            return;
+        }
+        if (argument === "skip") {
+            const response = {
                 status: "cancelled",
-                answers: {},
-                unanswered: request.questions.map((question) => question.id),
+                answers: state.draft.answers ?? {},
+                unanswered: unansweredIds(state.request, state.draft),
+            };
+            state.finish(response);
+            await state.completion;
+            this.showStatus("The user dismissed the question.");
+            // Ordinary cancellation/abort stays silent in the builtin. Only this
+            // explicit command acknowledges dismissal, including on host bridges.
+            await this.session.sendUserMessage(formatUserMessage(response, state.request.requestId, state.request.questions), {
+                deliverAs: this.session.isStreaming ? "steer" : "followUp",
             });
-            if (opts?.signal?.aborted) {
-                resolve(cancelled());
+            return;
+        }
+        if (argument !== "") {
+            const id = /^[1-9]\d*$/.test(argument) ? this.pendingOrder[Number(argument) - 1] : undefined;
+            if (id === undefined) {
+                this.showStatus("Choose a pending question number or /answer skip.");
                 return;
             }
-            this.asyncQuestion?.finish(cancelled());
-            const onAbort = () => state.finish(cancelled());
-            const state = {
-                request,
-                timeoutMs: opts?.timeout ?? request.timeoutMs,
-                onProgress: opts?.onProgress,
-                draft: { answers: {} },
-                finish: (response) => {
-                    if (this.asyncQuestion !== state)
-                        return;
-                    this.asyncQuestion = undefined;
-                    opts?.signal?.removeEventListener("abort", onAbort);
-                    if (this.askUserQuestion)
-                        this.hideQuestionOverlay();
-                    this.setExtensionWidget(ASK_USER_WIDGET_KEY, undefined);
-                    resolve(response);
-                },
+            this.expandPendingQuestion(id);
+            return;
+        }
+        if (this.pendingOrder.length === 1) {
+            this.expandPendingQuestion();
+            return;
+        }
+        const list = new SelectList(this.pendingOrder.map((id) => {
+            const pending = this.pendingQuestions.get(id);
+            const remaining = (pending.getDeadlineAtMs?.() ?? pending.askedAtMs + pending.timeoutMs) - Date.now();
+            return {
+                value: id,
+                label: `${pending.request.questions[0].header} · ${formatCountdownLabel(Date.now() - pending.askedAtMs)} ago · ${formatCountdownLabel(remaining)} remaining`,
             };
-            this.asyncQuestion = state;
-            opts?.signal?.addEventListener("abort", onAbort, { once: true });
-            this.refreshAsyncWidget(state);
-        });
-    }
-    /** (Re)render the collapsed widget with a fresh idle countdown. */
-    refreshAsyncWidget(state) {
-        this.setExtensionWidget(ASK_USER_WIDGET_KEY, (tui) => {
-            const startedAt = Date.now();
-            return new AskUserAsyncWidget({
-                request: state.request,
-                draft: state.draft,
-                timeoutMs: state.timeoutMs,
-                tui,
-                onExpire: () => state.finish(buildTimedOutResponse(state.request, state.draft, Date.now() - startedAt)),
-            });
-        });
-    }
-    /** Editor shortcut: expand the pending async question into the full component. */
-    handleAskUserShortcut(data) {
-        if (!this.asyncQuestion || this.askUserQuestion || !matchesAskUserAnswerKey(data))
-            return false;
-        return this.expandPendingQuestion();
+        }), 10, getSelectListTheme());
+        const close = () => {
+            this.ui.hideOverlay();
+            this.questionSurface = "collapsed";
+        };
+        list.onCancel = close;
+        list.onSelect = ({ value }) => {
+            close();
+            this.expandPendingQuestion(value);
+        };
+        this.questionSurface = "list";
+        this.ui.showOverlay(list, { width: "80%", anchor: "bottom-center" });
     }
     /**
      * Key-free entry into the pending async question (empty Enter, /answer):
      * mounts the full component in place of the editor. Returns false when
      * nothing is pending or the component is already open.
      */
-    expandPendingQuestion() {
-        const state = this.asyncQuestion;
+    expandPendingQuestion(requestId = this.shownQuestionId, initialQuestionIndex, initialInput) {
+        const state = requestId === undefined ? undefined : this.pendingQuestions.get(requestId);
         if (!state || this.askUserQuestion)
             return false;
+        this.shownQuestionId = state.request.requestId;
         const component = new AskUserQuestionComponent(state.request, (response) => {
-            if (this.asyncQuestion !== state)
+            if (this.pendingQuestions.get(state.request.requestId) !== state)
                 return;
             if (response.status !== "cancelled") {
                 state.finish(response);
@@ -3077,21 +3167,28 @@ export class InteractiveMode {
             }
             // Esc collapses back to the widget; the question stays pending.
             this.hideQuestionOverlay();
-            this.refreshAsyncWidget(state);
+            this.refreshAsyncWidget();
         }, {
             tui: this.ui,
             timeoutMs: state.timeoutMs,
+            getDeadlineAtMs: state.getDeadlineAtMs,
+            initialDraft: state.draft,
+            initialQuestionIndex,
             onProgress: (draft) => {
                 state.draft = draft;
                 state.onProgress?.(draft);
             },
         });
         this.askUserQuestion = component;
+        this.questionSurface = "expanded";
+        this.refreshAsyncWidget();
         this.disposeActiveSelector();
         this.editorContainer.clear();
         this.editorContainer.addChild(component);
         this.ui.setFocus(component);
         this.ui.requestRender();
+        if (initialInput !== undefined)
+            component.handleInput(initialInput);
         return true;
     }
     /**
@@ -3100,9 +3197,11 @@ export class InteractiveMode {
      * the raw text. Returns false when nothing is pending.
      */
     submitAsyncQuestionComment(text) {
-        const state = this.asyncQuestion;
+        const destination = this.composerDestination;
+        const state = destination.kind === "answer" ? this.pendingQuestions.get(destination.requestId) : undefined;
         if (!state)
             return false;
+        this.setComposerReply();
         this.editor.addToHistory?.(text);
         this.editor.setText("");
         state.finish(buildCommentResponse(state.request, state.draft, text));
@@ -3580,12 +3679,8 @@ export class InteractiveMode {
                     this.expandPendingQuestion();
                     return;
                 }
-                // A pending async question claims ordinary text as its comment answer;
-                // slash and bash commands keep their normal routing.
-                if (!text.startsWith("/") &&
-                    !text.startsWith("!") &&
-                    this.asyncQuestion &&
-                    this.submitAsyncQuestionComment(text))
+                // Only an explicitly bound reply claims ordinary text; pre-arrival drafts and history stay chat.
+                if (!text.startsWith("/") && !text.startsWith("!") && this.submitAsyncQuestionComment(text))
                     return;
                 // Handle commands
                 if (text === "/settings") {
@@ -3649,10 +3744,9 @@ export class InteractiveMode {
                     await this.handleKeybindingsCommand();
                     return;
                 }
-                if (text === "/answer") {
+                if (text === "/answer" || text.startsWith("/answer ")) {
                     this.editor.setText("");
-                    if (!this.expandPendingQuestion())
-                        this.showStatus("No question is pending.");
+                    await this.handleAnswerCommand(text.slice("/answer".length).trim());
                     return;
                 }
                 if (text === "/hotkeys") {
@@ -4594,7 +4688,8 @@ export class InteractiveMode {
                         }
                     }
                     else {
-                        const userComponent = new UserMessageComponent(textContent, this.getMarkdownThemeWithSettings(), this.outputPad, this.getMarkdownTransformers());
+                        const answer = parseAskUserAnswerFrame(textContent);
+                        const userComponent = new UserMessageComponent(textContent, this.getMarkdownThemeWithSettings(), this.outputPad, this.getMarkdownTransformers(), answer ? getAskUserAnswerHeaders(this.sessionManager.getBranch(), answer.requestId) : undefined);
                         this.chatContainer.addChild(userComponent);
                     }
                     if (options?.populateHistory) {
@@ -5191,6 +5286,7 @@ export class InteractiveMode {
         }
     }
     async handleFollowUp() {
+        this.setComposerReply();
         const text = this.getExpandedEditorText().trim();
         if (!text)
             return;
@@ -7612,6 +7708,7 @@ export class InteractiveMode {
         const followUp = this.getAppKeyDisplay("app.message.followUp");
         const dequeue = this.getAppKeyDisplay("app.message.dequeue");
         const answerQuestion = this.getAppKeyDisplay("app.question.answer");
+        const nextQuestion = this.getAppKeyDisplay("app.question.next");
         const pasteImage = this.getAppKeyDisplay("app.clipboard.pasteImage");
         let hotkeys = `
 **Navigation**
@@ -7655,7 +7752,8 @@ export class InteractiveMode {
 | \`${copyMessage}\` | Copy last assistant message |
 | \`${followUp}\` | Queue follow-up message |
 | \`${dequeue}\` | Restore queued messages |
-| \`${answerQuestion}\` | Open the pending question (also: Enter on an empty editor, or /answer) |
+| \`${answerQuestion}\` | Open the pending question before dequeue (also: empty Enter; /answer lists requests) |
+| \`${nextQuestion}\` | Cycle pending questions from an empty composer |
 | \`${pasteImage}\` | Paste image or text from clipboard |
 | \`/\` | Slash commands |
 | \`!\` | Run bash command |