@diagrammo/dgmo 0.50.1 → 0.51.0

package/dist/{chunk-Y4RNXEAO.js → chunk-ND76YJCN.js}

@@ -8,14 +8,17 @@ import {
 import {
   DAY_MS,
   applyOrdinalTemplate,
+  dayStart,
   formatCompound,
   formatCount,
   formatDateShort,
   formatFooter,
   formatHuman,
   formatWordsDetail,
-  ordinalFor
-} from "./chunk-YNRDWYZP.js";
+  ordinalFor,
+  sameDay,
+  splitClockSeconds
+} from "./chunk-OQKP2X3D.js";
 import {
   FONT_FAMILY
 } from "./chunk-6KFWC4CO.js";
@@ -33,23 +36,24 @@ import * as d3Selection from "d3-selection";
 function bakedHero(parsed, now) {
   const resolved = parsed.resolvedMs;
   if (resolved === null) return "\u2014";
+  const tz = parsed.tz;
   const remaining = resolved - now;
   if (!parsed.rule && remaining <= 0) {
     if (parsed.expired !== null) return parsed.expired;
     const elapsed = -remaining;
     if (elapsed <= 0) return "Now!";
     if (parsed.units === "compound" || parsed.units === "human")
-      return `${formatCompound(resolved, now)} ago`;
+      return `${formatCompound(resolved, now, 2, tz)} ago`;
     const bu = parsed.units === "full" || parsed.units === "clock" ? "days" : parsed.units;
     return `${formatCount(elapsed, { units: bu, round: parsed.round, fields: parsed.fields })} ago`;
   }
-  if (parsed.rule && sameLocalDay(resolved, now))
+  if (parsed.rule && sameDay(resolved, now, tz))
     return parsed.onDay ?? "Today!";
   if (parsed.units === "human") {
-    const [hn, ht] = parsed.hasTime ? [now, resolved] : [DAY_START(now), DAY_START(resolved)];
-    return formatHuman(hn, ht).big;
+    const [hn, ht] = parsed.hasTime ? [now, resolved] : [dayStart(now, tz), dayStart(resolved, tz)];
+    return formatHuman(hn, ht, tz).big;
   }
-  if (parsed.units === "compound") return formatCompound(now, resolved);
+  if (parsed.units === "compound") return formatCompound(now, resolved, 2, tz);
   const bakeUnits = parsed.units === "full" || parsed.units === "clock" ? "days" : parsed.units;
   return formatCount(Math.max(0, remaining), {
     units: bakeUnits,
@@ -57,11 +61,6 @@ function bakedHero(parsed, now) {
     fields: parsed.fields
   });
 }
-function sameLocalDay(a, b) {
-  const x = new Date(a);
-  const y = new Date(b);
-  return x.getFullYear() === y.getFullYear() && x.getMonth() === y.getMonth() && x.getDate() === y.getDate();
-}
 function stampRecur(sel, parsed) {
   const r = parsed.rule;
   if (!r) return;
@@ -78,6 +77,7 @@ function stampRecur(sel, parsed) {
   if (r.intervalUnit !== void 0)
     sel.attr("data-dgmo-recur-interval-unit", r.intervalUnit);
   if (r.anchorMs !== void 0) sel.attr("data-dgmo-recur-anchor", r.anchorMs);
+  if (r.tz !== void 0) sel.attr("data-dgmo-recur-tz", r.tz);
 }
 var MON_ABBR = [
   "Jan",
@@ -150,7 +150,7 @@ function aLine(svg, x1, y1, x2, y2, stroke, sw, opacity) {
   const l = svg.append("line").attr("x1", x1).attr("y1", y1).attr("x2", x2).attr("y2", y2).attr("stroke", stroke).attr("stroke-width", sw);
   if (opacity != null) l.attr("opacity", opacity);
 }
-var REPEAT_ICON_PATH = "m17 2 4 4-4 4 M3 11v-1a4 4 0 0 1 4-4h14 m7 22-4-4 4-4 M21 13v1a4 4 0 0 1-4 4H3";
+var REPEAT_ICON_PATH = "m17 2 4 4-4 4 M3 11v-1a4 4 0 0 1 4-4h14 M7 22l-4-4 4-4 M21 13v1a4 4 0 0 1-4 4H3";
 function recurGlyph(svg, cx, cy, r, color) {
   const side = r * 2.4;
   const scale = side / 24;
@@ -162,11 +162,12 @@ function recurGlyph(svg, cx, cy, r, color) {
 }
 function haloRect(svg, x, y, w, h, rx, C) {
   aRect(svg, x - 1, y - 1, w + 2, h + 2, rx + 1, "none", C.bg, 2);
-  aRect(svg, x - 3, y - 3, w + 6, h + 6, rx + 3, "none", C.event, 2);
+  svg.append("rect").attr("class", "dgmo-countdown-target-ring").attr("x", x - 3).attr("y", y - 3).attr("width", w + 6).attr("height", h + 6).attr("rx", rx + 3).attr("fill", "none").attr("stroke", C.event).attr("stroke-width", 2);
 }
 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";
@@ -198,9 +199,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 clamp = (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 = clamp(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;
@@ -239,6 +262,61 @@ function bandHeightFor(kind, nowMs, resolvedMs, contentW) {
       return clamp(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);
@@ -748,8 +826,17 @@ function vizClock(svg, g, nowMs, targetMs, C) {
 function pad2(n) {
   return n < 10 ? "0" + n : String(n);
 }
+function paintClock(sel, str, secSize, secFill) {
+  const { lead, sec } = splitClockSeconds(str);
+  sel.attr("font-variant-numeric", "tabular-nums").attr("data-dgmo-cd-clock", "").attr("data-dgmo-cd-sec-size", secSize).attr("data-dgmo-cd-sec-fill", secFill).text(null);
+  sel.append("tspan").attr("data-cd-lead", "").text(lead);
+  if (sec !== null)
+    sel.append("tspan").attr("data-cd-sec", "").attr("font-size", secSize).attr("fill", secFill).attr("font-weight", 700).text(sec);
+}
 function drawBand(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":
@@ -794,6 +881,18 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
   const banked = resolveColor("green", palette) ?? muted;
   const faint = mix(palette.text, themeBaseBg(palette, isDark), 72);
   const svg = d3Selection.select(container).append("svg").attr("width", width).attr("preserveAspectRatio", "xMidYMid meet").attr("xmlns", "http://www.w3.org/2000/svg").attr("role", "img").attr("aria-label", `${parsed.title ?? "Countdown"}: ${hero}`).style("font-family", FONT_FAMILY);
+  svg.append("style").text(`
+    @keyframes dgmo-countdown-flash {
+      0%, 100% { opacity: 1; stroke-width: 2; }
+      50% { opacity: 0.45; stroke-width: 3; }
+    }
+    .dgmo-countdown-target-ring {
+      animation: dgmo-countdown-flash 1.8s ease-in-out infinite;
+    }
+    @media (prefers-reduced-motion: reduce) {
+      .dgmo-countdown-target-ring { animation: none; }
+    }
+  `);
   const bgRect = svg.append("rect").attr("width", width).attr("fill", palette.bg);
   const estWidth = (t, fs) => t.length * fs * 0.58;
   const fitFont = (t, base, maxW, min) => {
@@ -813,10 +912,12 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
     fields: parsed.fields
   }) : hero;
   const heroMaxW = contentW * 0.44;
-  const heroFont = fitFont(heroSizeStr, 96, heroMaxW, 26);
-  const heroW = Math.min(heroMaxW, estWidth(heroSizeStr, heroFont));
+  const sizeStr = estWidth(hero, 1) > estWidth(heroSizeStr, 1) ? hero : heroSizeStr;
   const gapMid = Math.max(28, Math.round(width * 0.03));
-  const leftW = Math.max(contentW * 0.42, contentW - heroW - gapMid);
+  const stacked = estWidth(sizeStr, 26) > heroMaxW;
+  const heroFont = fitFont(sizeStr, 96, stacked ? contentW : heroMaxW, 26);
+  const heroW = stacked ? contentW : Math.min(heroMaxW, estWidth(sizeStr, heroFont));
+  const leftW = stacked ? contentW : Math.max(contentW * 0.42, contentW - heroW - gapMid);
   const titleBase = 40;
   let titleFont = 0;
   let titleLines = [];
@@ -828,7 +929,7 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
   }
   const eyebrowText = ordinal !== null ? applyOrdinalTemplate(parsed.sinceLabel ?? `Nth ${label}`, ordinal) : null;
   const eyebrowFont = 16;
-  const footerText = resolved !== null ? formatFooter(resolved, parsed.hasTime) : null;
+  const footerText = resolved !== null ? formatFooter(resolved, parsed.hasTime, parsed.tz) : null;
   const footerFont = 17;
   const noteFont = 19;
   const asofFont = 13;
@@ -846,7 +947,7 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
     });
     y += Math.round(titleFont * 0.45);
     const heroLeft = width - padX - heroW;
-    const ruleRight = Math.max(leftX + 40, heroLeft - 20);
+    const ruleRight = stacked ? width - padX : Math.max(leftX + 40, heroLeft - 20);
     svg.append("line").attr("x1", leftX).attr("x2", ruleRight).attr("y1", y).attr("y2", y).attr("stroke", mix(palette.text, palette.bg, 14)).attr("stroke-width", 1.25);
     y += Math.round(titleFont * 0.5);
   }
@@ -894,8 +995,12 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
     units: "clock",
     round: parsed.round,
     fields: parsed.fields
-  }) : formatHuman(DAY_START(now), DAY_START(resolved)).sub || null : null;
-  const heroCapTop = padY + 0.28 * titleFont;
+  }) : formatHuman(
+    dayStart(now, parsed.tz),
+    dayStart(resolved, parsed.tz),
+    parsed.tz
+  ).sub || null : null;
+  const heroCapTop = stacked ? leftBottom + Math.round(heroFont * 0.2) : padY + 0.28 * titleFont;
   const heroBaseline = heroCapTop + 0.72 * heroFont;
   const heroBlockBottom = heroBaseline + (subText ? heroFont * 0.28 + detailFont : 0);
   const contentBottom = Math.max(leftBottom, heroBlockBottom);
