@grida/svg-editor 1.0.0-alpha.18 → 1.0.0-alpha.20

package/dist/{dom-DKQ4Vt3z.js → dom-CfYDV311.js}

@@ -1,4 +1,4 @@
-const require_model = require("./model-BLhMJZKJ.js");
+const require_model = require("./model-CzL6_zId.js");
 let _grida_cmath = require("@grida/cmath");
 _grida_cmath = require_model.__toESM(_grida_cmath);
 let _grida_svg_parse = require("@grida/svg/parse");
@@ -759,6 +759,35 @@ function resolve_text_exit(input) {
 	return { kind: "noop" };
 }
 //#endregion
+//#region src/selection/marquee.ts
+let marquee_selection;
+(function(_marquee_selection) {
+	function hits(boxes, rect) {
+		const touched = boxes.filter(([, box]) => _grida_cmath.default.rect.intersects(box, rect));
+		const front = touched.length - 1;
+		const out = [];
+		for (let i = 0; i < touched.length; i++) {
+			const [id, box] = touched[i];
+			if (i !== front && _grida_cmath.default.rect.contains(box, rect)) continue;
+			out.push(id);
+		}
+		return out;
+	}
+	_marquee_selection.hits = hits;
+	function resolve(boxes, rect, baseline, opts = {}) {
+		const h = hits(boxes, rect);
+		if (!opts.additive) return h;
+		const out = [...baseline];
+		const seen = new Set(baseline);
+		for (const id of h) if (!seen.has(id)) {
+			seen.add(id);
+			out.push(id);
+		}
+		return out;
+	}
+	_marquee_selection.resolve = resolve;
+})(marquee_selection || (marquee_selection = {}));
+//#endregion
 //#region src/gestures/gestures.ts
 /**
 * Sibling to `Keymap`. Owns a list of installed gesture bindings; each
@@ -995,33 +1024,68 @@ function applyDefaultGestures(gestures) {
 * Install pointer-tracking listeners on `container` and return the
 * read-side handle. The tracker is owned by the surface and disposed
 * alongside it; gesture bindings that need to consult it receive the
-* read-only `is_attended` predicate through `GestureContext`.
+* read-only `is_attended` predicate through `GestureContext`. Hosts
+* extend the scope through `handle.attention` (`dom.ts`), which fronts
+* {@link AttentionTracker.add} / {@link AttentionTracker.remove}.
 */
 function create_attention_tracker(container) {
-	let pointer_over = false;
-	const on_enter = () => {
-		pointer_over = true;
-	};
-	const on_leave = () => {
-		pointer_over = false;
+	/** Elements of the scope the pointer is currently over. Per-element
+	*  membership (not a single boolean) so crossing from the container
+	*  onto overlapping registered chrome — `leave` and `enter` firing in
+	*  either order — never reads as a gap in attention. */
+	const hovered = /* @__PURE__ */ new Set();
+	/** Registered extras → their hover-tracking teardown. */
+	const extras = /* @__PURE__ */ new Map();
+	let disposed = false;
+	/** Start hover-tracking `element`; returns the exact undo. */
+	const track = (element) => {
+		const enter = () => {
+			hovered.add(element);
+		};
+		const leave = () => {
+			hovered.delete(element);
+		};
+		element.addEventListener("pointerenter", enter);
+		element.addEventListener("pointerleave", leave);
+		return () => {
+			element.removeEventListener("pointerenter", enter);
+			element.removeEventListener("pointerleave", leave);
+			hovered.delete(element);
+		};
 	};
-	container.addEventListener("pointerenter", on_enter);
-	container.addEventListener("pointerleave", on_leave);
+	const untrack_container = track(container);
 	const is_focus_within = () => {
 		const owner = container.ownerDocument;
 		if (!owner) return false;
 		const active = owner.activeElement;
-		return !!active && active !== owner.body && container.contains(active);
+		if (!active || active === owner.body) return false;
+		if (container.contains(active)) return true;
+		for (const element of extras.keys()) if (element.contains(active)) return true;
+		return false;
 	};
 	const is_attended = () => {
-		return is_focus_within() || pointer_over;
+		return hovered.size > 0 || is_focus_within();
 	};
 	return {
 		is_attended,
 		is_focus_within,
+		add: (element) => {
+			if (disposed) return;
+			if (element === container || extras.has(element)) return;
+			extras.set(element, track(element));
+			if (typeof element.matches === "function" && element.matches(":hover")) hovered.add(element);
+		},
+		remove: (element) => {
+			const untrack = extras.get(element);
+			if (!untrack) return;
+			extras.delete(element);
+			untrack();
+		},
 		dispose: () => {
-			container.removeEventListener("pointerenter", on_enter);
-			container.removeEventListener("pointerleave", on_leave);
+			disposed = true;
+			untrack_container();
+			for (const untrack of extras.values()) untrack();
+			extras.clear();
 		}
 	};
 }
@@ -1701,7 +1765,8 @@ function attach_dom_surface(editor, options) {
 			inner.detach();
 		},
 		camera: surface.camera,
-		gestures: surface.gestures
+		gestures: surface.gestures,
+		attention: surface.attention_scope
 	};
 }
 var DomSurface = class DomSurface {
@@ -1728,7 +1793,10 @@ var DomSurface = class DomSurface {
 		this.text_edit_original = "";
 		this.pending_text_insert = null;
 		this.vector_edit = null;
+		this.point_snap_guide = void 0;
+		this.suppress_point_snap = false;
 		this.vector_edit_region_baseline = null;
+		this.scene_marquee_baseline = null;
 		this.current_tool = require_model.TOOL_CURSOR;
 		this.pending_insert = null;
 		this.editor_hover_internal = null;
@@ -1737,6 +1805,10 @@ var DomSurface = class DomSurface {
 		this.fit_on_attach = options.fit === true;
 		this.clipboard_enabled = options.clipboard !== false;
 		this.attention = create_attention_tracker(container);
+		this.attention_scope = {
+			add: (element) => this.attention.add(element),
+			remove: (element) => this.attention.remove(element)
+		};
 		this.teardown.push(() => this.attention.dispose());
 		if (process.env.NODE_ENV !== "production" && container.children.length > 0) console.warn("@grida/svg-editor: surface container is not empty at attach time. Render chrome (toolbars, layer lists, inspectors) as siblings of the container, not children — otherwise clicks on those children will silently break. See README §Surface.");
 		if (getComputedStyle(container).position === "static") container.style.position = "relative";
@@ -1944,6 +2016,8 @@ var DomSurface = class DomSurface {
 		this.editor_hover_internal = internal;
 		internal.set_content_edit_driver((id) => this.enter_content_edit(id));
 		this.teardown.push(() => internal.set_content_edit_driver(null));
+		internal.register_command("transform.nudge", (args) => this.handle_nudge_command(args));
+		this.teardown.push(() => internal.register_command("transform.nudge", require_model.default_nudge_handler(this.editor)));
 		internal.set_computed_resolver({
 			computed_property: (id, name) => {
 				this.flush_dom();
@@ -2131,6 +2205,7 @@ var DomSurface = class DomSurface {
 			this.vector_edit_region_baseline = null;
 			this.hud.setVectorSelection(null);
 		}
+		this.scene_marquee_baseline = null;
 		this.gestures._dispose();
 		this.translate_orchestrator.cancel();
 		this.resize_orchestrator.cancel();
@@ -2462,6 +2537,7 @@ var DomSurface = class DomSurface {
 		return rects.length > 0 ? { rects } : void 0;
 	}
 	compute_snap_extra() {
+		if (this.point_snap_guide) return (0, _grida_hud.snapGuideToHUDDraw)(this.point_snap_guide, this.editor.style.measurement_color);
 		const insert_guide = this.pending_insert?.phase === "drawing" ? this.pending_insert.snap_session?.last_guide : void 0;
 		if (insert_guide) return (0, _grida_hud.snapGuideToHUDDraw)(this.project_guide_to_screen(insert_guide), this.editor.style.measurement_color);
 		const guides = this.translate_orchestrator.last_guides.length > 0 ? this.translate_orchestrator.last_guides : this.resize_orchestrator.last_guides.length > 0 ? this.resize_orchestrator.last_guides : this.nudge_dwell_watcher.guides;
@@ -2549,6 +2625,10 @@ var DomSurface = class DomSurface {
 	*  was canceled. */
 	cancel_in_flight() {
 		let canceled = false;
+		if (this.scene_marquee_baseline) {
+			this.scene_marquee_baseline = null;
+			canceled = true;
+		}
 		if (this.translate_orchestrator.has_active_session()) {
 			this.translate_orchestrator.cancel();
 			canceled = true;
@@ -2564,6 +2644,7 @@ var DomSurface = class DomSurface {
 		if (this.active_preview) {
 			this.active_preview.session.discard();
 			this.active_preview = null;
+			this.point_snap_guide = void 0;
 			canceled = true;
 		}
 		if (this.pending_insert) {
@@ -3206,6 +3287,142 @@ var DomSurface = class DomSurface {
 		});
 		if (intent.phase === "commit") this.request_redraw();
 	}
+	/**
+	* Shift axis-lock for point-level drags (gridaco/grida#848) — the
+	* vertex / endpoint counterpart of whole-object translate's
+	* `axis_lock: "by_dominance"` (see `current_translate_modifiers`).
+	* Collapses the lesser axis of a local-frame delta when Shift is held,
+	* via the same cmath rule the translate pipeline's `axis_lock` stage
+	* uses; identity when Shift is up. Pull-at-consume from the HUD modifier
+	* store so a mid-drag Shift press/release reflects on the next frame.
+	*/
+	axis_lock_point_delta(dx, dy) {
+		if (!this.hud.modifiers().shift) return [dx, dy];
+		const locked = _grida_cmath.default.ext.movement.axisLockedByDominance([dx, dy]);
+		return _grida_cmath.default.ext.movement.normalize(locked);
+	}
+	/**
+	* Point-level snap (gridaco/grida#844) — the vertex / endpoint counterpart
+	* of whole-object translate's edge/center snap. Snaps a dragged point's
+	* delta so it aligns with (or lands on) a sibling point: a path's other
+	* vertices, or a `<line>`'s opposite endpoint.
+	*
+	* Runs entirely in the element's **local frame**: agents (the moving
+	* point[s]) and neighbors (the static sibling points) come straight from
+	* the path's vector network / line attributes — no projection, no separate
+	* neighbor source. The corrected delta is returned in that same local frame
+	* so the caller applies it exactly where it already applies the local drag
+	* delta. Only the snap GUIDE is projected to screen (via the element CTM)
+	* for HUD rendering.
+	*
+	* Honors the global snap toggle (`style.snap_enabled`) and threshold
+	* (`style.snap_threshold_px`, converted to local units by the CTM scale) —
+	* snap off ⇒ free point dragging, per the issue. Bypassed when
+	* `suppress_point_snap` is set (keyboard nudge). Identity when there are no
+	* neighbors / agents.
+	*
+	* The shared `SnapSession` drops 0-area rects (its empty-`<g>` "jerk to
+	* origin" defense), so each point is modeled as a sub-pixel square centered
+	* on it. Symmetric inflation cancels in the corrected delta (the engine's
+	* matched same-edge offset carries the same ±eps on both sides), so eps
+	* magnitude is immaterial as long as it stays far below the threshold.
+	*/
+	snap_local_point_delta(raw_dx, raw_dy, agents_local, neighbors_local, ctm) {
+		this.point_snap_guide = void 0;
+		const style = this.editor.style;
+		if (this.suppress_point_snap || !style.snap_enabled || agents_local.length === 0 || neighbors_local.length === 0 || raw_dx === 0 && raw_dy === 0) return [raw_dx, raw_dy];
+		const det = ctm.a * ctm.d - ctm.c * ctm.b;
+		const scale = Math.sqrt(Math.abs(det)) || 1;
+		const threshold_local = style.snap_threshold_px / scale;
+		const eps = threshold_local * 1e-6 || 1e-9;
+		const to_rect = (p) => ({
+			x: p[0] - eps / 2,
+			y: p[1] - eps / 2,
+			width: eps,
+			height: eps
+		});
+		const session = new SnapSession({
+			agents: agents_local.map(to_rect),
+			neighbors: neighbors_local.map(to_rect)
+		});
+		const { delta, guide } = session.snap({
+			x: raw_dx,
+			y: raw_dy
+		}, {
+			enabled: true,
+			threshold_px: threshold_local
+		});
+		session.dispose();
+		if (guide) this.point_snap_guide = this.project_local_guide_to_screen(guide, ctm, this.container_offset());
+		return [delta.x, delta.y];
+	}
+	/** Split a path's baseline vertices into the snap agents (the moving
+	*  sub-selection) and neighbors (everything else) for
+	*  {@link snap_local_point_delta}. Both in path-local space. */
+	vertex_snap_points(model, moving) {
+		const verts = model.snapshot().vertices;
+		const moving_set = new Set(moving);
+		const agents = [];
+		const neighbors = [];
+		for (let i = 0; i < verts.length; i++) (moving_set.has(i) ? agents : neighbors).push(verts[i]);
+		return {
+			agents,
+			neighbors
+		};
+	}
+	/** Project a point-snap guide from an element's local frame to screen
+	*  CSS-px (the HUD canvas's identity coordinate system), via the element
+	*  CTM + container offset — the same projection `vector_of` uses for
+	*  vertex chrome. The local-frame analog of `project_guide_to_screen`
+	*  (which projects world-space orchestrator guides via the camera). */
+	project_local_guide_to_screen(g, ctm, container_offset) {
+		return {
+			lines: g.lines.map((l) => {
+				const [x1, y1] = project_point_through_ctm(l.x1, l.y1, ctm, container_offset);
+				const [x2, y2] = project_point_through_ctm(l.x2, l.y2, ctm, container_offset);
+				return {
+					...l,
+					x1,
+					y1,
+					x2,
+					y2
+				};
+			}),
+			points: g.points.map(([x, y]) => project_point_through_ctm(x, y, ctm, container_offset)),
+			rules: g.rules.map(([axis, value]) => {
+				const [px, py] = project_point_through_ctm(axis === "x" ? value : 0, axis === "x" ? 0 : value, ctm, container_offset);
+				return [axis, axis === "x" ? px : py];
+			})
+		};
+	}
+	/** Translation from screen/page CSS-px to the HUD's container-identity
+	*  space: subtract the container's page offset, add its scroll. Used at
+	*  every `getScreenCTM` projection boundary (chrome, marquee, point snap)
+	*  so they share one definition of "where the container's origin is". */
+	container_offset() {
+		const cr = this.container.getBoundingClientRect();
+		return [-cr.left + this.container.scrollLeft, -cr.top + this.container.scrollTop];
+	}
+	/**
+	* Local-frame drag delta for a vertex sub-selection, from the HUD's
+	* container-space `dx/dy`. Inverse-projects through the element CTM (so a
+	* path under a scaled `<g>` / nested viewport tracks the cursor 1:1) then
+	* point-snaps to the path's other vertices (#844) — before axis-lock, so
+	* the lock keeps final say on a constrained axis. Identity when the element
+	* has no usable CTM. A tangent-only drag (empty `indices`) yields no snap
+	* agents, so snap is a no-op. Shared by the two vertex-translate handlers;
+	* the caller applies axis-lock and feeds the result to `translateVertices`.
+	*/
+	vertex_drag_local_delta(node_id, baseline_model, indices, dx, dy) {
+		const el = this.element_index.get(node_id);
+		const ctm = el instanceof SVGGraphicsElement && typeof el.getScreenCTM === "function" ? el.getScreenCTM() : null;
+		if (!ctm) return [dx, dy];
+		let local_dx = dx;
+		let local_dy = dy;
+		if (ctm.a * ctm.d - ctm.c * ctm.b !== 0) [local_dx, local_dy] = project_delta_inverse_ctm(dx, dy, ctm);
+		const { agents, neighbors } = this.vertex_snap_points(baseline_model, indices);
+		return this.snap_local_point_delta(local_dx, local_dy, agents, neighbors, ctm);
+	}
 	/** Snapshot of HUD modifier state mapped to the orchestrator's `GestureModifiers`.
 	*  Pull-at-consume: HUD is the canonical store (see `sync_modifiers`),
 	*  read live so mid-drag Shift press/release reflects on the next pass. */
@@ -3312,13 +3529,26 @@ var DomSurface = class DomSurface {
 		if (!pos_own) return;
 		const target_x = pos_own.x;
 		const target_y = pos_own.y;
+		const base_x = endpoint === "p1" ? initial.x1 : initial.x2;
+		const base_y = endpoint === "p1" ? initial.y1 : initial.y2;
+		let dx = target_x - base_x;
+		let dy = target_y - base_y;
+		const el = this.element_index.get(id);
+		const ctm = el instanceof SVGGraphicsElement && typeof el.getScreenCTM === "function" ? el.getScreenCTM() : null;
+		if (ctm) {
+			const other = endpoint === "p1" ? [initial.x2, initial.y2] : [initial.x1, initial.y1];
+			[dx, dy] = this.snap_local_point_delta(dx, dy, [[base_x, base_y]], [other], ctm);
+		}
+		const [locked_dx, locked_dy] = this.axis_lock_point_delta(dx, dy);
+		const final_x = base_x + locked_dx;
+		const final_y = base_y + locked_dy;
 		const apply = () => {
 			if (endpoint === "p1") {
-				doc.set_attr(id, "x1", String(target_x));
-				doc.set_attr(id, "y1", String(target_y));
+				doc.set_attr(id, "x1", String(final_x));
+				doc.set_attr(id, "y1", String(final_y));
 			} else {
-				doc.set_attr(id, "x2", String(target_x));
-				doc.set_attr(id, "y2", String(target_y));
+				doc.set_attr(id, "x2", String(final_x));
+				doc.set_attr(id, "y2", String(final_y));
 			}
 			emit();
 		};
@@ -3335,6 +3565,7 @@ var DomSurface = class DomSurface {
 			revert
 		});
 		if (intent.phase === "commit") {
+			this.point_snap_guide = void 0;
 			this.active_preview.session.commit();
 			this.active_preview = null;
 		}
@@ -3382,19 +3613,33 @@ var DomSurface = class DomSurface {
 			this.handle_marquee_vectors(intent);
 			return;
 		}
-		if (intent.phase !== "commit") return;
-		const ids = [];
-		for (const id of this.element_index.keys()) {
-			if (id === this.editor.tree().root) continue;
-			const box = this.container_box(id);
-			if (!box) continue;
-			if (_grida_cmath.default.rect.intersects(box, intent.rect)) ids.push(id);
-		}
-		if (ids.length === 0) {
-			if (!intent.additive) this.editor.commands.deselect();
-			return;
+		if (!this.scene_marquee_baseline) {
+			const cr = this.container.getBoundingClientRect();
+			const root = this.editor.tree().root;
+			const boxes = [];
+			for (const id of this._ensure_z_order(false, root)) {
+				const box = this.container_box(id, cr);
+				if (box) boxes.push([id, box]);
+			}
+			this.scene_marquee_baseline = {
+				boxes,
+				selection: this.editor.state.selection
+			};
 		}
-		this.editor.commands.select(ids, { mode: intent.additive ? "add" : "replace" });
+		const next = this.resolve_scene_marquee(intent.rect, intent.additive);
+		this.editor.commands.select(next, { mode: "replace" });
+		if (intent.phase === "commit") this.scene_marquee_baseline = null;
+	}
+	/** Resolve the scene marquee selection for one frame from the frozen,
+	*  paint-ordered box snapshot. The rule (shadow + additive) lives in the
+	*  headless `marquee_selection` policy (`src/selection/marquee.ts`, spec
+	*  `docs/marquee-selection.md`); the surface only supplies the boxes and
+	*  the gesture-start baseline. Selection is deterministic in (marquee rect,
+	*  gesture-start selection, shift) — meta is a gesture-routing modifier
+	*  only (it decides that a drag IS a marquee), not a resolution input. */
+	resolve_scene_marquee(rect, additive) {
+		const { boxes, selection } = this.scene_marquee_baseline;
+		return marquee_selection.resolve(boxes, rect, selection, { additive });
 	}
 	/**
 	* Vector marquee predicate — applies the **vertex-priority precedence
@@ -3425,8 +3670,7 @@ var DomSurface = class DomSurface {
 		if (typeof el.getScreenCTM !== "function") return;
 		const ctm = el.getScreenCTM();
 		if (!ctm) return;
-		const cr = this.container.getBoundingClientRect();
-		const offset = [-cr.left + this.container.scrollLeft, -cr.top + this.container.scrollTop];
+		const offset = this.container_offset();
 		const model = this.session_model();
 		if (!model) return;
 		const rect = intent.rect;
@@ -3489,8 +3733,7 @@ var DomSurface = class DomSurface {
 		if (typeof el.getScreenCTM !== "function") return;
 		const ctm = el.getScreenCTM();
 		if (!ctm) return;
-		const cr = this.container.getBoundingClientRect();
-		const offset = [-cr.left + this.container.scrollLeft, -cr.top + this.container.scrollTop];
+		const offset = this.container_offset();
 		const model = this.session_model();
 		if (!model) return;
 		const polygon = intent.polygon;
@@ -3795,8 +4038,7 @@ var DomSurface = class DomSurface {
 		if (typeof el.getScreenCTM !== "function") return null;
 		const ctm = el.getScreenCTM();
 		if (!ctm) return null;
-		const cr = this.container.getBoundingClientRect();
-		const offset = [-cr.left + this.container.scrollLeft, -cr.top + this.container.scrollTop];
+		const offset = this.container_offset();
 		return {
 			vertices: Array.from({ length: snap.vertices.length }, (_, i) => {
 				const v = snap.vertices[i];
@@ -4044,19 +4286,13 @@ var DomSurface = class DomSurface {
 		}
 		const baseline_d = this.active_preview.initial_d;
 		const indices = this.active_preview.indices;
-		let local_dx = intent.dx;
-		let local_dy = intent.dy;
-		const el = this.element_index.get(node_id);
-		if (el instanceof SVGGraphicsElement && typeof el.getScreenCTM === "function") {
-			const ctm = el.getScreenCTM();
-			if (ctm) {
-				if (ctm.a * ctm.d - ctm.c * ctm.b !== 0) [local_dx, local_dy] = project_delta_inverse_ctm(intent.dx, intent.dy, ctm);
-			}
-		}
+		let [local_dx, local_dy] = this.vertex_drag_local_delta(node_id, this.active_preview.baseline_model, indices, intent.dx, intent.dy);
+		[local_dx, local_dy] = this.axis_lock_point_delta(local_dx, local_dy);
 		const preview_model = this.active_preview.baseline_model.translateVertices(indices, [local_dx, local_dy]);
 		const target_d = preview_model.toSvgPathD();
 		this.active_preview.preview_model = preview_model;
 		if (intent.phase === "commit") {
+			this.point_snap_guide = void 0;
 			const before_selection = this.active_preview.before_selection;
 			const after_selection = this.vector_edit.snapshot_selection();
 			this.active_preview.session.set(this.vector_geometry_step(node_id, target_d, baseline_d, this.active_preview.promo, after_selection, before_selection));
@@ -4143,15 +4379,8 @@ var DomSurface = class DomSurface {
 			};
 		}
 		const baseline_d = this.active_preview.initial_d;
-		let local_dx = intent.dx;
-		let local_dy = intent.dy;
-		const el = this.element_index.get(node_id);
-		if (el instanceof SVGGraphicsElement && typeof el.getScreenCTM === "function") {
-			const ctm = el.getScreenCTM();
-			if (ctm) {
-				if (ctm.a * ctm.d - ctm.c * ctm.b !== 0) [local_dx, local_dy] = project_delta_inverse_ctm(intent.dx, intent.dy, ctm);
-			}
-		}
+		let [local_dx, local_dy] = this.vertex_drag_local_delta(node_id, this.active_preview.baseline_model, indices, intent.dx, intent.dy);
+		[local_dx, local_dy] = this.axis_lock_point_delta(local_dx, local_dy);
 		const baseline_model = this.active_preview.baseline_model;
 		const baseline_tangent_abs = this.active_preview.baseline_tangent_abs;
 		let preview_model = indices.length > 0 ? baseline_model.translateVertices(indices, [local_dx, local_dy]) : baseline_model;
@@ -4163,6 +4392,7 @@ var DomSurface = class DomSurface {
 		const target_d = preview_model.toSvgPathD();
 		this.active_preview.preview_model = preview_model;
 		if (intent.phase === "commit") {
+			this.point_snap_guide = void 0;
 			const before_selection = this.active_preview.before_selection;
 			const after_selection = this.vector_edit.snapshot_selection();
 			this.active_preview.session.set(this.vector_geometry_step(node_id, target_d, baseline_d, this.active_preview.promo, after_selection, before_selection));
@@ -4170,6 +4400,63 @@ var DomSurface = class DomSurface {
 			this.active_preview = null;
 		} else this.active_preview.session.set(this.vector_geometry_step(node_id, target_d, baseline_d, this.active_preview.promo, null, null));
 	}
+	/**
+	* Surface-aware `transform.nudge` handler — registered over the headless
+	* default on attach (gridaco/grida#849). In vector content-edit, arrow
+	* keys nudge the path sub-selection (the keyboard counterpart of
+	* dragging vertices / segments / tangents) rather than leaking to a
+	* whole-element move (the bug). This mirrors text-edit, where the inline
+	* editor owns the arrow keys. Outside content-edit it delegates to the
+	* headless `default_nudge_handler` (whole-element nudge) — the same
+	* handler the registry restores on detach, so the override and the
+	* default can never drift.
+	*
+	* While a vector session is open the arrows are OWNED by it: an empty
+	* sub-selection is a consumed no-op, never a whole-element nudge — same
+	* "content-edit captures arrows" contract as text-edit.
+	*/
+	handle_nudge_command(args) {
+		const { dx, dy } = args;
+		if (this.editor.state.mode === "edit-content" && this.vector_edit) {
+			this.nudge_vector_selection(dx, dy);
+			return true;
+		}
+		return require_model.default_nudge_handler(this.editor)(args) === true;
+	}
+	/**
+	* Discrete keyboard nudge of the vector sub-selection. Reuses the drag
+	* path ({@link handle_translate_vector_selection}) by synthesizing a
+	* single commit-phase intent, so a nudge is byte-identical to a one-step
+	* drag of the same points: same union resolution (selected vertices ∪
+	* selected-segment endpoints ∪ tangents), same parent-vertex tangent
+	* exclusion, same history bracket + sub-selection capture.
+	*
+	* `dx`/`dy` arrive in world units (1px, or 10px with Shift — already
+	* resolved by the keymap binding). `handle_translate_vector_selection`
+	* expects container CSS-px (it projects back through the inverse
+	* screen-CTM), so scale by the camera zoom on the way in; the projection
+	* recovers the world delta in the path's local frame. A no-sub-selection
+	* session resolves to a no-op inside the handler.
+	*/
+	nudge_vector_selection(dx, dy) {
+		const ses = this.vector_edit;
+		if (!ses) return;
+		const zoom = this.camera.zoom || 1;
+		this.suppress_point_snap = true;
+		try {
+			this.handle_translate_vector_selection({
+				kind: "translate_vector_selection",
+				node_id: ses.node_id,
+				additional_vertex_indices: [],
+				dx: dx * zoom,
+				dy: dy * zoom,
+				phase: "commit"
+			});
+		} finally {
+			this.suppress_point_snap = false;
+		}
+		this.request_redraw();
+	}
 	/** Mirror handler for `select_tangent` (analogous to `select_vertex`). */
 	handle_select_tangent(intent) {
 		if (!this.vector_edit || this.vector_edit.node_id !== intent.node_id) return;