@pugi/cli 0.1.0-beta.8 → 0.1.0-beta.88

package/dist/tui/ask-modal.js

@@ -1,17 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
- * Office-hours forcing questions + plan-review modals - Sprint α6.3.
+ * Office-hours forcing questions + plan-review modals - Sprint .
  *
  * Two Ink components feed by the parsed `<pugi-ask>` / `<pugi-plan-review>`
  * tag records the session module extracts from persona output.
  *
- *   - <AskModal />: numbered options (1-4) + optional "Other" custom-input
- *     fallback. Operator types `1`, `2`, `3`, `4`, or `o <free text>`.
+ *  - <AskModal />: numbered options (1-4) + optional "Other" custom-input
+ *    fallback. Operator types `1`, `2`, `3`, `4`, or `o <free text>`.
  *
- *   - <PlanReviewModal />: numbered steps + optional risk callout +
- *     three-way verdict `[a] approve · [m] modify · [c] cancel`.
- *     Operator types `a`, `m`, or `c`. `m` opens a free-text editor;
- *     the operator's edited text is returned verbatim to the session.
+ *  - <PlanReviewModal />: numbered steps + optional risk callout +
+ *    three-way verdict `[a] approve · [m] modify · [c] cancel`.
+ *    Operator types `a`, `m`, or `c`. `m` opens a free-text editor;
+ *    the operator's edited text is returned verbatim to the session.
  *
  * Both components are PURE in the Ink sense — they read props + own
  * useState for the input buffer, and emit one final `onResolve` callback
@@ -85,7 +85,7 @@ export function AskModal(props) {
             setBuffer((prev) => prev + input);
         }
     }, { isActive: props.inert !== true });
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "yellow", paddingX: 1, children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, color: "yellow", children: '? ' }), _jsx(Text, { bold: true, children: 'Need your call before I continue' })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { children: props.tag.question }) }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [props.tag.options.map((opt, idx) => (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { color: "cyan", bold: true, children: `  ${idx + 1}. ` }), _jsx(Text, { children: opt.label })] }), opt.desc ? (_jsx(Box, { marginLeft: 5, children: _jsx(Text, { dimColor: true, children: opt.desc }) })) : null] }, opt.value))), _jsxs(Box, { children: [_jsx(Text, { color: "cyan", bold: true, children: `  ${props.tag.options.length + 1}. ` }), _jsx(Text, { dimColor: true, children: 'Other (type a custom answer)' })] })] }), mode === 'pick' ? (_jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: `Press 1-${props.tag.options.length + 1} to choose. Esc cancels.` }) })) : (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Box, { children: [_jsx(Text, { color: "cyan", children: '> ' }), _jsx(Text, { children: buffer }), _jsx(Text, { inverse: true, children: ' ' })] }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: 'Type your custom answer. Enter submits. Esc cancels.' }) })] }))] }));
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "yellow", paddingX: 1, children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, color: "yellow", children: '? ' }), _jsx(Text, { bold: true, children: 'Need your call before I continue' })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { children: props.tag.question }) }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [props.tag.options.map((opt, idx) => (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { color: "#3da9fc", bold: true, children: ` ${idx + 1}. ` }), _jsx(Text, { children: opt.label })] }), opt.desc ? (_jsx(Box, { marginLeft: 5, children: _jsx(Text, { dimColor: true, children: opt.desc }) })) : null] }, opt.value))), _jsxs(Box, { children: [_jsx(Text, { color: "#3da9fc", bold: true, children: ` ${props.tag.options.length + 1}. ` }), _jsx(Text, { dimColor: true, children: 'Other (type a custom answer)' })] })] }), mode === 'pick' ? (_jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: `Press 1-${props.tag.options.length + 1} to choose. Esc cancels.` }) })) : (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Box, { children: [_jsx(Text, { color: "#3da9fc", children: '> ' }), _jsx(Text, { children: buffer }), _jsx(Text, { inverse: true, children: ' ' })] }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: 'Type your custom answer. Enter submits. Esc cancels.' }) })] }))] }));
 }
 export function PlanReviewModal(props) {
     const [mode, setMode] = useState('pick');
@@ -130,10 +130,10 @@ export function PlanReviewModal(props) {
             setBuffer((prev) => prev + input);
         }
     }, { isActive: props.inert !== true });
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "magenta", paddingX: 1, children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, color: "magenta", children: '? ' }), _jsx(Text, { bold: true, children: 'Plan review - approve before I execute' })] }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { dimColor: true, children: 'Steps:' }), props.tag.steps.map((step, idx) => (_jsxs(Box, { children: [_jsx(Text, { color: "cyan", bold: true, children: `  ${idx + 1}. ` }), _jsx(Text, { children: step.text })] }, `step-${idx}`)))] }), props.tag.risk ? (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { bold: true, color: "red", children: 'Risk:' }), _jsx(Box, { marginLeft: 2, children: _jsx(Text, { children: props.tag.risk }) })] })) : null, mode === 'pick' ? (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { color: "green", bold: true, children: '  [a] approve  ' }), _jsx(Text, { color: "yellow", bold: true, children: '[m] modify  ' }), _jsx(Text, { color: "red", bold: true, children: '[c] cancel' })] }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: 'Press a, m, or c. Esc cancels.' }) })] })) : (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Box, { children: [_jsx(Text, { color: "yellow", children: 'modify > ' }), _jsx(Text, { children: buffer }), _jsx(Text, { inverse: true, children: ' ' })] }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: 'Type the revision. Enter submits. Esc cancels.' }) })] }))] }));
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "magenta", paddingX: 1, children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, color: "magenta", children: '? ' }), _jsx(Text, { bold: true, children: 'Plan review - approve before I execute' })] }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { dimColor: true, children: 'Steps:' }), props.tag.steps.map((step, idx) => (_jsxs(Box, { children: [_jsx(Text, { color: "#3da9fc", bold: true, children: ` ${idx + 1}. ` }), _jsx(Text, { children: step.text })] }, `step-${idx}`)))] }), props.tag.risk ? (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { bold: true, color: "red", children: 'Risk:' }), _jsx(Box, { marginLeft: 2, children: _jsx(Text, { children: props.tag.risk }) })] })) : null, mode === 'pick' ? (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { color: "green", bold: true, children: ' [a] approve ' }), _jsx(Text, { color: "yellow", bold: true, children: '[m] modify ' }), _jsx(Text, { color: "red", bold: true, children: '[c] cancel' })] }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: 'Press a, m, or c. Esc cancels.' }) })] })) : (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Box, { children: [_jsx(Text, { color: "yellow", children: 'modify > ' }), _jsx(Text, { children: buffer }), _jsx(Text, { inverse: true, children: ' ' })] }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: 'Type the revision. Enter submits. Esc cancels.' }) })] }))] }));
 }
 /* ------------------------------------------------------------------ */