@@ -910,6 +1015,7 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
   );
   svg.attr("height", bannerH).attr("viewBox", `0 0 ${width} ${bannerH}`);
   bgRect.attr("height", bannerH);
+  const bandC = bandColors(palette, accent, muted, faint);
   if (hasBand && resolved !== null) {
     drawBand(
       svg,
@@ -917,10 +1023,11 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
       { left: leftX, top: bandTop, contentW: width - 2 * padX, height: BAND_H },
       now,
       resolved,
-      bandColors(palette, accent, muted, faint)
+      bandC
     );
   }
-  const value = svg.append("text").attr("class", "countdown-value").attr("x", width - padX).attr("y", heroBaseline).attr("text-anchor", "end").attr("dominant-baseline", "alphabetic").attr("fill", accent).attr("font-family", FONT_FAMILY).attr("font-size", heroFont).attr("font-weight", 800).attr("data-dgmo-countdown-units", parsed.units).attr("data-dgmo-countdown-round", parsed.round).attr("data-dgmo-countdown-fields", parsed.fields.join(",")).attr("data-dgmo-countdown-expired", parsed.expired).attr("aria-label", `${parsed.title ?? "Countdown"}: ${hero}`).text(hero);
+  const value = svg.append("text").attr("class", "countdown-value").attr("x", stacked ? leftX : width - padX).attr("y", heroBaseline).attr("text-anchor", stacked ? "start" : "end").attr("dominant-baseline", "alphabetic").attr("fill", accent).attr("font-family", FONT_FAMILY).attr("font-size", heroFont).attr("font-weight", 800).attr("data-dgmo-countdown-units", parsed.units).attr("data-dgmo-countdown-round", parsed.round).attr("data-dgmo-countdown-fields", parsed.fields.join(",")).attr("data-dgmo-countdown-expired", parsed.expired).attr("aria-label", `${parsed.title ?? "Countdown"}: ${hero}`);
+  paintClock(value, hero, Math.round(heroFont * 0.55), bandC.now);
   if (parsed.rule && resolved !== null) {
     value.attr("data-dgmo-countdown", new Date(resolved).toISOString());
   } else if (parsed.target) {
@@ -929,6 +1036,7 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
   if (parsed.title) value.attr("data-dgmo-countdown-title", parsed.title);
   if (parsed.onDay) value.attr("data-dgmo-countdown-onday", parsed.onDay);
   if (parsed.hasTime) value.attr("data-dgmo-countdown-hastime", "1");
+  if (parsed.tz) value.attr("data-dgmo-countdown-tz", parsed.tz);
   if (parsed.since !== null) {
     value.attr("data-dgmo-countdown-since", parsed.since);
     value.attr(
@@ -938,7 +1046,13 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
   }
   stampRecur(value, parsed);
   if (subText) {
-    svg.append("text").attr("x", width - padX).attr("y", heroBaseline + heroFont * 0.28 + detailFont).attr("text-anchor", "end").attr("dominant-baseline", "alphabetic").attr("fill", muted).attr("font-family", FONT_FAMILY).attr("font-size", detailFont).attr("font-weight", 500).attr("data-dgmo-countdown-detail", "").text(subText);
+    const detailSel = svg.append("text").attr("x", stacked ? leftX : width - padX).attr("y", heroBaseline + heroFont * 0.28 + detailFont).attr("text-anchor", stacked ? "start" : "end").attr("dominant-baseline", "alphabetic").attr("fill", muted).attr("font-family", FONT_FAMILY).attr("font-size", detailFont).attr("font-weight", 500).attr("data-dgmo-countdown-detail", "");
+    paintClock(
+      detailSel,
+      subText,
+      Math.round(detailFont * 0.66),
+      bandC.now
+    );
   }
 }
 function renderCountdownForExport(container, parsed, palette, isDark, exportDims) {
@@ -949,4 +1063,4 @@ export {
   renderCountdown,
   renderCountdownForExport
 };
-//# sourceMappingURL=chunk-Y4RNXEAO.js.map
+//# sourceMappingURL=chunk-ND76YJCN.js.map

package/dist/{chunk-KFZYNWWO.js → chunk-NEQ6GJXB.js}

@@ -8,14 +8,14 @@ import {
   LEGEND_PILL_FONT_SIZE,
   LEGEND_PILL_PAD,
   measureLegendText
-} from "./chunk-HQCHYB5F.js";
+} from "./chunk-QOOUC2J5.js";
 import {
   measureText,
   wrapTextToWidth
-} from "./chunk-5LWQH6QV.js";
+} from "./chunk-WCT3NYCV.js";
 import {
   tagAttrKey
-} from "./chunk-FJUNPCYI.js";
+} from "./chunk-467TVMQL.js";
 
 // src/c4/layout.ts
 import dagre from "@dagrejs/dagre";
