@diagrammo/dgmo 0.53.0 → 0.55.0

package/dist/{chunk-YR43LJT5.js → chunk-PV7ND5WL.js}

@@ -12,12 +12,16 @@ import {
   NODE_STROKE_WIDTH,
   SEPARATOR_GAP
 } from "./chunk-3CIOJ5YJ.js";
+import {
+  layoutInlineHeader
+} from "./chunk-US3P2DQO.js";
 import {
   renderIntegratedLegend
-} from "./chunk-W5KMNC5U.js";
+} from "./chunk-ASPS5O6F.js";
 import {
+  getLegendExtent,
   getMaxLegendReservedHeight
-} from "./chunk-774C2FF3.js";
+} from "./chunk-GRXPFBYC.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
@@ -27,25 +31,29 @@ import {
   FONT_FAMILY
 } from "./chunk-6KFWC4CO.js";
 import {
-  contrastText,
-  mix,
-  shapeFill,
-  themeBaseBg
-} from "./chunk-JYDMBWRP.js";
+  EMPHASIS_DIM_OPACITY
+} from "./chunk-2CW5ZTNH.js";
 import {
   LEGEND_GROUP_GAP
-} from "./chunk-4RGZFA7H.js";
+} from "./chunk-Q5IHQ4NW.js";
 import {
   measureText
 } from "./chunk-4ASYQ347.js";
+import {
+  contrastText,
+  mix,
+  shapeFill,
+  themeBaseBg
+} from "./chunk-JYDMBWRP.js";
 import {
   resolveTagColor,
   tagAttrKey
-} from "./chunk-CMVZWP32.js";
+} from "./chunk-JR7Q6GHE.js";
 import {
   fillModeFromOptions,
+  legendInlineRequested,
   legendSuppressed
-} from "./chunk-YJVA3QUU.js";
+} from "./chunk-A2ARDILY.js";
 import {
   resolveColor
 } from "./chunk-ZKPPI6BF.js";
@@ -56,7 +64,7 @@ var KEY_X = 10;
 var KEY_VALUE_GAP = 6;
 var BAR_DOT_R = 3.5;
 var TITLE_RESERVE = 40;