-/* Verdict serialisation                                              */
+/* Verdict serialisation                                             */
 /* ------------------------------------------------------------------ */
 /**
  * Encode an ask-modal verdict into the literal string the session
@@ -142,14 +142,14 @@ export function PlanReviewModal(props) {
  * a side channel.
  *
  * Examples:
- *   { value: 'vercel' }              -> "[ASK-RESPONSE:vercel]"
- *   { value: '', customInput: 'gcp'} -> "[ASK-RESPONSE:other] gcp"
- *   { cancelled: true }              -> "[ASK-RESPONSE:cancelled]"
+ *  { value: 'vercel' }             -> "[ASK-RESPONSE:vercel]"
+ *  { value: '', customInput: 'gcp'} -> "[ASK-RESPONSE:other] gcp"
+ *  { cancelled: true }             -> "[ASK-RESPONSE:cancelled]"
  *
  * customInput is stripped of any leading `[ASK-RESPONSE:...]` /
  * `[PLAN-VERDICT:...]` pattern so a forged operator prefix cannot be
  * read as a different verdict by a prefix-greedy persona (Claude
- * triple-review P1, PR #375).
+ * triple-review P1, PR).
  */
 export function encodeAskVerdict(verdict) {
     if (verdict.cancelled)

package/dist/tui/ask-user-question-chips.js

@@ -0,0 +1,257 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * AskUserQuestionChips — multi-question short-format chip renderer
+ * for the structured AskUserQuestion tool (PUGI-480).
+ *
+ * Renders up to 3 question chips side-by-side, each with up to ~5 short
+ * (≤ 5-word) option labels. Replaces paragraph-wall prompts с a compact
+ * keyboard-driven picker:
+ *
+ *   Pugi: 2 quick choices
+ *    ┌────────────────────────┐
+ *    │ Stack                  │
+ *    │ ▸ 1 Browser JS         │
+ *    │   2 React              │
+ *    │   3 Other...           │
+ *    └────────────────────────┘
+ *    ┌────────────────────────┐
+ *    │ Size                   │
+ *    │ ▸ 1 9x9 (classic)      │
+ *    │   2 16x16              │
+ *    │   3 Custom             │
+ *    └────────────────────────┘
+ *    [Enter] use highlighted defaults  ·  [↑↓] navigate  ·  [s] skip
+ *
+ * Contract:
+ *  - questions[].options[].label MUST be ≤ 5 words (renderer truncates
+ *    overflow с ellipsis defensively; the schema validator rejects at
+ *    the tool entry point so the model never produces overflow legally).
+ *  - First option of each question is pre-highlighted (default).
+ *  - Enter без movement applies defaults across ALL questions.
+ *  - 1-9 jump к the matching option in the focused question.
+ *  - ↑↓ navigate within the focused question.
+ *  - ←→ (and Tab/Shift-Tab) move between questions.
+ *  - [s] skips the focused question (uses its default) and advances to
+ *    the next; [s] on the last question commits.
+ *  - [Esc] cancels the entire dialog (user_cancelled).
+ *
+ * Non-TTY fallback: when the `forceFallback` prop is true, renders a
+ * static numbered text list and does NOT mount the Ink useInput hook.
+ * The component itself does NOT sniff `process.stdin.isTTY` — that gate
+ * lives in the upstream REPL wiring, which either mounts this chip
+ * component (TTY path) or emits the legacy `[user_input_required]`
+ * envelope (non-TTY path). Keeping the gate в the caller keeps the
+ * component testable under ink-testing-library (which mocks stdin but
+ * не sets isTTY).
+ *
+ * Brand voice gate: ASCII glyphs only, zero attribution to external AIs,
+ * no em-dashes. Power-word neutral so localised variants land cleanly.
+ */
+import { useMemo, useState } from 'react';
+import { Box, Text, useInput } from 'ink';
+/**
+ * Hard truncation cap. The schema validator enforces ≤ 5 words per
+ * label, but the renderer still defends in depth: a malicious or
+ * legacy payload with a 14-word label MUST not blow the chip width.
+ */
+export const ASK_CHIPS_LABEL_WORD_CAP = 5;
+export const ASK_CHIPS_LABEL_CHAR_CAP = 22;
+export const ASK_CHIPS_QUESTION_CAP = 3;
+export const ASK_CHIPS_SKIP_LABEL = 'Skip — use defaults';
+/**
+ * Truncate a label к the configured word / character caps. Always
+ * append "…" when truncation happens so the operator knows the chip
+ * is hiding content.
+ */
+export function truncateLabel(raw) {
+    const trimmed = raw.trim().replace(/\s+/gu, ' ');
+    // Word cap (whitespace-delimited). 5-word rule is the canonical limit.
+    const words = trimmed.split(' ');
+    let candidate = trimmed;
+    if (words.length > ASK_CHIPS_LABEL_WORD_CAP) {
+        candidate = `${words.slice(0, ASK_CHIPS_LABEL_WORD_CAP).join(' ')}…`;
+    }
+    // Char cap (defense-in-depth — protects chip width even с short-word
+    // payloads like "AAAAAAAAAAAAAAAAAAAAA" that pass the word gate).
+    if (candidate.length > ASK_CHIPS_LABEL_CHAR_CAP) {
+        candidate = `${candidate.slice(0, ASK_CHIPS_LABEL_CHAR_CAP - 1)}…`;
+    }
+    return candidate;
+}
+/**
+ * The component renders в interactive mode by default. The non-TTY
+ * gate is the caller's responsibility — see ask-user-question-chips.tsx
+ * header docs. Production REPL wiring should check `process.stdin.isTTY`
+ * upstream и pass `forceFallback={true}` when stdin is not a TTY, OR
+ * skip mounting the chip component entirely и emit the legacy
+ * `[user_input_required]` envelope.
+ */
+function shouldUseFallback(forceFallback) {
+    return forceFallback === true;
+}
+/**
+ * Build the default selections vector (all first options) so Enter
+ * без movement applies a coherent set, and so non-TTY fallback can
+ * commit immediately.
+ */
+function buildDefaults(questions) {
+    return questions.map((q) => {
+        const first = q.options[0];
+        return {
+            header: q.header,
+            pickedIndex: 0,
+            pickedLabel: first ? truncateLabel(first.label) : '',
+            skipped: false,
+        };
+    });
+}
+export function AskUserQuestionChips(props) {
+    const useFallback = shouldUseFallback(props.forceFallback);
+    // Defensive cap: never render more than ASK_CHIPS_QUESTION_CAP chips.
+    // Schema enforces this at the tool boundary; the renderer still trims
+    // в case a legacy / malicious payload sneaks through.
+    const questions = useMemo(() => props.questions.slice(0, ASK_CHIPS_QUESTION_CAP), [props.questions]);
+    // Cursor state: which question is focused, and which option within
+    // each question is highlighted. Initialised к first option (default).
+    const [focusedQuestion, setFocusedQuestion] = useState(0);
+    const [cursorPerQuestion, setCursorPerQuestion] = useState(() => questions.map(() => 0));
+    // Per-question explicit skip flag. Skipped questions still emit their
+    // default index, but flagged `skipped: true` so downstream can audit.
+    const [skipped, setSkipped] = useState(() => questions.map(() => false));
+    function commit(skipMask = skipped) {
+        const selections = questions.map((q, qIdx) => {
+            const optionIdx = cursorPerQuestion[qIdx] ?? 0;
+            const opt = q.options[optionIdx] ?? q.options[0];
+            return {
+                header: q.header,
+                pickedIndex: optionIdx,
+                pickedLabel: opt ? truncateLabel(opt.label) : '',
+                skipped: skipMask[qIdx] === true,
+            };
+        });
+        props.onResolve({ selections, cancelled: false });
+    }
+    function cancel() {
+        props.onResolve({ selections: buildDefaults(questions), cancelled: true });
+    }
+    useInput((input, key) => {
+        // Esc cancels the entire AskUserQuestion (user_cancelled).
+        if (key.escape) {
+            cancel();
+            return;
+        }
+        // Enter commits the current selection (applies defaults across
+        // any questions the operator did not touch).
+        if (key.return) {
+            commit();
+            return;
+        }
+        // [s] skips the focused question (uses default), advances to next.
+        // [s] on the LAST question commits the whole set.
+        if (input === 's' || input === 'S') {
+            const nextSkipped = skipped.slice();
+            nextSkipped[focusedQuestion] = true;
+            if (focusedQuestion >= questions.length - 1) {
+                setSkipped(nextSkipped);
+                commit(nextSkipped);
+                return;
+            }
+            setSkipped(nextSkipped);
+            setFocusedQuestion((q) => Math.min(q + 1, questions.length - 1));
+            return;
+        }
+        // ↑/↓ navigate within the focused question.
+        if (key.upArrow) {
+            setCursorPerQuestion((prev) => {
+                const next = prev.slice();
+                const opts = questions[focusedQuestion]?.options ?? [];
+                const len = opts.length;
+                if (len === 0)
+                    return prev;
+                const cur = next[focusedQuestion] ?? 0;
+                next[focusedQuestion] = (cur - 1 + len) % len;
+                return next;
+            });
+            return;
+        }
+        if (key.downArrow) {
+            setCursorPerQuestion((prev) => {
+                const next = prev.slice();
+                const opts = questions[focusedQuestion]?.options ?? [];
+                const len = opts.length;
+                if (len === 0)
+                    return prev;
+                const cur = next[focusedQuestion] ?? 0;
+                next[focusedQuestion] = (cur + 1) % len;
+                return next;
+            });
+            return;
+        }
+        // ←/→ (or Tab/Shift-Tab) navigate between questions.
+        if (key.leftArrow || (key.shift && key.tab)) {
+            setFocusedQuestion((q) => (q - 1 + questions.length) % questions.length);
+            return;
+        }
+        if (key.rightArrow || key.tab) {
+            setFocusedQuestion((q) => (q + 1) % questions.length);
+            return;
+        }
+        // 1-9 jumps к the matching option in the focused question.
+        const numeric = Number.parseInt(input, 10);
+        if (!Number.isNaN(numeric) && numeric >= 1 && numeric <= 9) {
+            const opts = questions[focusedQuestion]?.options ?? [];
+            const target = numeric - 1;
+            if (target >= 0 && target < opts.length) {
+                setCursorPerQuestion((prev) => {
+                    const next = prev.slice();
+                    next[focusedQuestion] = target;
+                    return next;
+                });
+            }
+            return;
+        }
+    }, { isActive: props.inert !== true && useFallback === false });
+    // ─── Non-TTY fallback ────────────────────────────────────────────────
+    // When stdin is not a TTY we still need to render SOMETHING — but
+    // we cannot drive keystrokes, so we emit a numbered text list per
+    // question and let the upstream envelope handler ask the operator.
+    if (useFallback) {
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { children: _jsx(Text, { bold: true, children: `Pugi: ${questions.length} quick ${questions.length === 1 ? 'choice' : 'choices'}` }) }), questions.map((q, qIdx) => (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { bold: true, color: "cyan", children: `${q.header}` }), q.options.map((opt, oIdx) => (_jsx(Text, { children: `  ${oIdx + 1}. ${truncateLabel(opt.label)}${oIdx === 0 ? ' (default)' : ''}` }, `q-${qIdx}-o-${oIdx}`)))] }, `q-${qIdx}-${q.header}`))), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, italic: true, children: `(non-interactive — defaults apply)` }) })] }));
+    }
+    // ─── Interactive Ink render ─────────────────────────────────────────
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { children: _jsx(Text, { bold: true, children: `Pugi: ${questions.length} quick ${questions.length === 1 ? 'choice' : 'choices'}` }) }), _jsx(Box, { flexDirection: "row", marginTop: 1, children: questions.map((q, qIdx) => {
+                    const isFocused = qIdx === focusedQuestion;
+                    const cursor = cursorPerQuestion[qIdx] ?? 0;
+                    const isSkipped = skipped[qIdx] === true;
+                    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: isFocused ? 'cyan' : 'gray', paddingX: 1, marginRight: 1, minWidth: 24, children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, color: isFocused ? 'cyan' : undefined, children: q.header }), isSkipped ? (_jsx(Text, { dimColor: true, italic: true, children: ' (skipped)' })) : null] }), q.options.map((opt, oIdx) => {
+                                const isHighlighted = isFocused && oIdx === cursor;
+                                const label = truncateLabel(opt.label);
+                                const isSkipOption = label === ASK_CHIPS_SKIP_LABEL ||
+                                    opt.label === ASK_CHIPS_SKIP_LABEL;
+                                return (_jsxs(Box, { children: [_jsx(Text, { color: isHighlighted ? 'cyan' : undefined, bold: isHighlighted, children: isHighlighted ? '▸ ' : '  ' }), _jsx(Text, { color: isHighlighted ? 'cyan' : undefined, children: `${oIdx + 1} ` }), isSkipOption ? (_jsx(Text, { dimColor: true, italic: true, children: label })) : (_jsx(Text, { bold: isHighlighted, children: label }))] }, `opt-${qIdx}-${oIdx}-${opt.label}`));
+                            })] }, `chip-${qIdx}-${q.header}`));
+                }) }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: `[Enter] use highlighted defaults  ·  [↑↓] navigate  ·  [←→] switch  ·  [s] skip  ·  [Esc] cancel` }) })] }));
+}
+/**
+ * Encode the chip verdict into the persona-recognisable turn-injection
+ * string. Mirrors `encodeAskUserQuestionVerdict` from the single-question
+ * prompt so the model sees a consistent grammar.
+ *
+ * Examples:
+ *  - { cancelled: true } → "[ASK-USER-QUESTION:cancelled]"
+ *  - All defaults       → "[ASK-USER-QUESTION:answered] Stack=Browser JS; Size=9x9 (classic)"
+ *  - One skipped        → "[ASK-USER-QUESTION:answered] Stack=Browser JS; Size=(skipped: 9x9)"
+ */
+export function encodeAskUserQuestionChipsVerdict(result) {
+    if (result.cancelled)
+        return '[ASK-USER-QUESTION:cancelled]';
+    if (result.selections.length === 0)
+        return '[ASK-USER-QUESTION:cancelled]';
+    const parts = result.selections.map((sel) => {
+        if (sel.skipped)
+            return `${sel.header}=(skipped: ${sel.pickedLabel})`;
+        return `${sel.header}=${sel.pickedLabel}`;
+    });
+    return `[ASK-USER-QUESTION:answered] ${parts.join('; ')}`;
+}
+//# sourceMappingURL=ask-user-question-chips.js.map

