jestronaut 0.2.0 → 0.3.16

package/lib/ui/components/Progress.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { Box, Text } from 'ink';
+
+export function buildProgressData(stats, width = 80) {
+  const total    = stats.suites || 1;
+  const done     = stats.suitesCompleted || 0;
+  const barWidth = Math.max(10, width - 20);
+  const filled   = Math.min(barWidth, Math.round((done / total) * barWidth));
+  const empty    = barWidth - filled;
+  const pct      = Math.round((done / total) * 100);
+  const color    = stats.failed > 0 ? 'red' : done === total ? 'green' : 'cyan';
+  const bar      = '#'.repeat(filled) + '-'.repeat(empty);
+  return { total, done, barWidth, filled, empty, pct, color, bar };
+}
+
+export function Progress({ stats, width }) {
+  const { pct, color, bar, done, total } = buildProgressData(stats, width);
+
+  return React.createElement(
+    Box,
+    { height: 2, backgroundColor: '#111133', alignItems: 'center', paddingLeft: 2, gap: 1 },
+    React.createElement(Text, { color: 'white' }, `Suites ${done}/${total}`),
+    React.createElement(Text, { color },          `[${bar}]`),
+    React.createElement(Text, { color },          `${pct}%`)
+  );
+}

package/lib/ui/components/ResultsList.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { ScrollableList } from './ScrollableList.js';
+
+export function buildItems(resultItems) {
+  return resultItems.map(item => {
+    let text = `[${item.icon}] `;
+    if (item.ancestor) text += `${item.ancestor} > `;
+    text += item.title;
+    if (item.duration != null) text += ` (${item.duration}ms)`;
+    if (item.isFailed) text += ' [Enter]';
+    return { text, color: item.titleColor };
+  });
+}
+
+export function ResultsList({ state, height }) {
+  const { resultItems, resultCursor, focus } = state;
+  const focused = focus === 'results';
+  return React.createElement(ScrollableList, {
+    items: buildItems(resultItems),
+    selectedIndex: resultCursor,
+    height,
+    width: '100%',
+    borderColor: focused ? 'cyan' : 'gray',
+    focused,
+  });
+}

package/lib/ui/components/ScrollableBox.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { Box, Text } from 'ink';
+
+export function ScrollableBox({ lines, scrollOffset, height, width, borderColor }) {
+  const innerHeight = Math.max(1, (height || 10) - 2);
+  const offset = Math.max(0, Math.min(scrollOffset || 0, Math.max(0, lines.length - innerHeight)));
+  const visible = lines.slice(offset, offset + innerHeight);
+
+  return React.createElement(
+    Box,
+    { flexDirection: 'column', borderStyle: 'single', borderColor: borderColor || 'red', width: width || '100%', height: height || 10 },
+    visible.map((line, i) =>
+      React.createElement(
+        Box,
+        { key: offset + i, paddingLeft: 2 },
+        React.createElement(Text, { color: line.color, wrap: 'truncate' }, line.text || '')
+      )
+    )
+  );
+}

package/lib/ui/components/ScrollableList.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import { Box, Text } from 'ink';
+
+export function computeScrollOffset(selectedIndex, visibleHeight, totalItems) {
+  if (totalItems === 0 || visibleHeight <= 0) return 0;
+  const maxOffset = Math.max(0, totalItems - visibleHeight);
+  const offset = Math.max(0, selectedIndex - Math.floor(visibleHeight / 2));
+  return Math.min(offset, maxOffset);
+}
+
+export function ScrollableList({ items, selectedIndex, height, width, borderColor, focused }) {
+  const innerHeight = Math.max(1, (height || 10) - 2);
+  const scrollOffset = computeScrollOffset(selectedIndex, innerHeight, items.length);
+  const visible = items.slice(scrollOffset, scrollOffset + innerHeight);
+
+  return React.createElement(
+    Box,
+    { flexDirection: 'column', borderStyle: 'single', borderColor: borderColor || 'white', width: width || '100%', height: height || 10 },
+    visible.map((item, i) => {
+      const absIndex = scrollOffset + i;
+      const isSelected = absIndex === selectedIndex && focused;
+      const bg = item.bg || (isSelected ? '#2a2a6a' : undefined);
+      return React.createElement(
+        Box,
+        { key: absIndex, paddingLeft: 1, paddingRight: 1, width: '100%', backgroundColor: bg },
+        React.createElement(Text, { color: item.color, backgroundColor: bg, wrap: 'truncate' }, item.text || '')
+      );
+    })
+  );
+}

