pi-ask-popup 0.1.1 → 0.2.0

package/src/tool/response-envelope.ts

@@ -9,6 +9,8 @@ import type {
 export const DECLINE_MESSAGE = "User declined to answer questions";
 export const TIMED_OUT_MESSAGE =
   "Questionnaire timed out — the user did not respond within the configured timeout. The user never saw a decline; do NOT treat this as a rejection. Ask the questions as plain chat text instead or retry.";
+export const HOST_ERROR_MESSAGE =
+  "The host replied with a value that was never offered, so the questionnaire could not be completed. Nobody declined and nobody answered — do NOT treat this as a rejection. Ask the questions as plain chat text instead.";
 export const ENVELOPE_PREFIX = "User has answered your questions:";
 export const ENVELOPE_SUFFIX = "You can now continue with the user's answers in mind.";
 /** Opens the segment for a note whose question was never answered. */
@@ -51,6 +53,23 @@ export function buildQuestionnaireResponse(
     }
     return buildToolResult(TIMED_OUT_MESSAGE, details);
   }
+  if (result?.error === "host_error") {
+    // A broken host is not a decision. Sharing the decline text would tell the
+    // model the user said no, when the user was never shown a working dialog.
+    const details: QuestionnaireResult = {
+      answers: result.answers,
+      cancelled: true,
+      error: "host_error",
+    };
+    if (result.hostErrorDetail && result.hostErrorDetail.length > 0) {
+      (details as { hostErrorDetail: string }).hostErrorDetail = result.hostErrorDetail;
+      return buildToolResult(
+        `${HOST_ERROR_MESSAGE} (host sent: ${result.hostErrorDetail})`,
+        details,
+      );
+    }
+    return buildToolResult(HOST_ERROR_MESSAGE, details);
+  }
   if (!result || result.cancelled) {
     // The decline text stays canonical even when a global note rides a
     // cancelled result. The note survives in `details`, like partial answers.
@@ -71,11 +90,18 @@ export function buildQuestionnaireResponse(
     return buildToolResult(DECLINE_MESSAGE, details);
   }
 
+  // Indexed once rather than scanned per question. Both sides are keyed by
+  // `questionIndex`, which is what the loop below asks for, and it is the same
+  // shape `orderedAnswers` uses in the reducer. A first entry wins, so a
+  // duplicated index reads as the earlier `find` did.
+  const answerByIndex = byQuestionIndex(result.answers);
+  const noteByIndex = byQuestionIndex(result.unansweredNotes ?? []);
+
   const segments: string[] = [];
   // Iterate the questions rather than the answers so segments always follow the
   // order the model asked in, whatever order the user filled tabs.
   for (let i = 0; i < params.questions.length; i++) {
-    const a = result.answers.find((x) => x.questionIndex === i);
+    const a = answerByIndex.get(i);
     if (a) {
       segments.push(buildAnswerSegment(a));
       continue;
@@ -84,7 +110,7 @@ export function buildQuestionnaireResponse(
     // emitted here rather than grouped at the end. Because this loop runs
     // before the "nothing to report" check below, a questionnaire submitted
     // with nothing but such a note counts as answered rather than declined.
-    const n = result.unansweredNotes?.find((x) => x.questionIndex === i);
+    const n = noteByIndex.get(i);
     if (n) {
       segments.push(buildUnansweredNoteSegment(n));
     }
@@ -100,6 +126,17 @@ export function buildQuestionnaireResponse(
   return buildToolResult(`${ENVELOPE_PREFIX} ${segments.join(" ")} ${ENVELOPE_SUFFIX}`, result);
 }
 
+/** First entry per `questionIndex` wins, which is what `Array.find` did. */
+function byQuestionIndex<T extends { questionIndex: number }>(items: readonly T[]): Map<number, T> {
+  const out = new Map<number, T>();
+  for (const item of items) {
+    if (!out.has(item.questionIndex)) {
+      out.set(item.questionIndex, item);
+    }
+  }
+  return out;
+}
+
 /**
  * One answer as an envelope segment: `"question"="answer"`, optionally followed
  * by the preview the user was looking at and the note they wrote.

package/src/tool/types.ts

@@ -114,7 +114,10 @@ export type QuestionParams = Static<typeof QuestionParamsSchema>;
  * - `custom` — the user typed free text in the "Type something." row.
  *   `answer` is the text, or null when they committed nothing.
  * - `multi` — the user committed multi-select choices. `selected` carries the
- *   chosen labels and `answer` is null.
+ *   chosen labels and `answer` is null. Text typed on the "Type something." row
+ *   appears in `selected` too, as its own trimmed entry: on a multi-select
+ *   question that row counts as chosen whenever it holds text, so an answer can
+ *   be several authored labels plus one thing the user wrote.
  */
 export interface QuestionAnswer {
   questionIndex: number;
@@ -162,7 +165,8 @@ export type QuestionnaireError =
   | "reserved_label"
   | "session_load_failed"
   | "stale_module_cache"
-  | "timed_out";
+  | "timed_out"
+  | "host_error";
 
 export interface QuestionnaireResult {
   answers: QuestionAnswer[];
@@ -192,6 +196,15 @@ export interface QuestionnaireResult {
    */
   unansweredNotes?: UnansweredNote[];
   error?: QuestionnaireError;
+  /**
+   * What the host actually sent, on a `host_error` result. Quoted into the
+   * envelope so whoever reads the transcript can see which value was rejected
+   * rather than guessing at the malfunction.
+   *
+   * Same conditional-spread contract as `globalNote`: present only alongside
+   * `error: "host_error"`, never assigned `undefined`.
+   */
+  hostErrorDetail?: string;
 }
 
 export function isQuestionnaireResult(value: unknown): value is QuestionnaireResult {

package/src/view/components/multi-select-view.ts

@@ -20,6 +20,13 @@ export const MULTI_SUBMIT_LABEL = "Submit";
 export interface MultiSelectOtherRowProps {
   /** The "Type something." row is the focused row (optionIndex === options.length). */
   active: boolean;
+  /**
+   * The typed text counts as a selection, which on this row means only that
+   * there is some. Drawn with the same ✔ as an option: the row is as chosen as
+   * a ticked box, and the box used to be painted permanently empty while the
+   * text under it was on its way to the model.
+   */
+  checked: boolean;
   /** `state.inputMode` — true once the row has focus and keystrokes append to the buffer. */
   inputMode: boolean;
   /** Live inline-input buffer (read from `runtime.inputBuffer` / `ctx.inputBuffer`). */
@@ -66,7 +73,13 @@ export class MultiSelectView implements StatefulView<MultiSelectViewProps> {
   ) {
     this.props = {
       rows: [],
-      other: { active: false, inputMode: false, inputBuffer: "", inputCursorOffset: undefined },
+      other: {
+        active: false,
+        checked: false,
+        inputMode: false,
+        inputBuffer: "",
+        inputCursorOffset: undefined,
+      },
       nextActive: false,
       nextLabel: ROW_INTENT_META.next.label,
     };
@@ -175,7 +188,9 @@ export class MultiSelectView implements StatefulView<MultiSelectViewProps> {
   private renderOtherRow(contentWidth: number, numberWidth: number): string[] {
     const other = this.props.other;
     const pointer = other.active ? this.theme.fg("accent", ACTIVE_POINTER) : INACTIVE_POINTER;
-    const box = this.theme.fg("muted", UNCHECKED);
+    const box = other.checked
+      ? this.theme.fg("accent", CHECKED)
+      : this.theme.fg("muted", UNCHECKED);
     const number = String(this.question.options.length + 1).padStart(numberWidth, " ");
     const rowPrefix = `${pointer}${number}${NUMBER_SEPARATOR}${box}${BOX_LABEL_GAP}`;
     const continuationPrefix = " ".repeat(visibleWidth(rowPrefix));

package/src/view/components/option-list-view.ts

@@ -71,6 +71,11 @@ export class OptionListView implements StatefulView<OptionListViewProps> {
     return this.select.render(width);
   }
 
+  /** Row count at `width`, equal to `render(width).length`, without building the rows. */
+  measureHeight(width: number): number {
+    return this.select.measureHeight(width);
+  }
+
   focusedItemRowRange(width: number): [number, number] {
     return this.select.focusedItemRowRange(width);
   }

package/src/view/components/preview/markdown-content-cache.ts

@@ -10,22 +10,39 @@ export const MAX_PREVIEW_HEIGHT_SIDE_BY_SIDE = 20;
 /** Preserves narrow-terminal protection in stacked layout. */
 export const MAX_PREVIEW_HEIGHT_STACKED = 15;
 export const NO_PREVIEW_TEXT = "No preview available";
+/** Fallback body line when a preview's markdown fails to render (untrusted input boundary). */
+export const PREVIEW_RENDER_FAILED_TEXT = "Preview failed to render";
 /** 1 blank separator + 1 affordance text row reserved when `hasAnyPreview` (height stability of the affordance row's offset relative to the box). */
 export const NOTES_AFFORDANCE_OVERHEAD = 2;
 
 /**
- * Per-question cache for rendered markdown previews. Width-keyed: switching the
- * inner width invalidates every cached `Markdown`'s render output (pi-tui's
- * `Markdown.render(width)` re-wraps when width changes).
+ * One entry per option that carries a preview. `md` is built once and kept for
+ * the life of the cache; `lines` are the stripped rows it last produced, and
+ * `width` is the inner width they were produced at.
+ */
+interface PreviewEntry {
+  md: ReturnType<MarkdownFactory>;
+  width: number | undefined;
+  lines: string[] | undefined;
+}
+
+/**
+ * Per-question cache for rendered markdown previews, keyed per option.
+ *
+ * Width used to be tracked for the cache as a whole: any change invalidated
+ * every `Markdown` it held, so a resize drag re-wrapped all four options one by
+ * one through the `maxNaturalHeight` loop even though the frame only measured
+ * some of them. Each option now remembers the width it was rendered at, so a
+ * width flip costs a re-render of the options that frame actually asks for and
+ * nothing else. It also holds the stripped rows, which spares the second strip
+ * when `blockHeight` and `renderBlock` ask for the same option in one frame.
  *
- * Replaces the inline `previewTexts`, `markdownCache`, `cachedWidth` triple from
- * the previous monolithic `preview-pane.ts`. One Markdown per option, lazy on
- * first request, never re-constructed — count semantics frozen by tests.
+ * One Markdown per option, lazy on first request, never re-constructed — count
+ * semantics frozen by tests.
  */
 export class MarkdownContentCache {
   private readonly previewTexts: Map<number, string>;
-  private readonly markdownCache: Map<number, ReturnType<MarkdownFactory>>;
-  private cachedWidth: number | undefined;
+  private readonly markdownCache: Map<number, PreviewEntry>;
   private readonly theme: Theme;
   private readonly markdownTheme: MarkdownTheme;
   private readonly markdownFactory: MarkdownFactory;
@@ -58,34 +75,54 @@ export class MarkdownContentCache {
   }
 
   /**
-   * Compute the body lines for a given option at a given inner width. Width changes
-   * invalidate the per-Markdown render cache.
+   * Body lines for one option at one inner width. A repeat request at the width
+   * the option was last rendered at returns the stored rows.
+   *
+   * Untrusted boundary: `preview` is model-authored markdown and this is the only
+   * place it reaches the render path. A `Markdown` that throws (malformed input,
+   * width edge cases) must not take the overlay down with it, so the render is
+   * wrapped and a single dim fallback line is returned instead. There is no
+   * notify channel from the view layer — the fallback line IS the diagnostic.
+   * A failed render stores nothing, so the next frame tries again.
    */
   bodyFor(optionIndex: number, innerWidth: number): string[] {
-    if (this.cachedWidth !== innerWidth) {
-      for (const md of this.markdownCache.values()) {
-        md.invalidate();
-      }
-      this.cachedWidth = innerWidth;
-    }
     const text = this.previewTexts.get(optionIndex);
     if (!text) {
       const placeholder = this.theme.fg("dim", NO_PREVIEW_TEXT);
       const pad = Math.max(0, innerWidth - visibleWidth(placeholder));
       return [placeholder + " ".repeat(pad)];
     }
-    let md = this.markdownCache.get(optionIndex);
-    if (!md) {
-      md = this.markdownFactory(text, this.markdownTheme);
-      this.markdownCache.set(optionIndex, md);
+    let entry = this.markdownCache.get(optionIndex);
+    if (!entry) {
+      entry = {
+        md: this.markdownFactory(text, this.markdownTheme),
+        width: undefined,
+        lines: undefined,
+      };
+      this.markdownCache.set(optionIndex, entry);
+    }
+    if (entry.lines !== undefined && entry.width === innerWidth) {
+      // A copy: the rows travel into the box renderer and out to the pane, and
+      // the cache is the only thing that may hold the originals.
+      return [...entry.lines];
+    }
+    try {
+      const lines = stripFenceMarkers(entry.md.render(innerWidth));
+      entry.width = innerWidth;
+      entry.lines = lines;
+      return [...lines];
+    } catch {
+      entry.width = undefined;
+      entry.lines = undefined;
+      return [this.theme.fg("dim", PREVIEW_RENDER_FAILED_TEXT)];
     }
-    return stripFenceMarkers(md.render(innerWidth));
   }
 
   invalidate(): void {
-    for (const md of this.markdownCache.values()) {
-      md.invalidate();
+    for (const entry of this.markdownCache.values()) {
+      entry.md.invalidate();
+      entry.width = undefined;
+      entry.lines = undefined;
     }
-    this.cachedWidth = undefined;
   }
 }

package/src/view/components/preview/preview-layout-decider.ts

@@ -197,6 +197,38 @@ export function crossTabLeftWidthWithDonation(
   return Math.min(Math.max(labelDriven, slackDonation), Math.max(1, ceiling));
 }
 
+/**
+ * Widths kept before the memo below is dropped wholesale. A frame asks for one;
+ * the rest of the entries are old terminal sizes from a resize drag.
+ */
+const PANE_WIDTH_MEMO_MAX_ENTRIES = 16;
+
+/**
+ * Memoize a pane-width computation. For `crossTabLeftWidthWithDonation` and
+ * `crossTabPreviewBudget`, whose other inputs are fixed for the life of a
+ * questionnaire: both scan every tab, every option and every preview source
+ * line, and the pane width only changes on resize, yet the callers ask four to
+ * five times a frame (`focusedItemRowRange`, `naturalHeight`,
+ * `maxNaturalHeight`, `renderSideBySide`).
+ */
+export function memoizeByPaneWidth(
+  compute: (paneWidth: number) => number,
+): (paneWidth: number) => number {
+  const cache = new Map<number, number>();
+  return (paneWidth: number): number => {
+    const hit = cache.get(paneWidth);
+    if (hit !== undefined) {
+      return hit;
+    }
+    const value = compute(paneWidth);
+    if (cache.size >= PANE_WIDTH_MEMO_MAX_ENTRIES) {
+      cache.clear();
+    }
+    cache.set(paneWidth, value);
+    return value;
+  };
+}
+
 /**
  * Width allocation for side-by-side mode.
  * `adaptiveLeft` is the pre-computed left column width (from `adaptiveLeftWidth`,

package/src/view/components/preview/preview-pane.ts

@@ -59,7 +59,13 @@ export interface PreviewPaneProps {
 
 export interface PreviewPaneConfig {
   question: QuestionData;
-  getTerminalWidth: () => number;
+  /**
+   * The frame's terminal width, snapshotted by `DialogView.render` before
+   * anything paints. Not a live read of `tui.terminal.columns`: two components
+   * deciding layout from two different readings of one frame is the bug this
+   * closes.
+   */
+  getFrameTerminalWidth: () => number;
   optionListView: OptionListView;
   previewBlock: PreviewBlockRenderer;
 }
@@ -74,11 +80,13 @@ export interface PreviewPaneConfig {
  *
  * `naturalHeight` and `maxNaturalHeight` query both children's heights; `render`
  * combines them via `decideLayout` (mode threaded into both calls — never
- * re-derived).
+ * re-derived). The probes ask `OptionListView.measureHeight`, not `render`, so
+ * one frame's three passes over the option list cost one wrap at each distinct
+ * width and no discarded rows.
  */
 export class PreviewPane implements StatefulView<PreviewPaneProps>, Component {
   private readonly question: QuestionData;
-  private readonly getTerminalWidth: () => number;
+  private readonly getFrameTerminalWidth: () => number;
   private readonly optionListView: OptionListView;
   private readonly previewBlock: PreviewBlockRenderer;
   private props: PreviewPaneProps;
@@ -93,7 +101,7 @@ export class PreviewPane implements StatefulView<PreviewPaneProps>, Component {
 
   constructor(config: PreviewPaneConfig) {
     this.question = config.question;
-    this.getTerminalWidth = config.getTerminalWidth;
+    this.getFrameTerminalWidth = config.getFrameTerminalWidth;
     this.optionListView = config.optionListView;
     this.previewBlock = config.previewBlock;
     this.props = { notesVisible: false, selectedIndex: 0, focused: false, inputMode: false };
@@ -134,7 +142,7 @@ export class PreviewPane implements StatefulView<PreviewPaneProps>, Component {
       return this.optionListView.render(width);
     }
 
-    const mode = decideLayout(this.getTerminalWidth(), width);
+    const mode = decideLayout(this.getFrameTerminalWidth(), width);
     if (mode === "side-by-side") {
       return this.renderSideBySide(width, mode);
     }
@@ -165,7 +173,7 @@ export class PreviewPane implements StatefulView<PreviewPaneProps>, Component {
     if (this.props.inputMode) {
       return this.optionListView.focusedItemRowRange(width);
     }
-    const mode = decideLayout(this.getTerminalWidth(), width);
+    const mode = decideLayout(this.getFrameTerminalWidth(), width);
     if (mode === "stacked") {
       return this.optionListView.focusedItemRowRange(width);
     }
@@ -176,20 +184,20 @@ export class PreviewPane implements StatefulView<PreviewPaneProps>, Component {
 
   naturalHeight(width: number): number {
     if (this.question.multiSelect === true) {
-      return this.optionListView.render(width).length;
+      return this.optionListView.measureHeight(width);
     }
     if (!this.previewBlock.hasAnyPreview()) {
-      return this.optionListView.render(width).length;
+      return this.optionListView.measureHeight(width);
     }
     // `inputMode`: height is the full-width option list only (no preview block) — preserves
     // the `naturalHeight === render.length` parity invariant.
     if (this.props.inputMode) {
-      return this.optionListView.render(width).length;
+      return this.optionListView.measureHeight(width);
     }
-    const mode = decideLayout(this.getTerminalWidth(), width);
+    const mode = decideLayout(this.getFrameTerminalWidth(), width);
     const adaptiveLeft = this.getAdaptiveLeft(width);
     const { optionsWidth, previewWidth } = bodyWidths(width, mode, adaptiveLeft);
-    const optionsHeight = this.optionListView.render(optionsWidth).length;
+    const optionsHeight = this.optionListView.measureHeight(optionsWidth);
     const previewBlockHeight = this.previewBlock.blockHeight(
       previewWidth,
       this.props.selectedIndex,
@@ -203,20 +211,20 @@ export class PreviewPane implements StatefulView<PreviewPaneProps>, Component {
 
   maxNaturalHeight(width: number): number {
     if (this.question.multiSelect === true) {
-      return this.optionListView.render(width).length;
+      return this.optionListView.measureHeight(width);
     }
     if (!this.previewBlock.hasAnyPreview()) {
-      return this.optionListView.render(width).length;
+      return this.optionListView.measureHeight(width);
     }
     // `inputMode`: like naturalHeight — full-width option list only, so the
     // `maxNaturalHeight >= naturalHeight` parity invariant holds (both equal the list height).
     if (this.props.inputMode) {
-      return this.optionListView.render(width).length;
+      return this.optionListView.measureHeight(width);
     }
-    const mode = decideLayout(this.getTerminalWidth(), width);
+    const mode = decideLayout(this.getFrameTerminalWidth(), width);
     const adaptiveLeft = this.getAdaptiveLeft(width);
     const { optionsWidth, previewWidth } = bodyWidths(width, mode, adaptiveLeft);
-    const optionsHeight = this.optionListView.render(optionsWidth).length;
+    const optionsHeight = this.optionListView.measureHeight(optionsWidth);
     let maxPreviewBlock = 0;
     for (let i = 0; i < this.question.options.length; i++) {
       const h = this.previewBlock.blockHeight(previewWidth, i, mode);

package/src/view/components/tab-bar.ts

@@ -1,5 +1,5 @@
 import type { Theme } from "@earendil-works/pi-coding-agent";
-import { truncateToWidth } from "@earendil-works/pi-tui";
+import { truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
 import type { StatefulView } from "../stateful-view.js";
 
 /**
@@ -16,12 +16,13 @@ import type { StatefulView } from "../stateful-view.js";
  * than being appended, so a segment is the same width noted or not. Appending
  * it would add one cell per tab, and four tabs at the schema's 16-character
  * header limit already put this bar at 99 columns: four suffixes would push it
- * to 103, past the 100 columns previews require. `truncateToWidth` below is
- * called with an empty ellipsis and drops the tail, so what would go missing is
- * the Submit tab, silently.
+ * to 103, past the 100 columns previews require.
  */
 export const NOTED_MARKER = "*";
 
+/** Shown in place of the question tabs that did not fit. */
+export const TAB_OVERFLOW_ELLIPSIS = "…";
+
 export interface TabBarProps {
   /** One per author-defined question, in order. */
   tabs: ReadonlyArray<{ label: string; answered: boolean; active: boolean; noted: boolean }>;
@@ -44,6 +45,19 @@ export class TabBar implements StatefulView<TabBarProps> {
 
   invalidate(): void {}
 
+  /**
+   * Question tabs absorb the truncation; the Submit pill does not.
+   *
+   * Four 16-character headers put this bar past 99 columns, so a narrower
+   * terminal always drops something. Trimming the joined line from the right
+   * dropped Submit first, and a user who cannot see Submit cannot finish the
+   * questionnaire. The tail is reserved, the question tabs are trimmed to what
+   * is left, and `TAB_OVERFLOW_ELLIPSIS` marks the tabs that went missing.
+   *
+   * Below the tail's own width there is nothing left to reserve — the whole
+   * line is clipped, as before, so the caller's `visibleWidth <= width`
+   * invariant survives every terminal size.
+   */
   render(width: number): string[] {
     const pieces: string[] = [" ← "];
 
@@ -61,10 +75,14 @@ export class TabBar implements StatefulView<TabBarProps> {
     const submitStyled = this.props.submit.active
       ? this.theme.bg("selectedBg", this.theme.fg("text", submitText))
       : this.theme.fg(this.props.submit.allAnswered ? "success" : "dim", submitText);
-    pieces.push(submitStyled);
-    pieces.push(" →");
+    const tail = `${submitStyled} →`;
+    const tailWidth = visibleWidth(tail);
+    const head = pieces.join("");
 
-    const tabLine = truncateToWidth(pieces.join(""), width, "");
-    return [tabLine, ""];
+    if (width <= tailWidth) {
+      return [truncateToWidth(`${head}${tail}`, width, ""), ""];
+    }
+    const headLine = truncateToWidth(head, width - tailWidth, TAB_OVERFLOW_ELLIPSIS);
+    return [`${headLine}${tail}`, ""];
   }
 }