mixdog 0.9.3 → 0.9.4

package/src/tui/components/PromptInput.jsx

@@ -17,7 +17,7 @@
  */
 import React, { useEffect, useLayoutEffect, useState, useRef } from 'react';
 import { Box, Text, useInput, usePaste, useStdin } from 'ink';
-import stringWidth from 'string-width';
+import { displayWidth } from '../display-width.mjs';
 import { theme, surfaceBackground } from '../theme.mjs';
 import {
   caretPosition,
@@ -40,48 +40,29 @@ import {
   verticalOffset,
   wordRangeAt,
 } from '../input-editing.mjs';
-
-function hintStyle(tone) {
-  if (tone === 'error') return { textColor: theme.error };
-  if (tone === 'warn' || tone === 'cancel') return { textColor: theme.warning };
-  if (tone === 'plain') return { textColor: theme.subtle };
-  return { textColor: theme.inactive };
-}
+import {
+  hintStyle,
+  insertText,
+  normalizePastedText,
+  singleTrailingLineBreakPrefix,
+  draftStateEqual,
+  isModifiedEnterSequence,
+  isAnyModifiedEnterSequence,
+} from './prompt-input/edit-helpers.mjs';
+import {
+  VOICE_TICK_MS,
+  voiceIndicatorTextFor,
+} from './prompt-input/voice-indicator.mjs';
 
 // Windows Terminal IME composition can clip a glyph that starts exactly at the
 // left edge of the editable text node. The rounded prompt box already adds a
 // 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;
 
-function insertText(draft, input) {
-  if (!input) return draft;
-  return replaceSelection(draft, input);
-}
-
 function renderSelectedText(displayValue, range, trailingSpace = false) {
   if (!range) return trailingSpace ? `${displayValue} ` : displayValue;
   const start = Math.max(0, Math.min(displayValue.length, range.start));
@@ -98,57 +79,6 @@ function renderSelectedText(displayValue, range, trailingSpace = false) {
   );
 }
 
-function normalizePastedText(text) {
-  return String(text ?? '').replace(/\r\n?/g, '\n');
-}
-
-function singleTrailingLineBreakPrefix(text) {
-  const normalized = normalizePastedText(text);
-  if (!normalized.endsWith('\n')) return null;
-  const prefix = normalized.slice(0, -1);
-  return prefix.includes('\n') ? null : prefix;
-}
-
-function draftStateEqual(a, b) {
-  return (
-    a.value === b.value
-    && a.cursor === b.cursor
-    && a.selectionAnchor === b.selectionAnchor
-  );
-}
-
-// 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) & MODIFIED_ENTER_SHIFT_OR_CTRL) !== 0;
-  const modifyOtherKeys = /^27;(\d+);13~$/.exec(body);
-  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({
   onSubmit,
   disabled = false,
@@ -204,12 +134,13 @@ export function PromptInput({
   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.
+  // an ANIMATED mode is active (installing/recording/transcribing) — 'idle'
+  // renders a static glyph and 'off' renders nothing, so neither keeps a
+  // timer alive (the old idle "breathing" pulse spun constantly whenever
+  // voice was merely enabled, reading as phantom activity).
   const [voiceTick, setVoiceTick] = useState(0);
   useEffect(() => {
-    if (voiceIndicatorMode === 'off') return undefined;
+    if (voiceIndicatorMode === 'off' || voiceIndicatorMode === 'idle') return undefined;
     const timer = setInterval(() => setVoiceTick((t) => (t + 1) % 1000000), VOICE_TICK_MS);
     timer.unref?.();
     return () => clearInterval(timer);
@@ -308,7 +239,7 @@ export function PromptInput({
         // 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)) };
+        : { row: 0, col: displayWidth(d.value.slice(0, d.cursor)) };
       return w > 0
         ? { ...caret, col: caret.col + guardColumns }
         : caret;
@@ -1064,19 +995,10 @@ export function PromptInput({
   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
-        : '';
+  // 'idle' is a static ○ (no animation, no timer).
+  const voiceIndicatorText = voiceIndicatorTextFor(voiceIndicatorMode, voiceTick);
   // stringWidth is unnecessary here — every glyph above is a single
-  // 1-column codepoint (◎◍◉ and the braille frames), and 'recording'
+  // 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;

package/src/tui/components/SlashCommandPalette.jsx

@@ -60,7 +60,11 @@ export function SlashCommandPalette({ commands, selectedIndex = 0, title = 'Comm
     start = Math.max(0, end - MAX_VISIBLE);
   }
   const visible = commands.slice(start, end);
-  const blankRows = Math.max(0, MAX_VISIBLE - visible.length);
+  // No-match frames keep the palette mounted at the SAME fixed height so the
+  // slash session never unmounts/remounts the 14-row panel per keystroke
+  // (Windows fullscreen repaint made that oscillation a hard flicker).
+  const noMatches = total === 0;
+  const blankRows = Math.max(0, MAX_VISIBLE - visible.length - (noMatches ? 1 : 0));
   const labelWidth = Math.max(12, Math.min(COMMAND_LABEL_WIDTH, Math.max(12, Math.floor(columns * 0.45))));
   const descriptionWidth = Math.max(0, columns - labelWidth - 12);
   // Standard panel rhythm: title row, blank, description/hint row, blank, content.
@@ -84,6 +88,9 @@ export function SlashCommandPalette({ commands, selectedIndex = 0, title = 'Comm
         <Text> </Text>
         <Text color={theme.subtle}>{description || ' '}</Text>
         <Text> </Text>
+        {noMatches ? (
+          <Text color={theme.subtle} wrap="truncate">No matching commands</Text>
+        ) : null}
         {visible.map((item, index) => (
           <CommandRow
             key={item.name}

package/src/tui/components/StatusLine.jsx

@@ -482,6 +482,29 @@ function StatusLineView({ sessionId, clientHostPid, provider, model, effort, fas
         Number(activeTools.search?.startedAt) || 0,
       ].join('|')
     : '';
+  // Stable primitive signatures so the render effect's dep array doesn't
+  // churn on new array/object identities carrying unchanged content — a new
+  // `agentWorkers`/`agentJobs` array (or `stats` object) reference on every
+  // render was clearing the pending 150ms debounce timer before it could
+  // fire, starving the boot full-render. Only tag|stage per worker/job and
+  // the numeric stats fields actually consumed here are covered.
+  const agentWorkersSignature = Array.isArray(agentWorkers)
+    ? agentWorkers.map((w) => `${w?.tag || w?.agent || w?.name || ''}|${w?.stage || w?.status || ''}|${localTimeMs(w?.startedAt || w?.startTime || w?.createdAt)}`).join(',')
+    : '';
+  const agentJobsSignature = Array.isArray(agentJobs)
+    ? agentJobs.map((j) => `${j?.tag || j?.agent || j?.name || ''}|${j?.status || j?.stage || ''}|${localTimeMs(j?.startedAt || j?.startTime || j?.createdAt)}`).join(',')
+    : '';
+  const statsForSignature = stats && typeof stats === 'object' ? stats : {};
+  const statsSignature = [
+    localNum(statsForSignature.currentContextTokens),
+    localNum(statsForSignature.currentEstimatedContextTokens),
+    localNum(statsForSignature.inputTokens),
+    localNum(statsForSignature.latestInputTokens),
+    localNum(statsForSignature.promptTokens),
+    localNum(statsForSignature.turns),
+    localNum(statsForSignature.contextTokens),
+    String(statsForSignature.currentContextSource || ''),
+  ].join('|');
   const refreshMs = hasActiveStatuslineWork(line, agentWorkers, agentJobs, activeTools) ? STATUSLINE_ACTIVE_REFRESH_MS : STATUSLINE_REFRESH_MS;
 
   useEffect(() => {
@@ -498,6 +521,7 @@ function StatusLineView({ sessionId, clientHostPid, provider, model, effort, fas
 
   useEffect(() => {
     let alive = true;
+    let bootRetryTimer = null;
     const effectId = renderEffectIdRef.current + 1;
     renderEffectIdRef.current = effectId;
     const isCurrentEffect = () => alive && renderEffectIdRef.current === effectId;
@@ -508,23 +532,27 @@ function StatusLineView({ sessionId, clientHostPid, provider, model, effort, fas
       lastImmediateArgsRef.current,
     );
     // ROUTE identity = the subset that actually changes the async full line's L1
-    // usage/quota segment (provider/model/session/effort/fast + context windows).
-    // agentRevision, compactBoundaryTokens, autoCompactTokenLimit and stats-reset
-    // are NON-ROUTE: they churn while several agents run but DON'T invalidate the
-    // L1 usage windows. Only a true route/session switch may wipe the cached full
-    // line and snap to the usage-less local line; non-route churn must keep the
-    // last good full line so `5H …/7D …` never blinks. (lastImmediateArgsRef holds
-    // exactly these route fields, captured at the end of the previous effect run.)
+    // usage/quota segment (provider/model/session/effort/fast). agentRevision,
+    // compactBoundaryTokens, autoCompactTokenLimit, stats-reset AND the context
+    // window fields (contextWindow/displayContextWindow/rawContextWindow) are
+    // NON-ROUTE: the first prompt's API response publishes displayContextWindow
+    // 0→N (engine syncContextDisplayFields), which only moves the ctx% bar —
+    // never the `5H …/7D …` usage windows. Treating it as route wiped the cached
+    // full line and snapped to the usage-less local line for one frame (the
+    // "usage blinks once on first prompt" bug). A real route switch that changes
+    // usage windows always changes provider/model/session anyway. Only a true
+    // route/session switch may wipe the cached full line; non-route churn keeps
+    // the last good full line (identityChanged still snaps, but via the cached
+    // graft path below, so usage survives and the async render refreshes ctx%
+    // within ~150ms). (lastImmediateArgsRef holds these fields, captured at the
+    // end of the previous effect run.)
     const prevImmediate = lastImmediateArgsRef.current;
     const routeChanged = !prevImmediate
       || prevImmediate.sessionId !== args.sessionId
       || prevImmediate.provider !== args.provider
       || prevImmediate.model !== args.model
       || prevImmediate.effort !== args.effort
-      || prevImmediate.fast !== args.fast
-      || prevImmediate.contextWindow !== args.contextWindow
-      || prevImmediate.displayContextWindow !== args.displayContextWindow
-      || prevImmediate.rawContextWindow !== args.rawContextWindow;
+      || prevImmediate.fast !== args.fast;
     // A theme switch must re-tone the footer immediately: the stored `line`
     // holds already-normalized ANSI with the OLD palette, so re-running
     // normalizeStatusLine on it is a no-op. Force a fresh local rebuild (new
@@ -607,9 +635,31 @@ function StatusLineView({ sessionId, clientHostPid, provider, model, effort, fas
     const timer = setTimeout(() => {
       if (bootFullDoneRef.current !== true) {
         if (!bootFullRenderEligible(mountAtRef.current, lineRef.current, args.agentWorkers, args.agentJobs, args.activeTools)) {
+          // Not eligible yet (boot delay not elapsed). Don't just bail and wait
+          // for the next refreshTick interval (250ms/2000ms) — arm a follow-up
+          // timeout for the REMAINING boot delay so the first full render still
+          // fires on schedule instead of stalling/flickering until the next tick.
+          const active = hasActiveStatuslineWork(lineRef.current, args.agentWorkers, args.agentJobs, args.activeTools);
+          const bootDelay = active ? STATUSLINE_BOOT_FULL_DELAY_ACTIVE_MS : STATUSLINE_BOOT_FULL_DELAY_MS;
+          const elapsed = Date.now() - mountAtRef.current;
+          const remaining = Math.max(150, bootDelay - elapsed);
+          bootRetryTimer = setTimeout(() => {
+            if (!isCurrentEffect()) return;
+            setRefreshTick((tick) => (tick + 1) % 1_000_000);
+          }, remaining);
+          bootRetryTimer.unref?.();
           return;
         }
         if (!canAttemptBootFullRender(bootFullNextAttemptAtRef.current)) {
+          // Backoff window not elapsed yet — arm a follow-up timeout for exactly
+          // the remaining backoff so the retry fires on time instead of waiting
+          // for the next refreshTick interval.
+          const remaining = Math.max(150, bootFullNextAttemptAtRef.current - Date.now());
+          bootRetryTimer = setTimeout(() => {
+            if (!isCurrentEffect()) return;
+            setRefreshTick((tick) => (tick + 1) % 1_000_000);
+          }, remaining);
+          bootRetryTimer.unref?.();
           return;
         }
       }
@@ -644,8 +694,9 @@ function StatusLineView({ sessionId, clientHostPid, provider, model, effort, fas
     return () => {
       alive = false;
       clearTimeout(timer);
+      clearTimeout(bootRetryTimer);
     };
-  }, [sessionId, clientHostPid, provider, model, effort, fast, cwd, stats, contextWindow, displayContextWindow, compactBoundaryTokens, autoCompactTokenLimit, rawContextWindow, resizeEpoch, agentRevision, agentWorkers, agentJobs, activeToolsSignature, refreshTick, themeEpoch]);
+  }, [sessionId, clientHostPid, provider, model, effort, fast, cwd, statsSignature, contextWindow, displayContextWindow, compactBoundaryTokens, autoCompactTokenLimit, rawContextWindow, resizeEpoch, agentRevision, agentWorkersSignature, agentJobsSignature, activeToolsSignature, refreshTick, themeEpoch]);
 
   const lines = line ? line.split('\n').slice(0, 2) : [' ', ' '];
   const workflowLabel = workflowModeLabel(workflow, remoteEnabled);

package/src/tui/components/TextEntryPanel.jsx

@@ -159,6 +159,7 @@ function isAnyModifiedEnterSequence(input) {
 export function TextEntryPanel({
   title,
   hint = '',
+  detail = '',
   initialValue = '',
   mask = false,
   columns = 80,
@@ -465,6 +466,10 @@ export function TextEntryPanel({
   // The hint is collapsed to one line and width-truncated so a long manual
   // OAuth URL can never wrap and push the bordered title off the top.
   const hintText = truncateText(singleLine(hint), Math.max(0, columns - 4));
+  // Optional wrapped detail block (e.g. the manual OAuth URL). Lives INSIDE the
+  // live panel — never pushed to the transcript — so it disappears completely
+  // when the panel closes instead of lingering in terminal scrollback.
+  const detailText = String(detail || '').trim();
 
   return (
     <Box flexDirection="column" flexShrink={0} width="100%">
@@ -475,6 +480,12 @@ export function TextEntryPanel({
         </Box>
         <Text> </Text>
         <Text color={theme.subtle}>{hintText || ' '}</Text>
+        {detailText ? (
+          <Box flexDirection="column" width="100%">
+            <Text> </Text>
+            <Text color={theme.subtle} wrap="wrap">{detailText}</Text>
+          </Box>
+        ) : null}
         <Text> </Text>
         <Box ref={boxRef} flexDirection="row" width="100%" backgroundColor={surfaceBackground()}>
           <Text color={theme.inactive}>{promptLabel}</Text>