pi-ask-popup 0.1.1 → 0.2.0

package/README.md

@@ -38,7 +38,7 @@ A note written on a question you never answer still reaches the model, and a glo
 ## What it does
 
 - **Typed options, not a wall of prose.** Each question carries 2 to 4 authored choices, and every choice explains what it means or what it costs you.
-- **You can always answer in your own words.** A `Type something.` row is added to every question and widens to the full pane while you type.
+- **You can always answer in your own words.** A `Type something.` row is added to every question and widens to the full pane while you type. On a multi-select question it ticks itself the moment you type into it, and what you wrote is submitted alongside whatever boxes you ticked. Clear the text and the tick goes with it.
 - **Compare artifacts, not labels.** An option can carry a markdown `preview` that renders in a bordered box beside the option list.
 - **One interruption, not five.** Up to four questions arrive in a single tabbed dialog, and a Submit tab names anything still blank before you commit.
 - **Notes on any answer, or on all of them.** `n` opens a note editor on any question tab, and on the Submit tab it writes one note covering everything. A written note stays on its tab, dimmed, and the tab bar marks which tabs carry one. A note on a question you never answer still reaches the model as `unansweredNotes`.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-ask-popup",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "Pi extension. A tabbed terminal questionnaire the model can put to you when it would otherwise guess, with typed options, markdown previews and notes instead of free-form replies.",
   "type": "module",
   "license": "MIT",

package/src/ask-user-question.ts

@@ -162,7 +162,10 @@ export async function loadQuestionnaireSession(
       message: `${ERROR_SESSION_LOAD_FAILED} (cause: ${cause})`,
     };
   }
