koneck 2.25.6 → 2.25.8

package/dist/ink-chat.js

@@ -10,8 +10,9 @@ import { loadKoneckConfig, saveKoneckConfig, setConfigKey, configKeyDescriptions
 import { PROVIDERS, resolveProvider, getApiKey, addUserProvider, userProvidersPath } from './providers.js';
 import { listCheckpoints, revertCheckpoint, snapshotTree, filesTouchedBy } from './checkpoint.js';
 import { fileDiff, diffSummary } from './diff-view.js';
+import { listWorkspaceEntries, filterEntries, activeReference } from './workspace-files.js';
 import { bar, humanTokens, humanDuration, diffStatSince, modelInfoFrom, contextWindowFor, recordStatus, classifyResponse, stateLabel, readModelStatus, computeUiWidth, } from './usage.js';
-import { Markdown, Panel, panelWidth, safeCommitPoint } from './markdown-ink.js';
+import { Markdown, Panel, panelWidth, safeCommitPoint, displayWidth, sliceToWidth } from './markdown-ink.js';
 import { fetchUpdateStatus, updateCommand } from './update-check.js';
 import { readFileSync, statSync } from 'fs';
 import { fileURLToPath } from 'url';
@@ -94,6 +95,24 @@ function fmtTokens(n) {
  * Greedy word wrap. The user's message is painted as a filled bar, so each line has to be
  * padded to the same width — a background colour only covers the characters actually drawn.
  */
+/**
+ * Pads a string to an exact number of terminal cells, clipping it if it overflows.
+ *
+ * `padEnd` counts code units, so one emoji in a line made the padding a cell too long and pushed
+ * the right edge of a highlighted bar past where it was drawn. Measuring cells keeps the block
+ * rectangular whatever it contains.
+ */
+function fitCells(text, width, ellipsis = false) {
+    const w = displayWidth(text);
+    if (w === width)
+        return text;
+    if (w < width)
+        return text + ' '.repeat(width - w);
+    if (!ellipsis)
+        return sliceToWidth(text, width).text;
+    const head = sliceToWidth(text, Math.max(0, width - 3));
+    return head.text + '.'.repeat(Math.min(3, width)) + ' '.repeat(Math.max(0, width - head.width - 3));
+}
 function wrapToWidth(text, width) {
     const out = [];
     for (const paragraph of text.split('\n')) {
@@ -106,7 +125,7 @@ function wrapToWidth(text, width) {
             if (line === '') {
                 line = word;
             }
-            else if (line.length + 1 + word.length <= width) {
+            else if (displayWidth(line) + 1 + displayWidth(word) <= width) {
                 line += ' ' + word;
             }
             else {
@@ -292,6 +311,30 @@ const EFFORT_BLURB = {
     high: 'Thorough — covers edge cases, costs more tokens',
     max: 'Most rigorous analysis available; slowest and priciest',
 };
+// Bracketed paste. A terminal that has it enabled wraps pasted text in these markers, which is
+// the only reliable way to tell a paste from very fast typing. Ink strips the leading escape of
+// the opening marker before handing input to useInput, so the literal it sees is "[200~".
+const PASTE_ON = '\u001b[?2004h';
+const PASTE_OFF = '\u001b[?2004l';
+const PASTE_BEGIN = '[200~';
+const PASTE_END = '\u001b[201~';
+/** How a held-back paste appears in the composer. */
+export function pasteToken(index, lines) {
+    return `[Pasted text #${index} +${lines} lines]`;
+}
+/**
+ * Puts held-back pastes back into the text before it is sent.
+ *
+ * The token is what the user sees; the model must receive what they actually copied. Anything
+ * typed around a token is preserved in place, so a paste can be introduced and followed by a
+ * question in one prompt.
+ */
+export function expandPastes(draft, pastes) {
+    return draft.replace(/\[Pasted text #(\d+) \+\d+ lines\]/g, (whole, n) => {
+        const text = pastes[Number(n) - 1];
+        return text === undefined ? whole : text;
+    });
+}
 /** Past this, a file is not read for diffing — the render would be useless anyway. */
 const MAX_DIFF_BYTES = 512 * 1024;
 /** One tool rarely touches more; the cap stops a bulk move from flooding scrollback. */
@@ -374,6 +417,24 @@ function App({ config: initialConfig }) {
     const replyStartedRef = useRef(false);
     /** Everything streamed this turn. Empty means the provider did not stream at all. */
     const streamedRef = useRef('');
+    /** Frames received before any content — proof the provider has the request and is working. */
+    const [providerFrames, setProviderFrames] = useState(0);
+    /**
+     * Text pasted into the composer, held aside so the prompt stays readable.
+     *
+     * A thirty-line paste in the input box buries whatever the user meant to type around it, and the
+     * paragraph structure is lost the moment it is folded into one wrapped line. Each paste is kept
+     * verbatim here and stands in the draft as a short token, which is expanded again on submit — so
+     * the model receives exactly what was copied, blank lines and all.
+     */
+    const pastesRef = useRef([]);
+    const [pasteCount, setPasteCount] = useState(0);
+    /** Accumulates a paste that spans more than one stdin chunk. */
+    const pasteBufRef = useRef(null);
+    /** Workspace paths for the `@` picker, read once and reused. */
+    const entriesRef = useRef(null);
+    /** Where the `@` being completed starts in the draft. */
+    const atStartRef = useRef(-1);
     /** Pre-edit contents of the files the running tool said it would touch. */
     const pendingDiffRef = useRef([]);
     const charsRef = useRef(0); // streamed chars, for the live token estimate
@@ -486,6 +547,7 @@ function App({ config: initialConfig }) {
         onChunk: (text) => pushSay(text),
         onToolCall: (name, args) => pushTool(name, args),
         onToolResult: (name, ok, ms) => finishTool(name, ok, ms),
+        onStreamActivity: (frames) => setProviderFrames(frames),
         onAgentProgress: (list) => { agentsRef.current = list; setAgents(list); },
         onTokens: (s) => {
             realTokRef.current = Math.max(0, s.completionTokens - tokBaseRef.current);
@@ -684,6 +746,14 @@ function App({ config: initialConfig }) {
         }, 150);
         return () => clearInterval(id);
     }, [busy]);
+    // Ask the terminal to bracket pasted text. Without this a paste is indistinguishable from
+    // typing, and there is no way to keep it out of the composer or preserve its line breaks.
+    useEffect(() => {
+        process.stdout.write(PASTE_ON);
+        const off = () => { process.stdout.write(PASTE_OFF); };
+        process.on('exit', off);
+        return () => { off(); process.off('exit', off); };
+    }, []);
     // The tree as it stood before the session touched anything. Recorded once, so "code changes"
     // stays a comparison against the starting point however long the session runs.
     useEffect(() => { void snapshotTree(cfg.cwd).then(t => { baseTreeRef.current = t; }); }, [cfg.cwd]);
@@ -869,6 +939,30 @@ function App({ config: initialConfig }) {
             current: p.name === cfg.provider,
         }));
     }
+    /**
+     * Offers workspace paths for an `@` reference. The listing is read on first use rather than at
+     * startup, so a session in a large repository is not delayed by a scan it may never need.
+     */
+    async function openFilePicker(query) {
+        if (entriesRef.current === null)
+            entriesRef.current = await listWorkspaceEntries(cfg.cwd);
+        const all = entriesRef.current;
+        if (all.length === 0) {
+            addSystem('No files found to reference here.');
+            return;
+        }
+        setPicker({ kind: 'file', items: fileItems(all, query) });
+        setPickQuery(query);
+        setPickIndex(0);
+    }
+    /** The picker rows for a query, ranked by how well each path matches. */
+    function fileItems(all, query) {
+        return filterEntries(all, query, 200).map(entry => ({
+            value: entry,
+            label: entry,
+            desc: entry.endsWith('/') ? 'directory' : '',
+        }));
+    }
     function openPicker(kind, items, query = '') {
         setPicker({ kind, items });
         setPickQuery(query);
@@ -883,6 +977,18 @@ function App({ config: initialConfig }) {
     async function choosePick(item, kindOverride) {
         const kind = kindOverride ?? picker?.kind;
         closePicker();
+        if (kind === 'file') {
+            // Replace the partial "@query" with the full path, leaving a trailing space so the next
+            // word can be typed straight away. A directory keeps its slash so more can be typed after.
+            const start = atStartRef.current;
+            atStartRef.current = -1;
+            if (start >= 0) {
+                const suffix = item.value.endsWith('/') ? '' : ' ';
+                setDraft(d => d.slice(0, start) + '@' + item.value + suffix + d.slice(caret));
+                setCaret(start + 1 + item.value.length + suffix.length);
+            }
+            return;
+        }
         if (kind === 'command') {
             // Leave it in the composer so arguments can still be typed before submitting.
             setDraft(item.value + ' ');
@@ -964,7 +1070,13 @@ function App({ config: initialConfig }) {
                 const cost = estimateCost(cfg.model, stats.promptTokens, stats.completionTokens);
                 const costStr = cost.known ? formatCost(cost.total) : 'unavailable';
                 const ws = cfg.cwd.replace(process.env['HOME'] ?? '', '~');
+                // The endpoint is resolved from four places — an explicit override, an env var, the
+                // config file, then the built-in default — so showing the name alone leaves the one
+                // question that actually matters when a provider misbehaves unanswered: where did the
+                // request go? Working that out took a proxy and half an hour.
+                const endpoint = resolveProvider(cfg.provider, cfg.baseURL).baseURL;
                 addSystem(`Provider   : ${cfg.provider}\n` +
+                    `Endpoint   : ${endpoint}\n` +
                     `Model      : ${cfg.model}\n` +
                     `Mode       : ${mode}   effort: ${effort}\n` +
                     `Approval   : ${cfg.requireApproval ? 'on' : 'off'}\n` +
@@ -1421,7 +1533,53 @@ function App({ config: initialConfig }) {
                 addSystem(`Unknown command: ${cmd}. Type /help for the full list.`);
         }
     }
+    /**
+     * Files a completed paste and puts a token in the composer.
+     *
+     * A short single-line paste is inserted literally — turning "npm test" into a token would be
+     * obstructive. Anything with a line break is held back, because that is the case where the text
+     * would both swamp the composer and lose its structure.
+     */
+    function filePaste(text) {
+        const clean = text.replace(/\r\n?/g, '\n');
+        const lines = clean.split('\n').length;
+        if (!clean.includes('\n') && clean.length <= 200) {
+            setDraft(d => d.slice(0, caret) + clean + d.slice(caret));
+            setCaret(c => c + clean.length);
+            return;
+        }
+        pastesRef.current = [...pastesRef.current, clean];
+        const token = pasteToken(pastesRef.current.length, lines);
+        setPasteCount(pastesRef.current.length);
+        setDraft(d => d.slice(0, caret) + token + d.slice(caret));
+        setCaret(c => c + token.length);
+    }
     useInput((input, key) => {
+        // ── Bracketed paste ─────────────────────────────────────────────────────
+        // This runs before every other branch. A paste carries newlines, and any handler that treats
+        // a newline as "submit" would fire partway through one.
+        if (pasteBufRef.current !== null) {
+            const end = input.indexOf(PASTE_END);
+            if (end === -1) {
+                pasteBufRef.current += input;
+                return;
+            }
+            const whole = pasteBufRef.current + input.slice(0, end);
+            pasteBufRef.current = null;
+            filePaste(whole);
+            return;
+        }
+        const begin = input.indexOf(PASTE_BEGIN);
+        if (begin !== -1) {
+            const after = input.slice(begin + PASTE_BEGIN.length);
+            const end = after.indexOf(PASTE_END);
+            if (end === -1) {
+                pasteBufRef.current = after;
+                return;
+            } // more chunks to come
+            filePaste(after.slice(0, end));
+            return;
+        }
         // Esc abandons the turn in flight and hands the keyboard straight back. The composer is
         // deliberately left alone: cancelling should not cost whatever was typed while waiting.
         if (key.escape && busy && !picker && !keyPrompt && !updatePane && !usagePane) {
@@ -1467,6 +1625,8 @@ function App({ config: initialConfig }) {
                     setDraft('');
                     setCaret(0);
                 }
+                if (picker.kind === 'file')
+                    atStartRef.current = -1;
                 closePicker();
                 return;
             }
@@ -1499,6 +1659,21 @@ function App({ config: initialConfig }) {
                     setCaret(0);
                     return;
                 }
+                if (picker.kind === 'file') {
+                    // Deleting the "@" itself is how the picker is dismissed without choosing anything.
+                    setDraft(d => d.slice(0, Math.max(0, caret - 1)) + d.slice(caret));
+                    setCaret(c => Math.max(0, c - 1));
+                    if (pickQuery === '') {
+                        closePicker();
+                        atStartRef.current = -1;
+                        return;
+                    }
+                    const q = pickQuery.slice(0, -1);
+                    setPickQuery(q);
+                    setPickIndex(0);
+                    setPicker(p => (p ? { ...p, items: fileItems(entriesRef.current ?? [], q) } : p));
+                    return;
+                }
                 setPickQuery(q => q.slice(0, -1));
                 setPickIndex(0);
                 if (picker.kind === 'command') {
@@ -1511,6 +1686,13 @@ function App({ config: initialConfig }) {
             // A space means the command name is finished and arguments follow, so the palette
             // steps out of the way. Keeping it open sent "model gpt-4o" into the filter, emptied
             // the list, and left Enter with nothing to select.
+            if (input === ' ' && picker.kind === 'file') {
+                closePicker();
+                atStartRef.current = -1;
+                setDraft(d => d.slice(0, caret) + ' ' + d.slice(caret));
+                setCaret(c => c + 1);
+                return;
+            }
             if (input === ' ' && picker.kind === 'command') {
                 closePicker();
                 setDraft(d => { const t = d.endsWith(' ') ? d : d + ' '; setCaret(t.length); return t; });
@@ -1524,6 +1706,12 @@ function App({ config: initialConfig }) {
                     setDraft(t);
                     setCaret(t.length);
                 }
+                if (picker.kind === 'file') {
+                    const q = pickQuery + input;
+                    setPicker(p => (p ? { ...p, items: fileItems(entriesRef.current ?? [], q) } : p));
+                    setDraft(d => d.slice(0, caret) + input + d.slice(caret));
+                    setCaret(c => c + input.length);
+                }
                 return;
             }
             return;
@@ -1664,8 +1852,19 @@ function App({ config: initialConfig }) {
             const text = input.replace(/[\u0000-\u0008\u000b-\u001f\u007f]/g, '');
             if (text === '')
                 return;
-            setDraft(d => d.slice(0, caret) + text + d.slice(caret));
-            setCaret(c => c + text.length);
+            const next = draft.slice(0, caret) + text + draft.slice(caret);
+            const nextCaret = caret + text.length;
+            setDraft(next);
+            setCaret(nextCaret);
+            // A lone "@" at a word boundary offers workspace paths. Checking the draft as it will be,
+            // rather than the character typed, means it also fires when "@" arrives mid-chunk.
+            if (text.endsWith('@')) {
+                const ref = activeReference(next, nextCaret);
+                if (ref) {
+                    atStartRef.current = ref.start;
+                    void openFilePicker(ref.query);
+                }
+            }
         }
     });
     /** Start of the word at or before `i`, for word-wise movement and deletion. */
@@ -1689,12 +1888,20 @@ function App({ config: initialConfig }) {
     /** Sends the composer contents: a slash command, or a task for the agent. */
     function submitDraft(raw) {
         {
-            const task = raw.trim();
+            // Tokens are expanded here, at the last moment. The model gets the text as it was copied —
+            // blank lines, indentation and all — while the transcript shows the compact form so a
+            // thirty-line paste does not bury the question asked about it.
+            const shown = raw.trim();
+            if (!shown)
+                return;
+            const task = expandPastes(shown, pastesRef.current).trim();
             if (!task)
                 return;
             setDraft('');
             setCaret(0);
-            addRow({ role: 'user', text: task });
+            pastesRef.current = [];
+            setPasteCount(0);
+            addRow({ role: 'user', text: shown });
             if (task.startsWith('/')) {
                 const spaceIdx = task.indexOf(' ');
                 const cmd = spaceIdx === -1 ? task : task.slice(0, spaceIdx);
@@ -1710,6 +1917,7 @@ function App({ config: initialConfig }) {
             sayRef.current = '';
             streamedRef.current = '';
             replyStartedRef.current = false;
+            setProviderFrames(0);
             liveToolRef.current = null;
             charsRef.current = 0;
             realTokRef.current = 0;
@@ -1860,7 +2068,7 @@ function App({ config: initialConfig }) {
                                 const bg = l.kind === 'add' ? DIFF_ADD_BG : l.kind === 'del' ? DIFF_DEL_BG : undefined;
                                 // Tabs would make the tinted block a ragged width, so they are expanded.
                                 const body = `${sign} ${l.text}`.replace(/\t/g, '  ');
-                                const cell = body.length > width ? body.slice(0, width - 3) + '...' : body.padEnd(width);
+                                const cell = fitCells(body, width, true);
                                 return (_jsxs(Box, { children: [_jsxs(Text, { color: DIM, children: [String(shown ?? '').padStart(gutter), " "] }), _jsx(Text, { color: fg, ...(bg ? { backgroundColor: bg } : {}), children: cell })] }, li));
                             })] }, hi))), d.hiddenLines > 0 && (_jsxs(Text, { color: DIM, children: [' '.repeat(gutter), "  ... ", d.hiddenLines, " more changed lines"] }))] }, key));
     };
@@ -1877,7 +2085,7 @@ function App({ config: initialConfig }) {
     return (_jsxs(Box, { flexDirection: "column", width: uiWidth, paddingX: 2, children: [showAnalytics && (_jsxs(Box, { borderStyle: "round", borderColor: AMBER, paddingX: 1, marginBottom: 1, flexDirection: "column", width: barWidth, children: [_jsx(Text, { color: AMBER, bold: true, children: "\u25C6 Session Analytics" }), _jsxs(Text, { color: MUTED, children: ["Turns      : ", _jsx(Text, { color: INK, children: stats.turns })] }), _jsxs(Text, { color: MUTED, children: ["Prompt tok : ", _jsx(Text, { color: INK, children: stats.promptTokens.toLocaleString() })] }), _jsxs(Text, { color: MUTED, children: ["Output tok : ", _jsx(Text, { color: INK, children: stats.completionTokens.toLocaleString() })] }), _jsxs(Text, { color: MUTED, children: ["Total tok  : ", _jsx(Text, { color: INK, children: stats.totalTokens.toLocaleString() })] }), _jsxs(Text, { color: MUTED, children: ["Model      : ", _jsx(Text, { color: INK, children: modelShort }), "  Provider: ", _jsx(Text, { color: INK, children: cfg.provider })] }), _jsx(Text, { color: DIM, children: "Tab to close" })] })), _jsx(Static, { items: rows, children: (row, index) => row.role === 'header' ? (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { flexDirection: "column", alignItems: "center", marginTop: 1, marginBottom: 1, children: [_jsx(Text, { color: CYAN, bold: true, children: "KONECK  /  SOFTWARE DELIVERY SYSTEM" }), _jsx(Text, { color: MUTED, children: "Deliberate engineering, with control at every change." })] }), _jsx(Panel, { width: barWidth, color: CYAN, title: "KONECK", children: [`MODEL: \`${modelShort}\`   PROVIDER: \`${cfg.provider}\`   WORKSPACE: \`${workspace}\``] })] }, index)) : row.role === 'user' ? (
                 // Painted as a filled bar so the user's own words are the most findable thing
                 // on screen when scrolling back through a long session.
-                _jsx(Box, { marginTop: 1, flexDirection: "column", children: wrapToWidth(row.text ?? '', barWidth - 2).map((line, li) => (_jsx(Text, { backgroundColor: USER_BG, color: USER_FG, bold: li === 0, children: (li === 0 ? '❯ ' : '  ') + line.padEnd(barWidth - 2) }, li))) }, index)) : row.role === 'error' ? (() => {
+                _jsx(Box, { marginTop: 1, flexDirection: "column", children: wrapToWidth(row.text ?? '', barWidth - 2).map((line, li) => (_jsx(Text, { backgroundColor: USER_BG, color: USER_FG, bold: li === 0, children: (li === 0 ? '❯ ' : '  ') + fitCells(line, barWidth - 2) }, li))) }, index)) : row.role === 'error' ? (() => {
                     const lines = [row.text ?? '', '', 'Fix the above, then retry. /status shows the active provider and model.'];
                     return (_jsx(Box, { marginTop: 1, children: _jsx(Panel, { width: panelWidth(lines, barWidth, 40), color: CRIMSON, title: "[!] ERROR", children: lines }) }, index));
                 })() : row.role === 'system' ? (() => {
@@ -1904,11 +2112,16 @@ function App({ config: initialConfig }) {
                                             : a.status === 'failed' ? CRIMSON : GREEN;
                                         const took = (a.endedAt ?? Date.now()) - a.startedAt;
                                         const task = a.task.length > taskWidth ? a.task.slice(0, taskWidth - 3) + '...' : a.task;
-                                        return (_jsxs(Box, { paddingLeft: 2, gap: 1, children: [_jsx(Text, { color: color, children: glyph }), _jsx(Text, { color: DIM, children: String(a.index + 1).padStart(2) }), _jsx(Text, { color: a.status === 'running' ? INK : MUTED, children: task.padEnd(taskWidth) }), _jsx(Text, { color: DIM, children: humanTokens(a.tokens).padStart(6) }), _jsx(Text, { color: DIM, children: fmtElapsed(took).padStart(6) })] }, a.index));
+                                        return (_jsxs(Box, { paddingLeft: 2, gap: 1, children: [_jsx(Text, { color: color, children: glyph }), _jsx(Text, { color: DIM, children: String(a.index + 1).padStart(2) }), _jsx(Text, { color: a.status === 'running' ? INK : MUTED, children: fitCells(task, taskWidth) }), _jsx(Text, { color: DIM, children: humanTokens(a.tokens).padStart(6) }), _jsx(Text, { color: DIM, children: fmtElapsed(took).padStart(6) })] }, a.index));
                                     })] }));
                         })(), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { children: [_jsxs(Text, { color: GREEN, children: [SPINNER[spinFrame], " "] }), _jsx(Shimmer, { text: workWord(elapsedMs, spinWord, turnRecoveredRef.current)[0], frame: shimmerFrame, base: MUTED }), _jsx(Text, { color: MUTED, children: "\u2026 " }), _jsxs(Text, { color: DIM, children: ["(", fmtElapsed(elapsedMs), " | ", liveTokens > 0
                                                 ? `${fmtTokens(liveTokens)} tokens`
-                                                : elapsedMs > 20_000 ? 'waiting for the first token' : 'starting', ")"] })] }) }), _jsx(Box, { paddingLeft: 2, children: _jsx(Text, { color: DIM, children: "esc to cancel and keep your input \u00B7 ctrl+c to exit" }) })] })) }), usagePane && (() => {
+                                                // A gateway routing to several backends sends content-free frames while it
+                                                // finds one. Saying "waiting for the first token" through that reads as a
+                                                // hang, when in fact the request was accepted and is being worked on.
+                                                : providerFrames > 0 ? `${cfg.provider} is holding the line, no output yet`
+                                                    : elapsedMs > 8_000 ? `no response from ${cfg.provider} yet`
+                                                        : 'starting', ")"] })] }) }), _jsx(Box, { paddingLeft: 2, children: _jsx(Text, { color: DIM, children: "esc to cancel and keep your input \u00B7 ctrl+c to exit" }) })] })) }), usagePane && (() => {
                 const width = Math.min(barWidth, 66);
                 const inner = width - 4;
                 const BAR_W = Math.max(12, inner - 14);
@@ -2074,28 +2287,31 @@ function App({ config: initialConfig }) {
                     : picker.kind === 'model' ? `Models - ${cfg.provider}`
                         : picker.kind === 'effort' ? 'Reasoning effort'
                             : picker.kind === 'resume' ? 'Resume a saved session'
-                                : 'Connect provider';
+                                : picker.kind === 'file' ? 'Reference a file or directory'
+                                    : 'Connect provider';
                 // The palette is sized to the rows it is showing rather than to the terminal. On a wide
                 // screen a list of short model names in a full-width box is mostly empty box.
-                const headWidth = title.length + 24;
+                // The header is a title on the left and a count on the right, on one line. Estimating the
+                // right-hand side at a constant made "Reference a file or directory" wrap onto two rows.
+                const countText = `${list.length} match${list.length === 1 ? '' : 'es'} · esc to close`;
+                const headWidth = title.length + countText.length + 3;
                 const rowWidth = Math.max(headWidth, ...shown.map(it => 38 + (it.current ? 10 : 0) + it.desc.length));
                 const boxWidth = Math.max(40, Math.min(barWidth, rowWidth + 4));
                 const width = boxWidth - 4;
                 let lastGroup;
-                return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: CYAN, paddingX: 1, marginTop: 1, width: boxWidth, children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsx(Text, { color: CYAN, bold: true, children: title }), _jsxs(Text, { color: DIM, children: [list.length, " match", list.length === 1 ? '' : 'es', " \u00B7 esc to close"] })] }), list.length === 0 && _jsxs(Text, { color: MUTED, children: ["No match for \"", pickQuery, "\""] }), shown.map((item, i) => {
+                return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: CYAN, paddingX: 1, marginTop: 1, width: boxWidth, children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsx(Text, { color: CYAN, bold: true, children: title }), _jsx(Text, { color: DIM, children: countText })] }), list.length === 0 && _jsxs(Text, { color: MUTED, children: ["No match for \"", pickQuery, "\""] }), shown.map((item, i) => {
                             const absolute = Math.max(0, start) + i;
                             const selected = absolute === pickIndex;
                             const header = item.group && item.group !== lastGroup ? item.group : null;
                             lastGroup = item.group;
                             const label = item.label.length > 34 ? item.label.slice(0, 31) + '...' : item.label;
-                            return (_jsxs(Box, { flexDirection: "column", children: [header && _jsx(Text, { color: DIM, children: header }), _jsx(Text, { backgroundColor: selected ? CYAN : undefined, color: selected ? '#10222A' : INK, bold: selected, children: (`${selected ? '❯ ' : '  '}${label.padEnd(36)}${item.current ? '(current) ' : ''}${item.desc}`)
-                                            .slice(0, width).padEnd(width) })] }, item.value + absolute));
+                            return (_jsxs(Box, { flexDirection: "column", children: [header && _jsx(Text, { color: DIM, children: header }), _jsx(Text, { backgroundColor: selected ? CYAN : undefined, color: selected ? '#10222A' : INK, bold: selected, children: fitCells(`${selected ? '❯ ' : '  '}${fitCells(label, 36)}${item.current ? '(current) ' : ''}${item.desc}`, width) })] }, item.value + absolute));
                         }), list.length > PICKER_ROWS && (_jsxs(Text, { color: DIM, children: ["\u2191\u2193 navigate \u00B7 enter select \u00B7 showing ", Math.max(0, start) + 1, "\u2013", Math.max(0, start) + shown.length, " of ", list.length] }))] }));
             })(), keyPrompt && (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: AMBER, paddingX: 1, marginTop: 1, width: barWidth, children: [_jsxs(Text, { color: AMBER, bold: true, children: ["API key for ", keyPrompt.provider] }), _jsx(Text, { color: MUTED, children: "Paste it and press enter. Held in memory for this session only; esc to cancel." }), _jsxs(Box, { marginTop: 1, children: [_jsxs(Text, { color: MUTED, children: [keyPrompt.env, ": "] }), _jsx(Text, { color: INK, children: '*'.repeat(Math.min(keyPrompt.value.length, 48)) }), _jsx(Text, { color: CYAN, children: "\u2588" })] })] })), _jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: CYAN, bold: true, children: "\u276F " }), _jsx(Text, { color: INK, children: draft.slice(0, caret) }), busy
                         ? _jsx(Text, { color: INK, children: draft.slice(caret) })
                         : caret < draft.length
                             ? _jsxs(_Fragment, { children: [_jsx(Text, { backgroundColor: CYAN, color: "#10222A", children: draft[caret] }), _jsx(Text, { color: INK, children: draft.slice(caret + 1) })] })
