@trokster/l-cursor 0.0.1

package/dist/core/interaction.js

@@ -0,0 +1,232 @@
+// Pointer / pinch / wheel interaction with inertia. Framework-agnostic: it
+// mutates the camera (always through the store, so a single subscriber can drive
+// re-rendering) and calls optional lifecycle hooks, targeting the affine camera
+// (uniform zoom).
+
+export function createInteraction({ camera, svgElRef, onChange, onGesture, onAnchor }) {
+	let dragging = false;
+	let lastX = 0;
+	let lastY = 0;
+	let rafId = 0;
+	let lastTick = 0;
+	let panVx = 0;
+	let panVy = 0;
+	let zoomV = 0;
+	let zoomAnchorX = 0;
+	let zoomAnchorY = 0;
+	let lastMoveTS = 0;
+	let lastWheelTS = 0;
+	const PAN_FRICTION = 5.0;
+	const ZOOM_FRICTION = 6.0;
+	const PAN_EPS = 5;
+	const ZOOM_EPS = 1e-4;
+	const activePointers = new Map();
+	let pinchActive = false;
+	let pinchData = null;
+
+	const notify = () => onChange?.();
+
+	function stopInertia() {
+		if (rafId) cancelAnimationFrame(rafId);
+		rafId = 0;
+		lastTick = 0;
+		panVx = panVy = zoomV = 0;
+	}
+	function ensureLoop() {
+		if (!rafId) rafId = requestAnimationFrame(tickInertia);
+	}
+
+	function tickInertia(ts) {
+		const now = ts || performance.now();
+		if (!lastTick) {
+			lastTick = now;
+			rafId = requestAnimationFrame(tickInertia);
+			return;
+		}
+		const dt = Math.max(0, (now - lastTick) / 1000);
+		lastTick = now;
+		let active = false;
+
+		if (Math.abs(zoomV) > ZOOM_EPS) {
+			camera.zoomAt(Math.exp(zoomV * dt), zoomAnchorX, zoomAnchorY);
+			zoomV *= Math.exp(-ZOOM_FRICTION * dt);
+			if (Math.abs(zoomV) > ZOOM_EPS) active = true;
+			else zoomV = 0;
+		}
+		if (Math.hypot(panVx, panVy) > PAN_EPS) {
+			camera.pan(panVx * dt, panVy * dt);
+			const decay = Math.exp(-PAN_FRICTION * dt);
+			panVx *= decay;
+			panVy *= decay;
+			if (Math.hypot(panVx, panVy) > PAN_EPS) active = true;
+			else panVx = panVy = 0;
+		}
+		notify();
+		if (active) rafId = requestAnimationFrame(tickInertia);
+		else {
+			rafId = 0;
+			lastTick = 0;
+		}
+	}
+
+	function pointerToSvg(clientX, clientY) {
+		const el = svgElRef?.();
+		if (!el) return { x: clientX, y: clientY };
+		try {
+			if (el.createSVGPoint && el.getScreenCTM) {
+				const pt = el.createSVGPoint();
+				pt.x = clientX;
+				pt.y = clientY;
+				const m = el.getScreenCTM();
+				if (m) {
+					const loc = pt.matrixTransform(m.inverse());
+					return { x: loc.x, y: loc.y };
+				}
+			}
+		} catch {}
+		const rect = el.getBoundingClientRect?.();
+		return rect ? { x: clientX - rect.left, y: clientY - rect.top } : { x: clientX, y: clientY };
+	}
+
+	function cachePointer(e, force = false) {
+		if (!force && !activePointers.has(e.pointerId)) return;
+		const p = pointerToSvg(e.clientX, e.clientY);
+		const c = activePointers.get(e.pointerId) ?? {};
+		c.clientX = e.clientX;
+		c.clientY = e.clientY;
+		c.svgX = p.x;
+		c.svgY = p.y;
+		activePointers.set(e.pointerId, c);
+	}
+
+	function startPinch() {
+		if (pinchActive || activePointers.size < 2) return;
+		const ids = Array.from(activePointers.keys()).slice(0, 2);
+		const p1 = activePointers.get(ids[0]);
+		const p2 = activePointers.get(ids[1]);
+		if (!p1 || !p2) return;
+		const cam = camera.get();
+		const w1 = { x: (p1.svgX - cam.x) / cam.sx, y: (p1.svgY - cam.y) / cam.sy };
+		const w2 = { x: (p2.svgX - cam.x) / cam.sx, y: (p2.svgY - cam.y) / cam.sy };
+		const dw = Math.hypot(w2.x - w1.x, w2.y - w1.y);
+		if (!isFinite(dw) || dw === 0) return;
+		pinchActive = true;
+		pinchData = { ids, world1: w1, world2: w2, worldDistance: dw };
+		dragging = false;
+		panVx = panVy = zoomV = 0;
+		onGesture?.('start');
+	}
+
+	function applyPinch() {
+		if (!pinchActive || !pinchData) return;
+		const p1 = activePointers.get(pinchData.ids[0]);
+		const p2 = activePointers.get(pinchData.ids[1]);
+		if (!p1 || !p2) return;
+		const ds = Math.hypot(p2.svgX - p1.svgX, p2.svgY - p1.svgY);
+		if (!isFinite(ds) || ds === 0) return;
+		const scale = ds / pinchData.worldDistance;
+		const tx1 = p1.svgX - pinchData.world1.x * scale;
+		const ty1 = p1.svgY - pinchData.world1.y * scale;
+		const tx2 = p2.svgX - pinchData.world2.x * scale;
+		const ty2 = p2.svgY - pinchData.world2.y * scale;
+		onAnchor?.((p1.svgX + p2.svgX) / 2, (p1.svgY + p2.svgY) / 2);
+		camera.set({ x: (tx1 + tx2) / 2, y: (ty1 + ty2) / 2, scale });
+		notify();
+	}
+
+	function onPointerDown(e) {
+		if (e.button !== undefined && e.button !== 0) return;
+		stopInertia();
+		cachePointer(e, true);
+		try {
+			svgElRef?.()?.setPointerCapture?.(e.pointerId);
+		} catch {}
+		startPinch();
+		if (pinchActive || activePointers.size > 1) return;
+		dragging = true;
+		lastX = e.clientX;
+		lastY = e.clientY;
+		lastMoveTS = e.timeStamp || performance.now();
+	}
+
+	function onPointerMove(e) {
+		cachePointer(e);
+		if (pinchActive) {
+			applyPinch();
+			return;
+		}
+		if (activePointers.size >= 2) {
+			startPinch();
+			if (pinchActive) {
+				applyPinch();
+				return;
+			}
+		}
+		if (!dragging) return;
+		const dx = e.clientX - lastX;
+		const dy = e.clientY - lastY;
+		camera.pan(dx, dy);
+		lastX = e.clientX;
+		lastY = e.clientY;
+		const now = e.timeStamp || performance.now();
+		const dt = Math.max(1 / 240, (now - lastMoveTS) / 1000);
+		panVx = dx / dt;
+		panVy = dy / dt;
+		lastMoveTS = now;
+		notify();
+	}
+
+	function onPointerUp(e) {
+		const wasDragging = dragging && !pinchActive;
+		activePointers.delete(e.pointerId);
+		try {
+			svgElRef?.()?.releasePointerCapture?.(e.pointerId);
+		} catch {}
+		if (pinchActive) {
+			const stillValid = pinchData?.ids?.every((id) => activePointers.has(id));
+			if (!stillValid) {
+				pinchActive = false;
+				pinchData = null;
+				panVx = panVy = zoomV = 0;
+				onGesture?.('end');
+			} else return;
+		}
+		dragging = false;
+		if (wasDragging && Math.hypot(panVx, panVy) > PAN_EPS) ensureLoop();
+		// promote a remaining pointer to a drag
+		if (!pinchActive && activePointers.size === 1) {
+			const it = activePointers.entries().next();
+			if (!it.done) {
+				const [, info] = it.value;
+				dragging = true;
+				lastX = info.clientX;
+				lastY = info.clientY;
+				lastMoveTS = e.timeStamp || performance.now();
+			}
+		}
+	}
+
+	function onWheel(e) {
+		e.preventDefault();
+		const p = pointerToSvg(e.clientX, e.clientY);
+		const factor = e.deltaY < 0 ? 1.1 : 1 / 1.1;
+		onAnchor?.(p.x, p.y);
+		camera.zoomAt(factor, p.x, p.y);
+		zoomAnchorX = p.x;
+		zoomAnchorY = p.y;
+		const now = e.timeStamp || performance.now();
+		const dt = Math.max(1 / 240, lastWheelTS ? (now - lastWheelTS) / 1000 : 1 / 60);
+		lastWheelTS = now;
+		zoomV += Math.log(factor) / dt;
+		notify();
+		ensureLoop();
+	}
+
+	return {
+		onPointerDown,
+		onPointerMove,
+		onPointerUp,
+		onWheel,
+		destroy: stopInertia
+	};
+}

