exodeui 6.3.29 → 6.3.30

package/dist/index.mjs

@@ -598,16 +598,16 @@ const ps = (g) => g, Rs = (g) => g > 0 ? 1 : 0, xs = (g) => g < 1 ? 0 : 1, is =
           const A = i[b[0].boneId] || [1, 0, 0, 1, 0, 0], _ = A[0] * A[3] - A[1] * A[2];
           let L = 0, X = 0;
           if (_ !== 0) {
-            const V = (A[2] * A[5] - A[3] * A[4]) / _, it = (A[1] * A[4] - A[0] * A[5]) / _, rt = Math.atan2(-A[1], A[3]);
+            const V = (A[2] * A[5] - A[3] * A[4]) / _, it = (A[1] * A[4] - A[0] * A[5]) / _, lt = Math.atan2(-A[1], A[3]);
             if (!H)
               L = V, X = it;
             else {
-              const ct = -A[2] / _, wt = A[0] / _, Mt = Math.hypot(ct, wt), It = M.length * Mt;
-              L = V - It * Math.sin(rt), X = it + It * Math.cos(rt);
+              const ht = -A[2] / _, wt = A[0] / _, Mt = Math.hypot(ht, wt), It = M.length * Mt;
+              L = V - It * Math.sin(lt), X = it + It * Math.cos(lt);
             }
-            const nt = Math.hypot(y - L, m - X), yt = Math.hypot(f - $, u - Y);
-            if (yt > 0 && nt > 0) {
-              const ct = Math.max(yt, 0.01), wt = Math.min(nt / ct, 3), Mt = $ + (f - $) * wt, It = Y + (u - Y) * wt, Ot = b[0].amount, At = b[1].amount, Tt = Math.min(Ot, At) * 2, zt = 1 - Math.pow(1 - Tt, 4);
+            const nt = Math.hypot(y - L, m - X), bt = Math.hypot(f - $, u - Y);
+            if (bt > 0 && nt > 0) {
+              const ht = Math.max(bt, 0.01), wt = Math.min(nt / ht, 3), Mt = $ + (f - $) * wt, It = Y + (u - Y) * wt, Ot = b[0].amount, At = b[1].amount, Tt = Math.min(Ot, At) * 2, zt = 1 - Math.pow(1 - Tt, 4);
               f = f * (1 - zt) + Mt * zt, u = u * (1 - zt) + It * zt;
             }
           }
@@ -2924,13 +2924,13 @@ class ci {
       this.warn("No state for object:", i.id);
       return;
     }
-    this.frameCount % 60, t.roundRect || (t.roundRect = (L, X, V, it, rt) => (this.drawRoundRect(t, L, X, V, it, rt), t));
+    this.frameCount % 60, t.roundRect || (t.roundRect = (L, X, V, it, lt) => (this.drawRoundRect(t, L, X, V, it, lt), t));
     const s = e.geometry ? this.deepMerge(i.geometry, e.geometry) : i.geometry, n = e.style ? this.deepMerge(i.style, e.style) : i.style;
     let a = (s == null ? void 0 : s.width) || ((p = i.geometry) == null ? void 0 : p.width) || i.width || 0, r = (s == null ? void 0 : s.height) || ((y = i.geometry) == null ? void 0 : y.height) || i.height || 0;
     if ((a === 0 || r === 0) && (s != null && s.points) && Array.isArray(s.points) && s.points.length > 0) {
       let L = 1 / 0, X = -1 / 0, V = 1 / 0, it = -1 / 0;
-      s.points.forEach((rt) => {
-        L = Math.min(L, rt.x), X = Math.max(X, rt.x), V = Math.min(V, rt.y), it = Math.max(it, rt.y);
+      s.points.forEach((lt) => {
+        L = Math.min(L, lt.x), X = Math.max(X, lt.x), V = Math.min(V, lt.y), it = Math.max(it, lt.y);
       }), a === 0 && (a = X - L), r === 0 && (r = it - V);
     }
     const l = (L) => {
@@ -2955,23 +2955,23 @@ class ci {
       return;
     const u = i.repeaterConfig, h = u && u.isEnabled && u.count > 1, d = h ? u.count : 1;
     for (let L = 0; L < d; L++) {
-      let X = e.x !== void 0 ? e.x : ((m = e.transform) == null ? void 0 : m.x) ?? 0, V = e.y !== void 0 ? e.y : ((b = e.transform) == null ? void 0 : b.y) ?? 0, it = e.rotation !== void 0 ? e.rotation : ((v = e.transform) == null ? void 0 : v.rotation) ?? 0, rt = e.scale_x !== void 0 ? e.scale_x : ((S = e.transform) == null ? void 0 : S.scale_x) ?? 1, nt = e.scale_y !== void 0 ? e.scale_y : ((C = e.transform) == null ? void 0 : C.scale_y) ?? 1;
+      let X = e.x !== void 0 ? e.x : ((m = e.transform) == null ? void 0 : m.x) ?? 0, V = e.y !== void 0 ? e.y : ((b = e.transform) == null ? void 0 : b.y) ?? 0, it = e.rotation !== void 0 ? e.rotation : ((v = e.transform) == null ? void 0 : v.rotation) ?? 0, lt = e.scale_x !== void 0 ? e.scale_x : ((S = e.transform) == null ? void 0 : S.scale_x) ?? 1, nt = e.scale_y !== void 0 ? e.scale_y : ((C = e.transform) == null ? void 0 : C.scale_y) ?? 1;
       if (h && L > 0) {
         if (u.type === "Linear") {
-          const ht = u.offsetX || 0, bt = u.offsetY || 0, j = u.rotation || 0, z = u.scale !== void 0 ? u.scale : 1;
-          X += L * ht, V += L * bt, it += L * j, rt *= Math.pow(z, L), nt *= Math.pow(z, L);
+          const at = u.offsetX || 0, gt = u.offsetY || 0, j = u.rotation || 0, z = u.scale !== void 0 ? u.scale : 1;
+          X += L * at, V += L * gt, it += L * j, lt *= Math.pow(z, L), nt *= Math.pow(z, L);
         } else if (u.type === "Grid") {
-          const ht = u.cols || Math.ceil(Math.sqrt(u.count)), bt = u.gapX || 0, j = u.gapY || 0, z = Math.floor(L / ht), D = L % ht, et = a + bt, gt = r + j;
-          X += D * et, V += z * gt;
+          const at = u.cols || Math.ceil(Math.sqrt(u.count)), gt = u.gapX || 0, j = u.gapY || 0, z = Math.floor(L / at), D = L % at, et = a + gt, mt = r + j;
+          X += D * et, V += z * mt;
         } else if (u.type === "Radial") {
-          const ht = u.radius || 100, bt = u.startAngle || 0, z = (u.endAngle || 360) - bt, D = u.count > 1 ? z / (z === 360 ? u.count : u.count - 1) : 0, et = bt + L * D, gt = et * Math.PI / 180;
-          X = e.x + ht * Math.cos(gt), V = e.y + ht * Math.sin(gt), it += et;
+          const at = u.radius || 100, gt = u.startAngle || 0, z = (u.endAngle || 360) - gt, D = u.count > 1 ? z / (z === 360 ? u.count : u.count - 1) : 0, et = gt + L * D, mt = et * Math.PI / 180;
+          X = e.x + at * Math.cos(mt), V = e.y + at * Math.sin(mt), it += et;
         }
       }
-      const yt = i.type === "Group" || i.type === "Frame" || i.type === "Component", ct = a > 0 && r > 0;
-      if (!yt && ct) {
-        const ht = (((w = n.shadow) == null ? void 0 : w.isEnabled) !== !1 ? (((I = n.shadow) == null ? void 0 : I.blur) || 0) + 10 : 0) + (((M = n.blur) == null ? void 0 : M.isEnabled) !== !1 && ((k = n.blur) == null ? void 0 : k.radius) || 0) + 20;
-        if (!this.isObjectInView(t, X, V, a, r, ht))
+      const bt = i.type === "Group" || i.type === "Frame" || i.type === "Component", ht = a > 0 && r > 0;
+      if (!bt && ht) {
+        const at = (((w = n.shadow) == null ? void 0 : w.isEnabled) !== !1 ? (((I = n.shadow) == null ? void 0 : I.blur) || 0) + 10 : 0) + (((M = n.blur) == null ? void 0 : M.isEnabled) !== !1 && ((k = n.blur) == null ? void 0 : k.radius) || 0) + 20;
+        if (!this.isObjectInView(t, X, V, a, r, at))
           continue;
       }
       this.debug_objectsRendered++, t.save();
@@ -2992,33 +2992,33 @@ class ci {
         hue: 0
       } : Et;
       if (e && ut && (e.geometry = e.geometry || {}, e.geometry.adjustments = { ...ut }), ut) {
-        const ht = (ut.exposure || 0) / 100, bt = ut.contrast || 0, j = 1 + (ut.saturation || 0) / 100, z = (ut.temperature || 0) / 200, D = (ut.tint || 0) / 200, et = (ut.highlights || 0) / 500, gt = (ut.shadows || 0) / 500;
+        const at = (ut.exposure || 0) / 100, gt = ut.contrast || 0, j = 1 + (ut.saturation || 0) / 100, z = (ut.temperature || 0) / 200, D = (ut.tint || 0) / 200, et = (ut.highlights || 0) / 500, mt = (ut.shadows || 0) / 500;
         let Pt = "", Ct = "SourceGraphic";
-        if (ht !== 0 && (Pt += `
+        if (at !== 0 && (Pt += `
                 <feComponentTransfer in="${Ct}" result="exposure">
-                    <feFuncR type="linear" slope="1" intercept="${ht}"/>
-                    <feFuncG type="linear" slope="1" intercept="${ht}"/>
-                    <feFuncB type="linear" slope="1" intercept="${ht}"/>
-                </feComponentTransfer>`, Ct = "exposure"), bt !== 0) {
-          const mt = (bt + 100) / 100, F = 0.5 * (1 - mt);
+                    <feFuncR type="linear" slope="1" intercept="${at}"/>
+                    <feFuncG type="linear" slope="1" intercept="${at}"/>
+                    <feFuncB type="linear" slope="1" intercept="${at}"/>
+                </feComponentTransfer>`, Ct = "exposure"), gt !== 0) {
+          const yt = (gt + 100) / 100, F = 0.5 * (1 - yt);
           Pt += `
                 <feComponentTransfer in="${Ct}" result="contrast">
-                    <feFuncR type="linear" slope="${mt}" intercept="${F}"/>
-                    <feFuncG type="linear" slope="${mt}" intercept="${F}"/>
-                    <feFuncB type="linear" slope="${mt}" intercept="${F}"/>
+                    <feFuncR type="linear" slope="${yt}" intercept="${F}"/>
+                    <feFuncG type="linear" slope="${yt}" intercept="${F}"/>
+                    <feFuncB type="linear" slope="${yt}" intercept="${F}"/>
                 </feComponentTransfer>`, Ct = "contrast";
         }
         if (j !== 1 && (Pt += `<feColorMatrix in="${Ct}" type="saturate" values="${j}" result="saturate"/>`, Ct = "saturate"), ut.hue && (Pt += `<feColorMatrix in="${Ct}" type="hueRotate" values="${ut.hue}" result="hue"/>`, Ct = "hue"), ut.negative) {
-          const mt = 1 - ut.negative / 50;
+          const yt = 1 - ut.negative / 50;
           Pt += `
                 <feColorMatrix in="${Ct}" type="matrix" result="invert"
-                    values="${mt} 0 0 0 ${1 - mt}
-                            0 ${mt} 0 0 ${1 - mt}
-                            0 0 ${mt} 0 ${1 - mt}
+                    values="${yt} 0 0 0 ${1 - yt}
+                            0 ${yt} 0 0 ${1 - yt}
+                            0 0 ${yt} 0 ${1 - yt}
                             0 0 0 1 0"/>`, Ct = "invert";
         }
-        if (z !== 0 || D !== 0 || et !== 0 || gt !== 0) {
-          const mt = 1 + et + gt, F = mt * (1 + z - D / 2), Lt = mt * (1 + D), jt = mt * (1 - z - D / 2), Vt = ut.shadows * 0.1 / 255, ce = [
+        if (z !== 0 || D !== 0 || et !== 0 || mt !== 0) {
+          const yt = 1 + et + mt, F = yt * (1 + z - D / 2), Lt = yt * (1 + D), jt = yt * (1 - z - D / 2), Vt = ut.shadows * 0.1 / 255, ce = [
             F,
             0,
             0,
@@ -3043,7 +3043,7 @@ class ci {
           Pt += `<feColorMatrix in="${Ct}" type="matrix" values="${ce}" result="advanced"/>`, Ct = "advanced";
         }
         if (ut.blur && (Pt += `<feGaussianBlur in="${Ct}" stdDeviation="${ut.blur}" result="blur"/>`, Ct = "blur"), Pt) {
-          const mt = `<svg xmlns="http://www.w3.org/2000/svg"><filter id="f" color-interpolation-filters="sRGB">${Pt}</filter></svg>`, F = btoa(mt);
+          const yt = `<svg xmlns="http://www.w3.org/2000/svg"><filter id="f" color-interpolation-filters="sRGB">${Pt}</filter></svg>`, F = btoa(yt);
           wt.push(`url('data:image/svg+xml;base64,${F}#f')`);
         }
       }
@@ -3052,7 +3052,7 @@ class ci {
       t.globalAlpha = vt * xt;
       const Xt = e.compositeOperation || e.blendMode;
       if (Xt && Xt !== "Normal") {
-        const ht = Xt.toLowerCase();
+        const at = Xt.toLowerCase();
         [
           "multiply",
           "screen",
@@ -3082,7 +3082,7 @@ class ci {
           "xor",
           "multiply",
           "screen"
-        ].includes(ht) && (t.globalCompositeOperation = ht);
+        ].includes(at) && (t.globalCompositeOperation = at);
       }
       const Bt = t, Dt = e.masks || (i.maskedBy ? [{
         maskId: i.maskedBy,
@@ -3093,69 +3093,72 @@ class ci {
         isVisible: !0
       }] : []);
       let Ht = !1;
-      const te = Dt.filter((ht) => ht.isVisible !== !1 && o.has(ht.maskId));
+      const te = Dt.filter((at) => at.isVisible !== !1 && o.has(at.maskId));
       if (te.length > 0) {
-        const ht = te[0], bt = o.get(ht.maskId), j = this.objectStates.get(bt.id);
+        const at = te[0], gt = o.get(at.maskId), j = this.objectStates.get(gt.id);
         j && j.visible !== !1 && (Ht = !0, (!this.maskBuffer || this.maskBuffer.width !== this.canvasWidth || this.maskBuffer.height !== this.canvasHeight) && (this.maskBuffer = document.createElement("canvas"), this.maskBuffer.width = this.canvasWidth, this.maskBuffer.height = this.canvasHeight, this.maskCtx = this.maskBuffer.getContext("2d", { willReadFrequently: !0 }), this.maskCtx && (this.maskCtx.imageSmoothingEnabled = !0, this.maskCtx.imageSmoothingQuality = "high")), this.maskCtx.setTransform(1, 0, 0, 1, 0, 0), this.maskCtx.globalCompositeOperation = "source-over", this.maskCtx.globalAlpha = 1, this.maskCtx.filter = "none", this.maskCtx.clearRect(0, 0, this.maskBuffer.width, this.maskBuffer.height), this.rootTransform && this.maskCtx.setTransform(this.rootTransform), i.parentId && this.applyAbsoluteTransform(this.maskCtx, i.parentId, o), this.maskCtx.save(), this.maskCtx.globalAlpha = 1, t = this.maskCtx, t.filter = Bt.filter);
       }
       t.translate(Math.round(X), Math.round(V)), t.rotate(it * Math.PI / 180);
       const ue = e.skew_x || 0, pe = e.skew_y || 0;
-      (ue !== 0 || pe !== 0) && t.transform(1, Math.tan(pe * Math.PI / 180), Math.tan(ue * Math.PI / 180), 1, 0, 0);
+      if (ue !== 0 || pe !== 0) {
+        const at = Math.tan(ue * Math.PI / 180), gt = Math.tan(pe * Math.PI / 180);
+        t.transform(1 + at * gt, gt, at, 1, 0, 0);
+      }
       const Qt = e.rotate_x !== void 0 ? e.rotate_x : ((x = e.transform) == null ? void 0 : x.rotate_x) ?? 0, me = e.rotate_y !== void 0 ? e.rotate_y : ((O = e.transform) == null ? void 0 : O.rotate_y) ?? 0, ye = 1 + (e.translate_z !== void 0 ? e.translate_z : ((W = e.transform) == null ? void 0 : W.translate_z) ?? 0) / 1e3, Se = (e.flip_x === !0 ? -1 : 1) * Math.cos(me * Math.PI / 180) * ye, Pe = (e.flip_y === !0 ? -1 : 1) * Math.cos(Qt * Math.PI / 180) * ye;
       t.scale(
-        rt * Se,
+        lt * Se,
         nt * Pe
       ), n.shadow && n.shadow.isEnabled !== !0 && ((n.shadow.blur || 0) > 0 || Math.abs(n.shadow.offsetX || 0) > 0 || Math.abs(n.shadow.offsetY || 0) > 0) && (n.shadow.isEnabled = !0);
       const ae = n.shadow;
       if (ae && ae.isEnabled !== !1) {
-        let ht = ae.color || "#000000";
-        ($ = (B = this.artboard) == null ? void 0 : B.tokens) != null && $.colors && this.artboard.tokens.colors[ht] && (ht = this.artboard.tokens.colors[ht]);
-        const bt = this.normalizeOpacity(ae.opacity ?? 100), j = ae.spread || 0, D = (ae.blur || 0) + j * 1.5;
-        let et = ht;
-        if (ht.startsWith("#")) {
-          const Ct = ht.replace("#", ""), Wt = parseInt(Ct.substring(0, 2), 16), mt = parseInt(Ct.substring(2, 4), 16), F = parseInt(Ct.substring(4, 6), 16);
-          et = `rgba(${Wt}, ${mt}, ${F}, ${bt})`;
-        } else if (ht.startsWith("rgba")) {
-          const Ct = ht.match(/[\d.]+/g);
+        let at = ae.color || "#000000";
+        ($ = (B = this.artboard) == null ? void 0 : B.tokens) != null && $.colors && this.artboard.tokens.colors[at] && (at = this.artboard.tokens.colors[at]);
+        const gt = this.normalizeOpacity(ae.opacity ?? 100), j = ae.spread || 0, D = (ae.blur || 0) + j * 1.5;
+        let et = at;
+        if (at.startsWith("#")) {
+          const Ct = at.replace("#", ""), Wt = parseInt(Ct.substring(0, 2), 16), yt = parseInt(Ct.substring(2, 4), 16), F = parseInt(Ct.substring(4, 6), 16);
+          et = `rgba(${Wt}, ${yt}, ${F}, ${gt})`;
+        } else if (at.startsWith("rgba")) {
+          const Ct = at.match(/[\d.]+/g);
           if (Ct && Ct.length >= 4) {
-            const Wt = Ct[0], mt = Ct[1], F = Ct[2], Lt = Ct[3];
-            et = `rgba(${Wt}, ${mt}, ${F}, ${parseFloat(Lt) * bt})`;
+            const Wt = Ct[0], yt = Ct[1], F = Ct[2], Lt = Ct[3];
+            et = `rgba(${Wt}, ${yt}, ${F}, ${parseFloat(Lt) * gt})`;
           }
         }
-        const gt = t.getTransform(), Pt = Math.sqrt(gt.a * gt.a + gt.b * gt.b) || 1;
+        const mt = t.getTransform(), Pt = Math.sqrt(mt.a * mt.a + mt.b * mt.b) || 1;
         t.shadowColor = et, t.shadowBlur = D * Pt, t.shadowOffsetX = (ae.offsetX || 0) * Pt, t.shadowOffsetY = (ae.offsetY || 0) * Pt;
       }
       const ee = i.liquidFill || ((Y = i.style) == null ? void 0 : Y.liquidFill);
       if (ee && ee.enabled) {
         t.save();
-        const ht = ee.fillLevel ?? 0.5;
+        const at = ee.fillLevel ?? 0.5;
         t.beginPath();
-        const bt = r / 2 - r * ht;
-        t.rect(-a / 2, bt, a, r * ht), t.clip(), t.fillStyle = ee.color || "#3b82f6", t.globalAlpha = t.globalAlpha * (ee.opacity ?? 1);
+        const gt = r / 2 - r * at;
+        t.rect(-a / 2, gt, a, r * at), t.clip(), t.fillStyle = ee.color || "#3b82f6", t.globalAlpha = t.globalAlpha * (ee.opacity ?? 1);
       }
       if ((s == null ? void 0 : s.type) === "Text")
         this._renderText(t, i, f, n, e, a, r);
       else if ((s == null ? void 0 : s.type) === "Image") {
-        const ht = s.originalSrc || s.src;
-        if (ht) {
-          let bt = this.imageCache.get(ht);
-          bt || (bt = new Image(), bt.onload = () => {
-            this.log(`[ExodeUI] Image loaded successfully, size: ${bt.naturalWidth}x${bt.naturalHeight}`);
-          }, bt.onerror = (D) => {
-            console.error("[ExodeUI] Image load failed:", D, `Src preview: ${ht.substring(0, 100)}...`);
-          }, bt.src = ht, this.imageCache.set(ht, bt));
+        const at = s.originalSrc || s.src;
+        if (at) {
+          let gt = this.imageCache.get(at);
+          gt || (gt = new Image(), gt.onload = () => {
+            this.log(`[ExodeUI] Image loaded successfully, size: ${gt.naturalWidth}x${gt.naturalHeight}`);
+          }, gt.onerror = (D) => {
+            console.error("[ExodeUI] Image load failed:", D, `Src preview: ${at.substring(0, 100)}...`);
+          }, gt.src = at, this.imageCache.set(at, gt));
           const j = n.stroke && n.stroke.width > 0 && n.stroke.isEnabled !== !1, z = (((H = n.stroke) == null ? void 0 : H.alignment) || "center").toLowerCase();
           if (j && (z === "outside" || z === "center") && this.applyStrokeAlignment(t, n, f, a, r, c), n.fill && n.fill.type !== "None") {
             t.save();
             const D = t.globalAlpha, et = this.createCanvasFill(t, n.fill, a, r);
             t.fillStyle = et || n.fill.color || "transparent", t.globalAlpha = D * this.normalizeOpacity(n.fill.opacity ?? 100), c !== 0 ? (this.drawRoundRect(t, -a / 2, -r / 2, a, r, c), t.fill()) : t.fillRect(-a / 2, -r / 2, a, r), t.globalAlpha = D, t.restore();
           }
-          bt.complete && bt.naturalWidth > 0 ? (c !== 0 ? (t.save(), this.drawRoundRect(t, -a / 2, -r / 2, a, r, c), t.clip(), t.drawImage(bt, -a / 2, -r / 2, a, r), t.restore()) : t.drawImage(bt, -a / 2, -r / 2, a, r), j && z === "inside" && this.applyStrokeAlignment(t, n, f, a, r, c)) : j && z === "inside" && this.applyStrokeAlignment(t, n, f, a, r, c);
+          gt.complete && gt.naturalWidth > 0 ? (c !== 0 ? (t.save(), this.drawRoundRect(t, -a / 2, -r / 2, a, r, c), t.clip(), t.drawImage(gt, -a / 2, -r / 2, a, r), t.restore()) : t.drawImage(gt, -a / 2, -r / 2, a, r), j && z === "inside" && this.applyStrokeAlignment(t, n, f, a, r, c)) : j && z === "inside" && this.applyStrokeAlignment(t, n, f, a, r, c);
         }
       } else if (s.type === "SVG") {
-        const ht = s.svgContent;
-        if (ht) {
-          const bt = n.palette || [], j = n.fill, z = n.stroke, D = j ? this.normalizeOpacity(j.opacity ?? 100) : 1, et = (j == null ? void 0 : j.type) === "Solid" && (!z || z.isEnabled === !1 || z.type === "Solid" && z.color === j.color), gt = j && j.type !== "None" ? et ? "monochrome" : j.type === "Solid" ? (j.color || "") + "|opacity:" + D : JSON.stringify(j.stops || []) + "|opacity:" + D : "", Pt = z && z.isEnabled !== !1 && (z.width || 0) > 0 ? et ? [
+        const at = s.svgContent;
+        if (at) {
+          const gt = n.palette || [], j = n.fill, z = n.stroke, D = j ? this.normalizeOpacity(j.opacity ?? 100) : 1, et = (j == null ? void 0 : j.type) === "Solid" && (!z || z.isEnabled === !1 || z.type === "Solid" && z.color === j.color), mt = j && j.type !== "None" ? et ? "monochrome" : j.type === "Solid" ? (j.color || "") + "|opacity:" + D : JSON.stringify(j.stops || []) + "|opacity:" + D : "", Pt = z && z.isEnabled !== !1 && (z.width || 0) > 0 ? et ? [
             "monochrome",
             z.width || 0,
             z.trimStart ?? 0,
@@ -3176,8 +3179,8 @@ class ci {
             z.dashOffset ?? 0
           ].join("|") : "nostroke", Ct = [
             i.id,
-            bt.join("_"),
-            gt,
+            gt.join("_"),
+            mt,
             Pt,
             e.opacity ?? 100,
             e.visible !== !1 ? "v" : "h"
@@ -3185,17 +3188,17 @@ class ci {
           let Wt = this.imageCache.get(Ct);
           if (!Wt) {
             Wt = new Image(), Wt.crossOrigin = "anonymous";
-            let F = ht;
+            let F = at;
             F.match(/xmlns=["']http:\/\/www\.w3\.org\/2000\/svg["']/i) || (F = F.replace(/<svg([^>]*)>/i, (tt, dt) => `<svg xmlns="http://www.w3.org/2000/svg"${dt}>`));
             let Lt = s.width || a || 100, jt = s.height || r || 100;
             const Vt = F.match(/viewBox=["']\s*0\s+0\s+([\d.]+)\s+([\d.]+)\s*["']/i);
             if (Vt && (Lt = parseFloat(Vt[1]), jt = parseFloat(Vt[2])), F = F.replace(/<svg([^>]*)>/i, (tt, dt) => {
               let G = dt.replace(/\b(?:width|height)=["'][^"']*["']/gi, " ");
               return G.match(/\bviewBox=/i) || (G += ` viewBox="0 0 ${Lt} ${jt}"`), G.match(/\bpreserveAspectRatio=/i) || (G += ' preserveAspectRatio="none"'), G += ' width="100%" height="100%"', `<svg${G}>`;
-            }), s.colors && s.colors.length > 0 && bt.length > 0 && s.colors.forEach((tt, dt) => {
-              if (bt[dt]) {
+            }), s.colors && s.colors.length > 0 && gt.length > 0 && s.colors.forEach((tt, dt) => {
+              if (gt[dt]) {
                 const G = tt.replace(/[-\/\\^$*+?.()|[\]{}]/g, "\\$&"), st = new RegExp(G, "gi");
-                F = F.replace(st, bt[dt]);
+                F = F.replace(st, gt[dt]);
               }
             }), j && j.type && j.type !== "None") {
               if (j.type === "Solid" && j.color) {
@@ -3249,7 +3252,7 @@ class ci {
                 `stroke:${G}`
               );
               let J = s.width || a || 100, Ft = s.height || r || 100;
-              const Ut = ht.match(/viewBox=["']\s*0\s+0\s+([\d.]+)\s+([\d.]+)\s*["']/i);
+              const Ut = at.match(/viewBox=["']\s*0\s+0\s+([\d.]+)\s+([\d.]+)\s*["']/i);
               if (Ut) {
                 const Gt = parseFloat(Ut[1]), ie = parseFloat(Ut[2]);
                 !isNaN(Gt) && !isNaN(ie) && (J = Gt, Ft = ie);
@@ -3277,7 +3280,7 @@ class ci {
                 const Gt = z.dashArray.join(" ");
                 F = F.replace(/\bstroke-dasharray\s*=\s*["'][^"']*["']/gi, `stroke-dasharray="${Gt}"`), F = F.replace(/stroke-dasharray\s*:\s*[^;"')]+/gi, `stroke-dasharray:${Gt}`), z.dashOffset && (F = F.replace(/\bstroke-dashoffset\s*=\s*["'][^"']*["']/gi, `stroke-dashoffset="${z.dashOffset}"`), F = F.replace(/stroke-dashoffset\s*:\s*[^;"')]+/gi, `stroke-dashoffset:${z.dashOffset}`));
               }
-              if (!/\bstroke\s*=\s*["']/i.test(ht) && !new RegExp("(?<![a-z-])stroke\\s*:", "i").test(ht)) {
+              if (!/\bstroke\s*=\s*["']/i.test(at) && !new RegExp("(?<![a-z-])stroke\\s*:", "i").test(at)) {
                 let Gt = "", ie = "";
                 if ($e) {
                   const he = s.width || a || 100, re = s.height || r || 100, le = (he + re) * 2, we = Math.max(0, Math.min(1, Ae)), We = Math.max(0, Math.min(1, Oe)), Ge = (Re % 1 + 1) % 1, De = (xe % 1 + 1) % 1;
@@ -3295,70 +3298,70 @@ class ci {
                 ), F = F.replace(/<\/svg>/i, "</g></svg>");
               }
             } else z && z.isEnabled === !1 && (F = F.replace(/\bstroke\s*=\s*["'][^"']*["']/gi, 'stroke="none"'), F = F.replace(new RegExp(`(?<![a-z-])stroke\\s*:\\s*(?!none|transparent)[^;"')]+`, "gi"), "stroke:none"));
-            const ft = new Blob([F], { type: "image/svg+xml" }), lt = URL.createObjectURL(ft);
+            const ft = new Blob([F], { type: "image/svg+xml" }), ct = URL.createObjectURL(ft);
             Wt.onload = () => {
-              if (URL.revokeObjectURL(lt), this.frameCount % 900 === 0) {
+              if (URL.revokeObjectURL(ct), this.frameCount % 900 === 0) {
                 const tt = this.imageCache.get(Ct);
                 tt && this.debugLog(`SVG Payload Ready: ${i.name || i.id} (${tt.naturalWidth}x${tt.naturalHeight})`);
               }
             }, Wt.onerror = () => {
-              URL.revokeObjectURL(lt), this.debugLog(`SVG Error: Failed to load payload for ${i.name || i.id}`);
-            }, Wt.src = lt, this.imageCache.set(Ct, Wt);
+              URL.revokeObjectURL(ct), this.debugLog(`SVG Error: Failed to load payload for ${i.name || i.id}`);
+            }, Wt.src = ct, this.imageCache.set(Ct, Wt);
           }
-          let mt = null;
-          if (Wt.complete && Wt.naturalWidth > 0 ? (mt = Wt, this.lastValidSvgImgMap.set(i.id, Wt)) : mt = this.lastValidSvgImgMap.get(i.id) || null, mt && mt.complete && mt.naturalWidth > 0) {
+          let yt = null;
+          if (Wt.complete && Wt.naturalWidth > 0 ? (yt = Wt, this.lastValidSvgImgMap.set(i.id, Wt)) : yt = this.lastValidSvgImgMap.get(i.id) || null, yt && yt.complete && yt.naturalWidth > 0) {
             const F = Math.max(1, a), Lt = Math.max(1, r);
             if (et && (j == null ? void 0 : j.type) === "Solid") {
-              this.maskBuffer || (this.maskBuffer = document.createElement("canvas"), this.maskCtx = this.maskBuffer.getContext("2d")), this.maskBuffer.width = F, this.maskBuffer.height = Lt, this.maskCtx.setTransform(1, 0, 0, 1, 0, 0), this.maskCtx.globalCompositeOperation = "source-over", this.maskCtx.globalAlpha = 1, this.maskCtx.filter = "none", this.maskCtx.clearRect(0, 0, F, Lt), this.maskCtx.drawImage(mt, 0, 0, F, Lt), this.maskCtx.globalCompositeOperation = "source-in";
+              this.maskBuffer || (this.maskBuffer = document.createElement("canvas"), this.maskCtx = this.maskBuffer.getContext("2d")), this.maskBuffer.width = F, this.maskBuffer.height = Lt, this.maskCtx.setTransform(1, 0, 0, 1, 0, 0), this.maskCtx.globalCompositeOperation = "source-over", this.maskCtx.globalAlpha = 1, this.maskCtx.filter = "none", this.maskCtx.clearRect(0, 0, F, Lt), this.maskCtx.drawImage(yt, 0, 0, F, Lt), this.maskCtx.globalCompositeOperation = "source-in";
               const jt = j.color || "#000000", Vt = this.normalizeOpacity(j.opacity ?? 100);
               this.maskCtx.fillStyle = jt, this.maskCtx.globalAlpha = Vt, this.maskCtx.fillRect(0, 0, F, Lt), t.drawImage(this.maskBuffer, -F / 2, -Lt / 2, F, Lt);
-            } else c !== 0 ? (t.save(), this.drawRoundRect(t, -F / 2, -Lt / 2, F, Lt, c), t.clip(), t.drawImage(mt, -F / 2, -Lt / 2, F, Lt), t.restore()) : t.drawImage(mt, -F / 2, -Lt / 2, F, Lt);
+            } else c !== 0 ? (t.save(), this.drawRoundRect(t, -F / 2, -Lt / 2, F, Lt, c), t.clip(), t.drawImage(yt, -F / 2, -Lt / 2, F, Lt), t.restore()) : t.drawImage(yt, -F / 2, -Lt / 2, F, Lt);
           }
         }
       } else if (f.type === "LineGraph")
         this.renderLineGraph(t, f, a, r);
       else if (i.type === "Shape") {
         if (this.applyPath(t, f, a, r, c), t.save(), n.blur && n.blur.amount > 0 && (t.filter = `blur(${n.blur.amount}px)`), n.fill) {
-          const ht = t.globalAlpha;
+          const at = t.globalAlpha;
           if (((A = n.fill) == null ? void 0 : A.type) === "Image" && (n.fill.originalSrc || n.fill.src)) {
-            const bt = n.fill.originalSrc || n.fill.src;
-            let j = this.imageCache.get(bt);
-            j || (j = new Image(), j.src = bt, this.imageCache.set(bt, j)), j.complete && j.naturalWidth > 0 && (t.save(), this.applyPath(t, f, a, r, c), t.clip(), this.renderFittedImage(t, j, -a / 2, -r / 2, a, r, n.fill.fillMode), t.restore());
+            const gt = n.fill.originalSrc || n.fill.src;
+            let j = this.imageCache.get(gt);
+            j || (j = new Image(), j.src = gt, this.imageCache.set(gt, j)), j.complete && j.naturalWidth > 0 && (t.save(), this.applyPath(t, f, a, r, c), t.clip(), this.renderFittedImage(t, j, -a / 2, -r / 2, a, r, n.fill.fillMode), t.restore());
           } else {
-            const bt = this.createCanvasFill(t, n.fill, a, r);
-            t.fillStyle = bt || (typeof n.fill == "string" ? n.fill : n.fill.color || "transparent"), t.globalAlpha = ht * this.normalizeOpacity(n.fill.opacity ?? 100), this.applyPath(t, f, a, r, c), t.fill();
+            const gt = this.createCanvasFill(t, n.fill, a, r);
+            t.fillStyle = gt || (typeof n.fill == "string" ? n.fill : n.fill.color || "transparent"), t.globalAlpha = at * this.normalizeOpacity(n.fill.opacity ?? 100), this.applyPath(t, f, a, r, c), t.fill();
           }
-          t.globalAlpha = ht;
+          t.globalAlpha = at;
         }
         t.restore(), n.stroke && n.stroke.width > 0 && this.applyStrokeAlignment(t, n, f, a, r, c);
       } else if (i.type === "Frame" || i.type === "Group" && !i.isStructuralGroup) {
-        const ht = e.width ?? s.width ?? i.width ?? a, bt = e.height ?? s.height ?? i.height ?? r, j = c;
-        if (t.save(), t.beginPath(), this.drawRoundRect(t, -ht / 2, -bt / 2, ht, bt, j), n.fill && n.fill.type !== "None") {
-          const z = t.globalAlpha, D = this.createCanvasFill(t, n.fill, ht, bt);
+        const at = e.width ?? s.width ?? i.width ?? a, gt = e.height ?? s.height ?? i.height ?? r, j = c;
+        if (t.save(), t.beginPath(), this.drawRoundRect(t, -at / 2, -gt / 2, at, gt, j), n.fill && n.fill.type !== "None") {
+          const z = t.globalAlpha, D = this.createCanvasFill(t, n.fill, at, gt);
           t.fillStyle = D || n.fill.color || "transparent", t.globalAlpha = z * this.normalizeOpacity(n.fill.opacity ?? 100), t.fill(), t.globalAlpha = z;
         }
         if (t.restore(), n.stroke && n.stroke.width > 0 && n.stroke.isEnabled !== !1) {
           const z = { type: "Rectangle" };
-          this.applyStrokeAlignment(t, n, z, ht, bt, j);
+          this.applyStrokeAlignment(t, n, z, at, gt, j);
         }
       } else i.type === "Group" && i.isStructuralGroup || (i.type === "Component" && i.variant === "inputbox" ? this.renderInputBox(t, i) : i.type === "Component" && i.variant === "button" ? this.renderButton(t, i) : i.type === "Component" && i.variant === "toggle_button" ? this.renderToggleButton(t, i) : i.type === "Toggle" || i.type === "Component" && i.variant === "toggle" ? this.renderToggle(t, i) : i.type === "Slider" || i.type === "Component" && i.variant === "slider" ? this.renderSlider(t, i) : i.type === "Dropdown" || i.type === "Component" && i.variant === "dropdown" ? this.renderDropdown(t, i) : i.type === "ListView" || i.type === "Component" && i.variant === "listview" ? this.renderListView(t, i) : i.type === "Checkbox" || i.type === "Component" && i.variant === "checkbox" ? this.renderCheckbox(t, i) : i.type === "RadioGroup" || i.type === "Component" && i.variant === "radiogroup" ? this.renderRadioGroup(t, i) : i.type === "BarChart" || i.type === "Component" && i.variant === "barchart" ? this.renderBarChart(t, i) : i.type === "PieChart" || i.type === "Component" && i.variant === "piechart" ? this.renderPieChart(t, i) : i.type === "Joystick" || i.type === "Component" && i.variant === "joystick" ? this.renderJoystick(t, i) : this.frameCount % 300 === 0 && this.warn("[Engine] Unhandled object type in renderObject:", i.type, "Geo:", (_ = i.geometry) == null ? void 0 : _.type));
       if (this.applyArtEffectOverlay(t, i, f, a, r, c), Ot && At === "BackgroundBlur" && this.applyBackgroundBlurGlass(t, f, a, r, c, It), ee && ee.enabled && t.restore(), i.children && i.children.length > 0) {
-        const bt = i.type === "Frame", j = i.clipsContent !== void 0 ? i.clipsContent : i.clipContent !== void 0 ? i.clipContent : bt;
+        const gt = i.type === "Frame", j = i.clipsContent !== void 0 ? i.clipsContent : i.clipContent !== void 0 ? i.clipContent : gt;
         if (t.save(), j) {
           t.beginPath();
-          const D = e.width ?? (s == null ? void 0 : s.width) ?? i.width ?? 0, et = e.height ?? (s == null ? void 0 : s.height) ?? i.height ?? 0, gt = e.cornerRadius ?? (s == null ? void 0 : s.corner_radius) ?? i.cornerRadius ?? 0;
-          this.drawRoundRect(t, -D / 2, -et / 2, D, et, gt), t.clip();
+          const D = e.width ?? (s == null ? void 0 : s.width) ?? i.width ?? 0, et = e.height ?? (s == null ? void 0 : s.height) ?? i.height ?? 0, mt = e.cornerRadius ?? (s == null ? void 0 : s.corner_radius) ?? i.cornerRadius ?? 0;
+          this.drawRoundRect(t, -D / 2, -et / 2, D, et, mt), t.clip();
         }
         let z = 0;
         for (i.children.forEach((D) => {
           const et = o.get(D);
           if (!et) return;
-          const gt = this.objectStates.get(D), Pt = (gt == null ? void 0 : gt.geometry) || et.geometry;
-          if (Pt && Pt.isMask && (gt == null ? void 0 : gt.visible) !== !1) {
+          const mt = this.objectStates.get(D), Pt = (mt == null ? void 0 : mt.geometry) || et.geometry;
+          if (Pt && Pt.isMask && (mt == null ? void 0 : mt.visible) !== !1) {
             const Ct = Pt.width || 0, Wt = Pt.height || 0;
             this.applyObjectTransform(t, D);
-            const mt = (gt == null ? void 0 : gt.corner_radius) ?? (Pt == null ? void 0 : Pt.corner_radius) ?? 0;
-            this.applyPath(t, Pt, Ct, Wt, mt), t.clip(), z++;
+            const yt = (mt == null ? void 0 : mt.corner_radius) ?? (Pt == null ? void 0 : Pt.corner_radius) ?? 0;
+            this.applyPath(t, Pt, Ct, Wt, yt), t.clip(), z++;
           } else
             this.renderObject(t, et, o);
         }); z > 0; )
@@ -3374,19 +3377,19 @@ class ci {
           feather: i.maskFeather || 0,
           isVisible: !0
         }] : [])).filter((z) => z.isVisible !== !1 && o.has(z.maskId)).forEach((z) => {
-          var mt, F, Lt, jt, Vt, ce;
-          const D = o.get(z.maskId), et = this.objectStates.get(D.id), gt = z.feather || 0, Pt = z.inverted === !0, Ct = z.opacity !== void 0 ? typeof z.opacity == "number" ? z.opacity : z.opacity / 100 : 1;
+          var yt, F, Lt, jt, Vt, ce;
+          const D = o.get(z.maskId), et = this.objectStates.get(D.id), mt = z.feather || 0, Pt = z.inverted === !0, Ct = z.opacity !== void 0 ? typeof z.opacity == "number" ? z.opacity : z.opacity / 100 : 1;
           if ((z.type || "alpha") === "luma") {
-            (!this.lumaBuffer || this.lumaBuffer.width !== this.maskBuffer.width || this.lumaBuffer.height !== this.maskBuffer.height) && (this.lumaBuffer = document.createElement("canvas"), this.lumaBuffer.width = this.maskBuffer.width, this.lumaBuffer.height = this.maskBuffer.height, this.lumaCtx = this.lumaBuffer.getContext("2d", { willReadFrequently: !0 }), this.lumaCtx && (this.lumaCtx.imageSmoothingEnabled = !0, this.lumaCtx.imageSmoothingQuality = "high")), this.lumaCtx.setTransform(1, 0, 0, 1, 0, 0), this.lumaCtx.globalCompositeOperation = "source-over", this.lumaCtx.globalAlpha = 1, this.lumaCtx.filter = "none", this.lumaCtx.clearRect(0, 0, this.lumaBuffer.width, this.lumaBuffer.height), this.lumaCtx.save(), this.rootTransform && this.lumaCtx.setTransform(this.rootTransform), this.applyAbsoluteTransform(this.lumaCtx, D.id, o), gt > 0 && (this.lumaCtx.filter = `blur(${gt}px)`), this.lumaCtx.globalAlpha = Ct;
-            const Rt = (et == null ? void 0 : et.width) || D.geometry.width || 0, ft = (et == null ? void 0 : et.height) || D.geometry.height || 0, lt = (et == null ? void 0 : et.corner_radius) ?? D.corner_radius ?? 0;
-            if (((mt = D.geometry) == null ? void 0 : mt.type) === "Text") {
+            (!this.lumaBuffer || this.lumaBuffer.width !== this.maskBuffer.width || this.lumaBuffer.height !== this.maskBuffer.height) && (this.lumaBuffer = document.createElement("canvas"), this.lumaBuffer.width = this.maskBuffer.width, this.lumaBuffer.height = this.maskBuffer.height, this.lumaCtx = this.lumaBuffer.getContext("2d", { willReadFrequently: !0 }), this.lumaCtx && (this.lumaCtx.imageSmoothingEnabled = !0, this.lumaCtx.imageSmoothingQuality = "high")), this.lumaCtx.setTransform(1, 0, 0, 1, 0, 0), this.lumaCtx.globalCompositeOperation = "source-over", this.lumaCtx.globalAlpha = 1, this.lumaCtx.filter = "none", this.lumaCtx.clearRect(0, 0, this.lumaBuffer.width, this.lumaBuffer.height), this.lumaCtx.save(), this.rootTransform && this.lumaCtx.setTransform(this.rootTransform), this.applyAbsoluteTransform(this.lumaCtx, D.id, o), mt > 0 && (this.lumaCtx.filter = `blur(${mt}px)`), this.lumaCtx.globalAlpha = Ct;
+            const Rt = (et == null ? void 0 : et.width) || D.geometry.width || 0, ft = (et == null ? void 0 : et.height) || D.geometry.height || 0, ct = (et == null ? void 0 : et.corner_radius) ?? D.corner_radius ?? 0;
+            if (((yt = D.geometry) == null ? void 0 : yt.type) === "Text") {
               const st = et != null && et.geometry ? this.deepMerge(D.geometry, et.geometry) : D.geometry, J = et != null && et.style ? this.deepMerge(D.style, et.style) : D.style;
-              this._renderText(this.lumaCtx, D, { ...st, width: Rt, height: ft, corner_radius: lt }, J, et, Rt, ft, !0);
+              this._renderText(this.lumaCtx, D, { ...st, width: Rt, height: ft, corner_radius: ct }, J, et, Rt, ft, !0);
             } else if (((F = D.geometry) == null ? void 0 : F.type) === "Image") {
               const st = D.geometry.src;
               if (st) {
                 let J = this.imageCache.get(st);
-                J || (J = new Image(), J.src = st, this.imageCache.set(st, J)), J.complete && J.naturalWidth > 0 ? this.lumaCtx.drawImage(J, -Rt / 2, -ft / 2, Rt, ft) : (this.applyPath(this.lumaCtx, D.geometry, Rt, ft, lt), this.lumaCtx.fillStyle = "#ffffff", this.lumaCtx.fill());
+                J || (J = new Image(), J.src = st, this.imageCache.set(st, J)), J.complete && J.naturalWidth > 0 ? this.lumaCtx.drawImage(J, -Rt / 2, -ft / 2, Rt, ft) : (this.applyPath(this.lumaCtx, D.geometry, Rt, ft, ct), this.lumaCtx.fillStyle = "#ffffff", this.lumaCtx.fill());
               }
             } else if (((Lt = D.geometry) == null ? void 0 : Lt.type) === "SVG") {
               const st = D.geometry.svgContent;
@@ -3400,10 +3403,10 @@ class ci {
                     this.artboard && this.reset();
                   }, this.imageCache.set(J, Ft);
                 }
-                Ft.complete && Ft.naturalWidth > 0 ? this.lumaCtx.drawImage(Ft, -Rt / 2, -ft / 2, Rt, ft) : (this.applyPath(this.lumaCtx, D.geometry, Rt, ft, lt), this.lumaCtx.fillStyle = "#ffffff", this.lumaCtx.fill());
+                Ft.complete && Ft.naturalWidth > 0 ? this.lumaCtx.drawImage(Ft, -Rt / 2, -ft / 2, Rt, ft) : (this.applyPath(this.lumaCtx, D.geometry, Rt, ft, ct), this.lumaCtx.fillStyle = "#ffffff", this.lumaCtx.fill());
               }
             } else
-              this.applyPath(this.lumaCtx, D.geometry, Rt, ft, lt), this.lumaCtx.fillStyle = "#ffffff", this.lumaCtx.fill();
+              this.applyPath(this.lumaCtx, D.geometry, Rt, ft, ct), this.lumaCtx.fillStyle = "#ffffff", this.lumaCtx.fill();
             this.lumaCtx.restore();
             const tt = this.maskCtx.getImageData(0, 0, this.canvasWidth, this.canvasHeight), dt = this.lumaCtx.getImageData(0, 0, this.canvasWidth, this.canvasHeight).data, G = tt.data;
             for (let st = 0; st < G.length; st += 4) {
@@ -3413,16 +3416,16 @@ class ci {
             }
             this.maskCtx.putImageData(tt, 0, 0);
           } else {
-            this.maskCtx.save(), this.rootTransform && this.maskCtx.setTransform(this.rootTransform), this.maskCtx.globalCompositeOperation = Pt ? "destination-out" : "destination-in", gt > 0 && (this.maskCtx.filter = `blur(${gt}px)`), this.maskCtx.globalAlpha = Ct, this.applyAbsoluteTransform(this.maskCtx, D.id, o);
-            const Rt = (et == null ? void 0 : et.width) || D.geometry.width || 0, ft = (et == null ? void 0 : et.height) || D.geometry.height || 0, lt = (et == null ? void 0 : et.corner_radius) ?? D.corner_radius ?? 0;
+            this.maskCtx.save(), this.rootTransform && this.maskCtx.setTransform(this.rootTransform), this.maskCtx.globalCompositeOperation = Pt ? "destination-out" : "destination-in", mt > 0 && (this.maskCtx.filter = `blur(${mt}px)`), this.maskCtx.globalAlpha = Ct, this.applyAbsoluteTransform(this.maskCtx, D.id, o);
+            const Rt = (et == null ? void 0 : et.width) || D.geometry.width || 0, ft = (et == null ? void 0 : et.height) || D.geometry.height || 0, ct = (et == null ? void 0 : et.corner_radius) ?? D.corner_radius ?? 0;
             if (((jt = D.geometry) == null ? void 0 : jt.type) === "Text") {
               const tt = et != null && et.geometry ? this.deepMerge(D.geometry, et.geometry) : D.geometry, dt = et != null && et.style ? this.deepMerge(D.style, et.style) : D.style;
-              this._renderText(this.maskCtx, D, { ...tt, width: Rt, height: ft, corner_radius: lt }, dt, et, Rt, ft, !0);
+              this._renderText(this.maskCtx, D, { ...tt, width: Rt, height: ft, corner_radius: ct }, dt, et, Rt, ft, !0);
             } else if (((Vt = D.geometry) == null ? void 0 : Vt.type) === "Image") {
               const tt = D.geometry.src;
               if (tt) {
                 let dt = this.imageCache.get(tt);
-                dt || (dt = new Image(), dt.src = tt, this.imageCache.set(tt, dt)), dt.complete && dt.naturalWidth > 0 ? this.maskCtx.drawImage(dt, -Rt / 2, -ft / 2, Rt, ft) : (this.applyPath(this.maskCtx, D.geometry, Rt, ft, lt), this.maskCtx.fillStyle = "#ffffff", this.maskCtx.fill());
+                dt || (dt = new Image(), dt.src = tt, this.imageCache.set(tt, dt)), dt.complete && dt.naturalWidth > 0 ? this.maskCtx.drawImage(dt, -Rt / 2, -ft / 2, Rt, ft) : (this.applyPath(this.maskCtx, D.geometry, Rt, ft, ct), this.maskCtx.fillStyle = "#ffffff", this.maskCtx.fill());
               }
             } else if (((ce = D.geometry) == null ? void 0 : ce.type) === "SVG") {
               const tt = D.geometry.svgContent;
@@ -3436,10 +3439,10 @@ class ci {
                     this.artboard && this.reset();
                   }, this.imageCache.set(dt, G);
                 }
-                G.complete && G.naturalWidth > 0 ? this.maskCtx.drawImage(G, -Rt / 2, -ft / 2, Rt, ft) : (this.applyPath(this.maskCtx, D.geometry, Rt, ft, lt), this.maskCtx.fillStyle = "#ffffff", this.maskCtx.fill());
+                G.complete && G.naturalWidth > 0 ? this.maskCtx.drawImage(G, -Rt / 2, -ft / 2, Rt, ft) : (this.applyPath(this.maskCtx, D.geometry, Rt, ft, ct), this.maskCtx.fillStyle = "#ffffff", this.maskCtx.fill());
               }
             } else
-              this.applyPath(this.maskCtx, D.geometry, Rt, ft, lt), this.maskCtx.fillStyle = "#ffffff", this.maskCtx.fill();
+              this.applyPath(this.maskCtx, D.geometry, Rt, ft, ct), this.maskCtx.fillStyle = "#ffffff", this.maskCtx.fill();
             this.maskCtx.restore();
           }
         }), Bt.save(), Bt.setTransform(1, 0, 0, 1, 0, 0);
@@ -3450,7 +3453,7 @@ class ci {
     }
   }
   _renderText(t, i, o, e, s, n, a, r = !1, l = !1) {
-    var yt, ct, wt, Mt, It, Ot, At, Tt, zt;
+    var bt, ht, wt, Mt, It, Ot, At, Tt, zt;
     let c = o.text || "";
     if (o.textInputId && !r) {
       const Z = this.inputs.get(o.textInputId);
@@ -3459,7 +3462,7 @@ class ci {
     if (o.svgPath) {
       const Z = o.svgPath;
       t.save();
-      const pt = ((yt = e == null ? void 0 : e.fill) == null ? void 0 : yt.color) || "#000000", Et = ((ct = e == null ? void 0 : e.fill) == null ? void 0 : ct.opacity) !== void 0 ? (wt = e == null ? void 0 : e.fill) == null ? void 0 : wt.opacity : 1;
+      const pt = ((bt = e == null ? void 0 : e.fill) == null ? void 0 : bt.color) || "#000000", Et = ((ht = e == null ? void 0 : e.fill) == null ? void 0 : ht.opacity) !== void 0 ? (wt = e == null ? void 0 : e.fill) == null ? void 0 : wt.opacity : 1;
       t.fillStyle = pt, t.globalAlpha *= Et;
       const ut = new Path2D(Z);
       t.fill(ut), t.restore();
@@ -3538,7 +3541,7 @@ class ci {
         V = { geo: Et, obj: Z, w: ut, h: vt }, it = this.getPerimeter(Et, ut, vt);
       }
     }
-    const rt = (Z, pt) => {
+    const lt = (Z, pt) => {
       var ut, vt;
       if (M === 0 && (!o.enableSegments || !((ut = o.segments) != null && ut.length))) return t.measureText(Z).width;
       let Et = 0;
@@ -3575,7 +3578,7 @@ class ci {
       if (Dt)
         t.font = C, ut ? t.strokeText(Z, pt + Xt, te) : t.fillText(Z, pt + Xt, te);
       else {
-        const Qt = rt(Z, vt);
+        const Qt = lt(Z, vt);
         let me = pt + Xt;
         I === "center" ? me -= Qt / 2 : I === "right" && (me -= Qt);
         const _e = vt + Z.length >= f.length || f[vt + Z.length] === `
@@ -3588,14 +3591,14 @@ class ci {
             Z[D] === " " && Se++;
           if (Se > 0) {
             const D = t.measureText(" ").width;
-            let et = Pe || D * 0.5, gt = ae || D * 2.5;
-            ye = Math.max(0, Math.min(z / Se, gt - et));
+            let et = Pe || D * 0.5, mt = ae || D * 2.5;
+            ye = Math.max(0, Math.min(z / Se, mt - et));
           }
         }
         let ee = o.pathOffset || 0;
         o.pathId && it > 0 && V && (I === "center" ? ee += it / 2 - Qt / 2 : I === "right" && (ee += it - Qt));
-        let ht = me;
-        const bt = r && !l ? [] : ((ue = i.behaviors) == null ? void 0 : ue.filter(
+        let at = me;
+        const gt = r && !l ? [] : ((ue = i.behaviors) == null ? void 0 : ue.filter(
           (j) => [
             N.Typewriter,
             N.Scramble,
@@ -3631,132 +3634,132 @@ class ci {
         for (let j = 0; j < Z.length; j++) {
           let z = Z[j];
           const D = vt + j;
-          let et = 0, gt = 0, Pt = 1, Ct = 1, Wt = 0, mt = 1, F = z;
-          bt.forEach((ft) => {
-            const lt = ft.settings || {}, tt = lt.strength || 1, dt = Date.now();
+          let et = 0, mt = 0, Pt = 1, Ct = 1, Wt = 0, yt = 1, F = z;
+          gt.forEach((ft) => {
+            const ct = ft.settings || {}, tt = ct.strength || 1, dt = Date.now();
             if (ft.type === N.Typewriter)
-              this.currentTime * (lt.speed || 1) - D * (lt.stagger || 0.05) < 0 && (mt = 0);
+              this.currentTime * (ct.speed || 1) - D * (ct.stagger || 0.05) < 0 && (yt = 0);
             else if (ft.type === N.Scramble)
-              Math.max(0, Math.min(1, this.currentTime / (lt.duration || 1.5)) - D * 0.02) < 1 && Math.random() < 0.3 && (F = "$%#@!*&"[Math.floor(Math.random() * 7)]);
+              Math.max(0, Math.min(1, this.currentTime / (ct.duration || 1.5)) - D * 0.02) < 1 && Math.random() < 0.3 && (F = "$%#@!*&"[Math.floor(Math.random() * 7)]);
             else if (ft.type === N.Wave)
-              gt += Math.sin(this.currentTime * 5 * (lt.speed || 1) + D * (lt.frequency || 1)) * (lt.amplitude || 20) * tt;
+              mt += Math.sin(this.currentTime * 5 * (ct.speed || 1) + D * (ct.frequency || 1)) * (ct.amplitude || 20) * tt;
             else if (ft.type === N.Bounce) {
-              const G = Math.max(0, this.currentTime % 2 - D * (lt.stagger || 0.1));
-              G < 1 && (gt -= Math.abs(Math.sin(G * Math.PI)) * (lt.height || 50) * tt);
+              const G = Math.max(0, this.currentTime % 2 - D * (ct.stagger || 0.1));
+              G < 1 && (mt -= Math.abs(Math.sin(G * Math.PI)) * (ct.height || 50) * tt);
             } else if (ft.type === N.TextTrail) {
-              const G = this.pointerHistory[Math.max(0, this.pointerHistory.length - 1 - D * (lt.delay || 5))];
-              G && (et += (G.x - (s.x + ht)) * tt * 0.2, gt += (G.y - (s.y + Et + gt)) * tt * 0.2);
+              const G = this.pointerHistory[Math.max(0, this.pointerHistory.length - 1 - D * (ct.delay || 5))];
+              G && (et += (G.x - (s.x + at)) * tt * 0.2, mt += (G.y - (s.y + Et + mt)) * tt * 0.2);
             } else if (ft.type === N.Reveal3D) {
-              const G = Math.max(0, Math.min(1, this.currentTime * (lt.speed || 1) - D * (lt.stagger || 0.1)));
-              Pt *= G, Ct *= G, mt = G;
+              const G = Math.max(0, Math.min(1, this.currentTime * (ct.speed || 1) - D * (ct.stagger || 0.1)));
+              Pt *= G, Ct *= G, yt = G;
             } else if (ft.type === N.RevealSlide) {
-              const G = Math.max(0, Math.min(1, this.currentTime * 1.5 - D * 0.05)), st = (1 - G) * (lt.distance || 40) * tt, J = lt.direction || "up";
-              J === "up" ? gt -= st : J === "down" ? gt += st : J === "left" ? et -= st : J === "right" && (et += st), mt = G;
+              const G = Math.max(0, Math.min(1, this.currentTime * 1.5 - D * 0.05)), st = (1 - G) * (ct.distance || 40) * tt, J = ct.direction || "up";
+              J === "up" ? mt -= st : J === "down" ? mt += st : J === "left" ? et -= st : J === "right" && (et += st), yt = G;
             } else if (ft.type === N.RevealBlur) {
               const G = Math.max(0, Math.min(1, this.currentTime * 1.2 - D * 0.1));
-              mt = G, et += (1 - G) * 5;
+              yt = G, et += (1 - G) * 5;
             } else if (ft.type === N.TextLiquid) {
-              const G = Math.max(0, Math.sin(dt * 1e-3 * (lt.speed || 1) + D * 0.5));
-              gt += G * (lt.amplitude || 10) * tt, Ct *= 1 + G * 0.2;
+              const G = Math.max(0, Math.sin(dt * 1e-3 * (ct.speed || 1) + D * 0.5));
+              mt += G * (ct.amplitude || 10) * tt, Ct *= 1 + G * 0.2;
             } else if (ft.type === N.TextVortex) {
-              const G = dt * 2e-3 * (lt.speed || 1) + D * 0.2, st = (1 - (Math.sin(dt * 1e-3) * 0.5 + 0.5)) * (lt.radius || 50);
-              et += Math.cos(G) * st * tt, gt += Math.sin(G) * st * tt;
+              const G = dt * 2e-3 * (ct.speed || 1) + D * 0.2, st = (1 - (Math.sin(dt * 1e-3) * 0.5 + 0.5)) * (ct.radius || 50);
+              et += Math.cos(G) * st * tt, mt += Math.sin(G) * st * tt;
             } else if (ft.type === N.TextExplosion) {
-              const G = lt.force || 1, st = this.currentTime % 2;
+              const G = ct.force || 1, st = this.currentTime % 2;
               if (st < 1) {
                 const J = (D / Z.length - 0.5) * Math.PI * 2, Ft = st * 100 * G;
-                et += Math.cos(J) * Ft * tt, gt += Math.sin(J) * Ft * tt, mt = 1 - st;
+                et += Math.cos(J) * Ft * tt, mt += Math.sin(J) * Ft * tt, yt = 1 - st;
               }
             } else if (ft.type === N.TextRain) {
-              const G = lt.speed || 1, st = lt.height || 100, J = (dt * 1e-3 * G + D * 0.1) % 1;
-              gt -= (1 - J) * st * tt, mt = J > 0.1 ? 1 : J * 10;
+              const G = ct.speed || 1, st = ct.height || 100, J = (dt * 1e-3 * G + D * 0.1) % 1;
+              mt -= (1 - J) * st * tt, yt = J > 0.1 ? 1 : J * 10;
             } else if (ft.type === N.TextGravity) {
-              const G = lt.gravity || 9.8, st = this.currentTime % 3 / 3, J = 0.5 * G * Math.pow(st * 10, 2);
-              J < 100 ? gt += J * tt : gt += 100 * tt;
+              const G = ct.gravity || 9.8, st = this.currentTime % 3 / 3, J = 0.5 * G * Math.pow(st * 10, 2);
+              J < 100 ? mt += J * tt : mt += 100 * tt;
             } else if (ft.type === N.TextMatrix) {
-              const G = lt.speed || 1;
+              const G = ct.speed || 1;
               if (Math.random() < 0.1 * G) {
                 const J = "0123456789ABCDEF!@#$%^&*";
                 F = J[Math.floor(Math.random() * J.length)];
               }
-              mt = 0.3 + (Math.sin(dt * 0.01 * G + D) + 1) / 2 * 0.7;
+              yt = 0.3 + (Math.sin(dt * 0.01 * G + D) + 1) / 2 * 0.7;
             } else if (ft.type === N.TextNeon) {
               const G = Math.random() > 0.95 ? 0.5 : 1;
-              mt = (0.7 + (Math.sin(dt * 5e-3) + 1) / 2 * 0.3) * G;
+              yt = (0.7 + (Math.sin(dt * 5e-3) + 1) / 2 * 0.3) * G;
             } else if (ft.type === N.TextDissolve)
-              Math.sin(D * 1.5 + dt * 2e-3 * (lt.speed || 1)) > 0.5 && (mt = 0);
+              Math.sin(D * 1.5 + dt * 2e-3 * (ct.speed || 1)) > 0.5 && (yt = 0);
             else if (ft.type === N.TextOrganic) {
-              const G = lt.speed || 1, st = lt.amplitude || 10;
-              et += Math.sin(dt * 2e-3 * G + D) * st * tt, gt += Math.cos(dt * 15e-4 * G + D * 0.7) * st * tt;
+              const G = ct.speed || 1, st = ct.amplitude || 10;
+              et += Math.sin(dt * 2e-3 * G + D) * st * tt, mt += Math.cos(dt * 15e-4 * G + D * 0.7) * st * tt;
             } else if (ft.type === N.TextBreathe) {
               const st = 1 + (Math.sin(dt * 3e-3 + D * 0.2) + 1) / 2 * 0.2 * tt;
               Pt *= st, Ct *= st;
             } else if (ft.type === N.TextSpin) {
-              const G = lt.speed || 1;
+              const G = ct.speed || 1;
               Wt += dt * 0.01 * G + D;
             } else if (ft.type === N.TextMagnet) {
               const G = this.pointerHistory[this.pointerHistory.length - 1];
               if (G) {
-                const st = G.x - (s.x + ht), J = G.y - (s.y + Et);
+                const st = G.x - (s.x + at), J = G.y - (s.y + Et);
                 Wt = Math.atan2(J, st);
               }
             } else if (ft.type === N.TextPerspective) {
               const G = Z.length / 2, st = (D - G) / G, J = 1 - Math.abs(st) * 0.3 * tt;
               Pt *= J, Ct *= J, et += st * 20 * tt;
             } else if (ft.type === N.TextMirror)
-              mt *= 0.8;
+              yt *= 0.8;
             else if (ft.type === N.TextFloral) {
-              const G = lt.speed || 1, st = lt.stagger || 0.1, J = (dt * 1e-3 * G + D * st) % 2;
+              const G = ct.speed || 1, st = ct.stagger || 0.1, J = (dt * 1e-3 * G + D * st) % 2;
               J < 1 && (Pt *= J, Ct *= J, Wt += J * Math.PI);
             } else if (ft.type === N.TextSmoke) {
-              const G = lt.speed || 1, st = lt.height || 50, J = (dt * 5e-4 * G + D * 0.2) % 1;
-              gt -= J * st * tt, et += Math.sin(dt * 2e-3 + D) * 5 * tt, mt = 1 - J;
+              const G = ct.speed || 1, st = ct.height || 50, J = (dt * 5e-4 * G + D * 0.2) % 1;
+              mt -= J * st * tt, et += Math.sin(dt * 2e-3 + D) * 5 * tt, yt = 1 - J;
             } else if (ft.type === N.TextVariable) {
-              const G = lt.speed || 1, st = lt.intensity || 1.5, J = (Math.sin(dt * 4e-3 * G + D * 0.3) + 1) / 2;
+              const G = ct.speed || 1, st = ct.intensity || 1.5, J = (Math.sin(dt * 4e-3 * G + D * 0.3) + 1) / 2;
               Pt *= 1 + J * (st - 1) * tt;
             } else if (ft.type === N.TextZing) {
-              const G = lt.speed || 2, st = lt.distance || 100, J = (dt * 2e-3 * G + D * 0.05) % 1;
-              et += (1 - J) * st * tt, mt = J;
+              const G = ct.speed || 2, st = ct.distance || 100, J = (dt * 2e-3 * G + D * 0.05) % 1;
+              et += (1 - J) * st * tt, yt = J;
             } else if (ft.type === N.TextElastic) {
-              const G = lt.stiffness || 0.2, st = lt.damping || 0.1, J = Math.sin(dt * 0.01) * Math.exp(-dt * 1e-3 * st);
+              const G = ct.stiffness || 0.2, st = ct.damping || 0.1, J = Math.sin(dt * 0.01) * Math.exp(-dt * 1e-3 * st);
               Ct *= 1 + J * G * tt;
             } else if (ft.type === N.TextGlitch3D) {
-              const G = lt.intensity || 5;
-              Math.random() < 0.2 && (et += (Math.random() - 0.5) * G, gt += (Math.random() - 0.5) * G, mt = 0.8);
+              const G = ct.intensity || 5;
+              Math.random() < 0.2 && (et += (Math.random() - 0.5) * G, mt += (Math.random() - 0.5) * G, yt = 0.8);
             } else if (ft.type === N.GlitchText) {
-              const G = lt.intensity || 5;
-              Math.random() < 0.1 && (et += (Math.random() - 0.5) * G, gt += (Math.random() - 0.5) * G, Math.random() < 0.05 && (mt = 0.5));
+              const G = ct.intensity || 5;
+              Math.random() < 0.1 && (et += (Math.random() - 0.5) * G, mt += (Math.random() - 0.5) * G, Math.random() < 0.05 && (yt = 0.5));
             }
           });
           let Lt = null, jt = o.textDecoration || "none", Vt = y;
           if (o.enableSegments === !0 && ((pe = o.segments) == null ? void 0 : pe.length) > 0) {
-            let ft = 0, lt = null;
+            let ft = 0, ct = null;
             for (const tt of o.segments) {
               if (D < ft + (tt.text || "").length) {
-                lt = tt;
+                ct = tt;
                 break;
               }
               ft += (tt.text || "").length;
             }
-            if (lt) {
-              let tt = lt.fontFamily || o.fontFamily || "Inter";
+            if (ct) {
+              let tt = ct.fontFamily || o.fontFamily || "Inter";
               b.forEach((st) => {
                 const J = new RegExp(`[\\s-]${st}$`, "i");
                 J.test(tt) && (tt = tt.replace(J, "").trim());
               });
-              const dt = this.mapFontWeight((lt.fontWeight || o.fontWeight || "400").toString()), G = lt.fontStyle || d;
-              Vt = lt.fontSize || y, t.font = `${G} ${dt} ${Vt}px "${tt}", sans-serif`, lt.fill && (Lt = lt.fill), lt.textDecoration && (jt = lt.textDecoration), Vt < Y && (gt += (Y - Vt) * 0.85);
+              const dt = this.mapFontWeight((ct.fontWeight || o.fontWeight || "400").toString()), G = ct.fontStyle || d;
+              Vt = ct.fontSize || y, t.font = `${G} ${dt} ${Vt}px "${tt}", sans-serif`, ct.fill && (Lt = ct.fill), ct.textDecoration && (jt = ct.textDecoration), Vt < Y && (mt += (Y - Vt) * 0.85);
             }
           } else
             t.font = C;
           const ce = t.globalAlpha;
-          t.globalAlpha *= mt, t.save();
+          t.globalAlpha *= yt, t.save();
           const Rt = t.measureText(F).width;
           if (V && it > 0) {
-            const ft = ht - me + Rt / 2, tt = (ee + ft) / it, dt = this.getPointOnPath(V.geo, V.w, V.h, Math.abs(tt % 1)), G = dt.angle, st = Et + gt + (o.pathOffsetY || 0), J = o.pathSide === "right" ? -1 : 1, Ft = Math.cos(G + Math.PI / 2) * st * J, Ut = Math.sin(G + Math.PI / 2) * st * J;
+            const ft = at - me + Rt / 2, tt = (ee + ft) / it, dt = this.getPointOnPath(V.geo, V.w, V.h, Math.abs(tt % 1)), G = dt.angle, st = Et + mt + (o.pathOffsetY || 0), J = o.pathSide === "right" ? -1 : 1, Ft = Math.cos(G + Math.PI / 2) * st * J, Ut = Math.sin(G + Math.PI / 2) * st * J;
             t.translate(dt.x + Ft + et, dt.y + Ut), t.rotate(G + Wt + (J === -1 ? Math.PI : 0));
           } else
-            t.translate(ht + et + Rt / 2, Et + gt), Wt !== 0 && t.rotate(Wt);
+            t.translate(at + et + Rt / 2, Et + mt), Wt !== 0 && t.rotate(Wt);
           if (t.scale(Pt, Ct), Lt && !r && !l) {
             const ft = this.createCanvasFill(t, Lt, _, L);
             t.fillStyle = ft || Lt.color || "#000000";
@@ -3764,12 +3767,12 @@ class ci {
             const ft = this.createCanvasFill(t, e.fill, _, L);
             t.fillStyle = ft || e.fill.color || "#000000";
           }
-          if (mt > 0)
+          if (yt > 0)
             if (r || l) {
               const ft = l ? "#000000" : this.createCanvasFill(t, e.fill, _, L);
               t.fillStyle = ft || e.fill.color || "#ffffff", t.fillText(F, -Rt / 2, 0);
             } else ut ? t.strokeText(F, -Rt / 2, 0) : t.fillText(F, -Rt / 2, 0);
-          jt !== "none" && !r && this.drawTextDecoration(t, jt, 0, 0, Rt, Vt), t.restore(), t.globalAlpha = ce, I === "justify" && ye > 0 && F === " " && !_e ? ht += Rt + M + ye : ht += Rt + M;
+          jt !== "none" && !r && this.drawTextDecoration(t, jt, 0, 0, Rt, Vt), t.restore(), t.globalAlpha = ce, I === "justify" && ye > 0 && F === " " && !_e ? at += Rt + M + ye : at += Rt + M;
         }
       }
     };
@@ -4276,8 +4279,8 @@ class ci {
     }
   }
   renderInputBox(t, i) {
-    var it, rt;
-    const o = this.objectStates.get(i.id), e = (o == null ? void 0 : o.options) || i.options || {}, s = ((it = i.geometry) == null ? void 0 : it.width) || 250, n = ((rt = i.geometry) == null ? void 0 : rt.height) || 45, a = this.focusedId === i.id, r = this.lastHoveredObjectId === i.id, l = e.previewState || "default", c = l !== "default" ? l : a ? "focused" : r ? "hovered" : "default", f = e.label || { visible: !0, text: "Label" }, u = e.helperText || { visible: !1, text: "Helper text" }, h = e.leftIcon || { visible: !1 }, d = e.rightIcon || { visible: !1 }, p = e.multiline === !0, y = e.corner_radius ?? 8, m = e.corners || { tl: y, tr: y, bl: y, br: y }, b = [m.tl, m.tr, m.br, m.bl];
+    var it, lt;
+    const o = this.objectStates.get(i.id), e = (o == null ? void 0 : o.options) || i.options || {}, s = ((it = i.geometry) == null ? void 0 : it.width) || 250, n = ((lt = i.geometry) == null ? void 0 : lt.height) || 45, a = this.focusedId === i.id, r = this.lastHoveredObjectId === i.id, l = e.previewState || "default", c = l !== "default" ? l : a ? "focused" : r ? "hovered" : "default", f = e.label || { visible: !0, text: "Label" }, u = e.helperText || { visible: !1, text: "Helper text" }, h = e.leftIcon || { visible: !1 }, d = e.rightIcon || { visible: !1 }, p = e.multiline === !0, y = e.corner_radius ?? 8, m = e.corners || { tl: y, tr: y, bl: y, br: y }, b = [m.tl, m.tr, m.br, m.bl];
     let v = e.backgroundColor || "rgba(31, 41, 55, 1)", S = e.borderColor || "rgba(55, 65, 81, 1)", C = e.borderWidth ?? 1.5, w = e.color || "#ffffff", I = e.placeholderColor || "rgba(156, 163, 175, 1)", M = e.fontSize || 14;
     const k = `${c}Style`, T = e[k];
     T ? (T.backgroundColor !== void 0 && (v = T.backgroundColor), T.borderColor !== void 0 && (S = T.borderColor), T.borderWidth !== void 0 && (C = T.borderWidth), T.color !== void 0 && (w = T.color), T.placeholderColor !== void 0 && (I = T.placeholderColor), T.fontSize !== void 0 && (M = T.fontSize)) : c === "focused" ? (S = e.focusBorderColor || "rgba(59, 130, 246, 1)", C = Math.max(C, 2)) : c === "hovered" || c === "hover" ? (S = e.hoverBorderColor || S, v = e.hoverBackgroundColor || v) : c === "disabled" ? (v = e.disabledBackgroundColor || "rgba(31, 41, 55, 0.6)", S = e.disabledBorderColor || "rgba(55, 65, 81, 0.4)") : c === "error" && (S = "rgba(239, 68, 68, 1)", C = Math.max(C, 2)), t.beginPath(), this.drawRoundRect(t, -s / 2, -n / 2, s, n, b);
@@ -4286,15 +4289,15 @@ class ci {
       const nt = this.createCanvasFill(t, S, s, n);
       if (nt && (t.strokeStyle = nt, t.lineWidth = C, t.stroke()), c === "focused" || c === "focus") {
         t.save(), t.beginPath();
-        const yt = b.map((ct) => ct + 2);
-        this.drawRoundRect(t, -s / 2 - 2, -n / 2 - 2, s + 4, n + 4, yt), t.strokeStyle = "rgba(59, 130, 246, 0.3)", t.lineWidth = 2, t.stroke(), t.restore();
+        const bt = b.map((ht) => ht + 2);
+        this.drawRoundRect(t, -s / 2 - 2, -n / 2 - 2, s + 4, n + 4, bt), t.strokeStyle = "rgba(59, 130, 246, 0.3)", t.lineWidth = 2, t.stroke(), t.restore();
       }
     }
-    const P = (nt, yt) => {
+    const P = (nt, bt) => {
       if (!nt.visible || !nt.svgPath) return;
-      const ct = nt.size || 14, wt = nt.offset ?? 16, Mt = nt.color || "#ffffff", It = yt ? -(s / 2) + wt : s / 2 - wt, Ot = nt.svgPath;
+      const ht = nt.size || 14, wt = nt.offset ?? 16, Mt = nt.color || "#ffffff", It = bt ? -(s / 2) + wt : s / 2 - wt, Ot = nt.svgPath;
       if (t.save(), t.translate(It, 0), !Ot.startsWith("<svg")) {
-        const At = new Path2D(Ot), Tt = ct / 24;
+        const At = new Path2D(Ot), Tt = ht / 24;
         t.scale(Tt, Tt), t.translate(-12, -12), t.fillStyle = Mt, t.fill(At);
       }
       t.restore();
@@ -4306,46 +4309,46 @@ class ci {
     if (t.save(), t.beginPath(), t.rect(L - 2, -n / 2 + 4, X + 4, n - 8), t.clip(), p) {
       const nt = V.split(`
 `);
-      let yt = -n / 2 + K;
-      const ct = $ * 1.2;
+      let bt = -n / 2 + K;
+      const ht = $ * 1.2;
       let wt = 0;
       nt.forEach((Mt, It) => {
         const Ot = Mt.split(" ");
         let At = "";
         for (let Tt = 0; Tt < Ot.length; Tt++) {
           const zt = At + Ot[Tt] + " ";
-          t.measureText(zt).width > X && Tt > 0 ? (t.fillText(At, L, yt), At = Ot[Tt] + " ", yt += ct) : At = zt;
+          t.measureText(zt).width > X && Tt > 0 ? (t.fillText(At, L, bt), At = Ot[Tt] + " ", bt += ht) : At = zt;
         }
-        t.fillText(At, L, yt), wt = t.measureText(At).width, It < nt.length - 1 && (yt += ct, wt = 0);
-      }), a && !O && Math.floor(performance.now() / 500) % 2 === 0 && t.fillRect(L + wt, yt, 1.5, $);
+        t.fillText(At, L, bt), wt = t.measureText(At).width, It < nt.length - 1 && (bt += ht, wt = 0);
+      }), a && !O && Math.floor(performance.now() / 500) % 2 === 0 && t.fillRect(L + wt, bt, 1.5, $);
     } else {
-      const yt = t.measureText(V).width;
-      let ct = 0;
-      if (yt > X && (ct = yt - X), t.fillText(V, L - ct, 0), a && !O && Math.floor(performance.now() / 500) % 2 === 0) {
-        const Mt = L + yt - ct;
+      const bt = t.measureText(V).width;
+      let ht = 0;
+      if (bt > X && (ht = bt - X), t.fillText(V, L - ht, 0), a && !O && Math.floor(performance.now() / 500) % 2 === 0) {
+        const Mt = L + bt - ht;
         t.fillRect(Mt, -($ / 2), 1.5, $);
       }
     }
     if (t.restore(), f.visible !== !1) {
-      const nt = f.text || "Label", yt = f.fontSize || 12, ct = f.color || "rgba(156, 163, 175, 1)", wt = f.offset ?? 8;
-      t.font = `600 ${yt}px "${Y}", sans-serif`, t.fillStyle = ct, t.textAlign = "left", t.textBaseline = "bottom";
+      const nt = f.text || "Label", bt = f.fontSize || 12, ht = f.color || "rgba(156, 163, 175, 1)", wt = f.offset ?? 8;
+      t.font = `600 ${bt}px "${Y}", sans-serif`, t.fillStyle = ht, t.textAlign = "left", t.textBaseline = "bottom";
       const Mt = -(s / 2), It = -(n / 2) - wt;
       t.fillText(nt, Mt, It);
     }
     if (u.visible === !0) {
-      const nt = u.text || "Helper text", yt = u.fontSize || 11, ct = c === "error" ? "rgba(239, 68, 68, 1)" : u.color || "rgba(156, 163, 175, 1)", wt = u.offset ?? 6;
-      t.font = `400 ${yt}px "${Y}", sans-serif`, t.fillStyle = ct, t.textAlign = "left", t.textBaseline = "top";
+      const nt = u.text || "Helper text", bt = u.fontSize || 11, ht = c === "error" ? "rgba(239, 68, 68, 1)" : u.color || "rgba(156, 163, 175, 1)", wt = u.offset ?? 6;
+      t.font = `400 ${bt}px "${Y}", sans-serif`, t.fillStyle = ht, t.textAlign = "left", t.textBaseline = "top";
       const Mt = -(s / 2), It = n / 2 + wt;
       t.fillText(nt, Mt, It);
     }
   }
   renderSlider(t, i) {
-    const o = this.objectStates.get(i.id), e = (o == null ? void 0 : o.geometry) || i.geometry, s = (o == null ? void 0 : o.options) || i.options || {}, n = e.width || 200, a = s.value ?? 50, r = s.min ?? 0, c = (s.max ?? 100) - r, f = c === 0 ? 0 : (a - r) / c, u = s.trackHeight || 4, h = s.trackRoundedness ?? 2, d = s.trackShape ?? "Rectangle", p = s.trackPath || "", y = s.accentColor || "#3b82f6", m = s.inactiveColor || "#374151", b = s.thumbShape || "Ellipse", v = s.thumbWidth ?? 16, S = s.thumbHeight ?? 16, C = s.thumbRoundedness ?? 0, w = s.thumbColor || "#ffffff", I = s.thumbPath || "", M = s.thumbIcon || "", k = s.showValueTooltip ?? !1, T = s.tooltipBgColor || "#333333", R = s.tooltipColor || "#ffffff", P = s.tooltipOffsetX ?? 0, E = s.tooltipOffsetY ?? -25, x = (X, V, it, rt, nt, yt, ct) => {
-      if ((X === "Custom" || X === "Icon") && ct)
+    const o = this.objectStates.get(i.id), e = (o == null ? void 0 : o.geometry) || i.geometry, s = (o == null ? void 0 : o.options) || i.options || {}, n = e.width || 200, a = s.value ?? 50, r = s.min ?? 0, c = (s.max ?? 100) - r, f = c === 0 ? 0 : (a - r) / c, u = s.trackHeight || 4, h = s.trackRoundedness ?? 2, d = s.trackShape ?? "Rectangle", p = s.trackPath || "", y = s.accentColor || "#3b82f6", m = s.inactiveColor || "#374151", b = s.thumbShape || "Ellipse", v = s.thumbWidth ?? 16, S = s.thumbHeight ?? 16, C = s.thumbRoundedness ?? 0, w = s.thumbColor || "#ffffff", I = s.thumbPath || "", M = s.thumbIcon || "", k = s.showValueTooltip ?? !1, T = s.tooltipBgColor || "#333333", R = s.tooltipColor || "#ffffff", P = s.tooltipOffsetX ?? 0, E = s.tooltipOffsetY ?? -25, x = (X, V, it, lt, nt, bt, ht) => {
+      if ((X === "Custom" || X === "Icon") && ht)
         try {
-          const wt = new Path2D(ct);
+          const wt = new Path2D(ht);
           if (t.save(), t.translate(V, it), X === "Icon") {
-            const Mt = Math.min(rt, nt) / 24;
+            const Mt = Math.min(lt, nt) / 24;
             t.scale(Mt, Mt), t.translate(-12, -12);
           }
           t.fill(wt), t.restore();
@@ -4354,28 +4357,28 @@ class ci {
           console.error("Error drawing slider shape in engine:", wt);
         }
       if (t.beginPath(), X === "Ellipse")
-        t.ellipse(V, it, rt / 2, nt / 2, 0, 0, Math.PI * 2);
+        t.ellipse(V, it, lt / 2, nt / 2, 0, 0, Math.PI * 2);
       else if (X === "Rectangle")
-        this.drawRoundRect(t, V - rt / 2, it - nt / 2, rt, nt, yt);
+        this.drawRoundRect(t, V - lt / 2, it - nt / 2, lt, nt, bt);
       else if (X === "Triangle")
-        t.moveTo(V, it - nt / 2), t.lineTo(V + rt / 2, it + nt / 2), t.lineTo(V - rt / 2, it + nt / 2), t.closePath();
+        t.moveTo(V, it - nt / 2), t.lineTo(V + lt / 2, it + nt / 2), t.lineTo(V - lt / 2, it + nt / 2), t.closePath();
       else if (X === "Diamond")
-        t.moveTo(V, it - nt / 2), t.lineTo(V + rt / 2, it), t.lineTo(V, it + nt / 2), t.lineTo(V - rt / 2, it), t.closePath();
+        t.moveTo(V, it - nt / 2), t.lineTo(V + lt / 2, it), t.lineTo(V, it + nt / 2), t.lineTo(V - lt / 2, it), t.closePath();
       else if (X === "Polygon") {
-        const wt = i.geometry.sides || 3, Mt = i.geometry.radius || Math.min(rt, nt) / 2;
+        const wt = i.geometry.sides || 3, Mt = i.geometry.radius || Math.min(lt, nt) / 2;
         for (let It = 0; It < wt; It++) {
           const Ot = It * 2 * Math.PI / wt - Math.PI / 2, At = V + Mt * Math.cos(Ot), Tt = it + Mt * Math.sin(Ot);
           It === 0 ? t.moveTo(At, Tt) : t.lineTo(At, Tt);
         }
         t.closePath();
       } else if (X === "Star") {
-        const Mt = Math.min(rt, nt) / 2, It = Mt / 2;
+        const Mt = Math.min(lt, nt) / 2, It = Mt / 2;
         for (let Ot = 0; Ot < 10; Ot++) {
           const At = Ot % 2 === 0 ? Mt : It, Tt = Ot * Math.PI / 5 - Math.PI / 2;
           t.lineTo(V + At * Math.cos(Tt), it + At * Math.sin(Tt));
         }
         t.closePath();
-      } else X === "Line" && (t.moveTo(V - rt / 2, it), t.lineTo(V + rt / 2, it));
+      } else X === "Line" && (t.moveTo(V - lt / 2, it), t.lineTo(V + lt / 2, it));
       t.fill();
     }, O = this.createCanvasFill(t, m, n, u);
     O && (t.fillStyle = O, t.strokeStyle = O), d === "Line" ? (t.lineWidth = u, t.beginPath(), t.moveTo(-n / 2, 0), t.lineTo(n / 2, 0), t.stroke()) : x(d, 0, 0, n, u, h, p);
@@ -4392,21 +4395,21 @@ class ci {
       t.save(), t.translate(B + P, E);
       const X = Math.round(a).toString();
       t.font = "10px Inter, sans-serif";
-      const V = t.measureText(X), it = 6, rt = 4, nt = V.width + it * 2, yt = 14 + rt;
-      t.beginPath(), this.drawRoundRect(t, -nt / 2, -yt / 2, nt, yt, 4), t.fillStyle = T, t.fill(), t.fillStyle = R, t.textAlign = "center", t.textBaseline = "middle", t.fillText(X, 0, 0), t.restore();
+      const V = t.measureText(X), it = 6, lt = 4, nt = V.width + it * 2, bt = 14 + lt;
+      t.beginPath(), this.drawRoundRect(t, -nt / 2, -bt / 2, nt, bt, 4), t.fillStyle = T, t.fill(), t.fillStyle = R, t.textAlign = "center", t.textBaseline = "middle", t.fillText(X, 0, 0), t.restore();
     }
     const A = s.label || {}, _ = s.helperText || {}, L = s.fontFamily || "Inter";
     if (A.visible !== !1) {
-      const X = A.text || "Label", V = A.fontSize || 12, it = A.color || "rgba(156, 163, 175, 1)", rt = A.offset ?? 8;
+      const X = A.text || "Label", V = A.fontSize || 12, it = A.color || "rgba(156, 163, 175, 1)", lt = A.offset ?? 8;
       t.font = `600 ${V}px "${L}", sans-serif`, t.fillStyle = it, t.textAlign = "left", t.textBaseline = "bottom";
-      const nt = -(n / 2), yt = -(u / 2) - rt;
-      t.fillText(X, nt, yt);
+      const nt = -(n / 2), bt = -(u / 2) - lt;
+      t.fillText(X, nt, bt);
     }
     if (_.visible === !0) {
-      const X = _.text || "Helper text", V = _.fontSize || 11, it = _.color || "rgba(156, 163, 175, 1)", rt = _.offset ?? 6;
+      const X = _.text || "Helper text", V = _.fontSize || 11, it = _.color || "rgba(156, 163, 175, 1)", lt = _.offset ?? 6;
       t.font = `400 ${V}px "${L}", sans-serif`, t.fillStyle = it, t.textAlign = "left", t.textBaseline = "top";
-      const nt = -(n / 2), yt = u / 2 + rt;
-      t.fillText(X, nt, yt);
+      const nt = -(n / 2), bt = u / 2 + lt;
+      t.fillText(X, nt, bt);
     }
   }
   renderDropdown(t, i) {
@@ -4452,14 +4455,14 @@ class ci {
       _ > 0 && (t.shadowColor = "transparent", t.strokeStyle = this.createCanvasFill(t, typeof e.listBorderColor == "string" ? { type: "Solid", color: e.listBorderColor } : e.listBorderColor || { type: "Solid", color: d }, s, $) || "#e5e7eb", t.lineWidth = _, t.stroke()), t.restore();
       const L = e.itemFontSize || I, X = e.itemFontFamily || k;
       t.font = `${M} ${L}px ${X}`, O.forEach((V, it) => {
-        const rt = x + B + it * W;
+        const lt = x + B + it * W;
         if (V === e.selectedOption)
-          t.fillStyle = this.createCanvasFill(t, typeof e.itemSelectedBackgroundColor == "string" ? { type: "Solid", color: e.itemSelectedBackgroundColor } : e.itemSelectedBackgroundColor || { type: "Solid", color: "#f3f4f6" }, s, W) || "#f3f4f6", t.fillRect(a + _, rt, s - _ * 2, W), t.fillStyle = e.itemSelectedColor || e.accentColor || p || "#374151";
+          t.fillStyle = this.createCanvasFill(t, typeof e.itemSelectedBackgroundColor == "string" ? { type: "Solid", color: e.itemSelectedBackgroundColor } : e.itemSelectedBackgroundColor || { type: "Solid", color: "#f3f4f6" }, s, W) || "#f3f4f6", t.fillRect(a + _, lt, s - _ * 2, W), t.fillStyle = e.itemSelectedColor || e.accentColor || p || "#374151";
         else if (t.fillStyle = e.listTextColor || p || "#333333", this.activeDropdownId === i.id && this._lastPointerPos) {
-          const yt = this._lastPointerPos.y - (x + B), ct = Math.floor(yt / W);
-          it === ct && (t.fillStyle = this.createCanvasFill(t, typeof e.itemHoverBackgroundColor == "string" ? { type: "Solid", color: e.itemHoverBackgroundColor } : e.itemHoverBackgroundColor || { type: "Solid", color: "#f9fafb" }, s, W) || "#f9fafb", t.fillRect(a + _, rt, s - _ * 2, W), t.fillStyle = e.itemHoverColor || p);
+          const bt = this._lastPointerPos.y - (x + B), ht = Math.floor(bt / W);
+          it === ht && (t.fillStyle = this.createCanvasFill(t, typeof e.itemHoverBackgroundColor == "string" ? { type: "Solid", color: e.itemHoverBackgroundColor } : e.itemHoverBackgroundColor || { type: "Solid", color: "#f9fafb" }, s, W) || "#f9fafb", t.fillRect(a + _, lt, s - _ * 2, W), t.fillStyle = e.itemHoverColor || p);
         }
-        t.fillText(V, a + b, rt + W / 2);
+        t.fillText(V, a + b, lt + W / 2);
       });
     }
     t.globalAlpha = y;
@@ -4492,14 +4495,14 @@ class ci {
     t.font = `${f.fontWeight || 600} ${d}px "${p}", sans-serif`, t.fillStyle = h, t.textAlign = "center", t.textBaseline = "middle", t.fillText(f.text || "Toggle", 0, 0), t.restore();
   }
   renderToggle(t, i) {
-    var Y, H, K, A, _, L, X, V, it, rt, nt, yt;
+    var Y, H, K, A, _, L, X, V, it, lt, nt, bt;
     const o = this.objectStates.get(i.id), e = (o == null ? void 0 : o.options) || i.options || {}, s = ((Y = i.geometry) == null ? void 0 : Y.width) || 52, n = ((H = i.geometry) == null ? void 0 : H.height) || 30, a = -s / 2, r = -n / 2, l = e.checked ?? !1, c = e.cornerRadius ?? e.corner_radius ?? n / 2, f = e.toggleStyle || {}, u = f.backgroundColor || e.activeColor || "#10b981", h = f.borderColor || e.borderColor || "transparent", d = f.borderWidth ?? e.borderWidth ?? 0, p = f.knobColor || e.knobColor || "#ffffff", y = l ? u : e.inactiveColor || "#374151", m = l ? h : e.borderColor || "transparent", b = l ? d : e.borderWidth ?? 0, v = l ? p : e.knobColor || "#ffffff";
     e.disabled && (t.globalAlpha *= 0.5), t.beginPath(), this.drawRoundRect(t, a, r, s, n, c);
     const S = this.createCanvasFill(t, y, s, n);
     if (S && (t.fillStyle = S, t.fill()), b > 0) {
       t.lineWidth = b;
-      const ct = this.createCanvasFill(t, m, s, n);
-      ct && (t.strokeStyle = ct, t.stroke());
+      const ht = this.createCanvasFill(t, m, s, n);
+      ht && (t.strokeStyle = ht, t.stroke());
     }
     const C = 2, w = n - C * 2, I = w / 2, M = a + C, k = a + s - C - w, T = l ? k : M, R = r + C;
     t.beginPath(), t.arc(T + I, R + I, I, 0, Math.PI * 2);
@@ -4508,20 +4511,20 @@ class ci {
     let E = !1, x = !1;
     const O = (l ? (K = f.leftLabel) == null ? void 0 : K.text : null) || ((A = e.leftLabel) == null ? void 0 : A.text) || "", W = (l ? (_ = f.leftLabel) == null ? void 0 : _.color : null) || ((L = e.leftLabel) == null ? void 0 : L.color) || "#f3f4f6";
     if ((X = e.leftLabel) != null && X.enabled && O) {
-      const ct = e.leftLabel;
-      t.font = `${ct.fontWeight || 400} ${ct.fontSize || 12}px "${ct.fontFamily || "Inter"}", sans-serif`, t.fillStyle = W, t.textBaseline = "middle", t.textAlign = "right", t.fillText(O, a - (ct.gap || 8), 0), E = !0;
+      const ht = e.leftLabel;
+      t.font = `${ht.fontWeight || 400} ${ht.fontSize || 12}px "${ht.fontFamily || "Inter"}", sans-serif`, t.fillStyle = W, t.textBaseline = "middle", t.textAlign = "right", t.fillText(O, a - (ht.gap || 8), 0), E = !0;
     }
-    const B = (l ? (V = f.rightLabel) == null ? void 0 : V.text : null) || ((it = e.rightLabel) == null ? void 0 : it.text) || "", $ = (l ? (rt = f.rightLabel) == null ? void 0 : rt.color : null) || ((nt = e.rightLabel) == null ? void 0 : nt.color) || "#f3f4f6";
-    if ((yt = e.rightLabel) != null && yt.enabled && B) {
-      const ct = e.rightLabel;
-      t.font = `${ct.fontWeight || 400} ${ct.fontSize || 12}px "${ct.fontFamily || "Inter"}", sans-serif`, t.fillStyle = $, t.textBaseline = "middle", t.textAlign = "left", t.fillText(B, a + s + (ct.gap || 8), 0), x = !0;
+    const B = (l ? (V = f.rightLabel) == null ? void 0 : V.text : null) || ((it = e.rightLabel) == null ? void 0 : it.text) || "", $ = (l ? (lt = f.rightLabel) == null ? void 0 : lt.color : null) || ((nt = e.rightLabel) == null ? void 0 : nt.color) || "#f3f4f6";
+    if ((bt = e.rightLabel) != null && bt.enabled && B) {
+      const ht = e.rightLabel;
+      t.font = `${ht.fontWeight || 400} ${ht.fontSize || 12}px "${ht.fontFamily || "Inter"}", sans-serif`, t.fillStyle = $, t.textBaseline = "middle", t.textAlign = "left", t.fillText(B, a + s + (ht.gap || 8), 0), x = !0;
     }
     if (!E && !x && e.label && e.label.text) {
-      const ct = e.label, wt = ct.fontSize || 14, Mt = ct.fontWeight || 400, It = ct.fontFamily || "Inter";
-      t.font = `${Mt} ${wt}px "${It}", sans-serif`, t.fillStyle = ct.color || "#f3f4f6", t.textBaseline = "middle";
-      const Ot = ct.gap || 10;
+      const ht = e.label, wt = ht.fontSize || 14, Mt = ht.fontWeight || 400, It = ht.fontFamily || "Inter";
+      t.font = `${Mt} ${wt}px "${It}", sans-serif`, t.fillStyle = ht.color || "#f3f4f6", t.textBaseline = "middle";
+      const Ot = ht.gap || 10;
       let At = 0, Tt = 0;
-      ct.position === "left" ? (t.textAlign = "right", At = a - Ot, Tt = 0) : ct.position === "right" ? (t.textAlign = "left", At = a + s + Ot, Tt = 0) : ct.position === "top" ? (t.textAlign = "center", At = 0, Tt = r - Ot, t.textBaseline = "bottom") : ct.position === "bottom" ? (t.textAlign = "center", At = 0, Tt = r + n + Ot, t.textBaseline = "top") : (t.textAlign = "left", At = a + s + Ot, Tt = 0), t.fillText(ct.text, At, Tt);
+      ht.position === "left" ? (t.textAlign = "right", At = a - Ot, Tt = 0) : ht.position === "right" ? (t.textAlign = "left", At = a + s + Ot, Tt = 0) : ht.position === "top" ? (t.textAlign = "center", At = 0, Tt = r - Ot, t.textBaseline = "bottom") : ht.position === "bottom" ? (t.textAlign = "center", At = 0, Tt = r + n + Ot, t.textBaseline = "top") : (t.textAlign = "left", At = a + s + Ot, Tt = 0), t.fillText(ht.text, At, Tt);
     }
   }
   renderCheckbox(t, i) {
@@ -5142,24 +5145,24 @@ class ci {
         L = vt + Math.cos(ut) * pt - A / 2, X = xt + Math.sin(ut) * pt - _ / 2, V = ut + (e.itemRotation || 0) * Math.PI / 180;
       } else
         L = c === "vertical" ? a : E, X = c === "vertical" ? E : r, V = (e.itemRotation || 0) * Math.PI / 180;
-      const it = C === H, rt = w === H, nt = rt && e.activeItemShape ? e.activeItemShape : e.itemShape || "rectangle", yt = rt && e.activeItemShape ? e.activeItemPath : e.itemPath || "", ct = e.itemCornerRadius || 0;
-      if (t.save(), V !== 0 && (t.translate(L + A / 2, X + _ / 2), t.rotate(V), t.translate(-(L + A / 2), -(X + _ / 2))), rt) {
+      const it = C === H, lt = w === H, nt = lt && e.activeItemShape ? e.activeItemShape : e.itemShape || "rectangle", bt = lt && e.activeItemShape ? e.activeItemPath : e.itemPath || "", ht = e.itemCornerRadius || 0;
+      if (t.save(), V !== 0 && (t.translate(L + A / 2, X + _ / 2), t.rotate(V), t.translate(-(L + A / 2), -(X + _ / 2))), lt) {
         const Tt = this.createCanvasFill(t, b, A, _);
         t.fillStyle = Tt || b;
         const zt = t.globalAlpha;
-        t.globalAlpha = zt * 0.8, t.beginPath(), this.drawCustomShape(t, nt, yt, L, X, A, _, ct) || (t.rect(L, X, A, _), t.fill()), t.globalAlpha = zt;
+        t.globalAlpha = zt * 0.8, t.beginPath(), this.drawCustomShape(t, nt, bt, L, X, A, _, ht) || (t.rect(L, X, A, _), t.fill()), t.globalAlpha = zt;
       } else if (it)
-        t.fillStyle = m ? "rgba(255, 255, 255, 0.1)" : "rgba(0, 0, 0, 0.05)", t.beginPath(), this.drawCustomShape(t, nt, yt, L, X, A, _, ct) || (t.rect(L, X, A, _), t.fill());
+        t.fillStyle = m ? "rgba(255, 255, 255, 0.1)" : "rgba(0, 0, 0, 0.05)", t.beginPath(), this.drawCustomShape(t, nt, bt, L, X, A, _, ht) || (t.rect(L, X, A, _), t.fill());
       else if (S !== "transparent") {
         const Tt = this.createCanvasFill(t, S, A, _);
-        t.fillStyle = Tt || S, t.beginPath(), this.drawCustomShape(t, nt, yt, L, X, A, _, ct) || (t.rect(L, X, A, _), t.fill());
+        t.fillStyle = Tt || S, t.beginPath(), this.drawCustomShape(t, nt, bt, L, X, A, _, ht) || (t.rect(L, X, A, _), t.fill());
       }
-      if (rt || it) {
+      if (lt || it) {
         const Tt = this.createCanvasFill(t, b, c === "vertical" ? 3 : A, c === "vertical" ? _ : 3);
         t.fillStyle = Tt || b, c === "vertical" ? t.fillRect(L, X, 3, _) : t.fillRect(L, X + _ - 3, A, 3);
       }
-      const wt = rt ? "#ffffff" : m ? "rgba(255, 255, 255, 0.9)" : v;
-      t.fillStyle = wt, t.font = rt || it ? "600 14px Inter, sans-serif" : "400 14px Inter, sans-serif";
+      const wt = lt ? "#ffffff" : m ? "rgba(255, 255, 255, 0.9)" : v;
+      t.fillStyle = wt, t.font = lt || it ? "600 14px Inter, sans-serif" : "400 14px Inter, sans-serif";
       const Mt = typeof Y == "string" ? Y : (Y == null ? void 0 : Y.label) || `Item ${H + 1}`, It = L + (c === "vertical" ? 16 : A / 2), Ot = X + _ / 2;
       c === "horizontal" || K === "circular" ? t.textAlign = "center" : t.textAlign = "left";
       const At = K === "circular" ? L + A / 2 : It;
@@ -5171,11 +5174,11 @@ class ci {
         if (A) {
           const X = Math.min(s, n) / 2 - L / 2 - 2, V = a + s / 2, it = r + n / 2;
           if (t.strokeStyle = _, t.lineWidth = L, t.lineCap = "round", t.beginPath(), K === "circular") {
-            const rt = Math.PI / 4, nt = -(p * 0.01) - Math.PI / 2;
-            t.arc(V, it, X, nt, nt + rt);
+            const lt = Math.PI / 4, nt = -(p * 0.01) - Math.PI / 2;
+            t.arc(V, it, X, nt, nt + lt);
           } else {
-            const rt = Math.PI / 2, nt = H / Y, yt = rt * nt, ct = -p / Y * rt, Mt = -Math.PI / 4 + ct;
-            t.arc(V, it, X, Mt, Mt + yt);
+            const lt = Math.PI / 2, nt = H / Y, bt = lt * nt, ht = -p / Y * lt, Mt = -Math.PI / 4 + ht;
+            t.arc(V, it, X, Mt, Mt + bt);
           }
           t.stroke();
         } else {
@@ -5233,8 +5236,8 @@ class ci {
       } else
         A = l === "vertical" ? I : T, _ = l === "vertical" ? T : M, L = (e.itemRotation || 0) * Math.PI / 180;
       if (L !== 0) {
-        const X = A + H / 2, V = _ + K / 2, it = C - X, rt = w - V, nt = -L, yt = it * Math.cos(nt) - rt * Math.sin(nt) + X, ct = it * Math.sin(nt) + rt * Math.cos(nt) + V;
-        if (yt >= A && yt <= A + H && ct >= _ && ct <= _ + K)
+        const X = A + H / 2, V = _ + K / 2, it = C - X, lt = w - V, nt = -L, bt = it * Math.cos(nt) - lt * Math.sin(nt) + X, ht = it * Math.sin(nt) + lt * Math.cos(nt) + V;
+        if (bt >= A && bt <= A + H && ht >= _ && ht <= _ + K)
           return Y;
       } else if (C >= A && C <= A + H && w >= _ && w <= _ + K)
         return Y;
@@ -5256,7 +5259,7 @@ class ci {
       if (!e.behaviors || e.behaviors.length === 0) return;
       const s = this.objectStates.get(e.id);
       s && e.behaviors.forEach((n) => {
-        var u, h, d, p, y, m, b, v, S, C, w, I, M, k, T, R, P, E, x, O, W, B, $, Y, H, K, A, _, L, X, V, it, rt, nt, yt, ct, wt, Mt, It, Ot, At, Tt, zt, Z, pt, Et, ut, vt, xt, Xt, Bt, Dt, Ht, te, ue, pe, Qt, me, _e, ye, Se, Pe, ae, ee, ht, bt, j, z, D, et, gt, Pt, Ct, Wt, mt, F, Lt, jt, Vt, ce, Rt, ft, lt, tt, dt, G, st, J, Ft, Ut, se, Yt, qt, Nt, Ce, Ee, Ae, Oe, Re, xe, $e, Gt, ie, be, Le, Fe, he, re, le, we, We, Ge, De, Be, ze, Ve, Ze, je;
+        var u, h, d, p, y, m, b, v, S, C, w, I, M, k, T, R, P, E, x, O, W, B, $, Y, H, K, A, _, L, X, V, it, lt, nt, bt, ht, wt, Mt, It, Ot, At, Tt, zt, Z, pt, Et, ut, vt, xt, Xt, Bt, Dt, Ht, te, ue, pe, Qt, me, _e, ye, Se, Pe, ae, ee, at, gt, j, z, D, et, mt, Pt, Ct, Wt, yt, F, Lt, jt, Vt, ce, Rt, ft, ct, tt, dt, G, st, J, Ft, Ut, se, Yt, qt, Nt, Ce, Ee, Ae, Oe, Re, xe, $e, Gt, ie, be, Le, Fe, he, re, le, we, We, Ge, De, Be, ze, Ve, Ze, je;
         if (!n.enabled) return;
         const a = n.startTime || 0, r = n.endTime || 1 / 0;
         if (this.currentTime < a || this.currentTime > r) return;
@@ -5264,14 +5267,14 @@ class ci {
         if (this.frameCount % 240 === 0 && Math.random() < 0.1 && this.log(`[ExodeUI] Executing ${n.type} on ${e.name}`), n.type === N.Proximity) {
           const U = ((u = n.settings) == null ? void 0 : u.radius) || 300, Q = ((h = n.settings) == null ? void 0 : h.falloff) || "smooth";
           let q = 0;
-          f < U && (Q === "linear" ? q = 1 - f / U : q = Math.pow(1 - f / U, 2)), n.sensors.forEach((at) => {
-            this.applyBehaviorSensor(s, at, q, t, n.settings, e, l, c, f);
+          f < U && (Q === "linear" ? q = 1 - f / U : q = Math.pow(1 - f / U, 2)), n.sensors.forEach((rt) => {
+            this.applyBehaviorSensor(s, rt, q, t, n.settings, e, l, c, f);
           });
         } else if (n.type === N.Magnetic) {
           const U = ((d = n.settings) == null ? void 0 : d.radius) || 400, Q = ((p = n.settings) == null ? void 0 : p.strength) || 0.5;
           if (f < U && f > 5) {
-            const q = 1 - f / U, at = l * q * Q, kt = c * q * Q;
-            s.x -= at * t * 10, s.y -= kt * t * 10;
+            const q = 1 - f / U, rt = l * q * Q, kt = c * q * Q;
+            s.x -= rt * t * 10, s.y -= kt * t * 10;
           }
         } else if (n.type === N.Repel) {
           const U = ((y = n.settings) == null ? void 0 : y.radius) || 300, Q = ((m = n.settings) == null ? void 0 : m.strength) || 1;
@@ -5285,14 +5288,14 @@ class ci {
         } else if (n.type === N.Vortex) {
           const U = ((S = n.settings) == null ? void 0 : S.radius) || 400, Q = ((C = n.settings) == null ? void 0 : C.speed) || 2, q = ((w = n.settings) == null ? void 0 : w.strength) || 1;
           if (f < U) {
-            const at = Math.pow(1 - f / U, 1.5), kt = this.currentTime * Q * Math.PI * 2, _t = Math.cos(kt) * 30 - l * 0.4, $t = Math.sin(kt) * 30 - c * 0.4;
-            s.x += _t * at * q * t * 5, s.y += $t * at * q * t * 5, s.rotation += 5 * at * q * t * 5, s.scale_x *= 1 - at * 0.1 * q * t, s.scale_y *= 1 - at * 0.1 * q * t;
+            const rt = Math.pow(1 - f / U, 1.5), kt = this.currentTime * Q * Math.PI * 2, _t = Math.cos(kt) * 30 - l * 0.4, $t = Math.sin(kt) * 30 - c * 0.4;
+            s.x += _t * rt * q * t * 5, s.y += $t * rt * q * t * 5, s.rotation += 5 * rt * q * t * 5, s.scale_x *= 1 - rt * 0.1 * q * t, s.scale_y *= 1 - rt * 0.1 * q * t;
           }
         } else if (n.type === N.Fluid) {
           const U = ((I = n.settings) == null ? void 0 : I.radius) || 300, Q = ((M = n.settings) == null ? void 0 : M.strength) || 1;
           if (f < U) {
-            const q = Math.pow(1 - f / U, 1.2), at = l / (f || 1) * q * 1.2 * Q, kt = c / (f || 1) * q * 1.2 * Q;
-            s.x += at * 10 * t * 5, s.y += kt * 10 * t * 5, s.scale_x *= 1 + q * 0.3 * Q * t, s.scale_y *= 1 + q * 0.3 * Q * t;
+            const q = Math.pow(1 - f / U, 1.2), rt = l / (f || 1) * q * 1.2 * Q, kt = c / (f || 1) * q * 1.2 * Q;
+            s.x += rt * 10 * t * 5, s.y += kt * 10 * t * 5, s.scale_x *= 1 + q * 0.3 * Q * t, s.scale_y *= 1 + q * 0.3 * Q * t;
           }
         } else if (n.type === N.Elastic) {
           const U = ((k = n.settings) == null ? void 0 : k.radius) || 300, Q = ((T = n.settings) == null ? void 0 : T.strength) || 1;
@@ -5303,8 +5306,8 @@ class ci {
         } else if (n.type === N.Holographic) {
           const U = s.x - this.canvasWidth / 2, Q = s.y - this.canvasHeight / 2, q = ((R = n.settings) == null ? void 0 : R.factor) || 25;
           if (s.x -= U / 1e3 * q * t * 5, s.y -= Q / 1e3 * q * t * 5, s.style) {
-            const at = 1 - Math.min(1, f / 400);
-            s.style.exposure = (s.style.exposure || 1) + at * 0.5 * t;
+            const rt = 1 - Math.min(1, f / 400);
+            s.style.exposure = (s.style.exposure || 1) + rt * 0.5 * t;
           }
         } else if (n.type === N.Sticky) {
           const U = ((P = n.settings) == null ? void 0 : P.radius) || 80, Q = ((E = n.settings) == null ? void 0 : E.strength) || 1;
@@ -5319,17 +5322,17 @@ class ci {
             s.scale_x *= 1 + q * 0.5 * Q * t, s.scale_y *= 1 + q * 0.5 * Q * t;
           }
         } else if (n.type === N.Parallax) {
-          const U = ((W = n.settings) == null ? void 0 : W.factor) || 15, Q = ((B = n.settings) == null ? void 0 : B.strength) || 1, q = this.canvasWidth / 2, at = this.canvasHeight / 2, kt = this._lastPointerPos || { x: q, y: at }, _t = (kt.x - q) / q, $t = (kt.y - at) / at, Zt = ((($ = e.transform) == null ? void 0 : $.x) ?? 0) + _t * U * Q, fe = (((Y = e.transform) == null ? void 0 : Y.y) ?? 0) + $t * U * Q, Ie = (((H = e.transform) == null ? void 0 : H.rotate_x) ?? 0) - $t * U * 1.5 * Q, ne = (((K = e.transform) == null ? void 0 : K.rotate_y) ?? 0) + _t * U * 1.5 * Q, ge = Math.min(1, 10 * t);
+          const U = ((W = n.settings) == null ? void 0 : W.factor) || 15, Q = ((B = n.settings) == null ? void 0 : B.strength) || 1, q = this.canvasWidth / 2, rt = this.canvasHeight / 2, kt = this._lastPointerPos || { x: q, y: rt }, _t = (kt.x - q) / q, $t = (kt.y - rt) / rt, Zt = ((($ = e.transform) == null ? void 0 : $.x) ?? 0) + _t * U * Q, fe = (((Y = e.transform) == null ? void 0 : Y.y) ?? 0) + $t * U * Q, Ie = (((H = e.transform) == null ? void 0 : H.rotate_x) ?? 0) - $t * U * 1.5 * Q, ne = (((K = e.transform) == null ? void 0 : K.rotate_y) ?? 0) + _t * U * 1.5 * Q, ge = Math.min(1, 10 * t);
           s.x = this.lerp(s.x ?? ((A = e.transform) == null ? void 0 : A.x) ?? 0, Zt, ge), s.y = this.lerp(s.y ?? ((_ = e.transform) == null ? void 0 : _.y) ?? 0, fe, ge), s.rotate_x = this.lerp(s.rotate_x ?? ((L = e.transform) == null ? void 0 : L.rotate_x) ?? 0, Ie, ge), s.rotate_y = this.lerp(s.rotate_y ?? ((X = e.transform) == null ? void 0 : X.rotate_y) ?? 0, ne, ge);
         } else if (n.type === N.Fold) {
           if (f < 300) {
-            const U = 1 - f / 300, Q = (l > 0 ? -1 : 1) * U * 10, q = 1 - U * 0.1, at = c / 300 * U * 20, kt = -(l / 300) * U * 20, _t = Math.min(1, 10 * t);
-            s.skew_x = this.lerp(s.skew_x ?? ((V = e.transform) == null ? void 0 : V.skew_x) ?? 0, Q, _t), s.scale_y = this.lerp(s.scale_y ?? ((it = e.transform) == null ? void 0 : it.scale_y) ?? 1, (((rt = e.transform) == null ? void 0 : rt.scale_y) ?? 1) * q, _t), s.rotate_x = this.lerp(s.rotate_x ?? ((nt = e.transform) == null ? void 0 : nt.rotate_x) ?? 0, at, _t), s.rotate_y = this.lerp(s.rotate_y ?? ((yt = e.transform) == null ? void 0 : yt.rotate_y) ?? 0, kt, _t), s.style = s.style || { ...e.style }, s.style.artEffect = { enabled: !0, type: "fold_overlay", intensity: ((ct = n.settings) == null ? void 0 : ct.opacity) ?? 0.5 };
+            const U = 1 - f / 300, Q = (l > 0 ? -1 : 1) * U * 10, q = 1 - U * 0.1, rt = c / 300 * U * 20, kt = -(l / 300) * U * 20, _t = Math.min(1, 10 * t);
+            s.skew_x = this.lerp(s.skew_x ?? ((V = e.transform) == null ? void 0 : V.skew_x) ?? 0, Q, _t), s.scale_y = this.lerp(s.scale_y ?? ((it = e.transform) == null ? void 0 : it.scale_y) ?? 1, (((lt = e.transform) == null ? void 0 : lt.scale_y) ?? 1) * q, _t), s.rotate_x = this.lerp(s.rotate_x ?? ((nt = e.transform) == null ? void 0 : nt.rotate_x) ?? 0, rt, _t), s.rotate_y = this.lerp(s.rotate_y ?? ((bt = e.transform) == null ? void 0 : bt.rotate_y) ?? 0, kt, _t), s.style = s.style || { ...e.style }, s.style.artEffect = { enabled: !0, type: "fold_overlay", intensity: ((ht = n.settings) == null ? void 0 : ht.opacity) ?? 0.5 };
           }
         } else if (n.type === N.Crumple) {
           if (f < 300) {
-            const U = 1 - f / 300, Q = U * (Math.random() - 0.5) * 5, q = U * (Math.random() - 0.5) * 0.05, at = Math.min(1, 15 * t);
-            s.skew_x = this.lerp(s.skew_x ?? ((wt = e.transform) == null ? void 0 : wt.skew_x) ?? 0, Q, at), s.scale_x = this.lerp(s.scale_x ?? ((Mt = e.transform) == null ? void 0 : Mt.scale_x) ?? 1, (((It = e.transform) == null ? void 0 : It.scale_x) ?? 1) * (1 + q), at), s.scale_y = this.lerp(s.scale_y ?? ((Ot = e.transform) == null ? void 0 : Ot.scale_y) ?? 1, (((At = e.transform) == null ? void 0 : At.scale_y) ?? 1) * (1 + q), at), s.style = s.style || { ...e.style }, s.style.artEffect = { enabled: !0, type: "crumple_overlay", intensity: ((Tt = n.settings) == null ? void 0 : Tt.intensity) ?? 1, scale: ((zt = n.settings) == null ? void 0 : zt.scale) ?? 2 };
+            const U = 1 - f / 300, Q = U * (Math.random() - 0.5) * 5, q = U * (Math.random() - 0.5) * 0.05, rt = Math.min(1, 15 * t);
+            s.skew_x = this.lerp(s.skew_x ?? ((wt = e.transform) == null ? void 0 : wt.skew_x) ?? 0, Q, rt), s.scale_x = this.lerp(s.scale_x ?? ((Mt = e.transform) == null ? void 0 : Mt.scale_x) ?? 1, (((It = e.transform) == null ? void 0 : It.scale_x) ?? 1) * (1 + q), rt), s.scale_y = this.lerp(s.scale_y ?? ((Ot = e.transform) == null ? void 0 : Ot.scale_y) ?? 1, (((At = e.transform) == null ? void 0 : At.scale_y) ?? 1) * (1 + q), rt), s.style = s.style || { ...e.style }, s.style.artEffect = { enabled: !0, type: "crumple_overlay", intensity: ((Tt = n.settings) == null ? void 0 : Tt.intensity) ?? 1, scale: ((zt = n.settings) == null ? void 0 : zt.scale) ?? 2 };
           }
         } else if (n.type === N.Squash) {
           const U = ((Z = n.settings) == null ? void 0 : Z.strength) || 0.8;
@@ -5337,7 +5340,7 @@ class ci {
         } else if (n.type === N.TextCounter) {
           const U = ((xt = n.settings) == null ? void 0 : xt.duration) || 2, Q = ((Xt = n.settings) == null ? void 0 : Xt.from) || 0, q = ((Bt = n.settings) == null ? void 0 : Bt.to) || 100;
           n._runtimeStart === void 0 && (n._runtimeStart = this.currentTime);
-          const at = this.currentTime - n._runtimeStart, kt = Math.min(1, at / U), _t = Math.floor(Q + (q - Q) * kt);
+          const rt = this.currentTime - n._runtimeStart, kt = Math.min(1, rt / U), _t = Math.floor(Q + (q - Q) * kt);
           if (((Dt = e.geometry) == null ? void 0 : Dt.type) === "Text") {
             const $t = ((Ht = n.settings) == null ? void 0 : Ht.prefix) || "", Zt = ((te = n.settings) == null ? void 0 : te.suffix) || "";
             s.geometry || (s.geometry = { ...e.geometry }), s.geometry.text = `${$t}${_t}${Zt}`;
@@ -5350,22 +5353,22 @@ class ci {
           } else
             (ye = s.style) != null && ye.adjustments && (s.style.adjustments.exposure = this.lerp(s.style.adjustments.exposure || 0, ((Pe = (Se = e.style) == null ? void 0 : Se.adjustments) == null ? void 0 : Pe.exposure) || 0, 0.1));
         } else if (n.type === N.Noise || n.type === N.Float) {
-          const U = (((ae = n.settings) == null ? void 0 : ae.frequency) || ((ee = n.settings) == null ? void 0 : ee.speed) || 1) * 2e-3, Q = (((ht = n.settings) == null ? void 0 : ht.amplitude) || ((bt = n.settings) == null ? void 0 : bt.range) || 50) * (((j = n.settings) == null ? void 0 : j.strength) || 1), q = Date.now();
+          const U = (((ae = n.settings) == null ? void 0 : ae.frequency) || ((ee = n.settings) == null ? void 0 : ee.speed) || 1) * 2e-3, Q = (((at = n.settings) == null ? void 0 : at.amplitude) || ((gt = n.settings) == null ? void 0 : gt.range) || 50) * (((j = n.settings) == null ? void 0 : j.strength) || 1), q = Date.now();
           s.x += Math.sin(q * U) * Q * t, s.y += Math.cos(q * U * 0.8) * Q * t, s.rotation += Math.sin(q * U * 0.5) * 5 * t;
         } else if (n.type === N.Pulse) {
-          const U = (((z = n.settings) == null ? void 0 : z.speed) || 1) * 5e-3, Q = (((D = n.settings) == null ? void 0 : D.scale) || 1.2) - 1, q = Math.sin(Date.now() * U), at = ((et = n.settings) == null ? void 0 : et.strength) || 1;
-          s.scale_x *= 1 + q * Q * at * t, s.scale_y *= 1 + q * Q * at * t, s.style && (s.style.exposure = (s.style.exposure || 1) + Math.max(0, q) * 0.1 * at * t);
+          const U = (((z = n.settings) == null ? void 0 : z.speed) || 1) * 5e-3, Q = (((D = n.settings) == null ? void 0 : D.scale) || 1.2) - 1, q = Math.sin(Date.now() * U), rt = ((et = n.settings) == null ? void 0 : et.strength) || 1;
+          s.scale_x *= 1 + q * Q * rt * t, s.scale_y *= 1 + q * Q * rt * t, s.style && (s.style.exposure = (s.style.exposure || 1) + Math.max(0, q) * 0.1 * rt * t);
         } else if (n.type === N.Draggable) {
-          const U = ((gt = n.settings) == null ? void 0 : gt.radius) || 150, Q = this.draggingBehaviors.has(e.id);
+          const U = ((mt = n.settings) == null ? void 0 : mt.radius) || 150, Q = this.draggingBehaviors.has(e.id);
           if (f < U || Q) {
-            const q = ((Pt = n.settings) == null ? void 0 : Pt.strength) || 1, at = Q ? 1 : Math.max(0, 1 - f / U);
-            this.applyBehaviorSensor(s, Kt.PositionX, at * q, t, n.settings), this.applyBehaviorSensor(s, Kt.PositionY, at * q, t, n.settings);
+            const q = ((Pt = n.settings) == null ? void 0 : Pt.strength) || 1, rt = Q ? 1 : Math.max(0, 1 - f / U);
+            this.applyBehaviorSensor(s, Kt.PositionX, rt * q, t, n.settings), this.applyBehaviorSensor(s, Kt.PositionY, rt * q, t, n.settings);
           }
         } else if (n.type === N.Scroll) {
-          const U = ((Ct = n.settings) == null ? void 0 : Ct.axis) || "vertical", Q = ((Wt = n.settings) == null ? void 0 : Wt.factor) || 0.5, q = ((mt = n.settings) == null ? void 0 : mt.strength) || 1, at = ((F = n.settings) == null ? void 0 : F.scaleFactor) || 0;
-          (U === "vertical" || U === "both") && (s.y += this.scrollOffset.y * Q * q * t), (U === "horizontal" || U === "both") && (s.x += this.scrollOffset.x * Q * q * t), at !== 0 && (s.scale_x *= 1 + this.scrollOffset.y * at * t, s.scale_y *= 1 + this.scrollOffset.y * at * t);
+          const U = ((Ct = n.settings) == null ? void 0 : Ct.axis) || "vertical", Q = ((Wt = n.settings) == null ? void 0 : Wt.factor) || 0.5, q = ((yt = n.settings) == null ? void 0 : yt.strength) || 1, rt = ((F = n.settings) == null ? void 0 : F.scaleFactor) || 0;
+          (U === "vertical" || U === "both") && (s.y += this.scrollOffset.y * Q * q * t), (U === "horizontal" || U === "both") && (s.x += this.scrollOffset.x * Q * q * t), rt !== 0 && (s.scale_x *= 1 + this.scrollOffset.y * rt * t, s.scale_y *= 1 + this.scrollOffset.y * rt * t);
         } else if (n.type === N.LookAt) {
-          const U = ((Lt = n.settings) == null ? void 0 : Lt.factor) || 1, Q = ((jt = n.settings) == null ? void 0 : jt.strength) || 1, q = Math.atan2(-c, -l) * (180 / Math.PI), at = s.rotation, kt = (q - at + 180) % 360 - 180;
+          const U = ((Lt = n.settings) == null ? void 0 : Lt.factor) || 1, Q = ((jt = n.settings) == null ? void 0 : jt.strength) || 1, q = Math.atan2(-c, -l) * (180 / Math.PI), rt = s.rotation, kt = (q - rt + 180) % 360 - 180;
           s.rotation += kt * U * Q * t * 10;
         } else if (n.type === N.Scan) {
           const U = (((Vt = n.settings) == null ? void 0 : Vt.speed) || 1) * 4e-3, Q = ((ce = n.settings) == null ? void 0 : ce.strength) || 1, q = (Math.sin(Date.now() * U) + 1) / 2;
@@ -5377,7 +5380,7 @@ class ci {
             intensity: ((Rt = n.settings) == null ? void 0 : Rt.strength) ?? 0.8
           };
         else if (n.type === N.Ratchet) {
-          const U = ((ft = n.settings) == null ? void 0 : ft.steps) || 12, Q = (((lt = n.settings) == null ? void 0 : lt.speed) || 1) * 30, q = Math.floor(s.rotation / (360 / U)) * (360 / U);
+          const U = ((ft = n.settings) == null ? void 0 : ft.steps) || 12, Q = (((ct = n.settings) == null ? void 0 : ct.speed) || 1) * 30, q = Math.floor(s.rotation / (360 / U)) * (360 / U);
           s.rotation = this.lerp(s.rotation, q + Q * t, 0.1);
         } else if (n.type === N.Jitter && f < 300) {
           const U = ((tt = n.settings) == null ? void 0 : tt.strength) || 1, Q = (((dt = n.settings) == null ? void 0 : dt.intensity) || 5) * U;
@@ -5387,8 +5390,8 @@ class ci {
           if (U) {
             const Q = this.objectStates.get(U);
             if (Q) {
-              const q = ((st = n.settings) == null ? void 0 : st.stiffness) || 0.1, at = Q.x - s.x, kt = Q.y - s.y;
-              s.x += at * q * t * 60, s.y += kt * q * t * 60;
+              const q = ((st = n.settings) == null ? void 0 : st.stiffness) || 0.1, rt = Q.x - s.x, kt = Q.y - s.y;
+              s.x += rt * q * t * 60, s.y += kt * q * t * 60;
             }
           }
         } else if (n.type === N.Wrap)
@@ -5417,30 +5420,30 @@ class ci {
           const U = (($e = n.settings) == null ? void 0 : $e.watchProperties) || ["x", "y", "scale_x", "scale_y", "opacity", "rotation"], Q = ((Gt = n.settings) == null ? void 0 : Gt.duration) || 0.3;
           this._layoutAnimCache.has(e.id) || this._layoutAnimCache.set(e.id, /* @__PURE__ */ new Map());
           const q = this._layoutAnimCache.get(e.id);
-          for (const at of U) {
-            const kt = this.getObjectProperty(s, e, at);
+          for (const rt of U) {
+            const kt = this.getObjectProperty(s, e, rt);
             if (kt === void 0) continue;
-            const _t = q.get(at);
+            const _t = q.get(rt);
             if (!_t)
-              q.set(at, {
+              q.set(rt, {
                 from: kt,
                 to: kt,
                 startTime: this.currentTime,
                 duration: 0
               });
             else if (_t.to !== kt) {
-              const Zt = this.getObjectProperty(s, e, at);
-              q.set(at, {
+              const Zt = this.getObjectProperty(s, e, rt);
+              q.set(rt, {
                 from: Zt ?? _t.from,
                 to: kt,
                 startTime: this.currentTime,
                 duration: ((ie = n.settings) == null ? void 0 : ie.duration) ?? Q
               });
             }
-            const $t = q.get(at);
+            const $t = q.get(rt);
             if ($t.duration > 0 && $t.from !== $t.to) {
               const Zt = this.currentTime - $t.startTime, fe = Math.min(1, Zt / $t.duration), Ie = this.applyEasing(fe, ((be = n.settings) == null ? void 0 : be.easing) || "easeOutCubic"), ne = $t.from + ($t.to - $t.from) * Ie;
-              this.setObjectProperty(s, e, at, ne);
+              this.setObjectProperty(s, e, rt, ne);
             }
           }
         } else if (n.type === N.StateReactive) {
@@ -5460,30 +5463,30 @@ class ci {
             "style.shadow.offsetX",
             "style.shadow.offsetY"
           ];
-          for (const at of q) {
-            const kt = this.getObjectProperty(s, e, at);
+          for (const rt of q) {
+            const kt = this.getObjectProperty(s, e, rt);
             if (kt === void 0 || typeof kt != "number") continue;
-            const _t = U.get(at);
+            const _t = U.get(rt);
             if (!_t)
-              U.set(at, {
+              U.set(rt, {
                 from: kt,
                 to: kt,
                 startTime: this.currentTime,
                 duration: 0
               });
             else if (_t.to !== kt) {
-              const Zt = this.getObjectProperty(s, e, at);
-              U.set(at, {
+              const Zt = this.getObjectProperty(s, e, rt);
+              U.set(rt, {
                 from: Zt ?? _t.from,
                 to: kt,
                 startTime: this.currentTime,
                 duration: Q
               });
             }
-            const $t = U.get(at);
+            const $t = U.get(rt);
             if ($t.duration > 0 && $t.from !== $t.to) {
               const Zt = this.currentTime - $t.startTime, fe = Math.min(1, Zt / $t.duration), Ie = this.applyEasing(fe, ((Fe = n.settings) == null ? void 0 : Fe.defaultEasing) || "easeOutCubic"), ne = $t.from + ($t.to - $t.from) * Ie;
-              this.setObjectProperty(s, e, at, ne);
+              this.setObjectProperty(s, e, rt, ne);
             }
           }
         } else if (n.type === N.SpringChain) {
@@ -5502,21 +5505,21 @@ class ci {
             }
             q.has(e.id) || q.set(e.id, { x: s.x, y: s.y, vx: 0, vy: 0 });
           }
-          const at = q.get(e.id);
-          if (at) {
-            at.x = s.x, at.y = s.y;
+          const rt = q.get(e.id);
+          if (rt) {
+            rt.x = s.x, rt.y = s.y;
             for (const kt of U) {
               const _t = q.get(kt.targetId);
               if (!_t) continue;
-              const $t = _t.x - at.x, Zt = _t.y - at.y, fe = Math.sqrt($t * $t + Zt * Zt) || 1e-3, ne = (fe - (kt.restLength || 50)) * (kt.stiffness || 0.8), ge = $t / fe * ne, Ne = Zt / fe * ne;
-              at.vx += ge * t * 10, at.vy += Ne * t * 10, _t.vx -= ge * t * 10, _t.vy -= Ne * t * 10, at.vx *= 1 - Q * t * 10, at.vy *= 1 - Q * t * 10, _t.vx *= 1 - Q * t * 10, _t.vy *= 1 - Q * t * 10;
+              const $t = _t.x - rt.x, Zt = _t.y - rt.y, fe = Math.sqrt($t * $t + Zt * Zt) || 1e-3, ne = (fe - (kt.restLength || 50)) * (kt.stiffness || 0.8), ge = $t / fe * ne, Ne = Zt / fe * ne;
+              rt.vx += ge * t * 10, rt.vy += Ne * t * 10, _t.vx -= ge * t * 10, _t.vy -= Ne * t * 10, rt.vx *= 1 - Q * t * 10, rt.vy *= 1 - Q * t * 10, _t.vx *= 1 - Q * t * 10, _t.vy *= 1 - Q * t * 10;
               const de = this.objectStates.get(kt.targetId);
               de && (de.x += _t.vx * t, de.y += _t.vy * t);
             }
-            s.x += at.vx * t, s.y += at.vy * t;
+            s.x += rt.vx * t, s.y += rt.vy * t;
           }
         } else if (n.type === N.ParticleEmitter) {
-          const U = ((le = n.settings) == null ? void 0 : le.rate) || 10, Q = ((we = n.settings) == null ? void 0 : we.speed) || 100, q = ((We = n.settings) == null ? void 0 : We.size) || 5, at = ((Ge = n.settings) == null ? void 0 : Ge.lifetime) || 2, kt = ((De = n.settings) == null ? void 0 : De.gravity) || 0, _t = ((Be = n.settings) == null ? void 0 : Be.color) || "#ffffff", $t = ((ze = n.settings) == null ? void 0 : ze.maxParticles) || 200, Zt = (Ve = n.settings) != null && Ve.rateInputId ? this.inputs.get(n.settings.rateInputId) ?? U : U, fe = (Ze = n.settings) != null && Ze.gravityInputId ? this.inputs.get(n.settings.gravityInputId) ?? kt : kt, Ie = (je = n.settings) != null && je.speedInputId ? this.inputs.get(n.settings.speedInputId) ?? Q : Q;
+          const U = ((le = n.settings) == null ? void 0 : le.rate) || 10, Q = ((we = n.settings) == null ? void 0 : we.speed) || 100, q = ((We = n.settings) == null ? void 0 : We.size) || 5, rt = ((Ge = n.settings) == null ? void 0 : Ge.lifetime) || 2, kt = ((De = n.settings) == null ? void 0 : De.gravity) || 0, _t = ((Be = n.settings) == null ? void 0 : Be.color) || "#ffffff", $t = ((ze = n.settings) == null ? void 0 : ze.maxParticles) || 200, Zt = (Ve = n.settings) != null && Ve.rateInputId ? this.inputs.get(n.settings.rateInputId) ?? U : U, fe = (Ze = n.settings) != null && Ze.gravityInputId ? this.inputs.get(n.settings.gravityInputId) ?? kt : kt, Ie = (je = n.settings) != null && je.speedInputId ? this.inputs.get(n.settings.speedInputId) ?? Q : Q;
           this._emitterPools.has(e.id) || this._emitterPools.set(e.id, []);
           const ne = this._emitterPools.get(e.id);
           let ge = 0;
@@ -5530,7 +5533,7 @@ class ci {
               vx: Math.cos(oe) * ts,
               vy: Math.sin(oe) * ts,
               life: 0,
-              maxLife: at * (0.5 + Math.random() * 0.5),
+              maxLife: rt * (0.5 + Math.random() * 0.5),
               size: q * (0.5 + Math.random()),
               color: _t,
               opacity: 1
@@ -5767,11 +5770,11 @@ const yi = Ss(({
       if (!V) return;
       const it = V.getContext("2d");
       if (!it) return;
-      const rt = L / 1e3;
-      W.current === 0 && (W.current = rt);
-      let nt = rt - W.current;
-      nt > 0.1 && (nt = 0.1), W.current = rt;
-      const yt = V.getBoundingClientRect(), ct = window.devicePixelRatio || 1, wt = Math.round(yt.width * ct), Mt = Math.round(yt.height * ct);
+      const lt = L / 1e3;
+      W.current === 0 && (W.current = lt);
+      let nt = lt - W.current;
+      nt > 0.1 && (nt = 0.1), W.current = lt;
+      const bt = V.getBoundingClientRect(), ht = window.devicePixelRatio || 1, wt = Math.round(bt.width * ht), Mt = Math.round(bt.height * ht);
       (V.width !== wt || V.height !== Mt) && (V.width = wt, V.height = Mt);
       try {
         o ? X.advance(nt) : b !== void 0 && X.seek(b), X.render(it, V.width, V.height);
@@ -5790,8 +5793,8 @@ const yi = Ss(({
   const A = (_, L) => {
     if (!T || !E.current) return;
     _.stopPropagation(), "nativeEvent" in _ && _.nativeEvent && typeof _.nativeEvent.stopImmediatePropagation == "function" ? _.nativeEvent.stopImmediatePropagation() : typeof _.stopImmediatePropagation == "function" && _.stopImmediatePropagation();
-    const X = E.current, V = X.getBoundingClientRect(), it = _.clientX - V.left, rt = _.clientY - V.top, nt = window.devicePixelRatio || 1;
-    (L === "click" || L === "down" || L === "up") && d && d(`[Canvas] Pointer ${L} at rect(${Math.round(it)},${Math.round(rt)}) mapped to buffer(${Math.round(it * nt)},${Math.round(rt * nt)})`, "info"), x.current.handlePointerInput(L, it * nt, rt * nt, X.width, X.height);
+    const X = E.current, V = X.getBoundingClientRect(), it = _.clientX - V.left, lt = _.clientY - V.top, nt = window.devicePixelRatio || 1;
+    (L === "click" || L === "down" || L === "up") && d && d(`[Canvas] Pointer ${L} at rect(${Math.round(it)},${Math.round(lt)}) mapped to buffer(${Math.round(it * nt)},${Math.round(lt * nt)})`, "info"), x.current.handlePointerInput(L, it * nt, lt * nt, X.width, X.height);
   };
   return /* @__PURE__ */ ke(
     "canvas",
@@ -5927,7 +5930,7 @@ const vi = ({ artboard: g, config: t }) => {
       ]
     }
   );
-}, hi = "6.3.29", fi = {
+}, hi = "6.3.30", fi = {
   version: hi
 }, Si = fi.version;
 export {