@kud/gh-ink 0.76.1 → 0.76.2

package/dist/index.d.ts

@@ -997,7 +997,8 @@ declare const ActionMenu: ({ item, actions, cursor, cols, }: {
      * Content columns the menu may take. The width is fixed from the longest
      * 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";
@@ -2854,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}  `;
@@ -2863,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 }),
@@ -3002,7 +3004,7 @@ var ItemRow = ({
   prefix = "",
   parent,
   sparkFrame = 0,
-  cols = COLS,
+  cols,
   markerCols = 0,
   uniformLabels = [],
   columns,
@@ -3201,8 +3203,9 @@ 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,
@@ -3224,7 +3227,7 @@ var ActionMenu = ({
   const lead = leadNum ? `${leadNum} \xB7 ` : "";
   const rest = confirming ? `Close #${number}?` : item.kind === "task" ? item.summary : item.kind === "pr" || item.kind === "issue" ? item.title : "";
   const titleWidth = [...lead].length + [...rest].length + TITLE_SLACK;
-  const width = menuWidthFor(cols, contentWidth, titleWidth);
+  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";
@@ -3467,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,
@@ -3587,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);
@@ -3756,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(
@@ -4531,7 +4538,7 @@ var BrowseScreen = ({
           {
             strip: stripState.kind === "ready" ? stripState.strip : void 0,
             label: stripLabel,
-            width: COLS
+            width: frameCols
           }
         ) : null,
         reserveFocusRow ? /* @__PURE__ */ jsx(
@@ -4540,7 +4547,7 @@ var BrowseScreen = ({
             focus,
             label: focusLabel,
             empty: focusEmpty,
-            width: COLS,
+            width: frameCols,
             jumpKey: FOCUS_JUMP_KEY
           }
         ) : null,
@@ -4552,7 +4559,7 @@ var BrowseScreen = ({
           Tabs,
           {
             active: section.id,
-            width: COLS,
+            width: frameCols,
             items: localSections.map((s) => ({
               value: s.id,
               label: s.label,
@@ -4768,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(
@@ -5228,7 +5236,7 @@ var App = ({
             {
               strip: stripState.kind === "ready" ? stripState.strip : void 0,
               label: stripLabel,
-              width: COLS
+              width: frameCols
             }
           ) : null,
           hasFocusSlot ? /* @__PURE__ */ jsx(
@@ -5237,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.1",
+  "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",