@kud/gh-ink 0.76.2 → 0.77.0

package/dist/index.d.ts

@@ -467,10 +467,17 @@ type StripItem = {
     key: string;
     state: StripState;
     /**
-     * A second, independent alarm beside the state — a build on fire next to a
-     * service that is serving fine, say. Drawn as its own mark rather than folded
-     * into `state`, because the two answer different questions and a reader
-     * needs to see when they disagree.
+     * Why the state is what it is, as a short word the host chooses: `slow`,
+     * `errors`, `errors · slow`, `alerting`. Drawn after the mark in the mark's
+     * colour. Ignored for `ok`; `unknown` draws `no data` itself.
+     */
+    cause?: string;
+    /**
+     * The thing's latest trunk build is red. Independent of `state` and drawn
+     * as its own `build ✕` beside it rather than folded in, because the two
+     * answer different questions and a reader needs to see when they disagree.
+     * Folding them — a red build downgrading a tick to a warning — was ruled
+     * against on 2026-10-23: it loses which system is broken.
      */
     alarm?: boolean;
     /** Where `o` goes when this item is opened from a rail row. Unused here. */
@@ -480,30 +487,51 @@ type StatusStrip = {
     /** What the row is a strip OF, in the host's words: `services`, say. */
     title: string;
     items: StripItem[];
-    /** When this snapshot was taken (ms). Drawn as an age at the end of the row. */
+    /** When this snapshot was taken (ms). Drawn as an age at the end of row 1. */
     at?: number;
+    /**
+     * Why every item is unknown, when it is one shared reason (`monitoring
+     * unreachable`). Turns row 1 into one sentence instead of one `? no data`
+     * per item — thirteen identical items say less than the sentence does.
+     */
+    note?: string;
 };
 declare const stripGlyph: (state: StripState) => [string, string];
-declare const ageLabel: (at: number | undefined, now?: number) => string;
-/**
- * The strip as plain text, at the width it has to fit. Exported so a test — or a
- * host laying out its own row — can ask the same question the renderer asks.
- *
- * Wide: every item named with its mark, so the row reads as a roll call. Narrow:
- * counts for what is fine, and names ONLY for what is not — the reader of a
- * narrow terminal loses the roll call, never the failures. When even the
- * failures do not fit, the worst few are named and the rest counted, so the
- * row still says "and N more" rather than silently dropping the fourth fire.
- */
-declare const stripLayout: (strip: StatusStrip, width: number, now?: number) => {
-    parts: StripItem[] | null;
-    summary: string;
+/** One run of text in one style — the unit both the budget and the renderer read. */
+type StripSpan = {
+    text: string;
+    color?: string;
+    bold?: boolean;
+    dim?: boolean;
+};
+type StripRows = {
+    /** Row 1 as plain text, without its title or age. */
+    issues: string;
+    /** Row 2 as plain text, without its title. */
+    success: string;
+    /** The age as drawn (`8m ago`), or `""` when it was shed or never stamped. */
     age: string;
+    /** The same rows as styled runs — exactly what the renderer draws. */
+    spans: {
+        issues: StripSpan[];
+        success: StripSpan[];
+    };
+    /** Both titles, padded to one width so the rows' content lines up. */
+    titles: [string, string];
 };
 /**
- * A standing single-line row, the same height across loading / absent / ready
- * so the content below it never jumps — the same contract `CiStatusLine` keeps,
- * and drawn in the same place, because a reader learns one row of glances.
+ * Both rows of the strip at the width they have to fit. Exported so a test —
+ * or a host laying out its own row — can ask the same question the renderer
+ * asks.
+ */
+declare const stripRows: (strip: StatusStrip, width: number, now?: number) => StripRows;
+declare const ageLabel: (at: number | undefined, now?: number) => string;
+/**
+ * A standing two-line row, the same height across loading / absent / ready
+ * — two lines and one margin — so the content below it never jumps: the same
+ * contract `CiStatusLine` keeps, and drawn in the same place, because a reader
+ * learns one row of glances. The host reserves those three rows out of its
+ * own budget; a fourth here would clip the frame from the top.
  */
 declare const StatusStripLine: ({ strip, label, width, now, }: {
     /** `undefined` while the first poll is out; `null` when the host has nothing. */
@@ -961,7 +989,12 @@ type StripStatusState = {
     kind: "ready";
     strip: StatusStrip | null;
 };
-/** What the strip SAYS, ignoring when it said it. */
+/**
+ * What the strip SAYS, ignoring when it said it. Every field the strip draws
+ * is in it — the cause word and the shared note included — or a cause moving
+ * from `slow` to `errors` would bail out of the repaint and leave the old
+ * word on screen.
+ */
 declare const stripSignature: (strip: StatusStrip | null) => string;
 declare const toCiStatusState: (status: CiStatus | null) => CiStatusState;
 declare const sameCiStatusState: (a: CiStatusState, b: CiStatusState) => boolean;
@@ -1137,4 +1170,5 @@ declare const matchesFilter: (repo: string, filter: RepoFilter) => boolean;
  */
 declare const parsePatterns: (value: string) => string[];
 
-export { type Action, type ActionGroup, ActionMenu, App, COLS, type ChromeHints, type ChromeSpec, type ChromeState, CiStatusLine, type CiStatusState, type Command, CommentsPanel, type CommentsPanelProps, DEFAULT_FOCUS_EMPTY, DEFAULT_FOCUS_LABEL, type DetailContext, type ExplainSection, type ExtensionTarget, FOCUS_JUMP_KEY, FOCUS_MARK, type FocusGutter, type FocusSlot, FocusSlotLine, HealthPanel, type HealthPanelProps, type InboxBudget, type InboxExtension, type JiraAvailableTransition, type JiraTransition, type JiraTransitionsFor, type LiveLabel, LookupMiss, MIN_SIDEBAR_COLS, type MenuGap, type MenuRow, PrRow, type PrRowProps, type Rails, type RepoFilter, type RowAnnouncement, type RowMotion, SIDEBAR_COLS, type SettledResult, SidePanel, type Sidebar, type SidebarRow, type StatusStrip, StatusStripLine, type StripItem, type StripState, type StripStatusState, type TabForStatus, type TrailingColumns, type TrailingShed, ageLabel, budgetNotice, buildActions, buildCheckoutCmd, clipboard, counts, drillCmd, explainGhAction, explainItem, fitCount, focusCellFor, focusRefColor, gapsAbove, healthColor, healthDisplay, healthGlyph, healthLegend, isMenuGap, itermRun, jumpToRepo, jumpToRepoPane, matchesFilter, maxViewStart, menuRowsOf, menuTone, moveCursor, numberColumnsOf, openInTab, parsePatterns, railCapacity, railHeights, railRowsOf, railWidth, railsOf, readCache, renderMarkdown, reposInSections, resolveRepoPath, runHere, runInPane, runInPaneHorizontal, sameCiStatusState, sectionShedOf, signatureOf, stripGlyph, stripLayout, stripSignature, toCiStatusState, trailingColumnsOf, truncate, useActionMenu, useChrome, windowCount, withHeaders, withoutItem, workCount, writeCache };
+export { ActionMenu, App, COLS, CiStatusLine, CommentsPanel, DEFAULT_FOCUS_EMPTY, DEFAULT_FOCUS_LABEL, FOCUS_JUMP_KEY, FOCUS_MARK, FocusSlotLine, HealthPanel, LookupMiss, MIN_SIDEBAR_COLS, PrRow, SIDEBAR_COLS, SidePanel, StatusStripLine, ageLabel, budgetNotice, buildActions, buildCheckoutCmd, clipboard, counts, drillCmd, explainGhAction, explainItem, fitCount, focusCellFor, focusRefColor, gapsAbove, healthColor, healthDisplay, healthGlyph, healthLegend, isMenuGap, itermRun, jumpToRepo, jumpToRepoPane, matchesFilter, maxViewStart, menuRowsOf, menuTone, moveCursor, numberColumnsOf, openInTab, parsePatterns, railCapacity, railHeights, railRowsOf, railWidth, railsOf, readCache, renderMarkdown, reposInSections, resolveRepoPath, runHere, runInPane, runInPaneHorizontal, sameCiStatusState, sectionShedOf, signatureOf, stripGlyph, stripRows, stripSignature, toCiStatusState, trailingColumnsOf, truncate, useActionMenu, useChrome, windowCount, withHeaders, withoutItem, workCount, writeCache };
+export type { Action, ActionGroup, ChromeHints, ChromeSpec, ChromeState, CiStatusState, Command, CommentsPanelProps, DetailContext, ExplainSection, ExtensionTarget, FocusGutter, FocusSlot, HealthPanelProps, InboxBudget, InboxExtension, JiraAvailableTransition, JiraTransition, JiraTransitionsFor, LiveLabel, MenuGap, MenuRow, PrRowProps, Rails, RepoFilter, RowAnnouncement, RowMotion, SettledResult, Sidebar, SidebarRow, StatusStrip, StripItem, StripRows, StripSpan, StripState, StripStatusState, TabForStatus, TrailingColumns, TrailingShed };

package/dist/index.js

@@ -1,6 +1,6 @@
-import React5, { createContext, useState, useRef, useContext, useEffect, useCallback, useMemo } from 'react';
+import React2, { createContext, useState, useRef, useContext, useEffect, useCallback, useMemo } from 'react';
 import { useWindowSize, useInput, Text, Box } from 'ink';
-import { colors, ScrollView, TextInput, Pill, getIconMode, FooterHints, useAppKeys, LoadingScreen, pillWidth, StatusMessage, useFilterMode, useListCursor, CommandPalette, Tabs, ProgressBar } from '@kud/ink-ui';
+import { colors, ScrollView, TextInput, Pill, Spinner, getIconMode, FooterHints, useAppKeys, LoadingScreen, pillWidth, StatusMessage, useFilterMode, useListCursor, CommandPalette, Tabs, ProgressBar } from '@kud/ink-ui';
 import { isPassCheck, isFailCheck, isInconclusiveCheck, resolveThread, unresolveThread, replyToThread, rerunFailedRun, mergePr, reRequestReviewer, parseRef, formatRef, fetchItemNode } from '@kud/gh';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { PIN_MARK, sizeOf, sizePartsOf, depthOf, impliedLabels, labelPriority, checkoutDirs, profileOf, inboxConfig, relativeTime, filterBySearch, filterByRepos, filterByOrigin, refCandidates, resolveRef } from '@kud/gh-workflow';
@@ -444,7 +444,7 @@ var Summary = ({
   /* @__PURE__ */ jsx(Text, { children: "  " }),
   /* @__PURE__ */ jsx(Text, { bold: true, children: label.padEnd(10) }),
   /* @__PURE__ */ jsx(Text, { children: icon + "  " }),
-  parts.map(([text, color], i) => /* @__PURE__ */ jsxs(React5.Fragment, { children: [
+  parts.map(([text, color], i) => /* @__PURE__ */ jsxs(React2.Fragment, { children: [
     i > 0 && /* @__PURE__ */ jsx(Text, { dimColor: true, children: " \xB7 " }),
     /* @__PURE__ */ jsx(Text, { color, children: text })
   ] }, text + i))
@@ -930,7 +930,7 @@ var layoutOf = ({
     }
     return `\uF02B ${fitted.join(", ")}`;
   };
-  const widthOf2 = () => {
+  const widthOf3 = () => {
     const block = TRAILING.reduce(
       (w, k) => givingUp[k] || own[k] === 0 ? w : w + 2 + own[k],
       0
@@ -949,11 +949,11 @@ var layoutOf = ({
     () => givingUp.repo = true,
     () => givingUp.age = true
   ]) {
-    if (cols - widthOf2() >= MIN_TITLE) break;
+    if (cols - widthOf3() >= MIN_TITLE) break;
     give();
   }
   const labelLabel = labelCell();
-  const titleMax = Math.max(1, cols - widthOf2());
+  const titleMax = Math.max(1, cols - widthOf3());
   return {
     numStr,
     showAuthor,
@@ -1081,7 +1081,7 @@ var PrRow = ({
         /* @__PURE__ */ jsx(Text3, { color: colors.secondary, children: agePair.activity }),
         /* @__PURE__ */ jsx(Text3, { dimColor: true, children: ` (${agePair.lifetime})` })
       ] }) : ageLabel2 ? /* @__PURE__ */ jsx(Text3, { color: colors.secondary, children: ageLabel2 }) : null }) : null,
-      backdropped ? null : announcements.map((a) => /* @__PURE__ */ jsxs(React5.Fragment, { children: [
+      backdropped ? null : announcements.map((a) => /* @__PURE__ */ jsxs(React2.Fragment, { children: [
         /* @__PURE__ */ jsx(Text3, { children: "  " }),
         /* @__PURE__ */ jsx(Pill, { color: a.color, children: a.label })
       ] }, a.label))
@@ -1100,12 +1100,183 @@ var stripGlyph = (state) => {
       return ["?", colors.muted];
   }
 };
-var ALARM = "\uF06D";
+var OK = stripGlyph("ok")[0];
+var WARN = stripGlyph("warn")[0];
+var FAIL = stripGlyph("fail")[0];
+var SUCCESS_TITLE = "success";
+var ITEM_GAP = "   ";
+var dim = (text) => ({ text, dim: true });
+var widthOf = (spans) => spans.reduce((n, span) => n + span.text.length, 0);
+var textOf = (spans) => spans.map((span) => span.text).join("");
+var joinWith = (groups, sep) => groups.flatMap((group, i) => i === 0 ? group : [sep, ...group]);
 var SEVERITY = {
   fail: 0,
   warn: 1,
-  unknown: 2,
-  ok: 3
+  build: 2,
+  unknown: 3
+};
+var rankOf = (item) => {
+  if (item.state === "ok") return item.alarm ? "build" : null;
+  return item.state;
+};
+var buildSpans = () => [
+  { text: "build ", color: colors.error },
+  { text: FAIL, color: colors.error, bold: true }
+];
+var nameSpans = (item) => [
+  { text: item.key, bold: true },
+  dim(":"),
+  { text: " " }
+];
+var itemSpans = (item) => {
+  const spans = nameSpans(item);
+  switch (item.state) {
+    case "fail":
+      spans.push({ text: FAIL, color: colors.error, bold: true });
+      if (item.cause)
+        spans.push({ text: ` ${item.cause}`, color: colors.error, bold: true });
+      break;
+    case "warn":
+      spans.push({ text: WARN, color: colors.warning, bold: true });
+      if (item.cause)
+        spans.push({ text: ` ${item.cause}`, color: colors.warning });
+      break;
+    case "unknown":
+      spans.push(dim("? no data"));
+      break;
+    case "ok":
+      spans.push({ text: OK, color: colors.success });
+  }
+  if (item.alarm)
+    spans.push({ text: " " }, dim("\xB7"), { text: " " }, ...buildSpans());
+  return spans;
+};
+var countSpans = (rank, n) => {
+  switch (rank) {
+    case "fail":
+      return [{ text: `${FAIL} ${n}`, color: colors.error, bold: true }];
+    case "warn":
+      return [{ text: `${WARN} ${n}`, color: colors.warning, bold: true }];
+    case "build":
+      return [...buildSpans(), { text: ` ${n}`, color: colors.error }];
+    case "unknown":
+      return [dim(`? ${n}`)];
+  }
+};
+var foldedIssues = (bad, folded, failsNamed) => {
+  let fails = 0;
+  const named = [];
+  const rest = [];
+  for (const item of bad) {
+    const rank = rankOf(item);
+    const keep = rank === "fail" ? fails++ < failsNamed : !folded.has(rank);
+    (keep ? named : rest).push(item);
+  }
+  const tallies = [
+    ["fail", rest.filter((i) => i.state === "fail").length],
+    ["warn", rest.filter((i) => i.state === "warn").length],
+    ["build", rest.filter((i) => i.alarm).length],
+    ["unknown", rest.filter((i) => i.state === "unknown").length]
+  ];
+  return joinWith(
+    [
+      ...named.map(itemSpans),
+      ...tallies.filter(([, n]) => n > 0).map(([rank, n]) => countSpans(rank, n))
+    ],
+    { text: ITEM_GAP }
+  );
+};
+var issueCandidates = (strip) => {
+  const { items, note } = strip;
+  if (note !== void 0) {
+    const sentence = dim(`? no data for all ${items.length} \xB7 ${note}`);
+    const builds = items.filter((i) => i.alarm);
+    const named = joinWith(
+      [[sentence], ...builds.map((i) => [...nameSpans(i), ...buildSpans()])],
+      { text: ITEM_GAP }
+    );
+    const counted = joinWith(
+      [
+        [sentence],
+        ...builds.length ? [countSpans("build", builds.length)] : []
+      ],
+      { text: ITEM_GAP }
+    );
+    return [
+      { spans: named, age: true },
+      { spans: counted, age: true },
+      { spans: counted, age: false }
+    ];
+  }
+  const bad = items.filter((i) => rankOf(i) !== null).sort((a, b) => SEVERITY[rankOf(a)] - SEVERITY[rankOf(b)]);
+  if (bad.length === 0) {
+    const calm = items.length > 0 ? [
+      { text: OK, color: colors.success },
+      { text: ` all ${items.length} fine`, bold: true }
+    ] : [dim("? no data")];
+    return [
+      { spans: calm, age: true },
+      { spans: calm, age: false }
+    ];
+  }
+  const fails = bad.filter((i) => i.state === "fail").length;
+  const levels = [
+    [],
+    ["unknown"],
+    ["unknown", "build"],
+    ["unknown", "build", "warn"]
+  ];
+  const everything = new Set(levels[levels.length - 1]);
+  const candidates = levels.map((level) => ({
+    spans: foldedIssues(bad, new Set(level), fails),
+    age: true
+  }));
+  for (let named = fails; named >= 0; named--)
+    candidates.push({ spans: foldedIssues(bad, everything, named), age: false });
+  return candidates;
+};
+var successSpans = (strip, budget) => {
+  const fine = strip.items.filter((i) => rankOf(i) === null);
+  if (fine.length === 0)
+    return [
+      dim(
+        strip.items.every((i) => i.state === "unknown") ? "nothing measured" : "none"
+      )
+    ];
+  const tick = { text: OK, color: colors.success };
+  const full = [
+    tick,
+    { text: " " },
+    ...joinWith(
+      fine.map((i) => [{ text: i.key, bold: true }]),
+      dim(" \xB7 ")
+    )
+  ];
+  if (widthOf(full) <= budget) return full;
+  return [tick, { text: ` ${fine.length} ${strip.title}` }];
+};
+var stripRows = (strip, width, now = Date.now()) => {
+  const titleWidth = Math.max(strip.title.length, SUCCESS_TITLE.length);
+  const titles = [
+    `  ${strip.title.padEnd(titleWidth)}  `,
+    `  ${SUCCESS_TITLE.padEnd(titleWidth)}  `
+  ];
+  const label = ageLabel(strip.at, now);
+  const ageText = label ? `${label} ago` : "";
+  const ageWidth = ageText ? 3 + ageText.length : 0;
+  const budget = width - titles[0].length;
+  const candidates = issueCandidates(strip);
+  const chosen = candidates.find(
+    (c) => widthOf(c.spans) + (c.age ? ageWidth : 0) <= budget
+  ) ?? candidates[candidates.length - 1];
+  const success = successSpans(strip, budget);
+  return {
+    issues: textOf(chosen.spans),
+    success: textOf(success),
+    age: chosen.age ? ageText : "",
+    spans: { issues: chosen.spans, success },
+    titles
+  };
 };
 var ageLabel = (at, now = Date.now()) => {
   if (at === void 0) return "";
@@ -1115,38 +1286,7 @@ var ageLabel = (at, now = Date.now()) => {
   if (m < 60) return `${m}m`;
   return `${Math.round(m / 60)}h`;
 };
-var itemText = (item) => item.state === "fail" ? `${stripGlyph("fail")[0]} ${item.key}` : `${stripGlyph(item.state)[0]}${item.alarm ? ` ${ALARM}` : ""} ${item.key}`;
-var itemWidth = (item) => item.state === "fail" ? pillWidth(itemText(item)) : itemText(item).length;
-var stripLayout = (strip, width, now = Date.now()) => {
-  const age = ageLabel(strip.at, now);
-  const fixed = 2 + strip.title.length + 2 + (age ? age.length + 3 : 0);
-  const full = strip.items.map(itemText).join("  ");
-  const fullWidth = strip.items.reduce((n, item) => n + itemWidth(item), 0) + Math.max(0, strip.items.length - 1) * 2;
-  if (fixed + fullWidth <= width)
-    return { parts: strip.items, summary: full, age };
-  const sorted = [...strip.items].sort(
-    (a, b) => SEVERITY[a.state] - SEVERITY[b.state]
-  );
-  const bad = sorted.filter((i) => i.state !== "ok" || i.alarm);
-  const ok = strip.items.length - bad.length;
-  const tally = (n, s) => n > 0 ? `${n} ${stripGlyph(s)[0]}` : "";
-  let named = [];
-  let text = "";
-  for (let n = bad.length; n >= 0; n--) {
-    named = bad.slice(0, n);
-    const rest = bad.slice(n);
-    const counts2 = ["fail", "warn", "unknown"].map((s) => tally(rest.filter((i) => i.state === s).length, s)).filter(Boolean);
-    text = [tally(ok, "ok"), ...counts2, ...named.map(itemText)].filter(Boolean).join(" \xB7 ");
-    const textWidth = text.length + 2 * named.filter((i) => i.state === "fail").length;
-    if (fixed + textWidth <= width) break;
-  }
-  return { parts: null, summary: text, age };
-};
-var nameStyle = (item) => {
-  if (item.alarm) return { color: colors.error, bold: true };
-  if (item.state === "unknown") return { dimColor: true };
-  return {};
-};
+var Spans = ({ spans }) => /* @__PURE__ */ jsx(Fragment, { children: spans.map((span, i) => /* @__PURE__ */ jsx(Text, { color: span.color, bold: span.bold, dimColor: span.dim, children: span.text }, i)) });
 var StatusStripLine = ({
   strip,
   label = "status",
@@ -1154,45 +1294,30 @@ var StatusStripLine = ({
   now
 }) => {
   if (strip === void 0)
-    return /* @__PURE__ */ jsxs(Box, { marginBottom: 1, children: [
-      /* @__PURE__ */ jsx(Text, { dimColor: true, children: "  \xB7 " }),
-      /* @__PURE__ */ jsx(Text, { dimColor: true, children: `${label}  loading\u2026` })
+    return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [
+      /* @__PURE__ */ jsxs(Box, { children: [
+        /* @__PURE__ */ jsx(Text, { children: "  " }),
+        /* @__PURE__ */ jsx(Spinner, {}),
+        /* @__PURE__ */ jsx(Text, { dimColor: true, children: ` ${label}  loading\u2026` })
+      ] }),
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  \xB7 ${SUCCESS_TITLE}` })
     ] });
   if (strip === null)
-    return /* @__PURE__ */ jsxs(Box, { marginBottom: 1, children: [
-      /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  ${stripGlyph("unknown")[0]} ` }),
-      /* @__PURE__ */ jsx(Text, { dimColor: true, children: `${label}  no signal / not configured` })
+    return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  ${stripGlyph("unknown")[0]} ${label}  no signal / not configured` }),
+      /* @__PURE__ */ jsx(Text, { children: " " })
     ] });
-  const { parts, summary, age } = stripLayout(strip, width, now);
-  return /* @__PURE__ */ jsxs(Box, { marginBottom: 1, children: [
-    /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  ${strip.title}  ` }),
-    parts ? parts.map((item, i) => {
-      if (item.state === "fail")
-        return /* @__PURE__ */ jsxs(React5.Fragment, { children: [
-          i > 0 ? /* @__PURE__ */ jsx(Text, { children: "  " }) : null,
-          /* @__PURE__ */ jsx(Pill, { variant: "error", tone: "solid", children: itemText(item) })
-        ] }, item.key);
-      const [glyph, color] = stripGlyph(item.state);
-      const asking = item.state === "warn";
-      return /* @__PURE__ */ jsxs(React5.Fragment, { children: [
-        i > 0 ? /* @__PURE__ */ jsx(Text, { children: "  " }) : null,
-        /* @__PURE__ */ jsx(
-          Text,
-          {
-            color: item.state === "unknown" ? void 0 : color,
-            dimColor: item.state === "unknown",
-            bold: asking,
-            children: glyph
-          }
-        ),
-        item.alarm ? /* @__PURE__ */ jsx(Text, { color: colors.error, bold: true, children: ` ${ALARM}` }) : null,
-        /* @__PURE__ */ jsxs(Text, { ...nameStyle(item), children: [
-          " ",
-          item.key
-        ] })
-      ] }, item.key);
-    }) : /* @__PURE__ */ jsx(Text, { children: summary }),
-    age ? /* @__PURE__ */ jsx(Text, { dimColor: true, children: `   ${age}` }) : null
+  const { spans, age, titles } = stripRows(strip, width, now);
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [
+    /* @__PURE__ */ jsxs(Box, { children: [
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: titles[0] }),
+      /* @__PURE__ */ jsx(Spans, { spans: spans.issues }),
+      age ? /* @__PURE__ */ jsx(Text, { dimColor: true, children: `   ${age}` }) : null
+    ] }),
+    /* @__PURE__ */ jsxs(Box, { children: [
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: titles[1] }),
+      /* @__PURE__ */ jsx(Spans, { spans: spans.success })
+    ] })
   ] });
 };
 var SEARCH_GLYPH_NERD = "\uF422";
@@ -2885,7 +3010,12 @@ var InboxHeader = ({
     /* @__PURE__ */ jsx(Text3, { color: colors.info, dimColor: true, children: "\u254C".repeat(fill) })
   ] });
 };
-var stripSignature = (strip) => strip === null ? "\u2205" : strip.items.map((i) => `${i.key}=${i.state}${i.alarm ? "\u25B2" : ""}`).join(",");
+var stripSignature = (strip) => strip === null ? "\u2205" : [
+  strip.note ?? "",
+  ...strip.items.map(
+    (i) => `${i.key}=${i.state}:${i.cause ?? ""}${i.alarm ? ":build" : ""}`
+  )
+].join(",");
 var toCiStatusState = (status) => status ? { kind: "ready", status } : { kind: "error" };
 var sameCiStatusState = (a, b) => {
   if (a.kind !== b.kind) return false;
@@ -3123,10 +3253,7 @@ var ItemRow = ({
       icon,
       motion,
       announcements,
-      focusCell: focusCellFor(
-        focus,
-        "url" in item ? item.url : void 0
-      )
+      focusCell: focusCellFor(focus, "url" in item ? item.url : void 0)
     }
   );
 };
@@ -3287,11 +3414,11 @@ var TURN_LEGEND = [
 var CELL_GUTTER = 2;
 var COL_GAP = 3;
 var cellWidthOf = (col) => Math.max(0, ...col.rows.map((r) => r.cell.length)) + CELL_GUTTER;
-var widthOf = (col) => Math.max(
+var widthOf2 = (col) => Math.max(
   col.title.length,
   ...col.rows.map((r) => cellWidthOf(col) + r.label.length)
 );
-var groupWidth = (group) => Math.max(0, ...group.map(widthOf));
+var groupWidth = (group) => Math.max(0, ...group.map(widthOf2));
 var layoutWidth = (groups) => groups.reduce((total, g) => total + groupWidth(g), 0) + COL_GAP * Math.max(0, groups.length - 1);
 var legendLayout = (cols, available) => {
   const across = cols.map((c) => [c]);
@@ -3362,9 +3489,7 @@ var HelpModal = ({
     ["p", "open repo in new pane"],
     ["u", "unsubscribe from this item"],
     ["x", "remove yourself as reviewer"],
-    ...hasJira ? [
-      ["t", "Jira: move / open ticket"]
-    ] : [],
+    ...hasJira ? [["t", "Jira: move / open ticket"]] : [],
     ["\u2303K", "launch \xB7 open a ticket or PR by name"],
     ["/", "search"],
     ["f", "filter by repo"],
@@ -3630,7 +3755,7 @@ var BrowseScreen = ({
     5,
     // -10 rather than -8: the extra 2 are the frame's top and bottom border
     // rows, so the tree never grows taller than the terminal inside the frame.
-    rows - 10 - (filterActive ? 2 : 0) - (reserveCiRow ? 2 : 0) - (reserveStripRow ? 2 : 0) - (reserveFocusRow ? 2 : 0)
+    rows - 10 - (filterActive ? 2 : 0) - (reserveCiRow ? 2 : 0) - (reserveStripRow ? 3 : 0) - (reserveFocusRow ? 2 : 0)
   );
   useEffect(() => {
     setLocalSections(applyWork(sections));
@@ -4330,7 +4455,13 @@ var BrowseScreen = ({
     headerHint,
     ["?", "help"],
     ["q", "quit"]
-  ] : activeItem?.kind === "subgroup-header" ? [["\u2191\u2193", "nav"], ["\u2190\u2192", "tab"], headerHint, ["?", "help"], ["q", "quit"]] : [
+  ] : activeItem?.kind === "subgroup-header" ? [
+    ["\u2191\u2193", "nav"],
+    ["\u2190\u2192", "tab"],
+    headerHint,
+    ["?", "help"],
+    ["q", "quit"]
+  ] : [
     ["\u2191\u2193", "nav"],
     ["\u2190\u2192", "tab"],
     ["\u21B5/d", "open"],
@@ -4923,10 +5054,13 @@ var App = ({
     const running = [...heldSince].filter(([tab]) => held.has(tab));
     if (running.length === 0) return;
     const remaining = (at) => at + TRANSIT_HOLD_MS - Date.now();
-    const timer = setTimeout(() => {
-      for (const [tab, at] of running)
-        if (remaining(at) <= 0) settleTab(tab, transients);
-    }, Math.max(0, Math.min(...running.map(([, at]) => remaining(at)))));
+    const timer = setTimeout(
+      () => {
+        for (const [tab, at] of running)
+          if (remaining(at) <= 0) settleTab(tab, transients);
+      },
+      Math.max(0, Math.min(...running.map(([, at]) => remaining(at))))
+    );
     return () => clearTimeout(timer);
   }, [transients, heldSince, state.phase]);
   const pendingSummary = useMemo(
@@ -5254,7 +5388,7 @@ var App = ({
               flexDirection: "column",
               minHeight: Math.max(
                 5,
-                rows - 5 - (hasCiStatus ? 2 : 0) - (hasStrip ? 2 : 0) - (hasFocusSlot ? 2 : 0)
+                rows - 5 - (hasCiStatus ? 2 : 0) - (hasStrip ? 3 : 0) - (hasFocusSlot ? 2 : 0)
               ),
               children: state.phase === "loading" ? /* @__PURE__ */ jsx(LoadingScreen, { label: `Fetching ${title}\u2026` }) : /* @__PURE__ */ jsx(
                 NoRowsScreen,
@@ -5414,4 +5548,4 @@ var matchesFilter = (repo, filter) => {
 };
 var parsePatterns = (value) => value.split(",").map((p) => p.trim()).filter(Boolean);
 
-export { ActionMenu, App, COLS, CiStatusLine, CommentsPanel, DEFAULT_FOCUS_EMPTY, DEFAULT_FOCUS_LABEL, FOCUS_JUMP_KEY, FOCUS_MARK, FocusSlotLine, HealthPanel, LookupMiss, MIN_SIDEBAR_COLS, PrRow, SIDEBAR_COLS, SidePanel, StatusStripLine, ageLabel, budgetNotice, buildActions, buildCheckoutCmd, clipboard, counts, drillCmd, explainGhAction, explainItem, fitCount, focusCellFor, focusRefColor, gapsAbove, healthColor, healthDisplay, healthGlyph, healthLegend, isMenuGap, itermRun, jumpToRepo, jumpToRepoPane, matchesFilter, maxViewStart, menuRowsOf, menuTone, moveCursor, numberColumnsOf, openInTab, parsePatterns, railCapacity, railHeights, railRowsOf, railWidth, railsOf, readCache, renderMarkdown, reposInSections, resolveRepoPath, runHere, runInPane, runInPaneHorizontal, sameCiStatusState, sectionShedOf, signatureOf, stripGlyph, stripLayout, stripSignature, toCiStatusState, trailingColumnsOf, truncate, useActionMenu, useChrome, windowCount, withHeaders, withoutItem, workCount, writeCache };
+export { ActionMenu, App, COLS, CiStatusLine, CommentsPanel, DEFAULT_FOCUS_EMPTY, DEFAULT_FOCUS_LABEL, FOCUS_JUMP_KEY, FOCUS_MARK, FocusSlotLine, HealthPanel, LookupMiss, MIN_SIDEBAR_COLS, PrRow, SIDEBAR_COLS, SidePanel, StatusStripLine, ageLabel, budgetNotice, buildActions, buildCheckoutCmd, clipboard, counts, drillCmd, explainGhAction, explainItem, fitCount, focusCellFor, focusRefColor, gapsAbove, healthColor, healthDisplay, healthGlyph, healthLegend, isMenuGap, itermRun, jumpToRepo, jumpToRepoPane, matchesFilter, maxViewStart, menuRowsOf, menuTone, moveCursor, numberColumnsOf, openInTab, parsePatterns, railCapacity, railHeights, railRowsOf, railWidth, railsOf, readCache, renderMarkdown, reposInSections, resolveRepoPath, runHere, runInPane, runInPaneHorizontal, sameCiStatusState, sectionShedOf, signatureOf, stripGlyph, stripRows, stripSignature, toCiStatusState, trailingColumnsOf, truncate, useActionMenu, useChrome, windowCount, withHeaders, withoutItem, workCount, writeCache };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kud/gh-ink",
-  "version": "0.76.2",
+  "version": "0.77.0",
   "description": "Ink components for rendering GitHub PR review comments and health — controlled, presentation-only, built on @kud/ink-ui and fed by @kud/gh.",
   "type": "module",
   "main": "dist/index.js",
@@ -15,7 +15,7 @@
     "dist"
   ],
   "engines": {
-    "node": ">=20"
+    "node": ">=22"
   },
   "scripts": {
     "build": "tsup",
@@ -49,19 +49,19 @@
     "react": ">=19"
   },
   "dependencies": {
-    "@kud/gh": "0.21.0",
-    "@kud/gh-workflow": "0.17.0",
+    "@kud/gh": "0.21.1",
+    "@kud/gh-workflow": "0.17.1",
     "zx": "8.8.5"
   },
   "devDependencies": {
     "@kud/ink-ui": "0.41.0",
-    "@types/node": "22.20.1",
-    "@types/react": "19.2.17",
-    "ink": "7.1.0",
+    "@types/node": "26.6.5",
+    "@types/react": "19.3.0",
+    "ink": "8.0.0",
     "ink-testing-library": "4.0.0",
-    "react": "19.2.7",
-    "tsup": "8.5.1",
+    "react": "19.3.1",
+    "tsup": "9.0.0",
     "typescript": "5.9.3",
-    "vitest": "4.1.10"
+    "vitest": "5.0.5"
   }
 }