@snowcone-app/canvas 0.27.0 → 0.29.0

package/dist/{ExportManager-BTcyj4cf.js → ExportManager-B8Td7uR5.js}

@@ -1,12 +1,12 @@
-import { c as N, G as pe, a2 as Me, a3 as Oe, a4 as Re, a5 as he, a6 as J, a7 as Ln, a0 as Be, a1 as Le, z as Hn, R as Ne, a8 as Ue, a9 as j, aa as ze, ab as $n, P as We, S as Ge, I as kn, M as He, W as Ve, H as je, D as qe, O as Xe, J as Ye, K as Ke, A as Vn } from "./FontAnalyzer-EF3gLPr8.js";
-let be = null;
-function Je(e) {
-  be = e;
+import { c as U, G as me, a2 as Be, a3 as Le, a4 as Ne, a5 as ye, a6 as Wn, a7 as Ue, a8 as Z, a0 as We, a1 as ze, a9 as sn, aa as zn, z as Xn, R as Ge, ab as He, ac as q, ad as Ve, ae as vn, P as je, S as qe, I as En, M as Xe, W as Ye, H as Ke, D as Je, O as Ze, J as Qe, K as nt, A as Yn } from "./FontAnalyzer-D4Sg-P6_.js";
+let $e = null;
+function et(e) {
+  $e = e;
 }
-function xa() {
-  return be;
+function Ca() {
+  return $e;
 }
-const Ze = N("TextureManager"), sn = class sn {
+const tt = U("TextureManager"), cn = class cn {
   /**
    * Load a texture by ID or URL
    */
@@ -20,7 +20,7 @@ const Ze = N("TextureManager"), sn = class sn {
       s.crossOrigin = "anonymous", s.onload = () => {
         this.cache.set(n, s), this.cache.set(t, s), this.loading.delete(n), this.loading.delete(t), r(s);
       }, s.onerror = () => {
-        Ze.error("Failed to load texture:", t), this.loading.delete(n), this.loading.delete(t), o(new Error(`Failed to load texture: ${t}`));
+        tt.error("Failed to load texture:", t), this.loading.delete(n), this.loading.delete(t), o(new Error(`Failed to load texture: ${t}`));
       }, s.src = t;
     });
     return this.loading.set(n, a), t !== n && this.loading.set(t, a), a;
@@ -86,7 +86,7 @@ const Ze = N("TextureManager"), sn = class sn {
     return (t == null ? void 0 : t.presetColor) || "#ffffff";
   }
 };
-sn.cache = /* @__PURE__ */ new Map(), sn.loading = /* @__PURE__ */ new Map(), sn.TEXTURES = [
+cn.cache = /* @__PURE__ */ new Map(), cn.loading = /* @__PURE__ */ new Map(), cn.TEXTURES = [
   {
     id: "glass-frame",
     name: "Glass Frame",
@@ -96,33 +96,33 @@ sn.cache = /* @__PURE__ */ new Map(), sn.loading = /* @__PURE__ */ new Map(), sn
     // Light gray
   }
 ];
-let K = sn;
-const Qe = N("ElementPreviewRenderer"), nt = {
+let J = cn;
+const at = U("ElementPreviewRenderer"), rt = {
   width: 40,
   height: 40,
   padding: 4,
   backgroundColor: "transparent"
 };
-function et(e, n = {}) {
-  Un();
-  const t = { ...nt, ...n }, a = document.createElement("canvas");
+function st(e, n = {}) {
+  Hn();
+  const t = { ...rt, ...n }, a = document.createElement("canvas");
   a.width = t.width, a.height = t.height;
   const r = a.getContext("2d");
   if (!r)
     return "";
   t.backgroundColor !== "transparent" && (r.fillStyle = t.backgroundColor, r.fillRect(0, 0, t.width, t.height)), r.save();
   try {
-    e instanceof pe ? at(r, e, t) : tt(r, e, t);
+    e instanceof me ? ot(r, e, t) : it(r, e, t);
   } catch (o) {
-    Qe.warn("Failed to generate preview:", o);
+    at.warn("Failed to generate preview:", o);
   }
   return r.restore(), a.toDataURL("image/png");
 }
-function tt(e, n, t) {
+function it(e, n, t) {
   var f;
   const a = ((f = n.getBoundingBox) == null ? void 0 : f.call(n)) || { x: 0, y: 0, width: 100, height: 100 }, r = a.width, o = a.height;
   if (r === 0 || o === 0) {
-    jn(e, n, t);
+    Kn(e, n, t);
     return;
   }
   const s = t.width - t.padding * 2, c = t.height - t.padding * 2, i = Math.min(
@@ -131,14 +131,14 @@ function tt(e, n, t) {
     1
     // Don't scale up, only down
   ), l = r * i, d = o * i, u = t.padding + (s - l) / 2, p = t.padding + (c - d) / 2;
-  e.save(), e.translate(u - a.x * i, p - a.y * i), e.scale(i, i), typeof n.render == "function" ? n.render(e, !1, !1) : jn(e, n, t), e.restore();
+  e.save(), e.translate(u - a.x * i, p - a.y * i), e.scale(i, i), typeof n.render == "function" ? n.render(e, !1, !1) : Kn(e, n, t), e.restore();
 }
-function jn(e, n, t) {
+function Kn(e, n, t) {
   e.fillStyle = "#888888", e.font = "10px Arial", e.textAlign = "center", e.textBaseline = "middle";
   const a = n.transformType || "Element";
   e.fillText(a, t.width / 2, t.height / 2);
 }
-function at(e, n, t) {
+function ot(e, n, t) {
   const a = t.width - t.padding * 2, r = t.height - t.padding * 2, o = t.padding, s = t.padding;
   e.fillStyle = "#888888", e.strokeStyle = "#666666", e.lineWidth = 1;
   const c = r * 0.7, i = s + r * 0.3, l = a * 0.4, d = r * 0.2;
@@ -148,21 +148,21 @@ function at(e, n, t) {
     i + c / 2
   ));
 }
-function va(e, n, t) {
+function ka(e, n, t) {
   var l;
   e.translate(n.x || 0, n.y || 0), e.rotate(-(n.rotation || 0) * Math.PI / 180);
   const a = n, r = a.fontSize || 24, o = a.fontFamily || "Arial", s = a.bold || !1, c = a.italic || !1;
-  e.font = Me(r, o, s, c);
+  e.font = Be(r, o, s, c);
   const i = a.text || "";
   if (n.transformType === "custom") {
-    const u = ((l = n.transformData) == null ? void 0 : l.width) || 200, p = Oe(i, r, o, s, c), f = Math.min(p, u), m = r * 1.2;
-    e.rect(-f / 2, -m / 2, f, m);
+    const u = ((l = n.transformData) == null ? void 0 : l.width) || 200, p = Le(i, r, o, s, c), f = Math.min(p, u), $ = r * 1.2;
+    e.rect(-f / 2, -$ / 2, f, $);
   } else {
     const d = e.measureText(i).width;
     e.beginPath(), e.moveTo(-d / 2, 0), e.lineTo(d / 2, 0), e.moveTo(-d / 2, -r), e.lineTo(d / 2, -r), e.moveTo(-d / 2, r * 0.2), e.lineTo(d / 2, r * 0.2);
   }
 }
-function rt(e, n) {
+function ct(e, n) {
   if (!n.transformData) return;
   const { borderRadius: t = 0 } = n.transformData, a = n.transformData.width ?? 100, r = n.transformData.height ?? 100;
   if (e.translate(n.x || 0, n.y || 0), e.rotate(-(n.rotation || 0) * Math.PI / 180), e.beginPath(), t > 0) {
@@ -171,22 +171,22 @@ function rt(e, n) {
   } else
     e.rect(-a / 2, -r / 2, a, r);
 }
-function wa(e, n, t, a) {
+function Ta(e, n, t, a) {
   e.beginPath(), e.arc(n, t, a, 0, Math.PI * 2), e.closePath();
 }
-function Sa(e, n, t, a, r) {
+function _a(e, n, t, a, r) {
   e.beginPath(), e.rect(n, t, a, r), e.closePath();
 }
-function ge(e, n) {
+function xe(e, n) {
   e.strokeStyle = n.color, e.lineWidth = n.width, e.lineCap = n.lineCap || "butt", e.lineJoin = n.lineJoin || "miter", n.miterLimit !== void 0 && (e.miterLimit = n.miterLimit), n.dashArray && n.dashArray.length > 0 ? e.setLineDash(n.dashArray) : e.setLineDash([]), n.opacity !== void 0 && (e.globalAlpha = n.opacity);
 }
-function st(e, n) {
+function lt(e, n) {
   if (typeof OffscreenCanvas < "u")
     return new OffscreenCanvas(e, n);
   const t = document.createElement("canvas");
   return t.width = e, t.height = n, t;
 }
-function me(e, n, t) {
+function ve(e, n, t) {
   var i;
   if (!((i = n.stroke) != null && i.enabled)) return;
   const a = n;
@@ -194,148 +194,149 @@ function me(e, n, t) {
   const o = (t == null ? void 0 : t.isKnockout) === !0, s = n.stroke.opacity ?? 1;
   if (!o && s < 1)
     try {
-      it(e, n, a, t, s);
+      dt(e, n, a, t, s);
     } catch {
-      rn(e, n, a, t, !1);
+      on(e, n, a, t, !1);
     }
   else
-    rn(e, n, a, t, o);
+    on(e, n, a, t, o);
 }
-function it(e, n, t, a, r) {
-  var C, _;
-  const o = t.text || "", s = t.fontSize || 24, c = n.stroke.width, i = n.stroke.feather || 0, l = n.transformType === "custom" && ((C = n.transformData) == null ? void 0 : C.width), d = l ? ((_ = n.transformData) == null ? void 0 : _.width) ?? 200 : 0, u = l ? d + c * 2 + i * 2 + 40 : s * o.length * 0.7 + c * 2 + i * 2 + 40, p = s * 3 + c * 2 + i * 2 + 40, f = e.getTransform(), m = Math.max(Math.abs(f.a), Math.abs(f.d), 1), b = Math.ceil(u * m / 2) * 2, h = Math.ceil(p * m / 2) * 2;
-  if (b <= 0 || h <= 0) {
-    rn(e, n, t, a, !1);
+function dt(e, n, t, a, r) {
+  var k, _;
+  const o = t.text || "", s = t.fontSize || 24, c = n.stroke.width, i = n.stroke.feather || 0, l = n.transformType === "custom" && ((k = n.transformData) == null ? void 0 : k.width), d = l ? ((_ = n.transformData) == null ? void 0 : _.width) ?? 200 : 0, u = l ? d + c * 2 + i * 2 + 40 : s * o.length * 0.7 + c * 2 + i * 2 + 40, p = s * 3 + c * 2 + i * 2 + 40, f = e.getTransform(), $ = Math.max(Math.abs(f.a), Math.abs(f.d), 1), h = Math.ceil(u * $ / 2) * 2, b = Math.ceil(p * $ / 2) * 2;
+  if (h <= 0 || b <= 0) {
+    on(e, n, t, a, !1);
     return;
   }
-  const S = st(b, h), $ = S.getContext("2d");
-  if (!$) {
-    rn(e, n, t, a, !1);
+  const v = lt(h, b), y = v.getContext("2d");
+  if (!y) {
+    on(e, n, t, a, !1);
     return;
   }
-  const v = n.x || 0, g = n.y || 0, y = f.a * v + f.c * g + f.e, k = f.b * v + f.d * g + f.f;
-  $.setTransform(
+  const x = n.x || 0, m = n.y || 0, g = f.a * x + f.c * m + f.e, C = f.b * x + f.d * m + f.f;
+  y.setTransform(
     f.a,
     f.b,
     f.c,
     f.d,
-    b / 2 - y + f.e,
-    h / 2 - k + f.f
+    h / 2 - g + f.e,
+    b / 2 - C + f.f
   );
   const T = n.stroke.opacity;
-  n.stroke.opacity = 1, rn($, n, t, a, !1), n.stroke.opacity = T, e.save(), e.resetTransform(), e.globalAlpha = r, e.drawImage(
-    S,
-    Math.round(y - b / 2),
-    Math.round(k - h / 2)
+  n.stroke.opacity = 1, on(y, n, t, a, !1), n.stroke.opacity = T, e.save(), e.resetTransform(), e.globalAlpha = r, e.drawImage(
+    v,
+    Math.round(g - h / 2),
+    Math.round(C - b / 2)
   ), e.restore();
 }
-function rn(e, n, t, a, r) {
+function on(e, n, t, a, r) {
   var f;
   const o = t.text || "";
   e.save(), a != null && a.positionApplied || (e.translate(n.x || 0, n.y || 0), e.rotate(-(n.rotation || 0) * Math.PI / 180));
   const s = t.fontSize || 24, c = t.fontFamily || "Arial", i = t.bold || !1, l = t.italic || !1, d = t.textAlign || "center";
   e.font = `${l ? "italic " : ""}${i ? "bold " : ""}${s}px ${c}`, e.textAlign = d, e.textBaseline = "alphabetic", r ? (e.strokeStyle = "#000000", e.globalAlpha = 1) : (e.strokeStyle = n.stroke.color, n.stroke.opacity !== void 0 && (e.globalAlpha = n.stroke.opacity)), e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "round", e.lineJoin = n.stroke.lineJoin || "round", n.stroke.miterLimit !== void 0 && (e.miterLimit = n.stroke.miterLimit), !r && n.stroke.feather && n.stroke.feather > 0 && "filter" in e && (e.filter = `blur(${n.stroke.feather}px)`);
-  const u = Re(s, c, i, l);
+  const u = Ne(s, c, i, l);
   if (n.transformType === "custom" && ((f = n.transformData) == null ? void 0 : f.width)) {
-    const m = n.transformData, b = (m == null ? void 0 : m.width) ?? 200, h = b - J * 2, { lines: S, height: $ } = he(
+    const $ = n.transformData, h = ($ == null ? void 0 : $.width) ?? 200, b = h - Z * 2, v = t.letterSpacing ?? 0, { lines: y, height: x } = ye(
       o,
-      h,
+      b,
       s,
       c,
       i,
       l,
       void 0,
       // No locked line count for stroke
-      !0
+      !0,
       // strict: wrap exactly at maxWidth
-    ), v = -b / 2, g = -$ / 2, y = s * Ln;
-    S.forEach((k, T) => {
-      const C = T === 0, _ = T === S.length - 1;
-      let w = k;
-      if (!C) {
-        const P = k.match(/^ +/), A = P ? P[0].length : 0;
-        A > 0 && (w = w.substring(A));
-      }
+      { letterSpacing: v, lineHeight: t.lineHeight }
+    ), m = -h / 2, g = -x / 2, C = s * (t.lineHeight ?? Wn);
+    y.forEach((T, k) => {
+      const _ = k === 0, w = k === y.length - 1;
+      let A = T;
       if (!_) {
-        const P = w.match(/ +$/), A = P ? P[0].length : 0;
-        A > 0 && (w = w.substring(0, w.length - A));
+        const P = T.match(/^ +/), I = P ? P[0].length : 0;
+        I > 0 && (A = A.substring(I));
       }
-      let E = v + J;
-      d === "center" ? E = v + b / 2 : d === "right" && (E = v + b - J);
-      const x = g + u.ascent + T * y;
-      e.strokeText(w, E, x);
+      if (!w) {
+        const P = A.match(/ +$/), I = P ? P[0].length : 0;
+        I > 0 && (A = A.substring(0, A.length - I));
+      }
+      let E = m + Z;
+      d === "center" ? E = m + h / 2 : d === "right" && (E = m + h - Z);
+      const S = g + u.ascent + k * C;
+      Ue(e, A, E, S, v);
     });
   } else {
-    const h = -u.height / 2 + u.ascent;
-    e.strokeText(o, 0, h);
+    const b = -u.height / 2 + u.ascent;
+    e.strokeText(o, 0, b);
   }
   e.restore();
 }
-function ot(e, n, t) {
+function ft(e, n, t) {
   var r;
   if (!((r = n.stroke) != null && r.enabled) || !n.transformData) return;
   const a = (t == null ? void 0 : t.isKnockout) === !0;
-  e.save(), a ? (e.strokeStyle = "#000000", e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", e.globalAlpha = 1, n.stroke.miterLimit !== void 0 && (e.miterLimit = n.stroke.miterLimit)) : ge(e, n.stroke), !a && n.stroke.feather && n.stroke.feather > 0 && "filter" in e && (e.filter = `blur(${n.stroke.feather}px)`), rt(e, n), e.stroke(), e.restore();
+  e.save(), a ? (e.strokeStyle = "#000000", e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", e.globalAlpha = 1, n.stroke.miterLimit !== void 0 && (e.miterLimit = n.stroke.miterLimit)) : xe(e, n.stroke), !a && n.stroke.feather && n.stroke.feather > 0 && "filter" in e && (e.filter = `blur(${n.stroke.feather}px)`), ct(e, n), e.stroke(), e.restore();
 }
-function Ca(e, n, t) {
-  n.enabled && (e.save(), ge(e, n), n.feather && n.feather > 0 && "filter" in e && (e.filter = `blur(${n.feather}px)`), e.beginPath(), t(), e.stroke(), e.restore());
+function Ea(e, n, t) {
+  n.enabled && (e.save(), xe(e, n), n.feather && n.feather > 0 && "filter" in e && (e.filter = `blur(${n.feather}px)`), e.beginPath(), t(), e.stroke(), e.restore());
 }
-const qn = N("GlyphRenderer");
-function ct(e, n, t, a, r, o, s, c = {}) {
+const Jn = U("GlyphRenderer");
+function ut(e, n, t, a, r, o, s, c = {}) {
   try {
     const i = [];
-    Object.entries(s).forEach(([h, S]) => {
-      S && i.push(h);
+    Object.entries(s).forEach(([b, v]) => {
+      v && i.push(b);
     });
     const l = [];
-    n.GSUB && n.GSUB.featureList && n.GSUB.featureList.forEach((h) => {
-      l.push(h.tag);
+    n.GSUB && n.GSUB.featureList && n.GSUB.featureList.forEach((b) => {
+      l.push(b.tag);
     });
     const d = {};
-    d.ccmp = !0, d.locl = !0, d.kern = !0, i.forEach((h) => {
-      d[h] = !0;
+    d.ccmp = !0, d.locl = !0, d.kern = !0, i.forEach((b) => {
+      d[b] = !0;
     }), d.calt && (d.liga = !0, d.init = !0, d.fina = !0);
     const u = n.layout(t, d, "latn"), p = o / n.unitsPerEm;
     let f = 0;
-    u.glyphs.forEach((h) => {
-      f += h.advanceWidth * p;
+    u.glyphs.forEach((b) => {
+      f += b.advanceWidth * p;
     });
-    let m = a;
-    c.align === "center" ? m = a - f / 2 : c.align === "right" && (m = a - f), e.save(), e.fillStyle = c.color || "#000000";
-    let b = m;
-    u.glyphs.forEach((h, S) => {
-      const $ = u.positions[S];
-      let v = null;
+    let $ = a;
+    c.align === "center" ? $ = a - f / 2 : c.align === "right" && ($ = a - f), e.save(), e.fillStyle = c.color || "#000000";
+    let h = $;
+    u.glyphs.forEach((b, v) => {
+      const y = u.positions[v];
+      let x = null;
       try {
-        if (h.path && typeof h.path.toPath == "function")
-          v = h.path.toPath();
-        else if (h.path && typeof h.path.toSVG == "function") {
-          const g = h.path.toSVG();
-          if (g && /^[MmLlHhVvCcSsQqTtAaZz]/.test(g))
-            v = g;
+        if (b.path && typeof b.path.toPath == "function")
+          x = b.path.toPath();
+        else if (b.path && typeof b.path.toSVG == "function") {
+          const m = b.path.toSVG();
+          if (m && /^[MmLlHhVvCcSsQqTtAaZz]/.test(m))
+            x = m;
           else {
-            const y = g == null ? void 0 : g.match(/\bd=["']([^"']+)["']/);
-            v = y ? y[1] : null;
+            const g = m == null ? void 0 : m.match(/\bd=["']([^"']+)["']/);
+            x = g ? g[1] : null;
           }
         }
-      } catch (g) {
-        qn.warn("Error getting path for glyph:", h.name, g);
+      } catch (m) {
+        Jn.warn("Error getting path for glyph:", b.name, m);
       }
-      if (v) {
-        const g = new Path2D(v);
-        e.save(), e.translate(b + $.xOffset * p, r + $.yOffset * p), e.scale(p, -p), e.fill(g), e.restore();
+      if (x) {
+        const m = new Path2D(x);
+        e.save(), e.translate(h + y.xOffset * p, r + y.yOffset * p), e.scale(p, -p), e.fill(m), e.restore();
       }
-      b += h.advanceWidth * p;
+      h += b.advanceWidth * p;
     }), e.restore();
   } catch (i) {
-    qn.error("Error rendering with fontkit:", i), e.fillStyle = c.color || "#000000", e.textAlign = c.align || "left", e.fillText(t, a, r);
+    Jn.error("Error rendering with fontkit:", i), e.fillStyle = c.color || "#000000", e.textAlign = c.align || "left", e.fillText(t, a, r);
   }
 }
-function lt(e, n, t, a, r, o, s, c = {}) {
-  const l = ((h) => {
-    for (const S of h) {
-      const $ = S.codePointAt(0);
-      if ($ && $ >= 983040 && $ <= 1048573) return !0;
+function pt(e, n, t, a, r, o, s, c = {}) {
+  const l = ((b) => {
+    for (const v of b) {
+      const y = v.codePointAt(0);
+      if (y && y >= 983040 && y <= 1048573) return !0;
     }
     return !1;
   })(t);
@@ -344,172 +345,177 @@ function lt(e, n, t, a, r, o, s, c = {}) {
     return;
   }
   const d = /* @__PURE__ */ new Map();
-  s && s.forEach((h) => {
-    d.set(h.charIndex, h.glyphIndex);
+  s && s.forEach((b) => {
+    d.set(b.charIndex, b.glyphIndex);
   });
   const u = o / n.unitsPerEm, p = Array.from(t);
   let f = 0;
-  p.forEach((h, S) => {
-    const $ = h.codePointAt(0) || 0;
-    let v;
-    if ($ >= 983040 && $ <= 1048573)
-      v = $ - 983040;
-    else if (v = d.get(S), v === void 0) {
-      const y = n.glyphForCodePoint($);
-      v = y ? y.id : 0;
-    }
-    const g = n.getGlyph(v);
-    g && (f += g.advanceWidth * u);
+  p.forEach((b, v) => {
+    const y = b.codePointAt(0) || 0;
+    let x;
+    if (y >= 983040 && y <= 1048573)
+      x = y - 983040;
+    else if (x = d.get(v), x === void 0) {
+      const g = n.glyphForCodePoint(y);
+      x = g ? g.id : 0;
+    }
+    const m = n.getGlyph(x);
+    m && (f += m.advanceWidth * u);
   });
-  let m = a;
-  c.align === "center" ? m = a - f / 2 : c.align === "right" && (m = a - f), e.save(), e.fillStyle = c.color || "#000000";
-  let b = m;
-  p.forEach((h, S) => {
-    const $ = h.codePointAt(0) || 0;
-    let v;
-    if ($ >= 983040 && $ <= 1048573)
-      v = $ - 983040;
-    else if (v = d.get(S), v === void 0) {
-      const y = n.glyphForCodePoint($);
-      v = y ? y.id : 0;
-    }
-    const g = n.getGlyph(v);
-    if (g) {
-      const y = g.path.toSVG();
-      if (y) {
-        const k = new Path2D(y);
-        e.save(), e.translate(b, r), e.scale(u, -u), e.fill(k), e.restore();
+  let $ = a;
+  c.align === "center" ? $ = a - f / 2 : c.align === "right" && ($ = a - f), e.save(), e.fillStyle = c.color || "#000000";
+  let h = $;
+  p.forEach((b, v) => {
+    const y = b.codePointAt(0) || 0;
+    let x;
+    if (y >= 983040 && y <= 1048573)
+      x = y - 983040;
+    else if (x = d.get(v), x === void 0) {
+      const g = n.glyphForCodePoint(y);
+      x = g ? g.id : 0;
+    }
+    const m = n.getGlyph(x);
+    if (m) {
+      const g = m.path.toSVG();
+      if (g) {
+        const C = new Path2D(g);
+        e.save(), e.translate(h, r), e.scale(u, -u), e.fill(C), e.restore();
       }
-      b += g.advanceWidth * u;
+      h += m.advanceWidth * u;
     }
   }), e.restore();
 }
-function dt(e, n, t, a, r) {
+function ht(e, n, t, a, r) {
   e.fillStyle = t.color;
-  const o = t.textAlign || "center", s = Be(n);
-  let c, i;
-  a !== void 0 && a > 0 && !r ? (c = [], i = [], s.forEach((m) => {
-    const b = Le(m, a, t);
-    b.forEach((h, S) => {
-      c.push(h), i.push({
-        isParagraphStart: S === 0,
-        isParagraphEnd: S === b.length - 1
+  const o = t.textAlign || "center", s = (h) => h.letterSpacing !== void 0 ? h.letterSpacing : t.letterSpacing ?? 0, c = We(n);
+  let i, l;
+  a !== void 0 && a > 0 && !r ? (i = [], l = [], c.forEach((h) => {
+    const b = ze(h, a, t);
+    b.forEach((v, y) => {
+      i.push(v), l.push({
+        isParagraphStart: y === 0,
+        isParagraphEnd: y === b.length - 1
       });
     });
-  })) : (c = s, i = s.map(() => ({
+  })) : (i = c, l = c.map(() => ({
     isParagraphStart: !0,
     isParagraphEnd: !0
   })));
-  const l = [];
-  c.forEach((m, b) => {
-    const h = [];
-    let S = 0, $ = 0;
-    const v = i[b].isParagraphStart, g = i[b].isParagraphEnd;
-    m.forEach((x) => {
-      const P = x.style.fontSize !== void 0 ? x.style.fontSize : t.fontSize, A = x.style.fontFamily !== void 0 ? x.style.fontFamily : t.fontFamily, F = x.style.bold !== void 0 ? x.style.bold : t.bold || !1, D = x.style.italic !== void 0 ? x.style.italic : t.italic || !1;
-      e.font = R(P, A, F, D);
-      const I = e.measureText(x.text).width;
-      h.push(I);
-      const M = cn(P, A, F, D);
-      S = Math.max(S, M.height), $ = Math.max($, M.ascent);
+  const d = [];
+  i.forEach((h, b) => {
+    const v = [];
+    let y = 0, x = 0;
+    const m = l[b].isParagraphStart, g = l[b].isParagraphEnd;
+    h.forEach((S) => {
+      const P = S.style.fontSize !== void 0 ? S.style.fontSize : t.fontSize, I = S.style.fontFamily !== void 0 ? S.style.fontFamily : t.fontFamily, D = S.style.bold !== void 0 ? S.style.bold : t.bold || !1, F = S.style.italic !== void 0 ? S.style.italic : t.italic || !1;
+      e.font = B(P, I, D, F);
+      const M = sn(e.measureText(S.text).width, S.text, s(S.style));
+      v.push(M);
+      const L = dn(P, I, D, F);
+      y = Math.max(y, L.height), x = Math.max(x, L.ascent);
     });
-    const y = m.map((x) => x.text).join(""), k = y.match(/^ +/), T = y.match(/ +$/), C = k ? k[0].length : 0, _ = T ? T[0].length : 0;
-    let w = 0, E = 0;
-    m.forEach((x) => {
-      const P = x.style.fontSize !== void 0 ? x.style.fontSize : t.fontSize, A = x.style.fontFamily !== void 0 ? x.style.fontFamily : t.fontFamily, F = x.style.bold !== void 0 ? x.style.bold : t.bold || !1, D = x.style.italic !== void 0 ? x.style.italic : t.italic || !1;
-      let I = x.text;
-      const M = E, en = E + x.text.length;
-      if (!v && C > 0 && M < C) {
-        const B = Math.min(C - M, x.text.length);
-        I = I.substring(B);
+    const C = h.map((S) => S.text).join(""), T = C.match(/^ +/), k = C.match(/ +$/), _ = T ? T[0].length : 0, w = k ? k[0].length : 0;
+    let A = 0, E = 0;
+    h.forEach((S) => {
+      const P = S.style.fontSize !== void 0 ? S.style.fontSize : t.fontSize, I = S.style.fontFamily !== void 0 ? S.style.fontFamily : t.fontFamily, D = S.style.bold !== void 0 ? S.style.bold : t.bold || !1, F = S.style.italic !== void 0 ? S.style.italic : t.italic || !1;
+      let M = S.text;
+      const L = E, Cn = E + S.text.length;
+      if (!m && _ > 0 && L < _) {
+        const R = Math.min(_ - L, S.text.length);
+        M = M.substring(R);
       }
-      if (!g && _ > 0) {
-        const B = y.length - _;
-        if (en > B) {
-          const H = !v && C > 0 && M < C ? Math.min(C - M, x.text.length) : 0, wn = Math.max(0, B - M - H);
-          I = I.substring(0, wn);
+      if (!g && w > 0) {
+        const R = C.length - w;
+        if (Cn > R) {
+          const H = !m && _ > 0 && L < _ ? Math.min(_ - L, S.text.length) : 0, kn = Math.max(0, R - L - H);
+          M = M.substring(0, kn);
         }
       }
-      E += x.text.length, I.length > 0 && (e.save(), e.font = R(P, A, F, D), w += e.measureText(I).width, e.restore());
-    }), l.push({
-      spans: m,
-      width: w,
+      E += S.text.length, M.length > 0 && (e.save(), e.font = B(P, I, D, F), A += sn(
+        e.measureText(M).width,
+        M,
+        s(S.style)
+      ), e.restore());
+    }), d.push({
+      spans: h,
+      width: A,
       // Use adjusted width for alignment (may be 0 for empty lines)
-      height: S,
-      ascent: $,
-      spanWidths: h,
-      isParagraphStart: v,
+      height: y,
+      ascent: x,
+      spanWidths: v,
+      isParagraphStart: m,
       // Store metadata with line
       isParagraphEnd: g
     });
   });
-  const d = cn(t.fontSize, t.fontFamily, t.bold, t.italic), u = t.fontSize * Ln;
-  let p;
-  l.length === 0 ? p = 0 : l.length === 1 ? p = d.height : p = (l.length - 1) * u + d.height;
-  const f = -p / 2;
-  l.forEach((m, b) => {
-    const { spans: h, width: S, isParagraphStart: $, isParagraphEnd: v } = m;
+  const u = dn(t.fontSize, t.fontFamily, t.bold, t.italic), p = t.fontSize * (t.lineHeight ?? Wn);
+  let f;
+  d.length === 0 ? f = 0 : d.length === 1 ? f = u.height : f = (d.length - 1) * p + u.height;
+  const $ = -f / 2;
+  d.forEach((h, b) => {
+    const { spans: v, width: y, isParagraphStart: x, isParagraphEnd: m } = h;
     let g;
-    o === "center" ? g = -S / 2 : o === "right" ? g = a !== void 0 ? a / 2 - S : -S : g = a !== void 0 ? -a / 2 : 0;
-    const y = f + d.ascent + b * u, k = h.map((x) => x.text).join(""), T = k.match(/^ +/), C = k.match(/ +$/), _ = T ? T[0].length : 0, w = C ? C[0].length : 0;
+    o === "center" ? g = -y / 2 : o === "right" ? g = a !== void 0 ? a / 2 - y : -y : g = a !== void 0 ? -a / 2 : 0;
+    const C = $ + u.ascent + b * p, T = v.map((S) => S.text).join(""), k = T.match(/^ +/), _ = T.match(/ +$/), w = k ? k[0].length : 0, A = _ ? _[0].length : 0;
     let E = 0;
-    h.forEach((x) => {
-      const P = x.style.fontSize !== void 0 ? x.style.fontSize : t.fontSize, A = x.style.fontFamily !== void 0 ? x.style.fontFamily : t.fontFamily, F = x.style.color !== void 0 ? x.style.color : t.color, D = x.style.bold !== void 0 ? x.style.bold : t.bold || !1, I = x.style.italic !== void 0 ? x.style.italic : t.italic || !1, M = x.style.underline !== void 0 ? x.style.underline : t.underline || !1, en = x.style.strikethrough !== void 0 ? x.style.strikethrough : t.strikethrough || !1;
-      let B = x.text, H = E, wn = E + x.text.length;
-      if (!$ && _ > 0 && H < _) {
-        const U = Math.min(_ - H, x.text.length);
-        B = B.substring(U);
+    v.forEach((S) => {
+      const P = S.style.fontSize !== void 0 ? S.style.fontSize : t.fontSize, I = S.style.fontFamily !== void 0 ? S.style.fontFamily : t.fontFamily, D = S.style.color !== void 0 ? S.style.color : t.color, F = S.style.bold !== void 0 ? S.style.bold : t.bold || !1, M = S.style.italic !== void 0 ? S.style.italic : t.italic || !1, L = S.style.underline !== void 0 ? S.style.underline : t.underline || !1, Cn = S.style.strikethrough !== void 0 ? S.style.strikethrough : t.strikethrough || !1;
+      let R = S.text, H = E, kn = E + S.text.length;
+      if (!x && w > 0 && H < w) {
+        const V = Math.min(w - H, S.text.length);
+        R = R.substring(V);
       }
-      if (!v && w > 0) {
-        const U = k.length - w;
-        if (wn > U) {
-          const V = !$ && _ > 0 && H < _ ? Math.min(_ - H, x.text.length) : 0, Fe = Math.max(0, U - H - V);
-          B = B.substring(0, Fe);
+      if (!m && A > 0) {
+        const V = T.length - A;
+        if (kn > V) {
+          const tn = !x && w > 0 && H < w ? Math.min(w - H, S.text.length) : 0, j = Math.max(0, V - H - tn);
+          R = R.substring(0, j);
         }
       }
-      if (E += x.text.length, B.length > 0) {
-        e.font = R(P, A, D, I), e.fillStyle = F, e.textBaseline = "alphabetic", e.textAlign = "left", e.fillText(B, g, y);
-        const U = e.measureText(B).width;
-        if (M) {
-          const V = y + P * 0.1;
-          e.beginPath(), e.moveTo(g, V), e.lineTo(g + U, V), e.lineWidth = Math.max(1, P * 0.05), e.strokeStyle = F, e.stroke();
-        }
-        if (en) {
-          const V = y - P * 0.25;
-          e.beginPath(), e.moveTo(g, V), e.lineTo(g + U, V), e.lineWidth = Math.max(1, P * 0.05), e.strokeStyle = F, e.stroke();
-        }
-        g += U;
+      if (E += S.text.length, R.length > 0) {
+        const V = s(S.style);
+        e.font = B(P, I, F, M), e.fillStyle = D, e.textBaseline = "alphabetic", e.textAlign = "left", zn(e, R, g, C, V);
+        const tn = sn(e.measureText(R).width, R, V);
+        if (L) {
+          const j = C + P * 0.1;
+          e.beginPath(), e.moveTo(g, j), e.lineTo(g + tn, j), e.lineWidth = Math.max(1, P * 0.05), e.strokeStyle = D, e.stroke();
+        }
+        if (Cn) {
+          const j = C - P * 0.25;
+          e.beginPath(), e.moveTo(g, j), e.lineTo(g + tn, j), e.lineWidth = Math.max(1, P * 0.05), e.strokeStyle = D, e.stroke();
+        }
+        g += tn;
       }
     });
   });
 }
-const Tn = N("canvas-renderer");
-let fn = null;
-function Nn() {
-  if (!fn)
+const An = U("canvas-renderer");
+let pn = null;
+function Gn() {
+  if (!pn)
     if (typeof OffscreenCanvas < "u")
-      fn = new OffscreenCanvas(1, 1).getContext("2d");
+      pn = new OffscreenCanvas(1, 1).getContext("2d");
     else if (typeof document < "u")
-      fn = document.createElement("canvas").getContext("2d");
+      pn = document.createElement("canvas").getContext("2d");
     else
       throw new Error("No canvas context available");
-  return fn;
+  return pn;
 }
-function R(e, n, t = !1, a = !1) {
+function B(e, n, t = !1, a = !1) {
   const r = [];
   return a && r.push("italic"), t && r.push("bold"), r.push(`${e}px`), r.push(n), r.join(" ");
 }
-function Xn(e, n, t, a = !1, r = !1) {
-  const o = Nn();
-  return o.font = R(n, t, a, r), o.measureText(e).width;
+function Zn(e, n, t, a = !1, r = !1, o = 0) {
+  const s = Gn();
+  return s.font = B(n, t, a, r), sn(s.measureText(e).width, e, o);
 }
-function cn(e, n, t = !1, a = !1) {
-  const r = Nn();
-  r.font = R(e, n, t, a);
+function dn(e, n, t = !1, a = !1) {
+  const r = Gn();
+  r.font = B(e, n, t, a);
   const s = r.measureText("ÁÉÍgjpqy"), c = s.actualBoundingBoxAscent || e * 0.8, i = s.actualBoundingBoxDescent || e * 0.2, l = c + i;
   return { ascent: c, descent: i, height: l };
 }
-function ka(e, n) {
+function Aa(e, n) {
   const t = e.map((r, o) => ({
     isParagraphStart: !n && o === 0,
     isParagraphEnd: !n && o === e.length - 1
@@ -522,23 +528,23 @@ function ka(e, n) {
     return s || (i = i.replace(/^ +/, "")), c || (i = i.replace(/ +$/, "")), i;
   }).filter((r) => r.length > 0);
 }
-function ft(e, n) {
+function bt(e, n) {
   const t = n.fontSize, a = n.fontFamily, r = n.bold || !1, o = n.italic || !1, s = n.textAlign || "center", c = n.text;
-  e.font = R(t, a, r, o), e.textAlign = s, e.textBaseline = "alphabetic", e.fillStyle = n.color;
-  const i = cn(t, a, r, o), u = -i.height / 2 + i.ascent;
-  e.fillText(c, 0, u);
+  e.font = B(t, a, r, o), e.textAlign = s, e.textBaseline = "alphabetic", e.fillStyle = n.color;
+  const i = dn(t, a, r, o), u = -i.height / 2 + i.ascent;
+  zn(e, c, 0, u, n.letterSpacing);
 }
-function ut(e, n, t, a, r = !1, o = !1, s) {
-  const c = Nn();
-  if (c.font = R(t, a, r, o), e.trim().length === 0)
+function gt(e, n, t, a, r = !1, o = !1, s) {
+  const c = Gn();
+  if (c.font = B(t, a, r, o), e.trim().length === 0)
     return [e];
   if (e.includes(`
 `)) {
-    const C = e.split(`
+    const k = e.split(`
 `), _ = [];
-    for (let w = 0; w < C.length; w++) {
-      const E = C[w], x = ut(E, n, t, a, r, o);
-      _.push(...x);
+    for (let w = 0; w < k.length; w++) {
+      const A = k[w], E = gt(A, n, t, a, r, o);
+      _.push(...E);
     }
     return _;
   }
@@ -546,87 +552,87 @@ function ut(e, n, t, a, r = !1, o = !1, s) {
   if (s !== void 0 && s > 0) {
     if (s === 1)
       return [d + f.join(" ") + u];
-    const C = [], _ = Math.ceil(f.length / s);
+    const k = [], _ = Math.ceil(f.length / s);
     for (let w = 0; w < f.length; w += _) {
-      const x = f.slice(w, w + _).join(" ");
-      w === 0 && w + _ >= f.length ? C.push(d + x + u) : w === 0 ? C.push(d + x) : w + _ >= f.length ? C.push(x + u) : C.push(x);
-    }
-    return C;
-  }
-  const m = f.join(" "), b = d + m + u, h = c.measureText(b).width, S = n < 200, v = Math.max(20, n * (S ? 0.08 : 0.05));
-  if (h <= n + v)
-    return [b];
-  const g = [];
-  let y = f[0];
-  const T = Math.max(15, n * (S ? 0.05 : 0.03));
-  for (let C = 1; C < f.length; C++) {
-    const _ = f[C], w = y + " " + _;
-    c.measureText(w).width > n + T ? (g.push(y), y = _) : y = w;
-  }
-  return g.push(y), g.length > 0 && (g[0] = d + g[0], g[g.length - 1] = g[g.length - 1] + u), g;
+      const E = f.slice(w, w + _).join(" ");
+      w === 0 && w + _ >= f.length ? k.push(d + E + u) : w === 0 ? k.push(d + E) : w + _ >= f.length ? k.push(E + u) : k.push(E);
+    }
+    return k;
+  }
+  const $ = f.join(" "), h = d + $ + u, b = c.measureText(h).width, v = n < 200, x = Math.max(20, n * (v ? 0.08 : 0.05));
+  if (b <= n + x)
+    return [h];
+  const m = [];
+  let g = f[0];
+  const T = Math.max(15, n * (v ? 0.05 : 0.03));
+  for (let k = 1; k < f.length; k++) {
+    const _ = f[k], w = g + " " + _;
+    c.measureText(w).width > n + T ? (m.push(g), g = _) : g = w;
+  }
+  return m.push(g), m.length > 0 && (m[0] = d + m[0], m[m.length - 1] = m[m.length - 1] + u), m;
 }
-function Ta(e, n, t, a, r, o, s = "left", c = 0, i = 0, l = 1.2, d = !1, u = !1, p = !1, f = !1, m, b) {
-  e.font = R(r, o, d, u), e.textBaseline = "alphabetic", e.textAlign = s;
-  const h = (w) => {
-    for (const E of w) {
-      const x = E.codePointAt(0);
-      if (x && x >= 983040 && x <= 1048573)
+function Pa(e, n, t, a, r, o, s = "left", c = 0, i = 0, l = 1.2, d = !1, u = !1, p = !1, f = !1, $, h) {
+  e.font = B(r, o, d, u), e.textBaseline = "alphabetic", e.textAlign = s;
+  const b = (w) => {
+    for (const A of w) {
+      const E = A.codePointAt(0);
+      if (E && E >= 983040 && E <= 1048573)
         return !0;
     }
     return !1;
-  }, S = m && Object.values(m).some((w) => w), $ = b && b.length > 0, v = n.join(" "), g = h(v), y = S || $ || g, k = y ? Hn.getFontSync(o, d ? 700 : 400) : null;
-  y && !k && (Tn.warn(
-    `[renderMultilineText] Font ${o} not loaded for fontkit rendering. Text may not render correctly. Has PUA: ${g}, Text: "${v}"`
-  ), Hn.loadFont(o, d ? 700 : 400).catch((w) => {
-    Tn.error("[renderMultilineText] Error loading font:", w);
+  }, v = $ && Object.values($).some((w) => w), y = h && h.length > 0, x = n.join(" "), m = b(x), g = v || y || m, C = g ? Xn.getFontSync(o, d ? 700 : 400) : null;
+  g && !C && (An.warn(
+    `[renderMultilineText] Font ${o} not loaded for fontkit rendering. Text may not render correctly. Has PUA: ${m}, Text: "${x}"`
+  ), Xn.loadFont(o, d ? 700 : 400).catch((w) => {
+    An.error("[renderMultilineText] Error loading font:", w);
   }));
-  const T = cn(r, o, d, u), C = r * l;
+  const T = dn(r, o, d, u), k = r * l;
   let _ = 0;
-  n.forEach((w, E) => {
-    let x = t + i;
-    s === "center" ? x = t + c / 2 : s === "right" && (x = t + c - i);
-    const P = a + T.ascent + E * C, A = Array.from(w).length, F = $ ? b.filter((D) => {
-      const I = D.charIndex - _;
-      return I >= 0 && I < A;
+  n.forEach((w, A) => {
+    let E = t + i;
+    s === "center" ? E = t + c / 2 : s === "right" && (E = t + c - i);
+    const S = a + T.ascent + A * k, P = Array.from(w).length, I = y ? h.filter((D) => {
+      const F = D.charIndex - _;
+      return F >= 0 && F < P;
     }).map((D) => ({
       ...D,
       charIndex: D.charIndex - _
       // Adjust to line-relative index
     })) : [];
-    if (k && (S || F.length > 0 || g) ? F.length > 0 || h(w) ? lt(e, k, w, x, P, r, F, {
+    if (C && (v || I.length > 0 || m) ? I.length > 0 || b(w) ? pt(e, C, w, E, S, r, I, {
       color: e.fillStyle,
       align: s === "start" || s === "end" ? "left" : s
-    }) : m && ct(e, k, w, x, P, r, m, {
+    }) : $ && ut(e, C, w, E, S, r, $, {
       color: e.fillStyle,
       align: s === "start" || s === "end" ? "left" : s
-    }) : e.fillText(w, x, P), _ += A + 1, p) {
-      const D = Xn(w, r, o, d, u);
-      let I = x;
-      s === "center" ? I = x - D / 2 : s === "right" && (I = x - D);
-      const M = P + r * 0.1;
-      e.beginPath(), e.moveTo(I, M), e.lineTo(I + D, M), e.lineWidth = Math.max(1, r * 0.05), e.strokeStyle = e.fillStyle, e.stroke();
+    }) : e.fillText(w, E, S), _ += P + 1, p) {
+      const D = Zn(w, r, o, d, u);
+      let F = E;
+      s === "center" ? F = E - D / 2 : s === "right" && (F = E - D);
+      const M = S + r * 0.1;
+      e.beginPath(), e.moveTo(F, M), e.lineTo(F + D, M), e.lineWidth = Math.max(1, r * 0.05), e.strokeStyle = e.fillStyle, e.stroke();
     }
     if (f) {
-      const D = Xn(w, r, o, d, u);
-      let I = x;
-      s === "center" ? I = x - D / 2 : s === "right" && (I = x - D);
-      const M = P - r * 0.25;
-      e.beginPath(), e.moveTo(I, M), e.lineTo(I + D, M), e.lineWidth = Math.max(1, r * 0.05), e.strokeStyle = e.fillStyle, e.stroke();
+      const D = Zn(w, r, o, d, u);
+      let F = E;
+      s === "center" ? F = E - D / 2 : s === "right" && (F = E - D);
+      const M = S - r * 0.25;
+      e.beginPath(), e.moveTo(F, M), e.lineTo(F + D, M), e.lineWidth = Math.max(1, r * 0.05), e.strokeStyle = e.fillStyle, e.stroke();
     }
   });
 }
-function _n(e, n) {
-  pt(e, n);
+function Pn(e, n) {
+  mt(e, n);
 }
-function pt(e, n) {
+function mt(e, n) {
   var r;
-  (r = n.stroke) != null && r.enabled && me(e, n), e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180);
-  const t = n.transformData, a = ((t == null ? void 0 : t.width) ?? 100) - J * 2;
+  (r = n.stroke) != null && r.enabled && ve(e, n), e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180);
+  const t = n.transformData, a = ((t == null ? void 0 : t.width) ?? 100) - Z * 2;
   if (n.richText) {
-    const o = Ne.fromJSON(n.richText);
+    const o = Ge.fromJSON(n.richText);
     e.save(), e.translate(0, 0);
     const s = n._lockedLineCount;
-    dt(
+    ht(
       e,
       o,
       {
@@ -637,14 +643,16 @@ function pt(e, n) {
         italic: n.italic,
         underline: n.underline,
         strikethrough: n.strikethrough,
-        textAlign: n.textAlign
+        textAlign: n.textAlign,
+        letterSpacing: n.letterSpacing,
+        lineHeight: n.lineHeight
       },
       a,
       s
     ), e.restore();
   } else if (n.text) {
     e.fillStyle = n.color;
-    const o = n._lockedLineCount, { lines: s, height: c } = he(
+    const o = n._lockedLineCount, s = n.letterSpacing ?? 0, { lines: c, height: i } = ye(
       n.text,
       a,
       n.fontSize,
@@ -652,109 +660,110 @@ function pt(e, n) {
       n.bold,
       n.italic,
       o,
-      !0
+      !0,
       // strict: true
-    ), i = cn(
+      { letterSpacing: s, lineHeight: n.lineHeight }
+    ), l = dn(
       n.fontSize,
       n.fontFamily,
       n.bold,
       n.italic
-    ), l = -((t == null ? void 0 : t.width) ?? 100) / 2, d = -c / 2, u = n.fontSize * Ln;
-    e.font = `${n.italic ? "italic " : ""}${n.bold ? "bold " : ""}${n.fontSize}px ${n.fontFamily}`, e.textBaseline = "alphabetic", e.textAlign = n.textAlign, s.forEach((p, f) => {
-      const m = f === 0, b = f === s.length - 1;
-      let h = p;
-      if (!m) {
-        const v = p.match(/^ +/), g = v ? v[0].length : 0;
-        g > 0 && (h = h.substring(g));
+    ), d = -((t == null ? void 0 : t.width) ?? 100) / 2, u = -i / 2, p = n.fontSize * (n.lineHeight ?? Wn);
+    e.font = `${n.italic ? "italic " : ""}${n.bold ? "bold " : ""}${n.fontSize}px ${n.fontFamily}`, e.textBaseline = "alphabetic", e.textAlign = n.textAlign, c.forEach((f, $) => {
+      const h = $ === 0, b = $ === c.length - 1;
+      let v = f;
+      if (!h) {
+        const m = f.match(/^ +/), g = m ? m[0].length : 0;
+        g > 0 && (v = v.substring(g));
       }
       if (!b) {
-        const v = h.match(/ +$/), g = v ? v[0].length : 0;
-        g > 0 && (h = h.substring(0, h.length - g));
+        const m = v.match(/ +$/), g = m ? m[0].length : 0;
+        g > 0 && (v = v.substring(0, v.length - g));
       }
-      let S = l + J;
-      n.textAlign === "center" ? S = l + ((t == null ? void 0 : t.width) ?? 100) / 2 : n.textAlign === "right" && (S = l + ((t == null ? void 0 : t.width) ?? 100) - J);
-      const $ = d + i.ascent + f * u;
-      if (e.fillText(h, S, $), h.length > 0) {
-        const v = e.measureText(h).width;
-        let g = S;
-        if (n.textAlign === "center" ? g -= v / 2 : n.textAlign === "right" && (g -= v), n.underline) {
-          const y = $ + n.fontSize * 0.1;
-          e.fillRect(g, y, v, Math.max(1, n.fontSize * 0.05));
+      let y = d + Z;
+      n.textAlign === "center" ? y = d + ((t == null ? void 0 : t.width) ?? 100) / 2 : n.textAlign === "right" && (y = d + ((t == null ? void 0 : t.width) ?? 100) - Z);
+      const x = u + l.ascent + $ * p;
+      if (zn(e, v, y, x, s), v.length > 0) {
+        const m = sn(e.measureText(v).width, v, s);
+        let g = y;
+        if (n.textAlign === "center" ? g -= m / 2 : n.textAlign === "right" && (g -= m), n.underline) {
+          const C = x + n.fontSize * 0.1;
+          e.fillRect(g, C, m, Math.max(1, n.fontSize * 0.05));
         }
         if (n.strikethrough) {
-          const y = $ - i.ascent * 0.4;
-          e.fillRect(g, y, v, Math.max(1, n.fontSize * 0.05));
+          const C = x - l.ascent * 0.4;
+          e.fillRect(g, C, m, Math.max(1, n.fontSize * 0.05));
         }
       }
     });
   }
   e.restore();
 }
-function _a(e, n) {
+function Ia(e, n) {
   var s;
   const t = n.opacity ?? 1, a = !!((s = n.stroke) != null && s.enabled), r = n.type === "custom";
   if (t < 1 && a && r) {
-    ht(e, n, t);
+    yt(e, n, t);
     return;
   }
   const o = e.globalAlpha;
-  t !== 1 && (e.globalAlpha = t), En(e, n), e.globalAlpha = o;
+  t !== 1 && (e.globalAlpha = t), In(e, n), e.globalAlpha = o;
 }
-function ht(e, n, t) {
-  var h;
-  const a = n.transformData, r = n.fontSize || 24, o = ((h = n.stroke) == null ? void 0 : h.width) || 0, s = ((a == null ? void 0 : a.width) ?? r * n.text.length * 0.7) + o * 2 + 40, c = r * 3 + o * 2 + 40, i = e.getTransform(), l = Math.max(Math.abs(i.a), Math.abs(i.d), 1), d = Math.ceil(s * l), u = Math.ceil(c * l);
+function yt(e, n, t) {
+  var b;
+  const a = n.transformData, r = n.fontSize || 24, o = ((b = n.stroke) == null ? void 0 : b.width) || 0, s = ((a == null ? void 0 : a.width) ?? r * n.text.length * 0.7) + o * 2 + 40, c = r * 3 + o * 2 + 40, i = e.getTransform(), l = Math.max(Math.abs(i.a), Math.abs(i.d), 1), d = Math.ceil(s * l), u = Math.ceil(c * l);
   let p;
   typeof OffscreenCanvas < "u" ? p = new OffscreenCanvas(d, u) : (p = document.createElement("canvas"), p.width = d, p.height = u);
   const f = p.getContext("2d");
   if (!f) {
-    const S = e.globalAlpha;
-    e.globalAlpha = t, En(e, n), e.globalAlpha = S;
+    const v = e.globalAlpha;
+    e.globalAlpha = t, In(e, n), e.globalAlpha = v;
     return;
   }
-  const m = i.a * n.x + i.e, b = i.d * n.y + i.f;
+  const $ = i.a * n.x + i.e, h = i.d * n.y + i.f;
   f.setTransform(
     i.a,
     i.b,
     i.c,
     i.d,
-    i.e - m + d / 2,
-    i.f - b + u / 2
-  ), En(f, n), e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.globalAlpha = t, e.drawImage(p, m - d / 2, b - u / 2), e.restore();
+    i.e - $ + d / 2,
+    i.f - h + u / 2
+  ), In(f, n), e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.globalAlpha = t, e.drawImage(p, $ - d / 2, h - u / 2), e.restore();
 }
-function En(e, n) {
+function In(e, n) {
   switch (n.type) {
     case "custom":
-      _n(e, n);
+      Pn(e, n);
       break;
     case "circle":
-      ye(e, n);
+      we(e, n);
       break;
     case "wave":
-      $e(e, n);
+      Se(e, n);
       break;
     case "arch":
-      xe(e, n);
+      Ce(e, n);
       break;
     case "ascend":
-      ve(e, n);
+      ke(e, n);
       break;
     case "lean":
-      we(e, n);
+      Te(e, n);
       break;
     case "flag":
-      Se(e, n);
+      _e(e, n);
       break;
     default:
-      Tn.warn(`[canvas-renderer] Unsupported transform type: ${n.type}`), _n(e, n);
+      An.warn(`[canvas-renderer] Unsupported transform type: ${n.type}`), Pn(e, n);
   }
 }
-function bt(e, n) {
+function $t(e, n) {
   if (typeof OffscreenCanvas < "u")
     return new OffscreenCanvas(e, n);
   const t = document.createElement("canvas");
   return t.width = e, t.height = n, t;
 }
-function Q(e, n, t) {
+function nn(e, n, t) {
   if (t != null && t.enabled)
     if (e.strokeStyle = t.color, e.lineWidth = t.width, e.lineCap = t.lineCap || "round", e.lineJoin = t.lineJoin || "round", t.miterLimit !== void 0 && (e.miterLimit = t.miterLimit), t.opacity !== void 0) {
       const a = e.globalAlpha;
@@ -762,49 +771,49 @@ function Q(e, n, t) {
     } else
       e.strokeText(n, 0, 0);
 }
-function nn(e, n, t) {
+function en(e, n, t) {
   const a = n.stroke, r = (a == null ? void 0 : a.opacity) ?? 1, o = e.globalAlpha, s = (a == null ? void 0 : a.enabled) && r < 1, c = (a == null ? void 0 : a.enabled) && o < 1;
   if (!(s || c)) {
     t(e, n);
     return;
   }
-  const l = n.fontSize || 24, d = a.width || 0, u = n.transformData, p = l * n.text.length * 0.7, f = u.width ?? (u.radius ? u.radius * 2 : 0), m = Math.max(f, p), b = (a.feather || 0) * 2, h = d * 4 + b + l + 40, S = m + h, $ = u.archHeight ? Math.abs(u.archHeight) * l * 2 : 0, v = u.radius ? u.radius : 0, g = l * 3 + h + $ + v, y = e.getTransform(), k = Math.max(Math.abs(y.a), Math.abs(y.d), 1), T = Math.ceil(S * k / 2) * 2, C = Math.ceil(g * k / 2) * 2;
-  if (T <= 0 || C <= 0) {
+  const l = n.fontSize || 24, d = a.width || 0, u = n.transformData, p = l * n.text.length * 0.7, f = u.width ?? (u.radius ? u.radius * 2 : 0), $ = Math.max(f, p), h = (a.feather || 0) * 2, b = d * 4 + h + l + 40, v = $ + b, y = u.archHeight ? Math.abs(u.archHeight) * l * 2 : 0, x = u.radius ? u.radius : 0, m = l * 3 + b + y + x, g = e.getTransform(), C = Math.max(Math.abs(g.a), Math.abs(g.d), 1), T = Math.ceil(v * C / 2) * 2, k = Math.ceil(m * C / 2) * 2;
+  if (T <= 0 || k <= 0) {
     t(e, n);
     return;
   }
-  const _ = bt(T, C), w = _.getContext("2d");
+  const _ = $t(T, k), w = _.getContext("2d");
   if (!w) {
     t(e, n);
     return;
   }
-  const E = n.x || 0, x = n.y || 0, P = y.a * E + y.c * x + y.e, A = y.b * E + y.d * x + y.f, F = Math.round(P - T / 2), D = Math.round(A - C / 2);
+  const A = n.x || 0, E = n.y || 0, S = g.a * A + g.c * E + g.e, P = g.b * A + g.d * E + g.f, I = Math.round(S - T / 2), D = Math.round(P - k / 2);
   if (w.setTransform(
-    y.a,
-    y.b,
-    y.c,
-    y.d,
-    T / 2 - P + y.e,
-    C / 2 - A + y.f
+    g.a,
+    g.b,
+    g.c,
+    g.d,
+    T / 2 - S + g.e,
+    k / 2 - P + g.f
   ), c) {
     w.globalAlpha = 1;
-    const en = a.opacity;
-    s && (a.opacity = 1), t(w, n), s && (a.opacity = en), e.save(), e.resetTransform(), e.globalAlpha = o, e.drawImage(_, F, D), e.restore();
+    const L = a.opacity;
+    s && (a.opacity = 1), t(w, n), s && (a.opacity = L), e.save(), e.resetTransform(), e.globalAlpha = o, e.drawImage(_, I, D), e.restore();
     return;
   }
-  const I = a.opacity;
-  a.opacity = 1, t(w, n), a.opacity = I;
+  const F = a.opacity;
+  a.opacity = 1, t(w, n), a.opacity = F;
   const M = a.enabled;
   a.enabled = !1, t(e, n), a.enabled = M, e.save(), e.resetTransform(), e.globalAlpha = r, e.drawImage(
     _,
-    F,
+    I,
     D
   ), e.restore();
 }
-function ye(e, n) {
-  nn(e, n, gt);
+function we(e, n) {
+  en(e, n, xt);
 }
-function gt(e, n) {
+function xt(e, n) {
   const t = n.transformData;
   e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.scale(t.scale, t.scale);
   const a = n.bold ? "bold" : "normal", r = n.italic ? "italic" : "normal";
@@ -813,84 +822,84 @@ function gt(e, n) {
   if (t.reverse) {
     let i = Math.PI / 2 + c / (2 * t.radius);
     o.forEach((l, d) => {
-      const p = s[d] / t.radius, f = Math.cos(i - p / 2) * t.radius, m = Math.sin(i - p / 2) * t.radius;
-      e.save(), e.translate(f, m), e.rotate(i - p / 2 - Math.PI / 2), Q(e, l, n.stroke), e.fillText(l, 0, 0), e.restore(), i -= p;
+      const p = s[d] / t.radius, f = Math.cos(i - p / 2) * t.radius, $ = Math.sin(i - p / 2) * t.radius;
+      e.save(), e.translate(f, $), e.rotate(i - p / 2 - Math.PI / 2), nn(e, l, n.stroke), e.fillText(l, 0, 0), e.restore(), i -= p;
     });
   } else {
     let i = -Math.PI / 2 - c / (2 * t.radius);
     o.forEach((l, d) => {
-      const p = s[d] / t.radius, f = Math.cos(i + p / 2) * t.radius, m = Math.sin(i + p / 2) * t.radius;
-      e.save(), e.translate(f, m), e.rotate(i + p / 2 + Math.PI / 2), Q(e, l, n.stroke), e.fillText(l, 0, 0), e.restore(), i += p;
+      const p = s[d] / t.radius, f = Math.cos(i + p / 2) * t.radius, $ = Math.sin(i + p / 2) * t.radius;
+      e.save(), e.translate(f, $), e.rotate(i + p / 2 + Math.PI / 2), nn(e, l, n.stroke), e.fillText(l, 0, 0), e.restore(), i += p;
     });
   }
   e.restore();
 }
-function $e(e, n) {
-  nn(e, n, mt);
+function Se(e, n) {
+  en(e, n, vt);
 }
-function mt(e, n) {
+function vt(e, n) {
   const t = n.transformData;
-  e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = R(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
+  e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = B(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
   const a = n.text.split("");
   let o = -a.reduce((s, c) => s + e.measureText(c).width, 0) / 2;
   a.forEach((s) => {
     const c = e.measureText(s).width, i = o + c / 2, l = i / (t.width / 2), d = t.amplitude * n.fontSize * Math.sin(t.frequency * Math.PI * l), u = t.amplitude * t.frequency * Math.PI * Math.cos(t.frequency * Math.PI * l);
-    e.save(), e.translate(i, d), e.transform(1, u * Ue, 0, 1, 0, 0), Q(e, s, n.stroke), e.fillText(s, 0, 0), e.restore(), o += c;
+    e.save(), e.translate(i, d), e.transform(1, u * He, 0, 1, 0, 0), nn(e, s, n.stroke), e.fillText(s, 0, 0), e.restore(), o += c;
   }), e.restore();
 }
-function xe(e, n) {
-  nn(e, n, yt);
+function Ce(e, n) {
+  en(e, n, wt);
 }
-function yt(e, n) {
+function wt(e, n) {
   const t = n.transformData;
-  e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = R(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
+  e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = B(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
   const a = n.text.split(""), r = a.reduce((c, i) => c + e.measureText(i).width, 0), o = t.width / 2;
   let s = -r / 2;
   a.forEach((c) => {
     const i = e.measureText(c).width, l = s + i / 2, d = l / o, u = (Math.pow(d, 2) - 1) * t.archHeight * n.fontSize, p = 2 * d * t.archHeight;
-    e.save(), e.translate(l, u), e.transform(1, p * 0.3, 0, 1, 0, 0), Q(e, c, n.stroke), e.fillText(c, 0, 0), e.restore(), s += i;
+    e.save(), e.translate(l, u), e.transform(1, p * 0.3, 0, 1, 0, 0), nn(e, c, n.stroke), e.fillText(c, 0, 0), e.restore(), s += i;
   }), e.restore();
 }
-function ve(e, n) {
-  nn(e, n, $t);
+function ke(e, n) {
+  en(e, n, St);
 }
-function $t(e, n) {
+function St(e, n) {
   const t = n.transformData;
-  e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = R(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
+  e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = B(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
   const a = n.text.split(""), r = a.reduce((c, i) => c + e.measureText(i).width, 0), o = t.ascendAngle * Math.PI / 180;
   let s = -r / 2;
   a.forEach((c) => {
     const i = e.measureText(c).width, l = s + i / 2, d = l * Math.tan(o), u = Math.tan(o);
-    e.save(), e.translate(l, d), e.transform(1, u * 1, 0, 1, 0, 0), Q(e, c, n.stroke), e.fillText(c, 0, 0), e.restore(), s += i;
+    e.save(), e.translate(l, d), e.transform(1, u * 1, 0, 1, 0, 0), nn(e, c, n.stroke), e.fillText(c, 0, 0), e.restore(), s += i;
   }), e.restore();
 }
-function we(e, n) {
-  nn(e, n, xt);
+function Te(e, n) {
+  en(e, n, Ct);
 }
-function xt(e, n) {
+function Ct(e, n) {
   var r;
   const t = n.transformData;
   e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180);
   const a = -t.leanAmount * Math.PI / 4;
-  e.transform(1, 0, Math.tan(a), 1, 0, 0), e.font = R(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle", (r = n.stroke) != null && r.enabled && (e.save(), e.strokeStyle = n.stroke.color, e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "round", e.lineJoin = n.stroke.lineJoin || "round", n.stroke.opacity !== void 0 && (e.globalAlpha = n.stroke.opacity), e.strokeText(n.text, 0, 0), e.restore()), e.fillText(n.text, 0, 0), e.restore();
+  e.transform(1, 0, Math.tan(a), 1, 0, 0), e.font = B(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle", (r = n.stroke) != null && r.enabled && (e.save(), e.strokeStyle = n.stroke.color, e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "round", e.lineJoin = n.stroke.lineJoin || "round", n.stroke.opacity !== void 0 && (e.globalAlpha = n.stroke.opacity), e.strokeText(n.text, 0, 0), e.restore()), e.fillText(n.text, 0, 0), e.restore();
 }
-function Se(e, n) {
-  nn(e, n, vt);
+function _e(e, n) {
+  en(e, n, kt);
 }
-function vt(e, n) {
+function kt(e, n) {
   const t = n.transformData;
-  e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = R(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
+  e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = B(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
   const a = n.text.split("");
   let o = -a.reduce((s, c) => s + e.measureText(c).width, 0) / 2;
   a.forEach((s) => {
-    const c = e.measureText(s).width, i = o + c / 2, l = i / (t.width / 2), d = Math.abs(l), u = t.amplitude * d, p = u * n.fontSize * Math.sin(t.frequency * Math.PI * l), f = u * t.frequency * Math.PI * Math.cos(t.frequency * Math.PI * l), m = t.amplitude * Math.sign(l) * Math.sin(t.frequency * Math.PI * l), b = f + m;
-    e.save(), e.translate(i, p), e.transform(1, b * 0.3, 0, 1, 0, 0), Q(e, s, n.stroke), e.fillText(s, 0, 0), e.restore(), o += c;
+    const c = e.measureText(s).width, i = o + c / 2, l = i / (t.width / 2), d = Math.abs(l), u = t.amplitude * d, p = u * n.fontSize * Math.sin(t.frequency * Math.PI * l), f = u * t.frequency * Math.PI * Math.cos(t.frequency * Math.PI * l), $ = t.amplitude * Math.sign(l) * Math.sin(t.frequency * Math.PI * l), h = f + $;
+    e.save(), e.translate(i, p), e.transform(1, h * 0.3, 0, 1, 0, 0), nn(e, s, n.stroke), e.fillText(s, 0, 0), e.restore(), o += c;
   }), e.restore();
 }
-function q(e) {
+function X(e) {
   return (n, t) => e(n, t);
 }
-function wt(e, n) {
+function Tt(e, n) {
   e.save();
   const t = e.canvas, a = t.width, r = t.height, o = e.getTransform(), s = [];
   let c = [];
@@ -920,52 +929,53 @@ function wt(e, n) {
     }
   e.restore();
 }
-var Yn = !1;
-function Un() {
-  Yn || (Yn = !0, j("arch", q(xe)), j("ascend", q(ve)), j("circle", q(ye)), j("flag", q(Se)), j("lean", q(we)), j("wave", q($e)), j(
+var Qn = !1;
+function Hn() {
+  Qn || (Qn = !0, q("arch", X(Ce)), q("ascend", X(ke)), q("circle", X(we)), q("flag", X(_e)), q("lean", X(Te)), q("wave", X(Se)), q(
     "custom",
-    (e, n) => _n(e, n)
-  ), ze(wt), Je(
-    (e, n) => et(e, n)
+    (e, n) => Pn(e, n)
+  ), Ve(Tt), et(
+    (e, n) => st(e, n)
   ), globalThis.__scElementPaintersInstalled = !0);
 }
-Un();
-function zn(e, n, t = {}) {
+Hn();
+function Vn(e, n, t = {}) {
   const a = t.mode || "both";
   switch (e.save(), e.translate(n.x || 0, n.y || 0), e.rotate(-(n.rotation || 0) * Math.PI / 180), n.transformType) {
     case "image":
-      Ct(e, n, a, t);
+      Et(e, n, a, t);
       break;
     case "shape":
-      kt(e, n, a, t);
+      At(e, n, a, t);
       break;
     case "group":
       break;
     default:
-      St(e, n, a, t);
+      _t(e, n, a, t);
       break;
   }
   e.restore();
 }
-function St(e, n, t, a) {
+function _t(e, n, t, a) {
   var s;
   const r = n, o = r.text || "";
-  o && ((t === "stroke" || t === "both") && ((s = n.stroke) != null && s.enabled) && (e.save(), me(e, n, { ...a.renderingContext, positionApplied: !0 }), e.restore()), (t === "fill" || t === "both") && (e.save(), ft(e, {
+  o && ((t === "stroke" || t === "both") && ((s = n.stroke) != null && s.enabled) && (e.save(), ve(e, n, { ...a.renderingContext, positionApplied: !0 }), e.restore()), (t === "fill" || t === "both") && (e.save(), bt(e, {
     text: o,
     fontSize: r.fontSize || 24,
     fontFamily: r.fontFamily || "Arial",
     bold: r.bold || !1,
     italic: r.italic || !1,
     textAlign: r.textAlign || "center",
-    color: r.color || "#000000"
+    color: r.color || "#000000",
+    letterSpacing: r.letterSpacing
   }), e.restore()));
 }
-function Ct(e, n, t, a) {
+function Et(e, n, t, a) {
   var o;
   if (!n.transformData) return;
   const r = n.transformData;
   if (t === "fill" || t === "both")
-    if (Pt(e, n), a.loadedImage) {
+    if (Mt(e, n), a.loadedImage) {
       e.save(), e.clip();
       const s = r.flipHorizontal ? -1 : 1, c = r.flipVertical ? -1 : 1;
       e.scale(s, c);
@@ -973,34 +983,34 @@ function Ct(e, n, t, a) {
       e.drawImage(a.loadedImage, -i / 2, -l / 2, i, l), e.restore();
     } else
       e.fillStyle = "#cccccc", e.fill();
-  (t === "stroke" || t === "both") && ((o = n.stroke) != null && o.enabled) && (e.save(), ot(e, n, a.renderingContext), e.restore());
+  (t === "stroke" || t === "both") && ((o = n.stroke) != null && o.enabled) && (e.save(), ft(e, n, a.renderingContext), e.restore());
 }
-function kt(e, n, t, a) {
+function At(e, n, t, a) {
   var s, c;
   if (!n.transformData) return;
   const r = n.transformData, o = ((s = a.renderingContext) == null ? void 0 : s.isKnockout) === !0;
-  e.beginPath(), Ce(e, r), (t === "fill" || t === "both") && (e.fillStyle = o ? "#000000" : r.fillColor || "#3b82f6", e.globalAlpha = o ? 1 : r.fillOpacity ?? 1, e.fill()), (t === "stroke" || t === "both") && ((c = n.stroke) != null && c.enabled) && (e.save(), At(e, n, a.renderingContext), e.restore());
+  e.beginPath(), Ee(e, r), (t === "fill" || t === "both") && (e.fillStyle = o ? "#000000" : r.fillColor || "#3b82f6", e.globalAlpha = o ? 1 : r.fillOpacity ?? 1, e.fill()), (t === "stroke" || t === "both") && ((c = n.stroke) != null && c.enabled) && (e.save(), Ft(e, n, a.renderingContext), e.restore());
 }
-function Ce(e, n) {
+function Ee(e, n) {
   const { shapeType: t } = n, a = n.width ?? 100, r = n.height ?? 100;
   switch (t) {
     case "rectangle":
-      Kn(e, n, a, r);
+      ne(e, n, a, r);
       break;
     case "circle":
-      Tt(e, Math.min(a, r) / 2);
+      Pt(e, Math.min(a, r) / 2);
       break;
     case "ellipse":
-      _t(e, a / 2, r / 2);
+      It(e, a / 2, r / 2);
       break;
     case "star":
-      Et(e, n, Math.min(a, r) / 2);
+      Dt(e, n, Math.min(a, r) / 2);
       break;
     default:
-      Kn(e, n, a, r);
+      ne(e, n, a, r);
   }
 }
-function Kn(e, n, t, a) {
+function ne(e, n, t, a) {
   const r = n.borderRadius || 0, o = -t / 2, s = -a / 2;
   if (r > 0) {
     const c = Math.min(r / 100 * Math.min(t, a), t / 2, a / 2);
@@ -1008,13 +1018,13 @@ function Kn(e, n, t, a) {
   } else
     e.rect(o, s, t, a);
 }
-function Tt(e, n) {
+function Pt(e, n) {
   e.arc(0, 0, n, 0, Math.PI * 2);
 }
-function _t(e, n, t) {
+function It(e, n, t) {
   e.ellipse(0, 0, n, t, 0, 0, Math.PI * 2);
 }
-function Et(e, n, t) {
+function Dt(e, n, t) {
   const a = Math.max(3, Math.min(20, n.points || 5)), r = Math.max(0.1, Math.min(0.9, n.innerRadius || 0.4)), o = t * r, s = Math.PI / a, c = -Math.PI / 2;
   for (let i = 0; i < a * 2; i++) {
     const l = c + s * i, d = i % 2 === 0 ? t : o, u = Math.cos(l) * d, p = Math.sin(l) * d;
@@ -1022,13 +1032,13 @@ function Et(e, n, t) {
   }
   e.closePath();
 }
-function At(e, n, t) {
+function Ft(e, n, t) {
   var r;
   if (!((r = n.stroke) != null && r.enabled) || !n.transformData) return;
   const a = (t == null ? void 0 : t.isKnockout) === !0;
-  e.save(), a ? (e.strokeStyle = "#000000", e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", e.globalAlpha = 1) : (e.strokeStyle = n.stroke.color, e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", n.stroke.opacity !== void 0 && (e.globalAlpha = n.stroke.opacity)), n.stroke.miterLimit !== void 0 && (e.miterLimit = n.stroke.miterLimit), n.stroke.dashArray && n.stroke.dashArray.length > 0 && e.setLineDash(n.stroke.dashArray), !a && n.stroke.feather && n.stroke.feather > 0 && "filter" in e && (e.filter = `blur(${n.stroke.feather}px)`), e.beginPath(), Ce(e, n.transformData), e.stroke(), e.restore();
+  e.save(), a ? (e.strokeStyle = "#000000", e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", e.globalAlpha = 1) : (e.strokeStyle = n.stroke.color, e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", n.stroke.opacity !== void 0 && (e.globalAlpha = n.stroke.opacity)), n.stroke.miterLimit !== void 0 && (e.miterLimit = n.stroke.miterLimit), n.stroke.dashArray && n.stroke.dashArray.length > 0 && e.setLineDash(n.stroke.dashArray), !a && n.stroke.feather && n.stroke.feather > 0 && "filter" in e && (e.filter = `blur(${n.stroke.feather}px)`), e.beginPath(), Ee(e, n.transformData), e.stroke(), e.restore();
 }
-function Pt(e, n) {
+function Mt(e, n) {
   if (!n.transformData) return;
   const { borderRadius: t } = n.transformData, a = n.transformData.width ?? 100, r = n.transformData.height ?? 100, o = -a / 2, s = -r / 2;
   if (e.beginPath(), t && t > 0) {
@@ -1037,8 +1047,8 @@ function Pt(e, n) {
   } else
     e.rect(o, s, a, r);
 }
-function An(e, n, t, a, r, o, s = "destination-out") {
-  var v;
+function Dn(e, n, t, a, r, o, s = "destination-out") {
+  var x;
   if (!n.knockoutParts) return;
   if (!(n.knockoutParts.fill || n.knockoutParts.stroke)) {
     a(e, n);
@@ -1046,25 +1056,25 @@ function An(e, n, t, a, r, o, s = "destination-out") {
   }
   const i = e.getTransform();
   e.save();
-  const l = n.knockoutParts.scope || "group", d = It(n, l, t);
+  const l = n.knockoutParts.scope || "group", d = Ot(n, l, t);
   if (d.length === 0 && l === "artboard") {
-    Ft(e, n, a), e.restore();
+    Bt(e, n, a), e.restore();
     return;
   }
   if (d.length === 0) {
     a(e, n), e.restore();
     return;
   }
-  const u = e.canvas, f = e.getTransform().a, m = Mt(u.width, u.height), b = m.getContext("2d");
-  if (!b) return;
-  b.scale(f, f), r && o && (b.fillStyle = r, b.fillRect(o.x, o.y, o.width, o.height));
-  for (const g of d)
-    a(b, g);
-  n.knockoutParts.fill && !n.knockoutParts.stroke && ((v = n.stroke) != null && v.enabled) && (b.save(), In(b, n), b.restore()), b.save(), b.globalCompositeOperation = s, n.knockoutParts.fill && Pn(b, n), n.knockoutParts.stroke && In(b, n), b.restore(), n.knockoutParts.fill || (b.save(), Pn(b, n), b.restore());
-  const h = u.width / f, S = u.height / f;
-  e.drawImage(m, 0, 0, h, S), e.restore();
-  const $ = e.getTransform();
-  (Math.abs($.a - i.a) > 1e-3 || Math.abs($.d - i.d) > 1e-3 || Math.abs($.e - i.e) > 1e-3 || Math.abs($.f - i.f) > 1e-3) && e.setTransform(
+  const u = e.canvas, f = e.getTransform().a, $ = Lt(u.width, u.height), h = $.getContext("2d");
+  if (!h) return;
+  h.scale(f, f), r && o && (h.fillStyle = r, h.fillRect(o.x, o.y, o.width, o.height));
+  for (const m of d)
+    a(h, m);
+  n.knockoutParts.fill && !n.knockoutParts.stroke && ((x = n.stroke) != null && x.enabled) && (h.save(), Mn(h, n), h.restore()), h.save(), h.globalCompositeOperation = s, n.knockoutParts.fill && Fn(h, n), n.knockoutParts.stroke && Mn(h, n), h.restore(), n.knockoutParts.fill || (h.save(), Fn(h, n), h.restore());
+  const b = u.width / f, v = u.height / f;
+  e.drawImage($, 0, 0, b, v), e.restore();
+  const y = e.getTransform();
+  (Math.abs(y.a - i.a) > 1e-3 || Math.abs(y.d - i.d) > 1e-3 || Math.abs(y.e - i.e) > 1e-3 || Math.abs(y.f - i.f) > 1e-3) && e.setTransform(
     i.a,
     i.b,
     i.c,
@@ -1073,59 +1083,59 @@ function An(e, n, t, a, r, o, s = "destination-out") {
     i.f
   );
 }
-function Ea(e, n, t, a, r, o) {
-  An(e, n, t, a, r, o, "destination-out");
+function Da(e, n, t, a, r, o) {
+  Dn(e, n, t, a, r, o, "destination-out");
 }
-function It(e, n, t) {
-  return n === "artboard" ? ke(e, t) : Dt(e, t);
+function Ot(e, n, t) {
+  return n === "artboard" ? Ae(e, t) : Rt(e, t);
 }
-function ke(e, n) {
+function Ae(e, n) {
   const t = n.findIndex((a) => a.id === e.id);
   return t === -1 ? [] : n.slice(0, t);
 }
-function Dt(e, n) {
-  const t = Te(e, n);
+function Rt(e, n) {
+  const t = Pe(e, n);
   if (!t)
-    return ke(e, n);
+    return Ae(e, n);
   if (t.transformType !== "group" || !t.children)
     return [];
   const a = t.children.findIndex((r) => r.id === e.id);
   return a === -1 ? [] : t.children.slice(0, a);
 }
-function Te(e, n) {
+function Pe(e, n) {
   for (const t of n)
     if (t.transformType === "group" && t.children) {
       if (t.children.some((r) => r.id === e.id))
         return t;
-      const a = Te(e, t.children);
+      const a = Pe(e, t.children);
       if (a)
         return a;
     }
   return null;
 }
-function Pn(e, n, t) {
-  zn(e, n, {
+function Fn(e, n, t) {
+  Vn(e, n, {
     mode: "fill",
     renderingContext: { isKnockout: !0 }
   });
 }
-function In(e, n) {
+function Mn(e, n) {
   var t;
-  (t = n.stroke) != null && t.enabled && zn(e, n, {
+  (t = n.stroke) != null && t.enabled && Vn(e, n, {
     mode: "stroke",
     renderingContext: { isKnockout: !0 }
   });
 }
-function Ft(e, n, t) {
+function Bt(e, n, t) {
   var r;
   const a = n.knockoutParts;
   if (!a) {
     t(e, n);
     return;
   }
-  a.fill || (e.save(), Pn(e, n), e.restore()), !a.stroke && ((r = n.stroke) != null && r.enabled) && (e.save(), In(e, n), e.restore());
+  a.fill || (e.save(), Fn(e, n), e.restore()), !a.stroke && ((r = n.stroke) != null && r.enabled) && (e.save(), Mn(e, n), e.restore());
 }
-function Mt(e, n) {
+function Lt(e, n) {
   if (typeof OffscreenCanvas < "u")
     return new OffscreenCanvas(e, n);
   if (typeof document < "u") {
@@ -1134,7 +1144,7 @@ function Mt(e, n) {
   }
   throw new Error("No canvas context available");
 }
-function Jn(e, n, t, a, r = 0) {
+function ee(e, n, t, a, r = 0) {
   if (t <= 0 || a <= 0 || e <= 0 || n <= 0)
     return { width: e + r, height: n + r };
   const o = t / a, s = e / n;
@@ -1144,11 +1154,11 @@ function Jn(e, n, t, a, r = 0) {
     height: i + r
   };
 }
-const tn = 64, Sn = 512;
-function Ot(e, n) {
+const an = 64, Tn = 512;
+function Nt(e, n) {
   e.beginPath(), e.arc(n / 2, n / 2, n * 0.45, 0, Math.PI * 2), e.fill();
 }
-function Rt(e, n) {
+function Ut(e, n) {
   const t = n / 2, a = n / 2, r = n * 0.45, o = r * 0.4, s = 5;
   e.beginPath();
   for (let c = 0; c < s * 2; c++) {
@@ -1157,15 +1167,15 @@ function Rt(e, n) {
   }
   e.closePath(), e.fill();
 }
-function Bt(e, n) {
+function Wt(e, n) {
   const t = n / 2, a = n * 0.42;
   e.beginPath(), e.moveTo(t, n * 0.82), e.bezierCurveTo(t - a * 1.1, n * 0.6, t - a * 1.3, n * 0.2, t, n * 0.35), e.bezierCurveTo(t + a * 1.3, n * 0.2, t + a * 1.1, n * 0.6, t, n * 0.82), e.closePath(), e.fill();
 }
-function Lt(e, n) {
+function zt(e, n) {
   const t = n / 2, a = n / 2, r = n * 0.4, o = n * 0.48;
   e.beginPath(), e.moveTo(t, a - o), e.lineTo(t + r, a), e.lineTo(t, a + o), e.lineTo(t - r, a), e.closePath(), e.fill();
 }
-function Nt(e, n) {
+function Gt(e, n) {
   const t = n / 2, a = n / 2, r = n * 0.44;
   e.beginPath();
   for (let o = 0; o < 6; o++) {
@@ -1174,11 +1184,11 @@ function Nt(e, n) {
   }
   e.closePath(), e.fill();
 }
-function Ut(e, n) {
+function Ht(e, n) {
   const t = n / 2, a = n * 0.4, r = n * 0.12;
   e.beginPath(), e.moveTo(t, r), e.lineTo(t + a, n * 0.25), e.lineTo(t + a, n * 0.55), e.quadraticCurveTo(t + a * 0.3, n * 0.8, t, n * 0.9), e.quadraticCurveTo(t - a * 0.3, n * 0.8, t - a, n * 0.55), e.lineTo(t - a, n * 0.25), e.closePath(), e.fill();
 }
-function zt(e, n) {
+function Vt(e, n) {
   const t = n / 2, a = n / 2;
   let r = 42;
   const o = () => (r = (r * 16807 + 0) % 2147483647, r / 2147483647);
@@ -1188,7 +1198,7 @@ function zt(e, n) {
     e.beginPath(), e.arc(t + Math.cos(c) * i, a + Math.sin(c) * i, l, 0, Math.PI * 2), e.fill();
   }
 }
-function Wt(e, n) {
+function jt(e, n) {
   let t = 123;
   const a = () => (t = (t * 16807 + 0) % 2147483647, t / 2147483647), r = n * 0.08, o = 40;
   e.beginPath(), e.moveTo(r, r);
@@ -1210,7 +1220,7 @@ function Wt(e, n) {
   }
   e.closePath(), e.fill();
 }
-function Gt(e, n) {
+function qt(e, n) {
   let t = 77;
   const a = () => (t = (t * 16807 + 0) % 2147483647, t / 2147483647), r = n * 0.25, o = n * 0.75, s = n * 0.1;
   e.beginPath(), e.moveTo(s, r + a() * n * 0.05);
@@ -1224,101 +1234,101 @@ function Gt(e, n) {
   }
   e.closePath(), e.fill();
 }
-function Ht(e, n) {
+function Xt(e, n) {
   const t = n / 2, a = n * 0.55;
   e.beginPath(), e.arc(t, a, n * 0.2, 0, Math.PI * 2), e.fill(), e.beginPath(), e.arc(t - n * 0.18, a + n * 0.02, n * 0.15, 0, Math.PI * 2), e.fill(), e.beginPath(), e.arc(t + n * 0.18, a + n * 0.02, n * 0.16, 0, Math.PI * 2), e.fill(), e.beginPath(), e.arc(t - n * 0.06, a - n * 0.14, n * 0.14, 0, Math.PI * 2), e.fill(), e.beginPath(), e.arc(t + n * 0.1, a - n * 0.12, n * 0.12, 0, Math.PI * 2), e.fill();
 }
-const Vt = [
+const Yt = [
   // Geometric
-  { id: "circle", name: "Circle", description: "Perfect circle", imageUrl: "builtin-mask:circle", thumbnailUrl: "", category: "geometric", draw: Ot },
-  { id: "star", name: "Star", description: "5-pointed star", imageUrl: "builtin-mask:star", thumbnailUrl: "", category: "geometric", draw: Rt },
-  { id: "heart", name: "Heart", description: "Heart shape", imageUrl: "builtin-mask:heart", thumbnailUrl: "", category: "geometric", draw: Bt },
-  { id: "diamond", name: "Diamond", description: "Diamond/rhombus", imageUrl: "builtin-mask:diamond", thumbnailUrl: "", category: "geometric", draw: Lt },
-  { id: "hexagon", name: "Hexagon", description: "Regular hexagon", imageUrl: "builtin-mask:hexagon", thumbnailUrl: "", category: "geometric", draw: Nt },
-  { id: "shield", name: "Shield", description: "Shield/crest shape", imageUrl: "builtin-mask:shield", thumbnailUrl: "", category: "geometric", draw: Ut },
+  { id: "circle", name: "Circle", description: "Perfect circle", imageUrl: "builtin-mask:circle", thumbnailUrl: "", category: "geometric", draw: Nt },
+  { id: "star", name: "Star", description: "5-pointed star", imageUrl: "builtin-mask:star", thumbnailUrl: "", category: "geometric", draw: Ut },
+  { id: "heart", name: "Heart", description: "Heart shape", imageUrl: "builtin-mask:heart", thumbnailUrl: "", category: "geometric", draw: Wt },
+  { id: "diamond", name: "Diamond", description: "Diamond/rhombus", imageUrl: "builtin-mask:diamond", thumbnailUrl: "", category: "geometric", draw: zt },
+  { id: "hexagon", name: "Hexagon", description: "Regular hexagon", imageUrl: "builtin-mask:hexagon", thumbnailUrl: "", category: "geometric", draw: Gt },
+  { id: "shield", name: "Shield", description: "Shield/crest shape", imageUrl: "builtin-mask:shield", thumbnailUrl: "", category: "geometric", draw: Ht },
   // Organic
-  { id: "splatter", name: "Splatter", description: "Ink splatter", imageUrl: "builtin-mask:splatter", thumbnailUrl: "", category: "organic", draw: zt },
-  { id: "torn-edge", name: "Torn Edge", description: "Rough torn paper edge", imageUrl: "builtin-mask:torn-edge", thumbnailUrl: "", category: "organic", draw: Wt },
-  { id: "paint-stroke", name: "Paint Stroke", description: "Horizontal brush stroke", imageUrl: "builtin-mask:paint-stroke", thumbnailUrl: "", category: "organic", draw: Gt },
-  { id: "cloud", name: "Cloud", description: "Soft cloud shape", imageUrl: "builtin-mask:cloud", thumbnailUrl: "", category: "organic", draw: Ht }
+  { id: "splatter", name: "Splatter", description: "Ink splatter", imageUrl: "builtin-mask:splatter", thumbnailUrl: "", category: "organic", draw: Vt },
+  { id: "torn-edge", name: "Torn Edge", description: "Rough torn paper edge", imageUrl: "builtin-mask:torn-edge", thumbnailUrl: "", category: "organic", draw: jt },
+  { id: "paint-stroke", name: "Paint Stroke", description: "Horizontal brush stroke", imageUrl: "builtin-mask:paint-stroke", thumbnailUrl: "", category: "organic", draw: qt },
+  { id: "cloud", name: "Cloud", description: "Soft cloud shape", imageUrl: "builtin-mask:cloud", thumbnailUrl: "", category: "organic", draw: Xt }
 ];
-let Zn = !1;
-function Qn(e, n) {
+let te = !1;
+function ae(e, n) {
   if (typeof document > "u") return null;
   const t = document.createElement("canvas");
   return t.width = e, t.height = n, t;
 }
-function jt() {
-  if (typeof document > "u" || Zn) return;
-  Zn = !0;
-  const e = $n.getInstance();
-  for (const n of Vt) {
-    const t = Qn(Sn, Sn);
+function Kt() {
+  if (typeof document > "u" || te) return;
+  te = !0;
+  const e = vn.getInstance();
+  for (const n of Yt) {
+    const t = ae(Tn, Tn);
     if (!t) continue;
     const a = t.getContext("2d");
     if (!a) continue;
-    a.fillStyle = "white", n.draw(a, Sn);
+    a.fillStyle = "white", n.draw(a, Tn);
     const r = t.toDataURL("image/png"), o = e.acquire(n.imageUrl);
     o.crossOrigin = "anonymous", o.src = r;
-    const s = Qn(tn, tn);
+    const s = ae(an, an);
     if (s) {
       const c = s.getContext("2d");
-      c && (c.fillStyle = "#1a1a2e", c.fillRect(0, 0, tn, tn), c.fillStyle = "white", n.draw(c, tn), n.thumbnailUrl = s.toDataURL("image/png"));
+      c && (c.fillStyle = "#1a1a2e", c.fillRect(0, 0, an, an), c.fillStyle = "white", n.draw(c, an), n.thumbnailUrl = s.toDataURL("image/png"));
     }
   }
 }
-const qt = N("MaskRenderer"), Dn = /* @__PURE__ */ new Map(), Xt = /* @__PURE__ */ new Map();
-function Aa(e) {
+const Jt = U("MaskRenderer"), On = /* @__PURE__ */ new Map(), Zt = /* @__PURE__ */ new Map();
+function Fa(e) {
   const n = [];
-  Dn.forEach((t, a) => {
+  On.forEach((t, a) => {
     a.startsWith(e) && n.push(a);
-  }), n.forEach((t) => Dn.delete(t));
+  }), n.forEach((t) => On.delete(t));
 }
-function Pa() {
-  Dn.clear();
+function Ma() {
+  On.clear();
 }
-function ne(e, n, t) {
+function re(e, n, t) {
   if (!n.masks || n.masks.length === 0) {
     t(e);
     return;
   }
-  const a = e.canvas, r = pn(a.width, a.height), o = r.getContext("2d");
+  const a = e.canvas, r = bn(a.width, a.height), o = r.getContext("2d");
   if (!o) {
-    qt.error("[renderWithMasks] Failed to get offscreen context");
+    Jt.error("[renderWithMasks] Failed to get offscreen context");
     return;
   }
   const s = e.getTransform();
   o.setTransform(s), t(o);
   for (const c of n.masks)
-    Yt(o, c, n);
+    Qt(o, c, n);
   e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.drawImage(r, 0, 0), e.restore();
 }
-function Yt(e, n, t) {
+function Qt(e, n, t) {
   switch (n.type) {
     case "clip":
-      Kt(e, n, t);
+      na(e, n, t);
       break;
     case "alpha":
-      Jt(e, n, t);
+      ea(e, n, t);
       break;
     case "luma":
-      Zt(e, n, t);
+      ta(e, n, t);
       break;
     case "distress":
-      Qt(e, n, t);
+      aa(e, n, t);
       break;
   }
 }
-function Kt(e, n, t) {
-  e.save(), e.globalCompositeOperation = n.inverted ? "destination-out" : "destination-in", n.opacity !== void 0 && (e.globalAlpha = n.opacity), xn(e, n.maskElement, t), e.restore();
+function na(e, n, t) {
+  e.save(), e.globalCompositeOperation = n.inverted ? "destination-out" : "destination-in", n.opacity !== void 0 && (e.globalAlpha = n.opacity), wn(e, n.maskElement, t), e.restore();
 }
-function Jt(e, n, t) {
-  e.save(), e.globalCompositeOperation = n.inverted ? "destination-out" : "destination-in", n.opacity !== void 0 && (e.globalAlpha = n.opacity), xn(e, n.maskElement, t), n.feather && n.feather > 0 && _e(e, n.feather), e.restore();
+function ea(e, n, t) {
+  e.save(), e.globalCompositeOperation = n.inverted ? "destination-out" : "destination-in", n.opacity !== void 0 && (e.globalAlpha = n.opacity), wn(e, n.maskElement, t), n.feather && n.feather > 0 && Ie(e, n.feather), e.restore();
 }
-function Zt(e, n, t) {
-  const a = pn(e.canvas.width, e.canvas.height), r = a.getContext("2d");
+function ta(e, n, t) {
+  const a = bn(e.canvas.width, e.canvas.height), r = a.getContext("2d");
   if (!r) return;
-  xn(r, n.maskElement, t);
+  wn(r, n.maskElement, t);
   const o = r.getImageData(0, 0, a.width, a.height), s = o.data;
   for (let c = 0; c < s.length; c += 4) {
     const i = s[c], l = s[c + 1], d = s[c + 2], u = 0.299 * i + 0.587 * l + 0.114 * d;
@@ -1326,10 +1336,10 @@ function Zt(e, n, t) {
   }
   r.putImageData(o, 0, 0), e.save(), e.globalCompositeOperation = "destination-in", n.opacity !== void 0 && (e.globalAlpha = n.opacity), e.drawImage(a, 0, 0), e.restore();
 }
-function Qt(e, n, t) {
-  e.save(), e.globalCompositeOperation = n.inverted ? "destination-in" : "destination-out", n.opacity !== void 0 && (e.globalAlpha = n.opacity), xn(e, n.maskElement, t), n.feather && n.feather > 0 && _e(e, n.feather), e.restore();
+function aa(e, n, t) {
+  e.save(), e.globalCompositeOperation = n.inverted ? "destination-in" : "destination-out", n.opacity !== void 0 && (e.globalAlpha = n.opacity), wn(e, n.maskElement, t), n.feather && n.feather > 0 && Ie(e, n.feather), e.restore();
 }
-function xn(e, n, t) {
+function wn(e, n, t) {
   const a = t.x || 0, r = t.y || 0, o = n.x || 0, s = n.y || 0, c = {
     ...n,
     x: a + o,
@@ -1342,49 +1352,49 @@ function xn(e, n, t) {
     width: u + i,
     height: p + i
   });
-  let m, b;
+  let $, h;
   if (n.transformType === "image") {
-    const g = n;
-    if (g.imageUrl)
+    const m = n;
+    if (m.imageUrl)
       if (typeof document < "u") {
-        g.imageUrl.startsWith("builtin-mask:") && jt();
-        const y = $n.getInstance(), k = y.acquire(g.imageUrl);
-        k.complete && k.naturalWidth > 0 && (m = k), y.release(g.imageUrl);
+        m.imageUrl.startsWith("builtin-mask:") && Kt();
+        const g = vn.getInstance(), C = g.acquire(m.imageUrl);
+        C.complete && C.naturalWidth > 0 && ($ = C), g.release(m.imageUrl);
       } else
-        b = Xt.get(g.imageUrl);
+        h = Zt.get(m.imageUrl);
   }
-  const h = c.transformData, S = (f == null ? void 0 : f.width) || 0, $ = (f == null ? void 0 : f.height) || 0, v = S > 0 && $ > 0 && u > 0 && p > 0 && Math.abs(S / $ - u / p) > 1e-3;
-  if (b) {
+  const b = c.transformData, v = (f == null ? void 0 : f.width) || 0, y = (f == null ? void 0 : f.height) || 0, x = v > 0 && y > 0 && u > 0 && p > 0 && Math.abs(v / y - u / p) > 1e-3;
+  if (h) {
     e.save();
-    const g = (h == null ? void 0 : h.width) || b.width, y = (h == null ? void 0 : h.height) || b.height;
-    if (e.translate(c.x || 0, c.y || 0), e.rotate(-(c.rotation || 0) * Math.PI / 180), v) {
-      const k = Jn(
+    const m = (b == null ? void 0 : b.width) || h.width, g = (b == null ? void 0 : b.height) || h.height;
+    if (e.translate(c.x || 0, c.y || 0), e.rotate(-(c.rotation || 0) * Math.PI / 180), x) {
+      const C = ee(
+        m,
         g,
+        v,
         y,
-        S,
-        $,
         0
       );
-      e.drawImage(b, -k.width / 2, -k.height / 2, k.width, k.height);
+      e.drawImage(h, -C.width / 2, -C.height / 2, C.width, C.height);
     } else
-      e.drawImage(b, -g / 2, -y / 2, g, y);
+      e.drawImage(h, -m / 2, -g / 2, m, g);
     e.restore();
-  } else if (v && m) {
-    const g = (h == null ? void 0 : h.width) || u, y = (h == null ? void 0 : h.height) || p, k = Jn(
+  } else if (x && $) {
+    const m = (b == null ? void 0 : b.width) || u, g = (b == null ? void 0 : b.height) || p, C = ee(
+      m,
       g,
+      v,
       y,
-      S,
-      $,
       0
     );
-    e.save(), e.translate(c.x || 0, c.y || 0), e.rotate(-(c.rotation || 0) * Math.PI / 180), e.drawImage(m, -k.width / 2, -k.height / 2, k.width, k.height), e.restore();
+    e.save(), e.translate(c.x || 0, c.y || 0), e.rotate(-(c.rotation || 0) * Math.PI / 180), e.drawImage($, -C.width / 2, -C.height / 2, C.width, C.height), e.restore();
   } else
-    zn(e, c, { mode: "both", loadedImage: m });
+    Vn(e, c, { mode: "both", loadedImage: $ });
 }
-function _e(e, n) {
+function Ie(e, n) {
   "filter" in e && (e.filter = `blur(${n}px)`);
 }
-function pn(e, n) {
+function bn(e, n) {
   if (typeof OffscreenCanvas < "u")
     return new OffscreenCanvas(e, n);
   if (typeof document < "u") {
@@ -1393,51 +1403,51 @@ function pn(e, n) {
   }
   throw new Error("No canvas context available");
 }
-function na(e, n, t, a) {
+function ra(e, n, t, a) {
   if (!n.enabled || !n.imageUrl || n.opacity <= 0) return;
-  const r = $n.getInstance(), o = r.acquire(n.imageUrl);
+  const r = vn.getInstance(), o = r.acquire(n.imageUrl);
   if (!o.complete || o.naturalWidth === 0) {
     r.release(n.imageUrl);
     return;
   }
-  const { x: s, y: c, width: i, height: l } = t, d = e.getTransform(), u = d.a * s + d.e, p = d.d * c + d.f, f = d.a * i, m = d.d * l, b = Math.ceil(f), h = Math.ceil(m);
-  if (b <= 0 || h <= 0) {
+  const { x: s, y: c, width: i, height: l } = t, d = e.getTransform(), u = d.a * s + d.e, p = d.d * c + d.f, f = d.a * i, $ = d.d * l, h = Math.ceil(f), b = Math.ceil($);
+  if (h <= 0 || b <= 0) {
     r.release(n.imageUrl);
     return;
   }
-  const S = pn(b, h), $ = S.getContext("2d");
-  if (!$) {
+  const v = bn(h, b), y = v.getContext("2d");
+  if (!y) {
     r.release(n.imageUrl);
     return;
   }
-  $.drawImage(
+  y.drawImage(
     e.canvas,
     u,
     p,
     f,
-    m,
+    $,
     0,
     0,
-    b,
-    h
+    h,
+    b
   );
-  let v;
-  if (n.maskType === "luma" ? v = "destination-in" : v = n.inverted ? "destination-out" : "destination-in", n.maskType === "luma") {
-    const g = pn(b, h), y = g.getContext("2d");
-    if (y) {
-      y.drawImage(o, 0, 0, b, h);
-      const k = y.getImageData(0, 0, b, h), T = k.data;
-      for (let C = 0; C < T.length; C += 4) {
-        const _ = 0.299 * T[C] + 0.587 * T[C + 1] + 0.114 * T[C + 2];
-        T[C + 3] = n.inverted ? 255 - _ : _;
+  let x;
+  if (n.maskType === "luma" ? x = "destination-in" : x = n.inverted ? "destination-out" : "destination-in", n.maskType === "luma") {
+    const m = bn(h, b), g = m.getContext("2d");
+    if (g) {
+      g.drawImage(o, 0, 0, h, b);
+      const C = g.getImageData(0, 0, h, b), T = C.data;
+      for (let k = 0; k < T.length; k += 4) {
+        const _ = 0.299 * T[k] + 0.587 * T[k + 1] + 0.114 * T[k + 2];
+        T[k + 3] = n.inverted ? 255 - _ : _;
       }
-      y.putImageData(k, 0, 0), $.globalCompositeOperation = "destination-in", $.globalAlpha = n.opacity / 100, $.drawImage(g, 0, 0);
+      g.putImageData(C, 0, 0), y.globalCompositeOperation = "destination-in", y.globalAlpha = n.opacity / 100, y.drawImage(m, 0, 0);
     }
   } else
-    $.globalCompositeOperation = v, $.globalAlpha = n.opacity / 100, $.drawImage(o, 0, 0, b, h);
-  $.globalCompositeOperation = "source-over", $.globalAlpha = 1, e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.clearRect(u, p, f, m), a && (e.fillStyle = a, e.fillRect(u, p, f, m)), e.drawImage(S, u, p), e.restore(), r.release(n.imageUrl);
+    y.globalCompositeOperation = x, y.globalAlpha = n.opacity / 100, y.drawImage(o, 0, 0, h, b);
+  y.globalCompositeOperation = "source-over", y.globalAlpha = 1, e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.clearRect(u, p, f, $), a && (e.fillStyle = a, e.fillRect(u, p, f, $)), e.drawImage(v, u, p), e.restore(), r.release(n.imageUrl);
 }
-class ea {
+class sa {
   constructor(n = Math.random()) {
     this.perm = [];
     for (let a = 0; a < 256; a++)
@@ -1475,55 +1485,55 @@ class ea {
     );
   }
 }
-function Cn(e, n, t, a = Date.now()) {
-  const s = vn(e, n).getContext("2d").createImageData(e, n), c = s.data, i = new ea(a), l = 0.02, d = 1 - t / 100;
+function _n(e, n, t, a = Date.now()) {
+  const s = Sn(e, n).getContext("2d").createImageData(e, n), c = s.data, i = new sa(a), l = 0.02, d = 1 - t / 100;
   for (let u = 0; u < n; u++)
     for (let p = 0; p < e; p++) {
       const f = (u * e + p) * 4;
-      let m = 0;
-      m += i.noise(p * l, u * l) * 0.5, m += i.noise(p * l * 2, u * l * 2) * 0.25, m += i.noise(p * l * 4, u * l * 4) * 0.125, m = (m + 1) / 2;
-      const b = Math.min(p / e, (e - p) / e) * 2, h = Math.min(u / n, (n - u) / n) * 2, S = Math.min(b, h);
-      m *= 0.7 + S * 0.3;
-      const $ = m > d ? 255 : 0;
-      c[f] = 255, c[f + 1] = 255, c[f + 2] = 255, c[f + 3] = $;
+      let $ = 0;
+      $ += i.noise(p * l, u * l) * 0.5, $ += i.noise(p * l * 2, u * l * 2) * 0.25, $ += i.noise(p * l * 4, u * l * 4) * 0.125, $ = ($ + 1) / 2;
+      const h = Math.min(p / e, (e - p) / e) * 2, b = Math.min(u / n, (n - u) / n) * 2, v = Math.min(h, b);
+      $ *= 0.7 + v * 0.3;
+      const y = $ > d ? 255 : 0;
+      c[f] = 255, c[f + 1] = 255, c[f + 2] = 255, c[f + 3] = y;
     }
   return s;
 }
-function ta(e, n, t, a = Date.now()) {
-  const o = vn(e, n).getContext("2d");
+function ia(e, n, t, a = Date.now()) {
+  const o = Sn(e, n).getContext("2d");
   o.clearRect(0, 0, e, n), o.strokeStyle = "#000000", o.lineWidth = 1 + t / 50, o.lineCap = "round";
-  const s = Wn(a), c = Math.floor(t / 100 * 30 + 5);
+  const s = jn(a), c = Math.floor(t / 100 * 30 + 5);
   for (let i = 0; i < c; i++) {
     const l = s() * e, d = s() * n;
-    Fn(o, l, d, s() * Math.PI * 2, 50 + s() * 100, s, 0);
+    Rn(o, l, d, s() * Math.PI * 2, 50 + s() * 100, s, 0);
   }
   return o.getImageData(0, 0, e, n);
 }
-function Fn(e, n, t, a, r, o, s) {
+function Rn(e, n, t, a, r, o, s) {
   if (s > 3 || r < 10) return;
   const c = n + Math.cos(a) * r, i = t + Math.sin(a) * r;
   if (e.beginPath(), e.moveTo(n, t), e.lineTo(c, i), e.stroke(), o() > 0.5) {
     const l = a + (o() - 0.5) * Math.PI / 2;
-    Fn(e, c, i, l, r * 0.6, o, s + 1);
+    Rn(e, c, i, l, r * 0.6, o, s + 1);
   }
   if (o() > 0.7) {
     const l = a - (o() - 0.5) * Math.PI / 2;
-    Fn(e, c, i, l, r * 0.6, o, s + 1);
+    Rn(e, c, i, l, r * 0.6, o, s + 1);
   }
 }
-function un(e, n, t, a = Date.now()) {
-  const s = vn(e, n).getContext("2d").createImageData(e, n), c = s.data, i = Wn(a), l = t / 100 * 0.5;
+function hn(e, n, t, a = Date.now()) {
+  const s = Sn(e, n).getContext("2d").createImageData(e, n), c = s.data, i = jn(a), l = t / 100 * 0.5;
   for (let d = 0; d < n; d++)
     for (let u = 0; u < e; u++) {
-      const p = (d * e + u) * 4, m = i() < l ? 255 : 0;
-      c[p] = 0, c[p + 1] = 0, c[p + 2] = 0, c[p + 3] = m;
+      const p = (d * e + u) * 4, $ = i() < l ? 255 : 0;
+      c[p] = 0, c[p + 1] = 0, c[p + 2] = 0, c[p + 3] = $;
     }
   return s;
 }
-function aa(e, n, t, a = Date.now()) {
-  const o = vn(e, n).getContext("2d");
+function oa(e, n, t, a = Date.now()) {
+  const o = Sn(e, n).getContext("2d");
   o.fillStyle = "#000000";
-  const s = Wn(a), c = 4 + t / 100 * 6, i = c * 2;
+  const s = jn(a), c = 4 + t / 100 * 6, i = c * 2;
   for (let l = 0; l < n; l += i)
     for (let d = 0; d < e; d += i)
       if (s() < t / 100) {
@@ -1532,7 +1542,7 @@ function aa(e, n, t, a = Date.now()) {
       }
   return o.getImageData(0, 0, e, n);
 }
-function vn(e, n) {
+function Sn(e, n) {
   if (typeof OffscreenCanvas < "u")
     return new OffscreenCanvas(e, n);
   if (typeof document < "u") {
@@ -1541,31 +1551,31 @@ function vn(e, n) {
   }
   throw new Error("No canvas context available");
 }
-function Wn(e) {
+function jn(e) {
   let n = Math.sin(e++) * 1e4;
   return () => (n = Math.sin(e++) * 1e4, n - Math.floor(n));
 }
-const L = 42, X = 512, Y = 64;
-function Mn(e) {
+const N = 42, Y = 512, K = 64;
+function Bn(e) {
   const n = e.data;
   for (let t = 0; t < n.length; t += 4)
     n[t] = 255, n[t + 1] = 255, n[t + 2] = 255;
   return e;
 }
-function ra(e, n) {
+function ca(e, n) {
   const t = e.data, a = n.data;
   for (let r = 0; r < t.length; r += 4)
     t[r] = 255, t[r + 1] = 255, t[r + 2] = 255, t[r + 3] = Math.min(255, t[r + 3] + a[r + 3]);
   return e;
 }
-const sa = [
+const la = [
   {
     id: "grunge-heavy",
     name: "Heavy Grunge",
     textureUrl: "builtin:grunge-heavy",
     thumbnailUrl: "",
     description: "Dense random splatters",
-    generate: (e, n) => un(e, n, 80, L)
+    generate: (e, n) => hn(e, n, 80, N)
   },
   {
     id: "grunge-fine",
@@ -1573,7 +1583,7 @@ const sa = [
     textureUrl: "builtin:grunge-fine",
     thumbnailUrl: "",
     description: "Sparse fine grain",
-    generate: (e, n) => un(e, n, 25, L + 1)
+    generate: (e, n) => hn(e, n, 25, N + 1)
   },
   {
     id: "concrete",
@@ -1581,7 +1591,7 @@ const sa = [
     textureUrl: "builtin:concrete",
     thumbnailUrl: "",
     description: "Rough surface via Perlin noise",
-    generate: (e, n) => Cn(e, n, 55, L + 2)
+    generate: (e, n) => _n(e, n, 55, N + 2)
   },
   {
     id: "paper",
@@ -1589,7 +1599,7 @@ const sa = [
     textureUrl: "builtin:paper",
     thumbnailUrl: "",
     description: "Subtle aging",
-    generate: (e, n) => Cn(e, n, 20, L + 3)
+    generate: (e, n) => _n(e, n, 20, N + 3)
   },
   {
     id: "rust",
@@ -1598,8 +1608,8 @@ const sa = [
     thumbnailUrl: "",
     description: "Noise + splatter combined",
     generate: (e, n) => {
-      const t = Cn(e, n, 45, L + 4), a = un(e, n, 35, L + 5);
-      return ra(Mn(t), Mn(a));
+      const t = _n(e, n, 45, N + 4), a = hn(e, n, 35, N + 5);
+      return ca(Bn(t), Bn(a));
     }
   },
   {
@@ -1608,7 +1618,7 @@ const sa = [
     textureUrl: "builtin:scratches",
     thumbnailUrl: "",
     description: "Branching crack lines",
-    generate: (e, n) => ta(e, n, 55, L + 6)
+    generate: (e, n) => ia(e, n, 55, N + 6)
   },
   {
     id: "halftone",
@@ -1616,7 +1626,7 @@ const sa = [
     textureUrl: "builtin:halftone",
     thumbnailUrl: "",
     description: "Dot grid pattern",
-    generate: (e, n) => aa(e, n, 55, L + 7)
+    generate: (e, n) => oa(e, n, 55, N + 7)
   },
   {
     id: "spray",
@@ -1624,132 +1634,132 @@ const sa = [
     textureUrl: "builtin:spray",
     thumbnailUrl: "",
     description: "Medium random splatter",
-    generate: (e, n) => un(e, n, 55, L + 8)
+    generate: (e, n) => hn(e, n, 55, N + 8)
   }
 ];
-let ee = !1;
-function ia(e, n) {
+let se = !1;
+function da(e, n) {
   if (typeof OffscreenCanvas < "u")
     return new OffscreenCanvas(e, n);
   const t = document.createElement("canvas");
   return t.width = e, t.height = n, t;
 }
-function te(e, n) {
+function ie(e, n) {
   if (typeof document > "u") return null;
   const t = document.createElement("canvas");
   return t.width = e, t.height = n, t;
 }
-function oa(e) {
-  const n = te(e.width, e.height);
+function fa(e) {
+  const n = ie(e.width, e.height);
   if (!n) return "";
   const t = n.getContext("2d");
   if (!t) return "";
   t.putImageData(e, 0, 0);
-  const a = te(Y, Y);
+  const a = ie(K, K);
   if (!a) return "";
   const r = a.getContext("2d");
   if (!r) return "";
-  r.drawImage(n, 0, 0, e.width, e.height, 0, 0, Y, Y);
-  const o = r.getImageData(0, 0, Y, Y), s = o.data;
+  r.drawImage(n, 0, 0, e.width, e.height, 0, 0, K, K);
+  const o = r.getImageData(0, 0, K, K), s = o.data;
   for (let c = 0; c < s.length; c += 4) {
     const i = s[c + 3], l = 255 - Math.round(i / 255 * 195);
     s[c] = l, s[c + 1] = l, s[c + 2] = l, s[c + 3] = 255;
   }
   return r.putImageData(o, 0, 0), a.toDataURL("image/png");
 }
-function ca() {
-  if (!ee) {
-    ee = !0;
-    for (const e of sa) {
-      const n = e.generate(X, X);
-      Mn(n);
-      const t = ia(X, X), a = t.getContext("2d");
-      a && (a.putImageData(n, 0, 0), la(e.textureUrl, t, X, X)), typeof document < "u" && (e.thumbnailUrl = oa(n));
+function ua() {
+  if (!se) {
+    se = !0;
+    for (const e of la) {
+      const n = e.generate(Y, Y);
+      Bn(n);
+      const t = da(Y, Y), a = t.getContext("2d");
+      a && (a.putImageData(n, 0, 0), pa(e.textureUrl, t, Y, Y)), typeof document < "u" && (e.thumbnailUrl = fa(n));
     }
   }
 }
-const W = /* @__PURE__ */ new Set(), G = /* @__PURE__ */ new Map(), hn = /* @__PURE__ */ new Map();
-function ae(e, n) {
+const z = /* @__PURE__ */ new Set(), G = /* @__PURE__ */ new Map(), gn = /* @__PURE__ */ new Map();
+function oe(e, n) {
   if (typeof OffscreenCanvas < "u")
     return new OffscreenCanvas(e, n);
   const t = document.createElement("canvas");
   return t.width = e, t.height = n, t;
 }
-function re(e) {
+function ce(e) {
   return e.getContext("2d");
 }
-function se(e) {
-  const { width: n, height: t } = e, a = ae(n, t), r = re(a);
+function le(e) {
+  const { width: n, height: t } = e, a = oe(n, t), r = ce(a);
   if (!r) throw new Error("Failed to get 2d context for temp canvas");
   r.drawImage(e, 0, 0);
   const o = r.getImageData(0, 0, n, t), s = o.data;
   for (let l = 0; l < s.length; l += 4) {
-    const d = s[l], u = s[l + 1], p = s[l + 2], m = 255 - (0.299 * d + 0.587 * u + 0.114 * p);
-    s[l] = 255, s[l + 1] = 255, s[l + 2] = 255, s[l + 3] = m;
+    const d = s[l], u = s[l + 1], p = s[l + 2], $ = 255 - (0.299 * d + 0.587 * u + 0.114 * p);
+    s[l] = 255, s[l + 1] = 255, s[l + 2] = 255, s[l + 3] = $;
   }
-  const c = ae(n, t), i = re(c);
+  const c = oe(n, t), i = ce(c);
   if (!i) throw new Error("Failed to get 2d context for mask canvas");
   return i.putImageData(o, 0, 0), { alphaMask: c, width: n, height: t };
 }
-function Ee(e) {
+function De(e) {
   const n = G.get(e);
   if (n) return n;
   if (e.startsWith("builtin:")) {
-    ca();
+    ua();
     const t = G.get(e);
     return t || null;
   }
-  return W.has(e) || (W.add(e), Ae(e)), null;
+  return z.has(e) || (z.add(e), Fe(e)), null;
 }
-function Ia(e) {
+function Oa(e) {
   return G.has(e) ? Promise.resolve() : new Promise((n) => {
     if (G.has(e)) {
       n();
       return;
     }
-    const t = hn.get(e) || [];
-    t.push(n), hn.set(e, t), W.has(e) || (W.add(e), Ae(e));
+    const t = gn.get(e) || [];
+    t.push(n), gn.set(e, t), z.has(e) || (z.add(e), Fe(e));
   });
 }
-function la(e, n, t, a) {
-  G.has(e) || (G.set(e, { alphaMask: n, width: t, height: a }), an(e));
+function pa(e, n, t, a) {
+  G.has(e) || (G.set(e, { alphaMask: n, width: t, height: a }), rn(e));
 }
-function an(e) {
-  const n = hn.get(e);
-  n && (n.forEach((t) => t()), hn.delete(e));
+function rn(e) {
+  const n = gn.get(e);
+  n && (n.forEach((t) => t()), gn.delete(e));
 }
-function Ae(e) {
+function Fe(e) {
   if (typeof document < "u") {
     const n = new Image();
     n.crossOrigin = "anonymous", n.onload = () => {
-      const t = se(n);
-      G.set(e, t), W.delete(e), an(e);
+      const t = le(n);
+      G.set(e, t), z.delete(e), rn(e);
     }, n.onerror = () => {
-      W.delete(e), an(e);
+      z.delete(e), rn(e);
     }, n.src = e;
   } else
     fetch(e).then((n) => n.blob()).then((n) => createImageBitmap(n)).then((n) => {
-      const t = se(n);
-      G.set(e, t), W.delete(e), an(e);
+      const t = le(n);
+      G.set(e, t), z.delete(e), rn(e);
     }).catch(() => {
-      W.delete(e), an(e);
+      z.delete(e), rn(e);
     });
 }
-function Pe(e, n) {
+function Me(e, n) {
   if (typeof OffscreenCanvas < "u")
     return new OffscreenCanvas(e, n);
   const t = document.createElement("canvas");
   return t.width = e, t.height = n, t;
 }
-function da(e, n, t, a) {
+function ha(e, n, t, a) {
   if (!n.enabled || !n.textureUrl || n.intensity <= 0) return;
-  const r = Ee(n.textureUrl);
+  const r = De(n.textureUrl);
   if (!r) return;
-  const { x: o, y: s, width: c, height: i } = t, l = e.getTransform(), d = l.a * o + l.e, u = l.d * s + l.f, p = l.a * c, f = l.d * i, m = Math.ceil(p), b = Math.ceil(f);
-  if (m <= 0 || b <= 0) return;
-  const h = Pe(m, b), S = h.getContext("2d");
-  if (!S) return;
-  S.drawImage(
+  const { x: o, y: s, width: c, height: i } = t, l = e.getTransform(), d = l.a * o + l.e, u = l.d * s + l.f, p = l.a * c, f = l.d * i, $ = Math.ceil(p), h = Math.ceil(f);
+  if ($ <= 0 || h <= 0) return;
+  const b = Me($, h), v = b.getContext("2d");
+  if (!v) return;
+  v.drawImage(
     e.canvas,
     d,
     u,
@@ -1757,27 +1767,27 @@ function da(e, n, t, a) {
     f,
     0,
     0,
-    m,
-    b
+    $,
+    h
   );
-  const $ = r.alphaMask.getContext("2d");
-  if ($) {
-    const v = n.intensity / 100, g = $.getImageData(0, 0, r.width, r.height).data, y = r.width, k = r.height, T = S.getImageData(0, 0, m, b), C = T.data;
-    for (let _ = 0; _ < b; _++) {
-      const w = Math.floor(_ / b * k);
-      for (let E = 0; E < m; E++) {
-        const x = Math.floor(E / m * y), P = g[(w * y + x) * 4 + 3] / 255, A = (_ * m + E) * 4;
-        C[A + 3] = Math.round(C[A + 3] * (1 - P * v));
+  const y = r.alphaMask.getContext("2d");
+  if (y) {
+    const x = n.intensity / 100, m = y.getImageData(0, 0, r.width, r.height).data, g = r.width, C = r.height, T = v.getImageData(0, 0, $, h), k = T.data;
+    for (let _ = 0; _ < h; _++) {
+      const w = Math.floor(_ / h * C);
+      for (let A = 0; A < $; A++) {
+        const E = Math.floor(A / $ * g), S = m[(w * g + E) * 4 + 3] / 255, P = (_ * $ + A) * 4;
+        k[P + 3] = Math.round(k[P + 3] * (1 - S * x));
       }
     }
-    S.putImageData(T, 0, 0);
+    v.putImageData(T, 0, 0);
   } else
-    S.globalCompositeOperation = "destination-out", S.globalAlpha = n.intensity / 100, S.drawImage(r.alphaMask, 0, 0, m, b), S.globalCompositeOperation = "source-over";
-  S.globalAlpha = 1, e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.clearRect(d, u, p, f), a && (e.fillStyle = a, e.fillRect(d, u, p, f)), e.drawImage(h, d, u), e.restore();
+    v.globalCompositeOperation = "destination-out", v.globalAlpha = n.intensity / 100, v.drawImage(r.alphaMask, 0, 0, $, h), v.globalCompositeOperation = "source-over";
+  v.globalAlpha = 1, e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.clearRect(d, u, p, f), a && (e.fillStyle = a, e.fillRect(d, u, p, f)), e.drawImage(b, d, u), e.restore();
 }
-function ie(e, n, t, a) {
+function de(e, n, t, a) {
   if (!n.enabled || n.style !== "custom" || !n.textureUrl) return;
-  const r = Ee(n.textureUrl);
+  const r = De(n.textureUrl);
   if (!r) {
     a(e);
     return;
@@ -1787,40 +1797,40 @@ function ie(e, n, t, a) {
     y: t.y - p,
     width: t.width + u * 2,
     height: t.height + p * 2
-  }, m = s.a * f.x + s.e, b = s.d * f.y + s.f, h = s.a * f.width, S = s.d * f.height, $ = Math.ceil(h), v = Math.ceil(S);
-  if ($ <= 0 || v <= 0) {
+  }, $ = s.a * f.x + s.e, h = s.d * f.y + s.f, b = s.a * f.width, v = s.d * f.height, y = Math.ceil(b), x = Math.ceil(v);
+  if (y <= 0 || x <= 0) {
     a(e);
     return;
   }
-  const g = Pe($, v), y = g.getContext("2d");
-  if (!y) {
+  const m = Me(y, x), g = m.getContext("2d");
+  if (!g) {
     a(e);
     return;
   }
-  y.setTransform(
+  g.setTransform(
     s.a,
     s.b,
     s.c,
     s.d,
-    s.e - m,
-    s.f - b
-  ), a(y), y.setTransform(1, 0, 0, 1, 0, 0);
-  const k = r.alphaMask.getContext("2d");
-  if (k) {
-    const T = k.getImageData(0, 0, r.width, r.height).data, C = r.width, _ = r.height, w = y.getImageData(0, 0, $, v), E = w.data;
-    for (let x = 0; x < v; x++) {
-      const P = Math.floor(x / v * _);
-      for (let A = 0; A < $; A++) {
-        const F = Math.floor(A / $ * C), D = T[(P * C + F) * 4 + 3] / 255, I = (x * $ + A) * 4;
-        E[I + 3] = Math.round(E[I + 3] * (1 - D * o));
+    s.e - $,
+    s.f - h
+  ), a(g), g.setTransform(1, 0, 0, 1, 0, 0);
+  const C = r.alphaMask.getContext("2d");
+  if (C) {
+    const T = C.getImageData(0, 0, r.width, r.height).data, k = r.width, _ = r.height, w = g.getImageData(0, 0, y, x), A = w.data;
+    for (let E = 0; E < x; E++) {
+      const S = Math.floor(E / x * _);
+      for (let P = 0; P < y; P++) {
+        const I = Math.floor(P / y * k), D = T[(S * k + I) * 4 + 3] / 255, F = (E * y + P) * 4;
+        A[F + 3] = Math.round(A[F + 3] * (1 - D * o));
       }
     }
-    y.putImageData(w, 0, 0);
+    g.putImageData(w, 0, 0);
   } else
-    y.globalCompositeOperation = "destination-out", y.globalAlpha = o, y.drawImage(r.alphaMask, 0, 0, $, v), y.globalCompositeOperation = "source-over", y.globalAlpha = 1;
-  e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.drawImage(g, m, b), e.restore();
+    g.globalCompositeOperation = "destination-out", g.globalAlpha = o, g.drawImage(r.alphaMask, 0, 0, y, x), g.globalCompositeOperation = "source-over", g.globalAlpha = 1;
+  e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.drawImage(m, $, h), e.restore();
 }
-class bn {
+class mn {
   /**
    * Create an element instance from a JSON configuration
    * TypeScript ensures all transform types are handled
@@ -1833,40 +1843,36 @@ class bn {
     const { transformType: t } = n;
     switch (t) {
       case "custom":
-        return new Ke(n);
+        return new nt(n);
       case "distort":
         throw new Error("DistortTransform is not yet implemented");
       case "circle":
-        return new Ye(n);
+        return new Qe(n);
       case "lean":
-        return new Xe(n);
+        return new Ze(n);
       case "arch":
-        return new qe(n);
+        return new Je(n);
       case "ascend":
-        return new je(n);
+        return new Ke(n);
       case "wave":
-        return new Ve(n);
+        return new Ye(n);
       case "flag":
-        return new He(n);
+        return new Xe(n);
       case "image":
-        return new kn(n);
-      case "group":
-        const a = (n.children || []).map(
-          (s) => bn.createFromJSON(s)
-        ), r = new pe({
-          id: n.id,
-          x: n.x,
-          y: n.y,
-          rotation: n.rotation
-        });
-        return a.forEach((s) => r.addChild(s)), r;
+        return new En(n);
+      case "group": {
+        const r = (n.children || []).map(
+          (i) => mn.createFromJSON(i)
+        ), { children: o, ...s } = n, c = new me(s);
+        return r.forEach((i) => c.addChild(i)), c;
+      }
       case "shape":
-        return new Ge(n);
+        return new qe(n);
       case "path":
-        return new We(n);
+        return new je(n);
       default:
-        const o = t;
-        throw new Error(`Unknown transform type: ${o}`);
+        const a = t;
+        throw new Error(`Unknown transform type: ${a}`);
     }
   }
   /**
@@ -2077,7 +2083,7 @@ class bn {
     return this.createFromJSON(t);
   }
 }
-const oe = N("ImportManager"), Gn = class Gn {
+const fe = U("ImportManager"), qn = class qn {
   /**
    * Import workspace from JSON file
    */
@@ -2092,7 +2098,7 @@ const oe = N("ImportManager"), Gn = class Gn {
         return this.migrateV1Document(a);
       const r = [], o = [];
       return a.artboards.forEach((s) => {
-        const c = Vn.fromJSON({
+        const c = Yn.fromJSON({
           id: s.id,
           name: s.name,
           x: s.x,
@@ -2103,9 +2109,9 @@ const oe = N("ImportManager"), Gn = class Gn {
           elementIds: s.elements.map((l) => l.id || "")
         }), i = s.elements.map((l) => {
           try {
-            return bn.createFromJSON(l);
+            return mn.createFromJSON(l);
           } catch (d) {
-            return oe.error("Failed to create element:", l, d), null;
+            return fe.error("Failed to create element:", l, d), null;
           }
         }).filter((l) => l !== null);
         r.push(c), o.push(...i);
@@ -2128,7 +2134,7 @@ const oe = N("ImportManager"), Gn = class Gn {
   static async migrateV1Document(n) {
     var t, a, r;
     try {
-      const o = n.elements || [], s = new Vn({
+      const o = n.elements || [], s = new Yn({
         id: "artboard-migrated",
         name: "Artboard 1",
         x: 0,
@@ -2138,9 +2144,9 @@ const oe = N("ImportManager"), Gn = class Gn {
         backgroundColor: ((r = n.canvas) == null ? void 0 : r.backgroundColor) || "#ffffff"
       }), c = o.map((i) => {
         try {
-          return bn.createFromJSON(i);
+          return mn.createFromJSON(i);
         } catch (l) {
-          return oe.error("Failed to create element:", i, l), null;
+          return fe.error("Failed to create element:", i, l), null;
         }
       }).filter((i) => i !== null);
       return c.forEach((i) => {
@@ -2291,14 +2297,14 @@ const oe = N("ImportManager"), Gn = class Gn {
     await Promise.all(r);
   }
 };
-Gn.SUPPORTED_VERSIONS = ["1.0.0", "2.0.0"];
-let ce = Gn;
-const le = N("element-serializer"), Ie = 4e3, ln = /* @__PURE__ */ new Set();
-function fa(e, n) {
-  const t = n ? ua(n) : "no-src";
+qn.SUPPORTED_VERSIONS = ["1.0.0", "2.0.0"];
+let ue = qn;
+const pe = U("element-serializer"), Oe = 4e3, fn = /* @__PURE__ */ new Set();
+function ba(e, n) {
+  const t = n ? ga(n) : "no-src";
   return `${e}:${t}`;
 }
-function ua(e) {
+function ga(e) {
   let n = 0;
   for (let t = 0; t < e.length; t++) {
     const a = e.charCodeAt(t);
@@ -2306,20 +2312,20 @@ function ua(e) {
   }
   return n.toString(36);
 }
-function On() {
-  ln.clear();
+function Ln() {
+  fn.clear();
 }
-function De(e) {
-  for (const n of ln)
-    n.startsWith(`${e}:`) && ln.delete(n);
+function Re(e) {
+  for (const n of fn)
+    n.startsWith(`${e}:`) && fn.delete(n);
 }
-function pa(e) {
-  ln.add(e);
+function ma(e) {
+  fn.add(e);
 }
-function ha(e) {
-  return ln.has(e);
+function ya(e) {
+  return fn.has(e);
 }
-async function ba(e, n = Ie) {
+async function $a(e, n = Oe) {
   const { naturalWidth: t, naturalHeight: a } = e;
   if (t <= n && a <= n)
     return createImageBitmap(e);
@@ -2330,20 +2336,20 @@ async function ba(e, n = Ie) {
     resizeQuality: "high"
   });
 }
-let gn = null, mn = null;
-function ga(e, n) {
-  gn = e, mn = n;
+let yn = null, $n = null;
+function xa(e, n) {
+  yn = e, $n = n;
 }
-function ma() {
-  gn = null, mn = null;
+function va() {
+  yn = null, $n = null;
 }
-function Da() {
-  On(), gn && gn();
+function Ra() {
+  Ln(), yn && yn();
 }
-function Fa(e) {
-  De(e), mn && mn(e);
+function Ba(e) {
+  Re(e), $n && $n(e);
 }
-function Rn(e, n) {
+function Nn(e, n) {
   const t = e;
   if (typeof t.fontFamily == "string" && n.add(t.fontFamily), t.richText && typeof t.richText == "object") {
     const a = t.richText;
@@ -2358,14 +2364,14 @@ function Rn(e, n) {
   }
   if (t.children && Array.isArray(t.children))
     for (const a of t.children)
-      Rn(a, n);
+      Nn(a, n);
   if (e.masks && Array.isArray(e.masks))
     for (const a of e.masks)
-      a.maskElement && Rn(a.maskElement, n);
+      a.maskElement && Nn(a.maskElement, n);
 }
-function de(e) {
+function he(e) {
   if (typeof document > "u") return e;
-  const n = $n.getInstance();
+  const n = vn.getInstance();
   return e.map((t) => {
     if (!(t != null && t.maskElement) || t.maskElement.transformType !== "image") return t;
     const a = t.maskElement.imageUrl;
@@ -2381,41 +2387,41 @@ function de(e) {
     } : t;
   });
 }
-async function fe(e, n, t = Ie) {
+async function be(e, n, t = Oe) {
   const a = n.filter((i) => e.hasElementId(i.id)), r = [], o = [], s = /* @__PURE__ */ new Set();
   for (const i of a) {
     const l = i.toJSON();
-    if (Rn(l, s), i instanceof kn && !i.imageElement) {
-      le.warn(`[element-serializer] Skipping image ${i.id}: image not loaded (state: ${i.imageLoadState})`);
+    if (Nn(l, s), i instanceof En && !i.imageElement) {
+      pe.warn(`[element-serializer] Skipping image ${i.id}: image not loaded (state: ${i.imageLoadState})`);
       continue;
     }
-    if (i instanceof kn && i.imageElement)
+    if (i instanceof En && i.imageElement)
       try {
-        const d = fa(i.id, i.imageUrl);
-        if (!ha(d)) {
-          const v = await ba(i.imageElement, t);
-          o.push({ cacheKey: d, bitmap: v }), pa(d);
+        const d = ba(i.id, i.imageUrl);
+        if (!ya(d)) {
+          const x = await $a(i.imageElement, t);
+          o.push({ cacheKey: d, bitmap: x }), ma(d);
         }
-        const p = i.transformData || {}, f = l.masks && l.masks.length > 0, m = f ? p.width : p.width * (p.cropWidth ?? 1), b = f ? p.height : p.height * (p.cropHeight ?? 1), h = {
+        const p = i.transformData || {}, f = l.masks && l.masks.length > 0, $ = f ? p.width : p.width * (p.cropWidth ?? 1), h = f ? p.height : p.height * (p.cropHeight ?? 1), b = {
           id: i.id,
           type: "image",
           x: i.x,
           y: i.y,
-          width: m,
-          height: b,
+          width: $,
+          height: h,
           rotation: i.rotation || 0,
           bitmapCacheKey: d
         };
         if (!f && (p.cropX !== 0 || p.cropY !== 0 || p.cropWidth !== 1 || p.cropHeight !== 1)) {
-          const v = i.imageElement.naturalWidth, g = i.imageElement.naturalHeight;
-          let y = 1;
-          (v > t || g > t) && (y = t / Math.max(v, g)), h.cropX = p.cropX * v * y, h.cropY = p.cropY * g * y, h.cropWidth = p.cropWidth * v * y, h.cropHeight = p.cropHeight * g * y;
+          const x = i.imageElement.naturalWidth, m = i.imageElement.naturalHeight;
+          let g = 1;
+          (x > t || m > t) && (g = t / Math.max(x, m)), b.cropX = p.cropX * x * g, b.cropY = p.cropY * m * g, b.cropWidth = p.cropWidth * x * g, b.cropHeight = p.cropHeight * m * g;
         }
-        p.flipHorizontal && (h.flipHorizontal = p.flipHorizontal), p.flipVertical && (h.flipVertical = p.flipVertical), p.borderRadius && (h.borderRadius = p.borderRadius), i.opacity !== void 0 && (h.opacity = i.opacity);
-        const $ = h;
-        i.distressEffect && ($.distressEffect = { ...i.distressEffect }), l.masks && l.masks.length > 0 && ($.masks = de(l.masks)), l.blendMode && ($.blendMode = l.blendMode), l.knockoutParts && ($.knockoutParts = l.knockoutParts), "getVisualBoundingBox" in i && typeof i.getVisualBoundingBox == "function" ? $._boundingBox = i.getVisualBoundingBox() : "getBoundingBox" in i && typeof i.getBoundingBox == "function" && ($._boundingBox = i.getBoundingBox()), r.push($);
+        p.flipHorizontal && (b.flipHorizontal = p.flipHorizontal), p.flipVertical && (b.flipVertical = p.flipVertical), p.borderRadius && (b.borderRadius = p.borderRadius), i.opacity !== void 0 && (b.opacity = i.opacity);
+        const y = b;
+        i.distressEffect && (y.distressEffect = { ...i.distressEffect }), l.masks && l.masks.length > 0 && (y.masks = he(l.masks)), l.blendMode && (y.blendMode = l.blendMode), l.knockoutParts && (y.knockoutParts = l.knockoutParts), "getVisualBoundingBox" in i && typeof i.getVisualBoundingBox == "function" ? y._boundingBox = i.getVisualBoundingBox() : "getBoundingBox" in i && typeof i.getBoundingBox == "function" && (y._boundingBox = i.getBoundingBox()), r.push(y);
       } catch (d) {
-        le.error(`[element-serializer] Failed to create ImageBitmap for ${l.id}:`, d);
+        pe.error(`[element-serializer] Failed to create ImageBitmap for ${l.id}:`, d);
       }
     else {
       const d = {
@@ -2423,7 +2429,7 @@ async function fe(e, n, t = Ie) {
         type: l.transformType
         // Map transformType to type for worker compatibility
       };
-      d.masks && Array.isArray(d.masks) && d.masks.length > 0 && (d.masks = de(d.masks)), "getVisualBoundingBox" in i && typeof i.getVisualBoundingBox == "function" ? d._boundingBox = i.getVisualBoundingBox() : "getBoundingBox" in i && typeof i.getBoundingBox == "function" && (d._boundingBox = i.getBoundingBox()), r.push(d);
+      d.masks && Array.isArray(d.masks) && d.masks.length > 0 && (d.masks = he(d.masks)), "getVisualBoundingBox" in i && typeof i.getVisualBoundingBox == "function" ? d._boundingBox = i.getVisualBoundingBox() : "getBoundingBox" in i && typeof i.getBoundingBox == "function" && (d._boundingBox = i.getBoundingBox()), r.push(d);
     }
   }
   const c = Array.from(s);
@@ -2448,7 +2454,7 @@ async function fe(e, n, t = Ie) {
     newBitmaps: o
   };
 }
-const ya = `"use strict";
+const wa = `"use strict";
 (() => {
   var __create = Object.create;
   var __defProp = Object.defineProperty;
@@ -21638,7 +21644,7 @@ const ya = `"use strict";
   // src/types/index.ts
   var RichText = class _RichText {
     constructor(spans = []) {
-      this.spans = spans.length > 0 ? spans : [{ text: "", style: {} }];
+      this.spans = spans.length > 0 ? spans.map((s) => ({ ...s, style: { ...s.style } })) : [{ text: "", style: {} }];
       this.normalize();
     }
     /**
@@ -21843,7 +21849,7 @@ const ya = `"use strict";
      * Check if two styles are equal
      */
     stylesEqual(a, b) {
-      return a.color === b.color && a.fontFamily === b.fontFamily && a.fontSize === b.fontSize && a.bold === b.bold && a.italic === b.italic && a.underline === b.underline && a.strikethrough === b.strikethrough;
+      return a.color === b.color && a.fontFamily === b.fontFamily && a.fontSize === b.fontSize && a.bold === b.bold && a.italic === b.italic && a.underline === b.underline && a.strikethrough === b.strikethrough && a.letterSpacing === b.letterSpacing;
     }
     /**
      * Clone this RichText instance
@@ -21874,7 +21880,7 @@ const ya = `"use strict";
      * Serialize to JSON
      */
     toJSON() {
-      return { spans: this.spans };
+      return { spans: this.spans.map((s) => ({ ...s, style: { ...s.style } })) };
     }
     /**
      * Deserialize from JSON
@@ -22203,6 +22209,58 @@ const ya = `"use strict";
     ctx.restore();
   }
 
+  // src/core/text-spacing.ts
+  function countSpacedChars(text) {
+    return Array.from(text).length;
+  }
+  function spacedTextWidth(rawWidth, text, letterSpacing) {
+    if (!letterSpacing) return rawWidth;
+    return rawWidth + letterSpacing * countSpacedChars(text);
+  }
+  function getSpacedCharOffsets(ctx, text, letterSpacing) {
+    const chars = Array.from(text);
+    const offsets = [0];
+    let prefix = "";
+    for (let i = 0; i < chars.length; i++) {
+      prefix += chars[i];
+      offsets.push(ctx.measureText(prefix).width + letterSpacing * (i + 1));
+    }
+    return offsets;
+  }
+  function leftAnchoredStartX(ctx, x, totalWidth) {
+    switch (ctx.textAlign) {
+      case "center":
+        return x - totalWidth / 2;
+      case "right":
+      case "end":
+        return x - totalWidth;
+      default:
+        return x;
+    }
+  }
+  function drawTextWithSpacing(op, ctx, text, x, y, letterSpacing) {
+    if (!letterSpacing || text.length === 0) {
+      ctx[op](text, x, y);
+      return;
+    }
+    const offsets = getSpacedCharOffsets(ctx, text, letterSpacing);
+    const totalWidth = offsets[offsets.length - 1];
+    const startX = leftAnchoredStartX(ctx, x, totalWidth);
+    const previousAlign = ctx.textAlign;
+    ctx.textAlign = "left";
+    const chars = Array.from(text);
+    for (let i = 0; i < chars.length; i++) {
+      ctx[op](chars[i], startX + offsets[i], y);
+    }
+    ctx.textAlign = previousAlign;
+  }
+  function fillTextWithSpacing(ctx, text, x, y, letterSpacing) {
+    drawTextWithSpacing("fillText", ctx, text, x, y, letterSpacing);
+  }
+  function strokeTextWithSpacing(ctx, text, x, y, letterSpacing) {
+    drawTextWithSpacing("strokeText", ctx, text, x, y, letterSpacing);
+  }
+
   // src/core/TextMetrics.ts
   var _measureCanvas = null;
   function getMeasureCanvas() {
@@ -22229,10 +22287,12 @@ const ya = `"use strict";
     parts.push(fontFamily);
     return parts.join(" ");
   }
-  function wrapText(text, maxWidth, fontSize, fontFamily, bold = false, italic = false, lockedLineCount, strict = false) {
+  function wrapText(text, maxWidth, fontSize, fontFamily, bold = false, italic = false, lockedLineCount, strict = false, opts) {
     const canvas = getMeasureCanvas();
     const ctx = canvas.getContext("2d");
     ctx.font = buildFontString2(fontSize, fontFamily, bold, italic);
+    const letterSpacing = opts?.letterSpacing ?? 0;
+    const measure = (t) => spacedTextWidth(ctx.measureText(t).width, t, letterSpacing);
     if (text.trim().length === 0) {
       return [text];
     }
@@ -22241,7 +22301,7 @@ const ya = `"use strict";
       const allWrappedLines = [];
       for (let i = 0; i < explicitLines.length; i++) {
         const line = explicitLines[i];
-        const wrappedLine = wrapText(line, maxWidth, fontSize, fontFamily, bold, italic, void 0, strict);
+        const wrappedLine = wrapText(line, maxWidth, fontSize, fontFamily, bold, italic, void 0, strict, opts);
         allWrappedLines.push(...wrappedLine);
       }
       return allWrappedLines;
@@ -22270,7 +22330,7 @@ const ya = `"use strict";
     }
     const allText = words.join(" ");
     const allTextWithSpaces = leadingSpaces + allText + trailingSpaces;
-    const allTextWidth = ctx.measureText(allTextWithSpaces).width;
+    const allTextWidth = measure(allTextWithSpaces);
     const isSmallSize = maxWidth < 200;
     const wrapTolerancePercent = strict ? 0 : isSmallSize ? 0.08 : 0.05;
     const wrapTolerance = strict ? 0 : Math.max(20, maxWidth * wrapTolerancePercent);
@@ -22283,7 +22343,7 @@ const ya = `"use strict";
     const lineTolerance = strict ? 0 : Math.max(15, maxWidth * lineTolerancePercent);
     for (let i = 0; i < words.length; i++) {
       const word = words[i];
-      const wordWidth = ctx.measureText(word).width;
+      const wordWidth = measure(word);
       if (wordWidth > maxWidth + lineTolerance) {
         if (currentLine.length > 0) {
           lines.push(currentLine);
@@ -22293,7 +22353,7 @@ const ya = `"use strict";
         let charBuffer = "";
         for (const char of chars) {
           const testBuffer = charBuffer + char;
-          const bufferWidth = ctx.measureText(testBuffer).width;
+          const bufferWidth = measure(testBuffer);
           if (bufferWidth > maxWidth + lineTolerance && charBuffer.length > 0) {
             lines.push(charBuffer);
             charBuffer = char;
@@ -22304,8 +22364,8 @@ const ya = `"use strict";
         currentLine = charBuffer;
       } else {
         const testLine = currentLine.length > 0 ? currentLine + " " + word : word;
-        const metrics = ctx.measureText(testLine);
-        if (metrics.width > maxWidth + lineTolerance && currentLine.length > 0) {
+        const testLineWidth = measure(testLine);
+        if (testLineWidth > maxWidth + lineTolerance && currentLine.length > 0) {
           lines.push(currentLine);
           currentLine = word;
         } else {
@@ -22319,7 +22379,7 @@ const ya = `"use strict";
     if (lines.length > 0) {
       if (leadingSpaces.length > 0) {
         const firstLineWithSpace = leadingSpaces + lines[0];
-        const firstLineWidth = ctx.measureText(firstLineWithSpace).width;
+        const firstLineWidth = measure(firstLineWithSpace);
         if (firstLineWidth > maxWidth + lineTolerance) {
           lines.unshift(leadingSpaces);
         } else {
@@ -22329,7 +22389,7 @@ const ya = `"use strict";
       if (trailingSpaces.length > 0) {
         const lastIdx = lines.length - 1;
         const lastLineWithSpace = lines[lastIdx] + trailingSpaces;
-        const lastLineWidth = ctx.measureText(lastLineWithSpace).width;
+        const lastLineWidth = measure(lastLineWithSpace);
         if (lastLineWidth > maxWidth + lineTolerance) {
           lines.push(trailingSpaces);
         } else {
@@ -22350,8 +22410,9 @@ const ya = `"use strict";
     const height = ascent + descent;
     return { ascent, descent, height };
   }
-  function calculateVisualBoundsWithSpaceCollapsing(text, maxWidth, fontSize, fontFamily, bold = false, italic = false, lockedLineCount, strict = false) {
-    const lines = wrapText(text, maxWidth, fontSize, fontFamily, bold, italic, lockedLineCount, strict);
+  function calculateVisualBoundsWithSpaceCollapsing(text, maxWidth, fontSize, fontFamily, bold = false, italic = false, lockedLineCount, strict = false, opts) {
+    const letterSpacing = opts?.letterSpacing ?? 0;
+    const lines = wrapText(text, maxWidth, fontSize, fontFamily, bold, italic, lockedLineCount, strict, opts);
     const hasExplicitNewlines = text.includes("\\n");
     const paragraphMetadata = lines.map((_, index) => ({
       isParagraphStart: !hasExplicitNewlines && index === 0,
@@ -22385,12 +22446,12 @@ const ya = `"use strict";
       totalLineCount++;
       if (visibleText.length > 0) {
         visibleLines.push(visibleText);
-        const lineWidth = ctx.measureText(visibleText).width;
+        const lineWidth = spacedTextWidth(ctx.measureText(visibleText).width, visibleText, letterSpacing);
         maxLineWidth = Math.max(maxLineWidth, lineWidth);
       }
     });
     let height;
-    const lineHeight = LINE_HEIGHT_MULTIPLIER;
+    const lineHeight = opts?.lineHeight ?? LINE_HEIGHT_MULTIPLIER;
     if (totalLineCount === 1) {
       height = fontMetrics.height;
     } else if (totalLineCount === 0) {
@@ -22570,6 +22631,7 @@ const ya = `"use strict";
       const transformData = element.transformData;
       const width = transformData?.width ?? 200;
       const availableWidth = width - HORIZONTAL_PADDING * 2;
+      const letterSpacing = textElement.letterSpacing ?? 0;
       const { lines, height: visualHeight } = calculateVisualBoundsWithSpaceCollapsing(
         text,
         availableWidth,
@@ -22579,12 +22641,13 @@ const ya = `"use strict";
         italic,
         void 0,
         // No locked line count for stroke
-        true
+        true,
         // strict: wrap exactly at maxWidth
+        { letterSpacing, lineHeight: textElement.lineHeight }
       );
       const topLeftX = -width / 2;
       const topLeftY = -visualHeight / 2;
-      const lineSpacing = fontSize * LINE_HEIGHT_MULTIPLIER;
+      const lineSpacing = fontSize * (textElement.lineHeight ?? LINE_HEIGHT_MULTIPLIER);
       lines.forEach((line, index) => {
         const isParagraphStart = index === 0;
         const isParagraphEnd = index === lines.length - 1;
@@ -22610,7 +22673,7 @@ const ya = `"use strict";
           xPos = topLeftX + width - HORIZONTAL_PADDING;
         }
         const yPos = topLeftY + fontMetrics.ascent + index * lineSpacing;
-        ctx.strokeText(visibleText, xPos, yPos);
+        strokeTextWithSpacing(ctx, visibleText, xPos, yPos, letterSpacing);
       });
     } else {
       const visualHeight = fontMetrics.height;
@@ -23349,11 +23412,12 @@ const ya = `"use strict";
       const fontFamily = style.fontFamily || element.fontFamily;
       const bold = style.bold !== void 0 ? style.bold : element.bold || false;
       const italic = style.italic !== void 0 ? style.italic : element.italic || false;
+      const letterSpacing = style.letterSpacing !== void 0 ? style.letterSpacing : element.letterSpacing ?? 0;
       ctx.font = buildFontString2(fontSize, fontFamily, bold, italic);
-      return ctx.measureText(text).width;
+      return spacedTextWidth(ctx.measureText(text).width, text, letterSpacing);
     };
     const stylesMatch = (s1, s2) => {
-      return s1.fontSize === s2.fontSize && s1.fontFamily === s2.fontFamily && s1.color === s2.color && s1.bold === s2.bold && s1.italic === s2.italic && s1.underline === s2.underline && s1.strikethrough === s2.strikethrough;
+      return s1.fontSize === s2.fontSize && s1.fontFamily === s2.fontFamily && s1.color === s2.color && s1.bold === s2.bold && s1.italic === s2.italic && s1.underline === s2.underline && s1.strikethrough === s2.strikethrough && s1.letterSpacing === s2.letterSpacing;
     };
     const mergedSpans = [];
     spans.forEach((span) => {
@@ -23527,6 +23591,7 @@ const ya = `"use strict";
   function renderRichTextFillOnly(ctx, richText, element, maxWidth, lockedLineCount) {
     ctx.fillStyle = element.color;
     const textAlign = element.textAlign || "center";
+    const resolveSpacing = (style) => style.letterSpacing !== void 0 ? style.letterSpacing : element.letterSpacing ?? 0;
     const explicitLines = splitRichTextIntoLines(richText);
     let lines;
     let paragraphMetadata;
@@ -23565,7 +23630,7 @@ const ya = `"use strict";
         const bold = span.style.bold !== void 0 ? span.style.bold : element.bold || false;
         const italic = span.style.italic !== void 0 ? span.style.italic : element.italic || false;
         ctx.font = buildFontString(fontSize, fontFamily, bold, italic);
-        const width = ctx.measureText(span.text).width;
+        const width = spacedTextWidth(ctx.measureText(span.text).width, span.text, resolveSpacing(span.style));
         spanWidths.push(width);
         lineWidth += width;
         const metrics = getFontMetrics2(fontSize, fontFamily, bold, italic);
@@ -23603,7 +23668,11 @@ const ya = `"use strict";
         if (visibleText.length > 0) {
           ctx.save();
           ctx.font = buildFontString(fontSize, fontFamily, bold, italic);
-          adjustedLineWidth += ctx.measureText(visibleText).width;
+          adjustedLineWidth += spacedTextWidth(
+            ctx.measureText(visibleText).width,
+            visibleText,
+            resolveSpacing(span.style)
+          );
           ctx.restore();
         }
       });
@@ -23621,7 +23690,7 @@ const ya = `"use strict";
       maxLineHeight = Math.max(maxLineHeight, lineHeight);
     });
     const elementFontMetrics = getFontMetrics2(element.fontSize, element.fontFamily, element.bold, element.italic);
-    const lineSpacing = element.fontSize * LINE_HEIGHT_MULTIPLIER;
+    const lineSpacing = element.fontSize * (element.lineHeight ?? LINE_HEIGHT_MULTIPLIER);
     let totalHeight;
     if (lineMetrics.length === 0) {
       totalHeight = 0;
@@ -23673,12 +23742,13 @@ const ya = `"use strict";
         }
         charIndexInLine += span.text.length;
         if (renderText.length > 0) {
+          const letterSpacing = resolveSpacing(span.style);
           ctx.font = buildFontString(fontSize, fontFamily, bold, italic);
           ctx.fillStyle = color;
           ctx.textBaseline = "alphabetic";
           ctx.textAlign = "left";
-          ctx.fillText(renderText, currentX, baselineY);
-          const renderedWidth = ctx.measureText(renderText).width;
+          fillTextWithSpacing(ctx, renderText, currentX, baselineY, letterSpacing);
+          const renderedWidth = spacedTextWidth(ctx.measureText(renderText).width, renderText, letterSpacing);
           if (underline) {
             const underlineY = baselineY + fontSize * 0.1;
             ctx.beginPath();
@@ -23757,7 +23827,7 @@ const ya = `"use strict";
     const visualHeight = fontMetrics.height;
     const topLeftY = -visualHeight / 2;
     const yPos = topLeftY + fontMetrics.ascent;
-    ctx.fillText(text, 0, yPos);
+    fillTextWithSpacing(ctx, text, 0, yPos, element.letterSpacing);
   }
   function renderCustomTransform(ctx, elementData) {
     renderCustomTransformNormal(ctx, elementData);
@@ -23787,7 +23857,9 @@ const ya = `"use strict";
           italic: elementData.italic,
           underline: elementData.underline,
           strikethrough: elementData.strikethrough,
-          textAlign: elementData.textAlign
+          textAlign: elementData.textAlign,
+          letterSpacing: elementData.letterSpacing,
+          lineHeight: elementData.lineHeight
         },
         availableWidth,
         lockedLineCount
@@ -23797,6 +23869,7 @@ const ya = `"use strict";
       if (elementData.text) {
         ctx.fillStyle = elementData.color;
         const lockedLineCount = elementData._lockedLineCount;
+        const letterSpacing = elementData.letterSpacing ?? 0;
         const { lines, height: visualHeight } = calculateVisualBoundsWithSpaceCollapsing(
           elementData.text,
           availableWidth,
@@ -23805,8 +23878,9 @@ const ya = `"use strict";
           elementData.bold,
           elementData.italic,
           lockedLineCount,
-          true
+          true,
           // strict: true
+          { letterSpacing, lineHeight: elementData.lineHeight }
         );
         const fontMetrics = getFontMetrics2(
           elementData.fontSize,
@@ -23816,7 +23890,7 @@ const ya = `"use strict";
         );
         const topLeftX = -(transformData?.width ?? 100) / 2;
         const topLeftY = -visualHeight / 2;
-        const lineSpacing = elementData.fontSize * LINE_HEIGHT_MULTIPLIER;
+        const lineSpacing = elementData.fontSize * (elementData.lineHeight ?? LINE_HEIGHT_MULTIPLIER);
         ctx.font = \`\${elementData.italic ? "italic " : ""}\${elementData.bold ? "bold " : ""}\${elementData.fontSize}px \${elementData.fontFamily}\`;
         ctx.textBaseline = "alphabetic";
         ctx.textAlign = elementData.textAlign;
@@ -23845,9 +23919,9 @@ const ya = `"use strict";
             xPos = topLeftX + (transformData?.width ?? 100) - HORIZONTAL_PADDING;
           }
           const yPos = topLeftY + fontMetrics.ascent + index * lineSpacing;
-          ctx.fillText(visibleText, xPos, yPos);
+          fillTextWithSpacing(ctx, visibleText, xPos, yPos, letterSpacing);
           if (visibleText.length > 0) {
-            const lineWidth = ctx.measureText(visibleText).width;
+            const lineWidth = spacedTextWidth(ctx.measureText(visibleText).width, visibleText, letterSpacing);
             let decorationX = xPos;
             if (elementData.textAlign === "center") decorationX -= lineWidth / 2;
             else if (elementData.textAlign === "right") decorationX -= lineWidth;
@@ -24261,7 +24335,8 @@ const ya = `"use strict";
         bold: textElement.bold || false,
         italic: textElement.italic || false,
         textAlign: textElement.textAlign || "center",
-        color: textElement.color || "#000000"
+        color: textElement.color || "#000000",
+        letterSpacing: textElement.letterSpacing
       });
       ctx.restore();
     }
@@ -26318,8 +26393,8 @@ const ya = `"use strict";
     console.error("[Export Worker] Unhandled promise rejection:", event.reason);
   };
 })();
-`, O = N("WorkerExport");
-class dn {
+`, O = U("WorkerExport");
+class un {
   constructor() {
     this.worker = null, this.workerBlobUrl = null, this.pendingRequests = /* @__PURE__ */ new Map(), this.requestQueue = [], this.blobRequestQueue = [], this.isProcessingQueue = !1, this.isReady = !1, this.readyPromise = null, this.requestIdCounter = 0, this.workerCrashCount = 0, this.MAX_CRASHES_BEFORE_FALLBACK = 3, this.lastCrashTime = 0, this.CRASH_RESET_TIMEOUT = 6e4, this.progressListeners = /* @__PURE__ */ new Set(), this.idleTimeout = null, this.IDLE_TIMEOUT_MS = 3e4;
   }
@@ -26381,7 +26456,7 @@ class dn {
    * Call this when exiting editor mode to free memory.
    */
   clearWorkerBitmapCache() {
-    if (On(), this.worker && this.isReady) {
+    if (Ln(), this.worker && this.isReady) {
       const n = {
         type: "clear-all-bitmaps"
       };
@@ -26393,7 +26468,7 @@ class dn {
    * Call this when an element is removed or its image source changes.
    */
   clearWorkerBitmap(n) {
-    if (De(n), this.worker && this.isReady) {
+    if (Re(n), this.worker && this.isReady) {
       const t = {
         type: "clear-bitmap",
         elementId: n
@@ -26417,13 +26492,13 @@ class dn {
   async initialize() {
     if (this.worker)
       return this.readyPromise || Promise.resolve();
-    if (!dn.supportsWorkerExport())
+    if (!un.supportsWorkerExport())
       throw new Error("Browser does not support OffscreenCanvas or Web Workers");
     return this.readyPromise = new Promise((n, t) => {
       try {
         let a;
         try {
-          const s = new Blob([ya], { type: "application/javascript" });
+          const s = new Blob([wa], { type: "application/javascript" });
           a = URL.createObjectURL(s), this.workerBlobUrl = a;
         } catch (s) {
           O.error("Failed to create worker blob:", s), t(new Error(`Worker creation failed: ${s instanceof Error ? s.message : String(s)}`));
@@ -26437,7 +26512,7 @@ class dn {
         const r = setTimeout(() => {
           t(new Error("Worker initialization timeout"));
         }, 15e3), o = (s) => {
-          s.data.type === "ready" && (clearTimeout(r), this.isReady = !0, ga(
+          s.data.type === "ready" && (clearTimeout(r), this.isReady = !0, xa(
             () => this.clearWorkerBitmapCache(),
             (c) => this.clearWorkerBitmap(c)
           ), n());
@@ -26514,7 +26589,7 @@ class dn {
     const { artboard: t, elements: a, config: r } = n;
     if ((!this.worker || !this.isReady) && await this.initialize(), !this.worker)
       throw new Error("Worker is not initialized");
-    const o = `export-${++this.requestIdCounter}-${Date.now()}`, s = performance.now(), { data: c, newBitmaps: i } = await fe(t, a);
+    const o = `export-${++this.requestIdCounter}-${Date.now()}`, s = performance.now(), { data: c, newBitmaps: i } = await be(t, a);
     i.length > 0 && this.registerBitmapsWithWorker(i);
     const l = {
       type: "export",
@@ -26525,15 +26600,15 @@ class dn {
       scale: r.scale || 1,
       format: r.format || "png",
       quality: r.quality || 0.95
-    }, d = new Promise((m, b) => {
+    }, d = new Promise(($, h) => {
       this.pendingRequests.set(o, {
         requestId: o,
-        resolve: m,
-        reject: b,
+        resolve: $,
+        reject: h,
         startTime: s,
         returnFormat: "dataUrl"
       }), setTimeout(() => {
-        this.pendingRequests.has(o) && (this.pendingRequests.delete(o), b(new Error("Export request timeout")));
+        this.pendingRequests.has(o) && (this.pendingRequests.delete(o), h(new Error("Export request timeout")));
       }, 3e4);
     });
     this.worker.postMessage(l);
@@ -26571,7 +26646,7 @@ class dn {
     const { artboard: t, elements: a, config: r } = n;
     if ((!this.worker || !this.isReady) && await this.initialize(), !this.worker)
       throw new Error("Worker is not initialized");
-    const o = `export-blob-${++this.requestIdCounter}-${Date.now()}`, s = performance.now(), { data: c, newBitmaps: i } = await fe(t, a);
+    const o = `export-blob-${++this.requestIdCounter}-${Date.now()}`, s = performance.now(), { data: c, newBitmaps: i } = await be(t, a);
     i.length > 0 && this.registerBitmapsWithWorker(i);
     const l = {
       type: "export",
@@ -26583,15 +26658,15 @@ class dn {
       format: r.format || "png",
       quality: r.quality || 0.95,
       returnFormat: "blob"
-    }, d = new Promise((b, h) => {
+    }, d = new Promise((h, b) => {
       this.pendingRequests.set(o, {
         requestId: o,
-        resolve: b,
-        reject: h,
+        resolve: h,
+        reject: b,
         startTime: s,
         returnFormat: "blob"
       }), setTimeout(() => {
-        this.pendingRequests.has(o) && (this.pendingRequests.delete(o), h(new Error("Export request timeout")));
+        this.pendingRequests.has(o) && (this.pendingRequests.delete(o), b(new Error("Export request timeout")));
       }, 3e4);
     });
     this.worker.postMessage(l);
@@ -26685,7 +26760,7 @@ class dn {
         t.reject(new Error("Worker terminated")), this.pendingRequests.delete(n);
       for (; this.requestQueue.length > 0; )
         this.requestQueue.shift().reject(new Error("Worker terminated"));
-      this.worker.terminate(), this.worker = null, this.isReady = !1, this.readyPromise = null, On(), ma(), this.workerBlobUrl && (URL.revokeObjectURL(this.workerBlobUrl), this.workerBlobUrl = null);
+      this.worker.terminate(), this.worker = null, this.isReady = !1, this.readyPromise = null, Ln(), va(), this.workerBlobUrl && (URL.revokeObjectURL(this.workerBlobUrl), this.workerBlobUrl = null);
     }
   }
   /**
@@ -26700,32 +26775,32 @@ class dn {
     };
   }
 }
-let Z = null;
-function Ma() {
-  return Z || (Z = new dn()), Z;
+let Q = null;
+function La() {
+  return Q || (Q = new un()), Q;
 }
-function Oa() {
-  Z && (Z.terminate(), Z = null);
+function Na() {
+  Q && (Q.terminate(), Q = null);
 }
-Un();
-const z = N("Export");
-function Bn(e, n) {
+Hn();
+const W = U("Export");
+function Un(e, n) {
   var t;
   if (!(!e || typeof e != "object")) {
     if (typeof e.fontFamily == "string" && e.fontFamily.trim() && n.add(e.fontFamily), e.richText && Array.isArray(e.richText.spans))
       for (const a of e.richText.spans)
         (t = a == null ? void 0 : a.style) != null && t.fontFamily && typeof a.style.fontFamily == "string" && n.add(a.style.fontFamily);
     if (Array.isArray(e.children))
-      for (const a of e.children) Bn(a, n);
+      for (const a of e.children) Un(a, n);
     if (Array.isArray(e.masks))
       for (const a of e.masks)
-        a != null && a.maskElement && Bn(a.maskElement, n);
+        a != null && a.maskElement && Un(a.maskElement, n);
   }
 }
-async function ue(e) {
+async function ge(e) {
   if (typeof document > "u" || !document.fonts) return;
   const n = /* @__PURE__ */ new Set();
-  for (const a of e) Bn(a, n);
+  for (const a of e) Un(a, n);
   if (n.size === 0) return;
   const t = [];
   for (const a of n)
@@ -26733,12 +26808,12 @@ async function ue(e) {
     }));
   await Promise.all(t), document.fonts.ready && await document.fonts.ready;
 }
-const on = class on {
+const ln = class ln {
   /**
    * Check if worker export is supported in this browser
    */
   static supportsWorkerExport() {
-    return dn.supportsWorkerExport();
+    return un.supportsWorkerExport();
   }
   /**
    * Get or initialize the worker manager
@@ -26746,9 +26821,9 @@ const on = class on {
   static async getWorkerManager() {
     return this.supportsWorkerExport() ? this.workerManager ? this.workerManager : this.workerInitPromise ? (await this.workerInitPromise, this.workerManager) : (this.workerInitPromise = (async () => {
       try {
-        this.workerManager = new dn(), await this.workerManager.initialize();
+        this.workerManager = new un(), await this.workerManager.initialize();
       } catch (n) {
-        z.error("Failed to initialize worker:", n), this.workerManager = null;
+        W.error("Failed to initialize worker:", n), this.workerManager = null;
       }
     })(), await this.workerInitPromise, this.workerInitPromise = null, this.workerManager) : null;
   }
@@ -26805,8 +26880,8 @@ const on = class on {
       transparentBackground: i,
       backgroundColor: l,
       forceMainThread: u
-    }), f = await this.dataUrlToBlob(p), m = (/* @__PURE__ */ new Date()).toISOString().replace(/[:.]/g, "-").split("T")[0], b = d || `${n.name}-${m}.${o}`;
-    this.downloadBlob(f, b);
+    }), f = await this.dataUrlToBlob(p), $ = (/* @__PURE__ */ new Date()).toISOString().replace(/[:.]/g, "-").split("T")[0], h = d || `${n.name}-${$}.${o}`;
+    this.downloadBlob(f, h);
   }
   /**
    * Export artboard to data URL (for preview/testing)
@@ -26825,7 +26900,7 @@ const on = class on {
       try {
         const u = await this.getWorkerManager();
         if (u) {
-          const p = new Set(n.getElementIds()), f = t.filter((b) => p.has(b.id));
+          const p = new Set(n.getElementIds()), f = t.filter((h) => p.has(h.id));
           return (await u.exportArtboardToDataURL(n, f, {
             scale: c,
             format: o === "jpg" ? "jpeg" : o,
@@ -26833,7 +26908,7 @@ const on = class on {
           })).dataUrl;
         }
       } catch (u) {
-        z.warn("Worker export failed, falling back to main thread:", u);
+        W.warn("Worker export failed, falling back to main thread:", u);
       }
     return this.mainThreadExportToDataURL(n, t, a, {
       format: o,
@@ -26861,7 +26936,7 @@ const on = class on {
       try {
         const u = await this.getWorkerManager();
         if (u) {
-          const p = new Set(n.getElementIds()), f = t.filter((b) => p.has(b.id));
+          const p = new Set(n.getElementIds()), f = t.filter((h) => p.has(h.id));
           return (await u.exportArtboardToBlob(n, f, {
             scale: c,
             format: o === "jpg" ? "jpeg" : o,
@@ -26869,7 +26944,7 @@ const on = class on {
           })).blob;
         }
       } catch (u) {
-        z.warn("Worker blob export failed, falling back to main thread:", u);
+        W.warn("Worker blob export failed, falling back to main thread:", u);
       }
     return this.mainThreadExportToBlob(n, t, a, {
       format: o,
@@ -26893,53 +26968,53 @@ const on = class on {
       transparentBackground: i = !1,
       backgroundColor: l = n.backgroundColor
     } = r;
-    await ue(t);
+    await ge(t);
     const d = document.createElement("canvas"), u = n.width * c, p = n.height * c;
     d.width = u, d.height = p;
     const f = d.getContext("2d");
     if (f.scale(c, c), !i && n.exportBackground) {
       if (f.save(), this.applyExportBackgroundClipPath(f, n), n.backgroundType === "texture" && n.backgroundTexture) {
-        const g = K.getTexturePresetColor(n.backgroundTexture);
-        f.fillStyle = g, f.fillRect(0, 0, n.width, n.height);
-        const y = K.getTexture(n.backgroundTexture);
-        y && y.complete && f.drawImage(y, 0, 0, n.width, n.height);
+        const m = J.getTexturePresetColor(n.backgroundTexture);
+        f.fillStyle = m, f.fillRect(0, 0, n.width, n.height);
+        const g = J.getTexture(n.backgroundTexture);
+        g && g.complete && f.drawImage(g, 0, 0, n.width, n.height);
       } else
         f.fillStyle = l || n.backgroundColor, f.fillRect(0, 0, n.width, n.height);
       f.restore();
     }
     f.save(), f.translate(-n.x, -n.y), this.applyExportClipPath(f, n);
-    const m = new Set(n.getElementIds()), b = t.filter((g) => m.has(g.id)), h = /* @__PURE__ */ new Map();
-    b.forEach((g) => h.set(g.id, g));
-    const S = (g, y) => {
-      if (!y.id) return;
-      const k = h.get(y.id);
-      k && k.render(g, !1);
-    }, $ = b.map((g) => g.toJSON()), v = /* @__PURE__ */ new Set();
-    return b.forEach((g, y) => {
-      var k;
-      if (g.blendMode === "knockout" || g.blendMode === "clip") {
-        const T = $[y], C = g.blendMode === "knockout" ? "destination-out" : "destination-in", _ = ((k = T.knockoutParts) == null ? void 0 : k.scope) || "group", w = $.findIndex((E) => E.id === T.id);
+    const $ = new Set(n.getElementIds()), h = t.filter((m) => $.has(m.id)), b = /* @__PURE__ */ new Map();
+    h.forEach((m) => b.set(m.id, m));
+    const v = (m, g) => {
+      if (!g.id) return;
+      const C = b.get(g.id);
+      C && C.render(m, !1);
+    }, y = h.map((m) => m.toJSON()), x = /* @__PURE__ */ new Set();
+    return h.forEach((m, g) => {
+      var C;
+      if (m.blendMode === "knockout" || m.blendMode === "clip") {
+        const T = y[g], k = m.blendMode === "knockout" ? "destination-out" : "destination-in", _ = ((C = T.knockoutParts) == null ? void 0 : C.scope) || "group", w = y.findIndex((A) => A.id === T.id);
         if (w !== -1 && _ === "artboard")
-          for (let E = 0; E < w; E++) {
-            const x = $[E].id;
-            x && v.add(x);
+          for (let A = 0; A < w; A++) {
+            const E = y[A].id;
+            E && x.add(E);
           }
-        An(
+        Dn(
           f,
           T,
-          $,
-          S,
+          y,
+          v,
           i || !n.exportBackground ? void 0 : l,
           n,
-          C
-        ), v.add(g.id);
+          k
+        ), x.add(m.id);
       }
-    }), b.forEach((g) => {
-      v.has(g.id) || g.render(f, !1);
-    }), f.restore(), new Promise((g, y) => {
+    }), h.forEach((m) => {
+      x.has(m.id) || m.render(f, !1);
+    }), f.restore(), new Promise((m, g) => {
       d.toBlob(
-        (k) => {
-          k ? g(k) : y(new Error("Failed to create blob from canvas"));
+        (C) => {
+          C ? m(C) : g(new Error("Failed to create blob from canvas"));
         },
         o === "jpg" || o === "jpeg" ? "image/jpeg" : o === "webp" ? "image/webp" : "image/png",
         s
@@ -26953,7 +27028,7 @@ const on = class on {
    * worker), so font readiness matters here even when no fallback occurred.
    */
   static async mainThreadExportToDataURL(n, t, a, r = {}) {
-    var y, k;
+    var g, C;
     const {
       format: o = "png",
       quality: s = 0.95,
@@ -26961,79 +27036,79 @@ const on = class on {
       transparentBackground: i = !1,
       backgroundColor: l = n.backgroundColor
     } = r;
-    await ue(t);
+    await ge(t);
     const d = document.createElement("canvas"), u = n.width * c, p = n.height * c;
     d.width = u, d.height = p;
     const f = d.getContext("2d");
     if (f.scale(c, c), !i && n.exportBackground) {
       if (f.save(), this.applyExportBackgroundClipPath(f, n), n.backgroundType === "texture" && n.backgroundTexture) {
-        const T = K.getTexturePresetColor(n.backgroundTexture);
+        const T = J.getTexturePresetColor(n.backgroundTexture);
         f.fillStyle = T, f.fillRect(0, 0, n.width, n.height);
-        const C = K.getTexture(n.backgroundTexture);
-        C && C.complete ? f.drawImage(C, 0, 0, n.width, n.height) : z.warn("Texture not loaded for export:", n.backgroundTexture);
+        const k = J.getTexture(n.backgroundTexture);
+        k && k.complete ? f.drawImage(k, 0, 0, n.width, n.height) : W.warn("Texture not loaded for export:", n.backgroundTexture);
       } else
         f.fillStyle = l, f.fillRect(0, 0, n.width, n.height);
       f.restore();
     }
     f.save(), f.translate(-n.x, -n.y), this.applyExportClipPath(f, n);
-    const m = new Set(n.getElementIds()), b = t.filter((T) => m.has(T.id)), h = /* @__PURE__ */ new Map();
-    b.forEach((T) => h.set(T.id, T));
-    const S = (T, C) => {
-      if (!C.id) return;
-      const _ = h.get(C.id);
-      _ ? _.render(T, !1) : z.warn("Element not found in map:", C.id);
-    }, $ = b.map((T) => T.toJSON()), v = /* @__PURE__ */ new Set();
-    b.forEach((T, C) => {
+    const $ = new Set(n.getElementIds()), h = t.filter((T) => $.has(T.id)), b = /* @__PURE__ */ new Map();
+    h.forEach((T) => b.set(T.id, T));
+    const v = (T, k) => {
+      if (!k.id) return;
+      const _ = b.get(k.id);
+      _ ? _.render(T, !1) : W.warn("Element not found in map:", k.id);
+    }, y = h.map((T) => T.toJSON()), x = /* @__PURE__ */ new Set();
+    h.forEach((T, k) => {
       var _;
       if (T.blendMode === "knockout" || T.blendMode === "clip") {
-        const w = $[C], E = T.blendMode === "knockout" ? "destination-out" : "destination-in", x = ((_ = w.knockoutParts) == null ? void 0 : _.scope) || "group", P = $.findIndex((A) => A.id === w.id);
-        if (P !== -1 && x === "artboard")
-          for (let A = 0; A < P; A++) {
-            const F = $[A].id;
-            F && v.add(F);
+        const w = y[k], A = T.blendMode === "knockout" ? "destination-out" : "destination-in", E = ((_ = w.knockoutParts) == null ? void 0 : _.scope) || "group", S = y.findIndex((P) => P.id === w.id);
+        if (S !== -1 && E === "artboard")
+          for (let P = 0; P < S; P++) {
+            const I = y[P].id;
+            I && x.add(I);
           }
-        An(
+        Dn(
           f,
           w,
-          $,
-          S,
+          y,
+          v,
           i || !n.exportBackground ? void 0 : l,
           n,
-          E
-        ), v.add(T.id);
+          A
+        ), x.add(T.id);
       }
-    }), b.forEach((T, C) => {
+    }), h.forEach((T, k) => {
       var _;
-      if (!v.has(T.id)) {
-        const w = $[C], E = ((_ = w == null ? void 0 : w.distressEffect) == null ? void 0 : _.enabled) && w.distressEffect.style === "custom" && w.distressEffect.textureUrl, x = (w == null ? void 0 : w.masks) && w.masks.length > 0, P = (A) => {
-          T.render(A, !1);
+      if (!x.has(T.id)) {
+        const w = y[k], A = ((_ = w == null ? void 0 : w.distressEffect) == null ? void 0 : _.enabled) && w.distressEffect.style === "custom" && w.distressEffect.textureUrl, E = (w == null ? void 0 : w.masks) && w.masks.length > 0, S = (P) => {
+          T.render(P, !1);
         };
-        if (x && E)
-          ne(f, w, (A) => {
-            const F = T.getVisualBoundingBox();
-            ie(A, w.distressEffect, F, P);
+        if (E && A)
+          re(f, w, (P) => {
+            const I = T.getVisualBoundingBox();
+            de(P, w.distressEffect, I, S);
           });
-        else if (x)
-          ne(f, w, P);
-        else if (E) {
-          const A = T.getVisualBoundingBox();
-          ie(f, w.distressEffect, A, P);
+        else if (E)
+          re(f, w, S);
+        else if (A) {
+          const P = T.getVisualBoundingBox();
+          de(f, w.distressEffect, P, S);
         } else
           T.render(f, !1);
       }
-    }), (y = n.distressTexture) != null && y.enabled && da(f, n.distressTexture, {
+    }), (g = n.distressTexture) != null && g.enabled && ha(f, n.distressTexture, {
       x: n.x,
       y: n.y,
       width: n.width,
       height: n.height
-    }), (k = n.imageMask) != null && k.enabled && na(f, n.imageMask, {
+    }), (C = n.imageMask) != null && C.enabled && ra(f, n.imageMask, {
       x: n.x,
       y: n.y,
       width: n.width,
       height: n.height
     }), f.restore();
-    const g = o === "png" ? "image/png" : o === "webp" ? "image/webp" : "image/jpeg";
-    return d.toDataURL(g, s);
+    const m = o === "png" ? "image/png" : o === "webp" ? "image/webp" : "image/jpeg";
+    return d.toDataURL(m, s);
   }
   /**
    * Apply clip path for export background (uses 0,0 as origin since background is drawn before translate)
@@ -27054,7 +27129,7 @@ const on = class on {
         n.clip(i);
         return;
       } catch (i) {
-        z.warn("Invalid SVG path, falling back to rectangle:", i), n.rect(s, c, a, r);
+        W.warn("Invalid SVG path, falling back to rectangle:", i), n.rect(s, c, a, r);
       }
     n.clip();
   }
@@ -27078,7 +27153,7 @@ const on = class on {
         n.translate(a, r), n.clip(i), n.translate(-a, -r);
         return;
       } catch (i) {
-        z.warn("Invalid SVG path, falling back to rectangle:", i), n.rect(a, r, o, s);
+        W.warn("Invalid SVG path, falling back to rectangle:", i), n.rect(a, r, o, s);
       }
     n.clip();
   }
@@ -27138,24 +27213,24 @@ const on = class on {
       try {
         const l = performance.now(), d = await this.getWorkerManager();
         if (d) {
-          const u = new Set(n.getElementIds()), p = t.filter((h) => u.has(h.id)), f = await d.exportArtboardToDataURL(n, p, {
+          const u = new Set(n.getElementIds()), p = t.filter((b) => u.has(b.id)), f = await d.exportArtboardToDataURL(n, p, {
             scale: r.scale || 1,
             format: (r.format === "jpg" ? "jpeg" : r.format) || "png",
             quality: r.quality || 0.95
-          }), m = performance.now() - l, b = c / m;
+          }), $ = performance.now() - l, h = c / $;
           return {
             ...i,
             worker: {
-              time: m,
+              time: $,
               dataUrl: f.dataUrl,
               mainThreadBlockTime: f.mainThreadBlockTime
             },
-            speedup: b,
-            recommendation: b > 1.2 ? `Worker export is ${b.toFixed(2)}x faster - recommended for continuous export` : b < 0.8 ? `Main thread export is ${(1 / b).toFixed(2)}x faster - worker overhead not worth it for single exports` : "Performance is similar, but worker keeps UI responsive during export"
+            speedup: h,
+            recommendation: h > 1.2 ? `Worker export is ${h.toFixed(2)}x faster - recommended for continuous export` : h < 0.8 ? `Main thread export is ${(1 / h).toFixed(2)}x faster - worker overhead not worth it for single exports` : "Performance is similar, but worker keeps UI responsive during export"
           };
         }
       } catch (l) {
-        z.error("Worker benchmark failed:", l), i.recommendation = "Worker export not available - using main thread export";
+        W.error("Worker benchmark failed:", l), i.recommendation = "Worker export not available - using main thread export";
       }
     else
       i.recommendation = "Worker export not supported in this browser - using main thread export";
@@ -27177,23 +27252,23 @@ const on = class on {
     for (setTimeout(() => {
       d = !1;
     }, o); d; ) {
-      const $ = performance.now();
+      const y = performance.now();
       await this.exportArtboardToDataURL(n, t, a, {
         forceMainThread: !c
       });
-      const v = performance.now() - $;
-      i.push(v), c || (l += v), await new Promise((g) => setTimeout(g, Math.max(0, s - v)));
+      const x = performance.now() - y;
+      i.push(x), c || (l += x), await new Promise((m) => setTimeout(m, Math.max(0, s - x)));
     }
-    const u = i.length, p = i.reduce(($, v) => $ + v, 0) / u, f = Math.min(...i), m = Math.max(...i), b = u / o * 1e3, h = l / o * 100, S = h > 20 ? `Main thread blocked ${h.toFixed(1)}% of the time - STRONGLY recommend worker export` : h > 10 ? `Main thread blocked ${h.toFixed(1)}% of the time - consider worker export` : `Main thread blocked ${h.toFixed(1)}% of the time - performance is acceptable`;
+    const u = i.length, p = i.reduce((y, x) => y + x, 0) / u, f = Math.min(...i), $ = Math.max(...i), h = u / o * 1e3, b = l / o * 100, v = b > 20 ? `Main thread blocked ${b.toFixed(1)}% of the time - STRONGLY recommend worker export` : b > 10 ? `Main thread blocked ${b.toFixed(1)}% of the time - consider worker export` : `Main thread blocked ${b.toFixed(1)}% of the time - performance is acceptable`;
     return {
       totalExports: u,
       duration: o,
       averageTime: p,
       minTime: f,
-      maxTime: m,
+      maxTime: $,
       totalMainThreadBlockTime: l,
-      exportsPerSecond: b,
-      recommendation: S
+      exportsPerSecond: h,
+      recommendation: v
     };
   }
   /**
@@ -27265,60 +27340,60 @@ const on = class on {
     return "previewBackgroundColor" in t && delete t.previewBackgroundColor, t;
   }
 };
-on.CURRENT_VERSION = "2.0.0", on.workerManager = null, on.workerInitPromise = null;
-let yn = on;
-const Ra = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+ln.CURRENT_VERSION = "2.0.0", ln.workerManager = null, ln.workerInitPromise = null;
+let xn = ln;
+const Ua = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  ExportManager: yn,
-  default: yn
+  ExportManager: xn,
+  default: xn
 }, Symbol.toStringTag, { value: "Module" }));
 export {
-  Oa as A,
-  De as B,
-  ut as C,
-  Ie as D,
-  yn as E,
-  bn as F,
-  ca as G,
-  sa as H,
-  ce as I,
-  Ia as J,
-  An as K,
-  ie as L,
-  da as M,
-  na as N,
-  Un as O,
-  jt as P,
-  Vt as Q,
-  et as R,
-  Ra as S,
-  K as T,
-  dn as W,
-  ka as a,
-  ge as b,
-  R as c,
-  Da as d,
-  Pa as e,
-  On as f,
-  xa as g,
-  wa as h,
-  rt as i,
-  Sa as j,
-  va as k,
-  cn as l,
-  Ma as m,
-  Aa as n,
-  Xn as o,
-  Fa as p,
-  _n as q,
-  ot as r,
-  Ta as s,
-  Ca as t,
-  dt as u,
-  _a as v,
-  ft as w,
-  me as x,
-  Ea as y,
-  ne as z
+  Na as A,
+  Re as B,
+  gt as C,
+  Oe as D,
+  xn as E,
+  mn as F,
+  ua as G,
+  la as H,
+  ue as I,
+  Oa as J,
+  Dn as K,
+  de as L,
+  ha as M,
+  ra as N,
+  Hn as O,
+  Kt as P,
+  Yt as Q,
+  st as R,
+  Ua as S,
+  J as T,
+  un as W,
+  Aa as a,
+  xe as b,
+  B as c,
+  Ra as d,
+  Ma as e,
+  Ln as f,
+  Ca as g,
+  Ta as h,
+  ct as i,
+  _a as j,
+  ka as k,
+  dn as l,
+  La as m,
+  Fa as n,
+  Zn as o,
+  Ba as p,
+  Pn as q,
+  ft as r,
+  Pa as s,
+  Ea as t,
+  ht as u,
+  Ia as v,
+  bt as w,
+  ve as x,
+  Da as y,
+  re as z
 };
-//# sourceMappingURL=ExportManager-BTcyj4cf.js.map
+//# sourceMappingURL=ExportManager-B8Td7uR5.js.map