@diagrammo/dgmo 0.50.1 → 0.50.2

package/dist/auto.mjs

@@ -13545,6 +13545,8 @@ function parseChart(content, palette) {
         result.solidFill = true;
       } else if (firstToken === "no-title") {
         result.noTitle = true;
+      } else if (firstToken === "no-auto-y") {
+        result.noAutoY = true;
       } else if (firstToken === "fill") {
         result.fill = true;
       } else if (firstToken === "hole") {
@@ -13839,6 +13841,7 @@ var init_chart = __esm({
       "orientation-horizontal",
       "solid-fill",
       "no-title",
+      "no-auto-y",
       "fill",
       "hole"
     ]);
@@ -31924,7 +31927,14 @@ function renderLine(svg, chart, width, height, colors, palette, isDark, textColo
           hi = Math.max(hi, v);
         }
     if (!isFinite(lo)) return [0, 1];
-    if (lo > 0) lo = 0;
+    if (chart.noAutoY) {
+      if (lo > 0) lo = 0;
+    } else {
+      const pad3 = (hi - lo) * 0.05 || Math.abs(hi) * 0.05 || 1;
+      const nlo = lo - pad3;
+      lo = lo >= 0 && nlo < 0 ? 0 : nlo;
+      hi = hi + pad3;
+    }
     if (lo === hi) hi = lo + 1;
     return [lo, hi];
   };