package/dist/tui/ask-user-question-prompt.js

@@ -0,0 +1,203 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * AskUserQuestionPrompt — Ink modal for the structured tool grammar
+ * (, ).
+ *
+ * Renders the four required elements of an standard clarifier:
+ *  1. A short "header" chip at the top (e.g. "Auth method"). Max 12
+ *     chars by schema, fits one line at the standard 80-col REPL width.
+ *  2. The full question prose (must end "?"). Word-wrapped by Ink.
+ *  3. The 2-4 options as a selectable list with j/k navigation. Each
+ *     option shows the `label` (bright) + `description` (dim).
+ *  4. An auto-appended "Other" row that the operator can pick to type
+ *     a custom answer. The model NEVER emits this — the UI owns it.
+ *
+ * Multi-select mode: when `multiSelect=true`, space toggles the
+ *  current row, Enter submits the toggled set. Selected rows are
+ *  marked with a leading checkbox glyph. Single-select mode: Enter
+ *  commits the highlighted row immediately.
+ *
+ * Resolver contract: `onResolve` receives either an `answers: string[]`
+ *  (one or more picked labels), a `customInput: string` (Other path),
+ *  or `cancelled: true` (Esc). Mirrors AskModal so the REPL wiring
+ *  stays uniform.
+ *
+ * Brand voice gate: ASCII glyphs only. No em-dashes, no banned brand
+ *  words. The copy is power-word neutral so a localised variant lands
+ *  cleanly later.
+ */
+import { useState } from 'react';
+import { Box, Text, useInput } from 'ink';
+export function AskUserQuestionPrompt(props) {
+    const multiSelect = props.multiSelect === true;
+    const [mode, setMode] = useState('pick');
+    const [cursor, setCursor] = useState(0);
+    // Used in multi-select mode: indices in `options` that the operator
+    // has toggled. Order preserved so the resolved answer list reflects
+    // selection order (the model's downstream reasoning often weights
+    // earlier picks higher — preserving order is cheap).
+    const [picked, setPicked] = useState([]);
+    const [buffer, setBuffer] = useState('');
+    const otherIndex = props.options.length; // 0-indexed slot for "Other"
+    const totalRows = props.options.length + 1; // options + Other
+    useInput((input, key) => {
+        // Esc cancels the modal in either mode.
+        if (key.escape) {
+            props.onResolve({ cancelled: true });
+            return;
+        }
+        if (mode === 'pick') {
+            // Numeric hotkeys: 1..N selects the matching option directly
+            // (single-select), or toggles it (multi-select). Convenience
+            // shortcut so a keyboard-only user does not need to j/k walk
+            // through 4 rows. Out-of-range keys fall through.
+            const numeric = Number.parseInt(input, 10);
+            if (!Number.isNaN(numeric) && numeric >= 1 && numeric <= totalRows) {
+                const row = numeric - 1;
+                if (row === otherIndex) {
+                    setMode('custom');
+                    setBuffer('');
+                    return;
+                }
+                if (multiSelect) {
+                    togglePick(row);
+                    return;
+                }
+                commitSinglePick(row);
+                return;
+            }
+            // Vim-style navigation: j down, k up. Arrow keys also work.
+            if (input === 'j' || key.downArrow) {
+                setCursor((c) => (c + 1) % totalRows);
+                return;
+            }
+            if (input === 'k' || key.upArrow) {
+                setCursor((c) => (c - 1 + totalRows) % totalRows);
+                return;
+            }
+            // 'o' hotkey: jump straight to Other (mirrors AskModal).
+            if (input === 'o' || input === 'O') {
+                setMode('custom');
+                setBuffer('');
+                return;
+            }
+            if (key.return) {
+                if (cursor === otherIndex) {
+                    setMode('custom');
+                    setBuffer('');
+                    return;
+                }
+                if (multiSelect) {
+                    // Enter in multi-select mode COMMITS the toggled set. If the
+                    // current row is not yet toggled, fold it in first so the
+                    // operator does not have to press space+enter for a single pick.
+                    const finalPicks = picked.includes(cursor) ? picked : [...picked, cursor];
+                    if (finalPicks.length === 0) {
+                        // No picks + Enter = ignore; the footer hint nudges them.
+                        return;
+                    }
+                    const answers = finalPicks.map((i) => props.options[i].label);
+                    props.onResolve({ answers, cancelled: false });
+                    return;
+                }
+                commitSinglePick(cursor);
+                return;
+            }
+            // Space toggles the current row in multi-select mode. Ignored in
+            // single-select (a single space could otherwise leak into a buffer).
+            if (multiSelect && input === ' ') {
+                togglePick(cursor);
+                return;
+            }
+            return;
+        }
+        // Custom-input mode: line editor.
+        if (key.return) {
+            if (buffer.trim().length === 0) {
+                // Empty buffer + Enter = bounce back to pick mode (mirrors AskModal).
+                setMode('pick');
+                setBuffer('');
+                return;
+            }
+            props.onResolve({
+                customInput: buffer.trim(),
+                cancelled: false,
+            });
+            return;
+        }
+        if (key.backspace || key.delete) {
+            setBuffer((prev) => prev.slice(0, -1));
+            return;
+        }
+        if (input && !key.meta && !key.ctrl) {
+            setBuffer((prev) => prev + input);
+        }
+    }, { isActive: props.inert !== true });
+    function togglePick(row) {
+        setPicked((prev) => prev.includes(row) ? prev.filter((i) => i !== row) : [...prev, row]);
+    }
+    function commitSinglePick(row) {
+        if (row < 0 || row >= props.options.length)
+            return;
+        const opt = props.options[row];
+        if (!opt)
+            return;
+        props.onResolve({ answers: [opt.label], cancelled: false });
+    }
+    // CC preview pattern: any option carrying `preview` flips к side-by-side
+    // layout — options column on the left, preview pane on the right.
+    // The currently-cursored option's preview is shown; rows без preview
+    // simply render an empty pane. Multi-select previews remain disabled
+    // by schema (validated в core/ask-user/question.ts) since side-by-side
+    // diffing across N picked rows is ambiguous UX.
+    const hasAnyPreview = props.options.some((opt) => typeof opt.preview === 'string' && opt.preview.length > 0);
+    const focusedPreview = hasAnyPreview && mode === 'pick' && cursor < props.options.length
+        ? props.options[cursor]?.preview ?? ''
+        : '';
+    const optionsColumn = (_jsxs(Box, { flexDirection: "column", marginTop: 1, flexBasis: hasAnyPreview ? '40%' : '100%', children: [props.options.map((opt, idx) => {
+                const isCursor = mode === 'pick' && cursor === idx;
+                const isPicked = multiSelect && picked.includes(idx);
+                const marker = multiSelect ? (isPicked ? '[x]' : '[ ]') : `${idx + 1}.`;
+                return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { color: isCursor ? 'cyan' : '#3da9fc', bold: true, children: isCursor ? '> ' : ' ' }), _jsx(Text, { color: "#3da9fc", bold: true, children: `${marker} ` }), _jsx(Text, { bold: isCursor, children: opt.label })] }), _jsx(Box, { marginLeft: multiSelect ? 7 : 5, children: _jsx(Text, { dimColor: true, children: opt.description }) })] }, `${idx}-${opt.label}`));
+            }), _jsxs(Box, { children: [_jsx(Text, { color: mode === 'pick' && cursor === otherIndex ? 'cyan' : '#3da9fc', bold: true, children: mode === 'pick' && cursor === otherIndex ? '> ' : ' ' }), _jsx(Text, { color: "#3da9fc", bold: true, children: `${multiSelect ? '[*]' : `${totalRows}.`} ` }), _jsx(Text, { dimColor: true, children: 'Other (type a custom answer)' })] })] }));
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "yellow", paddingX: 1, children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, color: "yellow", children: '? ' }), _jsx(Text, { inverse: true, bold: true, color: "yellow", children: ` ${props.header} ` }), _jsx(Text, { bold: true, children: ' Need your call before I continue' })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { children: props.question }) }), hasAnyPreview ? (_jsxs(Box, { flexDirection: "row", marginTop: 1, children: [optionsColumn, _jsx(Box, { flexDirection: "column", flexBasis: "60%", marginLeft: 2, paddingX: 1, borderStyle: "single", borderColor: "gray", children: focusedPreview.length > 0 ? (focusedPreview.split('\n').map((line, i) => (_jsx(Text, { children: line || ' ' }, `pv-${i}`)))) : (_jsx(Text, { dimColor: true, italic: true, children: '(no preview)' })) })] })) : (optionsColumn), mode === 'pick' ? (_jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: multiSelect
+                        ? `j/k navigate. Space toggles. Enter commits. Esc cancels.`
+                        : `1-${totalRows} or j/k navigate. Enter commits. Esc cancels.` }) })) : (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Box, { children: [_jsx(Text, { color: "#3da9fc", children: '> ' }), _jsx(Text, { children: buffer }), _jsx(Text, { inverse: true, children: ' ' })] }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: 'Type your custom answer. Enter submits. Esc cancels.' }) })] }))] }));
+}
+/**
+ * Encode the prompt verdict into the literal turn-injection string. The
+ * persona prompt teaches the model to recognise this prefix; mirrors
+ * AskModal's `encodeAskVerdict` for consistency.
+ *
+ * Examples:
+ *  { answers: ['Vercel'] }         → "[ASK-USER-QUESTION:answered] Vercel"
+ *  { answers: ['a', 'b'] }         → "[ASK-USER-QUESTION:answered] a, b"
+ *  { customInput: 'gcp' }          → "[ASK-USER-QUESTION:other] gcp"
+ *  { cancelled: true }             → "[ASK-USER-QUESTION:cancelled]"
+ */
+export function encodeAskUserQuestionVerdict(verdict) {
+    if (verdict.cancelled)
+        return '[ASK-USER-QUESTION:cancelled]';
+    if (verdict.answers && verdict.answers.length > 0) {
+        return `[ASK-USER-QUESTION:answered] ${verdict.answers.join(', ')}`;
+    }
+    if (verdict.customInput && verdict.customInput.trim().length > 0) {
+        // Strip any forged verdict header (mirrors AskModal sanitiser).
+        const cleaned = sanitiseVerdictText(verdict.customInput);
+        if (cleaned.length > 0) {
+            return `[ASK-USER-QUESTION:other] ${cleaned}`;
+        }
+    }
+    return '[ASK-USER-QUESTION:cancelled]';
+}
+function sanitiseVerdictText(raw) {
+    let cleaned = raw;
+    for (let i = 0; i < raw.length + 4; i += 1) {
+        const stripped = cleaned.replace(/^\s*\[(?:ASK-RESPONSE|PLAN-VERDICT|ASK-USER-QUESTION):[^\]]*\]\s*/u, '');
+        if (stripped === cleaned)
+            break;
+        cleaned = stripped;
+    }
+    return cleaned.trim();
+}
+//# sourceMappingURL=ask-user-question-prompt.js.map

