@dxos/plugin-tldraw 0.10.0

package/dist/lib/model.mjs

@@ -0,0 +1,905 @@
+import { n as Canvas, o as __exportAll } from "./chunk-types.mjs";
+import { invariant } from "@dxos/invariant";
+import { Obj } from "@dxos/echo";
+//#region src/model/read.ts
+/** Read the derived scene from canvas content. */
+var readScene = (content) => {
+	const groups = /* @__PURE__ */ new Map();
+	let unmanaged = 0;
+	for (const record of Object.values(content ?? {})) {
+		if (record?.typeName !== "shape") continue;
+		const objectId = record.meta?.object;
+		if (typeof objectId !== "string" || typeof record.meta?.element !== "string") {
+			unmanaged++;
+			continue;
+		}
+		groups.set(objectId, [...groups.get(objectId) ?? [], record]);
+	}
+	return {
+		scene: { objects: [...groups.entries()].map(([objectId, records]) => readObject(objectId, records, content)) },
+		unmanaged
+	};
+};
+/** Canvas-px bounding boxes of all managed elements, keyed by `objectId/elementId`. */
+var elementBoxes = (content) => {
+	const boxes = {};
+	for (const record of Object.values(content ?? {})) if (record?.typeName === "shape" && record.meta?.object && record.meta?.element) boxes[`${record.meta.object}/${record.meta.element}`] = bounds(record);
+	return boxes;
+};
+var readObject = (objectId, records, content) => {
+	const scale = records.find((record) => typeof record.meta?.scale === "number")?.meta.scale ?? 1;
+	const origin = {
+		x: Math.min(...records.map((record) => bounds(record).x)),
+		y: Math.min(...records.map((record) => bounds(record).y))
+	};
+	const local = (abs) => ({
+		x: round((abs.x - origin.x) / scale),
+		y: round((abs.y - origin.y) / scale)
+	});
+	const length = (px) => round(px / scale);
+	return {
+		id: objectId,
+		origin,
+		scale,
+		elements: records.map((record) => readElement(record, {
+			local,
+			length,
+			objectId,
+			content
+		})).filter((element) => element !== void 0)
+	};
+};
+var readElement = (record, ctx) => {
+	const id = record.meta.element;
+	const kind = record.meta.kind;
+	switch (record.type) {
+		case "geo": return {
+			kind: kind === "rect" || kind === "diamond" || kind === "triangle" ? kind : "ellipse",
+			id,
+			...ctx.local({
+				x: record.x,
+				y: record.y
+			}),
+			w: ctx.length(record.props.w),
+			h: ctx.length(record.props.h),
+			...record.rotation ? { rotation: round(record.rotation * 180 / Math.PI) } : {},
+			...record.props.text ? { text: record.props.text } : {},
+			...readStyle(record)
+		};
+		case "text": return {
+			kind: "text",
+			id,
+			...ctx.local({
+				x: record.x,
+				y: record.y
+			}),
+			...record.props.autoSize ? {} : { w: ctx.length(record.props.w) },
+			text: record.props.text ?? "",
+			...readStyle(record)
+		};
+		case "line": {
+			const points = linePoints(record).map((point) => ctx.local({
+				x: record.x + point.x,
+				y: record.y + point.y
+			}));
+			if (kind === "curve") return {
+				kind: "curve",
+				id,
+				points,
+				...readStyle(record)
+			};
+			const closed = points.length > 2 && points[0].x === points[points.length - 1].x && points[0].y === points[points.length - 1].y;
+			return {
+				kind: "line",
+				id,
+				points: closed ? points.slice(0, -1) : points,
+				...closed ? { closed: true } : {},
+				...readStyle(record)
+			};
+		}
+		case "arrow": {
+			const { from, to } = arrowRefs(record, ctx);
+			return {
+				kind: "arrow",
+				id,
+				...from ? { from } : { start: ctx.local({
+					x: record.x + record.props.start.x,
+					y: record.y + record.props.start.y
+				}) },
+				...to ? { to } : { end: ctx.local({
+					x: record.x + record.props.end.x,
+					y: record.y + record.props.end.y
+				}) },
+				...record.props.text ? { text: record.props.text } : {},
+				...readStyle(record)
+			};
+		}
+		default: return;
+	}
+};
+/** Resolve arrow terminal bindings back to element refs (same-object refs are shortened). */
+var arrowRefs = (record, ctx) => {
+	const refs = {};
+	for (const binding of Object.values(ctx.content ?? {})) {
+		if (binding?.typeName !== "binding" || binding.fromId !== record.id) continue;
+		const target = ctx.content[binding.toId];
+		if (!target?.meta?.object || !target?.meta?.element) continue;
+		const ref = target.meta.object === ctx.objectId ? target.meta.element : `${target.meta.object}/${target.meta.element}`;
+		if (binding.props?.terminal === "start") refs.from = ref;
+		else refs.to = ref;
+	}
+	return refs;
+};
+/** Report only non-default styles to keep the read output compact. */
+var readStyle = (record) => {
+	const { color, fill, dash, size } = record.props;
+	return {
+		...color && color !== "black" ? { color } : {},
+		...fill && fill !== "none" ? { fill: fill === "pattern" ? "pattern" : "solid" } : {},
+		...dash && dash !== "draw" ? { stroke: dash } : {},
+		...size && size !== "m" ? { weight: size } : {}
+	};
+};
+var linePoints = (record) => Object.values(record.props.points ?? {}).sort((a, b) => Number(String(a.index).slice(1)) - Number(String(b.index).slice(1))).map((point) => ({
+	x: point.x,
+	y: point.y
+}));
+/** Bounding box of a shape record in canvas px. */
+var bounds = (record) => {
+	switch (record.type) {
+		case "geo": return {
+			x: record.x,
+			y: record.y,
+			w: record.props.w,
+			h: record.props.h
+		};
+		case "text": return {
+			x: record.x,
+			y: record.y,
+			w: record.props.w ?? 0,
+			h: 0
+		};
+		case "line": {
+			const points = linePoints(record);
+			return boxFrom(points.map((point) => record.x + point.x), points.map((point) => record.y + point.y));
+		}
+		case "arrow": return boxFrom([record.x + record.props.start.x, record.x + record.props.end.x], [record.y + record.props.start.y, record.y + record.props.end.y]);
+		default: return {
+			x: record.x ?? 0,
+			y: record.y ?? 0,
+			w: record.props?.w ?? 0,
+			h: record.props?.h ?? 0
+		};
+	}
+};
+var boxFrom = (xs, ys) => {
+	const x = Math.min(...xs);
+	const y = Math.min(...ys);
+	return {
+		x,
+		y,
+		w: Math.max(...xs) - x,
+		h: Math.max(...ys) - y
+	};
+};
+var round = (value) => Math.round(value * 100) / 100;
+//#endregion
+//#region src/model/TldrawBuilder.ts
+var __dxlog_file$2 = "/Users/burdon/Code/dxos/dxos/.claude/worktrees/peaceful-allen-9b542f/packages/plugins/plugin-tldraw/src/model/TldrawBuilder.ts";
+var PAGE_ID = "page:page";
+var DOCUMENT_ID = "document:document";
+var DEFAULTS = {
+	color: "black",
+	fill: "none",
+	dash: "draw",
+	size: "m",
+	font: "draw",
+	align: "middle",
+	w: 160,
+	h: 120
+};
+/**
+* Chainable builder for sketch (tldraw) canvas content.
+*
+* @example
+* ```ts
+* const content = new TldrawBuilder()
+*   .rectangle({ id: 'a', x: 0, y: 0, text: 'DXOS', color: 'blue' })
+*   .ellipse({ id: 'b', x: 320, y: 0, text: 'ECHO', color: 'green' })
+*   .arrow({ from: 'a', to: 'b' })
+*   .build();
+* ```
+*/
+var TldrawBuilder = class {
+	#records = {};
+	#boxes = /* @__PURE__ */ new Map();
+	#metaFor;
+	#shapeCount = 0;
+	#bindingCount = 0;
+	#indexCount;
+	constructor(options = {}) {
+		this.#indexCount = options.indexStart ?? 0;
+		this.#metaFor = options.metaFor;
+	}
+	/**
+	* Register a shape that already exists on the canvas (its bounding box in canvas px)
+	* so connectors added by this builder can bind to it.
+	*/
+	external(handle, box, shapeId) {
+		invariant(!this.#boxes.has(handle), `duplicate shape id: ${handle}`, {
+			"~LogMeta": "~LogMeta",
+			F: __dxlog_file$2,
+			L: 162,
+			S: this,
+			A: ["!this.#boxes.has(handle)", "`duplicate shape id: ${handle}`"]
+		});
+		this.#boxes.set(handle, {
+			id: shapeId ?? `shape:${handle}`,
+			...box
+		});
+		return this;
+	}
+	/** Add a rectangle. */
+	rectangle(props = {}) {
+		return this.geo("rectangle", props);
+	}
+	/** Add an ellipse. */
+	ellipse(props = {}) {
+		return this.geo("ellipse", props);
+	}
+	/** Add a circle (an ellipse with equal width and height). */
+	circle(props = {}) {
+		const size = props.w ?? props.h ?? DEFAULTS.w;
+		return this.geo("ellipse", {
+			...props,
+			w: size,
+			h: size
+		});
+	}
+	/** Add an arbitrary geometric shape. */
+	geo(geo, props = {}) {
+		const { id, x = 0, y = 0, w = DEFAULTS.w, h = DEFAULTS.h, rotation = 0 } = props;
+		const shapeId = this.#registerShape({
+			id,
+			x,
+			y,
+			w,
+			h
+		});
+		this.#records[shapeId] = {
+			id: shapeId,
+			typeName: "shape",
+			type: "geo",
+			x,
+			y,
+			rotation,
+			index: this.#nextIndex(),
+			parentId: PAGE_ID,
+			isLocked: false,
+			opacity: 1,
+			meta: this.#meta(id),
+			props: {
+				geo,
+				w,
+				h,
+				color: props.color ?? DEFAULTS.color,
+				labelColor: DEFAULTS.color,
+				fill: props.fill ?? DEFAULTS.fill,
+				dash: props.dash ?? DEFAULTS.dash,
+				size: props.size ?? DEFAULTS.size,
+				font: props.font ?? DEFAULTS.font,
+				align: props.align ?? DEFAULTS.align,
+				verticalAlign: "middle",
+				url: "",
+				growY: 0,
+				text: props.text ?? "",
+				scale: 1
+			}
+		};
+		return this;
+	}
+	/** Add a free-standing text label. */
+	text(props = {}) {
+		const { id, x = 0, y = 0, w = DEFAULTS.w, rotation = 0 } = props;
+		const shapeId = this.#registerShape({
+			id,
+			x,
+			y,
+			w,
+			h: 0
+		});
+		this.#records[shapeId] = {
+			id: shapeId,
+			typeName: "shape",
+			type: "text",
+			x,
+			y,
+			rotation,
+			index: this.#nextIndex(),
+			parentId: PAGE_ID,
+			isLocked: false,
+			opacity: 1,
+			meta: this.#meta(id),
+			props: {
+				color: props.color ?? DEFAULTS.color,
+				size: props.size ?? DEFAULTS.size,
+				font: props.font ?? DEFAULTS.font,
+				textAlign: props.align ?? DEFAULTS.align,
+				w,
+				text: props.text ?? "",
+				scale: 1,
+				autoSize: true
+			}
+		};
+		return this;
+	}
+	/** Add an arrow, optionally bound to source/target shapes so it tracks them. */
+	arrow(props = {}) {
+		return this.#connector("arrow", props);
+	}
+	/** Add a line between two shapes (or explicit points). */
+	line(props = {}) {
+		return this.#connector("line", props);
+	}
+	/** Add a path (open or closed, straight or smooth) through explicit points. */
+	path(props) {
+		const { id, smooth, closed } = props;
+		const source = closed && props.points.length > 1 ? [...props.points, props.points[0]] : [...props.points];
+		invariant(source.length >= 2, "path requires at least two points", {
+			"~LogMeta": "~LogMeta",
+			F: __dxlog_file$2,
+			L: 266,
+			S: this,
+			A: ["source.length >= 2", "'path requires at least two points'"]
+		});
+		const origin = source[0];
+		const xs = source.map((point) => point.x);
+		const ys = source.map((point) => point.y);
+		const shapeId = this.#registerShape({
+			id,
+			x: Math.min(...xs),
+			y: Math.min(...ys),
+			w: Math.max(...xs) - Math.min(...xs),
+			h: Math.max(...ys) - Math.min(...ys)
+		});
+		this.#records[shapeId] = {
+			id: shapeId,
+			typeName: "shape",
+			type: "line",
+			x: origin.x,
+			y: origin.y,
+			rotation: 0,
+			index: this.#nextIndex(),
+			parentId: PAGE_ID,
+			isLocked: false,
+			opacity: 1,
+			meta: this.#meta(id),
+			props: {
+				color: props.color ?? DEFAULTS.color,
+				dash: props.dash ?? DEFAULTS.dash,
+				size: props.size ?? DEFAULTS.size,
+				spline: smooth ? "cubic" : "line",
+				points: Object.fromEntries(source.map((point, i) => [`a${i + 1}`, {
+					id: `a${i + 1}`,
+					index: `a${i + 1}`,
+					x: point.x - origin.x,
+					y: point.y - origin.y
+				}])),
+				scale: 1
+			}
+		};
+		return this;
+	}
+	/** Build the full canvas snapshot (document + page + records). */
+	build() {
+		return {
+			[DOCUMENT_ID]: {
+				gridSize: 10,
+				name: "",
+				meta: {},
+				id: DOCUMENT_ID,
+				typeName: "document"
+			},
+			[PAGE_ID]: {
+				meta: {},
+				id: PAGE_ID,
+				name: "Page 1",
+				index: "a1",
+				typeName: "page"
+			},
+			...this.#records
+		};
+	}
+	/** Return only the generated records (for merging into an existing canvas). */
+	records() {
+		return { ...this.#records };
+	}
+	#connector(type, props) {
+		const from = props.from ? this.#boxes.get(props.from) : void 0;
+		const to = props.to ? this.#boxes.get(props.to) : void 0;
+		invariant(!props.from || from, `unknown source shape: ${props.from}`, {
+			"~LogMeta": "~LogMeta",
+			F: __dxlog_file$2,
+			L: 325,
+			S: this,
+			A: ["!props.from || from", "`unknown source shape: ${props.from}`"]
+		});
+		invariant(!props.to || to, `unknown target shape: ${props.to}`, {
+			"~LogMeta": "~LogMeta",
+			F: __dxlog_file$2,
+			L: 326,
+			S: this,
+			A: ["!props.to || to", "`unknown target shape: ${props.to}`"]
+		});
+		const start = from ? center(from) : props.start ?? {
+			x: 0,
+			y: 0
+		};
+		const end = to ? center(to) : props.end ?? {
+			x: DEFAULTS.w,
+			y: 0
+		};
+		const shapeId = this.#registerShape({
+			id: props.id,
+			x: start.x,
+			y: start.y,
+			w: 0,
+			h: 0
+		});
+		const relativeEnd = {
+			x: end.x - start.x,
+			y: end.y - start.y
+		};
+		const style = {
+			color: props.color ?? DEFAULTS.color,
+			dash: props.dash ?? DEFAULTS.dash,
+			size: props.size ?? DEFAULTS.size
+		};
+		if (type === "arrow") {
+			this.#records[shapeId] = {
+				id: shapeId,
+				typeName: "shape",
+				type: "arrow",
+				x: start.x,
+				y: start.y,
+				rotation: 0,
+				index: this.#nextIndex(),
+				parentId: PAGE_ID,
+				isLocked: false,
+				opacity: 1,
+				meta: this.#meta(props.id),
+				props: {
+					...style,
+					labelColor: DEFAULTS.color,
+					fill: props.fill ?? DEFAULTS.fill,
+					font: props.font ?? DEFAULTS.font,
+					arrowheadStart: "none",
+					arrowheadEnd: "arrow",
+					start: {
+						x: 0,
+						y: 0
+					},
+					end: relativeEnd,
+					bend: 0,
+					text: props.text ?? "",
+					labelPosition: .5,
+					scale: 1
+				}
+			};
+			if (from) this.#binding(shapeId, from.id, "start");
+			if (to) this.#binding(shapeId, to.id, "end");
+		} else this.#records[shapeId] = {
+			id: shapeId,
+			typeName: "shape",
+			type: "line",
+			x: start.x,
+			y: start.y,
+			rotation: 0,
+			index: this.#nextIndex(),
+			parentId: PAGE_ID,
+			isLocked: false,
+			opacity: 1,
+			meta: this.#meta(props.id),
+			props: {
+				...style,
+				spline: "line",
+				points: {
+					a1: {
+						id: "a1",
+						index: "a1",
+						x: 0,
+						y: 0
+					},
+					a2: {
+						id: "a2",
+						index: "a2",
+						x: relativeEnd.x,
+						y: relativeEnd.y
+					}
+				},
+				scale: 1
+			}
+		};
+		return this;
+	}
+	#binding(arrowId, shapeId, terminal) {
+		const bindingId = `binding:${arrowId.slice(6)}/${terminal}-${++this.#bindingCount}`;
+		this.#records[bindingId] = {
+			id: bindingId,
+			typeName: "binding",
+			type: "arrow",
+			fromId: arrowId,
+			toId: shapeId,
+			meta: {},
+			props: {
+				terminal,
+				normalizedAnchor: {
+					x: .5,
+					y: .5
+				},
+				isExact: false,
+				isPrecise: false
+			}
+		};
+	}
+	#meta(handle) {
+		return handle && this.#metaFor ? this.#metaFor(handle) : {};
+	}
+	#registerShape(box) {
+		let shapeId = box.id ? `shape:${box.id}` : `shape:s${++this.#shapeCount}`;
+		while (!box.id && this.#records[shapeId]) shapeId = `shape:s${++this.#shapeCount}`;
+		const handle = box.id ?? shapeId;
+		invariant(!this.#records[shapeId] && !this.#boxes.has(handle), `duplicate shape id: ${handle}`, {
+			"~LogMeta": "~LogMeta",
+			F: __dxlog_file$2,
+			L: 433,
+			S: this,
+			A: ["!this.#records[shapeId] && !this.#boxes.has(handle)", "`duplicate shape id: ${handle}`"]
+		});
+		this.#boxes.set(handle, {
+			id: shapeId,
+			x: box.x,
+			y: box.y,
+			w: box.w,
+			h: box.h
+		});
+		return shapeId;
+	}
+	#nextIndex() {
+		return `a${++this.#indexCount}`;
+	}
+};
+var center = (box) => ({
+	x: box.x + box.w / 2,
+	y: box.y + box.h / 2
+});
+//#endregion
+//#region src/model/render.ts
+var DEFAULT_SCALE = 1;
+/** Stable record id for an element: `shape:<objectId>/<elementId>`. */
+var shapeId = (objectId, elementId) => `shape:${objectId}/${elementId}`;
+var strokeToDash = {
+	sketchy: "draw",
+	solid: "solid",
+	dashed: "dashed",
+	dotted: "dotted"
+};
+var fillToFill = {
+	none: "none",
+	solid: "solid",
+	pattern: "pattern"
+};
+var boxKindToGeo = {
+	rect: "rectangle",
+	ellipse: "ellipse",
+	diamond: "diamond",
+	triangle: "triangle"
+};
+var style = (element) => ({
+	color: element.color,
+	fill: "fill" in element && element.fill ? fillToFill[element.fill] : void 0,
+	dash: element.stroke ? strokeToDash[element.stroke] : void 0,
+	size: element.weight
+});
+/**
+* Compile one world object into tldraw records (canvas-px coordinates).
+* Local coordinates are mapped via `canvas = origin + local * scale`.
+*/
+var renderObject = (object, options) => {
+	const { origin, scale, indexStart, external = {}, dialect = "scene" } = options;
+	const point = (local) => ({
+		x: origin.x + local.x * scale,
+		y: origin.y + local.y * scale
+	});
+	const length = (units) => units * scale;
+	const kinds = /* @__PURE__ */ new Map();
+	const builder = new TldrawBuilder({
+		indexStart,
+		metaFor: (handle) => {
+			const [objectId, elementId] = splitHandle(handle);
+			return {
+				object: objectId,
+				element: elementId,
+				kind: kinds.get(handle),
+				scale,
+				dialect
+			};
+		}
+	});
+	for (const [handle, box] of Object.entries(external)) builder.external(handle, box);
+	const ref = (value) => value.includes("/") ? value : `${object.id}/${value}`;
+	for (const element of object.elements) {
+		const handle = `${object.id}/${element.id}`;
+		kinds.set(handle, element.kind);
+		switch (element.kind) {
+			case "rect":
+			case "ellipse":
+			case "diamond":
+			case "triangle":
+				builder.geo(boxKindToGeo[element.kind], {
+					id: handle,
+					...point(element),
+					w: length(element.w),
+					h: length(element.h),
+					rotation: element.rotation !== void 0 ? element.rotation * Math.PI / 180 : void 0,
+					text: element.text,
+					...style(element)
+				});
+				break;
+			case "circle":
+				kinds.set(handle, "ellipse");
+				builder.circle({
+					id: handle,
+					...point({
+						x: element.cx - element.r,
+						y: element.cy - element.r
+					}),
+					w: length(element.r * 2),
+					text: element.text,
+					...style(element)
+				});
+				break;
+			case "line": {
+				const props = {
+					id: handle,
+					points: element.points.map(point),
+					closed: element.closed,
+					...style(element)
+				};
+				builder.path(props);
+				break;
+			}
+			case "curve":
+				builder.path({
+					id: handle,
+					points: element.points.map(point),
+					smooth: true,
+					...style(element)
+				});
+				break;
+			case "arc":
+				kinds.set(handle, "curve");
+				builder.path({
+					id: handle,
+					points: sampleArc(element).map(point),
+					smooth: true,
+					...style(element)
+				});
+				break;
+			case "text":
+				builder.text({
+					id: handle,
+					...point(element),
+					w: element.w !== void 0 ? length(element.w) : void 0,
+					text: element.text,
+					color: element.color,
+					size: element.weight
+				});
+				break;
+			case "arrow": {
+				const props = {
+					id: handle,
+					from: element.from ? ref(element.from) : void 0,
+					to: element.to ? ref(element.to) : void 0,
+					start: element.start ? point(element.start) : void 0,
+					end: element.end ? point(element.end) : void 0,
+					text: element.text,
+					...style(element)
+				};
+				builder.arrow(props);
+				break;
+			}
+		}
+	}
+	return builder.records();
+};
+/** `objectId/elementId` — element ids may themselves not contain `/`. */
+var splitHandle = (handle) => {
+	const index = handle.indexOf("/");
+	return [handle.slice(0, index), handle.slice(index + 1)];
+};
+/** Sample an arc (degrees, clockwise from +x, y-down screen coords) into spline points. */
+var sampleArc = ({ cx, cy, r, startAngle, endAngle }) => {
+	const sweep = endAngle - startAngle;
+	const steps = Math.max(4, Math.ceil(Math.abs(sweep) / 22.5));
+	return Array.from({ length: steps + 1 }, (_, i) => {
+		const angle = (startAngle + sweep * i / steps) * Math.PI / 180;
+		return {
+			x: cx + r * Math.cos(angle),
+			y: cy + r * Math.sin(angle)
+		};
+	});
+};
+//#endregion
+//#region src/model/apply.ts
+var __dxlog_file$1 = "/Users/burdon/Code/dxos/dxos/.claude/worktrees/peaceful-allen-9b542f/packages/plugins/plugin-tldraw/src/model/apply.ts";
+/** Apply a batch of edit commands to the canvas content (mutates `content`). */
+var applyCommands = (content, commands) => {
+	ensurePage(content);
+	const upserted = /* @__PURE__ */ new Set();
+	let removed = 0;
+	for (const command of commands) switch (command.op) {
+		case "upsert-object": {
+			const previous = readScene(content).scene.objects.find((object) => object.id === command.object.id);
+			removed += remove(content, (record) => record.meta?.object === command.object.id);
+			merge(content, command.object, {
+				origin: command.object.origin ?? previous?.origin ?? {
+					x: 0,
+					y: 0
+				},
+				scale: command.object.scale ?? previous?.scale ?? 1
+			});
+			upserted.add(command.object.id);
+			break;
+		}
+		case "upsert-elements": {
+			const previous = readScene(content).scene.objects.find((object) => object.id === command.objectId);
+			invariant(previous, `unknown object: ${command.objectId} (use upsert-object to create it)`, {
+				"~LogMeta": "~LogMeta",
+				F: __dxlog_file$1,
+				L: 37,
+				S: void 0,
+				A: ["previous", "`unknown object: ${command.objectId} (use upsert-object to create it)`"]
+			});
+			const ids = new Set(command.elements.map((element) => element.id));
+			removed += remove(content, (record) => record.meta?.object === command.objectId && ids.has(record.meta?.element));
+			merge(content, {
+				id: command.objectId,
+				elements: command.elements
+			}, {
+				origin: previous.origin,
+				scale: previous.scale
+			});
+			upserted.add(command.objectId);
+			break;
+		}
+		case "remove-elements": {
+			const ids = new Set(command.elementIds);
+			removed += remove(content, (record) => record.meta?.object === command.objectId && ids.has(record.meta?.element));
+			break;
+		}
+		case "remove-object":
+			removed += remove(content, (record) => record.meta?.object === command.objectId);
+			break;
+		case "move-object": {
+			const previous = readScene(content).scene.objects.find((object) => object.id === command.objectId);
+			invariant(previous, `unknown object: ${command.objectId}`, {
+				"~LogMeta": "~LogMeta",
+				F: __dxlog_file$1,
+				L: 65,
+				S: void 0,
+				A: ["previous", "`unknown object: ${command.objectId}`"]
+			});
+			const delta = {
+				x: command.origin.x - previous.origin.x,
+				y: command.origin.y - previous.origin.y
+			};
+			for (const record of Object.values(content)) if (record?.typeName === "shape" && record.meta?.object === command.objectId) {
+				record.x += delta.x;
+				record.y += delta.y;
+			}
+			upserted.add(command.objectId);
+			break;
+		}
+	}
+	return {
+		upserted: [...upserted],
+		removed
+	};
+};
+var merge = (content, object, placement) => {
+	const records = renderObject(object, {
+		...placement,
+		indexStart: nextIndex(content),
+		external: elementBoxes(content)
+	});
+	Object.assign(content, records);
+};
+/** Delete matching shape records, then any bindings left dangling. */
+var remove = (content, predicate) => {
+	let removed = 0;
+	for (const [key, record] of Object.entries(content)) if (record?.typeName === "shape" && predicate(record)) {
+		delete content[key];
+		removed++;
+	}
+	for (const [key, record] of Object.entries(content)) if (record?.typeName === "binding" && (!content[record.fromId] || !content[record.toId])) delete content[key];
+	return removed;
+};
+/** Seed the fractional-index counter past any existing `a<n>` indexes. */
+var nextIndex = (content) => {
+	let max = 0;
+	let shapes = 0;
+	for (const record of Object.values(content)) {
+		if (record?.typeName !== "shape") continue;
+		shapes++;
+		const match = /^a(\d+)$/.exec(record.index ?? "");
+		if (match) max = Math.max(max, Number(match[1]));
+	}
+	return Math.max(max, shapes);
+};
+var ensurePage = (content) => {
+	content[DOCUMENT_ID] ??= {
+		gridSize: 10,
+		name: "",
+		meta: {},
+		id: DOCUMENT_ID,
+		typeName: "document"
+	};
+	content[PAGE_ID] ??= {
+		meta: {},
+		id: PAGE_ID,
+		name: "Page 1",
+		index: "a1",
+		typeName: "page"
+	};
+};
+//#endregion
+//#region src/model/builder.ts
+var __dxlog_file = "/Users/burdon/Code/dxos/dxos/.claude/worktrees/peaceful-allen-9b542f/packages/plugins/plugin-tldraw/src/model/builder.ts";
+var tldrawBuilder = {
+	read: (canvas) => {
+		invariant(Obj.instanceOf(Canvas, canvas), void 0, {
+			"~LogMeta": "~LogMeta",
+			F: __dxlog_file,
+			L: 20,
+			S: void 0,
+			A: ["Obj.instanceOf(Tldraw.Canvas, canvas)", ""]
+		});
+		return readScene(canvas.content);
+	},
+	apply: (canvas, commands) => {
+		invariant(Obj.instanceOf(Canvas, canvas), void 0, {
+			"~LogMeta": "~LogMeta",
+			F: __dxlog_file,
+			L: 24,
+			S: void 0,
+			A: ["Obj.instanceOf(Tldraw.Canvas, canvas)", ""]
+		});
+		let result = {
+			upserted: [],
+			removed: 0
+		};
+		Obj.update(canvas, (canvas) => {
+			result = applyCommands(canvas.content, commands);
+		});
+		return result;
+	}
+};
+//#endregion
+//#region src/model/index.ts
+var model_exports = /* @__PURE__ */ __exportAll({
+	DEFAULT_SCALE: () => 1,
+	DOCUMENT_ID: () => DOCUMENT_ID,
+	PAGE_ID: () => PAGE_ID,
+	TldrawBuilder: () => TldrawBuilder,
+	applyCommands: () => applyCommands,
+	elementBoxes: () => elementBoxes,
+	readScene: () => readScene,
+	renderObject: () => renderObject,
+	shapeId: () => shapeId,
+	tldrawBuilder: () => tldrawBuilder
+});
+//#endregion
+export { DEFAULT_SCALE, DOCUMENT_ID, PAGE_ID, TldrawBuilder, applyCommands, elementBoxes, readScene, renderObject, shapeId, model_exports as t, tldrawBuilder };
+
+//# sourceMappingURL=model.mjs.map