@pixerate/editor 0.21.0 → 0.22.0

package/dist/canvas/index.js

@@ -1705,11 +1705,1183 @@ function matchArrangeShortcut(event, bindings = DEFAULT_ARRANGE_SHORTCUTS) {
   return null;
 }
 
+// src/canvas/polygonBoolean.ts
+function ringSignedArea(ring) {
+  let sum = 0;
+  const n = ring.length;
+  for (let i = 0; i < n; i++) {
+    const [x1, y1] = ring[i];
+    const [x2, y2] = ring[(i + 1) % n];
+    sum += x1 * y2 - x2 * y1;
+  }
+  return sum / 2;
+}
+function polygonArea(polygon) {
+  if (polygon.length === 0) return 0;
+  let area = Math.abs(ringSignedArea(polygon[0]));
+  for (let i = 1; i < polygon.length; i++) area -= Math.abs(ringSignedArea(polygon[i]));
+  return area;
+}
+function multiPolygonArea(multi) {
+  let total = 0;
+  for (const polygon of multi) total += polygonArea(polygon);
+  return total;
+}
+function multiPolygonBounds(input) {
+  let minX = Infinity;
+  let minY = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  const visit = (ring) => {
+    for (const [x, y] of ring) {
+      if (x < minX) minX = x;
+      if (y < minY) minY = y;
+      if (x > maxX) maxX = x;
+      if (y > maxY) maxY = y;
+    }
+  };
+  for (const item of input) {
+    if (item.length > 0 && Array.isArray(item[0]) && Array.isArray(item[0][0])) {
+      for (const ring of item) visit(ring);
+    } else {
+      visit(item);
+    }
+  }
+  return minX === Infinity ? null : { minX, minY, maxX, maxY };
+}
+function pointInRings(point, rings, fillRule = "nonzero") {
+  const [px, py] = point;
+  let winding = 0;
+  for (const ring of rings) {
+    const n = ring.length;
+    for (let i = 0; i < n; i++) {
+      const [ax, ay] = ring[i];
+      const [bx, by] = ring[(i + 1) % n];
+      if (ay <= py && by > py) {
+        if (ax + (py - ay) / (by - ay) * (bx - ax) > px) winding++;
+      } else if (by <= py && ay > py) {
+        if (ax + (py - ay) / (by - ay) * (bx - ax) > px) winding--;
+      }
+    }
+  }
+  return fillRule === "evenodd" ? (winding & 1) === 1 : winding !== 0;
+}
+function pointInMultiPolygon(point, multi) {
+  return multi.some((polygon) => pointInRings(point, polygon, "evenodd"));
+}
+function cleanRing(ring) {
+  const out = [];
+  for (const p of ring) {
+    if (!Number.isFinite(p[0]) || !Number.isFinite(p[1])) continue;
+    const last = out[out.length - 1];
+    if (last && last[0] === p[0] && last[1] === p[1]) continue;
+    out.push([p[0], p[1]]);
+  }
+  while (out.length > 1) {
+    const first = out[0];
+    const last = out[out.length - 1];
+    if (first[0] === last[0] && first[1] === last[1]) out.pop();
+    else break;
+  }
+  return out;
+}
+function isOperand(input) {
+  return !Array.isArray(input) && typeof input === "object" && input !== null && Array.isArray(input.rings);
+}
+function normalizeInput(input) {
+  if (isOperand(input)) {
+    return {
+      rings: input.rings.map(cleanRing).filter((r) => r.length >= 3),
+      fillRule: input.fillRule ?? "nonzero"
+    };
+  }
+  const rings = [];
+  for (const polygon of input ?? []) {
+    polygon.forEach((raw, index) => {
+      const ring = cleanRing(raw);
+      if (ring.length < 3) return;
+      const area = ringSignedArea(ring);
+      if (area === 0) return;
+      const wantPositive = index === 0;
+      rings.push(area > 0 === wantPositive ? ring : ring.reverse());
+    });
+  }
+  return { rings, fillRule: "nonzero" };
+}
+var PointPool = class {
+  constructor(eps) {
+    this.eps = eps;
+  }
+  eps;
+  vertices = [];
+  cells = /* @__PURE__ */ new Map();
+  get(x, y) {
+    const cx = Math.floor(x / this.eps);
+    const cy = Math.floor(y / this.eps);
+    let best = null;
+    let bestDist = Infinity;
+    for (let dx = -1; dx <= 1; dx++) {
+      for (let dy = -1; dy <= 1; dy++) {
+        const ids = this.cells.get(`${cx + dx},${cy + dy}`);
+        if (!ids) continue;
+        for (const id of ids) {
+          const v = this.vertices[id];
+          const d = Math.hypot(v.x - x, v.y - y);
+          if (d <= this.eps && d < bestDist) {
+            best = v;
+            bestDist = d;
+          }
+        }
+      }
+    }
+    if (best) return best;
+    const vertex = { id: this.vertices.length, x, y };
+    this.vertices.push(vertex);
+    const key = `${cx},${cy}`;
+    const bucket = this.cells.get(key);
+    if (bucket) bucket.push(vertex.id);
+    else this.cells.set(key, [vertex.id]);
+    return vertex;
+  }
+};
+function project(a, b, p) {
+  const dx = b.x - a.x;
+  const dy = b.y - a.y;
+  const len2 = dx * dx + dy * dy;
+  const t = len2 === 0 ? 0 : ((p.x - a.x) * dx + (p.y - a.y) * dy) / len2;
+  const cx = a.x + t * dx;
+  const cy = a.y + t * dy;
+  return { t, dist: Math.hypot(p.x - cx, p.y - cy) };
+}
+function addSplit(splits, t, v) {
+  const { a, b } = splits.segment;
+  if (v.id === a.id || v.id === b.id) return;
+  if (!splits.points.has(v.id)) splits.points.set(v.id, { t, v });
+}
+function splitPass(segments, pool, eps) {
+  const order = segments.map((s, i) => ({
+    i,
+    minX: Math.min(s.a.x, s.b.x),
+    maxX: Math.max(s.a.x, s.b.x),
+    minY: Math.min(s.a.y, s.b.y),
+    maxY: Math.max(s.a.y, s.b.y)
+  })).sort((p, q) => p.minX - q.minX);
+  const splits = segments.map((segment) => ({ segment, points: /* @__PURE__ */ new Map() }));
+  for (let oi = 0; oi < order.length; oi++) {
+    const bi = order[oi];
+    const s1 = segments[bi.i];
+    for (let oj = oi + 1; oj < order.length; oj++) {
+      const bj = order[oj];
+      if (bj.minX > bi.maxX + eps) break;
+      if (bj.minY > bi.maxY + eps || bj.maxY < bi.minY - eps) continue;
+      const s2 = segments[bj.i];
+      const sharedA = s1.a.id === s2.a.id || s1.a.id === s2.b.id;
+      const sharedB = s1.b.id === s2.a.id || s1.b.id === s2.b.id;
+      if (sharedA && sharedB) continue;
+      let touched = false;
+      for (const [seg, other, split] of [
+        [s1, s2, splits[bi.i]],
+        [s2, s1, splits[bj.i]]
+      ]) {
+        for (const p of [other.a, other.b]) {
+          if (p.id === seg.a.id || p.id === seg.b.id) continue;
+          const { t: t2, dist } = project(seg.a, seg.b, p);
+          const len = Math.hypot(seg.b.x - seg.a.x, seg.b.y - seg.a.y);
+          if (dist <= eps && t2 * len > eps && (1 - t2) * len > eps) {
+            addSplit(split, t2, p);
+            touched = true;
+          }
+        }
+      }
+      if (touched) continue;
+      const d1x = s1.b.x - s1.a.x;
+      const d1y = s1.b.y - s1.a.y;
+      const d2x = s2.b.x - s2.a.x;
+      const d2y = s2.b.y - s2.a.y;
+      const denom = d1x * d2y - d1y * d2x;
+      const len1 = Math.hypot(d1x, d1y);
+      const len2 = Math.hypot(d2x, d2y);
+      if (Math.abs(denom) <= 1e-12 * len1 * len2) continue;
+      const ex = s2.a.x - s1.a.x;
+      const ey = s2.a.y - s1.a.y;
+      const t = (ex * d2y - ey * d2x) / denom;
+      const u = (ex * d1y - ey * d1x) / denom;
+      const tolT = eps / len1;
+      const tolU = eps / len2;
+      if (t < -tolT || t > 1 + tolT || u < -tolU || u > 1 + tolU) continue;
+      if (sharedA || sharedB) continue;
+      const v = pool.get(s1.a.x + t * d1x, s1.a.y + t * d1y);
+      addSplit(splits[bi.i], project(s1.a, s1.b, v).t, v);
+      addSplit(splits[bj.i], project(s2.a, s2.b, v).t, v);
+    }
+  }
+  let changed = false;
+  const out = [];
+  for (const { segment, points } of splits) {
+    if (points.size === 0) {
+      out.push(segment);
+      continue;
+    }
+    changed = true;
+    const ordered = [...points.values()].sort((p, q) => p.t - q.t);
+    let prev = segment.a;
+    for (const { v } of ordered) {
+      if (v.id !== prev.id) out.push({ a: prev, b: v, operand: segment.operand });
+      prev = v;
+    }
+    if (prev.id !== segment.b.id) out.push({ a: prev, b: segment.b, operand: segment.operand });
+  }
+  return { segments: out, changed };
+}
+function defaultEpsilon(operands) {
+  let max = 0;
+  for (const op of operands) {
+    for (const ring of op.rings) {
+      for (const [x, y] of ring) {
+        const m = Math.max(Math.abs(x), Math.abs(y));
+        if (m > max) max = m;
+      }
+    }
+  }
+  return Math.max(1e-9, max * 1e-9);
+}
+function buildOverlay(inputs, options) {
+  const operands = inputs.map(normalizeInput);
+  const eps = options.epsilon && options.epsilon > 0 ? options.epsilon : defaultEpsilon(operands);
+  const pool = new PointPool(eps);
+  let segments = [];
+  operands.forEach((op, operand) => {
+    for (const ring of op.rings) {
+      const verts = ring.map(([x, y]) => pool.get(x, y));
+      for (let i = 0; i < verts.length; i++) {
+        const a = verts[i];
+        const b = verts[(i + 1) % verts.length];
+        if (a.id !== b.id) segments.push({ a, b, operand });
+      }
+    }
+  });
+  for (let pass = 0; pass < 8; pass++) {
+    const result = splitPass(segments, pool, eps);
+    segments = result.segments;
+    if (!result.changed) break;
+  }
+  const count = operands.length;
+  const byKey = /* @__PURE__ */ new Map();
+  for (const s of segments) {
+    const forward = s.a.id < s.b.id;
+    const a = forward ? s.a : s.b;
+    const b = forward ? s.b : s.a;
+    const key = `${a.id},${b.id}`;
+    let edge = byKey.get(key);
+    if (!edge) {
+      edge = { a, b, mult: new Array(count).fill(0) };
+      byKey.set(key, edge);
+    }
+    edge.mult[s.operand] += forward ? 1 : -1;
+  }
+  const edges = [...byKey.values()].filter((e) => e.mult.some((m) => m !== 0));
+  const right = [];
+  const left = [];
+  for (let i = 0; i < edges.length; i++) {
+    const edge = edges[i];
+    const horizontal = Math.abs(edge.b.y - edge.a.y) < Math.abs(edge.b.x - edge.a.x);
+    const tx = (v) => horizontal ? v.y : v.x;
+    const ty = (v) => horizontal ? -v.x : v.y;
+    const ax = tx(edge.a);
+    const ay = ty(edge.a);
+    const bx = tx(edge.b);
+    const by = ty(edge.b);
+    const mx = (ax + bx) / 2;
+    const my = (ay + by) / 2;
+    const winding = new Array(count).fill(0);
+    for (let j = 0; j < edges.length; j++) {
+      if (j === i) continue;
+      const other = edges[j];
+      const oax = tx(other.a);
+      const oay = ty(other.a);
+      const obx = tx(other.b);
+      const oby = ty(other.b);
+      let dir = 0;
+      if (oay <= my && oby > my) dir = 1;
+      else if (oby <= my && oay > my) dir = -1;
+      else continue;
+      const x = oax + (my - oay) / (oby - oay) * (obx - oax);
+      if (x <= mx) continue;
+      for (let k = 0; k < count; k++) {
+        if (other.mult[k] !== 0) winding[k] += dir * other.mult[k];
+      }
+    }
+    const sideIsRight = by > ay;
+    const r = sideIsRight ? winding : winding.map((w, k) => w - edge.mult[k]);
+    right.push(r);
+    left.push(r.map((w, k) => w + edge.mult[k]));
+  }
+  return { edges, right, left, fillRules: operands.map((o) => o.fillRule), eps };
+}
+function insideFlags(windings, fillRules) {
+  return windings.map((w, k) => fillRules[k] === "evenodd" ? (w & 1) === 1 : w !== 0);
+}
+function traceRings(directed) {
+  const outgoing = /* @__PURE__ */ new Map();
+  for (const e of directed) {
+    const list = outgoing.get(e.from.id);
+    if (list) list.push(e);
+    else outgoing.set(e.from.id, [e]);
+  }
+  const TWO_PI = Math.PI * 2;
+  const next = (incoming) => {
+    const candidates = outgoing.get(incoming.to.id);
+    if (!candidates) return void 0;
+    const back = Math.atan2(incoming.from.y - incoming.to.y, incoming.from.x - incoming.to.x);
+    let best;
+    let bestTurn = Infinity;
+    for (const c of candidates) {
+      let turn = back - c.angle;
+      turn -= Math.floor(turn / TWO_PI) * TWO_PI;
+      if (turn <= 1e-15) turn = TWO_PI;
+      if (turn < bestTurn) {
+        bestTurn = turn;
+        best = c;
+      }
+    }
+    return best;
+  };
+  const used = /* @__PURE__ */ new Set();
+  const rings = [];
+  for (const start of directed) {
+    if (used.has(start)) continue;
+    const ring = [];
+    let edge = start;
+    let guard = directed.length + 1;
+    while (edge && !used.has(edge) && guard-- > 0) {
+      used.add(edge);
+      ring.push(edge.from);
+      edge = next(edge);
+    }
+    if (ring.length >= 3) rings.push(ring);
+  }
+  return rings;
+}
+function removeCollinear(ring, eps) {
+  let points = ring;
+  let changed = true;
+  while (changed && points.length > 3) {
+    changed = false;
+    const out = [];
+    const n = points.length;
+    for (let i = 0; i < n; i++) {
+      const prev = out.length > 0 ? out[out.length - 1] : points[(i - 1 + n) % n];
+      const cur = points[i];
+      const nxt = points[(i + 1) % n];
+      const dx = nxt[0] - prev[0];
+      const dy = nxt[1] - prev[1];
+      const len = Math.hypot(dx, dy);
+      const cross = (cur[0] - prev[0]) * dy - (cur[1] - prev[1]) * dx;
+      const dot = (cur[0] - prev[0]) * dx + (cur[1] - prev[1]) * dy;
+      if (len > 0 && Math.abs(cross) / len <= eps && dot > 0 && dot < len * len) {
+        changed = true;
+        continue;
+      }
+      out.push(cur);
+    }
+    if (out.length < 3) return out;
+    points = out;
+  }
+  return points;
+}
+function assemble(rings, eps) {
+  const outers = [];
+  const holes = [];
+  const minArea = eps * eps;
+  for (const vertices of rings) {
+    const ring = removeCollinear(
+      vertices.map((v) => [v.x, v.y]),
+      eps
+    );
+    if (ring.length < 3) continue;
+    const area = ringSignedArea(ring);
+    if (Math.abs(area) <= minArea) continue;
+    (area > 0 ? outers : holes).push({ ring, area: Math.abs(area) });
+  }
+  outers.sort((a, b) => b.area - a.area);
+  const polygons = outers.map((o) => [o.ring]);
+  for (const hole of holes) {
+    const [p, q] = [hole.ring[0], hole.ring[1]];
+    const sample = [(p[0] + q[0]) / 2, (p[1] + q[1]) / 2];
+    let owner = -1;
+    for (let i = outers.length - 1; i >= 0; i--) {
+      if (outers[i].area >= hole.area && pointInRings(sample, [outers[i].ring], "evenodd")) {
+        owner = i;
+        break;
+      }
+    }
+    if (owner >= 0) polygons[owner].push(hole.ring);
+  }
+  return polygons;
+}
+function extract(overlay, isInside) {
+  const directed = [];
+  overlay.edges.forEach((edge, i) => {
+    const l = isInside(insideFlags(overlay.left[i], overlay.fillRules));
+    const r = isInside(insideFlags(overlay.right[i], overlay.fillRules));
+    if (l === r) return;
+    const [from, to] = l ? [edge.a, edge.b] : [edge.b, edge.a];
+    directed.push({ from, to, angle: Math.atan2(to.y - from.y, to.x - from.x) });
+  });
+  return assemble(traceRings(directed), overlay.eps);
+}
+function predicate(operation) {
+  switch (operation) {
+    case "union":
+      return (f) => f.some(Boolean);
+    case "intersection":
+      return (f) => f.length > 0 && f.every(Boolean);
+    case "difference":
+      return (f) => f[0] === true && !f.slice(1).some(Boolean);
+    case "xor":
+      return (f) => f.filter(Boolean).length % 2 === 1;
+  }
+}
+function polygonBoolean(operation, operands, options = {}) {
+  if (operands.length === 0) return [];
+  return extract(buildOverlay(operands, options), predicate(operation));
+}
+var unionPolygons = (a, b, options) => polygonBoolean("union", [a, b], options);
+var intersectPolygons = (a, b, options) => polygonBoolean("intersection", [a, b], options);
+var subtractPolygons = (a, b, options) => polygonBoolean("difference", [a, b], options);
+var xorPolygons = (a, b, options) => polygonBoolean("xor", [a, b], options);
+function dividePolygons(operands, options = {}) {
+  if (operands.length === 0) return [];
+  const overlay = buildOverlay(operands, options);
+  const signatures = /* @__PURE__ */ new Map();
+  const note = (windings) => {
+    const flags = insideFlags(windings, overlay.fillRules);
+    if (!flags.some(Boolean)) return;
+    const key = flags.map((f) => f ? "1" : "0").join("");
+    if (!signatures.has(key)) signatures.set(key, flags.flatMap((f, k) => f ? [k] : []));
+  };
+  overlay.edges.forEach((_, i) => {
+    note(overlay.left[i]);
+    note(overlay.right[i]);
+  });
+  const pieces = [];
+  const keys = [...signatures.keys()].sort();
+  for (const key of keys) {
+    const polygons = extract(overlay, (flags) => flags.map((f) => f ? "1" : "0").join("") === key);
+    polygons.sort((a, b) => polygonArea(b) - polygonArea(a));
+    for (const polygon of polygons) pieces.push({ polygon, operands: signatures.get(key) });
+  }
+  return pieces;
+}
+
+// src/canvas/shapeGeometry.ts
+var SHAPE_KINDS = ["rect", "ellipse", "polygon", "star", "path"];
+function isShapeDescription(value) {
+  if (!value || typeof value !== "object") return false;
+  const kind = value.kind;
+  if (!SHAPE_KINDS.includes(kind)) return false;
+  return kind !== "path" || typeof value.d === "string";
+}
+var PARAM_COUNTS = { m: 2, l: 2, h: 1, v: 1, c: 6, s: 4, q: 4, t: 2, a: 7, z: 0 };
+var PathScanner = class {
+  constructor(text) {
+    this.text = text;
+  }
+  text;
+  pos = 0;
+  skip() {
+    while (this.pos < this.text.length && /[\s,]/.test(this.text[this.pos])) this.pos++;
+  }
+  /** The next command letter, or `null` when a number (or the end) follows. */
+  command() {
+    this.skip();
+    const ch = this.text[this.pos];
+    if (ch && /[MmLlHhVvCcSsQqTtAaZz]/.test(ch)) {
+      this.pos++;
+      return ch;
+    }
+    return null;
+  }
+  done() {
+    this.skip();
+    return this.pos >= this.text.length;
+  }
+  number() {
+    this.skip();
+    const match = /^[+-]?(?:\d+\.?\d*|\.\d+)(?:[eE][+-]?\d+)?/.exec(this.text.slice(this.pos, this.pos + 64));
+    if (!match) return null;
+    this.pos += match[0].length;
+    const value = Number(match[0]);
+    return Number.isFinite(value) ? value : null;
+  }
+  flag() {
+    this.skip();
+    const ch = this.text[this.pos];
+    if (ch === "0" || ch === "1") {
+      this.pos++;
+      return ch === "1" ? 1 : 0;
+    }
+    return null;
+  }
+};
+function parseSvgPath(d) {
+  const scanner = new PathScanner(d ?? "");
+  const commands = [];
+  let cx = 0;
+  let cy = 0;
+  let startX = 0;
+  let startY = 0;
+  let lastControl = null;
+  let command = "";
+  while (!scanner.done()) {
+    const letter = scanner.command();
+    if (letter) {
+      command = letter;
+      if (command === "z" || command === "Z") {
+        commands.push({ type: "Z" });
+        cx = startX;
+        cy = startY;
+        lastControl = null;
+        continue;
+      }
+    } else if (!command || command === "z" || command === "Z") {
+      break;
+    }
+    const lower = command.toLowerCase();
+    const count = PARAM_COUNTS[lower];
+    const args = [];
+    for (let k = 0; k < count; k++) {
+      const value = lower === "a" && (k === 3 || k === 4) ? scanner.flag() : scanner.number();
+      if (value === null) return commands;
+      args.push(value);
+    }
+    const rel = command !== command.toUpperCase();
+    const ox = rel ? cx : 0;
+    const oy = rel ? cy : 0;
+    switch (lower) {
+      case "m": {
+        cx = args[0] + ox;
+        cy = args[1] + oy;
+        startX = cx;
+        startY = cy;
+        commands.push({ type: "M", x: cx, y: cy });
+        lastControl = null;
+        command = rel ? "l" : "L";
+        break;
+      }
+      case "l":
+        cx = args[0] + ox;
+        cy = args[1] + oy;
+        commands.push({ type: "L", x: cx, y: cy });
+        lastControl = null;
+        break;
+      case "h":
+        cx = args[0] + (rel ? cx : 0);
+        commands.push({ type: "L", x: cx, y: cy });
+        lastControl = null;
+        break;
+      case "v":
+        cy = args[0] + (rel ? cy : 0);
+        commands.push({ type: "L", x: cx, y: cy });
+        lastControl = null;
+        break;
+      case "c": {
+        const c = {
+          type: "C",
+          x1: args[0] + ox,
+          y1: args[1] + oy,
+          x2: args[2] + ox,
+          y2: args[3] + oy,
+          x: args[4] + ox,
+          y: args[5] + oy
+        };
+        commands.push(c);
+        lastControl = { x: c.x2, y: c.y2, type: "C" };
+        cx = c.x;
+        cy = c.y;
+        break;
+      }
+      case "s": {
+        const x1 = lastControl?.type === "C" ? 2 * cx - lastControl.x : cx;
+        const y1 = lastControl?.type === "C" ? 2 * cy - lastControl.y : cy;
+        const c = {
+          type: "C",
+          x1,
+          y1,
+          x2: args[0] + ox,
+          y2: args[1] + oy,
+          x: args[2] + ox,
+          y: args[3] + oy
+        };
+        commands.push(c);
+        lastControl = { x: c.x2, y: c.y2, type: "C" };
+        cx = c.x;
+        cy = c.y;
+        break;
+      }
+      case "q": {
+        const c = { type: "Q", x1: args[0] + ox, y1: args[1] + oy, x: args[2] + ox, y: args[3] + oy };
+        commands.push(c);
+        lastControl = { x: c.x1, y: c.y1, type: "Q" };
+        cx = c.x;
+        cy = c.y;
+        break;
+      }
+      case "t": {
+        const x1 = lastControl?.type === "Q" ? 2 * cx - lastControl.x : cx;
+        const y1 = lastControl?.type === "Q" ? 2 * cy - lastControl.y : cy;
+        const c = { type: "Q", x1, y1, x: args[0] + ox, y: args[1] + oy };
+        commands.push(c);
+        lastControl = { x: x1, y: y1, type: "Q" };
+        cx = c.x;
+        cy = c.y;
+        break;
+      }
+      case "a": {
+        const c = {
+          type: "A",
+          rx: Math.abs(args[0]),
+          ry: Math.abs(args[1]),
+          rotation: args[2],
+          largeArc: args[3] !== 0,
+          sweep: args[4] !== 0,
+          x: args[5] + ox,
+          y: args[6] + oy
+        };
+        commands.push(c);
+        lastControl = null;
+        cx = c.x;
+        cy = c.y;
+        break;
+      }
+    }
+  }
+  return commands;
+}
+function segmentCount(curvature, tolerance, max) {
+  if (!(curvature > 0)) return 1;
+  return Math.max(1, Math.min(max, Math.ceil(Math.sqrt(curvature / tolerance))));
+}
+function flattenCubic(out, p0, x1, y1, x2, y2, x, y, tolerance, max) {
+  const dd = Math.max(
+    Math.hypot(p0[0] - 2 * x1 + x2, p0[1] - 2 * y1 + y2),
+    Math.hypot(x1 - 2 * x2 + x, y1 - 2 * y2 + y)
+  );
+  const n = segmentCount(6 * dd / 8, tolerance, max);
+  for (let k = 1; k <= n; k++) {
+    const t = k / n;
+    const mt = 1 - t;
+    const a = mt * mt * mt;
+    const b = 3 * mt * mt * t;
+    const c = 3 * mt * t * t;
+    const e = t * t * t;
+    out.push([a * p0[0] + b * x1 + c * x2 + e * x, a * p0[1] + b * y1 + c * y2 + e * y]);
+  }
+}
+function flattenQuadratic(out, p0, x1, y1, x, y, tolerance, max) {
+  const dd = Math.hypot(p0[0] - 2 * x1 + x, p0[1] - 2 * y1 + y);
+  const n = segmentCount(2 * dd / 8, tolerance, max);
+  for (let k = 1; k <= n; k++) {
+    const t = k / n;
+    const mt = 1 - t;
+    out.push([mt * mt * p0[0] + 2 * mt * t * x1 + t * t * x, mt * mt * p0[1] + 2 * mt * t * y1 + t * t * y]);
+  }
+}
+function arcSteps(radius, sweep, tolerance, max) {
+  if (radius <= tolerance) return Math.max(1, Math.ceil(Math.abs(sweep) / (Math.PI / 2)));
+  const step = 2 * Math.acos(1 - tolerance / radius);
+  return Math.max(1, Math.min(max, Math.ceil(Math.abs(sweep) / step)));
+}
+function flattenArc(out, p0, cmd, tolerance, max) {
+  const [x0, y0] = p0;
+  let { rx, ry } = cmd;
+  const { x, y } = cmd;
+  if (x0 === x && y0 === y) return;
+  if (rx === 0 || ry === 0) {
+    out.push([x, y]);
+    return;
+  }
+  const phi = cmd.rotation * Math.PI / 180;
+  const cos = Math.cos(phi);
+  const sin = Math.sin(phi);
+  const dx = (x0 - x) / 2;
+  const dy = (y0 - y) / 2;
+  const x1p = cos * dx + sin * dy;
+  const y1p = -sin * dx + cos * dy;
+  const lambda = x1p * x1p / (rx * rx) + y1p * y1p / (ry * ry);
+  if (lambda > 1) {
+    const s = Math.sqrt(lambda);
+    rx *= s;
+    ry *= s;
+  }
+  const num = rx * rx * ry * ry - rx * rx * y1p * y1p - ry * ry * x1p * x1p;
+  const den = rx * rx * y1p * y1p + ry * ry * x1p * x1p;
+  let coef = den === 0 ? 0 : Math.sqrt(Math.max(0, num / den));
+  if (cmd.largeArc === cmd.sweep) coef = -coef;
+  const cxp = coef * rx * y1p / ry;
+  const cyp = -coef * ry * x1p / rx;
+  const cx = cos * cxp - sin * cyp + (x0 + x) / 2;
+  const cy = sin * cxp + cos * cyp + (y0 + y) / 2;
+  const angle = (ux, uy, vx, vy) => {
+    const a = Math.atan2(ux * vy - uy * vx, ux * vx + uy * vy);
+    return a;
+  };
+  const theta1 = angle(1, 0, (x1p - cxp) / rx, (y1p - cyp) / ry);
+  let delta = angle((x1p - cxp) / rx, (y1p - cyp) / ry, (-x1p - cxp) / rx, (-y1p - cyp) / ry);
+  if (!cmd.sweep && delta > 0) delta -= 2 * Math.PI;
+  else if (cmd.sweep && delta < 0) delta += 2 * Math.PI;
+  const n = arcSteps(Math.max(rx, ry), delta, tolerance, max);
+  for (let k = 1; k < n; k++) {
+    const t = theta1 + delta * k / n;
+    const ex = rx * Math.cos(t);
+    const ey = ry * Math.sin(t);
+    out.push([cos * ex - sin * ey + cx, sin * ex + cos * ey + cy]);
+  }
+  out.push([x, y]);
+}
+function flattenSvgPath(d, options = {}) {
+  const tolerance = options.tolerance && options.tolerance > 0 ? options.tolerance : 0.25;
+  const max = options.maxSegments ?? 512;
+  const commands = typeof d === "string" ? parseSvgPath(d) : d;
+  const rings = [];
+  let current = [];
+  let start = [0, 0];
+  const flush = () => {
+    if (current.length >= 3) rings.push(current);
+    current = [];
+  };
+  const last = () => current[current.length - 1] ?? start;
+  for (const cmd of commands) {
+    switch (cmd.type) {
+      case "M":
+        flush();
+        start = [cmd.x, cmd.y];
+        current = [start];
+        break;
+      case "L":
+        if (current.length === 0) current = [start];
+        current.push([cmd.x, cmd.y]);
+        break;
+      case "C":
+        if (current.length === 0) current = [start];
+        flattenCubic(current, last(), cmd.x1, cmd.y1, cmd.x2, cmd.y2, cmd.x, cmd.y, tolerance, max);
+        break;
+      case "Q":
+        if (current.length === 0) current = [start];
+        flattenQuadratic(current, last(), cmd.x1, cmd.y1, cmd.x, cmd.y, tolerance, max);
+        break;
+      case "A":
+        if (current.length === 0) current = [start];
+        flattenArc(current, last(), cmd, tolerance, max);
+        break;
+      case "Z":
+        flush();
+        break;
+    }
+  }
+  flush();
+  return rings.map(dedupeRing).filter((r) => r.length >= 3);
+}
+function dedupeRing(ring) {
+  const out = [];
+  for (const p of ring) {
+    const prev = out[out.length - 1];
+    if (!prev || prev[0] !== p[0] || prev[1] !== p[1]) out.push(p);
+  }
+  while (out.length > 1 && out[0][0] === out[out.length - 1][0] && out[0][1] === out[out.length - 1][1]) out.pop();
+  return out;
+}
+function cornerRadii(shape, width, height) {
+  const raw = shape.cornerRadius ?? 0;
+  let radii = (typeof raw === "number" ? [raw, raw, raw, raw] : [...raw]).map(
+    (r) => Number.isFinite(r) && r > 0 ? r : 0
+  );
+  const factor = Math.min(
+    1,
+    width / Math.max(radii[0] + radii[1], 1e-12),
+    height / Math.max(radii[1] + radii[2], 1e-12),
+    width / Math.max(radii[2] + radii[3], 1e-12),
+    height / Math.max(radii[3] + radii[0], 1e-12)
+  );
+  if (factor < 1) radii = radii.map((r) => r * factor);
+  return radii;
+}
+function polygonVertices(count, inner, width, height) {
+  const raw = [];
+  const total = inner === null ? count : count * 2;
+  for (let k = 0; k < total; k++) {
+    const angle = -Math.PI / 2 + k * 2 * Math.PI / total;
+    const r = inner !== null && k % 2 === 1 ? inner : 1;
+    raw.push([r * Math.cos(angle), r * Math.sin(angle)]);
+  }
+  let minX = Infinity;
+  let minY = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  for (const [x, y] of raw) {
+    minX = Math.min(minX, x);
+    minY = Math.min(minY, y);
+    maxX = Math.max(maxX, x);
+    maxY = Math.max(maxY, y);
+  }
+  const sx = width / (maxX - minX || 1);
+  const sy = height / (maxY - minY || 1);
+  return raw.map(([x, y]) => [(x - minX) * sx, (y - minY) * sy]);
+}
+function rotationTransform(shape, size) {
+  const deg = shape.rotation ?? 0;
+  if (!deg || !Number.isFinite(deg)) return null;
+  const rad = deg * Math.PI / 180;
+  const cos = Math.cos(rad);
+  const sin = Math.sin(rad);
+  const cx = size.width / 2;
+  const cy = size.height / 2;
+  return ([x, y]) => [cx + (x - cx) * cos - (y - cy) * sin, cy + (x - cx) * sin + (y - cy) * cos];
+}
+function getShapeSvg(shape, size) {
+  const { width: w, height: h } = size;
+  const f = (n) => formatNumber(n, 3);
+  const transforms = [];
+  if (shape.rotation) transforms.push(`rotate(${f(shape.rotation)} ${f(w / 2)} ${f(h / 2)})`);
+  let d = "";
+  let fillRule = "nonzero";
+  switch (shape.kind) {
+    case "rect": {
+      const [tl, tr, br, bl] = cornerRadii(shape, w, h);
+      if (tl + tr + br + bl === 0) {
+        d = `M0 0H${f(w)}V${f(h)}H0Z`;
+      } else {
+        const arc = (r, x, y) => r > 0 ? `A${f(r)} ${f(r)} 0 0 1 ${f(x)} ${f(y)}` : "";
+        d = `M${f(tl)} 0H${f(w - tr)}${arc(tr, w, tr)}V${f(h - br)}${arc(br, w - br, h)}H${f(bl)}${arc(bl, 0, h - bl)}V${f(tl)}${arc(tl, tl, 0)}Z`;
+      }
+      break;
+    }
+    case "ellipse": {
+      const rx = w / 2;
+      const ry = h / 2;
+      d = `M0 ${f(ry)}A${f(rx)} ${f(ry)} 0 1 1 ${f(w)} ${f(ry)}A${f(rx)} ${f(ry)} 0 1 1 0 ${f(ry)}Z`;
+      break;
+    }
+    case "polygon":
+    case "star": {
+      const points = shape.kind === "polygon" ? polygonVertices(Math.max(3, Math.floor(shape.sides ?? 6)), null, w, h) : polygonVertices(Math.max(3, Math.floor(shape.points ?? 5)), clampRatio(shape.innerRadius), w, h);
+      d = ringsToPath([points], f);
+      break;
+    }
+    case "path": {
+      d = shape.d;
+      fillRule = shape.fillRule ?? "nonzero";
+      const vb = validViewBox(shape.viewBox);
+      if (vb) {
+        transforms.push(
+          `scale(${f(w / vb[2])} ${f(h / vb[3])})`,
+          `translate(${f(-vb[0])} ${f(-vb[1])})`
+        );
+      }
+      break;
+    }
+  }
+  return transforms.length > 0 ? { d, transform: transforms.join(" "), fillRule } : { d, fillRule };
+}
+function getShapeRenderData(shape, size = {}) {
+  const vb = shape.kind === "path" ? validViewBox(shape.viewBox) : null;
+  const width = size.width && size.width > 0 ? size.width : vb ? vb[2] : 100;
+  const height = size.height && size.height > 0 ? size.height : vb ? vb[3] : 100;
+  const svg = getShapeSvg(shape, { width, height });
+  const data = {
+    viewBox: `0 0 ${formatNumber(width, 3)} ${formatNumber(height, 3)}`,
+    width,
+    height,
+    d: svg.d,
+    fillRule: svg.fillRule,
+    fill: shape.fill ?? "currentColor",
+    stroke: shape.stroke ?? "none",
+    strokeWidth: shape.strokeWidth ?? 1
+  };
+  if (svg.transform) data.transform = svg.transform;
+  if (shape.opacity !== void 0) data.opacity = shape.opacity;
+  return data;
+}
+function clampRatio(value) {
+  if (value === void 0 || !Number.isFinite(value)) return 0.5;
+  return Math.min(1, Math.max(0.01, value));
+}
+function validViewBox(vb) {
+  if (!vb || vb.length !== 4 || !vb.every(Number.isFinite) || vb[2] <= 0 || vb[3] <= 0) return null;
+  return vb;
+}
+function shapeToPolygon(shape, size, options = {}) {
+  const { width: w, height: h } = size;
+  if (!(w > 0) || !(h > 0)) return { rings: [], fillRule: "nonzero" };
+  let rings;
+  let fillRule = "nonzero";
+  if (shape.kind === "path") {
+    fillRule = shape.fillRule ?? "nonzero";
+    const vb = validViewBox(shape.viewBox);
+    if (vb) {
+      const sx = w / vb[2];
+      const sy = h / vb[3];
+      const tolerance = (options.tolerance ?? 0.25) / Math.max(sx, sy);
+      rings = flattenSvgPath(shape.d, { ...options, tolerance }).map(
+        (ring) => ring.map(([x, y]) => [(x - vb[0]) * sx, (y - vb[1]) * sy])
+      );
+    } else {
+      rings = flattenSvgPath(shape.d, options);
+    }
+  } else {
+    const { d } = getShapeSvg({ ...shape, rotation: 0 }, size);
+    rings = flattenSvgPath(d, options);
+  }
+  const rotate = rotationTransform(shape, size);
+  if (rotate) rings = rings.map((ring) => ring.map(rotate));
+  return { rings, fillRule };
+}
+function formatNumber(value, precision = 3) {
+  const factor = 10 ** precision;
+  const rounded = Math.round(value * factor) / factor;
+  return Object.is(rounded, -0) ? "0" : String(rounded);
+}
+function ringsToPath(rings, f) {
+  let d = "";
+  for (const ring of rings) {
+    if (ring.length < 2) continue;
+    d += `M${f(ring[0][0])} ${f(ring[0][1])}`;
+    for (let i = 1; i < ring.length; i++) d += `L${f(ring[i][0])} ${f(ring[i][1])}`;
+    d += "Z";
+  }
+  return d;
+}
+function segmentDistance(p, a, b) {
+  const dx = b[0] - a[0];
+  const dy = b[1] - a[1];
+  const len2 = dx * dx + dy * dy;
+  if (len2 === 0) return Math.hypot(p[0] - a[0], p[1] - a[1]);
+  const t = Math.max(0, Math.min(1, ((p[0] - a[0]) * dx + (p[1] - a[1]) * dy) / len2));
+  return Math.hypot(p[0] - (a[0] + t * dx), p[1] - (a[1] + t * dy));
+}
+function rdp(points, tolerance) {
+  if (points.length <= 2) return points;
+  const keep = new Uint8Array(points.length);
+  keep[0] = 1;
+  keep[points.length - 1] = 1;
+  const stack = [[0, points.length - 1]];
+  while (stack.length) {
+    const [s, e] = stack.pop();
+    let maxDist = -1;
+    let index = -1;
+    for (let i = s + 1; i < e; i++) {
+      const dist = segmentDistance(points[i], points[s], points[e]);
+      if (dist > maxDist) {
+        maxDist = dist;
+        index = i;
+      }
+    }
+    if (index !== -1 && maxDist > tolerance) {
+      keep[index] = 1;
+      stack.push([s, index], [index, e]);
+    }
+  }
+  return points.filter((_, i) => keep[i]);
+}
+function simplifyRing(ring, tolerance) {
+  if (ring.length <= 3 || !(tolerance > 0)) return [...ring];
+  let far = 0;
+  let farDist = -1;
+  for (let i = 1; i < ring.length; i++) {
+    const dist = Math.hypot(ring[i][0] - ring[0][0], ring[i][1] - ring[0][1]);
+    if (dist > farDist) {
+      farDist = dist;
+      far = i;
+    }
+  }
+  const first = rdp(ring.slice(0, far + 1), tolerance);
+  const second = rdp([...ring.slice(far), ring[0]], tolerance);
+  const out = [...first.slice(0, -1), ...second.slice(0, -1)];
+  return out.length >= 3 ? out : [];
+}
+function polygonToSvgPath(input, options = {}) {
+  const precision = options.precision ?? 3;
+  const f = (n) => formatNumber(n, precision);
+  const dx = options.offset?.x ?? 0;
+  const dy = options.offset?.y ?? 0;
+  const rings = [];
+  for (const item of input) {
+    const list = item.length > 0 && Array.isArray(item[0]) && Array.isArray(item[0][0]) ? item : [item];
+    for (const ring of list) {
+      let r = ring;
+      if (options.simplify && options.simplify > 0) r = simplifyRing(r, options.simplify);
+      if (r.length < 3) continue;
+      rings.push(dx || dy ? r.map(([x, y]) => [x + dx, y + dy]) : r);
+    }
+  }
+  return ringsToPath(rings, f);
+}
+
+// src/canvas/shapeNodes.ts
+var SHAPE_DATA_KEY = "shape";
+var SHAPE_NODE_TYPE = "shape";
+var SHAPE_OPERATIONS = ["unite", "intersect", "subtract", "exclude", "divide"];
+var BOOLEAN_FOR = {
+  unite: "union",
+  intersect: "intersection",
+  subtract: "difference",
+  exclude: "xor"
+};
+function isShapeNode(node) {
+  return !!node && isShapeDescription(node.data?.[SHAPE_DATA_KEY]);
+}
+function getNodeShape(node) {
+  const shape = node?.data?.[SHAPE_DATA_KEY];
+  return isShapeDescription(shape) ? shape : null;
+}
+function shapeNodeToPolygon(node, lookup, options = {}) {
+  const shape = getNodeShape(node);
+  if (!shape) return null;
+  const size = getNodeSize(node, options);
+  const origin = node.parentId && lookup ? getAbsolutePosition(node, lookup) : node.position;
+  const { rings, fillRule } = shapeToPolygon(shape, size, { tolerance: options.tolerance });
+  return {
+    rings: rings.map((ring) => ring.map(([x, y]) => [x + origin.x, y + origin.y])),
+    fillRule
+  };
+}
+var idCounter = 0;
+function defaultId2(index) {
+  if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") return crypto.randomUUID();
+  idCounter += 1;
+  return `shape-${Date.now().toString(36)}-${idCounter}-${index}`;
+}
+function stackOrder(nodes, ids) {
+  return nodes.map((node, index) => ({ node, index, z: typeof node.zIndex === "number" ? node.zIndex : 0 })).filter((entry) => ids.has(entry.node.id)).sort((a, b) => a.z - b.z || a.index - b.index).map((entry) => entry.node);
+}
+function canCombineShapeNodes(nodes, ids) {
+  const idSet = new Set(ids);
+  const shapes = nodes.filter((n) => idSet.has(n.id) && isShapeNode(n));
+  if (shapes.some((n) => isLocked(n))) return { ok: false, reason: "locked" };
+  if (shapes.length < 2) return { ok: false, reason: "too-few" };
+  return { ok: true, shapeIds: shapes.map((n) => n.id) };
+}
+function combineShapeNodes(nodes, ids, operation, options = {}) {
+  const idList = [...ids];
+  const check = canCombineShapeNodes(nodes, idList);
+  if (!check.ok) return { ok: false, operation, reason: check.reason };
+  const lookup = createNodeLookup(nodes);
+  const shapeIds = new Set(check.shapeIds);
+  const ordered = stackOrder(nodes, shapeIds);
+  const operands = ordered.map((node) => shapeNodeToPolygon(node, lookup, options));
+  const parentIds = new Set(ordered.map((n) => n.parentId ?? ""));
+  const sharedParent = parentIds.size === 1 ? ordered[0].parentId : void 0;
+  const parentOrigin = sharedParent && lookup.get(sharedParent) ? getAbsolutePosition(lookup.get(sharedParent), lookup) : { x: 0, y: 0 };
+  const pickSource = () => {
+    const style = options.styleFrom ?? "bottom";
+    if (style === "top") return ordered[ordered.length - 1];
+    if (style === "first") {
+      const first = idList.find((id) => shapeIds.has(id));
+      return first && lookup.get(first) || ordered[0];
+    }
+    if (typeof style === "object") return shapeIds.has(style.id) && lookup.get(style.id) || ordered[0];
+    return ordered[0];
+  };
+  const createId = options.createId ?? defaultId2;
+  const build = (polygon, source, index) => {
+    const bounds = multiPolygonBounds(polygon);
+    if (!bounds) return null;
+    const width = bounds.maxX - bounds.minX;
+    const height = bounds.maxY - bounds.minY;
+    if (!(width > 0) || !(height > 0)) return null;
+    const d = polygonToSvgPath(polygon, {
+      precision: options.precision,
+      simplify: options.simplify,
+      offset: { x: -bounds.minX, y: -bounds.minY }
+    });
+    if (!d) return null;
+    const sourceShape = getNodeShape(source);
+    const shape = {
+      kind: "path",
+      d,
+      viewBox: [0, 0, roundSize(width), roundSize(height)],
+      fillRule: "nonzero"
+    };
+    for (const key of ["fill", "stroke", "strokeWidth", "opacity"]) {
+      if (sourceShape[key] !== void 0) shape[key] = sourceShape[key];
+    }
+    const {
+      [LOCKED_DATA_KEY]: _locked,
+      [LOCKED_PREVIOUS_FLAGS_KEY]: _previous,
+      ...data
+    } = source.data ?? {};
+    const {
+      measured: _measured,
+      selected: _selected,
+      dragging: _dragging,
+      positionAbsolute: _positionAbsolute,
+      internals: _internals,
+      parentId: _parentId,
+      ...rest
+    } = source;
+    const node = {
+      ...rest,
+      id: createId(index),
+      position: { x: bounds.minX - parentOrigin.x, y: bounds.minY - parentOrigin.y },
+      width,
+      height,
+      data: { ...data, [SHAPE_DATA_KEY]: shape }
+    };
+    if (sharedParent) node.parentId = sharedParent;
+    if (options.nodeType !== void 0) node.type = options.nodeType;
+    if (source.style) node.style = withStyleSize(source.style, { width, height });
+    if (options.select !== false) node.selected = true;
+    return node;
+  };
+  const created = [];
+  if (operation === "divide") {
+    const pieces = dividePolygons(operands, { epsilon: options.epsilon });
+    pieces.forEach((piece) => {
+      const source = ordered[piece.operands[piece.operands.length - 1]];
+      const node = build([piece.polygon], source, created.length);
+      if (node) created.push(node);
+    });
+  } else {
+    const result = polygonBoolean(BOOLEAN_FOR[operation], operands, { epsilon: options.epsilon });
+    const node = build(result, pickSource(), 0);
+    if (node) created.push(node);
+  }
+  if (created.length === 0) return { ok: false, operation, reason: "empty" };
+  return { ok: true, operation, removeIds: ordered.map((n) => n.id), nodes: created };
+}
+function roundSize(value) {
+  return Math.round(value * 1e3) / 1e3;
+}
+function applyShapeCombination(nodes, change, options = {}) {
+  const remove = new Set(change.removeIds);
+  const insertAt = nodes.findIndex((n) => remove.has(n.id));
+  const deselect = options.deselect !== false && change.nodes.some((n) => n.selected);
+  const out = [];
+  nodes.forEach((node, index) => {
+    if (index === insertAt) out.push(...change.nodes);
+    if (remove.has(node.id)) return;
+    out.push(deselect && node.selected ? { ...node, selected: false } : node);
+  });
+  if (insertAt === -1) out.push(...change.nodes);
+  return out;
+}
+function revertShapeCombination(nodes, change, previous) {
+  const created = new Set(change.nodes.map((n) => n.id));
+  const removed = new Set(change.removeIds);
+  const out = nodes.filter((n) => !created.has(n.id));
+  previous.forEach((node, index) => {
+    if (!removed.has(node.id) || out.some((n) => n.id === node.id)) return;
+    out.splice(Math.min(index, out.length), 0, node);
+  });
+  return out;
+}
+
 // src/canvas/arrangeController.ts
 function createCanvasArrangeController(options) {
   let guides = [];
   let dragIndex = null;
   let dragKey = "";
+  let lastSnapped = /* @__PURE__ */ new Map();
   const selectedIds = (ids) => ids ? [...ids] : options.getSelectedIds?.() ?? options.getNodes().filter((n) => n.selected).map((n) => n.id);
   const setGuides = (next) => {
     if (next.length === 0 && guides.length === 0) return;
@@ -1777,6 +2949,30 @@ function createCanvasArrangeController(options) {
       return anyUnlocked ? controller.lock(list) : controller.unlock(list);
     },
     isLocked: (id) => isLocked(options.getNodes().find((n) => n.id === id)),
+    /**
+     * Freeform shape operation (Unite / Intersect / Subtract / Exclude / Divide) on the
+     * shape nodes among `ids` (default: the selection). Replaces them with the result as
+     * one undoable step. Refuses without changing anything when a selected shape is
+     * locked, fewer than two shapes are selected, or the result is empty.
+     */
+    combineShapes(operation, ids, combineOptions = {}) {
+      const before = options.getNodes();
+      const result = combineShapeNodes(before, selectedIds(ids), operation, { ...rect(), ...combineOptions });
+      if (!result.ok) return result;
+      const name = `${operation[0].toUpperCase()}${operation.slice(1)} Shapes`;
+      const run = () => options.setNodes(applyShapeCombination(options.getNodes(), result));
+      const undo = () => options.setNodes(revertShapeCombination(options.getNodes(), result, before));
+      if (options.history) options.history.execute({ name, execute: run, undo });
+      else run();
+      return result;
+    },
+    unite: (ids, o) => controller.combineShapes("unite", ids, o),
+    intersect: (ids, o) => controller.combineShapes("intersect", ids, o),
+    subtract: (ids, o) => controller.combineShapes("subtract", ids, o),
+    exclude: (ids, o) => controller.combineShapes("exclude", ids, o),
+    divide: (ids, o) => controller.combineShapes("divide", ids, o),
+    /** Whether the shape operations can run on `ids` (default: the selection). */
+    canCombineShapes: (ids) => canCombineShapeNodes(options.getNodes(), selectedIds(ids)).ok,
     /**
      * Runs a shortcut action. Scene actions are not handled here (see the scenes store);
      * returns `false` for them and for unknown actions.
@@ -1851,8 +3047,10 @@ function createCanvasArrangeController(options) {
         zoom: options.getZoom?.() ?? 1,
         index: dragIndex
       });
+      lastSnapped = /* @__PURE__ */ new Map();
       if (result.updates.length > 0) {
         options.setNodes(applyNodeUpdates(options.getNodes(), result.updates));
+        for (const u of result.updates) if (u.position) lastSnapped.set(u.id, u.position);
       }
       setGuides(result.guides);
       return result;
@@ -1863,10 +3061,17 @@ function createCanvasArrangeController(options) {
      * A batch without a dragging position change ends the drag and clears the guides.
      */
     snapPositionChanges(changes) {
-      const dragging = changes.filter((c) => c.type === "position" && c.position && c.dragging);
+      const dragging = changes.filter(
+        (c) => c.type === "position" && typeof c.id === "string" && !!c.position && !!c.dragging
+      );
       if (dragging.length === 0) {
-        if (changes.some((c) => c.type === "position" && c.dragging === false)) controller.endDrag();
-        return changes;
+        if (!changes.some((c) => c.type === "position" && c.dragging === false)) return changes;
+        const snapped = lastSnapped;
+        lastSnapped = /* @__PURE__ */ new Map();
+        controller.endDrag();
+        const keep = (c) => c.type === "position" && c.dragging === false && !!c.position && c.id !== void 0 && snapped.has(c.id);
+        if (!changes.some(keep)) return changes;
+        return changes.map((c) => keep(c) ? { ...c, position: snapped.get(c.id) } : c);
       }
       if (options.snapping === false) return changes;
       const ids = dragging.map((c) => c.id);
@@ -1882,18 +3087,37 @@ function createCanvasArrangeController(options) {
       });
       setGuides(result.guides);
       const { x: dx, y: dy } = result.offset;
+      lastSnapped = /* @__PURE__ */ new Map();
       if (dx === 0 && dy === 0) return changes;
       const parents = new Map(nodes.map((n) => [n.id, n.parentId]));
       const shift = new Set(ids.filter((id) => !proposed.has(parents.get(id) ?? "")));
-      return changes.map(
-        (c) => c.type === "position" && c.position && c.dragging && shift.has(c.id) ? { ...c, position: { x: c.position.x + dx, y: c.position.y + dy } } : c
-      );
+      return changes.map((c) => {
+        if (!(c.type === "position" && c.position && c.dragging && c.id !== void 0 && shift.has(c.id))) return c;
+        const position = { x: c.position.x + dx, y: c.position.y + dy };
+        lastSnapped.set(c.id, position);
+        return { ...c, position };
+      });
     },
-    /** Clears guides and the cached snap targets. */
+    /**
+     * Clears guides and the cached snap targets. Call it from the flow's drag-stop
+     * handler: flow libraries write the raw pointer position when a drag ends, so the
+     * last snapped positions from `drag` are written back here.
+     */
     endDrag() {
+      const snapped = lastSnapped;
       dragIndex = null;
       dragKey = "";
+      lastSnapped = /* @__PURE__ */ new Map();
       setGuides([]);
+      if (snapped.size === 0) return;
+      const nodes = options.getNodes();
+      const drift = nodes.some((n) => {
+        const p = snapped.get(n.id);
+        return !!p && (n.position.x !== p.x || n.position.y !== p.y);
+      });
+      if (drift) {
+        options.setNodes(applyNodeUpdates(nodes, [...snapped].map(([id, position]) => ({ id, position }))));
+      }
     }
   };
   return controller;
@@ -1908,17 +3132,24 @@ export {
   LOCKED_DATA_KEY,
   LOCKED_PREVIOUS_FLAGS_KEY,
   ManualClock,
+  SHAPE_DATA_KEY,
+  SHAPE_KINDS,
+  SHAPE_NODE_TYPE,
+  SHAPE_OPERATIONS,
   StreamingLayoutManager,
   alignNodes,
   applyNodeUpdates,
+  applyShapeCombination,
   blendLayout,
   boundsOf,
   calculateDagreReflowDisplacement,
   calculateDirectionalDisplacement,
+  canCombineShapeNodes,
   canvasHeight,
   centerNodes,
   centre,
   collectDescendantIds,
+  combineShapeNodes,
   computeNodesBoundingBox,
   computeSnapGuides,
   connectedOnly,
@@ -1931,22 +3162,31 @@ export {
   createNodeLookup,
   defaultEasing,
   distributeNodes,
+  dividePolygons,
   ensureLayout,
   estimateCanvasHeight,
   estimateNodeSize,
   findConnectorSnap,
   fitViewportToNodes,
   fitViewportToRect,
+  flattenSvgPath,
   flowSide,
+  formatNumber,
   getAbsolutePosition,
   getCenteredNodePosition,
   getLayoutedNodes,
   getNodeRect,
+  getNodeShape,
   getNodeSize,
+  getShapeRenderData,
+  getShapeSvg,
   handlePoint,
+  intersectPolygons,
   invertNodeUpdates,
   isEventFromTextInput,
   isLocked,
+  isShapeDescription,
+  isShapeNode,
   isValidCanvasEdge,
   isValidCanvasNode,
   isValidCanvasScene,
@@ -1957,26 +3197,42 @@ export {
   lockNodes,
   matchArrangeShortcut,
   matchSize,
+  multiPolygonArea,
+  multiPolygonBounds,
   nearestHandlePositions,
   oppositePosition,
   overlaps,
   pageHidden,
   parseCanvasClipboardData,
   parseCanvasScenes,
+  parseSvgPath,
   placeBeside,
+  pointInMultiPolygon,
+  pointInRings,
+  polygonArea,
+  polygonBoolean,
+  polygonToSvgPath,
   positionToSide,
   readStyleSize,
   realClock,
   remapPastedNodes,
   reorderNodes,
   repositionNodesTo,
+  revertShapeCombination,
+  ringSignedArea,
   runMultiNodeTransition,
   serializeCanvasNodes,
+  shapeNodeToPolygon,
+  shapeToPolygon,
   sideToPosition,
+  simplifyRing,
   snapNodeDrag,
+  subtractPolygons,
   toggleLockNodes,
+  unionPolygons,
   unlockNodes,
   withStyleOpacity,
-  withStyleSize
+  withStyleSize,
+  xorPolygons
 };
 //# sourceMappingURL=index.js.map