@diagrammo/dgmo 0.47.0 → 0.48.0

package/src/utils/reserved-key-registry.ts

@@ -1,239 +0,0 @@
-/**
- * Reserved-Key Registry — per-chart-type sets of attribute keys that
- * trigger metadata dispatch in the unified §1.4 metadata grammar.
- *
- * See `docs/dgmo-language-spec.md` §1.4.3 for the canonical table.
- *
- * Two roles:
- * - **Same-line dispatch (§1.4.1):** the parser flips into metadata
- *   mode the first time it encounters a `<key>:` token where `key`
- *   is in the registry. Everything left is the name region.
- * - **Indented dispatch (§1.4.2):** an indented `key: value` line
- *   attaches as attribute metadata to the parent ONLY when `key`
- *   is in the registry. Other indented lines fall through to the
- *   chart's structural-child grammar.
- *
- * Tag aliases declared via `tag <Group> as <x>` are added to the
- * effective registry for the duration of the parse — they are not
- * baked into these static sets.
- */
-
-export interface ReservedKeyRegistry {
-  /** Reserved attribute keys for this chart type (static). */
-  readonly keys: ReadonlySet<string>;
-  /** Tag aliases declared during this parse (dynamic). */
-  readonly tagAliases: ReadonlySet<string>;
-}
-
-/**
- * Helper to build a registry with empty tag aliases. Parsers should
- * call `withTagAliases()` once they've collected declared aliases.
- */
-function staticRegistry(keys: readonly string[]): ReservedKeyRegistry {
-  return { keys: new Set(keys), tagAliases: new Set() };
-}
-
-/**
- * Return a new registry with the given tag-alias set merged in.
- * Static `keys` are unchanged; aliases overlay the registry for
- * the current parse.
- */
-export function withTagAliases(
-  base: ReservedKeyRegistry,
-  aliases: ReadonlySet<string>
-): ReservedKeyRegistry {
-  return { keys: base.keys, tagAliases: aliases };
-}
-
-/**
- * Test whether `key` is recognized by this registry (either static
- * reserved key or active tag alias).
- */
-export function isReservedKey(
-  registry: ReservedKeyRegistry,
-  key: string
-): boolean {
-  return registry.keys.has(key) || registry.tagAliases.has(key);
-}
-
-// ── Per-chart-type registries (matches spec §1.4.3) ──────────
-
-export const SEQUENCE_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'role',
-  'collapsed',
-  // Participant layout-order override (§2.2). Colon-keyed `position: N`.
-  'position',
-]);
-
-export const INFRA_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'collapsed',
-  'icon',
-]);
-
-// NOTE: `color` is deliberately OMITTED (unlike sibling registries) — per
-// §24B.9 the map chart type carries color as a trailing token (peeled by
-// `peelTrailingColorName`) / via the tag system, not a `color:` metadata key.
-// The numeric data channel is PER-ELEMENT (decision #20): `heat:` (region
-// choropleth shade), `size:` (POI marker radius), `width:` (edge/leg thickness)
-// — each mirrors its directive (`region-heat`/`poi-size`/`flow-width`). All three
-// are reserved so a wrong-channel key (e.g. `size:` on a region) lands in meta and
-// the parser can reject it (§24B.10) instead of silently becoming a tag. `style`
-// is the route/edge shape key. `description`/`date` had no v1 surface (they raise
-// an unknown-key error rather than silently no-op).
-export const MAP_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'heat',
-  'size',
-  'width',
-  'label',
-  'style',
-  // `surface:` was removed in the 2026-06-02 defaults-on review — it is no longer
-  // a recognized metadata key (the route/edge surface feature was cut; §24B.7).
-  // A stray `surface: water` is no longer captured as a reserved key.
-]);
-
-export const ORG_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'role',
-  'location',
-  'email',
-  'phone',
-]);
-
-export const C4_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'tech',
-  'type',
-  'collapsed',
-]);
-
-export const ER_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'domain',
-]);
-
-// event-line carries the date as a §15-style line-prefix (not a key) and the
-// description as a pyramid/ring-style bare indented body (not a key), so the
-// only static reserved key is `color`; tag aliases are added per-parse via
-// withTagAliases. See spec §28 / decision #16.
-export const EVENT_LINE_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-]);
-
-export const KANBAN_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'wip',
-  'assignee',
-  'due',
-  'collapsed', // `[Column] collapsed: true` view-state marker
-]);
-
-export const SITEMAP_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'status',
-]);
-
-export const GANTT_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'duration',
-  'offset',
-  'progress',
-  'start',
-  'collapsed', // `[Group] collapsed: true` view-state marker
-]);
-
-export const PERT_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'confidence',
-  'collapsed',
-]);
-
-// `width`/`split`/`fanout` were copy-pasted from an infra-flavored template
-// during the §1.4 metadata migration but boxes-and-lines never read them
-// (split/fanout are infra-only edge-flow keys, consumed in src/infra/*). Removed
-// 2026-06-03. The numeric ramp is `heat:` (decision #20 — value→colour ramp,
-// same channel word as treemap + map `region-heat`; was `value:`).
-export const BOXES_AND_LINES_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'heat',
-]);
-
-export const TIMELINE_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'duration',
-]);
-
-export const MINDMAP_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'collapsed',
-]);
-
-export const TECH_RADAR_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'quadrant',
-  'ring',
-  'trend',
-]);
-
-export const CYCLE_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'width',
-  'span',
-]);
-
-/**
- * Journey-map: `score` and `emotion` replace the legacy bare-prefix
- * positional shape. Annotation keys (`pain`, `opportunity`, `thought`)
- * are also reserved so indented annotations dispatch correctly.
- */
-export const JOURNEY_MAP_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-  'score',
-  'emotion',
-  'pain',
-  'opportunity',
-  'thought',
-]);
-
-export const PYRAMID_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-]);
-
-export const RING_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-]);
-
-// Treemap: only `heat` (the color-by-value metric) is a reserved attribute key.
-// Node SIZE is the bare trailing number (not a `value:` key — §1.5 idiom), and
-// tag application uses declared tag aliases (added dynamically via withTagAliases).
-export const TREEMAP_REGISTRY: ReservedKeyRegistry = staticRegistry(['heat']);
-
-/**
- * RACI/RASCI/DACI: only `color` and `description` are reserved as
- * attribute keys. Role names declared via `roles` block are
- * registered via a SEPARATE role-dispatch path (not through this
- * registry), because `Cap: A R` is a role assignment, not generic
- * metadata.
- */
-export const RACI_REGISTRY: ReservedKeyRegistry = staticRegistry([
-  'color',
-  'description',
-]);