-  if (!(mod.QuestionnaireSession instanceof Function)) {
+  // jiti hands back a namespace built in its own realm, so this class can fail
+  // an `instanceof Function` here while being perfectly constructible. `typeof`
+  // asks the question that actually matters: is there something to call.
+  if (typeof mod.QuestionnaireSession !== "function") {
     const keys = JSON.stringify(Object.keys(mod));
     return {
       ok: false,
@@ -187,7 +190,7 @@ function registerCollapseKeyListener(
   sessionRef: SessionRef,
   overlayHandleRef: OverlayHandleRef,
 ): (() => void) | undefined {
-  if (collapseKey === COLLAPSE_KEY_OFF || !(ctx.ui.onTerminalInput instanceof Function)) {
+  if (collapseKey === COLLAPSE_KEY_OFF || typeof ctx.ui.onTerminalInput !== "function") {
     return undefined;
   }
   let hasAnnouncedHide = false;
@@ -415,8 +418,12 @@ export function registerAskPopupTool(pi: ExtensionAPI): void {
       // primitives is malformed, and calling `custom` on it throws a bare
       // TypeError that reaches the model as a broken tool rather than an
       // unsupported one. Answer honestly instead: nobody saw the questions.
+      //
+      // `typeof` rather than `instanceof Function`, for the same reason as
+      // `hasDialogUI`: a cross-realm `custom` is callable and must not be
+      // mistaken for a missing one.
       // SAFETY: safe cast — value is validated at boundary or test fixture with known shape.
-      if (!((ctx.ui as { custom?: unknown }).custom instanceof Function)) {
+      if (typeof (ctx.ui as { custom?: unknown }).custom !== "function") {
         return resolveUndefinedResult(ctx, typed);
       }
 

package/src/config.ts

@@ -1,4 +1,4 @@
-import { readFileSync } from "node:fs";
+import { readFileSync, statSync } from "node:fs";
 import { join } from "node:path";
 import { CONFIG_DIR_NAME } from "@earendil-works/pi-coding-agent";
 
@@ -81,6 +81,35 @@ export function configPaths(sources: ConfigSources): string[] {
   return paths;
 }
 
+/** What one layer parsed to, and the stamp of the file it parsed from. */
+interface CachedLayer {
+  /** `mtimeMs:size`, or undefined when the file could not be stat'd (usually absent). */
+  stamp: string | undefined;
+  value: JsonRecord;
+  /** Replayed on every hit, so a malformed file keeps complaining. */
+  warnings: readonly string[];
+}
+
+const layerCache = new Map<string, CachedLayer>();
+
+/**
+ * Drop the memo. Tests rewrite the same path within a millisecond, which is
+ * finer than the stamp can see; production has no reason to call it.
+ */
+export function clearConfigCache(): void {
+  layerCache.clear();
+}
+
+/** Undefined for a file that cannot be stat'd — absent, or gone behind a bad mount. */
+function layerStamp(path: string): string | undefined {
+  try {
+    const stat = statSync(path);
+    return `${stat.mtimeMs}:${stat.size}`;
+  } catch {
+    return undefined;
+  }
+}
+
 /**
  * Read one layer. An absent file means "no overrides" and is not a warning —
  * having no config is the normal case, not a degraded one. Anything else that
@@ -90,8 +119,30 @@ export function configPaths(sources: ConfigSources): string[] {
  * Deliberately `readFileSync` + catch rather than `existsSync` then read: the
  * check-then-read pair races, and this keeps the no-write guarantee obvious —
  * nothing here can create a file or a parent directory.
+ *
+ * Memoized on `mtimeMs:size`, because this sits on the tool-call hot path: the
+ * user has just triggered a questionnaire and the overlay is about to paint.
+ * An unchanged layer then costs one `stat` instead of a read and a JSON parse,
+ * and the usual case — no config file at all — costs the failed `stat` alone.
+ * The stamp is the same race the read already had: a file rewritten inside one
+ * millisecond at the same size is read as unchanged until it changes again.
  */
 function readLayer(path: string, warnings: string[]): JsonRecord {
+  const stamp = layerStamp(path);
+  const cached = layerCache.get(path);
+  if (cached && cached.stamp === stamp) {
+    warnings.push(...cached.warnings);
+    return cached.value;
+  }
+  const layerWarnings: string[] = [];
+  const value = parseLayer(path, layerWarnings);
+  layerCache.set(path, { stamp, value, warnings: layerWarnings });
+  warnings.push(...layerWarnings);
+  return value;
+}
+
+/** The read itself. Separated so the memo above stays about caching. */
+function parseLayer(path: string, warnings: string[]): JsonRecord {
   let text: string;
   try {
     text = readFileSync(path, "utf8");

package/src/rpc-fallback.ts

@@ -56,13 +56,35 @@ export type DialogUI = {
   ) => Promise<string | undefined>;
 };
 
-/** Whether the host implements the select and input primitives. */
+/**
+ * Whether the host implements the select and input primitives.
+ *
+ * `typeof`, not `instanceof Function`: a method that arrives from another realm
+ * — an Electron context bridge, a VM context, a proxy around a host object — is
+ * callable but fails an `instanceof` against this realm's `Function`, and the
+ * walker would then decline a host that works.
+ */
 export function hasDialogUI(ui: unknown): ui is DialogUI {
   // SAFETY: safe cast — value is validated at boundary or test fixture with known shape.
   const u = ui as Partial<DialogUI> | null | undefined;
-  return u?.select instanceof Function && u?.input instanceof Function;
+  return typeof u?.select === "function" && typeof u?.input === "function";
 }
 
+/**
+ * What one native dialog produced.
+ *
+ * `dismissed` is the user pressing Esc, which cancels the questionnaire.
+ * `host_error` is the host replying with something it was never offered —
+ * neither a decision nor an answer, and the two must not collapse into one
+ * result, because a decline tells the model the user said no.
+ */
+type AskOutcome =
+  | { kind: "answer"; answer: QuestionAnswer }
+  | { kind: "dismissed" }
+  | { kind: "host_error"; detail: string };
+
+const DISMISSED: AskOutcome = { kind: "dismissed" };
+
 type Option = QuestionData["options"][number];
 
 function formatOptionLine(option: Option, index: number): string {
@@ -110,37 +132,41 @@ export async function runRpcQuestionnaire(
       continue;
     }
     const header = q.header ? `[${q.header}] ` : "";
-    const answer = q.multiSelect
+    const outcome = q.multiSelect
       ? await askMultiSelect(ui, q, qi, header, dialogOpts)
       : await askSingleSelect(ui, q, qi, header, dialogOpts);
-    if (answer === undefined) {
+    if (outcome.kind === "dismissed") {
       return { answers, cancelled: true };
     }
-    answers.push(answer);
+    if (outcome.kind === "host_error") {
+      return { answers, cancelled: true, error: "host_error", hostErrorDetail: outcome.detail };
+    }
+    answers.push(outcome.answer);
   }
   return { answers, cancelled: false };
 }
 
-/** Undefined means the user dismissed the dialog, which cancels everything. */
+/** Dismissal cancels everything; a reply outside the offered list is the host's fault. */
 async function askSingleSelect(
   ui: DialogUI,
   q: QuestionData,
   questionIndex: number,
   header: string,
   opts?: { timeout?: number; signal?: AbortSignal },
-): Promise<QuestionAnswer | undefined> {
+): Promise<AskOutcome> {
   const options = q.options.map(formatOptionLine);
   options.push(`${q.options.length + 1}. ${ROW_INTENT_META.other.label}`);
   const chosen = await ui.select(`${header}${q.question}${buildPreviewBlock(q)}`, options, opts);
   if (chosen === undefined || chosen === null) {
-    return undefined;
+    return DISMISSED;
   }
   const idx = parseIndex(chosen, options.length);
-  // A host that returns something outside the list it was given is
-  // indistinguishable from a dismissal. Treating it as one beats fabricating
-  // an answer the user never gave.
+  // A host returning something outside the list it was given used to read as a
+  // dismissal, which told the model the user had declined. Nobody declined
+  // anything: the host is broken, or is rewriting the option text (a localising
+  // client will), and the model needs to hear which.
   if (idx === null) {
-    return undefined;
+    return { kind: "host_error", detail: `selection not in the offered list: "${chosen}"` };
   }
   const option = q.options[idx];
   if (option) {
@@ -154,24 +180,31 @@ async function askSingleSelect(
       // SAFETY: preview is an optional string; present only when non-empty per contract.
       (answer as QuestionAnswer & { preview: string }).preview = option.preview;
     }
-    return answer;
+    return { kind: "answer", answer };
   }
   // The "Type something." row, which is the one index past the authored options.
   const typed = await ui.input(`${header}${q.question}\n\n${CUSTOM_ANSWER_TITLE}`, "", opts);
   if (typed === undefined || typed === null) {
-    return undefined;
+    return DISMISSED;
   }
-  return { questionIndex, question: q.question, kind: "custom", answer: typed };
+  return {
+    kind: "answer",
+    answer: { questionIndex, question: q.question, kind: "custom", answer: typed },
+  };
 }
 
-/** Undefined means the user dismissed the dialog, which cancels everything. */
+/**
+ * Dismissal cancels everything. Nothing else here can be a host error: the text
+ * comes from the user's own keyboard, so an out-of-range number like "13" on a
+ * three-option question is a typed answer, not a host returning garbage.
+ */
 async function askMultiSelect(
   ui: DialogUI,
   q: QuestionData,
   questionIndex: number,
   header: string,
   opts?: { timeout?: number; signal?: AbortSignal },
-): Promise<QuestionAnswer | undefined> {
+): Promise<AskOutcome> {
   const list = q.options.map(formatOptionLine).join("\n");
   const value = await ui.input(
     `${header}${q.question}\n\n${list}\n\n${MULTI_SELECT_INSTRUCTIONS}`,
@@ -179,7 +212,7 @@ async function askMultiSelect(
     opts,
   );
   if (value === undefined || value === null) {
-    return undefined;
+    return DISMISSED;
   }
   const trimmed = value.trim();
   if (trimmed.length === 0) {
@@ -189,7 +222,10 @@ async function askMultiSelect(
     // no tokens the `every` below is vacuously true and produces an empty
     // selection anyway. Removing this would leave an important behaviour
     // resting on that, and no test could tell the two apart.
-    return { questionIndex, question: q.question, kind: "multi", answer: null, selected: [] };
+    return {
+      kind: "answer",
+      answer: { questionIndex, question: q.question, kind: "multi", answer: null, selected: [] },
+    };
   }
   const tokens = trimmed.split(/[,\s]+/).filter((tok) => tok.length > 0);
   const indices = tokens.map((tok) =>
@@ -203,11 +239,17 @@ async function askMultiSelect(
         selected.push(label);
       }
     }
-    return { questionIndex, question: q.question, kind: "multi", answer: null, selected };
+    return {
+      kind: "answer",
+      answer: { questionIndex, question: q.question, kind: "multi", answer: null, selected },
+    };
   }
   // Any token that is not an index -- a word, or a number like "13" when there
   // are three options -- means the user typed an answer rather than picking
   // from the list. Keeping it verbatim is both the honest reading and the
   // multi-select half of the "Type something." escape.
-  return { questionIndex, question: q.question, kind: "custom", answer: trimmed };
+  return {
+    kind: "answer",
+    answer: { questionIndex, question: q.question, kind: "custom", answer: trimmed },
+  };
 }

package/src/state/build-questionnaire.ts

@@ -10,7 +10,10 @@ import {
 import { MultiSelectView } from "../view/components/multi-select-view.js";
 import { OptionListView } from "../view/components/option-list-view.js";
 import { PreviewBlockRenderer } from "../view/components/preview/preview-block-renderer.js";
-import { crossTabLeftWidthWithDonation } from "../view/components/preview/preview-layout-decider.js";
+import {
+  crossTabLeftWidthWithDonation,
+  memoizeByPaneWidth,
+} from "../view/components/preview/preview-layout-decider.js";
 import { PreviewPane, type PreviewPaneProps } from "../view/components/preview/preview-pane.js";
 import { SubmitPicker } from "../view/components/submit-picker.js";
 import { TabBar } from "../view/components/tab-bar.js";
@@ -121,8 +124,29 @@ class QuestionnaireBuilder {
   private readonly markdownTheme = getMarkdownTheme();
   private readonly notesInput: Editor;
   private readonly inlineInput: Editor;
-  private readonly getTerminalWidth = () => this.tui.terminal.columns;
-  private readonly getTerminalRows = () => this.tui.terminal.rows;
+  /**
+   * Terminal size for the frame being painted, refreshed by `beginFrame` and
+   * read back by everything in that frame.
+   *
+   * Components used to reach `tui.terminal` themselves, each at the moment it
+   * happened to run: the pane deciding side-by-side against one reading, the
+   * dialog cutting the scroll window against a later one. A resize landing
+   * between the two split the frame in half. One read at the top of
+   * `DialogView.render` cannot.
+   *
+   * Do not debounce this. A drag fires a resize every few milliseconds, but
+   * each one only reaches `tui.requestRender()`, which sets a flag, schedules
+   * on `process.nextTick` and holds a 16 ms floor between paints. The widths in
+   * between are never painted and never reach a cache; a debounce on top would
+   * buy nothing and delay the frame the user is dragging towards.
+   */
+  private readonly frameTerminal = { columns: 0, rows: 0 };
+  private readonly beginFrame = (): void => {
+    this.frameTerminal.columns = this.tui.terminal.columns;
+    this.frameTerminal.rows = this.tui.terminal.rows;
+  };
+  private readonly getFrameTerminalWidth = () => this.frameTerminal.columns;
+  private readonly getFrameTerminalRows = () => this.frameTerminal.rows;
 
   constructor(config: QuestionnaireBuildConfig) {
     this.tui = config.tui;
@@ -133,6 +157,9 @@ class QuestionnaireBuilder {
     this.initialState = config.initialState;
     this.getCurrentTab = config.getCurrentTab;
     this.collapseKey = config.collapseKey;
+    // Seeded here so a pane that renders before any frame begins sees a real
+    // terminal rather than a zero-width one.
+    this.beginFrame();
 
     this.selectTheme = this.makeSelectTheme();
     const textEditorTheme = editorTheme(this.theme);
@@ -185,7 +212,7 @@ class QuestionnaireBuilder {
     });
     const preview = new PreviewPane({
       question,
-      getTerminalWidth: this.getTerminalWidth,
+      getFrameTerminalWidth: this.getFrameTerminalWidth,
       optionListView: optionList,
       previewBlock,
     });
@@ -215,8 +242,11 @@ class QuestionnaireBuilder {
     // objects first, as upstream did, only produced a shape that already
     // existed -- and produced it with an explicit undefined, which is a
     // different type from an absent key here.
-    const globalLeftWidth = (paneWidth: number): number =>
-      crossTabLeftWidthWithDonation(questions, itemsByTab, questions, paneWidth);
+    // Memoized: the questions and their rows are fixed for the life of the
+    // questionnaire, so the donation is pure of the pane width alone.
+    const globalLeftWidth = memoizeByPaneWidth((paneWidth: number): number =>
+      crossTabLeftWidthWithDonation(questions, itemsByTab, questions, paneWidth),
+    );
     for (const tab of tabs) {
       tab.preview.setGlobalLeftWidth(globalLeftWidth);
     }
@@ -279,7 +309,8 @@ class QuestionnaireBuilder {
         ...(submitPicker === undefined ? {} : { submitPicker }),
         getBodyHeight: heights.global,
         getCurrentBodyHeight: heights.current,
-        getTerminalRows: this.getTerminalRows,
+        beginFrame: this.beginFrame,
+        getFrameTerminalRows: this.getFrameTerminalRows,
         collapseKey: this.collapseKey,
       },
       { state: this.initialState, activePreviewPane },
@@ -314,6 +345,10 @@ class QuestionnaireBuilder {
       }),
       perTabBinding({
         resolve: (tab) => tab.multiSelect,
+        // Gated like the other two. A write to an inactive tab's view clears the
+        // layout it cached, and nothing was going to read the result: the props
+        // for an inactive tab only change while that tab is the active one.
+        predicate: isActiveTab,
         select: selectMultiSelectProps,
       }),
     ];

package/src/state/external-editor.ts

@@ -1,5 +1,5 @@
 import { spawn } from "node:child_process";
-import { mkdtempSync, readFileSync, rmSync, writeFileSync } from "node:fs";
+import { mkdtemp, readFile, rm, writeFile } from "node:fs/promises";
 import { tmpdir } from "node:os";
 import { join } from "node:path";
 
@@ -53,6 +53,11 @@ function runEditor(command: string, file: string): Promise<void> {
  * editor, a failed temp write, anything at all must not leave the user in a
  * stopped TUI with no way back.
  *
+ * Every filesystem step is async. The TUI is stopped anyway, so nothing here is
+ * painting, but the event loop is shared with the rest of Pi and blocking it on
+ * a temp write over a slow or network-backed `TMPDIR` stalls every other
+ * extension in the process.
+ *
  * One trailing newline is stripped, matching Pi's main editor flow: most editors
  * add one on save, and keeping it would silently append a blank line to every
  * answer that went through here.
@@ -70,29 +75,32 @@ export async function editWithExternalEditor(
     throw new Error("External editor command is empty");
   }
 
-  const tempDir = mkdtempSync(join(tmpdir(), "pi-ask-popup-"));
+  const tempDir = await mkdtemp(join(tmpdir(), "pi-ask-popup-"));
   const tempFile = join(tempDir, "answer.md");
   let tuiStopped = false;
 
   try {
-    writeFileSync(tempFile, value, "utf8");
+    await writeFile(tempFile, value, "utf8");
     tui.stop();
     tuiStopped = true;
     process.stdout.write(
       `Launching external editor: ${command}\nPi will resume when the editor exits.\n`,
     );
     await runEditor(command, tempFile);
-    return readFileSync(tempFile, "utf8").replace(/\r?\n$/, "");
+    return (await readFile(tempFile, "utf8")).replace(/\r?\n$/, "");
   } finally {
-    try {
-      rmSync(tempDir, { recursive: true, force: true });
-    } catch {
-      // Best effort. A temp directory left behind is a nuisance; a TUI left
-      // stopped because cleanup threw is a hung session.
-    }
+    // The terminal comes back before the cleanup, not after. Both are in the
+    // finally, but a slow or wedged unlink must not be what stands between the
+    // user and a working screen.
     if (tuiStopped) {
       tui.start();
       tui.requestRender(true);
     }
+    try {
+      await rm(tempDir, { recursive: true, force: true });
+    } catch {
+      // Best effort. A temp directory left behind is a nuisance; a failed
+      // cleanup that propagated would replace the answer with an error.
+    }
   }
 }

package/src/state/key-router.ts

@@ -142,6 +142,14 @@ function isString(value: JsonValue | undefined): value is string {
   return typeof value === "string";
 }
 
+/**
+ * The ticked labels, plus the typed row's text when there is any.
+ *
+ * The typed row has no checkbox of its own to consult: text in it IS the tick,
+ * which is why an empty or whitespace-only draft contributes nothing. The text
+ * comes from the live editor rather than the reducer's copy, which is only
+ * refreshed when the user navigates off the row.
+ */
 function buildMultiSelected(state: QuestionnaireState, runtime: QuestionnaireRuntime): string[] {
   const q = runtime.questions[state.currentTab];
   if (!q) {
@@ -156,6 +164,10 @@ function buildMultiSelected(state: QuestionnaireState, runtime: QuestionnaireRun
       }
     }
   }
+  const typed = runtime.inputBuffer.trim();
+  if (typed.length > 0 && !out.includes(typed)) {
+    out.push(typed);
+  }
   return out;
 }
 
@@ -236,6 +248,17 @@ function routeInputMode(
     return { kind: "ignore" };
   }
   if (isConfirm(kb, data)) {
+    // On a multi-select question, Enter here commits the question the way the
+    // Next row does, and `buildMultiSelected` carries the typed text along with
+    // whatever boxes are ticked. It used to commit the text ALONE, discarding
+    // every tick the user had made.
+    if (runtime.questions[state.currentTab]?.multiSelect === true) {
+      return {
+        kind: "multi_confirm",
+        selected: buildMultiSelected(state, runtime),
+        autoAdvanceTab: computeAutoAdvanceTab(state, runtime),
+      };
+    }
     const answer = buildSingleSelectAnswer(state, runtime);
     if (!answer) {
       return { kind: "ignore" };

package/src/state/questionnaire-session.ts

@@ -1,5 +1,6 @@
 import type { Theme } from "@earendil-works/pi-coding-agent";
 import type { Editor, OverlayHandle, TUI } from "@earendil-works/pi-tui";
+import { truncateToWidth } from "@earendil-works/pi-tui";
 import { COLLAPSE_KEY_OFF, formatKeySpecForDisplay } from "../config.js";
 import type { QuestionData, QuestionnaireResult, QuestionParams } from "../tool/types.js";
 import {
@@ -38,6 +39,32 @@ export interface QuestionnaireSessionConfig {
   canReopenWhileHidden: boolean;
 }
 
+/** Header of the screen shown when the overlay could not be painted. */
+export const RENDER_FAILED_TEXT = "Questionnaire failed to render — press Esc to cancel";
+
+/** Never throws, whatever was thrown: this runs inside the boundary. */
+function describeThrown(thrown: unknown): string {
+  try {
+    return thrown instanceof Error ? thrown.message : String(thrown);
+  } catch {
+    return "unknown error";
+  }
+}
+
+/**
+ * The screen the boundary paints in place of the overlay.
+ *
+ * Deliberately themeless and unstyled: a theme call is one of the things that
+ * can have thrown, and a fallback that needs the failing machinery to work is
+ * not a fallback. Two plain rows, clipped to the width.
+ */
+function renderFailureScreen(width: number, thrown: unknown): string[] {
+  return [
+    truncateToWidth(` ${RENDER_FAILED_TEXT} `, width, ""),
+    truncateToWidth(` ${describeThrown(thrown)} `, width, "…"),
+  ];
+}
+
 export interface QuestionnaireSessionComponent {
   render(width: number): string[];
   invalidate(): void;
@@ -163,7 +190,18 @@ export class QuestionnaireSession {
   ): QuestionnaireSessionComponent {
     const collapsedRender = this.buildCollapsedRender(theme);
     return {
-      render: (width) => (this.state.collapsed ? collapsedRender(width) : built.render(width)),
+      // The boundary. Everything below it — markdown from the model, border
+      // arithmetic, width math — runs inside pi-tui's render loop, where a
+      // throw takes the overlay down and leaves the user with no way to answer
+      // or dismiss it. Input still routes through `handleInput`, so Esc works
+      // on the fallback screen.
+      render: (width) => {
+        try {
+          return this.state.collapsed ? collapsedRender(width) : built.render(width);
+        } catch (thrown) {
+          return renderFailureScreen(width, thrown);
+        }
+      },
       invalidate: built.invalidate,
       handleInput: (data) => this.dispatch(data),
     };
@@ -349,6 +387,11 @@ export class QuestionnaireSession {
       }
       return;
     }
+    // One apply, and the editor adds none of its own: pi-tui's `Editor`
+    // requests a render from its setters and its autocomplete callbacks, never
+    // from `handleInput`, and this editor has no autocomplete provider. So a
+    // keystroke here asks for exactly one render — which the session's tests
+    // pin, since a second would mean two owners of one tick.
     this.inlineInput.handleInput(data);
     this.viewAdapter.apply(this.state);
   }

package/src/state/selectors/projections.ts

@@ -22,6 +22,7 @@ function emptyMultiSelectProps(ctx: PerTabBindingContext): MultiSelectViewProps
     rows: [],
     other: {
       active: false,
+      checked: false,
       inputMode: false,
       inputBuffer: ctx.inputBuffer,
       inputCursorOffset: ctx.inputCursorOffset,
@@ -56,6 +57,11 @@ export const selectMultiSelectProps: PerTabSelector<MultiSelectViewProps> = (sta
     rows,
     other: {
       active: focused && state.optionIndex === question.options.length,
+      // Text in the row is the tick: it appears on the first character typed and
+      // goes on the first delete that empties the row, without a keystroke of
+      // its own. Read from the live editor text, because typing never reaches
+      // the reducer — `handleIgnoreInline` feeds the editor directly.
+      checked: ctx.inputBuffer.trim().length > 0,
       inputMode: state.inputMode,
       inputBuffer: ctx.inputBuffer,
       inputCursorOffset: ctx.inputCursorOffset,

package/src/state/state-reducer.ts

@@ -116,6 +116,8 @@ function syncMultiSelectFromAnswers(
       indices.add(i);
     }
   }
+  // The typed row needs nothing here. Its tick is its text, and the text comes
+  // back with the tab's draft.
   return indices;
 }
 
@@ -133,6 +135,12 @@ function persistMultiSelectAnswer(
       selected.push(q.options[i]!.label);
     }
   }
+  // Text in the typed row is itself the tick, so a non-blank draft joins the
+  // selection. A draft that repeats an option label is not listed twice.
+  const typed = customDraftValueFor(state, state.currentTab).trim();
+  if (typed.length > 0 && !selected.includes(typed)) {
+    selected.push(typed);
+  }
   const out = new Map(state.answers);
   if (selected.length === 0) {
     out.delete(state.currentTab);
@@ -258,6 +266,12 @@ const navHandler: Handler<"nav"> = (state, action, ctx) => {
     inputMode,
     customDraftsByTab,
   };
+  // Leaving the typed row: keystrokes never reached the reducer, so this is the
+  // first moment it sees the finished text. Re-state the answer here or the
+  // Submit review quotes a draft that is several characters out of date.
+  if (state.inputMode) {
+    next.answers = persistMultiSelectAnswer(next, ctx);
+  }
   if (!inputMode) {
     return { state: next, effects: [] };
   }
@@ -298,11 +312,6 @@ const confirmHandler: Handler<"confirm"> = (state, action, ctx) => {
   }
   const answers = new Map(state.answers);
   answers.set(answer.questionIndex, answer);
-  // Custom free-text on a multi-select tab is mutually exclusive with checkbox selections:
-  // clear the checked set immediately so [✔] glyphs vanish on Enter. (A custom answer
-  // carries no `selected` array, so syncMultiSelectFromAnswers keeps it empty on tab-back.)
-  const isCustomMulti =
-    answer.kind === "custom" && ctx.questions[answer.questionIndex]?.multiSelect === true;
   const customDraftsByTab =
     answer.kind === "custom"
       ? withoutCustomDraft(state, answer.questionIndex)
@@ -312,9 +321,6 @@ const confirmHandler: Handler<"confirm"> = (state, action, ctx) => {
     answers,
     customDraftsByTab,
   };
-  if (isCustomMulti) {
-    next.multiSelectChecked = new Set<number>();
-  }
   if (action.autoAdvanceTab !== undefined) {
     return switchTabResult(next, action.autoAdvanceTab, ctx);
   }