@diagrammo/dgmo 0.46.0 → 0.48.0

package/{src/c4/layout.ts → dist/chunk-QEBUY5NY.js}

@@ -1,181 +1,44 @@
-// ============================================================
-// C4 Context Diagram Layout Engine (dagre)
-// ============================================================
-
-import { tagAttrKey } from '../utils/tag-groups';
-import dagre from '@dagrejs/dagre';
-import type {
-  ParsedC4,
-  C4Element,
-  C4Relationship,
-  C4ArrowType,
-  C4Shape,
-  C4DeploymentNode,
-} from './types';
-import type { TagGroup } from '../utils/tag-groups';
-import type { Writable } from '../utils/brand';
-
-/** Mutable edge variant for in-place position shifts during layout. */
-type MutableC4LayoutEdge = Writable<C4LayoutEdge> & {
-  points: { x: number; y: number }[];
-};
 import {
-  LEGEND_PILL_FONT_SIZE,
-  LEGEND_ENTRY_FONT_SIZE,
-  LEGEND_HEIGHT,
-  LEGEND_PILL_PAD,
+  LEGEND_CAPSULE_PAD,
   LEGEND_DOT_R,
   LEGEND_ENTRY_DOT_GAP,
+  LEGEND_ENTRY_FONT_SIZE,
   LEGEND_ENTRY_TRAIL,
-  LEGEND_CAPSULE_PAD,
-  measureLegendText,
-} from '../utils/legend-constants';
-import { measureText, wrapTextToWidth } from '../utils/text-measure';
-
-/** dagre node label shape after layout(). */
-interface DagreNodeLabel {
-  x: number;
-  y: number;
-  width: number;
-  height: number;
-  [key: string]: unknown;
-}
-
-/** dagre edge label shape after layout(). */
-interface DagreEdgeLabel {
-  points: { x: number; y: number }[];
-  [key: string]: unknown;
-}
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const gNode = (g: any, name: string): DagreNodeLabel => g.node(name);
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const gEdge = (g: any, v: string, w: string): DagreEdgeLabel | undefined =>
-  g.edge(v, w);
-
-// ============================================================
-// Types
-// ============================================================
-
-export interface C4LayoutNode {
-  readonly id: string;
-  readonly name: string;
-  readonly type: 'person' | 'system' | 'container' | 'component';
-  readonly description?: string;
-  readonly metadata: Readonly<Record<string, string>>;
-  readonly lineNumber: number;
-  readonly color?: string;
-  readonly shape?: C4Shape;
-  readonly technology?: string;
-  readonly drillable?: boolean;
-  readonly importPath?: string;
-  readonly x: number;
-  readonly y: number;
-  readonly width: number;
-  readonly height: number;
-}
-
-export interface C4LayoutEdge {
-  readonly source: string;
-  readonly target: string;
-  readonly arrowType: C4ArrowType;
-  readonly label?: string;
-  readonly technology?: string;
-  readonly lineNumber: number;
-  readonly points: ReadonlyArray<{ readonly x: number; readonly y: number }>;
-}
-
-export interface C4LegendEntry {
-  readonly value: string;
-  readonly color: string;
-}
-
-export interface C4LegendGroup {
-  readonly name: string;
-  readonly entries: readonly C4LegendEntry[];
-  readonly x: number;
-  readonly y: number;
-  readonly width: number;
-  readonly height: number;
-}
-
-export interface C4LayoutBoundary {
-  readonly label: string;
-  readonly typeLabel: string;
-  readonly lineNumber: number;
-  readonly x: number;
-  readonly y: number;
-  readonly width: number;
-  readonly height: number;
-}
-
-export interface C4LayoutResult {
-  readonly nodes: readonly C4LayoutNode[];
-  readonly edges: readonly C4LayoutEdge[];
-  readonly legend: readonly C4LegendGroup[];
-  readonly boundary?: C4LayoutBoundary;
-  readonly groupBoundaries: readonly C4LayoutBoundary[];
-  readonly width: number;
-  readonly height: number;
-}
-
-// ============================================================
-// Constants
-// ============================================================
-
-const MIN_NODE_WIDTH = 160;
-const MAX_NODE_WIDTH = 260;
-const TYPE_LABEL_HEIGHT = 18;
-const DIVIDER_GAP = 6;
-const NAME_HEIGHT = 20;
-const NAME_FONT_SIZE = 14;
-const DESC_LINE_HEIGHT = 16;
-const DESC_FONT_SIZE = 11;
-const CARD_V_PAD = 14;
-const CARD_H_PAD = 20;
-const META_LINE_HEIGHT = 16;
-const META_FONT_SIZE = 11;
-const MARGIN = 40;
-const BOUNDARY_PAD = 40;
-const GROUP_BOUNDARY_PAD = 24;
-
-// Legend constants (match org)
-
-// ============================================================
-// Post-Layout Crossing Reduction
-// ============================================================
-
-interface NodeGeometry {
-  y: number;
-  width: number;
-  height: number;
-}
-
-// Large penalty per edge-node collision — dominates the distance term so the
-// sifter strongly prefers orderings where edges don't pass through other nodes.
-const EDGE_NODE_COLLISION_WEIGHT = 5000;
-
-/**
- * Compute penalty for an edge ordering. Uses degree-weighted edge distance:
- * long edges to high-degree nodes are penalized more than to low-degree nodes.
- * This places shared/important nodes closer to their neighbors, reducing
- * visual edge congestion.
- *
- * When nodeGeometry is provided, also adds a heavy penalty for each case where
- * a straight-line edge bounding box overlaps another node — driving the sifter
- * to prefer orderings that avoid edge-node collisions.
- */
-function computeEdgePenalty(
-  edgeList: { source: string; target: string }[],
-  nodePositions: Map<string, number>,
-  degrees: Map<string, number>,
-  nodeGeometry?: Map<string, NodeGeometry>
-): number {
+  LEGEND_HEIGHT,
+  LEGEND_PILL_FONT_SIZE,
+  LEGEND_PILL_PAD,
+  measureLegendText
+} from "./chunk-QOOUC2J5.js";
+import {
+  measureText,
+  wrapTextToWidth
+} from "./chunk-WCT3NYCV.js";
+import {
+  tagAttrKey
+} from "./chunk-QLCCJEJI.js";
+
+// src/c4/layout.ts
+import dagre from "@dagrejs/dagre";
+var gNode = (g, name) => g.node(name);
+var gEdge = (g, v, w) => g.edge(v, w);
+var MIN_NODE_WIDTH = 160;
+var MAX_NODE_WIDTH = 260;
+var TYPE_LABEL_HEIGHT = 18;
+var DIVIDER_GAP = 6;
+var NAME_HEIGHT = 20;
+var NAME_FONT_SIZE = 14;
+var DESC_LINE_HEIGHT = 16;
+var DESC_FONT_SIZE = 11;
+var CARD_V_PAD = 14;
+var CARD_H_PAD = 20;
+var META_LINE_HEIGHT = 16;
+var META_FONT_SIZE = 11;
+var MARGIN = 40;
+var BOUNDARY_PAD = 40;
+var GROUP_BOUNDARY_PAD = 24;
+var EDGE_NODE_COLLISION_WEIGHT = 5e3;
+function computeEdgePenalty(edgeList, nodePositions, degrees, nodeGeometry) {
   let penalty = 0;
-
-  // Degree-weighted edge distance: longer edges to higher-degree nodes
-  // are penalized more, pulling "important" (shared) nodes closer to
-  // their neighbors.
   for (const edge of edgeList) {
     const sx = nodePositions.get(edge.source);
     const tx = nodePositions.get(edge.target);
@@ -187,116 +50,74 @@ function computeEdgePenalty(
     );
     penalty += dist * weight;
   }
-
-  // Edge-node collision penalty: for each edge A→B, check if any other node C
-  // has its bounding box inside the straight-line bounding box of the edge.
-  // Uses x from nodePositions (updated per permutation) and y/size from nodeGeometry.
   if (nodeGeometry) {
     for (const edge of edgeList) {
       const geomA = nodeGeometry.get(edge.source);
       const geomB = nodeGeometry.get(edge.target);
       if (!geomA || !geomB) continue;
-
       const ax = nodePositions.get(edge.source) ?? 0;
       const bx = nodePositions.get(edge.target) ?? 0;
       const ay = geomA.y;
       const by = geomB.y;
-
-      // Skip edges within the same rank — they have no vertical span to check
       if (ay === by) continue;
-
       const edgeMinX = Math.min(ax, bx);
       const edgeMaxX = Math.max(ax, bx);
       const edgeMinY = Math.min(ay, by);
       const edgeMaxY = Math.max(ay, by);
-
       for (const [name, geomC] of nodeGeometry) {
         if (name === edge.source || name === edge.target) continue;
         const cx = nodePositions.get(name) ?? 0;
         const cy = geomC.y;
         const hw = geomC.width / 2;
         const hh = geomC.height / 2;
-
-        // AABB overlap: node C's box intersects the edge's straight-line bounding box
-        if (
-          cx + hw > edgeMinX &&
-          cx - hw < edgeMaxX &&
-          cy + hh > edgeMinY &&
-          cy - hh < edgeMaxY
-        ) {
+        if (cx + hw > edgeMinX && cx - hw < edgeMaxX && cy + hh > edgeMinY && cy - hh < edgeMaxY) {
           penalty += EDGE_NODE_COLLISION_WEIGHT;
         }
       }
     }
   }
-
   return penalty;
 }
-
-/**
- * Post-dagre crossing reduction via permutation search.
- *
- * For each rank, tries all permutations (up to rank size 8) to find the
- * node ordering that minimizes degree-weighted edge distance. Nodes with
- * more connections (like a database shared by multiple services) get placed
- * closer to their neighbors, producing cleaner visual layouts.
- */
-function reduceCrossings(
-  g: InstanceType<typeof dagre.graphlib.Graph>,
-  edgeList: { source: string; target: string }[],
-  nodeGroupMap?: Map<string, string>
-): void {
+function reduceCrossings(g, edgeList, nodeGroupMap) {
   if (edgeList.length < 2) return;
-
-  // Compute degree (number of edges) for each node
-  const degrees = new Map<string, number>();
+  const degrees = /* @__PURE__ */ new Map();
   for (const edge of edgeList) {
     degrees.set(edge.source, (degrees.get(edge.source) ?? 0) + 1);
     degrees.set(edge.target, (degrees.get(edge.target) ?? 0) + 1);
   }
-
-  // Build geometry map for edge-node collision scoring
-  const nodeGeometry = new Map<string, NodeGeometry>();
+  const nodeGeometry = /* @__PURE__ */ new Map();
   for (const name of g.nodes()) {
     const pos = gNode(g, name);
     if (pos)
       nodeGeometry.set(name, {
         y: pos.y,
         width: pos.width,
-        height: pos.height,
+        height: pos.height
       });
   }
-
-  // Group nodes by rank
-  const rankMap = new Map<number, string[]>();
+  const rankMap = /* @__PURE__ */ new Map();
   for (const name of g.nodes()) {
     const pos = gNode(g, name);
     if (!pos) continue;
     const rankY = Math.round(pos.y);
     if (!rankMap.has(rankY)) rankMap.set(rankY, []);
-    rankMap.get(rankY)!.push(name);
+    rankMap.get(rankY).push(name);
   }
-
-  // Sort each rank by current x position
   for (const [, rankNodes] of rankMap) {
     rankNodes.sort((a, b) => gNode(g, a).x - gNode(g, b).x);
   }
-
   let anyMoved = false;
-
   for (const [, rankNodes] of rankMap) {
     if (rankNodes.length < 2) continue;
-
-    // When groups exist, partition rank nodes by group and only permute within groups
-    const partitions: string[][] = [];
+    const partitions = [];
     if (nodeGroupMap && nodeGroupMap.size > 0) {
-      const groupBuckets = new Map<string, string[]>();
-      const ungrouped: string[] = [];
+      const groupBuckets = /* @__PURE__ */ new Map();
+      const ungrouped = [];
       for (const name of rankNodes) {
         const grp = nodeGroupMap.get(name);
         if (grp) {
           if (!groupBuckets.has(grp)) groupBuckets.set(grp, []);
-          groupBuckets.get(grp)!.push(name);
+          groupBuckets.get(grp).push(name);
         } else {
           ungrouped.push(name);
         }
@@ -308,40 +129,28 @@ function reduceCrossings(
     } else {
       partitions.push(rankNodes);
     }
-
     for (const partition of partitions) {
       if (partition.length < 2) continue;
-
-      // Collect the x-slots for this partition (sorted)
-      const xSlots = partition
-        .map((name) => gNode(g, name).x)
-        .sort((a, b) => a - b);
-
-      // Build position map snapshot
-      const basePositions = new Map<string, number>();
+      const xSlots = partition.map((name) => gNode(g, name).x).sort((a, b) => a - b);
+      const basePositions = /* @__PURE__ */ new Map();
       for (const name of g.nodes()) {
         const pos = gNode(g, name);
         if (pos) basePositions.set(name, pos.x);
       }
-
-      // Current penalty
       const currentPenalty = computeEdgePenalty(
         edgeList,
         basePositions,
         degrees,
         nodeGeometry
       );
-
-      // Try permutations (feasible for partition sizes ≤ 8)
       let bestPerm = [...partition];
       let bestPenalty = currentPenalty;
-
       if (partition.length <= 8) {
         const perms = permutations(partition);
         for (const perm of perms) {
           const testPositions = new Map(basePositions);
           for (let i = 0; i < perm.length; i++) {
-            testPositions.set(perm[i]!, xSlots[i]!);
+            testPositions.set(perm[i], xSlots[i]);
           }
           const penalty = computeEdgePenalty(
             edgeList,
@@ -355,7 +164,6 @@ function reduceCrossings(
           }
         }
       } else {
-        // For large partitions, use adjacent swap
         const workingOrder = [...partition];
         let improved = true;
         let passes = 0;
@@ -365,7 +173,7 @@ function reduceCrossings(
           for (let i = 0; i < workingOrder.length - 1; i++) {
             const testPositions = new Map(basePositions);
             for (let k = 0; k < workingOrder.length; k++) {
-              testPositions.set(workingOrder[k]!, xSlots[k]!);
+              testPositions.set(workingOrder[k], xSlots[k]);
             }
             const before = computeEdgePenalty(
               edgeList,
@@ -373,14 +181,13 @@ function reduceCrossings(
               degrees,
               nodeGeometry
             );
-
             [workingOrder[i], workingOrder[i + 1]] = [
-              workingOrder[i + 1]!,
-              workingOrder[i]!,
+              workingOrder[i + 1],
+              workingOrder[i]
             ];
             const testPositions2 = new Map(basePositions);
             for (let k = 0; k < workingOrder.length; k++) {
-              testPositions2.set(workingOrder[k]!, xSlots[k]!);
+              testPositions2.set(workingOrder[k], xSlots[k]);
             }
             const after = computeEdgePenalty(
               edgeList,
@@ -388,7 +195,6 @@ function reduceCrossings(
               degrees,
               nodeGeometry
             );
-
             if (after < before) {
               improved = true;
               if (after < bestPenalty) {
@@ -397,28 +203,23 @@ function reduceCrossings(
               }
             } else {
               [workingOrder[i], workingOrder[i + 1]] = [
-                workingOrder[i + 1]!,
-                workingOrder[i]!,
+                workingOrder[i + 1],
+                workingOrder[i]
               ];
             }
           }
         }
       }
-
-      // Apply best permutation if it differs from current
       if (bestPerm.some((name, i) => name !== partition[i])) {
         for (let i = 0; i < bestPerm.length; i++) {
-          gNode(g, bestPerm[i]!).x = xSlots[i]!;
-          // Update in the original rankNodes too
-          const rankIdx = rankNodes.indexOf(partition[i]!);
-          if (rankIdx >= 0) rankNodes[rankIdx] = bestPerm[i]!;
+          gNode(g, bestPerm[i]).x = xSlots[i];
+          const rankIdx = rankNodes.indexOf(partition[i]);
+          if (rankIdx >= 0) rankNodes[rankIdx] = bestPerm[i];
         }
         anyMoved = true;
       }
     }
   }
-
-  // Recompute edge waypoints if any positions changed
   if (anyMoved) {
     for (const edge of edgeList) {
       const edgeData = gEdge(g, edge.source, edge.target);
@@ -426,73 +227,45 @@ function reduceCrossings(
       const srcPos = gNode(g, edge.source);
       const tgtPos = gNode(g, edge.target);
       if (!srcPos || !tgtPos) continue;
-
       const srcBottom = { x: srcPos.x, y: srcPos.y + srcPos.height / 2 };
       const tgtTop = { x: tgtPos.x, y: tgtPos.y - tgtPos.height / 2 };
       const midY = (srcBottom.y + tgtTop.y) / 2;
-
       edgeData.points = [
         srcBottom,
         { x: srcBottom.x, y: midY },
         { x: tgtTop.x, y: midY },
-        tgtTop,
+        tgtTop
       ];
     }
   }
 }
-
-/** Generate all permutations of an array (Heap's algorithm). */
-function permutations<T>(arr: T[]): T[][] {
-  const result: T[][] = [];
+function permutations(arr) {
+  const result = [];
   const a = [...arr];
   const n = a.length;
-  const c = new Array(n).fill(0) as number[];
-
+  const c = new Array(n).fill(0);
   result.push([...a]);
-
   let i = 0;
   while (i < n) {
-    if (c[i]! < i) {
+    if (c[i] < i) {
       if (i % 2 === 0) {
-        [a[0], a[i]] = [a[i]!, a[0]!];
+        [a[0], a[i]] = [a[i], a[0]];
       } else {
-        [a[c[i]!], a[i]] = [a[i]!, a[c[i]!]!];
+        [a[c[i]], a[i]] = [a[i], a[c[i]]];
       }
       result.push([...a]);
-      c[i]!++;
+      c[i]++;
       i = 0;
     } else {
       c[i] = 0;
       i++;
     }
   }
-
   return result;
 }
-
-// ============================================================
-// Roll-Up Logic
-// ============================================================
-
-export interface ContextRelationship {
-  sourceName: string;
-  targetName: string;
-  label?: string;
-  technology?: string;
-  arrowType: C4ArrowType;
-  lineNumber: number;
-}
-
-/**
- * Build a map from element name → top-level ancestor name.
- * Top-level elements map to themselves.
- */
-function buildOwnershipMap(
-  elements: readonly C4Element[]
-): Map<string, string> {
-  const map = new Map<string, string>();
-
-  function walk(el: C4Element, ancestor: string): void {
+function buildOwnershipMap(elements) {
+  const map = /* @__PURE__ */ new Map();
+  function walk(el, ancestor) {
     map.set(el.name, ancestor);
     for (const child of el.children) {
       walk(child, ancestor);
@@ -503,24 +276,14 @@ function buildOwnershipMap(
       }
     }
   }
-
   for (const el of elements) {
     walk(el, el.name);
   }
-
   return map;
 }
-
-/**
- * Collect all relationships from the entire element tree.
- */
-function collectAllRelationships(
-  elements: readonly C4Element[],
-  _ownerMap: Map<string, string>
-): { sourceName: string; rel: C4Relationship }[] {
-  const result: { sourceName: string; rel: C4Relationship }[] = [];
-
-  function walk(el: C4Element): void {
+function collectAllRelationships(elements, _ownerMap) {
+  const result = [];
+  function walk(el) {
     for (const rel of el.relationships) {
       result.push({ sourceName: el.name, rel });
     }
@@ -533,96 +296,59 @@ function collectAllRelationships(
       }
     }
   }
-
   for (const el of elements) {
     walk(el);
   }
-
   return result;
 }
-
-/**
- * Roll up container/component-level relationships to system-to-system edges.
- * - Skips internal relationships (same top-level ancestor).
- * - Deduplicates: same source→target pair keeps only one (first seen).
- * - Explicit system-level relationships override rolled-up ones.
- */
-export function rollUpContextRelationships(
-  parsed: ParsedC4
-): ContextRelationship[] {
+function rollUpContextRelationships(parsed) {
   const ownerMap = buildOwnershipMap(parsed.elements);
   const allRels = collectAllRelationships(parsed.elements, ownerMap);
-
-  // Also include orphan relationships
-  // Separate system-level (explicit) from nested (rolled-up)
   const topLevelNames = new Set(parsed.elements.map((e) => e.name));
-  const explicitKeys = new Set<string>();
-  const explicit: ContextRelationship[] = [];
-  const nested: ContextRelationship[] = [];
-
+  const explicitKeys = /* @__PURE__ */ new Set();
+  const explicit = [];
+  const nested = [];
   for (const { sourceName, rel } of allRels) {
     const sourceAncestor = ownerMap.get(sourceName) ?? sourceName;
     const targetAncestor = ownerMap.get(rel.target) ?? rel.target;
-
-    // Skip internal relationships (both in same system)
     if (sourceAncestor === targetAncestor) continue;
-
-    const entry: ContextRelationship = {
+    const entry = {
       sourceName: sourceAncestor,
       targetName: targetAncestor,
-      ...(rel.label !== undefined && { label: rel.label }),
-      ...(rel.technology !== undefined && { technology: rel.technology }),
+      ...rel.label !== void 0 && { label: rel.label },
+      ...rel.technology !== void 0 && { technology: rel.technology },
       arrowType: rel.arrowType,
-      lineNumber: rel.lineNumber,
+      lineNumber: rel.lineNumber
     };
-
-    // Check if source is a top-level element (explicit system-level rel)
     if (topLevelNames.has(sourceName) && sourceName === sourceAncestor) {
-      const key = `${sourceAncestor}→${targetAncestor}`;
+      const key = `${sourceAncestor}\u2192${targetAncestor}`;
       explicitKeys.add(key);
       explicit.push(entry);
     } else {
       nested.push(entry);
     }
   }
-
-  // Deduplicate: explicit overrides rolled-up
   const result = [...explicit];
   const seenKeys = new Set(explicitKeys);
-
   for (const rel of nested) {
-    const key = `${rel.sourceName}→${rel.targetName}`;
+    const key = `${rel.sourceName}\u2192${rel.targetName}`;
     if (!seenKeys.has(key)) {
       seenKeys.add(key);
       result.push(rel);
     }
   }
-
   return result;
 }
-
-// ============================================================
-// Tag Group Color Resolution
-// ============================================================
-
-function resolveNodeColor(
-  el: C4Element,
-  tagGroups: readonly TagGroup[],
-  activeGroupName: string | null,
-  ancestors?: readonly C4Element[]
-): string | undefined {
-  // Check metadata for explicit color
-  const colorMeta = el.metadata['color'];
+function resolveNodeColor(el, tagGroups, activeGroupName, ancestors) {
+  const colorMeta = el.metadata["color"];
   if (colorMeta) return colorMeta;
-  if (!activeGroupName) return undefined;
-
+  if (!activeGroupName) return void 0;
   const group = tagGroups.find(
     (g) => g.name.toLowerCase() === activeGroupName.toLowerCase()
   );
-  if (!group) return undefined;
+  if (!group) return void 0;
   const key = tagAttrKey(group.name);
-  // Walk inheritance chain: element → ancestors (container → system)
-  let metaValue: string | undefined = el.metadata[key];
+  let metaValue = el.metadata[key];
   if (!metaValue && ancestors) {
     for (const ancestor of ancestors) {
       metaValue = ancestor.metadata[key];
@@ -630,185 +356,105 @@ function resolveNodeColor(
     }
   }
   const resolvedValue = metaValue ?? group.defaultValue;
-  if (!resolvedValue) return '#999999';
-  return (
-    group.entries.find(
-      (e) => e.value.toLowerCase() === resolvedValue.toLowerCase()
-    )?.color ?? '#999999'
-  );
+  if (!resolvedValue) return "#999999";
+  return group.entries.find(
+    (e) => e.value.toLowerCase() === resolvedValue.toLowerCase()
+  )?.color ?? "#999999";
 }
-
-// ============================================================
-// Node Sizing
-// ============================================================
-
-/** Keys to exclude from the below-divider metadata display. */
-const META_EXCLUDE_KEYS = new Set([
-  'description',
-  'tech',
-  'technology',
-  'is a',
+var META_EXCLUDE_KEYS = /* @__PURE__ */ new Set([
+  "description",
+  "tech",
+  "technology",
+  "is a"
 ]);
-
-/** Collect displayable metadata entries for a container card. */
-export function collectCardMetadata(
-  metadata: Record<string, string>
-): { key: string; value: string }[] {
-  const entries: { key: string; value: string }[] = [];
-  // Technology first
-  const tech = metadata['tech'] ?? metadata['technology'];
-  if (tech) entries.push({ key: 'Technology', value: tech });
-  // Then other metadata (tag groups, etc.)
+function collectCardMetadata(metadata) {
+  const entries = [];
+  const tech = metadata["tech"] ?? metadata["technology"];
+  if (tech) entries.push({ key: "Technology", value: tech });
   for (const [k, v] of Object.entries(metadata)) {
     if (META_EXCLUDE_KEYS.has(k.toLowerCase())) continue;
-    // Capitalize key for display
     const displayKey = k.charAt(0).toUpperCase() + k.slice(1);
     entries.push({ key: displayKey, value: v });
   }
   return entries;
 }
-
-export function computeC4NodeDimensions(
-  el: C4Element,
-  options?: { showTechnology?: boolean }
-): { width: number; height: number } {
-  // Width: based on name length, clamped
+function computeC4NodeDimensions(el, options) {
   const nameWidth = measureText(el.name, NAME_FONT_SIZE) + CARD_H_PAD * 2;
   let width = Math.max(MIN_NODE_WIDTH, Math.min(MAX_NODE_WIDTH, nameWidth));
-
   if (options?.showTechnology) {
-    // Container card layout: name + description | divider | metadata rows
-    // (no type label — containers are the default in container view)
-    let height = CARD_V_PAD + NAME_HEIGHT;
-
-    const desc = el.description?.join('\n');
-    if (desc) {
+    let height2 = CARD_V_PAD + NAME_HEIGHT;
+    const desc2 = el.description?.join("\n");
+    if (desc2) {
       const contentWidth = width - CARD_H_PAD * 2;
-      const lines = wrapTextToWidth(desc, DESC_FONT_SIZE, contentWidth);
-      height += lines.length * DESC_LINE_HEIGHT;
+      const lines = wrapTextToWidth(desc2, DESC_FONT_SIZE, contentWidth);
+      height2 += lines.length * DESC_LINE_HEIGHT;
     }
-
-    // Metadata rows below divider
     const metaEntries = collectCardMetadata(el.metadata);
     if (metaEntries.length > 0) {
-      height += DIVIDER_GAP; // divider
-      height += metaEntries.length * META_LINE_HEIGHT;
-      // Widen card if metadata rows need more space
+      height2 += DIVIDER_GAP;
+      height2 += metaEntries.length * META_LINE_HEIGHT;
       const maxMetaWidth = Math.max(
         ...metaEntries.map(
-          (e) =>
-            measureText(`${e.key}: ${e.value}`, META_FONT_SIZE) + CARD_H_PAD * 2
+          (e) => measureText(`${e.key}: ${e.value}`, META_FONT_SIZE) + CARD_H_PAD * 2
         )
       );
       if (maxMetaWidth > width) width = Math.min(MAX_NODE_WIDTH, maxMetaWidth);
     }
-
-    height += CARD_V_PAD;
-    return { width, height };
+    height2 += CARD_V_PAD;
+    return { width, height: height2 };
   }
-
-  // Context card layout: type + name | divider | description
   let height = CARD_V_PAD + TYPE_LABEL_HEIGHT + DIVIDER_GAP + NAME_HEIGHT;
-
-  const desc = el.description?.join('\n');
+  const desc = el.description?.join("\n");
   if (desc) {
     const contentWidth = width - CARD_H_PAD * 2;
     const lines = wrapTextToWidth(desc, DESC_FONT_SIZE, contentWidth);
     height += lines.length * DESC_LINE_HEIGHT;
   }
-
   height += CARD_V_PAD;
-
   return { width, height };
 }
-
-// ============================================================
-// Legend Helpers
-// ============================================================
-
-function computeLegendGroups(
-  tagGroups: readonly TagGroup[]
-): Writable<C4LegendGroup>[] {
-  const result: Writable<C4LegendGroup>[] = [];
-
+function computeLegendGroups(tagGroups) {
+  const result = [];
   for (const group of tagGroups) {
-    const entries: C4LegendEntry[] = [];
+    const entries = [];
     for (const entry of group.entries) {
       entries.push({ value: entry.value, color: entry.color });
     }
     if (entries.length === 0) continue;
-
-    // Compute pill width: group name + entries
-    const nameW =
-      measureLegendText(group.name, LEGEND_PILL_FONT_SIZE) +
-      LEGEND_PILL_PAD * 2;
+    const nameW = measureLegendText(group.name, LEGEND_PILL_FONT_SIZE) + LEGEND_PILL_PAD * 2;
     let capsuleW = LEGEND_CAPSULE_PAD;
     for (const e of entries) {
-      capsuleW +=
-        LEGEND_DOT_R * 2 +
-        LEGEND_ENTRY_DOT_GAP +
-        measureLegendText(e.value, LEGEND_ENTRY_FONT_SIZE) +
-        LEGEND_ENTRY_TRAIL;
+      capsuleW += LEGEND_DOT_R * 2 + LEGEND_ENTRY_DOT_GAP + measureLegendText(e.value, LEGEND_ENTRY_FONT_SIZE) + LEGEND_ENTRY_TRAIL;
     }
     capsuleW += LEGEND_CAPSULE_PAD;
-
     result.push({
       name: group.name,
       entries,
       x: 0,
       y: 0,
       width: nameW + capsuleW,
-      height: LEGEND_HEIGHT,
+      height: LEGEND_HEIGHT
     });
   }
-
   return result;
 }
-
-// ============================================================
-// Adaptive Spacing
-// ============================================================
-
-/**
- * Compute dagre graph spacing based on edge density.
- * Nodes with high fan-out (many labeled edges) need more inter-rank
- * space so labels don't overlap. Returns ranksep and edgesep.
- */
-function computeAdaptiveSpacing(
-  edges: { sourceName: string; label?: string; technology?: string }[]
-): { nodesep: number; ranksep: number; edgesep: number } {
-  // Count max labeled out-degree for any single source node
-  const outDegree = new Map<string, number>();
+function computeAdaptiveSpacing(edges) {
+  const outDegree = /* @__PURE__ */ new Map();
   for (const edge of edges) {
     if (edge.label || edge.technology) {
       outDegree.set(edge.sourceName, (outDegree.get(edge.sourceName) ?? 0) + 1);
     }
   }
   const maxFanOut = Math.max(0, ...outDegree.values());
-
-  // Scale spacing: each additional fan-out edge needs more room for its label.
-  // nodesep: wider horizontal gaps give fan-out edges distinct angles,
-  // making it clear which label belongs to which line.
   const nodesep = Math.max(80, 60 + maxFanOut * 20);
   const ranksep = Math.max(140, 100 + maxFanOut * 35);
   const edgesep = Math.max(30, 20 + maxFanOut * 8);
-
   return { nodesep, ranksep, edgesep };
 }
-
-// ============================================================
-// Main Layout
-// ============================================================
-
-export function layoutC4Context(
-  parsed: ParsedC4,
-  activeTagGroup?: string | null
-): C4LayoutResult {
-  // Filter to person + system elements only
+function layoutC4Context(parsed, activeTagGroup) {
   const contextElements = parsed.elements.filter(
-    (el) => el.type === 'person' || el.type === 'system'
+    (el) => el.type === "person" || el.type === "system"
   );
-
   if (contextElements.length === 0) {
     return {
       nodes: [],
@@ -816,108 +462,80 @@ export function layoutC4Context(
       legend: [],
       groupBoundaries: [],
       width: 0,
-      height: 0,
+      height: 0
     };
   }
-
-  // Roll up relationships
   const contextRels = rollUpContextRelationships(parsed);
-
-  // Compute adaptive spacing based on edge density
   const spacing = computeAdaptiveSpacing(contextRels);
-
-  // Create dagre graph
   const g = new dagre.graphlib.Graph();
   g.setGraph({
-    rankdir: 'TB',
+    rankdir: "TB",
     nodesep: spacing.nodesep,
     ranksep: spacing.ranksep,
-    edgesep: spacing.edgesep,
+    edgesep: spacing.edgesep
   });
   g.setDefaultEdgeLabel(() => ({}));
-
-  // Add nodes
-  const nameToElement = new Map<string, C4Element>();
+  const nameToElement = /* @__PURE__ */ new Map();
   for (const el of contextElements) {
     nameToElement.set(el.name, el);
     const dims = computeC4NodeDimensions(el);
     g.setNode(el.name, { width: dims.width, height: dims.height });
   }
-
-  // Add edges — only between known nodes
-  const validRels: ContextRelationship[] = [];
+  const validRels = [];
   for (const rel of contextRels) {
-    if (
-      nameToElement.has(rel.sourceName) &&
-      nameToElement.has(rel.targetName)
-    ) {
+    if (nameToElement.has(rel.sourceName) && nameToElement.has(rel.targetName)) {
       validRels.push(rel);
-      g.setEdge(rel.sourceName, rel.targetName, { label: rel.label ?? '' });
+      g.setEdge(rel.sourceName, rel.targetName, { label: rel.label ?? "" });
     }
   }
-
-  // Run layout
   dagre.layout(g);
-
-  // Post-dagre crossing reduction
   reduceCrossings(
     g,
     validRels.map((r) => ({ source: r.sourceName, target: r.targetName }))
   );
-
-  // Extract positioned nodes
-  const nodes: Writable<C4LayoutNode>[] = contextElements.map(
-    (el): Writable<C4LayoutNode> => {
+  const nodes = contextElements.map(
+    (el) => {
       const pos = g.node(el.name);
       const color = resolveNodeColor(
         el,
         parsed.tagGroups,
         activeTagGroup ?? null
       );
-      const hasContainers =
-        el.children.some((c) => c.type === 'container') ||
-        el.groups.some((g) => g.children.some((c) => c.type === 'container'));
-      const description = el.description?.join('\n');
-      const drillable = hasContainers || el.importPath ? true : undefined;
+      const hasContainers = el.children.some((c) => c.type === "container") || el.groups.some((g2) => g2.children.some((c) => c.type === "container"));
+      const description = el.description?.join("\n");
+      const drillable = hasContainers || el.importPath ? true : void 0;
       return {
         id: el.name,
         name: el.name,
-        type: el.type as 'person' | 'system',
-        ...(description !== undefined && { description }),
+        type: el.type,
+        ...description !== void 0 && { description },
         metadata: el.metadata,
         lineNumber: el.lineNumber,
-        ...(color !== undefined && { color }),
-        ...(drillable !== undefined && { drillable }),
-        ...(el.importPath !== undefined && { importPath: el.importPath }),
+        ...color !== void 0 && { color },
+        ...drillable !== void 0 && { drillable },
+        ...el.importPath !== void 0 && { importPath: el.importPath },
         x: pos.x,
         y: pos.y,
         width: pos.width,
-        height: pos.height,
+        height: pos.height
       };
     }
   );
-
-  // Extract edges with waypoints
-  const edges: MutableC4LayoutEdge[] = validRels.map(
-    (rel): MutableC4LayoutEdge => {
+  const edges = validRels.map(
+    (rel) => {
       const edgeData = g.edge(rel.sourceName, rel.targetName);
       return {
         source: rel.sourceName,
         target: rel.targetName,
         arrowType: rel.arrowType,
-        ...(rel.label !== undefined && { label: rel.label }),
-        ...(rel.technology !== undefined && { technology: rel.technology }),
+        ...rel.label !== void 0 && { label: rel.label },
+        ...rel.technology !== void 0 && { technology: rel.technology },
         lineNumber: rel.lineNumber,
-        points: edgeData?.points ?? [],
+        points: edgeData?.points ?? []
       };
     }
   );
-
-  // Compute bounding box of all content (nodes + edge points)
-  let minX = Infinity,
-    minY = Infinity,
-    maxX = -Infinity,
-    maxY = -Infinity;
+  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
   for (const node of nodes) {
     const left = node.x - node.width / 2;
     const top = node.y - node.height / 2;
@@ -936,8 +554,6 @@ export function layoutC4Context(
       if (pt.y > maxY) maxY = pt.y;
     }
   }
-
-  // Shift everything so content starts at (MARGIN, MARGIN)
   if (nodes.length > 0) {
     const shiftX = MARGIN - minX;
     const shiftY = MARGIN - minY;
@@ -952,15 +568,9 @@ export function layoutC4Context(
       }
     }
   }
-
   let totalWidth = nodes.length > 0 ? maxX - minX + MARGIN * 2 : 0;
   let totalHeight = nodes.length > 0 ? maxY - minY + MARGIN * 2 : 0;
-
-  // Legend: show all defined tag groups and entries so users see the full
-  // tag vocabulary regardless of which elements are visible at this view level.
   const legendGroups = computeLegendGroups(parsed.tagGroups);
-
-  // Position legend below diagram
   if (legendGroups.length > 0) {
     const legendY = totalHeight + MARGIN;
     let legendX = MARGIN;
@@ -974,31 +584,16 @@ export function layoutC4Context(
     if (legendRight > totalWidth) totalWidth = legendRight;
     if (legendBottom > totalHeight) totalHeight = legendBottom;
   }
-
   return {
     nodes,
     edges,
     legend: legendGroups,
     groupBoundaries: [],
     width: totalWidth,
-    height: totalHeight,
+    height: totalHeight
   };
 }
-
-// ============================================================
-// Container-Level Layout
-// ============================================================
-
-/**
- * Layout containers within a specific system, plus external elements
- * that have relationships with those containers.
- */
-export function layoutC4Containers(
-  parsed: ParsedC4,
-  systemName: string,
-  activeTagGroup?: string | null
-): C4LayoutResult {
-  // Find the system element by name
+function layoutC4Containers(parsed, systemName, activeTagGroup) {
   const system = parsed.elements.find(
     (el) => el.name.toLowerCase() === systemName.toLowerCase()
   );
@@ -1009,21 +604,18 @@ export function layoutC4Containers(
       legend: [],
       groupBoundaries: [],
       width: 0,
-      height: 0,
+      height: 0
     };
   }
-
-  // Collect all containers: direct children + group children
-  const containers: C4Element[] = [];
+  const containers = [];
   for (const child of system.children) {
-    if (child.type === 'container') containers.push(child);
+    if (child.type === "container") containers.push(child);
   }
   for (const group of system.groups) {
     for (const child of group.children) {
-      if (child.type === 'container') containers.push(child);
+      if (child.type === "container") containers.push(child);
     }
   }
-
   if (containers.length === 0) {
     return {
       nodes: [],
@@ -1031,23 +623,15 @@ export function layoutC4Containers(
       legend: [],
       groupBoundaries: [],
       width: 0,
-      height: 0,
+      height: 0
     };
   }
-
   const containerNames = new Set(containers.map((c) => c.name.toLowerCase()));
-
-  // Build name → element map for all top-level elements
-  const topElementsByName = new Map<string, C4Element>();
+  const topElementsByName = /* @__PURE__ */ new Map();
   for (const el of parsed.elements) {
     topElementsByName.set(el.name.toLowerCase(), el);
   }
-
-  // Identify external elements: targets of container relationships that aren't
-  // in this system, OR top-level elements that target containers in this system
-  const externalNames = new Set<string>();
-
-  // Forward: container → target outside this system
+  const externalNames = /* @__PURE__ */ new Set();
   for (const container of containers) {
     for (const rel of container.relationships) {
       const targetLower = rel.target.toLowerCase();
@@ -1056,175 +640,120 @@ export function layoutC4Containers(
       }
     }
   }
-
-  // Reverse: top-level elements (and their children) that target containers in this system
   const ownerMap = buildOwnershipMap(parsed.elements);
   const allRels = collectAllRelationships(parsed.elements, ownerMap);
   for (const { sourceName, rel } of allRels) {
     const sourceAncestor = ownerMap.get(sourceName) ?? sourceName;
-    // Skip relationships from within this system
     if (sourceAncestor.toLowerCase() === system.name.toLowerCase()) continue;
-    // Check if target is a container in this system
     if (containerNames.has(rel.target.toLowerCase())) {
       externalNames.add(sourceAncestor.toLowerCase());
     }
   }
-
-  // Resolve external elements
-  const externals: C4Element[] = [];
+  const externals = [];
   for (const name of externalNames) {
     const el = topElementsByName.get(name);
     if (el) externals.push(el);
   }
-
-  // Build element-to-group mapping for compound graph
-  const elementToGroup = new Map<
-    string,
-    { name: string; lineNumber: number }
-  >();
+  const elementToGroup = /* @__PURE__ */ new Map();
   for (const group of system.groups) {
     for (const child of group.children) {
-      if (child.type === 'container') {
+      if (child.type === "container") {
         elementToGroup.set(child.name, {
           name: group.name,
-          lineNumber: group.lineNumber,
+          lineNumber: group.lineNumber
         });
       }
     }
   }
   const hasGroups = elementToGroup.size > 0;
-
-  // Create dagre graph — use compound when groups exist
-  const g = hasGroups
-    ? new dagre.graphlib.Graph({ compound: true })
-    : new dagre.graphlib.Graph();
+  const g = hasGroups ? new dagre.graphlib.Graph({ compound: true }) : new dagre.graphlib.Graph();
   g.setDefaultEdgeLabel(() => ({}));
-
-  // Add virtual group parent nodes
   if (hasGroups) {
-    const seenGroups = new Set<string>();
+    const seenGroups = /* @__PURE__ */ new Set();
     for (const { name } of elementToGroup.values()) {
       if (!seenGroups.has(name)) {
         seenGroups.add(name);
-        g.setNode('__group_' + name, {});
+        g.setNode("__group_" + name, {});
       }
     }
   }
-
-  // Add container nodes
-  const nameToElement = new Map<string, C4Element>();
+  const nameToElement = /* @__PURE__ */ new Map();
   for (const el of containers) {
     nameToElement.set(el.name, el);
     const dims = computeC4NodeDimensions(el, { showTechnology: true });
     g.setNode(el.name, { width: dims.width, height: dims.height });
-    // Set group parent
     const grp = elementToGroup.get(el.name);
     if (grp) {
-      g.setParent(el.name, '__group_' + grp.name);
+      g.setParent(el.name, "__group_" + grp.name);
     }
   }
-
-  // Add external nodes
   for (const el of externals) {
     nameToElement.set(el.name, el);
     const dims = computeC4NodeDimensions(el);
     g.setNode(el.name, { width: dims.width, height: dims.height });
   }
-
-  // Collect container-level relationships (not rolled up)
-  interface ContainerRel {
-    sourceName: string;
-    targetName: string;
-    label?: string;
-    technology?: string;
-    arrowType: C4ArrowType;
-    lineNumber: number;
-  }
-
-  const containerRels: ContainerRel[] = [];
-  const seenEdgeKeys = new Set<string>();
-
-  // Forward: container → target
+  const containerRels = [];
+  const seenEdgeKeys = /* @__PURE__ */ new Set();
   for (const container of containers) {
     for (const rel of container.relationships) {
       const targetEl = nameToElement.get(rel.target);
       if (!targetEl) continue;
-      const key = `${container.name}→${rel.target}`;
+      const key = `${container.name}\u2192${rel.target}`;
       if (!seenEdgeKeys.has(key)) {
         seenEdgeKeys.add(key);
         containerRels.push({
           sourceName: container.name,
           targetName: rel.target,
-          ...(rel.label !== undefined && { label: rel.label }),
-          ...(rel.technology !== undefined && { technology: rel.technology }),
+          ...rel.label !== void 0 && { label: rel.label },
+          ...rel.technology !== void 0 && { technology: rel.technology },
           arrowType: rel.arrowType,
-          lineNumber: rel.lineNumber,
+          lineNumber: rel.lineNumber
         });
       }
     }
   }
-
-  // Reverse: external → container (find specific container-level relationships)
   for (const { sourceName, rel } of allRels) {
     const sourceAncestor = ownerMap.get(sourceName) ?? sourceName;
     if (sourceAncestor.toLowerCase() === system.name.toLowerCase()) continue;
     if (containerNames.has(rel.target.toLowerCase())) {
       const externalEl = nameToElement.get(sourceAncestor);
       if (!externalEl) continue;
-      const key = `${sourceAncestor}→${rel.target}`;
+      const key = `${sourceAncestor}\u2192${rel.target}`;
       if (!seenEdgeKeys.has(key)) {
         seenEdgeKeys.add(key);
         containerRels.push({
           sourceName: sourceAncestor,
           targetName: rel.target,
-          ...(rel.label !== undefined && { label: rel.label }),
-          ...(rel.technology !== undefined && { technology: rel.technology }),
+          ...rel.label !== void 0 && { label: rel.label },
+          ...rel.technology !== void 0 && { technology: rel.technology },
           arrowType: rel.arrowType,
-          lineNumber: rel.lineNumber,
+          lineNumber: rel.lineNumber
         });
       }
     }
   }
-
-  // Compute adaptive spacing based on edge fan-out
   const spacing = computeAdaptiveSpacing(containerRels);
   g.setGraph({
-    rankdir: 'TB',
+    rankdir: "TB",
     nodesep: spacing.nodesep,
     ranksep: spacing.ranksep,
-    edgesep: spacing.edgesep,
+    edgesep: spacing.edgesep
   });
-
-  // Add edges to dagre
   for (const rel of containerRels) {
-    if (
-      nameToElement.has(rel.sourceName) &&
-      nameToElement.has(rel.targetName)
-    ) {
-      g.setEdge(rel.sourceName, rel.targetName, { label: rel.label ?? '' });
+    if (nameToElement.has(rel.sourceName) && nameToElement.has(rel.targetName)) {
+      g.setEdge(rel.sourceName, rel.targetName, { label: rel.label ?? "" });
     }
   }
-
-  // Run layout
   dagre.layout(g);
-
-  // Post-dagre crossing reduction (with group-aware partitioning)
-  const nodeGroupMap = hasGroups
-    ? new Map([...elementToGroup.entries()].map(([k, v]) => [k, v.name]))
-    : undefined;
+  const nodeGroupMap = hasGroups ? new Map([...elementToGroup.entries()].map(([k, v]) => [k, v.name])) : void 0;
   reduceCrossings(
     g,
-    containerRels
-      .filter(
-        (r) =>
-          nameToElement.has(r.sourceName) && nameToElement.has(r.targetName)
-      )
-      .map((r) => ({ source: r.sourceName, target: r.targetName })),
+    containerRels.filter(
+      (r) => nameToElement.has(r.sourceName) && nameToElement.has(r.targetName)
+    ).map((r) => ({ source: r.sourceName, target: r.targetName })),
     nodeGroupMap
   );
-
-  // Extract positioned nodes
-  const nodes: Writable<C4LayoutNode>[] = [];
+  const nodes = [];
   for (const el of containers) {
     const pos = g.node(el.name);
     const color = resolveNodeColor(
@@ -1232,31 +761,28 @@ export function layoutC4Containers(
       parsed.tagGroups,
       activeTagGroup ?? null
     );
-    const tech = el.metadata['tech'] ?? el.metadata['technology'];
-    const hasComponents =
-      el.children.some((c) => c.type === 'component') ||
-      el.groups.some((grp) => grp.children.some((c) => c.type === 'component'));
-    const description = el.description?.join('\n');
-    const drillable = hasComponents || el.importPath ? true : undefined;
+    const tech = el.metadata["tech"] ?? el.metadata["technology"];
+    const hasComponents = el.children.some((c) => c.type === "component") || el.groups.some((grp) => grp.children.some((c) => c.type === "component"));
+    const description = el.description?.join("\n");
+    const drillable = hasComponents || el.importPath ? true : void 0;
     nodes.push({
       id: el.name,
       name: el.name,
-      type: 'container',
-      ...(description !== undefined && { description }),
+      type: "container",
+      ...description !== void 0 && { description },
       metadata: el.metadata,
       lineNumber: el.lineNumber,
-      ...(color !== undefined && { color }),
+      ...color !== void 0 && { color },
       shape: el.shape,
-      ...(tech !== undefined && { technology: tech }),
-      ...(drillable !== undefined && { drillable }),
-      ...(el.importPath !== undefined && { importPath: el.importPath }),
+      ...tech !== void 0 && { technology: tech },
+      ...drillable !== void 0 && { drillable },
+      ...el.importPath !== void 0 && { importPath: el.importPath },
       x: pos.x,
       y: pos.y,
       width: pos.width,
-      height: pos.height,
+      height: pos.height
     });
   }
-
   for (const el of externals) {
     const pos = g.node(el.name);
     const color = resolveNodeColor(
@@ -1264,47 +790,37 @@ export function layoutC4Containers(
       parsed.tagGroups,
       activeTagGroup ?? null
     );
-    const description = el.description?.join('\n');
+    const description = el.description?.join("\n");
     nodes.push({
       id: el.name,
       name: el.name,
-      type: el.type as 'person' | 'system',
-      ...(description !== undefined && { description }),
+      type: el.type,
+      ...description !== void 0 && { description },
       metadata: el.metadata,
       lineNumber: el.lineNumber,
-      ...(color !== undefined && { color }),
+      ...color !== void 0 && { color },
       x: pos.x,
       y: pos.y,
       width: pos.width,
-      height: pos.height,
+      height: pos.height
     });
   }
-
-  // Extract edges
-  const edges: MutableC4LayoutEdge[] = containerRels
-    .filter(
-      (rel) =>
-        nameToElement.has(rel.sourceName) && nameToElement.has(rel.targetName)
-    )
-    .map((rel): MutableC4LayoutEdge => {
-      const edgeData = g.edge(rel.sourceName, rel.targetName);
-      return {
-        source: rel.sourceName,
-        target: rel.targetName,
-        arrowType: rel.arrowType,
-        ...(rel.label !== undefined && { label: rel.label }),
-        ...(rel.technology !== undefined && { technology: rel.technology }),
-        lineNumber: rel.lineNumber,
-        points: edgeData?.points ?? [],
-      };
-    });
-
-  // Compute boundary box from container nodes only
-  const containerNodes = nodes.filter((n) => n.type === 'container');
-  let bMinX = Infinity,
-    bMinY = Infinity,
-    bMaxX = -Infinity,
-    bMaxY = -Infinity;
+  const edges = containerRels.filter(
+    (rel) => nameToElement.has(rel.sourceName) && nameToElement.has(rel.targetName)
+  ).map((rel) => {
+    const edgeData = g.edge(rel.sourceName, rel.targetName);
+    return {
+      source: rel.sourceName,
+      target: rel.targetName,
+      arrowType: rel.arrowType,
+      ...rel.label !== void 0 && { label: rel.label },
+      ...rel.technology !== void 0 && { technology: rel.technology },
+      lineNumber: rel.lineNumber,
+      points: edgeData?.points ?? []
+    };
+  });
+  const containerNodes = nodes.filter((n) => n.type === "container");
+  let bMinX = Infinity, bMinY = Infinity, bMaxX = -Infinity, bMaxY = -Infinity;
   for (const n of containerNodes) {
     const left = n.x - n.width / 2;
     const top = n.y - n.height / 2;
@@ -1315,39 +831,30 @@ export function layoutC4Containers(
     if (right > bMaxX) bMaxX = right;
     if (bottom > bMaxY) bMaxY = bottom;
   }
-
-  const boundary: Writable<C4LayoutBoundary> = {
+  const boundary = {
     label: system.name,
-    typeLabel: 'system',
+    typeLabel: "system",
     lineNumber: system.lineNumber,
     x: bMinX - BOUNDARY_PAD,
     y: bMinY - BOUNDARY_PAD,
     width: bMaxX - bMinX + BOUNDARY_PAD * 2,
-    height: bMaxY - bMinY + BOUNDARY_PAD * 2,
+    height: bMaxY - bMinY + BOUNDARY_PAD * 2
   };
-
-  // Compute group boundaries from member node positions
-  const groupBoundaries: Writable<C4LayoutBoundary>[] = [];
+  const groupBoundaries = [];
   if (hasGroups) {
     const nodeMap = new Map(containerNodes.map((n) => [n.name, n]));
-    const seenGroups = new Map<
-      string,
-      { lineNumber: number; members: Writable<C4LayoutNode>[] }
-    >();
+    const seenGroups = /* @__PURE__ */ new Map();
     for (const [elName, grp] of elementToGroup) {
       const node = nodeMap.get(elName);
       if (!node) continue;
       if (!seenGroups.has(grp.name)) {
         seenGroups.set(grp.name, { lineNumber: grp.lineNumber, members: [] });
       }
-      seenGroups.get(grp.name)!.members.push(node);
+      seenGroups.get(grp.name).members.push(node);
     }
     for (const [groupName, { lineNumber, members }] of seenGroups) {
       if (members.length === 0) continue;
-      let gMinX = Infinity,
-        gMinY = Infinity,
-        gMaxX = -Infinity,
-        gMaxY = -Infinity;
+      let gMinX = Infinity, gMinY = Infinity, gMaxX = -Infinity, gMaxY = -Infinity;
       for (const m of members) {
         const left = m.x - m.width / 2;
         const top = m.y - m.height / 2;
@@ -1360,21 +867,16 @@ export function layoutC4Containers(
       }
       groupBoundaries.push({
         label: groupName,
-        typeLabel: 'group',
+        typeLabel: "group",
         lineNumber,
         x: gMinX - GROUP_BOUNDARY_PAD,
         y: gMinY - GROUP_BOUNDARY_PAD,
         width: gMaxX - gMinX + GROUP_BOUNDARY_PAD * 2,
-        height: gMaxY - gMinY + GROUP_BOUNDARY_PAD * 2,
+        height: gMaxY - gMinY + GROUP_BOUNDARY_PAD * 2
       });
     }
   }
-
-  // Compute bounding box of all content (nodes + boundary + group boundaries + edge points)
-  let minX = Infinity,
-    minY = Infinity,
-    maxX = -Infinity,
-    maxY = -Infinity;
+  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
   for (const node of nodes) {
     const left = node.x - node.width / 2;
     const top = node.y - node.height / 2;
@@ -1403,8 +905,6 @@ export function layoutC4Containers(
       if (pt.y > maxY) maxY = pt.y;
     }
   }
-
-  // Shift everything so content starts at (MARGIN, MARGIN)
   const shiftX = MARGIN - minX;
   const shiftY = MARGIN - minY;
   for (const node of nodes) {
@@ -1423,13 +923,9 @@ export function layoutC4Containers(
       pt.y += shiftY;
     }
   }
-
   let totalWidth = maxX - minX + MARGIN * 2;
   let totalHeight = maxY - minY + MARGIN * 2;
-
   const legendGroups = computeLegendGroups(parsed.tagGroups);
-
-  // Position legend below diagram
   if (legendGroups.length > 0) {
     const legendY = totalHeight + MARGIN;
     let legendX = MARGIN;
@@ -1443,7 +939,6 @@ export function layoutC4Containers(
     if (legendRight > totalWidth) totalWidth = legendRight;
     if (legendBottom > totalHeight) totalHeight = legendBottom;
   }
-
   return {
     nodes,
     edges,
@@ -1451,25 +946,10 @@ export function layoutC4Containers(
     boundary,
     groupBoundaries,
     width: totalWidth,
-    height: totalHeight,
+    height: totalHeight
   };
 }
-
-// ============================================================
-// Component-Level Layout
-// ============================================================
-
-/**
- * Layout components within a specific container, plus external elements
- * that have relationships with those components.
- */
-export function layoutC4Components(
-  parsed: ParsedC4,
-  systemName: string,
-  containerName: string,
-  activeTagGroup?: string | null
-): C4LayoutResult {
-  // Find the system element by name
+function layoutC4Components(parsed, systemName, containerName, activeTagGroup) {
   const system = parsed.elements.find(
     (el) => el.name.toLowerCase() === systemName.toLowerCase()
   );
@@ -1480,17 +960,12 @@ export function layoutC4Components(
       legend: [],
       groupBoundaries: [],
       width: 0,
-      height: 0,
+      height: 0
     };
   }
-
-  // Find the container within the system (direct children + group children)
-  let targetContainer: C4Element | undefined;
+  let targetContainer;
   for (const child of system.children) {
-    if (
-      child.type === 'container' &&
-      child.name.toLowerCase() === containerName.toLowerCase()
-    ) {
+    if (child.type === "container" && child.name.toLowerCase() === containerName.toLowerCase()) {
       targetContainer = child;
       break;
     }
@@ -1498,10 +973,7 @@ export function layoutC4Components(
   if (!targetContainer) {
     for (const group of system.groups) {
       for (const child of group.children) {
-        if (
-          child.type === 'container' &&
-          child.name.toLowerCase() === containerName.toLowerCase()
-        ) {
+        if (child.type === "container" && child.name.toLowerCase() === containerName.toLowerCase()) {
           targetContainer = child;
           break;
         }
@@ -1516,21 +988,18 @@ export function layoutC4Components(
       legend: [],
       groupBoundaries: [],
       width: 0,
-      height: 0,
+      height: 0
     };
   }
-
-  // Collect all components: direct children + group children
-  const components: C4Element[] = [];
+  const components = [];
   for (const child of targetContainer.children) {
-    if (child.type === 'component') components.push(child);
+    if (child.type === "component") components.push(child);
   }
   for (const group of targetContainer.groups) {
     for (const child of group.children) {
-      if (child.type === 'component') components.push(child);
+      if (child.type === "component") components.push(child);
     }
   }
-
   if (components.length === 0) {
     return {
       nodes: [],
@@ -1538,36 +1007,27 @@ export function layoutC4Components(
       legend: [],
       groupBoundaries: [],
       width: 0,
-      height: 0,
+      height: 0
     };
   }
-
   const componentNames = new Set(components.map((c) => c.name.toLowerCase()));
-
-  // Build name → element map for all top-level elements and containers in this system
-  const topElementsByName = new Map<string, C4Element>();
+  const topElementsByName = /* @__PURE__ */ new Map();
   for (const el of parsed.elements) {
     topElementsByName.set(el.name.toLowerCase(), el);
-    // Also index containers in every system for external container resolution
     for (const child of el.children) {
-      if (child.type === 'container') {
+      if (child.type === "container") {
         topElementsByName.set(child.name.toLowerCase(), child);
       }
     }
     for (const group of el.groups) {
       for (const child of group.children) {
-        if (child.type === 'container') {
+        if (child.type === "container") {
           topElementsByName.set(child.name.toLowerCase(), child);
         }
       }
     }
   }
-
-  // Identify external elements: targets of component relationships not in this container,
-  // or elements whose relationships target components in this container
-  const externalNames = new Set<string>();
-
-  // Forward: component → target outside this container
+  const externalNames = /* @__PURE__ */ new Set();
   for (const component of components) {
     for (const rel of component.relationships) {
       const targetLower = rel.target.toLowerCase();
@@ -1576,23 +1036,15 @@ export function layoutC4Components(
       }
     }
   }
-
-  // Reverse: any element that targets a component in this container
   const ownerMap = buildOwnershipMap(parsed.elements);
   const allRels = collectAllRelationships(parsed.elements, ownerMap);
   for (const { sourceName, rel } of allRels) {
-    // Skip relationships from within this container
     if (componentNames.has(sourceName.toLowerCase())) continue;
-    // Check if target is a component in this container
     if (componentNames.has(rel.target.toLowerCase())) {
-      // Resolve to the most specific known element: if source is a container, use it;
-      // otherwise roll up to system ancestor
       const sourceAncestor = ownerMap.get(sourceName) ?? sourceName;
-      // If source is inside the same container, skip
       if (sourceAncestor.toLowerCase() === targetContainer.name.toLowerCase())
         continue;
       if (sourceAncestor.toLowerCase() === system.name.toLowerCase()) {
-        // Source is in same system — try to resolve to container level
         const sourceLower = sourceName.toLowerCase();
         if (topElementsByName.has(sourceLower)) {
           externalNames.add(sourceLower);
@@ -1604,175 +1056,118 @@ export function layoutC4Components(
       }
     }
   }
-
-  // Resolve external elements
-  const externals: C4Element[] = [];
+  const externals = [];
   for (const name of externalNames) {
     const el = topElementsByName.get(name);
     if (el) externals.push(el);
   }
-
-  // Build element-to-group mapping for compound graph
-  const elementToGroup = new Map<
-    string,
-    { name: string; lineNumber: number }
-  >();
+  const elementToGroup = /* @__PURE__ */ new Map();
   for (const group of targetContainer.groups) {
     for (const child of group.children) {
-      if (child.type === 'component') {
+      if (child.type === "component") {
         elementToGroup.set(child.name, {
           name: group.name,
-          lineNumber: group.lineNumber,
+          lineNumber: group.lineNumber
         });
       }
     }
   }
   const hasGroups = elementToGroup.size > 0;
-
-  // Create dagre graph — use compound when groups exist
-  const g = hasGroups
-    ? new dagre.graphlib.Graph({ compound: true })
-    : new dagre.graphlib.Graph();
+  const g = hasGroups ? new dagre.graphlib.Graph({ compound: true }) : new dagre.graphlib.Graph();
   g.setDefaultEdgeLabel(() => ({}));
-
-  // Add virtual group parent nodes
   if (hasGroups) {
-    const seenGroups = new Set<string>();
+    const seenGroups = /* @__PURE__ */ new Set();
     for (const { name } of elementToGroup.values()) {
       if (!seenGroups.has(name)) {
         seenGroups.add(name);
-        g.setNode('__group_' + name, {});
+        g.setNode("__group_" + name, {});
       }
     }
   }
-
-  // Add component nodes
-  const nameToElement = new Map<string, C4Element>();
+  const nameToElement = /* @__PURE__ */ new Map();
   for (const el of components) {
     nameToElement.set(el.name, el);
     const dims = computeC4NodeDimensions(el, { showTechnology: true });
     g.setNode(el.name, { width: dims.width, height: dims.height });
-    // Set group parent
     const grp = elementToGroup.get(el.name);
     if (grp) {
-      g.setParent(el.name, '__group_' + grp.name);
+      g.setParent(el.name, "__group_" + grp.name);
     }
   }
-
-  // Add external nodes
   for (const el of externals) {
     nameToElement.set(el.name, el);
     const dims = computeC4NodeDimensions(el);
     g.setNode(el.name, { width: dims.width, height: dims.height });
   }
-
-  // Collect component-level relationships
-  interface ComponentRel {
-    sourceName: string;
-    targetName: string;
-    label?: string;
-    technology?: string;
-    arrowType: C4ArrowType;
-    lineNumber: number;
-  }
-
-  const componentRels: ComponentRel[] = [];
-  const seenEdgeKeys = new Set<string>();
-
-  // Forward: component → target
+  const componentRels = [];
+  const seenEdgeKeys = /* @__PURE__ */ new Set();
   for (const component of components) {
     for (const rel of component.relationships) {
       const targetEl = nameToElement.get(rel.target);
       if (!targetEl) continue;
-      const key = `${component.name}→${rel.target}`;
+      const key = `${component.name}\u2192${rel.target}`;
       if (!seenEdgeKeys.has(key)) {
         seenEdgeKeys.add(key);
         componentRels.push({
           sourceName: component.name,
           targetName: rel.target,
-          ...(rel.label !== undefined && { label: rel.label }),
-          ...(rel.technology !== undefined && { technology: rel.technology }),
+          ...rel.label !== void 0 && { label: rel.label },
+          ...rel.technology !== void 0 && { technology: rel.technology },
           arrowType: rel.arrowType,
-          lineNumber: rel.lineNumber,
+          lineNumber: rel.lineNumber
         });
       }
     }
   }
-
-  // Reverse: external → component
   for (const { sourceName, rel } of allRels) {
     if (componentNames.has(sourceName.toLowerCase())) continue;
     if (!componentNames.has(rel.target.toLowerCase())) continue;
-
     const sourceAncestor = ownerMap.get(sourceName) ?? sourceName;
     if (sourceAncestor.toLowerCase() === targetContainer.name.toLowerCase())
       continue;
-
-    // Resolve source to the external element we added
-    let resolvedSource: string | undefined;
+    let resolvedSource;
     if (nameToElement.has(sourceName)) {
       resolvedSource = sourceName;
     } else if (nameToElement.has(sourceAncestor)) {
       resolvedSource = sourceAncestor;
     }
     if (!resolvedSource) continue;
-
-    const key = `${resolvedSource}→${rel.target}`;
+    const key = `${resolvedSource}\u2192${rel.target}`;
     if (!seenEdgeKeys.has(key)) {
       seenEdgeKeys.add(key);
       componentRels.push({
         sourceName: resolvedSource,
         targetName: rel.target,
-        ...(rel.label !== undefined && { label: rel.label }),
-        ...(rel.technology !== undefined && { technology: rel.technology }),
+        ...rel.label !== void 0 && { label: rel.label },
+        ...rel.technology !== void 0 && { technology: rel.technology },
         arrowType: rel.arrowType,
-        lineNumber: rel.lineNumber,
+        lineNumber: rel.lineNumber
       });
     }
   }
-
-  // Compute adaptive spacing based on edge fan-out
   const spacing = computeAdaptiveSpacing(componentRels);
   g.setGraph({
-    rankdir: 'TB',
+    rankdir: "TB",
     nodesep: spacing.nodesep,
     ranksep: spacing.ranksep,
-    edgesep: spacing.edgesep,
+    edgesep: spacing.edgesep
   });
-
-  // Add edges to dagre
   for (const rel of componentRels) {
-    if (
-      nameToElement.has(rel.sourceName) &&
-      nameToElement.has(rel.targetName)
-    ) {
-      g.setEdge(rel.sourceName, rel.targetName, { label: rel.label ?? '' });
+    if (nameToElement.has(rel.sourceName) && nameToElement.has(rel.targetName)) {
+      g.setEdge(rel.sourceName, rel.targetName, { label: rel.label ?? "" });
     }
   }
-
-  // Run layout
   dagre.layout(g);
-
-  // Post-dagre crossing reduction (with group-aware partitioning)
-  const nodeGroupMap = hasGroups
-    ? new Map([...elementToGroup.entries()].map(([k, v]) => [k, v.name]))
-    : undefined;
+  const nodeGroupMap = hasGroups ? new Map([...elementToGroup.entries()].map(([k, v]) => [k, v.name])) : void 0;
   reduceCrossings(
     g,
-    componentRels
-      .filter(
-        (r) =>
-          nameToElement.has(r.sourceName) && nameToElement.has(r.targetName)
-      )
-      .map((r) => ({ source: r.sourceName, target: r.targetName })),
+    componentRels.filter(
+      (r) => nameToElement.has(r.sourceName) && nameToElement.has(r.targetName)
+    ).map((r) => ({ source: r.sourceName, target: r.targetName })),
     nodeGroupMap
   );
-
-  // Tag inheritance ancestors: container → system
   const ancestors = [targetContainer, system];
-
-  // Extract positioned nodes
-  const nodes: Writable<C4LayoutNode>[] = [];
+  const nodes = [];
   for (const el of components) {
     const pos = g.node(el.name);
     const color = resolveNodeColor(
@@ -1781,31 +1176,28 @@ export function layoutC4Components(
       activeTagGroup ?? null,
       ancestors
     );
-    const tech = el.metadata['tech'] ?? el.metadata['technology'];
-    const hasComponents =
-      el.children.some((c) => c.type === 'component') ||
-      el.groups.some((grp) => grp.children.some((c) => c.type === 'component'));
-    const description = el.description?.join('\n');
-    const drillable = hasComponents || el.importPath ? true : undefined;
+    const tech = el.metadata["tech"] ?? el.metadata["technology"];
+    const hasComponents = el.children.some((c) => c.type === "component") || el.groups.some((grp) => grp.children.some((c) => c.type === "component"));
+    const description = el.description?.join("\n");
+    const drillable = hasComponents || el.importPath ? true : void 0;
     nodes.push({
       id: el.name,
       name: el.name,
-      type: 'component',
-      ...(description !== undefined && { description }),
+      type: "component",
+      ...description !== void 0 && { description },
       metadata: el.metadata,
       lineNumber: el.lineNumber,
-      ...(color !== undefined && { color }),
+      ...color !== void 0 && { color },
       shape: el.shape,
-      ...(tech !== undefined && { technology: tech }),
-      ...(drillable !== undefined && { drillable }),
-      ...(el.importPath !== undefined && { importPath: el.importPath }),
+      ...tech !== void 0 && { technology: tech },
+      ...drillable !== void 0 && { drillable },
+      ...el.importPath !== void 0 && { importPath: el.importPath },
       x: pos.x,
       y: pos.y,
       width: pos.width,
-      height: pos.height,
+      height: pos.height
     });
   }
-
   for (const el of externals) {
     const pos = g.node(el.name);
     const color = resolveNodeColor(
@@ -1813,47 +1205,37 @@ export function layoutC4Components(
       parsed.tagGroups,
       activeTagGroup ?? null
     );
-    const description = el.description?.join('\n');
+    const description = el.description?.join("\n");
     nodes.push({
       id: el.name,
       name: el.name,
-      type: el.type as 'person' | 'system' | 'container',
-      ...(description !== undefined && { description }),
+      type: el.type,
+      ...description !== void 0 && { description },
       metadata: el.metadata,
       lineNumber: el.lineNumber,
-      ...(color !== undefined && { color }),
+      ...color !== void 0 && { color },
       x: pos.x,
       y: pos.y,
       width: pos.width,
-      height: pos.height,
+      height: pos.height
     });
   }
-
-  // Extract edges
-  const edges: MutableC4LayoutEdge[] = componentRels
-    .filter(
-      (rel) =>
-        nameToElement.has(rel.sourceName) && nameToElement.has(rel.targetName)
-    )
-    .map((rel): MutableC4LayoutEdge => {
-      const edgeData = g.edge(rel.sourceName, rel.targetName);
-      return {
-        source: rel.sourceName,
-        target: rel.targetName,
-        arrowType: rel.arrowType,
-        ...(rel.label !== undefined && { label: rel.label }),
-        ...(rel.technology !== undefined && { technology: rel.technology }),
-        lineNumber: rel.lineNumber,
-        points: edgeData?.points ?? [],
-      };
-    });
-
-  // Compute boundary box from component nodes only
-  const componentNodes = nodes.filter((n) => n.type === 'component');
-  let bMinX = Infinity,
-    bMinY = Infinity,
-    bMaxX = -Infinity,
-    bMaxY = -Infinity;
+  const edges = componentRels.filter(
+    (rel) => nameToElement.has(rel.sourceName) && nameToElement.has(rel.targetName)
+  ).map((rel) => {
+    const edgeData = g.edge(rel.sourceName, rel.targetName);
+    return {
+      source: rel.sourceName,
+      target: rel.targetName,
+      arrowType: rel.arrowType,
+      ...rel.label !== void 0 && { label: rel.label },
+      ...rel.technology !== void 0 && { technology: rel.technology },
+      lineNumber: rel.lineNumber,
+      points: edgeData?.points ?? []
+    };
+  });
+  const componentNodes = nodes.filter((n) => n.type === "component");
+  let bMinX = Infinity, bMinY = Infinity, bMaxX = -Infinity, bMaxY = -Infinity;
   for (const n of componentNodes) {
     const left = n.x - n.width / 2;
     const top = n.y - n.height / 2;
@@ -1864,39 +1246,30 @@ export function layoutC4Components(
     if (right > bMaxX) bMaxX = right;
     if (bottom > bMaxY) bMaxY = bottom;
   }
-
-  const boundary: Writable<C4LayoutBoundary> = {
+  const boundary = {
     label: targetContainer.name,
-    typeLabel: 'container',
+    typeLabel: "container",
     lineNumber: targetContainer.lineNumber,
     x: bMinX - BOUNDARY_PAD,
     y: bMinY - BOUNDARY_PAD,
     width: bMaxX - bMinX + BOUNDARY_PAD * 2,
-    height: bMaxY - bMinY + BOUNDARY_PAD * 2,
+    height: bMaxY - bMinY + BOUNDARY_PAD * 2
   };
-
-  // Compute group boundaries from member node positions
-  const groupBoundaries: Writable<C4LayoutBoundary>[] = [];
+  const groupBoundaries = [];
   if (hasGroups) {
     const nodeMap = new Map(componentNodes.map((n) => [n.name, n]));
-    const seenGroups = new Map<
-      string,
-      { lineNumber: number; members: Writable<C4LayoutNode>[] }
-    >();
+    const seenGroups = /* @__PURE__ */ new Map();
     for (const [elName, grp] of elementToGroup) {
       const node = nodeMap.get(elName);
       if (!node) continue;
       if (!seenGroups.has(grp.name)) {
         seenGroups.set(grp.name, { lineNumber: grp.lineNumber, members: [] });
       }
-      seenGroups.get(grp.name)!.members.push(node);
+      seenGroups.get(grp.name).members.push(node);
     }
     for (const [groupName, { lineNumber, members }] of seenGroups) {
       if (members.length === 0) continue;
-      let gMinX = Infinity,
-        gMinY = Infinity,
-        gMaxX = -Infinity,
-        gMaxY = -Infinity;
+      let gMinX = Infinity, gMinY = Infinity, gMaxX = -Infinity, gMaxY = -Infinity;
       for (const m of members) {
         const left = m.x - m.width / 2;
         const top = m.y - m.height / 2;
@@ -1909,21 +1282,16 @@ export function layoutC4Components(
       }
       groupBoundaries.push({
         label: groupName,
-        typeLabel: 'group',
+        typeLabel: "group",
         lineNumber,
         x: gMinX - GROUP_BOUNDARY_PAD,
         y: gMinY - GROUP_BOUNDARY_PAD,
         width: gMaxX - gMinX + GROUP_BOUNDARY_PAD * 2,
-        height: gMaxY - gMinY + GROUP_BOUNDARY_PAD * 2,
+        height: gMaxY - gMinY + GROUP_BOUNDARY_PAD * 2
       });
     }
   }
-
-  // Compute bounding box of all content (nodes + boundary + group boundaries + edge points)
-  let minX = Infinity,
-    minY = Infinity,
-    maxX = -Infinity,
-    maxY = -Infinity;
+  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
   for (const node of nodes) {
     const left = node.x - node.width / 2;
     const top = node.y - node.height / 2;
@@ -1952,8 +1320,6 @@ export function layoutC4Components(
       if (pt.y > maxY) maxY = pt.y;
     }
   }
-
-  // Shift everything so content starts at (MARGIN, MARGIN)
   const shiftX = MARGIN - minX;
   const shiftY = MARGIN - minY;
   for (const node of nodes) {
@@ -1972,13 +1338,9 @@ export function layoutC4Components(
       pt.y += shiftY;
     }
   }
-
   let totalWidth = maxX - minX + MARGIN * 2;
   let totalHeight = maxY - minY + MARGIN * 2;
-
   const legendGroups = computeLegendGroups(parsed.tagGroups);
-
-  // Position legend below diagram
   if (legendGroups.length > 0) {
     const legendY = totalHeight + MARGIN;
     let legendX = MARGIN;
@@ -1992,7 +1354,6 @@ export function layoutC4Components(
     if (legendRight > totalWidth) totalWidth = legendRight;
     if (legendBottom > totalHeight) totalHeight = legendBottom;
   }
-
   return {
     nodes,
     edges,
@@ -2000,63 +1361,30 @@ export function layoutC4Components(
     boundary,
     groupBoundaries,
     width: totalWidth,
-    height: totalHeight,
+    height: totalHeight
   };
 }
-
-// ============================================================
-// Deployment Diagram Layout
-// ============================================================
-
-/**
- * Resolve a container reference name to its C4Element by walking the parsed
- * element tree. Matches container names case-insensitively.
- */
-function resolveContainerRef(
-  parsed: ParsedC4,
-  refName: string
-): C4Element | undefined {
+function resolveContainerRef(parsed, refName) {
   const lower = refName.toLowerCase();
   for (const el of parsed.elements) {
     for (const child of el.children) {
-      if (child.type === 'container' && child.name.toLowerCase() === lower)
+      if (child.type === "container" && child.name.toLowerCase() === lower)
         return child;
     }
     for (const group of el.groups) {
       for (const child of group.children) {
-        if (child.type === 'container' && child.name.toLowerCase() === lower)
+        if (child.type === "container" && child.name.toLowerCase() === lower)
           return child;
       }
     }
   }
-  return undefined;
+  return void 0;
 }
-
-/**
- * Collect all container ref nodes from the deployment tree, flattened with
- * their parent infra node ID for compound graph assignment.
- */
-interface DeploymentRefEntry {
-  refName: string;
-  element: C4Element;
-  infraId: string;
-  /** Line number of the infra node containing this ref. */
-  deployLineNumber: number;
-}
-
-function collectDeploymentRefs(
-  nodes: readonly C4DeploymentNode[],
-  parsed: ParsedC4,
-  parentId: string | null,
-  refs: DeploymentRefEntry[],
-  infraIds: Map<string, C4DeploymentNode>,
-  infraParents: Map<string, string | null>
-): void {
+function collectDeploymentRefs(nodes, parsed, parentId, refs, infraIds, infraParents) {
   for (const node of nodes) {
     const infraId = `__infra_${node.name}`;
     infraIds.set(infraId, node);
     infraParents.set(infraId, parentId);
-
     for (const ref of node.containerRefs) {
       const el = resolveContainerRef(parsed, ref);
       if (el) {
@@ -2064,11 +1392,10 @@ function collectDeploymentRefs(
           refName: ref,
           element: el,
           infraId,
-          deployLineNumber: node.lineNumber,
+          deployLineNumber: node.lineNumber
         });
       }
     }
-
     collectDeploymentRefs(
       node.children,
       parsed,
@@ -2079,18 +1406,7 @@ function collectDeploymentRefs(
     );
   }
 }
-
-/**
- * Layout a C4 deployment diagram.
- *
- * Infrastructure nodes become boundary boxes (nested).
- * Container refs inside them become cards.
- * Edges are drawn between referenced containers that have relationships.
- */
-export function layoutC4Deployment(
-  parsed: ParsedC4,
-  activeTagGroup?: string | null
-): C4LayoutResult {
+function layoutC4Deployment(parsed, activeTagGroup) {
   if (parsed.deployment.length === 0) {
     return {
       nodes: [],
@@ -2098,14 +1414,12 @@ export function layoutC4Deployment(
       legend: [],
       groupBoundaries: [],
       width: 0,
-      height: 0,
+      height: 0
     };
   }
-
-  // Collect all refs and infra node info
-  const refs: DeploymentRefEntry[] = [];
-  const infraIds = new Map<string, C4DeploymentNode>();
-  const infraParents = new Map<string, string | null>();
+  const refs = [];
+  const infraIds = /* @__PURE__ */ new Map();
+  const infraParents = /* @__PURE__ */ new Map();
   collectDeploymentRefs(
     parsed.deployment,
     parsed,
@@ -2114,7 +1428,6 @@ export function layoutC4Deployment(
     infraIds,
     infraParents
   );
-
   if (refs.length === 0) {
     return {
       nodes: [],
@@ -2122,56 +1435,34 @@ export function layoutC4Deployment(
       legend: [],
       groupBoundaries: [],
       width: 0,
-      height: 0,
+      height: 0
     };
   }
-
-  // Deduplicate refs by element name (a container can appear in multiple infra
-  // nodes — keep first occurrence). Track which container names are in scope.
-  const seenRefs = new Map<string, DeploymentRefEntry>();
+  const seenRefs = /* @__PURE__ */ new Map();
   for (const ref of refs) {
     const key = ref.element.name.toLowerCase();
     if (!seenRefs.has(key)) seenRefs.set(key, ref);
   }
   const refEntries = [...seenRefs.values()];
   const refNames = new Set(refEntries.map((r) => r.element.name.toLowerCase()));
-
-  // Build a name→element map for resolved containers
-  const nameToElement = new Map<string, C4Element>();
+  const nameToElement = /* @__PURE__ */ new Map();
   for (const r of refEntries) {
     nameToElement.set(r.element.name, r.element);
   }
-
-  // Build compound dagre graph: infra nodes as parents, container refs as leaf nodes
   const g = new dagre.graphlib.Graph({ compound: true });
   g.setDefaultEdgeLabel(() => ({}));
-
-  // Add virtual parent nodes for each infra node
   for (const [infraId] of infraIds) {
     g.setNode(infraId, {});
     const parentId = infraParents.get(infraId);
     if (parentId) g.setParent(infraId, parentId);
   }
-
-  // Add container ref nodes
   for (const r of refEntries) {
     const dims = computeC4NodeDimensions(r.element, { showTechnology: true });
     g.setNode(r.element.name, { width: dims.width, height: dims.height });
     g.setParent(r.element.name, r.infraId);
   }
-
-  // Collect relationships between referenced containers
-  interface DeployRel {
-    sourceName: string;
-    targetName: string;
-    label?: string;
-    technology?: string;
-    arrowType: C4ArrowType;
-    lineNumber: number;
-  }
-  const deployRels: DeployRel[] = [];
-  const seenEdgeKeys = new Set<string>();
-
+  const deployRels = [];
+  const seenEdgeKeys = /* @__PURE__ */ new Set();
   for (const r of refEntries) {
     for (const rel of r.element.relationships) {
       if (refNames.has(rel.target.toLowerCase())) {
@@ -2181,54 +1472,38 @@ export function layoutC4Deployment(
           deployRels.push({
             sourceName: r.element.name,
             targetName: rel.target,
-            ...(rel.label !== undefined && { label: rel.label }),
-            ...(rel.technology !== undefined && { technology: rel.technology }),
+            ...rel.label !== void 0 && { label: rel.label },
+            ...rel.technology !== void 0 && { technology: rel.technology },
             arrowType: rel.arrowType,
-            lineNumber: rel.lineNumber,
+            lineNumber: rel.lineNumber
           });
         }
       }
     }
   }
-
-  // Adaptive spacing and graph config
   const spacing = computeAdaptiveSpacing(deployRels);
   g.setGraph({
-    rankdir: 'TB',
+    rankdir: "TB",
     nodesep: spacing.nodesep,
     ranksep: spacing.ranksep,
-    edgesep: spacing.edgesep,
+    edgesep: spacing.edgesep
   });
-
-  // Add edges to dagre
   for (const rel of deployRels) {
-    if (
-      nameToElement.has(rel.sourceName) &&
-      nameToElement.has(rel.targetName)
-    ) {
-      g.setEdge(rel.sourceName, rel.targetName, { label: rel.label ?? '' });
+    if (nameToElement.has(rel.sourceName) && nameToElement.has(rel.targetName)) {
+      g.setEdge(rel.sourceName, rel.targetName, { label: rel.label ?? "" });
     }
   }
-
-  // Run layout
   dagre.layout(g);
-
-  // Post-dagre crossing reduction
-  const nodeInfraMap = new Map<string, string>();
+  const nodeInfraMap = /* @__PURE__ */ new Map();
   for (const r of refEntries) nodeInfraMap.set(r.element.name, r.infraId);
   reduceCrossings(
     g,
-    deployRels
-      .filter(
-        (r) =>
-          nameToElement.has(r.sourceName) && nameToElement.has(r.targetName)
-      )
-      .map((r) => ({ source: r.sourceName, target: r.targetName })),
+    deployRels.filter(
+      (r) => nameToElement.has(r.sourceName) && nameToElement.has(r.targetName)
+    ).map((r) => ({ source: r.sourceName, target: r.targetName })),
     nodeInfraMap
   );
-
-  // Extract positioned nodes
-  const nodes: Writable<C4LayoutNode>[] = [];
+  const nodes = [];
   for (const r of refEntries) {
     const pos = g.node(r.element.name);
     const color = resolveNodeColor(
@@ -2236,75 +1511,52 @@ export function layoutC4Deployment(
       parsed.tagGroups,
       activeTagGroup ?? null
     );
-    const tech = r.element.metadata['tech'] ?? r.element.metadata['technology'];
-    const description = r.element.description?.join('\n');
+    const tech = r.element.metadata["tech"] ?? r.element.metadata["technology"];
+    const description = r.element.description?.join("\n");
     nodes.push({
       id: r.element.name,
       name: r.element.name,
-      type: 'container',
-      ...(description !== undefined && { description }),
+      type: "container",
+      ...description !== void 0 && { description },
       metadata: r.element.metadata,
       lineNumber: r.element.lineNumber,
-      ...(color !== undefined && { color }),
+      ...color !== void 0 && { color },
       shape: r.element.shape,
-      ...(tech !== undefined && { technology: tech }),
+      ...tech !== void 0 && { technology: tech },
       x: pos.x,
       y: pos.y,
       width: pos.width,
-      height: pos.height,
+      height: pos.height
     });
   }
-
-  // Extract edges
-  const edges: MutableC4LayoutEdge[] = deployRels
-    .filter(
-      (rel) =>
-        nameToElement.has(rel.sourceName) && nameToElement.has(rel.targetName)
-    )
-    .map((rel): MutableC4LayoutEdge => {
-      const edgeData = g.edge(rel.sourceName, rel.targetName);
-      return {
-        source: rel.sourceName,
-        target: rel.targetName,
-        arrowType: rel.arrowType,
-        ...(rel.label !== undefined && { label: rel.label }),
-        ...(rel.technology !== undefined && { technology: rel.technology }),
-        lineNumber: rel.lineNumber,
-        points: edgeData?.points ?? [],
-      };
-    });
-
-  // Compute infrastructure boundary boxes from member node positions
-  const groupBoundaries: Writable<C4LayoutBoundary>[] = [];
+  const edges = deployRels.filter(
+    (rel) => nameToElement.has(rel.sourceName) && nameToElement.has(rel.targetName)
+  ).map((rel) => {
+    const edgeData = g.edge(rel.sourceName, rel.targetName);
+    return {
+      source: rel.sourceName,
+      target: rel.targetName,
+      arrowType: rel.arrowType,
+      ...rel.label !== void 0 && { label: rel.label },
+      ...rel.technology !== void 0 && { technology: rel.technology },
+      lineNumber: rel.lineNumber,
+      points: edgeData?.points ?? []
+    };
+  });
+  const groupBoundaries = [];
   const nodeMap = new Map(nodes.map((n) => [n.name, n]));
-
-  // Collect members for each infra node (containers directly inside it)
-  const infraMembers = new Map<string, Writable<C4LayoutNode>[]>();
+  const infraMembers = /* @__PURE__ */ new Map();
   for (const r of refEntries) {
     const members = infraMembers.get(r.infraId) ?? [];
     const node = nodeMap.get(r.element.name);
     if (node) members.push(node);
     infraMembers.set(r.infraId, members);
   }
-
-  // Compute boundaries bottom-up: leaf infra nodes first, then parents.
-  const infraBounds = new Map<
-    string,
-    { x: number; y: number; width: number; height: number }
-  >();
-
-  function computeInfraBounds(
-    infraId: string
-  ): { x: number; y: number; width: number; height: number } | null {
-    if (infraBounds.has(infraId)) return infraBounds.get(infraId)!;
-
-    let bMinX = Infinity,
-      bMinY = Infinity,
-      bMaxX = -Infinity,
-      bMaxY = -Infinity;
+  const infraBounds = /* @__PURE__ */ new Map();
+  function computeInfraBounds(infraId) {
+    if (infraBounds.has(infraId)) return infraBounds.get(infraId);
+    let bMinX = Infinity, bMinY = Infinity, bMaxX = -Infinity, bMaxY = -Infinity;
     let hasContent = false;
-
-    // Direct container ref members
     const members = infraMembers.get(infraId) ?? [];
     for (const m of members) {
       hasContent = true;
@@ -2317,8 +1569,6 @@ export function layoutC4Deployment(
       if (right > bMaxX) bMaxX = right;
       if (bottom > bMaxY) bMaxY = bottom;
     }
-
-    // Child infra node boundaries
     for (const [childId, parentId] of infraParents) {
       if (parentId === infraId) {
         const childBounds = computeInfraBounds(childId);
@@ -2333,41 +1583,30 @@ export function layoutC4Deployment(
         }
       }
     }
-
     if (!hasContent) return null;
-
     const bounds = {
       x: bMinX - BOUNDARY_PAD,
       y: bMinY - BOUNDARY_PAD,
       width: bMaxX - bMinX + BOUNDARY_PAD * 2,
-      height: bMaxY - bMinY + BOUNDARY_PAD * 2,
+      height: bMaxY - bMinY + BOUNDARY_PAD * 2
     };
     infraBounds.set(infraId, bounds);
     return bounds;
   }
-
-  // Process all infra nodes (recursion handles ordering)
   for (const [infraId, node] of infraIds) {
     const bounds = computeInfraBounds(infraId);
     if (bounds) {
-      const shapeLabel = node.shape !== 'default' ? node.shape : 'node';
+      const shapeLabel = node.shape !== "default" ? node.shape : "node";
       groupBoundaries.push({
         label: node.name,
         typeLabel: shapeLabel,
         lineNumber: node.lineNumber,
-        ...bounds,
+        ...bounds
       });
     }
   }
-
-  // Sort boundaries so outermost (largest area) are first — rendered bottom to top
   groupBoundaries.sort((a, b) => b.width * b.height - a.width * a.height);
-
-  // Compute total bounding box
-  let minX = Infinity,
-    minY = Infinity,
-    maxX = -Infinity,
-    maxY = -Infinity;
+  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
   for (const node of nodes) {
     const left = node.x - node.width / 2;
     const top = node.y - node.height / 2;
@@ -2392,8 +1631,6 @@ export function layoutC4Deployment(
       if (pt.y > maxY) maxY = pt.y;
     }
   }
-
-  // Shift everything so content starts at (MARGIN, MARGIN)
   const shiftX = MARGIN - minX;
   const shiftY = MARGIN - minY;
   for (const node of nodes) {
@@ -2410,12 +1647,9 @@ export function layoutC4Deployment(
       pt.y += shiftY;
     }
   }
-
   let totalWidth = maxX - minX + MARGIN * 2;
   let totalHeight = maxY - minY + MARGIN * 2;
-
   const legendGroups = computeLegendGroups(parsed.tagGroups);
-
   if (legendGroups.length > 0) {
     const legendY = totalHeight + MARGIN;
     let legendX = MARGIN;
@@ -2429,13 +1663,23 @@ export function layoutC4Deployment(
     if (legendRight > totalWidth) totalWidth = legendRight;
     if (legendBottom > totalHeight) totalHeight = legendBottom;
   }
-
   return {
     nodes,
     edges,
     legend: legendGroups,
     groupBoundaries,
     width: totalWidth,
-    height: totalHeight,
+    height: totalHeight
   };
 }
+
+export {
+  rollUpContextRelationships,
+  collectCardMetadata,
+  computeC4NodeDimensions,
+  layoutC4Context,
+  layoutC4Containers,
+  layoutC4Components,
+  layoutC4Deployment
+};
+//# sourceMappingURL=chunk-QEBUY5NY.js.map