pulseed 0.2.0 → 0.4.0

package/dist/interface/tui/chat.js

@@ -1,100 +1,245 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 // ─── Chat ───
 //
 // Chat area component with message log and text input.
 // Renders visible messages based on terminal height, with scroll indicator,
 // styled user/AI distinction, spinner, timestamps, and color-coded message types.
-import React, { useState } from "react";
-import { Box, Text, useInput } from "ink";
+import React, { useCallback, useState } from "react";
+import { Box, Text, useInput, useStdout } from "ink";
 import TextInput from "ink-text-input";
-import Spinner from "ink-spinner";
-import { renderMarkdownLines } from "./markdown-renderer.js";
+import { CheckerboardSpinner } from "./checkerboard-spinner.js";
+import { renderMarkdownLines, splitMarkdownLineToRows, wrapTextToRows, } from "./markdown-renderer.js";
 import { fuzzyMatch, fuzzyFilter } from "./fuzzy.js";
+import { getClipboardContent } from "./clipboard.js";
 import { theme, getMessageTypeColor } from "./theme.js";
-function formatTime(date) {
-    return date.toLocaleTimeString("en-US", {
-        hour12: false,
-        hour: "2-digit",
-        minute: "2-digit",
+import { pickSpinnerVerb } from "./spinner-verbs.js";
+import { ShimmerText } from "./shimmer-text.js";
+import { positionCursorInFrame, buildCursorEscape } from "./cursor-tracker.js";
+import { isBashModeInput } from "./bash-mode.js";
+import { isRenderableFrameChunk } from "./render-output.js";
+const CHAT_UI_RESERVED_ROWS = 8;
+const DEFAULT_MESSAGE_WIDTH_PADDING = 4;
+const MESSAGE_INNER_PADDING = 2;
+const MIN_MESSAGE_WIDTH = 10;
+const SCROLL_LINE_STEP = 3;
+const SGR_MOUSE_SEQUENCE = /(?:\u001b)?\[<(\d+);(\d+);(\d+)([mM])/g;
+function getRowWidth(termCols) {
+    return Math.max(MIN_MESSAGE_WIDTH, termCols - DEFAULT_MESSAGE_WIDTH_PADDING - MESSAGE_INNER_PADDING);
+}
+function wrapUserMessageRows(text, width) {
+    const wrapped = wrapTextToRows(text, width);
+    return wrapped.map((line, index) => (index === 0 ? `◉ ${line}` : `  ${line}`));
+}
+function buildMessageRows(msg, width) {
+    if (msg.role === "user") {
+        const rows = wrapUserMessageRows(msg.text, width);
+        return rows.map((text, index) => ({
+            key: `${msg.id}:user:${index}`,
+            kind: "user",
+            text,
+            backgroundColor: "#D9D9D9",
+            color: "#1A1A1A",
+            paddingX: 1,
+        }));
+    }
+    const typeColor = getMessageTypeColor(msg.messageType);
+    const rendered = renderMarkdownLines(msg.text);
+    const rows = [];
+    rendered.forEach((line, lineIndex) => {
+        const wrappedLines = splitMarkdownLineToRows(line, width);
+        wrappedLines.forEach((wrappedLine, rowIndex) => {
+            rows.push({
+                key: `${msg.id}:pulseed:${lineIndex}:${rowIndex}`,
+                kind: "pulseed",
+                text: wrappedLine.text,
+                color: typeColor,
+                bold: wrappedLine.bold,
+                dim: wrappedLine.dim,
+                italic: wrappedLine.italic,
+                marginLeft: 2,
+            });
+        });
     });
+    if (rows.length === 0) {
+        rows.push({
+            key: `${msg.id}:pulseed:empty`,
+            kind: "pulseed",
+            text: "",
+            color: typeColor,
+            marginLeft: 2,
+        });
+    }
+    return rows;
+}
+export function buildChatViewport(messages, termCols, termRows, scrollOffsetRows) {
+    const maxVisibleRows = Math.max(1, termRows - CHAT_UI_RESERVED_ROWS);
+    const rowWidth = getRowWidth(termCols);
+    const flatRows = [];
+    for (const msg of messages) {
+        flatRows.push(...buildMessageRows(msg, rowWidth));
+        flatRows.push({
+            key: `${msg.id}:spacer`,
+            kind: "spacer",
+            text: "",
+        });
+    }
+    const totalRows = flatRows.length;
+    const visibleEndIdx = Math.max(0, totalRows - scrollOffsetRows);
+    const visibleStartIdx = Math.max(0, visibleEndIdx - maxVisibleRows);
+    return {
+        rows: flatRows.slice(visibleStartIdx, visibleEndIdx),
+        hiddenAboveRows: visibleStartIdx,
+        hiddenBelowRows: totalRows - visibleEndIdx,
+        totalRows,
+        maxVisibleRows,
+    };
 }
-/** Render a single inline segment with its formatting */
-function SegmentComponent({ seg, baseColor }) {
-    if (seg.bold && seg.italic) {
-        return _jsx(Text, { bold: true, italic: true, color: seg.color ?? baseColor, children: seg.text });
+export function getScrollRequest(inputChar, key) {
+    const sgrMouseMatch = SGR_MOUSE_SEQUENCE.exec(inputChar);
+    SGR_MOUSE_SEQUENCE.lastIndex = 0;
+    if (sgrMouseMatch) {
+        const buttonCode = Number.parseInt(sgrMouseMatch[1] ?? "", 10);
+        if (Number.isFinite(buttonCode) && buttonCode >= 64) {
+            const wheelButton = buttonCode & 0b11;
+            if (wheelButton === 0) {
+                return { direction: "up", kind: "line" };
+            }
+            if (wheelButton === 1) {
+                return { direction: "down", kind: "line" };
+            }
+        }
     }
-    if (seg.bold) {
-        return _jsx(Text, { bold: true, color: seg.color ?? baseColor, children: seg.text });
+    if (key.pageUp || inputChar === "[5~") {
+        return { direction: "up", kind: "page" };
     }
-    if (seg.italic) {
-        return _jsx(Text, { italic: true, color: seg.color ?? baseColor, children: seg.text });
+    if (key.pageDown || inputChar === "[6~") {
+        return { direction: "down", kind: "page" };
     }
-    if (seg.code) {
-        return _jsx(Text, { color: theme.codeInline, children: seg.text });
+    if (key.ctrl && (inputChar === "u" || inputChar === "U")) {
+        return { direction: "up", kind: "page" };
     }
-    if (seg.color) {
-        return _jsx(Text, { color: seg.color, children: seg.text });
+    if (key.ctrl && (inputChar === "d" || inputChar === "D")) {
+        return { direction: "down", kind: "page" };
     }
-    return _jsx(Text, { color: baseColor, children: seg.text });
-}
-/** Render a single MarkdownLine with appropriate styling */
-function MarkdownLineComponent({ line, color, }) {
-    // Empty line -> render as blank space
-    if (line.text === "") {
-        return _jsx(Text, { children: " " });
+    if (key.meta && key.upArrow) {
+        return { direction: "up", kind: "line" };
+    }
+    if (key.meta && key.downArrow) {
+        return { direction: "down", kind: "line" };
     }
-    // Lines with inline segments (formatted text or syntax-highlighted code)
-    if (line.segments && line.segments.length > 0) {
-        return (_jsx(Box, { flexDirection: "row", flexWrap: "wrap", children: line.segments.map((seg, i) => (_jsx(SegmentComponent, { seg: seg, baseColor: color }, i))) }));
+    if (key.shift && key.upArrow) {
+        return { direction: "up", kind: "line" };
     }
-    const props = {};
-    if (line.bold)
-        props.bold = true;
-    if (line.dim)
-        props.dimColor = true;
-    if (color)
-        props.color = color;
-    return _jsx(Text, { ...props, children: line.text });
+    if (key.shift && key.downArrow) {
+        return { direction: "down", kind: "line" };
+    }
+    return null;
+}
+export function stripMouseEscapeSequences(input) {
+    return input.replace(SGR_MOUSE_SEQUENCE, "");
 }
 const COMMANDS = [
-    { name: '/run', aliases: ['/start'], description: 'Start the goal loop', type: 'command' },
-    { name: '/stop', aliases: ['/quit'], description: 'Stop the running loop', type: 'command' },
-    { name: '/status', aliases: [], description: 'Show current progress', type: 'command' },
-    { name: '/report', aliases: [], description: 'Generate a summary report', type: 'command' },
-    { name: '/goals', aliases: [], description: 'List all goals', type: 'command' },
-    { name: '/help', aliases: ['?'], description: 'Show help overlay', type: 'command' },
-    { name: '/dashboard', aliases: [], description: 'Toggle dashboard sidebar', type: 'command' },
+    {
+        name: "/run",
+        aliases: ["/start"],
+        description: "Start the goal loop",
+        type: "command",
+    },
+    {
+        name: "/stop",
+        aliases: ["/quit"],
+        description: "Stop the running loop",
+        type: "command",
+    },
+    {
+        name: "/status",
+        aliases: [],
+        description: "Show current progress",
+        type: "command",
+    },
+    {
+        name: "/report",
+        aliases: [],
+        description: "Generate a summary report",
+        type: "command",
+    },
+    {
+        name: "/goals",
+        aliases: [],
+        description: "List all goals",
+        type: "command",
+    },
+    {
+        name: "/help",
+        aliases: ["?"],
+        description: "Show help overlay",
+        type: "command",
+    },
+    {
+        name: "/dashboard",
+        aliases: [],
+        description: "Toggle dashboard sidebar",
+        type: "command",
+    },
+    {
+        name: "/settings",
+        aliases: ["/config"],
+        description: "View and toggle config",
+        type: "command",
+    },
+    {
+        name: "/flicker",
+        aliases: [],
+        description: "Toggle no-flicker mode (next launch)",
+        type: "command",
+    },
 ];
 /** Commands that accept a goal name as argument */
-const GOAL_ARG_COMMANDS = ['/run ', '/start '];
-function getMatchingSuggestions(input, goalNames) {
-    if (!input.startsWith('/'))
+const GOAL_ARG_COMMANDS = ["/run ", "/start "];
+function isExactCommandMatch(input) {
+    const normalized = input.trim().toLowerCase();
+    return COMMANDS.some((cmd) => {
+        if (cmd.name.toLowerCase() === normalized)
+            return true;
+        return cmd.aliases.some((alias) => {
+            const normalizedAlias = alias.startsWith("/") ? alias : `/${alias}`;
+            return normalizedAlias.toLowerCase() === normalized;
+        });
+    });
+}
+export function getMatchingSuggestions(input, goalNames) {
+    if (!input.startsWith("/"))
+        return [];
+    if (isExactCommandMatch(input))
         return [];
     // Check if user typed a command that expects a goal name argument
     for (const prefix of GOAL_ARG_COMMANDS) {
         if (input.startsWith(prefix)) {
             const goalQuery = input.slice(prefix.length);
+            if (goalNames.some((goal) => goal.toLowerCase() === goalQuery.toLowerCase())) {
+                return [];
+            }
             const matchedGoals = fuzzyFilter(goalQuery, goalNames, (g) => g, 6);
             return matchedGoals.map((g) => ({
                 name: prefix.trimEnd(),
                 description: g,
                 aliases: [],
-                type: 'goal',
+                type: "goal",
             }));
         }
     }
     // Fuzzy match against command names and aliases
-    const query = input.slice(1); // strip leading '/'
+    const query = input.slice(1); // strip leading "/"
     // Show all commands when query is empty (just "/")
     if (!query) {
-        return COMMANDS.map(cmd => ({ ...cmd }));
+        return COMMANDS.map((cmd) => ({ ...cmd }));
     }
     const scored = [];
     for (const cmd of COMMANDS) {
-        // Try matching against name (without leading '/')
+        // Try matching against name (without leading "/")
         const nameScore = fuzzyMatch(query, cmd.name.slice(1));
         // Try matching against aliases
-        const aliasScores = cmd.aliases.map((a) => a.startsWith('/') ? fuzzyMatch(query, a.slice(1)) : fuzzyMatch(query, a));
+        const aliasScores = cmd.aliases.map((a) => a.startsWith("/") ? fuzzyMatch(query, a.slice(1)) : fuzzyMatch(query, a));
         const bestAlias = aliasScores.reduce((best, s) => (s !== null && (best === null || s > best) ? s : best), null);
         const best = nameScore !== null && (bestAlias === null || nameScore >= bestAlias)
             ? nameScore
@@ -106,74 +251,247 @@ function getMatchingSuggestions(input, goalNames) {
     scored.sort((a, b) => b.score - a.score);
     return scored.slice(0, 6).map((s) => s.cmd);
 }
-export function Chat({ messages, onSubmit, isProcessing, goalNames = [] }) {
+export function Chat({ messages, onSubmit, onClear, isProcessing, goalNames = [], noFlicker, }) {
     const [input, setInput] = useState("");
     const [selectedIdx, setSelectedIdx] = useState(0);
     // Tracks whether a suggestion was just selected so getMatchingSuggestions
     // returns [] for one render cycle, allowing Enter to submit unblocked.
     const justSelected = React.useRef(false);
-    const matches = justSelected.current ? [] : getMatchingSuggestions(input, goalNames);
+    // ── Input history (shell-like ↑↓ recall) ──
+    const [history, setHistory] = React.useState([]);
+    const [historyIdx, setHistoryIdx] = React.useState(-1);
+    const [draft, setDraft] = React.useState("");
+    // ── Empty-enter hint ──
+    const [emptyHint, setEmptyHint] = React.useState(false);
+    // ── Copy toast (shown when clipboard changes) ──
+    const [copyToast, setCopyToast] = useState(null);
+    const emptyHintTimer = React.useRef(null);
+    // ── Scroll offset for chat scroll ──
+    const [scrollOffset, setScrollOffset] = React.useState(0);
+    // ── Clipboard change detection — poll every 500ms ──
+    React.useEffect(() => {
+        let lastClipboard = "";
+        let mounted = true;
+        // Get initial clipboard content (don't toast on startup)
+        getClipboardContent().then(content => {
+            if (mounted)
+                lastClipboard = content;
+        });
+        const interval = setInterval(async () => {
+            if (!mounted)
+                return;
+            const current = await getClipboardContent();
+            if (current !== lastClipboard && current.length > 0) {
+                lastClipboard = current;
+                setCopyToast(`copied ${current.length} chars to clipboard`);
+                setTimeout(() => {
+                    if (mounted)
+                        setCopyToast(null);
+                }, 2000);
+            }
+        }, 500);
+        return () => {
+            mounted = false;
+            clearInterval(interval);
+        };
+    }, []);
+    const [spinnerVerb, setSpinnerVerb] = React.useState(() => pickSpinnerVerb());
+    React.useEffect(() => {
+        if (!isProcessing)
+            return;
+        const interval = setInterval(() => {
+            setSpinnerVerb(pickSpinnerVerb());
+        }, 5000);
+        return () => clearInterval(interval);
+    }, [isProcessing]);
+    const matches = justSelected.current
+        ? []
+        : getMatchingSuggestions(input, goalNames);
     const hasMatches = matches.length > 0;
-    useInput((_, key) => {
-        if (!hasMatches)
+    const bashMode = isBashModeInput(input);
+    // Scroll-slicing: clip messages to visible terminal height
+    const { stdout } = useStdout();
+    const termRows = stdout?.rows ?? 24;
+    const termCols = stdout?.columns ?? 80;
+    const viewport = buildChatViewport(messages, termCols, termRows, scrollOffset);
+    const applyScroll = useCallback((direction, kind) => {
+        setScrollOffset((prev) => {
+            const maxOffset = Math.max(0, viewport.totalRows - 1);
+            const amount = kind === "page" ? viewport.maxVisibleRows : SCROLL_LINE_STEP;
+            const delta = direction === "up" ? amount : -amount;
+            return Math.max(0, Math.min(maxOffset, prev + delta));
+        });
+    }, [viewport.maxVisibleRows, viewport.totalRows]);
+    useInput((inputChar, key) => {
+        const scrollRequest = getScrollRequest(inputChar, key);
+        if (scrollRequest) {
+            applyScroll(scrollRequest.direction, scrollRequest.kind);
             return;
-        if (key.upArrow) {
-            setSelectedIdx((prev) => (prev <= 0 ? matches.length - 1 : prev - 1));
-        }
-        else if (key.downArrow) {
-            setSelectedIdx((prev) => (prev >= matches.length - 1 ? 0 : prev + 1));
         }
-        else if (key.tab || key.return) {
-            const selected = matches[selectedIdx];
-            if (selected) {
-                // Auto-submit on selection (no extra Enter needed)
-                const value = selected.type === 'goal'
-                    ? `${selected.name} ${selected.description}`
-                    : selected.name;
-                setInput("");
+        if (hasMatches) {
+            if (key.upArrow) {
+                setSelectedIdx((prev) => (prev <= 0 ? matches.length - 1 : prev - 1));
+            }
+            else if (key.downArrow) {
+                setSelectedIdx((prev) => (prev >= matches.length - 1 ? 0 : prev + 1));
+            }
+            else if (key.tab || key.return) {
+                const selected = matches[selectedIdx];
+                if (selected) {
+                    // Insert suggestion into input (don't submit)
+                    const value = selected.type === "goal"
+                        ? `${selected.name} ${selected.description}`
+                        : selected.name;
+                    setInput(value);
+                    setSelectedIdx(0);
+                    justSelected.current = true;
+                }
+            }
+            else if (key.escape) {
                 setSelectedIdx(0);
-                onSubmit(value.trim());
+                setInput("");
             }
         }
-        else if (key.escape) {
-            setSelectedIdx(0);
-            setInput("");
+        else {
+            // ── Input history: ↑↓ when no suggestions ──
+            if (key.upArrow) {
+                if (history.length > 0) {
+                    if (historyIdx === -1) {
+                        setDraft(input);
+                        const idx = history.length - 1;
+                        setHistoryIdx(idx);
+                        setInput(history[idx]);
+                    }
+                    else if (historyIdx > 0) {
+                        const idx = historyIdx - 1;
+                        setHistoryIdx(idx);
+                        setInput(history[idx]);
+                    }
+                }
+            }
+            else if (key.downArrow && historyIdx !== -1) {
+                if (historyIdx < history.length - 1) {
+                    const idx = historyIdx + 1;
+                    setHistoryIdx(idx);
+                    setInput(history[idx]);
+                }
+                else {
+                    setHistoryIdx(-1);
+                    setInput(draft);
+                }
+            }
         }
-    });
+    }, { isActive: !isProcessing });
     // Reset selected index when matches change
+    const matchKey = matches.map((m) => m.name).join(",");
     React.useEffect(() => {
         setSelectedIdx(0);
-    }, [matches.map(m => m.name).join(',')]);
+    }, [matchKey]);
+    // Cleanup emptyHint timer on unmount
+    React.useEffect(() => {
+        return () => {
+            if (emptyHintTimer.current)
+                clearTimeout(emptyHintTimer.current);
+        };
+    }, []);
+    // Refs for stdout intercept to access current state without re-renders
+    const inputRef = React.useRef(input);
+    const isProcessingRef = React.useRef(isProcessing);
+    React.useEffect(() => {
+        inputRef.current = input;
+    }, [input]);
+    React.useEffect(() => {
+        isProcessingRef.current = isProcessing;
+    }, [isProcessing]);
+    // Stdout intercept: capture frame AND position cursor via direct ANSI injection
+    React.useEffect(() => {
+        const original = process.stdout.write.bind(process.stdout);
+        const patched = function (chunk, ...args) {
+            // Only process full Ink frames (not small escape sequences)
+            if (typeof chunk === "string" &&
+                isRenderableFrameChunk(chunk) &&
+                !isProcessingRef.current) {
+                if (noFlicker) {
+                    const cursorEsc = buildCursorEscape(chunk, inputRef.current) ?? undefined;
+                    const result = original(chunk, cursorEsc ? { cursorEscape: cursorEsc } : undefined, ...args);
+                    return result;
+                }
+                // Standard mode: write frame, then position cursor separately
+                const result = original(chunk, ...args);
+                positionCursorInFrame(chunk, inputRef.current, original);
+                return result;
+            }
+            return original(chunk, ...args);
+        };
+        process.stdout.write = patched;
+        return () => {
+            process.stdout.write = original;
+        };
+    }, []);
+    // Hide cursor during AI processing
+    React.useEffect(() => {
+        if (isProcessing) {
+            const original = process.stdout.write.bind(process.stdout);
+            original("\x1b[?25l");
+        }
+    }, [isProcessing]);
     const handleSubmit = (value) => {
         if (hasMatches)
             return; // let useInput handle enter when suggestions are shown
-        if (!value.trim() || isProcessing)
+        if (isProcessing)
+            return;
+        if (!value.trim()) {
+            // Show empty-enter hint
+            setEmptyHint(true);
+            if (emptyHintTimer.current)
+                clearTimeout(emptyHintTimer.current);
+            emptyHintTimer.current = setTimeout(() => setEmptyHint(false), 1500);
             return;
-        onSubmit(value.trim());
+        }
+        const trimmed = value.trim();
+        // /clear command
+        if (trimmed === "/clear") {
+            onClear?.();
+            setInput("");
+            setHistory((prev) => [...prev, trimmed]);
+            setHistoryIdx(-1);
+            setScrollOffset(0);
+            return;
+        }
+        onSubmit(trimmed);
         setInput("");
+        setHistory((prev) => [...prev, trimmed]);
+        setHistoryIdx(-1);
+        setScrollOffset(0);
     };
-    // Cap visible messages based on terminal height
-    const termRows = process.stdout.rows || 40;
-    const visibleCount = Math.max(termRows - 12, 8);
-    const startIdx = Math.max(messages.length - visibleCount, 0);
-    const visibleMessages = messages.slice(startIdx);
-    return (_jsxs(Box, { flexDirection: "column", flexGrow: 1, overflow: "hidden", children: [startIdx > 0 && (_jsxs(Text, { dimColor: true, children: ["\u2191", " ", startIdx, " earlier messages"] })), _jsxs(Box, { flexDirection: "column", flexGrow: 1, children: [visibleMessages.map((msg, i) => {
-                        const timeStr = formatTime(msg.timestamp ?? new Date());
-                        const absoluteIdx = startIdx + i;
-                        if (msg.role === "user") {
-                            return (_jsx(Box, { flexDirection: "column", marginBottom: 2, children: _jsxs(Box, { children: [_jsx(Text, { color: theme.userPrefix, bold: true, children: "\u276F " }), _jsx(Text, { children: msg.text }), _jsxs(Text, { dimColor: true, children: [" ", timeStr] })] }) }, absoluteIdx));
+    return (_jsxs(Box, { flexDirection: "column", flexGrow: 1, overflow: "hidden", children: [viewport.hiddenAboveRows > 0 && (_jsxs(Text, { dimColor: true, children: ["↑", " ", viewport.hiddenAboveRows, " earlier lines"] })), _jsxs(Box, { flexDirection: "column", flexGrow: 1, justifyContent: "flex-end", children: [viewport.rows.map((row) => {
+                        if (row.kind === "spacer") {
+                            return (_jsx(Box, { height: 1, children: _jsx(Text, { children: " " }) }, row.key));
+                        }
+                        const text = row.text;
+                        const textProps = {};
+                        if (row.color)
+                            textProps.color = row.color;
+                        if (row.bold)
+                            textProps.bold = true;
+                        if (row.dim)
+                            textProps.dimColor = true;
+                        if (row.italic)
+                            textProps.italic = true;
+                        if (row.kind === "user") {
+                            return (_jsx(Box, { paddingX: row.paddingX ?? 0, children: _jsx(Text, { ...textProps, backgroundColor: row.backgroundColor, children: text }) }, row.key));
                         }
-                        // PulSeed message — render markdown lines individually
-                        const typeColor = getMessageTypeColor(msg.messageType);
-                        const mdLines = renderMarkdownLines(msg.text);
-                        return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, marginLeft: 2, children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsx(Text, { color: theme.brand, bold: true, children: "PulSeed" }), _jsx(Text, { dimColor: true, children: timeStr })] }), _jsx(Box, { flexDirection: "column", children: mdLines.map((line, j) => (_jsx(MarkdownLineComponent, { line: line, color: typeColor }, j))) })] }, absoluteIdx));
-                    }), isProcessing && (_jsxs(Box, { children: [_jsx(Text, { color: theme.warning, children: _jsx(Spinner, { type: "dots" }) }), _jsx(Text, { color: theme.warning, children: " Thinking..." })] }))] }), _jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { borderStyle: "single", borderColor: theme.border, borderBottom: false, borderLeft: false, borderRight: false }), _jsxs(Box, { children: [_jsx(Text, { color: theme.userPrompt, bold: true, children: "\u276F " }), _jsx(TextInput, { value: input, onChange: (val) => { justSelected.current = false; setInput(val); }, onSubmit: handleSubmit, placeholder: "/ for commands" })] }), _jsx(Box, { borderStyle: "single", borderColor: theme.border, borderTop: false, borderLeft: false, borderRight: false }), hasMatches && (_jsxs(Box, { flexDirection: "column", children: [matches.map((suggestion, idx) => {
-                                const isSelected = idx === selectedIdx;
-                                const label = suggestion.type === 'goal'
-                                    ? `  ${suggestion.name} ${suggestion.description.padEnd(20)}  [goal]`
-                                    : `  ${suggestion.name.padEnd(20)}${suggestion.description}`;
-                                const key = `${suggestion.type}-${suggestion.name}-${suggestion.description}`;
-                                return isSelected ? (_jsx(Text, { bold: true, color: theme.selected, children: label }, key)) : (_jsx(Text, { dimColor: true, children: label }, key));
-                            }), _jsx(Text, { dimColor: true, children: "  arrows to navigate, tab/enter to select, esc to dismiss" })] }))] })] }));
+                        return (_jsx(Box, { marginLeft: row.marginLeft ?? 0, children: _jsx(Text, { ...textProps, children: text }) }, row.key));
+                    }), isProcessing && (_jsxs(Box, { children: [_jsx(CheckerboardSpinner, {}), _jsx(Text, { children: " " }), _jsx(ShimmerText, { children: `${spinnerVerb}...` })] })), viewport.hiddenBelowRows > 0 && (_jsxs(Text, { dimColor: true, children: ["↓", " ", viewport.hiddenBelowRows, " newer lines"] })), _jsx(Box, { justifyContent: "flex-end", height: 1, children: copyToast && _jsx(Text, { color: "cyan", children: copyToast }) }), _jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { borderStyle: "single", borderColor: bashMode ? theme.command : theme.border, borderBottom: false, borderLeft: false, borderRight: false }), _jsxs(Box, { children: [_jsx(Text, { color: bashMode ? theme.command : theme.userPrompt, bold: true, children: "​◉ " }), _jsx(TextInput, { value: input, onChange: (val) => {
+                                            justSelected.current = false;
+                                            setInput(stripMouseEscapeSequences(val));
+                                        }, onSubmit: handleSubmit, placeholder: bashMode ? "! for bash mode" : "/ for commands" })] }), _jsx(Box, { borderStyle: "single", borderColor: bashMode ? theme.command : theme.border, borderTop: false, borderLeft: false, borderRight: false }), bashMode && _jsx(Text, { color: theme.command, children: "! for bash mode" }), emptyHint && (_jsx(Text, { dimColor: true, children: " Type a message or /help for commands" })), hasMatches && (_jsxs(Box, { flexDirection: "column", children: [matches.map((suggestion, idx) => {
+                                        const isSelected = idx === selectedIdx;
+                                        const label = suggestion.type === "goal"
+                                            ? `  ${suggestion.name} ${suggestion.description.padEnd(20)}  [goal]`
+                                            : `  ${suggestion.name.padEnd(20)}${suggestion.description}`;
+                                        const key = `${suggestion.type}-${suggestion.name}-${suggestion.description}`;
+                                        return isSelected ? (_jsx(Text, { bold: true, color: theme.selected, children: label }, key)) : (_jsx(Text, { dimColor: true, children: label }, key));
+                                    }), _jsxs(Text, { dimColor: true, children: [" ", "arrows to navigate, tab/enter to select, esc to dismiss"] })] }))] })] })] }));
 }
 //# sourceMappingURL=chat.js.map