@@ -72501,6 +72511,7 @@ function haloRect(svg, x, y, w, h, rx, C) {
 function pickBand(nowMs, resolvedMs, hasTime) {
   const days = dayDelta(nowMs, resolvedMs);
   if (hasTime && days <= 0) return "clock";
+  if (days > 3 * 365) return "years";
   if (days > 365) return "year";
   if (days > 92) return "months";
   if (days > 18) return "monthgrid";
@@ -72531,9 +72542,31 @@ function monthGridLayout(nowMs, resolvedMs, contentW) {
   }
   return { months, dim };
 }
+function yearsLayout(nowMs, resolvedMs) {
+  const y0 = new Date(nowMs).getFullYear();
+  const y1 = new Date(resolvedMs).getFullYear();
+  const d0 = Math.floor(y0 / 10) * 10;
+  const d1 = Math.floor(y1 / 10) * 10;
+  return { d0, d1, rows: (d1 - d0) / 10 + 1 };
+}
 function bandHeightFor(kind, nowMs, resolvedMs, contentW) {
   const clamp5 = (v, lo, hi) => Math.max(lo, Math.min(hi, v));
   switch (kind) {
+    case "years": {
+      const { rows } = yearsLayout(nowMs, resolvedMs);
+      const rowGap = 11;
+      const labW = 54;
+      const gap = 7;
+      const cellW = (contentW - labW - 10 * gap) / 10;
+      let cellH = clamp5(cellW * 0.5, 26, 40);
+      const MAX = 380;
+      let total = rows * cellH + (rows - 1) * rowGap;
+      if (total > MAX) {
+        cellH = Math.max(9, (MAX - (rows - 1) * rowGap) / rows);
+        total = rows * cellH + (rows - 1) * rowGap;
+      }
+      return total;
+    }
     case "year": {
       const R = new Date(resolvedMs).getFullYear() - new Date(nowMs).getFullYear() + 1;
       const yearW = 66;
@@ -72572,6 +72605,61 @@ function bandHeightFor(kind, nowMs, resolvedMs, contentW) {
       return clamp5(contentW * 0.22, 125, 170);
   }
 }
+function vizYears(svg, g, nowMs, resolvedMs, C) {
+  const now = new Date(nowMs);
+  const ev = new Date(resolvedMs);
+  const nowY = now.getFullYear();
+  const evY = ev.getFullYear();
+  const { d0, rows } = yearsLayout(nowMs, resolvedMs);
+  const labW = 54;
+  const gap = 7;
+  const rowGap = 11;
+  const rowH = (g.height - rowGap * (rows - 1)) / rows;
+  const cellH = rowH;
+  const cellW = (g.contentW - labW - 10 * gap) / 10;
+  const rx = Math.min(6, Math.min(cellW, cellH) * 0.22);
+  const showLabel = cellH >= 18 && cellW >= 22;
+  const yrFont = Math.min(12, cellW * 0.34, cellH * 0.5);
+  for (let r = 0; r < rows; r++) {
+    const dec = d0 + r * 10;
+    const ry = g.top + r * (rowH + rowGap);
+    aText(
+      svg,
+      g.left + labW - 12,
+      ry + rowH / 2,
+      Math.min(14, rowH * 0.5),
+      C.muted,
+      800,
+      "end",
+      `${dec}s`,
+      { "dominant-baseline": "central" }
+    );
+    for (let i = 0; i < 10; i++) {
+      const yr = dec + i;
+      const before = yr < nowY;
+      const isNow = yr === nowY;
+      const isEv = yr === evY;
+      const between = yr > nowY && yr < evY;
+      const st = isEv ? roleStyle(C, "event") : isNow ? roleStyle(C, "today") : between ? gradStyle(C, (yr - nowY) / (evY - nowY)) : roleStyle(C, before ? "past" : "future");
+      const x = g.left + labW + i * (cellW + gap);
+      aRect(svg, x, ry, cellW, cellH, rx, st.fill, st.stroke, 1);
+      if (isEv) haloRect(svg, x, ry, cellW, cellH, rx, C);
+      if (showLabel) {
+        aText(
+          svg,
+          x + cellW / 2,
+          ry + cellH / 2,
+          yrFont,
+          st.text,
+          isNow || isEv ? 800 : 650,
+          "middle",
+          String(yr),
+          { "dominant-baseline": "central" }
+        );
+      }
+    }
+  }
+}
 function vizYear(svg, g, nowMs, resolvedMs, C) {
   const now = new Date(nowMs);
   const ev = new Date(resolvedMs);
@@ -73083,6 +73171,8 @@ function pad22(n) {
 }
 function drawBand2(svg, kind, g, nowMs, resolvedMs, C) {
   switch (kind) {
+    case "years":
+      return vizYears(svg, g, nowMs, resolvedMs, C);
     case "year":
       return vizYear(svg, g, nowMs, resolvedMs, C);
     case "months":
@@ -73762,13 +73852,13 @@ function drawRow(svg, entry, index, parsed, now, rowTop, rowH, geom, col) {
     const mainFont = 48;
     const baseY = center + 16;
     const capTop = baseY - mainFont * 0.7;
-    g.append("text").attr("data-dgmo-clock-digital", "").attr("data-dgmo-clock-digital-part", "main").attr("x", contentLeft).attr("y", baseY).attr("fill", timeColor).attr("font-family", FONT_FAMILY).attr("font-size", mainFont).attr("font-weight", 600).style("font-variant-numeric", "tabular-nums").text(ts.main);
     const sf = 20;
     const mainW = [...ts.main].reduce(
-      (w, c) => w + mainFont * (c === ":" ? 0.28 : 0.6),
+      (w, c) => w + mainFont * (c === ":" ? 0.334 : 0.6),
       0
     );
     const stackX = contentLeft + mainW + 5;
+    g.append("text").attr("data-dgmo-clock-digital", "").attr("data-dgmo-clock-digital-part", "main").attr("x", contentLeft).attr("y", baseY).attr("fill", timeColor).attr("font-family", FONT_FAMILY).attr("font-size", mainFont).attr("font-weight", 600).attr("textLength", mainW).attr("lengthAdjust", "spacing").style("font-variant-numeric", "tabular-nums").text(ts.main);
     g.append("text").attr("data-dgmo-clock-digital-part", "sec").attr("x", stackX).attr("y", capTop + sf * 0.72).attr("fill", muted).attr("font-family", FONT_FAMILY).attr("font-size", sf).attr("font-weight", 600).style("font-variant-numeric", "tabular-nums").text(`:${ts.sec}`);
     if (ts.ap)
       g.append("text").attr("data-dgmo-clock-digital-part", "ap").attr("x", stackX).attr("y", baseY).attr("fill", muted).attr("font-family", FONT_FAMILY).attr("font-size", sf).attr("font-weight", 600).text(ts.ap);
@@ -73907,13 +73997,13 @@ function drawColumns(body, parsed, now, top, geom, col) {
       const sf = 13;
       const tf = fitFont(ts.main, 44, innerW - 30, 20);
       const mainW = [...ts.main].reduce(
-        (w, c) => w + tf * (c === ":" ? 0.28 : 0.6),
+        (w, c) => w + tf * (c === ":" ? 0.334 : 0.6),
         0
       );
       const stackW = Math.max(estWidth(`:${ts.sec}`, sf), estWidth(ts.ap, sf));
       const gLeft = cx - (mainW + 7 + stackW) / 2;
       const baseY = cy + tf * 0.34;
-      g.append("text").attr("data-dgmo-clock-digital", "").attr("data-dgmo-clock-digital-part", "main").attr("x", gLeft).attr("y", baseY).attr("fill", timeColor).attr("font-family", FONT_FAMILY).attr("font-size", tf).attr("font-weight", 600).style("font-variant-numeric", "tabular-nums").text(ts.main);
+      g.append("text").attr("data-dgmo-clock-digital", "").attr("data-dgmo-clock-digital-part", "main").attr("x", gLeft).attr("y", baseY).attr("fill", timeColor).attr("font-family", FONT_FAMILY).attr("font-size", tf).attr("font-weight", 600).attr("textLength", mainW).attr("lengthAdjust", "spacing").style("font-variant-numeric", "tabular-nums").text(ts.main);
       const stackX = gLeft + mainW + 7;
       g.append("text").attr("data-dgmo-clock-digital-part", "sec").attr("x", stackX).attr("y", baseY - tf * 0.32).attr("fill", muted).attr("font-family", FONT_FAMILY).attr("font-size", sf).attr("font-weight", 500).text(`:${ts.sec}`);
       if (ts.ap)
@@ -81465,7 +81555,7 @@ async function render(content, options) {
     try {
       const raw = await renderDataChartD3(renderContent, theme, paletteColors);
       const svg2 = injectHoverStyles(raw, chartType, { bakeHover });
-      return { svg: svg2, diagnostics };
+      return { svg: svg2, diagnostics, chartType: chartType ?? void 0 };
     } finally {
       releaseDom();
     }
@@ -81506,7 +81596,7 @@ async function render(content, options) {
     } catch {
     }
   }
-  return { svg, diagnostics };
+  return { svg, diagnostics, chartType: chartType ?? void 0 };
 }
 
 // src/countdown/ticker.ts
@@ -82714,6 +82804,7 @@ function resolveBlockOptions(opts) {
     mode,
     palette: opts.palette ?? "slate",
     colorMode: opts.colorMode ?? "auto",
+    background: opts.background ?? "auto",
     showSource: opts.showSource ?? showcase,
     showCopy: opts.showCopy ?? showcase,
     showExpand: opts.showExpand ?? showcase,
@@ -82816,7 +82907,7 @@ var CSS = AUTO_BASE_CSS + "\n" + BLOCK_CSS + "\n" + darkScopedBlockCss(BLOCK_CSS
 
 // src/auto/shared.ts
 init_safe_href();
-var VERSION = "0.50.1";
+var VERSION = "0.50.2";
 var ARIA_LABEL_MAX = 200;
 var COPIED_INTERACTION_MS = 1500;
 var LOG_PREFIX = "[dgmo]";

package/dist/block.d.ts

@@ -0,0 +1,130 @@
+/**
+ * Canonical stylesheet for the standard DGMO embed block (BL-114).
+ *
+ * Shipped two ways: `dist/block.css` (extracted at build time by
+ * tsup.config.ts, same regex mechanism as auto.css) for `<link>`/import
+ * consumers, and the `BLOCK_CSS` string export for embedders that inject a
+ * `<style>` tag.
+ *
+ * Dark mode keys off `[data-theme="dark"]`. Hosts with a different signal
+ * (`html.dark`, `body.theme-dark`) rewrite the selector at their build step —
+ * fumadocs-dgmo/nextra-dgmo's build-css.mjs is the reference adapter.
+ *
+ * The `.dgmo-tok-*` role colors mirror LIGHT_ROLE_STYLES (light) and
+ * NORD_ROLE_STYLES (dark) from editor/highlight-api.ts. A parity test
+ * (tests/block.test.ts) guards against drift — update both when either
+ * changes.
+ *
+ * IMPORTANT: keep this a single pure template literal — the build extracts it
+ * with a regex, so no interpolation or computed values.
+ */
+declare const BLOCK_CSS: string;
+
+/**
+ * Standard DGMO embed block (BL-114) — the ONE canonical
+ * "diagram + source chrome" HTML builder shared by every embed surface:
+ * remark-dgmo (and through it the astro/docusaurus/fumadocs/nextra/vitepress
+ * wrappers), the `/auto` script-tag drop-in, `<dgmo-diagram>`, dgmo-mcp HTML
+ * reports, the marketing site, and the Obsidian plugin.
+ *
+ * Chrome contract (user-approved 2026-07-05): the diagram is the star. A slim
+ * icon toolbar sits in a reserved row below the SVG, invisible until the
+ * block is hovered/focused or the source is open. Four wordless icon
+ * buttons — `</>` toggles the hidden source panel, expand (full-screen),
+ * copy, open-in-editor. No disclosure triangle, no text labels. The toolbar
+ * IS the <summary> of a native <details>, so show/hide works with zero
+ * JavaScript; copy and expand need a small delegated click handler
+ * (remark-dgmo's `bindDgmo` is the reference — expand's lightbox helper is
+ * mirrored across every client surface, same as copy).
+ *
+ * Markup vocabulary: `figure.dgmo` (`--diagram`/`--showcase`/`--error`),
+ * `.dgmo-light`/`.dgmo-dark` (dual color-mode) or `.dgmo-svg` (single),
+ * `details.dgmo-source-wrap > summary.dgmo-toolbar`, `.dgmo-source-inner`,
+ * `pre.dgmo-pre > span.dgmo-code` with `.dgmo-tok-<role>` token spans. While
+ * the source is open the wrapper gets one shared frame (`:has()` rule) so
+ * diagram + code read as a single unit. No visible caption — `title` becomes
+ * the wrapper's aria-label. Styles ship as `BLOCK_CSS` / `dist/block.css`.
+ */
+
+/** Default hosted editor used by "Open in editor" links. */
+declare const EDITOR_BASE_URL = "https://online.diagrammo.app";
+type BlockMode = 'diagram' | 'showcase';
+/**
+ * Color-mode strategy for the emitted SVG(s).
+ * - `auto` — render twice (light + dark) and let CSS flip visibility.
+ * - `light` / `dark` / `transparent` — single render with that theme.
+ */
+type BlockColorMode = 'auto' | 'light' | 'dark' | 'transparent';
+interface DgmoBlockOptions {
+    /** `diagram` (default): SVG only. `showcase`: SVG + source chrome. */
+    mode?: BlockMode;
+    /** Palette name. Default `slate`; unknown names warn + fall back. */
+    palette?: string;
+    /** Default `auto` (dual light/dark render). */
+    colorMode?: BlockColorMode;
+    /**
+     * Embed background. `auto` (default) strips the theme's opaque root
+     * background so the diagram blends into the host page — except for
+     * background-meaningful types like `map`, which stay opaque. `transparent` /
+     * `opaque` force the choice regardless of type (the embedder opt-out).
+     */
+    background?: 'auto' | 'transparent' | 'opaque';
+    /** Default: true in showcase mode, false in diagram mode. */
+    showSource?: boolean;
+    /** Default: true in showcase mode, false in diagram mode. */
+    showCopy?: boolean;
+    /**
+     * Show the expand (full-screen) toolbar button. Default: true in showcase
+     * mode, false in diagram mode. Needs the client lightbox handler to do
+     * anything (mirrored across surfaces); markup-only surfaces can omit it.
+     */
+    showExpand?: boolean;
+    /** Default: true in showcase mode, false in diagram mode. */
+    showOpenInEditor?: boolean;
+    /** Base URL for the open-in-editor link. Default: online.diagrammo.app. */
+    editorBaseUrl?: string;
+    /** Outer wrapper element. Default `figure`. */
+    wrapper?: 'figure' | 'div';
+    /** Base class for the wrapper (styling hook). Default `dgmo`. */
+    className?: string;
+    /** Extra classes appended to every emitted wrapper (compat shims). */
+    legacyClassNames?: string[];
+    /**
+     * Accessible name for the block (`aria-label` on the wrapper). NOT rendered
+     * visually — the chart's visible title belongs in the DGMO source itself.
+     */
+    title?: string;
+    /** Receives palette-fallback warnings. Default: console.warn. */
+    onWarn?: (message: string) => void;
+}
+interface DgmoBlockResult {
+    html: string;
+    diagnostics: Array<{
+        message: string;
+        line?: number;
+        severity?: string;
+    }>;
+}
+/**
+ * Render one ```dgmo source block to the standard embed HTML. Async because
+ * it runs the full dgmo render pipeline (once per color mode).
+ *
+ * Render errors are NOT caught here — callers decide between throwing,
+ * `errorBlockHtml()`, or their own fallback.
+ */
+declare function renderDgmoBlock(source: string, options?: DgmoBlockOptions): Promise<DgmoBlockResult>;
+/**
+ * Assemble the standard block around already-rendered SVG markup. Exposed for
+ * surfaces that render through their own pipeline (e.g. dgmo-mcp's
+ * renderPipeline) but must emit the canonical chrome. `svgsHtml` must be the
+ * `.dgmo-light`+`.dgmo-dark` (or `.dgmo-svg`) wrapper divs.
+ */
+declare function buildDgmoBlockHtml(source: string, svgsHtml: string, options?: DgmoBlockOptions): string;
+/**
+ * Standard error card for a block that failed to parse/render. Same shape on
+ * every surface: `.dgmo--error` with `role="alert"`, message + offending
+ * source.
+ */
+declare function errorBlockHtml(err: unknown, source: string, options?: Pick<DgmoBlockOptions, 'className' | 'legacyClassNames'>): string;
+
+export { BLOCK_CSS, type BlockColorMode, type BlockMode, type DgmoBlockOptions, type DgmoBlockResult, EDITOR_BASE_URL, buildDgmoBlockHtml, errorBlockHtml, renderDgmoBlock };

package/dist/block.js

@@ -1,16 +1,17 @@
 import {
+  defaultEmbedBackground,
   normalizeSvgForEmbed,
   renderErrorCard
-} from "./chunk-YIA4LEX4.js";
+} from "./chunk-DN66GPY5.js";
 import {
   encodeDiagramUrl,
   render
-} from "./chunk-ZAD4HV2G.js";
+} from "./chunk-SVTI362O.js";
 import "./chunk-66RUL3XF.js";
 import "./chunk-YRYKTYMQ.js";
 import "./chunk-YYVTBZZC.js";
 import "./chunk-HEVYAHLW.js";
-import "./chunk-VVZRV54S.js";
+import "./chunk-KQ57MHRO.js";
 import "./chunk-Q4V4XQWV.js";
 import "./chunk-BTUTZMPT.js";
 import {
@@ -22,7 +23,7 @@ import "./chunk-QXKWYZNR.js";
 import "./chunk-PGEGPSCZ.js";
 import "./chunk-3UIKSPFB.js";
 import "./chunk-BDXC7MDK.js";
-import "./chunk-4S52SK6G.js";
+import "./chunk-QJJZSROI.js";
 import "./chunk-HGN652MU.js";
 import "./chunk-U6EQI3U6.js";
 import "./chunk-7UEMZREK.js";
@@ -30,7 +31,7 @@ import "./chunk-A4GOY3PE.js";
 import "./chunk-6KFWC4CO.js";
 import "./chunk-HQCHYB5F.js";
 import "./chunk-5LWQH6QV.js";
-import "./chunk-XDXNDSKO.js";
+import "./chunk-XEGTMVYY.js";
 import "./chunk-I2WKW7C7.js";
 import "./chunk-TSA237IM.js";
 import "./chunk-6IAA2QQ2.js";
@@ -952,6 +953,7 @@ function resolveBlockOptions(opts) {
     mode,
     palette: opts.palette ?? "slate",
     colorMode: opts.colorMode ?? "auto",
+    background: opts.background ?? "auto",
     showSource: opts.showSource ?? showcase,
     showCopy: opts.showCopy ?? showcase,
     showExpand: opts.showExpand ?? showcase,
@@ -969,8 +971,10 @@ async function renderDgmoBlock(source, options = {}) {
   const trimmed = source.trim();
   const palette = resolvePaletteOrFallback(opts.palette, opts.onWarn);
   const diagnostics = [];
+  let chartType;
   const renderTheme = async (theme) => {
     const r = await render(trimmed, { palette: palette.id, theme });
+    chartType = r.chartType;
     diagnostics.push(...r.diagnostics);
     const errors = r.diagnostics.filter((d) => d.severity === "error");
     return errors.length ? renderErrorCard(errors, trimmed, palette, theme) : r.svg;
@@ -981,10 +985,12 @@ async function renderDgmoBlock(source, options = {}) {
       renderTheme("light"),
       renderTheme("dark")
     ]);
-    svgsHtml = `<div class="${escapeAttr(innerClasses(opts, "dgmo-light"))}">${normalizeSvgForEmbed(light)}</div><div class="${escapeAttr(innerClasses(opts, "dgmo-dark"))}">${normalizeSvgForEmbed(dark)}</div>`;
+    const background = opts.background === "auto" ? defaultEmbedBackground(chartType) : opts.background;
+    svgsHtml = `<div class="${escapeAttr(innerClasses(opts, "dgmo-light"))}">${normalizeSvgForEmbed(light, { background })}</div><div class="${escapeAttr(innerClasses(opts, "dgmo-dark"))}">${normalizeSvgForEmbed(dark, { background })}</div>`;
   } else {
     const svg = await renderTheme(opts.colorMode);
-    svgsHtml = `<div class="${escapeAttr(innerClasses(opts, "dgmo-svg"))}">${normalizeSvgForEmbed(svg)}</div>`;
+    const background = opts.background === "auto" ? defaultEmbedBackground(chartType) : opts.background;
+    svgsHtml = `<div class="${escapeAttr(innerClasses(opts, "dgmo-svg"))}">${normalizeSvgForEmbed(svg, { background })}</div>`;
   }
   return { html: assembleBlock(trimmed, svgsHtml, opts), diagnostics };
 }

package/dist/{charts-d3-LR6D3D7A.js → charts-d3-MUW3LTML.js}

@@ -2,7 +2,7 @@ import {
   D3_DATA_CHART_TYPES,
   renderDataChartD3,
   supportsD3DataChart
-} from "./chunk-4S52SK6G.js";
+} from "./chunk-QJJZSROI.js";
 import "./chunk-HGN652MU.js";
 import "./chunk-U6EQI3U6.js";
 import "./chunk-7UEMZREK.js";
@@ -10,7 +10,7 @@ import "./chunk-A4GOY3PE.js";
 import "./chunk-6KFWC4CO.js";
 import "./chunk-HQCHYB5F.js";
 import "./chunk-5LWQH6QV.js";
-import "./chunk-XDXNDSKO.js";
+import "./chunk-XEGTMVYY.js";
 import "./chunk-R3XI2VC7.js";
 import "./chunk-P6T66CCZ.js";
 import "./chunk-FJUNPCYI.js";
@@ -23,4 +23,4 @@ export {
   renderDataChartD3,
   supportsD3DataChart
 };
-//# sourceMappingURL=charts-d3-LR6D3D7A.js.map
+//# sourceMappingURL=charts-d3-MUW3LTML.js.map

package/dist/{chunk-7PQYTZMA.js → chunk-5WFIYXQ6.js}

@@ -457,13 +457,13 @@ function drawRow(svg, entry, index, parsed, now, rowTop, rowH, geom, col) {
     const mainFont = 48;
     const baseY = center + 16;
     const capTop = baseY - mainFont * 0.7;
-    g.append("text").attr("data-dgmo-clock-digital", "").attr("data-dgmo-clock-digital-part", "main").attr("x", contentLeft).attr("y", baseY).attr("fill", timeColor).attr("font-family", FONT_FAMILY).attr("font-size", mainFont).attr("font-weight", 600).style("font-variant-numeric", "tabular-nums").text(ts.main);
     const sf = 20;
     const mainW = [...ts.main].reduce(
-      (w, c) => w + mainFont * (c === ":" ? 0.28 : 0.6),
+      (w, c) => w + mainFont * (c === ":" ? 0.334 : 0.6),
       0
     );
     const stackX = contentLeft + mainW + 5;
+    g.append("text").attr("data-dgmo-clock-digital", "").attr("data-dgmo-clock-digital-part", "main").attr("x", contentLeft).attr("y", baseY).attr("fill", timeColor).attr("font-family", FONT_FAMILY).attr("font-size", mainFont).attr("font-weight", 600).attr("textLength", mainW).attr("lengthAdjust", "spacing").style("font-variant-numeric", "tabular-nums").text(ts.main);
     g.append("text").attr("data-dgmo-clock-digital-part", "sec").attr("x", stackX).attr("y", capTop + sf * 0.72).attr("fill", muted).attr("font-family", FONT_FAMILY).attr("font-size", sf).attr("font-weight", 600).style("font-variant-numeric", "tabular-nums").text(`:${ts.sec}`);
     if (ts.ap)
       g.append("text").attr("data-dgmo-clock-digital-part", "ap").attr("x", stackX).attr("y", baseY).attr("fill", muted).attr("font-family", FONT_FAMILY).attr("font-size", sf).attr("font-weight", 600).text(ts.ap);
@@ -602,13 +602,13 @@ function drawColumns(body, parsed, now, top, geom, col) {
       const sf = 13;
       const tf = fitFont(ts.main, 44, innerW - 30, 20);
       const mainW = [...ts.main].reduce(
-        (w, c) => w + tf * (c === ":" ? 0.28 : 0.6),
+        (w, c) => w + tf * (c === ":" ? 0.334 : 0.6),
         0
       );
       const stackW = Math.max(estWidth(`:${ts.sec}`, sf), estWidth(ts.ap, sf));
       const gLeft = cx - (mainW + 7 + stackW) / 2;
       const baseY = cy + tf * 0.34;
-      g.append("text").attr("data-dgmo-clock-digital", "").attr("data-dgmo-clock-digital-part", "main").attr("x", gLeft).attr("y", baseY).attr("fill", timeColor).attr("font-family", FONT_FAMILY).attr("font-size", tf).attr("font-weight", 600).style("font-variant-numeric", "tabular-nums").text(ts.main);
+      g.append("text").attr("data-dgmo-clock-digital", "").attr("data-dgmo-clock-digital-part", "main").attr("x", gLeft).attr("y", baseY).attr("fill", timeColor).attr("font-family", FONT_FAMILY).attr("font-size", tf).attr("font-weight", 600).attr("textLength", mainW).attr("lengthAdjust", "spacing").style("font-variant-numeric", "tabular-nums").text(ts.main);
       const stackX = gLeft + mainW + 7;
       g.append("text").attr("data-dgmo-clock-digital-part", "sec").attr("x", stackX).attr("y", baseY - tf * 0.32).attr("fill", muted).attr("font-family", FONT_FAMILY).attr("font-size", sf).attr("font-weight", 500).text(`:${ts.sec}`);
       if (ts.ap)
@@ -678,4 +678,4 @@ export {
   renderClock,
   renderClockForExport
 };
-//# sourceMappingURL=chunk-7PQYTZMA.js.map
+//# sourceMappingURL=chunk-5WFIYXQ6.js.map

package/dist/{chunk-YIA4LEX4.js → chunk-DN66GPY5.js}

@@ -1,6 +1,6 @@
 import {
   encodeDiagramUrl
-} from "./chunk-ZAD4HV2G.js";
+} from "./chunk-SVTI362O.js";
 import {
   FONT_FAMILY
 } from "./chunk-6KFWC4CO.js";
@@ -176,8 +176,11 @@ function escapeXml(s) {
 }
 
 // src/utils/svg-embed.ts
-function normalizeSvgForEmbed(input) {
+function normalizeSvgForEmbed(input, opts = {}) {
   let svg = input;
+  if ((opts.background ?? "transparent") === "transparent") {
+    svg = stripRootBackground(svg);
+  }
   const rootMatch = svg.match(/<svg[^>]*>/);
   const rootTag = rootMatch?.[0] ?? "";
   if (rootTag && !rootTag.includes("viewBox")) {
@@ -207,6 +210,73 @@ function normalizeSvgForEmbed(input) {
   svg = svg.replace(/<svg\s{2,}/g, "<svg ");
   return svg;
 }
+var BG_MEANINGFUL_TYPES = /* @__PURE__ */ new Set(["map"]);
+function defaultEmbedBackground(chartType) {
+  return chartType && BG_MEANINGFUL_TYPES.has(chartType) ? "opaque" : "transparent";
+}
+function stripRootBackground(svg) {
+  const rootMatch = svg.match(/<svg\b[^>]*>/);
+  if (!rootMatch) return svg;
+  const rootTag = rootMatch[0];
+  const styleMatch = rootTag.match(/style="([^"]*)"/);
+  const style = styleMatch?.[1] ?? "";
+  const bgMatch = style.match(/background:\s*([^;]+)/);
+  const bgColor = bgMatch ? normalizeColor(bgMatch[1]) : null;
+  const canvas = rootCanvas(rootTag, svg);
+  let out = svg;
+  if (bgMatch) {
+    const cleaned = style.replace(/background:\s*[^;]+;?/i, "").replace(/\s{2,}/g, " ").replace(/;\s*$/, "").trim();
+    const newRoot = (cleaned ? rootTag.replace(/style="[^"]*"/, `style="${cleaned}"`) : rootTag.replace(/\s*style="[^"]*"/, "")).replace(/<svg\s{2,}/, "<svg ");
+    out = out.replace(rootTag, newRoot);
+  }
+  if (bgColor && canvas) {
+    out = out.replace(
+      /<rect\b[^>]*?\/?>(?:\s*<\/rect>)?/g,
+      (m) => isFullCanvasFill(m, bgColor, canvas) ? "" : m
+    );
+  }
+  return out;
+}
+function isFullCanvasFill(tag, bgColor, canvas) {
+  const fm = tag.match(/\bfill="([^"]*)"/);
+  if (!fm || normalizeColor(fm[1]) !== bgColor) return false;
+  const w = numAttr(tag, "width");
+  const h = numAttr(tag, "height");
+  if (w === null || h === null) return false;
+  const x = numAttr(tag, "x") ?? 0;
+  const y = numAttr(tag, "y") ?? 0;
+  const T = 1.5;
+  return Math.abs(x) <= T && Math.abs(y) <= T && Math.abs(w - canvas.w) <= T && Math.abs(h - canvas.h) <= T;
+}
+function rootCanvas(rootTag, svg) {
+  const wm = rootTag.match(/\bwidth="([\d.]+)"/);
+  const hm = rootTag.match(/\bheight="([\d.]+)"/);
+  if (wm && hm) return { w: parseFloat(wm[1]), h: parseFloat(hm[1]) };
+  const vb = readViewBox(svg);
+  return vb ? { w: vb.width, h: vb.height } : null;
+}
+function numAttr(tag, name) {
+  const m = tag.match(new RegExp(`\\b${name}="([^"]*)"`));
+  if (!m) return null;
+  const n = parseFloat(m[1]);
+  return Number.isFinite(n) ? n : null;
+}
+function normalizeColor(c) {
+  const s = c.trim().toLowerCase();
+  const hex6 = s.match(/^#([0-9a-f]{6})$/);
+  if (hex6) {
+    const n = parseInt(hex6[1], 16);
+    return `${n >> 16 & 255},${n >> 8 & 255},${n & 255}`;
+  }
+  const hex3 = s.match(/^#([0-9a-f]{3})$/);
+  if (hex3) {
+    const [r, g, b] = hex3[1].split("").map((ch) => parseInt(ch + ch, 16));
+    return `${r},${g},${b}`;
+  }
+  const rgb = s.match(/^rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);
+  if (rgb) return `${+rgb[1]},${+rgb[2]},${+rgb[3]}`;
+  return null;
+}
 function getEmbedSvgViewBox(svg) {
   const tight = computeBBox(svg);
   if (!tight || tight.width <= 0 || tight.height <= 0) return null;
@@ -334,6 +404,7 @@ function computeBBox(svg) {
 export {
   renderErrorCard,
   normalizeSvgForEmbed,
+  defaultEmbedBackground,
   getEmbedSvgViewBox
 };
-//# sourceMappingURL=chunk-YIA4LEX4.js.map
+//# sourceMappingURL=chunk-DN66GPY5.js.map

package/dist/{chunk-VVZRV54S.js → chunk-KQ57MHRO.js}

@@ -25,7 +25,7 @@ import {
   parseHeatmap,
   parseSankey,
   parseScatter
-} from "./chunk-XDXNDSKO.js";
+} from "./chunk-XEGTMVYY.js";
 import {
   parseWireframe
 } from "./chunk-I2WKW7C7.js";
@@ -2162,4 +2162,4 @@ export {
   knownChartTypeIds,
   parseDgmo
 };
-//# sourceMappingURL=chunk-VVZRV54S.js.map
+//# sourceMappingURL=chunk-KQ57MHRO.js.map

package/dist/{chunk-4S52SK6G.js → chunk-QJJZSROI.js}

@@ -32,7 +32,7 @@ import {
   getSimpleChartLegendGroups,
   parseChart,
   parseExtendedChart
-} from "./chunk-XDXNDSKO.js";
+} from "./chunk-XEGTMVYY.js";
 import {
   contrastText,
   getSegmentColors,
@@ -438,7 +438,14 @@ function renderLine(svg, chart, width, height, colors, palette, isDark, textColo
           hi = Math.max(hi, v);
         }
     if (!isFinite(lo)) return [0, 1];
-    if (lo > 0) lo = 0;
+    if (chart.noAutoY) {
+      if (lo > 0) lo = 0;
+    } else {
+      const pad = (hi - lo) * 0.05 || Math.abs(hi) * 0.05 || 1;
+      const nlo = lo - pad;
+      lo = lo >= 0 && nlo < 0 ? 0 : nlo;
+      hi = hi + pad;
+    }
     if (lo === hi) hi = lo + 1;
     return [lo, hi];
   };
@@ -1694,4 +1701,4 @@ export {
   supportsD3DataChart,
   renderDataChartD3
 };
-//# sourceMappingURL=chunk-4S52SK6G.js.map
+//# sourceMappingURL=chunk-QJJZSROI.js.map