package/lib/ui/components/Stats.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { Box, Text } from 'ink';
+
+export function Stats({ stats }) {
+  return React.createElement(
+    Box,
+    { height: 2, backgroundColor: '#111133', justifyContent: 'center', alignItems: 'center', gap: 4 },
+    React.createElement(Text, { color: 'green', bold: true }, `PASSED: ${stats.passed}`),
+    React.createElement(Text, { color: 'red',   bold: true }, `FAILED: ${stats.failed}`),
+    React.createElement(Text, { color: 'yellow',bold: true }, `SKIPPED: ${stats.skipped}`),
+    React.createElement(Text, { color: 'white'           }, `TOTAL: ${stats.total}`)
+  );
+}

package/lib/ui/components/SuiteDetailOverlay.js

@@ -0,0 +1,111 @@
+import React from 'react';
+import { Box } from 'ink';
+import { ScrollableList } from './ScrollableList.js';
+
+export function buildSuiteDetailItems(suiteData, path) {
+  const s = suiteData;
+  const name = path.split('/').pop().replace(/\.test\.[jt]sx?$/, '');
+  const totalTests = (s.tests || []).length;
+  const duration = s.endTime && s.startTime
+    ? ((s.endTime - s.startTime) / 1000).toFixed(2) + 's'
+    : 'running...';
+  const status = !s.done ? 'RUNNING' : s.failed > 0 ? 'FAILED' : 'PASSED';
+  const statusColor = !s.done ? 'yellow' : s.failed > 0 ? 'red' : 'green';
+  const passRate = totalTests > 0 ? Math.round((s.passed / totalTests) * 100) : 0;
+
+  const items = [];
+  const add = (text, color = 'white', type = 'other', failureObj = null) =>
+    items.push({ text, color, type, failureObj });
+
+  add(`Suite: ${name}  [${status}]`, statusColor);
+  add('');
+  add(`File     :  ${path}`, 'yellow');
+  add(`Duration :  ${duration}`, 'white');
+  add(`Pass rate:  ${passRate}%`, statusColor);
+  add(`Tests    :  ${totalTests} total  ${s.passed} passed  ${s.failed} failed`, 'white');
+  add(`Slowest  :  ${_slowest(s.tests || [])}`, 'white');
+  add(`Fastest  :  ${_fastest(s.tests || [])}`, 'white');
+  add('');
+  add(`── Test Results (${totalTests}) ──────────────────────────────`, 'cyan');
+  add('');
+
+  const tests = s.tests || [];
+  if (tests.length === 0) {
+    add('  (no results yet)', 'gray');
+  } else {
+    for (const t of tests) {
+      const dur = t.duration != null ? t.duration + 'ms' : '?';
+      if (t.status === 'passed') {
+        add(`  PASS  ${t.title}  (${dur})`, 'green', 'test', null);
+      } else if (t.status === 'failed') {
+        add(
+          `  FAIL  ${t.title}  (${dur})  [Enter]`,
+          'red', 'test',
+          { title: t.title, suiteName: name, messages: t.messages || [], duration: t.duration }
+        );
+      } else {
+        add(`  SKIP  ${t.title}`, 'yellow', 'test', null);
+      }
+    }
+  }
+
+  add('');
+  add('  [j/k] navigate failed   [Enter] open failure   [Esc] back', 'gray');
+
+  return {
+    items,
+    name,
+    hasFailed: s.failed > 0,
+    label: ` Suite: ${name}  [${s.passed}p ${s.failed}f] `,
+  };
+}
+
+export function moveCursor(state, dir) {
+  const items = state.suiteDetailItems;
+  if (!items.length) return;
+  const failIndices = items.map((m, i) => (m.type === 'test' && m.failureObj) ? i : -1).filter(i => i >= 0);
+  if (!failIndices.length) return;
+  const pos = failIndices.indexOf(state.suiteDetailCursor);
+  if (dir > 0) {
+    state.suiteDetailCursor = pos < failIndices.length - 1 ? failIndices[pos + 1] : failIndices[0];
+  } else {
+    state.suiteDetailCursor = pos > 0 ? failIndices[pos - 1] : failIndices[failIndices.length - 1];
+  }
+}
+
+function _slowest(tests) {
+  const t = tests.filter(t => t.duration != null).sort((a, b) => b.duration - a.duration)[0];
+  return t ? `${t.title} (${t.duration}ms)` : 'N/A';
+}
+
+function _fastest(tests) {
+  const t = tests.filter(t => t.duration != null).sort((a, b) => a.duration - b.duration)[0];
+  return t ? `${t.title} (${t.duration}ms)` : 'N/A';
+}
+
+export function SuiteDetailOverlay({ state, rows }) {
+  const { suiteDetailItems, suiteDetailCursor, suiteDetailPath } = state;
+  const hasFailed = suiteDetailItems.some(i => i.type === 'test' && i.failureObj);
+
+  const listItems = suiteDetailItems.map((item, i) => {
+    const isSelected = i === suiteDetailCursor && item.type === 'test' && item.failureObj;
+    return {
+      text: isSelected ? `> ${item.text.trimStart()}` : `  ${item.text}`,
+      color: item.color,
+      bg: isSelected ? '#5a0a0a' : undefined,
+    };
+  });
+
+  return React.createElement(
+    Box,
+    { flexDirection: 'column', height: rows || 30 },
+    React.createElement(ScrollableList, {
+      items: listItems,
+      selectedIndex: suiteDetailCursor,
+      height: rows || 30,
+      width: '100%',
+      borderColor: hasFailed ? 'red' : 'green',
+      focused: true,
+    })
+  );
+}

