@pipelex/mthds-ui 0.30.0 → 0.31.0

package/dist/{chunk-GAOBB3UT.js → chunk-7H3RHOYA.js}

@@ -5,7 +5,7 @@ import {
   GRAPH_THEME,
   GRAPH_THEME_MODE,
   TOOLBAR_POSITION
-} from "./chunk-PJTYQURQ.js";
+} from "./chunk-QRO3TYZE.js";
 import {
   __spreadProps,
   __spreadValues
@@ -195,4 +195,4 @@ export {
   DEFAULT_GRAPH_CONFIG,
   getPaletteColors
 };
-//# sourceMappingURL=chunk-GAOBB3UT.js.map
+//# sourceMappingURL=chunk-7H3RHOYA.js.map

package/dist/{chunk-3BXB6HSF.js → chunk-BXRVND2C.js}

@@ -4,7 +4,7 @@ import {
 } from "./chunk-2N65P32H.js";
 import {
   DEFAULT_GRAPH_CONFIG
-} from "./chunk-GAOBB3UT.js";
+} from "./chunk-7H3RHOYA.js";
 import {
   ARROW_CLOSED_MARKER,
   BINDING_STEP_TYPE,
@@ -31,7 +31,7 @@ import {
   nodeWidth,
   stuffDigestFromId,
   stuffNodeId
-} from "./chunk-PJTYQURQ.js";
+} from "./chunk-QRO3TYZE.js";
 import {
   __objRest,
   __spreadProps,
@@ -2088,9 +2088,12 @@ var STEP_PADDING_Y = 10;
 var STEP_BORDER = 1.5;
 var STEP_HEADER_HEIGHT = 16;
 var STEP_GAP = 6;
-var SIMPLE_STEP_TITLE_FONT_PX = 15;
-var STEP_TITLE_LINE_HEIGHT = 20;
-var SIMPLE_TITLE_MAX_LINES = 3;
+var SIMPLE_STEP_TITLE_FITS = [
+  { boxWidth: SIMPLE_STEP_WIDTH, fontPx: 15, lineHeightPx: 20, maxLines: 3 },
+  { boxWidth: SIMPLE_STEP_WIDE_WIDTH, fontPx: 15, lineHeightPx: 20, maxLines: 3 },
+  { boxWidth: SIMPLE_STEP_WIDTH, fontPx: 13, lineHeightPx: 17, maxLines: 5 },
+  { boxWidth: SIMPLE_STEP_WIDTH, fontPx: 12, lineHeightPx: 16, maxLines: 7 }
+];
 var STEP_MARKER_HEIGHT = 18;
 var STEP_INNER_HEIGHT = 22;
 var EDGE_LABEL_FONT_PX = 11;
@@ -2108,6 +2111,7 @@ var TERMINAL_MIN_HEIGHT = 52;
 var SIMPLE_DECISION_WIDTHS = [188, 220, 252, 284];
 var DECISION_TITLE_FONT_PX = 13;
 var DECISION_TITLE_LINE_HEIGHT = 16;
+var DECISION_TITLE_MAX_LINES = 3;
 var DECISION_TEXT_WIDTH_SHARE = 0.56;
 var DECISION_TEXT_HEIGHT_SHARE = 0.4;
 var DECISION_MIN_HEIGHT = 84;
@@ -2153,20 +2157,20 @@ var STEP_CATEGORY_WORDS = {
   repeat: "For each",
   pick: "Pick"
 };
-function simpleStepSize(title, options = {}) {
-  let width = SIMPLE_STEP_WIDTH;
-  let wrap = simpleTitleWrap(title);
-  if (wrap.clamped) {
-    const wide = simpleTitleWrap(title, SIMPLE_STEP_WIDE_WIDTH);
-    if (!wide.clamped) {
-      width = SIMPLE_STEP_WIDE_WIDTH;
-      wrap = wide;
-    }
+function simpleTitleFit(title) {
+  for (const fit of SIMPLE_STEP_TITLE_FITS) {
+    const wrap = simpleTitleWrap(title, fit);
+    if (!wrap.clamped) return { fit, wrap };
   }
-  let height = 2 * STEP_PADDING_Y + STEP_HEADER_HEIGHT + STEP_GAP + Math.max(1, wrap.drawnLines) * STEP_TITLE_LINE_HEIGHT;
+  const floor = SIMPLE_STEP_TITLE_FITS[SIMPLE_STEP_TITLE_FITS.length - 1];
+  return { fit: floor, wrap: simpleTitleWrap(title, floor) };
+}
+function simpleStepSize(title, options = {}) {
+  const { fit, wrap } = simpleTitleFit(title);
+  let height = 2 * STEP_PADDING_Y + STEP_HEADER_HEIGHT + STEP_GAP + Math.max(1, wrap.drawnLines) * fit.lineHeightPx;
   if (options.forEach) height += STEP_GAP + STEP_MARKER_HEIGHT;
   if (options.innerSteps) height += STEP_GAP + STEP_INNER_HEIGHT;
-  return { width, height: Math.ceil(height + 2 * STEP_BORDER) };
+  return { width: fit.boxWidth, height: Math.ceil(height + 2 * STEP_BORDER) };
 }
 function simpleTerminalSize(title, hasSubtitle) {
   const wrap = estimateWrap(
@@ -2184,7 +2188,7 @@ function simpleDecisionSize(title) {
     title,
     decisionTextWidth(width),
     DECISION_TITLE_FONT_PX,
-    SIMPLE_TITLE_MAX_LINES
+    DECISION_TITLE_MAX_LINES
   );
   for (const candidate of SIMPLE_DECISION_WIDTHS.slice(1)) {
     if (!wrap.clamped) break;
@@ -2193,20 +2197,15 @@ function simpleDecisionSize(title) {
       title,
       decisionTextWidth(width),
       DECISION_TITLE_FONT_PX,
-      SIMPLE_TITLE_MAX_LINES
+      DECISION_TITLE_MAX_LINES
     );
   }
   const textHeight = Math.max(1, wrap.drawnLines) * DECISION_TITLE_LINE_HEIGHT;
   const height = Math.max(DECISION_MIN_HEIGHT, Math.ceil(textHeight / DECISION_TEXT_HEIGHT_SHARE));
   return { width, height };
 }
-function simpleTitleWrap(title, boxWidth = SIMPLE_STEP_WIDTH) {
-  return estimateWrap(
-    title,
-    stepTitleWidth(boxWidth),
-    SIMPLE_STEP_TITLE_FONT_PX,
-    SIMPLE_TITLE_MAX_LINES
-  );
+function simpleTitleWrap(title, fit) {
+  return estimateWrap(title, stepTitleWidth(fit.boxWidth), fit.fontPx, fit.maxLines);
 }
 var STATUS_PRECEDENCE = [
   "failed",
@@ -2655,6 +2654,7 @@ function projectSimpleGraph(input) {
       const simple = __spreadValues(__spreadValues(__spreadValues(__spreadValues({
         kind: "step",
         title,
+        titleFit: simpleTitleFit(title).fit,
         category: STEP_CATEGORY_BY_PIPE_TYPE[pipeType],
         status: stepStatus(spec)
       }, graphMode !== void 0 ? { graphMode } : {}), forEach ? { forEach } : {}), innerStepCount !== void 0 ? { innerStepCount } : {}), onExpand ? { onExpand } : {});
@@ -2965,13 +2965,13 @@ export {
   estimateWrap,
   SIMPLE_STEP_WIDTH,
   SIMPLE_STEP_WIDE_WIDTH,
-  SIMPLE_STEP_TITLE_FONT_PX,
-  SIMPLE_TITLE_MAX_LINES,
+  SIMPLE_STEP_TITLE_FITS,
   SIMPLE_TERMINAL_WIDTH,
   SIMPLE_DECISION_WIDTHS,
   SIMPLE_FOLD_DEPTH,
   STEP_CATEGORY_BY_PIPE_TYPE,
   STEP_CATEGORY_WORDS,
+  simpleTitleFit,
   simpleStepSize,
   simpleTerminalSize,
   simpleDecisionSize,
@@ -2983,4 +2983,4 @@ export {
   applySimpleFrames,
   GRAPH_STYLE_PIPELINES
 };
-//# sourceMappingURL=chunk-3BXB6HSF.js.map
+//# sourceMappingURL=chunk-BXRVND2C.js.map