mixdog 0.9.1 → 0.9.3

package/src/tui/components/PromptInput.jsx

@@ -18,7 +18,7 @@
 import React, { useEffect, useLayoutEffect, useState, useRef } from 'react';
 import { Box, Text, useInput, usePaste, useStdin } from 'ink';
 import stringWidth from 'string-width';
-import { theme } from '../theme.mjs';
+import { theme, surfaceBackground } from '../theme.mjs';
 import {
   caretPosition,
   clearSelection,
@@ -38,6 +38,7 @@ import {
   replaceSelection,
   selectionRange,
   verticalOffset,
+  wordRangeAt,
 } from '../input-editing.mjs';
 
 function hintStyle(tone) {
@@ -52,6 +53,26 @@ function hintStyle(tone) {
 // paddingX of 1, so the typing start can sit directly against that padding
 // without an extra guard column.
 const IME_LEFT_GUARD_COLUMNS = 0;
+
+// Monotone voice indicator glyphs — right end of the prompt box. All frames
+// are 1-cell-wide (no emoji, no string-width special-casing needed). Modes:
+//   'off'          — voice disabled and no install in flight: renders nothing,
+//                    zero reserved columns.
+//   'installing'   — voice-runtime download in progress (progressHint active):
+//                    braille spinner only.
+//   'idle'         — voice enabled, recorder idle: a slow "breathing" pulse
+//                    (◎ ◍ ◉ ◍) so the indicator isn't a dead static glyph.
+//   'recording'    — steady ◉ + a braille spinner riding next to it (2 cells).
+//   'transcribing' — braille spinner only (recording just stopped, awaiting
+//                    the whisper-server round-trip).
+// A single ~120ms interval drives BOTH the fast braille cycle and the slower
+// idle pulse (idle advances one frame every VOICE_IDLE_FRAME_TICKS ticks) —
+// one timer instead of two, and it only exists while the indicator is
+// visible (mode !== 'off'); it's torn down otherwise, never a permanent timer.
+const VOICE_BRAILLE_FRAMES = ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧'];
+const VOICE_IDLE_FRAMES = ['◎', '◍', '◉', '◍'];
+const VOICE_TICK_MS = 120;
+const VOICE_IDLE_FRAME_TICKS = 5; // ~600ms per idle frame (5 * 120ms)
 // Coalesce prompt mouse-drag extend commits (SGR motion can fire faster than ink
 // needs to immediate-render). Matches transcript selection paint cadence.
 const MOUSE_EXTEND_COALESCE_MS = 24;
@@ -96,14 +117,36 @@ function draftStateEqual(a, b) {
   );
 }
 
-function isCtrlEnterSequence(input) {
+// Recognize a MODIFIED Enter delivered via the kitty keyboard protocol
+// (\x1b[13;<mod>u) or modifyOtherKeys (\x1b[27;<mod>;13~). The xterm modifier
+// param is (1 + bitmask) where the bitmask bits are shift=1, alt=2, ctrl=4. We
+// treat Ctrl+Enter AND Shift+Enter (the two common "insert newline" chords) as a
+// newline, so we match when the shift OR ctrl bit is set. Ctrl+J is handled
+// separately as the protocol-independent fallback.
+const MODIFIED_ENTER_SHIFT_OR_CTRL = 1 | 4;
+function isModifiedEnterSequence(input) {
   const text = String(input ?? '');
   const body = text.startsWith('\x1b[') ? text.slice(2) : text.startsWith('[') ? text.slice(1) : '';
   if (!body) return false;
   const kitty = /^13;(\d+)(?::\d+)?(?:;[\d:]+)?u$/.exec(body);
-  if (kitty) return ((Number(kitty[1]) - 1) & 4) !== 0;
+  if (kitty) return ((Number(kitty[1]) - 1) & MODIFIED_ENTER_SHIFT_OR_CTRL) !== 0;
   const modifyOtherKeys = /^27;(\d+);13~$/.exec(body);
-  return Boolean(modifyOtherKeys && (((Number(modifyOtherKeys[1]) - 1) & 4) !== 0));
+  return Boolean(modifyOtherKeys && (((Number(modifyOtherKeys[1]) - 1) & MODIFIED_ENTER_SHIFT_OR_CTRL) !== 0));
+}
+
+// Recognize ANY modified Enter (any modifier bitmask, e.g. Alt+Enter \x1b[13;3u
+// / \x1b[27;3;13~). Used to CONSUME modified-Enter sequences we don't map to a
+// newline (Alt-only, etc.) so they aren't typed into the prompt as raw CSI text
+// under modifyOtherKeys. Plain Enter (mod param = 1, bitmask 0) is intentionally
+// NOT matched, so it still submits.
+function isAnyModifiedEnterSequence(input) {
+  const text = String(input ?? '');
+  const body = text.startsWith('\x1b[') ? text.slice(2) : text.startsWith('[') ? text.slice(1) : '';
+  if (!body) return false;
+  const kitty = /^13;(\d+)(?::\d+)?(?:;[\d:]+)?u$/.exec(body);
+  if (kitty) return (Number(kitty[1]) - 1) !== 0;
+  const modifyOtherKeys = /^27;(\d+);13~$/.exec(body);
+  return Boolean(modifyOtherKeys && ((Number(modifyOtherKeys[1]) - 1) !== 0));
 }
 
 export function PromptInput({
@@ -127,10 +170,13 @@ export function PromptInput({
   onRestoreQueued,
   onHistoryNavigate,
   onPasteText,
+  onVoiceToggle,
+  voiceIndicatorMode = 'off',
   selectionRef,
   valueRef,
   boxRectRef,
   mouseSelectionRef,
+  suppressShiftNavRef,
 }) {
   const [draft, setDraft] = useState(() => {
     const value = String(initialValue || '');
@@ -148,8 +194,31 @@ export function PromptInput({
   const boxRef = useRef(null);
   const cursorEnabledRef = useRef(false); // latest enabled state, read by the anchor fn at render time
   const contentWidthRef = useRef(80);
+  // Cells reserved on the right for the voice indicator glyph(s) (0 when
+  // hidden, 1 idle/spinner-only, 2 recording's "◉"+braille). Read by the
+  // cursor-anchor closure below (installed ONCE, so it must read live state
+  // via a ref rather than close over a render-local variable) to keep the
+  // caret/wrap math in sync with the actual reserved column, same pattern as
+  // IME_LEFT_GUARD_COLUMNS on the left edge.
+  const voiceIndicatorWidthRef = useRef(0);
   const preferredColumnRef = useRef(null);
   const mouseExtendCoalesceRef = useRef({ pendingNext: null, timer: null, t: 0 });
+  // Voice indicator animation tick. Runs a single ~120ms interval ONLY while
+  // voiceIndicatorMode !== 'off' (installing/idle/recording/transcribing) —
+  // torn down the instant the mode goes 'off', so no permanent timer exists
+  // when voice is disabled and no install is in flight.
+  const [voiceTick, setVoiceTick] = useState(0);
+  useEffect(() => {
+    if (voiceIndicatorMode === 'off') return undefined;
+    const timer = setInterval(() => setVoiceTick((t) => (t + 1) % 1000000), VOICE_TICK_MS);
+    timer.unref?.();
+    return () => clearInterval(timer);
+  }, [voiceIndicatorMode]);
+  // Undo/redo snapshot stack. Each entry is a { value, cursor, selectionAnchor }
+  // draft snapshot. Continuous typing coalesces (see UNDO_COALESCE_MS) so a run
+  // of characters collapses into one undo step; cursor-only moves are NOT
+  // snapshotted. Reset on submit / draftOverride.
+  const undoRef = useRef({ past: [], future: [], lastPushAt: 0, lastValue: null });
   const { value, cursor } = draft;
   draftRef.current = draft;
   if (selectionRef) {
@@ -181,6 +250,7 @@ export function PromptInput({
     const sameDraft = draftStateEqual(draftRef.current, next);
     if (!options.keepPreferredColumn) preferredColumnRef.current = null;
     if (sameDraft) return;
+    if (!options.skipHistory) recordUndoSnapshot(draftRef.current, next, options);
     draftRef.current = next;
     setDraft(next);
     queueMicrotask(flushImmediate);
@@ -225,10 +295,19 @@ export function PromptInput({
       const d = draftRef.current;
       const w = yogaNode?.getComputedWidth?.() ?? 0;
       const guardColumns = w > IME_LEFT_GUARD_COLUMNS ? IME_LEFT_GUARD_COLUMNS : 0;
-      const contentWidth = Math.max(1, (w ? w - guardColumns : contentWidthRef.current) || 80);
+      // Reserve the voice-indicator's own cells (+1 gap column when visible)
+      // out of the SAME width the caret/wrap math uses, mirroring the left
+      // guard above — otherwise a visible indicator would silently overlap
+      // the caret/typed text at the right edge instead of pushing content in.
+      const voiceReserve = voiceIndicatorWidthRef.current > 0 ? voiceIndicatorWidthRef.current + 1 : 0;
+      const contentWidth = Math.max(1, (w ? w - guardColumns - voiceReserve : contentWidthRef.current) || 80);
       contentWidthRef.current = contentWidth;
       const caret = w > 0
-        ? caretPosition(d.value, d.cursor, contentWidth)
+        // PromptInput renders a trailing space cell when the cursor is at
+        // end-of-input, so a caret flush on the last column there still has a
+        // following cell — pass hasTrailingContent=true so it rolls to row N+1
+        // exactly as ink wraps the trailing space.
+        ? caretPosition(d.value, d.cursor, contentWidth, d.cursor >= d.value.length ? true : undefined)
         : { row: 0, col: stringWidth(d.value.slice(0, d.cursor)) };
       return w > 0
         ? { ...caret, col: caret.col + guardColumns }
@@ -241,6 +320,70 @@ export function PromptInput({
     commitDraft(fn(draftRef.current), options);
   };
 
+  // --- undo/redo -----------------------------------------------------------
+  // Continuous-typing coalesce window: successive value-changing edits within
+  // this window collapse into a single undo step.
+  const UNDO_COALESCE_MS = 500;
+  const UNDO_MAX = 100;
+
+  const snapshotOf = (d) => ({ value: d.value, cursor: d.cursor, selectionAnchor: d.selectionAnchor ?? null });
+
+  const resetUndo = () => {
+    undoRef.current = { past: [], future: [], lastPushAt: 0, lastValue: null };
+  };
+
+  // Record a snapshot of the PREVIOUS state before applying `next`. Cursor-only
+  // moves (value unchanged) are never snapshotted. Consecutive value edits
+  // within UNDO_COALESCE_MS coalesce (we keep only the first snapshot of the
+  // run, so a single undo reverts the whole burst).
+  const recordUndoSnapshot = (prev, next, options = {}) => {
+    const stack = undoRef.current;
+    if (prev.value === next.value) {
+      // Cursor/selection-only move: don't snapshot, but BREAK the coalesce run
+      // so a following edit starts a fresh undo step (typing→move→typing must
+      // not collapse into one undo).
+      stack.lastPushAt = 0;
+      stack.lastValue = next.value;
+      return;
+    }
+    const now = Date.now();
+    const coalesce = !options.undoBreak
+      && stack.past.length > 0
+      && (now - stack.lastPushAt) < UNDO_COALESCE_MS
+      && stack.lastValue === prev.value;
+    if (!coalesce) {
+      stack.past.push(snapshotOf(prev));
+      if (stack.past.length > UNDO_MAX) stack.past.shift();
+    }
+    stack.lastPushAt = now;
+    stack.lastValue = next.value;
+    stack.future = [];
+  };
+
+  const performUndo = () => {
+    const stack = undoRef.current;
+    if (stack.past.length === 0) return false;
+    const prev = stack.past.pop();
+    stack.future.push(snapshotOf(draftRef.current));
+    stack.lastPushAt = 0;
+    stack.lastValue = prev.value;
+    commitDraft(prev, { skipHistory: true });
+    return true;
+  };
+
+  const performRedo = () => {
+    const stack = undoRef.current;
+    if (stack.future.length === 0) return false;
+    const next = stack.future.pop();
+    stack.past.push(snapshotOf(draftRef.current));
+    if (stack.past.length > UNDO_MAX) stack.past.shift();
+    stack.lastPushAt = 0;
+    stack.lastValue = next.value;
+    commitDraft(next, { skipHistory: true });
+    return true;
+  };
+  // -------------------------------------------------------------------------
+
   const cancelMouseExtendCoalesce = () => {
     const state = mouseExtendCoalesceRef.current;
     if (state.timer) {
@@ -309,6 +452,28 @@ export function PromptInput({
         const anchor = Number.isFinite(d.selectionAnchor) ? d.selectionAnchor : d.cursor;
         queueMouseExtendCommit({ ...d, cursor: off, selectionAnchor: anchor }, immediate);
       },
+      hasSelection: () => selectionRange(draftRef.current) != null,
+      // Double-click word select: pick the word/punctuation run under the
+      // clicked offset and set selectionAnchor/cursor to its bounds so it
+      // paints via the normal selection highlight. Triple-click line select
+      // uses lineStart/lineEnd instead (see selectLineAt).
+      selectWordAt: (offset) => {
+        cancelMouseExtendCoalesce();
+        const value = draftRef.current.value;
+        const off = Math.max(0, Math.min(value.length, Math.floor(Number(offset) || 0)));
+        const { start, end } = wordRangeAt(value, off);
+        commitDraft({ ...draftRef.current, cursor: end, selectionAnchor: start });
+        mouseExtendCoalesceRef.current.t = Date.now();
+      },
+      selectLineAt: (offset) => {
+        cancelMouseExtendCoalesce();
+        const value = draftRef.current.value;
+        const off = Math.max(0, Math.min(value.length, Math.floor(Number(offset) || 0)));
+        const start = lineStart(value, off);
+        const end = lineEnd(value, off);
+        commitDraft({ ...draftRef.current, cursor: end, selectionAnchor: start });
+        mouseExtendCoalesceRef.current.t = Date.now();
+      },
       clear: () => {
         cancelMouseExtendCoalesce();
         if (selectionRange(draftRef.current)) commitDraft(clearSelection(draftRef.current));
@@ -382,7 +547,8 @@ export function PromptInput({
 
   useEffect(() => {
     if (!draftOverride || typeof draftOverride.value !== 'string') return;
-    commitDraft({ value: draftOverride.value, cursor: draftOverride.value.length, selectionAnchor: null });
+    commitDraft({ value: draftOverride.value, cursor: draftOverride.value.length, selectionAnchor: null }, { skipHistory: true });
+    resetUndo();
   }, [draftOverride?.id]);
 
   useEffect(() => () => {
@@ -396,7 +562,8 @@ export function PromptInput({
       commitDraft(next);
       return;
     }
-    commitDraft({ value: '', cursor: 0, selectionAnchor: null });
+    commitDraft({ value: '', cursor: 0, selectionAnchor: null }, { skipHistory: true });
+    resetUndo();
   };
 
   const submitEnterChunk = (prefix = '') => {
@@ -427,6 +594,21 @@ export function PromptInput({
     const rawInput = String(input ?? '');
     const inputKey = rawInput.toLowerCase();
 
+    // App owns Shift+Arrow when a transcript/status ink-grid selection is live.
+    // Because the parent (App) useInput handler fires AFTER this child handler
+    // for the same event, a flag SET in App's handler is always one event stale.
+    // Instead call a synchronous predicate derived from dragRef at event time.
+    const gridSelectionActive = typeof suppressShiftNavRef === 'function'
+      ? suppressShiftNavRef()
+      : (typeof suppressShiftNavRef?.current === 'function'
+        ? suppressShiftNavRef.current()
+        : Boolean(suppressShiftNavRef?.current));
+    if (gridSelectionActive) {
+      const isShiftArrow = key.shift
+        && (key.leftArrow || key.rightArrow || key.upArrow || key.downArrow || key.home || key.end);
+      if (isShiftArrow) return;
+    }
+
     // Drop SGR mouse-tracking sequences (wheel/click). When app mouse tracking
     // is explicitly enabled, App parses these off raw stdin itself;
     // ink still forwards the bytes here as "input", which would otherwise type
@@ -436,6 +618,17 @@ export function PromptInput({
       return;
     }
 
+    // Safety net: drop CSI-private replies/fragments like \x1b[?<n>u / \x1b[?...c
+    // (escape may be stripped → `[?7u` / `[?1;0c`). We no longer query the
+    // terminal (enables are written unconditionally at raw-mode-on), so these
+    // should not normally appear — but a terminal that volunteers such a report
+    // must never type it into the prompt. The required `?` after `[` means this
+    // never matches a real kitty KEY event (those are \x1b[<codepoint>;<mods>u,
+    // no `?`); the optional final byte also discards any partial fragment.
+    if (/^(?:\x1b)?\[\?[\d;]*[uc]?$/.test(rawInput)) {
+      return;
+    }
+
     const rawUpArrow = rawInput === '\x1b[A' || rawInput === '\x1bOA' || rawInput === '[A' || rawInput === 'OA';
     const rawDownArrow = rawInput === '\x1b[B' || rawInput === '\x1bOB' || rawInput === '[B' || rawInput === 'OB';
     // Shift+Arrow modifier sequences (xterm `\x1b[1;2<dir>`, rxvt `\x1b[<dir>`
@@ -448,13 +641,52 @@ export function PromptInput({
     const rawShiftDown = rawInput === '\x1b[1;2B' || rawInput === '\x1b[b' || rawInput === '[1;2B';
     const rawShiftRight = rawInput === '\x1b[1;2C' || rawInput === '\x1b[c' || rawInput === '[1;2C';
     const rawShiftLeft = rawInput === '\x1b[1;2D' || rawInput === '\x1b[d' || rawInput === '[1;2D';
-    const shiftHeld = key.shift || rawShiftUp || rawShiftDown || rawShiftLeft || rawShiftRight;
+    // Ctrl+Shift+Arrow modifier sequences: xterm mod=6 (1 + shift(1) + ctrl(4))
+    // arrives as `\x1b[1;6<dir>`; kitty keyboard protocol reports the same chord
+    // as `\x1b[<code>;6<dir>` (also mod=6). Ink decodes neither the `;6` for
+    // arrows, so the bytes arrive raw. Fold into a ctrlShiftHeld signal used to
+    // drive whole-word selection-extend below. `\x1b[1;6<dir>` covers both the
+    // classic xterm form and kitty's default (which emits the legacy arrow form
+    // with the CSI-u modifier param for arrow keys).
+    const rawCtrlShiftUp = rawInput === '\x1b[1;6A' || rawInput === '[1;6A';
+    const rawCtrlShiftDown = rawInput === '\x1b[1;6B' || rawInput === '[1;6B';
+    const rawCtrlShiftRight = rawInput === '\x1b[1;6C' || rawInput === '[1;6C';
+    const rawCtrlShiftLeft = rawInput === '\x1b[1;6D' || rawInput === '[1;6D';
+    const ctrlShiftHeld =
+      rawCtrlShiftUp || rawCtrlShiftDown || rawCtrlShiftLeft || rawCtrlShiftRight
+      || (key.shift && key.ctrl && (key.leftArrow || key.rightArrow || key.upArrow || key.downArrow));
+    const shiftHeld = key.shift || rawShiftUp || rawShiftDown || rawShiftLeft || rawShiftRight
+      || rawCtrlShiftUp || rawCtrlShiftDown || rawCtrlShiftLeft || rawCtrlShiftRight;
     const lineBreakIndex = rawInput.search(/[\r\n]/);
     const rawEnter = rawInput === '\r' || rawInput === '\n' || rawInput === '\r\n';
     const trailingEnterPrefix = singleTrailingLineBreakPrefix(rawInput);
-    const rawCtrlEnter = isCtrlEnterSequence(rawInput);
+    const rawCtrlEnter = isModifiedEnterSequence(rawInput);
     const modifiedLineBreak = key.shift || key.meta || key.ctrl || rawCtrlEnter;
 
+    // Ctrl+J is the protocol-INDEPENDENT newline that works on every terminal.
+    //  • Legacy / modifyOtherKeys terminals: Ctrl+J is a lone '\n' (0x0A). A real
+    //    Enter is CR, which ink marks key.return (name 'return'); a lone '\n'
+    //    arrives as name 'enter' with key.return false. A multi-char paste that
+    //    contains '\n' is length > 1 (handled by the paste paths below).
+    //  • Kitty protocol active: Ctrl+J arrives as \x1b[106;5u, which ink decodes
+    //    to input 'j' with key.ctrl set.
+    // Either way → insert a newline. This MUST run before the trailing-newline/
+    // submit paths, since singleTrailingLineBreakPrefix('\n') returns '' (not
+    // null) and would otherwise route a bare Ctrl+J to submit.
+    if ((rawInput === '\n' && !key.return) || (key.ctrl && inputKey === 'j')) {
+      updateDraft((d) => replaceSelection(d, '\n'));
+      return;
+    }
+
+    // A modified Enter that is NOT a newline chord (e.g. Alt+Enter \x1b[13;3u or
+    // \x1b[27;3;13~). isModifiedEnterSequence already handled shift/ctrl above
+    // (→ newline); here we CONSUME any other modified Enter so its raw CSI bytes
+    // never type into the prompt under modifyOtherKeys. Plain Enter (mod=1) is
+    // not matched and still submits below.
+    if (!rawCtrlEnter && isAnyModifiedEnterSequence(rawInput)) {
+      return;
+    }
+
     const pasteFallback = lineBreakIndex !== -1 && trailingEnterPrefix === null && !rawEnter && (rawInput.length > 1 || !key.return);
     if (pasteFallback) {
       handleExternalPaste(rawInput, { source: 'paste-fallback' });
@@ -508,25 +740,58 @@ export function PromptInput({
       return;
     }
 
-    if (key.upArrow || rawUpArrow || rawShiftUp) {
+    // Ctrl+Shift+Left/Right → extend selection whole-word. Kept before the plain
+    // shift-arrow branches so the ctrl+shift chord never falls through to a
+    // char-wise extend. (Up/Down ctrl+shift extend to line-relative vertical
+    // move with extend — same as shift alone; handled in the vertical branch.)
+    if (ctrlShiftHeld && (rawCtrlShiftLeft || (key.ctrl && key.shift && key.leftArrow))) {
+      if (!commandPaletteActive) {
+        updateDraft((d) => moveCursor(d, previousWordOffset(d.value, d.cursor), { extend: true }));
+      }
+      return;
+    }
+    if (ctrlShiftHeld && (rawCtrlShiftRight || (key.ctrl && key.shift && key.rightArrow))) {
+      if (!commandPaletteActive) {
+        updateDraft((d) => moveCursor(d, nextWordOffset(d.value, d.cursor), { extend: true }));
+      }
+      return;
+    }
+
+    if (key.upArrow || rawUpArrow || rawShiftUp || rawCtrlShiftUp) {
       if (commandPaletteActive) {
         onCommandPaletteNavigate?.(-1);
       } else {
-        const hasDraftText = String(draftRef.current.value || '').trim().length > 0;
-        if (!hasDraftText) {
-          if (!restoreQueuedToDraft()) applyHistoryNavigation('up', { emptyDraft: true });
-        } else if (!moveDraftVertically(-1, { extend: shiftHeld })) {
-          applyHistoryNavigation('up', { emptyDraft: false });
+        // A Shift-held Up is a SELECTION gesture, never history navigation:
+        // extend the selection up one visual line, and if already on the first
+        // line extend all the way to document start (offset 0). History
+        // navigation (restoreQueued / applyHistoryNavigation) MUST NOT fire.
+        if (shiftHeld) {
+          if (!moveDraftVertically(-1, { extend: true })) {
+            updateDraft((d) => moveCursor(d, 0, { extend: true }));
+          }
+        } else {
+          const hasDraftText = String(draftRef.current.value || '').trim().length > 0;
+          if (!hasDraftText) {
+            if (!restoreQueuedToDraft()) applyHistoryNavigation('up', { emptyDraft: true });
+          } else if (!moveDraftVertically(-1, { extend: false })) {
+            applyHistoryNavigation('up', { emptyDraft: false });
+          }
         }
       }
       return;
     }
 
-    if (key.downArrow || rawDownArrow || rawShiftDown) {
+    if (key.downArrow || rawDownArrow || rawShiftDown || rawCtrlShiftDown) {
       if (commandPaletteActive) {
         onCommandPaletteNavigate?.(1);
       } else {
-        if (!moveDraftVertically(1, { extend: shiftHeld })) {
+        // Shift-held Down: extend selection down one line, or to document end
+        // (value.length) when already on the last line. Never history nav.
+        if (shiftHeld) {
+          if (!moveDraftVertically(1, { extend: true })) {
+            updateDraft((d) => moveCursor(d, d.value.length, { extend: true }));
+          }
+        } else if (!moveDraftVertically(1, { extend: false })) {
           applyHistoryNavigation('down', { emptyDraft: String(draftRef.current.value || '').trim().length === 0 });
         }
       }
@@ -583,8 +848,8 @@ export function PromptInput({
         commitDraft({ value: '', cursor: 0, selectionAnchor: null });
         return;
       }
-      // Active turn takes precedence over queue restore (matches claude-code
-      // useCancelRequest priority): Esc during a running turn interrupts the
+      // Active turn takes precedence over queue restore: Esc during a
+      // running turn interrupts the
       // turn and leaves queued steering prompts intact to run afterward. Queued
       // messages only pop back into the draft when the turn is idle.
       if (interruptActive) {
@@ -644,6 +909,27 @@ export function PromptInput({
 
     const editingKey = String(input || '').toLowerCase();
 
+    // Undo / redo. Covered encodings:
+    //  • kitty protocol: ctrl+z → input 'z' + key.ctrl; ctrl+y → 'y' + key.ctrl;
+    //    ctrl+shift+z → 'z' + key.ctrl + key.shift (redo).
+    //  • legacy control bytes: Ctrl+Z is \x1a (SUB, 0x1A), Ctrl+Y is \x19 (EM,
+    //    0x19). ink may deliver these as raw input without key.ctrl on some
+    //    terminals, so match the byte directly too.
+    const isCtrlZ = (key.ctrl && editingKey === 'z') || rawInput === '\x1a';
+    const isCtrlY = (key.ctrl && editingKey === 'y') || rawInput === '\x19';
+    if (isCtrlZ && (key.shift || shiftHeld)) {
+      performRedo();
+      return;
+    }
+    if (isCtrlZ) {
+      performUndo();
+      return;
+    }
+    if (isCtrlY) {
+      performRedo();
+      return;
+    }
+
     // ctrl+a selects all like a normal text box; ctrl+e keeps readline line-end.
     if (key.ctrl && editingKey === 'a') {
       updateDraft((d) => (d.value ? { ...d, cursor: d.value.length, selectionAnchor: 0 } : clearSelection(d)));
@@ -719,6 +1005,18 @@ export function PromptInput({
       return;
     }
 
+    // Ctrl+Space voice-record toggle. Two encodings observed across
+    // terminals: a lone NUL byte (legacy Ctrl+Space, many terminals send
+    // 0x00 directly) or the kitty CSI-u form `\x1b[32;5u` (codepoint 32
+    // = space, modifier 5 = 1+4 = ctrl). Consumed here — never typed into
+    // the prompt — and forwarded to the App-level recorder state machine
+    // via onVoiceToggle; a no-op when the prop isn't wired (e.g. embedded
+    // pickers) so this never throws.
+    if (rawInput === '\x00' || /^(?:\x1b)?\[32;5u$/.test(rawInput)) {
+      onVoiceToggle?.();
+      return;
+    }
+
     // Printable input (ignore other control keys). Strip any embedded SGR mouse
     // sequences as a belt-and-suspenders guard (the early return above catches
     // whole-sequence inputs; this removes partials that rode in with real text).
@@ -739,6 +1037,12 @@ export function PromptInput({
   // resetAfterCommit BEFORE React layout effects — that lag made the 2nd+ char
   // appear to land behind the caret (the observed scramble). Computing inside
   // the fork, from the real layout + current refs, fixes that by construction.
+  // Park the hardware cursor only when the prompt is a real, active edit target.
+  // The anchor stays enabled during an active turn too: suppressing it while
+  // the draft was empty (an earlier guard against a one-frame row-off paint
+  // when the transcript height changed mid-turn) made the cursor vanish for
+  // the whole turn after Enter, which reads as "the caret disappeared". A
+  // momentary one-frame drift is the lesser evil versus a missing caret.
   cursorEnabledRef.current = !disabled && isRawModeSupported;
   installCursorAnchor();
 
@@ -758,16 +1062,45 @@ export function PromptInput({
   const displayValue = mask ? value.replace(/[^\n]/g, '*') : value;
   const renderedValue = renderSelectedText(displayValue, selectionRange(draft), cursor === value.length);
   const hintMeta = hintStyle(hintTone);
+  // Monotone voice indicator glyph text — zero-width (rendered as null) when
+  // mode is 'off'. Braille frame drives installing/recording/transcribing;
+  // the idle pulse advances one frame every VOICE_IDLE_FRAME_TICKS ticks of
+  // the SAME interval (slower "breathing" cadence off one shared timer).
+  const voiceBrailleFrame = VOICE_BRAILLE_FRAMES[voiceTick % VOICE_BRAILLE_FRAMES.length];
+  const voiceIdleFrame = VOICE_IDLE_FRAMES[Math.floor(voiceTick / VOICE_IDLE_FRAME_TICKS) % VOICE_IDLE_FRAMES.length];
+  const voiceIndicatorText = voiceIndicatorMode === 'installing' || voiceIndicatorMode === 'transcribing'
+    ? voiceBrailleFrame
+    : voiceIndicatorMode === 'recording'
+      ? `◉${voiceBrailleFrame}`
+      : voiceIndicatorMode === 'idle'
+        ? voiceIdleFrame
+        : '';
+  // stringWidth is unnecessary here — every glyph above is a single
+  // 1-column codepoint (◎◍◉ and the braille frames), and 'recording'
+  // concatenates exactly two 1-cell glyphs, so plain .length gives the
+  // correct cell count without pulling in emoji-width special-casing.
+  voiceIndicatorWidthRef.current = voiceIndicatorText.length;
 
   return (
-    <Box ref={boxRef} flexDirection="row" flexGrow={1} flexShrink={1} backgroundColor={theme.background}>
-      <Box width={IME_LEFT_GUARD_COLUMNS} flexShrink={0} backgroundColor={theme.background} />
+    <Box ref={boxRef} flexDirection="row" width="100%" flexGrow={1} flexShrink={1} backgroundColor={surfaceBackground()}>
+      <Box width={IME_LEFT_GUARD_COLUMNS} flexShrink={0} backgroundColor={surfaceBackground()} />
       <Text color={theme.text} wrap="hard">{renderedValue}</Text>
       {!value && hint ? (
         <Box marginLeft={-1}>
           <Text color={hintMeta.textColor}>{hint}</Text>
         </Box>
       ) : null}
+      {voiceIndicatorText ? (
+        <>
+          {/* flexGrow spacer pins the indicator to the RIGHT edge of the row
+              even when the typed text is short; without it the glyph would
+              ride directly after the caret instead of the box edge. */}
+          <Box flexGrow={1} backgroundColor={surfaceBackground()} />
+          <Box flexShrink={0} width={voiceIndicatorText.length + 1} justifyContent="flex-end" backgroundColor={surfaceBackground()}>
+            <Text color={theme.subtle}>{voiceIndicatorText}</Text>
+          </Box>
+        </>
+      ) : null}
     </Box>
   );
 }

package/src/tui/components/QueuedCommands.jsx

@@ -22,7 +22,7 @@ export function QueuedCommands({ queued, columns }) {
   // Windows auto-wrap/scroll that drifts the alt-screen frame (see UserMessage).
   const bandColumns = Math.max(1, columns - 1);
   return (
-    <Box marginTop={1} flexDirection="column">
+    <Box flexDirection="column">
       {queued.map((item) => {
         // Truncate to 1 line so the row reservation (queued.length in App.jsx)
         // stays accurate — wrapped text would push the input box off-screen.

package/src/tui/components/SlashCommandPalette.jsx

@@ -65,6 +65,8 @@ export function SlashCommandPalette({ commands, selectedIndex = 0, title = 'Comm
   const descriptionWidth = Math.max(0, columns - labelWidth - 12);
   // Standard panel rhythm: title row, blank, description/hint row, blank, content.
   const description = truncateText(SLASH_DESCRIPTION, Math.max(0, columns - 4));
+  const titleWidth = stringWidth(String(title || ''));
+  const help = truncateText(SLASH_HELP, Math.max(0, columns - titleWidth - 7));
 
   return (
     <Box flexDirection="column" flexShrink={0} width="100%">
@@ -76,8 +78,8 @@ export function SlashCommandPalette({ commands, selectedIndex = 0, title = 'Comm
         width="100%"
       >
         <Box flexDirection="row" justifyContent="space-between">
-          <Text color={theme.panelTitle}>{title}</Text>
-          <Text color={theme.subtle}>{SLASH_HELP}</Text>
+          <Text color={theme.panelTitle} wrap="truncate">{title}</Text>
+          <Text color={theme.subtle} wrap="truncate">{help}</Text>
         </Box>
         <Text> </Text>
         <Text color={theme.subtle}>{description || ' '}</Text>
@@ -103,14 +105,15 @@ export function SlashCommandPalette({ commands, selectedIndex = 0, title = 'Comm
 const CommandRow = React.memo(function CommandRow({ command, isSelected, labelWidth, descriptionWidth, query }) {
   const label = truncateText(commandDisplayLabel(command, query), labelWidth);
   const description = truncateText(command.description, descriptionWidth);
+  const rowText = isSelected ? theme.selectionText : theme.text;
 
   return (
-    <Box flexDirection="row" width="100%" backgroundColor={isSelected ? theme.userMessageBackground : undefined}>
-      <Text color={theme.text}>
+    <Box flexDirection="row" width="100%" backgroundColor={isSelected ? theme.selectionBackground : undefined}>
+      <Text color={rowText}>
         {padCells(label, labelWidth)}
       </Text>
       {description ? (
-        <Text color={theme.text}>
+        <Text color={rowText}>
           {'  '}
           {description}
         </Text>

package/src/tui/components/Spinner.jsx

@@ -58,8 +58,6 @@ const MODE_VERBS = {
   responding: ['Responding', 'Composing', 'Writing', 'Wrapping up'],
 };
 
-const ERROR_RED = { r: 171, g: 43, b: 63 };
-
 function interpolateColor(a, b, t) {
   return {
     r: Math.round(a.r + (b.r - a.r) * t),
@@ -117,6 +115,7 @@ function spinnerRgb() {
     SPINNER_GLYPH_RGB: parseRgb(theme.spinnerGlyph) ?? { r: 240, g: 240, b: 240 },
     THINKING_INACTIVE: parseRgb(theme.thinkingBase) ?? parseRgb(theme.thinkingAccent) ?? { r: 153, g: 153, b: 153 },
     THINKING_SHIMMER: parseRgb(theme.thinkingGlow) ?? { r: 255, g: 205, b: 175 },
+    STALL_RGB: parseRgb(theme.error) ?? { r: 171, g: 43, b: 63 },
   };
 }
 
@@ -172,7 +171,7 @@ function tokenModeGlyph(mode) {
 
 export function Spinner({ verb = 'Working', startedAt, outputTokens = 0, tokens = 0, thinking = false, thinkingActiveSince = 0, mode = 'responding', columns = 80, marginTop = 1 }) {
   useAnimation({ interval: FRAME_MS });
-  const { TEXT_RGB, SHIMMER_RGB, SPINNER_GLYPH_RGB, THINKING_INACTIVE, THINKING_SHIMMER } = spinnerRgb();
+  const { TEXT_RGB, SHIMMER_RGB, SPINNER_GLYPH_RGB, THINKING_INACTIVE, THINKING_SHIMMER, STALL_RGB } = spinnerRgb();
   const now = Date.now();
   const elapsedMs = startedAt ? Math.max(0, now - startedAt) : 0;
   const frame = Math.floor(elapsedMs / FRAME_MS);
@@ -222,17 +221,18 @@ export function Spinner({ verb = 'Working', startedAt, outputTokens = 0, tokens
   const glyphColor = stalledIntensity > 0
     ? toRgbString(interpolateColor(
         SPINNER_GLYPH_RGB,
-        ERROR_RED,
+        STALL_RGB,
         stalledIntensity
       ))
     : theme.spinnerGlyph;
 
   // --- Verb shimmer (traveling highlight) ---
-  if (displayVerbModeRef.current !== mode || !displayVerbRef.current) {
-    displayVerbModeRef.current = mode;
+  if (!displayVerbRef.current) {
     displayVerbRef.current = stableModeVerb(mode, verb);
     nextVerbCheckRef.current = nextVerbCheckAt(now);
-  } else if (now >= nextVerbCheckRef.current) {
+  }
+  displayVerbModeRef.current = mode;
+  if (now >= nextVerbCheckRef.current) {
     displayVerbRef.current = chooseNextVerb(mode, verb, displayVerbRef.current);
     nextVerbCheckRef.current = nextVerbCheckAt(now);
   }