package/lib/ui/components/SuitesList.js

@@ -0,0 +1,37 @@
+import React from 'react';
+import { SPINNER } from '../../constants.js';
+import { ScrollableList } from './ScrollableList.js';
+
+function buildItems(state) {
+  const { suiteOrder, suites, focus, suiteCursor, suiteDetailOpen, testDetailOpen, spinFrame } = state;
+  const spin = SPINNER[spinFrame % SPINNER.length];
+
+  if (suiteOrder.length === 0) return [{ text: 'waiting...' }];
+
+  return suiteOrder.map((path, i) => {
+    const s = suites[path];
+    const name = path.split('/').pop().replace(/\.test\.[jt]sx?$/, '');
+    const elapsed = s.startTime ? ` ${((Date.now() - s.startTime) / 1000).toFixed(1)}s` : '';
+    const prefix = s.done ? (s.failed > 0 ? 'FAIL' : 'PASS') : spin;
+    const counts = ` [${s.passed}p ${s.failed}f]`;
+    const isCursor = focus === 'suites' && !suiteDetailOpen && !testDetailOpen && i === suiteCursor;
+    const hint = isCursor ? ' [Enter]' : '';
+    const running = s.running && s.running.size > 0 ? ' > ' + [...s.running].join(', ') : '';
+    return {
+      text: `${prefix} ${name}${s.done ? counts : elapsed + counts}${hint}${running}`,
+      color: s.done ? (s.failed > 0 ? 'red' : 'green') : 'yellow',
+    };
+  });
+}
+
+export function SuitesList({ state, height }) {
+  const focused = state.focus === 'suites';
+  return React.createElement(ScrollableList, {
+    items: buildItems(state),
+    selectedIndex: state.suiteCursor,
+    height,
+    width: '100%',
+    borderColor: focused ? 'white' : 'magenta',
+    focused,
+  });
+}

package/lib/ui/components/TestDetailOverlay.js

