mixdog 0.8.1 → 0.9.1

package/src/tui/markdown/table-layout.mjs

@@ -0,0 +1,250 @@
+/**
+ * markdown/table-layout.mjs — pure GFM table layout calculation (no JSX/ink).
+ *
+ * This is the SINGLE SOURCE OF TRUTH for how a marked `table` token is laid out
+ * into terminal lines. Both the renderer (components/MarkdownTable.jsx) and the
+ * row-height estimator (App.jsx) call `buildTableRender` so the visible line
+ * count and the estimated line count can never drift (lockstep).
+ *
+ * `buildTableRender(token, terminalWidth)` returns the exact array of strings
+ * the component draws (`<Text>{lines.join('\n')}</Text>`); the component renders
+ * those verbatim (no visual change) and the estimator measures `lines.length`.
+ *
+ * Pure + deterministic: same (token, terminalWidth) → same output. No hooks,
+ * no time/random/global state — `terminalWidth` is always passed in by the
+ * caller (the component resolves it from useStdout()/forceWidth).
+ */
+import stripAnsi from 'strip-ansi';
+import stringWidth from 'string-width';
+import wrapAnsi from 'wrap-ansi';
+import { formatToken, padAligned } from './format-token.mjs';
+
+export const SAFETY_MARGIN = 4;
+export const MIN_COLUMN_WIDTH = 3;
+export const MAX_ROW_LINES = 4;
+const ANSI_BOLD_START = '\x1b[1m';
+const ANSI_BOLD_END = '\x1b[22m';
+
+/** Assistant markdown body width — lockstep with Message.jsx / forceWidth. */
+export function assistantBodyWidth(columns) {
+  return Math.max(8, Number(columns || 80) - 3);
+}
+
+/** Wrap text to width, ANSI-aware, returning lines. */
+export function wrapText(text, width, options) {
+  if (width <= 0) return [text];
+  const trimmedText = String(text).trimEnd();
+  const wrapped = wrapAnsi(trimmedText, width, {
+    hard: options?.hard ?? false,
+    trim: false,
+    wordWrap: true,
+  });
+  const lines = wrapped.split('\n').filter((line) => line.length > 0);
+  return lines.length > 0 ? lines : [''];
+}
+
+/** Hard-wrap so every line satisfies stringWidth(line) <= width (vertical tables). */
+export function hardWrapLines(text, width) {
+  const max = Math.max(1, Math.floor(Number(width) || 1));
+  const input = String(text ?? '');
+  if (!input) return [''];
+  const out = [];
+  for (const softLine of wrapText(input, max, { hard: true })) {
+    let rest = softLine;
+    while (rest.length > 0 && stringWidth(rest) > max) {
+      let take = 1;
+      for (let i = 1; i <= rest.length; i++) {
+        if (stringWidth(rest.slice(0, i)) <= max) take = i;
+        else break;
+      }
+      out.push(rest.slice(0, take));
+      rest = rest.slice(take);
+    }
+    if (rest.length > 0) out.push(rest);
+  }
+  return out.length > 0 ? out : [''];
+}
+
+/**
+ * Compute the full table render as an ordered array of terminal lines plus the
+ * vertical-fallback flag. The logic mirrors the original MarkdownTable render
+ * exactly: column fit (ideal / proportional shrink / hard wrap), vertical
+ * fallback when a cell needs more than MAX_ROW_LINES, the bordered horizontal
+ * box, and the post-build overflow re-fallback to vertical.
+ */
+export function buildTableRender(token, terminalWidth) {
+  const width = Number(terminalWidth) || 80;
+  const formatCell = (tokens) => tokens?.map((t) => formatToken(t)).join('') ?? '';
+  const getPlainText = (tokens) => stripAnsi(formatCell(tokens));
+
+  const getMinWidth = (tokens) => {
+    const text = getPlainText(tokens);
+    const words = text.split(/\s+/).filter((w) => w.length > 0);
+    if (words.length === 0) return MIN_COLUMN_WIDTH;
+    return Math.max(...words.map((w) => stringWidth(w)), MIN_COLUMN_WIDTH);
+  };
+  const getIdealWidth = (tokens) =>
+    Math.max(stringWidth(getPlainText(tokens)), MIN_COLUMN_WIDTH);
+
+  // Step 1: min (longest word) and ideal (full content) widths per column.
+  const minWidths = token.header.map((header, colIndex) => {
+    let maxMinWidth = getMinWidth(header.tokens);
+    for (const row of token.rows) maxMinWidth = Math.max(maxMinWidth, getMinWidth(row[colIndex]?.tokens));
+    return maxMinWidth;
+  });
+  const idealWidths = token.header.map((header, colIndex) => {
+    let maxIdeal = getIdealWidth(header.tokens);
+    for (const row of token.rows) maxIdeal = Math.max(maxIdeal, getIdealWidth(row[colIndex]?.tokens));
+    return maxIdeal;
+  });
+
+  // Step 2: available space.
+  const numCols = token.header.length;
+  const borderOverhead = 1 + numCols * 3;
+  const availableWidth = Math.max(width - borderOverhead - SAFETY_MARGIN, numCols * MIN_COLUMN_WIDTH);
+
+  // Step 3: fit column widths into available space.
+  const totalMin = minWidths.reduce((s, w) => s + w, 0);
+  const totalIdeal = idealWidths.reduce((s, w) => s + w, 0);
+  let needsHardWrap = false;
+  let columnWidths;
+  if (totalIdeal <= availableWidth) {
+    columnWidths = idealWidths;
+  } else if (totalMin <= availableWidth) {
+    const extraSpace = availableWidth - totalMin;
+    const overflows = idealWidths.map((ideal, i) => ideal - minWidths[i]);
+    const totalOverflow = overflows.reduce((s, o) => s + o, 0);
+    columnWidths = minWidths.map((min, i) => {
+      if (totalOverflow === 0) return min;
+      return min + Math.floor((overflows[i] / totalOverflow) * extraSpace);
+    });
+  } else {
+    needsHardWrap = true;
+    const scaleFactor = availableWidth / totalMin;
+    columnWidths = minWidths.map((w) => Math.max(Math.floor(w * scaleFactor), MIN_COLUMN_WIDTH));
+  }
+
+  // Step 4: max row lines → decide vertical fallback.
+  const calculateMaxRowLines = () => {
+    let maxLines = 1;
+    for (let i = 0; i < token.header.length; i++) {
+      const wrapped = wrapText(formatCell(token.header[i].tokens), columnWidths[i], { hard: needsHardWrap });
+      maxLines = Math.max(maxLines, wrapped.length);
+    }
+    for (const row of token.rows) {
+      for (let i = 0; i < row.length; i++) {
+        const wrapped = wrapText(formatCell(row[i]?.tokens), columnWidths[i], { hard: needsHardWrap });
+        maxLines = Math.max(maxLines, wrapped.length);
+      }
+    }
+    return maxLines;
+  };
+  const useVerticalFormat = calculateMaxRowLines() > MAX_ROW_LINES;
+
+  const renderRowLines = (cells, isHeader) => {
+    const cellLines = cells.map((cell, colIndex) =>
+      wrapText(formatCell(cell.tokens), columnWidths[colIndex], { hard: needsHardWrap }),
+    );
+    const maxLines = Math.max(...cellLines.map((l) => l.length), 1);
+    const verticalOffsets = cellLines.map((l) => Math.floor((maxLines - l.length) / 2));
+    const result = [];
+    for (let lineIdx = 0; lineIdx < maxLines; lineIdx++) {
+      let line = '│';
+      for (let colIndex = 0; colIndex < cells.length; colIndex++) {
+        const lines = cellLines[colIndex];
+        const offset = verticalOffsets[colIndex];
+        const contentLineIdx = lineIdx - offset;
+        const lineText = contentLineIdx >= 0 && contentLineIdx < lines.length ? lines[contentLineIdx] : '';
+        const colWidth = columnWidths[colIndex];
+        const align = isHeader ? 'center' : token.align?.[colIndex] ?? 'left';
+        line += ' ' + padAligned(lineText, stringWidth(lineText), colWidth, align) + ' │';
+      }
+      result.push(line);
+    }
+    return result;
+  };
+
+  const renderBorderLine = (type) => {
+    const [left, mid, cross, right] = {
+      top: ['┌', '─', '┬', '┐'],
+      middle: ['├', '─', '┼', '┤'],
+      bottom: ['└', '─', '┴', '┘'],
+    }[type];
+    let line = left;
+    columnWidths.forEach((colWidth, colIndex) => {
+      line += mid.repeat(colWidth + 2);
+      line += colIndex < columnWidths.length - 1 ? cross : right;
+    });
+    return line;
+  };
+
+  const renderVerticalLines = () => {
+    const lines = [];
+    const headers = token.header.map((h) => getPlainText(h.tokens));
+    const separatorWidth = Math.min(Math.max(0, width - 1), 40);
+    const separator = '─'.repeat(separatorWidth);
+    const wrapIndent = '  ';
+    const indentWidth = stringWidth(wrapIndent);
+    const pushFitted = (rawLine) => {
+      for (const part of hardWrapLines(rawLine, width)) lines.push(part);
+    };
+    token.rows.forEach((row, rowIndex) => {
+      if (rowIndex > 0) lines.push(separator);
+      row.forEach((cell, colIndex) => {
+        const label = headers[colIndex] || `Column ${colIndex + 1}`;
+        const rawValue = formatCell(cell.tokens).trimEnd();
+        const value = rawValue.replace(/\n+/g, ' ').replace(/\s+/g, ' ').trim();
+        const prefix = `${ANSI_BOLD_START}${label}:${ANSI_BOLD_END} `;
+        const prefixWidth = stringWidth(stripAnsi(prefix));
+        const firstValueWidth = Math.max(1, width - prefixWidth);
+        const contValueWidth = Math.max(1, width - indentWidth);
+        const firstValueLines = hardWrapLines(value, firstValueWidth);
+        if (firstValueLines.length === 0) {
+          pushFitted(prefix.trimEnd());
+          return;
+        }
+        pushFitted(prefix + firstValueLines[0]);
+        const tail = firstValueLines.slice(1).join(' ').trim();
+        if (tail) {
+          for (const cont of hardWrapLines(tail, contValueWidth)) {
+            if (!cont.trim()) continue;
+            pushFitted(wrapIndent + cont);
+          }
+        }
+      });
+    });
+    return lines;
+  };
+
+  if (useVerticalFormat) {
+    return { lines: renderVerticalLines(), useVerticalFormat: true };
+  }
+
+  const tableLines = [];
+  tableLines.push(renderBorderLine('top'));
+  tableLines.push(...renderRowLines(token.header, true));
+  tableLines.push(renderBorderLine('middle'));
+  token.rows.forEach((row, rowIndex) => {
+    tableLines.push(...renderRowLines(row, false));
+    if (rowIndex < token.rows.length - 1) tableLines.push(renderBorderLine('middle'));
+  });
+  tableLines.push(renderBorderLine('bottom'));
+
+  // Safety: if any line would overflow (resize race), fall back to vertical.
+  const maxLineWidth = Math.max(...tableLines.map((l) => stringWidth(stripAnsi(l))));
+  if (maxLineWidth > width - SAFETY_MARGIN) {
+    return { lines: renderVerticalLines(), useVerticalFormat: true };
+  }
+
+  return { lines: tableLines, useVerticalFormat: false };
+}
+
+/**
+ * Exact number of terminal lines a table token occupies once rendered at
+ * `terminalWidth`. This is what MarkdownTable actually draws, so the row
+ * estimator can reserve precisely that many rows (no top-clip, no slack).
+ */
+export function measureMarkdownTableRows(token, terminalWidth) {
+  if (!token || !Array.isArray(token.header) || token.header.length === 0) return 0;
+  return buildTableRender(token, terminalWidth).lines.length;
+}

