mixdog 0.9.26 → 0.9.28

package/src/session-runtime/runtime-core.mjs

@@ -15,7 +15,8 @@ import { writeLastSessionCwd } from '../runtime/shared/user-cwd.mjs';
 import { cancelBackgroundTasks } from '../runtime/shared/background-tasks.mjs';
 import { createTranscriptWriter } from '../runtime/shared/transcript-writer.mjs';
 import { mixdogHome } from '../runtime/shared/plugin-paths.mjs';
-import { checkLatestVersion, runGlobalUpdate, localPackageVersion, isDevInstall } from '../runtime/shared/update-checker.mjs';
+import { checkLatestVersion, localPackageVersion, isDevInstall } from '../runtime/shared/update-checker.mjs';
+import { spawnStagedInstall, runStagedInstall, isStagedComplete } from '../runtime/shared/staged-update.mjs';
 import {
   modelVisibleToolCompletionMessage,
   shouldPersistModelVisibleToolCompletion,
@@ -634,12 +635,14 @@ export async function createMixdogSessionRuntime({
   };
   // phase: 'idle' | 'checking' | 'installing' | 'installed' | 'failed'
   let updateProcessState = { phase: 'idle', version: null, error: null };
-  // Boot detects an available update but DEFERS the actual npm install to the
-  // graceful shutdown path (flushPendingUpdate, invoked from close()). Running
-  // `npm install -g` while the process is live overwrites the very .mjs files
-  // node has loaded → Windows TAR_ENTRY_ERROR file-locks. Installing on quit
-  // lets the parent release those handles first.
-  let pendingUpdateInstall = false;
+  // Boot detects an available update and STAGES it in the background (a hidden,
+  // detached npm install into ~/.mixdog/data/staging/<ver>). The staged package
+  // is swapped into the global dir on the next clean launch (cli.mjs
+  // pre-import), never while a session is live — so npm never overwrites the
+  // .mjs files node currently holds (the old shutdown `npm install -g` did, and
+  // caused Windows TAR_ENTRY_ERROR / ENOENT). The live-session refcount that a
+  // concurrent launch consults to defer its swap is registered earlier, in
+  // cli.mjs (pre-import), so this process is visible before any runtime loads.
 
   function autoUpdateEnabled() {
     return config?.update?.auto !== false;
@@ -668,14 +671,23 @@ export async function createMixdogSessionRuntime({
     if (updateProcessState.phase === 'installing') {
       return { ...updateProcessState, alreadyInstalling: true, error: 'update already in progress' };
     }
-    // A manual install consumes the boot-armed deferred install so quitting
-    // afterwards can't spawn a second redundant `npm install -g`.
-    pendingUpdateInstall = false;
-    updateProcessState = { phase: 'installing', version: null, error: null };
+    if (isDevInstall()) {
+      updateProcessState = { phase: 'failed', version: null, error: 'dev install — update skipped' };
+      return updateProcessState;
+    }
+    const ver = updateCheckState.latestVersion;
+    if (!ver || !updateCheckState.updateAvailable) {
+      updateProcessState = { phase: 'idle', version: null, error: null };
+      return { ...updateProcessState, error: 'no update available' };
+    }
+    // "Update now" stages the new version (verified, self-contained) rather than
+    // installing over the live global dir; the swap applies on the next launch.
+    // phase 'installed' here means "staged & ready — restart to apply".
+    updateProcessState = { phase: 'installing', version: ver, error: null };
     try {
-      const result = await runGlobalUpdate();
+      const result = await runStagedInstall(ver);
       if (result?.ok) {
-        updateProcessState = { phase: 'installed', version: result.version || null, error: null };
+        updateProcessState = { phase: 'installed', version: result.version || ver, error: null };
       } else {
         updateProcessState = { phase: 'failed', version: null, error: result?.error || 'update failed' };
       }
@@ -689,43 +701,53 @@ export async function createMixdogSessionRuntime({
   // constructed (setTimeout(0) defers past the synchronous return), so a
   // slow/hanging registry request can never delay session boot. The check
   // ALWAYS runs (populates updateCheckState for the maintenance picker), but
-  // the boot hook only DETECTS + arms a deferred install — the actual
-  // runGlobalUpdate now happens on graceful shutdown (flushPendingUpdate via
-  // close()) so npm never overwrites files the live process holds.
+  // when an update is available it kicks off a hidden BACKGROUND staging
+  // install (spawnStagedInstall) into ~/.mixdog/data/staging/<ver>. The actual
+  // swap into the global dir happens on the next clean launch (cli.mjs
+  // pre-import), so npm never overwrites files this live process holds.
   // force:true — always hit the registry at boot (the 24h disk cache went
   // stale-visible: it kept reporting an older "latest" than the installed
   // version). checkLatestVersion() still falls back to the cache offline.
   // isDevInstall() gate: a git checkout / clone (or non-node_modules install)
-  // must never self-update — `npm install -g` would fight the working tree.
+  // must never self-update — staging + swap would fight the working tree.
   const updateBootTimer = setTimeout(() => {
     void (async () => {
       await checkForUpdateInternal({ force: true });
-      if (autoUpdateEnabled() && !isDevInstall() && updateCheckState.updateAvailable) {
-        pendingUpdateInstall = true;
-        const v = updateCheckState.latestVersion ? `v${updateCheckState.latestVersion}` : 'latest';
-        // UI-only notice (TUI maps meta.kind 'update-notice' to a transcript
-        // notice, never a model-visible message). tone 'info': non-urgent,
-        // the install fires quietly on quit.
-        emitRuntimeNotification(`mixdog ${v} available — installs when you quit.`, { kind: 'update-notice', tone: 'info' });
-      }
+      if (!(autoUpdateEnabled() && !isDevInstall() && updateCheckState.updateAvailable)) return;
+      const ver = updateCheckState.latestVersion;
+      if (!ver) return;
+      // The notice fires ONLY once staging has completed (a ready-to-apply
+      // package sits on disk) — never upfront — so the user sees no "update
+      // available / installs on quit" nag while the background stage runs
+      // silently. The wording lives in the notice surface (notification-plan):
+      // this emit only carries meta.version. TUI maps meta.kind 'update-notice'
+      // to a transcript notice, never a model-visible message; tone 'info' =
+      // non-urgent, applies on the next launch.
+      const announceReady = () => {
+        emitRuntimeNotification('update ready', { kind: 'update-notice', version: ver, tone: 'info' });
+      };
+      // Already staged in a prior session → announce immediately.
+      if (isStagedComplete(ver)) { announceReady(); return; }
+      try { spawnStagedInstall(ver); } catch { /* best-effort background stage */ }
+      // Poll for staging completion, then announce once. The interval is
+      // unref'd so it never holds the process open, and gives up silently
+      // after the cap — the next launch retries.
+      const POLL_MS = 3_000;
+      const MAX_MS = 10 * 60 * 1000;
+      const startedAt = Date.now();
+      const poll = setInterval(() => {
+        if (isStagedComplete(ver)) {
+          clearInterval(poll);
+          announceReady();
+        } else if (Date.now() - startedAt > MAX_MS) {
+          clearInterval(poll);
+        }
+      }, POLL_MS);
+      poll.unref?.();
     })().catch(() => {});
   }, 0);
   updateBootTimer.unref?.();
 
-  // Invoked from the graceful shutdown path (lifecycle close() on exit/quit).
-  // Spawns the deferred npm install fire-and-forget: runGlobalUpdate() detaches
-  // (POSIX) / unrefs its child, so we neither await it nor block teardown —
-  // the parent exits, releasing file handles, while npm installs in the hidden
-  // background child. No-op unless an update was armed at boot.
-  function flushPendingUpdate() {
-    if (!pendingUpdateInstall) return;
-    pendingUpdateInstall = false;
-    // Re-check at flush time: the user may have turned update.auto off after
-    // the boot notice armed the install — respect the current setting.
-    if (!autoUpdateEnabled()) return;
-    try { void runGlobalUpdate(); } catch { /* best-effort: exit must not wedge */ }
-  }
-
   function emitRuntimeNotification(content, meta = {}) {
     const text = String(content || '').trim();
     if (!text) return false;
@@ -2003,7 +2025,6 @@ export async function createMixdogSessionRuntime({
     resolveRoute,
     applyDeferredToolSurface,
     standaloneTools,
-    flushPendingUpdate,
   });
   const resourceApi = createResourceApi({
     getConfig: () => config,

package/src/standalone/agent-tool/tool-def.mjs

@@ -35,12 +35,12 @@ export const AGENT_TOOL = {
     openWorldHint: true,
     agentHidden: true,
   },
-  description: 'Delegate scoped work. Agent handoffs always start background tasks and return task IDs immediately. Spawn independent scopes in parallel with distinct tags; for the same scope, use send or spawn with the same tag to reuse the live session. Wait for the completion notification before dependent work. Do not call status/read after spawn; they are manual recovery only.',
+  description: 'Delegate scoped work. Agent handoffs always start background tasks and return task IDs immediately. Spawn every independent scope in parallel in the same turn, each with a distinct tag; for the same scope, use send or spawn with the same tag to reuse the live session. Wait for the completion notification before dependent work. Do not call status/read after spawn; they are manual recovery only.',
   inputSchema: {
     type: 'object',
     properties: {
       type: { type: 'string', enum: ['spawn', 'send', 'list', 'close', 'cancel', 'status', 'read', 'cleanup'], description: 'Action. Default spawn.' },
-      task_id: { type: 'string', description: 'Manual recovery task ID.' },
+      task_id: { type: 'string', description: 'Manual recovery task ID. Required for read/status.' },
       agent: { type: 'string', description: 'Workflow agent id.' },
       tag: { type: 'string', description: 'Stable scope handle. Reuse the same tag for follow-up on the same scope; use distinct tags only for independent scopes.' },
       sessionId: { type: 'string', description: 'Raw sess_ id.' },

package/src/tui/App.jsx

@@ -21,6 +21,7 @@ import { Box, Text, useApp, useInput, useStdin, useStdout } from 'ink';
 import { theme, surfaceBackground } from './theme.mjs';
 import { useEngine } from './hooks/useEngine.mjs';
 import { classifyToolCategory } from '../runtime/shared/tool-surface.mjs';
+import { localPackageVersion } from '../runtime/shared/update-checker.mjs';
 import { Spinner } from './components/Spinner.jsx';
 import { StatusLine } from './components/StatusLine.jsx';
 import { PromptInput } from './components/PromptInput.jsx';
@@ -3058,7 +3059,7 @@ export function App({ store, initialStatusLine = '', forceOnboarding = false })
           <Text color={theme.logo ?? theme.claude} bold>{centerLine('██║╚██╔╝██║██║ ██╔██╗ ██║  ██║██║   ██║██║   ██║', frameColumns)}</Text>
           <Text color={theme.logo ?? theme.claude} bold>{centerLine('██║ ╚═╝ ██║██║██╔╝ ██╗██████╔╝╚██████╔╝╚██████╔╝', frameColumns)}</Text>
           <Box height={1} flexShrink={0} />
-          <Text color={theme.inactive}>{centerLine(`mixdog coding agent · ${state.cwd}`, frameColumns, 4)}</Text>
+          <Text color={theme.inactive}>{centerLine(`mixdog coding agent · v${localPackageVersion()} · ${state.cwd}`, frameColumns, 4)}</Text>
         </Box>
       ) : null}
 

package/src/tui/app/transcript-window.mjs

@@ -50,6 +50,16 @@ export const TRANSCRIPT_WINDOW_OVERSCAN_ROWS = positiveIntEnv('MIXDOG_TUI_TRANSC
 // tail of off-screen rows, so lower it to a value that still comfortably covers
 // viewport + overscan on a large terminal. Env-tunable for A/B / revert.
 export const TRANSCRIPT_WINDOW_MAX_ITEMS = positiveIntEnv('MIXDOG_TUI_TRANSCRIPT_WINDOW_ITEMS', 80);
+// When the transcript is anchored to the bottom (live tail / streaming view,
+// effectiveScrollOffset === 0), everything above the viewport is off-screen and
+// cannot be revealed without a scroll action — which sets scrollOffset > 0 and
+// re-renders through the FULL overscan/cap constants above, i.e. scrolled-up
+// history is byte-for-byte unchanged. So in the at-bottom case we mount only
+// viewport + a small overscan, sharply cutting ink's per-frame serialize cost
+// during streaming (bench: 80→20 mounted rows ≈ 4.07ms/render, 109 CPU-ms/s).
+// Env-tunable for A/B / revert.
+export const TRANSCRIPT_WINDOW_TAIL_OVERSCAN_ROWS = positiveIntEnv('MIXDOG_TUI_TRANSCRIPT_TAIL_OVERSCAN_ROWS', 4);
+export const TRANSCRIPT_WINDOW_TAIL_MAX_ITEMS = positiveIntEnv('MIXDOG_TUI_TRANSCRIPT_WINDOW_TAIL_ITEMS', 20);
 export const SELECTION_PAINT_INTERVAL_MS = positiveIntEnv('MIXDOG_TUI_SELECTION_PAINT_MS', 24);
 // Frame-coalesce edge-drag auto-scroll + wheel scroll: both paths accumulate
 // deltas into one pending total and flush via a single scrollTranscriptRows
@@ -904,12 +914,16 @@ export function transcriptRenderWindow(items, { scrollOffset = 0, viewportHeight
   }
 
   const minItems = Math.min(TRANSCRIPT_WINDOW_MIN_ITEMS, itemCount);
-  const maxItems = Math.max(minItems, TRANSCRIPT_WINDOW_MAX_ITEMS);
+  // At-bottom (live tail) mounts only viewport + a small overscan; scrolled-up
+  // views keep the full overscan/cap so history renders exactly as before.
+  const atTail = effectiveScrollOffset === 0;
+  const overscanRows = atTail ? TRANSCRIPT_WINDOW_TAIL_OVERSCAN_ROWS : TRANSCRIPT_WINDOW_OVERSCAN_ROWS;
+  const maxItems = Math.max(minItems, atTail ? TRANSCRIPT_WINDOW_TAIL_MAX_ITEMS : TRANSCRIPT_WINDOW_MAX_ITEMS);
   const prefixRows = fallbackIndex.prefixRows;
   const visibleTop = Math.max(0, totalRows - effectiveScrollOffset - viewRows);
   const visibleBottom = Math.min(totalRows, totalRows - effectiveScrollOffset);
-  const desiredTop = Math.max(0, visibleTop - TRANSCRIPT_WINDOW_OVERSCAN_ROWS);
-  const desiredBottom = Math.min(totalRows, visibleBottom + TRANSCRIPT_WINDOW_OVERSCAN_ROWS);
+  const desiredTop = Math.max(0, visibleTop - overscanRows);
+  const desiredBottom = Math.min(totalRows, visibleBottom + overscanRows);
 
   let startIndex = Math.max(0, upperBound(prefixRows, desiredTop) - 1);
   let endIndex = Math.min(itemCount, Math.max(startIndex + 1, lowerBound(prefixRows, Math.max(desiredBottom, desiredTop + 1))));
@@ -920,9 +934,15 @@ export function transcriptRenderWindow(items, { scrollOffset = 0, viewportHeight
   if (endIndex - startIndex > maxItems) {
     const visibleStartIndex = Math.max(0, upperBound(prefixRows, visibleTop) - 1);
     const visibleEndIndex = Math.min(itemCount, Math.max(visibleStartIndex + 1, lowerBound(prefixRows, Math.max(visibleBottom, visibleTop + 1))));
-    startIndex = Math.max(0, Math.min(visibleStartIndex, itemCount - maxItems));
-    endIndex = Math.min(itemCount, Math.max(visibleEndIndex, startIndex + maxItems));
-    if (endIndex - startIndex > maxItems) startIndex = Math.max(0, endIndex - maxItems);
+    // The cap must never cut into rows needed to fill the viewport: floor it at
+    // the item span the visible viewport actually covers, so a run of many short
+    // (e.g. one-line) items can't leave the top of the viewport unmounted under
+    // the small tail cap. Full-view (scrolled-up) behavior is unchanged: there
+    // maxItems already exceeds the visible span, so the floor is a no-op.
+    const effectiveMaxItems = Math.max(maxItems, visibleEndIndex - visibleStartIndex);
+    startIndex = Math.max(0, Math.min(visibleStartIndex, itemCount - effectiveMaxItems));
+    endIndex = Math.min(itemCount, Math.max(visibleEndIndex, startIndex + effectiveMaxItems));
+    if (endIndex - startIndex > effectiveMaxItems) startIndex = Math.max(0, endIndex - effectiveMaxItems);
   }
 
   const bottomSpacerRows = Math.max(0, totalRows - (prefixRows[endIndex] || totalRows));

package/src/tui/components/Spinner.jsx

@@ -18,7 +18,8 @@
  *     'requesting' | 'compacting' | 'resuming' (default 'responding').
  */
 import React, { useRef } from 'react';
-import { Box, Text, useAnimation } from 'ink';
+import { Box, Text } from 'ink';
+import { useSharedTick } from '../hooks/useSharedTick.mjs';
 import { theme } from '../theme.mjs';
 import { SPINNER_FRAMES } from '../spinner-verbs.mjs';
 import { DOWN_ARROW, UP_ARROW } from '../figures.mjs';
@@ -170,7 +171,9 @@ 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 });
+  // Re-render at the frame cadence off the shared tick (no dedicated timer).
+  // Glyph/shimmer/token/elapsed values are all derived from Date.now() below.
+  useSharedTick(FRAME_MS);
   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;

package/src/tui/components/StatusLine.jsx

@@ -15,6 +15,7 @@ import {
   statuslineFooterCacheKey,
   statuslineFooterIdentityChanged,
 } from '../statusline-ansi-bridge.mjs';
+import { useSharedTick } from '../hooks/useSharedTick.mjs';
 
 // Loaded at RUNTIME (not bundled) so its vendored statusline-lib relative
 // imports resolve from the real src/ui location, not the dist/ bundle dir.
@@ -514,13 +515,12 @@ function StatusLineView({ sessionId, clientHostPid, provider, model, effort, fas
     scheduleStatuslineModulePrewarm();
   }, []);
 
-  useEffect(() => {
-    const timer = setInterval(() => {
-      setRefreshTick((tick) => (tick + 1) % 1_000_000);
-    }, refreshMs);
-    timer.unref?.();
-    return () => clearInterval(timer);
-  }, [refreshMs]);
+  // Refresh cadence rides the shared animation tick (no dedicated interval).
+  // The callback bumps refreshTick so the async full-render effect below still
+  // re-fires on schedule; the tick timer stops when nothing is subscribed.
+  useSharedTick(refreshMs, true, () => {
+    setRefreshTick((tick) => (tick + 1) % 1_000_000);
+  });
 
   useEffect(() => {
     let alive = true;
@@ -709,7 +709,7 @@ function StatusLineView({ sessionId, clientHostPid, provider, model, effort, fas
   return (
     <Box flexDirection="column" width="100%" height={3} overflow="hidden" justifyContent="flex-start" paddingLeft={2} backgroundColor={surfaceBackground()}>
       <Box flexDirection="row" width="100%" overflow="hidden">
-        <Box flexGrow={1} flexShrink={1} overflow="hidden">
+        <Box flexGrow={1} flexShrink={1} flexBasis={0} overflow="hidden">
           <Text wrap="truncate">{lines[0] || ' '}</Text>
         </Box>
         <Box flexShrink={0} marginLeft={1} marginRight={1}>
@@ -717,7 +717,7 @@ function StatusLineView({ sessionId, clientHostPid, provider, model, effort, fas
         </Box>
       </Box>
       <Box flexDirection="row" width="100%" overflow="hidden">
-        <Box flexGrow={1} flexShrink={1} overflow="hidden">
+        <Box flexGrow={1} flexShrink={1} flexBasis={0} overflow="hidden">
           <Text wrap="truncate">{lines[1] || ' '}</Text>
         </Box>
       </Box>

package/src/tui/components/ToolExecution.jsx

@@ -8,8 +8,9 @@
  *   - The result hangs under a single dim `  ⎿  ` gutter — the gutter is placed
  *     once, not repeated per wrapped line.
  */
-import React, { useEffect, useState } from 'react';
+import React from 'react';
 import { Box, Text } from 'ink';
+import { useSharedTick } from '../hooks/useSharedTick.mjs';
 import stringWidth from 'string-width';
 import { theme, TURN_MARKER, AGENT_CALL_MARKER, AGENT_RESPONSE_MARKER } from '../theme.mjs';
 import { formatElapsed } from '../time-format.mjs';
@@ -74,6 +75,9 @@ export function displayToolName(name, args) {
 const TOOL_BLINK_MS = 500;
 const TOOL_BLINK_LIMIT_MS = 3000;
 const TOOL_PENDING_SHOW_DELAY_MS = 1000;
+// One shared-tick cadence covers both the 500ms blink and per-second elapsed;
+// finer than either boundary so both stay crisp off a single timer.
+const TOOL_ANIM_TICK_MS = TOOL_BLINK_MS;
 function statusCopy(name, label, count, doneCount, pending, isError, args = {}) {
   // No stableVerbWidth padding: it padded the done verb to the active ("-ing")
   // width, which Ink trims at the line END (vendor output trimEnd) so it never
@@ -85,10 +89,6 @@ function statusCopy(name, label, count, doneCount, pending, isError, args = {})
 }
 export function ToolExecution({ name, args, result, rawResult, isError, errorCount, expanded, columns = 80, attached = false, count = 1, completedCount = 0, startedAt = 0, completedAt = 0, aggregate = false, categories = {}, doneCategories = null, headerFinalized = true, deferredDisplayReady = false }) {
   const rowWidth = Math.max(1, Number(columns || 80));
-  const [blinkOn, setBlinkOn] = useState(true);
-  const [blinkExpired, setBlinkExpired] = useState(false);
-  const [pendingDelayElapsed, setPendingDelayElapsed] = useState(false);
-  const [, setElapsedTick] = useState(0);
   const groupCount = Math.max(1, Number(count || 1));
   const doneCount = Math.max(0, Math.min(groupCount, Number(completedCount || (result == null ? 0 : groupCount))));
   const rt = result == null ? null : String(result).replace(/\s+$/, '');
@@ -96,7 +96,15 @@ export function ToolExecution({ name, args, result, rawResult, isError, errorCou
   const pending = doneCount < groupCount;
   const startedAtMs = Number(startedAt || 0);
   const completedAtMs = Number(completedAt || 0);
-  const pendingAgeMs = pending && startedAtMs ? Math.max(0, Date.now() - startedAtMs) : 0;
+  const nowMs = Date.now();
+  // Single shared tick drives the blink + elapsed re-renders while pending; all
+  // phase/elapsed values below are derived from nowMs, so no per-card timers.
+  useSharedTick(TOOL_ANIM_TICK_MS, pending);
+  const pendingAgeMs = pending && startedAtMs ? Math.max(0, nowMs - startedAtMs) : 0;
+  // Derived (was a per-card setTimeout): the pending-show delay has elapsed.
+  const pendingDelayElapsed = pending
+    ? (!startedAtMs || pendingAgeMs >= TOOL_PENDING_SHOW_DELAY_MS)
+    : false;
   // A card that is still pending but already has something to paint (a result
   // landed, or at least one of an aggregate's parallel calls completed) must
   // SKIP the blank placeholder: it was pushed early (engine ensureVisible on a
@@ -108,6 +116,15 @@ export function ToolExecution({ name, args, result, rawResult, isError, errorCou
   // land — no empty band.
   const hasVisibleProgress = doneCount > 0 || Boolean(String(rt || '').trim());
   const pendingDisplayReady = !pending || !startedAtMs || pendingDelayElapsed || pendingAgeMs >= TOOL_PENDING_SHOW_DELAY_MS || hasVisibleProgress || deferredDisplayReady;
+  // Derived blink (was two per-card setIntervals + a setTimeout): the dot blinks
+  // at TOOL_BLINK_MS while a display-ready pending card is fresh, then goes solid
+  // once TOOL_BLINK_LIMIT_MS elapses. Phase comes from Date.now() so the cadence
+  // is identical to the old interval without owning a timer.
+  const blinkActive = pending && pendingDisplayReady;
+  const blinkExpired = blinkActive && startedAtMs > 0 && (nowMs - startedAtMs) >= TOOL_BLINK_LIMIT_MS;
+  const blinkOn = !blinkActive || blinkExpired
+    ? true
+    : Math.floor(nowMs / TOOL_BLINK_MS) % 2 === 0;
   // Keep the action verb in its active form until the engine explicitly seals
   // the tool block. Fast tool batches often complete before the next provider
   // iteration decides whether to call more tools or emit assistant text; flipping
@@ -115,7 +132,7 @@ export function ToolExecution({ name, args, result, rawResult, isError, errorCou
   const headerPending = pending || headerFinalized === false;
   const hasResult = result != null && Boolean(String(rt || '').trim());
   const hasRawResult = rawResult != null && Boolean(String(rawRt || '').trim());
-  const elapsedMs = startedAtMs ? Math.max(0, (pending ? Date.now() : (completedAtMs || Date.now())) - startedAtMs) : 0;
+  const elapsedMs = startedAtMs ? Math.max(0, (pending ? nowMs : (completedAtMs || nowMs)) - startedAtMs) : 0;
   const elapsed = elapsedMs >= 1000 ? formatElapsed(elapsedMs) : '';
   const failedCount = clampFailureCount(errorCount, groupCount, isError);
   const displayGroupCount = groupCount;
@@ -133,57 +150,6 @@ export function ToolExecution({ name, args, result, rawResult, isError, errorCou
   );
   const displayDoneCategories = hasDoneCounts ? normalizedDoneCategories : displayCategories;
 
-  useEffect(() => {
-    if (!pending) {
-      setPendingDelayElapsed(false);
-      return undefined;
-    }
-    const started = Number(startedAt || 0);
-    if (!started) {
-      setPendingDelayElapsed(true);
-      return undefined;
-    }
-    const remaining = TOOL_PENDING_SHOW_DELAY_MS - Math.max(0, Date.now() - started);
-    if (remaining <= 0) {
-      setPendingDelayElapsed(true);
-      return undefined;
-    }
-    setPendingDelayElapsed(false);
-    const timer = setTimeout(() => setPendingDelayElapsed(true), remaining);
-    return () => clearTimeout(timer);
-  }, [pending, startedAt]);
-
-  useEffect(() => {
-    if (!pending || !pendingDisplayReady || blinkExpired) {
-      setBlinkOn(true);
-      return undefined;
-    }
-    const timer = setInterval(() => setBlinkOn((on) => !on), TOOL_BLINK_MS);
-    return () => clearInterval(timer);
-  }, [pending, pendingDisplayReady, blinkExpired]);
-
-  useEffect(() => {
-    if (!pending || !pendingDisplayReady) {
-      setBlinkExpired(false);
-      return undefined;
-    }
-    const started = Number(startedAt || 0);
-    const remaining = TOOL_BLINK_LIMIT_MS - (started ? Math.max(0, Date.now() - started) : 0);
-    if (remaining <= 0) {
-      setBlinkExpired(true);
-      return undefined;
-    }
-    setBlinkExpired(false);
-    const timer = setTimeout(() => setBlinkExpired(true), remaining);
-    return () => clearTimeout(timer);
-  }, [pending, pendingDisplayReady, startedAt]);
-
-  useEffect(() => {
-    if (!pending || !pendingDisplayReady || !startedAtMs) return undefined;
-    const timer = setInterval(() => setElapsedTick((tick) => (tick + 1) % 1000000), 1000);
-    return () => clearInterval(timer);
-  }, [pending, pendingDisplayReady, startedAtMs]);
-
   // While a freshly-started tool is still inside its pending-show delay we used
   // to `return null` (0 rendered rows). But estimateTranscriptItemRows() in
   // App.jsx counts a collapsed tool item from the moment it is pushed (1 row for
@@ -466,7 +432,16 @@ export function ToolExecution({ name, args, result, rawResult, isError, errorCou
   const markerGlyph = isAgentResponse
     ? AGENT_RESPONSE_MARKER
     : (isAgentSurfaceCard ? AGENT_CALL_MARKER : TURN_MARKER);
-  const dotText = pending && !blinkExpired && !blinkOn ? ' ' : markerGlyph;
+  // Directional arrow markers (`←` spawn/send out, `→` response back) render 2
+  // cells wide in some terminals (Windows Terminal / Cascadia) while our width
+  // math counts them as 1, so the `Box minWidth={2}` gutter padding gets
+  // overdrawn and the label glues to the arrow ("←Spawn"). Carry an explicit
+  // trailing space in the marker string so the gap is a real character that
+  // survives regardless of how wide the terminal actually draws the glyph. The
+  // `●` turn marker is a true 1-cell glyph and keeps the padding-only gutter.
+  const isDirectionalMarker = isAgentResponse || isAgentSurfaceCard;
+  const markerText = isDirectionalMarker ? `${markerGlyph} ` : markerGlyph;
+  const dotText = pending && !blinkExpired && !blinkOn ? ' ' : markerText;
   let labelText;
   if (isAgentResponse) labelText = agentResponseTitle(parsedArgs);
   else if (isBackgroundResponse) labelText = backgroundTaskResultTitle(normalizedName, backgroundMeta || parsedArgs);

package/src/tui/display-width.mjs

@@ -32,18 +32,22 @@ const graphemeSegmenter = new Intl.Segmenter(undefined, { granularity: 'grapheme
 /**
  * True for code points we treat as wide (2 cells) when the policy is ON:
  *   - U+2460–U+24FF Enclosed Alphanumerics (① ② ③ …)
- *   - U+2190–U+21FF Arrows (→ ← ↑ ↓ …)
- * Deliberately excludes box-drawing / blocks / figures.
+ *   - U+2194–U+21FF Arrows (↔ ⇒ ⇧ …)
+ * Deliberately excludes box-drawing / blocks / figures — including the four
+ * Basic Arrows U+2190–U+2193 (← ↑ → ↓) that figures.mjs uses as 1-cell
+ * markers (agent card ←/→, history ↑/↓): WT draws them 1 cell in
+ * Cascadia, and widening them ate the marker's gutter padding space
+ * ("←Spawn" rendered glued / shifted vs the ● rows).
  */
 export function isProblemCodePoint(cp) {
-  return (cp >= 0x2460 && cp <= 0x24ff) || (cp >= 0x2190 && cp <= 0x21ff);
+  return (cp >= 0x2460 && cp <= 0x24ff) || (cp >= 0x2194 && cp <= 0x21ff);
 }
 
 // Fast precheck for the problem ranges above. Lets the hot path bail before
 // the per-grapheme segmenter loop when a string (the overwhelmingly common
 // ASCII/status-text case) contains no widenable glyph. Kept identical to
 // vendor/ink/build/display-width.js.
-const PROBLEM_RE = /[\u2190-\u21ff\u2460-\u24ff]/;
+const PROBLEM_RE = /[\u2194-\u21ff\u2460-\u24ff]/;
 
 /**
  * Resolve the wide policy from env. Override wins over the default; the