@diagrammo/dgmo 0.45.0 → 0.47.0

package/dist/chunk-YAA6IID3.js

@@ -0,0 +1,548 @@
+import {
+  LEGEND_CAPSULE_PAD,
+  LEGEND_DOT_R,
+  LEGEND_ENTRY_DOT_GAP,
+  LEGEND_ENTRY_FONT_SIZE,
+  LEGEND_ENTRY_TRAIL,
+  LEGEND_GEAR_PILL_W,
+  LEGEND_GROUP_GAP,
+  LEGEND_HEIGHT,
+  LEGEND_MAX_ENTRY_ROWS,
+  LEGEND_PILL_FONT_SIZE,
+  LEGEND_PILL_PAD,
+  LEGEND_TOGGLE_DOT_R,
+  measureLegendText,
+  truncateLegendText
+} from "./chunk-QOOUC2J5.js";
+
+// src/utils/number-format.ts
+function compactNumber(n) {
+  if (!Number.isFinite(n)) return String(n);
+  const abs = Math.abs(n);
+  if (abs < 1e3) {
+    return Number.isInteger(n) ? String(n) : String(Math.round(n * 10) / 10);
+  }
+  const sign = n < 0 ? "-" : "";
+  const units = [
+    [1e12, "T"],
+    [1e9, "B"],
+    [1e6, "M"],
+    [1e3, "K"]
+  ];
+  for (const [factor, suffix] of units) {
+    if (abs >= factor) {
+      const scaled = Math.round(abs / factor * 10) / 10;
+      const body = Number.isInteger(scaled) ? String(scaled) : scaled.toFixed(1);
+      return `${sign}${body}${suffix}`;
+    }
+  }
+  return String(n);
+}
+
+// src/utils/legend-layout.ts
+var CONTROL_PILL_PAD = 16;
+var CONTROL_FONT_SIZE = 11;
+var CONTROL_ICON_GAP = 4;
+var CONTROL_GAP = 8;
+var RAMP_LEGEND_W = 80;
+var RAMP_LEGEND_H = 8;
+var RAMP_LABEL_GAP = 6;
+function fmtRamp(n) {
+  return compactNumber(n);
+}
+function gradientCapsuleWidth(name, gradient) {
+  const pw = pillWidth(name);
+  const minW = measureLegendText(fmtRamp(gradient.min), LEGEND_ENTRY_FONT_SIZE);
+  const maxW = measureLegendText(fmtRamp(gradient.max), LEGEND_ENTRY_FONT_SIZE);
+  return LEGEND_CAPSULE_PAD + pw + 4 + minW + RAMP_LABEL_GAP + RAMP_LEGEND_W + RAMP_LABEL_GAP + maxW + LEGEND_CAPSULE_PAD;
+}
+function buildGradientCapsuleLayout(group, gradient) {
+  const pw = pillWidth(group.name);
+  const minText = fmtRamp(gradient.min);
+  const maxText = fmtRamp(gradient.max);
+  const minW = measureLegendText(minText, LEGEND_ENTRY_FONT_SIZE);
+  const gx = LEGEND_CAPSULE_PAD + pw + 4;
+  const minX = gx;
+  const rampX = gx + minW + RAMP_LABEL_GAP;
+  const maxX = rampX + RAMP_LEGEND_W + RAMP_LABEL_GAP;
+  const width = gradientCapsuleWidth(group.name, gradient);
+  return {
+    groupName: group.name,
+    x: 0,
+    y: 0,
+    width,
+    height: LEGEND_HEIGHT,
+    pill: {
+      groupName: group.name,
+      x: LEGEND_CAPSULE_PAD,
+      y: LEGEND_CAPSULE_PAD,
+      width: pw,
+      height: LEGEND_HEIGHT - LEGEND_CAPSULE_PAD * 2,
+      isActive: true
+    },
+    entries: [],
+    gradient: {
+      rampX,
+      rampY: (LEGEND_HEIGHT - RAMP_LEGEND_H) / 2,
+      rampW: RAMP_LEGEND_W,
+      rampH: RAMP_LEGEND_H,
+      min: gradient.min,
+      max: gradient.max,
+      minText,
+      minX,
+      maxText,
+      maxX,
+      textY: LEGEND_HEIGHT / 2,
+      low: gradient.low,
+      high: gradient.high
+    }
+  };
+}
+function pillWidth(name) {
+  return measureLegendText(name, LEGEND_PILL_FONT_SIZE) + LEGEND_PILL_PAD;
+}
+function entriesWidth(entries) {
+  let w = 0;
+  for (const e of entries) {
+    w += LEGEND_DOT_R * 2 + LEGEND_ENTRY_DOT_GAP + measureLegendText(e.value, LEGEND_ENTRY_FONT_SIZE) + LEGEND_ENTRY_TRAIL;
+  }
+  return w;
+}
+function entryWidth(value) {
+  return LEGEND_DOT_R * 2 + LEGEND_ENTRY_DOT_GAP + measureLegendText(value, LEGEND_ENTRY_FONT_SIZE) + LEGEND_ENTRY_TRAIL;
+}
+function controlWidth(control) {
+  let w = CONTROL_PILL_PAD;
+  if (control.label) {
+    w += measureLegendText(control.label, CONTROL_FONT_SIZE);
+    if (control.icon) w += CONTROL_ICON_GAP;
+  }
+  if (control.icon) w += 14;
+  if (control.children) {
+    for (const child of control.children) {
+      w += measureLegendText(child.label, CONTROL_FONT_SIZE) + 12;
+    }
+  }
+  return w;
+}
+function capsuleWidth(name, entries, containerWidth, addonWidth = 0) {
+  const pw = pillWidth(name);
+  const maxCapsuleW = containerWidth;
+  const baseW = LEGEND_CAPSULE_PAD * 2 + pw + 4 + addonWidth;
+  const ew = entriesWidth(entries);
+  const singleRowW = baseW + ew;
+  if (singleRowW <= maxCapsuleW + 0.5) {
+    return {
+      width: singleRowW,
+      entryRows: 1,
+      moreCount: 0,
+      visibleEntries: entries.length
+    };
+  }
+  const rowWidth = maxCapsuleW - LEGEND_CAPSULE_PAD;
+  let row = 1;
+  let rowX = LEGEND_CAPSULE_PAD + pw + 4 + addonWidth;
+  let visible = 0;
+  for (let i = 0; i < entries.length; i++) {
+    let ew2 = entryWidth(entries[i].value);
+    const availW = rowWidth - rowX;
+    if (ew2 > availW && i > 0) {
+      row++;
+      rowX = LEGEND_CAPSULE_PAD + pw + 4 + addonWidth;
+      if (row > LEGEND_MAX_ENTRY_ROWS) {
+        return {
+          width: maxCapsuleW,
+          entryRows: LEGEND_MAX_ENTRY_ROWS,
+          moreCount: entries.length - visible,
+          visibleEntries: visible
+        };
+      }
+    }
+    ew2 = Math.min(ew2, rowWidth - rowX);
+    rowX += ew2;
+    visible++;
+  }
+  return {
+    width: maxCapsuleW,
+    entryRows: row,
+    moreCount: 0,
+    visibleEntries: entries.length
+  };
+}
+function controlsGroupCapsuleWidth(toggles) {
+  let w = LEGEND_CAPSULE_PAD * 2 + LEGEND_GEAR_PILL_W + 4;
+  for (const t of toggles) {
+    w += LEGEND_TOGGLE_DOT_R * 2 + LEGEND_ENTRY_DOT_GAP + measureLegendText(t.label, LEGEND_ENTRY_FONT_SIZE) + LEGEND_ENTRY_TRAIL;
+  }
+  return w;
+}
+function isAppHostedControls(config, isExport) {
+  return !isExport && config.controlsHost === "app" && !!config.controlsGroup && config.controlsGroup.toggles.length > 0;
+}
+function buildControlsGroupLayout(config, state) {
+  const cg = config.controlsGroup;
+  if (!cg || cg.toggles.length === 0) return void 0;
+  const expanded = !!state.controlsExpanded;
+  const pillH = LEGEND_HEIGHT - LEGEND_CAPSULE_PAD * 2;
+  if (!expanded) {
+    return {
+      x: 0,
+      y: 0,
+      width: LEGEND_GEAR_PILL_W,
+      height: LEGEND_HEIGHT,
+      expanded: false,
+      pill: { x: 0, y: 0, width: LEGEND_GEAR_PILL_W, height: LEGEND_HEIGHT },
+      toggles: []
+    };
+  }
+  const capsuleW = controlsGroupCapsuleWidth(cg.toggles);
+  const toggleLayouts = [];
+  let tx = LEGEND_CAPSULE_PAD + LEGEND_GEAR_PILL_W + 4;
+  for (const toggle of cg.toggles) {
+    const dotCx = tx + LEGEND_TOGGLE_DOT_R;
+    const dotCy = LEGEND_HEIGHT / 2;
+    const textX = tx + LEGEND_TOGGLE_DOT_R * 2 + LEGEND_ENTRY_DOT_GAP;
+    const textY = LEGEND_HEIGHT / 2;
+    toggleLayouts.push({
+      id: toggle.id,
+      label: toggle.label,
+      active: toggle.active,
+      dotCx,
+      dotCy,
+      textX,
+      textY
+    });
+    tx += LEGEND_TOGGLE_DOT_R * 2 + LEGEND_ENTRY_DOT_GAP + measureLegendText(toggle.label, LEGEND_ENTRY_FONT_SIZE) + LEGEND_ENTRY_TRAIL;
+  }
+  return {
+    x: 0,
+    y: 0,
+    width: capsuleW,
+    height: LEGEND_HEIGHT,
+    expanded: true,
+    pill: {
+      x: LEGEND_CAPSULE_PAD,
+      y: LEGEND_CAPSULE_PAD,
+      width: LEGEND_GEAR_PILL_W - LEGEND_CAPSULE_PAD * 2,
+      height: pillH
+    },
+    toggles: toggleLayouts
+  };
+}
+function computeLegendLayout(config, state, containerWidth) {
+  const { groups, controls: configControls, mode } = config;
+  const isExport = mode === "export";
+  const gated = isAppHostedControls(config, isExport);
+  const activeGroupName = state.activeGroup?.toLowerCase() ?? null;
+  if (isExport && !activeGroupName) {
+    return {
+      height: 0,
+      width: 0,
+      rows: [],
+      controls: [],
+      pills: []
+    };
+  }
+  const controlsGroupLayout = isExport || gated ? void 0 : buildControlsGroupLayout(config, state);
+  const visibleGroups = config.showEmptyGroups ? groups : groups.filter((g) => g.entries.length > 0 || !!g.gradient);
+  if (visibleGroups.length === 0 && (!configControls || configControls.length === 0) && !controlsGroupLayout) {
+    return {
+      height: 0,
+      width: 0,
+      rows: [],
+      controls: [],
+      pills: []
+    };
+  }
+  const controlLayouts = [];
+  let totalControlsW = 0;
+  if (configControls && !isExport) {
+    for (const ctrl of configControls) {
+      const w = controlWidth(ctrl);
+      const children = ctrl.children?.map((c) => ({
+        id: c.id,
+        label: c.label,
+        x: 0,
+        y: 0,
+        width: measureLegendText(c.label, CONTROL_FONT_SIZE) + 12,
+        ...c.isActive !== void 0 && { isActive: c.isActive }
+      }));
+      controlLayouts.push({
+        id: ctrl.id,
+        x: 0,
+        // positioned later
+        y: 0,
+        width: w,
+        height: LEGEND_HEIGHT,
+        icon: ctrl.icon,
+        ...ctrl.label !== void 0 && { label: ctrl.label },
+        exportBehavior: ctrl.exportBehavior,
+        ...children !== void 0 && { children }
+      });
+      totalControlsW += w + CONTROL_GAP;
+    }
+    if (totalControlsW > 0) totalControlsW -= CONTROL_GAP;
+  } else if (configControls && isExport) {
+    for (const ctrl of configControls) {
+      if (ctrl.exportBehavior === "strip") continue;
+      const w = controlWidth(ctrl);
+      const children = ctrl.children?.map((c) => ({
+        id: c.id,
+        label: c.label,
+        x: 0,
+        y: 0,
+        width: measureLegendText(c.label, CONTROL_FONT_SIZE) + 12,
+        ...c.isActive !== void 0 && { isActive: c.isActive }
+      }));
+      controlLayouts.push({
+        id: ctrl.id,
+        x: 0,
+        y: 0,
+        width: w,
+        height: LEGEND_HEIGHT,
+        icon: ctrl.icon,
+        ...ctrl.label !== void 0 && { label: ctrl.label },
+        exportBehavior: ctrl.exportBehavior,
+        ...children !== void 0 && { children }
+      });
+      totalControlsW += w + CONTROL_GAP;
+    }
+    if (totalControlsW > 0) totalControlsW -= CONTROL_GAP;
+  }
+  const controlsSpace = totalControlsW > 0 ? totalControlsW + LEGEND_GROUP_GAP * 2 : 0;
+  const gearSpace = controlsGroupLayout ? controlsGroupLayout.width + LEGEND_GROUP_GAP : 0;
+  const groupAvailW = containerWidth - controlsSpace - gearSpace;
+  const pills = [];
+  let activeCapsule;
+  for (const g of visibleGroups) {
+    const isActive = activeGroupName === g.name.toLowerCase();
+    if (isExport && !isActive) continue;
+    if (isActive) {
+      activeCapsule = buildCapsuleLayout(
+        g,
+        groupAvailW,
+        config.capsulePillAddonWidth ?? 0
+      );
+    } else if (!activeGroupName || config.showInactivePills) {
+      const pw = pillWidth(g.name);
+      pills.push({
+        groupName: g.name,
+        x: 0,
+        y: 0,
+        width: pw,
+        height: LEGEND_HEIGHT,
+        isActive: false
+      });
+    }
+  }
+  const alignLeft = config.position.titleRelation === "inline-with-title";
+  const rows = layoutRows(
+    activeCapsule,
+    pills,
+    controlLayouts,
+    groupAvailW,
+    containerWidth,
+    totalControlsW,
+    alignLeft,
+    controlsGroupLayout
+  );
+  const height = rows.length * LEGEND_HEIGHT;
+  const width = containerWidth;
+  return {
+    height,
+    width,
+    rows,
+    ...activeCapsule !== void 0 && { activeCapsule },
+    controls: controlLayouts,
+    pills,
+    ...controlsGroupLayout !== void 0 && {
+      controlsGroup: controlsGroupLayout
+    }
+  };
+}
+function buildCapsuleLayout(group, containerWidth, addonWidth = 0) {
+  if (group.gradient) return buildGradientCapsuleLayout(group, group.gradient);
+  const pw = pillWidth(group.name);
+  const info = capsuleWidth(
+    group.name,
+    group.entries,
+    containerWidth,
+    addonWidth
+  );
+  const pill = {
+    groupName: group.name,
+    x: LEGEND_CAPSULE_PAD,
+    y: LEGEND_CAPSULE_PAD,
+    width: pw,
+    height: LEGEND_HEIGHT - LEGEND_CAPSULE_PAD * 2,
+    isActive: true
+  };
+  const entries = [];
+  const ex = LEGEND_CAPSULE_PAD + pw + 4 + addonWidth;
+  let ey = 0;
+  let rowX = ex;
+  const maxRowW = containerWidth - LEGEND_CAPSULE_PAD;
+  let currentRow = 0;
+  for (let i = 0; i < info.visibleEntries; i++) {
+    const entry = group.entries[i];
+    let ew = entryWidth(entry.value);
+    if (info.entryRows > 1 && rowX + ew > maxRowW && rowX > ex && i > 0) {
+      currentRow++;
+      rowX = ex;
+      ey = currentRow * LEGEND_HEIGHT;
+    }
+    let displayValue;
+    const availW = maxRowW - rowX;
+    if (ew > availW) {
+      const textAvail = availW - (LEGEND_DOT_R * 2 + LEGEND_ENTRY_DOT_GAP + LEGEND_ENTRY_TRAIL);
+      if (textAvail > 0) {
+        displayValue = truncateLegendText(
+          entry.value,
+          LEGEND_ENTRY_FONT_SIZE,
+          textAvail
+        );
+        ew = LEGEND_DOT_R * 2 + LEGEND_ENTRY_DOT_GAP + measureLegendText(displayValue, LEGEND_ENTRY_FONT_SIZE) + LEGEND_ENTRY_TRAIL;
+      }
+    }
+    const dotCx = rowX + LEGEND_DOT_R;
+    const dotCy = ey + LEGEND_HEIGHT / 2;
+    const textX = rowX + LEGEND_DOT_R * 2 + LEGEND_ENTRY_DOT_GAP;
+    const textY = ey + LEGEND_HEIGHT / 2;
+    entries.push({
+      value: entry.value,
+      color: entry.color,
+      x: rowX,
+      y: ey,
+      width: ew,
+      dotCx,
+      dotCy,
+      textX,
+      textY,
+      ...displayValue !== void 0 && { displayValue }
+    });
+    rowX += ew;
+  }
+  const totalRows = info.entryRows;
+  const capsuleH = totalRows * LEGEND_HEIGHT;
+  return {
+    groupName: group.name,
+    x: 0,
+    y: 0,
+    width: info.width,
+    height: capsuleH,
+    pill,
+    entries,
+    ...info.moreCount > 0 && { moreCount: info.moreCount },
+    ...addonWidth > 0 && { addonX: LEGEND_CAPSULE_PAD + pw + 4 }
+  };
+}
+function layoutRows(activeCapsule, pills, controls, groupAvailW, containerWidth, totalControlsW, alignLeft = false, controlsGroup) {
+  const rows = [];
+  const groupItems = [];
+  if (activeCapsule) groupItems.push(activeCapsule);
+  groupItems.push(...pills);
+  const gearW = controlsGroup ? controlsGroup.width + LEGEND_GROUP_GAP : 0;
+  let currentRowItems = [];
+  let currentRowW = 0;
+  let rowY = 0;
+  for (const item of groupItems) {
+    const itemW = item.width + LEGEND_GROUP_GAP;
+    if (currentRowW + item.width > groupAvailW && currentRowItems.length > 0) {
+      if (!alignLeft) {
+        const rowGearW = rows.length === 0 ? gearW : 0;
+        centerRowItems(
+          currentRowItems,
+          containerWidth,
+          totalControlsW,
+          rowGearW
+        );
+      }
+      rows.push({ y: rowY, items: currentRowItems });
+      rowY += LEGEND_HEIGHT;
+      currentRowItems = [];
+      currentRowW = 0;
+    }
+    item.x = currentRowW;
+    item.y = rowY;
+    currentRowItems.push(item);
+    currentRowW += itemW;
+  }
+  if (controls.length > 0) {
+    let cx = containerWidth;
+    for (let i = controls.length - 1; i >= 0; i--) {
+      const ctrl = controls[i];
+      cx -= ctrl.width;
+      ctrl.x = cx;
+      ctrl.y = 0;
+      cx -= CONTROL_GAP;
+    }
+    if (rows.length > 0) {
+      rows[0].items.push(...controls);
+    } else if (currentRowItems.length > 0) {
+      currentRowItems.push(...controls);
+    } else {
+      currentRowItems.push(...controls);
+    }
+  }
+  if (currentRowItems.length > 0) {
+    if (!alignLeft) {
+      centerRowItems(currentRowItems, containerWidth, totalControlsW, gearW);
+    }
+    rows.push({ y: rowY, items: currentRowItems });
+  }
+  if (controlsGroup) {
+    const row0Items = rows[0]?.items ?? [];
+    const groupItemsInRow0 = row0Items.filter(
+      (it) => "groupName" in it
+    );
+    if (groupItemsInRow0.length > 0) {
+      const last = groupItemsInRow0[groupItemsInRow0.length - 1];
+      controlsGroup.x = last.x + last.width + LEGEND_GROUP_GAP;
+    } else {
+      controlsGroup.x = (containerWidth - controlsGroup.width) / 2;
+    }
+    controlsGroup.y = 0;
+  }
+  if (rows.length === 0) {
+    rows.push({ y: 0, items: [] });
+  }
+  return rows;
+}
+function centerRowItems(items, containerWidth, totalControlsW, controlsGroupW = 0) {
+  const groupItems = items.filter((it) => "groupName" in it);
+  if (groupItems.length === 0) return;
+  const totalGroupW = groupItems.reduce((s, it) => s + it.width, 0) + (groupItems.length - 1) * LEGEND_GROUP_GAP;
+  const availW = containerWidth - (totalControlsW > 0 ? totalControlsW + LEGEND_GROUP_GAP * 2 : 0) - controlsGroupW;
+  const offset = Math.max(0, (availW - totalGroupW) / 2);
+  let x = offset;
+  for (const item of groupItems) {
+    item.x = x;
+    x += item.width + LEGEND_GROUP_GAP;
+  }
+}
+function getLegendReservedHeight(config, state, containerWidth) {
+  const layout = computeLegendLayout(config, state, containerWidth);
+  return layout.height;
+}
+function getMaxLegendReservedHeight(config, containerWidth) {
+  const groups = config.groups;
+  if (groups.length === 0) return LEGEND_HEIGHT;
+  const addon = config.capsulePillAddonWidth ?? 0;
+  let max = LEGEND_HEIGHT;
+  for (const g of groups) {
+    if (g.entries.length === 0) continue;
+    const info = capsuleWidth(g.name, g.entries, containerWidth, addon);
+    const h = info.entryRows * LEGEND_HEIGHT;
+    if (h > max) max = h;
+  }
+  return max;
+}
+
+export {
+  compactNumber,
+  controlsGroupCapsuleWidth,
+  computeLegendLayout,
+  getLegendReservedHeight,
+  getMaxLegendReservedHeight
+};
+//# sourceMappingURL=chunk-YAA6IID3.js.map