@pixerate/editor 0.107.0 → 0.108.0

package/dist/{chunk-63EFQCT5.js → chunk-HUQ7EHVI.js}

@@ -3,6 +3,7 @@ import {
   bezierPathBounds,
   bezierPathToSvg,
   closeContour,
+  contourSignedArea,
   contoursToPath,
   distanceToBezierPath,
   fitCubicRun,
@@ -10,13 +11,16 @@ import {
   flattenChain,
   formatNumber,
   isStraightCubic,
+  normalizeBezierPath,
   offsetPath,
   outlineStroke,
   pathBoolean,
   pathToContours,
   pointInBezierPath,
   polygonBoolean,
+  segmentBounds,
   segmentDerivative,
+  segmentIntersections,
   segmentLength,
   segmentNearest,
   segmentParamAtLength,
@@ -26,7 +30,8 @@ import {
   subSegment,
   toBezierPath,
   transformBezierPath,
-  trimSegments
+  trimSegments,
+  windingNumber
 } from "./chunk-YCSFS3GK.js";
 import {
   IDENTITY_MATRIX,
@@ -95,6 +100,7 @@ var VECTOR_BLEND_MODES = [
   "luminosity"
 ];
 var VECTOR_BLEND_SPACINGS = ["steps", "distance", "smoothColor"];
+var VECTOR_MASK_TYPES = ["clip", "alpha", "luminance"];
 var VECTOR_TOOLS = [
   "select",
   "direct",
@@ -1622,14 +1628,14 @@ function nearestStrokePosition(path, p, only) {
     if (!(total > 0)) return;
     let acc = 0;
     c.segments.forEach((seg, si) => {
-      const near = segmentNearest(seg, p);
-      if (!best || near.distance < best.distance) {
-        const s = acc + segmentLength(seg, 0, near.t);
-        const tan = segmentTangent(seg, near.t);
-        const pt2 = seg.length === 2 ? lerp(seg[0], seg[1], near.t) : evalSeg(seg, near.t);
+      const near2 = segmentNearest(seg, p);
+      if (!best || near2.distance < best.distance) {
+        const s = acc + segmentLength(seg, 0, near2.t);
+        const tan = segmentTangent(seg, near2.t);
+        const pt2 = seg.length === 2 ? lerp(seg[0], seg[1], near2.t) : evalSeg(seg, near2.t);
         const n = leftNormal([tan[0], tan[1]]);
         const side = (p[0] - pt2[0]) * n[0] + (p[1] - pt2[1]) * n[1] >= 0 ? "left" : "right";
-        best = { contour: ci, t: Math.min(Math.max(s / total, 0), 1), distance: near.distance, side, point: pt2, tangent: [tan[0], tan[1]], length: total };
+        best = { contour: ci, t: Math.min(Math.max(s / total, 0), 1), distance: near2.distance, side, point: pt2, tangent: [tan[0], tan[1]], length: total };
       }
       acc += lengths[si];
     });
@@ -1814,7 +1820,7 @@ function vectorStrokeParts(path, style) {
   const cap = capExtent(style, width);
   const tipMode = style.arrowAlign === "tip";
   const trims = contours.map(() => [0, 0]);
-  const place = (end, contour, ci) => {
+  const place2 = (end, contour, ci) => {
     const kind = end === "start" ? style.startArrow : style.endArrow;
     if (!kind || contour.closed) return;
     const hw = arrowheadWeight(style, end);
@@ -1835,8 +1841,8 @@ function vectorStrokeParts(path, style) {
     }
     heads.push({ end, kind, tip, dir, inset, path: arrowheadPath(kind, tip, dir, hw) });
   };
-  place("start", first, 0);
-  place("end", last, contours.length - 1);
+  place2("start", first, 0);
+  place2("end", last, contours.length - 1);
   if (!tipMode || !heads.length) return { align, line: path, drawWidth, heads };
   const trimmed = contours.map((c, i) => {
     const [s0, s1] = trims[i];
@@ -1869,13 +1875,13 @@ function hitTestVectorStroke(path, p, style, tolerance = 0) {
   let d;
   let reach = width / 2;
   if (profile) {
-    const near = nearestStrokePosition(parts.line, point);
-    if (!near) return false;
-    d = near.distance;
-    const w = widthProfileAt(profile, near.t);
-    reach = width / 2 * (near.side === "left" ? w.left : w.right);
+    const near2 = nearestStrokePosition(parts.line, point);
+    if (!near2) return false;
+    d = near2.distance;
+    const w = widthProfileAt(profile, near2.t);
+    reach = width / 2 * (near2.side === "left" ? w.left : w.right);
     if (parts.align !== "center") reach *= 2;
-    const atEnd = near.t <= 1e-9 || near.t >= 1 - 1e-9;
+    const atEnd = near2.t <= 1e-9 || near2.t >= 1 - 1e-9;
     if (atEnd && (style.strokeLinecap === "round" || style.strokeLinecap === "square") && d > reach) {
       reach = Math.max(reach, width / 2 * (w.left + w.right) / 2);
     }
@@ -2318,6 +2324,766 @@ function mapBezierPath(path, f, tolerance = 0.1, options = {}) {
   return subpathsToBezier(mapVectorSubpaths(bezierToSubpaths(path), f, tolerance, options), { corners: false });
 }
 
+// src/vector/pathCut.ts
+var loopArea = (l) => contourSignedArea(l.segs);
+function loopSample(l) {
+  const k = l.chord.findIndex((c) => !c);
+  return segmentPoint(l.segs[k >= 0 ? k : 0], 0.5);
+}
+var contains = (l, p) => windingNumber([l.segs], p) !== 0;
+function groupFaces(loops) {
+  const usable = loops.filter((l) => l.segs.length && Math.abs(loopArea(l)) > 1e-12);
+  if (!usable.length) return [];
+  const largest = usable.reduce((a, b) => Math.abs(loopArea(b)) > Math.abs(loopArea(a)) ? b : a);
+  const sign = Math.sign(loopArea(largest));
+  const outers = usable.filter((l) => Math.sign(loopArea(l)) === sign).sort((a, b) => Math.abs(loopArea(a)) - Math.abs(loopArea(b)));
+  const faces = new Map(outers.map((o) => [o, { loops: [o] }]));
+  for (const hole of usable.filter((l) => Math.sign(loopArea(l)) !== sign)) {
+    const p = loopSample(hole);
+    const parent = outers.find((o) => Math.abs(loopArea(o)) > Math.abs(loopArea(hole)) && contains(o, p));
+    if (parent) faces.get(parent).loops.push(hole);
+  }
+  return outers.reverse().map((o) => faces.get(o));
+}
+function faceToPath(face) {
+  return contoursToPath(face.loops.map((l) => ({ segments: l.segs, closed: true })));
+}
+function facesOf(path, fillRule) {
+  const normalized = normalizeBezierPath(path, fillRule);
+  const loops = pathToContours(normalized).map((c) => {
+    const segs = closeContour(c, true).map((s) => s.slice());
+    return { segs, chord: segs.map(() => false) };
+  });
+  return groupFaces(loops);
+}
+function splitIntoFaces(path, fillRule = "nonzero") {
+  return facesOf(path, fillRule).map(faceToPath);
+}
+function rootsInUnit(a, b, c, d, scale3) {
+  const f = (t) => ((a * t + b) * t + c) * t + d;
+  const tol = 1e-12 * Math.max(1, scale3);
+  const cuts = [0];
+  const qa = 3 * a;
+  const qb = 2 * b;
+  if (Math.abs(qa) > 1e-18) {
+    const disc = qb * qb - 4 * qa * c;
+    if (disc >= 0) {
+      const r = Math.sqrt(disc);
+      for (const t of [(-qb - r) / (2 * qa), (-qb + r) / (2 * qa)].sort((x, y) => x - y)) if (t > 0 && t < 1) cuts.push(t);
+    }
+  } else if (Math.abs(qb) > 1e-18) {
+    const t = -c / qb;
+    if (t > 0 && t < 1) cuts.push(t);
+  }
+  cuts.push(1);
+  const roots = [];
+  const push = (t) => {
+    if (!roots.some((r) => Math.abs(r - t) < 1e-9)) roots.push(t);
+  };
+  for (let i = 0; i < cuts.length - 1; i++) {
+    let lo = cuts[i];
+    let hi = cuts[i + 1];
+    let flo = f(lo);
+    const fhi = f(hi);
+    if (Math.abs(flo) <= tol) push(lo);
+    if (Math.abs(fhi) <= tol) push(hi);
+    if (flo * fhi >= 0) continue;
+    for (let k = 0; k < 80; k++) {
+      const m = (lo + hi) / 2;
+      const fm = f(m);
+      if (fm === 0) {
+        lo = hi = m;
+        break;
+      }
+      if (fm * flo < 0) hi = m;
+      else {
+        lo = m;
+        flo = fm;
+      }
+    }
+    push((lo + hi) / 2);
+  }
+  return roots.sort((x, y) => x - y);
+}
+function lineHits(p, q, seg) {
+  const dx = q[0] - p[0];
+  const dy = q[1] - p[1];
+  const len2 = dx * dx + dy * dy;
+  if (len2 < 1e-24) return [];
+  const h = (pt2) => (pt2[0] - p[0]) * -dy + (pt2[1] - p[1]) * dx;
+  let coeffs;
+  if (seg.length === 2) coeffs = [0, 0, h(seg[1]) - h(seg[0]), h(seg[0])];
+  else {
+    const [h0, h1, h2, h3] = seg.map(h);
+    coeffs = [-h0 + 3 * h1 - 3 * h2 + h3, 3 * h0 - 6 * h1 + 3 * h2, -3 * h0 + 3 * h1, h0];
+  }
+  if (coeffs.every((c) => Math.abs(c) < 1e-12 * Math.max(1, len2))) return [];
+  const scale3 = Math.sqrt(len2) * Math.max(1, ...seg.map((pt2) => Math.abs(pt2[0]) + Math.abs(pt2[1])));
+  const out = [];
+  for (const t of rootsInUnit(...coeffs, scale3)) {
+    const point = segmentPoint(seg, t);
+    const s = ((point[0] - p[0]) * dx + (point[1] - p[1]) * dy) / len2;
+    if (s >= -1e-9 && s <= 1 + 1e-9) out.push({ s: Math.min(1, Math.max(0, s)), t, point });
+  }
+  return out;
+}
+var near = (a, b, eps) => Math.abs(a[0] - b[0]) <= eps && Math.abs(a[1] - b[1]) <= eps;
+var degenerate = (seg, eps) => seg.every((p) => near(p, seg[0], eps));
+function arc(l, a, b, eps) {
+  const n = l.segs.length;
+  const segs = [];
+  const chord = [];
+  const push = (k, t0, t1) => {
+    const piece = t0 <= 0 && t1 >= 1 ? l.segs[k].slice() : subSegment(l.segs[k], t0, t1);
+    if (!degenerate(piece, eps)) {
+      segs.push(piece);
+      chord.push(l.chord[k]);
+    }
+  };
+  if (a.seg === b.seg && b.t >= a.t + 1e-12) {
+    push(a.seg, a.t, b.t);
+    return { segs, chord };
+  }
+  push(a.seg, a.t, 1);
+  for (let k = (a.seg + 1) % n; k !== b.seg; k = (k + 1) % n) push(k, 0, 1);
+  push(b.seg, 0, b.t);
+  return { segs, chord };
+}
+function polySegs(points, eps) {
+  const out = [];
+  for (let i = 1; i < points.length; i++) if (!near(points[i - 1], points[i], eps)) out.push([points[i - 1], points[i]]);
+  return out;
+}
+function knifePath(path, fillRule, knife) {
+  const pts = knife.filter((p) => Number.isFinite(p[0]) && Number.isFinite(p[1]));
+  if (pts.length < 2) return null;
+  let faces = facesOf(path, fillRule);
+  if (!faces.length) return null;
+  const b = bezierPathBounds(path);
+  const size = b ? Math.max(b.maxX - b.minX, b.maxY - b.minY, 1) : 1;
+  const eps = size * 1e-9;
+  let cursor = -Infinity;
+  let cuts = 0;
+  for (let guard = 0; guard < 512; guard++) {
+    let best = null;
+    faces.forEach((face2, fi2) => {
+      const hits = [];
+      for (let m = 0; m < pts.length - 1; m++) {
+        if (m + 1 < cursor - 1e-9) continue;
+        const kb = { minX: Math.min(pts[m][0], pts[m + 1][0]), maxX: Math.max(pts[m][0], pts[m + 1][0]), minY: Math.min(pts[m][1], pts[m + 1][1]), maxY: Math.max(pts[m][1], pts[m + 1][1]) };
+        face2.loops.forEach(
+          (l, li) => l.segs.forEach((seg, si) => {
+            const sb = segmentBounds(seg);
+            if (sb.maxX < kb.minX - eps || sb.minX > kb.maxX + eps || sb.maxY < kb.minY - eps || sb.minY > kb.maxY + eps) return;
+            for (const h of lineHits(pts[m], pts[m + 1], seg)) {
+              const s = m + h.s;
+              if (s >= cursor - 1e-9) hits.push({ s, loop: li, seg: si, t: h.t, point: h.point });
+            }
+          })
+        );
+      }
+      hits.sort((x, y) => x.s - y.s);
+      const unique = hits.filter((h, i) => i === 0 || h.s - hits[i - 1].s > 1e-9 || !near(h.point, hits[i - 1].point, eps * 10));
+      const inside = (s) => {
+        const m = Math.min(pts.length - 2, Math.floor(s));
+        const u = s - m;
+        const q = [pts[m][0] + (pts[m + 1][0] - pts[m][0]) * u, pts[m][1] + (pts[m + 1][1] - pts[m][1]) * u];
+        return windingNumber(face2.loops.map((l) => l.segs), q) !== 0;
+      };
+      for (let i = 0; i < unique.length - 1; i++) {
+        const from2 = unique[i];
+        const to2 = unique[i + 1];
+        if (near(from2.point, to2.point, eps * 10) || !inside((from2.s + to2.s) / 2)) continue;
+        if (!best || from2.s < best.from.s) best = { face: fi2, from: from2, to: to2 };
+        break;
+      }
+    });
+    if (!best) break;
+    const { face: fi, from, to } = best;
+    const face = faces[fi];
+    const corners = [from.point];
+    for (let m = Math.floor(from.s) + 1; m <= to.s - 1e-12 && m < pts.length; m++) if (m > from.s) corners.push(pts[m]);
+    corners.push(to.point);
+    const forward = polySegs(corners, eps);
+    const back = polySegs(corners.slice().reverse(), eps);
+    const la = face.loops[from.loop];
+    const loops = face.loops.filter((_, i) => i !== from.loop && i !== to.loop);
+    if (from.loop === to.loop) {
+      const ab = arc(la, from, to, eps);
+      const ba = arc(la, to, from, eps);
+      loops.push(
+        { segs: [...ab.segs, ...back], chord: [...ab.chord, ...back.map(() => true)] },
+        { segs: [...ba.segs, ...forward], chord: [...ba.chord, ...forward.map(() => true)] }
+      );
+    } else {
+      const lb = face.loops[to.loop];
+      const roundA = arc(la, from, from, eps);
+      const roundB = arc(lb, to, to, eps);
+      loops.push({
+        segs: [...roundA.segs, ...forward, ...roundB.segs, ...back],
+        chord: [...roundA.chord, ...forward.map(() => true), ...roundB.chord, ...back.map(() => true)]
+      });
+    }
+    faces = [...faces.slice(0, fi), ...groupFaces(loops), ...faces.slice(fi + 1)];
+    cursor = to.s;
+    cuts++;
+  }
+  return cuts ? faces.map(faceToPath) : null;
+}
+function eraserRegion(points, width) {
+  const pts = points.filter((p) => Number.isFinite(p[0]) && Number.isFinite(p[1]));
+  const r = width / 2;
+  if (!pts.length || !(r > 0)) return [];
+  const moved = pts.some((p) => !near(p, pts[0], 1e-9));
+  if (!moved) {
+    const [cx, cy] = pts[0];
+    const k = r * 0.5522847498307936;
+    return [
+      { type: "M", x: cx, y: cy - r },
+      { type: "C", x1: cx + k, y1: cy - r, x2: cx + r, y2: cy - k, x: cx + r, y: cy },
+      { type: "C", x1: cx + r, y1: cy + k, x2: cx + k, y2: cy + r, x: cx, y: cy + r },
+      { type: "C", x1: cx - k, y1: cy + r, x2: cx - r, y2: cy + k, x: cx - r, y: cy },
+      { type: "C", x1: cx - r, y1: cy - k, x2: cx - k, y2: cy - r, x: cx, y: cy - r },
+      { type: "Z" }
+    ];
+  }
+  const line = [{ type: "M", x: pts[0][0], y: pts[0][1] }, ...pts.slice(1).map((p) => ({ type: "L", x: p[0], y: p[1] }))];
+  return outlineStroke(line, { width, cap: "round", join: "round" });
+}
+function eraseFromFill(path, fillRule, region) {
+  const overlap = pathBoolean("intersection", [{ path, fillRule }, { path: region }]).path;
+  if (!pathToContours(overlap).some((c) => Math.abs(contourSignedArea(closeContour(c, true))) > 1e-9)) return null;
+  const rest = pathBoolean("difference", [{ path, fillRule }, { path: region }]).path;
+  return splitIntoFaces(rest);
+}
+function eraseFromOutline(sp, region, options = {}) {
+  const regionSegs = pathToContours(region).flatMap((c) => closeContour(c, true));
+  if (!regionSegs.length) return null;
+  const rb = bezierPathBounds(region);
+  const count = subpathSegmentCount(sp);
+  if (!rb || count === 0) return null;
+  const inside = options.keep === "inside";
+  const removed = (p) => pointInBezierPath(region, p, options.fillRule ?? "nonzero") !== inside;
+  const runs = [];
+  let cur = [];
+  let any = false;
+  for (let i = 0; i < count; i++) {
+    const seg = subpathSegment(sp, i);
+    const sb = segmentBounds(seg);
+    const ts = [0, 1];
+    if (!(sb.maxX < rb.minX || sb.minX > rb.maxX || sb.maxY < rb.minY || sb.minY > rb.maxY)) {
+      for (const r of regionSegs) {
+        const b = segmentBounds(r);
+        if (b.maxX < sb.minX || b.minX > sb.maxX || b.maxY < sb.minY || b.minY > sb.maxY) continue;
+        for (const hit of segmentIntersections(seg, r)) if (hit.ta > 1e-9 && hit.ta < 1 - 1e-9) ts.push(hit.ta);
+      }
+    }
+    ts.sort((a, b) => a - b);
+    for (let k = 0; k < ts.length - 1; k++) {
+      const t0 = ts[k];
+      const t1 = ts[k + 1];
+      if (t1 - t0 < 1e-9) continue;
+      if (removed(segmentPoint(seg, (t0 + t1) / 2))) {
+        any = true;
+        if (cur.length) runs.push(cur);
+        cur = [];
+      } else cur.push({ seg: i, t0, t1 });
+    }
+  }
+  if (cur.length) runs.push(cur);
+  if (!any) return null;
+  if (sp.closed && runs.length >= 2) {
+    const first = runs[0][0];
+    const lastRun = runs[runs.length - 1];
+    const last = lastRun[lastRun.length - 1];
+    if (first.seg === 0 && first.t0 === 0 && last.seg === count - 1 && last.t1 === 1) lastRun.push(...runs.shift());
+  }
+  const out = [];
+  for (const run of runs) {
+    const anchors = [];
+    for (const { seg, t0, t1 } of run) {
+      const c = subSegment(subpathSegment(sp, seg), t0, t1);
+      const line = c.length === 2;
+      const start = c[0];
+      const end = c[c.length - 1];
+      if (!anchors.length) anchors.push({ x: start[0], y: start[1] });
+      if (!line) anchors[anchors.length - 1].out = { x: c[1][0], y: c[1][1] };
+      const next = { x: end[0], y: end[1] };
+      if (!line) next.in = { x: c[2][0], y: c[2][1] };
+      anchors.push(next);
+    }
+    if (anchors.length < 2) continue;
+    for (const a of anchors) {
+      const type = inferAnchorType(a);
+      if (type !== "corner") a.type = type;
+    }
+    out.push({ anchors, closed: false });
+  }
+  return out;
+}
+function polylineBounds(points, pad = 0) {
+  if (!points.length) return null;
+  let minX = Infinity;
+  let minY = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  for (const [x, y] of points) {
+    minX = Math.min(minX, x);
+    minY = Math.min(minY, y);
+    maxX = Math.max(maxX, x);
+    maxY = Math.max(maxY, y);
+  }
+  return { x: minX - pad, y: minY - pad, width: maxX - minX + 2 * pad, height: maxY - minY + 2 * pad };
+}
+function simplifyPolyline(points, tolerance) {
+  const n = points.length;
+  if (n < 3) return points.slice();
+  const keep = new Array(n).fill(false);
+  keep[0] = keep[n - 1] = true;
+  const stack = [[0, n - 1]];
+  while (stack.length) {
+    const [a, b] = stack.pop();
+    const [ax, ay] = points[a];
+    const dx = points[b][0] - ax;
+    const dy = points[b][1] - ay;
+    const len2 = Math.hypot(dx, dy);
+    let far = -1;
+    let farD = 0;
+    for (let i = a + 1; i < b; i++) {
+      const [px, py] = points[i];
+      const d = len2 < 1e-12 ? Math.hypot(px - ax, py - ay) : Math.abs((px - ax) * dy - (py - ay) * dx) / len2;
+      if (d > farD) {
+        farD = d;
+        far = i;
+      }
+    }
+    if (far >= 0 && farD > tolerance) {
+      keep[far] = true;
+      stack.push([a, far], [far, b]);
+    }
+  }
+  return points.filter((_, i) => keep[i]);
+}
+
+// src/vector/filters.ts
+var VECTOR_FILTER_DEFAULTS = {
+  dropShadow: { color: "#000000", opacity: 0.25, offsetX: 0, offsetY: 4, blur: 4, spread: 0 },
+  innerShadow: { color: "#000000", opacity: 0.25, offsetX: 0, offsetY: 4, blur: 4, spread: 0 },
+  outerGlow: { color: "#ffffbe", opacity: 0.75, blur: 10, spread: 0 },
+  innerGlow: { color: "#ffffbe", opacity: 0.75, blur: 10, spread: 0 },
+  layerBlur: { radius: 4 },
+  feather: { radius: 8 }
+};
+var VECTOR_FILTER_LABELS = {
+  dropShadow: "Drop Shadow",
+  innerShadow: "Inner Shadow",
+  outerGlow: "Outer Glow",
+  innerGlow: "Inner Glow",
+  layerBlur: "Layer Blur",
+  feather: "Feather"
+};
+var SHADOW_SPECS = [
+  { key: "color", label: "Color", kind: "color" },
+  { key: "opacity", label: "Opacity", kind: "number", min: 0, max: 1, step: 0.01, slider: true },
+  { key: "offsetX", label: "X", kind: "number", min: -1e3, max: 1e3, step: 1 },
+  { key: "offsetY", label: "Y", kind: "number", min: -1e3, max: 1e3, step: 1 },
+  { key: "blur", label: "Blur", kind: "number", min: 0, max: 500, step: 1 },
+  { key: "spread", label: "Spread", kind: "number", min: 0, max: 500, step: 1 }
+];
+var GLOW_SPECS = SHADOW_SPECS.filter((s) => s.key !== "offsetX" && s.key !== "offsetY");
+var VECTOR_FILTER_PARAM_SPECS = {
+  dropShadow: SHADOW_SPECS,
+  innerShadow: SHADOW_SPECS.map((s) => s.key === "spread" ? { ...s, label: "Choke" } : s),
+  outerGlow: GLOW_SPECS,
+  innerGlow: GLOW_SPECS.map((s) => s.key === "spread" ? { ...s, label: "Choke" } : s),
+  layerBlur: [{ key: "radius", label: "Radius", kind: "number", min: 0, max: 500, step: 1, slider: true }],
+  feather: [{ key: "radius", label: "Radius", kind: "number", min: 0, max: 500, step: 1, slider: true }]
+};
+function isVectorFilterType(value) {
+  return typeof value === "string" && VECTOR_FILTER_TYPES.includes(value);
+}
+function normalizeVectorFilterParams(type, params, base) {
+  if (!isVectorFilterType(type)) return null;
+  const out = { ...VECTOR_FILTER_DEFAULTS[type], ...base ?? {} };
+  for (const spec of VECTOR_FILTER_PARAM_SPECS[type]) {
+    const v2 = params?.[spec.key];
+    if (v2 === void 0) continue;
+    if (spec.kind === "number" && typeof v2 === "number" && Number.isFinite(v2)) out[spec.key] = Math.min(spec.max ?? Infinity, Math.max(spec.min ?? -Infinity, v2));
+    else if (spec.kind === "color" && typeof v2 === "string" && v2.trim()) out[spec.key] = v2.trim();
+  }
+  return out;
+}
+function vectorFilterParamKeys(type) {
+  return VECTOR_FILTER_PARAM_SPECS[type].map((s) => s.key);
+}
+function createVectorFilter(type, id, params) {
+  const p = normalizeVectorFilterParams(type, params);
+  return p ? { id, type, params: p } : null;
+}
+function sanitizeVectorFilters(value) {
+  if (!Array.isArray(value)) return [];
+  const out = [];
+  const used = /* @__PURE__ */ new Set();
+  for (const raw of value) {
+    if (!raw || typeof raw !== "object") continue;
+    const r = raw;
+    if (!isVectorFilterType(r.type)) continue;
+    let id = typeof r.id === "string" && r.id && !used.has(r.id) ? r.id : "";
+    for (let k = out.length + 1; !id; k++) if (!used.has(`filter${k}`)) id = `filter${k}`;
+    used.add(id);
+    const filter = createVectorFilter(r.type, id, r.params ?? {});
+    out.push(r.enabled === false ? { ...filter, enabled: false } : filter);
+  }
+  return out;
+}
+function activeVectorFilters(node) {
+  return (node.filters ?? []).filter((f) => {
+    if (f.enabled === false || !isVectorFilterType(f.type)) return false;
+    if (f.type === "layerBlur" || f.type === "feather") return f.params.radius > 0;
+    return f.params.opacity > 0;
+  });
+}
+function vectorFilterReach(filters) {
+  let outer = 0;
+  let blur = 0;
+  for (const f of filters) {
+    switch (f.type) {
+      case "dropShadow":
+      case "innerShadow":
+        outer = Math.max(outer, Math.max(Math.abs(f.params.offsetX), Math.abs(f.params.offsetY)) + f.params.blur * 1.5 + f.params.spread);
+        break;
+      case "outerGlow":
+      case "innerGlow":
+        outer = Math.max(outer, f.params.blur * 1.5 + f.params.spread);
+        break;
+      case "layerBlur":
+        blur += f.params.radius * 1.5;
+        break;
+    }
+  }
+  return outer + blur;
+}
+var round = (n) => Math.round(n * 1e3) / 1e3;
+var fe = (tag, attrs, children) => ({ tag, attrs, ...children ? { children } : {} });
+function vectorFilterSvg(filters, id, bounds) {
+  const active = filters.filter((f) => activeVectorFilters({ filters: [f] }).length);
+  if (!active.length || !bounds) return null;
+  const primitives = [];
+  let body = "SourceGraphic";
+  let n = 0;
+  const name = (part) => `${part}${n}`;
+  for (const f of active) {
+    if (f.type !== "innerShadow" && f.type !== "innerGlow") continue;
+    n++;
+    const p = f.params;
+    primitives.push(fe("feComponentTransfer", { in: "SourceAlpha", result: name("inv") }, [fe("feFuncA", { type: "table", tableValues: "1 0" })]));
+    let last = name("inv");
+    if (f.type === "innerShadow" && (f.params.offsetX || f.params.offsetY)) {
+      primitives.push(fe("feOffset", { in: last, dx: round(f.params.offsetX), dy: round(f.params.offsetY), result: name("off") }));
+      last = name("off");
+    }
+    if (p.spread > 0) {
+      primitives.push(fe("feMorphology", { in: last, operator: "dilate", radius: round(p.spread), result: name("grow") }));
+      last = name("grow");
+    }
+    if (p.blur > 0) {
+      primitives.push(fe("feGaussianBlur", { in: last, stdDeviation: round(p.blur / 2), result: name("blur") }));
+      last = name("blur");
+    }
+    primitives.push(fe("feFlood", { "flood-color": p.color, "flood-opacity": round(p.opacity), result: name("color") }));
+    primitives.push(fe("feComposite", { in: name("color"), in2: last, operator: "in", result: name("tint") }));
+    primitives.push(fe("feComposite", { in: name("tint"), in2: "SourceAlpha", operator: "in", result: name("inner") }));
+    primitives.push(fe("feComposite", { in: name("inner"), in2: body, operator: "over", result: name("body") }));
+    body = name("body");
+  }
+  for (const f of active) {
+    if (f.type !== "feather") continue;
+    n++;
+    const r = f.params.radius;
+    primitives.push(fe("feMorphology", { in: "SourceAlpha", operator: "erode", radius: round(r / 2), result: name("core") }));
+    primitives.push(fe("feGaussianBlur", { in: name("core"), stdDeviation: round(r / 4), result: name("fade") }));
+    primitives.push(fe("feComposite", { in: body, in2: name("fade"), operator: "in", result: name("body") }));
+    body = name("body");
+  }
+  const under = [];
+  for (const f of active) {
+    if (f.type !== "dropShadow" && f.type !== "outerGlow") continue;
+    n++;
+    const p = f.params;
+    let last = "SourceAlpha";
+    if (p.spread > 0) {
+      primitives.push(fe("feMorphology", { in: last, operator: "dilate", radius: round(p.spread), result: name("grow") }));
+      last = name("grow");
+    }
+    if (p.blur > 0) {
+      primitives.push(fe("feGaussianBlur", { in: last, stdDeviation: round(p.blur / 2), result: name("blur") }));
+      last = name("blur");
+    }
+    if (f.type === "dropShadow" && (f.params.offsetX || f.params.offsetY)) {
+      primitives.push(fe("feOffset", { in: last, dx: round(f.params.offsetX), dy: round(f.params.offsetY), result: name("off") }));
+      last = name("off");
+    }
+    primitives.push(fe("feFlood", { "flood-color": p.color, "flood-opacity": round(p.opacity), result: name("color") }));
+    primitives.push(fe("feComposite", { in: name("color"), in2: last, operator: "in", result: name("shadow") }));
+    under.push(name("shadow"));
+  }
+  if (under.length) {
+    n++;
+    primitives.push(fe("feMerge", { result: name("merged") }, [...under, body].map((i) => fe("feMergeNode", { in: i }))));
+    body = name("merged");
+  }
+  for (const f of active) {
+    if (f.type !== "layerBlur") continue;
+    n++;
+    primitives.push(fe("feGaussianBlur", { in: body, stdDeviation: round(f.params.radius / 2), result: name("body") }));
+    body = name("body");
+  }
+  const lastResult = primitives[primitives.length - 1]?.attrs.result;
+  if (lastResult !== body) primitives.push(fe("feMerge", {}, [fe("feMergeNode", { in: body })]));
+  const pad = vectorFilterReach(active) + 2;
+  return {
+    id,
+    x: round(bounds.x - pad),
+    y: round(bounds.y - pad),
+    width: round(bounds.width + 2 * pad),
+    height: round(bounds.height + 2 * pad),
+    primitives
+  };
+}
+var escapeAttr = (value) => value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+function primitiveMarkup(p) {
+  const attrs = Object.entries(p.attrs).map(([k, v2]) => ` ${k}="${escapeAttr(String(v2))}"`).join("");
+  return p.children?.length ? `<${p.tag}${attrs}>${p.children.map(primitiveMarkup).join("")}</${p.tag}>` : `<${p.tag}${attrs}/>`;
+}
+function vectorFilterMarkup(filter, extra = "") {
+  return `<filter id="${escapeAttr(filter.id)}" filterUnits="userSpaceOnUse" x="${filter.x}" y="${filter.y}" width="${filter.width}" height="${filter.height}" color-interpolation-filters="sRGB"${extra}>${filter.primitives.map(primitiveMarkup).join("")}</filter>`;
+}
+var VECTOR_FILTER_MENU = VECTOR_FILTER_TYPES.map((type) => ({ type, label: VECTOR_FILTER_LABELS[type] }));
+
+// src/vector/mask.ts
+function isVectorMaskType(value) {
+  return typeof value === "string" && VECTOR_MASK_TYPES.includes(value);
+}
+function sanitizeVectorMask(value) {
+  if (!value || typeof value !== "object") return null;
+  const r = value;
+  if (!isVectorMaskType(r.type)) return null;
+  return r.invert === true ? { type: r.type, invert: true } : { type: r.type };
+}
+function isVectorMaskGroup(node) {
+  return node?.type === "group" && !!node.mask && isVectorMaskType(node.mask.type) && !node.blend && !node.liveBoolean && node.children.length > 0;
+}
+function isVectorMaskActive(node) {
+  return isVectorMaskGroup(node) && node.children[0].visible !== false;
+}
+function vectorMaskSource(node) {
+  return isVectorMaskGroup(node) ? node.children[0] : null;
+}
+function vectorMaskContents(group) {
+  return isVectorMaskGroup(group) ? group.children.slice(1) : group.children;
+}
+function vectorMaskOwner(nodes, id) {
+  for (const n of nodes) {
+    if (n.type !== "group") continue;
+    if (isVectorMaskGroup(n) && n.children[0].id === id) return n;
+    const inner = vectorMaskOwner(n.children, id);
+    if (inner) return inner;
+  }
+  return null;
+}
+function vectorMaskSummary(node) {
+  if (!isVectorMaskGroup(node)) return null;
+  return {
+    type: node.mask.type,
+    invert: !!node.mask.invert,
+    maskId: node.children[0].id,
+    contents: node.children.slice(1).map((c) => c.id),
+    enabled: node.children[0].visible !== false
+  };
+}
+var place = (path, m) => isIdentityMatrix(m) ? path : transformBezierPath(path, m);
+function vectorMaskRegionShapes(node, type, parent = IDENTITY_MATRIX, self = true) {
+  if (!self && node.visible === false) return [];
+  const m = multiplyMatrices(nodeMatrix(node), parent);
+  if (isVectorMaskActive(node) || node.type === "group" && node.effects?.length) {
+    return vectorAppearanceShapes(node).flatMap((s) => regionOfPath(s.path, s.source, type, m));
+  }
+  const drawn = expandVectorAppearance(node);
+  if (drawn.type === "group") {
+    const inner = multiplyMatrices(nodeMatrix(drawn), parent);
+    return drawn.children.flatMap((c) => vectorMaskRegionShapes(c, type, inner, false));
+  }
+  return regionOfPath(subpathsToBezier(drawn.subpaths), drawn, type, m);
+}
+function regionOfPath(path, style, type, m) {
+  if (!path.length) return [];
+  const fillRule = style.fillRule ?? "nonzero";
+  if (type === "clip") return [{ path: place(path, m), fillRule }];
+  const out = [];
+  let filled = false;
+  for (const l of vectorPaintLayerNodes(style)) {
+    if (!l.drawn) continue;
+    if (l.kind === "fill") {
+      if (!filled) out.push({ path: place(path, m), fillRule });
+      filled = true;
+    } else if ((l.node.strokeWidth ?? 1) > 0) {
+      const area = vectorStrokeOutlinePath(path, l.node);
+      if (area.length) out.push({ path: place(area, m), fillRule: "nonzero" });
+    }
+  }
+  return out;
+}
+var regionCache = /* @__PURE__ */ new WeakMap();
+function vectorMaskRegion(group) {
+  let hit = regionCache.get(group);
+  if (!hit) {
+    hit = vectorMaskRegionShapes(group.children[0], group.mask.type);
+    regionCache.set(group, hit);
+  }
+  return hit;
+}
+var unionCache = /* @__PURE__ */ new WeakMap();
+function vectorMaskRegionPath(group) {
+  let hit = unionCache.get(group);
+  if (!hit) {
+    const shapes = vectorMaskRegion(group);
+    hit = !shapes.length ? [] : shapes.length === 1 && shapes[0].fillRule === "nonzero" ? shapes[0].path : pathBoolean("union", shapes.map((s) => ({ path: s.path, fillRule: s.fillRule }))).path;
+    unionCache.set(group, hit);
+  }
+  return hit;
+}
+function inRegion(group, p, tolerance) {
+  const pt2 = [p.x, p.y];
+  for (const s of vectorMaskRegion(group)) {
+    if (pointInBezierPath(s.path, pt2, s.fillRule)) return true;
+    if (tolerance > 0 && distanceToBezierPath(s.path, pt2) <= tolerance) return true;
+  }
+  return false;
+}
+function vectorMaskContains(group, p, tolerance = 0) {
+  if (!isVectorMaskActive(group)) return true;
+  if (group.mask.type !== "clip") {
+    const source = group.children[0];
+    const hit = hitTestVectorNode(source.visible === false ? { ...source, visible: true } : source, p, group.mask.invert ? 0 : tolerance);
+    return group.mask.invert ? !hit || tolerance > 0 && hitNearEdge(group, p, tolerance) : hit;
+  }
+  if (!group.mask.invert) return inRegion(group, p, tolerance);
+  return !inRegion(group, p, 0) || hitNearEdge(group, p, tolerance);
+}
+function hitNearEdge(group, p, tolerance) {
+  if (tolerance <= 0) return false;
+  return vectorMaskRegion(group).some((s) => distanceToBezierPath(s.path, [p.x, p.y]) <= tolerance);
+}
+function clipOpen(path, region, invert2) {
+  const out = [];
+  for (const sp of bezierToSubpaths(path)) {
+    const pieces = eraseFromOutline(sp, region, { keep: invert2 ? "outside" : "inside" });
+    if (pieces === null) {
+      const a = sp.anchors[0];
+      const inside = !!a && pointInBezierPath(region, [a.x, a.y], "nonzero");
+      if (inside !== invert2) out.push(...subpathsToBezier([sp]));
+    } else out.push(...subpathsToBezier(pieces));
+  }
+  return out;
+}
+function clipShapePath(path, fillRule, region, invert2) {
+  const subpaths = bezierToSubpaths(path);
+  const closed = subpaths.filter((sp) => sp.closed);
+  const open = subpaths.filter((sp) => !sp.closed);
+  const out = [];
+  if (closed.length) {
+    const operands = [{ path: subpathsToBezier(closed), fillRule }, { path: region, fillRule: "nonzero" }];
+    out.push(...region.length ? pathBoolean(invert2 ? "difference" : "intersection", operands).path : invert2 ? operands[0].path : []);
+  }
+  if (open.length) out.push(...region.length ? clipOpen(subpathsToBezier(open), region, invert2) : invert2 ? subpathsToBezier(open) : []);
+  return out;
+}
+function vectorMaskedShapes(group) {
+  const contents = group.children.flatMap((c, i) => i === 0 ? [] : vectorChildAppearanceShapes(c, i));
+  const shapes = applyVectorEffects(contents, group.effects);
+  if (!isVectorMaskActive(group)) return shapes;
+  const region = vectorMaskRegionPath(group);
+  const invert2 = !!group.mask.invert;
+  const out = [];
+  for (const s of shapes) {
+    const path = clipShapePath(s.path, s.source.fillRule ?? "nonzero", region, invert2);
+    if (path.length) out.push({ ...s, path, source: s.source.fillRule === "evenodd" ? { ...s.source, fillRule: "nonzero" } : s.source });
+  }
+  return out;
+}
+function vectorMaskedGeometry(node) {
+  if (node.type !== "group") return node;
+  if (isVectorMaskActive(node)) {
+    return {
+      id: node.id,
+      type: "group",
+      ...node.transform ? { transform: node.transform } : {},
+      ...node.opacity !== void 0 ? { opacity: node.opacity } : {},
+      ...node.visible === false ? { visible: false } : {},
+      ...node.locked ? { locked: true } : {},
+      children: vectorAppearanceNodes(node)
+    };
+  }
+  let changed = false;
+  const children = node.children.map((c) => {
+    const next = vectorMaskedGeometry(c);
+    if (next !== c) changed = true;
+    return next;
+  });
+  return changed ? { ...node, children } : node;
+}
+function vectorMaskedLocalBounds(group) {
+  const b = bezierPathBounds(vectorAppearanceShapes(group).flatMap((s) => s.path));
+  return b ? { x: b.minX, y: b.minY, width: b.maxX - b.minX, height: b.maxY - b.minY } : null;
+}
+function paintReach(node) {
+  const own = vectorFilterReach(activeVectorFilters(node));
+  if (node.type === "path") return own + vectorStrokeStackReach(node);
+  return own + Math.max(0, ...node.children.map(paintReach));
+}
+function vectorMaskContentBounds(group) {
+  const contents = group.children.slice(1);
+  const b = unionBounds(contents.map((c) => vectorNodeBounds(c, IDENTITY_MATRIX)));
+  if (!b) return null;
+  const pad = Math.max(0, ...contents.map(paintReach)) + Math.max(b.width, b.height) * 0.05 + 4;
+  return { x: b.x - pad, y: b.y - pad, width: b.width + 2 * pad, height: b.height + 2 * pad };
+}
+var fe2 = (tag, attrs) => ({ tag, attrs });
+var LUMA = "-0.2125 -0.7154 -0.0721 0 1";
+function invertFilter(type, id, bounds) {
+  const primitives = type === "alpha" ? [fe2("feColorMatrix", { in: "SourceGraphic", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1 1" })] : [
+    // Over black first, so a transparent area reads as dark (hidden) before inverting.
+    fe2("feFlood", { "flood-color": "#000000", result: "black" }),
+    fe2("feComposite", { in: "SourceGraphic", in2: "black", operator: "over", result: "flat" }),
+    fe2("feColorMatrix", { in: "flat", type: "matrix", values: `${LUMA} ${LUMA} ${LUMA} 0 0 0 0 1` })
+  ];
+  const r = (n) => Math.round(n * 1e3) / 1e3;
+  return { id, x: r(bounds.x), y: r(bounds.y), width: r(bounds.width), height: r(bounds.height), primitives };
+}
+var rectPath = (b) => [
+  { type: "M", x: b.x, y: b.y },
+  { type: "L", x: b.x + b.width, y: b.y },
+  { type: "L", x: b.x + b.width, y: b.y + b.height },
+  { type: "L", x: b.x, y: b.y + b.height },
+  { type: "Z" }
+];
+function vectorMaskRenderData(group, id, filterId, precision = 3) {
+  if (!isVectorMaskActive(group) || group.children.length < 2) return null;
+  const invert2 = !!group.mask.invert;
+  const bounds = vectorMaskContentBounds(group);
+  if (group.mask.type === "clip") {
+    const shapes = vectorMaskRegion(group);
+    if (!invert2) return { type: "clip", invert: invert2, id, clip: shapes.map((s) => ({ d: bezierPathToSvg(s.path, { precision }), clipRule: s.fillRule })) };
+    const box = bounds ?? { x: 0, y: 0, width: 0, height: 0 };
+    const region = vectorMaskRegionPath(group);
+    return { type: "clip", invert: invert2, id, clip: [{ d: bezierPathToSvg([...rectPath(box), ...region], { precision }), clipRule: "evenodd" }] };
+  }
+  if (!bounds) return null;
+  if (!invert2) return { type: group.mask.type, invert: invert2, id, bounds };
+  const filter = invertFilter(group.mask.type, filterId, bounds);
+  return { type: group.mask.type, invert: invert2, id, bounds, filter: `url(#${filterId})`, invertFilter: filter };
+}
+
 // src/vector/warp.ts
 function polylineAt(pts) {
   const acc = [0];
@@ -2829,7 +3595,7 @@ function applyVectorEffects(shapes, effects) {
   }
   return list;
 }
-function childShapes(child, index) {
+function vectorChildAppearanceShapes(child, index) {
   if (child.visible === false) return [];
   const m = child.transform;
   const k = child.opacity ?? 1;
@@ -2844,7 +3610,7 @@ function liveBooleanShapes(group) {
   const operands = [];
   let source = null;
   group.children.forEach((child, i) => {
-    const shapes = childShapes(child, i);
+    const shapes = vectorChildAppearanceShapes(child, i);
     if (!shapes.length) return;
     source ??= shapes[0].source;
     const path = shapes.length === 1 ? shapes[0].path : pathBoolean("union", shapes.map((s) => ({ path: s.path, fillRule: s.source.fillRule ?? "nonzero" }))).path;
@@ -2858,7 +3624,8 @@ var shapeCache = /* @__PURE__ */ new WeakMap();
 function baseShapes(node) {
   if (node.type === "path") return [{ source: node, path: subpathsToBezier(node.subpaths), opacity: 1, order: [] }];
   if (node.liveBoolean) return liveBooleanShapes(node);
-  return node.children.flatMap((c, i) => childShapes(c, i));
+  if (isVectorMaskGroup(node)) return node.children.flatMap((c, i) => i === 0 ? [] : vectorChildAppearanceShapes(c, i));
+  return node.children.flatMap((c, i) => vectorChildAppearanceShapes(c, i));
 }
 function vectorEffectInputPaths(node, effectId) {
   const list = node.effects ?? [];
@@ -2883,7 +3650,7 @@ function vectorEnvelopeFrame(node, effectId) {
 function vectorAppearanceShapes(node) {
   const hit = shapeCache.get(node);
   if (hit) return hit;
-  const out = applyVectorEffects(baseShapes(node), node.effects).sort((a, b) => compareOrder(a.order, b.order));
+  const out = (isVectorMaskGroup(node) ? vectorMaskedShapes(node) : applyVectorEffects(baseShapes(node), node.effects)).sort((a, b) => compareOrder(a.order, b.order));
   shapeCache.set(node, out);
   return out;
 }
@@ -2939,6 +3706,11 @@ function expandVectorAppearance(node) {
   if (!hasOwnVectorAppearance(node)) {
     const group = node;
     out = { ...group, children: group.children.map(expandVectorAppearance) };
+  } else if (isVectorMaskGroup(node)) {
+    const { effects, ...group } = node;
+    const [mask, ...contents] = node.children;
+    const wrapper = { id: `${node.id}~content`, type: "group", effects, children: contents };
+    out = { ...group, children: [expandVectorAppearance(mask), ...contents.length ? [expandVectorAppearance(wrapper)] : []] };
   } else {
     const shapes = vectorAppearanceShapes(node);
     if (node.type === "path" && shapes.length === 1) {
@@ -3010,10 +3782,10 @@ function vectorEnteredGroups(nodes, ids) {
   const want = new Set(ids);
   const visit = (list, live) => {
     for (const n of list) {
-      const own = n.type === "group" && hasOwnVectorAppearance(n);
+      const own = n.type === "group" && (hasOwnVectorAppearance(n) || isVectorMaskGroup(n));
       if (want.has(n.id)) {
         for (const id of live) out.add(id);
-        if (own) out.add(n.id);
+        if (own && hasOwnVectorAppearance(n)) out.add(n.id);
       }
       if (n.type === "group") visit(n.children, own ? [...live, n.id] : live);
     }
@@ -3200,6 +3972,11 @@ function vectorPathWorldBezier(node, parent = IDENTITY_MATRIX, options = {}) {
   return isIdentityMatrix(m) ? path : transformBezierPath(path, m);
 }
 function vectorNodeBounds(node, parent = IDENTITY_MATRIX) {
+  if (isVectorMaskActive(node)) {
+    const m = multiplyMatrices(nodeMatrix(node), parent);
+    const b2 = bezierPathBounds(vectorAppearanceShapes(node).flatMap((s) => isIdentityMatrix(m) ? s.path : transformBezierPath(s.path, m)));
+    return b2 ? { x: b2.minX, y: b2.minY, width: b2.maxX - b2.minX, height: b2.maxY - b2.minY } : null;
+  }
   node = expandVectorAppearance(node);
   if (node.type === "group") {
     const m = multiplyMatrices(nodeMatrix(node), parent);
@@ -3232,6 +4009,14 @@ function boundsFromPoints(a, b) {
 }
 function hitTestVectorNode(node, p, tolerance = 0, parent = IDENTITY_MATRIX, options = {}) {
   if (node.visible === false) return false;
+  if (isVectorMaskGroup(node)) {
+    const m = multiplyMatrices(nodeMatrix(node), parent);
+    const entered = !!options.entered?.has(node.id);
+    if (!entered && isVectorMaskActive(node) && !vectorMaskContains(node, applyMatrix(invertMatrix(m), p), tolerance)) return false;
+    const shown = !entered && hasOwnVectorAppearance(node) ? expandVectorAppearance(node).children : node.children;
+    for (let i = shown.length - 1; i >= 1; i--) if (hitTestVectorNode(shown[i], p, tolerance, m, options)) return true;
+    return entered && hitTestVectorMaskSource(node, p, tolerance, m, options);
+  }
   if (!(node.type === "group" && (!hasOwnVectorAppearance(node) || options.entered?.has(node.id)))) node = expandVectorAppearance(node);
   if (node.type === "group") {
     const m = multiplyMatrices(nodeMatrix(node), parent);
@@ -3241,6 +4026,18 @@ function hitTestVectorNode(node, p, tolerance = 0, parent = IDENTITY_MATRIX, opt
   if (path.length === 0) return false;
   return hitTestVectorPaintStack(node, path, p, tolerance);
 }
+function hitTestVectorMaskSource(group, p, tolerance, m, options) {
+  const source = group.children[0];
+  if (source.visible === false) return false;
+  if (group.mask?.type !== "clip") return hitTestVectorNode(source, p, tolerance, m, options);
+  const paths = collectPathNodes(source).filter((n) => n.visible !== false);
+  const pt2 = [p.x, p.y];
+  return paths.some((n) => {
+    const world = vectorParentMatrix([source], n.id);
+    const path = vectorPathWorldBezier(n, multiplyMatrices(world ?? IDENTITY_MATRIX, m));
+    return pointInBezierPath(path, pt2, n.fillRule ?? "nonzero") || distanceToBezierPath(path, pt2) <= tolerance;
+  });
+}
 function vectorStrokeOutline(node, parent = IDENTITY_MATRIX) {
   if (!hasPaint(node.stroke) || !((node.strokeWidth ?? 1) > 0)) return [];
   return vectorStrokeOutlinePath(vectorPathWorldBezier(node, parent), node);
@@ -3498,14 +4295,14 @@ function roundSubpaths(subpaths, precision = 3) {
 
 // src/vector/pathEffects.ts
 var EPS3 = 1e-9;
-var degenerate = (s) => s.every((p) => Math.abs(p[0] - s[0][0]) < EPS3 && Math.abs(p[1] - s[0][1]) < EPS3);
+var degenerate2 = (s) => s.every((p) => Math.abs(p[0] - s[0][0]) < EPS3 && Math.abs(p[1] - s[0][1]) < EPS3);
 function raise(seg) {
   if (seg.length !== 3) return seg.map((p) => [p[0], p[1]]);
   const [p0, p1, p2] = seg;
   return [p0, [p0[0] + 2 / 3 * (p1[0] - p0[0]), p0[1] + 2 / 3 * (p1[1] - p0[1])], [p2[0] + 2 / 3 * (p1[0] - p2[0]), p2[1] + 2 / 3 * (p1[1] - p2[1])], p2];
 }
 function subsOf(path) {
-  return pathToContours(path).map((c) => ({ segs: closeContour(c).filter((s) => !degenerate(s)).map(raise), closed: c.closed })).filter((s) => s.segs.length > 0);
+  return pathToContours(path).map((c) => ({ segs: closeContour(c).filter((s) => !degenerate2(s)).map(raise), closed: c.closed })).filter((s) => s.segs.length > 0);
 }
 var subsToPath = (subs) => contoursToPath(subs.map((s) => ({ segments: s.segs, closed: s.closed })));
 var unit2 = (x, y) => {
@@ -3557,7 +4354,7 @@ var Measured = class {
    */
   append(sa, sb, out) {
     for (const piece of trimSegments(this.segs, sa, sb, this.lens)) {
-      if (degenerate(piece)) continue;
+      if (degenerate2(piece)) continue;
       const last = out[out.length - 1]?.segs;
       const end = last?.[last.length - 1]?.at(-1);
       if (!end || Math.hypot(end[0] - piece[0][0], end[1] - piece[0][1]) > 1e-6) out.push({ segs: [piece], closed: false });
@@ -4329,14 +5126,14 @@ function lerpStops(a, b, t) {
 function lerpGradient(a, b, t) {
   if (a.type !== b.type) return null;
   const { stops, resampled } = lerpStops(a, b, t);
-  const near = t < 0.5 ? a : b;
+  const near2 = t < 0.5 ? a : b;
   const out = { type: a.type, stops };
   if (!resampled) {
     if (a.interpolation && a.interpolation !== "srgb") out.interpolation = a.interpolation;
     if (a.smoothness) out.smoothness = a.smoothness;
   }
-  if (near.spread && near.spread !== "pad") out.spread = near.spread;
-  if (near.strokeMode && near.strokeMode !== "within") out.strokeMode = near.strokeMode;
+  if (near2.spread && near2.spread !== "pad") out.spread = near2.spread;
+  if (near2.strokeMode && near2.strokeMode !== "within") out.strokeMode = near2.strokeMode;
   const ea = hasExplicitGradientGeometry(a);
   const eb = hasExplicitGradientGeometry(b);
   if (!ea && !eb) {
@@ -4354,7 +5151,7 @@ function lerpGradient(a, b, t) {
   const pa = vectorGradientPoints(a);
   const pb = vectorGradientPoints(b);
   if (pa.units !== pb.units) {
-    const src = explicitVectorGradient(near);
+    const src = explicitVectorGradient(near2);
     return { ...src, stops: out.stops, ...out.interpolation ? { interpolation: out.interpolation } : {}, ...out.smoothness ? { smoothness: out.smoothness } : {} };
   }
   out.start = lerpPoint(pa.start, pb.start, t);
@@ -4414,14 +5211,14 @@ function lerpDashes(a, b, t) {
 }
 var SWITCHED_KEYS = ["strokeLinecap", "strokeLinejoin", "fillRule", "strokeAlign", "startArrow", "endArrow", "arrowAlign"];
 function interpolateVectorStyle(a, b, t) {
-  const near = t < 0.5 ? a : b;
+  const near2 = t < 0.5 ? a : b;
   const out = {};
   const fill = interpolateVectorPaint(a.fill, b.fill, t);
   if (fill !== void 0) out.fill = fill;
   const stroke = interpolateVectorPaint(a.stroke, b.stroke, t);
   if (stroke !== void 0) out.stroke = stroke;
   if (a.strokeWidth !== void 0 || b.strokeWidth !== void 0) out.strokeWidth = lerpN(a.strokeWidth ?? 1, b.strokeWidth ?? 1, t);
-  for (const key of SWITCHED_KEYS) if (near[key] !== void 0 && near[key] !== null) out[key] = near[key];
+  for (const key of SWITCHED_KEYS) if (near2[key] !== void 0 && near2[key] !== null) out[key] = near2[key];
   for (const key of ["startArrowScale", "endArrowScale"])
     if (a[key] !== void 0 || b[key] !== void 0) out[key] = lerpN(a[key] ?? 1, b[key] ?? 1, t);
   const dash = lerpDashes(a.strokeDasharray, b.strokeDasharray, t);
@@ -4486,283 +5283,88 @@ function preparePathMorph(a, b, options, ma = nodeMatrix(a), mb = nodeMatrix(b))
     return node;
   };
 }
-function flattenPaths(node, parent = IDENTITY_MATRIX) {
-  const m = multiplyMatrices(nodeMatrix(node), parent);
-  if (node.type === "path") return [{ path: node, m, opacity: 1 }];
-  const o = node.opacity ?? 1;
-  return node.children.filter((c) => c.visible !== false).flatMap((c) => flattenPaths(c, m)).map((e) => ({ ...e, opacity: e.opacity * o }));
-}
-var placedBounds = (path, m) => boundsOfPoints(contoursOf(path, m).flatMap((c) => c.pts));
-function collapsedPath(path, m, from, to) {
-  const own = placedBounds(path, m);
-  const c = own ? [own.x + own.width / 2, own.y + own.height / 2] : [0, 0];
-  const fx = from && from.width > 0 ? (c[0] - from.x) / from.width : 0.5;
-  const fy = from && from.height > 0 ? (c[1] - from.y) / from.height : 0.5;
-  const p = to ? { x: to.x + to.width * fx, y: to.y + to.height * fy } : { x: c[0], y: c[1] };
-  const subpaths = path.subpaths.map((sp) => ({ closed: sp.closed, anchors: sp.anchors.map(() => ({ x: p.x, y: p.y })) }));
-  const { transform: _t, ...rest } = path;
-  return { ...rest, subpaths };
-}
-function createVectorMorph(a, b, options = {}) {
-  if (a.type === "path" && b.type === "path") {
-    const at2 = preparePathMorph(a, b, options);
-    return { at: at2 };
-  }
-  const pa = flattenPaths(a);
-  const pb = flattenPaths(b);
-  const ba = unionBounds(pa.map((e) => placedBounds(e.path, e.m)));
-  const bb = unionBounds(pb.map((e) => placedBounds(e.path, e.m)));
-  const id = options.id ?? a.id;
-  const parts = [];
-  const opacities = [];
-  for (let i = 0; i < Math.max(pa.length, pb.length); i++) {
-    const x = pa[i];
-    const y = pb[i];
-    const sub5 = { ...options, id: `${id}-${i}`, starts: void 0 };
-    if (x && y) {
-      parts.push(preparePathMorph(x.path, y.path, sub5, x.m, y.m));
-      opacities.push([x.opacity, y.opacity]);
-    } else if (x) {
-      parts.push(preparePathMorph(x.path, collapsedPath(x.path, x.m, ba, bb), sub5, x.m, IDENTITY_MATRIX));
-      opacities.push([x.opacity, x.opacity]);
-    } else if (y) {
-      parts.push(preparePathMorph(collapsedPath(y.path, y.m, bb, ba), y.path, sub5, IDENTITY_MATRIX, y.m));
-      opacities.push([y.opacity, y.opacity]);
-    }
-  }
-  return {
-    at: (t) => {
-      const children = parts.map((p, i) => {
-        const n = p(t);
-        const o = lerpN(opacities[i][0], opacities[i][1], t) * (n.opacity ?? 1);
-        if (o < 1) n.opacity = o;
-        else delete n.opacity;
-        return n;
-      });
-      const group = { id, type: "group", children };
-      return group;
-    }
-  };
-}
-function interpolateVectorPaths(a, b, t, options = {}) {
-  return createVectorMorph(a, b, options).at(t);
-}
-var keyframeMorphs = /* @__PURE__ */ new WeakMap();
-function evaluateVectorPathKeyframes(keyframes, time, options = {}) {
-  const keys = keyframes.filter((k) => Number.isFinite(k.time)).sort((x, y) => x.time - y.time);
-  if (!keys.length) return null;
-  if (!(time > keys[0].time)) return keys[0].value;
-  const last = keys[keys.length - 1];
-  if (time >= last.time) return last.value;
-  let i = 0;
-  while (i + 1 < keys.length && keys[i + 1].time <= time) i++;
-  const a = keys[i];
-  const b = keys[i + 1];
-  if (time === a.time) return a.value;
-  if (a.easing === "hold") return a.value;
-  const span = b.time - a.time;
-  const u = Math.min(1, Math.max(0, evaluateEasing(a.easing, (time - a.time) / span, span)));
-  let inner = keyframeMorphs.get(a.value);
-  if (!inner) keyframeMorphs.set(a.value, inner = /* @__PURE__ */ new WeakMap());
-  let morph = inner.get(b.value);
-  if (!morph) inner.set(b.value, morph = createVectorMorph(a.value, b.value, options));
-  return morph.at(u);
-}
-
-// src/vector/filters.ts
-var VECTOR_FILTER_DEFAULTS = {
-  dropShadow: { color: "#000000", opacity: 0.25, offsetX: 0, offsetY: 4, blur: 4, spread: 0 },
-  innerShadow: { color: "#000000", opacity: 0.25, offsetX: 0, offsetY: 4, blur: 4, spread: 0 },
-  outerGlow: { color: "#ffffbe", opacity: 0.75, blur: 10, spread: 0 },
-  innerGlow: { color: "#ffffbe", opacity: 0.75, blur: 10, spread: 0 },
-  layerBlur: { radius: 4 },
-  feather: { radius: 8 }
-};
-var VECTOR_FILTER_LABELS = {
-  dropShadow: "Drop Shadow",
-  innerShadow: "Inner Shadow",
-  outerGlow: "Outer Glow",
-  innerGlow: "Inner Glow",
-  layerBlur: "Layer Blur",
-  feather: "Feather"
-};
-var SHADOW_SPECS = [
-  { key: "color", label: "Color", kind: "color" },
-  { key: "opacity", label: "Opacity", kind: "number", min: 0, max: 1, step: 0.01, slider: true },
-  { key: "offsetX", label: "X", kind: "number", min: -1e3, max: 1e3, step: 1 },
-  { key: "offsetY", label: "Y", kind: "number", min: -1e3, max: 1e3, step: 1 },
-  { key: "blur", label: "Blur", kind: "number", min: 0, max: 500, step: 1 },
-  { key: "spread", label: "Spread", kind: "number", min: 0, max: 500, step: 1 }
-];
-var GLOW_SPECS = SHADOW_SPECS.filter((s) => s.key !== "offsetX" && s.key !== "offsetY");
-var VECTOR_FILTER_PARAM_SPECS = {
-  dropShadow: SHADOW_SPECS,
-  innerShadow: SHADOW_SPECS.map((s) => s.key === "spread" ? { ...s, label: "Choke" } : s),
-  outerGlow: GLOW_SPECS,
-  innerGlow: GLOW_SPECS.map((s) => s.key === "spread" ? { ...s, label: "Choke" } : s),
-  layerBlur: [{ key: "radius", label: "Radius", kind: "number", min: 0, max: 500, step: 1, slider: true }],
-  feather: [{ key: "radius", label: "Radius", kind: "number", min: 0, max: 500, step: 1, slider: true }]
-};
-function isVectorFilterType(value) {
-  return typeof value === "string" && VECTOR_FILTER_TYPES.includes(value);
-}
-function normalizeVectorFilterParams(type, params, base) {
-  if (!isVectorFilterType(type)) return null;
-  const out = { ...VECTOR_FILTER_DEFAULTS[type], ...base ?? {} };
-  for (const spec of VECTOR_FILTER_PARAM_SPECS[type]) {
-    const v2 = params?.[spec.key];
-    if (v2 === void 0) continue;
-    if (spec.kind === "number" && typeof v2 === "number" && Number.isFinite(v2)) out[spec.key] = Math.min(spec.max ?? Infinity, Math.max(spec.min ?? -Infinity, v2));
-    else if (spec.kind === "color" && typeof v2 === "string" && v2.trim()) out[spec.key] = v2.trim();
-  }
-  return out;
-}
-function vectorFilterParamKeys(type) {
-  return VECTOR_FILTER_PARAM_SPECS[type].map((s) => s.key);
-}
-function createVectorFilter(type, id, params) {
-  const p = normalizeVectorFilterParams(type, params);
-  return p ? { id, type, params: p } : null;
-}
-function sanitizeVectorFilters(value) {
-  if (!Array.isArray(value)) return [];
-  const out = [];
-  const used = /* @__PURE__ */ new Set();
-  for (const raw of value) {
-    if (!raw || typeof raw !== "object") continue;
-    const r = raw;
-    if (!isVectorFilterType(r.type)) continue;
-    let id = typeof r.id === "string" && r.id && !used.has(r.id) ? r.id : "";
-    for (let k = out.length + 1; !id; k++) if (!used.has(`filter${k}`)) id = `filter${k}`;
-    used.add(id);
-    const filter = createVectorFilter(r.type, id, r.params ?? {});
-    out.push(r.enabled === false ? { ...filter, enabled: false } : filter);
-  }
-  return out;
-}
-function activeVectorFilters(node) {
-  return (node.filters ?? []).filter((f) => {
-    if (f.enabled === false || !isVectorFilterType(f.type)) return false;
-    if (f.type === "layerBlur" || f.type === "feather") return f.params.radius > 0;
-    return f.params.opacity > 0;
-  });
+function flattenPaths(node, parent = IDENTITY_MATRIX) {
+  const m = multiplyMatrices(nodeMatrix(node), parent);
+  if (node.type === "path") return [{ path: node, m, opacity: 1 }];
+  const o = node.opacity ?? 1;
+  return node.children.filter((c) => c.visible !== false).flatMap((c) => flattenPaths(c, m)).map((e) => ({ ...e, opacity: e.opacity * o }));
 }
-function vectorFilterReach(filters) {
-  let outer = 0;
-  let blur = 0;
-  for (const f of filters) {
-    switch (f.type) {
-      case "dropShadow":
-      case "innerShadow":
-        outer = Math.max(outer, Math.max(Math.abs(f.params.offsetX), Math.abs(f.params.offsetY)) + f.params.blur * 1.5 + f.params.spread);
-        break;
-      case "outerGlow":
-      case "innerGlow":
-        outer = Math.max(outer, f.params.blur * 1.5 + f.params.spread);
-        break;
-      case "layerBlur":
-        blur += f.params.radius * 1.5;
-        break;
-    }
-  }
-  return outer + blur;
+var placedBounds = (path, m) => boundsOfPoints(contoursOf(path, m).flatMap((c) => c.pts));
+function collapsedPath(path, m, from, to) {
+  const own = placedBounds(path, m);
+  const c = own ? [own.x + own.width / 2, own.y + own.height / 2] : [0, 0];
+  const fx = from && from.width > 0 ? (c[0] - from.x) / from.width : 0.5;
+  const fy = from && from.height > 0 ? (c[1] - from.y) / from.height : 0.5;
+  const p = to ? { x: to.x + to.width * fx, y: to.y + to.height * fy } : { x: c[0], y: c[1] };
+  const subpaths = path.subpaths.map((sp) => ({ closed: sp.closed, anchors: sp.anchors.map(() => ({ x: p.x, y: p.y })) }));
+  const { transform: _t, ...rest } = path;
+  return { ...rest, subpaths };
 }
-var round = (n) => Math.round(n * 1e3) / 1e3;
-var fe = (tag, attrs, children) => ({ tag, attrs, ...children ? { children } : {} });
-function vectorFilterSvg(filters, id, bounds) {
-  const active = filters.filter((f) => activeVectorFilters({ filters: [f] }).length);
-  if (!active.length || !bounds) return null;
-  const primitives = [];
-  let body = "SourceGraphic";
-  let n = 0;
-  const name = (part) => `${part}${n}`;
-  for (const f of active) {
-    if (f.type !== "innerShadow" && f.type !== "innerGlow") continue;
-    n++;
-    const p = f.params;
-    primitives.push(fe("feComponentTransfer", { in: "SourceAlpha", result: name("inv") }, [fe("feFuncA", { type: "table", tableValues: "1 0" })]));
-    let last = name("inv");
-    if (f.type === "innerShadow" && (f.params.offsetX || f.params.offsetY)) {
-      primitives.push(fe("feOffset", { in: last, dx: round(f.params.offsetX), dy: round(f.params.offsetY), result: name("off") }));
-      last = name("off");
-    }
-    if (p.spread > 0) {
-      primitives.push(fe("feMorphology", { in: last, operator: "dilate", radius: round(p.spread), result: name("grow") }));
-      last = name("grow");
-    }
-    if (p.blur > 0) {
-      primitives.push(fe("feGaussianBlur", { in: last, stdDeviation: round(p.blur / 2), result: name("blur") }));
-      last = name("blur");
-    }
-    primitives.push(fe("feFlood", { "flood-color": p.color, "flood-opacity": round(p.opacity), result: name("color") }));
-    primitives.push(fe("feComposite", { in: name("color"), in2: last, operator: "in", result: name("tint") }));
-    primitives.push(fe("feComposite", { in: name("tint"), in2: "SourceAlpha", operator: "in", result: name("inner") }));
-    primitives.push(fe("feComposite", { in: name("inner"), in2: body, operator: "over", result: name("body") }));
-    body = name("body");
-  }
-  for (const f of active) {
-    if (f.type !== "feather") continue;
-    n++;
-    const r = f.params.radius;
-    primitives.push(fe("feMorphology", { in: "SourceAlpha", operator: "erode", radius: round(r / 2), result: name("core") }));
-    primitives.push(fe("feGaussianBlur", { in: name("core"), stdDeviation: round(r / 4), result: name("fade") }));
-    primitives.push(fe("feComposite", { in: body, in2: name("fade"), operator: "in", result: name("body") }));
-    body = name("body");
+function createVectorMorph(a, b, options = {}) {
+  if (a.type === "path" && b.type === "path") {
+    const at2 = preparePathMorph(a, b, options);
+    return { at: at2 };
   }
-  const under = [];
-  for (const f of active) {
-    if (f.type !== "dropShadow" && f.type !== "outerGlow") continue;
-    n++;
-    const p = f.params;
-    let last = "SourceAlpha";
-    if (p.spread > 0) {
-      primitives.push(fe("feMorphology", { in: last, operator: "dilate", radius: round(p.spread), result: name("grow") }));
-      last = name("grow");
-    }
-    if (p.blur > 0) {
-      primitives.push(fe("feGaussianBlur", { in: last, stdDeviation: round(p.blur / 2), result: name("blur") }));
-      last = name("blur");
-    }
-    if (f.type === "dropShadow" && (f.params.offsetX || f.params.offsetY)) {
-      primitives.push(fe("feOffset", { in: last, dx: round(f.params.offsetX), dy: round(f.params.offsetY), result: name("off") }));
-      last = name("off");
+  const pa = flattenPaths(a);
+  const pb = flattenPaths(b);
+  const ba = unionBounds(pa.map((e) => placedBounds(e.path, e.m)));
+  const bb = unionBounds(pb.map((e) => placedBounds(e.path, e.m)));
+  const id = options.id ?? a.id;
+  const parts = [];
+  const opacities = [];
+  for (let i = 0; i < Math.max(pa.length, pb.length); i++) {
+    const x = pa[i];
+    const y = pb[i];
+    const sub5 = { ...options, id: `${id}-${i}`, starts: void 0 };
+    if (x && y) {
+      parts.push(preparePathMorph(x.path, y.path, sub5, x.m, y.m));
+      opacities.push([x.opacity, y.opacity]);
+    } else if (x) {
+      parts.push(preparePathMorph(x.path, collapsedPath(x.path, x.m, ba, bb), sub5, x.m, IDENTITY_MATRIX));
+      opacities.push([x.opacity, x.opacity]);
+    } else if (y) {
+      parts.push(preparePathMorph(collapsedPath(y.path, y.m, bb, ba), y.path, sub5, IDENTITY_MATRIX, y.m));
+      opacities.push([y.opacity, y.opacity]);
     }
-    primitives.push(fe("feFlood", { "flood-color": p.color, "flood-opacity": round(p.opacity), result: name("color") }));
-    primitives.push(fe("feComposite", { in: name("color"), in2: last, operator: "in", result: name("shadow") }));
-    under.push(name("shadow"));
-  }
-  if (under.length) {
-    n++;
-    primitives.push(fe("feMerge", { result: name("merged") }, [...under, body].map((i) => fe("feMergeNode", { in: i }))));
-    body = name("merged");
-  }
-  for (const f of active) {
-    if (f.type !== "layerBlur") continue;
-    n++;
-    primitives.push(fe("feGaussianBlur", { in: body, stdDeviation: round(f.params.radius / 2), result: name("body") }));
-    body = name("body");
   }
-  const lastResult = primitives[primitives.length - 1]?.attrs.result;
-  if (lastResult !== body) primitives.push(fe("feMerge", {}, [fe("feMergeNode", { in: body })]));
-  const pad = vectorFilterReach(active) + 2;
   return {
-    id,
-    x: round(bounds.x - pad),
-    y: round(bounds.y - pad),
-    width: round(bounds.width + 2 * pad),
-    height: round(bounds.height + 2 * pad),
-    primitives
+    at: (t) => {
+      const children = parts.map((p, i) => {
+        const n = p(t);
+        const o = lerpN(opacities[i][0], opacities[i][1], t) * (n.opacity ?? 1);
+        if (o < 1) n.opacity = o;
+        else delete n.opacity;
+        return n;
+      });
+      const group = { id, type: "group", children };
+      return group;
+    }
   };
 }
-var escapeAttr = (value) => value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
-function primitiveMarkup(p) {
-  const attrs = Object.entries(p.attrs).map(([k, v2]) => ` ${k}="${escapeAttr(String(v2))}"`).join("");
-  return p.children?.length ? `<${p.tag}${attrs}>${p.children.map(primitiveMarkup).join("")}</${p.tag}>` : `<${p.tag}${attrs}/>`;
+function interpolateVectorPaths(a, b, t, options = {}) {
+  return createVectorMorph(a, b, options).at(t);
 }
-function vectorFilterMarkup(filter, extra = "") {
-  return `<filter id="${escapeAttr(filter.id)}" filterUnits="userSpaceOnUse" x="${filter.x}" y="${filter.y}" width="${filter.width}" height="${filter.height}" color-interpolation-filters="sRGB"${extra}>${filter.primitives.map(primitiveMarkup).join("")}</filter>`;
+var keyframeMorphs = /* @__PURE__ */ new WeakMap();
+function evaluateVectorPathKeyframes(keyframes, time, options = {}) {
+  const keys = keyframes.filter((k) => Number.isFinite(k.time)).sort((x, y) => x.time - y.time);
+  if (!keys.length) return null;
+  if (!(time > keys[0].time)) return keys[0].value;
+  const last = keys[keys.length - 1];
+  if (time >= last.time) return last.value;
+  let i = 0;
+  while (i + 1 < keys.length && keys[i + 1].time <= time) i++;
+  const a = keys[i];
+  const b = keys[i + 1];
+  if (time === a.time) return a.value;
+  if (a.easing === "hold") return a.value;
+  const span = b.time - a.time;
+  const u = Math.min(1, Math.max(0, evaluateEasing(a.easing, (time - a.time) / span, span)));
+  let inner = keyframeMorphs.get(a.value);
+  if (!inner) keyframeMorphs.set(a.value, inner = /* @__PURE__ */ new WeakMap());
+  let morph = inner.get(b.value);
+  if (!morph) inner.set(b.value, morph = createVectorMorph(a.value, b.value, options));
+  return morph.at(u);
 }
-var VECTOR_FILTER_MENU = VECTOR_FILTER_TYPES.map((type) => ({ type, label: VECTOR_FILTER_LABELS[type] }));
 
 // src/vector/gradientStroke.ts
 var SHARP = 1.25;
@@ -5199,7 +5801,45 @@ function vectorDocumentToSvg(doc, options = {}) {
     emitNode(node, depth + wrappers.length);
     for (let i = wrappers.length - 1; i >= 0; i--) lines.push(`${indent(depth + i)}</g>`);
   };
+  const capture = (fn) => {
+    const at2 = lines.length;
+    fn();
+    return lines.splice(at2).map((l) => l.trim()).join("");
+  };
+  const emitMaskGroup = (node, depth) => {
+    const [source, ...contents] = node.children;
+    const body = node.effects?.length && contents.length ? [{ id: `${node.id}~content`, type: "group", effects: node.effects, children: contents }] : contents;
+    const settings = { type: node.mask.type, ...node.mask.invert ? { invert: true } : {} };
+    lines.push(`${indent(depth)}<g${common(node)} data-vector-mask="${escapeAttr2(JSON.stringify(settings))}">`);
+    const mask = vectorMaskRenderData(node, `${prefix}mask-${node.id}`, `${prefix}mask-filter-${node.id}`, precision);
+    let ref = "";
+    if (mask && mask.type !== "clip") {
+      const b = mask.bounds;
+      const box = `x="${num2(b.x)}" y="${num2(b.y)}" width="${num2(b.width)}" height="${num2(b.height)}"`;
+      if (mask.invertFilter) defs.push(vectorFilterMarkup(mask.invertFilter));
+      const inner = capture(() => emitNode(source, depth + 1));
+      const drawn = mask.filter ? `<g data-vector-part="mask-invert" filter="${escapeAttr2(mask.filter)}">${inner}</g>` : inner;
+      defs.push(`<mask id="${escapeAttr2(mask.id)}" data-vector-part="mask-source" maskUnits="userSpaceOnUse" ${box}${mask.type === "alpha" ? ' mask-type="alpha"' : ""}>${drawn}</mask>`);
+      ref = ` mask="url(#${escapeAttr2(mask.id)})"`;
+    } else {
+      lines.push(`${indent(depth + 1)}<g data-vector-part="mask-source" display="none">`);
+      emitNode(source, depth + 2);
+      lines.push(`${indent(depth + 1)}</g>`);
+      if (mask?.clip) {
+        defs.push(`<clipPath id="${escapeAttr2(mask.id)}">${mask.clip.map((c) => `<path d="${c.d}" clip-rule="${c.clipRule}"/>`).join("")}</clipPath>`);
+        ref = ` clip-path="url(#${escapeAttr2(mask.id)})"`;
+      }
+    }
+    lines.push(`${indent(depth + 1)}<g data-vector-part="masked"${ref}>`);
+    for (const child of body) emit2(child, depth + 2);
+    lines.push(`${indent(depth + 1)}</g>`);
+    lines.push(`${indent(depth)}</g>`);
+  };
   const emitNode = (node, depth) => {
+    if (isVectorMaskGroup(node)) {
+      emitMaskGroup(node, depth);
+      return;
+    }
     if (hasOwnVectorAppearance(node)) {
       const live2 = {
         kind: node.type,
@@ -5402,6 +6042,26 @@ function collectGradients(el, raw) {
   if (PAINT_SERVERS.has(el.name) && el.attrs.id) raw.set(el.attrs.id, el);
   for (const c of el.children) collectGradients(c, raw);
 }
+function collectMasks(el, raw) {
+  if ((el.name === "clipPath" || el.name === "mask") && el.attrs.id) raw.set(el.attrs.id, el);
+  for (const c of el.children) collectMasks(c, raw);
+}
+function attrOrStyle(el, name) {
+  for (const decl of (el.attrs.style ?? "").split(";")) {
+    const i = decl.indexOf(":");
+    if (i >= 0 && decl.slice(0, i).trim() === name) return decl.slice(i + 1).replace(/!important/, "").trim();
+  }
+  return el.attrs[name];
+}
+function urlId(value) {
+  return /^url\(\s*['"]?#([^'")\s]+)['"]?\s*\)/.exec((value ?? "").trim())?.[1] ?? null;
+}
+function clipRulesAsFillRules(el) {
+  const attrs = { ...el.attrs };
+  const rule = attrOrStyle(el, "clip-rule");
+  if (rule) attrs["fill-rule"] = rule;
+  return { ...el, attrs, children: el.children.map(clipRulesAsFillRules) };
+}
 function collectFilters(el, raw) {
   if (el.name === "filter" && el.attrs.id) raw.set(el.attrs.id, el);
   for (const c of el.children) collectFilters(c, raw);
@@ -5540,6 +6200,9 @@ function parseVectorSvg(svg, options = {}) {
   collectGradients(root, rawGradients);
   const rawFilters = /* @__PURE__ */ new Map();
   collectFilters(root, rawFilters);
+  const rawMasks = /* @__PURE__ */ new Map();
+  collectMasks(root, rawMasks);
+  const resolving = /* @__PURE__ */ new Set();
   const filtersOf = (value) => {
     const url = /^url\(\s*['"]?#([^'")\s]+)['"]?\s*\)/.exec((value ?? "").trim());
     const el = url ? rawFilters.get(url[1]) : void 0;
@@ -5738,68 +6401,148 @@ function parseVectorSvg(svg, options = {}) {
     const out = [];
     for (const child of el.children) {
       if (SKIP.has(child.name)) continue;
-      const m = multiplyMatrices(parseSvgTransform(child.attrs.transform), matrix);
-      const s = readStyle(child, style);
-      const opacity = child.attrs.opacity !== void 0 ? parseFloat(child.attrs.opacity) : void 0;
-      const hidden = child.attrs.display === "none" || child.attrs.visibility === "hidden";
-      const blendMode = vectorBlendModeFromCss(s.mixBlendMode);
-      const filters = filtersOf(s.filter);
-      const meta = {
-        ...child.attrs["inkscape:label"] || child.attrs["data-name"] ? { name: child.attrs["inkscape:label"] ?? child.attrs["data-name"] } : {},
-        ...opacity !== void 0 && Number.isFinite(opacity) && opacity < 1 ? { opacity } : {},
-        ...hidden ? { visible: false } : {},
-        ...blendMode && blendMode !== "normal" ? { blendMode } : {},
-        ...filters.length ? { filters } : {}
-      };
-      if (child.attrs["data-vector-blend-step"] !== void 0) continue;
-      const operation = child.attrs["data-vector-boolean-operation"];
-      if (BOOLEAN_OPERATIONS.includes(operation)) meta.booleanOperation = operation;
-      if (child.name === "g" && child.attrs["data-vector-live"] !== void 0) {
-        const node2 = liveNode(child, s, m, meta);
-        if (node2) out.push(node2);
-        continue;
-      }
-      if (child.name === "g" && child.attrs["data-vector-path"] !== void 0 && child.attrs["data-vector-fills"] !== void 0) {
-        const node2 = stackedPath(child, s, m, meta);
-        if (node2) out.push(node2);
-        continue;
-      }
-      if (child.name === "g" && child.attrs["data-vector-path"] !== void 0) {
-        const node2 = mergedPath(child, s, m, meta);
-        if (node2) out.push(node2);
-        continue;
-      }
-      if (child.name === "g" || child.name === "svg" || child.name === "a" || child.name === "switch") {
-        const children = visit(child, s, m);
-        if (!children.length) continue;
-        const group = { id: idFor(child), type: "group", ...meta, children };
-        const blend = child.name === "g" ? blendFromAttribute(child.attrs["data-vector-blend"], m) : null;
-        if (blend) group.blend = blend;
-        out.push(group);
-        continue;
-      }
-      const subpaths = shapeOf(child);
-      if (!subpaths || !subpaths.length) continue;
-      const node = placed(
-        withOpacities(
-          {
-            id: idFor(child),
-            type: "path",
-            ...meta,
-            subpaths,
-            fill: child.name === "line" ? null : paint(s.fill),
-            stroke: paint(s.stroke),
-            ...strokeStyle(s)
-          },
-          s
-        ),
-        m
-      );
-      out.push(node);
+      const nodes2 = visitOne(child, style, matrix);
+      out.push(...nodes2.length ? masked(child, nodes2, multiplyMatrices(parseSvgTransform(child.attrs.transform), matrix)) : nodes2);
     }
     return options.mergeStackedShapes ? mergeStacked(out) : out;
   };
-  const nodes = visit(root, readStyle(root, { fill: "#000", stroke: "none", strokeWidth: "" }), rootMatrix);
+  let rootStyle = { fill: "#000", stroke: "none", strokeWidth: "" };
+  const bboxMatrix = (nodes2) => {
+    const b = unionBounds(nodes2.map((n) => vectorNodeBounds(n)));
+    return b && b.width > 0 && b.height > 0 ? [b.width, 0, 0, b.height, b.x, b.y] : null;
+  };
+  const maskNode = (el, m, nodes2, units) => {
+    const id = el.attrs.id;
+    if (!id || resolving.has(id)) return null;
+    let space = m;
+    if (units === "objectBoundingBox") {
+      const box = bboxMatrix(nodes2);
+      if (!box) return null;
+      space = box;
+    }
+    resolving.add(id);
+    const isClip = el.name === "clipPath";
+    const content = isClip ? clipRulesAsFillRules(el) : el;
+    const inner = visit(content, readStyle(content, rootStyle), multiplyMatrices(parseSvgTransform(el.attrs.transform), space));
+    resolving.delete(id);
+    const strip2 = (n) => n.type === "path" ? withVectorStrokes(withVectorFills({ ...n, fill: null, stroke: null }, []), []) : { ...n, children: n.children.map(strip2) };
+    const list = isClip ? inner.map(strip2) : inner;
+    if (!list.length) return null;
+    return list.length === 1 ? list[0] : { id: idFor({ name: "g", attrs: {}, children: [] }), type: "group", name: isClip ? "Clip" : "Mask", children: list };
+  };
+  const masked = (el, nodes2, m) => {
+    let out = nodes2;
+    const clipEl = rawMasks.get(urlId(attrOrStyle(el, "clip-path")) ?? "");
+    if (clipEl?.name === "clipPath") {
+      const source = maskNode(clipEl, m, out, clipEl.attrs.clipPathUnits);
+      if (source) out = [{ id: idFor({ name: "g", attrs: {}, children: [] }), type: "group", name: "Clip Group", mask: { type: "clip" }, children: [source, ...out] }];
+    }
+    const maskEl = rawMasks.get(urlId(attrOrStyle(el, "mask")) ?? "");
+    if (maskEl?.name === "mask") {
+      const source = maskNode(maskEl, m, out, maskEl.attrs.maskContentUnits);
+      const type = attrOrStyle(maskEl, "mask-type") === "alpha" ? "alpha" : "luminance";
+      if (source) out = [{ id: idFor({ name: "g", attrs: {}, children: [] }), type: "group", name: "Opacity Mask", mask: { type }, children: [source, ...out] }];
+    }
+    return out;
+  };
+  const maskGroup = (g, style, m, meta) => {
+    let raw = null;
+    try {
+      raw = JSON.parse(g.attrs["data-vector-mask"]);
+    } catch {
+      raw = null;
+    }
+    const mask = sanitizeVectorMask(raw);
+    const part = (name) => g.children.find((c) => c.name === "g" && c.attrs["data-vector-part"] === name);
+    const maskedEl = part("masked");
+    if (!mask || !maskedEl) return null;
+    const id = idFor(g);
+    let sourceEl = part("mask-source");
+    if (!sourceEl) {
+      const el = rawMasks.get(urlId(maskedEl.attrs.mask) ?? "");
+      const invert2 = el?.children.find((c) => c.name === "g" && c.attrs["data-vector-part"] === "mask-invert");
+      sourceEl = invert2 ?? el;
+    }
+    const source = sourceEl ? visit(sourceEl, style, m)[0] : void 0;
+    let contents = visit(maskedEl, style, m);
+    let effects;
+    const wrapper = contents.length === 1 && contents[0].type === "group" && contents[0].id === `${id}~content` ? contents[0] : null;
+    if (wrapper?.type === "group") {
+      effects = wrapper.effects ?? void 0;
+      contents = wrapper.children;
+    }
+    if (!source) return contents.length ? { id, type: "group", ...meta, children: contents } : null;
+    return { id, type: "group", ...meta, mask, ...effects?.length ? { effects } : {}, children: [source, ...contents] };
+  };
+  const visitOne = (child, style, matrix) => {
+    const out = [];
+    const m = multiplyMatrices(parseSvgTransform(child.attrs.transform), matrix);
+    const s = readStyle(child, style);
+    const opacity = child.attrs.opacity !== void 0 ? parseFloat(child.attrs.opacity) : void 0;
+    const hidden = child.attrs.display === "none" || child.attrs.visibility === "hidden";
+    const blendMode = vectorBlendModeFromCss(s.mixBlendMode);
+    const filters = filtersOf(s.filter);
+    const meta = {
+      ...child.attrs["inkscape:label"] || child.attrs["data-name"] ? { name: child.attrs["inkscape:label"] ?? child.attrs["data-name"] } : {},
+      ...opacity !== void 0 && Number.isFinite(opacity) && opacity < 1 ? { opacity } : {},
+      ...hidden ? { visible: false } : {},
+      ...blendMode && blendMode !== "normal" ? { blendMode } : {},
+      ...filters.length ? { filters } : {}
+    };
+    if (child.attrs["data-vector-blend-step"] !== void 0) return out;
+    const operation = child.attrs["data-vector-boolean-operation"];
+    if (BOOLEAN_OPERATIONS.includes(operation)) meta.booleanOperation = operation;
+    if (child.name === "g" && child.attrs["data-vector-mask"] !== void 0) {
+      const node2 = maskGroup(child, s, m, meta);
+      if (node2) out.push(node2);
+      return out;
+    }
+    if (child.name === "g" && child.attrs["data-vector-live"] !== void 0) {
+      const node2 = liveNode(child, s, m, meta);
+      if (node2) out.push(node2);
+      return out;
+    }
+    if (child.name === "g" && child.attrs["data-vector-path"] !== void 0 && child.attrs["data-vector-fills"] !== void 0) {
+      const node2 = stackedPath(child, s, m, meta);
+      if (node2) out.push(node2);
+      return out;
+    }
+    if (child.name === "g" && child.attrs["data-vector-path"] !== void 0) {
+      const node2 = mergedPath(child, s, m, meta);
+      if (node2) out.push(node2);
+      return out;
+    }
+    if (child.name === "g" || child.name === "svg" || child.name === "a" || child.name === "switch") {
+      const children = visit(child, s, m);
+      if (!children.length) return out;
+      const group = { id: idFor(child), type: "group", ...meta, children };
+      const blend = child.name === "g" ? blendFromAttribute(child.attrs["data-vector-blend"], m) : null;
+      if (blend) group.blend = blend;
+      out.push(group);
+      return out;
+    }
+    const subpaths = shapeOf(child);
+    if (!subpaths || !subpaths.length) return out;
+    const node = placed(
+      withOpacities(
+        {
+          id: idFor(child),
+          type: "path",
+          ...meta,
+          subpaths,
+          fill: child.name === "line" ? null : paint(s.fill),
+          stroke: paint(s.stroke),
+          ...strokeStyle(s)
+        },
+        s
+      ),
+      m
+    );
+    out.push(node);
+    return out;
+  };
+  rootStyle = readStyle(root, rootStyle);
+  const nodes = visit(root, rootStyle, rootMatrix);
   return { width, height, nodes };
 }
 
@@ -5812,6 +6555,7 @@ export {
   VECTOR_ARROWHEADS,
   VECTOR_BLEND_MODES,
   VECTOR_BLEND_SPACINGS,
+  VECTOR_MASK_TYPES,
   VECTOR_TOOLS,
   VECTOR_TRANSFORM_HANDLES,
   VECTOR_PATHFINDER_OPERATIONS,
@@ -5960,6 +6704,43 @@ export {
   mapVectorPoints,
   mapVectorSubpaths,
   mapBezierPath,
+  splitIntoFaces,
+  knifePath,
+  eraserRegion,
+  eraseFromFill,
+  eraseFromOutline,
+  polylineBounds,
+  simplifyPolyline,
+  VECTOR_FILTER_DEFAULTS,
+  VECTOR_FILTER_LABELS,
+  VECTOR_FILTER_PARAM_SPECS,
+  isVectorFilterType,
+  normalizeVectorFilterParams,
+  vectorFilterParamKeys,
+  createVectorFilter,
+  sanitizeVectorFilters,
+  activeVectorFilters,
+  vectorFilterReach,
+  vectorFilterSvg,
+  vectorFilterMarkup,
+  VECTOR_FILTER_MENU,
+  isVectorMaskType,
+  sanitizeVectorMask,
+  isVectorMaskGroup,
+  isVectorMaskActive,
+  vectorMaskSource,
+  vectorMaskContents,
+  vectorMaskOwner,
+  vectorMaskSummary,
+  vectorMaskRegionShapes,
+  vectorMaskRegion,
+  vectorMaskRegionPath,
+  vectorMaskContains,
+  vectorMaskedShapes,
+  vectorMaskedGeometry,
+  vectorMaskedLocalBounds,
+  vectorMaskContentBounds,
+  vectorMaskRenderData,
   vectorMeshFromOutline,
   vectorMeshOutline,
   VECTOR_EFFECT_DEFAULTS,
@@ -5978,6 +6759,7 @@ export {
   clearVectorLiveBooleanCache,
   foldVectorBooleanOperands,
   applyVectorEffects,
+  vectorChildAppearanceShapes,
   vectorEffectInputPaths,
   vectorEffectInputBounds,
   vectorNodeEnvelope,
@@ -6050,19 +6832,6 @@ export {
   createVectorMorph,
   interpolateVectorPaths,
   evaluateVectorPathKeyframes,
-  VECTOR_FILTER_DEFAULTS,
-  VECTOR_FILTER_LABELS,
-  VECTOR_FILTER_PARAM_SPECS,
-  isVectorFilterType,
-  normalizeVectorFilterParams,
-  vectorFilterParamKeys,
-  createVectorFilter,
-  sanitizeVectorFilters,
-  activeVectorFilters,
-  vectorFilterReach,
-  vectorFilterSvg,
-  vectorFilterMarkup,
-  VECTOR_FILTER_MENU,
   vectorStrokeGradientDefs,
   vectorCornersAttribute,
   applyVectorCornersAttribute,
@@ -6077,4 +6846,4 @@ export {
   parseSvgTransform,
   parseVectorSvg
 };
-//# sourceMappingURL=chunk-63EFQCT5.js.map
+//# sourceMappingURL=chunk-HUQ7EHVI.js.map