@@ -1682,4 +1682,4 @@ export {
   layoutC4Components,
   layoutC4Deployment
 };
-//# sourceMappingURL=chunk-KFZYNWWO.js.map
+//# sourceMappingURL=chunk-NEQ6GJXB.js.map

package/dist/{chunk-PFHVU7UA.js → chunk-NI3XQBPB.js}

@@ -4,7 +4,7 @@ import {
 import {
   resolveTagColor,
   tagAttrKey
-} from "./chunk-FJUNPCYI.js";
+} from "./chunk-467TVMQL.js";
 import {
   resolveColor
 } from "./chunk-TLVIHFRO.js";
@@ -164,4 +164,4 @@ export {
   formatPct,
   buildLegend
 };
-//# sourceMappingURL=chunk-PFHVU7UA.js.map
+//# sourceMappingURL=chunk-NI3XQBPB.js.map

package/dist/{chunk-WW32K72E.js → chunk-OJTXTQA2.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-3HDBAXF5.js";
 import {
   renderNodeCard
-} from "./chunk-AHGF2YYA.js";
+} from "./chunk-OTOHI4JO.js";
 import {
   CARD_RADIUS,
   COLLAPSE_BAR_HEIGHT,
@@ -25,10 +25,10 @@ import {
 } from "./chunk-YYVTBZZC.js";
 import {
   renderIntegratedLegend
-} from "./chunk-HEVYAHLW.js";
+} from "./chunk-OU7HLO7I.js";
 import {
   getMaxLegendReservedHeight
-} from "./chunk-7UEMZREK.js";
+} from "./chunk-YAA6IID3.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT
@@ -43,10 +43,10 @@ import {
   LEGEND_EYE_SIZE,
   LEGEND_GROUP_GAP,
   LEGEND_HEIGHT
-} from "./chunk-HQCHYB5F.js";
+} from "./chunk-QOOUC2J5.js";
 import {
   measureText
-} from "./chunk-5LWQH6QV.js";
+} from "./chunk-WCT3NYCV.js";
 import {
   preprocessDescriptionLine
 } from "./chunk-IYULMRBE.js";