package/dist/core/rebase.d.ts

@@ -0,0 +1,35 @@
+/**
+ * @param {{x:number,y:number,sx:number,sy:number}} cam  current camera
+ * @param {{cx:number,cy:number,hx:number,hy:number}} oldBox  F in the old frame
+ * @param {{cx:number,cy:number,hx:number,hy:number}} newBox  F in the new frame
+ * @returns {{x:number,y:number,sx:number,sy:number}} new camera
+ */
+export function rebaseCamera(cam: {
+    x: number;
+    y: number;
+    sx: number;
+    sy: number;
+}, oldBox: {
+    cx: number;
+    cy: number;
+    hx: number;
+    hy: number;
+}, newBox: {
+    cx: number;
+    cy: number;
+    hx: number;
+    hy: number;
+}): {
+    x: number;
+    y: number;
+    sx: number;
+    sy: number;
+};
+/** Box of a layout node view (circle: size=r; rect: w,h present). */
+export function nodeBox(view: any): {
+    cx: any;
+    cy: any;
+    hx: any;
+    hy: any;
+};
+export function screenExtent(view: any, cam: any): number;

package/dist/core/rebase.js

@@ -0,0 +1,41 @@
+// Referential rebasing — the heart of infinite zoom (THEORY.md §4).
+//
+// We have one node F that exists in both the OLD frame and the NEW (re-rooted)
+// frame. Given F's axis-aligned box in each frame and the current camera, we
+// produce the new camera so the on-screen image is pixel-identical. The rebase
+// is therefore invisible: the scale readout jumps, the picture does not.
+//
+// A "box" is { cx, cy, hx, hy } — center and half-extents. Circles use
+// hx = hy = radius; rects use hx = w/2, hy = h/2. Per-axis math handles both the
+// uniform (circle/pack/network) and anisotropic (treemap) cases with one path.
+
+/**
+ * @param {{x:number,y:number,sx:number,sy:number}} cam  current camera
+ * @param {{cx:number,cy:number,hx:number,hy:number}} oldBox  F in the old frame
+ * @param {{cx:number,cy:number,hx:number,hy:number}} newBox  F in the new frame
+ * @returns {{x:number,y:number,sx:number,sy:number}} new camera
+ */
+export function rebaseCamera(cam, oldBox, newBox) {
+	// scale_new = scale_old * (oldExtent / newExtent)   [THEORY §4]
+	const sx = cam.sx * (oldBox.hx / newBox.hx);
+	const sy = cam.sy * (oldBox.hy / newBox.hy);
+	// t_new = t_old + center_old * scale_old - center_new * scale_new
+	const x = cam.x + oldBox.cx * cam.sx - newBox.cx * sx;
+	const y = cam.y + oldBox.cy * cam.sy - newBox.cy * sy;
+	return { x, y, sx, sy };
+}
+
+/** Box of a layout node view (circle: size=r; rect: w,h present). */
+export function nodeBox(view) {
+	if (view.w != null && view.h != null) {
+		return { cx: view.cx, cy: view.cy, hx: view.w / 2, hy: view.h / 2 };
+	}
+	return { cx: view.cx, cy: view.cy, hx: view.size, hy: view.size };
+}
+
+// On-screen size (px) of a node's smaller extent under a camera — the quantity
+// the rebase thresholds (descend / ascend) are measured against (THEORY.md §4).
+export function screenExtent(view, cam) {
+	const box = nodeBox(view);
+	return Math.min(box.hx * cam.sx, box.hy * cam.sy);
+}

