@xsft/panels 0.5.0 → 0.5.2

package/README.md

@@ -31,7 +31,7 @@ Run the command in the folder of the product. Each judge starts in that folder,
 
 On a terminal, `panels run` shows the score table, and each judge runs in its interactive harness in a pseudo-terminal inside the command. Each judge writes `judges/N/answer.json` and stays open. The table writes the report when each judge has an answer or an error, and the command exits from `report.json` when you quit. Without a terminal, the judges run in the background (`claude -p`, `codex exec`).
 
-A tab strip on the last two lines shows a tab per view: the scores, then each judge with its number, name, and mark (spinner, score, ✗ for an error, · while queued, ! while the harness asks whether to trust the folder). The strip is the navigation area. With the focus on the strip, `←` and `→` move the active tab and switch the view, `1` to `9` jump to a started judge, `0` to the scores, `enter` gives the focus to the judge, and `q` quits and asks `y` while a judge still runs. With the focus on a judge, each key goes to the judge, and `ctrl-q` gives the focus back to the strip. The scores take no input, so the strip keeps the focus there. A harness that has not seen the folder asks whether to trust it. The first judge starts alone; press `1`, answer, and the other judges start.
+A tab strip on the last three lines shows a hairline, a tab per view, and a status line with the progress, the elapsed time, and the keys. The tabs are the scores, then each judge with its number, name, and mark (score, ✗ for an error, · while queued, ! while the harness asks whether to trust the folder). The label of a running judge glimmers. The strip is the navigation area. With the focus on the strip, `←` and `→` move the active tab and switch the view, `1` to `9` jump to a started judge, `0` to the scores, `enter` gives the focus to the judge, and `q` quits and asks `y` while a judge still runs. With the focus on a judge, each key goes to the judge, and `ctrl-q` gives the focus back to the strip. The scores take no input, so the strip keeps the focus there. A harness that has not seen the folder asks whether to trust it. The first judge starts alone; press `1`, answer, and the other judges start.
 
 ## Run folder
 

package/lib/table.js

@@ -31,9 +31,21 @@ const TABLE_MODES = '\x1b[?1049h\x1b[r\x1b[0m\x1b[4l\x1b[?6l\x1b[?7h\x1b[?1l\x1b
  * trust is true while the harness of a running judge asks whether to trust the folder.
  * final is null until the report exists, then { status, path }. confirm is true while q waits for y.
  */