package/src/utils/safe-href.ts

@@ -1,38 +0,0 @@
-/**
- * Protocol allowlist for user-supplied URLs emitted into rendered SVG/HTML.
- *
- * Returns the input URL unchanged when its scheme is `http:`, `https:`,
- * `mailto:`, or it is a relative path (`./…`, `/…`, `../…`, `#…`, or no
- * scheme at all). Returns `null` for any other scheme — `javascript:`,
- * `data:`, `vbscript:`, `file:`, etc. — so callers can drop the link or
- * render the text as plain text.
- *
- * The check is whitespace-tolerant and case-insensitive on the scheme,
- * matching the parsing rules browsers apply when resolving an `href`.
- */
-const ALLOWED_SCHEMES = ['http', 'https', 'mailto'] as const;
-const SCHEME_RE = /^([a-z][a-z0-9+.-]*):/i;
-
-// Browsers strip leading C0 control characters and ASCII whitespace before
-// resolving a URL, so `\tjavascript:` would still execute. Mirror that here.
-// eslint-disable-next-line no-control-regex
-const LEADING_TRIM_RE = /^[\x00-\x20]+/;
-
-export function safeHref(url: string | undefined | null): string | null {
-  if (typeof url !== 'string') return null;
-  const trimmed = url.replace(LEADING_TRIM_RE, '');
-  if (trimmed.length === 0) return null;
-
-  const match = SCHEME_RE.exec(trimmed);
-  if (!match) {
-    // No scheme — relative path / fragment / query. Allow.
-    return url;
-  }
-
-  // Capture group 1 always exists when SCHEME_RE matches.
-  const scheme = match[1]!.toLowerCase();
-  if ((ALLOWED_SCHEMES as readonly string[]).includes(scheme)) {
-    return url;
-  }
-  return null;
-}