package/dist/core/tree.d.ts

@@ -0,0 +1,32 @@
+/**
+ * @param {{nodes: Array<{id:string, parent?:string, children?:string[], value?:number}>}} data
+ * @returns {{
+ *   byId: Map<string, any>,
+ *   children: Map<string, string[]>,
+ *   parent: Map<string, string|null>,
+ *   roots: string[],
+ *   value: Map<string, number>,   // leaf value (data.value ?? 1) summed up the tree
+ *   count: Map<string, number>,   // number of leaves under (incl. self if leaf)
+ *   height: Map<string, number>   // longest path to a leaf
+ * }}
+ */
+export function indexTree(data: {
+    nodes: Array<{
+        id: string;
+        parent?: string;
+        children?: string[];
+        value?: number;
+    }>;
+}): {
+    byId: Map<string, any>;
+    children: Map<string, string[]>;
+    parent: Map<string, string | null>;
+    roots: string[];
+    value: Map<string, number>;
+    count: Map<string, number>;
+    height: Map<string, number>;
+};
+/** Walk from id up to its ancestor `steps` levels above (clamped at the root). */
+export function ascend(index: any, id: any, steps: any): any;
+/** Full ancestor chain [id, parent, ..., root]. */
+export function ancestors(index: any, id: any): any[];