@@ -0,0 +1,75 @@
+import React from 'react';
+import { Box } from 'ink';
+import { ScrollableBox } from './ScrollableBox.js';
+
+export function buildLines(failure, stats) {
+  const rawMsg = (failure.messages || []).join('\n');
+  const expectedMatch = rawMsg.match(/Expected[:\s]+(.+)/);
+  const receivedMatch = rawMsg.match(/Received[:\s]+(.+)/);
+  const stackLines = rawMsg.split('\n').filter(l => l.trim().startsWith('at ')).map(l => l.trim());
+
+  const lines = [
+    { text: `FAILED: ${failure.suiteName} > ${failure.title}`, color: 'red' },
+    { text: '' },
+    { text: `Suite   :  ${failure.suiteName}`, color: 'yellow' },
+    { text: `Test    :  ${failure.title}`,     color: 'yellow' },
+    { text: `Duration:  ${failure.duration != null ? failure.duration + 'ms' : 'N/A'}`, color: 'yellow' },
+    { text: '' },
+    { text: '── Error Message ──────────────────────────────────────────', color: 'cyan' },
+    { text: '' },
+  ];
+
+  if (expectedMatch) lines.push({ text: `  Expected:  ${expectedMatch[1].trim()}`, color: 'green' });
+  if (receivedMatch) lines.push({ text: `  Received:  ${receivedMatch[1].trim()}`, color: 'red' });
+
+  lines.push({ text: '' });
+  rawMsg.split('\n').slice(0, 15).forEach(l =>
+    lines.push({ text: `  ${l.replace(/\{/g, '(').replace(/\}/g, ')')}`, color: 'white' })
+  );
+
+  lines.push(
+    { text: '' },
+    { text: '── Stack Trace ─────────────────────────────────────────────', color: 'cyan' },
+    { text: '' }
+  );
+
+  if (stackLines.length > 0) {
+    const firstUser = stackLines.findIndex(l => !l.includes('node_modules'));
+    stackLines.forEach((l, i) =>
+      lines.push({ text: `  ${i === firstUser ? '> ' : '  '}${l}`, color: i === firstUser ? 'yellow' : 'gray' })
+    );
+  } else {
+    lines.push({ text: '  (no stack trace)', color: 'gray' });
+  }
+
+  lines.push(
+    { text: '' },
+    { text: '── Run Metrics ─────────────────────────────────────────────', color: 'cyan' },
+    { text: '' },
+    { text: `  Passed  :  ${stats.passed}`,  color: 'green' },
+    { text: `  Failed  :  ${stats.failed}`,  color: 'red' },
+    { text: `  Skipped :  ${stats.skipped}`, color: 'yellow' },
+    { text: `  Elapsed :  ${(((stats.endTime || Date.now()) - stats.startTime) / 1000).toFixed(1)}s`, color: 'white' },
+    { text: '' },
+    { text: '  [Esc] back   [j/k] scroll', color: 'gray' }
+  );
+
+  return lines;
+}
+
+export function TestDetailOverlay({ state, rows }) {
+  const { testDetailFailure, testDetailScrollOffset, stats } = state;
+  if (!testDetailFailure) return null;
+  const lines = buildLines(testDetailFailure, stats);
+  return React.createElement(
+    Box,
+    { flexDirection: 'column', height: rows || 30 },
+    React.createElement(ScrollableBox, {
+      lines,
+      scrollOffset: testDetailScrollOffset,
+      height: rows || 30,
+      width: '100%',
+      borderColor: 'red',
+    })
+  );
+}

package/lib/ui/store.js

@@ -0,0 +1,18 @@
+import { EventEmitter } from 'events';
+import { createState, resetState } from '../state.js';
+
+export class JestronautStore extends EventEmitter {
+  constructor() {
+    super();
+    this.state = createState();
+  }
+
+  reset() {
+    resetState(this.state);
+    this.notify();
+  }
+
+  notify() {
+    this.emit('update', this.state);
+  }
+}

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "jestronaut",
-  "version": "0.2.0",
+  "version": "0.3.16",
   "description": "An interactive terminal dashboard UI for Jest — navigate live test results, suites, and failure details without leaving your terminal",