package/src/utils/scaling.ts

@@ -1,97 +0,0 @@
-const DEFAULT_MIN_SCALE_FACTOR = 0.5;
-const TEXT_FLOOR = 9;
-
-export class ScaleContext {
-  readonly factor: number;
-  readonly isBelowFloor: boolean;
-
-  private constructor(factor: number, minScaleFactor: number) {
-    this.factor = factor;
-    this.isBelowFloor = factor <= minScaleFactor;
-  }
-
-  static from(
-    containerSize: number,
-    idealSize: number,
-    minScaleFactor = DEFAULT_MIN_SCALE_FACTOR
-  ): ScaleContext {
-    if (idealSize <= 0) return ScaleContext.identity();
-    const raw = containerSize / idealSize;
-    const clamped = Math.max(Math.min(raw, 1), minScaleFactor);
-    return new ScaleContext(clamped, minScaleFactor);
-  }
-
-  /**
-   * Fit content into a bounding box, scaling by whichever dimension is more
-   * constraining (the smaller of the width- and height-fit ratios) so the
-   * diagram never overflows the canvas in either axis. Like {@link from}, the
-   * factor is clamped to `[minScaleFactor, 1]` (content is never enlarged, and
-   * never shrunk past the readability floor).
-   */
-  static fromBox(
-    containerWidth: number,
-    idealWidth: number,
-    containerHeight: number,
-    idealHeight: number,
-    minScaleFactor = DEFAULT_MIN_SCALE_FACTOR
-  ): ScaleContext {
-    const wRaw = idealWidth > 0 ? containerWidth / idealWidth : 1;
-    const hRaw = idealHeight > 0 ? containerHeight / idealHeight : 1;
-    const raw = Math.min(wRaw, hRaw);
-    const clamped = Math.max(Math.min(raw, 1), minScaleFactor);
-    return new ScaleContext(clamped, minScaleFactor);
-  }
-
-  /**
-   * Build a context from an explicit raw factor (clamped to
-   * `[minScaleFactor, 1]`). Used to refine a fit iteratively: layout scaling is
-   * non-linear (gaps shrink faster than floored text), so the first-pass factor
-   * can still overflow — re-measure the laid-out result and tighten.
-   */
-  static fromFactor(
-    rawFactor: number,
-    minScaleFactor = DEFAULT_MIN_SCALE_FACTOR
-  ): ScaleContext {
-    const clamped = Math.max(Math.min(rawFactor, 1), minScaleFactor);
-    return new ScaleContext(clamped, minScaleFactor);
-  }
-
-  static identity(): ScaleContext {
-    return new ScaleContext(1, DEFAULT_MIN_SCALE_FACTOR);
-  }
-
-  aesthetic(value: number): number {
-    if (this.factor >= 1) return value;
-    return value * this.factor ** 1.5;
-  }
-
-  structural(value: number): number {
-    if (this.factor >= 1) return value;
-    return value * this.factor;
-  }
-
-  text(fontSize: number, floor = TEXT_FLOOR): number {
-    if (this.factor >= 1) return fontSize;
-    return Math.max(fontSize * this.factor, floor);
-  }
-}
-
-// ============================================================
-// ContentCounts — per-chart-type content tallies that feed the registry's
-// `minDims` formulas (chart-type-registry.ts). The formulas themselves moved
-// there (Story 111.5) so a chart type's sizing is defined in one descriptor.
-// ============================================================
-
-export interface ContentCounts {
-  items?: number;
-  columns?: number;
-  rows?: number;
-  participants?: number;
-  nodes?: number;
-  depth?: number;
-  messages?: number;
-  tasks?: number;
-  roles?: number;
-  blips?: number;
-  lanes?: number;
-}

