@prestyj/cli 4.3.209 → 4.3.237

package/dist/ui/components/InputArea.js

@@ -1,17 +1,23 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React, { useState, useRef, useEffect, useMemo } from "react";
-import { Text, Box, useInput, useStdin } from "ink";
+import { Text, Box, useInput, useStdin, useIsScreenReaderEnabled } from "ink";
 import { useTheme } from "../theme/theme.js";
 import { useFocusedAnimation, deriveFrame } from "./AnimationContext.js";
 import { useTerminalSize } from "../hooks/useTerminalSize.js";
 import { extractImagePaths, readImageFile, getClipboardImage } from "../../utils/image.js";
 import { SlashCommandMenu, filterCommands } from "./SlashCommandMenu.js";
+import { TaskPickerMenu } from "./TaskPickerMenu.js";
+import { stripTerminalFocusSequences } from "../utils/terminal-input.js";
 import { log } from "../../core/logger.js";
 import { homedir } from "node:os";
 import { join } from "node:path";
 import { readFileSync, writeFileSync, appendFileSync, mkdirSync, renameSync, unlinkSync, existsSync, } from "node:fs";
 const MAX_VISIBLE_LINES = 12;
-const PROMPT = "❯ ";
+const PROMPT = "> ";
+const PLACEHOLDER = "  Type your message or / to run a command";
+const INPUT_BACKGROUND = "#374151";
+const INPUT_TOP_FILL = "▄";
+const INPUT_BOTTOM_FILL = "▀";
 // SGR mouse sequence: ESC [ < button ; col ; row M/m
 // M = press, m = release. Coordinates are 1-based.
 // SGR mouse sequence (global) — used both to strip sequences from input data