package/src/tui/paste-attachments.mjs

@@ -62,13 +62,6 @@ export function formatImageRef(id) {
   return `[Image #${id}]`;
 }
 
-export function parsePasteReferences(input) {
-  const re = /\[(?:Image|Pasted text|\.\.\.Truncated text) #(\d+)(?: \+\d+ lines)?\]/g;
-  return [...String(input || '').matchAll(re)]
-    .map((m) => ({ id: Number(m[1]) || 0, match: m[0], index: m.index || 0 }))
-    .filter((m) => m.id > 0);
-}
-
 export function imageReferenceIds(input) {
   const re = /\[Image #(\d+)\]/g;
   return new Set([...String(input || '').matchAll(re)].map((m) => Number(m[1]) || 0).filter(Boolean));

package/src/tui/spinner-verbs.mjs

@@ -1,8 +1,7 @@
 /**
  * src/tui/spinner-verbs.mjs — playful "thinking" verbs for the spinner.
  *
- * Ported verbatim from Claude Code (refs/claude-code/src/constants/spinnerVerbs.ts
- * SPINNER_VERBS). Shown as `<Verb>… (Ns · ↑ N tokens)` while a turn runs.
+ * Playful spinner verbs. Shown as `<Verb>… (Ns · ↑ N tokens)` while a turn runs.
  */
 export const SPINNER_VERBS = [
   'Accomplishing', 'Actioning', 'Actualizing', 'Architecting', 'Baking', 'Beaming',

package/src/tui/statusline-ansi-bridge.mjs

@@ -0,0 +1,172 @@
+/**
+ * TUI-only bridge: remap hardcoded footer ANSI from `src/ui/statusline.mjs` and
+ * vendored `statusline-lib` into the active React TUI theme.
+ *
+ * CLI/REPL keeps emitting the fixed Mixdog statusline palette; the Ink footer
+ * normalizes that at display time so `/theme` can re-tone without touching ui/.
+ */
+
+const RESET = '\x1b[0m';
+
+/** Truecolor SGR sequences emitted by the shared statusline stack (not theme). */
+export const STATUSLINE_CANONICAL_TRUECOLOR = Object.freeze({
+  statusText: [198, 198, 198],
+  subtle: [136, 136, 136],
+  success: [0, 170, 75],
+  successBright: [0, 185, 88],
+  warning: [255, 193, 7],
+  warningBright: [255, 210, 80],
+  error: [220, 70, 88],
+});
+
+function truecolorSgr(r, g, b) {
+  return `\x1b[38;2;${r};${g};${b}m`;
+}
+
+function footerLocalNum(value) {
+  const n = Number(value);
+  return Number.isFinite(n) ? n : 0;
+}
+
+/** Mirrors StatusLine `isResetStatsState` — stats-only identity for footer cache. */
+export function isResetStatsState(stats) {
+  const s = stats && typeof stats === 'object' ? stats : {};
+  return footerLocalNum(s.currentContextTokens) === 0
+    && footerLocalNum(s.currentEstimatedContextTokens) === 0
+    && footerLocalNum(s.inputTokens) === 0
+    && footerLocalNum(s.latestInputTokens) === 0
+    && footerLocalNum(s.promptTokens) === 0
+    && footerLocalNum(s.turns) === 0;
+}
+
+/**
+ * True when the footer should snap local / invalidate cached async output.
+ * Keep in sync with `shouldSnapLocalStatusline` in StatusLine.jsx.
+ */
+export function statuslineFooterIdentityChanged(args, lastArgs) {
+  if (!args) return false;
+  if (!lastArgs) return true;
+  if (args.agentRevision !== lastArgs.agentRevision) return true;
+  if (args.sessionId !== lastArgs.sessionId) return true;
+  if (args.provider !== lastArgs.provider || args.model !== lastArgs.model) return true;
+  if (args.effort !== lastArgs.effort || args.fast !== lastArgs.fast) return true;
+  if (args.contextWindow !== lastArgs.contextWindow || args.rawContextWindow !== lastArgs.rawContextWindow) return true;
+  if (args.displayContextWindow !== lastArgs.displayContextWindow) return true;
+  if (args.compactBoundaryTokens !== lastArgs.compactBoundaryTokens) return true;
+  if (args.autoCompactTokenLimit !== lastArgs.autoCompactTokenLimit) return true;
+  if (isResetStatsState(args.stats) && !isResetStatsState(lastArgs.stats)) return true;
+  return false;
+}
+
+/**
+ * Cache key for the last async full statusline (identity-changing props only).
+ * Must stay aligned with `shouldSnapLocalStatusline` in StatusLine.jsx.
+ * Stats reset is not keyed here; `statuslineFooterIdentityChanged` clears cache instead.
+ */
+export function statuslineFooterCacheKey({
+  agentRevision = '',
+  sessionId = '',
+  clientHostPid = '',
+  provider = '',
+  model = '',
+  effort = '',
+  fast = false,
+  contextWindow = 0,
+  displayContextWindow = 0,
+  rawContextWindow = 0,
+  compactBoundaryTokens = 0,
+  autoCompactTokenLimit = 0,
+} = {}) {
+  return [
+    String(agentRevision),
+    String(sessionId),
+    String(clientHostPid ?? ''),
+    String(provider),
+    String(model),
+    String(effort),
+    fast === true ? '1' : '0',
+    String(contextWindow),
+    String(displayContextWindow),
+    String(rawContextWindow),
+    String(compactBoundaryTokens),
+    String(autoCompactTokenLimit),
+  ].join('\0');
+}
+
+/**
+ * Gateway quota segments often end a dim label with reset then bare values
+ * (`Credit $1.23`, `used/limit`). Ink defaults reset to terminal fg; apply
+ * themed status text until the next explicit SGR.
+ */
+export function applyDefaultStatusForegroundAfterReset(text, STATUS, reset = RESET) {
+  const src = String(text || '');
+  if (!STATUS || !reset) return src;
+  let out = '';
+  let i = 0;
+  while (i < src.length) {
+    const at = src.indexOf(reset, i);
+    if (at === -1) {
+      out += src.slice(i);
+      break;
+    }
+    out += src.slice(i, at + reset.length);
+    i = at + reset.length;
+    let j = i;
+    while (j < src.length && src[j] === ' ') {
+      out += src[j];
+      j += 1;
+    }
+    if (j < src.length && src[j] !== '\x1b') {
+      out += STATUS;
+    }
+    i = j;
+  }
+  return out;
+}
+
+/**
+ * @param {string} text
+ * @param {{ STATUS: string, SUBTLE: string, SUCCESS: string, WARNING: string, ERROR: string }} colors
+ */
+export function remapCanonicalStatuslineTruecolor(text, colors) {
+  const c = STATUSLINE_CANONICAL_TRUECOLOR;
+  const pairs = [
+    [truecolorSgr(...c.statusText), colors.STATUS],
+    [truecolorSgr(...c.subtle), colors.SUBTLE],
+    [truecolorSgr(...c.success), colors.SUCCESS],
+    [truecolorSgr(...c.successBright), colors.SUCCESS],
+    [truecolorSgr(...c.warning), colors.WARNING],
+    [truecolorSgr(...c.warningBright), colors.WARNING],
+    [truecolorSgr(...c.error), colors.ERROR],
+  ];
+  let out = String(text || '');
+  for (const [from, to] of pairs) {
+    if (from && to) out = out.split(from).join(to);
+  }
+  return out;
+}
+
+/**
+ * Normalize vendored/native statusline ANSI for Ink `<Text>` using theme SGR.
+ *
+ * @param {string} text
+ * @param {{ STATUS: string, SUBTLE: string, SUCCESS: string, WARNING: string, ERROR: string }} colors
+ * @param {{ reset?: string }} [opts]
+ */
+export function normalizeStatuslineAnsi(text, colors, { reset = RESET } = {}) {
+  const { STATUS, SUBTLE, SUCCESS, WARNING, ERROR } = colors;
+  let out = remapCanonicalStatuslineTruecolor(text, colors)
+    .replace(/\n+$/, '')
+    .replace(/\x1b\[1m/g, STATUS)
+    .replace(/\x1b\[2m/g, SUBTLE)
+    .replace(/\x1b\[31m/g, ERROR)
+    .replace(/\x1b\[32m/g, SUCCESS)
+    .replace(/\x1b\[33m/g, WARNING)
+    .replace(/\x1b\[36m/g, SUBTLE)
+    .replace(/\x1b\[90m/g, SUBTLE)
+    .replace(/^((?:\x1b\[[0-9;]*m)*)◆((?:\x1b\[[0-9;]*m)*)(\s?)/, `${STATUS}◆$2$3`)
+    .replace(/(\x1b\[0m )(\d+(?:\.\d+)?%)(?= |$)/g, `$1${STATUS}$2${reset}`)
+    .replaceAll(`${reset} ${SUBTLE}│${reset} `, ` ${SUBTLE}│${reset} `);
+  out = applyDefaultStatusForegroundAfterReset(out, STATUS, reset);
+  return out;
+}

package/src/tui/statusline-ansi-bridge.test.mjs

@@ -0,0 +1,159 @@
+import test from 'node:test';
+import assert from 'node:assert/strict';
+import {
+  remapCanonicalStatuslineTruecolor,
+  normalizeStatuslineAnsi,
+  statuslineFooterCacheKey,
+  statuslineFooterIdentityChanged,
+  isResetStatsState,
+  STATUSLINE_CANONICAL_TRUECOLOR,
+} from './statusline-ansi-bridge.mjs';
+import { theme, setThemeSetting } from './theme.mjs';
+
+function sgr38(r, g, b) {
+  return `\x1b[38;2;${r};${g};${b}m`;
+}
+
+function statusColorsFromTheme() {
+  const ansiRgb = (value, fallback) => {
+    const match = /^rgb\((\d+),(\d+),(\d+)\)$/.exec(String(value || '').replace(/\s+/g, ''));
+    if (!match) return fallback;
+    return sgr38(match[1], match[2], match[3]);
+  };
+  return {
+    STATUS: ansiRgb(theme.statusText, sgr38(198, 198, 198)),
+    SUBTLE: ansiRgb(theme.statusSubtle, sgr38(136, 136, 136)),
+    SUCCESS: ansiRgb(theme.success, sgr38(0, 170, 75)),
+    WARNING: ansiRgb(theme.warning, sgr38(255, 193, 7)),
+    ERROR: ansiRgb(theme.error, sgr38(220, 70, 88)),
+  };
+}
+
+test('remaps canonical truecolor sequences from ui/statusline.mjs', () => {
+  const colors = statusColorsFromTheme();
+  const subtle = sgr38(...STATUSLINE_CANONICAL_TRUECOLOR.subtle);
+  const success = sgr38(...STATUSLINE_CANONICAL_TRUECOLOR.success);
+  const raw = `${subtle}│\x1b[0m ${success}42%`;
+  const out = remapCanonicalStatuslineTruecolor(raw, colors);
+  assert.ok(!out.includes('38;2;136;136;136'), 'subtle canonical RGB should be replaced');
+  assert.ok(!out.includes('38;2;0;170;75'), 'success canonical RGB should be replaced');
+  assert.ok(out.includes(colors.SUBTLE));
+  assert.ok(out.includes(colors.SUCCESS));
+});
+
+test('normalizeStatuslineAnsi maps bold and legacy SGR plus truecolor', () => {
+  const colors = statusColorsFromTheme();
+  const raw = `\x1b[1mmodel\x1b[0m \x1b[33m5H\x1b[0m ${sgr38(...STATUSLINE_CANONICAL_TRUECOLOR.error)}quota`;
+  const out = normalizeStatuslineAnsi(raw, colors);
+  assert.ok(out.includes(colors.STATUS));
+  assert.ok(out.includes(colors.WARNING));
+  assert.ok(out.includes(colors.ERROR));
+  assert.ok(!out.includes('\x1b[33m'));
+  assert.ok(!out.includes('38;2;220;70;88'));
+});
+
+test('normalizeStatuslineAnsi preserves leading diamond glyph', () => {
+  const colors = statusColorsFromTheme();
+  const subtle = sgr38(...STATUSLINE_CANONICAL_TRUECOLOR.subtle);
+  const raw = `${subtle}◆\x1b[0m \x1b[1mgpt-4o\x1b[0m`;
+  const out = normalizeStatuslineAnsi(raw, colors);
+  assert.ok(out.includes('◆'), 'visible ◆ must remain');
+  assert.ok(out.includes('gpt-4o'));
+  assert.ok(out.indexOf('◆') < out.indexOf('gpt-4o'));
+});
+
+test('retimes bare values after reset without clobbering explicit segment colors', () => {
+  const colors = statusColorsFromTheme();
+  const subtle = colors.SUBTLE;
+  const success = colors.SUCCESS;
+  const warning = colors.WARNING;
+  const reset = '\x1b[0m';
+  const creditSeg = `${subtle}Credit${reset} $12.34`;
+  const outCredit = normalizeStatuslineAnsi(creditSeg, colors, { reset });
+  assert.ok(outCredit.includes('$12.34'));
+  const moneyIdx = outCredit.indexOf('$12.34');
+  assert.ok(moneyIdx > 0);
+  assert.ok(outCredit.slice(0, moneyIdx).includes(colors.STATUS), 'bare credit amount uses status text');
+
+  const usedLimit = `${subtle}5H${reset} $3.00/$10.00`;
+  const outUsed = normalizeStatuslineAnsi(usedLimit, colors, { reset });
+  assert.ok(outUsed.includes('$3.00/$10.00'));
+  assert.ok(outUsed.slice(0, outUsed.indexOf('$3.00')).includes(colors.STATUS));
+
+  const colored = `${subtle}5H${reset} ${warning}est $5.00${reset}`;
+  const outColored = normalizeStatuslineAnsi(colored, colors, { reset });
+  assert.ok(outColored.includes(warning), 'warning color on value must remain');
+  const estIdx = outColored.indexOf('est');
+  assert.ok(estIdx > 0);
+  assert.ok(outColored.slice(0, estIdx).includes(warning));
+});
+
+test('statuslineFooterCacheKey changes when session or route identity changes', () => {
+  const a = statuslineFooterCacheKey({ sessionId: 's1', provider: 'p', model: 'm1' });
+  const b = statuslineFooterCacheKey({ sessionId: 's2', provider: 'p', model: 'm1' });
+  const c = statuslineFooterCacheKey({ sessionId: 's1', provider: 'p', model: 'm2' });
+  assert.notEqual(a, b);
+  assert.notEqual(a, c);
+});
+
+test('statusline footer identity tracks context display boundary fields', () => {
+  const base = {
+    sessionId: 's1',
+    provider: 'p',
+    model: 'm',
+    contextWindow: 1_000_000,
+    displayContextWindow: 900_000,
+    rawContextWindow: 1_000_000,
+    compactBoundaryTokens: 900_000,
+    autoCompactTokenLimit: 810_000,
+    stats: { currentEstimatedContextTokens: 10_000 },
+  };
+  const changedDisplay = { ...base, displayContextWindow: 800_000 };
+  const changedBoundary = { ...base, compactBoundaryTokens: 800_000 };
+  const changedTrigger = { ...base, autoCompactTokenLimit: 720_000 };
+
+  assert.notEqual(statuslineFooterCacheKey(base), statuslineFooterCacheKey(changedDisplay));
+  assert.notEqual(statuslineFooterCacheKey(base), statuslineFooterCacheKey(changedBoundary));
+  assert.notEqual(statuslineFooterCacheKey(base), statuslineFooterCacheKey(changedTrigger));
+  assert.equal(statuslineFooterIdentityChanged(changedDisplay, base), true);
+  assert.equal(statuslineFooterIdentityChanged(changedBoundary, base), true);
+  assert.equal(statuslineFooterIdentityChanged(changedTrigger, base), true);
+});
+
+test('stats reset transition is footer identity change (cache must not reuse on /theme)', () => {
+  const activeStats = {
+    currentContextTokens: 1200,
+    inputTokens: 800,
+    turns: 2,
+  };
+  const resetStats = {
+    currentContextTokens: 0,
+    currentEstimatedContextTokens: 0,
+    inputTokens: 0,
+    latestInputTokens: 0,
+    promptTokens: 0,
+    turns: 0,
+  };
+  assert.equal(isResetStatsState(resetStats), true);
+  assert.equal(isResetStatsState(activeStats), false);
+  const sameRoute = { sessionId: 's1', provider: 'p', model: 'm', stats: resetStats };
+  const lastRoute = { sessionId: 's1', provider: 'p', model: 'm', stats: activeStats };
+  assert.equal(statuslineFooterCacheKey(sameRoute), statuslineFooterCacheKey(lastRoute));
+  assert.equal(statuslineFooterIdentityChanged(sameRoute, lastRoute), true);
+});
+
+test('theme switch changes normalized output when raw line is canonical', () => {
+  setThemeSetting('mixdog', { persist: false });
+  const colorsA = statusColorsFromTheme();
+  const raw = `${sgr38(...STATUSLINE_CANONICAL_TRUECOLOR.success)}▓▓\x1b[0m ${sgr38(...STATUSLINE_CANONICAL_TRUECOLOR.subtle)}░░`;
+  const tonedA = normalizeStatuslineAnsi(raw, colorsA);
+
+  setThemeSetting('pi-dark', { persist: false });
+  const colorsB = statusColorsFromTheme();
+  const tonedB = normalizeStatuslineAnsi(raw, colorsB);
+
+  assert.notEqual(tonedA, tonedB);
+  assert.ok(tonedB.includes(colorsB.SUCCESS));
+  assert.ok(tonedB.includes(colorsB.SUBTLE));
+  setThemeSetting('mixdog', { persist: false });
+});