package/dist/core/tree.js

@@ -0,0 +1,121 @@
+// Shared tree/graph indexing for every layout.
+//
+// Accepts the loose `{ nodes: [{ id, parent?, children?, value? }] }` shape and
+// produces a fast, immutable index: id -> node, parent/child maps, roots, plus
+// rolled-up `value` and `count` per subtree (needed for pack/treemap sizing) and
+// a stable child order (needed so layouts are deterministic across re-roots —
+// the self-similarity invariant from THEORY.md §2).
+
+/**
+ * @param {{nodes: Array<{id:string, parent?:string, children?:string[], value?:number}>}} data
+ * @returns {{
+ *   byId: Map<string, any>,
+ *   children: Map<string, string[]>,
+ *   parent: Map<string, string|null>,
+ *   roots: string[],
+ *   value: Map<string, number>,   // leaf value (data.value ?? 1) summed up the tree
+ *   count: Map<string, number>,   // number of leaves under (incl. self if leaf)
+ *   height: Map<string, number>   // longest path to a leaf
+ * }}
+ */
+export function indexTree(data) {
+	const nodes = data?.nodes ?? [];
+	const byId = new Map();
+	const children = new Map();
+	const parent = new Map();
+
+	for (const n of nodes) {
+		byId.set(n.id, n);
+		if (!children.has(n.id)) children.set(n.id, []);
+		if (!parent.has(n.id)) parent.set(n.id, null);
+	}
+
+	const linkParentChild = (p, c) => {
+		if (!children.has(p)) children.set(p, []);
+		const arr = children.get(p);
+		if (!arr.includes(c)) arr.push(c);
+		// last writer wins for parent; trees have one parent anyway
+		parent.set(c, p);
+	};
+
+	for (const n of nodes) {
+		for (const c of n.children ?? []) {
+			if (byId.has(c)) linkParentChild(n.id, c);
+		}
+		if (n.parent != null && byId.has(n.parent)) linkParentChild(n.parent, n.id);
+	}
+
+	const roots = [];
+	for (const id of byId.keys()) {
+		if (parent.get(id) == null) roots.push(id);
+	}
+
+	// Roll up value / count / height with an explicit post-order DFS (no recursion
+	// limits on deep trees).
+	const value = new Map();
+	const count = new Map();
+	const height = new Map();
+	const visit = (start) => {
+		const stack = [[start, false]];
+		while (stack.length) {
+			const [id, processed] = stack.pop();
+			const kids = children.get(id) ?? [];
+			if (!processed) {
+				stack.push([id, true]);
+				for (const k of kids) stack.push([k, false]);
+			} else {
+				if (kids.length === 0) {
+					const v = byId.get(id)?.value;
+					value.set(id, typeof v === 'number' && v > 0 ? v : 1);
+					count.set(id, 1);
+					height.set(id, 0);
+				} else {
+					let sv = 0;
+					let sc = 0;
+					let h = 0;
+					for (const k of kids) {
+						sv += value.get(k) ?? 1;
+						sc += count.get(k) ?? 1;
+						h = Math.max(h, (height.get(k) ?? 0) + 1);
+					}
+					// internal nodes may also carry their own value contribution
+					const own = byId.get(id)?.value;
+					value.set(id, sv + (typeof own === 'number' && own > 0 ? own : 0));
+					count.set(id, sc);
+					height.set(id, h);
+				}
+			}
+		}
+	};
+	for (const r of roots) visit(r);
+	// guard: any node not reached (cycles / detached) gets defaults
+	for (const id of byId.keys()) {
+		if (!value.has(id)) value.set(id, 1);
+		if (!count.has(id)) count.set(id, 1);
+		if (!height.has(id)) height.set(id, 0);
+	}
+
+	return { byId, children, parent, roots, value, count, height };
+}
+
+/** Walk from id up to its ancestor `steps` levels above (clamped at the root). */
+export function ascend(index, id, steps) {
+	let cur = id;
+	for (let i = 0; i < steps; i++) {
+		const p = index.parent.get(cur);
+		if (p == null) break;
+		cur = p;
+	}
+	return cur;
+}
+
+/** Full ancestor chain [id, parent, ..., root]. */
+export function ancestors(index, id) {
+	const out = [];
+	let cur = id;
+	while (cur != null) {
+		out.push(cur);
+		cur = index.parent.get(cur);
+	}
+	return out;
+}