package/src/utils/svg-embed.ts

@@ -1,251 +0,0 @@
-/**
- * Make an SVG produced by `@diagrammo/dgmo`'s static `render()` suitable for
- * responsive inline embedding in any host (Obsidian, remark/markdown, web
- * pages):
- *
- * - dgmo renders diagrams inside a fixed export canvas (e.g.
- *   `viewBox="0 0 1200 800"`), with content often occupying only a fraction
- *   of it. We compute a tight content bounding box from element coordinates
- *   and set the root `viewBox` to bbox+padding, so the diagram's intrinsic
- *   aspect ratio matches its CONTENT — no dead space above/below or beside it.
- * - Ensure the root `<svg>` has a `viewBox` so it scales responsively.
- * - Strip fixed `width="N"` / `height="N"` so CSS (e.g. `width:100%;
- *   height:auto`, or an aspect-ratio derived from the tight viewBox) controls
- *   sizing.
- * - Remove any inline `background:` from the root style so the page
- *   background shows through.
- *
- * This is intentionally a string transform, not a DOM `getBBox()` step: dgmo
- * can dual-render light/dark SVGs where one is hidden by color-mode CSS, and
- * `getBBox()` returns 0 for the hidden copy. Parsing coordinates from the
- * markup measures both copies reliably and works server-side (Node).
- */
-export function normalizeSvgForEmbed(input: string): string {
-  let svg = input;
-  const rootMatch = svg.match(/<svg[^>]*>/);
-  const rootTag = rootMatch?.[0] ?? '';
-  if (rootTag && !rootTag.includes('viewBox')) {
-    const wh = rootTag.match(/width="(\d+)"[^>]*height="(\d+)"/);
-    if (wh) {
-      svg = svg.replace(/<svg/, `<svg viewBox="0 0 ${wh[1]} ${wh[2]}"`);
-    }
-  }
-
-  const tight = computeBBox(svg);
-  if (tight && tight.width > 0 && tight.height > 0) {
-    const pad = 16;
-    const x = tight.x - pad;
-    const y = tight.y - pad;
-    const w = tight.width + pad * 2;
-    const h = tight.height + pad * 2;
-    // The renderer's viewBox is authoritative; computeBBox may only shave dead
-    // margins off it. computeBBox is a best-effort string parser with two
-    // failure modes, and the renderer's canvas bounds catch both:
-    //   1. OVER-shoot — it misreads path arc commands (`A rx ry rot … x y`) and
-    //      yields a box that strays OUTSIDE the canvas (negative origin /
-    //      over-wide). Applying it shifts the viewBox and CLIPS the diagram.
-    //   2. UNDER-shoot — it can't see elements positioned via `transform`
-    //      (no x/y attrs), e.g. word-cloud words. It then measures only the
-    //      stragglers (the title) and collapses the box to a tiny region,
-    //      zooming that fragment to fill the frame.
-    // So only tighten when the computed box sits WITHIN the canvas AND still
-    // covers most of it; otherwise keep the renderer's correct bounds.
-    const canvas = readViewBox(svg);
-    const TOL = 2;
-    const MIN_COVERAGE = 0.5; // a real trim shaves margins, not the diagram
-    const trustworthy =
-      !canvas ||
-      (x >= canvas.x - TOL &&
-        y >= canvas.y - TOL &&
-        x + w <= canvas.x + canvas.width + TOL &&
-        y + h <= canvas.y + canvas.height + TOL &&
-        w >= canvas.width * MIN_COVERAGE &&
-        h >= canvas.height * MIN_COVERAGE);
-    if (trustworthy) {
-      const vb = `${x} ${y} ${w} ${h}`;
-      svg = svg.replace(/(<svg[^>]*?)viewBox="[^"]*"/, `$1viewBox="${vb}"`);
-    }
-  }
-
-  svg = svg.replace(/(<svg[^>]*?) width="[^"]*"/g, '$1');
-  svg = svg.replace(/(<svg[^>]*?) height="[^"]*"/g, '$1');
-  svg = svg.replace(/(<svg[^>]*?style="[^"]*?)background:[^;"]*;?\s*/g, '$1');
-  svg = svg.replace(/<svg\s{2,}/g, '<svg ');
-  return svg;
-}
-
-/**
- * Parse the content bounding box of a normalized embed SVG, if one can be
- * derived. Returns `null` when no usable coordinates are found (e.g. an empty
- * diagram). Useful for hosts that want to set an explicit `aspect-ratio` from
- * the tight viewBox.
- */
-export function getEmbedSvgViewBox(
-  svg: string
-): { x: number; y: number; width: number; height: number } | null {
-  const tight = computeBBox(svg);
-  if (!tight || tight.width <= 0 || tight.height <= 0) return null;
-  const pad = 16;
-  return {
-    x: tight.x - pad,
-    y: tight.y - pad,
-    width: tight.width + pad * 2,
-    height: tight.height + pad * 2,
-  };
-}
-
-/** Read the root `<svg>` viewBox as numbers, if present and well-formed. */
-function readViewBox(
-  svg: string
-): { x: number; y: number; width: number; height: number } | null {
-  const m = svg.match(/<svg[^>]*?\bviewBox="([^"]+)"/);
-  if (!m) return null;
-  const n = m[1]!
-    .trim()
-    .split(/[\s,]+/)
-    .map(Number);
-  if (
-    n.length !== 4 ||
-    n.some((v) => !Number.isFinite(v)) ||
-    n[2]! <= 0 ||
-    n[3]! <= 0
-  )
-    return null;
-  return { x: n[0]!, y: n[1]!, width: n[2]!, height: n[3]! };
-}
-
-/**
- * Compute an approximate content bounding box from raw element coordinates.
- *
- * This is a regex walk, not a real SVG layout — it ignores `transform`
- * attributes and uses a heuristic for text widths. dgmo's renderers mostly use
- * absolute coordinates within their viewBox, so the approximation is close
- * enough that the rendered output reliably fills the visible area.
- */
-function computeBBox(
-  svg: string
-): { x: number; y: number; width: number; height: number } | null {
-  const xs: number[] = [];
-  const ys: number[] = [];
-
-  function push(x: number, y: number): void {
-    if (Number.isFinite(x) && Number.isFinite(y)) {
-      xs.push(x);
-      ys.push(y);
-    }
-  }
-
-  function attr(tag: string, name: string): number | null {
-    const m = tag.match(new RegExp(`\\b${name}="([^"]*)"`));
-    if (!m) return null;
-    const n = parseFloat(m[1]!);
-    return Number.isFinite(n) ? n : null;
-  }
-
-  // <rect x y width height>
-  for (const m of svg.matchAll(/<rect\b[^>]*?\/?>/g)) {
-    const tag = m[0];
-    const x = attr(tag, 'x');
-    const y = attr(tag, 'y');
-    const w = attr(tag, 'width');
-    const h = attr(tag, 'height');
-    if (x !== null && y !== null && w !== null && h !== null) {
-      push(x, y);
-      push(x + w, y + h);
-    }
-  }
-
-  // <line x1 y1 x2 y2>
-  for (const m of svg.matchAll(/<line\b[^>]*?\/?>/g)) {
-    const tag = m[0];
-    const x1 = attr(tag, 'x1');
-    const y1 = attr(tag, 'y1');
-    const x2 = attr(tag, 'x2');
-    const y2 = attr(tag, 'y2');
-    if (x1 !== null && y1 !== null && x2 !== null && y2 !== null) {
-      push(x1, y1);
-      push(x2, y2);
-    }
-  }
-
-  // <circle cx cy r>
-  for (const m of svg.matchAll(/<circle\b[^>]*?\/?>/g)) {
-    const tag = m[0];
-    const cx = attr(tag, 'cx');
-    const cy = attr(tag, 'cy');
-    const r = attr(tag, 'r');
-    if (cx !== null && cy !== null && r !== null) {
-      push(cx - r, cy - r);
-      push(cx + r, cy + r);
-    }
-  }
-
-  // <ellipse cx cy rx ry>
-  for (const m of svg.matchAll(/<ellipse\b[^>]*?\/?>/g)) {
-    const tag = m[0];
-    const cx = attr(tag, 'cx');
-    const cy = attr(tag, 'cy');
-    const rx = attr(tag, 'rx');
-    const ry = attr(tag, 'ry');
-    if (cx !== null && cy !== null && rx !== null && ry !== null) {
-      push(cx - rx, cy - ry);
-      push(cx + rx, cy + ry);
-    }
-  }
-
-  // <text x y>some content</text>
-  // Approximate width: text content length × an empirical font width factor.
-  // dgmo uses Inter ~14px by default; ~7px per character is a usable rough
-  // estimate that won't drastically under- or over-count.
-  for (const m of svg.matchAll(/<text\b([^>]*?)>([\s\S]*?)<\/text>/g)) {
-    const tag = `<text${m[1]}>`;
-    const text = m[2]!.replace(/<[^>]+>/g, ''); // strip inner tags (tspan, etc.)
-    const x = attr(tag, 'x');
-    const y = attr(tag, 'y');
-    if (x !== null && y !== null) {
-      const w = text.length * 7;
-      // Honor text-anchor so the horizontal extent points the right way:
-      // `start` (SVG default) grows rightward from x, `end` grows leftward,
-      // `middle` straddles x. Assuming middle for everything under-measures
-      // start-anchored text (e.g. pyramid right-column descriptions), which
-      // collapses the tight viewBox and clips that text in embeds.
-      const anchor = tag.match(/\btext-anchor="([^"]*)"/)?.[1] ?? 'start';
-      const left =
-        anchor === 'middle' ? x - w / 2 : anchor === 'end' ? x - w : x;
-      const right =
-        anchor === 'middle' ? x + w / 2 : anchor === 'end' ? x : x + w;
-      push(left, y - 14);
-      push(right, y + 4);
-    }
-  }
-
-  // <path d="..."> — pull every coordinate pair out of the d attribute.
-  for (const m of svg.matchAll(/<path\b[^>]*?\bd="([^"]+)"/g)) {
-    const d = m[1]!;
-    const nums = d.match(/-?\d+(?:\.\d+)?/g);
-    if (!nums) continue;
-    for (let i = 0; i + 1 < nums.length; i += 2) {
-      push(parseFloat(nums[i]!), parseFloat(nums[i + 1]!));
-    }
-  }
-
-  // <polygon points="x,y x,y ..."> and <polyline>
-  for (const m of svg.matchAll(
-    /<(?:polygon|polyline)\b[^>]*?\bpoints="([^"]+)"/g
-  )) {
-    const nums = m[1]!.match(/-?\d+(?:\.\d+)?/g);
-    if (!nums) continue;
-    for (let i = 0; i + 1 < nums.length; i += 2) {
-      push(parseFloat(nums[i]!), parseFloat(nums[i + 1]!));
-    }
-  }
-
-  if (xs.length === 0 || ys.length === 0) return null;
-
-  const minX = Math.min(...xs);
-  const maxX = Math.max(...xs);
-  const minY = Math.min(...ys);
-  const maxY = Math.max(...ys);
-
-  return { x: minX, y: minY, width: maxX - minX, height: maxY - minY };
-}