@pixerate/editor 0.33.0 → 0.34.0

package/dist/vector/index.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class;
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class; var _class2;
 
 var _chunkQKLRAA4Tcjs = require('../chunk-QKLRAA4T.cjs');
 
@@ -15,7 +15,9 @@ var _chunkQKLRAA4Tcjs = require('../chunk-QKLRAA4T.cjs');
 
 
 
-var _chunkM4XE4UMTcjs = require('../chunk-M4XE4UMT.cjs');
+
+
+var _chunkUG5DVXJKcjs = require('../chunk-UG5DVXJK.cjs');
 
 // src/vector/types.ts
 var VECTOR_TOOLS = ["select", "direct", "pen", "pencil", "rect", "ellipse", "polygon", "star", "line"];
@@ -82,7 +84,7 @@ function vectorNodeToBezier(node) {
 }
 function vectorPathData(input, precision = 3) {
   const subpaths = Array.isArray(input) ? input : input.subpaths;
-  return _chunkM4XE4UMTcjs.bezierPathToSvg.call(void 0, subpathsToBezier(subpaths), { precision });
+  return _chunkUG5DVXJKcjs.bezierPathToSvg.call(void 0, subpathsToBezier(subpaths), { precision });
 }
 function inferAnchorType(a) {
   if (isOnAnchor(a, a.in) || isOnAnchor(a, a.out)) return "corner";
@@ -98,7 +100,7 @@ function inferAnchorType(a) {
   return Math.abs(li - lo) <= 1e-3 * Math.max(li, lo) ? "symmetric" : "smooth";
 }
 function bezierToSubpaths(input) {
-  const path = _chunkM4XE4UMTcjs.toBezierPath.call(void 0, input);
+  const path = _chunkUG5DVXJKcjs.toBezierPath.call(void 0, input);
   const out = [];
   let current = null;
   const last = () => current.anchors[current.anchors.length - 1];
@@ -195,14 +197,14 @@ function nodeMatrix(node) {
 function vectorPathWorldBezier(node, parent = IDENTITY_MATRIX) {
   const m = multiplyMatrices(nodeMatrix(node), parent);
   const path = subpathsToBezier(node.subpaths);
-  return isIdentityMatrix(m) ? path : _chunkM4XE4UMTcjs.transformBezierPath.call(void 0, path, m);
+  return isIdentityMatrix(m) ? path : _chunkUG5DVXJKcjs.transformBezierPath.call(void 0, path, m);
 }
 function vectorNodeBounds(node, parent = IDENTITY_MATRIX) {
   if (node.type === "group") {
     const m = multiplyMatrices(nodeMatrix(node), parent);
     return unionBounds(node.children.map((c) => vectorNodeBounds(c, m)));
   }
-  const b = _chunkM4XE4UMTcjs.bezierPathBounds.call(void 0, vectorPathWorldBezier(node, parent));
+  const b = _chunkUG5DVXJKcjs.bezierPathBounds.call(void 0, vectorPathWorldBezier(node, parent));
   if (!b) return null;
   return { x: b.minX, y: b.minY, width: b.maxX - b.minX, height: b.maxY - b.minY };
 }
@@ -236,9 +238,9 @@ function hitTestVectorNode(node, p, tolerance = 0, parent = IDENTITY_MATRIX) {
   const path = vectorPathWorldBezier(node, parent);
   if (path.length === 0) return false;
   const point = [p.x, p.y];
-  if (hasPaint(node.fill) && _chunkM4XE4UMTcjs.pointInBezierPath.call(void 0, path, point, _nullishCoalesce(node.fillRule, () => ( "nonzero")))) return true;
+  if (hasPaint(node.fill) && _chunkUG5DVXJKcjs.pointInBezierPath.call(void 0, path, point, _nullishCoalesce(node.fillRule, () => ( "nonzero")))) return true;
   const reach = (hasPaint(node.stroke) ? (_nullishCoalesce(node.strokeWidth, () => ( 1))) / 2 : 0) + tolerance;
-  return _chunkM4XE4UMTcjs.distanceToBezierPath.call(void 0, path, point) <= reach;
+  return _chunkUG5DVXJKcjs.distanceToBezierPath.call(void 0, path, point) <= reach;
 }
 function hitTestVectorNodes(nodes, p, tolerance = 0) {
   for (let i = nodes.length - 1; i >= 0; i--) {
@@ -254,9 +256,9 @@ function nearestSegment(node, p) {
     const count = subpathSegmentCount(sp);
     for (let i = 0; i < count; i++) {
       const seg = subpathSegment(sp, i);
-      const hit = _chunkM4XE4UMTcjs.segmentNearest.call(void 0, seg, [p.x, p.y]);
+      const hit = _chunkUG5DVXJKcjs.segmentNearest.call(void 0, seg, [p.x, p.y]);
       if (!best || hit.distance < best.distance) {
-        const pt = _chunkM4XE4UMTcjs.segmentPoint.call(void 0, seg, hit.t);
+        const pt = _chunkUG5DVXJKcjs.segmentPoint.call(void 0, seg, hit.t);
         best = { subpath: s, segment: i, t: hit.t, point: { x: pt[0], y: pt[1] }, distance: hit.distance };
       }
     }
@@ -427,7 +429,7 @@ function insertAnchor(sp, segment, t) {
   const ia = segment;
   const ib = (segment + 1) % n;
   const seg = subpathSegment(sp, segment);
-  const [left, right] = _chunkM4XE4UMTcjs.splitSegment.call(void 0, seg, t);
+  const [left, right] = _chunkUG5DVXJKcjs.splitSegment.call(void 0, seg, t);
   const mid = left[left.length - 1];
   const anchor = { x: mid[0], y: mid[1] };
   if (seg.length === 4) {
@@ -535,7 +537,7 @@ var escapeAttr = (value) => value.replace(/&/g, "&amp;").replace(/"/g, "&quot;")
 function vectorPaintToSvg(paint, gradientId) {
   if (!hasPaint(paint)) return { value: "none", gradient: null };
   if (typeof paint === "string") return { value: paint, gradient: null };
-  return { value: `url(#${gradientId})`, gradient: _chunkM4XE4UMTcjs.gradientToSvgDef.call(void 0, paint, gradientId) };
+  return { value: `url(#${gradientId})`, gradient: _chunkUG5DVXJKcjs.gradientToSvgDef.call(void 0, paint, gradientId) };
 }
 function gradientMarkup(def) {
   const tag = def.type === "radial" ? "radialGradient" : "linearGradient";
@@ -549,11 +551,11 @@ function vectorDocumentToSvg(doc, options = {}) {
   const pretty = options.pretty !== false;
   const defs = [];
   const lines = [];
-  const num = (n) => _chunkM4XE4UMTcjs.formatNumber.call(void 0, n, precision);
+  const num = (n) => _chunkUG5DVXJKcjs.formatNumber.call(void 0, n, precision);
   const indent = (depth) => pretty ? "  ".repeat(depth) : "";
   const common = (node) => {
     let out2 = ` id="${escapeAttr(node.id)}"`;
-    if (node.transform) out2 += ` transform="matrix(${node.transform.map((n) => _chunkM4XE4UMTcjs.formatNumber.call(void 0, n, 6)).join(" ")})"`;
+    if (node.transform) out2 += ` transform="matrix(${node.transform.map((n) => _chunkUG5DVXJKcjs.formatNumber.call(void 0, n, 6)).join(" ")})"`;
     if (node.opacity !== void 0 && node.opacity < 1) out2 += ` opacity="${num(node.opacity)}"`;
     if (node.visible === false) out2 += ` display="none"`;
     return out2;
@@ -850,7 +852,759 @@ function parseVectorSvg(svg, options = {}) {
   return { width, height, nodes };
 }
 
+// src/vector/snap.ts
+var VECTOR_CONSTRUCTION_ANGLES = [0, 45, 90, 135];
+function constrainToLeave(leave, p) {
+  if (!_optionalChain([leave, 'optionalAccess', _8 => _8.constrain])) return p;
+  const dx = p.x - leave.at.x;
+  const dy = p.y - leave.at.y;
+  switch (leave.constrain) {
+    case "axis":
+      return Math.abs(dx) > Math.abs(dy) ? { x: p.x, y: leave.at.y } : { x: leave.at.x, y: p.y };
+    case "square": {
+      const s = Math.max(Math.abs(dx), Math.abs(dy));
+      return { x: leave.at.x + Math.sign(dx || 1) * s, y: leave.at.y + Math.sign(dy || 1) * s };
+    }
+    default: {
+      const len = Math.hypot(dx, dy);
+      const a = Math.round(Math.atan2(dy, dx) / (Math.PI / 4)) * (Math.PI / 4);
+      return { x: leave.at.x + Math.cos(a) * len, y: leave.at.y + Math.sin(a) * len };
+    }
+  }
+}
+var BUDGET = 2e4;
+var CROSSING_PAIRS = 32;
+var CURVE_SAMPLES = 48;
+var BISECT = 50;
+var EQUAL = 1e-6;
+function bound(sorted, key, v, strict) {
+  let lo = 0;
+  let hi = sorted.length;
+  while (lo < hi) {
+    const mid = lo + hi >>> 1;
+    const k = key(sorted[mid]);
+    if (strict ? k <= v : k < v) lo = mid + 1;
+    else hi = mid;
+  }
+  return lo;
+}
+function within(sorted, key, v, tol) {
+  return sorted.slice(bound(sorted, key, v - tol, false), bound(sorted, key, v + tol, true));
+}
+var linesNear = (lines, v, tol) => within(lines, (l) => l.v, v, tol);
+var distance = (a, b) => Math.hypot(a.x - b.x, a.y - b.y);
+var toPoint = (p) => [p.x, p.y];
+var toVec = (p) => ({ x: p[0], y: p[1] });
+var LABELS = {
+  anchor: "anchor",
+  centre: "centre",
+  intersect: "intersect",
+  perpendicular: "perpendicular",
+  tangent: "tangent",
+  path: "path",
+  construction: "angle",
+  align: "align",
+  spacing: "spacing",
+  size: "size"
+};
+var fmtLength = (n) => String(Math.round(n * 100) / 100);
+function nodeFrame(node, parent, aabb) {
+  const angle = matrixRotation(multiplyMatrices(nodeMatrix(node), parent));
+  const b = angle ? vectorNodeBounds(node, multiplyMatrices(parent, rotateMatrix(-angle))) : aabb !== void 0 ? aabb : vectorNodeBounds(node, parent);
+  if (!b) return null;
+  const c = { x: b.x + b.width / 2, y: b.y + b.height / 2 };
+  return { width: b.width, height: b.height, centre: angle ? applyMatrix(rotateMatrix(angle), c) : c };
+}
+function contains(node, ids) {
+  if (ids.has(node.id)) return true;
+  return node.type === "group" && node.children.some((c) => contains(c, ids));
+}
+var VectorSnapTargets = (_class = class _VectorSnapTargets {
+  __init() {this.points = []}
+  __init2() {this.xs = []}
+  __init3() {this.ys = []}
+  __init4() {this.segments = []}
+  /** Bounds of the objects a moved box spaces itself evenly with. */
+  __init5() {this.boxes = []}
+  /** Side lengths of the other objects (in their own frames), which a resize may match. */
+  __init6() {this.sizes = []}
+  constructor() {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);_class.prototype.__init5.call(this);_class.prototype.__init6.call(this);
+  }
+  /** How many targets of each sort were gathered. */
+  get counts() {
+    return { points: this.points.length, lines: this.xs.length + this.ys.length, segments: this.segments.length, boxes: this.boxes.length };
+  }
+  /** Targets for moving nodes `ids`: the other art's anchors, bounds and centres, the artboard, and boxes to space evenly with. */
+  static forMove(doc, ids) {
+    return _VectorSnapTargets.collect(doc, new Set(ids), "bounds");
+  }
+  /** Targets for resizing nodes `ids`: as for a move, plus the other objects' sizes. */
+  static forResize(doc, ids) {
+    return _VectorSnapTargets.collect(doc, new Set(ids), "bounds");
+  }
+  /**
+   * Targets for a drawn point (pen, shape tools): the art but `exclude`, its anchors (as
+   * points and in line), centres, edges and segments. The anchors and segments of `exclude`
+   * (the path being drawn, whose bounds grow with it) stay targets.
+   */
+  static forDrawing(doc, exclude = []) {
+    const skip = new Set(exclude);
+    const t = _VectorSnapTargets.collect(doc, skip, "drawing", false);
+    t.pushPaths(doc, skip, () => false, true);
+    return t.index();
+  }
+  /**
+   * Targets for dragging anchors: the other art with its segments, and the anchors and
+   * segments that stay put on the paths being reshaped (their bounds move along, so they are
+   * no targets). The moving anchors are left out.
+   */
+  static forAnchorDrag(doc, anchors) {
+    const moving = /* @__PURE__ */ new Map();
+    for (const r of anchors) {
+      const set = _nullishCoalesce(moving.get(r.nodeId), () => ( /* @__PURE__ */ new Set()));
+      set.add(`${r.subpath}:${r.index}`);
+      moving.set(r.nodeId, set);
+    }
+    const t = _VectorSnapTargets.collect(doc, new Set(moving.keys()), "segments", false);
+    t.pushPaths(doc, new Set(moving.keys()), (id, s, i) => !!_optionalChain([moving, 'access', _9 => _9.get, 'call', _10 => _10(id), 'optionalAccess', _11 => _11.has, 'call', _12 => _12(`${s}:${i}`)]), true);
+    return t.index();
+  }
+  /**
+   * Targets for dragging a handle of path `nodeId`: the other art and that path's anchors
+   * (its bounds and the segments through the handle move with it, so they would chase it).
+   */
+  static forHandle(doc, nodeId) {
+    const skip = /* @__PURE__ */ new Set([nodeId]);
+    const t = _VectorSnapTargets.collect(doc, skip, "bounds", false);
+    t.pushPaths(doc, skip, () => false, false);
+    return t.index();
+  }
+  /** The anchors of the paths `ids` as targets (on them and in line), and their segments when `segments`. */
+  pushPaths(doc, ids, moving, segments) {
+    let anchors = BUDGET;
+    let segmentBudget = segments ? BUDGET : 0;
+    const visit = (list, parent) => {
+      for (const n of list) {
+        const m = multiplyMatrices(nodeMatrix(n), parent);
+        if (n.type === "group") visit(n.children, m);
+        else if (ids.has(n.id) && n.visible !== false) {
+          n.subpaths.forEach((sp, s) => {
+            sp.anchors.forEach((a, i) => {
+              if (anchors <= 0 || moving(n.id, s, i)) return;
+              this.pushAnchor(applyMatrix(m, a));
+              anchors--;
+            });
+            segmentBudget = this.pushSegments(sp, m, (i) => moving(n.id, s, i), segmentBudget);
+          });
+        }
+      }
+    };
+    visit(doc.nodes, IDENTITY_MATRIX);
+  }
+  pushAnchor(p) {
+    this.points.push({ p, kind: "anchor" });
+    this.xs.push({ v: p.x, from: p, kind: "anchor" });
+    this.ys.push({ v: p.y, from: p, kind: "anchor" });
+  }
+  /** The segments of `sp` (mapped by `m`) that stay put while the anchors `moving` accepts move. */
+  pushSegments(sp, m, moving, budget) {
+    const n = sp.anchors.length;
+    const count = subpathSegmentCount(sp);
+    for (let i = 0; i < count && budget > 0; i++) {
+      if (moving(i) || moving((i + 1) % n)) continue;
+      const seg = subpathSegment(sp, i).map((q) => toPoint(applyMatrix(m, toVec(q))));
+      let minX = Infinity;
+      let minY = Infinity;
+      let maxX = -Infinity;
+      let maxY = -Infinity;
+      for (const [x, y] of seg) {
+        minX = Math.min(minX, x);
+        minY = Math.min(minY, y);
+        maxX = Math.max(maxX, x);
+        maxY = Math.max(maxY, y);
+      }
+      this.segments.push({ seg, minX, minY, maxX, maxY });
+      budget--;
+    }
+    return budget;
+  }
+  pushRect(r, kind, centre) {
+    const corners = [
+      { x: r.x, y: r.y },
+      { x: r.x + r.width, y: r.y },
+      { x: r.x + r.width, y: r.y + r.height },
+      { x: r.x, y: r.y + r.height }
+    ];
+    for (const p of corners) {
+      this.xs.push({ v: p.x, from: p, kind });
+      this.ys.push({ v: p.y, from: p, kind });
+    }
+    if (centre) {
+      this.points.push({ p: centre, kind: "centre" });
+      this.xs.push({ v: centre.x, from: centre, kind: "centre" });
+      this.ys.push({ v: centre.y, from: centre, kind: "centre" });
+    }
+  }
+  /** Sorts the targets for `within` (stable: of targets alike, the first gathered wins). */
+  index() {
+    this.points.sort((a, b) => a.p.x - b.p.x);
+    this.xs.sort((a, b) => a.v - b.v);
+    this.ys.sort((a, b) => a.v - b.v);
+    return this;
+  }
+  /**
+   * Gathers targets from the artboard and every visible node but `exclude` (and what is inside
+   * those): each leaf's anchors (also as lines for `drawing`), its segments (`segments`,
+   * `drawing`), its bounds' corners as lines and its centre; and the top-level objects' boxes and
+   * sizes (inside a group holding an excluded node, that group's other members).
+   */
+  static collect(doc, exclude, gather, sort = true) {
+    const self = new _VectorSnapTargets();
+    const artboard = { x: 0, y: 0, width: doc.width, height: doc.height };
+    self.pushRect(artboard, "artboard", { x: doc.width / 2, y: doc.height / 2 });
+    let anchors = BUDGET;
+    let segments = BUDGET;
+    const visit = (list, parent) => {
+      for (const n of list) {
+        if (exclude.has(n.id) || n.visible === false) continue;
+        const m = multiplyMatrices(nodeMatrix(n), parent);
+        if (n.type === "group") {
+          visit(n.children, m);
+          continue;
+        }
+        if (anchors <= 0) continue;
+        for (const sp of n.subpaths) {
+          for (const a of sp.anchors) {
+            if (anchors-- <= 0) break;
+            const p = applyMatrix(m, a);
+            if (gather === "drawing") self.pushAnchor(p);
+            else self.points.push({ p, kind: "anchor" });
+          }
+          if (gather !== "bounds") segments = self.pushSegments(sp, m, () => false, segments);
+        }
+        const b = vectorNodeBounds(n, parent);
+        const f = nodeFrame(n, parent, b);
+        if (b) self.pushRect(b, "edge", _nullishCoalesce(_optionalChain([f, 'optionalAccess', _13 => _13.centre]), () => ( null)));
+      }
+    };
+    visit(doc.nodes, IDENTITY_MATRIX);
+    const objects = (list, parent) => {
+      for (const n of list) {
+        if (exclude.has(n.id) || n.visible === false || self.boxes.length >= BUDGET) continue;
+        if (n.type === "group" && contains(n, exclude)) {
+          objects(n.children, multiplyMatrices(nodeMatrix(n), parent));
+          continue;
+        }
+        const b = vectorNodeBounds(n, parent);
+        if (b) self.boxes.push(b);
+        const f = nodeFrame(n, parent, b);
+        if (f) self.sizes.push(f.width, f.height);
+      }
+    };
+    objects(doc.nodes, IDENTITY_MATRIX);
+    return sort ? self.index() : self;
+  }
+  // -------------------------------------------------------------------------
+  // Points
+  // -------------------------------------------------------------------------
+  /** Snaps a single point (see `snapFrom`). */
+  snapPoint(p, tol) {
+    return this.snapFrom(p, null, tol);
+  }
+  /**
+   * Snaps a point `p`, drawn or dragged from `leave` when given. With `leave.constrain` it keeps
+   * to its angle round `leave.at`, sliding along that way into line with the nearest target.
+   * Otherwise it lands, in order, on an anchor or centre, an intersection of two paths, the
+   * perpendicular foot or a tangent point from `leave.at`, a path, a construction guide
+   * through `leave.at` (where a target's line crosses it if one does nearby), or else lines up
+   * with targets on x and y.
+   */
+  snapFrom(p, leave, tol) {
+    const none = (q) => ({ point: q, kind: null, x: false, y: false, lines: [], labels: [] });
+    const at = (q, kind, lines2 = []) => ({
+      point: q,
+      kind,
+      x: true,
+      y: true,
+      lines: lines2,
+      labels: [this.label(q, kind)]
+    });
+    if (_optionalChain([leave, 'optionalAccess', _14 => _14.constrain])) {
+      const q = constrainToLeave(leave, p);
+      const hit = this.slide(leave.at, { x: q.x - leave.at.x, y: q.y - leave.at.y }, q, tol, true);
+      return hit ? { point: hit.point, x: true, y: true, ...this.linedUp(hit.point, hit.from) } : none(q);
+    }
+    const point = this.nearestPoint(p, tol);
+    if (point) return at(point.p, point.kind);
+    const near = this.segmentsNear(p, tol);
+    const crossing = this.crossing(near, p, tol);
+    if (crossing) return at(crossing, "intersect");
+    if (leave && leave.curves !== false) {
+      const foot = this.curvePoint(near, leave.at, p, tol);
+      if (foot) return at(foot.point, foot.kind, [line("construction", leave.at, foot.point)]);
+    }
+    const on = this.onSegment(near);
+    if (on) return at(on, "path");
+    if (_optionalChain([leave, 'optionalAccess', _15 => _15.angles, 'optionalAccess', _16 => _16.length])) {
+      const c = construction(leave, p, tol);
+      if (c) {
+        const hit = this.slide(leave.at, c.dir, c.point, tol, false);
+        if (hit) {
+          const lined = this.linedUp(hit.point, hit.from);
+          return { point: hit.point, x: true, y: true, kind: lined.kind, lines: [line("construction", leave.at, hit.point), ...lined.lines], labels: lined.labels };
+        }
+        return { point: c.point, kind: "construction", x: true, y: true, lines: [line("construction", leave.at, c.point)], labels: [] };
+      }
+    }
+    const nearest = (lines2, v) => {
+      let best = null;
+      for (const l of linesNear(lines2, v, tol)) if (!best || Math.abs(l.v - v) < Math.abs(best.v - v)) best = l;
+      return best;
+    };
+    const bx = nearest(this.xs, p.x);
+    const by = nearest(this.ys, p.y);
+    if (!bx && !by) return none(p);
+    const out = { x: bx ? bx.v : p.x, y: by ? by.v : p.y };
+    const lines = [];
+    if (bx) lines.push(line("align", bx.from, { x: out.x, y: out.y }));
+    if (by) lines.push(line("align", by.from, { x: out.x, y: out.y }));
+    return { point: out, kind: "align", x: !!bx, y: !!by, lines, labels: [this.label(out, "align")] };
+  }
+  label(p, kind, text = LABELS[kind]) {
+    return { kind, x: p.x, y: p.y, text };
+  }
+  /** The anchor or centre nearest `p`, within `tol`. */
+  nearestPoint(p, tol) {
+    let best = null;
+    let bestD = Infinity;
+    for (const t of within(this.points, (e) => e.p.x, p.x, tol)) {
+      const d = distance(t.p, p);
+      if (d <= tol && d < bestD) {
+        best = t;
+        bestD = d;
+      }
+    }
+    return best;
+  }
+  /**
+   * Slides `q`, on the line through `at` along `dir` (beyond `at` only for a `ray`), to where
+   * the nearest target line crosses it, at most twice `tol` away: where it lands and the
+   * target point that line comes from.
+   */
+  slide(at, dir, q, tol, ray) {
+    const len2 = dir.x * dir.x + dir.y * dir.y;
+    if (!Number.isFinite(len2) || len2 <= 1e-18) return null;
+    const reach = 2 * tol;
+    let best = null;
+    for (const vertical of [true, false]) {
+      const d = vertical ? dir.x : dir.y;
+      if (Math.abs(d) <= 1e-9) continue;
+      const a = vertical ? at.x : at.y;
+      for (const l of linesNear(vertical ? this.xs : this.ys, vertical ? q.x : q.y, reach)) {
+        const s = (l.v - a) / d;
+        const hit = vertical ? { x: l.v, y: at.y + dir.y * s } : { x: at.x + dir.x * s, y: l.v };
+        const moved = distance(hit, q);
+        if (moved <= reach && (!ray || s > 0) && (!best || moved < best.moved)) best = { moved, point: hit, from: l.from };
+      }
+    }
+    return best && { point: best.point, from: best.from };
+  }
+  /** The guides of a point `q` slid into line with the target at `from`: the line and "align", or the target's own label when `q` sits on it. */
+  linedUp(q, from) {
+    const on = this.nearestPoint(q, 1e-9);
+    if (on) return { kind: on.kind, lines: [], labels: [this.label(on.p, on.kind)] };
+    return { kind: "align", lines: [line("align", from, q)], labels: [this.label(q, "align")] };
+  }
+  /** Target segments whose control box reaches `p` and which pass within `tol` of it, nearest first. */
+  segmentsNear(p, tol) {
+    const out = [];
+    const pt = toPoint(p);
+    for (const s of this.segments) {
+      if (p.x < s.minX - tol || p.x > s.maxX + tol || p.y < s.minY - tol || p.y > s.maxY + tol) continue;
+      const hit = _chunkUG5DVXJKcjs.segmentNearest.call(void 0, s.seg, pt);
+      if (hit.distance <= tol) out.push({ seg: s.seg, t: hit.t, distance: hit.distance });
+    }
+    return out.sort((a, b) => a.distance - b.distance);
+  }
+  onSegment(near) {
+    return near.length ? toVec(_chunkUG5DVXJKcjs.segmentPoint.call(void 0, near[0].seg, near[0].t)) : null;
+  }
+  /** Where two of the target segments near `p` cross, the crossing nearest `p` within `tol`. */
+  crossing(near, p, tol) {
+    const list = near.slice(0, CROSSING_PAIRS);
+    let best = null;
+    let bestD = Infinity;
+    for (let i = 0; i < list.length; i++) {
+      for (let j = i + 1; j < list.length; j++) {
+        for (const hit of _chunkUG5DVXJKcjs.segmentIntersections.call(void 0, list[i].seg, list[j].seg)) {
+          const q = toVec(hit.point);
+          const d = distance(q, p);
+          if (d <= tol && d < bestD) {
+            best = q;
+            bestD = d;
+          }
+        }
+      }
+    }
+    return best;
+  }
+  /**
+   * The foot of a perpendicular, or a tangent point, from `base` on a target segment near `p`
+   * (within `tol` of it): roots of `(B(t) − base) · B′(t)` and `(B(t) − base) × B′(t)`
+   * bracketed by sign changes of samples and narrowed by bisection.
+   */
+  curvePoint(near, base, p, tol) {
+    let best = null;
+    for (const { seg } of near) {
+      for (const kind of ["perpendicular", "tangent"]) {
+        if (kind === "tangent" && seg.length === 2) continue;
+        for (const q of solveOnSegment(seg, base, kind === "perpendicular" ? dotCondition : crossCondition)) {
+          const d = distance(q, p);
+          if (d <= tol && (!best || d < best.d)) best = { point: q, kind, d };
+        }
+      }
+    }
+    return best && { point: best.point, kind: best.kind };
+  }
+  // -------------------------------------------------------------------------
+  // Boxes
+  // -------------------------------------------------------------------------
+  /**
+   * Snaps a moving box `r` (the moved selection's bounds): its edge or centre nearest a target
+   * line on each axis (`axes` limits which may move). With `spacing`, an axis that lines up
+   * with nothing spaces the box evenly in its row or column. Returns the correction and guides.
+   */
+  snapRect(r, tol, options = {}) {
+    const axes = { x: _optionalChain([options, 'access', _17 => _17.axes, 'optionalAccess', _18 => _18.x]) !== false, y: _optionalChain([options, 'access', _19 => _19.axes, 'optionalAccess', _20 => _20.y]) !== false };
+    const nearest = (lines, values) => {
+      let best = null;
+      for (const v of values) for (const l of linesNear(lines, v, tol)) if (!best || Math.abs(l.v - v) < Math.abs(best.d)) best = { d: l.v - v, from: l.from };
+      return best;
+    };
+    const bx = axes.x ? nearest(this.xs, [r.x, r.x + r.width / 2, r.x + r.width]) : null;
+    const by = axes.y ? nearest(this.ys, [r.y, r.y + r.height / 2, r.y + r.height]) : null;
+    const out = { dx: _nullishCoalesce(_optionalChain([bx, 'optionalAccess', _21 => _21.d]), () => ( 0)), dy: _nullishCoalesce(_optionalChain([by, 'optionalAccess', _22 => _22.d]), () => ( 0)), x: !!bx, y: !!by, lines: [], labels: [] };
+    const done = { ...r, x: r.x + out.dx, y: r.y + out.dy };
+    if (bx) {
+      const x = bx.from.x;
+      out.lines.push({ kind: "align", x1: x, y1: Math.min(bx.from.y, done.y), x2: x, y2: Math.max(bx.from.y, done.y + done.height) });
+    }
+    if (by) {
+      const y = by.from.y;
+      out.lines.push({ kind: "align", x1: Math.min(by.from.x, done.x), y1: y, x2: Math.max(by.from.x, done.x + done.width), y2: y });
+    }
+    if (options.spacing && this.boxes.length) {
+      for (const horizontal of [true, false]) {
+        if (horizontal ? out.x || !axes.x : out.y || !axes.y) continue;
+        const moved = { ...r, x: r.x + out.dx, y: r.y + out.dy };
+        const even = this.evenSpacing(moved, horizontal, tol);
+        if (!even) continue;
+        if (horizontal) {
+          out.dx += even.shift;
+          out.x = true;
+        } else {
+          out.dy += even.shift;
+          out.y = true;
+        }
+        for (const gap of even.gaps) this.gapMarks(gap, horizontal, tol, out);
+      }
+    }
+    if (bx || by) out.labels.unshift(this.label({ x: r.x + out.dx + r.width / 2, y: r.y + out.dy + r.height / 2 }, "align"));
+    return out;
+  }
+  /**
+   * Equal spacing along x (`horizontal`) or y for the moved box `r`, among the objects of its
+   * row (column): the shift within `tol` that centres it between its neighbours, or leaves it
+   * as far from the neighbour before or after it as two other objects of the row are apart;
+   * and the gaps that are equal then, as (start, end, where across).
+   */
+  evenSpacing(r, horizontal, tol) {
+    const span = (b, x) => x ? [b.x, b.x + b.width] : [b.y, b.y + b.height];
+    const [r0, r1] = span(r, horizontal);
+    const len = r1 - r0;
+    const [c0, c1] = span(r, !horizontal);
+    const row = this.boxes.map((b) => ({ b, a0: span(b, horizontal)[0], a1: span(b, horizontal)[1] })).filter((e) => span(e.b, !horizontal)[0] < c1 && span(e.b, !horizontal)[1] > c0 && (e.a1 <= r0 + tol || e.a0 >= r1 - tol)).sort((a, b) => a.a0 - b.a0);
+    if (!row.length) return null;
+    const mid = (a, b) => (Math.max(span(a, !horizontal)[0], span(b, !horizontal)[0]) + Math.min(span(a, !horizontal)[1], span(b, !horizontal)[1])) / 2;
+    const pairs = [];
+    for (const p of row) {
+      const next = bound(row, (e) => e.a0, p.a1, false);
+      const q = row[next];
+      if (!q) continue;
+      const straddles = p.a1 <= r0 + tol && q.a0 >= r1 - tol;
+      if (q.a0 > p.a1 && !straddles) pairs.push({ g: q.a0 - p.a1, gap: [p.a1, q.a0, mid(p.b, q.b)] });
+    }
+    let before = null;
+    let after = null;
+    for (const e of row) {
+      if (e.a1 <= r0 + tol && (!before || e.a1 > before.a1)) before = e;
+      if (e.a0 >= r1 - tol && (!after || e.a0 < after.a0)) after = e;
+    }
+    const starts = [];
+    if (before && after && after.a0 - before.a1 > len) starts.push({ start: (before.a1 + after.a0 - len) / 2, repeats: null });
+    for (const { g } of pairs) {
+      if (before) starts.push({ start: before.a1 + g, repeats: g });
+      if (after) starts.push({ start: after.a0 - g - len, repeats: g });
+    }
+    let pick = null;
+    for (const s of starts) if (Math.abs(s.start - r0) <= tol && (!pick || Math.abs(s.start - r0) < Math.abs(pick.start - r0))) pick = s;
+    if (!pick) return null;
+    const { start, repeats } = pick;
+    const at = horizontal ? { ...r, x: start } : { ...r, y: start };
+    const end = start + len;
+    const gaps = [];
+    if (before && (repeats === null || Math.abs(start - before.a1 - repeats) <= EQUAL)) gaps.push([before.a1, start, mid(before.b, at)]);
+    if (after && (repeats === null || Math.abs(after.a0 - end - repeats) <= EQUAL)) gaps.push([end, after.a0, mid(after.b, at)]);
+    if (repeats !== null) {
+      for (const p of pairs) if (Math.abs(p.g - repeats) <= EQUAL) gaps.push(p.gap);
+    }
+    return { shift: start - r0, gaps };
+  }
+  /** A gap mark: a line across the gap with a tick at each end, and its length as a label. */
+  gapMarks([u0, u1, c], horizontal, tick, out) {
+    const pt = (u, v) => horizontal ? { x: u, y: v } : { x: v, y: u };
+    out.lines.push(line("spacing", pt(u0, c), pt(u1, c)), line("spacing", pt(u0, c - tick), pt(u0, c + tick)), line("spacing", pt(u1, c - tick), pt(u1, c + tick)));
+    out.labels.push(this.label(pt((u0 + u1) / 2, c), "spacing", fmtLength(u1 - u0)));
+  }
+  /** The other objects' side length nearest `length`, within `tol`, or null. */
+  matchSize(length2, tol) {
+    let best = null;
+    for (const s of this.sizes) if (Math.abs(s - length2) <= tol && (best === null || Math.abs(s - length2) < Math.abs(best - length2))) best = s;
+    return best;
+  }
+  /**
+   * Snaps a selection-box resize. `sx / sy` are the scale `scaleFor` gave for dragging
+   * `handle` of `frame` (in the box's own, possibly rotated frame), `mods.shift` keeps the
+   * proportions and `mods.alt` scales about the centre. The handle lands on an anchor or
+   * centre within `tol`, else the corner or the side it moves lines up with the nearest
+   * target, whatever the box's angle; a handle with one way to go (a side, or a proportional
+   * corner) slides along it until one of them is on a target. An axis that snaps to nothing
+   * may match another object's width or height instead.
+   */
+  snapScale(frame, handle, sx, sy, mods, tol) {
+    const toDoc = frame.angle ? rotateMatrix(frame.angle) : IDENTITY_MATRIX;
+    const toLocal = frame.angle ? rotateMatrix(-frame.angle) : IDENTITY_MATRIX;
+    const corner = handle.length === 2;
+    const proportional = !!mods.shift;
+    const centre = { x: frame.x + frame.width / 2, y: frame.y + frame.height / 2 };
+    const origin = mods.alt ? centre : handlePos(opposite(handle), frame);
+    const hp = handlePos(handle, frame);
+    const d0 = { x: hp.x - origin.x, y: hp.y - origin.y };
+    const valid = (n, s) => Number.isFinite(n) && n * s > 0;
+    const nearest = (v, lines) => {
+      let best = null;
+      for (const l of linesNear(lines, v, tol)) if (!best || Math.abs(l.v - v) < Math.abs(best.v - v)) best = l;
+      return best;
+    };
+    let nx = sx;
+    let ny = sy;
+    let snap = { hx: null, hy: null, on: null };
+    if (corner && !proportional) {
+      const p = applyMatrix(toDoc, { x: origin.x + d0.x * sx, y: origin.y + d0.y * sy });
+      const hx = nearest(p.x, this.xs);
+      const hy = nearest(p.y, this.ys);
+      const on = this.nearestPoint(p, tol);
+      const tries = [];
+      if (on) tries.push({ tx: on.p.x, ty: on.p.y, s: { hx: null, hy: null, on } });
+      tries.push({ tx: _nullishCoalesce(_optionalChain([hx, 'optionalAccess', _23 => _23.v]), () => ( null)), ty: _nullishCoalesce(_optionalChain([hy, 'optionalAccess', _24 => _24.v]), () => ( null)), s: { hx, hy, on: null } });
+      tries.push({ tx: _nullishCoalesce(_optionalChain([hx, 'optionalAccess', _25 => _25.v]), () => ( null)), ty: null, s: { hx, hy: null, on: null } });
+      tries.push({ tx: null, ty: _nullishCoalesce(_optionalChain([hy, 'optionalAccess', _26 => _26.v]), () => ( null)), s: { hx: null, hy, on: null } });
+      for (const { tx, ty, s } of tries) {
+        if (tx === null && ty === null) continue;
+        const q = applyMatrix(toLocal, { x: _nullishCoalesce(tx, () => ( p.x)), y: _nullishCoalesce(ty, () => ( p.y)) });
+        let cx = (q.x - origin.x) / d0.x;
+        let cy = (q.y - origin.y) / d0.y;
+        if (!frame.angle) {
+          if (tx === null) cx = sx;
+          if (ty === null) cy = sy;
+        }
+        if (valid(cx, sx) && valid(cy, sy)) {
+          nx = cx;
+          ny = cy;
+          snap = s;
+          break;
+        }
+      }
+    } else {
+      const movesX2 = handle === "e" || handle === "w";
+      let e;
+      let c;
+      let s0;
+      if (corner) [e, c, s0] = [{ x: Math.sign(sx), y: Math.sign(sy) }, { x: 0, y: 0 }, Math.abs(sx)];
+      else if (movesX2) [e, c, s0] = proportional ? [{ x: 1, y: Math.sign(sx) }, { x: 0, y: 0 }, sx] : [{ x: 1, y: 0 }, { x: 0, y: 1 }, sx];
+      else [e, c, s0] = proportional ? [{ x: Math.sign(sy), y: 1 }, { x: 0, y: 0 }, sy] : [{ x: 0, y: 1 }, { x: 1, y: 0 }, sy];
+      const i = RING.indexOf(handle);
+      const ends = corner ? [] : [RING[(i + 1) % 8], RING[(i + 7) % 8]];
+      const travel = Math.hypot(e.x * d0.x, e.y * d0.y);
+      let best = null;
+      const consider = (s, inLine, found2) => {
+        const moved = Math.abs(s - s0) * travel;
+        if (!valid(s, s0) || moved > 2 * tol) return;
+        if (!best || (inLine === best.inLine ? moved < best.moved : !inLine)) best = { s, inLine, moved, snap: found2 };
+      };
+      for (const h of [handle, ...ends]) {
+        const hv = handlePos(h, frame);
+        const v = { x: hv.x - origin.x, y: hv.y - origin.y };
+        const base = applyMatrix(toDoc, { x: origin.x + c.x * v.x, y: origin.y + c.y * v.y });
+        const dir = applyMatrix(toDoc, { x: e.x * v.x, y: e.y * v.y });
+        const p = { x: base.x + dir.x * s0, y: base.y + dir.y * s0 };
+        const l2 = dir.x * dir.x + dir.y * dir.y;
+        const on = l2 > 1e-18 ? this.nearestPoint(p, tol) : null;
+        if (on) consider(((on.p.x - base.x) * dir.x + (on.p.y - base.y) * dir.y) / l2, false, { hx: null, hy: null, on });
+        if (Math.abs(dir.x) > 1e-9) {
+          const hit = nearest(p.x, this.xs);
+          if (hit) consider((hit.v - base.x) / dir.x, true, { hx: hit, hy: null, on: null });
+        }
+        if (Math.abs(dir.y) > 1e-9) {
+          const hit = nearest(p.y, this.ys);
+          if (hit) consider((hit.v - base.y) / dir.y, true, { hx: null, hy: hit, on: null });
+        }
+      }
+      const found = best;
+      if (found) {
+        nx = c.x + found.s * e.x;
+        ny = c.y + found.s * e.y;
+        snap = found.snap;
+      }
+    }
+    const out = { sx: nx, sy: ny, snapped: false, lines: [], labels: [] };
+    const handleAt = () => applyMatrix(toDoc, { x: origin.x + d0.x * out.sx, y: origin.y + d0.y * out.sy });
+    if (snap.on) {
+      out.snapped = true;
+      out.labels.push(this.label(snap.on.p, snap.on.kind));
+      return out;
+    }
+    const movesX = handle !== "n" && handle !== "s";
+    const movesY = handle !== "e" && handle !== "w";
+    const sized = [];
+    if (!proportional) {
+      if (movesX && !snap.hx && !(frame.angle && snap.hy) && frame.width > 1e-9) {
+        const len = this.matchSize(Math.abs(out.sx) * frame.width, tol);
+        if (len !== null && len > 0) {
+          out.sx = Math.sign(out.sx || 1) * (len / frame.width);
+          sized.push("x");
+        }
+      }
+      if (movesY && !snap.hy && !(frame.angle && snap.hx) && frame.height > 1e-9) {
+        const len = this.matchSize(Math.abs(out.sy) * frame.height, tol);
+        if (len !== null && len > 0) {
+          out.sy = Math.sign(out.sy || 1) * (len / frame.height);
+          sized.push("y");
+        }
+      }
+    }
+    const x0 = origin.x + (frame.x - origin.x) * out.sx;
+    const x1 = origin.x + (frame.x + frame.width - origin.x) * out.sx;
+    const y0 = origin.y + (frame.y - origin.y) * out.sy;
+    const y1 = origin.y + (frame.y + frame.height - origin.y) * out.sy;
+    const box = { x0: Math.min(x0, x1), x1: Math.max(x0, x1), y0: Math.min(y0, y1), y1: Math.max(y0, y1) };
+    const page = [
+      { x: box.x0, y: box.y0 },
+      { x: box.x1, y: box.y0 },
+      { x: box.x1, y: box.y1 },
+      { x: box.x0, y: box.y1 }
+    ].map((q) => applyMatrix(toDoc, q));
+    const pminY = Math.min(...page.map((q) => q.y));
+    const pmaxY = Math.max(...page.map((q) => q.y));
+    const pminX = Math.min(...page.map((q) => q.x));
+    const pmaxX = Math.max(...page.map((q) => q.x));
+    if (snap.hx) out.lines.push({ kind: "align", x1: snap.hx.v, y1: Math.min(snap.hx.from.y, pminY), x2: snap.hx.v, y2: Math.max(snap.hx.from.y, pmaxY) });
+    if (snap.hy) out.lines.push({ kind: "align", x1: Math.min(snap.hy.from.x, pminX), y1: snap.hy.v, x2: Math.max(snap.hy.from.x, pmaxX), y2: snap.hy.v });
+    if (snap.hx || snap.hy) {
+      out.snapped = true;
+      out.labels.push(this.label(handleAt(), "align"));
+    }
+    for (const axis of sized) {
+      out.snapped = true;
+      const off = tol * 2;
+      const [a, b] = axis === "x" ? [{ x: box.x0, y: box.y1 + off }, { x: box.x1, y: box.y1 + off }] : [{ x: box.x1 + off, y: box.y0 }, { x: box.x1 + off, y: box.y1 }];
+      const pa = applyMatrix(toDoc, a);
+      const pb = applyMatrix(toDoc, b);
+      out.lines.push(line("size", pa, pb));
+      out.labels.push(this.label({ x: (pa.x + pb.x) / 2, y: (pa.y + pb.y) / 2 }, "size", `${axis === "x" ? "W" : "H"} ${fmtLength(axis === "x" ? box.x1 - box.x0 : box.y1 - box.y0)}`));
+    }
+    return out;
+  }
+}, _class);
+var RING = ["nw", "n", "ne", "e", "se", "s", "sw", "w"];
+function opposite(h) {
+  return RING[(RING.indexOf(h) + 4) % 8];
+}
+function handlePos(h, r) {
+  const x = h.includes("w") ? r.x : h.includes("e") ? r.x + r.width : r.x + r.width / 2;
+  const y = h.startsWith("n") ? r.y : h.startsWith("s") ? r.y + r.height : r.y + r.height / 2;
+  return { x, y };
+}
+function line(kind, a, b) {
+  return { kind, x1: a.x, y1: a.y, x2: b.x, y2: b.y };
+}
+function construction(leave, p, tol) {
+  const v = { x: p.x - leave.at.x, y: p.y - leave.at.y };
+  if (Math.hypot(v.x, v.y) <= tol) return null;
+  let best = null;
+  for (const a of _nullishCoalesce(leave.angles, () => ( []))) {
+    const r = a * Math.PI / 180;
+    const exact = (n) => Math.abs(n) < 1e-12 ? 0 : n;
+    const dir = { x: exact(Math.cos(r)), y: exact(-Math.sin(r)) };
+    const k = v.x * dir.x + v.y * dir.y;
+    const point = { x: leave.at.x + dir.x * k, y: leave.at.y + dir.y * k };
+    const d = distance(point, p);
+    if (d <= tol && (!best || d < best.d)) best = { dir, point, d };
+  }
+  return best && { dir: best.dir, point: best.point };
+}
+var dotCondition = (r, d) => r[0] * d[0] + r[1] * d[1];
+var crossCondition = (r, d) => r[0] * d[1] - r[1] * d[0];
+function solveOnSegment(seg, base, cond) {
+  const b = [base.x, base.y];
+  const g = (t) => {
+    const p = _chunkUG5DVXJKcjs.segmentPoint.call(void 0, seg, t);
+    return cond([p[0] - b[0], p[1] - b[1]], _chunkUG5DVXJKcjs.segmentDerivative.call(void 0, seg, t));
+  };
+  const vals = [];
+  let scale = 0;
+  for (let i = 0; i <= CURVE_SAMPLES; i++) {
+    const t = i / CURVE_SAMPLES;
+    const p = _chunkUG5DVXJKcjs.segmentPoint.call(void 0, seg, t);
+    const d = _chunkUG5DVXJKcjs.segmentDerivative.call(void 0, seg, t);
+    const r = [p[0] - b[0], p[1] - b[1]];
+    vals.push(cond(r, d));
+    scale = Math.max(scale, Math.hypot(r[0], r[1]) * Math.hypot(d[0], d[1]));
+  }
+  if (!(scale > 0) || vals.every((v) => Math.abs(v) <= scale * 1e-12)) return [];
+  const out = [];
+  for (let i = 0; i < CURVE_SAMPLES; i++) {
+    const ga = vals[i];
+    const gb = vals[i + 1];
+    if (!(Number.isFinite(ga) && Number.isFinite(gb)) || ga > 0 === gb > 0 && ga !== 0) continue;
+    let lo = i / CURVE_SAMPLES;
+    let hi = (i + 1) / CURVE_SAMPLES;
+    let flo = ga;
+    for (let k = 0; k < BISECT; k++) {
+      const m = (lo + hi) / 2;
+      const fm = g(m);
+      if (fm === 0) {
+        lo = hi = m;
+        break;
+      }
+      if (fm > 0 === flo > 0) {
+        lo = m;
+        flo = fm;
+      } else hi = m;
+    }
+    const t = (lo + hi) / 2;
+    const p = _chunkUG5DVXJKcjs.segmentPoint.call(void 0, seg, t);
+    const dv = _chunkUG5DVXJKcjs.segmentDerivative.call(void 0, seg, t);
+    const r = Math.hypot(p[0] - b[0], p[1] - b[1]);
+    const dl = Math.hypot(dv[0], dv[1]);
+    if (!(r > 1e-9 && dl > 0) || Math.abs(cond([p[0] - b[0], p[1] - b[1]], dv)) > 1e-6 * r * dl) continue;
+    if (!out.some((q) => Math.hypot(q.x - p[0], q.y - p[1]) <= 1e-9 * (1 + r))) out.push({ x: p[0], y: p[1] });
+  }
+  return out;
+}
+
 // src/vector/controller.ts
+var DEFAULT_VECTOR_SNAP = { grid: 0, objects: true, guides: true, threshold: 5, angles: VECTOR_CONSTRUCTION_ANGLES };
 var VECTOR_CLIPBOARD_TYPE = "pixerate/vector";
 var DEFAULT_DEFAULTS = {
   fill: "#d4d4d8",
@@ -878,7 +1632,7 @@ function getEditablePathIds(state) {
       }
     }
   }
-  return [...ids].filter((id) => _optionalChain([findVectorNode, 'call', _8 => _8(state.document.nodes, id), 'optionalAccess', _9 => _9.type]) === "path");
+  return [...ids].filter((id) => _optionalChain([findVectorNode, 'call', _27 => _27(state.document.nodes, id), 'optionalAccess', _28 => _28.type]) === "path");
 }
 function getVisibleAnchors(state) {
   const out = [];
@@ -893,7 +1647,7 @@ function getVisibleHandles(state) {
   const seen = /* @__PURE__ */ new Set();
   const push = (node, s, i, handle) => {
     const sp = node.subpaths[s];
-    const a = _optionalChain([sp, 'optionalAccess', _10 => _10.anchors, 'access', _11 => _11[i]]);
+    const a = _optionalChain([sp, 'optionalAccess', _29 => _29.anchors, 'access', _30 => _30[i]]);
     if (!a || !a[handle]) return;
     const key = `${node.id}:${s}:${i}:${handle}`;
     if (seen.has(key)) return;
@@ -902,8 +1656,8 @@ function getVisibleHandles(state) {
   };
   if (state.tool === "pen" && state.pen) {
     const node = findVectorNode(state.document.nodes, state.pen.nodeId);
-    const sp = _optionalChain([node, 'optionalAccess', _12 => _12.type]) === "path" ? node.subpaths[state.pen.subpath] : void 0;
-    if (_optionalChain([node, 'optionalAccess', _13 => _13.type]) === "path" && sp) {
+    const sp = _optionalChain([node, 'optionalAccess', _31 => _31.type]) === "path" ? node.subpaths[state.pen.subpath] : void 0;
+    if (_optionalChain([node, 'optionalAccess', _32 => _32.type]) === "path" && sp) {
       const last = sp.anchors.length - 1;
       push(node, state.pen.subpath, last, "in");
       push(node, state.pen.subpath, last, "out");
@@ -929,7 +1683,7 @@ function getVisibleHandles(state) {
 }
 function getAnchor(doc, ref) {
   const node = findVectorNode(doc.nodes, ref.nodeId);
-  return _optionalChain([node, 'optionalAccess', _14 => _14.type]) === "path" ? _optionalChain([node, 'access', _15 => _15.subpaths, 'access', _16 => _16[ref.subpath], 'optionalAccess', _17 => _17.anchors, 'access', _18 => _18[ref.index]]) : void 0;
+  return _optionalChain([node, 'optionalAccess', _33 => _33.type]) === "path" ? _optionalChain([node, 'access', _34 => _34.subpaths, 'access', _35 => _35[ref.subpath], 'optionalAccess', _36 => _36.anchors, 'access', _37 => _37[ref.index]]) : void 0;
 }
 function getAnchorWorld(doc, ref) {
   const a = getAnchor(doc, ref);
@@ -1046,40 +1800,45 @@ function mapTree(nodes, fn) {
 var isRoot = (m) => m === IDENTITY_MATRIX || m[0] === 1 && m[1] === 0 && m[2] === 0 && m[3] === 1 && m[4] === 0 && m[5] === 0;
 var idCounter = 0;
 var defaultCreateId = () => `vn-${Date.now().toString(36)}${(++idCounter).toString(36)}`;
-var VectorEditorController = (_class = class {
+var VectorEditorController = (_class2 = class {
   
   
-  __init() {this.selection = []}
-  __init2() {this.anchors = []}
-  __init3() {this.editingId = null}
-  __init4() {this.pen = null}
+  __init7() {this.selection = []}
+  __init8() {this.anchors = []}
+  __init9() {this.editingId = null}
+  __init10() {this.pen = null}
   
   
   
   
   
-  __init5() {this.hover = null}
-  __init6() {this.pointer = null}
-  __init7() {this.drag = null}
-  __init8() {this.interaction = null}
-  __init9() {this.spaceHeld = false}
-  __init10() {this.clipboard = null}
+  __init11() {this.hover = null}
+  __init12() {this.pointer = null}
+  __init13() {this.drag = null}
+  __init14() {this.interaction = null}
+  __init15() {this.guides = null}
+  /** Whether the last `snapDrawn` landed on an object (guides may be hidden). */
+  __init16() {this.snappedToObject = false}
+  /** Drawing targets for hovering the pen and shape tools, kept while the document and the excluded path stay the same. */
+  __init17() {this.hoverTargets = null}
+  __init18() {this.spaceHeld = false}
+  __init19() {this.clipboard = null}
   
   
-  __init11() {this.listeners = /* @__PURE__ */ new Set()}
-  __init12() {this.cleanups = []}
-  __init13() {this.applying = false}
+  __init20() {this.listeners = /* @__PURE__ */ new Set()}
+  __init21() {this.cleanups = []}
+  __init22() {this.applying = false}
   /** Set while a commit records a change that was already applied, so `restore` still reports it. */
-  __init14() {this.committing = false}
-  __init15() {this.revision = 0}
+  __init23() {this.committing = false}
+  __init24() {this.revision = 0}
   
-  constructor(options = {}) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);_class.prototype.__init5.call(this);_class.prototype.__init6.call(this);_class.prototype.__init7.call(this);_class.prototype.__init8.call(this);_class.prototype.__init9.call(this);_class.prototype.__init10.call(this);_class.prototype.__init11.call(this);_class.prototype.__init12.call(this);_class.prototype.__init13.call(this);_class.prototype.__init14.call(this);_class.prototype.__init15.call(this);_class.prototype.__init16.call(this);_class.prototype.__init17.call(this);
+  constructor(options = {}) {;_class2.prototype.__init7.call(this);_class2.prototype.__init8.call(this);_class2.prototype.__init9.call(this);_class2.prototype.__init10.call(this);_class2.prototype.__init11.call(this);_class2.prototype.__init12.call(this);_class2.prototype.__init13.call(this);_class2.prototype.__init14.call(this);_class2.prototype.__init15.call(this);_class2.prototype.__init16.call(this);_class2.prototype.__init17.call(this);_class2.prototype.__init18.call(this);_class2.prototype.__init19.call(this);_class2.prototype.__init20.call(this);_class2.prototype.__init21.call(this);_class2.prototype.__init22.call(this);_class2.prototype.__init23.call(this);_class2.prototype.__init24.call(this);_class2.prototype.__init25.call(this);_class2.prototype.__init26.call(this);
     this.history = _nullishCoalesce(options.history, () => ( new (0, _chunkQKLRAA4Tcjs.HistoryManager)()));
     this.doc = options.document ? cloneVectorDocument(options.document) : { width: 800, height: 600, nodes: [] };
     this.tool = _nullishCoalesce(options.tool, () => ( "select"));
     this.defaults = { ...DEFAULT_DEFAULTS, ..._nullishCoalesce(options.defaults, () => ( {})) };
     this.viewport = { x: 0, y: 0, zoom: 1, ..._nullishCoalesce(options.viewport, () => ( {})) };
-    this.snap = { grid: 0, ..._nullishCoalesce(options.snap, () => ( {})) };
+    this.snap = { ...DEFAULT_VECTOR_SNAP, ..._nullishCoalesce(options.snap, () => ( {})) };
     this.hitRadius = _nullishCoalesce(options.hitRadius, () => ( 6));
     this.createId = _nullishCoalesce(options.createId, () => ( defaultCreateId));
     this.onChange = options.onChange;
@@ -1101,9 +1860,9 @@ var VectorEditorController = (_class = class {
   // State
   // -------------------------------------------------------------------------
   /** The current snapshot (stable until the next change). */
-  __init16() {this.getState = () => this.state}
+  __init25() {this.getState = () => this.state}
   /** Calls `listener` after every change. Returns an unsubscribe function. */
-  __init17() {this.subscribe = (listener) => {
+  __init26() {this.subscribe = (listener) => {
     this.listeners.add(listener);
     return () => {
       this.listeners.delete(listener);
@@ -1128,6 +1887,7 @@ var VectorEditorController = (_class = class {
       viewport: this.viewport,
       defaults: this.defaults,
       snap: this.snap,
+      guides: this.guides,
       hitRadius: this.hitRadius,
       hover: this.hover,
       cursor: this.cursorFor(),
@@ -1144,7 +1904,7 @@ var VectorEditorController = (_class = class {
   notify(docChanged = false) {
     this.revision++;
     this.state = this.computeState();
-    if (docChanged) _optionalChain([this, 'access', _19 => _19.onChange, 'optionalCall', _20 => _20(this.doc)]);
+    if (docChanged) _optionalChain([this, 'access', _38 => _38.onChange, 'optionalCall', _39 => _39(this.doc)]);
     const state = this.state;
     this.listeners.forEach((listener) => {
       try {
@@ -1174,20 +1934,20 @@ var VectorEditorController = (_class = class {
     return applyMatrix(invertMatrix(this.worldOf(id, doc)), p);
   }
   cursorFor() {
-    if (_optionalChain([this, 'access', _21 => _21.drag, 'optionalAccess', _22 => _22.kind]) === "pan" || this.spaceHeld) return this.drag ? "grabbing" : "grab";
-    if (_optionalChain([this, 'access', _23 => _23.drag, 'optionalAccess', _24 => _24.kind]) === "rotate") return "grabbing";
-    if (_optionalChain([this, 'access', _25 => _25.drag, 'optionalAccess', _26 => _26.kind]) === "move") return "move";
+    if (_optionalChain([this, 'access', _40 => _40.drag, 'optionalAccess', _41 => _41.kind]) === "pan" || this.spaceHeld) return this.drag ? "grabbing" : "grab";
+    if (_optionalChain([this, 'access', _42 => _42.drag, 'optionalAccess', _43 => _43.kind]) === "rotate") return "grabbing";
+    if (_optionalChain([this, 'access', _44 => _44.drag, 'optionalAccess', _45 => _45.kind]) === "move") return "move";
     const h = this.hover;
     switch (this.tool) {
       case "select":
-        if (_optionalChain([h, 'optionalAccess', _27 => _27.transformHandle])) return vectorResizeCursor(h.transformHandle, _nullishCoalesce(_optionalChain([this, 'access', _28 => _28.frameOf, 'call', _29 => _29(this.selectedRoots()), 'optionalAccess', _30 => _30.angle]), () => ( 0)));
-        return _optionalChain([h, 'optionalAccess', _31 => _31.nodeId]) ? "move" : "default";
+        if (_optionalChain([h, 'optionalAccess', _46 => _46.transformHandle])) return vectorResizeCursor(h.transformHandle, _nullishCoalesce(_optionalChain([this, 'access', _47 => _47.frameOf, 'call', _48 => _48(this.selectedRoots()), 'optionalAccess', _49 => _49.angle]), () => ( 0)));
+        return _optionalChain([h, 'optionalAccess', _50 => _50.nodeId]) ? "move" : "default";
       case "direct":
-        if (_optionalChain([h, 'optionalAccess', _32 => _32.anchor]) || _optionalChain([h, 'optionalAccess', _33 => _33.handle])) return "pointer";
-        if (_optionalChain([h, 'optionalAccess', _34 => _34.segment])) return "copy";
-        return _optionalChain([h, 'optionalAccess', _35 => _35.nodeId]) ? "move" : "default";
+        if (_optionalChain([h, 'optionalAccess', _51 => _51.anchor]) || _optionalChain([h, 'optionalAccess', _52 => _52.handle])) return "pointer";
+        if (_optionalChain([h, 'optionalAccess', _53 => _53.segment])) return "copy";
+        return _optionalChain([h, 'optionalAccess', _54 => _54.nodeId]) ? "move" : "default";
       case "pen":
-        return _optionalChain([h, 'optionalAccess', _36 => _36.anchor]) ? "pointer" : "crosshair";
+        return _optionalChain([h, 'optionalAccess', _55 => _55.anchor]) ? "pointer" : "crosshair";
       default:
         return "crosshair";
     }
@@ -1207,7 +1967,7 @@ var VectorEditorController = (_class = class {
       this.selection = s.selection.filter((id) => this.getNode(id));
       this.anchors = s.anchors.filter((r) => getAnchor(this.doc, r));
       this.editingId = s.editingId && this.getNode(s.editingId) ? s.editingId : null;
-      this.pen = s.pen && _optionalChain([this, 'access', _37 => _37.getNode, 'call', _38 => _38(s.pen.nodeId), 'optionalAccess', _39 => _39.subpaths, 'optionalAccess', _40 => _40[s.pen.subpath]]) ? s.pen : null;
+      this.pen = s.pen && _optionalChain([this, 'access', _56 => _56.getNode, 'call', _57 => _57(s.pen.nodeId), 'optionalAccess', _58 => _58.subpaths, 'optionalAccess', _59 => _59[s.pen.subpath]]) ? s.pen : null;
     } finally {
       this.applying = false;
     }
@@ -1312,6 +2072,7 @@ var VectorEditorController = (_class = class {
     this.cancelDrag();
     this.tool = tool;
     this.hover = null;
+    this.guides = null;
     if (tool !== "direct") {
       this.anchors = [];
       this.editingId = null;
@@ -1324,18 +2085,74 @@ var VectorEditorController = (_class = class {
   }
   setSnap(snap) {
     this.snap = { ...this.snap, ...snap };
+    if (!this.snap.guides || !this.snap.objects) this.guides = null;
     this.notify();
   }
-  snapPoint(p) {
-    const g = this.snap.grid;
-    if (!g || g <= 0) return p;
-    return { x: Math.round(p.x / g) * g, y: Math.round(p.y / g) * g };
+  /** Turns object snapping on or off (the toolbar's snapping toggle). */
+  toggleSnapping(on = !this.snap.objects) {
+    this.setSnap({ objects: on });
   }
-  snapDelta(dx, dy, origin) {
+  gridValue(v) {
     const g = this.snap.grid;
-    if (!g || g <= 0 || !origin) return { dx, dy };
-    const target = this.snapPoint({ x: origin.x + dx, y: origin.y + dy });
-    return { dx: target.x - origin.x, dy: target.y - origin.y };
+    return g > 0 ? Math.round(v / g) * g : v;
+  }
+  snapPoint(p) {
+    return { x: this.gridValue(p.x), y: this.gridValue(p.y) };
+  }
+  /** The pull distance in document units. */
+  snapTolerance() {
+    return this.snap.threshold / this.viewport.zoom;
+  }
+  setGuides(guides) {
+    this.guides = guides && this.snap.guides && (guides.lines.length || guides.labels.length) ? guides : null;
+  }
+  /**
+   * Where a drawn or dragged point `p` goes: onto the smart guide `targets` (gathered by
+   * `gather` when missing), else onto the grid, kept to `leave`'s constraint. Cmd / Ctrl
+   * bypasses snapping.
+   */
+  snapDrawn(p, leave, input, targets) {
+    this.snappedToObject = false;
+    if (input.mod) {
+      this.setGuides(null);
+      return constrainToLeave(leave, p);
+    }
+    if (this.snap.objects) {
+      const withAngles = leave ? { ...leave, angles: this.snap.angles } : null;
+      const res = targets().snapFrom(p, withAngles, this.snapTolerance());
+      if (res.kind) {
+        this.snappedToObject = true;
+        this.setGuides(res);
+        return _optionalChain([leave, 'optionalAccess', _60 => _60.constrain]) ? res.point : { x: res.x ? res.point.x : this.gridValue(res.point.x), y: res.y ? res.point.y : this.gridValue(res.point.y) };
+      }
+    }
+    this.setGuides(null);
+    return constrainToLeave(leave, this.snapPoint(p));
+  }
+  /** Drawing targets for the pen and shape tools, reused while the document stays the same. */
+  drawingTargets(exclude) {
+    const key = _nullishCoalesce(exclude, () => ( ""));
+    const cached = this.hoverTargets;
+    if (cached && cached.doc === this.doc && cached.exclude === key) return cached.targets;
+    const targets = VectorSnapTargets.forDrawing(this.doc, exclude ? [exclude] : []);
+    this.hoverTargets = { doc: this.doc, exclude: key, targets };
+    return targets;
+  }
+  /** Where the pointer at `p` would place a point with the pen or a shape tool (and the guides showing why). */
+  hoverSnap(p, input) {
+    if (this.tool === "pen") {
+      const sp = this.pen ? _optionalChain([this, 'access', _61 => _61.getNode, 'call', _62 => _62(this.pen.nodeId), 'optionalAccess', _63 => _63.subpaths, 'access', _64 => _64[this.pen.subpath]]) : void 0;
+      if (this.pen && sp && _optionalChain([this, 'access', _65 => _65.hover, 'optionalAccess', _66 => _66.anchor])) {
+        this.setGuides(null);
+        return p;
+      }
+      const last = this.pen && sp ? getAnchorWorld(this.doc, { nodeId: this.pen.nodeId, subpath: this.pen.subpath, index: sp.anchors.length - 1 }) : void 0;
+      const leave = last ? { at: { x: last.x, y: last.y }, constrain: input.shift ? "angle" : null } : null;
+      return this.snapDrawn(p, leave, input, () => this.drawingTargets(_nullishCoalesce(_optionalChain([this, 'access', _67 => _67.pen, 'optionalAccess', _68 => _68.nodeId]), () => ( null))));
+    }
+    if (this.tool !== "select" && this.tool !== "direct" && this.tool !== "pencil") return this.snapDrawn(p, null, input, () => this.drawingTargets(null));
+    this.setGuides(null);
+    return p;
   }
   // -------------------------------------------------------------------------
   // Document
@@ -1566,10 +2383,10 @@ var VectorEditorController = (_class = class {
     return this.selection.filter((id) => {
       let covered = false;
       const loc = locateVectorNode(this.doc.nodes, id);
-      let parent = _nullishCoalesce(_optionalChain([loc, 'optionalAccess', _41 => _41.parent]), () => ( null));
+      let parent = _nullishCoalesce(_optionalChain([loc, 'optionalAccess', _69 => _69.parent]), () => ( null));
       while (parent) {
         if (this.selection.includes(parent.id)) covered = true;
-        parent = _nullishCoalesce(_optionalChain([locateVectorNode, 'call', _42 => _42(this.doc.nodes, parent.id), 'optionalAccess', _43 => _43.parent]), () => ( null));
+        parent = _nullishCoalesce(_optionalChain([locateVectorNode, 'call', _70 => _70(this.doc.nodes, parent.id), 'optionalAccess', _71 => _71.parent]), () => ( null));
       }
       return !covered;
     });
@@ -1752,8 +2569,8 @@ var VectorEditorController = (_class = class {
     if (!ids.length) return null;
     const locs = ids.map((id2) => locateVectorNode(this.doc.nodes, id2));
     if (locs.some((l) => !l)) return null;
-    const parent = _nullishCoalesce(_optionalChain([locs, 'access', _44 => _44[0], 'access', _45 => _45.parent, 'optionalAccess', _46 => _46.id]), () => ( null));
-    if (locs.some((l) => (_nullishCoalesce(_optionalChain([l, 'access', _47 => _47.parent, 'optionalAccess', _48 => _48.id]), () => ( null))) !== parent)) return null;
+    const parent = _nullishCoalesce(_optionalChain([locs, 'access', _72 => _72[0], 'access', _73 => _73.parent, 'optionalAccess', _74 => _74.id]), () => ( null));
+    if (locs.some((l) => (_nullishCoalesce(_optionalChain([l, 'access', _75 => _75.parent, 'optionalAccess', _76 => _76.id]), () => ( null))) !== parent)) return null;
     const id = this.newId();
     this.change("Group", () => {
       const set = new Set(ids);
@@ -1776,7 +2593,7 @@ var VectorEditorController = (_class = class {
   }
   /** Replaces selected groups with their children. */
   ungroup(options = {}) {
-    const groups = (_nullishCoalesce(options.ids, () => ( this.selection))).map((id) => this.getNode(id)).filter((n) => _optionalChain([n, 'optionalAccess', _49 => _49.type]) === "group");
+    const groups = (_nullishCoalesce(options.ids, () => ( this.selection))).map((id) => this.getNode(id)).filter((n) => _optionalChain([n, 'optionalAccess', _77 => _77.type]) === "group");
     if (!groups.length) return { ok: false, message: "Select a group to ungroup." };
     const set = new Set(groups.map((g) => g.id));
     this.change("Ungroup", () => {
@@ -1836,7 +2653,7 @@ var VectorEditorController = (_class = class {
     });
     const paths = [...new Set(order)].map((id2) => this.getNode(id2));
     if (paths.length < 2) return null;
-    const result = _chunkM4XE4UMTcjs.pathBoolean.call(void 0, 
+    const result = _chunkUG5DVXJKcjs.pathBoolean.call(void 0, 
       BOOLEAN_OPS[op],
       paths.map((p) => ({
         path: vectorPathWorldBezier(
@@ -1886,11 +2703,11 @@ var VectorEditorController = (_class = class {
   /** A document-space path mapped into the parent space of node `id`. */
   intoParentSpace(id, path) {
     const parent = _nullishCoalesce(vectorParentMatrix(this.doc.nodes, id), () => ( IDENTITY_MATRIX));
-    return isRoot(parent) ? path : _chunkM4XE4UMTcjs.transformBezierPath.call(void 0, path, invertMatrix(parent));
+    return isRoot(parent) ? path : _chunkUG5DVXJKcjs.transformBezierPath.call(void 0, path, invertMatrix(parent));
   }
   /** Splits selected compound paths into one path per subpath. */
   breakApart(options = {}) {
-    const paths = (_nullishCoalesce(options.ids, () => ( this.selection))).map((id) => this.getNode(id)).filter((n) => _optionalChain([n, 'optionalAccess', _50 => _50.type]) === "path" && n.subpaths.length > 1);
+    const paths = (_nullishCoalesce(options.ids, () => ( this.selection))).map((id) => this.getNode(id)).filter((n) => _optionalChain([n, 'optionalAccess', _78 => _78.type]) === "path" && n.subpaths.length > 1);
     if (!paths.length) return { ok: false, message: "Select a compound path to break apart." };
     const created = [];
     const set = new Set(paths.map((p) => p.id));
@@ -1972,7 +2789,7 @@ var VectorEditorController = (_class = class {
   /** Adds an anchor on the nearest segment of `nodeId` to document point `point` (shape unchanged). */
   insertAnchorAt(nodeId, point) {
     const node = this.getNode(nodeId);
-    if (_optionalChain([node, 'optionalAccess', _51 => _51.type]) !== "path") return null;
+    if (_optionalChain([node, 'optionalAccess', _79 => _79.type]) !== "path") return null;
     const hit = nearestSegment(node, this.toLocal(nodeId, point));
     if (!hit) return null;
     const { subpath, index } = insertAnchor(node.subpaths[hit.subpath], hit.segment, hit.t);
@@ -2007,7 +2824,7 @@ var VectorEditorController = (_class = class {
   setClosed(closed, nodeId) {
     const targets = nodeId ? (() => {
       const n = this.getNode(nodeId);
-      return _optionalChain([n, 'optionalAccess', _52 => _52.type]) === "path" ? n.subpaths.map((_, s) => ({ nodeId, subpath: s })) : [];
+      return _optionalChain([n, 'optionalAccess', _80 => _80.type]) === "path" ? n.subpaths.map((_, s) => ({ nodeId, subpath: s })) : [];
     })() : this.anchors.map((r) => ({ nodeId: r.nodeId, subpath: r.subpath }));
     if (!targets.length) return { ok: false, message: "Select a path or points." };
     this.change(closed ? "Close Path" : "Open Path", () => {
@@ -2034,7 +2851,7 @@ var VectorEditorController = (_class = class {
   finishPath() {
     if (!this.pen) return;
     const node = this.getNode(this.pen.nodeId);
-    const sp = _optionalChain([node, 'optionalAccess', _53 => _53.subpaths, 'access', _54 => _54[this.pen.subpath]]);
+    const sp = _optionalChain([node, 'optionalAccess', _81 => _81.subpaths, 'access', _82 => _82[this.pen.subpath]]);
     const pen = this.pen;
     this.pen = null;
     this.pointer = null;
@@ -2078,7 +2895,7 @@ var VectorEditorController = (_class = class {
       if (trimmed.startsWith("{")) {
         try {
           const data = JSON.parse(trimmed);
-          if (_optionalChain([data, 'optionalAccess', _55 => _55.type]) === VECTOR_CLIPBOARD_TYPE && Array.isArray(data.nodes)) nodes = data.nodes;
+          if (_optionalChain([data, 'optionalAccess', _83 => _83.type]) === VECTOR_CLIPBOARD_TYPE && Array.isArray(data.nodes)) nodes = data.nodes;
         } catch (e2) {
           nodes = null;
         }
@@ -2090,7 +2907,7 @@ var VectorEditorController = (_class = class {
         }
       }
     } else nodes = this.clipboard;
-    if (!_optionalChain([nodes, 'optionalAccess', _56 => _56.length])) return [];
+    if (!_optionalChain([nodes, 'optionalAccess', _84 => _84.length])) return [];
     const offset = _nullishCoalesce(options.offset, () => ( (text && !text.trim().startsWith("{") ? { x: 0, y: 0 } : { x: 10, y: 10 })));
     const copies = nodes.map((n) => transformVectorNode(this.freshIds(n), translateMatrix(offset.x, offset.y)));
     this.change("Paste", () => {
@@ -2141,7 +2958,7 @@ var VectorEditorController = (_class = class {
   hitHandle(screen) {
     for (const ref of getVisibleHandles(this.view()).reverse()) {
       const a = getAnchorWorld(this.doc, ref);
-      const h = _optionalChain([a, 'optionalAccess', _57 => _57[ref.handle]]);
+      const h = _optionalChain([a, 'optionalAccess', _85 => _85[ref.handle]]);
       if (!h) continue;
       const s = this.documentToScreen(h);
       if (Math.hypot(s.x - screen.x, s.y - screen.y) <= this.hitRadius) return ref;
@@ -2251,7 +3068,7 @@ var VectorEditorController = (_class = class {
       case "pencil":
         return this.downPencil(p);
       default:
-        return this.downShape(p);
+        return this.downShape(p, input);
     }
   }
   downSelect(screen, p, input) {
@@ -2320,7 +3137,7 @@ var VectorEditorController = (_class = class {
           return;
         }
       } else if (!selected) this.anchors = [anchor];
-      this.drag = { kind: "anchors", start: p, before: this.snapshot(), base: this.doc, moved: false, clickRef: selected && !input.shift ? anchor : null };
+      this.drag = { kind: "anchors", start: p, before: this.snapshot(), base: this.doc, moved: false, clickRef: selected && !input.shift ? anchor : null, lead: anchor };
       this.notify();
       return;
     }
@@ -2336,7 +3153,7 @@ var VectorEditorController = (_class = class {
         const ref = { nodeId: id, subpath: seg.subpath, index };
         this.anchors = [ref];
         this.editingId = id;
-        this.drag = { kind: "anchors", start: p, before, base: this.doc, moved: true, clickRef: null };
+        this.drag = { kind: "anchors", start: p, before, base: this.doc, moved: true, clickRef: null, lead: ref };
         this.notify(true);
         return;
       }
@@ -2344,7 +3161,7 @@ var VectorEditorController = (_class = class {
       const b = { nodeId: id, subpath: seg.subpath, index: (seg.segment + 1) % sp.anchors.length };
       this.anchors = input.shift ? [...this.anchors.filter((r) => !sameRef(r, a) && !sameRef(r, b)), a, b] : [a, b];
       this.editingId = id;
-      this.drag = { kind: "anchors", start: p, before: this.snapshot(), base: this.doc, moved: false, clickRef: null };
+      this.drag = { kind: "anchors", start: p, before: this.snapshot(), base: this.doc, moved: false, clickRef: null, lead: null };
       this.notify();
       return;
     }
@@ -2354,7 +3171,7 @@ var VectorEditorController = (_class = class {
       if (!input.shift) this.selection = [path.id];
       else if (!this.selection.includes(path.id)) this.selection = [...this.selection, path.id];
       this.anchors = path.subpaths.flatMap((sp, s) => sp.anchors.map((_, i) => ({ nodeId: path.id, subpath: s, index: i })));
-      this.drag = { kind: "anchors", start: p, before: this.snapshot(), base: this.doc, moved: false, clickRef: null };
+      this.drag = { kind: "anchors", start: p, before: this.snapshot(), base: this.doc, moved: false, clickRef: null, lead: null };
       this.notify();
       return;
     }
@@ -2367,7 +3184,7 @@ var VectorEditorController = (_class = class {
   }
   downPen(screen, p, input) {
     const before = this.snapshot();
-    const sp = this.pen ? _optionalChain([this, 'access', _58 => _58.getNode, 'call', _59 => _59(this.pen.nodeId), 'optionalAccess', _60 => _60.subpaths, 'access', _61 => _61[this.pen.subpath]]) : void 0;
+    const sp = this.pen ? _optionalChain([this, 'access', _86 => _86.getNode, 'call', _87 => _87(this.pen.nodeId), 'optionalAccess', _88 => _88.subpaths, 'access', _89 => _89[this.pen.subpath]]) : void 0;
     if (this.pen && sp) {
       const pen = this.pen;
       const first = { nodeId: pen.nodeId, subpath: pen.subpath, index: 0 };
@@ -2379,9 +3196,9 @@ var VectorEditorController = (_class = class {
         this.notify(true);
         return;
       }
-      let pt2 = this.snapPoint(p);
       const last = getAnchorWorld(this.doc, { nodeId: pen.nodeId, subpath: pen.subpath, index: sp.anchors.length - 1 });
-      if (input.shift) pt2 = constrain45(last, pt2);
+      const leave = { at: { x: last.x, y: last.y }, constrain: input.shift ? "angle" : null };
+      let pt2 = this.snapDrawn(p, leave, input, () => this.drawingTargets(pen.nodeId));
       pt2 = this.toLocal(pen.nodeId, pt2);
       const node2 = this.getNode(pen.nodeId);
       const anchors = [...sp.anchors, { x: pt2.x, y: pt2.y }];
@@ -2412,7 +3229,7 @@ var VectorEditorController = (_class = class {
       this.notify(this.doc !== before.doc);
       return;
     }
-    const pt = this.snapPoint(p);
+    const pt = this.snapDrawn(p, null, input, () => this.drawingTargets(null));
     const node = { id: this.newId(), type: "path", name: "Path", ...this.styleFor(true), subpaths: [{ anchors: [{ x: pt.x, y: pt.y }], closed: false }] };
     this.setDoc([...this.doc.nodes, node]);
     this.pen = { nodeId: node.id, subpath: 0 };
@@ -2440,13 +3257,14 @@ var VectorEditorController = (_class = class {
     this.interaction = { type: "draw", tool: "pencil", nodeId: node.id, bounds: { x: p.x, y: p.y, width: 0, height: 0 } };
     this.notify(true);
   }
-  downShape(p) {
+  downShape(p, input) {
     const before = this.snapshot();
-    const start = this.snapPoint(p);
+    const targets = this.drawingTargets(null);
+    const start = this.snapDrawn(p, null, input, () => targets);
     const kind = this.tool;
     const node = this.createShapeNode({ kind, x: start.x, y: start.y, width: 0, height: 0 });
     this.setDoc([...this.doc.nodes, node]);
-    this.drag = { kind: "shape", tool: this.tool, start, nodeId: node.id, before };
+    this.drag = { kind: "shape", tool: this.tool, start, nodeId: node.id, before, targets };
     this.interaction = { type: "draw", tool: this.tool, nodeId: node.id, bounds: { x: start.x, y: start.y, width: 0, height: 0 } };
     this.notify(true);
   }
@@ -2457,9 +3275,11 @@ var VectorEditorController = (_class = class {
     if (!drag) {
       const hover = this.computeHover(screen);
       const pointerMatters = this.tool === "pen" && !!this.pen;
-      if (this.sameHover(hover, this.hover) && !pointerMatters) return;
+      const guides = this.guides;
       this.hover = hover;
-      this.pointer = p;
+      const pointer = this.hoverSnap(p, input);
+      if (this.sameHover(hover, this.state.hover) && !pointerMatters && JSON.stringify(guides) === JSON.stringify(this.guides)) return;
+      this.pointer = pointer;
       this.notify();
       return;
     }
@@ -2480,8 +3300,9 @@ var VectorEditorController = (_class = class {
           const created = [];
           drag.base = this.withDuplicates(drag.base, this.selectedRoots(), { x: 0, y: 0 }, created);
           this.selection = created;
+          drag.targets = void 0;
         }
-        ({ dx, dy } = this.snapDelta(dx, dy, drag.origin));
+        ({ dx, dy } = this.snapMove(drag, dx, dy, input));
         this.doc = this.transformed(drag.base, new Set(this.selectedRoots()), translateMatrix(dx, dy));
         this.interaction = { type: "move", dx, dy };
         this.notify(true);
@@ -2490,7 +3311,13 @@ var VectorEditorController = (_class = class {
       case "scale": {
         const angle = drag.frame.angle;
         const q = angle ? applyMatrix(rotateMatrix(-angle), p) : p;
-        const { sx, sy, origin } = scaleFor(drag.handle, drag.frame, q, input);
+        let { sx, sy, origin } = scaleFor(drag.handle, drag.frame, q, input);
+        if (this.snap.objects && !input.mod && drag.handle !== "rotate") {
+          drag.targets ??= VectorSnapTargets.forResize(drag.base, this.selectedRoots());
+          const res = drag.targets.snapScale(drag.frame, drag.handle, sx, sy, input, this.snapTolerance());
+          ({ sx, sy } = res);
+          this.setGuides(res);
+        } else this.setGuides(null);
         const ids = new Set(this.selectedRoots());
         this.doc = this.transformed(drag.base, ids, this.inFrame(angle, scaleMatrix(sx, sy, origin)));
         this.interaction = { type: "scale", handle: drag.handle, sx, sy };
@@ -2531,9 +3358,13 @@ var VectorEditorController = (_class = class {
         let dy = p.y - drag.start.y;
         if (!drag.moved && Math.hypot(dx, dy) * this.viewport.zoom < 2) return;
         drag.moved = true;
-        if (input.shift) Math.abs(dx) > Math.abs(dy) ? dy = 0 : dx = 0;
-        const lead = this.anchors.length ? getAnchorWorld(drag.base, this.anchors[0]) : void 0;
-        ({ dx, dy } = this.snapDelta(dx, dy, _nullishCoalesce(lead, () => ( null))));
+        const lead = this.leadAnchor(drag);
+        if (lead) {
+          const leave = input.shift ? { at: lead, constrain: "axis", curves: false } : null;
+          const q = this.snapDrawn({ x: lead.x + dx, y: lead.y + dy }, leave, input, () => drag.targets ??= VectorSnapTargets.forAnchorDrag(drag.base, this.anchors));
+          dx = q.x - lead.x;
+          dy = q.y - lead.y;
+        } else if (input.shift) Math.abs(dx) > Math.abs(dy) ? dy = 0 : dx = 0;
         this.doc = this.movedAnchors(drag.base, this.anchors, dx, dy);
         this.interaction = { type: "anchors", dx, dy };
         this.notify(true);
@@ -2541,8 +3372,8 @@ var VectorEditorController = (_class = class {
       }
       case "handle": {
         const anchor = getAnchorWorld(drag.base, drag.ref);
-        let pt = this.snapPoint(p);
-        if (input.shift && anchor) pt = constrain45(anchor, pt);
+        const leave = anchor ? { at: { x: anchor.x, y: anchor.y }, constrain: input.shift ? "angle" : null } : null;
+        const pt = this.snapDrawn(p, leave, input, () => drag.targets ??= VectorSnapTargets.forHandle(drag.base, drag.ref.nodeId));
         const local = this.toLocal(drag.ref.nodeId, pt, drag.base);
         this.doc = this.updateAnchors(drag.base, [drag.ref], (a) => moveAnchorHandle(a, drag.ref.handle, local, input.alt));
         this.interaction = { type: "handle", ref: drag.ref };
@@ -2557,6 +3388,7 @@ var VectorEditorController = (_class = class {
           this.notify(true);
           return;
         }
+        this.guides = null;
         let pt = p;
         if (input.shift) pt = constrain45(anchor, pt);
         const side = drag.closing ? "in" : "out";
@@ -2570,8 +3402,10 @@ var VectorEditorController = (_class = class {
       }
       case "shape": {
         const node = this.getNode(drag.nodeId);
-        if (_optionalChain([node, 'optionalAccess', _62 => _62.type]) !== "path") return;
-        let end = this.snapPoint(p);
+        if (_optionalChain([node, 'optionalAccess', _90 => _90.type]) !== "path") return;
+        const leave = { at: drag.start, constrain: input.shift ? drag.tool === "line" ? "angle" : "square" : null, curves: false };
+        let end = this.snapDrawn(p, leave, input, () => drag.targets ??= this.drawingTargets(null));
+        if (!this.snappedToObject && drag.tool !== "line" && !input.shift && !input.mod && this.snap.objects && drag.targets) end = this.matchShapeSize(drag.targets, drag.start, end, input.alt);
         let start = drag.start;
         let bounds;
         if (drag.tool === "line") {
@@ -2602,7 +3436,7 @@ var VectorEditorController = (_class = class {
         if (Math.hypot(p.x - last[0], p.y - last[1]) * this.viewport.zoom < 1.5) return;
         drag.points.push([p.x, p.y]);
         const node = this.getNode(drag.nodeId);
-        if (_optionalChain([node, 'optionalAccess', _63 => _63.type]) !== "path") return;
+        if (_optionalChain([node, 'optionalAccess', _91 => _91.type]) !== "path") return;
         this.replaceNode(drag.nodeId, { ...node, subpaths: [{ anchors: drag.points.map(([x, y]) => ({ x, y })), closed: false }] });
         const xs = drag.points.map((q) => q[0]);
         const ys = drag.points.map((q) => q[1]);
@@ -2617,12 +3451,64 @@ var VectorEditorController = (_class = class {
       }
     }
   }
+  /** Snaps a move of the selection by (dx, dy): its bounds line up with targets or space evenly, else go to the grid. */
+  snapMove(drag, dx, dy, input) {
+    const origin = drag.origin;
+    if (input.mod || !origin) {
+      this.setGuides(null);
+      return { dx, dy };
+    }
+    const axes = { x: !input.shift || dx !== 0, y: !input.shift || dy !== 0 };
+    let res = null;
+    if (this.snap.objects) {
+      drag.targets ??= VectorSnapTargets.forMove(drag.base, this.selectedRoots());
+      res = drag.targets.snapRect({ ...origin, x: origin.x + dx, y: origin.y + dy }, this.snapTolerance(), { spacing: true, axes });
+    }
+    this.setGuides(res);
+    return {
+      dx: _optionalChain([res, 'optionalAccess', _92 => _92.x]) ? dx + res.dx : axes.x ? this.gridValue(origin.x + dx) - origin.x : dx,
+      dy: _optionalChain([res, 'optionalAccess', _93 => _93.y]) ? dy + res.dy : axes.y ? this.gridValue(origin.y + dy) - origin.y : dy
+    };
+  }
+  /** The anchor a point drag snaps by, where it started: the grabbed one, else the moving one nearest the press. */
+  leadAnchor(drag) {
+    const ref = drag.lead && this.anchors.some((a) => sameRef(a, drag.lead)) ? drag.lead : null;
+    if (ref) {
+      const a = getAnchorWorld(drag.base, ref);
+      return a ? { x: a.x, y: a.y } : null;
+    }
+    let best = null;
+    for (const r of this.anchors) {
+      const a = getAnchorWorld(drag.base, r);
+      if (a && (!best || Math.hypot(a.x - drag.start.x, a.y - drag.start.y) < Math.hypot(best.x - drag.start.x, best.y - drag.start.y))) best = { x: a.x, y: a.y };
+    }
+    return best;
+  }
+  /** A shape's dragged corner moved so its width or height matches another object's, when one is within reach. */
+  matchShapeSize(targets, start, end, fromCentre = false) {
+    const k = fromCentre ? 2 : 1;
+    const tol = this.snapTolerance() * k;
+    const out = { ...end };
+    const guides = { lines: [], labels: [] };
+    for (const axis of ["x", "y"]) {
+      const d = end[axis] - start[axis];
+      const len = Math.abs(d) > 1e-9 ? targets.matchSize(Math.abs(d) * k, tol) : null;
+      if (len === null || len <= 0) continue;
+      out[axis] = start[axis] + Math.sign(d) * len / k;
+      const from = { ...out, [axis]: fromCentre ? 2 * start[axis] - out[axis] : start[axis] };
+      guides.lines.push({ kind: "size", x1: from.x, y1: from.y, x2: out.x, y2: out.y });
+      guides.labels.push({ kind: "size", x: (from.x + out.x) / 2, y: (from.y + out.y) / 2, text: `${axis === "x" ? "W" : "H"} ${Math.round(len * 100) / 100}` });
+    }
+    this.setGuides(guides);
+    return out;
+  }
   /** Primary button released. */
   pointerUp(screen, input = {}) {
     if (screen && this.drag && this.drag.kind !== "pan") this.pointerMove(screen, input);
     const drag = this.drag;
     this.drag = null;
     this.interaction = null;
+    this.guides = null;
     if (!drag) return;
     switch (drag.kind) {
       case "pan":
@@ -2669,12 +3555,12 @@ var VectorEditorController = (_class = class {
       }
       case "pencil": {
         const node = this.getNode(drag.nodeId);
-        if (_optionalChain([node, 'optionalAccess', _64 => _64.type]) !== "path" || drag.points.length < 2) {
+        if (_optionalChain([node, 'optionalAccess', _94 => _94.type]) !== "path" || drag.points.length < 2) {
           this.doc = drag.before.doc;
           this.notify(true);
           return;
         }
-        const fitted = _chunkM4XE4UMTcjs.fitCubics.call(void 0, drag.points, 1.5 / this.viewport.zoom, { cornerAngleDeg: 60 });
+        const fitted = _chunkUG5DVXJKcjs.fitCubics.call(void 0, drag.points, 1.5 / this.viewport.zoom, { cornerAngleDeg: 60 });
         const anchors = [];
         for (const c of fitted) {
           if (!anchors.length) anchors.push({ x: c.p0[0], y: c.p0[1] });
@@ -2691,9 +3577,10 @@ var VectorEditorController = (_class = class {
   /** The pointer left the canvas. */
   pointerLeave() {
     if (this.drag) return;
-    if (!this.hover && !this.pointer) return;
+    if (!this.hover && !this.pointer && !this.guides) return;
     this.hover = null;
     this.pointer = null;
+    this.guides = null;
     this.notify();
   }
   /** Abandons the drag in progress (Escape, lost capture). */
@@ -2702,6 +3589,7 @@ var VectorEditorController = (_class = class {
     if (!drag) return;
     this.drag = null;
     this.interaction = null;
+    this.guides = null;
     if (drag.kind === "pan") {
       this.notify();
       return;
@@ -2734,7 +3622,7 @@ var VectorEditorController = (_class = class {
         this.convertAnchors(a.in || a.out ? "corner" : "smooth", [anchor]);
         return;
       }
-      const id = _nullishCoalesce(_optionalChain([this, 'access', _65 => _65.hover, 'optionalAccess', _66 => _66.segment, 'optionalAccess', _67 => _67.nodeId]), () => ( this.editingId));
+      const id = _nullishCoalesce(_optionalChain([this, 'access', _95 => _95.hover, 'optionalAccess', _96 => _96.segment, 'optionalAccess', _97 => _97.nodeId]), () => ( this.editingId));
       if (id) {
         const node = this.getNode(id);
         const seg = node ? nearestSegment(node, this.toLocal(id, p)) : null;
@@ -2812,7 +3700,7 @@ var VectorEditorController = (_class = class {
           this.finishPath();
           return true;
         }
-        if (this.tool === "select" && this.selection.length === 1 && _optionalChain([this, 'access', _68 => _68.getNode, 'call', _69 => _69(this.selection[0]), 'optionalAccess', _70 => _70.type]) === "path") {
+        if (this.tool === "select" && this.selection.length === 1 && _optionalChain([this, 'access', _98 => _98.getNode, 'call', _99 => _99(this.selection[0]), 'optionalAccess', _100 => _100.type]) === "path") {
           this.tool = "direct";
           this.editingId = this.selection[0];
           this.notify();
@@ -2857,7 +3745,7 @@ var VectorEditorController = (_class = class {
       this.notify();
     }
   }
-}, _class);
+}, _class2);
 function constrain45(origin, p) {
   const dx = p.x - origin.x;
   const dy = p.y - origin.y;
@@ -2910,7 +3798,7 @@ function renderNode(node, defs, idPrefix) {
     strokeWidth: _nullishCoalesce(node.strokeWidth, () => ( 1)),
     ...node.strokeLinecap ? { strokeLinecap: node.strokeLinecap } : {},
     ...node.strokeLinejoin ? { strokeLinejoin: node.strokeLinejoin } : {},
-    ..._optionalChain([node, 'access', _71 => _71.strokeDasharray, 'optionalAccess', _72 => _72.length]) ? { strokeDasharray: node.strokeDasharray.join(" ") } : {},
+    ..._optionalChain([node, 'access', _101 => _101.strokeDasharray, 'optionalAccess', _102 => _102.length]) ? { strokeDasharray: node.strokeDasharray.join(" ") } : {},
     fillRule: _nullishCoalesce(node.fillRule, () => ( "nonzero")),
     opacity: _nullishCoalesce(node.opacity, () => ( 1))
   };
@@ -2934,7 +3822,7 @@ function screenOutline(state, node) {
   const v = state.viewport;
   const view = [v.zoom, 0, 0, v.zoom, v.x, v.y];
   const parent = _nullishCoalesce(vectorParentMatrix(state.document.nodes, node.id), () => ( IDENTITY_MATRIX));
-  return collectWithMatrix(node, parent).map(({ path, parent: m }) => _chunkM4XE4UMTcjs.bezierPathToSvg.call(void 0, _chunkM4XE4UMTcjs.transformBezierPath.call(void 0, vectorPathWorldBezier(path, m), view), { precision: 2 })).join(" ");
+  return collectWithMatrix(node, parent).map(({ path, parent: m }) => _chunkUG5DVXJKcjs.bezierPathToSvg.call(void 0, _chunkUG5DVXJKcjs.transformBezierPath.call(void 0, vectorPathWorldBezier(path, m), view), { precision: 2 })).join(" ");
 }
 function collectWithMatrix(node, parent) {
   if (node.type === "path") return [{ path: node, parent }];
@@ -2959,9 +3847,9 @@ function getVectorOverlayRenderData(state) {
   };
   for (const id of state.selection) outline(id, true);
   if (state.editingId) outline(state.editingId, true);
-  if (_optionalChain([state, 'access', _73 => _73.hover, 'optionalAccess', _74 => _74.nodeId]) && !state.interaction) outline(state.hover.nodeId, false);
+  if (_optionalChain([state, 'access', _103 => _103.hover, 'optionalAccess', _104 => _104.nodeId]) && !state.interaction) outline(state.hover.nodeId, false);
   let selectionBox = null;
-  if (state.tool === "select" && state.selectionFrame && _optionalChain([state, 'access', _75 => _75.interaction, 'optionalAccess', _76 => _76.type]) !== "marquee") {
+  if (state.tool === "select" && state.selectionFrame && _optionalChain([state, 'access', _105 => _105.interaction, 'optionalAccess', _106 => _106.type]) !== "marquee") {
     const g = getVectorSelectionBoxGeometry(state.selectionFrame, state.viewport);
     selectionBox = { ...g.box, angle: g.angle, transform: g.transform, corners: g.corners, handles: g.handles };
   }
@@ -2971,9 +3859,9 @@ function getVectorOverlayRenderData(state) {
     const a = getAnchorWorld(doc, ref);
     const s = toScreen(state, a);
     const closes = !!state.pen && state.pen.nodeId === ref.nodeId && state.pen.subpath === ref.subpath && ref.index === 0;
-    return { ref, x: s.x, y: s.y, type: _nullishCoalesce(a.type, () => ( inferAnchorType(a))), selected: selected(ref), hovered: sameAnchor(_optionalChain([state, 'access', _77 => _77.hover, 'optionalAccess', _78 => _78.anchor]), ref), closes };
+    return { ref, x: s.x, y: s.y, type: _nullishCoalesce(a.type, () => ( inferAnchorType(a))), selected: selected(ref), hovered: sameAnchor(_optionalChain([state, 'access', _107 => _107.hover, 'optionalAccess', _108 => _108.anchor]), ref), closes };
   });
-  if (state.tool === "pen" && !state.pen && _optionalChain([state, 'access', _79 => _79.hover, 'optionalAccess', _80 => _80.anchor])) {
+  if (state.tool === "pen" && !state.pen && _optionalChain([state, 'access', _109 => _109.hover, 'optionalAccess', _110 => _110.anchor])) {
     const a = getAnchorWorld(doc, state.hover.anchor);
     if (a) {
       const s = toScreen(state, a);
@@ -2982,15 +3870,15 @@ function getVectorOverlayRenderData(state) {
   }
   const handles = getVisibleHandles(state).flatMap((ref) => {
     const a = getAnchorWorld(doc, ref);
-    const h = _optionalChain([a, 'optionalAccess', _81 => _81[ref.handle]]);
+    const h = _optionalChain([a, 'optionalAccess', _111 => _111[ref.handle]]);
     if (!a || !h) return [];
     const s = toScreen(state, h);
     const sa = toScreen(state, a);
-    const hovered = !!_optionalChain([state, 'access', _82 => _82.hover, 'optionalAccess', _83 => _83.handle]) && sameAnchor(state.hover.handle, ref) && state.hover.handle.handle === ref.handle;
+    const hovered = !!_optionalChain([state, 'access', _112 => _112.hover, 'optionalAccess', _113 => _113.handle]) && sameAnchor(state.hover.handle, ref) && state.hover.handle.handle === ref.handle;
     return [{ ref, x: s.x, y: s.y, anchorX: sa.x, anchorY: sa.y, hovered }];
   });
   let marquee = null;
-  if (_optionalChain([state, 'access', _84 => _84.interaction, 'optionalAccess', _85 => _85.type]) === "marquee") {
+  if (_optionalChain([state, 'access', _114 => _114.interaction, 'optionalAccess', _115 => _115.type]) === "marquee") {
     const b = state.interaction.bounds;
     const tl = toScreen(state, b);
     marquee = { x: tl.x, y: tl.y, width: b.width * z, height: b.height * z };
@@ -2998,7 +3886,7 @@ function getVectorOverlayRenderData(state) {
   let penPreview = null;
   if (state.tool === "pen" && state.pen && state.pointer && !state.interaction) {
     const node = findVectorNode(doc.nodes, state.pen.nodeId);
-    const sp = _optionalChain([node, 'optionalAccess', _86 => _86.type]) === "path" ? node.subpaths[state.pen.subpath] : void 0;
+    const sp = _optionalChain([node, 'optionalAccess', _116 => _116.type]) === "path" ? node.subpaths[state.pen.subpath] : void 0;
     const last = sp ? getAnchorWorld(doc, { nodeId: state.pen.nodeId, subpath: state.pen.subpath, index: sp.anchors.length - 1 }) : void 0;
     if (last) {
       const a = toScreen(state, last);
@@ -3011,16 +3899,30 @@ function getVectorOverlayRenderData(state) {
   const artboard = { x: origin.x, y: origin.y, width: doc.width * z, height: doc.height * z };
   let status = null;
   const it = state.interaction;
-  if (_optionalChain([it, 'optionalAccess', _87 => _87.type]) === "rotate") status = `${Math.round(it.angle)}\xB0`;
-  else if (_optionalChain([it, 'optionalAccess', _88 => _88.type]) === "move" || _optionalChain([it, 'optionalAccess', _89 => _89.type]) === "anchors") status = `\u0394 ${fmt(it.dx)}, ${fmt(it.dy)}`;
-  else if (_optionalChain([it, 'optionalAccess', _90 => _90.type]) === "scale" || _optionalChain([it, 'optionalAccess', _91 => _91.type]) === "draw") {
+  if (_optionalChain([it, 'optionalAccess', _117 => _117.type]) === "rotate") status = `${Math.round(it.angle)}\xB0`;
+  else if (_optionalChain([it, 'optionalAccess', _118 => _118.type]) === "move" || _optionalChain([it, 'optionalAccess', _119 => _119.type]) === "anchors") status = `\u0394 ${fmt(it.dx)}, ${fmt(it.dy)}`;
+  else if (_optionalChain([it, 'optionalAccess', _120 => _120.type]) === "scale" || _optionalChain([it, 'optionalAccess', _121 => _121.type]) === "draw") {
     const b = it.type === "draw" ? findVectorNode(doc.nodes, it.nodeId) ? vectorNodeBounds(findVectorNode(doc.nodes, it.nodeId)) : null : state.selectionFrame;
     if (b) status = `W ${fmt(b.width)} \xD7 H ${fmt(b.height)}`;
   }
-  return { outlines, selectionBox, anchors, handles, marquee, penPreview, artboard, status };
+  const guides = { lines: [], labels: [] };
+  if (state.guides) {
+    for (const l of state.guides.lines) {
+      const a = toScreen(state, { x: l.x1, y: l.y1 });
+      const b = toScreen(state, { x: l.x2, y: l.y2 });
+      guides.lines.push({ kind: l.kind, x1: fmt(a.x), y1: fmt(a.y), x2: fmt(b.x), y2: fmt(b.y) });
+    }
+    for (const l of state.guides.labels) {
+      const p = toScreen(state, l);
+      guides.labels.push({ kind: l.kind, x: fmt(p.x), y: fmt(p.y), text: l.text });
+    }
+  }
+  return { outlines, selectionBox, anchors, handles, marquee, penPreview, artboard, guides, status };
 }
 var VECTOR_OVERLAY_THEME = {
   accent: "#0ea5e9",
+  /** Smart guide lines and labels. */
+  guide: "#ff3dfc",
   handleFill: "#ffffff",
   marqueeFill: "rgba(14, 165, 233, 0.08)",
   transformHandleSize: 8,
@@ -3041,7 +3943,7 @@ function isVectorTextTarget(target) {
   if (!el || typeof el !== "object") return false;
   const tag = (_nullishCoalesce(el.tagName, () => ( ""))).toUpperCase();
   if (tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT") return true;
-  return !!el.isContentEditable || _optionalChain([el, 'access', _92 => _92.getAttribute, 'optionalCall', _93 => _93("contenteditable")]) === "true";
+  return !!el.isContentEditable || _optionalChain([el, 'access', _122 => _122.getAttribute, 'optionalCall', _123 => _123("contenteditable")]) === "true";
 }
 function getVectorSelectionStyle(state) {
   const paths = [];
@@ -3100,12 +4002,12 @@ function createVectorCommands(controller, options = {}) {
   const base = { group, ...options.scope ? { scope: options.scope } : {} };
   const hasSelection = () => controller.getState().selection.length ? true : "Nothing is selected.";
   const ids = (params) => {
-    const list2 = _nullishCoalesce(_optionalChain([params, 'optionalAccess', _94 => _94.ids]), () => ( controller.getState().selection));
+    const list2 = _nullishCoalesce(_optionalChain([params, 'optionalAccess', _124 => _124.ids]), () => ( controller.getState().selection));
     for (const id of list2) if (!controller.getNode(id)) fail(`There is no node "${id}".`);
     if (!list2.length) fail("Nothing is selected; pass ids.");
     return list2;
   };
-  const enabledFor = (_, params) => _optionalChain([params, 'optionalAccess', _95 => _95.ids, 'optionalAccess', _96 => _96.length]) ? true : hasSelection();
+  const enabledFor = (_, params) => _optionalChain([params, 'optionalAccess', _125 => _125.ids, 'optionalAccess', _126 => _126.length]) ? true : hasSelection();
   const list = () => {
     const state = controller.getState();
     const out = [];
@@ -3192,7 +4094,7 @@ function createVectorCommands(controller, options = {}) {
       run: (_ctx, params) => {
         const id = controller.addPath(params.d, { ...pickStyle(params), ...params.name ? { name: params.name } : {} });
         const node = controller.getNode(id);
-        if (_optionalChain([node, 'optionalAccess', _97 => _97.type]) === "path" && !node.subpaths.length) {
+        if (_optionalChain([node, 'optionalAccess', _127 => _127.type]) === "path" && !node.subpaths.length) {
           controller.undo();
           fail("The path data has no points.");
         }
@@ -3325,7 +4227,7 @@ function createVectorCommands(controller, options = {}) {
       enabled: enabledFor,
       undoable: true,
       run: (_ctx, params) => {
-        const id = controller.group({ ids: ids(params), name: _optionalChain([params, 'optionalAccess', _98 => _98.name]) });
+        const id = controller.group({ ids: ids(params), name: _optionalChain([params, 'optionalAccess', _128 => _128.name]) });
         if (!id) fail("Only nodes that share a parent can be grouped.");
         return { id };
       }
@@ -3364,7 +4266,7 @@ function createVectorCommands(controller, options = {}) {
       keywords: ["download", "save", "markup"],
       description: "Returns the document as SVG markup.",
       params: { type: "object", properties: { precision: { type: "integer", minimum: 0, maximum: 8 } } },
-      run: (_ctx, params) => ({ svg: controller.toSvg({ precision: _optionalChain([params, 'optionalAccess', _99 => _99.precision]) }) })
+      run: (_ctx, params) => ({ svg: controller.toSvg({ precision: _optionalChain([params, 'optionalAccess', _129 => _129.precision]) }) })
     },
     {
       ...base,
@@ -3467,5 +4369,9 @@ function createVectorCommands(controller, options = {}) {
 
 
 
-exports.IDENTITY_MATRIX = IDENTITY_MATRIX; exports.KAPPA = KAPPA; exports.VECTOR_CLIPBOARD_TYPE = VECTOR_CLIPBOARD_TYPE; exports.VECTOR_OVERLAY_THEME = VECTOR_OVERLAY_THEME; exports.VECTOR_ROTATE_HANDLE_OFFSET = VECTOR_ROTATE_HANDLE_OFFSET; exports.VECTOR_TOOLS = VECTOR_TOOLS; exports.VECTOR_TOOL_GLYPHS = VECTOR_TOOL_GLYPHS; exports.VECTOR_TOOL_SHORTCUTS = VECTOR_TOOL_SHORTCUTS; exports.VECTOR_TRANSFORM_HANDLES = VECTOR_TRANSFORM_HANDLES; exports.VectorEditorController = VectorEditorController; exports.applyMatrix = applyMatrix; exports.applyMatrixLinear = applyMatrixLinear; exports.bezierToSubpaths = bezierToSubpaths; exports.boundsFromPoints = boundsFromPoints; exports.boundsIntersect = boundsIntersect; exports.cloneAnchor = cloneAnchor; exports.cloneSubpath = cloneSubpath; exports.cloneVectorDocument = cloneVectorDocument; exports.cloneVectorNode = cloneVectorNode; exports.collectPathNodes = collectPathNodes; exports.convertAnchor = convertAnchor; exports.createVectorCommands = createVectorCommands; exports.decomposeRigid = decomposeRigid; exports.ellipseSubpath = ellipseSubpath; exports.findVectorNode = findVectorNode; exports.getAnchor = getAnchor; exports.getAnchorWorld = getAnchorWorld; exports.getEditablePathIds = getEditablePathIds; exports.getTransformHandlePositions = getTransformHandlePositions; exports.getVectorOverlayRenderData = getVectorOverlayRenderData; exports.getVectorSceneRenderData = getVectorSceneRenderData; exports.getVectorSelectionBoxGeometry = getVectorSelectionBoxGeometry; exports.getVectorSelectionFrame = getVectorSelectionFrame; exports.getVectorSelectionStyle = getVectorSelectionStyle; exports.getVisibleAnchors = getVisibleAnchors; exports.getVisibleHandles = getVisibleHandles; exports.hasPaint = hasPaint; exports.hitTestVectorNode = hitTestVectorNode; exports.hitTestVectorNodes = hitTestVectorNodes; exports.inferAnchorType = inferAnchorType; exports.insertAnchor = insertAnchor; exports.invertMatrix = invertMatrix; exports.isIdentityMatrix = isIdentityMatrix; exports.isVectorTextTarget = isVectorTextTarget; exports.lineSubpath = lineSubpath; exports.locateVectorNode = locateVectorNode; exports.matrixRotation = matrixRotation; exports.moveAnchorHandle = moveAnchorHandle; exports.multiplyMatrices = multiplyMatrices; exports.nearestSegment = nearestSegment; exports.nodeMatrix = nodeMatrix; exports.parseSvgTransform = parseSvgTransform; exports.parseVectorSvg = parseVectorSvg; exports.polygonSubpath = polygonSubpath; exports.rectSubpath = rectSubpath; exports.removeAnchors = removeAnchors; exports.reverseSubpath = reverseSubpath; exports.rotateMatrix = rotateMatrix; exports.roundSubpaths = roundSubpaths; exports.scaleFor = scaleFor; exports.scaleMatrix = scaleMatrix; exports.starSubpath = starSubpath; exports.subpathSegment = subpathSegment; exports.subpathSegmentCount = subpathSegmentCount; exports.subpathsToBezier = subpathsToBezier; exports.toVectorKeyInput = toVectorKeyInput; exports.toVectorModifiers = toVectorModifiers; exports.toVectorPointerInput = toVectorPointerInput; exports.transformVectorNode = transformVectorNode; exports.translateAnchor = translateAnchor; exports.translateMatrix = translateMatrix; exports.unionBounds = unionBounds; exports.vectorDocumentToSvg = vectorDocumentToSvg; exports.vectorNodeBounds = vectorNodeBounds; exports.vectorNodeRotation = vectorNodeRotation; exports.vectorNodeToBezier = vectorNodeToBezier; exports.vectorPaintToHex = vectorPaintToHex; exports.vectorPaintToSvg = vectorPaintToSvg; exports.vectorParentMatrix = vectorParentMatrix; exports.vectorPathData = vectorPathData; exports.vectorPathWorldBezier = vectorPathWorldBezier; exports.vectorResizeCursor = vectorResizeCursor; exports.vectorToolLabel = vectorToolLabel; exports.vectorWorldMatrix = vectorWorldMatrix; exports.walkVectorNodes = walkVectorNodes;
+
+
+
+
+exports.DEFAULT_VECTOR_SNAP = DEFAULT_VECTOR_SNAP; exports.IDENTITY_MATRIX = IDENTITY_MATRIX; exports.KAPPA = KAPPA; exports.VECTOR_CLIPBOARD_TYPE = VECTOR_CLIPBOARD_TYPE; exports.VECTOR_CONSTRUCTION_ANGLES = VECTOR_CONSTRUCTION_ANGLES; exports.VECTOR_OVERLAY_THEME = VECTOR_OVERLAY_THEME; exports.VECTOR_ROTATE_HANDLE_OFFSET = VECTOR_ROTATE_HANDLE_OFFSET; exports.VECTOR_TOOLS = VECTOR_TOOLS; exports.VECTOR_TOOL_GLYPHS = VECTOR_TOOL_GLYPHS; exports.VECTOR_TOOL_SHORTCUTS = VECTOR_TOOL_SHORTCUTS; exports.VECTOR_TRANSFORM_HANDLES = VECTOR_TRANSFORM_HANDLES; exports.VectorEditorController = VectorEditorController; exports.VectorSnapTargets = VectorSnapTargets; exports.applyMatrix = applyMatrix; exports.applyMatrixLinear = applyMatrixLinear; exports.bezierToSubpaths = bezierToSubpaths; exports.boundsFromPoints = boundsFromPoints; exports.boundsIntersect = boundsIntersect; exports.cloneAnchor = cloneAnchor; exports.cloneSubpath = cloneSubpath; exports.cloneVectorDocument = cloneVectorDocument; exports.cloneVectorNode = cloneVectorNode; exports.collectPathNodes = collectPathNodes; exports.constrainToLeave = constrainToLeave; exports.convertAnchor = convertAnchor; exports.createVectorCommands = createVectorCommands; exports.decomposeRigid = decomposeRigid; exports.ellipseSubpath = ellipseSubpath; exports.findVectorNode = findVectorNode; exports.getAnchor = getAnchor; exports.getAnchorWorld = getAnchorWorld; exports.getEditablePathIds = getEditablePathIds; exports.getTransformHandlePositions = getTransformHandlePositions; exports.getVectorOverlayRenderData = getVectorOverlayRenderData; exports.getVectorSceneRenderData = getVectorSceneRenderData; exports.getVectorSelectionBoxGeometry = getVectorSelectionBoxGeometry; exports.getVectorSelectionFrame = getVectorSelectionFrame; exports.getVectorSelectionStyle = getVectorSelectionStyle; exports.getVisibleAnchors = getVisibleAnchors; exports.getVisibleHandles = getVisibleHandles; exports.hasPaint = hasPaint; exports.hitTestVectorNode = hitTestVectorNode; exports.hitTestVectorNodes = hitTestVectorNodes; exports.inferAnchorType = inferAnchorType; exports.insertAnchor = insertAnchor; exports.invertMatrix = invertMatrix; exports.isIdentityMatrix = isIdentityMatrix; exports.isVectorTextTarget = isVectorTextTarget; exports.lineSubpath = lineSubpath; exports.locateVectorNode = locateVectorNode; exports.matrixRotation = matrixRotation; exports.moveAnchorHandle = moveAnchorHandle; exports.multiplyMatrices = multiplyMatrices; exports.nearestSegment = nearestSegment; exports.nodeMatrix = nodeMatrix; exports.parseSvgTransform = parseSvgTransform; exports.parseVectorSvg = parseVectorSvg; exports.polygonSubpath = polygonSubpath; exports.rectSubpath = rectSubpath; exports.removeAnchors = removeAnchors; exports.reverseSubpath = reverseSubpath; exports.rotateMatrix = rotateMatrix; exports.roundSubpaths = roundSubpaths; exports.scaleFor = scaleFor; exports.scaleMatrix = scaleMatrix; exports.starSubpath = starSubpath; exports.subpathSegment = subpathSegment; exports.subpathSegmentCount = subpathSegmentCount; exports.subpathsToBezier = subpathsToBezier; exports.toVectorKeyInput = toVectorKeyInput; exports.toVectorModifiers = toVectorModifiers; exports.toVectorPointerInput = toVectorPointerInput; exports.transformVectorNode = transformVectorNode; exports.translateAnchor = translateAnchor; exports.translateMatrix = translateMatrix; exports.unionBounds = unionBounds; exports.vectorDocumentToSvg = vectorDocumentToSvg; exports.vectorNodeBounds = vectorNodeBounds; exports.vectorNodeRotation = vectorNodeRotation; exports.vectorNodeToBezier = vectorNodeToBezier; exports.vectorPaintToHex = vectorPaintToHex; exports.vectorPaintToSvg = vectorPaintToSvg; exports.vectorParentMatrix = vectorParentMatrix; exports.vectorPathData = vectorPathData; exports.vectorPathWorldBezier = vectorPathWorldBezier; exports.vectorResizeCursor = vectorResizeCursor; exports.vectorToolLabel = vectorToolLabel; exports.vectorWorldMatrix = vectorWorldMatrix; exports.walkVectorNodes = walkVectorNodes;
 //# sourceMappingURL=index.cjs.map