@pixerate/editor 0.34.0 → 0.36.0

package/dist/canvas/index.js

@@ -2,7 +2,6 @@ import {
   CANVAS_GRADIENT_PRESETS,
   PathOpsError,
   SHAPE_KINDS,
-  add,
   angleToSvgLinearCoords,
   arcToCubics,
   bezierPathArea,
@@ -15,20 +14,18 @@ import {
   contourSignedArea,
   contoursToPath,
   countPathSegments,
-  cross,
   cubicPointAt,
   cubicsToPathData,
-  dist,
+  dashContours,
   distanceToBezierPath,
   dividePaths,
   dividePolygons,
-  dot,
   excludePaths,
   fitCubicRun,
+  fitCubicWithTangents,
   fitCubics,
   fitFreehandPath,
   fitPathData,
-  flattenChain,
   flattenSvgPath,
   formatNumber,
   getShapeRenderData,
@@ -41,12 +38,12 @@ import {
   isStraightCubic,
   multiPolygonArea,
   multiPolygonBounds,
-  nestedRingsToPath,
   normalizeBezierPath,
+  offsetPath,
+  outlineStroke,
   parseCssGradient,
   parseSvgPath,
   pathBoolean,
-  pathBooleanRings,
   pathToContours,
   pointInBezierPath,
   pointInMultiPolygon,
@@ -56,8 +53,6 @@ import {
   polygonToSvgPath,
   resolveCanvasGradient,
   ringSignedArea,
-  samePoint,
-  scale,
   segmentBounds,
   segmentCurvature,
   segmentDerivative,
@@ -71,7 +66,7 @@ import {
   shapeToPolygon,
   simplifyRing,
   splitSegment,
-  sub,
+  strokeOutlineRings,
   subSegment,
   subtractPaths,
   subtractPolygons,
@@ -82,7 +77,7 @@ import {
   unitePaths,
   windingNumber,
   xorPolygons
-} from "../chunk-RK6HUKDI.js";
+} from "../chunk-EGPIVUEF.js";
 import {
   DEFAULT_NODE_HEIGHT,
   DEFAULT_NODE_WIDTH,
@@ -184,11 +179,11 @@ function createFanOutTrajectory(options = {}) {
     const oneMinusT = 1 - t;
     const x = oneMinusT * oneMinusT * origin.x + 2 * oneMinusT * t * midX + t * t * target.x;
     const y = oneMinusT * oneMinusT * origin.y + 2 * oneMinusT * t * midY + t * t * target.y;
-    const scale2 = startScale + (endScale - startScale) * progress;
+    const scale = startScale + (endScale - startScale) * progress;
     const opacity = startOpacity + (endOpacity - startOpacity) * progress;
     return {
       position: { x, y },
-      scale: scale2,
+      scale,
       opacity
     };
   };
@@ -1215,7 +1210,7 @@ function spacingCandidate(rects, moving, horizontal, tolerance) {
     return best2;
   };
   const crossMid = (a, b) => (Math.max(crossStart(a), crossStart(b)) + Math.min(crossEnd(a), crossEnd(b))) / 2;
-  const segment = (from, to, cross2) => horizontal ? { orientation: "horizontal", kind: "spacing", x1: from, y1: cross2, x2: to, y2: cross2 } : { orientation: "vertical", kind: "spacing", x1: cross2, y1: from, x2: cross2, y2: to };
+  const segment = (from, to, cross) => horizontal ? { orientation: "horizontal", kind: "spacing", x1: from, y1: cross, x2: to, y2: cross } : { orientation: "vertical", kind: "spacing", x1: cross, y1: from, x2: cross, y2: to };
   const candidates = [];
   if (before && after) {
     const b = before;
@@ -1727,447 +1722,6 @@ function fitViewportToNodes(nodes, size, ids, options = {}) {
   return bounds ? fitViewportToRect(bounds, size, options) : null;
 }
 
-// src/canvas/pathops/stroke.ts
-var DEFAULT_TOLERANCE = 0.01;
-var normal = (t) => [-t[1], t[0]];
-function raise(seg) {
-  if (seg.length !== 3) return [...seg];
-  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 isDegenerate(seg, tol) {
-  return seg.every((p) => dist(p, seg[0]) <= tol);
-}
-function offsetSegment(seg, d, tol, out, depth = 0) {
-  if (seg.length === 2) {
-    const n = normal(segmentTangent(seg, 0));
-    out.push([add(seg[0], scale(n, d)), add(seg[1], scale(n, d))]);
-    return;
-  }
-  const c = raise(seg);
-  const t0 = segmentTangent(c, 0);
-  const t1 = segmentTangent(c, 1);
-  const q0 = add(c[0], scale(normal(t0), d));
-  const q3 = add(c[3], scale(normal(t1), d));
-  const k0 = segmentCurvature(c, 0);
-  const k1 = segmentCurvature(c, 1);
-  const f0 = Number.isFinite(k0) ? 1 - d * k0 : 1;
-  const f1 = Number.isFinite(k1) ? 1 - d * k1 : 1;
-  const q1 = add(q0, scale(sub(c[1], c[0]), f0));
-  const q2 = add(q3, scale(sub(c[2], c[3]), f1));
-  const approx = [q0, q1, q2, q3];
-  if (depth < 10) {
-    let err = 0;
-    for (const t of [0.125, 0.25, 0.375, 0.5, 0.625, 0.75, 0.875]) {
-      const target = add(segmentPoint(c, t), scale(normal(segmentTangent(c, t)), d));
-      err = Math.max(err, segmentNearest(approx, target).distance);
-      if (err > tol) break;
-    }
-    if (err <= tol) {
-      const m = segmentPoint(approx, 0.5);
-      const back = segmentNearest(c, m).distance;
-      err = Math.max(err, Math.abs(back - Math.abs(d)));
-    }
-    if (err > tol) {
-      const [a, b] = splitSegment(c, 0.5);
-      offsetSegment(a, d, tol, out, depth + 1);
-      offsetSegment(b, d, tol, out, depth + 1);
-      return;
-    }
-  }
-  out.push(approx);
-}
-function pushArc(out, center, radius, start, sweep, from, to) {
-  const n = Math.max(1, Math.ceil(Math.abs(sweep) / (Math.PI / 2) - 1e-9));
-  const step = sweep / n;
-  const k = 4 / 3 * Math.tan(step / 4);
-  let prev = from;
-  for (let i = 0; i < n; i++) {
-    const a0 = start + step * i;
-    const a1 = a0 + step;
-    const c0 = Math.cos(a0);
-    const s0 = Math.sin(a0);
-    const c1 = Math.cos(a1);
-    const s1 = Math.sin(a1);
-    const end = i === n - 1 ? to : [center[0] + radius * c1, center[1] + radius * s1];
-    out.push([
-      prev,
-      [center[0] + radius * (c0 - k * s0), center[1] + radius * (s0 + k * c0)],
-      [center[0] + radius * (c1 + k * s1), center[1] + radius * (s1 - k * c1)],
-      end
-    ]);
-    prev = end;
-  }
-}
-function lineTo(out, from, to) {
-  if (!samePoint(from, to)) out.push([from, to]);
-}
-function addJoin(out, p, tin, tout, d, style) {
-  const from = add(p, scale(normal(tin), d));
-  const to = add(p, scale(normal(tout), d));
-  const turn = cross(tin, tout);
-  const cos = dot(tin, tout);
-  if (Math.abs(turn) < 1e-9 && cos > 0) {
-    lineTo(out, from, to);
-    return;
-  }
-  const reversal = Math.abs(turn) < 1e-9 && cos < 0;
-  const inner = !reversal && turn > 0 === d > 0;
-  if (inner) {
-    lineTo(out, from, p);
-    lineTo(out, p, to);
-    return;
-  }
-  const theta = reversal ? d > 0 ? -Math.PI : Math.PI : Math.atan2(turn, cos);
-  if (style.join === "round") {
-    const v = sub(from, p);
-    pushArc(out, p, Math.abs(d), Math.atan2(v[1], v[0]), theta, from, to);
-    return;
-  }
-  if (style.join === "miter" && !reversal) {
-    const phi = Math.PI - Math.abs(theta);
-    const ratio = 1 / Math.max(Math.sin(phi / 2), 1e-12);
-    if (ratio <= style.miterLimit) {
-      const nin = normal(tin);
-      const nout = normal(tout);
-      const s = d / (1 + dot(nin, nout));
-      const miter = add(p, scale(add(nin, nout), s));
-      lineTo(out, from, miter);
-      lineTo(out, miter, to);
-      return;
-    }
-  }
-  lineTo(out, from, to);
-}
-function offsetChain(segs, d, closed, style, tol) {
-  const out = [];
-  const pen = () => out.length > 0 ? out[out.length - 1][out[out.length - 1].length - 1] : null;
-  for (let i = 0; i < segs.length; i++) {
-    if (i > 0) addJoin(out, segs[i][0], segmentTangent(segs[i - 1], 1), segmentTangent(segs[i], 0), d, style);
-    const pieces = [];
-    offsetSegment(segs[i], d, tol, pieces);
-    for (const piece of pieces) {
-      const at = pen();
-      if (at && !samePoint(at, piece[0])) lineTo(out, at, piece[0]);
-      out.push(piece);
-    }
-  }
-  if (closed && segs.length > 0) {
-    const last = segs[segs.length - 1];
-    addJoin(out, segs[0][0], segmentTangent(last, 1), segmentTangent(segs[0], 0), d, style);
-    const at = pen();
-    if (at && out.length > 0 && !samePoint(at, out[0][0])) lineTo(out, at, out[0][0]);
-  }
-  return out;
-}
-function reverseChain(chain) {
-  return chain.map((s) => [...s].reverse()).reverse();
-}
-function addCap(out, p, t, h, cap) {
-  const n = normal(t);
-  const from = add(p, scale(n, h));
-  const to = add(p, scale(n, -h));
-  if (cap === "round") {
-    pushArc(out, p, h, Math.atan2(n[1], n[0]), -Math.PI, from, to);
-  } else if (cap === "square") {
-    const a = add(from, scale(t, h));
-    const b = add(to, scale(t, h));
-    lineTo(out, from, a);
-    lineTo(out, a, b);
-    lineTo(out, b, to);
-  } else {
-    lineTo(out, from, to);
-  }
-}
-function dotRings(p, t, h, cap) {
-  if (cap === "butt") return [];
-  const ring = [];
-  addCap(ring, p, t, h, cap);
-  addCap(ring, p, [-t[0], -t[1]], h, cap);
-  return [ring];
-}
-function strokeContour(contour, h, style, tol) {
-  const tiny = Math.max(1e-12, tol * 1e-6);
-  const all = contour.closed ? closeContour(contour) : contour.segments;
-  const segs = all.filter((s) => !isDegenerate(s, tiny));
-  if (segs.length === 0) {
-    const p = contour.segments[0]?.[0];
-    return p ? dotRings(p, [1, 0], h, style.cap) : [];
-  }
-  if (contour.closed) {
-    const left2 = offsetChain(segs, h, true, style, tol);
-    const right2 = offsetChain(segs, -h, true, style, tol);
-    return [left2, reverseChain(right2)];
-  }
-  const left = offsetChain(segs, h, false, style, tol);
-  const right = reverseChain(offsetChain(segs, -h, false, style, tol));
-  const ring = [...left];
-  const last = segs[segs.length - 1];
-  addCap(ring, last[last.length - 1], segmentTangent(last, 1), h, style.cap);
-  const joinTo = (p) => {
-    const at = ring[ring.length - 1][ring[ring.length - 1].length - 1];
-    lineTo(ring, at, p);
-  };
-  if (right.length > 0) joinTo(right[0][0]);
-  ring.push(...right);
-  const first = segs[0];
-  const t0 = segmentTangent(first, 0);
-  addCap(ring, first[0], [-t0[0], -t0[1]], h, style.cap);
-  if (ring.length > 0) joinTo(ring[0][0]);
-  return [ring];
-}
-function ringsToPath(rings) {
-  return contoursToPath(rings.filter((r) => r.length > 0).map((segments) => ({ segments, closed: true })));
-}
-var MAX_DASHES = 2e5;
-var MIN_ENTRY = 1e-6;
-function dashContours(contours, pattern, offset = 0) {
-  if (pattern.length === 0 || pattern.some((v) => !Number.isFinite(v) || v < 0) || !Number.isFinite(offset)) return null;
-  if (!pattern.some((v) => v > MIN_ENTRY)) return null;
-  const pat = pattern.length % 2 === 1 ? [...pattern, ...pattern] : [...pattern];
-  const period = pat.reduce((s, v) => s + v, 0);
-  const chains = contours.map((c) => {
-    const segs = closeContour(c);
-    const lengths = segs.map((s) => segmentLength(s));
-    return { segs, lengths, total: lengths.reduce((s, v) => s + v, 0), closed: c.closed };
-  });
-  const totalLength = chains.reduce((s, c) => s + c.total, 0);
-  if (totalLength / period * pat.length > MAX_DASHES) return null;
-  let off = (offset % period + period) % period;
-  let ix0 = 0;
-  while (off > pat[ix0]) {
-    off -= pat[ix0];
-    ix0 = (ix0 + 1) % pat.length;
-  }
-  const out = { contours: [], dots: [] };
-  for (const chain of chains) {
-    if (chain.segs.length === 0 || !(chain.total > 0)) continue;
-    let ix = ix0;
-    let rem = pat[ix0] - off;
-    let pos = 0;
-    const dashes = [];
-    let guard = 0;
-    while (pos < chain.total && guard++ < MAX_DASHES * 2) {
-      const step = Math.min(rem, chain.total - pos);
-      const on = ix % 2 === 0;
-      if (on) dashes.push({ from: pos, to: pos + step });
-      pos += step;
-      rem -= step;
-      if (rem <= 1e-12) {
-        ix = (ix + 1) % pat.length;
-        rem = pat[ix];
-      }
-    }
-    if (chain.closed && dashes.length > 1) {
-      const first = dashes[0];
-      const last = dashes[dashes.length - 1];
-      if (first.from <= 1e-9 && last.to >= chain.total - 1e-9 && first.to > first.from && last.to > last.from) {
-        dashes.pop();
-        const tail = trimSegments(chain.segs, last.from, chain.total, chain.lengths);
-        const head = trimSegments(chain.segs, 0, first.to, chain.lengths);
-        dashes.shift();
-        out.contours.push({ segments: [...tail, ...head], closed: false });
-      }
-    }
-    for (const dash of dashes) {
-      if (dash.to - dash.from <= 1e-12) {
-        const at = locate(chain.segs, chain.lengths, dash.from);
-        out.dots.push(at);
-        continue;
-      }
-      const segments = trimSegments(chain.segs, dash.from, dash.to, chain.lengths);
-      if (segments.length > 0) out.contours.push({ segments, closed: false });
-    }
-  }
-  return out;
-}
-function locate(segs, lengths, at) {
-  let acc = 0;
-  for (let i = 0; i < segs.length; i++) {
-    if (at <= acc + lengths[i] || i === segs.length - 1) {
-      const piece = trimSegments([segs[i]], 0, Math.max(0, at - acc), [lengths[i]]);
-      const t = piece.length > 0 ? 1 : 0;
-      const point = piece.length > 0 ? piece[piece.length - 1][piece[piece.length - 1].length - 1] : segs[i][0];
-      const tangent = segmentTangent(piece.length > 0 ? piece[piece.length - 1] : segs[i], t);
-      return { point, tangent };
-    }
-    acc += lengths[i];
-  }
-  return { point: segs[0][0], tangent: segmentTangent(segs[0], 0) };
-}
-function deepPoint(rings) {
-  let minX = Infinity;
-  let minY = Infinity;
-  let maxX = -Infinity;
-  let maxY = -Infinity;
-  for (const p of rings[0].flat()) {
-    minX = Math.min(minX, p[0]);
-    maxX = Math.max(maxX, p[0]);
-    minY = Math.min(minY, p[1]);
-    maxY = Math.max(maxY, p[1]);
-  }
-  const w = maxX - minX;
-  const h = maxY - minY;
-  if (!(w > 0 && h > 0)) return null;
-  const tolerance = Math.max(1e-6, 2e-3 * Math.min(w, h));
-  const polys = rings.map((r) => flattenChain(r, tolerance));
-  let best = null;
-  for (const f of [0.5, 0.3, 0.7, 0.15, 0.85]) {
-    const y = minY + h * f;
-    const xs = [];
-    for (const poly of polys) {
-      for (let i = 0; i < poly.length; i++) {
-        const a = poly[i];
-        const b = poly[(i + 1) % poly.length];
-        if (a[1] <= y !== b[1] <= y) xs.push(a[0] + (y - a[1]) / (b[1] - a[1]) * (b[0] - a[0]));
-      }
-    }
-    xs.sort((p, q) => p - q);
-    for (let i = 0; i + 1 < xs.length; i += 2) {
-      const span = xs[i + 1] - xs[i];
-      if (!best || span > best.span) best = { span, p: [(xs[i] + xs[i + 1]) / 2, y] };
-    }
-  }
-  return best?.p ?? null;
-}
-function dropSpurious(rings, spurious) {
-  const children = rings.map(() => []);
-  rings.forEach((r, i) => {
-    if (r.parent >= 0) children[r.parent].push(i);
-  });
-  const marked = rings.map((r, i) => spurious([r.segments, ...children[i].map((c) => rings[c].segments)], r));
-  const hasMarkedAncestor = (i) => {
-    for (let k = i; k >= 0; k = rings[k].parent) if (marked[k]) return true;
-    return false;
-  };
-  return nestedRingsToPath(rings, (i) => !hasMarkedAncestor(i));
-}
-function mergeSmoothRuns(path, tolerance) {
-  const contours = pathToContours(path).map((contour) => {
-    const segs = closeContour(contour, true).map((s) => s.length === 3 ? raise(s) : [...s]);
-    const n = segs.length;
-    if (n < 2) return { segments: segs, closed: true };
-    const smooth = (a, b) => {
-      if (a.length !== 4 || b.length !== 4) return false;
-      const ta = segmentTangent(a, 1);
-      const tb = segmentTangent(b, 0);
-      return dot(ta, tb) > 0.9998 && Math.abs(cross(ta, tb)) < 0.02;
-    };
-    let start = 0;
-    for (let k = 0; k < n; k++) {
-      if (!smooth(segs[(k + n - 1) % n], segs[k])) {
-        start = k;
-        break;
-      }
-    }
-    const ordered = [...segs.slice(start), ...segs.slice(0, start)];
-    const out = [];
-    let i = 0;
-    while (i < ordered.length) {
-      let current = ordered[i];
-      let j = i + 1;
-      while (j < ordered.length && smooth(ordered[j - 1], ordered[j])) {
-        const run = ordered.slice(i, j + 1);
-        const pts = [];
-        run.forEach((s, k) => {
-          for (let q = k === 0 ? 0 : 1; q <= 12; q++) pts.push(segmentPoint(s, q / 12));
-        });
-        const fit = fitCubicRun(pts, tolerance, segmentTangent(run[0], 0), segmentTangent(run[run.length - 1], 1));
-        if (fit.length !== 1) break;
-        const c = fit[0];
-        current = [run[0][0], c.p1, c.p2, run[run.length - 1][3]];
-        j++;
-      }
-      out.push(current);
-      i = j;
-    }
-    return { segments: out, closed: true };
-  });
-  return contoursToPath(contours);
-}
-function joinStyle(join, miterLimit) {
-  return {
-    join: join ?? "miter",
-    miterLimit: miterLimit !== void 0 && Number.isFinite(miterLimit) ? Math.max(1, miterLimit) : 4
-  };
-}
-function strokeOutlineRings(input, options) {
-  const h = options.width / 2;
-  if (!(h > 0) || !Number.isFinite(h)) return [];
-  const tol = options.tolerance && options.tolerance > 0 ? options.tolerance : DEFAULT_TOLERANCE;
-  const style = { ...joinStyle(options.join, options.miterLimit), cap: options.cap ?? "butt" };
-  let contours = pathToContours(input);
-  const rings = [];
-  if (options.dash && options.dash.length > 0) {
-    const dashed = dashContours(contours, options.dash, options.dashOffset ?? 0);
-    if (dashed) {
-      contours = dashed.contours;
-      for (const dot2 of dashed.dots) rings.push(...dotRings(dot2.point, dot2.tangent, h, style.cap));
-    }
-  }
-  for (const contour of contours) rings.push(...strokeContour(contour, h, style, tol));
-  return ringsToPath(rings);
-}
-function outlineStroke(input, options) {
-  const h = options.width / 2;
-  if (!(h > 0) || !Number.isFinite(h)) return [];
-  let source;
-  try {
-    source = contoursToPath(pathToContours(input));
-  } catch {
-    return [];
-  }
-  if (source.some((c) => c.type !== "Z" && Object.values(c).some((v) => typeof v === "number" && !Number.isFinite(v)))) return [];
-  const raw = strokeOutlineRings(source, options);
-  if (raw.length === 0) return [];
-  const tol = options.tolerance && options.tolerance > 0 ? options.tolerance : DEFAULT_TOLERANCE;
-  const sourceContours = pathToContours(source);
-  const operand = { path: raw, fillRule: "nonzero" };
-  try {
-    const rings = pathBooleanRings("union", [operand], options);
-    const cleaned = dropSpurious(rings, (face, ring) => {
-      if (ring.area >= 0) return false;
-      const p = deepPoint(face);
-      return !!p && distanceToBezierPath(sourceContours, p) < h * (1 - 1e-4) - 1e-6;
-    });
-    return mergeSmoothRuns(cleaned, tol);
-  } catch {
-    return pathBoolean("union", [operand], options).path;
-  }
-}
-function offsetPath(input, distance, options = {}) {
-  if (!Number.isFinite(distance)) return [];
-  const contours = pathToContours(input);
-  if (contours.some((c) => c.segments.some((s) => s.some((p) => !Number.isFinite(p[0]) || !Number.isFinite(p[1]))))) return [];
-  const closed = contours.filter((c) => c.closed && c.segments.length > 0);
-  const open = contours.filter((c) => !c.closed && c.segments.length > 0);
-  const fillRule = options.fillRule ?? "nonzero";
-  const fill = { path: contoursToPath(closed), fillRule };
-  const d = Math.abs(distance);
-  const tol = options.tolerance && options.tolerance > 0 ? options.tolerance : DEFAULT_TOLERANCE;
-  if (d === 0) return pathBoolean("union", [fill], options).path;
-  const strokeOptions = { width: 2 * d, join: options.join ?? "miter", miterLimit: options.miterLimit, cap: "butt", tolerance: tol };
-  const ring = { path: strokeOutlineRings(contoursToPath(closed), strokeOptions), fillRule: "nonzero" };
-  const openRing = {
-    path: distance > 0 ? strokeOutlineRings(contoursToPath(open), strokeOptions) : [],
-    fillRule: "nonzero"
-  };
-  const grow = distance > 0;
-  const operands = [fill, ring, openRing];
-  try {
-    const rings = pathBooleanRings(grow ? (m) => m[0] || m[1] || m[2] : (m) => m[0] && !m[1], operands, options);
-    const sourceContours = contours;
-    const cleaned = dropSpurious(rings, (face, r) => {
-      if (grow ? r.area >= 0 : r.area <= 0) return false;
-      const p = deepPoint(face);
-      return !!p && distanceToBezierPath(sourceContours, p) < d * (1 - 1e-4) - 1e-6;
-    });
-    return mergeSmoothRuns(cleaned, tol);
-  } catch {
-    return grow ? pathBoolean("union", operands, options).path : pathBoolean("difference", [fill, ring], options).path;
-  }
-}
-
 // src/canvas/shapeNodes.ts
 var SHAPE_DATA_KEY = "shape";
 var SHAPE_NODE_TYPE = "shape";
@@ -2656,8 +2210,8 @@ function snapResize(rect, handle, targets, options = {}) {
   const ratio = rect.height > 0 ? rect.width / rect.height : 0;
   if (options.keepAspectRatio && ratio > 0 && (hitX || hitY)) {
     if (axes.x !== 0 && axes.y !== 0) {
-      const dist2 = (h, horizontal) => h ? Math.abs(h.value - (horizontal ? axes.x < 0 ? x0 : x1 : axes.y < 0 ? y0 : y1)) : Infinity;
-      const useX = dist2(hitX, true) <= dist2(hitY, false);
+      const dist = (h, horizontal) => h ? Math.abs(h.value - (horizontal ? axes.x < 0 ? x0 : x1 : axes.y < 0 ? y0 : y1)) : Infinity;
+      const useX = dist(hitX, true) <= dist(hitY, false);
       if (useX && hitX) {
         setEdge(true, hitX.value);
         const height = (nx1 - nx0) / ratio;
@@ -3022,7 +2576,7 @@ function layoutFrameInner(s, frame) {
     const b = s.boxes.get(id);
     return horizontal ? [b.w, b.h] : [b.h, b.w];
   };
-  const resize = (it, main, cross2) => resizeChild(s, it.id, horizontal ? main : cross2, horizontal ? cross2 : main);
+  const resize = (it, main, cross) => resizeChild(s, it.id, horizontal ? main : cross, horizontal ? cross : main);
   if (!wraps) {
     for (const it of items) {
       if (!it.fillCross || it.fillMain) continue;
@@ -3036,13 +2590,13 @@ function layoutFrameInner(s, frame) {
     let used = 0;
     items.forEach((it, i) => {
       const sz = it.fillMain ? it.minMain ?? 0 : it.main;
-      const add2 = cur.length === 0 ? sz : Math.max(gap, 0) + sz;
-      if (cur.length > 0 && used + add2 > innerMainFixed + 1e-6) {
+      const add = cur.length === 0 ? sz : Math.max(gap, 0) + sz;
+      if (cur.length > 0 && used + add > innerMainFixed + 1e-6) {
         lines.push(cur);
         cur = [];
         used = sz;
       } else {
-        used += add2;
+        used += add;
       }
       cur.push(i);
     });
@@ -3058,8 +2612,8 @@ function layoutFrameInner(s, frame) {
   }
   for (const it of items) {
     if (!it.fillMain) continue;
-    const cross2 = it.fillCross && !wraps ? clampLayoutSize(innerCrossFixed, it.minCross, it.maxCross) : it.cross;
-    resize(it, it.main, cross2);
+    const cross = it.fillCross && !wraps ? clampLayoutSize(innerCrossFixed, it.minCross, it.maxCross) : it.cross;
+    resize(it, it.main, cross);
     it.cross = sizeOf2(it.id)[1];
   }
   if (baseline) {
@@ -3073,8 +2627,8 @@ function layoutFrameInner(s, frame) {
     const inLine = line2.map((i) => items[i]);
     const mainUsed = inLine.reduce((sum, it) => sum + it.main, 0) + gaps;
     const allFill = inLine.every((it) => it.fillCross);
-    const cross2 = inLine.filter((it) => allFill || !it.fillCross).reduce((m, it) => Math.max(m, it.baseOff + it.cross), 0);
-    extents.push([mainUsed, cross2]);
+    const cross = inLine.filter((it) => allFill || !it.fillCross).reduce((m, it) => Math.max(m, it.baseOff + it.cross), 0);
+    extents.push([mainUsed, cross]);
   }
   const contentMain = extents.reduce((m, l) => Math.max(m, l[0]), 0);
   let crossGap = al.rowGap !== void 0 ? finite(al.rowGap) : gap;
@@ -3556,13 +3110,13 @@ function getAutoLayoutInsertTarget(nodes, frameId, point, options = {}) {
   const horizontal = al.mode !== "vertical";
   const main = (b) => horizontal ? b.x : b.y;
   const mainSize = (b) => horizontal ? b.w : b.h;
-  const cross2 = (b) => horizontal ? b.y : b.x;
+  const cross = (b) => horizontal ? b.y : b.x;
   const crossSize = (b) => horizontal ? b.h : b.w;
   const p = { x: px2, y: py };
   const multiLine = al.mode === "grid" || !!al.wrap;
   let index = 0;
   for (const b of siblings) {
-    const before = multiLine ? cross2(b) + crossSize(b) <= cross2(p) || cross2(b) <= cross2(p) && main(b) + mainSize(b) / 2 < main(p) : main(b) + mainSize(b) / 2 < main(p);
+    const before = multiLine ? cross(b) + crossSize(b) <= cross(p) || cross(b) <= cross(p) && main(b) + mainSize(b) / 2 < main(p) : main(b) + mainSize(b) / 2 < main(p);
     if (before) index += 1;
   }
   const [pt, pr, pb, pl] = resolvePadding(al.padding);
@@ -3571,13 +3125,13 @@ function getAutoLayoutInsertTarget(nodes, frameId, point, options = {}) {
   const f = s.boxes.get(frameId);
   let guide;
   if (horizontal) {
-    const x = prev && next && Math.abs(cross2(prev) - cross2(next)) < 1e-6 ? (prev.x + prev.w + next.x) / 2 : prev ? prev.x + prev.w : next ? next.x : pl;
+    const x = prev && next && Math.abs(cross(prev) - cross(next)) < 1e-6 ? (prev.x + prev.w + next.x) / 2 : prev ? prev.x + prev.w : next ? next.x : pl;
     const ref = next ?? prev;
     const y1 = ref ? ref.y : pt;
     const y2 = ref ? ref.y + ref.h : f.h - pb;
     guide = { orientation: "vertical", kind: "edge", x1: origin.x + x, y1: origin.y + y1, x2: origin.x + x, y2: origin.y + y2 };
   } else {
-    const y = prev && next && Math.abs(cross2(prev) - cross2(next)) < 1e-6 ? (prev.y + prev.h + next.y) / 2 : prev ? prev.y + prev.h : next ? next.y : pt;
+    const y = prev && next && Math.abs(cross(prev) - cross(next)) < 1e-6 ? (prev.y + prev.h + next.y) / 2 : prev ? prev.y + prev.h : next ? next.y : pt;
     const ref = next ?? prev;
     const x1 = ref ? ref.x : pl;
     const x2 = ref ? ref.x + ref.w : f.w - pr;
@@ -6449,8 +6003,8 @@ function sizeOf(node) {
   return { width: node.width, height: node.height, styleWidth: s.width, styleHeight: s.height };
 }
 var splitGroup = (group) => {
-  const dot2 = group.indexOf(".");
-  return dot2 < 0 ? [group, ""] : [group.slice(0, dot2), group.slice(dot2 + 1)];
+  const dot = group.indexOf(".");
+  return dot < 0 ? [group, ""] : [group.slice(0, dot), group.slice(dot + 1)];
 };
 function readOverrideGroup(node, group) {
   const data = dataOf(node);
@@ -6563,7 +6117,7 @@ function listGroups(node, out) {
     if (LINK_KEYS.has(k)) continue;
     const prefix = NESTED_KEYS[k];
     if (prefix) {
-      if (isRecord(v)) for (const sub2 of Object.keys(v)) out.add(`${prefix}.${sub2}`);
+      if (isRecord(v)) for (const sub of Object.keys(v)) out.add(`${prefix}.${sub}`);
       continue;
     }
     out.add(`data.${k}`);
@@ -7876,11 +7430,11 @@ function restoreCanvasMainComponent(nodes, id, options = {}) {
   if (g.get(inst.componentId)) return fail(nodes, "invalid", "The main component still exists.");
   if (enclosingInstanceIn(g, id) !== void 0) return fail(nodes, "nested-instance", "Select the outer instance.");
   const compId = inst.componentId;
-  const sub2 = g.subtree(id);
+  const sub = g.subtree(id);
   const map = /* @__PURE__ */ new Map([[id, compId]]);
   const taken = new Set(nodes.map((n) => n.id));
   taken.add(compId);
-  for (const d of sub2) {
+  for (const d of sub) {
     if (d === id) continue;
     const src = enclosingInstanceIn(g, d) === id ? getComponentSourceId(g.get(d)) : void 0;
     if (src && !taken.has(src)) {
@@ -7890,7 +7444,7 @@ function restoreCanvasMainComponent(nodes, id, options = {}) {
   }
   const nested = [];
   const replaced = /* @__PURE__ */ new Map();
-  for (const d of sub2) {
+  for (const d of sub) {
     let n = g.get(d);
     const nid = map.get(d) ?? d;
     const parentId = n.parentId !== void 0 ? map.get(n.parentId) ?? n.parentId : void 0;
@@ -8057,15 +7611,15 @@ function addCanvasVariant(nodes, setId, options = {}) {
   const taken = new Set(g.byId.keys());
   taken.add(id);
   const map = /* @__PURE__ */ new Map([[fromId, id]]);
-  const sub2 = g.subtree(fromId);
-  for (const d of sub2) {
+  const sub = g.subtree(fromId);
+  for (const d of sub) {
     if (d === fromId) continue;
     const nid = uniqueId(`${id}-${d}`, taken);
     taken.add(nid);
     map.set(d, nid);
   }
   const order = variantOrder([...edit.variants.map((v) => v.id), id], edit.values);
-  const subSet = new Set(sub2);
+  const subSet = new Set(sub);
   const copies = nodes.filter((n) => subSet.has(n.id)).map((n) => {
     const next = { ...n, id: map.get(n.id) };
     if (n.parentId !== void 0 && n.id !== fromId) next.parentId = map.get(n.parentId) ?? n.parentId;
@@ -8624,8 +8178,8 @@ function findStrokesAtPoint(point, nodes, radius = 12) {
     }
     const localPoint = [point[0] - rect.x, point[1] - rect.y];
     try {
-      const dist2 = distanceToBezierPath(shape.d, localPoint);
-      if (dist2 <= effectiveRadius) {
+      const dist = distanceToBezierPath(shape.d, localPoint);
+      if (dist <= effectiveRadius) {
         matches2.push(node);
       }
     } catch {
@@ -8930,6 +8484,7 @@ export {
   findStrokesAtPoint,
   findVariant,
   fitCubicRun,
+  fitCubicWithTangents,
   fitCubics,
   fitFreehandPath,
   fitPathData,