@kud/gh-ink 0.66.1 → 0.68.0

package/README.md

@@ -32,6 +32,35 @@ the same panel drops into a full-screen CLI or a single pane of a dashboard. The
 core (`@kud/gh`) decides the semantic token; this layer maps it to a colour. Same
 seam as `@kud/jenkins` → `@kud/jenkins-ink`.
 
+## Inbox extensions
+
+A host contributes verbs and screens to the inbox through `InboxExtension`:
+
+| Field       | What                                                                                                        |
+| ----------- | ----------------------------------------------------------------------------------------------------------- |
+| `key`       | The keypress that opens it, matched after the inbox's own bindings, so an extension never shadows them.     |
+| `scope`     | `"item"` acts on the selected row and earns a place in its action menu; `"global"` does not.                |
+| `menuGroup` | `"act"` (does something to the row) or `"open"` (opens something); absent or `"other"` joins the quiet end. |
+| `hint`      | Short footer label. The action menu capitalises it for the row ("submit" → "Submit"); the legend keeps `title`. |
+| `icon`      | Nerd-font glyph for the menu row, as a `"\uF4FA"` escape. Shown only in nerd icon mode (see below).         |
+| `body`      | `(onExit, target) => ReactNode` — rendered inside the inbox frame; claims header/footer via `useChrome`.    |
+
+Nerd-font icons render only when the host calls `setIconMode("nerd")` from
+`@kud/ink-ui` before the first render. In the default text mode the menu's icon
+column is dropped entirely — no stand-in, nothing to align — so a terminal
+without a Nerd Font loses nothing but decoration. The built-ins use these
+codepoints; sibling host verbs should match them rather than invent neighbours:
+
+| Verb                          | Codepoint |
+| ----------------------------- | --------- |
+| Submit / Resubmit              | U+F4FA / U+F46A |
+| Land                           | U+F419    |
+| Open PR / in browser / ticket  | U+F440 / U+F465 / U+F41B |
+| Switch here / tab / pane       | U+EBCB / U+EAE4 / U+EB56 |
+| Copy URL / repo / branch       | U+F44C / U+F401 / U+F418 |
+| Unsubscribe / Mute / Remove reviewer | U+F478 / U+F466 / U+F468 |
+| Close PR / and delete / issue  | U+F4DC / U+F48E / U+F41D |
+
 ## Development
 
 ```sh

package/dist/index.d.ts

@@ -417,6 +417,25 @@ declare const healthLegend: [Health, string][];
  */
 declare const truncate: (str: string, max: number) => string;
 
+type ChromeHints = [string, string][];
+type ChromeSpec = {
+    scope?: string;
+    hints?: ChromeHints;
+};
+type ChromeState = ChromeSpec & {
+    setChrome: (spec: ChromeSpec) => void;
+};
+/**
+ * Claim a word in the inbox chrome while mounted: `scope` becomes the header
+ * breadcrumb (e.g. `Resubmit · acme/api-gateway#1234`), `hints` the footer's
+ * verbs. The shell appends its own back/quit tail, so a body passes only its
+ * own keys — never `esc`, `q` or `?`.
+ *
+ * Returns whether a shell claimed it: a view mounted outside the inbox (where
+ * the context is null) draws its own chrome instead, so the same component
+ * renders framed standalone and chromeless inside the shell.
+ */
+declare const useChrome: (spec: ChromeSpec) => boolean;
 type ExtensionTarget = {
     item?: AnyItem;
     ciJob?: string;
@@ -438,6 +457,8 @@ interface InboxExtension {
     key: string;
     hint?: string;
     scope?: "item" | "global";
+    menuGroup?: "act" | "open" | "other";
+    icon?: string;
     drills?: AnyItem["kind"][];
     body: (onExit: () => void, target?: ExtensionTarget) => ReactNode;
     commands?: (target: ExtensionTarget) => Command[];
@@ -525,12 +546,20 @@ type SettledResult = {
     ok: false;
     reason: string;
 };
+type ActionGroup = "act" | "open" | "switch" | "copy" | "quiet" | "close" | "confirm";
 type Action = {
     label: string;
     hint: string;
     run: () => void;
     subActions?: Action[];
+    group?: ActionGroup;
+    icon?: string;
 };
+type MenuGap = {
+    gap: true;
+};
+type MenuRow = Action | MenuGap;
+declare const isMenuGap: (row: MenuRow) => row is MenuGap;
 type JiraTransition = {
     /** What the action menu shows. Yours to word; nothing matches on it. */
     label: string;
@@ -701,8 +730,16 @@ declare const CiStatusLine: ({ state, job, }: {
     state: CiStatusState;
     job?: string;
 }) => React.JSX.Element;
+declare const menuRowsOf: (actions: Action[]) => MenuRow[];
+/**
+ * What tone a menu row wears: `"error"` for the close rows (top-level and
+ * confirm alike, never `Cancel`), nothing for everything else. The menu's one
+ * meaningful colour, and the only one — every other distinction on the menu
+ * is glyph, word or weight, never hue alone.
+ */
+declare const menuTone: (row: Action) => "error" | undefined;
 declare const useActionMenu: () => {
-    actions: Action[] | null;
+    actions: MenuRow[] | null;
     cursor: number;
     open: (next: Action[]) => void;
     close: () => void;
@@ -713,10 +750,17 @@ declare const useActionMenu: () => {
         escape?: boolean;
     }) => boolean;
 };
-declare const ActionMenu: ({ item, actions, cursor, }: {
+declare const ActionMenu: ({ item, actions, cursor, cols, }: {
     item: AnyItem;
-    actions: Action[];
+    actions: MenuRow[];
     cursor: number;
+    /**
+     * Content columns the menu may take. The width is fixed from the longest
+     * row — clamp(longest + 4, 40, 56), capped at `cols - 4` — so it never
+     * resizes as the cursor moves. A host beside a rail passes what the list
+     * has; everywhere else the frame's own width is the right answer.
+     */
+    cols?: number;
 }) => React.JSX.Element;
 declare const signatureOf: (sections: Section[]) => string;
 declare const App: ({ fetcher, cacheKey, title, detailFor, origin, jiraBase, jiraKeyRe, jiraSetupHint, jiraTransitions, hasCiStatus, ciJob, ciFetcher, ciPollMs, stripFetcher, stripLabel, stripPollMs, watchPath, watchDebounceMs, watchJitterMs, extensions, tabHelp, emptyHint, liveLabel, onSettled, }: {
@@ -827,4 +871,4 @@ declare const matchesFilter: (repo: string, filter: RepoFilter) => boolean;
  */
 declare const parsePatterns: (value: string) => string[];
 
-export { type Action, ActionMenu, App, COLS, CiStatusLine, type CiStatusState, type Command, CommentsPanel, type CommentsPanelProps, type DetailContext, type ExplainSection, type ExtensionTarget, HealthPanel, type HealthPanelProps, type InboxBudget, type InboxExtension, type JiraTransition, type LiveLabel, MIN_SIDEBAR_COLS, 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 TrailingColumns, type TrailingShed, ageLabel, budgetNotice, buildActions, buildCheckoutCmd, clipboard, counts, drillCmd, explainGhAction, explainItem, fitCount, gapsAbove, healthColor, healthDisplay, healthGlyph, healthLegend, itermRun, jumpToRepo, jumpToRepoPane, matchesFilter, maxViewStart, 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, windowCount, withHeaders, withoutItem, workCount, writeCache };
+export { type Action, type ActionGroup, ActionMenu, App, COLS, type ChromeHints, type ChromeSpec, type ChromeState, CiStatusLine, type CiStatusState, type Command, CommentsPanel, type CommentsPanelProps, type DetailContext, type ExplainSection, type ExtensionTarget, HealthPanel, type HealthPanelProps, type InboxBudget, type InboxExtension, type JiraTransition, type LiveLabel, 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 TrailingColumns, type TrailingShed, ageLabel, budgetNotice, buildActions, buildCheckoutCmd, clipboard, counts, drillCmd, explainGhAction, explainItem, fitCount, 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 };

package/dist/index.js

@@ -1,6 +1,6 @@
-import React2, { createContext, useState, useRef, useEffect, useMemo, useContext } 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, useAppKeys, LoadingScreen, StatusMessage, FooterHints, useFilterMode, useListCursor, CommandPalette, Tabs, ProgressBar, pillWidth } from '@kud/ink-ui';
+import { colors, ScrollView, TextInput, Pill, getIconMode, FooterHints, useAppKeys, LoadingScreen, StatusMessage, useFilterMode, useListCursor, CommandPalette, Tabs, ProgressBar, pillWidth } from '@kud/ink-ui';
 import { isPassCheck, isFailCheck, isInconclusiveCheck, resolveThread, unresolveThread, replyToThread, rerunFailedRun, mergePr, reRequestReviewer } 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 } from '@kud/gh-workflow';
@@ -1161,6 +1161,29 @@ var StatusStripLine = ({
     age ? /* @__PURE__ */ jsx(Text, { dimColor: true, children: `   ${age}` }) : null
   ] });
 };
+var SEARCH_GLYPH_NERD = "\uF422";
+var searchGlyph = (nerd) => nerd ? SEARCH_GLYPH_NERD : "/";
+var searchBarState = ({
+  typing,
+  nerd
+}) => ({
+  glyph: searchGlyph(nerd),
+  glyphColor: typing ? colors.info : colors.muted,
+  caret: typing,
+  hints: typing ? "\u2191\u2193 move \xB7 \u21B5 keep \xB7 esc clear" : "filtered \xB7 keys active \xB7 esc clear"
+});
+var InboxChromeContext = createContext(null);
+var useChrome = (spec) => {
+  const chrome = useContext(InboxChromeContext);
+  const setChrome = chrome?.setChrome;
+  const scope = spec.scope;
+  const hintsKey = JSON.stringify(spec.hints ?? null);
+  useEffect(() => {
+    if (!setChrome) return;
+    setChrome({ scope, hints: spec.hints });
+  }, [setChrome, scope, hintsKey]);
+  return chrome !== null;
+};
 
 // src/inbox/cache.ts
 var cacheTtlMs = () => inboxConfig().cacheTtlMs;
@@ -1412,6 +1435,7 @@ var reconcile = (prev, fresh, now, holdMs = HOLD_MS) => {
   return out;
 };
 var quietly = $({ quiet: true });
+var isMenuGap = (row) => "gap" in row;
 var healthSentence = (item) => {
   const glyph = displayFor(item.health).glyph.trim();
   const d = item.detail;
@@ -1898,6 +1922,14 @@ var drillLabel = (item) => {
   if (item.kind === "pr") return "Open PR";
   return "Drill in";
 };
+var sameChrome = (a, b) => {
+  if (a.scope !== b.scope) return false;
+  if (a.hints === b.hints) return true;
+  if (!a.hints || !b.hints || a.hints.length !== b.hints.length) return false;
+  return a.hints.every(
+    ([key, label], i) => b.hints[i]?.[0] === key && b.hints[i]?.[1] === label
+  );
+};
 var UNSUBSCRIBE_MUTATION = `
   mutation($id: ID!) {
     updateSubscription(input: { subscribableId: $id, state: UNSUBSCRIBED }) {
@@ -1948,6 +1980,8 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
   const open = {
     label: "Open in browser",
     hint: "o",
+    group: "open",
+    icon: "\uF465",
     run: () => {
       quietly`open ${item.url}`.catch(() => {
       });
@@ -1957,6 +1991,8 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
   const copyUrl = {
     label: "Copy URL",
     hint: "c",
+    group: "copy",
+    icon: "\uF44C",
     run: () => {
       clipboard(item.url);
       const label = item.kind === "task" ? item.key : `#${item.number}`;
@@ -1968,6 +2004,11 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
   const drillAction = drill || mountable && onOpenView ? {
     label: drillLabel(item),
     hint: "d",
+    group: "open",
+    // Only the PR drill names its glyph: "View issue" and "View ticket"
+    // have no nerd-font verb of their own, and an icon that says nothing
+    // the label does not already say is decoration, not information.
+    icon: item.kind === "pr" ? "\uF440" : void 0,
     run: () => {
       if (onOpenView?.(item)) return;
       if (drill) {
@@ -1983,6 +2024,10 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
       base.push({
         label: "Move status",
         hint: "t",
+        // The task's act: changing its state, the one mutation this menu owns.
+        // Guarded by the caller's own condition above — without configured
+        // transitions there is no such row, and none is invented here.
+        group: "act",
         run: () => {
         },
         subActions: jiraTransitions.map(
@@ -2016,22 +2061,40 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
         )
       });
     }
-    return base;
+    return byGroup(base);
   }
   const actions = drillAction ? [drillAction, open, copyUrl] : [open, copyUrl];
   const closing = [];
   actions.push({
     label: "Copy repo name",
     hint: "r",
+    group: "copy",
+    icon: "\uF401",
     run: () => {
       clipboard(item.repo);
       showFlash(`\u2713 Copied ${item.repo}`);
     }
   });
+  actions.push({
+    label: "Unsubscribe",
+    hint: "u",
+    group: "quiet",
+    icon: "\uF478",
+    run: () => {
+      showFlash(`\u22EF Unsubscribing from #${item.number}\u2026`);
+      void unsubscribeFrom(item).then(() => showFlash(`\u2713 Unsubscribed from #${item.number}`)).catch((e) => showFlash(`\u2717 #${item.number}: ${explainGhAction(e)}`));
+    }
+  });
   if (item.kind === "pr" && item.standing === "queued" && login) {
     actions.push({
       label: "Remove me as reviewer",
       hint: "x",
+      // Quiet, beside Unsubscribe: both are "less of this PR for me" — no more
+      // review requests, no more notifications. Guarded by the caller's own
+      // condition above, like "Move status" is by its: without a standing
+      // review request there is no such row, and none is invented here.
+      group: "quiet",
+      icon: "\uF468",
       run: () => {
         onRemove?.(item);
         showFlash(`\u22EF Removing you from #${item.number}\u2026`);
@@ -2053,18 +2116,12 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
       }
     });
   }
-  actions.push({
-    label: "Unsubscribe",
-    hint: "u",
-    run: () => {
-      showFlash(`\u22EF Unsubscribing from #${item.number}\u2026`);
-      void unsubscribeFrom(item).then(() => showFlash(`\u2713 Unsubscribed from #${item.number}`)).catch((e) => showFlash(`\u2717 #${item.number}: ${explainGhAction(e)}`));
-    }
-  });
   if (item.kind === "pr" && item.branch) {
     actions.push({
       label: "Copy branch name",
       hint: "b",
+      group: "copy",
+      icon: "\uF418",
       run: () => {
         clipboard(item.branch);
         showFlash(`\u2713 Copied ${item.branch}`);
@@ -2075,6 +2132,8 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
     actions.push({
       label: "Switch here",
       hint: "s",
+      group: "switch",
+      icon: "\uEBCB",
       run: () => {
         const script = [
           "delay 0.5",
@@ -2095,16 +2154,20 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
   }
   if (item.kind === "issue") {
     actions.push({
-      label: "Open project in new tab",
+      label: "Open in new tab",
       hint: "j",
+      group: "switch",
+      icon: "\uEAE4",
       run: () => {
         showFlash(`\u22EF Opening ${item.repo}\u2026`);
         void jumpToRepo(item.repo, "", login).then(() => showFlash(`\u2197 Opened ${item.repo} in new tab`)).catch(() => showFlash("\u2717 Jump failed"));
       }
     });
     actions.push({
-      label: "Open project in new pane",
+      label: "Open in new pane",
       hint: "p",
+      group: "switch",
+      icon: "\uEB56",
       run: () => {
         showFlash(`\u22EF Opening pane for ${item.repo}\u2026`);
         void jumpToRepoPane(item.repo, "", login).then(() => showFlash(`\u2197 Opened ${item.repo} in new pane`)).catch(() => showFlash("\u2717 Pane failed"));
@@ -2113,12 +2176,15 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
     actions.push({
       label: "Close issue",
       hint: "",
+      group: "close",
+      icon: "\uF41D",
       run: () => {
       },
       subActions: [
         {
           label: `Close #${item.number}`,
           hint: "",
+          group: "confirm",
           run: () => {
             onRemove?.(item);
             showFlash(`\u2713 Closed #${item.number}`);
@@ -2137,7 +2203,7 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
             );
           }
         },
-        { label: "Cancel", hint: "", run: () => {
+        { label: "Cancel", hint: "", group: "confirm", run: () => {
         } }
       ]
     });
@@ -2146,6 +2212,8 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
     actions.push({
       label: "Switch in new tab",
       hint: "j",
+      group: "switch",
+      icon: "\uEAE4",
       run: () => {
         showFlash(`\u22EF Jumping to ${item.repo}\u2026`);
         void jumpToRepo(item.repo, item.branch ?? "", login).then(() => showFlash(`\u2197 Opened ${item.repo} in new tab`)).catch(() => showFlash("\u2717 Jump failed"));
@@ -2154,6 +2222,8 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
     actions.push({
       label: "Switch in new pane",
       hint: "p",
+      group: "switch",
+      icon: "\uEB56",
       run: () => {
         showFlash(`\u22EF Opening pane for ${item.repo}\u2026`);
         void jumpToRepoPane(item.repo, item.branch ?? "", login).then(() => showFlash(`\u2197 Opened ${item.repo} in new pane`)).catch(() => showFlash("\u2717 Pane failed"));
@@ -2165,6 +2235,7 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
         actions.push({
           label: `Open ${jiraKey} in Jira`,
           hint: "t",
+          group: "open",
           run: () => openInJira(jiraBase, jiraKey, showFlash)
         });
       }
@@ -2172,12 +2243,15 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
     closing.push({
       label: "Close PR",
       hint: "",
+      group: "close",
+      icon: "\uF4DC",
       run: () => {
       },
       subActions: [
         {
           label: `Close #${item.number}`,
           hint: "",
+          group: "confirm",
           run: () => {
             onRemove?.(item);
             showFlash(`\u2713 Closed #${item.number}`);
@@ -2196,20 +2270,25 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
             );
           }
         },
-        { label: "Cancel", hint: "", run: () => {
+        { label: "Cancel", hint: "", group: "confirm", run: () => {
         } }
       ]
     });
     if (item.branch) {
       closing.push({
-        label: "Close PR + Delete branch",
+        // "and", not "+": the row is a sentence like every other, and the key
+        // column carries the hint — symbols are not shortcuts here.
+        label: "Close PR and delete branch",
         hint: "",
+        group: "close",
+        icon: "\uF48E",
         run: () => {
         },
         subActions: [
           {
-            label: `Close #${item.number} + delete ${item.branch}`,
+            label: `Close #${item.number} and delete ${item.branch}`,
             hint: "",
+            group: "confirm",
             run: () => {
               onRemove?.(item);
               showFlash(`\u2713 Closed #${item.number} and deleted ${item.branch}`);
@@ -2221,16 +2300,20 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
               });
             }
           },
-          { label: "Cancel", hint: "", run: () => {
+          { label: "Cancel", hint: "", group: "confirm", run: () => {
           } }
         ]
       });
     }
   }
+  const extensionLabel = (e) => e.hint ? e.hint.charAt(0).toUpperCase() + e.hint.slice(1) : e.title;
+  const extensionGroup = (e) => e.menuGroup === "act" ? "act" : e.menuGroup === "open" ? "open" : "quiet";
   for (const e of itemExtensions(ext?.extensions))
     actions.push({
-      label: e.title,
+      label: extensionLabel(e),
       hint: e.key,
+      group: extensionGroup(e),
+      icon: e.icon,
       run: () => ext?.onOpenExt?.(e.id, {
         item,
         login,
@@ -2239,7 +2322,7 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
       })
     });
   actions.push(...closing);
-  return actions;
+  return byGroup(actions);
 };
 var agoText = (ms) => {
   const d = (Date.now() - ms) / 1e3;
@@ -2526,26 +2609,60 @@ var ItemRow = ({
     }
   );
 };
+var GROUP_RANK = {
+  act: 0,
+  open: 1,
+  switch: 2,
+  copy: 3,
+  quiet: 4,
+  close: 5,
+  confirm: 6
+};
+var groupRank = (action) => action.group === void 0 ? 7 : GROUP_RANK[action.group];
+var menuRowsOf = (actions) => {
+  const sorted = byGroup(actions);
+  const rows = [];
+  sorted.forEach((action, i) => {
+    if (i > 0 && sorted[i - 1].group !== action.group) rows.push({ gap: true });
+    rows.push(action);
+  });
+  return rows;
+};
+var byGroup = (actions) => [...actions].sort((a, b) => groupRank(a) - groupRank(b));
+var isConfirmRows = (rows) => rows.length > 0 && rows.every((row) => isMenuGap(row) || row.group === "confirm");
+var menuTone = (row) => row.group === "close" || row.group === "confirm" && row.label !== "Cancel" ? "error" : void 0;
 var useActionMenu = () => {
   const [actions, setActions] = useState(null);
   const [cursor, setCursor] = useState(0);
   const open = (next) => {
     if (next.length === 0) return;
     setCursor(0);
-    setActions(next);
+    setActions(menuRowsOf(next));
   };
   const handleKey = (key) => {
     if (!actions) return false;
-    if (key.upArrow) setCursor((c) => Math.max(0, c - 1));
-    if (key.downArrow) setCursor((c) => Math.min(actions.length - 1, c + 1));
+    if (key.upArrow)
+      setCursor((c) => {
+        let n = c - 1;
+        while (n > 0 && isMenuGap(actions[n])) n -= 1;
+        return isMenuGap(actions[n]) ? c : n;
+      });
+    if (key.downArrow)
+      setCursor((c) => {
+        let n = c + 1;
+        while (n < actions.length - 1 && isMenuGap(actions[n])) n += 1;
+        return isMenuGap(actions[n]) ? c : n;
+      });
     if (key.return) {
-      const action = actions[cursor];
-      if (action?.subActions) {
-        setCursor(0);
-        setActions(action.subActions);
+      const row = actions[cursor];
+      if (!row || isMenuGap(row)) return true;
+      if (row.subActions) {
+        const rows = menuRowsOf(row.subActions);
+        setCursor(isConfirmRows(rows) ? rows.length - 1 : 0);
+        setActions(rows);
       } else {
         setActions(null);
-        action?.run();
+        row.run();
       }
     }
     if (key.escape) setActions(null);
@@ -2556,29 +2673,81 @@ var useActionMenu = () => {
 var ActionMenu = ({
   item,
   actions,
-  cursor
+  cursor,
+  cols = COLS
 }) => {
-  const title = item.kind === "task" ? item.key : item.kind === "pr" || item.kind === "issue" ? `#${item.number}` : "";
+  const showIcons = getIconMode() === "nerd" && actions.some((row) => !isMenuGap(row) && row.icon !== void 0);
+  const keyWidth = Math.max(
+    0,
+    ...actions.flatMap(
+      (row) => isMenuGap(row) ? [] : [[...row.hint ?? ""].length]
+    )
+  );
+  const contentWidth = Math.max(
+    0,
+    ...actions.flatMap(
+      (row) => isMenuGap(row) ? [] : [
+        2 + (showIcons ? 2 : 0) + [...row.label].length + (keyWidth > 0 ? 1 + keyWidth : 0)
+      ]
+    )
+  );
+  const width = Math.min(
+    Math.max(contentWidth + 4, 40),
+    56,
+    Math.max(20, cols - 4)
+  );
+  const inner = Math.max(1, width - 4);
+  const confirming = isConfirmRows(actions);
+  const isCloseRow = (row) => menuTone(row) === "error";
+  const number = item.kind === "pr" || item.kind === "issue" ? item.number : null;
+  const leadNum = item.kind === "task" ? item.key : number !== null ? `#${number}` : "";
+  const lead = leadNum ? `${leadNum} \xB7 ` : "";
+  const rest = confirming ? `Close #${number}?` : item.kind === "task" ? item.summary : item.kind === "pr" || item.kind === "issue" ? item.title : "";
+  const restText = [...lead].length + [...rest].length <= inner ? rest : [...rest].slice(0, Math.max(0, inner - [...lead].length - 1)).join("") + "\u2026";
   return /* @__PURE__ */ jsxs(
     Box,
     {
       flexDirection: "column",
       flexShrink: 0,
+      width,
       borderStyle: "round",
       borderColor: colors.info,
       backgroundColor: OVERLAY_BG,
       paddingX: 1,
       marginTop: 1,
       children: [
-        /* @__PURE__ */ jsx(Text3, { color: colors.info, bold: true, children: title }),
-        /* @__PURE__ */ jsx(Text3, { dimColor: true, children: "\u2500".repeat(32) }),
-        actions.map((a, i) => /* @__PURE__ */ jsxs(Box, { children: [
-          /* @__PURE__ */ jsx(Text3, { color: colors.info, children: i === cursor ? "\u276F " : "  " }),
-          /* @__PURE__ */ jsx(Text3, { bold: i === cursor, children: a.label }),
-          /* @__PURE__ */ jsx(Text3, { dimColor: true, children: "  " + a.hint })
-        ] }, a.label)),
-        /* @__PURE__ */ jsx(Text3, { dimColor: true, children: "\u2500".repeat(32) }),
-        /* @__PURE__ */ jsx(Text3, { dimColor: true, children: "\u2191\u2193 navigate \u21B5 confirm esc cancel" })
+        confirming ? /* @__PURE__ */ jsx(Text3, { color: colors.error, bold: true, children: restText }) : /* @__PURE__ */ jsxs(Text3, { children: [
+          /* @__PURE__ */ jsx(Text3, { color: colors.info, bold: true, children: leadNum }),
+          leadNum ? /* @__PURE__ */ jsx(Text3, { dimColor: true, children: " \xB7 " }) : null,
+          /* @__PURE__ */ jsx(Text3, { children: restText })
+        ] }),
+        /* @__PURE__ */ jsx(Text3, { dimColor: true, children: "\u2500".repeat(inner) }),
+        actions.map(
+          (row, i) => isMenuGap(row) ? /* @__PURE__ */ jsx(Text3, { children: " " }, `gap-${i}`) : /* @__PURE__ */ jsxs(Box, { width: inner, children: [
+            /* @__PURE__ */ jsx(Box, { width: 2, flexShrink: 0, children: /* @__PURE__ */ jsx(Text3, { color: colors.info, children: i === cursor ? "\u276F " : "  " }) }),
+            showIcons ? /* @__PURE__ */ jsx(Box, { width: 2, flexShrink: 0, children: row.icon ? /* @__PURE__ */ jsx(Text3, { dimColor: true, children: row.icon }) : /* @__PURE__ */ jsx(Text3, { children: "  " }) }) : null,
+            /* @__PURE__ */ jsx(Box, { flexGrow: 1, children: /* @__PURE__ */ jsx(
+              Text3,
+              {
+                bold: i === cursor,
+                color: isCloseRow(row) ? colors.error : void 0,
+                children: row.label
+              }
+            ) }),
+            keyWidth > 0 ? /* @__PURE__ */ jsx(Box, { width: keyWidth, flexShrink: 0, justifyContent: "flex-end", children: /* @__PURE__ */ jsx(Text3, { color: colors.secondary, children: row.hint ?? "" }) }) : null
+          ] }, `${i}:${row.label}`)
+        ),
+        /* @__PURE__ */ jsx(Text3, { dimColor: true, children: "\u2500".repeat(inner) }),
+        /* @__PURE__ */ jsx(
+          FooterHints,
+          {
+            hints: [
+              ["\u2191\u2193", "move"],
+              ["\u21B5", "run"],
+              ["esc", "close"]
+            ]
+          }
+        )
       ]
     }
   );
@@ -2854,6 +3023,7 @@ var BrowseScreen = ({
   fetchedAt,
   refreshError,
   hidden,
+  overlayBody,
   peelRef,
   onTyping,
   onOpenPr,
@@ -3544,6 +3714,10 @@ var BrowseScreen = ({
   const matchCount = section.items.filter(
     (i) => i.kind !== "repo-header" && i.kind !== "subgroup-header"
   ).length;
+  const searchBar = searchBarState({
+    typing: searchInput,
+    nerd: getIconMode() === "nerd"
+  });
   const launcher = useMemo(() => {
     const run = /* @__PURE__ */ new Map();
     if (palette === null)
@@ -3603,7 +3777,8 @@ var BrowseScreen = ({
     }));
     return { items, run, message };
   }, [palette, activeItem, extensions, jiraBase, jiraKeyRe, jiraSetupHint]);
-  if (hidden) return null;
+  const chrome = useContext(InboxChromeContext);
+  const overlayOpen = overlayBody != null;
   const overlay = palette !== null ? /* @__PURE__ */ jsx(
     CommandPalette,
     {
@@ -3648,7 +3823,8 @@ var BrowseScreen = ({
     {
       item: activeItem,
       actions: menu.actions,
-      cursor: menu.cursor
+      cursor: menu.cursor,
+      cols: listCols
     }
   ) : null;
   return /* @__PURE__ */ jsxs(
@@ -3667,7 +3843,7 @@ var BrowseScreen = ({
             brand,
             sections: localSections,
             login,
-            scopeLabel: origin?.label,
+            scopeLabel: overlayOpen ? chrome?.scope ?? origin?.label : origin?.label,
             budgetLabel: budgetNotice(budget)?.label,
             budgetCritical: budgetNotice(budget)?.critical,
             refreshing,
@@ -3690,7 +3866,7 @@ var BrowseScreen = ({
           /* @__PURE__ */ jsx(Text3, { bold: true, color: colors.accent, children: "  \u26A1 auto-refresh paused to save API budget" }),
           /* @__PURE__ */ jsx(Text3, { dimColor: true, children: "   r refreshes anyway" })
         ] }) : null,
-        /* @__PURE__ */ jsx(Box, { marginBottom: 1, children: /* @__PURE__ */ jsx(
+        overlayOpen ? null : /* @__PURE__ */ jsx(Box, { marginBottom: 1, children: /* @__PURE__ */ jsx(
           Tabs,
           {
             active: section.id,
@@ -3723,18 +3899,24 @@ var BrowseScreen = ({
             }))
           }
         ) }),
-        search != null ? /* @__PURE__ */ jsxs(Box, { marginBottom: 1, children: [
-          /* @__PURE__ */ jsx(Text3, { color: colors.info, children: "  / " }),
+        !overlayOpen && search != null ? /* @__PURE__ */ jsxs(Box, { marginBottom: 1, children: [
+          /* @__PURE__ */ jsx(Text3, { color: searchBar.glyphColor, children: `  ${searchBar.glyph} ` }),
           /* @__PURE__ */ jsx(Text3, { children: search }),
-          searchInput ? /* @__PURE__ */ jsx(Text3, { color: colors.info, children: "\u258F" }) : null,
-          /* @__PURE__ */ jsx(Text3, { dimColor: true, children: `   ${matchCount} match${matchCount !== 1 ? "es" : ""}  ${filter.hints.map(([k, label]) => `${k} ${label}`).join(" \xB7 ")}` })
-        ] }) : repoFilter.size > 0 ? /* @__PURE__ */ jsxs(Box, { marginBottom: 1, children: [
+          searchBar.caret ? /* @__PURE__ */ jsx(Text3, { color: colors.info, children: "\u258F" }) : null,
+          /* @__PURE__ */ jsx(Text3, { dimColor: true, children: `   ${matchCount} match${matchCount !== 1 ? "es" : ""}  ${searchInput ? filter.hints.map(([k, label]) => `${k} ${label}`).join(" \xB7 ") : searchBar.hints}` })
+        ] }) : !overlayOpen && repoFilter.size > 0 ? /* @__PURE__ */ jsxs(Box, { marginBottom: 1, children: [
           /* @__PURE__ */ jsx(Text3, { color: colors.accent, children: "  \u25C9 " }),
           /* @__PURE__ */ jsx(Text3, { children: `${repoFilter.size} repo${repoFilter.size !== 1 ? "s" : ""}` }),
           /* @__PURE__ */ jsx(Text3, { dimColor: true, children: "   f edit \xB7 esc clear" })
         ] }) : null,
         /* @__PURE__ */ jsxs(Box, { children: [
-          /* @__PURE__ */ jsxs(
+          overlayOpen ? (
+            // The overlay owns this band: the same frame, the same header above
+            // and footer below, the body where the list was. Fixed to the list's
+            // own height so the frame holds still between browse and drill, and
+            // clipped rather than spilling past the footer on a long body.
+            /* @__PURE__ */ jsx(Box, { flexDirection: "column", height: listHeight, overflow: "hidden", children: overlayBody })
+          ) : /* @__PURE__ */ jsxs(
             Box,
             {
               flexDirection: "column",
@@ -3794,7 +3976,7 @@ var BrowseScreen = ({
               ]
             }
           ),
-          showRail ? /* @__PURE__ */ jsx(
+          showRail && !overlayOpen ? /* @__PURE__ */ jsx(
             SidePanel,
             {
               sidebar: rails,
@@ -3806,7 +3988,13 @@ var BrowseScreen = ({
             }
           ) : null
         ] }),
-        /* @__PURE__ */ jsx(Box, { marginTop: 1, children: flash ? /* @__PURE__ */ jsx(Text3, { color: colors.success, children: flash }) : /* @__PURE__ */ jsx(FooterHints, { hints }) })
+        /* @__PURE__ */ jsx(Box, { marginTop: 1, children: flash ? /* @__PURE__ */ jsx(Text3, { color: colors.success, children: flash }) : overlayOpen ? (
+          // The overlay's own verbs, plus the way back. `page="nested"` is what
+          // appends `⌫ back` and `q quit`, so a body passes only its own keys
+          // through `useChrome` — the same contract ink-ui's `Page` offers its
+          // nested pages, without re-laying-out the browse frame as one.
+          /* @__PURE__ */ jsx(FooterHints, { hints: chrome?.hints ?? [], page: "nested", help: false })
+        ) : /* @__PURE__ */ jsx(FooterHints, { hints }) })
       ]
     }
   );
@@ -3873,6 +4061,15 @@ var App = ({
   const browsePeel = useRef(null);
   const drillPeel = useRef(null);
   const [typing, setTyping] = useState(false);
+  const [chromeSpec, setChromeSpec] = useState({});
+  const setChrome = useCallback(
+    (next) => setChromeSpec((prev) => sameChrome(prev, next) ? prev : next),
+    []
+  );
+  const chromeValue = useMemo(
+    () => ({ scope: chromeSpec.scope, hints: chromeSpec.hints, setChrome }),
+    [chromeSpec, setChrome]
+  );
   useAppKeys({
     isActive: !typing,
     onBack: () => {
@@ -4236,7 +4433,10 @@ var App = ({
     extId: state.extId,
     target: state.target
   } : null;
-  const toBrowse = () => setState({ phase: "browse", sections: state.sections, login: state.login });
+  const toBrowse = () => {
+    setChromeSpec({});
+    setState({ phase: "browse", sections: state.sections, login: state.login });
+  };
   const markLeaving = (target) => {
     if (state.phase !== "browse") toBrowse();
     if (!leavingSince.current.has(target.url))
@@ -4264,82 +4464,89 @@ var App = ({
       );
     }, MERGED_HOLD_MS);
   };
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      BrowseScreen,
-      {
-        brand: brandOf(title),
-        sections: state.sections,
-        login: state.login,
-        jiraBase,
-        jiraKeyRe,
-        jiraSetupHint,
-        jiraTransitions,
-        onRefresh: applyOrRefresh,
-        onActed,
-        onSettled,
-        refreshing,
-        hasPending: pending !== null,
-        pendingSummary,
-        appliedSummary: transients.size > 0 ? appliedSummary : "",
-        fetchedAt,
-        refreshError: refreshError ?? void 0,
-        origin,
-        budget,
-        skippedForBudget,
-        hidden: overlay !== null,
-        peelRef: browsePeel,
-        onTyping: setTyping,
-        mergedUrls,
-        leavingUrls,
-        transitSince,
-        onLeave: markLeaving,
-        transients,
-        onTabChange: setVisibleTab,
-        sidebar,
-        liveLabel,
-        ciStatusState: hasCiStatus ? ciStatusState : void 0,
-        ciJob,
-        stripState: hasStrip ? stripState : void 0,
-        stripLabel,
-        tabHelp,
-        onOpenPr: (item) => setState({
+  const overlayBody = overlay?.kind === "pr" || overlay?.kind === "issue" ? detailFor?.({
+    item: overlay.item,
+    kind: overlay.kind,
+    login: state.login,
+    registerPeel: (peel) => {
+      drillPeel.current = peel;
+    },
+    onTyping: setTyping,
+    onBack: toBrowse,
+    onRefresh: applyOrRefresh,
+    onRemove: markLeaving,
+    onMerged: markMerged
+  }) : overlay?.kind === "ext" ? extensions?.find((e) => e.id === overlay.extId)?.body(toBrowse, overlay.target) : null;
+  return /* @__PURE__ */ jsx(InboxChromeContext.Provider, { value: chromeValue, children: /* @__PURE__ */ jsx(
+    BrowseScreen,
+    {
+      brand: brandOf(title),
+      sections: state.sections,
+      login: state.login,
+      jiraBase,
+      jiraKeyRe,
+      jiraSetupHint,
+      jiraTransitions,
+      onRefresh: applyOrRefresh,
+      onActed,
+      onSettled,
+      refreshing,
+      hasPending: pending !== null,
+      pendingSummary,
+      appliedSummary: transients.size > 0 ? appliedSummary : "",
+      fetchedAt,
+      refreshError: refreshError ?? void 0,
+      origin,
+      budget,
+      skippedForBudget,
+      hidden: overlay !== null,
+      overlayBody: overlayBody ?? void 0,
+      peelRef: browsePeel,
+      onTyping: setTyping,
+      mergedUrls,
+      leavingUrls,
+      transitSince,
+      onLeave: markLeaving,
+      transients,
+      onTabChange: setVisibleTab,
+      sidebar,
+      liveLabel,
+      ciStatusState: hasCiStatus ? ciStatusState : void 0,
+      ciJob,
+      stripState: hasStrip ? stripState : void 0,
+      stripLabel,
+      tabHelp,
+      onOpenPr: (item) => {
+        setChromeSpec({});
+        setState({
           phase: "pr",
           item,
           sections: state.sections,
           login: state.login
-        }),
-        onOpenIssue: (item) => setState({
+        });
+      },
+      onOpenIssue: (item) => {
+        setChromeSpec({});
+        setState({
           phase: "issue",
           item,
           sections: state.sections,
           login: state.login
-        }),
-        onOpenExt: (id, target) => setState({
+        });
+      },
+      onOpenExt: (id, target) => {
+        setChromeSpec({});
+        setState({
           phase: "ext",
           extId: id,
           target,
           sections: state.sections,
           login: state.login
-        }),
-        extensions
-      }
-    ),
-    (overlay?.kind === "pr" || overlay?.kind === "issue") && detailFor?.({
-      item: overlay.item,
-      kind: overlay.kind,
-      login: state.login,
-      registerPeel: (peel) => {
-        drillPeel.current = peel;
+        });
       },
-      onTyping: setTyping,
-      onBack: toBrowse,
-      onRefresh: applyOrRefresh,
-      onRemove: markLeaving,
-      onMerged: markMerged
-    }),
-    overlay?.kind === "ext" && extensions?.find((e) => e.id === overlay.extId)?.body(toBrowse, overlay.target)
-  ] });
+      extensions
+    }
+  ) });
 };
 
 // src/inbox/filter.ts
@@ -4356,4 +4563,4 @@ var matchesFilter = (repo, filter) => {
 };
 var parsePatterns = (value) => value.split(",").map((p) => p.trim()).filter(Boolean);
 
-export { ActionMenu, App, COLS, CiStatusLine, CommentsPanel, HealthPanel, MIN_SIDEBAR_COLS, PrRow, SIDEBAR_COLS, SidePanel, StatusStripLine, ageLabel, budgetNotice, buildActions, buildCheckoutCmd, clipboard, counts, drillCmd, explainGhAction, explainItem, fitCount, gapsAbove, healthColor, healthDisplay, healthGlyph, healthLegend, itermRun, jumpToRepo, jumpToRepoPane, matchesFilter, maxViewStart, 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, windowCount, withHeaders, withoutItem, workCount, writeCache };
+export { ActionMenu, App, COLS, CiStatusLine, CommentsPanel, HealthPanel, MIN_SIDEBAR_COLS, PrRow, SIDEBAR_COLS, SidePanel, StatusStripLine, ageLabel, budgetNotice, buildActions, buildCheckoutCmd, clipboard, counts, drillCmd, explainGhAction, explainItem, fitCount, 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 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kud/gh-ink",
-  "version": "0.66.1",
+  "version": "0.68.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",
@@ -48,8 +48,8 @@
     "react": ">=19"
   },
   "dependencies": {
-    "@kud/gh": "0.19.0",
-    "@kud/gh-workflow": "0.14.0",
+    "@kud/gh": "0.20.0",
+    "@kud/gh-workflow": "0.14.1",
     "@kud/ink-ui": "0.33.0",
     "zx": "8.8.5"
   },