-var DIM_OPACITY = 0.28;
+var DIM_OPACITY = EMPHASIS_DIM_OPACITY;
 var ROMAN = [
   [10, "X"],
   [9, "IX"],
@@ -113,7 +121,33 @@ function renderFamilyForExport(container, parsed, layout, palette, isDark, opts
   const contentH = layout.height;
   const W = opts.fit?.width ?? opts.exportDims?.width ?? contentW + PAD * 2;
   const legendReserve = hasLegend ? getMaxLegendReservedHeight(legendConfig, W) + LEGEND_GROUP_GAP : 0;
-  const chrome = titleReserve + legendReserve;
+  const inlineRequested = legendInlineRequested(parsed.options);
+  const legendExtent = inlineRequested && hasLegend ? getLegendExtent(
+    {
+      groups: legendGroups,
+      position: {
+        placement: "top-center",
+        titleRelation: "inline-with-title"
+      },
+      mode: opts.exportMode ? "export" : "preview",
+      showInactivePills: true
+    },
+    { activeGroup: activeTagGroup },
+    W
+  ) : { width: 0, height: 0 };
+  const header = layoutInlineHeader({
+    requested: inlineRequested,
+    title: parsed.title ?? "",
+    hasLegend,
+    legendWidth: legendExtent.width,
+    legendHeight: legendExtent.height,
+    containerWidth: W,
+    titleBandHeight: titleReserve,
+    legendReserve,
+    titleBaselineY: TITLE_Y,
+    titleFontSize: TITLE_FONT_SIZE
+  });
+  const chrome = titleReserve + (header.inline ? 0 : legendReserve);
   let scale = 1;
   let H;
   if (opts.fit) {
@@ -130,12 +164,21 @@ function renderFamilyForExport(container, parsed, layout, palette, isDark, opts
     ".family-focus-icon{opacity:0;transition:opacity .15s ease;pointer-events:none}.family-card:hover .family-focus-icon{opacity:.6;pointer-events:all}.family-focus-icon:hover{opacity:1}"
   );
   if (parsed.title) {
-    svg.append("text").attr("x", W / 2).attr("y", TITLE_Y).attr("text-anchor", "middle").attr("font-size", TITLE_FONT_SIZE).attr("font-weight", TITLE_FONT_WEIGHT).attr("fill", palette.text).text(parsed.title);
+    svg.append("text").attr("class", "chart-title").attr("x", header.titleX).attr("y", TITLE_Y).attr("text-anchor", header.titleAnchor).attr("font-size", TITLE_FONT_SIZE).attr("font-weight", TITLE_FONT_WEIGHT).attr("fill", palette.text).text(parsed.title);
   }
   if (hasLegend) {
-    const legendParent = svg.append("g").attr("transform", `translate(0, ${titleReserve})`);
+    const legendParent = svg.append("g").attr(
+      "transform",
+      header.inline ? `translate(${header.legendX}, ${header.legendY})` : `translate(0, ${titleReserve})`
+    );
     renderIntegratedLegend(legendParent, {
       ...legendConfig,
+      // Inline → left-origin so the wrapper's right-flush translate lands the
+      // legend at the chart's right edge; stacked → centered below the title.
+      position: {
+        placement: "top-center",
+        titleRelation: header.inline ? "inline-with-title" : "below-title"
+      },
       palette,
       isDark,
       width: W,
@@ -274,4 +317,4 @@ export {
   renderFamilyForExport,
   renderFamily
 };
-//# sourceMappingURL=chunk-YR43LJT5.js.map
+//# sourceMappingURL=chunk-PV7ND5WL.js.map

package/dist/{chunk-QI3BOLQB.js → chunk-Q5CMQVWF.js}

@@ -1,6 +1,6 @@
 import {
   renderIntegratedLegend
-} from "./chunk-W5KMNC5U.js";
+} from "./chunk-ASPS5O6F.js";
 import {
   FONT_FAMILY
 } from "./chunk-6KFWC4CO.js";
@@ -18,7 +18,7 @@ import {
   resolveActiveTagGroup,
   resolveTagColor,
   tagAttrKey
-} from "./chunk-CMVZWP32.js";
+} from "./chunk-JR7Q6GHE.js";
 import {
   resolveColor
 } from "./chunk-ZKPPI6BF.js";
@@ -114,7 +114,7 @@ function renderFigureBody(fig, view, parts, partColor, emphKey, form, palette, i
         out += `<path${dataLine} d="${d}" fill="${color}" fill-opacity="0.5" stroke="${color}" stroke-width="1.5"/>`;
       }
     } else {
-      const lightFill = mix(color, palette.bg, 70);
+      const lightFill = mix(color, themeBaseBg(palette, isDark), 25);
       for (const d of paths) {
         out += `<path${dataLine} d="${d}" fill="${lightFill}" stroke="${color}" stroke-width="1.5"/>`;
       }
@@ -334,4 +334,4 @@ export {
   renderBody,
   renderBodyForExport
 };
-//# sourceMappingURL=chunk-QI3BOLQB.js.map
+//# sourceMappingURL=chunk-Q5CMQVWF.js.map

package/dist/{chunk-4RGZFA7H.js → chunk-Q5IHQ4NW.js}

@@ -2,6 +2,9 @@ import {
   measureText,
   truncateText
 } from "./chunk-4ASYQ347.js";
+import {
+  mix
+} from "./chunk-JYDMBWRP.js";
 
 // src/utils/legend-constants.ts
 var LEGEND_HEIGHT = 28;
@@ -17,6 +20,12 @@ var LEGEND_EYE_SIZE = 14;
 var LEGEND_EYE_GAP = 6;
 var LEGEND_ICON_W = 20;
 var LEGEND_MAX_ENTRY_ROWS = 3;
+function legendChromeColors(palette, isDark) {
+  return {
+    groupBg: isDark ? mix(palette.surface, palette.bg, 50) : mix(palette.surface, palette.textMuted, 98),
+    pillBorder: mix(palette.textMuted, palette.bg, 50)
+  };
+}
 var measureLegendText = measureText;
 var truncateLegendText = truncateText;
 var EYE_OPEN_PATH = "M1 7s2.5-5 6-5 6 5 6 5-2.5 5-6 5-6-5-6-5z M7 9.5a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z";
@@ -40,6 +49,7 @@ export {
   LEGEND_EYE_GAP,
   LEGEND_ICON_W,
   LEGEND_MAX_ENTRY_ROWS,
+  legendChromeColors,
   measureLegendText,
   truncateLegendText,
   EYE_OPEN_PATH,
@@ -49,4 +59,4 @@ export {
   LEGEND_TOGGLE_OFF_OPACITY,
   LEGEND_GEAR_PILL_W
 };
-//# sourceMappingURL=chunk-4RGZFA7H.js.map
+//# sourceMappingURL=chunk-Q5IHQ4NW.js.map