@grida/svg-editor 1.0.0-alpha.22 → 1.0.0-alpha.23

package/dist/{dom-Dw2SPHgc.d.mts → dom-D-ZJO9aK.d.mts}

@@ -198,6 +198,22 @@ declare function project_point_through_ctm(px: number, py: number, ctm: {
   e: number;
   f: number;
 }, container_offset: readonly [number, number]): [number, number];
+/**
+ * The matrix form of {@link project_point_through_ctm}: the full
+ * `local → container-px` affine for a CTM + container offset, as a
+ * `cmath.Transform`. Use when handing the transform to a downstream projector
+ * (e.g. HUD chrome) instead of projecting a single point.
+ *
+ * Pure function, no DOM types.
+ */
+declare function ctm_to_container_transform(ctm: {
+  a: number;
+  b: number;
+  c: number;
+  d: number;
+  e: number;
+  f: number;
+}, container_offset: readonly [number, number]): cmath.Transform;
 /**
  * Inverse of the CTM's linear part applied to a delta vector. Drops
  * translation. Used to convert a HUD-reported container-space drag delta
@@ -236,4 +252,4 @@ declare function inverse_project_rect(rect: {
   f: number;
 }, offset: readonly [number, number]): cmath.Rectangle | null;
 //#endregion
-export { install_font_load_geometry_bump as a, project_point_through_ctm as c, attach_dom_surface as i, DEFAULT_SNAP_OPTIONS as l, DomSurfaceHandle as n, inverse_project_rect as o, DomSurfaceOptions as r, project_delta_inverse_ctm as s, AttentionScope as t, SnapOptions as u };
+export { ctm_to_container_transform as a, project_delta_inverse_ctm as c, SnapOptions as d, attach_dom_surface as i, project_point_through_ctm as l, DomSurfaceHandle as n, install_font_load_geometry_bump as o, DomSurfaceOptions as r, inverse_project_rect as s, AttentionScope as t, DEFAULT_SNAP_OPTIONS as u };

package/dist/{dom-BIjCxCgx.mjs → dom-DVxR7PNh.mjs}

@@ -1222,44 +1222,32 @@ function create_attention_tracker(container) {
 }
 //#endregion
 //#region src/text-surface.ts
-const SVG_NS = "http://www.w3.org/2000/svg";
 const XML_NS = "http://www.w3.org/XML/1998/namespace";
 var SvgTextSurface = class {
-	constructor(textEl) {
+	/**
+	* @param textEl the live text element to drive.
+	* @param sink   receives the caret + selection geometry (local space) on
+	*   every change; the host projects + forwards it to the HUD. Called with
+	*   `null` on dispose so the host clears the chrome.
+	*/
+	constructor(textEl, sink) {
 		this.prevXmlSpace = void 0;
 		this.prevPointerEvents = void 0;
+		this.caret = null;
+		this.selection = null;
 		this.last_caret_idx = -1;
 		this.last_caret_visible = false;
 		this.last_sel_start = -1;
 		this.last_sel_end = -1;
 		this.textEl = textEl;
-		const ownerDoc = textEl.ownerDocument;
-		let mountAnchor = textEl;
-		while (mountAnchor.parentElement instanceof SVGElement && (mountAnchor.localName === "tspan" || mountAnchor.localName === "textPath")) mountAnchor = mountAnchor.parentElement;
-		const parent = mountAnchor.parentNode;
-		if (!parent) throw new Error("text element has no parent");
-		const computedWhitespace = ownerDoc.defaultView?.getComputedStyle(textEl).whiteSpace;
+		this.sink = sink;
+		const computedWhitespace = textEl.ownerDocument.defaultView?.getComputedStyle(textEl).whiteSpace;
 		if (!(computedWhitespace === "pre" || computedWhitespace === "pre-wrap" || computedWhitespace === "break-spaces")) {
 			this.prevXmlSpace = textEl.getAttributeNS(XML_NS, "space");
 			textEl.setAttributeNS(XML_NS, "xml:space", "preserve");
 		}
 		this.prevPointerEvents = textEl.getAttribute("pointer-events");
 		textEl.setAttribute("pointer-events", "bounding-box");
-		const selection = ownerDoc.createElementNS(SVG_NS, "rect");
-		selection.setAttribute("fill", "#2563eb");
-		selection.setAttribute("fill-opacity", "0.25");
-		selection.setAttribute("pointer-events", "none");
-		selection.setAttribute("data-svg-text-edit-selection", "");
-		selection.style.display = "none";
-		parent.insertBefore(selection, mountAnchor);
-		this.selectionRect = selection;
-		const caret = ownerDoc.createElementNS(SVG_NS, "rect");
-		caret.setAttribute("fill", "#2563eb");
-		caret.setAttribute("pointer-events", "none");
-		caret.setAttribute("data-svg-text-edit-caret", "");
-		caret.style.display = "none";
-		parent.insertBefore(caret, mountAnchor.nextSibling);
-		this.caretRect = caret;
 	}
 	setText(text) {
 		if (this.textEl.textContent !== text) this.textEl.textContent = text;
@@ -1268,38 +1256,43 @@ var SvgTextSurface = class {
 		if (index === this.last_caret_idx && visible === this.last_caret_visible) return;
 		this.last_caret_idx = index;
 		this.last_caret_visible = visible;
-		if (!visible) {
-			this.caretRect.style.display = "none";
-			return;
-		}
 		const m = this.metrics();
 		const x = this.charX(index);
-		this.caretRect.setAttribute("x", String(x - .75));
-		this.caretRect.setAttribute("y", String(m.top));
-		this.caretRect.setAttribute("width", "1.5");
-		this.caretRect.setAttribute("height", String(m.height));
-		this.caretRect.style.display = "block";
+		this.caret = {
+			top: [x, m.top],
+			bottom: [x, m.top + m.height],
+			visible
+		};
+		this.emit();
 	}
 	setSelection(start, end) {
 		if (start === this.last_sel_start && end === this.last_sel_end) return;
 		this.last_sel_start = start;
 		this.last_sel_end = end;
 		if (start === end) {
-			this.selectionRect.style.display = "none";
+			this.selection = null;
+			this.emit();
 			return;
 		}
 		const m = this.metrics();
 		const x1 = this.charX(start);
 		const x2 = this.charX(end);
-		this.selectionRect.setAttribute("x", String(Math.min(x1, x2)));
-		this.selectionRect.setAttribute("y", String(m.top));
-		this.selectionRect.setAttribute("width", String(Math.abs(x2 - x1)));
-		this.selectionRect.setAttribute("height", String(m.height));
-		this.selectionRect.style.display = "block";
+		this.selection = {
+			x: Math.min(x1, x2),
+			y: m.top,
+			width: Math.abs(x2 - x1),
+			height: m.height
+		};
+		this.emit();
+	}
+	emit() {
+		this.sink({
+			caret: this.caret,
+			selection: this.selection
+		});
 	}
 	dispose(keepEditMutations = false) {
-		this.caretRect.remove();
-		this.selectionRect.remove();
+		this.sink(null);
 		if (this.prevXmlSpace !== void 0 && !keepEditMutations) if (this.prevXmlSpace === null) this.textEl.removeAttributeNS(XML_NS, "space");
 		else this.textEl.setAttributeNS(XML_NS, "xml:space", this.prevXmlSpace);
 		if (this.prevPointerEvents !== void 0) if (this.prevPointerEvents === null) this.textEl.removeAttribute("pointer-events");
@@ -1923,6 +1916,7 @@ var DomSurface = class DomSurface {
 		this.text_edit = null;
 		this.text_edit_target = null;
 		this.text_edit_original = "";
+		this.text_edit_geom = null;
 		this.pending_text_insert = null;
 		this.vector_edit = null;
 		this.point_snap_guide = void 0;
@@ -2067,6 +2061,7 @@ var DomSurface = class DomSurface {
 			this.apply_camera_transform();
 			this.hud.setPixelGridTransform(this.camera.transform);
 			this.sync_surface_selection();
+			if (this.text_edit_geom) this.push_text_edit_chrome(this.text_edit_geom);
 			this.redraw();
 		}));
 		this.render();
@@ -4074,7 +4069,10 @@ var DomSurface = class DomSurface {
 		this.sync_surface_selection();
 		this.sync_cursor();
 		this.redraw();
-		const text_surface = new SvgTextSurface(this.element_index.get(id) ?? el);
+		const text_surface = new SvgTextSurface(this.element_index.get(id) ?? el, (geom) => {
+			this.push_text_edit_chrome(geom);
+			this.request_redraw();
+		});
 		const is_mac = typeof navigator !== "undefined" && /Mac|iPod|iPhone|iPad/.test(navigator.userAgent);
 		let settled = false;
 		this.text_edit = createTextEditor({
@@ -4122,11 +4120,45 @@ var DomSurface = class DomSurface {
 		this.render();
 		this.sync_surface_selection();
 		this.sync_cursor();
+		this.push_text_edit_chrome(null);
 		this.redraw();
 		this.text_edit = null;
 		this.text_edit_target = null;
 	}
 	/**
+	* Project the active session's text-edit geometry (LOCAL svg user-space) and
+	* push it to the HUD as text-edit chrome (caret + selection), or clear it on
+	* `null`. The local→container-px transform comes from the live text
+	* element's `getScreenCTM` (which folds in the camera's CSS transform on the
+	* SVG root) minus the container offset — the same projection convention
+	* `vector_of` / `container_box` use. The HUD keeps its own transform at
+	* identity, so this per-chrome transform is the whole projection. Does NOT
+	* redraw — callers own that.
+	*/
+	push_text_edit_chrome(geom) {
+		this.text_edit_geom = geom;
+		if (!geom) {
+			this.hud.setTextEditChrome(null);
+			return;
+		}
+		const ctm = (this.text_edit_target ? this.element_index.get(this.text_edit_target) : void 0)?.getScreenCTM?.() ?? null;
+		if (!ctm) {
+			this.hud.setTextEditChrome(null);
+			return;
+		}
+		const input = {
+			transform: ctm_to_container_transform(ctm, this.container_offset()),
+			caret: geom.caret ? {
+				top: geom.caret.top,
+				bottom: geom.caret.bottom
+			} : void 0,
+			caretVisible: geom.caret?.visible ?? false,
+			selectionRects: geom.selection ? [geom.selection] : void 0,
+			style: { caretColor: "#000000" }
+		};
+		this.hud.setTextEditChrome(input);
+	}
+	/**
 	* Realize the result of a text content-edit session and exit. `result`
 	* is the text that should remain — the typed text on commit, the original
 	* on cancel. Implements the empty-equals-delete rule (design:
@@ -4945,6 +4977,25 @@ function project_point_through_ctm(px, py, ctm, container_offset) {
 	return [sx + container_offset[0], sy + container_offset[1]];
 }
 /**
+* The matrix form of {@link project_point_through_ctm}: the full
+* `local → container-px` affine for a CTM + container offset, as a
+* `cmath.Transform`. Use when handing the transform to a downstream projector
+* (e.g. HUD chrome) instead of projecting a single point.
+*
+* Pure function, no DOM types.
+*/
+function ctm_to_container_transform(ctm, container_offset) {
+	return [[
+		ctm.a,
+		ctm.c,
+		ctm.e + container_offset[0]
+	], [
+		ctm.b,
+		ctm.d,
+		ctm.f + container_offset[1]
+	]];
+}
+/**
 * Inverse of the CTM's linear part applied to a delta vector. Drops
 * translation. Used to convert a HUD-reported container-space drag delta
 * back to the path's local coord space for `PathModel.translateVertices`.
@@ -5220,4 +5271,4 @@ var SvgHitShapeDriver = class {
 	}
 };
 //#endregion
-export { project_point_through_ctm as a, MemoizedGeometryProvider as c, project_delta_inverse_ctm as i, Camera as l, install_font_load_geometry_bump as n, Gestures as o, inverse_project_rect as r, DEFAULT_SNAP_OPTIONS as s, attach_dom_surface as t };
+export { project_delta_inverse_ctm as a, DEFAULT_SNAP_OPTIONS as c, inverse_project_rect as i, MemoizedGeometryProvider as l, ctm_to_container_transform as n, project_point_through_ctm as o, install_font_load_geometry_bump as r, Gestures as s, attach_dom_surface as t, Camera as u };

package/dist/{dom-H4PvmPe3.js → dom-Disackua.js}

@@ -1224,44 +1224,32 @@ function create_attention_tracker(container) {
 }
 //#endregion
 //#region src/text-surface.ts
-const SVG_NS = "http://www.w3.org/2000/svg";
 const XML_NS = "http://www.w3.org/XML/1998/namespace";
 var SvgTextSurface = class {
-	constructor(textEl) {
+	/**
+	* @param textEl the live text element to drive.
+	* @param sink   receives the caret + selection geometry (local space) on
+	*   every change; the host projects + forwards it to the HUD. Called with
+	*   `null` on dispose so the host clears the chrome.
+	*/
+	constructor(textEl, sink) {
 		this.prevXmlSpace = void 0;
 		this.prevPointerEvents = void 0;
+		this.caret = null;
+		this.selection = null;
 		this.last_caret_idx = -1;
 		this.last_caret_visible = false;
 		this.last_sel_start = -1;
 		this.last_sel_end = -1;
 		this.textEl = textEl;
-		const ownerDoc = textEl.ownerDocument;
-		let mountAnchor = textEl;
-		while (mountAnchor.parentElement instanceof SVGElement && (mountAnchor.localName === "tspan" || mountAnchor.localName === "textPath")) mountAnchor = mountAnchor.parentElement;
-		const parent = mountAnchor.parentNode;
-		if (!parent) throw new Error("text element has no parent");
-		const computedWhitespace = ownerDoc.defaultView?.getComputedStyle(textEl).whiteSpace;
+		this.sink = sink;
+		const computedWhitespace = textEl.ownerDocument.defaultView?.getComputedStyle(textEl).whiteSpace;
 		if (!(computedWhitespace === "pre" || computedWhitespace === "pre-wrap" || computedWhitespace === "break-spaces")) {
 			this.prevXmlSpace = textEl.getAttributeNS(XML_NS, "space");
 			textEl.setAttributeNS(XML_NS, "xml:space", "preserve");
 		}
 		this.prevPointerEvents = textEl.getAttribute("pointer-events");
 		textEl.setAttribute("pointer-events", "bounding-box");
-		const selection = ownerDoc.createElementNS(SVG_NS, "rect");
-		selection.setAttribute("fill", "#2563eb");
-		selection.setAttribute("fill-opacity", "0.25");
-		selection.setAttribute("pointer-events", "none");
-		selection.setAttribute("data-svg-text-edit-selection", "");
-		selection.style.display = "none";
-		parent.insertBefore(selection, mountAnchor);
-		this.selectionRect = selection;
-		const caret = ownerDoc.createElementNS(SVG_NS, "rect");
-		caret.setAttribute("fill", "#2563eb");
-		caret.setAttribute("pointer-events", "none");
-		caret.setAttribute("data-svg-text-edit-caret", "");
-		caret.style.display = "none";
-		parent.insertBefore(caret, mountAnchor.nextSibling);
-		this.caretRect = caret;
 	}
 	setText(text) {
 		if (this.textEl.textContent !== text) this.textEl.textContent = text;
@@ -1270,38 +1258,43 @@ var SvgTextSurface = class {
 		if (index === this.last_caret_idx && visible === this.last_caret_visible) return;
 		this.last_caret_idx = index;
 		this.last_caret_visible = visible;
-		if (!visible) {
-			this.caretRect.style.display = "none";
-			return;
-		}
 		const m = this.metrics();
 		const x = this.charX(index);
-		this.caretRect.setAttribute("x", String(x - .75));
-		this.caretRect.setAttribute("y", String(m.top));
-		this.caretRect.setAttribute("width", "1.5");
-		this.caretRect.setAttribute("height", String(m.height));
-		this.caretRect.style.display = "block";
+		this.caret = {
+			top: [x, m.top],
+			bottom: [x, m.top + m.height],
+			visible
+		};
+		this.emit();
 	}
 	setSelection(start, end) {
 		if (start === this.last_sel_start && end === this.last_sel_end) return;
 		this.last_sel_start = start;
 		this.last_sel_end = end;
 		if (start === end) {
-			this.selectionRect.style.display = "none";
+			this.selection = null;
+			this.emit();
 			return;
 		}
 		const m = this.metrics();
 		const x1 = this.charX(start);
 		const x2 = this.charX(end);
-		this.selectionRect.setAttribute("x", String(Math.min(x1, x2)));
-		this.selectionRect.setAttribute("y", String(m.top));
-		this.selectionRect.setAttribute("width", String(Math.abs(x2 - x1)));
-		this.selectionRect.setAttribute("height", String(m.height));
-		this.selectionRect.style.display = "block";
+		this.selection = {
+			x: Math.min(x1, x2),
+			y: m.top,
+			width: Math.abs(x2 - x1),
+			height: m.height
+		};
+		this.emit();
+	}
+	emit() {
+		this.sink({
+			caret: this.caret,
+			selection: this.selection
+		});
 	}
 	dispose(keepEditMutations = false) {
-		this.caretRect.remove();
-		this.selectionRect.remove();
+		this.sink(null);
 		if (this.prevXmlSpace !== void 0 && !keepEditMutations) if (this.prevXmlSpace === null) this.textEl.removeAttributeNS(XML_NS, "space");
 		else this.textEl.setAttributeNS(XML_NS, "xml:space", this.prevXmlSpace);
 		if (this.prevPointerEvents !== void 0) if (this.prevPointerEvents === null) this.textEl.removeAttribute("pointer-events");
@@ -1925,6 +1918,7 @@ var DomSurface = class DomSurface {
 		this.text_edit = null;
 		this.text_edit_target = null;
 		this.text_edit_original = "";
+		this.text_edit_geom = null;
 		this.pending_text_insert = null;
 		this.vector_edit = null;
 		this.point_snap_guide = void 0;
@@ -2069,6 +2063,7 @@ var DomSurface = class DomSurface {
 			this.apply_camera_transform();
 			this.hud.setPixelGridTransform(this.camera.transform);
 			this.sync_surface_selection();
+			if (this.text_edit_geom) this.push_text_edit_chrome(this.text_edit_geom);
 			this.redraw();
 		}));
 		this.render();
@@ -4076,7 +4071,10 @@ var DomSurface = class DomSurface {
 		this.sync_surface_selection();
 		this.sync_cursor();
 		this.redraw();
-		const text_surface = new SvgTextSurface(this.element_index.get(id) ?? el);
+		const text_surface = new SvgTextSurface(this.element_index.get(id) ?? el, (geom) => {
+			this.push_text_edit_chrome(geom);
+			this.request_redraw();
+		});
 		const is_mac = typeof navigator !== "undefined" && /Mac|iPod|iPhone|iPad/.test(navigator.userAgent);
 		let settled = false;
 		this.text_edit = (0, _grida_text_editor_dom.createTextEditor)({
@@ -4124,11 +4122,45 @@ var DomSurface = class DomSurface {
 		this.render();
 		this.sync_surface_selection();
 		this.sync_cursor();
+		this.push_text_edit_chrome(null);
 		this.redraw();
 		this.text_edit = null;
 		this.text_edit_target = null;
 	}
 	/**
+	* Project the active session's text-edit geometry (LOCAL svg user-space) and
+	* push it to the HUD as text-edit chrome (caret + selection), or clear it on
+	* `null`. The local→container-px transform comes from the live text
+	* element's `getScreenCTM` (which folds in the camera's CSS transform on the
+	* SVG root) minus the container offset — the same projection convention
+	* `vector_of` / `container_box` use. The HUD keeps its own transform at
+	* identity, so this per-chrome transform is the whole projection. Does NOT
+	* redraw — callers own that.
+	*/
+	push_text_edit_chrome(geom) {
+		this.text_edit_geom = geom;
+		if (!geom) {
+			this.hud.setTextEditChrome(null);
+			return;
+		}
+		const ctm = (this.text_edit_target ? this.element_index.get(this.text_edit_target) : void 0)?.getScreenCTM?.() ?? null;
+		if (!ctm) {
+			this.hud.setTextEditChrome(null);
+			return;
+		}
+		const input = {
+			transform: ctm_to_container_transform(ctm, this.container_offset()),
+			caret: geom.caret ? {
+				top: geom.caret.top,
+				bottom: geom.caret.bottom
+			} : void 0,
+			caretVisible: geom.caret?.visible ?? false,
+			selectionRects: geom.selection ? [geom.selection] : void 0,
+			style: { caretColor: "#000000" }
+		};
+		this.hud.setTextEditChrome(input);
+	}
+	/**
 	* Realize the result of a text content-edit session and exit. `result`
 	* is the text that should remain — the typed text on commit, the original
 	* on cancel. Implements the empty-equals-delete rule (design:
@@ -4947,6 +4979,25 @@ function project_point_through_ctm(px, py, ctm, container_offset) {
 	return [sx + container_offset[0], sy + container_offset[1]];
 }
 /**
+* The matrix form of {@link project_point_through_ctm}: the full
+* `local → container-px` affine for a CTM + container offset, as a
+* `cmath.Transform`. Use when handing the transform to a downstream projector
+* (e.g. HUD chrome) instead of projecting a single point.
+*
+* Pure function, no DOM types.
+*/
+function ctm_to_container_transform(ctm, container_offset) {
+	return [[
+		ctm.a,
+		ctm.c,
+		ctm.e + container_offset[0]
+	], [
+		ctm.b,
+		ctm.d,
+		ctm.f + container_offset[1]
+	]];
+}
+/**
 * Inverse of the CTM's linear part applied to a delta vector. Drops
 * translation. Used to convert a HUD-reported container-space drag delta
 * back to the path's local coord space for `PathModel.translateVertices`.
@@ -5252,6 +5303,12 @@ Object.defineProperty(exports, "attach_dom_surface", {
 		return attach_dom_surface;
 	}
 });
+Object.defineProperty(exports, "ctm_to_container_transform", {
+	enumerable: true,
+	get: function() {
+		return ctm_to_container_transform;
+	}
+});
 Object.defineProperty(exports, "install_font_load_geometry_bump", {
 	enumerable: true,
 	get: function() {

package/dist/{dom-CQkWJNrK.d.ts → dom-Dl56kUW5.d.ts}

@@ -196,6 +196,22 @@ declare function project_point_through_ctm(px: number, py: number, ctm: {
   e: number;
   f: number;
 }, container_offset: readonly [number, number]): [number, number];
+/**
+ * The matrix form of {@link project_point_through_ctm}: the full
+ * `local → container-px` affine for a CTM + container offset, as a
+ * `cmath.Transform`. Use when handing the transform to a downstream projector
+ * (e.g. HUD chrome) instead of projecting a single point.
+ *
+ * Pure function, no DOM types.
+ */
+declare function ctm_to_container_transform(ctm: {
+  a: number;
+  b: number;
+  c: number;
+  d: number;
+  e: number;
+  f: number;
+}, container_offset: readonly [number, number]): cmath.Transform;
 /**
  * Inverse of the CTM's linear part applied to a delta vector. Drops
  * translation. Used to convert a HUD-reported container-space drag delta
@@ -234,4 +250,4 @@ declare function inverse_project_rect(rect: {
   f: number;
 }, offset: readonly [number, number]): cmath.Rectangle | null;
 //#endregion
-export { install_font_load_geometry_bump as a, project_point_through_ctm as c, attach_dom_surface as i, DEFAULT_SNAP_OPTIONS as l, DomSurfaceHandle as n, inverse_project_rect as o, DomSurfaceOptions as r, project_delta_inverse_ctm as s, AttentionScope as t, SnapOptions as u };
+export { ctm_to_container_transform as a, project_delta_inverse_ctm as c, SnapOptions as d, attach_dom_surface as i, project_point_through_ctm as l, DomSurfaceHandle as n, install_font_load_geometry_bump as o, DomSurfaceOptions as r, inverse_project_rect as s, AttentionScope as t, DEFAULT_SNAP_OPTIONS as u };

package/dist/dom.d.mts

@@ -1,3 +1,3 @@
 import { C as BoundsResolver, E as CameraOptions, T as CameraConstraints, d as GestureContext, f as GestureId, g as MemoizedGeometryProvider, h as GeometrySignals, i as DomComputedResolver, m as GeometryProvider, p as Gestures, r as DomComputedPaint, u as GestureBinding, w as Camera } from "./editor-CcW4BVth.mjs";
-import { a as install_font_load_geometry_bump, c as project_point_through_ctm, i as attach_dom_surface, l as DEFAULT_SNAP_OPTIONS, n as DomSurfaceHandle, o as inverse_project_rect, r as DomSurfaceOptions, s as project_delta_inverse_ctm, t as AttentionScope, u as SnapOptions } from "./dom-Dw2SPHgc.mjs";
-export { AttentionScope, type BoundsResolver, Camera, type CameraConstraints, type CameraOptions, DEFAULT_SNAP_OPTIONS, type DomComputedPaint, type DomComputedResolver, DomSurfaceHandle, DomSurfaceOptions, type GeometryProvider, type GeometrySignals, type GestureBinding, type GestureContext, type GestureId, Gestures, MemoizedGeometryProvider, type SnapOptions, attach_dom_surface, install_font_load_geometry_bump, inverse_project_rect, project_delta_inverse_ctm, project_point_through_ctm };
+import { a as ctm_to_container_transform, c as project_delta_inverse_ctm, d as SnapOptions, i as attach_dom_surface, l as project_point_through_ctm, n as DomSurfaceHandle, o as install_font_load_geometry_bump, r as DomSurfaceOptions, s as inverse_project_rect, t as AttentionScope, u as DEFAULT_SNAP_OPTIONS } from "./dom-D-ZJO9aK.mjs";
+export { AttentionScope, type BoundsResolver, Camera, type CameraConstraints, type CameraOptions, DEFAULT_SNAP_OPTIONS, type DomComputedPaint, type DomComputedResolver, DomSurfaceHandle, DomSurfaceOptions, type GeometryProvider, type GeometrySignals, type GestureBinding, type GestureContext, type GestureId, Gestures, MemoizedGeometryProvider, type SnapOptions, attach_dom_surface, ctm_to_container_transform, install_font_load_geometry_bump, inverse_project_rect, project_delta_inverse_ctm, project_point_through_ctm };

package/dist/dom.d.ts

@@ -1,3 +1,3 @@
 import { C as BoundsResolver, E as CameraOptions, T as CameraConstraints, d as GestureContext, f as GestureId, g as MemoizedGeometryProvider, h as GeometrySignals, i as DomComputedResolver, m as GeometryProvider, p as Gestures, r as DomComputedPaint, u as GestureBinding, w as Camera } from "./editor-CxqRhhzP.js";
-import { a as install_font_load_geometry_bump, c as project_point_through_ctm, i as attach_dom_surface, l as DEFAULT_SNAP_OPTIONS, n as DomSurfaceHandle, o as inverse_project_rect, r as DomSurfaceOptions, s as project_delta_inverse_ctm, t as AttentionScope, u as SnapOptions } from "./dom-CQkWJNrK.js";
-export { AttentionScope, type BoundsResolver, Camera, type CameraConstraints, type CameraOptions, DEFAULT_SNAP_OPTIONS, type DomComputedPaint, type DomComputedResolver, DomSurfaceHandle, DomSurfaceOptions, type GeometryProvider, type GeometrySignals, type GestureBinding, type GestureContext, type GestureId, Gestures, MemoizedGeometryProvider, type SnapOptions, attach_dom_surface, install_font_load_geometry_bump, inverse_project_rect, project_delta_inverse_ctm, project_point_through_ctm };
+import { a as ctm_to_container_transform, c as project_delta_inverse_ctm, d as SnapOptions, i as attach_dom_surface, l as project_point_through_ctm, n as DomSurfaceHandle, o as install_font_load_geometry_bump, r as DomSurfaceOptions, s as inverse_project_rect, t as AttentionScope, u as DEFAULT_SNAP_OPTIONS } from "./dom-Dl56kUW5.js";
+export { AttentionScope, type BoundsResolver, Camera, type CameraConstraints, type CameraOptions, DEFAULT_SNAP_OPTIONS, type DomComputedPaint, type DomComputedResolver, DomSurfaceHandle, DomSurfaceOptions, type GeometryProvider, type GeometrySignals, type GestureBinding, type GestureContext, type GestureId, Gestures, MemoizedGeometryProvider, type SnapOptions, attach_dom_surface, ctm_to_container_transform, install_font_load_geometry_bump, inverse_project_rect, project_delta_inverse_ctm, project_point_through_ctm };

package/dist/dom.js

@@ -1,10 +1,11 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_dom = require("./dom-H4PvmPe3.js");
+const require_dom = require("./dom-Disackua.js");
 exports.Camera = require_dom.Camera;
 exports.DEFAULT_SNAP_OPTIONS = require_dom.DEFAULT_SNAP_OPTIONS;
 exports.Gestures = require_dom.Gestures;
 exports.MemoizedGeometryProvider = require_dom.MemoizedGeometryProvider;
 exports.attach_dom_surface = require_dom.attach_dom_surface;
+exports.ctm_to_container_transform = require_dom.ctm_to_container_transform;
 exports.install_font_load_geometry_bump = require_dom.install_font_load_geometry_bump;
 exports.inverse_project_rect = require_dom.inverse_project_rect;
 exports.project_delta_inverse_ctm = require_dom.project_delta_inverse_ctm;

package/dist/dom.mjs

@@ -1,2 +1,2 @@
-import { a as project_point_through_ctm, c as MemoizedGeometryProvider, i as project_delta_inverse_ctm, l as Camera, n as install_font_load_geometry_bump, o as Gestures, r as inverse_project_rect, s as DEFAULT_SNAP_OPTIONS, t as attach_dom_surface } from "./dom-BIjCxCgx.mjs";
-export { Camera, DEFAULT_SNAP_OPTIONS, Gestures, MemoizedGeometryProvider, attach_dom_surface, install_font_load_geometry_bump, inverse_project_rect, project_delta_inverse_ctm, project_point_through_ctm };
+import { a as project_delta_inverse_ctm, c as DEFAULT_SNAP_OPTIONS, i as inverse_project_rect, l as MemoizedGeometryProvider, n as ctm_to_container_transform, o as project_point_through_ctm, r as install_font_load_geometry_bump, s as Gestures, t as attach_dom_surface, u as Camera } from "./dom-DVxR7PNh.mjs";
+export { Camera, DEFAULT_SNAP_OPTIONS, Gestures, MemoizedGeometryProvider, attach_dom_surface, ctm_to_container_transform, install_font_load_geometry_bump, inverse_project_rect, project_delta_inverse_ctm, project_point_through_ctm };

package/dist/presets.d.mts

@@ -1,5 +1,5 @@
 import { c as SvgEditor } from "./editor-CcW4BVth.mjs";
-import { n as DomSurfaceHandle, r as DomSurfaceOptions } from "./dom-Dw2SPHgc.mjs";
+import { n as DomSurfaceHandle, r as DomSurfaceOptions } from "./dom-D-ZJO9aK.mjs";
 
 //#region src/presets/keynote.d.ts
 declare namespace keynote_d_exports {

package/dist/presets.d.ts

@@ -1,5 +1,5 @@
 import { c as SvgEditor } from "./editor-CxqRhhzP.js";
-import { n as DomSurfaceHandle, r as DomSurfaceOptions } from "./dom-CQkWJNrK.js";
+import { n as DomSurfaceHandle, r as DomSurfaceOptions } from "./dom-Dl56kUW5.js";
 
 //#region \0rolldown/runtime.js
 declare namespace keynote_d_exports {

package/dist/presets.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_model = require("./model-HEKGO-56.js");
-const require_dom = require("./dom-H4PvmPe3.js");
+const require_dom = require("./dom-Disackua.js");
 //#region src/presets/keynote.ts
 var keynote_exports = /* @__PURE__ */ require_model.__exportAll({ attach: () => attach });
 /**

package/dist/presets.mjs

@@ -1,5 +1,5 @@
 import { t as __exportAll } from "./chunk-D7D4PA-g.mjs";
-import { t as attach_dom_surface } from "./dom-BIjCxCgx.mjs";
+import { t as attach_dom_surface } from "./dom-DVxR7PNh.mjs";
 //#region src/presets/keynote.ts
 var keynote_exports = /* @__PURE__ */ __exportAll({ attach: () => attach });
 /**

package/dist/react.d.mts

@@ -1,5 +1,5 @@
 import { A as EditorState, H as Mode, J as PickEvent, K as PaintPreviewSession, Q as Providers, U as NodeId, Y as PreviewSession, c as SvgEditor, j as EditorStyle, rt as Tool, t as Commands } from "./editor-CcW4BVth.mjs";
-import { n as DomSurfaceHandle } from "./dom-Dw2SPHgc.mjs";
+import { n as DomSurfaceHandle } from "./dom-D-ZJO9aK.mjs";
 import cmath from "@grida/cmath";
 import { ReactNode } from "react";
 

package/dist/react.d.ts

@@ -1,5 +1,5 @@
 import { A as EditorState, H as Mode, J as PickEvent, K as PaintPreviewSession, Q as Providers, U as NodeId, Y as PreviewSession, c as SvgEditor, j as EditorStyle, rt as Tool, t as Commands } from "./editor-CxqRhhzP.js";
-import { n as DomSurfaceHandle } from "./dom-CQkWJNrK.js";
+import { n as DomSurfaceHandle } from "./dom-Dl56kUW5.js";
 import cmath from "@grida/cmath";
 import { ReactNode } from "react";
 

package/dist/react.js

@@ -1,7 +1,7 @@
 "use client";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_editor = require("./editor-DFvojUwn.js");
-const require_dom = require("./dom-H4PvmPe3.js");
+const require_dom = require("./dom-Disackua.js");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/react.tsx

package/dist/react.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { t as createSvgEditor } from "./editor-DCDQl18y.mjs";
-import { t as attach_dom_surface } from "./dom-BIjCxCgx.mjs";
+import { t as attach_dom_surface } from "./dom-DVxR7PNh.mjs";
 import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useSyncExternalStore } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/react.tsx

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grida/svg-editor",
-  "version": "1.0.0-alpha.22",
+  "version": "1.0.0-alpha.23",
   "description": "Headless SVG editor (experimental).",
   "keywords": [
     "bezier",
@@ -61,11 +61,11 @@
     "@grida/cmath": "0.2.3",
     "@grida/color": "0.1.0",
     "@grida/history": "0.1.2",
-    "@grida/keybinding": "0.2.1",
-    "@grida/hud": "0.2.4",
-    "@grida/svg": "0.2.0",
+    "@grida/vn": "0.1.0",
     "@grida/text-editor": "0.1.2",
-    "@grida/vn": "0.1.0"
+    "@grida/hud": "0.3.0",
+    "@grida/keybinding": "0.2.1",
+    "@grida/svg": "0.2.0"
   },
   "devDependencies": {
     "@types/react": "^19",