package/dist/data/deepTree.d.ts

@@ -0,0 +1,19 @@
+/**
+ * @param {{depth?:number, seed?:number, maxNodes?:number}} opts
+ * @returns {{nodes: Array<{id:string, children:string[]}>, stats:{nodes:number, depth:number, leaves:number}}}
+ */
+export function generateDeepTree({ depth, seed, maxNodes }?: {
+    depth?: number;
+    seed?: number;
+    maxNodes?: number;
+}): {
+    nodes: Array<{
+        id: string;
+        children: string[];
+    }>;
+    stats: {
+        nodes: number;
+        depth: number;
+        leaves: number;
+    };
+};

package/dist/data/deepTree.js

@@ -0,0 +1,60 @@
+// Deterministic deep-tree generator: a hierarchy that actually GOES DOWN —
+// guaranteed veins reaching `depth` generations, with bushy shallows and
+// thinning depths so per-referential layouts stay cheap. The point: give the
+// infinite-zoom engine real depth to fall into (the engine's maxDepth is only
+// the per-referential layout window; total depth is explored by rebasing).
+
+function seeded(seed) {
+	let s = seed >>> 0;
+	return () => {
+		s = (s * 1664525 + 1013904223) >>> 0;
+		return s / 0x100000000;
+	};
+}
+
+/**
+ * @param {{depth?:number, seed?:number, maxNodes?:number}} opts
+ * @returns {{nodes: Array<{id:string, children:string[]}>, stats:{nodes:number, depth:number, leaves:number}}}
+ */
+export function generateDeepTree({ depth = 16, seed = 42, maxNodes = 9000 } = {}) {
+	const rand = seeded(seed);
+	const nodes = [];
+	let count = 0;
+	let maxDepthSeen = 0;
+	let leaves = 0;
+
+	// children per node: bushy near the top, thinning with depth; `onVein`
+	// guarantees at least one child so the branch reaches full depth
+	function childCount(d, onVein) {
+		if (d >= depth) return 0;
+		let n;
+		if (d < 2)
+			n = 4 + Math.floor(rand() * 5); // 4-8
+		else if (d < 6)
+			n = Math.floor(rand() * 6); // 0-5
+		else if (d < 11)
+			n = Math.floor(rand() * 4); // 0-3
+		else n = Math.floor(rand() * 3); // 0-2
+		if (onVein) n = Math.max(1, n);
+		return n;
+	}
+
+	function build(id, d, onVein) {
+		count++;
+		maxDepthSeen = Math.max(maxDepthSeen, d);
+		const n = count < maxNodes ? childCount(d, onVein) : 0;
+		const children = [];
+		if (n === 0) leaves++;
+		// one random child inherits the vein so SOME path always reaches `depth`
+		const veinIdx = Math.floor(rand() * Math.max(1, n));
+		for (let i = 0; i < n; i++) {
+			const cid = `${id}-${i + 1}`;
+			children.push(cid);
+			build(cid, d + 1, onVein && i === veinIdx);
+		}
+		nodes.push({ id, children });
+	}
+
+	build('n0', 0, true);
+	return { nodes, stats: { nodes: count, depth: maxDepthSeen, leaves } };
+}

package/dist/index.d.ts