@@ -22,14 +28,20 @@ const SGR_MOUSE_RE_G = /\x1b\[<(\d+);(\d+);(\d+)([Mm])/g;
 // ?1000h = basic click tracking, ?1006h = SGR extended mode (supports coords > 223).
 const ENABLE_MOUSE = "\x1b[?1000h\x1b[?1006h";
 const DISABLE_MOUSE = "\x1b[?1006l\x1b[?1000l";
+// Idle window (ms) for the legacy scroll-passthrough release: a short pause
+// reliably spans a wheel gesture before tracking re-arms.
+const SCROLL_PAUSE_MS = 300;
+// Safety net only. In fullscreen, native text selection releases the mouse with
+// NO active timer — the wheel re-arms on the next keystroke instead, so a slow
+// drag is never cut short. This long timer only fires if the user never presses
+// a key afterward (e.g. copies text and switches apps), so the mouse doesn't
+// stay captured forever in that edge case.
+const NATIVE_INTERACTION_SAFETY_MS = 60_000;
 // Guard against stray SGR mouse sequences leaking into text input.
 // Some terminals or multiplexers send these even without mouse tracking enabled.
 function isMouseEscapeSequence(input) {
     return input.includes("[<") && /\[<\d+;\d+;\d+[Mm]/.test(input);
 }
-function stripTerminalFocusSequences(input) {
-    return input.replaceAll("\x1b[I", "").replaceAll("\x1b[O", "");
-}
 // Option+Arrow escape sequences — terminals send these as raw input strings
 // rather than setting key.meta + key.leftArrow reliably.
 const OPTION_LEFT_SEQUENCES = new Set([
@@ -179,8 +191,11 @@ function compactHistory() {
         }
     }
 }
-// Border (1 each side) + padding (1 each side) = 4 characters of overhead
-const BOX_OVERHEAD = 4;
+// Lines advanced per mouse-wheel notch in fullscreen transcript scrolling.
+const WHEEL_LINES_PER_NOTCH = 3;
+// Padding (1 each side) = 2 characters of overhead. Gemini's composer is borderless
+// except for a zero-height top rule, so wrapping should not reserve border columns.
+const INPUT_HORIZONTAL_OVERHEAD = 2;
 // Minimum content width to prevent zero/negative values that cause infinite
 // re-render loops when Ink tries to wrap text wider than available space.
 const MIN_CONTENT_WIDTH = 10;
@@ -212,7 +227,7 @@ function wrapLine(text, contentWidth) {
     return lines;
 }
 function getVisualLines(text, columns) {
-    const contentWidth = Math.max(MIN_CONTENT_WIDTH, columns - PROMPT.length - BOX_OVERHEAD);
+    const contentWidth = Math.max(MIN_CONTENT_WIDTH, columns - PROMPT.length - INPUT_HORIZONTAL_OVERHEAD);
     if (text.length === 0)
         return [""];
     // Split on real newlines first, then wrap each
@@ -223,9 +238,9 @@ function getVisualLines(text, columns) {
     }
     return result;
 }
-export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true, onDownAtEnd, onShiftTab, onToggleTasks, onToggleGoal, onToggleSkills, onTogglePixel, onTogglePlanMode, cwd, commands = [], eyesCount, scopeBadge, disableMouseTracking, onTab, }) {
+export function InputArea({ onSubmit, onAbort, injectText, disabled = false, isActive = true, onDownAtEnd, onShiftTab, onToggleTasks, taskPickerOpen = false, tasks = [], onCloseTaskPicker, onStartTask, onRunAllTasks, onDeleteTask, onToggleSkills, onTogglePixel, onToggleGoal, onToggleMarkdown, cwd, commands = [], scopeBadge, disableMouseTracking, mouseScroll, onScroll, onTab, }) {
     const theme = useTheme();
-    const eyesBadge = eyesCount && eyesCount > 0 ? (_jsx(Text, { color: theme.accent, bold: true, children: `[eyes: ${eyesCount}↗] ` })) : null;
+    const isScreenReaderEnabled = useIsScreenReaderEnabled();
     const [value, setValue] = useState("");
     const [cursor, setCursor] = useState(0);
     const cursorRef = useRef(cursor);
@@ -235,6 +250,22 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
     const historyRef = useRef(loadHistory());
     const historyIndexRef = useRef(-1);
     const draftRef = useRef("");
+    // ── External text injection (e.g. queued messages restored on interrupt) ──
+    // Append injected text to any existing draft and move the cursor to the end.
+    // Keyed on nonce so repeated injections of identical text still fire.
+    const lastInjectNonceRef = useRef(null);
+    useEffect(() => {
+        if (!injectText || injectText.text.length === 0)
+            return;
+        if (lastInjectNonceRef.current === injectText.nonce)
+            return;
+        lastInjectNonceRef.current = injectText.nonce;
+        setValue((prev) => {
+            const next = prev.length > 0 ? `${prev}\n\n${injectText.text}` : injectText.text;
+            setCursor(next.length);
+            return next;
+        });
+    }, [injectText]);
     // ── Ctrl+R history search state ──────────────────────────
     const [searchMode, setSearchMode] = useState(false);
     const [searchQuery, setSearchQuery] = useState("");
@@ -260,6 +291,7 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
     const lastEscRef = useRef(0);
     const { columns } = useTerminalSize();
     const [menuIndex, setMenuIndex] = useState(0);
+    const [taskPickerIndex, setTaskPickerIndex] = useState(0);
     const [pasteText, setPasteText] = useState(""); // accumulated pasted content
     const [pasteOffset, setPasteOffset] = useState(0); // where in value the paste starts
     const pasteTimerRef = useRef(null);
@@ -267,10 +299,14 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
     const isSlashMode = value.startsWith("/") && !value.includes(" ") && commands.length > 0;
     const slashFilter = isSlashMode ? value.slice(1) : "";
     const filteredCommands = useMemo(() => (isSlashMode ? filterCommands(commands, slashFilter) : []), [isSlashMode, commands, slashFilter]);
+    const runnableTasks = useMemo(() => tasks.filter((task) => task.status !== "done"), [tasks]);
     // Reset menu index when filter changes
     useEffect(() => {
         setMenuIndex(0);
     }, [slashFilter]);
+    useEffect(() => {
+        setTaskPickerIndex((index) => Math.min(index, Math.max(0, runnableTasks.length - 1)));
+    }, [runnableTasks.length]);
     // Border color pulse (when idle/waiting for input)
     const borderPulseColors = useMemo(() => [theme.primary, theme.accent, theme.secondary, theme.accent], [theme.primary, theme.accent, theme.secondary]);
     // Derive border pulse and cursor blink from global animation tick.
@@ -408,6 +444,18 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
     // is empty, click-to-cursor is useless and disabling tracking lets the
     // terminal handle CMD+click for opening links natively.
     const hasInputTextRef = useRef(value.length > 0);
+    // Fullscreen wheel-scroll routing. Kept in refs so the emit-wrapper effect
+    // (whose deps are intentionally stable) always sees the freshest callback.
+    const mouseScrollRef = useRef(mouseScroll);
+    mouseScrollRef.current = mouseScroll;
+    const onScrollRef = useRef(onScroll);
+    onScrollRef.current = onScroll;
+    // Assigned by the mouse effect; called by the keyboard handler to re-arm
+    // mouse tracking after the user finishes a native text selection (see the
+    // fullscreen selection-mode logic below). Lifting it out of the effect lets
+    // a keystroke — the unambiguous "I'm done selecting" signal — restore the
+    // wheel without a fragile timer that would cut a slow selection short.
+    const reenableMouseRef = useRef(() => { });
     useEffect(() => {
         if (!isActive || !internal_eventEmitter)
             return;
@@ -422,7 +470,9 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
             return;
         // Only enable mouse tracking if there's text — when empty, let the
         // terminal handle clicks natively (e.g., CMD+click to open links).
-        if (hasInputTextRef.current) {
+        // In fullscreen mode we always enable it so wheel-scroll events arrive even
+        // when the composer is empty (there's no native scrollback to fall back to).
+        if (hasInputTextRef.current || mouseScrollRef.current) {
             process.stdout.write(ENABLE_MOUSE);
         }
         // Safety: ensure mouse tracking is disabled even on crash/SIGINT/unexpected exit
@@ -431,25 +481,56 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
         process.on("exit", onProcessExit);
         const originalEmit = internal_eventEmitter.emit.bind(internal_eventEmitter);
         mouseEmitRef.current.original = originalEmit;
-        // Scroll passthrough: when a scroll event is detected, temporarily disable
-        // mouse tracking so the terminal handles scroll natively (scrollback buffer).
-        // Re-enable after a short idle period so click-to-cursor continues to work.
+        // Mouse-release passthrough: when we want the TERMINAL (not the app) to
+        // handle a gesture — native scroll in the legacy model, or native text
+        // selection / CMD+click link-opening in fullscreen — we disable mouse
+        // tracking so the terminal owns the mouse.
         let scrollTimer = null;
         let mouseDisabled = false;
+        // Re-arm mouse tracking only when something still needs it: there's input
+        // text to position a cursor in (legacy click-to-cursor), OR we're in
+        // fullscreen where the wheel drives the transcript scroll. Without the
+        // fullscreen clause the mouse would stay dead after the first click and the
+        // wheel would stop scrolling.
         const reenableMouse = () => {
-            if (mouseDisabled && hasInputTextRef.current) {
+            if (scrollTimer) {
+                clearTimeout(scrollTimer);
+                scrollTimer = null;
+            }
+            if (mouseDisabled && (hasInputTextRef.current || mouseScrollRef.current)) {
                 process.stdout.write(ENABLE_MOUSE);
                 mouseDisabled = false;
             }
         };
-        const pauseMouseForScroll = () => {
+        // Exposed so the keyboard handler can re-arm on the next keystroke.
+        reenableMouseRef.current = reenableMouse;
+        // Timed release — used for the legacy scroll-passthrough model where a short
+        // idle reliably means the wheel gesture is over.
+        const pauseMouseTimed = (durationMs) => {
+            if (!mouseDisabled) {
+                process.stdout.write(DISABLE_MOUSE);
+                mouseDisabled = true;
+            }
+            if (scrollTimer)
+                clearTimeout(scrollTimer);
+            scrollTimer = setTimeout(reenableMouse, durationMs);
+        };
+        const pauseMouseForScroll = () => pauseMouseTimed(SCROLL_PAUSE_MS);
+        // Indefinite release for native selection / link-clicks in fullscreen. NO
+        // timer: a text selection can take as long as the user wants, and a timer
+        // that re-armed mid-drag would abort the selection. The wheel is restored
+        // only when the user presses a key (handled in the keyboard useInput) — an
+        // unambiguous signal that they're done selecting and back to driving the
+        // app. A long safety-net timer guards against a stuck state if no key ever
+        // follows (e.g. they copy and switch windows).
+        const pauseMouseForNativeInteraction = () => {
             if (!mouseDisabled) {
                 process.stdout.write(DISABLE_MOUSE);
                 mouseDisabled = true;
             }
             if (scrollTimer)
                 clearTimeout(scrollTimer);
-            scrollTimer = setTimeout(reenableMouse, 300);
+            scrollTimer = setTimeout(reenableMouse, NATIVE_INTERACTION_SAFETY_MS);
         };
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         internal_eventEmitter.emit = (event, ...args) => {
@@ -477,12 +558,32 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
                     const hasModifier = (btnCode & 0b11100) !== 0; // shift, meta, or ctrl
                     const isMotion = (btnCode & 32) !== 0;
                     const isScroll = (btnCode & 64) !== 0;
-                    // On scroll: disable mouse tracking so the terminal handles it natively,
-                    // then re-enable after idle so click-to-cursor keeps working.
+                    // On scroll wheel:
                     if (isScroll) {
+                        // Fullscreen alt-screen: no native scrollback exists, so route the
+                        // wheel into the in-app transcript scroll. Wheel-up (button bit 0
+                        // clear) scrolls toward older output, wheel-down toward newest.
+                        if (mouseScrollRef.current && onScrollRef.current) {
+                            const wheelUp = (btnCode & 1) === 0;
+                            onScrollRef.current(wheelUp ? WHEEL_LINES_PER_NOTCH : -WHEEL_LINES_PER_NOTCH);
+                            continue;
+                        }
+                        // Legacy scrollback model: disable mouse tracking so the terminal
+                        // handles it natively, then re-enable after idle.
                         pauseMouseForScroll();
                         continue;
                     }
+                    // Fullscreen: the wheel is the ONLY gesture we capture. Any other
+                    // mouse event means the user wants to interact with the terminal
+                    // itself — drag to select/copy text, or CMD+click a link. Release the
+                    // mouse so the terminal handles it natively, then re-arm for the
+                    // wheel after an idle window. (We trade away composer click-to-cursor
+                    // in fullscreen; the keyboard positions the cursor, and copy/paste +
+                    // links matter more.)
+                    if (mouseScrollRef.current) {
+                        pauseMouseForNativeInteraction();
+                        continue;
+                    }
                     // When modifier keys are held (CMD+click, Ctrl+click, Shift+click),
                     // temporarily disable mouse tracking so the terminal can handle
                     // the click natively (e.g., opening links with CMD+click).
@@ -584,6 +685,7 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
         return () => {
             if (scrollTimer)
                 clearTimeout(scrollTimer);
+            reenableMouseRef.current = () => { };
             process.stdout.write(DISABLE_MOUSE);
             process.removeListener("exit", onProcessExit);
             // Restore original emit
@@ -602,11 +704,13 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
         const hasText = value.length > 0;
         if (hasText !== hasInputTextRef.current) {
             hasInputTextRef.current = hasText;
-            if (isActive) {
+            // In fullscreen mode mouse tracking stays on regardless of input text so
+            // wheel-scroll keeps working with an empty composer — never disable it.
+            if (isActive && !mouseScroll) {
                 process.stdout.write(hasText ? ENABLE_MOUSE : DISABLE_MOUSE);
             }
         }
-    }, [value, isActive]);
+    }, [value, isActive, mouseScroll]);
     // Helper: delete selected text and return new value + cursor position.
     // Returns null if no selection is active.
     const deleteSelection = () => {
@@ -631,8 +735,14 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
             return;
         if (isMouseEscapeSequence(inputWithoutFocusReports))
             return;
+        // A real keystroke is the "I'm done selecting" signal: re-arm mouse
+        // tracking (no-op if it was never released) so the wheel works again.
+        // This is why native selection can take as long as the user wants — it's
+        // ended by intent (a key) rather than a timer that could cut it short.
+        reenableMouseRef.current();
         // Reset kill ring accumulation for non-kill keys
         input = inputWithoutFocusReports;
+        const isReturnKey = key.return || input === "\r" || input === "\n";
         const isKillKey = key.ctrl && (input === "k" || input === "u" || input === "w");
         if (!isKillKey)
             lastActionWasKill = false;
@@ -669,7 +779,7 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
                 setCursor(savedCursorRef.current);
                 return;
             }
-            if (key.return) {
+            if (isReturnKey) {
                 // Accept match and submit
                 setSearchMode(false);
                 return; // fall through to normal submit handling
@@ -706,14 +816,41 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
             }
             return; // absorb all other keys during search
         }
-        // Ctrl+T toggles task overlay — works even while agent is running
-        if (key.ctrl && input === "t") {
-            onToggleTasks?.();
+        if (taskPickerOpen) {
+            if (key.escape || (key.ctrl && input === "t")) {
+                onCloseTaskPicker?.();
+                return;
+            }
+            if (key.upArrow) {
+                setTaskPickerIndex((i) => Math.max(0, i - 1));
+                return;
+            }
+            if (key.downArrow) {
+                setTaskPickerIndex((i) => Math.min(runnableTasks.length - 1, i + 1));
+                return;
+            }
+            if (input.toLowerCase() === "r") {
+                const task = runnableTasks[Math.min(taskPickerIndex, runnableTasks.length - 1)];
+                onRunAllTasks?.(task);
+                return;
+            }
+            if (input.toLowerCase() === "d") {
+                const task = runnableTasks[Math.min(taskPickerIndex, runnableTasks.length - 1)];
+                if (task)
+                    onDeleteTask?.(task);
+                return;
+            }
+            if (isReturnKey) {
+                const task = runnableTasks[Math.min(taskPickerIndex, runnableTasks.length - 1)];
+                if (task)
+                    onStartTask?.(task);
+                return;
+            }
             return;
         }
-        // Ctrl+G toggles goal overlay in normal input mode. In search mode it cancels search above.
-        if (key.ctrl && input === "g") {
-            onToggleGoal?.();
+        // Ctrl+T toggles task picker
+        if (key.ctrl && input === "t") {
+            onToggleTasks?.();
             return;
         }
         // Ctrl+S toggles skills overlay
@@ -726,9 +863,14 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
             onTogglePixel?.();
             return;
         }
-        // Ctrl+P toggles plan mode
-        if (key.ctrl && input === "p") {
-            onTogglePlanMode?.();
+        // Ctrl+G toggles durable Goal overlay
+        if (key.ctrl && input === "g") {
+            onToggleGoal?.();
+            return;
+        }
+        // Ctrl+M toggles rendered/raw markdown mode, matching Gemini's raw markdown affordance.
+        if (key.ctrl && input === "m") {
+            onToggleMarkdown?.();
             return;
         }
         if (disabled) {
@@ -739,7 +881,7 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
             // When disabled (agent running), allow typing AND submission.
             // Submitted messages will be queued by the parent component.
         }
-        if (key.return && (key.shift || key.meta)) {
+        if (isReturnKey && (key.shift || key.meta)) {
             // If there's a selection, replace it with the newline
             const sel = deleteSelection();
             if (sel) {
@@ -753,7 +895,7 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
             setSelectionAnchor(null);
             return;
         }
-        if (key.return) {
+        if (isReturnKey) {
             // If slash menu is open and a command is selected, fill it in
             if (isSlashMode && filteredCommands.length > 0) {
                 const selected = filteredCommands[Math.min(menuIndex, filteredCommands.length - 1)];
@@ -912,6 +1054,10 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
             return;
         }
         if (key.upArrow) {
+            if (taskPickerOpen) {
+                setTaskPickerIndex((i) => Math.max(0, i - 1));
+                return;
+            }
             // If slash menu is open, navigate it
             if (isSlashMode && filteredCommands.length > 0) {
                 setMenuIndex((i) => Math.max(0, i - 1));
@@ -952,6 +1098,10 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
             return;
         }
         if (key.downArrow) {
+            if (taskPickerOpen) {
+                setTaskPickerIndex((i) => Math.min(runnableTasks.length - 1, i + 1));
+                return;
+            }
             // If slash menu is open, navigate it
             if (isSlashMode && filteredCommands.length > 0) {
                 setMenuIndex((i) => Math.min(filteredCommands.length - 1, i + 1));
@@ -1145,7 +1295,7 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
     }, { isActive });
     // Calculate visual lines and cap at MAX_VISIBLE_LINES (scroll to cursor)
     const visualLines = getVisualLines(value, columns);
-    const contentWidth = Math.max(MIN_CONTENT_WIDTH, columns - PROMPT.length - BOX_OVERHEAD);
+    const contentWidth = Math.max(MIN_CONTENT_WIDTH, columns - PROMPT.length - INPUT_HORIZONTAL_OVERHEAD);
     // Find which visual line and column the cursor is on
     const cursorLineInfo = useMemo(() => {
         let pos = 0;
@@ -1210,7 +1360,12 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
         : 0;
     // Active selection range (absolute character offsets)
     const selection = getSelectionRange(selectionAnchor, cursor);
-    return (_jsxs(Box, { flexDirection: "column", width: columns, children: [_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: disabled ? theme.textDim : borderPulseColors[borderFrame], paddingLeft: 1, paddingRight: 1, children: [scopeBadge && _jsx(Box, { marginBottom: 0, children: scopeBadge }), images.length > 0 && (_jsx(Box, { children: _jsx(Text, { color: theme.accent, children: images
+    const promptColor = disabled ? theme.textDim : theme.commandColor;
+    const borderColor = disabled ? theme.textDim : borderPulseColors[borderFrame];
+    const backgroundColor = isScreenReaderEnabled ? undefined : INPUT_BACKGROUND;
+    const renderInputEdge = (fill) => (_jsx(Box, { width: columns, children: _jsx(Text, { color: backgroundColor ?? borderColor, children: fill.repeat(columns) }) }));
+    const renderPromptPrefix = (text) => (_jsx(Text, { color: promptColor, bold: true, backgroundColor: backgroundColor, children: text }));
+    return (_jsxs(Box, { flexDirection: "column", width: columns, flexGrow: 0, flexShrink: 0, children: [renderInputEdge(backgroundColor ? INPUT_TOP_FILL : "─"), _jsxs(Box, { flexDirection: "column", paddingLeft: 1, paddingRight: 1, flexGrow: 0, flexShrink: 0, backgroundColor: backgroundColor, width: columns, children: [scopeBadge && _jsx(Box, { marginBottom: 0, children: scopeBadge }), images.length > 0 && (_jsx(Box, { children: _jsx(Text, { color: theme.accent, children: images
                                 .map((img, i) => img.kind === "text" ? `[File: ${img.fileName}]` : `[Image #${i + 1}]`)
                                 .join(" ") }) })), (() => {
                         if (pasteText && value) {
@@ -1231,7 +1386,7 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
                             else {
                                 cursorInDisplay = pasteOffset + indicator.length;
                             }
-                            return (_jsxs(Box, { children: [searchMode ? (_jsxs(Text, { color: searchFailed ? theme.error : theme.inputPrompt, bold: true, children: [searchFailed ? "(fail)" : "(i-search)", `'${searchQuery}': `] })) : (_jsxs(_Fragment, { children: [eyesBadge, _jsx(Text, { color: disabled ? theme.textDim : theme.inputPrompt, bold: true, children: PROMPT })] })), (() => {
+                            return (_jsxs(Box, { backgroundColor: backgroundColor, width: "100%", children: [searchMode ? (_jsxs(Text, { color: searchFailed ? theme.error : theme.inputPrompt, bold: true, backgroundColor: backgroundColor, children: [searchFailed ? "(fail)" : "(i-search)", `'${searchQuery}': `] })) : (renderPromptPrefix(PROMPT)), (() => {
                                         const beforeCursor = displayStr.slice(0, cursorInDisplay);
                                         const renderDisplaySegment = (text, displayOffset) => {
                                             if (!text)
@@ -1241,18 +1396,18 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
                                                 ? Math.min(text.length, commandEndIndex - displayOffset)
                                                 : 0;
                                             if (cmdChars >= text.length) {
-                                                return (_jsx(Text, { color: theme.commandColor, bold: true, children: text }));
+                                                return (_jsx(Text, { color: theme.commandColor, bold: true, backgroundColor: backgroundColor, children: text }));
                                             }
                                             if (cmdChars > 0) {
-                                                return (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.commandColor, bold: true, children: text.slice(0, cmdChars) }), _jsx(Text, { color: theme.text, children: text.slice(cmdChars) })] }));
+                                                return (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.commandColor, bold: true, backgroundColor: backgroundColor, children: text.slice(0, cmdChars) }), _jsx(Text, { color: theme.commandColor, backgroundColor: backgroundColor, children: text.slice(cmdChars) })] }));
                                             }
-                                            return _jsx(Text, { color: theme.text, children: text });
+                                            return (_jsx(Text, { color: theme.commandColor, backgroundColor: backgroundColor, children: text }));
                                         };
                                         return renderDisplaySegment(beforeCursor, 0);
                                     })(), (() => {
                                         const cursorChar = cursorInDisplay < displayStr.length ? displayStr[cursorInDisplay] : " ";
                                         const cursorInCmd = isCommand && cursorInDisplay < commandEndIndex;
-                                        return (_jsx(Text, { color: cursorInCmd ? theme.commandColor : theme.text, bold: cursorInCmd || undefined, inverse: cursorVisible, children: cursorChar }));
+                                        return (_jsx(Text, { color: theme.commandColor, bold: cursorInCmd || undefined, inverse: cursorVisible, backgroundColor: backgroundColor, children: cursorChar }));
                                     })(), cursorInDisplay + 1 < displayStr.length &&
                                         (() => {
                                             const afterCursor = displayStr.slice(cursorInDisplay + 1);
@@ -1265,11 +1420,14 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
                                                 return (_jsx(Text, { color: theme.commandColor, bold: true, children: afterCursor }));
                                             }
                                             if (cmdChars > 0) {
-                                                return (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.commandColor, bold: true, children: afterCursor.slice(0, cmdChars) }), _jsx(Text, { color: theme.text, children: afterCursor.slice(cmdChars) })] }));
+                                                return (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.commandColor, bold: true, children: afterCursor.slice(0, cmdChars) }), _jsx(Text, { color: theme.commandColor, backgroundColor: backgroundColor, children: afterCursor.slice(cmdChars) })] }));
                                             }
-                                            return _jsx(Text, { color: theme.text, children: afterCursor });
+                                            return (_jsx(Text, { color: theme.commandColor, backgroundColor: backgroundColor, children: afterCursor }));
                                         })()] }));
                         }
+                        if (value.length === 0) {
+                            return (_jsxs(Box, { backgroundColor: backgroundColor, width: "100%", children: [renderPromptPrefix(PROMPT), _jsx(Text, { color: theme.textDim, inverse: cursorVisible, backgroundColor: backgroundColor, children: PLACEHOLDER.slice(0, 1) }), _jsx(Text, { color: theme.textDim, backgroundColor: backgroundColor, children: PLACEHOLDER.slice(1) })] }));
+                        }
                         return displayLines.map((line, i) => {
                             const showCursor = i === cursorDisplayLine;
                             const col = cursorLineInfo.col;
@@ -1309,12 +1467,12 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
                                 const cmdChars = inCmd ? Math.min(text.length, commandEndIndex - absOffset) : 0;
                                 const inv = opts?.inverse ?? false;
                                 if (cmdChars >= text.length) {
-                                    return (_jsx(Text, { color: theme.commandColor, bold: true, inverse: inv, children: text }));
+                                    return (_jsx(Text, { color: theme.commandColor, bold: true, inverse: inv, backgroundColor: backgroundColor, children: text }));
                                 }
                                 if (cmdChars > 0) {
-                                    return (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.commandColor, bold: true, inverse: inv, children: text.slice(0, cmdChars) }), _jsx(Text, { color: theme.text, inverse: inv, children: text.slice(cmdChars) })] }));
+                                    return (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.commandColor, bold: true, inverse: inv, backgroundColor: backgroundColor, children: text.slice(0, cmdChars) }), _jsx(Text, { color: theme.commandColor, inverse: inv, backgroundColor: backgroundColor, children: text.slice(cmdChars) })] }));
                                 }
-                                return (_jsx(Text, { color: theme.text, inverse: inv, children: text }));
+                                return (_jsx(Text, { color: theme.commandColor, inverse: inv, backgroundColor: backgroundColor, children: text }));
                             };
                             // Build segments for: [before-sel] [selected] [cursor] [after-sel]
                             // considering that cursor and selection can overlap on this line
@@ -1346,7 +1504,7 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
                                     const cursorChar = col < line.length ? line[col] : " ";
                                     const cursorAbs = lineStartOffset + col;
                                     const curInCmd = isCommand && cursorAbs < commandEndIndex;
-                                    segments.push(_jsx(Text, { color: curInCmd ? theme.commandColor : theme.text, bold: curInCmd, inverse: cursorVisible, children: cursorChar }, "cursor"));
+                                    segments.push(_jsx(Text, { color: theme.commandColor, bold: curInCmd, inverse: cursorVisible, backgroundColor: backgroundColor, children: cursorChar }, "cursor"));
                                     const afterCursorPos = col + (col < line.length ? 1 : 0);
                                     if (afterCursorPos < selLocalEnd) {
                                         segments.push(_jsx(React.Fragment, { children: renderSegment(line.slice(afterCursorPos, selLocalEnd), lineStartOffset + afterCursorPos, { inverse: true }) }, "sel-after"));
@@ -1369,7 +1527,7 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
                                     const cursorChar = col < line.length ? line[col] : " ";
                                     const cursorAbs = lineStartOffset + col;
                                     const curInCmd = isCommand && cursorAbs < commandEndIndex;
-                                    segments.push(_jsx(Text, { color: curInCmd ? theme.commandColor : theme.text, bold: curInCmd, inverse: cursorVisible, children: cursorChar }, "cursor"));
+                                    segments.push(_jsx(Text, { color: theme.commandColor, bold: curInCmd, inverse: cursorVisible, backgroundColor: backgroundColor, children: cursorChar }, "cursor"));
                                     pos = col + (col < line.length ? 1 : 0);
                                 }
                                 // Text after selection (and cursor)
@@ -1386,14 +1544,14 @@ export function InputArea({ onSubmit, onAbort, disabled = false, isActive = true
                                 const cursorInCommand = isCommand && cursorCharOffset < commandEndIndex;
                                 segments.push(_jsx(React.Fragment, { children: renderSegment(before, lineStartOffset) }, "before"));
                                 if (showCursor) {
-                                    segments.push(_jsx(Text, { color: cursorInCommand ? theme.commandColor : theme.text, bold: cursorInCommand, inverse: cursorVisible, children: charUnderCursor }, "cursor"));
+                                    segments.push(_jsx(Text, { color: theme.commandColor, bold: cursorInCommand, inverse: cursorVisible, backgroundColor: backgroundColor, children: charUnderCursor }, "cursor"));
                                 }
                                 if (after) {
                                     segments.push(_jsx(React.Fragment, { children: renderSegment(after, lineStartOffset + col + (col < line.length ? 1 : 0)) }, "after"));
                                 }
                             }
-                            return (_jsxs(Box, { children: [i === 0 ? eyesBadge : null, _jsx(Text, { color: disabled ? theme.textDim : theme.inputPrompt, bold: true, children: i === 0 ? PROMPT : "  " }), segments] }, i));
+                            return (_jsxs(Box, { backgroundColor: backgroundColor, width: "100%", children: [renderPromptPrefix(i === 0 ? PROMPT : "  "), segments] }, i));
                         });
-                    })()] }), isSlashMode && filteredCommands.length > 0 && (_jsx(SlashCommandMenu, { commands: commands, filter: slashFilter, selectedIndex: menuIndex }))] }));
+                    })()] }), renderInputEdge(backgroundColor ? INPUT_BOTTOM_FILL : "─"), taskPickerOpen ? (_jsx(Box, { paddingRight: 2, children: _jsx(TaskPickerMenu, { tasks: tasks, selectedIndex: taskPickerIndex, width: Math.max(20, columns) }) })) : isSlashMode && filteredCommands.length > 0 ? (_jsx(Box, { paddingRight: 2, children: _jsx(SlashCommandMenu, { commands: filteredCommands, selectedIndex: menuIndex, width: Math.max(20, columns) }) })) : null] }));
 }
 //# sourceMappingURL=InputArea.js.map