package/dist/tui/compact-banner.js

@@ -0,0 +1,81 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Visible boundary marker for the conversation pane.
+ *
+ * Rendered inline in the transcript when the replay walker hits a
+ * `compaction` event. Conveys three facts at a glance:
+ *
+ *  1. A compaction happened (separator line).
+ *  2. How many turns were folded into the summary.
+ *  3. Whether it was manual or auto-triggered.
+ *
+ * The separator line uses U+2500 (BOX DRAWINGS LIGHT HORIZONTAL) so
+ * the visual weight matches the rest of the Ink chrome. Dim ink-color
+ * `gray` keeps the marker subdued — it is a navigation aid, not the
+ * conversation itself.
+ *
+ * Width-aware: when stdout columns are known we render the dashes to
+ * fill the line minus the centred label; on unknown width we fall
+ * back to a fixed 64-dash pad. The fallback is wide enough for any
+ * realistic terminal and narrow enough to not wrap on small ones.
+ */
+import { Box, Text } from 'ink';
+const FALLBACK_COLUMNS = 80;
+/**
+ * Render the boundary line. The wrapping `<Box>` keeps the marker on
+ * its own row even when the surrounding flex container packs siblings.
+ */
+export function CompactBanner(props) {
+    const columns = props.columns && props.columns > 20 ? props.columns : FALLBACK_COLUMNS;
+    const label = buildLabel(props);
+    const dashesEach = Math.max(3, Math.floor((columns - label.length - 2) / 2));
+    const dashes = '─'.repeat(dashesEach);
+    return (_jsx(Box, { children: _jsx(Text, { color: "gray", children: `${dashes} ${label} ${dashes}` }) }));
+}
+/**
+ * Build the centred label. Examples:
+ *  "context compacted (12 turns → 1 summary, auto)"
+ *  "context compacted (4 turns → 1 summary, manual · ~3.2k tokens)"
+ *  "context compacted (12 turns → summary at 14:32, auto)"
+ *  "context compacted (12 turns → 1 summary, manual) · 6 turns ago"
+ */
+export function buildLabel(props) {
+    const trigger = props.trigger === 'auto' ? 'auto' : 'manual';
+    const turns = `${props.turnsBefore} ${props.turnsBefore === 1 ? 'turn' : 'turns'}`;
+    const summarySlot = typeof props.summaryAtEpochMs === 'number' && props.summaryAtEpochMs > 0
+        ? `summary at ${formatClock(props.summaryAtEpochMs)}`
+        : '1 summary';
+    const tokens = props.summaryTokenCount && props.summaryTokenCount > 0
+        ? ` · ~${formatTokens(props.summaryTokenCount)} tokens`
+        : '';
+    const base = `context compacted (${turns} → ${summarySlot}, ${trigger}${tokens})`;
+    // L29 history-replay suffix. Only render when the boundary has live
+    // turns following it — a fresh in-REPL `/compact` lands with
+    // `turnsAgo === 0` and we keep the label compact.
+    if (typeof props.turnsAgo === 'number' && props.turnsAgo > 0) {
+        const ago = `${props.turnsAgo} ${props.turnsAgo === 1 ? 'turn' : 'turns'} ago`;
+        return `${base} · ${ago}`;
+    }
+    return base;
+}
+/** Format token counts like 1234 → 1.2k, 950 → 950. */
+function formatTokens(n) {
+    if (n < 1000)
+        return `${n}`;
+    return `${(n / 1000).toFixed(1)}k`;
+}
+/**
+ * Render an epoch-ms instant as a deterministic `HH:MM` clock in the
+ * operator's local timezone. Used only inside the centred label so a
+ * boundary that landed mid-session reads `summary at 14:32` instead of
+ * the generic `1 summary`. Pure (no side effects), constant-time.
+ */
+function formatClock(epochMs) {
+    const d = new Date(epochMs);
+    if (Number.isNaN(d.getTime()))
+        return '--:--';
+    const hh = d.getHours().toString().padStart(2, '0');
+    const mm = d.getMinutes().toString().padStart(2, '0');
+    return `${hh}:${mm}`;
+}
+//# sourceMappingURL=compact-banner.js.map