@@ -0,0 +1,7 @@
+export { default as ZoomScene } from "./viz/ZoomScene.svelte";
+export { createEngine } from "./core/engine.js";
+export { createCamera } from "./core/camera.js";
+export { createInteraction } from "./core/interaction.js";
+export { radialLayout } from "./layouts/radial.js";
+export { rebaseCamera, nodeBox, screenExtent } from "./core/rebase.js";
+export { indexTree, ascend, ancestors } from "./core/tree.js";

package/dist/index.js

@@ -0,0 +1,17 @@
+// Infinite-zoom visualization library.
+//
+// One generic engine (camera + referential rebasing + LOD + culling) driving a
+// radial fractal layout. See THEORY.md for the math, LLM.md to integrate.
+
+// Generic renderer
+export { default as ZoomScene } from './viz/ZoomScene.svelte';
+
+// Engine core
+export { createEngine } from './core/engine.js';
+export { createCamera } from './core/camera.js';
+export { createInteraction } from './core/interaction.js';
+export { rebaseCamera, nodeBox, screenExtent } from './core/rebase.js';
+export { indexTree, ascend, ancestors } from './core/tree.js';
+
+// Layout (conforms to layout(index, rootId, opts))
+export { radialLayout } from './layouts/radial.js';

package/dist/layouts/radial.d.ts

@@ -0,0 +1,6 @@
+export function radialLayout(index: any, rootId: any, opts?: {}): {
+    rootId: any;
+    nodes: Map<any, any>;
+    order: any[];
+};
+export const RADIAL_KIND: "circle";

package/dist/layouts/radial.js

@@ -0,0 +1,63 @@
+// Radial fractal layout (THEORY.md §7.1).
+//
+// Node = circle of radius R. Children sit on a ring at 0.75R; each child radius
+// is min(0.15R, 0.75R·sin(π/n)) so n children tile the ring without overlap.
+// Self-similar: a node's child arrangement depends only on its child count, so
+// re-rooting is an exact similarity (rebasing is pixel-perfect).
+//
+// Layout contract (shared by every layout):
+//   layout(index, rootId, opts) -> {
+//     rootId,
+//     nodes: Map<id, view>,   view = { id, parentId, depth, cx, cy, size, kind }
+//     order: string[]         parents before children (draw order)
+//   }
+// For circles, `size` is the radius; the engine reads cx/cy/size generically.
+
+export const RADIAL_KIND = 'circle';
+
+export function radialLayout(index, rootId, opts = {}) {
+	const R0 = opts.rootSize ?? 500;
+	const maxDepth = opts.maxDepth ?? 6;
+	const distribute = !!opts.distribute;
+	const startAngle = opts.startAngle ?? -Math.PI / 2;
+
+	const nodes = new Map();
+	const order = [];
+
+	const place = (id, cx, cy, R, depth, parentId) => {
+		nodes.set(id, { id, parentId, depth, cx, cy, size: R, kind: 'circle' });
+		order.push(id);
+		if (depth >= maxDepth) return;
+		const kids = index.children.get(id) ?? [];
+		const n = kids.length;
+		if (n === 0) return;
+
+		const redR = 0.75 * R;
+		const bandLimit = (opts.childBand ?? 0.15) * R;
+		let childR;
+		let step;
+		let start;
+		if (opts.spread != null) {
+			// fan: children on an arc of `spread` radians centred on `facing`
+			// (default east) — the tree reads left → right. Same locality and
+			// self-similarity as the full ring, just a restricted arc.
+			const facing = opts.facing ?? 0;
+			step = n > 1 ? opts.spread / (n - 1) : 0;
+			childR = n > 1 ? Math.min(bandLimit, redR * Math.sin(step / 2)) : bandLimit;
+			start = facing - (step * (n - 1)) / 2;
+		} else {
+			if (n <= 1) childR = bandLimit;
+			else childR = Math.min(bandLimit, redR * Math.sin(Math.PI / n));
+			step = distribute && n > 1 ? (2 * Math.PI) / n : 2 * Math.asin(Math.min(1, childR / redR));
+			start = startAngle;
+		}
+
+		for (let i = 0; i < n; i++) {
+			const a = start + i * step;
+			place(kids[i], cx + redR * Math.cos(a), cy + redR * Math.sin(a), childR, depth + 1, id);
+		}
+	};
+
+	place(rootId, 0, 0, R0, 0, index.parent.get(rootId) ?? null);
+	return { rootId, nodes, order };
+}