@kud/gh-ink 0.76.0 → 0.76.2

package/dist/index.d.ts

@@ -995,9 +995,10 @@ declare const ActionMenu: ({ item, actions, cursor, cols, }: {
     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
+     * row and the title — see `menuWidthFor` — 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.
+     * has; everywhere else the frame's own width is the right answer, read live
+     * rather than from the load-time sample — see `useFrameCols`.
      */
     cols?: number;
 }) => React.JSX.Element;

package/dist/index.js

@@ -2358,6 +2358,7 @@ var FRAME_PAD_X = 1;
 var FRAME_CHROME_COLS = 2 + FRAME_PAD_X * 2;
 var COLS = (process.stdout.columns ?? 120) - FRAME_CHROME_COLS;
 var MODAL_CHROME_COLS = 2 + 1 * 2;
+var useFrameCols = () => useWindowSize().columns - FRAME_CHROME_COLS;
 var ROW_MAX_COLS = 140;
 var OVERLAY_BG = "#22222e";
 var SELECTION_BG = "#16161f";
@@ -2829,6 +2830,8 @@ var buildActions = (item, login, showFlash, jiraBase, jiraKeyRe, jiraTransitions
   actions.push(...closing);
   return byGroup(actions);
 };
+var TAB_STRIP_ROWS = 3;
+var FILTER_BAR_ROWS = 2;
 var agoText = (ms) => {
   const d = (Date.now() - ms) / 1e3;
   if (d < 60) return "just now";
@@ -2852,6 +2855,7 @@ var InboxHeader = ({
   appliedSummary,
   fetchedAt
 }) => {
+  const frameCols = useFrameCols();
   const total = sections.reduce((n, s) => n + workCount(s), 0);
   const countSeg = loading ? "      loading\u2026  " : quiet ? "  " : `  ${String(total).padStart(3)} item${total !== 1 ? "s" : ""}  \xB7  `;
   const userSeg = loading || quiet ? "" : `@${login}  `;
@@ -2861,7 +2865,7 @@ var InboxHeader = ({
   const statusSeg = statusText ? statusText + "  " : "";
   const fill = Math.max(
     4,
-    COLS - brand.length - countSeg.length - userSeg.length - workLabel.length - budgetSeg.length - statusSeg.length
+    frameCols - brand.length - countSeg.length - userSeg.length - workLabel.length - budgetSeg.length - statusSeg.length
   );
   return /* @__PURE__ */ jsxs(Box, { marginBottom: 1, children: [
     /* @__PURE__ */ jsx(Text3, { color: colors.accent, bold: true, children: brand }),
@@ -3000,7 +3004,7 @@ var ItemRow = ({
   prefix = "",
   parent,
   sparkFrame = 0,
-  cols = COLS,
+  cols,
   markerCols = 0,
   uniformLabels = [],
   columns,
@@ -3188,12 +3192,20 @@ var useActionMenu = () => {
   };
   return { actions, cursor, open, close: () => setActions(null), handleKey };
 };
+var TITLE_SLACK = 1;
+var MENU_MAX_WIDTH = 88;
+var menuWidthFor = (cols, contentWidth, titleWidth) => Math.min(
+  Math.max(contentWidth + 4, titleWidth + 4, 40),
+  MENU_MAX_WIDTH,
+  Math.max(20, cols - 4)
+);
 var ActionMenu = ({
   item,
   actions,
   cursor,
-  cols = COLS
+  cols
 }) => {
+  const frameCols = useFrameCols();
   const showIcons = getIconMode() === "nerd" && actions.some((row) => !isMenuGap(row) && row.icon !== void 0);
   const keyWidth = Math.max(
     0,
@@ -3209,19 +3221,16 @@ var ActionMenu = ({
       ]
     )
   );
-  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";
+  const titleWidth = [...lead].length + [...rest].length + TITLE_SLACK;
+  const width = menuWidthFor(cols ?? frameCols, contentWidth, titleWidth);
+  const inner = Math.max(1, width - 4);
+  const restText = [...lead].length + [...rest].length + TITLE_SLACK <= inner ? rest : [...rest].slice(0, Math.max(0, inner - [...lead].length - 1 - TITLE_SLACK)).join("") + "\u2026";
+  const isCloseRow = (row) => menuTone(row) === "error";
   return /* @__PURE__ */ jsxs(
     Box,
     {
@@ -3461,26 +3470,29 @@ var HelpModal = ({
     }
   );
 };
-var ExplainModal = ({ item, login }) => /* @__PURE__ */ jsxs(
-  Box,
-  {
-    flexDirection: "column",
-    borderStyle: "round",
-    borderColor: colors.info,
-    backgroundColor: OVERLAY_BG,
-    paddingX: 1,
-    width: Math.min(COLS, 78),
-    children: [
-      /* @__PURE__ */ jsx(Text3, { color: colors.accent, bold: true, children: `#${item.number} \xB7 ${item.repo}` }),
-      /* @__PURE__ */ jsx(Text3, { children: item.title }),
-      explainItem(item, login).map((section) => /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginTop: 1, children: [
-        /* @__PURE__ */ jsx(Text3, { bold: true, dimColor: true, children: section.heading }),
-        section.lines.map((line, i) => /* @__PURE__ */ jsx(Text3, { children: "  " + line }, i))
-      ] }, section.heading)),
-      /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text3, { dimColor: true, children: "esc \xB7 e close" }) })
-    ]
-  }
-);
+var ExplainModal = ({ item, login }) => {
+  const frameCols = useFrameCols();
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      flexDirection: "column",
+      borderStyle: "round",
+      borderColor: colors.info,
+      backgroundColor: OVERLAY_BG,
+      paddingX: 1,
+      width: Math.min(frameCols, 78),
+      children: [
+        /* @__PURE__ */ jsx(Text3, { color: colors.accent, bold: true, children: `#${item.number} \xB7 ${item.repo}` }),
+        /* @__PURE__ */ jsx(Text3, { children: item.title }),
+        explainItem(item, login).map((section) => /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginTop: 1, children: [
+          /* @__PURE__ */ jsx(Text3, { bold: true, dimColor: true, children: section.heading }),
+          section.lines.map((line, i) => /* @__PURE__ */ jsx(Text3, { children: "  " + line }, i))
+        ] }, section.heading)),
+        /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text3, { dimColor: true, children: "esc \xB7 e close" }) })
+      ]
+    }
+  );
+};
 var RepoPicker = ({
   repos,
   selected,
@@ -3581,6 +3593,7 @@ var BrowseScreen = ({
   onRestore
 }) => {
   const { rows } = useWindowSize();
+  const frameCols = useFrameCols();
   const applyWork = (secs) => origin ? filterByOrigin(secs, origin.show, origin.match, login) : secs;
   const initialSections = applyWork(sections);
   const [localSections, setLocalSections] = useState(initialSections);
@@ -3750,8 +3763,8 @@ var BrowseScreen = ({
   useEffect(() => {
     onTyping?.(searchInput || palette !== null);
   }, [searchInput, palette, onTyping]);
-  const railCols = railWidth(COLS);
-  const listCols = showRail ? COLS - railCols : COLS;
+  const railCols = railWidth(frameCols);
+  const listCols = showRail ? frameCols - railCols : frameCols;
   const { trailingColumns, numberCols } = listColumnsOf(localSections);
   const rowCols = Math.min(listCols, ROW_MAX_COLS);
   const trailingShed = sectionShedOf(
@@ -4525,7 +4538,7 @@ var BrowseScreen = ({
           {
             strip: stripState.kind === "ready" ? stripState.strip : void 0,
             label: stripLabel,
-            width: COLS
+            width: frameCols
           }
         ) : null,
         reserveFocusRow ? /* @__PURE__ */ jsx(
@@ -4534,7 +4547,7 @@ var BrowseScreen = ({
             focus,
             label: focusLabel,
             empty: focusEmpty,
-            width: COLS,
+            width: frameCols,
             jumpKey: FOCUS_JUMP_KEY
           }
         ) : null,
@@ -4546,7 +4559,7 @@ var BrowseScreen = ({
           Tabs,
           {
             active: section.id,
-            width: COLS,
+            width: frameCols,
             items: localSections.map((s) => ({
               value: s.id,
               label: s.label,
@@ -4600,7 +4613,21 @@ var BrowseScreen = ({
             // 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 })
+            //
+            // Plus the rows the overlay hides: the tab strip and, when a filter
+            // is on, its bar. `listHeight` already paid for both, so a band of
+            // exactly `listHeight` left the frame three rows short of the
+            // terminal under every drill and extension body, five with a filter
+            // kept — the bottom border floating above the screen's edge.
+            /* @__PURE__ */ jsx(
+              Box,
+              {
+                flexDirection: "column",
+                height: listHeight + TAB_STRIP_ROWS + (filterActive ? FILTER_BAR_ROWS : 0),
+                overflow: "hidden",
+                children: overlayBody
+              }
+            )
           ) : /* @__PURE__ */ jsxs(
             Box,
             {
@@ -4748,6 +4775,7 @@ var App = ({
   onSettled
 }) => {
   const { rows } = useWindowSize();
+  const frameCols = useFrameCols();
   const [launchCache] = useState(() => cacheKey ? readCache(cacheKey) : null);
   const launchPainted = !!launchCache && launchCache.sections.length > 0;
   const [state, setState] = useState(
@@ -5208,7 +5236,7 @@ var App = ({
             {
               strip: stripState.kind === "ready" ? stripState.strip : void 0,
               label: stripLabel,
-              width: COLS
+              width: frameCols
             }
           ) : null,
           hasFocusSlot ? /* @__PURE__ */ jsx(
@@ -5217,7 +5245,7 @@ var App = ({
               focus: void 0,
               label: focusLabel,
               empty: focusEmpty,
-              width: COLS
+              width: frameCols
             }
           ) : null,
           /* @__PURE__ */ jsx(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kud/gh-ink",
-  "version": "0.76.0",
+  "version": "0.76.2",
   "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",