pi-ask-popup 0.1.0 → 0.1.1

package/src/state/state-reducer.ts

@@ -8,6 +8,17 @@ import type { WrappingSelectItem } from "./row-intent.js";
 import type { QuestionnaireAction } from "./key-router.js";
 import { ROW_INTENT_META } from "./row-intent.js";
 import { noteForTab, type QuestionnaireState } from "./state.js";
+type JsonValue =
+  | string
+  | number
+  | boolean
+  | null
+  | JsonValue[]
+  | { readonly [key: string]: JsonValue };
+
+function isString(value: JsonValue | undefined): value is string {
+  return typeof value === "string";
+}
 
 /** Session-lifetime constants. No live-component reads — peripheral values live on canonical state. */
 export interface ApplyContext {
@@ -51,7 +62,9 @@ function orderedAnswers(
   const out: QuestionAnswer[] = [];
   for (let i = 0; i < questions.length; i++) {
     const a = state.answers.get(i);
-    if (a) out.push(a);
+    if (a) {
+      out.push(a);
+    }
   }
   return out;
 }
@@ -73,10 +86,14 @@ function unansweredNotesFor(
 ): UnansweredNote[] {
   const out: UnansweredNote[] = [];
   for (let i = 0; i < questions.length; i++) {
-    if (state.answers.has(i)) continue;
+    if (state.answers.has(i)) {
+      continue;
+    }
     const question = questions[i];
     const note = state.notesByTab.get(i);
-    if (!question || note === undefined || note.length === 0) continue;
+    if (!question || note === undefined || note.length === 0) {
+      continue;
+    }
     out.push({ questionIndex: i, question: question.question, note });
   }
   return out;
@@ -88,12 +105,16 @@ function syncMultiSelectFromAnswers(
   tab: number,
 ): ReadonlySet<number> {
   const q = questions[tab];
-  if (!q?.multiSelect) return new Set();
+  if (!q?.multiSelect) {
+    return new Set();
+  }
   const saved = answers.get(tab);
   const labels = saved?.selected ?? [];
   const indices = new Set<number>();
   for (let i = 0; i < q.options.length; i++) {
-    if (labels.includes(q.options[i]!.label)) indices.add(i);
+    if (labels.includes(q.options[i]!.label)) {
+      indices.add(i);
+    }
   }
   return indices;
 }
@@ -103,10 +124,14 @@ function persistMultiSelectAnswer(
   ctx: ApplyContext,
 ): ReadonlyMap<number, QuestionAnswer> {
   const q = ctx.questions[state.currentTab];
-  if (!q?.multiSelect) return state.answers;
+  if (!q?.multiSelect) {
+    return state.answers;
+  }
   const selected: string[] = [];
   for (let i = 0; i < q.options.length; i++) {
-    if (state.multiSelectChecked.has(i)) selected.push(q.options[i]!.label);
+    if (state.multiSelectChecked.has(i)) {
+      selected.push(q.options[i]!.label);
+    }
   }
   const out = new Map(state.answers);
   if (selected.length === 0) {
@@ -114,22 +139,28 @@ function persistMultiSelectAnswer(
     return out;
   }
   const pendingNotes = state.notesByTab.get(state.currentTab);
-  out.set(state.currentTab, {
+  const entry: QuestionAnswer = {
     questionIndex: state.currentTab,
     question: q.question,
     kind: "multi",
     answer: null,
     selected,
-    ...(pendingNotes && pendingNotes.length > 0 ? { notes: pendingNotes } : {}),
-  });
+  };
+  if (pendingNotes && pendingNotes.length > 0) {
+    // SAFETY: notes is an optional string per QuestionAnswer contract; adding when present preserves the shape.
+    (entry as QuestionAnswer & { notes: string }).notes = pendingNotes;
+  }
+  out.set(state.currentTab, entry);
   return out;
 }
 
 function customDraftValueFor(state: QuestionnaireState, tab: number): string {
   const draft = state.customDraftsByTab.get(tab);
-  if (draft !== undefined) return draft;
+  if (draft !== undefined) {
+    return draft;
+  }
   const answer = state.answers.get(tab);
-  return answer?.kind === "custom" && typeof answer.answer === "string" ? answer.answer : "";
+  return answer?.kind === "custom" && isString(answer.answer) ? answer.answer : "";
 }
 
 function setCustomDraft(
@@ -143,7 +174,9 @@ function setCustomDraft(
 }
 
 function withoutCustomDraft(state: QuestionnaireState, tab: number): ReadonlyMap<number, string> {
-  if (!state.customDraftsByTab.has(tab)) return state.customDraftsByTab;
+  if (!state.customDraftsByTab.has(tab)) {
+    return state.customDraftsByTab;
+  }
   const drafts = new Map(state.customDraftsByTab);
   drafts.delete(tab);
   return drafts;
@@ -189,9 +222,16 @@ function doneFor(state: QuestionnaireState, ctx: ApplyContext, cancelled: boolea
   const result: QuestionnaireResult = {
     answers: orderedAnswers(state, ctx.questions),
     cancelled,
-    ...(globalNote && globalNote.length > 0 ? { globalNote } : {}),
-    ...(unansweredNotes.length > 0 ? { unansweredNotes } : {}),
   };
+  if (globalNote && globalNote.length > 0) {
+    // SAFETY: globalNote is optional per QuestionnaireResult; present only when non-empty.
+    (result as QuestionnaireResult & { globalNote: string }).globalNote = globalNote;
+  }
+  if (unansweredNotes.length > 0) {
+    // SAFETY: unansweredNotes is optional per QuestionnaireResult; present only when non-empty.
+    (result as QuestionnaireResult & { unansweredNotes: UnansweredNote[] }).unansweredNotes =
+      unansweredNotes;
+  }
   return { state, effects: [{ kind: "done", result }] };
 }
 
@@ -218,7 +258,9 @@ const navHandler: Handler<"nav"> = (state, action, ctx) => {
     inputMode,
     customDraftsByTab,
   };
-  if (!inputMode) return { state: next, effects: [] };
+  if (!inputMode) {
+    return { state: next, effects: [] };
+  }
   return {
     state: next,
     effects: [{ kind: "set_input_buffer", value: customDraftValueFor(next, state.currentTab) }],
@@ -269,16 +311,23 @@ const confirmHandler: Handler<"confirm"> = (state, action, ctx) => {
     ...state,
     answers,
     customDraftsByTab,
-    ...(isCustomMulti ? { multiSelectChecked: new Set<number>() } : {}),
   };
-  if (action.autoAdvanceTab !== undefined) return switchTabResult(next, action.autoAdvanceTab, ctx);
+  if (isCustomMulti) {
+    next.multiSelectChecked = new Set<number>();
+  }
+  if (action.autoAdvanceTab !== undefined) {
+    return switchTabResult(next, action.autoAdvanceTab, ctx);
+  }
   return doneFor(next, ctx, false);
 };
 
 const toggleHandler: Handler<"toggle"> = (state, action, ctx) => {
   const checked = new Set(state.multiSelectChecked);
-  if (checked.has(action.index)) checked.delete(action.index);
-  else checked.add(action.index);
+  if (checked.has(action.index)) {
+    checked.delete(action.index);
+  } else {
+    checked.add(action.index);
+  }
   const intermediate: QuestionnaireState = { ...state, multiSelectChecked: checked };
   const answers = persistMultiSelectAnswer(intermediate, ctx);
   return { state: { ...intermediate, answers }, effects: [] };
@@ -286,24 +335,31 @@ const toggleHandler: Handler<"toggle"> = (state, action, ctx) => {
 
 const multiConfirmHandler: Handler<"multi_confirm"> = (state, action, ctx) => {
   const q = ctx.questions[state.currentTab];
-  if (!q) return { state, effects: [] };
+  if (!q) {
+    return { state, effects: [] };
+  }
   const pendingNotes = state.notesByTab.get(state.currentTab);
   const answers = new Map(state.answers);
-  answers.set(state.currentTab, {
+  const multiAnswer: QuestionAnswer = {
     questionIndex: state.currentTab,
     question: q.question,
     kind: "multi",
     answer: null,
     selected: action.selected,
-    ...(pendingNotes && pendingNotes.length > 0 ? { notes: pendingNotes } : {}),
-  });
+  };
+  if (pendingNotes && pendingNotes.length > 0) {
+    // SAFETY: notes is optional per QuestionAnswer; adding when present preserves the shape.
+    (multiAnswer as QuestionAnswer & { notes: string }).notes = pendingNotes;
+  }
+  answers.set(state.currentTab, multiAnswer);
   const synced: QuestionnaireState = {
     ...state,
     answers,
     multiSelectChecked: syncMultiSelectFromAnswers(answers, ctx.questions, state.currentTab),
   };
-  if (action.autoAdvanceTab !== undefined)
+  if (action.autoAdvanceTab !== undefined) {
     return switchTabResult(synced, action.autoAdvanceTab, ctx);
+  }
   return doneFor(synced, ctx, false);
 };
 
@@ -327,13 +383,16 @@ const notesExitHandler: Handler<"notes_exit"> = (state, _action, _ctx) => {
     const prev = answers.get(state.currentTab);
     if (prev?.notes) {
       const stripped = { ...prev };
-      delete (stripped as { notes?: string }).notes;
-      answers.set(state.currentTab, stripped);
+      const { notes: _removed, ...withoutNotes } = stripped;
+      // SAFETY: withoutNotes preserves all required QuestionAnswer fields; notes is optional and removed intentionally.
+      answers.set(state.currentTab, withoutNotes as QuestionAnswer);
     }
   } else {
     notes.set(state.currentTab, trimmed);
     const prev = answers.get(state.currentTab);
-    if (prev) answers.set(state.currentTab, { ...prev, notes: trimmed });
+    if (prev) {
+      answers.set(state.currentTab, { ...prev, notes: trimmed });
+    }
   }
   return {
     state: { ...state, notesByTab: notes, answers, notesVisible: false },
@@ -356,7 +415,9 @@ const toggleCollapsedHandler: Handler<"toggle_collapsed"> = (s, _a, _c) => ({
   effects: [{ kind: "set_overlay_hidden", hidden: !s.collapsed }],
 });
 const tickHandler: Handler<"tick"> = (state, action, ctx) => {
-  if (state.timerCancelled || state.deadline === undefined) return { state, effects: [] };
+  if (state.timerCancelled || state.deadline === undefined) {
+    return { state, effects: [] };
+  }
   const remaining = state.deadline - action.now;
   if (remaining > 0) {
     return { state: { ...state, remainingMs: remaining }, effects: [] };
@@ -366,8 +427,11 @@ const tickHandler: Handler<"tick"> = (state, action, ctx) => {
     answers: orderedAnswers(state, ctx.questions),
     cancelled: true,
     error: "timed_out",
-    ...(globalNote && globalNote.length > 0 ? { globalNote } : {}),
   };
+  if (globalNote && globalNote.length > 0) {
+    // SAFETY: globalNote is optional per QuestionnaireResult; present only when non-empty.
+    (result as QuestionnaireResult & { globalNote: string }).globalNote = globalNote;
+  }
   return { state, effects: [{ kind: "done", result }] };
 };
 const ignoreHandler: Handler<"ignore"> = (s, _a, _c) => ({ state: s, effects: [] });
@@ -378,7 +442,7 @@ const ignoreHandler: Handler<"ignore"> = (s, _a, _c) => ({ state: s, effects: []
  * compile here until a handler is registered, mirroring the `Record<RowKind, …>`
  * pattern used by `ROW_INTENT_META`.
  */
-const HANDLERS: { [K in QuestionnaireAction["kind"]]: Handler<K> } = {
+const HANDLERS = {
   nav: navHandler,
   input_clear: inputClearHandler,
   input_edit: inputEditHandler,
@@ -396,10 +460,10 @@ const HANDLERS: { [K in QuestionnaireAction["kind"]]: Handler<K> } = {
   toggle_collapsed: toggleCollapsedHandler,
   tick: tickHandler,
   ignore: ignoreHandler,
-};
+} satisfies { [K in QuestionnaireAction["kind"]]: Handler<K> };
 
 /**
- * Pure reducer: (state, action, ctx) → (state, Effect[]). Mirrors `rpiv-todo`'s `applyTaskMutation`.
+ * Pure reducer: (state, action, ctx) → (state, Effect[]).
  * Delegates to `HANDLERS` — per-kind handlers above are pure, named, and individually testable.
  * `ignore` is also handled outside the reducer by `handleIgnoreInline` in the runtime fast path.
  */
@@ -408,7 +472,9 @@ export function reduce(
   action: QuestionnaireAction,
   ctx: ApplyContext,
 ): ApplyResult {
+  // SAFETY: safe cast — value is validated at boundary or test fixture with known shape.
   const handler = HANDLERS[action.kind] as Handler<typeof action.kind>;
+  // SAFETY: safe cast — value is validated at boundary or test fixture with known shape.
   const result = handler(state, action as never, ctx);
   const isHumanKeystroke = action.kind !== "tick" && action.kind !== "toggle_collapsed";
   if (isHumanKeystroke && state.deadline !== undefined && !state.timerCancelled) {

package/src/tool/response-envelope.ts

@@ -37,32 +37,38 @@ export function buildQuestionnaireResponse(
   params: QuestionParams,
 ): ToolResult {
   if (result?.error === "timed_out") {
-    return buildToolResult(TIMED_OUT_MESSAGE, {
+    const details: QuestionnaireResult = {
       answers: result.answers,
       cancelled: true,
       error: "timed_out",
-      ...(result.globalNote && result.globalNote.length > 0
-        ? { globalNote: result.globalNote }
-        : {}),
-      ...(result.unansweredNotes && result.unansweredNotes.length > 0
-        ? { unansweredNotes: result.unansweredNotes }
-        : {}),
-    });
+    };
+    if (result.globalNote && result.globalNote.length > 0) {
+      (details as { globalNote: string }).globalNote = result.globalNote;
+    }
+    if (result.unansweredNotes && result.unansweredNotes.length > 0) {
+      (details as { unansweredNotes: typeof result.unansweredNotes }).unansweredNotes =
+        result.unansweredNotes;
+    }
+    return buildToolResult(TIMED_OUT_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.
-    return buildToolResult(DECLINE_MESSAGE, {
+    const details: QuestionnaireResult = {
       answers: result?.answers ?? [],
       cancelled: true,
-      ...(result?.error ? { error: result.error } : {}),
-      ...(result?.globalNote && result.globalNote.length > 0
-        ? { globalNote: result.globalNote }
-        : {}),
-      ...(result?.unansweredNotes && result.unansweredNotes.length > 0
-        ? { unansweredNotes: result.unansweredNotes }
-        : {}),
-    });
+    };
+    if (result?.error) {
+      (details as { error: typeof result.error }).error = result.error;
+    }
+    if (result?.globalNote && result.globalNote.length > 0) {
+      (details as { globalNote: string }).globalNote = result.globalNote;
+    }
+    if (result?.unansweredNotes && result.unansweredNotes.length > 0) {
+      (details as { unansweredNotes: typeof result.unansweredNotes }).unansweredNotes =
+        result.unansweredNotes;
+    }
+    return buildToolResult(DECLINE_MESSAGE, details);
   }
 
   const segments: string[] = [];
@@ -79,7 +85,9 @@ export function buildQuestionnaireResponse(
     // 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);
-    if (n) segments.push(buildUnansweredNoteSegment(n));
+    if (n) {
+      segments.push(buildUnansweredNoteSegment(n));
+    }
   }
   if (result.globalNote && result.globalNote.length > 0) {
     // Raw multiline echo, no reformatting, trailing period matching the shape
@@ -98,8 +106,12 @@ export function buildQuestionnaireResponse(
  */
 export function buildAnswerSegment(a: QuestionAnswer): string {
   const parts: string[] = [`"${a.question}"="${formatAnswerScalar(a, "envelope")}"`];
-  if (a.preview && a.preview.length > 0) parts.push(`selected preview: ${a.preview}`);
-  if (a.notes && a.notes.length > 0) parts.push(`user notes: ${a.notes}`);
+  if (a.preview && a.preview.length > 0) {
+    parts.push(`selected preview: ${a.preview}`);
+  }
+  if (a.notes && a.notes.length > 0) {
+    parts.push(`user notes: ${a.notes}`);
+  }
   return `${parts.join(". ")}.`;
 }
 

package/src/tool/types.ts

@@ -1,6 +1,14 @@
 import { type Static, Type } from "typebox";
 import { LABELS_BY_KIND, ROW_INTENT_META } from "../state/row-intent.js";
 
+type JsonValue =
+  | string
+  | number
+  | boolean
+  | null
+  | JsonValue[]
+  | { readonly [key: string]: JsonValue };
+
 export const MAX_QUESTIONS = 4;
 export const MIN_OPTIONS = 2;
 export const MAX_OPTIONS = 4;
@@ -187,7 +195,10 @@ export interface QuestionnaireResult {
 }
 
 export function isQuestionnaireResult(value: unknown): value is QuestionnaireResult {
-  if (!value || typeof value !== "object") return false;
-  const v = value as Record<string, unknown>;
+  if (!value || typeof value !== "object") {
+    return false;
+  }
+  // SAFETY: boundary check for QuestionnaireResult; value is validated as object with required fields before use.
+  const v = value as Record<string, JsonValue>;
   return Array.isArray(v.answers) && typeof v.cancelled === "boolean";
 }

package/src/view/component-binding.ts

@@ -44,7 +44,9 @@ export function globalBinding<P>(spec: ComponentBinding<P>): BoundGlobalBinding
 export function perTabBinding<P>(spec: PerTabBinding<P>): BoundPerTabBinding {
   return {
     apply: (state, ctx) => {
-      if (spec.predicate && !spec.predicate(state, ctx)) return;
+      if (spec.predicate && !spec.predicate(state, ctx)) {
+        return;
+      }
       spec.resolve(ctx.tab)?.setProps(spec.select(state, ctx));
     },
   };

package/src/view/components/inline-input.ts

@@ -27,7 +27,9 @@ export interface RenderInlineInputOptions {
  * Mirrors the original wrapping-select.resolveOffset exactly.
  */
 function resolveCursorOffset(buffer: string, requested: number | undefined): number {
-  if (requested !== undefined && requested >= 0 && requested <= buffer.length) return requested;
+  if (requested !== undefined && requested >= 0 && requested <= buffer.length) {
+    return requested;
+  }
   return buffer.length;
 }
 

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

@@ -96,7 +96,9 @@ export class MultiSelectView implements StatefulView<MultiSelectViewProps> {
   }
 
   private layout(width: number): MultiSelectLayout {
-    if (this.cachedLayout?.width === width) return this.cachedLayout.value;
+    if (this.cachedLayout?.width === width) {
+      return this.cachedLayout.value;
+    }
 
     const build: MultiSelectBuild = { lines: [], focusedRange: [0, 0] };
     const contentWidth = Math.max(1, width - this.prefixVisibleWidth());
@@ -106,7 +108,9 @@ export class MultiSelectView implements StatefulView<MultiSelectViewProps> {
 
     const otherStart = build.lines.length;
     build.lines.push(...this.renderOtherRow(contentWidth, numberWidth));
-    if (this.props.other.active) build.focusedRange = [otherStart, build.lines.length];
+    if (this.props.other.active) {
+      build.focusedRange = [otherStart, build.lines.length];
+    }
 
     this.appendNextRow(build, width);
 
@@ -124,7 +128,9 @@ export class MultiSelectView implements StatefulView<MultiSelectViewProps> {
     for (let i = 0; i < this.question.options.length; i++) {
       const opt = this.question.options[i];
       const row = this.props.rows[i];
-      if (!opt || !row) continue;
+      if (!opt || !row) {
+        continue;
+      }
       const start = build.lines.length;
       const pointer = row.active ? this.theme.fg("accent", ACTIVE_POINTER) : INACTIVE_POINTER;
       // Checked and active rows share the accent hue, matching the dialog's selection rhythm.
@@ -146,7 +152,9 @@ export class MultiSelectView implements StatefulView<MultiSelectViewProps> {
           build.lines.push(CONTINUATION_INDENT + this.theme.fg("muted", segment));
         }
       }
-      if (row.active) build.focusedRange = [start, build.lines.length];
+      if (row.active) {
+        build.focusedRange = [start, build.lines.length];
+      }
     }
   }
 
@@ -159,7 +167,9 @@ export class MultiSelectView implements StatefulView<MultiSelectViewProps> {
       ? this.theme.fg("accent", this.theme.bold(this.props.nextLabel))
       : this.props.nextLabel;
     build.lines.push(truncateToWidth(`${nextPointer}${nextLabel}`, width, ""));
-    if (this.props.nextActive) build.focusedRange = [nextStart, build.lines.length];
+    if (this.props.nextActive) {
+      build.focusedRange = [nextStart, build.lines.length];
+    }
   }
 
   private renderOtherRow(contentWidth: number, numberWidth: number): string[] {

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

@@ -3,6 +3,8 @@ import { Markdown, type MarkdownTheme, visibleWidth } from "@earendil-works/pi-t
 import type { QuestionData } from "../../../tool/types.js";
 import { stripFenceMarkers } from "./preview-box-renderer.js";
 
+export type MarkdownFactory = (text: string, markdownTheme: MarkdownTheme) => Markdown;
+
 /** CC parity in side-by-side layout. */
 export const MAX_PREVIEW_HEIGHT_SIDE_BY_SIDE = 20;
 /** Preserves narrow-terminal protection in stacked layout. */
@@ -22,18 +24,27 @@ export const NOTES_AFFORDANCE_OVERHEAD = 2;
  */
 export class MarkdownContentCache {
   private readonly previewTexts: Map<number, string>;
-  private readonly markdownCache: Map<number, Markdown>;
+  private readonly markdownCache: Map<number, ReturnType<MarkdownFactory>>;
   private cachedWidth: number | undefined;
   private readonly theme: Theme;
   private readonly markdownTheme: MarkdownTheme;
+  private readonly markdownFactory: MarkdownFactory;
 
-  constructor(question: QuestionData, theme: Theme, markdownTheme: MarkdownTheme) {
+  constructor(
+    question: QuestionData,
+    theme: Theme,
+    markdownTheme: MarkdownTheme,
+    markdownFactory: MarkdownFactory = (text, mt) => new Markdown(text, 0, 0, mt),
+  ) {
     this.theme = theme;
     this.markdownTheme = markdownTheme;
+    this.markdownFactory = markdownFactory;
     this.previewTexts = new Map();
     for (let i = 0; i < question.options.length; i++) {
       const raw = question.options[i]?.preview;
-      if (raw && raw.length > 0) this.previewTexts.set(i, raw);
+      if (raw && raw.length > 0) {
+        this.previewTexts.set(i, raw);
+      }
     }
     this.markdownCache = new Map();
   }
@@ -52,7 +63,9 @@ export class MarkdownContentCache {
    */
   bodyFor(optionIndex: number, innerWidth: number): string[] {
     if (this.cachedWidth !== innerWidth) {
-      for (const md of this.markdownCache.values()) md.invalidate();
+      for (const md of this.markdownCache.values()) {
+        md.invalidate();
+      }
       this.cachedWidth = innerWidth;
     }
     const text = this.previewTexts.get(optionIndex);
@@ -63,14 +76,16 @@ export class MarkdownContentCache {
     }
     let md = this.markdownCache.get(optionIndex);
     if (!md) {
-      md = new Markdown(text, 0, 0, this.markdownTheme);
+      md = this.markdownFactory(text, this.markdownTheme);
       this.markdownCache.set(optionIndex, md);
     }
     return stripFenceMarkers(md.render(innerWidth));
   }
 
   invalidate(): void {
-    for (const md of this.markdownCache.values()) md.invalidate();
+    for (const md of this.markdownCache.values()) {
+      md.invalidate();
+    }
     this.cachedWidth = undefined;
   }
 }

package/src/view/components/preview/preview-block-renderer.ts

@@ -5,6 +5,7 @@ import {
   MAX_PREVIEW_HEIGHT_SIDE_BY_SIDE,
   MAX_PREVIEW_HEIGHT_STACKED,
   MarkdownContentCache,
+  type MarkdownFactory,
   NOTES_AFFORDANCE_OVERHEAD,
 } from "./markdown-content-cache.js";
 import {
@@ -38,6 +39,7 @@ export interface PreviewBlockRendererConfig {
   question: QuestionData;
   theme: Theme;
   markdownTheme: MarkdownTheme;
+  markdownFactory?: MarkdownFactory;
 }
 
 /**
@@ -56,7 +58,12 @@ export class PreviewBlockRenderer {
 
   constructor(config: PreviewBlockRendererConfig) {
     this.theme = config.theme;
-    this.cache = new MarkdownContentCache(config.question, config.theme, config.markdownTheme);
+    this.cache = new MarkdownContentCache(
+      config.question,
+      config.theme,
+      config.markdownTheme,
+      config.markdownFactory,
+    );
   }
 
   hasAnyPreview(): boolean {

package/src/view/components/preview/preview-box-renderer.ts

@@ -73,14 +73,13 @@ export function renderBorderedBox(
  * `Markdown.render(width)` pads every line to `width`, which would otherwise force
  * the box to fill the whole column allocation.
  */
-export function computeBoxDimensions(
-  contentLines: readonly string[],
-  maxInnerWidth: number,
-): { innerWidth: number; boxWidth: number } {
+export function computeBoxDimensions(contentLines: readonly string[], maxInnerWidth: number) {
   let widest = Math.min(BOX_MIN_CONTENT_WIDTH, maxInnerWidth);
   for (const line of contentLines) {
     const w = visibleWidth(line.replace(/\s+$/, ""));
-    if (w > widest) widest = w;
+    if (w > widest) {
+      widest = w;
+    }
   }
   const innerWidth = Math.min(widest, maxInnerWidth);
   const boxWidth = innerWidth + BORDER_HORIZONTAL_OVERHEAD + 2 * BORDER_INNER_PADDING_HORIZONTAL;

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

@@ -61,7 +61,9 @@ export function adaptiveLeftWidth(
   let maxLabel = 0;
   for (const item of items) {
     const w = visibleWidth(item.label);
-    if (w > maxLabel) maxLabel = w;
+    if (w > maxLabel) {
+      maxLabel = w;
+    }
   }
   const desired = maxLabel + prefixW + confirmedOverhead;
   const ratioCapped = Math.min(desired, Math.floor(paneWidth * MAX_LEFT_RATIO));
@@ -88,7 +90,9 @@ export function crossTabMaxLeftWidth(
     const items = itemsByTab[i] ?? [];
     const totalForNumbering = items.length;
     const tabWidth = adaptiveLeftWidth(items, totalForNumbering, paneWidth);
-    if (tabWidth > max) max = tabWidth;
+    if (tabWidth > max) {
+      max = tabWidth;
+    }
   }
   return max;
 }
@@ -108,10 +112,14 @@ export function previewSourceWidth(question: QuestionData): number {
   let max = 0;
   for (const option of question.options) {
     const text = option.preview;
-    if (!text) continue;
+    if (!text) {
+      continue;
+    }
     for (const line of text.split("\n")) {
       const w = visibleWidth(line);
-      if (w > max) max = w;
+      if (w > max) {
+        max = w;
+      }
     }
   }
   return max;
@@ -138,7 +146,9 @@ export function crossTabPreviewBudget(
       BORDER_HORIZONTAL_OVERHEAD +
       2 * BORDER_INNER_PADDING_HORIZONTAL +
       PREVIEW_PADDING_LEFT;
-    if (budget > max) max = budget;
+    if (budget > max) {
+      max = budget;
+    }
   }
   return max;
 }
@@ -193,10 +203,7 @@ export function crossTabLeftWidthWithDonation(
  * cross-tab aggregated). The Math.max(1, ...) calls keep both columns >= 1 col on
  * extreme inputs.
  */
-export function columnWidths(
-  paneWidth: number,
-  adaptiveLeft: number,
-): { leftWidth: number; rightWidth: number; gap: number } {
+export function columnWidths(paneWidth: number, adaptiveLeft: number) {
   const gap = PREVIEW_COLUMN_GAP;
   const leftWidth = Math.min(adaptiveLeft, Math.max(1, paneWidth - gap - 1));
   const rightWidth = Math.max(1, paneWidth - leftWidth - gap);
@@ -208,12 +215,10 @@ export function columnWidths(
  * `render()`. Stacked uses the full pane width for both; side-by-side splits via
  * `columnWidths`, with the preview column offset by `PREVIEW_PADDING_LEFT`.
  */
-export function bodyWidths(
-  paneWidth: number,
-  mode: PreviewLayoutMode,
-  adaptiveLeft: number,
-): { optionsWidth: number; previewWidth: number } {
-  if (mode === "stacked") return { optionsWidth: paneWidth, previewWidth: paneWidth };
+export function bodyWidths(paneWidth: number, mode: PreviewLayoutMode, adaptiveLeft: number) {
+  if (mode === "stacked") {
+    return { optionsWidth: paneWidth, previewWidth: paneWidth };
+  }
   const { leftWidth, rightWidth } = columnWidths(paneWidth, adaptiveLeft);
   return { optionsWidth: leftWidth, previewWidth: Math.max(1, rightWidth - PREVIEW_PADDING_LEFT) };
 }