-const SPIN = ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'];
-// The tab strip takes the last two lines of the terminal: a hairline that opens above the active tab, then the tabs.
-const STRIP_ROWS = 2;
+// The glimmer on the text of a running judge: grey text, and a bright highlight three characters wide that
+// sweeps from left to right one character per frame and wraps.
+const GLIMMER = { base: '\x1b[38;5;244m', mid: '\x1b[38;5;250m', high: '\x1b[38;5;255m' };
+const GLIMMER_ORANGE = { base: ORANGE, mid: '\x1b[38;2;255;170;140m', high: '\x1b[38;5;255m' };
+
+/** text with the glimmer at frame. colours is { base, mid, high }; prefix (such as bold) goes before each piece. */
+export function glimmer(text, frame, colours = GLIMMER, prefix = '') {
+  const centre = frame % text.length;
+  return [...text].map((c, i) => {
+    const d = Math.min(Math.abs(i - centre), text.length - Math.abs(i - centre));
+    return `${prefix}${d === 0 ? colours.high : d === 1 ? colours.mid : colours.base}${c}`;
+  }).join('') + RESET;
+}
+// The tab strip takes the last three lines of the terminal: a hairline, the tabs, then the status and the keys.
+const STRIP_ROWS = 3;
 
 export function render({ title, rows, final, confirm, width, frame = 0 }) {
   const rule = `${GREY}${'─'.repeat(width)}${RESET}`;
@@ -42,10 +54,10 @@ export function render({ title, rows, final, confirm, width, frame = 0 }) {
   for (const r of rows) {
     const head = `${String(r.rank).padStart(3)}  ${r.name.padEnd(pad)}`;
     if (r.state === 'running' && r.trust) lines.push(`${ORANGE}${head}press ${r.rank} and answer the trust prompt${RESET}`);
-    else if (r.state === 'running') lines.push(`${ORANGE}${head}${SPIN[frame % SPIN.length]}${RESET}`);
+    else if (r.state === 'running') lines.push(`${String(r.rank).padStart(3)}  ${glimmer(r.name, frame)}`);
     else if (r.state === 'queued') lines.push(`${head}${GREY}queued${RESET}`);
     else if (r.state === 'error') lines.push(`${head}error`);
-    else lines.push(`${head}${r.result.score} ${GREY}b${r.result.band}${RESET}`);
+    else lines.push(`${head}${r.result.score}/4`);
   }
   lines.push(rule);
   if (final) {
@@ -57,19 +69,19 @@ export function render({ title, rows, final, confirm, width, frame = 0 }) {
 }
 
 /**
- * The two lines of the tab strip: a grey hairline that is open above the active tab, so the active tab joins
- * the content above it, then the tabs. The first tab is the scores; each judge tab reads "N name mark".
- * The mark is the spinner while the judge runs, the score (bold at 4), ✗ for an error, · while queued, or !
- * while the harness asks whether to trust the folder. The names step down to fit the width: the whole name,
- * the first word, or no name. The right end shows the progress, the elapsed time, and the keys of the focus.
- * focus is 'strip' (the active tab is orange, the arrows move it) or 'judge' (the keys go to the judge).
+ * The three lines of the tab strip: a grey hairline, the tabs, then a grey status line with the progress and
+ * the elapsed time at the left and the keys of the focus at the right. The first tab is the scores; each judge
+ * tab reads "N name mark". A running judge has no mark and its label glimmers. The mark is the score (bold at
+ * 4), ✗ for an error, · while queued, or ! while the harness asks whether to trust the folder. The names step
+ * down to fit the width: the whole name, the first word, or no name. focus is 'strip' (the active tab is bold
+ * orange, the arrows move it) or 'judge' (the active tab is bold ink, the keys go to the judge).
  */
 export function renderStrip({ rows, view, final, frame = 0, width, focus = 'strip', elapsed = 0 }) {
   const mark = (r) => {
-    if (r.state === 'running') return r.trust ? '!' : SPIN[frame % SPIN.length];
+    if (r.state === 'running') return r.trust ? '!' : '';
     if (r.state === 'queued') return '·';
     if (r.state === 'error') return '✗';
-    return String(r.result.score);
+    return `${r.result.score}/4`;
   };
   const finished = rows.filter((r) => r.state === 'done' || r.state === 'error').length;
   const clock = `${Math.floor(elapsed / 60)}:${String(elapsed % 60).padStart(2, '0')}`;
@@ -79,34 +91,28 @@ export function renderStrip({ rows, view, final, frame = 0, width, focus = 'stri
     ...rows.map((r) => ({ rank: String(r.rank), name: level === 0 ? r.name : level === 1 ? r.name.split(' ')[0] : '', mark: mark(r) })),
   ];
   const plain = (t) => [t.rank, t.name, t.mark].filter(Boolean).join(' ');
-  const used = (list, right) => 1 + list.reduce((n, t) => n + plain(t).length, 0) + 2 * (list.length - 1) + 2 + right.length + 1;
-  // The names come first: a narrow terminal drops the progress before it shortens the names.
-  const choices = [0, 1, 2].flatMap((level) => [`${finished} of ${rows.length} done · ${clock} · ${keys}`, keys].map((right) => ({ list: tabs(level), right })));
-  const { list, right } = choices.find((c) => used(c.list, c.right) <= width) ?? choices.at(-1);
+  const used = (list) => 1 + list.reduce((n, t) => n + plain(t).length, 0) + 2 * (list.length - 1);
+  const list = [0, 1, 2].map(tabs).find((l) => used(l) <= width) ?? tabs(2);
   let line = ' ';
-  let col = 1;
-  let open = [1, 1];
   list.forEach((t, i) => {
-    if (i) { line += '  '; col += 2; }
+    if (i) line += '  ';
     const active = i === view;
     const base = active ? (focus === 'strip' ? `${ORANGE}${BOLD}` : BOLD) : GREY;
     const text = plain(t);
-    if (active) open = [col, col + text.length];
-    col += text.length;
+    const row = rows[i - 1];
+    if (row?.state === 'running' && !row.trust) {
+      line += glimmer(text, frame, active && focus === 'strip' ? GLIMMER_ORANGE : GLIMMER, active ? BOLD : '');
+      return;
+    }
     const pieces = [];
     if (t.rank) pieces.push(`${base}${t.rank}${RESET}`);
     if (t.name) pieces.push(`${base}${t.name}${RESET}`);
-    if (t.mark) {
-      const row = rows[i - 1];
-      const style = row.state === 'running' && !row.trust ? ORANGE : row.state === 'done' && row.result.score === 4 ? `${base}${BOLD}` : base;
-      pieces.push(`${style}${t.mark}${RESET}`);
-    }
+    if (t.mark) pieces.push(`${row.state === 'done' && row.result.score === 4 ? `${base}${BOLD}` : base}${t.mark}${RESET}`);
     line += pieces.join(' ');
   });
-  const gap = Math.max(2, width - col - right.length - 1);
-  line += `${' '.repeat(gap)}${GREY}${right}${RESET}`;
-  const rule = [...'─'.repeat(width)].map((c, x) => (x >= open[0] && x < open[1] ? ' ' : c)).join('');
-  return [`${GREY}${rule}${RESET}`, line];
+  const progress = `${finished} of ${rows.length} done · ${clock}`;
+  const status = ` ${progress}${' '.repeat(Math.max(2, width - progress.length - keys.length - 2))}${keys}`;
+  return [`${GREY}${'─'.repeat(width)}${RESET}`, line, `${GREY}${status}${RESET}`];
 }
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xsft/panels",
-  "version": "0.5.0",
+  "version": "0.5.2",
   "private": false,
   "description": "Run a panel of AI judges from cross.software/panels against a target.",
   "type": "module",