@@ -58,7 +58,7 @@ import {
 } from "./chunk-P6T66CCZ.js";
 import {
   tagAttrKey
-} from "./chunk-FJUNPCYI.js";
+} from "./chunk-467TVMQL.js";
 
 // src/sitemap/renderer.ts
 import * as d3Selection from "d3-selection";
@@ -400,8 +400,8 @@ function renderLegend(parent, legendGroups, palette, isDark, activeTagGroup, fix
   }
 }
 async function renderSitemapForExport(content, theme, palette) {
-  const { parseSitemap } = await import("./parser-D5VILGN2.js");
-  const { layoutSitemap } = await import("./layout-LD6XTLD6.js");
+  const { parseSitemap } = await import("./parser-BKI42XBQ.js");
+  const { layoutSitemap } = await import("./layout-MUPRALE5.js");
   const { getPalette } = await import("./palettes-PRJ2RI6D.js");
   const isDark = theme === "dark";
   const effectivePalette = palette ?? (isDark ? getPalette("nord").dark : getPalette("nord").light);
@@ -451,4 +451,4 @@ export {
   renderSitemap,
   renderSitemapForExport
 };
-//# sourceMappingURL=chunk-WW32K72E.js.map
+//# sourceMappingURL=chunk-OJTXTQA2.js.map