@grida/svg-editor 1.0.0-alpha.1

package/dist/editor-DQWUWrVZ.js

@@ -0,0 +1,1833 @@
+require("./dom-CfP_ZURh.js");
+const require_paint = require("./paint-DHq_3iwU.js");
+let _grida_history = require("@grida/history");
+let _grida_keybinding = require("@grida/keybinding");
+//#region src/commands/registry.ts
+var CommandRegistry = class {
+	constructor() {
+		this.map = /* @__PURE__ */ new Map();
+	}
+	/**
+	* Register a command. Returns an unregister function. Re-registering
+	* the same id replaces the previous handler (last writer wins).
+	*/
+	register(id, handler) {
+		this.map.set(id, handler);
+		return () => {
+			if (this.map.get(id) === handler) this.map.delete(id);
+		};
+	}
+	/**
+	* Invoke a command by id. Returns `true` if the handler consumed,
+	* `false` otherwise (including unknown ids and handlers that returned
+	* `false`/`undefined`).
+	*/
+	invoke(id, args) {
+		const handler = this.map.get(id);
+		if (!handler) return false;
+		return handler(args) === true;
+	}
+	has(id) {
+		return this.map.has(id);
+	}
+	/** All registered ids, for debugging / introspection. */
+	ids() {
+		return Array.from(this.map.keys());
+	}
+};
+//#endregion
+//#region src/commands/defaults.ts
+function registerDefaultCommands(reg, editor) {
+	reg.register("history.undo", () => {
+		if (!editor.state.can_undo) return false;
+		editor.commands.undo();
+		return true;
+	});
+	reg.register("history.redo", () => {
+		if (!editor.state.can_redo) return false;
+		editor.commands.redo();
+		return true;
+	});
+	reg.register("selection.deselect", () => {
+		if (editor.state.selection.length === 0) return false;
+		editor.commands.deselect();
+		return true;
+	});
+	reg.register("selection.remove", () => {
+		if (editor.state.selection.length === 0) return false;
+		editor.commands.remove();
+		return true;
+	});
+	reg.register("hierarchy.enter", () => {
+		if (editor.state.selection.length !== 1) return false;
+		const id = editor.state.selection[0];
+		const node = editor.tree().nodes.get(id);
+		if (!node || node.children.length === 0) return false;
+		editor.commands.select(node.children[0]);
+		return true;
+	});
+	reg.register("hierarchy.exit", () => {
+		if (editor.state.selection.length !== 1) return false;
+		const id = editor.state.selection[0];
+		const tree = editor.tree();
+		const node = tree.nodes.get(id);
+		if (!node || node.parent === null || node.parent === tree.root) return false;
+		editor.commands.select(node.parent);
+		return true;
+	});
+	reg.register("transform.nudge", (args) => {
+		if (editor.state.selection.length === 0) return false;
+		const { dx, dy } = args;
+		editor.commands.translate({
+			dx,
+			dy
+		});
+		return true;
+	});
+	reg.register("reorder", (args) => {
+		if (editor.state.selection.length !== 1) return false;
+		editor.commands.reorder(args);
+		return true;
+	});
+}
+//#endregion
+//#region src/keymap/keymap.ts
+/**
+* Keymap — bindings of declarative `Keybinding`s (from `@grida/keybinding`)
+* to command ids.
+*
+* Dispatch is ProseMirror-`chainCommands`-shaped: multiple bindings on
+* the same key are tried in priority order; the first whose handler
+* returns `true` wins, the rest are skipped. This keeps "one key, many
+* meanings" expressible without a `when:` DSL — handlers self-guard on
+* editor state and return `false` when not applicable.
+*
+* The keymap does NOT see modifier-as-signal (e.g. Alt-held for
+* measurement). That stays on the HUD modifiers channel. The keymap
+* only sees Mod+D-shape chords.
+*/
+/** Modifiers that, when held, allow a binding to fire even inside a text input. */
+const TEXT_INPUT_SAFE_MODS = new Set([
+	_grida_keybinding.KeyCode.Meta,
+	_grida_keybinding.KeyCode.Ctrl,
+	_grida_keybinding.KeyCode.Alt
+]);
+function is_text_input_focused() {
+	if (typeof document === "undefined") return false;
+	const el = document.activeElement;
+	if (!el) return false;
+	const tag = el.tagName;
+	if (tag === "INPUT" || tag === "TEXTAREA") return true;
+	if (el.isContentEditable) return true;
+	return false;
+}
+var Keymap = class {
+	constructor(commands, platformGetter = _grida_keybinding.getKeyboardOS) {
+		this.commands = commands;
+		this.platformGetter = platformGetter;
+		this.buckets = /* @__PURE__ */ new Map();
+		this.seq = 0;
+	}
+	/**
+	* Bind a key combination to a command. Returns an unbind function.
+	* The same `Keybinding` can be bound to multiple commands — they will
+	* all be tried in chain order on dispatch.
+	*/
+	bind(binding) {
+		const entry = {
+			binding,
+			seq: ++this.seq
+		};
+		for (const hash of this.chunkKeysFor(binding.keybinding)) {
+			const list = this.buckets.get(hash);
+			if (list) {
+				list.push(entry);
+				list.sort(compareEntries);
+			} else this.buckets.set(hash, [entry]);
+		}
+		return () => {
+			for (const hash of this.chunkKeysFor(binding.keybinding)) {
+				const list = this.buckets.get(hash);
+				if (!list) continue;
+				const idx = list.findIndex((e) => e === entry);
+				if (idx >= 0) list.splice(idx, 1);
+				if (list.length === 0) this.buckets.delete(hash);
+			}
+		};
+	}
+	/**
+	* Remove bindings matching the spec. If both filters are passed, only
+	* bindings that match BOTH are removed.
+	*/
+	unbind(spec) {
+		const hashFilter = spec.keybinding ? new Set(this.chunkKeysFor(spec.keybinding)) : null;
+		for (const [hash, list] of this.buckets) {
+			if (hashFilter && !hashFilter.has(hash)) continue;
+			const next = list.filter((e) => {
+				if (spec.command && e.binding.command !== spec.command) return true;
+				return false;
+			});
+			if (next.length === 0) this.buckets.delete(hash);
+			else if (next.length !== list.length) this.buckets.set(hash, next);
+		}
+	}
+	/** All registered bindings, for introspection. Order is not guaranteed. */
+	bindings() {
+		const seen = /* @__PURE__ */ new Set();
+		for (const list of this.buckets.values()) for (const e of list) seen.add(e.binding);
+		return Array.from(seen);
+	}
+	/**
+	* Match the event against bound chunks, then run candidates in chain
+	* order. Returns `true` and calls `preventDefault()` on the first
+	* handler that consumes; returns `false` if nothing matched or all
+	* matches fell through.
+	*/
+	dispatch(event) {
+		const chunk = (0, _grida_keybinding.eventToChunk)(event);
+		if (chunk.keys.length === 0) return false;
+		const hash = (0, _grida_keybinding.chunkKey)(chunk);
+		const list = this.buckets.get(hash);
+		if (!list || list.length === 0) return false;
+		const text_focused = is_text_input_focused();
+		for (const { binding } of list) {
+			if (text_focused && !this.has_safe_mod(chunk.mods)) continue;
+			if (this.commands.invoke(binding.command, binding.args)) {
+				event.preventDefault();
+				return true;
+			}
+		}
+		return false;
+	}
+	/**
+	* Compute the set of canonical hashes a `Keybinding` lights up. A
+	* binding with aliases (multiple sequences) contributes one hash per
+	* single-chunk alias; multi-chunk sequences (chords) are skipped in
+	* V1.
+	*/
+	chunkKeysFor(binding) {
+		const sequences = (0, _grida_keybinding.keybindingsToKeyCodes)(binding, this.platformGetter());
+		const out = [];
+		for (const seq of sequences) {
+			if (seq.length !== 1) continue;
+			out.push((0, _grida_keybinding.chunkKey)(seq[0]));
+		}
+		return out;
+	}
+	has_safe_mod(mods) {
+		for (const m of mods) if (TEXT_INPUT_SAFE_MODS.has(m)) return true;
+		return false;
+	}
+};
+function compareEntries(a, b) {
+	const pa = a.binding.priority ?? 0;
+	const pb = b.binding.priority ?? 0;
+	if (pa !== pb) return pb - pa;
+	return a.seq - b.seq;
+}
+//#endregion
+//#region src/keymap/defaults.ts
+/**
+* Default keybindings shipped with `@grida/svg-editor`.
+*
+* THIS IS THE ONLY FILE where built-in shortcuts are declared. Adding
+* a new shortcut = one new row here (plus, if the target command is
+* new, one new handler in `src/commands/defaults.ts`). That is the
+* V1 design contract.
+*
+* Same key, multiple meanings? Add multiple rows. The chain semantics
+* (handler returns `false` when not applicable) handle the rest.
+*/
+const DEFAULT_BINDINGS = [
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.KeyZ, _grida_keybinding.M.CtrlCmd),
+		command: "history.undo"
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.KeyZ, _grida_keybinding.M.CtrlCmd | _grida_keybinding.M.Shift),
+		command: "history.redo"
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.KeyY, _grida_keybinding.M.CtrlCmd),
+		command: "history.redo"
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.Escape),
+		command: "selection.deselect"
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.Backspace),
+		command: "selection.remove"
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.Delete),
+		command: "selection.remove"
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.Enter),
+		command: "hierarchy.enter"
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.Enter, _grida_keybinding.M.Shift),
+		command: "hierarchy.exit"
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.LeftArrow),
+		command: "transform.nudge",
+		args: {
+			dx: -1,
+			dy: 0
+		}
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.RightArrow),
+		command: "transform.nudge",
+		args: {
+			dx: 1,
+			dy: 0
+		}
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.UpArrow),
+		command: "transform.nudge",
+		args: {
+			dx: 0,
+			dy: -1
+		}
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.DownArrow),
+		command: "transform.nudge",
+		args: {
+			dx: 0,
+			dy: 1
+		}
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.LeftArrow, _grida_keybinding.M.Shift),
+		command: "transform.nudge",
+		args: {
+			dx: -10,
+			dy: 0
+		}
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.RightArrow, _grida_keybinding.M.Shift),
+		command: "transform.nudge",
+		args: {
+			dx: 10,
+			dy: 0
+		}
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.UpArrow, _grida_keybinding.M.Shift),
+		command: "transform.nudge",
+		args: {
+			dx: 0,
+			dy: -10
+		}
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.DownArrow, _grida_keybinding.M.Shift),
+		command: "transform.nudge",
+		args: {
+			dx: 0,
+			dy: 10
+		}
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.BracketRight),
+		command: "reorder",
+		args: "bring_to_front"
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.BracketLeft),
+		command: "reorder",
+		args: "send_to_back"
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.BracketRight, _grida_keybinding.M.CtrlCmd),
+		command: "reorder",
+		args: "bring_forward"
+	},
+	{
+		keybinding: (0, _grida_keybinding.kb)(_grida_keybinding.KeyCode.BracketLeft, _grida_keybinding.M.CtrlCmd),
+		command: "reorder",
+		args: "send_backward"
+	}
+];
+/** Register every default binding into a keymap. */
+function applyDefaultBindings(keymap) {
+	for (const b of DEFAULT_BINDINGS) keymap.bind(b);
+}
+//#endregion
+//#region src/core/defs.ts
+var GradientsRegistry = class {
+	constructor(doc) {
+		this.doc = doc;
+		this.listeners = /* @__PURE__ */ new Set();
+		this.counter = 0;
+		doc.on_change(() => this.emit());
+	}
+	list() {
+		const out = [];
+		const defs = this.find_defs_elements();
+		for (const def_id of defs) for (const child of this.doc.element_children_of(def_id)) {
+			const tag = this.doc.tag_of(child);
+			if (tag === "linearGradient" || tag === "radialGradient") {
+				const id = this.doc.get_attr(child, "id");
+				if (!id) continue;
+				const definition = this.read_gradient(child, tag);
+				if (!definition) continue;
+				out.push({
+					id,
+					definition,
+					ref_count: this.count_refs(id)
+				});
+			}
+		}
+		return out;
+	}
+	get(id) {
+		return this.list().find((g) => g.id === id) ?? null;
+	}
+	upsert(definition, opts) {
+		const existing_id = opts?.id;
+		if (existing_id) {
+			const node = this.find_gradient_node(existing_id);
+			if (node !== null) {
+				this.write_gradient(node, definition);
+				return existing_id;
+			}
+		}
+		const id = existing_id ?? this.fresh_id();
+		const defs_id = this.ensure_defs();
+		const tag = definition.kind === "linear" ? "linearGradient" : "radialGradient";
+		const new_id = this.doc.create_element(tag, { ns: "http://www.w3.org/2000/svg" });
+		this.doc.set_attr(new_id, "id", id);
+		this.doc.insert(new_id, defs_id, null);
+		this.write_gradient(new_id, definition);
+		this.emit();
+		return id;
+	}
+	remove(id) {
+		const refs = this.count_refs(id);
+		if (refs > 0) throw new Error(`[svg-editor] cannot remove gradient "${id}": ${refs} node(s) still reference it`);
+		const node = this.find_gradient_node(id);
+		if (node !== null) {
+			this.doc.remove(node);
+			this.emit();
+		}
+	}
+	subscribe(fn) {
+		this.listeners.add(fn);
+		return () => {
+			this.listeners.delete(fn);
+		};
+	}
+	emit() {
+		const snap = this.list();
+		for (const fn of this.listeners) fn(snap);
+	}
+	fresh_id() {
+		let id;
+		do
+			id = `g${++this.counter}`;
+		while (this.find_gradient_node(id) !== null);
+		return id;
+	}
+	find_defs_elements() {
+		return this.doc.find_by_tag(this.doc.root, "defs");
+	}
+	ensure_defs() {
+		const existing = this.find_defs_elements();
+		if (existing.length > 0) return existing[0];
+		const defs = this.doc.create_element("defs", { ns: "http://www.w3.org/2000/svg" });
+		const first = this.doc.children_of(this.doc.root)[0] ?? null;
+		this.doc.insert(defs, this.doc.root, first);
+		return defs;
+	}
+	find_gradient_node(id) {
+		for (const def of this.find_defs_elements()) for (const child of this.doc.element_children_of(def)) if (this.doc.get_attr(child, "id") === id) {
+			const tag = this.doc.tag_of(child);
+			if (tag === "linearGradient" || tag === "radialGradient") return child;
+		}
+		return null;
+	}
+	read_gradient(id, tag) {
+		const stops = [];
+		for (const child of this.doc.element_children_of(id)) {
+			if (this.doc.tag_of(child) !== "stop") continue;
+			const offset = parseFloat(this.doc.get_attr(child, "offset") ?? "0");
+			const color = this.doc.get_attr(child, "stop-color") ?? this.doc.get_style(child, "stop-color") ?? "#000000";
+			const opacity_str = this.doc.get_attr(child, "stop-opacity") ?? this.doc.get_style(child, "stop-opacity");
+			const opacity = opacity_str !== null ? parseFloat(opacity_str) : void 0;
+			stops.push({
+				offset,
+				color,
+				...opacity !== void 0 ? { opacity } : {}
+			});
+		}
+		const gu = this.doc.get_attr(id, "gradientUnits");
+		const gradient_units = gu === "userSpaceOnUse" ? "user_space_on_use" : gu === "objectBoundingBox" ? "object_bounding_box" : void 0;
+		const sm = this.doc.get_attr(id, "spreadMethod");
+		const spread_method = sm === "pad" || sm === "reflect" || sm === "repeat" ? sm : void 0;
+		const num = (n) => {
+			const v = this.doc.get_attr(id, n);
+			return v !== null ? parseFloat(v) : void 0;
+		};
+		if (tag === "linearGradient") return {
+			kind: "linear",
+			stops,
+			x1: num("x1"),
+			y1: num("y1"),
+			x2: num("x2"),
+			y2: num("y2"),
+			gradient_units,
+			spread_method
+		};
+		return {
+			kind: "radial",
+			stops,
+			cx: num("cx"),
+			cy: num("cy"),
+			r: num("r"),
+			fx: num("fx"),
+			fy: num("fy"),
+			gradient_units,
+			spread_method
+		};
+	}
+	write_gradient(node, def) {
+		for (const c of [...this.doc.children_of(node)]) this.doc.remove(c);
+		const set_num = (name, v) => {
+			this.doc.set_attr(node, name, v === void 0 ? null : String(v));
+		};
+		if (def.kind === "linear") {
+			set_num("x1", def.x1);
+			set_num("y1", def.y1);
+			set_num("x2", def.x2);
+			set_num("y2", def.y2);
+		} else {
+			set_num("cx", def.cx);
+			set_num("cy", def.cy);
+			set_num("r", def.r);
+			set_num("fx", def.fx);
+			set_num("fy", def.fy);
+		}
+		if (def.gradient_units) this.doc.set_attr(node, "gradientUnits", def.gradient_units === "user_space_on_use" ? "userSpaceOnUse" : "objectBoundingBox");
+		if (def.spread_method) this.doc.set_attr(node, "spreadMethod", def.spread_method);
+		for (const stop of def.stops) {
+			const stop_id = this.doc.create_element("stop", { ns: "http://www.w3.org/2000/svg" });
+			this.doc.set_attr(stop_id, "offset", String(stop.offset));
+			this.doc.set_attr(stop_id, "stop-color", stop.color);
+			if (stop.opacity !== void 0) this.doc.set_attr(stop_id, "stop-opacity", String(stop.opacity));
+			this.doc.insert(stop_id, node, null);
+		}
+	}
+	count_refs(id) {
+		let count = 0;
+		const pattern = new RegExp(`url\\(\\s*["']?#${escape_regex(id)}["']?\\s*\\)`);
+		for (const node of this.doc.all_elements()) {
+			const fill = this.doc.get_attr(node, "fill");
+			const stroke = this.doc.get_attr(node, "stroke");
+			const style_fill = this.doc.get_style(node, "fill");
+			const style_stroke = this.doc.get_style(node, "stroke");
+			for (const v of [
+				fill,
+				stroke,
+				style_fill,
+				style_stroke
+			]) if (v && pattern.test(v)) count++;
+		}
+		return count;
+	}
+};
+function escape_regex(s) {
+	return s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function create_defs(doc) {
+	return { gradients: new GradientsRegistry(doc) };
+}
+const XML_NS = "http://www.w3.org/XML/1998/namespace";
+const XMLNS_NS = "http://www.w3.org/2000/xmlns/";
+let id_counter = 0;
+function fresh_id() {
+	return `n${id_counter++}`;
+}
+function reset_id_counter() {
+	id_counter = 0;
+}
+function parse_svg(src) {
+	reset_id_counter();
+	const nodes = /* @__PURE__ */ new Map();
+	const prolog = [];
+	const epilog = [];
+	let i = 0;
+	const n = src.length;
+	let root = null;
+	const open_stack = [];
+	/** ns prefix → uri, per ancestor scope (top of stack). */
+	const ns_stack = [new Map([["xml", XML_NS], ["xmlns", XMLNS_NS]])];
+	/** default ns per ancestor scope (top of stack). */
+	const default_ns_stack = [null];
+	function push_to_parent(node) {
+		nodes.set(node.id, node);
+		if (open_stack.length === 0) {
+			if (node.kind === "element" && root === null) return;
+			if (root === null) prolog.push(node);
+			else epilog.push(node);
+			return;
+		}
+		const parent = open_stack[open_stack.length - 1];
+		node.parent = parent.id;
+		parent.children.push(node.id);
+	}
+	while (i < n) {
+		if (src[i] === "<") {
+			if (src.startsWith("<!--", i)) {
+				const end = src.indexOf("-->", i + 4);
+				if (end === -1) throw new Error("unterminated comment");
+				const value = src.slice(i + 4, end);
+				push_to_parent({
+					kind: "comment",
+					id: fresh_id(),
+					parent: null,
+					value
+				});
+				i = end + 3;
+				continue;
+			}
+			if (src.startsWith("<![CDATA[", i)) {
+				const end = src.indexOf("]]>", i + 9);
+				if (end === -1) throw new Error("unterminated CDATA");
+				const value = src.slice(i + 9, end);
+				push_to_parent({
+					kind: "cdata",
+					id: fresh_id(),
+					parent: null,
+					value
+				});
+				i = end + 3;
+				continue;
+			}
+			if (src.startsWith("<!DOCTYPE", i) || src.startsWith("<!doctype", i)) {
+				let depth = 1;
+				let j = i + 9;
+				while (j < n && depth > 0) {
+					const c = src[j];
+					if (c === "<") depth++;
+					else if (c === ">") depth--;
+					if (depth === 0) break;
+					j++;
+				}
+				if (j >= n) throw new Error("unterminated doctype");
+				push_to_parent({
+					kind: "doctype",
+					id: fresh_id(),
+					parent: null,
+					value: src.slice(i + 9, j)
+				});
+				i = j + 1;
+				continue;
+			}
+			if (src.startsWith("<?", i)) {
+				const end = src.indexOf("?>", i + 2);
+				if (end === -1) throw new Error("unterminated PI");
+				const body = src.slice(i + 2, end);
+				const space = body.search(/\s/);
+				const target = space === -1 ? body : body.slice(0, space);
+				const value = space === -1 ? "" : body.slice(space + 1);
+				push_to_parent({
+					kind: "pi",
+					id: fresh_id(),
+					parent: null,
+					target,
+					value
+				});
+				i = end + 2;
+				continue;
+			}
+			if (src[i + 1] === "/") {
+				const end = src.indexOf(">", i + 2);
+				if (end === -1) throw new Error("unterminated end tag");
+				const open = open_stack.pop();
+				if (!open) throw new Error("unexpected end tag at " + i);
+				ns_stack.pop();
+				default_ns_stack.pop();
+				const m = src.slice(i + 2, end).match(/^(\s*)([^\s]+)(\s*)$/);
+				if (m) {
+					open.close_tag_leading = m[1];
+					open.close_tag_trailing = m[3];
+				}
+				i = end + 1;
+				continue;
+			}
+			const start = i + 1;
+			let j = start;
+			while (j < n && !/[\s/>]/.test(src[j])) j++;
+			const raw_tag = src.slice(start, j);
+			const [prefix, local] = split_qname(raw_tag);
+			const { attrs, end_index, self_closing, trailing } = parse_attrs(src, j);
+			const new_ns_map = new Map(ns_stack[ns_stack.length - 1]);
+			let new_default_ns = default_ns_stack[default_ns_stack.length - 1];
+			for (const a of attrs) if (a.prefix === "xmlns") new_ns_map.set(a.local, a.value);
+			else if (a.prefix === null && a.local === "xmlns") new_default_ns = a.value;
+			for (const a of attrs) if (a.prefix === "xmlns" || a.prefix === null && a.local === "xmlns") a.ns = XMLNS_NS;
+			else if (a.prefix) a.ns = new_ns_map.get(a.prefix) ?? null;
+			else a.ns = null;
+			const element_ns = prefix ? new_ns_map.get(prefix) ?? null : new_default_ns;
+			const elem = {
+				kind: "element",
+				id: fresh_id(),
+				parent: null,
+				raw_tag,
+				prefix,
+				local,
+				ns: element_ns,
+				attrs,
+				children: [],
+				self_closing,
+				open_tag_trailing: trailing,
+				close_tag_leading: "",
+				close_tag_trailing: ""
+			};
+			push_to_parent(elem);
+			if (root === null) root = elem.id;
+			if (!self_closing) {
+				open_stack.push(elem);
+				ns_stack.push(new_ns_map);
+				default_ns_stack.push(new_default_ns);
+			}
+			i = end_index;
+			continue;
+		}
+		const next = src.indexOf("<", i);
+		const end = next === -1 ? n : next;
+		const value = decode_entities(src.slice(i, end));
+		push_to_parent({
+			kind: "text",
+			id: fresh_id(),
+			parent: null,
+			value
+		});
+		i = end;
+	}
+	if (open_stack.length > 0) throw new Error(`unclosed element <${open_stack[open_stack.length - 1].raw_tag}>`);
+	if (root === null) throw new Error("no root element");
+	return {
+		prolog,
+		root,
+		epilog,
+		nodes
+	};
+}
+function split_qname(qname) {
+	const idx = qname.indexOf(":");
+	if (idx === -1) return [null, qname];
+	return [qname.slice(0, idx), qname.slice(idx + 1)];
+}
+function parse_attrs(src, from) {
+	const attrs = [];
+	let i = from;
+	let pre = "";
+	const n = src.length;
+	while (i < n) {
+		const ws_start = i;
+		while (i < n && /\s/.test(src[i])) i++;
+		pre += src.slice(ws_start, i);
+		if (i >= n) throw new Error("unterminated start tag");
+		const c = src[i];
+		if (c === "/") {
+			if (src[i + 1] !== ">") throw new Error("expected '/>' at " + i);
+			pre + "";
+			return {
+				attrs,
+				end_index: i + 2,
+				self_closing: true,
+				trailing: pre
+			};
+		}
+		if (c === ">") return {
+			attrs,
+			end_index: i + 1,
+			self_closing: false,
+			trailing: pre
+		};
+		const name_start = i;
+		while (i < n && !/[\s=/>]/.test(src[i])) i++;
+		const raw_name = src.slice(name_start, i);
+		let eq_trivia = "";
+		while (i < n && /\s/.test(src[i])) {
+			eq_trivia += src[i];
+			i++;
+		}
+		if (src[i] !== "=") {
+			const [prefix, local] = split_qname(raw_name);
+			attrs.push({
+				raw_name,
+				prefix,
+				local,
+				ns: null,
+				value: "",
+				pre,
+				eq_trivia,
+				quote: "\""
+			});
+			pre = "";
+			continue;
+		}
+		i++;
+		while (i < n && /\s/.test(src[i])) i++;
+		const quote = src[i];
+		if (quote !== "\"" && quote !== "'") throw new Error("expected attribute quote at " + i);
+		i++;
+		const val_start = i;
+		while (i < n && src[i] !== quote) i++;
+		if (i >= n) throw new Error("unterminated attribute value");
+		const raw_value = src.slice(val_start, i);
+		i++;
+		const [prefix, local] = split_qname(raw_name);
+		attrs.push({
+			raw_name,
+			prefix,
+			local,
+			ns: null,
+			value: decode_entities(raw_value),
+			pre,
+			eq_trivia,
+			quote
+		});
+		pre = "";
+	}
+	throw new Error("unterminated start tag");
+}
+const NAMED_ENTITIES = {
+	amp: "&",
+	lt: "<",
+	gt: ">",
+	quot: "\"",
+	apos: "'"
+};
+function decode_entities(s) {
+	return s.replace(/&(#x[0-9a-fA-F]+|#\d+|[a-zA-Z][a-zA-Z0-9]*);/g, (_, ent) => {
+		if (ent.startsWith("#x") || ent.startsWith("#X")) return String.fromCodePoint(parseInt(ent.slice(2), 16));
+		if (ent.startsWith("#")) return String.fromCodePoint(parseInt(ent.slice(1), 10));
+		return NAMED_ENTITIES[ent] ?? `&${ent};`;
+	});
+}
+function encode_attr_value(value, quote) {
+	let out = value.replace(/&/g, "&amp;").replace(/</g, "&lt;");
+	out = quote === "\"" ? out.replace(/"/g, "&quot;") : out.replace(/'/g, "&apos;");
+	return out;
+}
+function encode_text(value) {
+	return value.replace(/&/g, "&amp;").replace(/</g, "&lt;");
+}
+//#endregion
+//#region src/core/document.ts
+var SvgDocument = class SvgDocument {
+	constructor(svg) {
+		this.listeners = /* @__PURE__ */ new Set();
+		this._structure_version = 0;
+		this.source = svg;
+		const parsed = parse_svg(svg);
+		this.original = parsed;
+		this.nodes = parsed.nodes;
+		this.prolog = parsed.prolog;
+		this.epilog = parsed.epilog;
+		this.root = parsed.root;
+	}
+	static parse(svg) {
+		return new SvgDocument(svg);
+	}
+	/** Reload from the original parse, discarding all edits. */
+	reset_to_original() {
+		const parsed = parse_svg(this.source);
+		this.original = parsed;
+		this.nodes = parsed.nodes;
+		this.prolog = parsed.prolog;
+		this.epilog = parsed.epilog;
+		this.root = parsed.root;
+		this._structure_version++;
+		this.emit();
+	}
+	/** Replace document with new svg source (clears edits + history-owned state). */
+	load(svg) {
+		this.source = svg;
+		const parsed = parse_svg(svg);
+		this.original = parsed;
+		this.nodes = parsed.nodes;
+		this.prolog = parsed.prolog;
+		this.epilog = parsed.epilog;
+		this.root = parsed.root;
+		this._structure_version++;
+		this.emit();
+	}
+	on_change(fn) {
+		this.listeners.add(fn);
+		return () => this.listeners.delete(fn);
+	}
+	/** See `_structure_version` for what this counter signals. */
+	get structure_version() {
+		return this._structure_version;
+	}
+	emit() {
+		for (const fn of this.listeners) fn();
+	}
+	/** Notify subscribers — for callers that mutate directly via setAttr/etc. */
+	notify() {
+		this.emit();
+	}
+	get(id) {
+		return this.nodes.get(id) ?? null;
+	}
+	is_element(id) {
+		return this.nodes.get(id)?.kind === "element";
+	}
+	parent_of(id) {
+		return this.nodes.get(id)?.parent ?? null;
+	}
+	children_of(id) {
+		const n = this.nodes.get(id);
+		if (!n || n.kind !== "element") return [];
+		return n.children;
+	}
+	/** Element children only — text/comment/cdata filtered out. */
+	element_children_of(id) {
+		return this.children_of(id).filter((c) => this.is_element(c));
+	}
+	next_sibling_of(id) {
+		const parent = this.parent_of(id);
+		if (parent === null) return null;
+		const siblings = this.children_of(parent);
+		const i = siblings.indexOf(id);
+		return i >= 0 && i + 1 < siblings.length ? siblings[i + 1] : null;
+	}
+	next_element_sibling_of(id) {
+		const parent = this.parent_of(id);
+		if (parent === null) return null;
+		const siblings = this.element_children_of(parent);
+		const i = siblings.indexOf(id);
+		return i >= 0 && i + 1 < siblings.length ? siblings[i + 1] : null;
+	}
+	tag_of(id) {
+		const n = this.nodes.get(id);
+		return n && n.kind === "element" ? n.local : "";
+	}
+	contains(ancestor, descendant) {
+		if (ancestor === descendant) return true;
+		let cur = this.parent_of(descendant);
+		while (cur !== null) {
+			if (cur === ancestor) return true;
+			cur = this.parent_of(cur);
+		}
+		return false;
+	}
+	all_nodes() {
+		const out = [];
+		const walk = (id) => {
+			out.push(id);
+			const c = this.children_of(id);
+			for (const ch of c) walk(ch);
+		};
+		walk(this.root);
+		return out;
+	}
+	all_elements() {
+		return this.all_nodes().filter((id) => this.is_element(id));
+	}
+	find_by_tag(ancestor, tag) {
+		const out = [];
+		const walk = (id) => {
+			if (id !== ancestor && this.is_element(id) && this.tag_of(id) === tag) out.push(id);
+			for (const c of this.children_of(id)) walk(c);
+		};
+		walk(ancestor);
+		return out;
+	}
+	/** Read attribute by local name, optionally namespace-filtered. */
+	get_attr(id, name, ns = null) {
+		const n = this.nodes.get(id);
+		if (!n || n.kind !== "element") return null;
+		for (const a of n.attrs) if (a.local === name && (ns === null || a.ns === ns)) return a.value;
+		return null;
+	}
+	/**
+	* Set / remove an attribute. If the attribute exists, it is mutated in place
+	* (preserving source position). If it doesn't, it's appended.
+	*/
+	set_attr(id, name, value, ns = null) {
+		const n = this.nodes.get(id);
+		if (!n || n.kind !== "element") return;
+		const structural = name === "id";
+		for (let i = 0; i < n.attrs.length; i++) {
+			const a = n.attrs[i];
+			if (a.local === name && (ns === null || a.ns === ns)) {
+				if (value === null) n.attrs.splice(i, 1);
+				else a.value = value;
+				if (structural) this._structure_version++;
+				this.emit();
+				return;
+			}
+		}
+		if (value !== null) {
+			const prefix = ns === "http://www.w3.org/1999/xlink" ? "xlink" : null;
+			n.attrs.push({
+				raw_name: prefix ? `${prefix}:${name}` : name,
+				prefix,
+				local: name,
+				ns,
+				value,
+				pre: " ",
+				eq_trivia: "",
+				quote: "\""
+			});
+			if (structural) this._structure_version++;
+			this.emit();
+		}
+	}
+	attributes_of(id) {
+		const n = this.nodes.get(id);
+		if (!n || n.kind !== "element") return [];
+		return n.attrs.map((a) => ({
+			name: a.local,
+			ns: a.ns,
+			value: a.value
+		}));
+	}
+	get_style(id, property) {
+		const style = this.get_attr(id, "style");
+		if (!style) return null;
+		const decls = parse_inline_style(style);
+		for (const d of decls) if (d.property === property) return d.value;
+		return null;
+	}
+	set_style(id, property, value) {
+		const decls = parse_inline_style(this.get_attr(id, "style") ?? "");
+		const idx = decls.findIndex((d) => d.property === property);
+		if (value === null) {
+			if (idx === -1) return;
+			decls.splice(idx, 1);
+		} else if (idx === -1) decls.push({
+			property,
+			value
+		});
+		else decls[idx].value = value;
+		const next = decls.map((d) => `${d.property}: ${d.value}`).join("; ");
+		this.set_attr(id, "style", next === "" ? null : next);
+	}
+	get_all_styles(id) {
+		const style = this.get_attr(id, "style");
+		if (!style) return [];
+		return parse_inline_style(style);
+	}
+	text_of(id) {
+		const n = this.nodes.get(id);
+		if (!n || n.kind !== "element") return "";
+		let out = "";
+		for (const c of n.children) {
+			const cn = this.nodes.get(c);
+			if (cn?.kind === "text") out += cn.value;
+		}
+		return out;
+	}
+	/** Replace all direct text children with a single text node carrying `value`. */
+	set_text(id, value) {
+		const n = this.nodes.get(id);
+		if (!n || n.kind !== "element") return;
+		n.children = n.children.filter((c) => this.nodes.get(c)?.kind !== "text");
+		if (value !== "") {
+			const text_id = `t${Math.random().toString(36).slice(2, 10)}`;
+			const text_node = {
+				kind: "text",
+				id: text_id,
+				parent: id,
+				value
+			};
+			this.nodes.set(text_id, text_node);
+			n.children.push(text_id);
+		}
+		this._structure_version++;
+		this.emit();
+	}
+	insert(id, parent, before) {
+		const node = this.nodes.get(id);
+		const parent_node = this.nodes.get(parent);
+		if (!node || !parent_node || parent_node.kind !== "element") return;
+		if (node.parent !== null) {
+			const old_parent = this.nodes.get(node.parent);
+			if (old_parent && old_parent.kind === "element") {
+				const i = old_parent.children.indexOf(id);
+				if (i >= 0) old_parent.children.splice(i, 1);
+			}
+		}
+		const ix = before === null ? -1 : parent_node.children.indexOf(before);
+		if (ix < 0) parent_node.children.push(id);
+		else parent_node.children.splice(ix, 0, id);
+		node.parent = parent;
+		this._structure_version++;
+		this.emit();
+	}
+	remove(id) {
+		const n = this.nodes.get(id);
+		if (!n || n.parent === null) return;
+		const parent = this.nodes.get(n.parent);
+		if (!parent || parent.kind !== "element") return;
+		const i = parent.children.indexOf(id);
+		if (i >= 0) parent.children.splice(i, 1);
+		n.parent = null;
+		this._structure_version++;
+		this.emit();
+	}
+	/** Create a new element node and register it (not yet inserted). */
+	create_element(local, opts) {
+		const id = `e${Math.random().toString(36).slice(2, 10)}`;
+		const prefix = opts?.prefix ?? null;
+		const ns = opts?.ns ?? null;
+		const node = {
+			kind: "element",
+			id,
+			parent: null,
+			raw_tag: prefix ? `${prefix}:${local}` : local,
+			prefix,
+			local,
+			ns,
+			attrs: [],
+			children: [],
+			self_closing: false,
+			open_tag_trailing: "",
+			close_tag_leading: "",
+			close_tag_trailing: ""
+		};
+		this.nodes.set(id, node);
+		return id;
+	}
+	serialize() {
+		let out = "";
+		for (const p of this.prolog) out += this.emit_node(p);
+		out += this.emit_node(this.nodes.get(this.root));
+		for (const e of this.epilog) out += this.emit_node(e);
+		return out;
+	}
+	emit_node(n) {
+		switch (n.kind) {
+			case "text": return encode_text(n.value);
+			case "comment": return `<!--${n.value}-->`;
+			case "cdata": return `<![CDATA[${n.value}]]>`;
+			case "pi": {
+				const pi = n;
+				return `<?${pi.target}${pi.value ? " " + pi.value : ""}?>`;
+			}
+			case "doctype": return `<!DOCTYPE${n.value}>`;
+			case "element": {
+				const e = n;
+				let s = `<${e.raw_tag}`;
+				for (const a of e.attrs) s += this.emit_attr(a);
+				if (e.children.length === 0 && e.self_closing) {
+					s += `${e.open_tag_trailing}/>`;
+					return s;
+				}
+				s += `${e.open_tag_trailing}>`;
+				for (const cid of e.children) {
+					const cn = this.nodes.get(cid);
+					if (cn) s += this.emit_node(cn);
+				}
+				s += `</${e.close_tag_leading}${e.raw_tag}${e.close_tag_trailing}>`;
+				return s;
+			}
+		}
+	}
+	emit_attr(a) {
+		return `${a.pre}${a.raw_name}${a.eq_trivia}=${a.quote}${encode_attr_value(a.value, a.quote)}${a.quote}`;
+	}
+};
+function parse_inline_style(s) {
+	const out = [];
+	const decls = s.split(";");
+	for (const decl of decls) {
+		const colon = decl.indexOf(":");
+		if (colon === -1) continue;
+		const property = decl.slice(0, colon).trim();
+		const value = decl.slice(colon + 1).trim();
+		if (property) out.push({
+			property,
+			value
+		});
+	}
+	return out;
+}
+//#endregion
+//#region src/core/properties.ts
+/** SVG properties that inherit per SVG 2 §6 (subset; the common ones). */
+const INHERITED = new Set([
+	"color",
+	"cursor",
+	"direction",
+	"fill",
+	"fill-opacity",
+	"fill-rule",
+	"font",
+	"font-family",
+	"font-size",
+	"font-style",
+	"font-variant",
+	"font-weight",
+	"letter-spacing",
+	"marker",
+	"marker-end",
+	"marker-mid",
+	"marker-start",
+	"paint-order",
+	"pointer-events",
+	"shape-rendering",
+	"stroke",
+	"stroke-dasharray",
+	"stroke-dashoffset",
+	"stroke-linecap",
+	"stroke-linejoin",
+	"stroke-miterlimit",
+	"stroke-opacity",
+	"stroke-width",
+	"text-anchor",
+	"text-rendering",
+	"visibility",
+	"word-spacing",
+	"writing-mode"
+]);
+/** Initial values for known properties (subset). */
+const INITIAL = {
+	fill: "black",
+	stroke: "none",
+	"fill-opacity": "1",
+	"stroke-opacity": "1",
+	"stroke-width": "1",
+	opacity: "1",
+	visibility: "visible",
+	display: "inline"
+};
+/**
+* Resolve a property's declared value and its provenance for a single node.
+*
+* The cascade engine here covers what the README says is in scope:
+* presentation attributes + inline style + parent inheritance + initial.
+* `<style>` block matching is deferred.
+*/
+function resolve_declared(doc, id, property) {
+	const inline = doc.get_style(id, property);
+	if (inline !== null && inline !== "") return {
+		declared: inline,
+		provenance: {
+			origin: "author",
+			carrier: "inline_style"
+		}
+	};
+	const attr = doc.get_attr(id, property);
+	if (attr !== null && attr !== "") return {
+		declared: attr,
+		provenance: {
+			origin: "author",
+			carrier: "presentation_attribute"
+		}
+	};
+	if (INHERITED.has(property)) {
+		const parent = doc.parent_of(id);
+		if (parent !== null && doc.is_element(parent)) {
+			const r = resolve_declared(doc, parent, property);
+			if (r.declared !== null) return {
+				declared: r.declared,
+				provenance: {
+					origin: "author",
+					carrier: "inherited"
+				}
+			};
+		}
+	}
+	return {
+		declared: INITIAL[property] ?? null,
+		provenance: {
+			origin: "user_agent",
+			carrier: "defaulted"
+		}
+	};
+}
+/**
+* Type-parsed computed value for known properties. Unknown property names
+* return the declared string as-is.
+*/
+function compute_known(property, declared) {
+	if (declared === null) return null;
+	const trimmed = declared.trim();
+	if (trimmed === "inherit" || trimmed === "initial" || trimmed === "unset" || trimmed === "revert" || trimmed === "revert-layer") return null;
+	if (/^var\s*\(/i.test(trimmed)) return {
+		error: "invalid_at_computed_value_time",
+		reason: `var() substitution requires a cascade engine (not implemented)`
+	};
+	switch (property) {
+		case "opacity":
+		case "fill-opacity":
+		case "stroke-opacity":
+		case "stroke-width":
+		case "x":
+		case "y":
+		case "width":
+		case "height":
+		case "cx":
+		case "cy":
+		case "r":
+		case "rx":
+		case "ry":
+		case "font-size": {
+			const n = parseFloat(trimmed);
+			return Number.isFinite(n) ? n : trimmed;
+		}
+		default: return trimmed;
+	}
+}
+function read_property(doc, id, property) {
+	const { declared, provenance } = resolve_declared(doc, id, property);
+	return {
+		declared,
+		computed: compute_known(property, declared),
+		provenance
+	};
+}
+/** Which carrier should a `set_property` write to? Per the README (P1):
+*  whichever carrier currently wins the cascade. If nothing wins (defaulted /
+*  inherited), write a presentation attribute by default. */
+function choose_write_carrier(doc, id, property) {
+	const inline = doc.get_style(id, property);
+	if (inline !== null && inline !== "") return "inline_style";
+	return "presentation_attribute";
+}
+//#endregion
+//#region src/types.ts
+const DEFAULT_STYLE = {
+	chrome_color: "#2563eb",
+	handle_size: 8,
+	handle_fill: "#ffffff",
+	handle_stroke: "#2563eb",
+	endpoint_dot_radius: 5,
+	selection_outline_width: 2,
+	measurement_color: "#ff3a30"
+};
+//#endregion
+//#region src/core/editor.ts
+const PROVIDER_ID = "svg-editor";
+/** Max characters in a synthesized display label before truncation. */
+const DISPLAY_LABEL_MAX_LEN = 40;
+function createSvgEditor(opts) {
+	const doc = new SvgDocument(opts.svg);
+	const history = new _grida_history.HistoryImpl();
+	const defs = create_defs(doc);
+	let selection = [];
+	let scope = null;
+	let mode = "select";
+	let version = 0;
+	/** Document-edit counter — only bumps on actual mutations, not selection. */
+	let doc_version = 0;
+	/** doc_version at the last load()/serialize(); compared to derive `dirty`. */
+	let baseline_doc_version = 0;
+	let style = {
+		...DEFAULT_STYLE,
+		...opts.style ?? {}
+	};
+	const providers = opts.providers ?? {};
+	const listeners = /* @__PURE__ */ new Set();
+	let attached_surface = null;
+	const modes = ["select", "edit-content"];
+	function snapshot() {
+		return Object.freeze({
+			selection,
+			scope,
+			mode,
+			dirty: doc_version !== baseline_doc_version,
+			can_undo: history.stack.canUndo,
+			can_redo: history.stack.canRedo,
+			version,
+			structure_version: doc.structure_version
+		});
+	}
+	function emit() {
+		version++;
+		const s = snapshot();
+		for (const fn of listeners) fn(s);
+	}
+	history.on("onChange", () => emit());
+	history.on("onUndo", () => emit());
+	history.on("onRedo", () => emit());
+	doc.on_change(() => {
+		doc_version++;
+	});
+	function subscribe(fn) {
+		listeners.add(fn);
+		return () => {
+			listeners.delete(fn);
+		};
+	}
+	function subscribe_with_selector(selector, fn, equals = Object.is) {
+		let prev = selector(snapshot());
+		return subscribe((state) => {
+			const next = selector(state);
+			if (!equals(prev, next)) {
+				const p = prev;
+				prev = next;
+				fn(next, p);
+			}
+		});
+	}
+	function set_selection(next) {
+		selection = Object.freeze([...next]);
+		emit();
+	}
+	function select(target, opts) {
+		const ids = typeof target === "string" ? [target] : [...target];
+		if (opts?.additive) {
+			const merged = new Set(selection);
+			for (const id of ids) merged.add(id);
+			set_selection([...merged]);
+		} else set_selection(ids);
+	}
+	function deselect() {
+		set_selection([]);
+	}
+	function enter_scope(group) {
+		scope = group;
+		emit();
+	}
+	function exit_scope() {
+		if (scope === null) return;
+		const parent = doc.parent_of(scope);
+		scope = parent && parent !== doc.root ? parent : null;
+		emit();
+	}
+	function set_mode(next) {
+		if (mode === next) return;
+		mode = next;
+		emit();
+	}
+	function node_properties(id, names) {
+		const out = {};
+		for (const name of names) out[name] = read_property(doc, id, name);
+		return out;
+	}
+	function node_paint(id, channel) {
+		const { declared, provenance } = resolve_declared(doc, id, channel);
+		return {
+			declared,
+			computed: require_paint.parse_paint(declared),
+			provenance
+		};
+	}
+	function write_property(id, name, value) {
+		if (choose_write_carrier(doc, id, name) === "inline_style") doc.set_style(id, name, value);
+		else doc.set_attr(id, name, value);
+	}
+	function set_property(name, value) {
+		if (selection.length === 0) return;
+		const before = [];
+		for (const id of selection) before.push({
+			id,
+			attr: doc.get_attr(id, name),
+			style: doc.get_style(id, name)
+		});
+		const targets = [...selection];
+		const apply = () => {
+			for (const id of targets) write_property(id, name, value);
+			emit();
+		};
+		const revert = () => {
+			for (const b of before) {
+				if (b.style !== null) doc.set_style(b.id, name, b.style);
+				else doc.set_style(b.id, name, null);
+				doc.set_attr(b.id, name, b.attr);
+			}
+			emit();
+		};
+		apply();
+		history.atomic(`set ${name}`, (tx) => {
+			tx.push({
+				providerId: PROVIDER_ID,
+				apply,
+				revert
+			});
+		});
+	}
+	function preview_property(name) {
+		const before = [];
+		for (const id of selection) before.push({
+			id,
+			attr: doc.get_attr(id, name),
+			style: doc.get_style(id, name)
+		});
+		const preview = history.preview(`change ${name}`);
+		return {
+			update(value) {
+				preview.set({
+					providerId: PROVIDER_ID,
+					apply: () => {
+						for (const id of selection) write_property(id, name, value);
+						emit();
+					},
+					revert: () => {
+						for (const b of before) {
+							if (b.style !== null) doc.set_style(b.id, name, b.style);
+							else doc.set_style(b.id, name, null);
+							doc.set_attr(b.id, name, b.attr);
+						}
+						emit();
+					}
+				});
+			},
+			commit: () => preview.commit(),
+			discard: () => preview.discard()
+		};
+	}
+	function set_paint(channel, paint) {
+		if (selection.length === 0) return;
+		set_property(channel, require_paint.serialize_paint(paint));
+	}
+	function preview_paint(channel) {
+		const session = preview_property(channel);
+		return {
+			update: (paint) => session.update(require_paint.serialize_paint(paint)),
+			commit: () => session.commit(),
+			discard: () => session.discard()
+		};
+	}
+	function set_paint_from_gradient(channel, definition, _opts) {
+		const gradient_id = defs.gradients.upsert(definition);
+		set_paint(channel, {
+			kind: "ref",
+			id: gradient_id
+		});
+		return { gradient_id };
+	}
+	function translate(delta) {
+		if (selection.length === 0) return;
+		if (delta.dx === 0 && delta.dy === 0) return;
+		const baselines = selection.map((id) => ({
+			id,
+			baseline: require_paint.capture_translate_baseline(doc, id)
+		}));
+		const apply = () => {
+			for (const { id, baseline } of baselines) require_paint.apply_translate(doc, id, baseline, delta.dx, delta.dy);
+			emit();
+		};
+		const revert = () => {
+			for (const { id, baseline } of baselines) require_paint.apply_translate(doc, id, baseline, 0, 0);
+			emit();
+		};
+		apply();
+		history.atomic("translate", (tx) => {
+			tx.push({
+				providerId: PROVIDER_ID,
+				apply,
+				revert
+			});
+		});
+	}
+	function reorder(direction) {
+		if (selection.length !== 1) return;
+		const target = selection[0];
+		const parent = doc.parent_of(target);
+		if (parent === null) return;
+		const siblings = doc.element_children_of(parent);
+		const i = siblings.indexOf(target);
+		if (i < 0) return;
+		const original_before = siblings[i + 1] ?? null;
+		let new_before;
+		switch (direction) {
+			case "bring_forward":
+				if (i >= siblings.length - 1) return;
+				new_before = siblings[i + 2] ?? null;
+				break;
+			case "send_backward":
+				if (i <= 0) return;
+				new_before = siblings[i - 1];
+				break;
+			case "bring_to_front":
+				if (i === siblings.length - 1) return;
+				new_before = null;
+				break;
+			case "send_to_back":
+				if (i === 0) return;
+				new_before = siblings[0];
+				break;
+		}
+		const apply = () => {
+			doc.insert(target, parent, new_before);
+			emit();
+		};
+		const revert = () => {
+			doc.insert(target, parent, original_before);
+			emit();
+		};
+		apply();
+		history.atomic(`reorder: ${direction}`, (tx) => {
+			tx.push({
+				providerId: PROVIDER_ID,
+				apply,
+				revert
+			});
+		});
+	}
+	function remove() {
+		if (selection.length !== 1) return;
+		const target = selection[0];
+		const parent = doc.parent_of(target);
+		if (parent === null) return;
+		const next_sibling = doc.next_element_sibling_of(target);
+		const old_selection = selection;
+		const apply = () => {
+			doc.remove(target);
+			set_selection([]);
+		};
+		const revert = () => {
+			doc.insert(target, parent, next_sibling);
+			set_selection(old_selection);
+		};
+		apply();
+		history.atomic("remove", (tx) => {
+			tx.push({
+				providerId: PROVIDER_ID,
+				apply,
+				revert
+			});
+		});
+	}
+	function set_text(value) {
+		if (selection.length !== 1) return;
+		const target = selection[0];
+		if (doc.tag_of(target) !== "text") return;
+		const original = doc.text_of(target);
+		if (original === value) return;
+		const apply = () => {
+			doc.set_text(target, value);
+			emit();
+		};
+		const revert = () => {
+			doc.set_text(target, original);
+			emit();
+		};
+		apply();
+		history.atomic("edit text", (tx) => {
+			tx.push({
+				providerId: PROVIDER_ID,
+				apply,
+				revert
+			});
+		});
+	}
+	let content_edit_driver = null;
+	let computed_resolver = null;
+	function dom_computed_property(id, name) {
+		return computed_resolver?.computed_property(id, name) ?? null;
+	}
+	function dom_computed_paint(id, channel) {
+		return computed_resolver?.computed_paint(id, channel) ?? null;
+	}
+	let current_surface_hover = null;
+	let surface_hover_override = null;
+	const surface_hover_listeners = /* @__PURE__ */ new Set();
+	let surface_hover_override_driver = null;
+	function notify_surface_hover() {
+		for (const cb of surface_hover_listeners) cb();
+	}
+	function _set_current_surface_hover(id) {
+		if (current_surface_hover === id) return;
+		current_surface_hover = id;
+		notify_surface_hover();
+	}
+	function enter_content_edit(target) {
+		const id = target ?? (selection.length === 1 ? selection[0] : null);
+		if (!id) return false;
+		if (doc.tag_of(id) !== "text") return false;
+		if (!content_edit_driver) return false;
+		return content_edit_driver(id);
+	}
+	function load_svg(svg) {
+		doc.load(svg);
+		selection = [];
+		scope = null;
+		mode = "select";
+		history.clear();
+		baseline_doc_version = doc_version;
+		emit();
+	}
+	function serialize_svg() {
+		return doc.serialize();
+	}
+	function undo() {
+		history.undo();
+	}
+	function redo() {
+		history.redo();
+	}
+	const registry = new CommandRegistry();
+	const keymap = new Keymap(registry);
+	const commands = {
+		select,
+		deselect,
+		enter_scope,
+		exit_scope,
+		set_mode,
+		set_property,
+		preview_property,
+		set_paint,
+		preview_paint,
+		set_paint_from_gradient,
+		translate,
+		reorder,
+		remove,
+		set_text,
+		load_svg,
+		serialize_svg,
+		undo,
+		redo,
+		register: (id, handler) => registry.register(id, handler),
+		invoke: (id, args) => registry.invoke(id, args),
+		has: (id) => registry.has(id)
+	};
+	function load(svg) {
+		load_svg(svg);
+	}
+	function serialize() {
+		return doc.serialize();
+	}
+	function reset() {
+		history.clear();
+		doc.reset_to_original();
+		selection = [];
+		scope = null;
+		mode = "select";
+		baseline_doc_version = doc_version;
+		emit();
+	}
+	function attach(surface) {
+		if (attached_surface) attached_surface.dispose();
+		attached_surface = surface;
+		return { detach() {
+			if (attached_surface === surface) {
+				attached_surface.dispose();
+				attached_surface = null;
+			}
+		} };
+	}
+	function detach() {
+		if (attached_surface) {
+			attached_surface.dispose();
+			attached_surface = null;
+		}
+	}
+	function dispose() {
+		detach();
+		listeners.clear();
+	}
+	function set_style(partial) {
+		style = {
+			...style,
+			...partial
+		};
+		emit();
+	}
+	const public_editor = {
+		document: doc,
+		get state() {
+			return snapshot();
+		},
+		subscribe,
+		subscribe_with_selector,
+		node_properties,
+		node_paint,
+		dom_computed_property,
+		dom_computed_paint,
+		enter_content_edit,
+		defs,
+		commands,
+		display_label(id, opts) {
+			const tag = doc.tag_of(id);
+			if (tag === "text") {
+				const collapsed = doc.text_of(id).replace(/\s+/g, " ").trim();
+				if (collapsed.length === 0) return "text";
+				return collapsed.length > DISPLAY_LABEL_MAX_LEN ? `${collapsed.slice(0, DISPLAY_LABEL_MAX_LEN)}…` : collapsed;
+			}
+			const elem_id = doc.get_attr(id, "id");
+			const head = opts?.tagLabel ? opts.tagLabel(tag) : tag;
+			return elem_id && elem_id.length > 0 ? `${head} #${elem_id}` : head;
+		},
+		tree() {
+			const map = /* @__PURE__ */ new Map();
+			for (const id of doc.all_elements()) map.set(id, {
+				id,
+				tag: doc.tag_of(id),
+				name: doc.get_attr(id, "id") ?? void 0,
+				parent: doc.parent_of(id),
+				children: doc.element_children_of(id)
+			});
+			return {
+				root: doc.root,
+				nodes: map
+			};
+		},
+		surface_hover() {
+			return current_surface_hover;
+		},
+		set_surface_hover_override(id) {
+			if (surface_hover_override === id) return;
+			surface_hover_override = id;
+			if (surface_hover_override_driver) surface_hover_override_driver(id);
+		},
+		subscribe_surface_hover(cb) {
+			surface_hover_listeners.add(cb);
+			return () => {
+				surface_hover_listeners.delete(cb);
+			};
+		},
+		modes,
+		get style() {
+			return style;
+		},
+		set_style,
+		load,
+		serialize,
+		reset,
+		attach,
+		detach,
+		dispose,
+		providers,
+		_internal: {
+			doc,
+			set_content_edit_driver(fn) {
+				content_edit_driver = fn;
+			},
+			set_surface_hover_override_driver(fn) {
+				surface_hover_override_driver = fn;
+				if (fn) fn(surface_hover_override);
+			},
+			push_surface_hover(id) {
+				_set_current_surface_hover(id);
+			},
+			set_computed_resolver(fn) {
+				computed_resolver = fn;
+			}
+		},
+		keymap
+	};
+	registerDefaultCommands(registry, public_editor);
+	applyDefaultBindings(keymap);
+	return public_editor;
+}
+//#endregion
+Object.defineProperty(exports, "DEFAULT_STYLE", {
+	enumerable: true,
+	get: function() {
+		return DEFAULT_STYLE;
+	}
+});
+Object.defineProperty(exports, "createSvgEditor", {
+	enumerable: true,
+	get: function() {
+		return createSvgEditor;
+	}
+});