+  "type": "module",
   "main": "index.js",
   "bin": {
     "jestronaut": "./bin/jestronaut.js"
@@ -12,18 +13,20 @@
     "dashboard",
     "tui",
     "terminal",
-    "blessed",
+    "ink",
+    "react",
     "jestronaut"
   ],
   "license": "MIT",
   "engines": {
-    "node": ">=16"
+    "node": ">=18"
   },
   "dependencies": {
-    "blessed": "^0.1.81"
+    "ink": "^5.2.1"
   },
   "peerDependencies": {
-    "jest": ">=27"
+    "jest": ">=27",
+    "react": "^18.3.1"
   },
   "author": "Deep Nandi",
   "repository": {

package/lib/ui/keys.js

@@ -1,140 +0,0 @@
-'use strict';
-
-const suiteDetailOverlay = require('./overlays/suiteDetail');
-const { openTestDetail } = require('./overlays/testDetail');
-
-function bindKeys(screen, widgets, state, render) {
-  screen.key(['q', 'C-c'], () => {
-    render.destroy();
-    process.exit(0);
-  });
-
-  screen.key(['tab'], () => {
-    if (state.suiteDetailOpen || state.testDetailOpen) return;
-    state.focus = state.focus === 'results' ? 'suites' : 'results';
-    render.all();
-  });
-
-  screen.key(['up', 'k'], () => {
-    if (state.testDetailOpen) {
-      widgets.testDetail.scroll(-1); screen.render(); return;
-    }
-    if (state.suiteDetailOpen) {
-      suiteDetailOverlay.moveCursor(state, -1);
-      suiteDetailOverlay.refreshSuiteDetail(widgets.suiteDetail, state);
-      screen.render(); return;
-    }
-    if (state.focus === 'results') {
-      if (state.resultLines.length === 0) return;
-      state.resultCursor = state.resultCursor <= 0
-        ? state.resultLines.length - 1
-        : state.resultCursor - 1;
-    } else {
-      if (state.suiteOrder.length === 0) return;
-      state.suiteCursor = state.suiteCursor <= 0
-        ? state.suiteOrder.length - 1
-        : state.suiteCursor - 1;
-    }
-    render.all();
-  });
-
-  screen.key(['down', 'j'], () => {
-    if (state.testDetailOpen) {
-      widgets.testDetail.scroll(1); screen.render(); return;
-    }
-    if (state.suiteDetailOpen) {
-      suiteDetailOverlay.moveCursor(state, 1);
-      suiteDetailOverlay.refreshSuiteDetail(widgets.suiteDetail, state);
-      screen.render(); return;
-    }
-    if (state.focus === 'results') {
-      if (state.resultLines.length === 0) return;
-      state.resultCursor = state.resultCursor >= state.resultLines.length - 1
-        ? 0
-        : state.resultCursor + 1;
-    } else {
-      if (state.suiteOrder.length === 0) return;
-      state.suiteCursor = state.suiteCursor >= state.suiteOrder.length - 1
-        ? 0
-        : state.suiteCursor + 1;
-    }
-    render.all();
-  });
-
-  screen.key(['enter'], () => {
-    if (state.testDetailOpen) return;
-
-    if (state.suiteDetailOpen) {
-      const meta = state.suiteDetailMeta[state.suiteDetailCursor];
-      if (meta && meta.type === 'test' && meta.failureObj) {
-        state.testDetailOpen = true;
-        openTestDetail(widgets.testDetail, meta.failureObj, state.stats);
-        screen.render();
-      }
-      return;
-    }
-
-    if (state.focus === 'results') {
-      if (state.resultCursor < 0 || state.resultCursor >= state.resultMeta.length) return;
-      const meta = state.resultMeta[state.resultCursor];
-      if (meta.status !== 'failed') return;
-      state.testDetailOpen = true;
-      openTestDetail(widgets.testDetail, state.failures[meta.failureIndex], state.stats);
-      screen.render();
-    } else {
-      if (state.suiteOrder.length === 0) return;
-      const path = state.suiteOrder[state.suiteCursor];
-      if (!path) return;
-      _openSuiteDetail(widgets, state, path);
-      screen.render();
-    }
-  });
-
-  screen.key(['escape'], () => {
-    if (state.testDetailOpen) {
-      state.testDetailOpen = false;
-      widgets.testDetail.hide();
-      screen.render();
-      return;
-    }
-    if (state.suiteDetailOpen) {
-      state.suiteDetailOpen = false;
-      state.suiteDetailPath = null;
-      state.suiteDetailLines = [];
-      state.suiteDetailMeta = [];
-      widgets.suiteDetail.hide();
-      screen.render();
-    }
-  });
-}
-
-function _openSuiteDetail(widgets, state, path) {
-  const result = suiteDetailOverlay.buildSuiteDetailLines(state.suites[path], path);
-  state.suiteDetailOpen = true;
-  state.suiteDetailPath = path;
-  state.suiteDetailLines = result.lines;
-  state.suiteDetailMeta = result.meta;
-  state.suiteDetailCursor = result.meta.findIndex(m => m.type === 'test' && m.failureObj);
-  if (state.suiteDetailCursor < 0) state.suiteDetailCursor = 0;
-  widgets.suiteDetail.setLabel(result.label);
-  widgets.suiteDetail.style.border.fg = result.hasFailed ? 'red' : 'green';
-  widgets.suiteDetail.show();
-  widgets.suiteDetail.setFront();
-  suiteDetailOverlay.refreshSuiteDetail(widgets.suiteDetail, state);
-}
-
-// Called when a suite receives new results while suite detail is open
-function refreshOpenSuiteDetail(widgets, state) {
-  if (!state.suiteDetailOpen || !state.suiteDetailPath) return;
-  const result = suiteDetailOverlay.buildSuiteDetailLines(
-    state.suites[state.suiteDetailPath],
-    state.suiteDetailPath
-  );
-  state.suiteDetailLines = result.lines;
-  state.suiteDetailMeta = result.meta;
-  widgets.suiteDetail.setLabel(result.label);
-  widgets.suiteDetail.style.border.fg = result.hasFailed ? 'red' : 'green';
-  suiteDetailOverlay.refreshSuiteDetail(widgets.suiteDetail, state);
-}
-
-module.exports = { bindKeys, refreshOpenSuiteDetail };

package/lib/ui/overlays/suiteDetail.js

@@ -1,123 +0,0 @@
-'use strict';
-
-const blessed = require('blessed');
-
-function createSuiteDetail(screen) {
-  const widget = blessed.list({
-    top: '3%', left: '3%', width: '94%', height: '94%',
-    label: ' Suite Detail ',
-    border: { type: 'line' },
-    tags: true, scrollable: true, alwaysScroll: true,
-    keys: false, mouse: false,
-    scrollbar: { ch: '|', style: { fg: 'magenta' } },
-    style: {
-      border: { fg: 'magenta' }, label: { fg: 'magenta', bold: true },
-      bg: '#08080a', item: { fg: 'white', bg: '#08080a' },
-    },
-    padding: { left: 2, right: 2, top: 1, bottom: 1 },
-    hidden: true,
-  });
-  screen.append(widget);
-  return widget;
-}
-
-function buildSuiteDetailLines(suiteData, path) {
-  const s = suiteData;
-  const name = path.split('/').pop().replace(/\.test\.[jt]sx?$/, '');
-  const totalTests = (s.tests || []).length;
-  const duration = s.endTime && s.startTime
-    ? ((s.endTime - s.startTime) / 1000).toFixed(2) + 's'
-    : 'running...';
-  const status = !s.done ? 'RUNNING' : s.failed > 0 ? 'FAILED' : 'PASSED';
-  const statusColor = !s.done ? 'yellow' : s.failed > 0 ? 'red' : 'green';
-  const passRate = totalTests > 0 ? Math.round((s.passed / totalTests) * 100) : 0;
-
-  const lines = [];
-  const meta = [];
-
-  const add = (text, m = { type: 'other' }) => { lines.push(text); meta.push(m); };
-
-  add(`{${statusColor}-fg}{bold}Suite: ${name}  [${status}]{/bold}{/${statusColor}-fg}`);
-  add('');
-  add(`{yellow-fg}File     :{/yellow-fg}  {grey-fg}${path}{/grey-fg}`);
-  add(`{yellow-fg}Duration :{/yellow-fg}  ${duration}`);
-  add(`{yellow-fg}Pass rate:{/yellow-fg}  {${statusColor}-fg}${passRate}%{/${statusColor}-fg}`);
-  add(`{yellow-fg}Tests    :{/yellow-fg}  ${totalTests} total  {green-fg}${s.passed} passed{/green-fg}  {red-fg}${s.failed} failed{/red-fg}`);
-  add(`{yellow-fg}Slowest  :{/yellow-fg}  ${_slowest(s.tests || [])}`);
-  add(`{yellow-fg}Fastest  :{/yellow-fg}  ${_fastest(s.tests || [])}`);
-  add('');
-  add(`{cyan-fg}── Test Results (${totalTests}) ─────────────────────────────────────────────{/cyan-fg}`);
-  add('');
-
-  const tests = s.tests || [];
-  if (tests.length === 0) {
-    add('  {grey-fg}(no results yet){/grey-fg}');
-  } else {
-    tests.forEach(t => {
-      if (t.status === 'passed') {
-        add(
-          `  {green-fg}PASS{/green-fg}  {white-fg}${t.title}{/white-fg}  {grey-fg}(${t.duration != null ? t.duration + 'ms' : '?'}){/grey-fg}`,
-          { type: 'test', failureObj: null }
-        );
-      } else if (t.status === 'failed') {
-        add(
-          `  {red-fg}FAIL{/red-fg}  {red-fg}${t.title}{/red-fg}  {grey-fg}(${t.duration != null ? t.duration + 'ms' : '?'}){/grey-fg}  {cyan-fg}[Enter]{/cyan-fg}`,
-          {
-            type: 'test',
-            failureObj: { title: t.title, suiteName: name, messages: t.messages || [], duration: t.duration },
-          }
-        );
-      } else {
-        add(
-          `  {yellow-fg}SKIP{/yellow-fg}  {grey-fg}${t.title}{/grey-fg}`,
-          { type: 'test', failureObj: null }
-        );
-      }
-    });
-  }
-
-  add('');
-  add('{grey-fg}  [j/k] navigate failed tests   [Enter] open failure   [Esc] back{/grey-fg}');
-
-  return { lines, meta, name, hasFailed: s.failed > 0, label: ` Suite: ${name}  [${s.passed}p ${s.failed}f] ` };
-}
-
-function refreshSuiteDetail(widget, state) {
-  const items = state.suiteDetailLines.map((line, i) => {
-    const m = state.suiteDetailMeta[i];
-    const isFailed = m && m.type === 'test' && m.failureObj;
-    if (i === state.suiteDetailCursor && isFailed) {
-      return `{#3a0a0a-bg}> ${line.trimStart()}{/#3a0a0a-bg}`;
-    }
-    return line;
-  });
-  widget.setItems(items);
-  widget.scrollTo(state.suiteDetailCursor);
-}
-
-function moveCursor(state, dir) {
-  const meta = state.suiteDetailMeta;
-  if (meta.length === 0) return;
-  const failIndices = meta
-    .map((m, i) => (m.type === 'test' && m.failureObj) ? i : -1)
-    .filter(i => i >= 0);
-  if (failIndices.length === 0) return;
-  const pos = failIndices.indexOf(state.suiteDetailCursor);
-  if (dir > 0) {
-    state.suiteDetailCursor = pos < failIndices.length - 1 ? failIndices[pos + 1] : failIndices[0];
-  } else {
-    state.suiteDetailCursor = pos > 0 ? failIndices[pos - 1] : failIndices[failIndices.length - 1];
-  }
-}
-
-function _slowest(tests) {
-  const t = tests.filter(t => t.duration != null).sort((a, b) => b.duration - a.duration)[0];
-  return t ? `{white-fg}${t.title}{/white-fg} {grey-fg}(${t.duration}ms){/grey-fg}` : 'N/A';
-}
-
-function _fastest(tests) {
-  const t = tests.filter(t => t.duration != null).sort((a, b) => a.duration - b.duration)[0];
-  return t ? `{white-fg}${t.title}{/white-fg} {grey-fg}(${t.duration}ms){/grey-fg}` : 'N/A';
-}
-
-module.exports = { createSuiteDetail, buildSuiteDetailLines, refreshSuiteDetail, moveCursor };