-                            : _jsx(Text, { color: CYAN, children: "\u2588" })] }), _jsx(Box, { marginTop: 1, paddingX: 1, children: _jsxs(Text, { wrap: "truncate", backgroundColor: "#24343B", children: [_jsx(Text, { color: MUTED, children: "TAB " }), _jsx(Text, { color: INK, children: "Analytics" }), _jsx(Text, { color: MUTED, children: " / " }), _jsx(Text, { color: CYAN, children: "/HELP" }), _jsx(Text, { color: INK, children: " Commands" }), _jsx(Text, { color: MUTED, children: " / SHIFT+TAB " }), _jsx(Text, { color: INK, children: "Mode" }), _jsx(Text, { color: MUTED, children: " / " }), _jsx(Text, { color: statusColor, children: statusLabel.toLowerCase() }), _jsx(Text, { color: MUTED, children: " / MODE: " }), _jsx(Text, { color: INK, children: mode }), _jsx(Text, { color: MUTED, children: " / EFFORT: " }), _jsx(Text, { color: effort === 'medium' ? INK : AMBER, children: effort }), _jsx(Text, { color: MUTED, children: " / MODEL: " }), _jsx(Text, { color: INK, children: modelShort }), _jsx(Text, { color: MUTED, children: " / v" }), _jsx(Text, { color: updatePane?.behind ? AMBER : INK, children: VERSION }), updatePane?.behind && _jsx(Text, { color: AMBER, children: " \u2191" })] }) })] }));
+                            : _jsx(Text, { color: CYAN, children: "\u2588" })] }), _jsx(Box, { marginTop: 1, paddingX: 1, children: _jsxs(Text, { wrap: "truncate", backgroundColor: "#24343B", children: [_jsx(Text, { color: MUTED, children: "TAB " }), _jsx(Text, { color: INK, children: "Analytics" }), _jsx(Text, { color: MUTED, children: " / " }), _jsx(Text, { color: CYAN, children: "/HELP" }), _jsx(Text, { color: INK, children: " Commands" }), _jsx(Text, { color: MUTED, children: " / SHIFT+TAB " }), _jsx(Text, { color: INK, children: "Mode" }), _jsx(Text, { color: MUTED, children: " / " }), _jsx(Text, { color: statusColor, children: statusLabel.toLowerCase() }), _jsx(Text, { color: MUTED, children: " / MODE: " }), _jsx(Text, { color: INK, children: mode }), _jsx(Text, { color: MUTED, children: " / EFFORT: " }), _jsx(Text, { color: effort === 'medium' ? INK : AMBER, children: effort }), _jsx(Text, { color: MUTED, children: " / MODEL: " }), _jsx(Text, { color: INK, children: modelShort }), _jsx(Text, { color: MUTED, children: " / v" }), _jsx(Text, { color: updatePane?.behind ? AMBER : INK, children: VERSION }), updatePane?.behind && _jsx(Text, { color: AMBER, children: " \u2191" }), pasteCount > 0 && (_jsxs(_Fragment, { children: [_jsx(Text, { color: MUTED, children: " / " }), _jsxs(Text, { color: AMBER, children: [pasteCount, " paste", pasteCount === 1 ? '' : 's', " held, sent in full"] })] }))] }) })] }));
 }
 export async function runInkChatMode(config) {
     // resolveConfig has already layered CLI flags above the /config store, so the config