exodeui 6.3.39 → 6.3.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +17 -17
- package/dist/index.mjs +645 -642
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -62,19 +62,19 @@ function ps(g) {
|
|
|
62
62
|
try {
|
|
63
63
|
if (r !== 0 && typeof CanvasRenderingContext2D < "u" && (CanvasRenderingContext2D.prototype.measureText = y), c && p && p.length > 0) {
|
|
64
64
|
const k = p.map((T) => {
|
|
65
|
-
let
|
|
65
|
+
let R = T.text || "";
|
|
66
66
|
const P = T.textCase || l || "none";
|
|
67
|
-
return P === "uppercase" ?
|
|
67
|
+
return P === "uppercase" ? R.toUpperCase() : P === "lowercase" ? R.toLowerCase() : P === "capitalize" ? R.replace(/\b\w/g, (_) => _.toUpperCase()) : R;
|
|
68
68
|
}).join("");
|
|
69
69
|
if (b = ts(k, u), b) {
|
|
70
|
-
let T = 0,
|
|
70
|
+
let T = 0, R = o;
|
|
71
71
|
for (const P of p) {
|
|
72
72
|
let _ = P.text || "";
|
|
73
73
|
if (!_) continue;
|
|
74
74
|
const E = P.textCase || l || "none";
|
|
75
75
|
E === "uppercase" ? _ = _.toUpperCase() : E === "lowercase" ? _ = _.toLowerCase() : E === "capitalize" && (_ = _.replace(/\b\w/g, (Y) => Y.toUpperCase()));
|
|
76
76
|
const A = P.fontSize || o;
|
|
77
|
-
A >
|
|
77
|
+
A > R && (R = A);
|
|
78
78
|
const W = `${P.fontStyle || s} ${P.fontWeight || e} ${A}px "${P.fontFamily || i}", sans-serif`, z = ts(_, W);
|
|
79
79
|
if (z && z.widths)
|
|
80
80
|
for (let Y = 0; Y < z.widths.length; Y++) {
|
|
@@ -92,7 +92,7 @@ function ps(g) {
|
|
|
92
92
|
}
|
|
93
93
|
T += _.length;
|
|
94
94
|
}
|
|
95
|
-
b.fullText = k, b.maxFontSize =
|
|
95
|
+
b.fullText = k, b.maxFontSize = R;
|
|
96
96
|
}
|
|
97
97
|
} else
|
|
98
98
|
b = ts(d, u);
|
|
@@ -109,10 +109,10 @@ function ps(g) {
|
|
|
109
109
|
}
|
|
110
110
|
if (f > 0 && b && b.widths && !b.indentApplied) {
|
|
111
111
|
const k = [...b.widths], T = b.fullText || d;
|
|
112
|
-
let
|
|
112
|
+
let R = !0;
|
|
113
113
|
for (let P = 0; P < T.length; P++)
|
|
114
|
-
|
|
115
|
-
` || T[P] === "\r") && (
|
|
114
|
+
R && k[P] !== void 0 && (k[P] += f, R = !1), (T[P] === `
|
|
115
|
+
` || T[P] === "\r") && (R = !0, T[P] === "\r" && T[P + 1] === `
|
|
116
116
|
` && P++);
|
|
117
117
|
b = { ...b, widths: k, indentApplied: !0 };
|
|
118
118
|
}
|
|
@@ -125,7 +125,7 @@ function ps(g) {
|
|
|
125
125
|
if (a >= 1e5) {
|
|
126
126
|
const T = d.split(/\r\n|\r|\n/);
|
|
127
127
|
C = {
|
|
128
|
-
lines: T.map((
|
|
128
|
+
lines: T.map((R) => ({ text: R, width: 0 })),
|
|
129
129
|
// Width will be measured below
|
|
130
130
|
height: T.length * (S * k),
|
|
131
131
|
lineCount: T.length
|
|
@@ -139,8 +139,8 @@ function ps(g) {
|
|
|
139
139
|
if (h > 0 && C && C.lines && C.lines.length > 1) {
|
|
140
140
|
let k = 0;
|
|
141
141
|
const T = b.fullText || t;
|
|
142
|
-
for (let
|
|
143
|
-
k += C.lines[
|
|
142
|
+
for (let R = 0; R < C.lines.length - 1; R++)
|
|
143
|
+
k += C.lines[R].text.length, (T[k] === `
|
|
144
144
|
` || T[k] === "\r") && (w += h, k++, T[k - 1] === "\r" && T[k] === `
|
|
145
145
|
` && k++);
|
|
146
146
|
}
|
|
@@ -218,13 +218,13 @@ function Es(g, t, i) {
|
|
|
218
218
|
}), v.length > 0 && u.push({ children: v, width: b, height: m }), c && !h && (l = Math.max(...u.map((A) => A.width), 0) + n.left + n.right), d && h && (p = Math.max(...u.map((A) => A.height), 0) + n.top + n.bottom);
|
|
219
219
|
const C = [];
|
|
220
220
|
let w = n.left, M = n.top;
|
|
221
|
-
const I = a.toLowerCase(), k = I === "center" || I.endsWith("-center"), T = I.endsWith("-right"),
|
|
221
|
+
const I = a.toLowerCase(), k = I === "center" || I.endsWith("-center"), T = I.endsWith("-right"), R = I === "center" || I.startsWith("center-"), P = I.startsWith("bottom-");
|
|
222
222
|
return u.forEach((A) => {
|
|
223
223
|
let W = w, z = M;
|
|
224
|
-
h ?
|
|
224
|
+
h ? R ? z = n.top + (p - n.top - n.bottom - A.height) / 2 : P && (z = p - n.bottom - A.height) : k ? W = n.left + (l - n.left - n.right - A.width) / 2 : T && (W = l - n.right - A.width), A.children.forEach((Y) => {
|
|
225
225
|
var F, j;
|
|
226
226
|
let G = W, N = z;
|
|
227
|
-
h ? k ? G += (A.width - Y.w) / 2 : T && (G += A.width - Y.w) :
|
|
227
|
+
h ? k ? G += (A.width - Y.w) / 2 : T && (G += A.width - Y.w) : R ? N += (A.height - Y.h) / 2 : P && (N += A.height - Y.h);
|
|
228
228
|
const J = ((F = Y.original.layoutProps) == null ? void 0 : F.width) === "fill", x = ((j = Y.original.layoutProps) == null ? void 0 : j.height) === "fill";
|
|
229
229
|
C.push({
|
|
230
230
|
id: Y.id,
|
|
@@ -241,16 +241,16 @@ function As(g, t, i) {
|
|
|
241
241
|
if (!o) return { childUpdates: [] };
|
|
242
242
|
const { gridColumns: e, gridRows: s, columnGap: n = 0, rowGap: a = 0, padding: r, align: h } = o;
|
|
243
243
|
let f = g.width, l = g.height;
|
|
244
|
-
const p = f - r.left - r.right, c = l - r.top - r.bottom, d = is(e || "1fr", p, n), u = is(s || "auto", c, a), v = d.length > 0 ? d.reduce((T,
|
|
244
|
+
const p = f - r.left - r.right, c = l - r.top - r.bottom, d = is(e || "1fr", p, n), u = is(s || "auto", c, a), v = d.length > 0 ? d.reduce((T, R) => T + R, 0) + (d.length - 1) * n : 0, b = u.length > 0 ? u.reduce((T, R) => T + R, 0) + (u.length - 1) * a : 0, m = h.toLowerCase(), y = m === "center" || m.endsWith("-center"), S = m.endsWith("-right"), C = m === "center" || m.startsWith("center-"), w = m.startsWith("bottom-");
|
|
245
245
|
let M = 0, I = 0;
|
|
246
246
|
y ? M = (p - v) / 2 : S && (M = p - v), C ? I = (c - b) / 2 : w && (I = c - b);
|
|
247
247
|
const k = [];
|
|
248
|
-
return t.forEach((T,
|
|
248
|
+
return t.forEach((T, R) => {
|
|
249
249
|
var j, X;
|
|
250
|
-
const P =
|
|
250
|
+
const P = R % d.length || 0, _ = Math.floor(R / d.length) || 0;
|
|
251
251
|
_ >= u.length && u.push(100);
|
|
252
252
|
const E = d[P], A = u[_];
|
|
253
|
-
let W = r.left + M + d.slice(0, P).reduce((tt,
|
|
253
|
+
let W = r.left + M + d.slice(0, P).reduce((tt, L) => tt + L + n, 0), z = r.top + I + u.slice(0, _).reduce((tt, L) => tt + L + a, 0);
|
|
254
254
|
const Y = i(T.id), G = T.geometry;
|
|
255
255
|
let N = (Y == null ? void 0 : Y.width) ?? G.width ?? 100, J = (Y == null ? void 0 : Y.height) ?? G.height ?? 100;
|
|
256
256
|
if (G.type === "Ellipse" || G.type === "Polygon" || G.type === "Star") {
|
|
@@ -427,7 +427,7 @@ class xs {
|
|
|
427
427
|
}
|
|
428
428
|
}
|
|
429
429
|
}
|
|
430
|
-
const gs = (g) => g,
|
|
430
|
+
const gs = (g) => g, Rs = (g) => g > 0 ? 1 : 0, Ls = (g) => g < 1 ? 0 : 1, os = (g) => g * g, as = (g) => g * (2 - g), rs = (g) => g < 0.5 ? 2 * g * g : -1 + (4 - 2 * g) * g, Os = (g) => g * g * g, Fs = (g) => --g * g * g + 1, $s = (g) => g < 0.5 ? 4 * g * g * g : (g - 1) * (2 * g - 2) * (2 * g - 2) + 1, Bs = (g) => g * g * g * g, Ws = (g) => 1 - --g * g * g * g, Ys = (g) => g < 0.5 ? 8 * g * g * g * g : 1 - 8 * --g * g * g * g, Xs = (g) => g * g * g * g * g, Ds = (g) => 1 + --g * g * g * g * g, Gs = (g) => g < 0.5 ? 16 * g * g * g * g * g : 1 + 16 * --g * g * g * g * g, zs = (g) => 1 - Math.cos(g * Math.PI / 2), Vs = (g) => Math.sin(g * Math.PI / 2), Ns = (g) => -(Math.cos(Math.PI * g) - 1) / 2, Hs = (g) => g === 0 ? 0 : Math.pow(2, 10 * (g - 1)), Us = (g) => g === 1 ? 1 : 1 - Math.pow(2, -10 * g), qs = (g) => g === 0 ? 0 : g === 1 ? 1 : g < 0.5 ? Math.pow(2, 20 * g - 10) / 2 : (2 - Math.pow(2, -20 * g + 10)) / 2, Ks = (g) => 1 - Math.sqrt(1 - g * g), Js = (g) => Math.sqrt(1 - --g * g), Qs = (g) => g < 0.5 ? (1 - Math.sqrt(1 - 4 * g * g)) / 2 : (Math.sqrt(1 - (-2 * g + 2) * (-2 * g + 2)) + 1) / 2, je = 1.70158, qe = je * 1.525, ms = je + 1, Zs = (g) => ms * g * g * g - je * g * g, js = (g) => 1 + ms * Math.pow(g - 1, 3) + je * Math.pow(g - 1, 2), ti = (g) => g < 0.5 ? Math.pow(2 * g, 2) * ((qe + 1) * 2 * g - qe) / 2 : (Math.pow(2 * g - 2, 2) * ((qe + 1) * (g * 2 - 2) + qe) + 2) / 2, ys = 2 * Math.PI / 3, ls = 2 * Math.PI / 4.5, ei = (g) => g === 0 ? 0 : g === 1 ? 1 : -Math.pow(2, 10 * g - 10) * Math.sin((g * 10 - 10.75) * ys), si = (g) => g === 0 ? 0 : g === 1 ? 1 : Math.pow(2, -10 * g) * Math.sin((g * 10 - 0.75) * ys) + 1, ii = (g) => g === 0 ? 0 : g === 1 ? 1 : g < 0.5 ? -(Math.pow(2, 20 * g - 10) * Math.sin((20 * g - 11.125) * ls)) / 2 : Math.pow(2, -20 * g + 10) * Math.sin((20 * g - 11.125) * ls) / 2 + 1, Ze = (g) => g < 1 / 2.75 ? 7.5625 * g * g : g < 2 / 2.75 ? 7.5625 * (g -= 1.5 / 2.75) * g + 0.75 : g < 2.5 / 2.75 ? 7.5625 * (g -= 2.25 / 2.75) * g + 0.9375 : 7.5625 * (g -= 2.625 / 2.75) * g + 0.984375, ni = (g) => 1 - Ze(1 - g), oi = Ze, ai = (g) => g < 0.5 ? (1 - Ze(1 - 2 * g)) / 2 : (1 + Ze(2 * g - 1)) / 2, es = /* @__PURE__ */ new Map(), ze = (g, t, i, o) => {
|
|
431
431
|
const e = `${g},${t},${i},${o}`;
|
|
432
432
|
if (es.has(e)) return es.get(e);
|
|
433
433
|
const s = (f) => (1 - 3 * i + 3 * g) * f * f * f + (3 * i - 6 * g) * f * f + 3 * g * f, n = (f) => (1 - 3 * o + 3 * t) * f * f * f + (3 * o - 6 * t) * f * f + 3 * t * f, a = (f) => 3 * (1 - 3 * i + 3 * g) * f * f + 2 * (3 * i - 6 * g) * f + 3 * g, r = (f) => {
|
|
@@ -500,8 +500,8 @@ const gs = (g) => g, Ls = (g) => g > 0 ? 1 : 0, Rs = (g) => g < 1 ? 0 : 1, os =
|
|
|
500
500
|
EaseOut: as,
|
|
501
501
|
EaseInOut: rs,
|
|
502
502
|
// Discrete
|
|
503
|
-
StepStart:
|
|
504
|
-
StepEnd:
|
|
503
|
+
StepStart: Rs,
|
|
504
|
+
StepEnd: Ls
|
|
505
505
|
}, ri = (g) => {
|
|
506
506
|
const t = g.trim(), i = t.toLowerCase();
|
|
507
507
|
if (Ke[t]) return Ke[t];
|
|
@@ -584,31 +584,31 @@ const gs = (g) => g, Ls = (g) => g > 0 ? 1 : 0, Rs = (g) => g < 1 ? 0 : 1, os =
|
|
|
584
584
|
rotation: k.rotation,
|
|
585
585
|
scaleX: k.scale_x ?? 1,
|
|
586
586
|
scaleY: k.scale_y ?? 1
|
|
587
|
-
},
|
|
587
|
+
}, R = i[I.boneId] || [1, 0, 0, 1, 0, 0], P = v * R[0] + b * R[2] + R[4], _ = v * R[1] + b * R[3] + R[5], E = T.rotation * Math.PI / 180, A = Math.cos(E), W = Math.sin(E), z = P * T.scaleX * A - _ * T.scaleY * W + T.x, Y = P * T.scaleX * W + _ * T.scaleY * A + T.y;
|
|
588
588
|
l += z * I.amount, p += Y * I.amount;
|
|
589
589
|
});
|
|
590
590
|
const m = [...f].sort((I, k) => k.amount - I.amount);
|
|
591
591
|
if (m.length >= 2 && m[0].amount > 0 && m[1].amount > 0) {
|
|
592
592
|
const I = e(m[0].boneId), k = e(m[1].boneId);
|
|
593
593
|
if (I && k && I.length !== void 0 && k.length !== void 0) {
|
|
594
|
-
const T = I.length * (I.scale_y ?? 1),
|
|
594
|
+
const T = I.length * (I.scale_y ?? 1), R = I.rotation * Math.PI / 180, P = I.x - T * Math.sin(R), _ = I.y + T * Math.cos(R), E = k.length * (k.scale_y ?? 1), A = k.rotation * Math.PI / 180, W = k.x - E * Math.sin(A), z = k.y + E * Math.cos(A);
|
|
595
595
|
let Y = null, G = null, N = !1;
|
|
596
596
|
const J = 1;
|
|
597
597
|
if (Math.hypot(I.x - k.x, I.y - k.y) < J || Math.hypot(I.x - W, I.y - z) < J ? (Y = I.x, G = I.y) : (Math.hypot(P - k.x, _ - k.y) < J || Math.hypot(P - W, _ - z) < J) && (Y = P, G = _, N = !0), Y !== null && G !== null) {
|
|
598
598
|
const x = i[m[0].boneId] || [1, 0, 0, 1, 0, 0], F = x[0] * x[3] - x[1] * x[2];
|
|
599
599
|
let j = 0, X = 0;
|
|
600
600
|
if (F !== 0) {
|
|
601
|
-
const tt = (x[2] * x[5] - x[3] * x[4]) / F,
|
|
601
|
+
const tt = (x[2] * x[5] - x[3] * x[4]) / F, L = (x[1] * x[4] - x[0] * x[5]) / F, O = Math.atan2(-x[1], x[3]);
|
|
602
602
|
if (!N)
|
|
603
|
-
j = tt, X =
|
|
603
|
+
j = tt, X = L;
|
|
604
604
|
else {
|
|
605
605
|
const ot = -x[2] / F, yt = x[0] / F, bt = Math.hypot(ot, yt), gt = I.length * bt;
|
|
606
|
-
j = tt - gt * Math.sin(O), X =
|
|
606
|
+
j = tt - gt * Math.sin(O), X = L + gt * Math.cos(O);
|
|
607
607
|
}
|
|
608
608
|
const D = Math.hypot(v - j, b - X), q = Math.hypot(l - Y, p - G);
|
|
609
609
|
if (q > 0 && D > 0) {
|
|
610
|
-
const ot = Math.max(q, 0.01), yt = Math.min(D / ot, 3), bt = Y + (l - Y) * yt, gt = G + (p - G) * yt, Et = m[0].amount, It = m[1].amount,
|
|
611
|
-
l = l * (1 -
|
|
610
|
+
const ot = Math.max(q, 0.01), yt = Math.min(D / ot, 3), bt = Y + (l - Y) * yt, gt = G + (p - G) * yt, Et = m[0].amount, It = m[1].amount, vt = Math.min(Et, It) * 2, Yt = 1 - Math.pow(1 - vt, 4);
|
|
611
|
+
l = l * (1 - Yt) + bt * Yt, p = p * (1 - Yt) + gt * Yt;
|
|
612
612
|
}
|
|
613
613
|
}
|
|
614
614
|
}
|
|
@@ -1912,8 +1912,8 @@ class ci {
|
|
|
1912
1912
|
if (y) {
|
|
1913
1913
|
const S = r.offsetX || 0, C = r.offsetY || 0, w = y.x + S, M = y.y + C, I = r.useSpring;
|
|
1914
1914
|
if (I) {
|
|
1915
|
-
const T = this.objectVelocities.get(i.id) || { vx: 0, vy: 0 }, { x:
|
|
1916
|
-
r.copyX && (e.x = e.x + (
|
|
1915
|
+
const T = this.objectVelocities.get(i.id) || { vx: 0, vy: 0 }, { x: R, y: P, vx: _, vy: E } = this.computeSpring(e.x, e.y, T.vx, T.vy, w, M, r, t);
|
|
1916
|
+
r.copyX && (e.x = e.x + (R - e.x) * h), r.copyY && (e.y = e.y + (P - e.y) * h), this.objectVelocities.set(i.id, { vx: _, vy: E });
|
|
1917
1917
|
} else
|
|
1918
1918
|
r.copyX && (e.x = e.x + (w - e.x) * h), r.copyY && (e.y = e.y + (M - e.y) * h);
|
|
1919
1919
|
let k = !1;
|
|
@@ -1946,8 +1946,8 @@ class ci {
|
|
|
1946
1946
|
} else if (r.type === "FollowPointer") {
|
|
1947
1947
|
const y = ((c = this._lastPointerPos) == null ? void 0 : c.x) ?? e.x, S = ((d = this._lastPointerPos) == null ? void 0 : d.y) ?? e.y, C = r.useSpring;
|
|
1948
1948
|
if (C) {
|
|
1949
|
-
const M = this.objectVelocities.get(i.id) || { vx: 0, vy: 0 }, { x: I, y: k, vx: T, vy:
|
|
1950
|
-
e.x = I, e.y = k, this.objectVelocities.set(i.id, { vx: T, vy:
|
|
1949
|
+
const M = this.objectVelocities.get(i.id) || { vx: 0, vy: 0 }, { x: I, y: k, vx: T, vy: R } = this.computeSpring(e.x, e.y, M.vx, M.vy, y, S, r, t);
|
|
1950
|
+
e.x = I, e.y = k, this.objectVelocities.set(i.id, { vx: T, vy: R });
|
|
1951
1951
|
} else
|
|
1952
1952
|
e.x = e.x + (y - e.x) * h, e.y = e.y + (S - e.y) * h;
|
|
1953
1953
|
let w = !1;
|
|
@@ -1997,10 +1997,10 @@ class ci {
|
|
|
1997
1997
|
F && (C = F.geometry);
|
|
1998
1998
|
}
|
|
1999
1999
|
if (!C) return;
|
|
2000
|
-
const w = (r.distance || 0) / 100, M = S.width || C.width || 0, I = S.height || C.height || 0, k = this.getPointOnPath(C, M, I, w), T = S.rotation * Math.PI / 180,
|
|
2000
|
+
const w = (r.distance || 0) / 100, M = S.width || C.width || 0, I = S.height || C.height || 0, k = this.getPointOnPath(C, M, I, w), T = S.rotation * Math.PI / 180, R = Math.cos(T), P = Math.sin(T), _ = k.x * S.scale_x * R - k.y * S.scale_y * P, E = k.x * S.scale_x * P + k.y * S.scale_y * R;
|
|
2001
2001
|
let A = S.rotation + (r.offsetRotation || 0);
|
|
2002
2002
|
if (r.orient) {
|
|
2003
|
-
const F = Math.cos(k.angle), j = Math.sin(k.angle), X = F * S.scale_x *
|
|
2003
|
+
const F = Math.cos(k.angle), j = Math.sin(k.angle), X = F * S.scale_x * R - j * S.scale_y * P, tt = F * S.scale_x * P + j * S.scale_y * R;
|
|
2004
2004
|
A = Math.atan2(tt, X) * 180 / Math.PI + (r.offsetRotation || 0);
|
|
2005
2005
|
}
|
|
2006
2006
|
const W = A * Math.PI / 180, z = Math.cos(W), Y = Math.sin(W), G = (r.offsetX || 0) * z - (r.offsetY || 0) * Y, N = (r.offsetX || 0) * Y + (r.offsetY || 0) * z, J = S.x + _ + G, x = S.y + E + N;
|
|
@@ -2156,8 +2156,8 @@ class ci {
|
|
|
2156
2156
|
})) : t === "blur" && this.activeHoverIds.clear(), this.activeDropdownId && t === "down") {
|
|
2157
2157
|
const c = this.artboard.objects.find((d) => d.id === this.activeDropdownId);
|
|
2158
2158
|
if (c && (c.type === "Dropdown" || c.variant === "dropdown")) {
|
|
2159
|
-
const d = this.objectStates.get(c.id), u = (d == null ? void 0 : d.options) || c.options || {}, v = c.geometry || {}, b = v.width ?? c.width ?? 200, m = v.height ?? c.height ?? 40, y = u.optionsList || [], S = u.itemHeight || 32, C = u.listPadding ?? 4, w = y.length * S + C * 2, M = this.getWorldTransform(c.id), I = b * Math.abs(M.scaleX), k = m * Math.abs(M.scaleY), T = M.y + k / 2 + 4,
|
|
2160
|
-
if (
|
|
2159
|
+
const d = this.objectStates.get(c.id), u = (d == null ? void 0 : d.options) || c.options || {}, v = c.geometry || {}, b = v.width ?? c.width ?? 200, m = v.height ?? c.height ?? 40, y = u.optionsList || [], S = u.itemHeight || 32, C = u.listPadding ?? 4, w = y.length * S + C * 2, M = this.getWorldTransform(c.id), I = b * Math.abs(M.scaleX), k = m * Math.abs(M.scaleY), T = M.y + k / 2 + 4, R = Math.abs(i - M.x) <= I / 2, P = o >= T && o <= T + w * Math.abs(M.scaleY);
|
|
2160
|
+
if (R && P) {
|
|
2161
2161
|
const _ = Math.abs(M.scaleY), E = o - (T + C * _), A = Math.floor(E / (S * _));
|
|
2162
2162
|
if (A >= 0 && A < y.length) {
|
|
2163
2163
|
const W = y[A];
|
|
@@ -2280,14 +2280,14 @@ class ci {
|
|
|
2280
2280
|
const E = Math.max(..._.data || [0]);
|
|
2281
2281
|
E > T && (T = E);
|
|
2282
2282
|
});
|
|
2283
|
-
let
|
|
2283
|
+
let R = 1 / 0, P = null;
|
|
2284
2284
|
b.forEach((_, E) => {
|
|
2285
2285
|
const A = _.data || [], W = I / Math.max(A.length - 1, 1);
|
|
2286
2286
|
A.forEach((z, Y) => {
|
|
2287
2287
|
const G = C.x - y / 2 + w + Y * W, N = C.y + S / 2 - M - z / T * k, J = Math.sqrt((i - G) ** 2 + (o - N) ** 2);
|
|
2288
|
-
J <
|
|
2288
|
+
J < R && (R = J, P = { dIdx: E, pIdx: Y, val: z, label: _.label || `Dataset ${E + 1}` });
|
|
2289
2289
|
});
|
|
2290
|
-
}), P &&
|
|
2290
|
+
}), P && R < 20 && this.onGraphPointClick && this.onGraphPointClick({ objectId: c.id, componentName: c.name, datasetIndex: P.dIdx, pointIndex: P.pIdx, value: P.val, label: P.label }), this.onComponentChange && this.onComponentChange({ objectId: c.id, componentName: c.name, variant: "linegraph", property: "click", value: (P == null ? void 0 : P.val) ?? null });
|
|
2291
2291
|
}
|
|
2292
2292
|
if (t === "click") {
|
|
2293
2293
|
const v = (h = this.artboard) == null ? void 0 : h.objects.find((y) => y.id === e.id), b = this.focusedId, m = (v == null ? void 0 : v.type) === "InputBox" || (v == null ? void 0 : v.type) === "Component" && v.variant === "inputbox";
|
|
@@ -2570,7 +2570,7 @@ class ci {
|
|
|
2570
2570
|
if (c) {
|
|
2571
2571
|
if (l.actionType === "bind" && l.targetProperty && l.isContinuous !== !1) {
|
|
2572
2572
|
const w = l.sourceMin ?? -1, M = l.sourceMax ?? 1, I = l.targetMin ?? 0, k = l.targetMax ?? 100;
|
|
2573
|
-
let T = !!l.isContinuous,
|
|
2573
|
+
let T = !!l.isContinuous, R = 0, P = 0;
|
|
2574
2574
|
if (T) {
|
|
2575
2575
|
if ((l.sourceAxis === "x" || l.sourceAxis === "y") && I >= 0) {
|
|
2576
2576
|
const E = Math.max(Math.abs(w), Math.abs(M)) || 1;
|
|
@@ -2582,23 +2582,23 @@ class ci {
|
|
|
2582
2582
|
Math.abs(p) < 0.05 && (P = 0);
|
|
2583
2583
|
} else {
|
|
2584
2584
|
const E = (p - w) / (M - w), A = Math.max(0, Math.min(1, E));
|
|
2585
|
-
|
|
2585
|
+
R = I + A * (k - I), l.step && l.step > 0 && (R = Math.round(R / l.step) * l.step);
|
|
2586
2586
|
}
|
|
2587
2587
|
const _ = this.objectStates.get(c.id);
|
|
2588
2588
|
if (_) {
|
|
2589
2589
|
const E = l.isRelative !== !1, A = E ? ((u = c.transform) == null ? void 0 : u.x) ?? 0 : 0, W = E ? ((v = c.transform) == null ? void 0 : v.y) ?? 0 : 0, z = E ? ((b = c.transform) == null ? void 0 : b.rotation) ?? 0 : 0, Y = E ? ((m = c.transform) == null ? void 0 : m.scale_x) ?? 1 : 0, G = E ? ((y = c.transform) == null ? void 0 : y.scale_y) ?? 1 : 0, N = E ? ((S = c.style) == null ? void 0 : S.opacity) ?? 100 : 0, J = t * 60, x = (F, j) => {
|
|
2590
|
-
let X =
|
|
2590
|
+
let X = R;
|
|
2591
2591
|
if (T) {
|
|
2592
2592
|
const tt = `_internal_${F}_${l.id}`;
|
|
2593
|
-
let
|
|
2594
|
-
|
|
2593
|
+
let L = _[tt];
|
|
2594
|
+
L === void 0 && (L = _[F] ?? j), X = L + P * J, _[tt] = X, l.step && l.step > 0 && (X = Math.round(X / l.step) * l.step);
|
|
2595
2595
|
} else
|
|
2596
|
-
X = j +
|
|
2596
|
+
X = j + R;
|
|
2597
2597
|
_[F] = X;
|
|
2598
2598
|
};
|
|
2599
2599
|
l.targetProperty === "x" || l.targetProperty === "transform.x" ? x("x", A) : l.targetProperty === "y" || l.targetProperty === "transform.y" ? x("y", W) : l.targetProperty === "rotation" || l.targetProperty === "r" || l.targetProperty === "transform.rotation" ? x("rotation", z) : l.targetProperty === "scaleX" || l.targetProperty === "transform.scale_x" ? x("scale_x", Y) : l.targetProperty === "scaleY" || l.targetProperty === "transform.scale_y" ? x("scale_y", G) : (l.targetProperty === "opacity" || l.targetProperty === "transform.opacity") && x("opacity", N);
|
|
2600
2600
|
}
|
|
2601
|
-
(C = c.physics) != null && C.enabled && this.physicsEngine && (l.targetProperty === "x" || l.targetProperty === "transform.x" || l.targetProperty === "y" || l.targetProperty === "transform.y") && (l.targetProperty === "x" || l.targetProperty === "transform.x" ? this.physicsEngine.applyForce(c.id, (
|
|
2601
|
+
(C = c.physics) != null && C.enabled && this.physicsEngine && (l.targetProperty === "x" || l.targetProperty === "transform.x" || l.targetProperty === "y" || l.targetProperty === "transform.y") && (l.targetProperty === "x" || l.targetProperty === "transform.x" ? this.physicsEngine.applyForce(c.id, (R - ((_ == null ? void 0 : _.x) || 0)) * 10, 0) : (l.targetProperty === "y" || l.targetProperty === "transform.y") && this.physicsEngine.applyForce(c.id, 0, (R - ((_ == null ? void 0 : _.y) || 0)) * 10));
|
|
2602
2602
|
} else if (l.actionType === "playAnimation" || l.actionType === "stopAnimation" || l.actionType === "pauseAnimation") {
|
|
2603
2603
|
let w = !1;
|
|
2604
2604
|
const M = l.threshold ?? 0;
|
|
@@ -2660,8 +2660,8 @@ class ci {
|
|
|
2660
2660
|
};
|
|
2661
2661
|
s.forEach(({ anim: b, weight: m }) => {
|
|
2662
2662
|
b.tracks && b.tracks.forEach((y) => {
|
|
2663
|
-
var
|
|
2664
|
-
const S = y.object_id || y.objectId, C = y.property, w = (
|
|
2663
|
+
var R, P;
|
|
2664
|
+
const S = y.object_id || y.objectId, C = y.property, w = (R = this.artboard) == null ? void 0 : R.objects.find((_) => _.id === S);
|
|
2665
2665
|
if (((P = w == null ? void 0 : w.physics) == null ? void 0 : P.enabled) && w.physics.bodyType !== "Static" && (C === "x" || C === "y" || C === "rotation")) return;
|
|
2666
2666
|
const I = this.interpolate(y.keyframes, i);
|
|
2667
2667
|
if (I === void 0) return;
|
|
@@ -2690,24 +2690,24 @@ class ci {
|
|
|
2690
2690
|
!y || !S || b.forEach((w, M) => {
|
|
2691
2691
|
let I = w.value;
|
|
2692
2692
|
if (w.type === "color" && w.colorAcc) {
|
|
2693
|
-
const k = Math.round(w.colorAcc.r).toString(16).padStart(2, "0"), T = Math.round(w.colorAcc.g).toString(16).padStart(2, "0"),
|
|
2694
|
-
I = `#${k}${T}${
|
|
2693
|
+
const k = Math.round(w.colorAcc.r).toString(16).padStart(2, "0"), T = Math.round(w.colorAcc.g).toString(16).padStart(2, "0"), R = Math.round(w.colorAcc.b).toString(16).padStart(2, "0");
|
|
2694
|
+
I = `#${k}${T}${R}`;
|
|
2695
2695
|
}
|
|
2696
2696
|
if (M.includes(".")) {
|
|
2697
2697
|
const k = (M || "").split(".");
|
|
2698
2698
|
let T = y;
|
|
2699
|
-
for (let
|
|
2700
|
-
if (typeof T[k[
|
|
2699
|
+
for (let R = 0; R < k.length - 1; R++) {
|
|
2700
|
+
if (typeof T[k[R]] != "object" || T[k[R]] === null) {
|
|
2701
2701
|
let P = S;
|
|
2702
|
-
for (let _ = 0; _ <=
|
|
2702
|
+
for (let _ = 0; _ <= R; _++)
|
|
2703
2703
|
P = P ? P[k[_]] : null;
|
|
2704
|
-
if (k[
|
|
2705
|
-
const _ = typeof T[k[
|
|
2706
|
-
T[k[
|
|
2704
|
+
if (k[R] === "corner_radius" || k[R] === "cornerRadius") {
|
|
2705
|
+
const _ = typeof T[k[R]] == "number" ? T[k[R]] : typeof P == "number" ? P : 0;
|
|
2706
|
+
T[k[R]] = { tl: _, tr: _, bl: _, br: _ };
|
|
2707
2707
|
} else
|
|
2708
|
-
T[k[
|
|
2708
|
+
T[k[R]] = P ? JSON.parse(JSON.stringify(P)) : {};
|
|
2709
2709
|
}
|
|
2710
|
-
T = T[k[
|
|
2710
|
+
T = T[k[R]];
|
|
2711
2711
|
}
|
|
2712
2712
|
T[k[k.length - 1]] = I, k[k.length - 1] === "color" && (k[k.length - 2] === "fill" || k[k.length - 2] === "stroke") && (T.type = "Solid");
|
|
2713
2713
|
} else
|
|
@@ -2950,20 +2950,20 @@ class ci {
|
|
|
2950
2950
|
}
|
|
2951
2951
|
*/
|
|
2952
2952
|
renderObject(t, i, o) {
|
|
2953
|
-
var u, v, b, m, y, S, C, w, M, I, k, T,
|
|
2953
|
+
var u, v, b, m, y, S, C, w, M, I, k, T, R, P, _, E, A, W, z, Y, G, N, J, x, F, j;
|
|
2954
2954
|
const e = this.objectStates.get(i.id);
|
|
2955
2955
|
if (!e) {
|
|
2956
2956
|
this.warn("No state for object:", i.id);
|
|
2957
2957
|
return;
|
|
2958
2958
|
}
|
|
2959
|
-
this.frameCount % 60, t.roundRect || (t.roundRect = (X, tt,
|
|
2959
|
+
this.frameCount % 60, t.roundRect || (t.roundRect = (X, tt, L, O, D) => (this.drawRoundRect(t, X, tt, L, O, D), t));
|
|
2960
2960
|
const s = e.geometry ? this.deepMerge(i.geometry, e.geometry) : i.geometry;
|
|
2961
2961
|
let n = e.style ? this.deepMerge(i.style, e.style) : i.style, a = (s == null ? void 0 : s.width) || ((u = i.geometry) == null ? void 0 : u.width) || i.width || 0, r = (s == null ? void 0 : s.height) || ((v = i.geometry) == null ? void 0 : v.height) || i.height || 0;
|
|
2962
2962
|
if ((a === 0 || r === 0) && (s != null && s.points) && Array.isArray(s.points) && s.points.length > 0) {
|
|
2963
|
-
let X = 1 / 0, tt = -1 / 0,
|
|
2963
|
+
let X = 1 / 0, tt = -1 / 0, L = 1 / 0, O = -1 / 0;
|
|
2964
2964
|
s.points.forEach((D) => {
|
|
2965
|
-
X = Math.min(X, D.x), tt = Math.max(tt, D.x),
|
|
2966
|
-
}), a === 0 && (a = tt - X), r === 0 && (r = O -
|
|
2965
|
+
X = Math.min(X, D.x), tt = Math.max(tt, D.x), L = Math.min(L, D.y), O = Math.max(O, D.y);
|
|
2966
|
+
}), a === 0 && (a = tt - X), r === 0 && (r = O - L);
|
|
2967
2967
|
}
|
|
2968
2968
|
const h = (X) => {
|
|
2969
2969
|
if (X)
|
|
@@ -2978,7 +2978,7 @@ class ci {
|
|
|
2978
2978
|
i.weights,
|
|
2979
2979
|
i.bindMatrices,
|
|
2980
2980
|
X,
|
|
2981
|
-
(
|
|
2981
|
+
(L) => this.getGlobalTransform(L)
|
|
2982
2982
|
);
|
|
2983
2983
|
l = { ...l, points: tt };
|
|
2984
2984
|
}
|
|
@@ -2987,34 +2987,34 @@ class ci {
|
|
|
2987
2987
|
return;
|
|
2988
2988
|
const p = i.repeaterConfig, c = p && p.isEnabled && p.count > 1, d = c ? p.count : 1;
|
|
2989
2989
|
for (let X = 0; X < d; X++) {
|
|
2990
|
-
let tt = e.x !== void 0 ? e.x : ((b = e.transform) == null ? void 0 : b.x) ?? 0,
|
|
2990
|
+
let tt = e.x !== void 0 ? e.x : ((b = e.transform) == null ? void 0 : b.x) ?? 0, L = e.y !== void 0 ? e.y : ((m = e.transform) == null ? void 0 : m.y) ?? 0, O = e.rotation !== void 0 ? e.rotation : ((y = e.transform) == null ? void 0 : y.rotation) ?? 0, D = e.scale_x !== void 0 ? e.scale_x : ((S = e.transform) == null ? void 0 : S.scale_x) ?? 1, q = e.scale_y !== void 0 ? e.scale_y : ((C = e.transform) == null ? void 0 : C.scale_y) ?? 1;
|
|
2991
2991
|
if (c && X > 0) {
|
|
2992
2992
|
if (p.type === "Linear") {
|
|
2993
|
-
const ht = p.offsetX || 0,
|
|
2994
|
-
tt += X * ht,
|
|
2993
|
+
const ht = p.offsetX || 0, ut = p.offsetY || 0, at = p.rotation || 0, B = p.scale !== void 0 ? p.scale : 1;
|
|
2994
|
+
tt += X * ht, L += X * ut, O += X * at, D *= Math.pow(B, X), q *= Math.pow(B, X);
|
|
2995
2995
|
} else if (p.type === "Grid") {
|
|
2996
|
-
const ht = p.cols || Math.ceil(Math.sqrt(p.count)),
|
|
2997
|
-
tt +=
|
|
2996
|
+
const ht = p.cols || Math.ceil(Math.sqrt(p.count)), ut = p.gapX || 0, at = p.gapY || 0, B = Math.floor(X / ht), et = X % ht, Q = a + ut, Pt = r + at;
|
|
2997
|
+
tt += et * Q, L += B * Pt;
|
|
2998
2998
|
} else if (p.type === "Radial") {
|
|
2999
|
-
const ht = p.radius || 100,
|
|
3000
|
-
tt = e.x + ht * Math.cos(Pt),
|
|
2999
|
+
const ht = p.radius || 100, ut = p.startAngle || 0, B = (p.endAngle || 360) - ut, et = p.count > 1 ? B / (B === 360 ? p.count : p.count - 1) : 0, Q = ut + X * et, Pt = Q * Math.PI / 180;
|
|
3000
|
+
tt = e.x + ht * Math.cos(Pt), L = e.y + ht * Math.sin(Pt), O += Q;
|
|
3001
3001
|
}
|
|
3002
3002
|
}
|
|
3003
3003
|
const ot = i.type === "Group" || i.type === "Frame" || i.type === "Component", yt = a > 0 && r > 0;
|
|
3004
3004
|
if (!ot && yt) {
|
|
3005
3005
|
const ht = (((w = n.shadow) == null ? void 0 : w.isEnabled) !== !1 ? (((M = n.shadow) == null ? void 0 : M.blur) || 0) + 10 : 0) + (((I = n.blur) == null ? void 0 : I.isEnabled) !== !1 && ((k = n.blur) == null ? void 0 : k.radius) || 0) + 20;
|
|
3006
|
-
if (!this.isObjectInView(t, tt,
|
|
3006
|
+
if (!this.isObjectInView(t, tt, L, a, r, ht))
|
|
3007
3007
|
continue;
|
|
3008
3008
|
}
|
|
3009
3009
|
this.debug_objectsRendered++, t.save();
|
|
3010
3010
|
const bt = [], gt = n.blur || ((T = i.style) == null ? void 0 : T.blur);
|
|
3011
3011
|
gt && gt.amount > 0 && bt.push(`blur(${gt.amount}px)`);
|
|
3012
|
-
const Et = n.effects || ((
|
|
3012
|
+
const Et = n.effects || ((R = i.style) == null ? void 0 : R.effects) || [];
|
|
3013
3013
|
let It = Et.find((ht) => ht.isEnabled !== !1 && (ht.type === "BackgroundBlur" || ht.type === "LayerBlur"));
|
|
3014
3014
|
It || (It = n.effect || ((P = i.style) == null ? void 0 : P.effect) || Et.find((ht) => ht.isEnabled !== !1));
|
|
3015
|
-
const
|
|
3016
|
-
|
|
3017
|
-
const
|
|
3015
|
+
const vt = It, Yt = (vt == null ? void 0 : vt.isEnabled) !== !1, ie = vt == null ? void 0 : vt.type, fe = (vt == null ? void 0 : vt.radius) ?? 10;
|
|
3016
|
+
Yt && ie === "LayerBlur" ? bt.push(`blur(${fe}px)`) : Yt && ie === "BackgroundBlur" && (n === i.style && (n = { ...n }), n.fill = { type: "None" });
|
|
3017
|
+
const st = ((_ = s == null ? void 0 : s.type) == null ? void 0 : _.toLowerCase().includes("image")) || ((E = i.type) == null ? void 0 : E.toLowerCase().includes("image")), mt = n.adjustments && Object.keys(n.adjustments).length > 0 ? n.adjustments : null, Lt = s != null && s.adjustments && Object.keys(s.adjustments).length > 0 ? s.adjustments : null, _t = st ? Lt || mt : mt || Lt, dt = st && !_t ? {
|
|
3018
3018
|
exposure: 0,
|
|
3019
3019
|
contrast: 0,
|
|
3020
3020
|
saturation: 100,
|
|
@@ -3027,15 +3027,15 @@ class ci {
|
|
|
3027
3027
|
hue: 0
|
|
3028
3028
|
} : _t;
|
|
3029
3029
|
if (e && dt && (e.geometry = e.geometry || {}, e.geometry.adjustments = { ...dt }), dt) {
|
|
3030
|
-
const ht = (dt.exposure || 0) / 100,
|
|
3030
|
+
const ht = (dt.exposure || 0) / 100, ut = dt.contrast || 0, at = 1 + (dt.saturation || 0) / 100, B = (dt.temperature || 0) / 200, et = (dt.tint || 0) / 200, Q = (dt.highlights || 0) / 500, Pt = (dt.shadows || 0) / 500;
|
|
3031
3031
|
let xt = "", kt = "SourceGraphic";
|
|
3032
3032
|
if (ht !== 0 && (xt += `
|
|
3033
3033
|
<feComponentTransfer in="${kt}" result="exposure">
|
|
3034
3034
|
<feFuncR type="linear" slope="1" intercept="${ht}"/>
|
|
3035
3035
|
<feFuncG type="linear" slope="1" intercept="${ht}"/>
|
|
3036
3036
|
<feFuncB type="linear" slope="1" intercept="${ht}"/>
|
|
3037
|
-
</feComponentTransfer>`, kt = "exposure"),
|
|
3038
|
-
const Mt = (
|
|
3037
|
+
</feComponentTransfer>`, kt = "exposure"), ut !== 0) {
|
|
3038
|
+
const Mt = (ut + 100) / 100, $ = 0.5 * (1 - Mt);
|
|
3039
3039
|
xt += `
|
|
3040
3040
|
<feComponentTransfer in="${kt}" result="contrast">
|
|
3041
3041
|
<feFuncR type="linear" slope="${Mt}" intercept="${$}"/>
|
|
@@ -3052,8 +3052,8 @@ class ci {
|
|
|
3052
3052
|
0 0 ${Mt} 0 ${1 - Mt}
|
|
3053
3053
|
0 0 0 1 0"/>`, kt = "invert";
|
|
3054
3054
|
}
|
|
3055
|
-
if (B !== 0 ||
|
|
3056
|
-
const Mt = 1 +
|
|
3055
|
+
if (B !== 0 || et !== 0 || Q !== 0 || Pt !== 0) {
|
|
3056
|
+
const Mt = 1 + Q + Pt, $ = Mt * (1 + B - et / 2), Wt = Mt * (1 + et), Kt = Mt * (1 - B - et / 2), te = dt.shadows * 0.1 / 255, Jt = [
|
|
3057
3057
|
$,
|
|
3058
3058
|
0,
|
|
3059
3059
|
0,
|
|
@@ -3127,17 +3127,17 @@ class ci {
|
|
|
3127
3127
|
feather: i.maskFeather || 0,
|
|
3128
3128
|
isVisible: !0
|
|
3129
3129
|
}] : []);
|
|
3130
|
-
let
|
|
3130
|
+
let ne = !1;
|
|
3131
3131
|
const me = Vt.filter((ht) => ht.isVisible !== !1 && o.has(ht.maskId));
|
|
3132
3132
|
if (me.length > 0) {
|
|
3133
|
-
const ht = me[0],
|
|
3134
|
-
at && at.visible !== !1 && (
|
|
3133
|
+
const ht = me[0], ut = o.get(ht.maskId), at = this.objectStates.get(ut.id);
|
|
3134
|
+
at && at.visible !== !1 && (ne = !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 = Ot.filter);
|
|
3135
3135
|
}
|
|
3136
|
-
t.translate(Math.round(tt), Math.round(
|
|
3136
|
+
t.translate(Math.round(tt), Math.round(L)), t.rotate(O * Math.PI / 180);
|
|
3137
3137
|
const ye = e.skew_x || 0, Ut = e.skew_y || 0;
|
|
3138
3138
|
if (ye !== 0 || Ut !== 0) {
|
|
3139
|
-
const ht = Math.tan(ye * Math.PI / 180),
|
|
3140
|
-
t.transform(1 + ht *
|
|
3139
|
+
const ht = Math.tan(ye * Math.PI / 180), ut = Math.tan(Ut * Math.PI / 180);
|
|
3140
|
+
t.transform(1 + ht * ut, ut, ht, 1, 0, 0);
|
|
3141
3141
|
}
|
|
3142
3142
|
const Se = e.rotate_x !== void 0 ? e.rotate_x : ((A = e.transform) == null ? void 0 : A.rotate_x) ?? 0, Pe = e.rotate_y !== void 0 ? e.rotate_y : ((W = e.transform) == null ? void 0 : W.rotate_y) ?? 0, Ce = 1 + (e.translate_z !== void 0 ? e.translate_z : ((z = e.transform) == null ? void 0 : z.translate_z) ?? 0) / 1e3, Ae = (e.flip_x === !0 ? -1 : 1) * Math.cos(Pe * Math.PI / 180) * Ce, xe = (e.flip_y === !0 ? -1 : 1) * Math.cos(Se * Math.PI / 180) * Ce;
|
|
3143
3143
|
t.scale(
|
|
@@ -3148,53 +3148,52 @@ class ci {
|
|
|
3148
3148
|
if (se && se.isEnabled !== !1) {
|
|
3149
3149
|
let ht = se.color || "#000000";
|
|
3150
3150
|
(G = (Y = this.artboard) == null ? void 0 : Y.tokens) != null && G.colors && this.artboard.tokens.colors[ht] && (ht = this.artboard.tokens.colors[ht]);
|
|
3151
|
-
const
|
|
3152
|
-
let
|
|
3151
|
+
const ut = this.normalizeOpacity(se.opacity ?? 100), at = se.spread || 0, et = (se.blur || 0) + at * 1.5;
|
|
3152
|
+
let Q = ht;
|
|
3153
3153
|
if (ht.startsWith("#")) {
|
|
3154
3154
|
const kt = ht.replace("#", ""), At = parseInt(kt.substring(0, 2), 16), Mt = parseInt(kt.substring(2, 4), 16), $ = parseInt(kt.substring(4, 6), 16);
|
|
3155
|
-
|
|
3155
|
+
Q = `rgba(${At}, ${Mt}, ${$}, ${ut})`;
|
|
3156
3156
|
} else if (ht.startsWith("rgba")) {
|
|
3157
3157
|
const kt = ht.match(/[\d.]+/g);
|
|
3158
3158
|
if (kt && kt.length >= 4) {
|
|
3159
3159
|
const At = kt[0], Mt = kt[1], $ = kt[2], Wt = kt[3];
|
|
3160
|
-
|
|
3160
|
+
Q = `rgba(${At}, ${Mt}, ${$}, ${parseFloat(Wt) * ut})`;
|
|
3161
3161
|
}
|
|
3162
3162
|
}
|
|
3163
3163
|
const Pt = t.getTransform(), xt = Math.sqrt(Pt.a * Pt.a + Pt.b * Pt.b) || 1;
|
|
3164
|
-
t.shadowColor =
|
|
3165
|
-
}
|
|
3166
|
-
t.shadowColor = "transparent", t.shadowBlur = 0, t.shadowOffsetX = 0, t.shadowOffsetY = 0;
|
|
3164
|
+
t.shadowColor = Q, t.shadowBlur = et * xt, t.shadowOffsetX = (se.offsetX || 0) * xt, t.shadowOffsetY = (se.offsetY || 0) * xt;
|
|
3165
|
+
}
|
|
3167
3166
|
const jt = i.liquidFill || ((N = i.style) == null ? void 0 : N.liquidFill);
|
|
3168
3167
|
if (jt && jt.enabled) {
|
|
3169
3168
|
t.save();
|
|
3170
3169
|
const ht = jt.fillLevel ?? 0.5;
|
|
3171
3170
|
t.beginPath();
|
|
3172
|
-
const
|
|
3173
|
-
t.rect(-a / 2,
|
|
3171
|
+
const ut = r / 2 - r * ht;
|
|
3172
|
+
t.rect(-a / 2, ut, a, r * ht), t.clip(), t.fillStyle = jt.color || "#3b82f6", t.globalAlpha = t.globalAlpha * (jt.opacity ?? 1);
|
|
3174
3173
|
}
|
|
3175
3174
|
if ((s == null ? void 0 : s.type) === "Text")
|
|
3176
3175
|
this._renderText(t, i, l, n, e, a, r, !1, !1, D, q);
|
|
3177
3176
|
else if ((s == null ? void 0 : s.type) === "Image") {
|
|
3178
3177
|
const ht = s.originalSrc || s.src;
|
|
3179
3178
|
if (ht) {
|
|
3180
|
-
let
|
|
3181
|
-
|
|
3182
|
-
this.log(`[ExodeUI] Image loaded successfully, size: ${
|
|
3183
|
-
},
|
|
3184
|
-
console.error("[ExodeUI] Image load failed:",
|
|
3185
|
-
},
|
|
3179
|
+
let ut = this.imageCache.get(ht);
|
|
3180
|
+
ut || (ut = new Image(), ut.onload = () => {
|
|
3181
|
+
this.log(`[ExodeUI] Image loaded successfully, size: ${ut.naturalWidth}x${ut.naturalHeight}`);
|
|
3182
|
+
}, ut.onerror = (et) => {
|
|
3183
|
+
console.error("[ExodeUI] Image load failed:", et, `Src preview: ${ht.substring(0, 100)}...`);
|
|
3184
|
+
}, ut.src = ht, this.imageCache.set(ht, ut));
|
|
3186
3185
|
const at = n.stroke && n.stroke.width > 0 && n.stroke.isEnabled !== !1, B = (((J = n.stroke) == null ? void 0 : J.alignment) || "center").toLowerCase();
|
|
3187
3186
|
if (at && (B === "outside" || B === "center") && this.applyStrokeAlignment(t, n, l, a, r, f, D, q), n.fill && n.fill.type !== "None") {
|
|
3188
3187
|
t.save();
|
|
3189
|
-
const
|
|
3190
|
-
t.fillStyle =
|
|
3188
|
+
const et = t.globalAlpha, Q = this.createCanvasFill(t, n.fill, a, r);
|
|
3189
|
+
t.fillStyle = Q || n.fill.color || "transparent", t.globalAlpha = et * this.normalizeOpacity(n.fill.opacity ?? 100), f !== 0 ? (this.drawRoundRect(t, -a / 2, -r / 2, a, r, f), t.fill()) : t.fillRect(-a / 2, -r / 2, a, r), t.globalAlpha = et, t.restore();
|
|
3191
3190
|
}
|
|
3192
|
-
|
|
3191
|
+
ut.complete && ut.naturalWidth > 0 ? (f !== 0 ? (t.save(), this.drawRoundRect(t, -a / 2, -r / 2, a, r, f), t.clip(), t.drawImage(ut, -a / 2, -r / 2, a, r), t.restore()) : t.drawImage(ut, -a / 2, -r / 2, a, r), at && B === "inside" && this.applyStrokeAlignment(t, n, l, a, r, f, D, q)) : at && B === "inside" && this.applyStrokeAlignment(t, n, l, a, r, f, D, q);
|
|
3193
3192
|
}
|
|
3194
3193
|
} else if (s.type === "SVG") {
|
|
3195
3194
|
const ht = s.svgContent;
|
|
3196
3195
|
if (ht) {
|
|
3197
|
-
const
|
|
3196
|
+
const ut = n.palette || [], at = n.fill, B = n.stroke, et = at ? this.normalizeOpacity(at.opacity ?? 100) : 1, Q = (at == null ? void 0 : at.type) === "Solid" && (!B || B.isEnabled === !1 || B.type === "Solid" && B.color === at.color), Pt = at && at.type !== "None" ? Q ? "monochrome" : at.type === "Solid" ? (at.color || "") + "|opacity:" + et : JSON.stringify(at.stops || []) + "|opacity:" + et : "", xt = B && B.isEnabled !== !1 && (B.width || 0) > 0 ? Q ? [
|
|
3198
3197
|
"monochrome",
|
|
3199
3198
|
B.width || 0,
|
|
3200
3199
|
B.trimStart ?? 0,
|
|
@@ -3215,7 +3214,7 @@ class ci {
|
|
|
3215
3214
|
B.dashOffset ?? 0
|
|
3216
3215
|
].join("|") : "nostroke", kt = [
|
|
3217
3216
|
i.id,
|
|
3218
|
-
|
|
3217
|
+
ut.join("_"),
|
|
3219
3218
|
Pt,
|
|
3220
3219
|
xt,
|
|
3221
3220
|
e.opacity ?? 100,
|
|
@@ -3229,86 +3228,86 @@ class ci {
|
|
|
3229
3228
|
let Wt = s.width || a || 100, Kt = s.height || r || 100;
|
|
3230
3229
|
const te = $.match(/viewBox=["']\s*0\s+0\s+([\d.]+)\s+([\d.]+)\s*["']/i);
|
|
3231
3230
|
if (te && (Wt = parseFloat(te[1]), Kt = parseFloat(te[2])), $ = $.replace(/<svg([^>]*)>/i, (rt, V) => {
|
|
3232
|
-
let
|
|
3233
|
-
return
|
|
3234
|
-
}), s.colors && s.colors.length > 0 &&
|
|
3235
|
-
if (
|
|
3236
|
-
const
|
|
3237
|
-
$ = $.replace(
|
|
3231
|
+
let it = V.replace(/\b(?:width|height)=["'][^"']*["']/gi, " ");
|
|
3232
|
+
return it.match(/\bviewBox=/i) || (it += ` viewBox="0 0 ${Wt} ${Kt}"`), it.match(/\bpreserveAspectRatio=/i) || (it += ' preserveAspectRatio="none"'), it += ' width="100%" height="100%"', `<svg${it}>`;
|
|
3233
|
+
}), s.colors && s.colors.length > 0 && ut.length > 0 && s.colors.forEach((rt, V) => {
|
|
3234
|
+
if (ut[V]) {
|
|
3235
|
+
const it = rt.replace(/[-\/\\^$*+?.()|[\]{}]/g, "\\$&"), nt = new RegExp(it, "gi");
|
|
3236
|
+
$ = $.replace(nt, ut[V]);
|
|
3238
3237
|
}
|
|
3239
3238
|
}), at && at.type && at.type !== "None") {
|
|
3240
3239
|
if (at.type === "Solid" && at.color) {
|
|
3241
|
-
const rt =
|
|
3242
|
-
$ = $.replace(/\bfill\s*=\s*["'][^"']*["']/gi, (
|
|
3240
|
+
const rt = Q ? "#FFFFFF" : at.color, V = Q ? 1 : this.normalizeOpacity(at.opacity ?? 100);
|
|
3241
|
+
$ = $.replace(/\bfill\s*=\s*["'][^"']*["']/gi, (it) => /fill\s*=\s*["']\s*(none|transparent)\s*["']/i.test(it) ? it : `fill="${rt}"`), $ = $.replace(/fill\s*:\s*[^;"')]+/gi, (it) => /fill\s*:\s*(none|transparent)/i.test(it) ? it : `fill:${rt}`), V < 1 && ($ = $.replace(/\bfill-opacity\s*=\s*["'][^"']*["']/gi, `fill-opacity="${V}"`), $ = $.replace(/fill-opacity\s*:\s*[^;"')]+/gi, `fill-opacity:${V}`), $.match(/\bfill-opacity\s*=/i) || ($ = $.replace(/(<svg[^>]*>)/i, `$1<g fill-opacity="${V}">`), $ = $.replace(/<\/svg>/i, "</g></svg>")));
|
|
3243
3242
|
} else if (at.type === "LinearGradient" || at.type === "RadialGradient" || at.type === "Linear" || at.type === "Radial") {
|
|
3244
|
-
const rt = "exode-fill", V = this.normalizeOpacity(at.opacity ?? 100),
|
|
3245
|
-
const
|
|
3246
|
-
return `<stop offset="${
|
|
3243
|
+
const rt = "exode-fill", V = this.normalizeOpacity(at.opacity ?? 100), it = (at.stops || []).map((St) => {
|
|
3244
|
+
const Xt = St.offset !== void 0 ? St.offset : St.pos ?? 0, Qt = this.normalizeOpacity(St.opacity ?? 100) * V;
|
|
3245
|
+
return `<stop offset="${Xt * 100}%" stop-color="${St.color || "#000"}" stop-opacity="${Qt}"/>`;
|
|
3247
3246
|
}).join("");
|
|
3248
|
-
let
|
|
3247
|
+
let nt = "";
|
|
3249
3248
|
if (at.type === "LinearGradient" || at.type === "Linear") {
|
|
3250
|
-
const
|
|
3251
|
-
|
|
3249
|
+
const St = (Ht, Nt) => Array.isArray(Ht) ? Ht[Nt] ?? (Nt === 0 ? 0 : 1) : Ht && typeof Ht == "object" ? Ht[Nt === 0 ? "x" : "y"] ?? (Nt === 0 ? 0 : 1) : Nt === 0 ? 0 : 1, Xt = St(at.start, 0) * 100, Qt = St(at.start, 1) * 100, oe = St(at.end, 0) * 100, Gt = St(at.end, 1) * 100;
|
|
3250
|
+
nt = `<linearGradient id="${rt}" x1="${Xt}%" y1="${Qt}%" x2="${oe}%" y2="${Gt}%" gradientUnits="objectBoundingBox">${it}</linearGradient>`;
|
|
3252
3251
|
} else {
|
|
3253
|
-
const
|
|
3254
|
-
|
|
3252
|
+
const St = (Gt, Ht) => Array.isArray(Gt) ? Gt[Ht] ?? 0.5 : Gt && typeof Gt == "object" ? Gt[Ht === 0 ? "x" : "y"] ?? 0.5 : 0.5, Xt = St(at.center, 0) * 100, Qt = St(at.center, 1) * 100, oe = (at.radius ?? 0.5) * 100;
|
|
3253
|
+
nt = `<radialGradient id="${rt}" cx="${Xt}%" cy="${Qt}%" r="${oe}%" gradientUnits="objectBoundingBox">${it}</radialGradient>`;
|
|
3255
3254
|
}
|
|
3256
|
-
/<defs>/i.test($) ? $ = $.replace(/<defs>/i, `<defs>${
|
|
3255
|
+
/<defs>/i.test($) ? $ = $.replace(/<defs>/i, `<defs>${nt}`) : $ = $.replace(/<svg([^>]*)>/i, `<svg$1><defs>${nt}</defs>`), $ = $.replace(/\bfill\s*=\s*["'][^"']*["']/gi, (St) => /fill\s*=\s*["']\s*(none|transparent)\s*["']/i.test(St) ? St : `fill="url(#${rt})"`), $ = $.replace(/fill\s*:\s*[^;"')]+/gi, (St) => /fill\s*:\s*(none|transparent)/i.test(St) ? St : `fill:url(#${rt})`);
|
|
3257
3256
|
}
|
|
3258
3257
|
}
|
|
3259
|
-
const Jt = (rt, V,
|
|
3260
|
-
const
|
|
3261
|
-
const Ht = Gt.offset !== void 0 ? Gt.offset : Gt.pos ?? 0, Nt = this.normalizeOpacity(Gt.opacity ?? 100) *
|
|
3258
|
+
const Jt = (rt, V, it = 1) => {
|
|
3259
|
+
const nt = (rt.stops || []).map((Gt) => {
|
|
3260
|
+
const Ht = Gt.offset !== void 0 ? Gt.offset : Gt.pos ?? 0, Nt = this.normalizeOpacity(Gt.opacity ?? 100) * it;
|
|
3262
3261
|
return `<stop offset="${Ht * 100}%" stop-color="${Gt.color || "#000"}" stop-opacity="${Nt}"/>`;
|
|
3263
|
-
}).join(""),
|
|
3262
|
+
}).join(""), St = (Gt, Ht, Nt = 0.5) => Array.isArray(Gt) ? Gt[Ht] ?? Nt : Gt && typeof Gt == "object" ? Gt[Ht === 0 ? "x" : "y"] ?? Nt : Nt;
|
|
3264
3263
|
if (rt.type === "LinearGradient" || rt.type === "Linear") {
|
|
3265
|
-
const Gt =
|
|
3266
|
-
return `<linearGradient id="${V}" x1="${Gt}%" y1="${Ht}%" x2="${Nt}%" y2="${Ie}%" gradientUnits="objectBoundingBox">${
|
|
3264
|
+
const Gt = St(rt.start, 0, 0) * 100, Ht = St(rt.start, 1, 0) * 100, Nt = St(rt.end, 0, 1) * 100, Ie = St(rt.end, 1, 1) * 100;
|
|
3265
|
+
return `<linearGradient id="${V}" x1="${Gt}%" y1="${Ht}%" x2="${Nt}%" y2="${Ie}%" gradientUnits="objectBoundingBox">${nt}</linearGradient>`;
|
|
3267
3266
|
}
|
|
3268
|
-
const
|
|
3269
|
-
return `<radialGradient id="${V}" cx="${
|
|
3270
|
-
},
|
|
3267
|
+
const Xt = St(rt.center, 0, 0.5) * 100, Qt = St(rt.center, 1, 0.5) * 100, oe = (rt.radius ?? 0.5) * 100;
|
|
3268
|
+
return `<radialGradient id="${V}" cx="${Xt}%" cy="${Qt}%" r="${oe}%" gradientUnits="objectBoundingBox">${nt}</radialGradient>`;
|
|
3269
|
+
}, pt = (rt, V) => /<defs>/i.test(rt) ? rt.replace(/<defs>/i, `<defs>${V}`) : rt.replace(/(<svg[^>]*>)/i, `$1<defs>${V}</defs>`);
|
|
3271
3270
|
if (B && B.isEnabled !== !1 && (B.width || 0) > 0) {
|
|
3272
|
-
const rt =
|
|
3273
|
-
let
|
|
3274
|
-
const
|
|
3275
|
-
if (
|
|
3276
|
-
if (
|
|
3277
|
-
|
|
3278
|
-
else if (
|
|
3271
|
+
const rt = Q ? 1 : this.normalizeOpacity(B.opacity ?? 100), V = Q ? "#FFFFFF" : B.color || (at == null ? void 0 : at.color) || "#000000";
|
|
3272
|
+
let it = "";
|
|
3273
|
+
const nt = B.fill;
|
|
3274
|
+
if (nt && nt.type) {
|
|
3275
|
+
if (nt.type === "Solid")
|
|
3276
|
+
it = nt.color || B.color || "#000000";
|
|
3277
|
+
else if (nt.type === "LinearGradient" || nt.type === "RadialGradient" || nt.type === "Linear" || nt.type === "Radial") {
|
|
3279
3278
|
const zt = "exode-stroke";
|
|
3280
|
-
$ =
|
|
3279
|
+
$ = pt($, Jt(nt, zt, rt)), it = `url(#${zt})`;
|
|
3281
3280
|
}
|
|
3282
3281
|
}
|
|
3283
|
-
|
|
3282
|
+
it || (it = V), $.match(/\bstroke\s*=\s*["']/i) ? $ = $.replace(
|
|
3284
3283
|
/\bstroke\s*=\s*["'][^"']*["']/gi,
|
|
3285
|
-
(zt) => /stroke\s*=\s*["']\s*(none|transparent)\s*["']/i.test(zt) ? zt : `stroke="${
|
|
3286
|
-
) : $ = $.replace(/<(path|circle|rect|ellipse|polygon|polyline)/gi, `<$1 stroke="${
|
|
3284
|
+
(zt) => /stroke\s*=\s*["']\s*(none|transparent)\s*["']/i.test(zt) ? zt : `stroke="${it}"`
|
|
3285
|
+
) : $ = $.replace(/<(path|circle|rect|ellipse|polygon|polyline)/gi, `<$1 stroke="${it}"`), $ = $.replace(
|
|
3287
3286
|
new RegExp(`(?<![a-z-])stroke\\s*:\\s*(?!none|transparent)[^;"')]+`, "gi"),
|
|
3288
|
-
`stroke:${
|
|
3287
|
+
`stroke:${it}`
|
|
3289
3288
|
);
|
|
3290
|
-
let
|
|
3289
|
+
let St = s.width || a || 100, Xt = s.height || r || 100;
|
|
3291
3290
|
const Qt = ht.match(/viewBox=["']\s*0\s+0\s+([\d.]+)\s+([\d.]+)\s*["']/i);
|
|
3292
3291
|
if (Qt) {
|
|
3293
|
-
const zt = parseFloat(Qt[1]),
|
|
3294
|
-
!isNaN(zt) && !isNaN(
|
|
3292
|
+
const zt = parseFloat(Qt[1]), ae = parseFloat(Qt[2]);
|
|
3293
|
+
!isNaN(zt) && !isNaN(ae) && (St = zt, Xt = ae);
|
|
3295
3294
|
}
|
|
3296
|
-
const
|
|
3295
|
+
const oe = Math.max(1e-3, a / St), Gt = Math.max(1e-3, r / Xt), Ht = (oe + Gt) / 2, Nt = (B.width || 1) / Ht;
|
|
3297
3296
|
$.match(/\bstroke-width\s*=\s*["']/i) ? $ = $.replace(/\bstroke-width\s*=\s*["'][^"']*["']/gi, `stroke-width="${Nt}"`) : $ = $.replace(/<(path|circle|rect|ellipse|polygon|polyline)/gi, `<$1 stroke-width="${Nt}"`), $ = $.replace(/stroke-width\s*:\s*[^;"')]+/gi, `stroke-width:${Nt}`), $.match(/\bstroke-opacity\s*=\s*["']/i) ? $ = $.replace(/\bstroke-opacity\s*=\s*["'][^"']*["']/gi, `stroke-opacity="${rt}"`) : $ = $.replace(/<(path|circle|rect|ellipse|polygon|polyline)/gi, `<$1 stroke-opacity="${rt}"`), $ = $.replace(/stroke-opacity\s*:\s*[^;"')]+/gi, `stroke-opacity:${rt}`);
|
|
3298
3297
|
const Ie = B.lineCap || "round";
|
|
3299
3298
|
$.match(/\bstroke-linecap\s*=\s*["']/i) ? $ = $.replace(/\bstroke-linecap\s*=\s*["'][^"']*["']/gi, `stroke-linecap="${Ie}"`) : $ = $.replace(/<(path|circle|rect|ellipse|polygon|polyline)/gi, `<$1 stroke-linecap="${Ie}"`), $ = $.replace(/stroke-linecap\s*:\s*[^;"')]+/gi, `stroke-linecap:${Ie}`);
|
|
3300
|
-
const
|
|
3301
|
-
$.match(/\bstroke-linejoin\s*=\s*["']/i) ? $ = $.replace(/\bstroke-linejoin\s*=\s*["'][^"']*["']/gi, `stroke-linejoin="${
|
|
3302
|
-
const
|
|
3299
|
+
const Re = B.lineJoin || "round";
|
|
3300
|
+
$.match(/\bstroke-linejoin\s*=\s*["']/i) ? $ = $.replace(/\bstroke-linejoin\s*=\s*["'][^"']*["']/gi, `stroke-linejoin="${Re}"`) : $ = $.replace(/<(path|circle|rect|ellipse|polygon|polyline)/gi, `<$1 stroke-linejoin="${Re}"`), $ = $.replace(/stroke-linejoin\s*:\s*[^;"')]+/gi, `stroke-linejoin:${Re}`);
|
|
3301
|
+
const Le = B.trimStart ?? 0, Oe = B.trimEnd ?? 1, Fe = B.trimOffset ?? 0, $e = B.dashOffset ?? 0, Ye = Le !== 0 || Oe !== 1 || Fe !== 0 || $e !== 0;
|
|
3303
3302
|
if (Ye) {
|
|
3304
|
-
const zt = Math.max(0, Math.min(1,
|
|
3305
|
-
this.frameCount % 600 === 0 && this.debugLog(`SVG Trim - Object: ${i.name || i.id}, Start: ${zt}, End: ${
|
|
3306
|
-
const we = (
|
|
3303
|
+
const zt = Math.max(0, Math.min(1, Le)), ae = Math.max(0, Math.min(1, Oe));
|
|
3304
|
+
this.frameCount % 600 === 0 && this.debugLog(`SVG Trim - Object: ${i.name || i.id}, Start: ${zt}, End: ${ae}`);
|
|
3305
|
+
const we = (St + Xt) * 2, Be = (Fe % 1 + 1) % 1, We = ($e % 1 + 1) % 1;
|
|
3307
3306
|
let de = "", ce = 0;
|
|
3308
|
-
if (zt >=
|
|
3307
|
+
if (zt >= ae)
|
|
3309
3308
|
de = `0 ${we}`, ce = 0;
|
|
3310
3309
|
else {
|
|
3311
|
-
const he = we * (
|
|
3310
|
+
const he = we * (ae - zt), ke = we - he;
|
|
3312
3311
|
ce = -(we * (zt + Be + We)), de = `${he} ${ke}`;
|
|
3313
3312
|
}
|
|
3314
3313
|
$.match(/\bstroke-dasharray\s*=/i) ? $ = $.replace(/\bstroke-dasharray\s*=\s*["'][^"']*["']/gi, `stroke-dasharray="${de}"`) : $ = $.replace(/<(path|circle|rect|ellipse|polygon|polyline)/gi, `<$1 stroke-dasharray="${de}"`), $ = $.replace(/stroke-dasharray\s*:\s*[^;"')]+/gi, `stroke-dasharray:${de}`), $.match(/\bstroke-dashoffset\s*=/i) ? $ = $.replace(/\bstroke-dashoffset\s*=\s*["'][^"']*["']/gi, `stroke-dashoffset="${ce}"`) : $ = $.replace(/<(path|circle|rect|ellipse|polygon|polyline)/gi, `<$1 stroke-dashoffset="${ce}"`), $ = $.replace(/stroke-dashoffset\s*:\s*[^;"')]+/gi, `stroke-dashoffset:${ce}`);
|
|
@@ -3317,17 +3316,17 @@ class ci {
|
|
|
3317
3316
|
$ = $.replace(/\bstroke-dasharray\s*=\s*["'][^"']*["']/gi, `stroke-dasharray="${zt}"`), $ = $.replace(/stroke-dasharray\s*:\s*[^;"')]+/gi, `stroke-dasharray:${zt}`), B.dashOffset && ($ = $.replace(/\bstroke-dashoffset\s*=\s*["'][^"']*["']/gi, `stroke-dashoffset="${B.dashOffset}"`), $ = $.replace(/stroke-dashoffset\s*:\s*[^;"')]+/gi, `stroke-dashoffset:${B.dashOffset}`));
|
|
3318
3317
|
}
|
|
3319
3318
|
if (!/\bstroke\s*=\s*["']/i.test(ht) && !new RegExp("(?<![a-z-])stroke\\s*:", "i").test(ht)) {
|
|
3320
|
-
let zt = "",
|
|
3319
|
+
let zt = "", ae = "";
|
|
3321
3320
|
if (Ye) {
|
|
3322
|
-
const de = s.width || a || 100, ce = s.height || r || 100, he = (de + ce) * 2, ke = Math.max(0, Math.min(1,
|
|
3321
|
+
const de = s.width || a || 100, ce = s.height || r || 100, he = (de + ce) * 2, ke = Math.max(0, Math.min(1, Le)), Xe = Math.max(0, Math.min(1, Oe)), Ve = (Fe % 1 + 1) % 1, Ne = ($e % 1 + 1) % 1;
|
|
3323
3322
|
if (ke >= Xe)
|
|
3324
|
-
zt = ` stroke-dasharray="0 ${he}"`,
|
|
3323
|
+
zt = ` stroke-dasharray="0 ${he}"`, ae = ' stroke-dashoffset="0"';
|
|
3325
3324
|
else {
|
|
3326
3325
|
const De = he * (Xe - ke), He = he - De, H = -(he * (ke + Ve + Ne));
|
|
3327
|
-
zt = ` stroke-dasharray="${De} ${He}"`,
|
|
3326
|
+
zt = ` stroke-dasharray="${De} ${He}"`, ae = ` stroke-dashoffset="${H}"`;
|
|
3328
3327
|
}
|
|
3329
|
-
} else (x = B.dashArray) != null && x.length && (zt = ` stroke-dasharray="${B.dashArray.join(" ")}"`, B.dashOffset && (
|
|
3330
|
-
const we = ` stroke-linecap="${B.lineCap || "round"}"`, Be = ` stroke-linejoin="${B.lineJoin || "round"}"`, We = `stroke="${
|
|
3328
|
+
} else (x = B.dashArray) != null && x.length && (zt = ` stroke-dasharray="${B.dashArray.join(" ")}"`, B.dashOffset && (ae = ` stroke-dashoffset="${B.dashOffset}"`));
|
|
3329
|
+
const we = ` stroke-linecap="${B.lineCap || "round"}"`, Be = ` stroke-linejoin="${B.lineJoin || "round"}"`, We = `stroke="${it}" stroke-width="${Nt}" stroke-opacity="${rt}"${we}${Be}${zt}${ae}`;
|
|
3331
3330
|
$ = $.replace(
|
|
3332
3331
|
/(<svg[^>]*>)(\s*(?:<defs>[\s\S]*?<\/defs>)?)/i,
|
|
3333
3332
|
(de, ce, he) => `${ce}${he}<g ${We}>`
|
|
@@ -3347,7 +3346,7 @@ class ci {
|
|
|
3347
3346
|
let Mt = null;
|
|
3348
3347
|
if (At.complete && At.naturalWidth > 0 ? (Mt = At, this.lastValidSvgImgMap.set(i.id, At)) : Mt = this.lastValidSvgImgMap.get(i.id) || null, Mt && Mt.complete && Mt.naturalWidth > 0) {
|
|
3349
3348
|
const $ = Math.max(1, a), Wt = Math.max(1, r);
|
|
3350
|
-
if (
|
|
3349
|
+
if (Q && (at == null ? void 0 : at.type) === "Solid") {
|
|
3351
3350
|
this.maskBuffer || (this.maskBuffer = document.createElement("canvas"), this.maskCtx = this.maskBuffer.getContext("2d")), this.maskBuffer.width = $, this.maskBuffer.height = Wt, 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, $, Wt), this.maskCtx.drawImage(Mt, 0, 0, $, Wt), this.maskCtx.globalCompositeOperation = "source-in";
|
|
3352
3351
|
const Kt = at.color || "#000000", te = this.normalizeOpacity(at.opacity ?? 100);
|
|
3353
3352
|
this.maskCtx.fillStyle = Kt, this.maskCtx.globalAlpha = te, this.maskCtx.fillRect(0, 0, $, Wt), t.drawImage(this.maskBuffer, -$ / 2, -Wt / 2, $, Wt);
|
|
@@ -3357,54 +3356,58 @@ class ci {
|
|
|
3357
3356
|
} else if (l.type === "LineGraph")
|
|
3358
3357
|
this.renderLineGraph(t, l, a, r);
|
|
3359
3358
|
else if (i.type === "Shape") {
|
|
3360
|
-
if (this.applyPath(t, l, a, r, f), t.save(), n.blur && n.blur.amount > 0 && (t.filter = `blur(${n.blur.amount}px)`),
|
|
3361
|
-
|
|
3359
|
+
if (this.applyPath(t, l, a, r, f), t.save(), n.blur && n.blur.amount > 0 && (t.filter = `blur(${n.blur.amount}px)`), Yt && ie === "BackgroundBlur")
|
|
3360
|
+
this.applyBackgroundBlurGlass(t, l, a, r, f, vt);
|
|
3361
|
+
else if (n.fill) {
|
|
3362
|
+
const ut = t.globalAlpha;
|
|
3362
3363
|
if (((F = n.fill) == null ? void 0 : F.type) === "Image" && (n.fill.originalSrc || n.fill.src)) {
|
|
3363
|
-
const
|
|
3364
|
-
let
|
|
3365
|
-
|
|
3364
|
+
const at = n.fill.originalSrc || n.fill.src;
|
|
3365
|
+
let B = this.imageCache.get(at);
|
|
3366
|
+
B || (B = new Image(), B.src = at, this.imageCache.set(at, B)), B.complete && B.naturalWidth > 0 && (t.save(), this.applyPath(t, l, a, r, f), t.clip(), this.renderFittedImage(t, B, -a / 2, -r / 2, a, r, n.fill.fillMode), t.restore());
|
|
3366
3367
|
} else {
|
|
3367
|
-
const
|
|
3368
|
-
t.fillStyle =
|
|
3368
|
+
const at = this.createCanvasFill(t, n.fill, a, r);
|
|
3369
|
+
t.fillStyle = at || (typeof n.fill == "string" ? n.fill : n.fill.color || "transparent"), t.globalAlpha = ut * this.normalizeOpacity(n.fill.opacity ?? 100), this.applyPath(t, l, a, r, f), t.fill();
|
|
3369
3370
|
}
|
|
3370
|
-
t.globalAlpha =
|
|
3371
|
+
t.globalAlpha = ut;
|
|
3371
3372
|
}
|
|
3372
|
-
t.restore(), n.stroke && n.stroke.width > 0 && this.applyStrokeAlignment(t, n, l, a, r, f, D, q);
|
|
3373
|
+
t.restore(), n.stroke && n.stroke.width > 0 && (this.applyPath(t, l, a, r, f), this.applyStrokeAlignment(t, n, l, a, r, f, D, q));
|
|
3373
3374
|
} else if (i.type === "Frame" || i.type === "Group" && !i.isStructuralGroup) {
|
|
3374
|
-
const ht = e.width ?? s.width ?? i.width ?? a,
|
|
3375
|
-
if (t.save(), t.beginPath(), this.drawRoundRect(t, -ht / 2, -
|
|
3376
|
-
|
|
3377
|
-
|
|
3375
|
+
const ht = e.width ?? s.width ?? i.width ?? a, ut = e.height ?? s.height ?? i.height ?? r, at = f;
|
|
3376
|
+
if (t.save(), t.beginPath(), this.drawRoundRect(t, -ht / 2, -ut / 2, ht, ut, at), Yt && ie === "BackgroundBlur")
|
|
3377
|
+
this.applyBackgroundBlurGlass(t, l, ht, ut, at, vt);
|
|
3378
|
+
else if (n.fill && n.fill.type !== "None") {
|
|
3379
|
+
const et = t.globalAlpha, Q = this.createCanvasFill(t, n.fill, ht, ut);
|
|
3380
|
+
t.fillStyle = Q || n.fill.color || "transparent", t.globalAlpha = et * this.normalizeOpacity(n.fill.opacity ?? 100), t.beginPath(), this.drawRoundRect(t, -ht / 2, -ut / 2, ht, ut, at), t.fill(), t.globalAlpha = et;
|
|
3378
3381
|
}
|
|
3379
3382
|
if (t.restore(), n.stroke && n.stroke.width > 0 && n.stroke.isEnabled !== !1) {
|
|
3380
|
-
const
|
|
3381
|
-
this.applyStrokeAlignment(t, n,
|
|
3383
|
+
const et = { type: "Rectangle" };
|
|
3384
|
+
t.beginPath(), this.drawRoundRect(t, -ht / 2, -ut / 2, ht, ut, at), this.applyStrokeAlignment(t, n, et, ht, ut, at, D, q);
|
|
3382
3385
|
}
|
|
3383
3386
|
} 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:", (j = i.geometry) == null ? void 0 : j.type));
|
|
3384
|
-
if (this.applyArtEffectOverlay(t, i, l, a, r, f),
|
|
3385
|
-
const
|
|
3387
|
+
if (this.applyArtEffectOverlay(t, i, l, a, r, f), jt && jt.enabled && t.restore(), i.children && i.children.length > 0) {
|
|
3388
|
+
const ut = i.type === "Frame", at = i.clipsContent !== void 0 ? i.clipsContent : i.clipContent !== void 0 ? i.clipContent : ut;
|
|
3386
3389
|
if (t.save(), at) {
|
|
3387
3390
|
t.beginPath();
|
|
3388
|
-
const
|
|
3389
|
-
this.drawRoundRect(t, -
|
|
3391
|
+
const et = e.width ?? (s == null ? void 0 : s.width) ?? i.width ?? 0, Q = e.height ?? (s == null ? void 0 : s.height) ?? i.height ?? 0, Pt = e.cornerRadius ?? (s == null ? void 0 : s.corner_radius) ?? i.cornerRadius ?? 0;
|
|
3392
|
+
this.drawRoundRect(t, -et / 2, -Q / 2, et, Q, Pt), t.clip();
|
|
3390
3393
|
}
|
|
3391
3394
|
let B = 0;
|
|
3392
|
-
for (i.children.forEach((
|
|
3393
|
-
const
|
|
3394
|
-
if (!
|
|
3395
|
-
const Pt = this.objectStates.get(
|
|
3395
|
+
for (i.children.forEach((et) => {
|
|
3396
|
+
const Q = o.get(et);
|
|
3397
|
+
if (!Q) return;
|
|
3398
|
+
const Pt = this.objectStates.get(et), xt = (Pt == null ? void 0 : Pt.geometry) || Q.geometry;
|
|
3396
3399
|
if (xt && xt.isMask && (Pt == null ? void 0 : Pt.visible) !== !1) {
|
|
3397
3400
|
const kt = xt.width || 0, At = xt.height || 0;
|
|
3398
|
-
this.applyObjectTransform(t,
|
|
3401
|
+
this.applyObjectTransform(t, et);
|
|
3399
3402
|
const Mt = (Pt == null ? void 0 : Pt.corner_radius) ?? (xt == null ? void 0 : xt.corner_radius) ?? 0;
|
|
3400
3403
|
this.applyPath(t, xt, kt, At, Mt), t.clip(), B++;
|
|
3401
3404
|
} else
|
|
3402
|
-
this.renderObject(t,
|
|
3405
|
+
this.renderObject(t, Q, o);
|
|
3403
3406
|
}); B > 0; )
|
|
3404
3407
|
t.restore(), B--;
|
|
3405
3408
|
t.restore();
|
|
3406
3409
|
}
|
|
3407
|
-
if (
|
|
3410
|
+
if (ne) {
|
|
3408
3411
|
this.maskCtx.restore(), (e.masks || (i.maskedBy ? [{
|
|
3409
3412
|
maskId: i.maskedBy,
|
|
3410
3413
|
inverted: i.maskInverted === !0,
|
|
@@ -3414,71 +3417,71 @@ class ci {
|
|
|
3414
3417
|
isVisible: !0
|
|
3415
3418
|
}] : [])).filter((B) => B.isVisible !== !1 && o.has(B.maskId)).forEach((B) => {
|
|
3416
3419
|
var Mt, $, Wt, Kt, te, Jt;
|
|
3417
|
-
const
|
|
3420
|
+
const et = o.get(B.maskId), Q = this.objectStates.get(et.id), Pt = B.feather || 0, xt = B.inverted === !0, kt = B.opacity !== void 0 ? typeof B.opacity == "number" ? B.opacity : B.opacity / 100 : 1;
|
|
3418
3421
|
if ((B.type || "alpha") === "luma") {
|
|
3419
|
-
(!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,
|
|
3420
|
-
const
|
|
3421
|
-
if (((Mt =
|
|
3422
|
-
const
|
|
3423
|
-
this._renderText(this.lumaCtx,
|
|
3424
|
-
} else if ((($ =
|
|
3425
|
-
const
|
|
3426
|
-
if (
|
|
3427
|
-
let
|
|
3428
|
-
|
|
3422
|
+
(!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, et.id, o), Pt > 0 && (this.lumaCtx.filter = `blur(${Pt}px)`), this.lumaCtx.globalAlpha = kt;
|
|
3423
|
+
const pt = (Q == null ? void 0 : Q.width) || et.geometry.width || 0, ct = (Q == null ? void 0 : Q.height) || et.geometry.height || 0, Ct = (Q == null ? void 0 : Q.corner_radius) ?? et.corner_radius ?? 0;
|
|
3424
|
+
if (((Mt = et.geometry) == null ? void 0 : Mt.type) === "Text") {
|
|
3425
|
+
const nt = Q != null && Q.geometry ? this.deepMerge(et.geometry, Q.geometry) : et.geometry, St = Q != null && Q.style ? this.deepMerge(et.style, Q.style) : et.style;
|
|
3426
|
+
this._renderText(this.lumaCtx, et, { ...nt, width: pt, height: ct, corner_radius: Ct }, St, Q, pt, ct, !0, !1, D, q);
|
|
3427
|
+
} else if ((($ = et.geometry) == null ? void 0 : $.type) === "Image") {
|
|
3428
|
+
const nt = et.geometry.src;
|
|
3429
|
+
if (nt) {
|
|
3430
|
+
let St = this.imageCache.get(nt);
|
|
3431
|
+
St || (St = new Image(), St.src = nt, this.imageCache.set(nt, St)), St.complete && St.naturalWidth > 0 ? this.lumaCtx.drawImage(St, -pt / 2, -ct / 2, pt, ct) : (this.applyPath(this.lumaCtx, et.geometry, pt, ct, Ct), this.lumaCtx.fillStyle = "#ffffff", this.lumaCtx.fill());
|
|
3429
3432
|
}
|
|
3430
|
-
} else if (((Wt =
|
|
3431
|
-
const
|
|
3432
|
-
if (
|
|
3433
|
-
const
|
|
3434
|
-
let
|
|
3435
|
-
if (!
|
|
3436
|
-
|
|
3437
|
-
const Qt = new Blob([
|
|
3438
|
-
|
|
3433
|
+
} else if (((Wt = et.geometry) == null ? void 0 : Wt.type) === "SVG") {
|
|
3434
|
+
const nt = et.geometry.svgContent;
|
|
3435
|
+
if (nt) {
|
|
3436
|
+
const St = `__lumamask_${et.id}`;
|
|
3437
|
+
let Xt = this.imageCache.get(St);
|
|
3438
|
+
if (!Xt) {
|
|
3439
|
+
Xt = new Image();
|
|
3440
|
+
const Qt = new Blob([nt], { type: "image/svg+xml" });
|
|
3441
|
+
Xt.src = URL.createObjectURL(Qt), Xt.onload = () => {
|
|
3439
3442
|
this.artboard && this.reset();
|
|
3440
|
-
}, this.imageCache.set(
|
|
3443
|
+
}, this.imageCache.set(St, Xt);
|
|
3441
3444
|
}
|
|
3442
|
-
|
|
3445
|
+
Xt.complete && Xt.naturalWidth > 0 ? this.lumaCtx.drawImage(Xt, -pt / 2, -ct / 2, pt, ct) : (this.applyPath(this.lumaCtx, et.geometry, pt, ct, Ct), this.lumaCtx.fillStyle = "#ffffff", this.lumaCtx.fill());
|
|
3443
3446
|
}
|
|
3444
3447
|
} else
|
|
3445
|
-
this.applyPath(this.lumaCtx,
|
|
3448
|
+
this.applyPath(this.lumaCtx, et.geometry, pt, ct, Ct), this.lumaCtx.fillStyle = "#ffffff", this.lumaCtx.fill();
|
|
3446
3449
|
this.lumaCtx.restore();
|
|
3447
|
-
const rt = this.maskCtx.getImageData(0, 0, this.canvasWidth, this.canvasHeight), V = this.lumaCtx.getImageData(0, 0, this.canvasWidth, this.canvasHeight).data,
|
|
3448
|
-
for (let
|
|
3449
|
-
const
|
|
3450
|
-
let
|
|
3451
|
-
xt && (
|
|
3450
|
+
const rt = this.maskCtx.getImageData(0, 0, this.canvasWidth, this.canvasHeight), V = this.lumaCtx.getImageData(0, 0, this.canvasWidth, this.canvasHeight).data, it = rt.data;
|
|
3451
|
+
for (let nt = 0; nt < it.length; nt += 4) {
|
|
3452
|
+
const St = V[nt], Xt = V[nt + 1], Qt = V[nt + 2];
|
|
3453
|
+
let oe = (0.299 * St + 0.587 * Xt + 0.114 * Qt) / 255;
|
|
3454
|
+
xt && (oe = 1 - oe), it[nt + 3] *= oe;
|
|
3452
3455
|
}
|
|
3453
3456
|
this.maskCtx.putImageData(rt, 0, 0);
|
|
3454
3457
|
} else {
|
|
3455
|
-
this.maskCtx.save(), this.rootTransform && this.maskCtx.setTransform(this.rootTransform), this.maskCtx.globalCompositeOperation = xt ? "destination-out" : "destination-in", Pt > 0 && (this.maskCtx.filter = `blur(${Pt}px)`), this.maskCtx.globalAlpha = kt, this.applyAbsoluteTransform(this.maskCtx,
|
|
3456
|
-
const
|
|
3457
|
-
if (((Kt =
|
|
3458
|
-
const rt =
|
|
3459
|
-
this._renderText(this.maskCtx,
|
|
3460
|
-
} else if (((te =
|
|
3461
|
-
const rt =
|
|
3458
|
+
this.maskCtx.save(), this.rootTransform && this.maskCtx.setTransform(this.rootTransform), this.maskCtx.globalCompositeOperation = xt ? "destination-out" : "destination-in", Pt > 0 && (this.maskCtx.filter = `blur(${Pt}px)`), this.maskCtx.globalAlpha = kt, this.applyAbsoluteTransform(this.maskCtx, et.id, o);
|
|
3459
|
+
const pt = (Q == null ? void 0 : Q.width) || et.geometry.width || 0, ct = (Q == null ? void 0 : Q.height) || et.geometry.height || 0, Ct = (Q == null ? void 0 : Q.corner_radius) ?? et.corner_radius ?? 0;
|
|
3460
|
+
if (((Kt = et.geometry) == null ? void 0 : Kt.type) === "Text") {
|
|
3461
|
+
const rt = Q != null && Q.geometry ? this.deepMerge(et.geometry, Q.geometry) : et.geometry, V = Q != null && Q.style ? this.deepMerge(et.style, Q.style) : et.style;
|
|
3462
|
+
this._renderText(this.maskCtx, et, { ...rt, width: pt, height: ct, corner_radius: Ct }, V, Q, pt, ct, !0, !1, D, q);
|
|
3463
|
+
} else if (((te = et.geometry) == null ? void 0 : te.type) === "Image") {
|
|
3464
|
+
const rt = et.geometry.src;
|
|
3462
3465
|
if (rt) {
|
|
3463
3466
|
let V = this.imageCache.get(rt);
|
|
3464
|
-
V || (V = new Image(), V.src = rt, this.imageCache.set(rt, V)), V.complete && V.naturalWidth > 0 ? this.maskCtx.drawImage(V, -
|
|
3467
|
+
V || (V = new Image(), V.src = rt, this.imageCache.set(rt, V)), V.complete && V.naturalWidth > 0 ? this.maskCtx.drawImage(V, -pt / 2, -ct / 2, pt, ct) : (this.applyPath(this.maskCtx, et.geometry, pt, ct, Ct), this.maskCtx.fillStyle = "#ffffff", this.maskCtx.fill());
|
|
3465
3468
|
}
|
|
3466
|
-
} else if (((Jt =
|
|
3467
|
-
const rt =
|
|
3469
|
+
} else if (((Jt = et.geometry) == null ? void 0 : Jt.type) === "SVG") {
|
|
3470
|
+
const rt = et.geometry.svgContent;
|
|
3468
3471
|
if (rt) {
|
|
3469
|
-
const V = `__alphamask_${
|
|
3470
|
-
let
|
|
3471
|
-
if (!
|
|
3472
|
-
|
|
3473
|
-
const
|
|
3474
|
-
|
|
3472
|
+
const V = `__alphamask_${et.id}`;
|
|
3473
|
+
let it = this.imageCache.get(V);
|
|
3474
|
+
if (!it) {
|
|
3475
|
+
it = new Image();
|
|
3476
|
+
const nt = new Blob([rt], { type: "image/svg+xml" });
|
|
3477
|
+
it.src = URL.createObjectURL(nt), it.onload = () => {
|
|
3475
3478
|
this.artboard && this.reset();
|
|
3476
|
-
}, this.imageCache.set(V,
|
|
3479
|
+
}, this.imageCache.set(V, it);
|
|
3477
3480
|
}
|
|
3478
|
-
|
|
3481
|
+
it.complete && it.naturalWidth > 0 ? this.maskCtx.drawImage(it, -pt / 2, -ct / 2, pt, ct) : (this.applyPath(this.maskCtx, et.geometry, pt, ct, Ct), this.maskCtx.fillStyle = "#ffffff", this.maskCtx.fill());
|
|
3479
3482
|
}
|
|
3480
3483
|
} else
|
|
3481
|
-
this.applyPath(this.maskCtx,
|
|
3484
|
+
this.applyPath(this.maskCtx, et.geometry, pt, ct, Ct), this.maskCtx.fillStyle = "#ffffff", this.maskCtx.fill();
|
|
3482
3485
|
this.maskCtx.restore();
|
|
3483
3486
|
}
|
|
3484
3487
|
}), Ot.save(), Ot.setTransform(1, 0, 0, 1, 0, 0);
|
|
@@ -3489,32 +3492,32 @@ class ci {
|
|
|
3489
3492
|
}
|
|
3490
3493
|
}
|
|
3491
3494
|
_renderText(t, i, o, e, s, n, a, r = !1, h = !1, f = 1, l = 1) {
|
|
3492
|
-
var yt, bt, gt, Et, It,
|
|
3495
|
+
var yt, bt, gt, Et, It, vt, Yt, ie, fe;
|
|
3493
3496
|
let p = o.text || "";
|
|
3494
3497
|
if (o.textInputId && !r) {
|
|
3495
|
-
const
|
|
3496
|
-
|
|
3498
|
+
const st = this.inputs.get(o.textInputId);
|
|
3499
|
+
st !== void 0 && (p = String(st), s.geometry && s.geometry.type === "Text" && (s.geometry.text = p));
|
|
3497
3500
|
}
|
|
3498
3501
|
if (o.svgPath) {
|
|
3499
|
-
const
|
|
3502
|
+
const st = o.svgPath;
|
|
3500
3503
|
t.save();
|
|
3501
|
-
const mt = ((yt = e == null ? void 0 : e.fill) == null ? void 0 : yt.color) || "#000000",
|
|
3502
|
-
t.fillStyle = mt, t.globalAlpha *=
|
|
3503
|
-
const _t = new Path2D(
|
|
3504
|
+
const mt = ((yt = e == null ? void 0 : e.fill) == null ? void 0 : yt.color) || "#000000", Lt = ((bt = e == null ? void 0 : e.fill) == null ? void 0 : bt.opacity) !== void 0 ? (gt = e == null ? void 0 : e.fill) == null ? void 0 : gt.opacity : 1;
|
|
3505
|
+
t.fillStyle = mt, t.globalAlpha *= Lt;
|
|
3506
|
+
const _t = new Path2D(st);
|
|
3504
3507
|
t.fill(_t), t.restore();
|
|
3505
3508
|
return;
|
|
3506
3509
|
}
|
|
3507
3510
|
let c = p || "";
|
|
3508
|
-
o.enableSegments === !0 && o.segments && Array.isArray(o.segments) && (c = o.segments.map((
|
|
3511
|
+
o.enableSegments === !0 && o.segments && Array.isArray(o.segments) && (c = o.segments.map((st) => st && st.text ? st.text : "").join(""));
|
|
3509
3512
|
const d = o.textCase || "none";
|
|
3510
|
-
d === "uppercase" ? c = c.toUpperCase() : d === "lowercase" ? c = c.toLowerCase() : d === "capitalize" && (c = c.replace(/\b\w/g, (
|
|
3513
|
+
d === "uppercase" ? c = c.toUpperCase() : d === "lowercase" ? c = c.toLowerCase() : d === "capitalize" && (c = c.replace(/\b\w/g, (st) => st.toUpperCase()));
|
|
3511
3514
|
let u = ((Et = o.fontWeight) == null ? void 0 : Et.toString()) || "400", v = o.fontStyle || "normal";
|
|
3512
3515
|
u.toLowerCase().includes("italic") && (v = "italic", u = u.replace(/italic/gi, "").trim() || "400");
|
|
3513
3516
|
const b = this.mapFontWeight(u), m = Math.max(1, o.fontSize || 32);
|
|
3514
3517
|
let y = o.fontFamily || "Inter";
|
|
3515
3518
|
const S = ["Bold", "SemiBold", "Medium", "Regular", "Light", "Thin", "ExtraBold", "Black", "Italic"];
|
|
3516
|
-
S.forEach((
|
|
3517
|
-
const mt = new RegExp(`[\\s-]${
|
|
3519
|
+
S.forEach((st) => {
|
|
3520
|
+
const mt = new RegExp(`[\\s-]${st}$`, "i");
|
|
3518
3521
|
mt.test(y) && (y = y.replace(mt, "").trim());
|
|
3519
3522
|
});
|
|
3520
3523
|
const M = `${o.smallCaps === !0 ? "small-caps " : ""}${v} ${b} ${m}px "${y}", sans-serif`;
|
|
@@ -3527,16 +3530,16 @@ class ci {
|
|
|
3527
3530
|
if (typeof o.letterSpacing == "number")
|
|
3528
3531
|
T = o.letterSpacing;
|
|
3529
3532
|
else if (typeof o.letterSpacing == "object" && o.letterSpacing.value !== void 0) {
|
|
3530
|
-
const
|
|
3531
|
-
T =
|
|
3533
|
+
const st = o.letterSpacing;
|
|
3534
|
+
T = st.unit === "PERCENT" ? st.value / 100 * m : st.value;
|
|
3532
3535
|
}
|
|
3533
3536
|
t.letterSpacing !== void 0 && (t.letterSpacing = `${T}px`);
|
|
3534
|
-
const
|
|
3535
|
-
|
|
3537
|
+
const R = o.kerning || "auto", P = o.kerningValue || 0;
|
|
3538
|
+
R === "manual" && P !== 0 && (t.letterSpacing = `${T + P}px`);
|
|
3536
3539
|
const _ = o.paragraphSpacing || 0;
|
|
3537
3540
|
let E = o.lineHeight ?? 1.2;
|
|
3538
3541
|
typeof E == "string" && (E = parseFloat(E)), E > 5 && m > 0 && (E = E / m);
|
|
3539
|
-
const A = (E || 1.2) * m, W = o.isPointText === !0 || !o.width || o.width <= 0, z = ((It = o.padding) == null ? void 0 : It.left) || ((
|
|
3542
|
+
const A = (E || 1.2) * m, W = o.isPointText === !0 || !o.width || o.width <= 0, z = ((It = o.padding) == null ? void 0 : It.left) || ((vt = o.padding) == null ? void 0 : vt.right) || 0, Y = W ? 1e5 : o.width && o.width > 0 ? Math.ceil(o.width) - z * 2 : 1e5;
|
|
3540
3543
|
o.autoHeight;
|
|
3541
3544
|
const G = ps({
|
|
3542
3545
|
text: c,
|
|
@@ -3558,84 +3561,84 @@ class ci {
|
|
|
3558
3561
|
}), N = G.lines || [], J = G.maxFontSize || m, x = this.fontLeadingFactors[y] ?? 0.5, F = (A - m) * x;
|
|
3559
3562
|
let j = G.height, X = n, tt = a;
|
|
3560
3563
|
if (X === 0 || tt === 0 || X >= 1e5) {
|
|
3561
|
-
let
|
|
3562
|
-
const
|
|
3564
|
+
let st = 0, mt = 0;
|
|
3565
|
+
const Lt = G.fullText || c;
|
|
3563
3566
|
(N || []).forEach((_t) => {
|
|
3564
3567
|
const dt = _t.text || "", Ft = t.measureText(dt).width + (dt.length > 0 ? (dt.length - 1) * T : 0);
|
|
3565
|
-
Ft >
|
|
3566
|
-
` ||
|
|
3568
|
+
Ft > st && (st = Ft), mt += dt.length, mt < Lt.length && (Lt[mt] === `
|
|
3569
|
+
` || Lt[mt] === "\r") && (mt++, Lt[mt - 1] === "\r" && Lt[mt] === `
|
|
3567
3570
|
` && mt++);
|
|
3568
|
-
}), (X === 0 || X >= 1e5) && (X =
|
|
3571
|
+
}), (X === 0 || X >= 1e5) && (X = st), tt === 0 && (tt = j || 0);
|
|
3569
3572
|
}
|
|
3570
|
-
let
|
|
3571
|
-
a > 0 && a > j && (I === "top" ?
|
|
3573
|
+
let L = -j / 2;
|
|
3574
|
+
a > 0 && a > j && (I === "top" ? L = -a / 2 : I === "middle" || I === "center" ? L = -j / 2 : I === "bottom" && (L = a / 2 - j)), L += F;
|
|
3572
3575
|
let O = null, D = 0;
|
|
3573
3576
|
if (o.pathId && this.artboard) {
|
|
3574
|
-
const
|
|
3575
|
-
if (
|
|
3576
|
-
const mt = this.objectStates.get(
|
|
3577
|
-
O = { geo:
|
|
3577
|
+
const st = this.artboard.objects.find((mt) => mt.id === o.pathId);
|
|
3578
|
+
if (st && st.type === "Shape" && ((Yt = st.geometry) == null ? void 0 : Yt.type) === "Path") {
|
|
3579
|
+
const mt = this.objectStates.get(st.id), Lt = mt != null && mt.geometry ? this.deepMerge(st.geometry, mt.geometry) : st.geometry, _t = (mt == null ? void 0 : mt.scale_x) !== void 0 ? (st.width || 0) * mt.scale_x : st.width || 0, dt = (mt == null ? void 0 : mt.scale_y) !== void 0 ? (st.height || 0) * mt.scale_y : st.height || 0;
|
|
3580
|
+
O = { geo: Lt, obj: st, w: _t, h: dt }, D = this.getPerimeter(Lt, _t, dt);
|
|
3578
3581
|
}
|
|
3579
3582
|
}
|
|
3580
|
-
const q = (
|
|
3583
|
+
const q = (st, mt) => {
|
|
3581
3584
|
var _t, dt;
|
|
3582
|
-
if (T === 0 && (!o.enableSegments || !((_t = o.segments) != null && _t.length))) return t.measureText(
|
|
3583
|
-
let
|
|
3584
|
-
for (let Ft = 0; Ft <
|
|
3585
|
+
if (T === 0 && (!o.enableSegments || !((_t = o.segments) != null && _t.length))) return t.measureText(st).width;
|
|
3586
|
+
let Lt = 0;
|
|
3587
|
+
for (let Ft = 0; Ft < st.length; Ft++) {
|
|
3585
3588
|
const Dt = mt + Ft;
|
|
3586
3589
|
let $t = 0;
|
|
3587
3590
|
if (o.enableSegments === !0 && ((dt = o.segments) == null ? void 0 : dt.length) > 0) {
|
|
3588
3591
|
let Ot = 0, Vt = null;
|
|
3589
|
-
for (const
|
|
3590
|
-
if (Dt < Ot + (
|
|
3591
|
-
Vt =
|
|
3592
|
+
for (const ne of o.segments) {
|
|
3593
|
+
if (Dt < Ot + (ne.text || "").length) {
|
|
3594
|
+
Vt = ne;
|
|
3592
3595
|
break;
|
|
3593
3596
|
}
|
|
3594
|
-
Ot += (
|
|
3597
|
+
Ot += (ne.text || "").length;
|
|
3595
3598
|
}
|
|
3596
3599
|
if (Vt) {
|
|
3597
3600
|
t.save();
|
|
3598
|
-
let
|
|
3601
|
+
let ne = Vt.fontFamily || o.fontFamily || "Inter";
|
|
3599
3602
|
const me = this.mapFontWeight((Vt.fontWeight || o.fontWeight || "400").toString()), ye = Vt.fontStyle || v, Ut = Vt.fontSize || m;
|
|
3600
|
-
t.font = `${ye} ${me} ${Ut}px "${
|
|
3603
|
+
t.font = `${ye} ${me} ${Ut}px "${ne}", sans-serif`, $t = t.measureText(st[Ft]).width, t.restore();
|
|
3601
3604
|
} else
|
|
3602
|
-
$t = t.measureText(
|
|
3605
|
+
$t = t.measureText(st[Ft]).width;
|
|
3603
3606
|
} else
|
|
3604
|
-
$t = t.measureText(
|
|
3605
|
-
|
|
3607
|
+
$t = t.measureText(st[Ft]).width;
|
|
3608
|
+
Lt += $t + T;
|
|
3606
3609
|
}
|
|
3607
|
-
return
|
|
3608
|
-
}, ot = (
|
|
3610
|
+
return Lt - (st.length > 0 ? T : 0);
|
|
3611
|
+
}, ot = (st, mt, Lt, _t, dt) => {
|
|
3609
3612
|
var me, ye;
|
|
3610
3613
|
const Dt = (dt === 0 || c[dt - 1] === `
|
|
3611
3614
|
` || c[dt - 1] === "\r") && o.paragraphIndent ? o.paragraphIndent : 0, $t = (!r || h) && (i.behaviors || []).some(
|
|
3612
3615
|
(Ut) => Ut.enabled && (Ut.type.toString().includes("Text") || ["Typewriter", "Scramble", "Wave", "Bounce", "GlitchText", "Reveal3D", "RevealSlide", "RevealBlur"].includes(Ut.type))
|
|
3613
|
-
), Ot = !o.pathId && !$t && (o.enableSegments !== !0 || !o.segments || o.segments.length === 0), Vt = o.baselineShift || 0,
|
|
3616
|
+
), Ot = !o.pathId && !$t && (o.enableSegments !== !0 || !o.segments || o.segments.length === 0), Vt = o.baselineShift || 0, ne = Lt + Vt;
|
|
3614
3617
|
if (Ot)
|
|
3615
|
-
t.font = M, _t ? t.strokeText(
|
|
3618
|
+
t.font = M, _t ? t.strokeText(st, mt + Dt, ne) : t.fillText(st, mt + Dt, ne);
|
|
3616
3619
|
else {
|
|
3617
|
-
const Ut = q(
|
|
3620
|
+
const Ut = q(st, dt);
|
|
3618
3621
|
let Se = mt + Dt;
|
|
3619
3622
|
k === "center" ? Se -= Ut / 2 : k === "right" && (Se -= Ut);
|
|
3620
|
-
const Pe = dt +
|
|
3621
|
-
` || c[dt +
|
|
3623
|
+
const Pe = dt + st.length >= c.length || c[dt + st.length] === `
|
|
3624
|
+
` || c[dt + st.length] === "\r";
|
|
3622
3625
|
let Ee = 0, Ce = 0;
|
|
3623
3626
|
const Ae = o.justifyMinWordSpacing, xe = o.justifyMaxWordSpacing;
|
|
3624
3627
|
if (k === "justify" && !Pe && Ut > 0 && !o.pathId) {
|
|
3625
|
-
const
|
|
3626
|
-
for (let B = 0; B <
|
|
3627
|
-
|
|
3628
|
+
const ut = W ? Ut : Y - z * 2 + 0, at = Math.max(0, ut - Ut);
|
|
3629
|
+
for (let B = 0; B < st.length; B++)
|
|
3630
|
+
st[B] === " " && Ce++;
|
|
3628
3631
|
if (Ce > 0) {
|
|
3629
3632
|
const B = t.measureText(" ").width;
|
|
3630
|
-
let
|
|
3631
|
-
Ee = Math.max(0, Math.min(at / Ce,
|
|
3633
|
+
let et = Ae || B * 0.5, Q = xe || B * 2.5;
|
|
3634
|
+
Ee = Math.max(0, Math.min(at / Ce, Q - et));
|
|
3632
3635
|
}
|
|
3633
3636
|
}
|
|
3634
3637
|
let se = o.pathOffset || 0;
|
|
3635
3638
|
o.pathId && D > 0 && O && (k === "center" ? se += D / 2 - Ut / 2 : k === "right" && (se += D - Ut));
|
|
3636
3639
|
let jt = Se;
|
|
3637
3640
|
const ht = r && !h ? [] : ((me = i.behaviors) == null ? void 0 : me.filter(
|
|
3638
|
-
(
|
|
3641
|
+
(ut) => [
|
|
3639
3642
|
U.Typewriter,
|
|
3640
3643
|
U.Scramble,
|
|
3641
3644
|
U.Wave,
|
|
@@ -3665,126 +3668,126 @@ class ci {
|
|
|
3665
3668
|
U.TextZing,
|
|
3666
3669
|
U.TextPerspective,
|
|
3667
3670
|
U.TextMirror
|
|
3668
|
-
].includes(
|
|
3671
|
+
].includes(ut.type) && ut.enabled
|
|
3669
3672
|
)) || [];
|
|
3670
|
-
for (let
|
|
3671
|
-
let at =
|
|
3672
|
-
const B = dt +
|
|
3673
|
-
let
|
|
3674
|
-
ht.forEach((
|
|
3675
|
-
const ct =
|
|
3676
|
-
if (
|
|
3673
|
+
for (let ut = 0; ut < st.length; ut++) {
|
|
3674
|
+
let at = st[ut];
|
|
3675
|
+
const B = dt + ut;
|
|
3676
|
+
let et = 0, Q = 0, Pt = 1, xt = 1, kt = 0, At = 1, Mt = at;
|
|
3677
|
+
ht.forEach((pt) => {
|
|
3678
|
+
const ct = pt.settings || {}, Ct = ct.strength || 1, rt = Date.now();
|
|
3679
|
+
if (pt.type === U.Typewriter)
|
|
3677
3680
|
this.currentTime * (ct.speed || 1) - B * (ct.stagger || 0.05) < 0 && (At = 0);
|
|
3678
|
-
else if (
|
|
3681
|
+
else if (pt.type === U.Scramble)
|
|
3679
3682
|
Math.max(0, Math.min(1, this.currentTime / (ct.duration || 1.5)) - B * 0.02) < 1 && Math.random() < 0.3 && (Mt = "$%#@!*&"[Math.floor(Math.random() * 7)]);
|
|
3680
|
-
else if (
|
|
3681
|
-
|
|
3682
|
-
else if (
|
|
3683
|
+
else if (pt.type === U.Wave)
|
|
3684
|
+
Q += Math.sin(this.currentTime * 5 * (ct.speed || 1) + B * (ct.frequency || 1)) * (ct.amplitude || 20) * Ct;
|
|
3685
|
+
else if (pt.type === U.Bounce) {
|
|
3683
3686
|
const V = Math.max(0, this.currentTime % 2 - B * (ct.stagger || 0.1));
|
|
3684
|
-
V < 1 && (
|
|
3685
|
-
} else if (
|
|
3687
|
+
V < 1 && (Q -= Math.abs(Math.sin(V * Math.PI)) * (ct.height || 50) * Ct);
|
|
3688
|
+
} else if (pt.type === U.TextTrail) {
|
|
3686
3689
|
const V = this.pointerHistory[Math.max(0, this.pointerHistory.length - 1 - B * (ct.delay || 5))];
|
|
3687
|
-
V && (
|
|
3688
|
-
} else if (
|
|
3690
|
+
V && (et += (V.x - (s.x + jt)) * Ct * 0.2, Q += (V.y - (s.y + Lt + Q)) * Ct * 0.2);
|
|
3691
|
+
} else if (pt.type === U.Reveal3D) {
|
|
3689
3692
|
const V = Math.max(0, Math.min(1, this.currentTime * (ct.speed || 1) - B * (ct.stagger || 0.1)));
|
|
3690
3693
|
Pt *= V, xt *= V, At = V;
|
|
3691
|
-
} else if (
|
|
3692
|
-
const V = Math.max(0, Math.min(1, this.currentTime * 1.5 - B * 0.05)),
|
|
3693
|
-
|
|
3694
|
-
} else if (
|
|
3694
|
+
} else if (pt.type === U.RevealSlide) {
|
|
3695
|
+
const V = Math.max(0, Math.min(1, this.currentTime * 1.5 - B * 0.05)), it = (1 - V) * (ct.distance || 40) * Ct, nt = ct.direction || "up";
|
|
3696
|
+
nt === "up" ? Q -= it : nt === "down" ? Q += it : nt === "left" ? et -= it : nt === "right" && (et += it), At = V;
|
|
3697
|
+
} else if (pt.type === U.RevealBlur) {
|
|
3695
3698
|
const V = Math.max(0, Math.min(1, this.currentTime * 1.2 - B * 0.1));
|
|
3696
|
-
At = V,
|
|
3697
|
-
} else if (
|
|
3699
|
+
At = V, et += (1 - V) * 5;
|
|
3700
|
+
} else if (pt.type === U.TextLiquid) {
|
|
3698
3701
|
const V = Math.max(0, Math.sin(rt * 1e-3 * (ct.speed || 1) + B * 0.5));
|
|
3699
|
-
|
|
3700
|
-
} else if (
|
|
3701
|
-
const V = rt * 2e-3 * (ct.speed || 1) + B * 0.2,
|
|
3702
|
-
|
|
3703
|
-
} else if (
|
|
3704
|
-
const V = ct.force || 1,
|
|
3705
|
-
if (
|
|
3706
|
-
const
|
|
3707
|
-
|
|
3702
|
+
Q += V * (ct.amplitude || 10) * Ct, xt *= 1 + V * 0.2;
|
|
3703
|
+
} else if (pt.type === U.TextVortex) {
|
|
3704
|
+
const V = rt * 2e-3 * (ct.speed || 1) + B * 0.2, it = (1 - (Math.sin(rt * 1e-3) * 0.5 + 0.5)) * (ct.radius || 50);
|
|
3705
|
+
et += Math.cos(V) * it * Ct, Q += Math.sin(V) * it * Ct;
|
|
3706
|
+
} else if (pt.type === U.TextExplosion) {
|
|
3707
|
+
const V = ct.force || 1, it = this.currentTime % 2;
|
|
3708
|
+
if (it < 1) {
|
|
3709
|
+
const nt = (B / st.length - 0.5) * Math.PI * 2, St = it * 100 * V;
|
|
3710
|
+
et += Math.cos(nt) * St * Ct, Q += Math.sin(nt) * St * Ct, At = 1 - it;
|
|
3708
3711
|
}
|
|
3709
|
-
} else if (
|
|
3710
|
-
const V = ct.speed || 1,
|
|
3711
|
-
|
|
3712
|
-
} else if (
|
|
3713
|
-
const V = ct.gravity || 9.8,
|
|
3714
|
-
|
|
3715
|
-
} else if (
|
|
3712
|
+
} else if (pt.type === U.TextRain) {
|
|
3713
|
+
const V = ct.speed || 1, it = ct.height || 100, nt = (rt * 1e-3 * V + B * 0.1) % 1;
|
|
3714
|
+
Q -= (1 - nt) * it * Ct, At = nt > 0.1 ? 1 : nt * 10;
|
|
3715
|
+
} else if (pt.type === U.TextGravity) {
|
|
3716
|
+
const V = ct.gravity || 9.8, it = this.currentTime % 3 / 3, nt = 0.5 * V * Math.pow(it * 10, 2);
|
|
3717
|
+
nt < 100 ? Q += nt * Ct : Q += 100 * Ct;
|
|
3718
|
+
} else if (pt.type === U.TextMatrix) {
|
|
3716
3719
|
const V = ct.speed || 1;
|
|
3717
3720
|
if (Math.random() < 0.1 * V) {
|
|
3718
|
-
const
|
|
3719
|
-
Mt =
|
|
3721
|
+
const nt = "0123456789ABCDEF!@#$%^&*";
|
|
3722
|
+
Mt = nt[Math.floor(Math.random() * nt.length)];
|
|
3720
3723
|
}
|
|
3721
3724
|
At = 0.3 + (Math.sin(rt * 0.01 * V + B) + 1) / 2 * 0.7;
|
|
3722
|
-
} else if (
|
|
3725
|
+
} else if (pt.type === U.TextNeon) {
|
|
3723
3726
|
const V = Math.random() > 0.95 ? 0.5 : 1;
|
|
3724
3727
|
At = (0.7 + (Math.sin(rt * 5e-3) + 1) / 2 * 0.3) * V;
|
|
3725
|
-
} else if (
|
|
3728
|
+
} else if (pt.type === U.TextDissolve)
|
|
3726
3729
|
Math.sin(B * 1.5 + rt * 2e-3 * (ct.speed || 1)) > 0.5 && (At = 0);
|
|
3727
|
-
else if (
|
|
3728
|
-
const V = ct.speed || 1,
|
|
3729
|
-
|
|
3730
|
-
} else if (
|
|
3731
|
-
const
|
|
3732
|
-
Pt *=
|
|
3733
|
-
} else if (
|
|
3730
|
+
else if (pt.type === U.TextOrganic) {
|
|
3731
|
+
const V = ct.speed || 1, it = ct.amplitude || 10;
|
|
3732
|
+
et += Math.sin(rt * 2e-3 * V + B) * it * Ct, Q += Math.cos(rt * 15e-4 * V + B * 0.7) * it * Ct;
|
|
3733
|
+
} else if (pt.type === U.TextBreathe) {
|
|
3734
|
+
const it = 1 + (Math.sin(rt * 3e-3 + B * 0.2) + 1) / 2 * 0.2 * Ct;
|
|
3735
|
+
Pt *= it, xt *= it;
|
|
3736
|
+
} else if (pt.type === U.TextSpin) {
|
|
3734
3737
|
const V = ct.speed || 1;
|
|
3735
3738
|
kt += rt * 0.01 * V + B;
|
|
3736
|
-
} else if (
|
|
3739
|
+
} else if (pt.type === U.TextMagnet) {
|
|
3737
3740
|
const V = this.pointerHistory[this.pointerHistory.length - 1];
|
|
3738
3741
|
if (V) {
|
|
3739
|
-
const
|
|
3740
|
-
kt = Math.atan2(
|
|
3742
|
+
const it = V.x - (s.x + jt), nt = V.y - (s.y + Lt);
|
|
3743
|
+
kt = Math.atan2(nt, it);
|
|
3741
3744
|
}
|
|
3742
|
-
} else if (
|
|
3743
|
-
const V =
|
|
3744
|
-
Pt *=
|
|
3745
|
-
} else if (
|
|
3745
|
+
} else if (pt.type === U.TextPerspective) {
|
|
3746
|
+
const V = st.length / 2, it = (B - V) / V, nt = 1 - Math.abs(it) * 0.3 * Ct;
|
|
3747
|
+
Pt *= nt, xt *= nt, et += it * 20 * Ct;
|
|
3748
|
+
} else if (pt.type === U.TextMirror)
|
|
3746
3749
|
At *= 0.8;
|
|
3747
|
-
else if (
|
|
3748
|
-
const V = ct.speed || 1,
|
|
3749
|
-
|
|
3750
|
-
} else if (
|
|
3751
|
-
const V = ct.speed || 1,
|
|
3752
|
-
|
|
3753
|
-
} else if (
|
|
3754
|
-
const V = ct.speed || 1,
|
|
3755
|
-
Pt *= 1 +
|
|
3756
|
-
} else if (
|
|
3757
|
-
const V = ct.speed || 2,
|
|
3758
|
-
|
|
3759
|
-
} else if (
|
|
3760
|
-
const V = ct.stiffness || 0.2,
|
|
3761
|
-
xt *= 1 +
|
|
3762
|
-
} else if (
|
|
3750
|
+
else if (pt.type === U.TextFloral) {
|
|
3751
|
+
const V = ct.speed || 1, it = ct.stagger || 0.1, nt = (rt * 1e-3 * V + B * it) % 2;
|
|
3752
|
+
nt < 1 && (Pt *= nt, xt *= nt, kt += nt * Math.PI);
|
|
3753
|
+
} else if (pt.type === U.TextSmoke) {
|
|
3754
|
+
const V = ct.speed || 1, it = ct.height || 50, nt = (rt * 5e-4 * V + B * 0.2) % 1;
|
|
3755
|
+
Q -= nt * it * Ct, et += Math.sin(rt * 2e-3 + B) * 5 * Ct, At = 1 - nt;
|
|
3756
|
+
} else if (pt.type === U.TextVariable) {
|
|
3757
|
+
const V = ct.speed || 1, it = ct.intensity || 1.5, nt = (Math.sin(rt * 4e-3 * V + B * 0.3) + 1) / 2;
|
|
3758
|
+
Pt *= 1 + nt * (it - 1) * Ct;
|
|
3759
|
+
} else if (pt.type === U.TextZing) {
|
|
3760
|
+
const V = ct.speed || 2, it = ct.distance || 100, nt = (rt * 2e-3 * V + B * 0.05) % 1;
|
|
3761
|
+
et += (1 - nt) * it * Ct, At = nt;
|
|
3762
|
+
} else if (pt.type === U.TextElastic) {
|
|
3763
|
+
const V = ct.stiffness || 0.2, it = ct.damping || 0.1, nt = Math.sin(rt * 0.01) * Math.exp(-rt * 1e-3 * it);
|
|
3764
|
+
xt *= 1 + nt * V * Ct;
|
|
3765
|
+
} else if (pt.type === U.TextGlitch3D) {
|
|
3763
3766
|
const V = ct.intensity || 5;
|
|
3764
|
-
Math.random() < 0.2 && (
|
|
3765
|
-
} else if (
|
|
3767
|
+
Math.random() < 0.2 && (et += (Math.random() - 0.5) * V, Q += (Math.random() - 0.5) * V, At = 0.8);
|
|
3768
|
+
} else if (pt.type === U.GlitchText) {
|
|
3766
3769
|
const V = ct.intensity || 5;
|
|
3767
|
-
Math.random() < 0.1 && (
|
|
3770
|
+
Math.random() < 0.1 && (et += (Math.random() - 0.5) * V, Q += (Math.random() - 0.5) * V, Math.random() < 0.05 && (At = 0.5));
|
|
3768
3771
|
}
|
|
3769
3772
|
});
|
|
3770
3773
|
let $ = null, Wt = o.textDecoration || "none", Kt = m;
|
|
3771
3774
|
if (o.enableSegments === !0 && ((ye = o.segments) == null ? void 0 : ye.length) > 0) {
|
|
3772
|
-
let
|
|
3775
|
+
let pt = 0, ct = null;
|
|
3773
3776
|
for (const Ct of o.segments) {
|
|
3774
|
-
if (B <
|
|
3777
|
+
if (B < pt + (Ct.text || "").length) {
|
|
3775
3778
|
ct = Ct;
|
|
3776
3779
|
break;
|
|
3777
3780
|
}
|
|
3778
|
-
|
|
3781
|
+
pt += (Ct.text || "").length;
|
|
3779
3782
|
}
|
|
3780
3783
|
if (ct) {
|
|
3781
3784
|
let Ct = ct.fontFamily || o.fontFamily || "Inter";
|
|
3782
|
-
S.forEach((
|
|
3783
|
-
const
|
|
3784
|
-
|
|
3785
|
+
S.forEach((it) => {
|
|
3786
|
+
const nt = new RegExp(`[\\s-]${it}$`, "i");
|
|
3787
|
+
nt.test(Ct) && (Ct = Ct.replace(nt, "").trim());
|
|
3785
3788
|
});
|
|
3786
3789
|
const rt = this.mapFontWeight((ct.fontWeight || o.fontWeight || "400").toString()), V = ct.fontStyle || v;
|
|
3787
|
-
Kt = ct.fontSize || m, t.font = `${V} ${rt} ${Kt}px "${Ct}", sans-serif`, ct.fill && ($ = ct.fill), ct.textDecoration && (Wt = ct.textDecoration), Kt < J && (
|
|
3790
|
+
Kt = ct.fontSize || m, t.font = `${V} ${rt} ${Kt}px "${Ct}", sans-serif`, ct.fill && ($ = ct.fill), ct.textDecoration && (Wt = ct.textDecoration), Kt < J && (Q += (J - Kt) * 0.85);
|
|
3788
3791
|
}
|
|
3789
3792
|
} else
|
|
3790
3793
|
t.font = M;
|
|
@@ -3792,53 +3795,53 @@ class ci {
|
|
|
3792
3795
|
t.globalAlpha *= At, t.save();
|
|
3793
3796
|
const Jt = t.measureText(Mt).width;
|
|
3794
3797
|
if (O && D > 0) {
|
|
3795
|
-
const
|
|
3796
|
-
t.translate(rt.x +
|
|
3798
|
+
const pt = jt - Se + Jt / 2, Ct = (se + pt) / D, rt = this.getPointOnPath(O.geo, O.w, O.h, Math.abs(Ct % 1)), V = rt.angle, it = Lt + Q + (o.pathOffsetY || 0), nt = o.pathSide === "right" ? -1 : 1, St = Math.cos(V + Math.PI / 2) * it * nt, Xt = Math.sin(V + Math.PI / 2) * it * nt;
|
|
3799
|
+
t.translate(rt.x + St + et, rt.y + Xt), t.rotate(V + kt + (nt === -1 ? Math.PI : 0));
|
|
3797
3800
|
} else
|
|
3798
|
-
t.translate(jt +
|
|
3801
|
+
t.translate(jt + et + Jt / 2, Lt + Q), kt !== 0 && t.rotate(kt);
|
|
3799
3802
|
if (t.scale(Pt, xt), $ && !r && !h) {
|
|
3800
|
-
const
|
|
3801
|
-
t.fillStyle =
|
|
3803
|
+
const pt = this.createCanvasFill(t, $, X, tt);
|
|
3804
|
+
t.fillStyle = pt || $.color || "#000000";
|
|
3802
3805
|
} else if (!r && !h) {
|
|
3803
|
-
const
|
|
3804
|
-
t.fillStyle =
|
|
3806
|
+
const pt = this.createCanvasFill(t, e.fill, X, tt);
|
|
3807
|
+
t.fillStyle = pt || e.fill.color || "#000000";
|
|
3805
3808
|
}
|
|
3806
3809
|
if (At > 0)
|
|
3807
3810
|
if (r || h) {
|
|
3808
|
-
const
|
|
3809
|
-
t.fillStyle =
|
|
3811
|
+
const pt = h ? "#000000" : this.createCanvasFill(t, e.fill, X, tt);
|
|
3812
|
+
t.fillStyle = pt || e.fill.color || "#ffffff", t.fillText(Mt, -Jt / 2, 0);
|
|
3810
3813
|
} else _t ? t.strokeText(Mt, -Jt / 2, 0) : t.fillText(Mt, -Jt / 2, 0);
|
|
3811
3814
|
Wt !== "none" && !r && this.drawTextDecoration(t, Wt, 0, 0, Jt, Kt), t.restore(), t.globalAlpha = te, k === "justify" && Ee > 0 && Mt === " " && !Pe ? jt += Jt + T + Ee : jt += Jt + T;
|
|
3812
3815
|
}
|
|
3813
3816
|
}
|
|
3814
3817
|
};
|
|
3815
3818
|
if (r) {
|
|
3816
|
-
let
|
|
3817
|
-
(N || []).forEach((
|
|
3818
|
-
const _t =
|
|
3819
|
-
dt !== -1 && (
|
|
3819
|
+
let st = 0, mt = L;
|
|
3820
|
+
(N || []).forEach((Lt) => {
|
|
3821
|
+
const _t = Lt.text || "", dt = c.indexOf(_t, st);
|
|
3822
|
+
dt !== -1 && (st = dt);
|
|
3820
3823
|
let Ft = -X / 2;
|
|
3821
|
-
k === "center" ? Ft = 0 : k === "right" && (Ft = X / 2), ot(_t, Ft, mt, !1,
|
|
3824
|
+
k === "center" ? Ft = 0 : k === "right" && (Ft = X / 2), ot(_t, Ft, mt, !1, st), st += _t.length, mt += A;
|
|
3822
3825
|
});
|
|
3823
3826
|
} else if (h) {
|
|
3824
|
-
let
|
|
3825
|
-
(N || []).forEach((
|
|
3826
|
-
const _t =
|
|
3827
|
+
let st = 0, mt = L;
|
|
3828
|
+
(N || []).forEach((Lt) => {
|
|
3829
|
+
const _t = Lt.text || "";
|
|
3827
3830
|
let dt = -X / 2;
|
|
3828
|
-
k === "center" ? dt = 0 : k === "right" && (dt = X / 2), ot(_t, dt, mt, !1,
|
|
3829
|
-
` || c[
|
|
3830
|
-
` &&
|
|
3831
|
+
k === "center" ? dt = 0 : k === "right" && (dt = X / 2), ot(_t, dt, mt, !1, st), st += _t.length, st < c.length && (c[st] === `
|
|
3832
|
+
` || c[st] === "\r") && (st++, c[st - 1] === "\r" && c[st] === `
|
|
3833
|
+
` && st++), mt += A;
|
|
3831
3834
|
});
|
|
3832
3835
|
} else {
|
|
3833
3836
|
if (e.fill) {
|
|
3834
|
-
const mt = t.globalAlpha,
|
|
3835
|
-
t.fillStyle =
|
|
3837
|
+
const mt = t.globalAlpha, Lt = this.createCanvasFill(t, e.fill, X, tt);
|
|
3838
|
+
t.fillStyle = Lt || e.fill.color || "#000000", t.globalAlpha = mt * this.normalizeOpacity(e.fill.opacity ?? 100);
|
|
3836
3839
|
const _t = G.fullText || (o.enableSegments ? (o.segments || []).map((Dt) => {
|
|
3837
3840
|
let $t = Dt.text || "";
|
|
3838
3841
|
const Ot = Dt.textCase || o.textCase || "none";
|
|
3839
3842
|
return Ot === "uppercase" ? $t.toUpperCase() : Ot === "lowercase" ? $t.toLowerCase() : Ot === "capitalize" ? $t.replace(/\b\w/g, (Vt) => Vt.toUpperCase()) : $t;
|
|
3840
3843
|
}).join("") : c);
|
|
3841
|
-
let dt = 0, Ft =
|
|
3844
|
+
let dt = 0, Ft = L;
|
|
3842
3845
|
(N || []).forEach((Dt) => {
|
|
3843
3846
|
const $t = Dt.text || "";
|
|
3844
3847
|
let Ot = -X / 2;
|
|
@@ -3847,28 +3850,28 @@ class ci {
|
|
|
3847
3850
|
` && dt++);
|
|
3848
3851
|
}), t.globalAlpha = mt;
|
|
3849
3852
|
}
|
|
3850
|
-
const
|
|
3851
|
-
if (
|
|
3853
|
+
const st = o.paragraphRule;
|
|
3854
|
+
if (st && (((ie = st.top) == null ? void 0 : ie.width) > 0 || ((fe = st.bottom) == null ? void 0 : fe.width) > 0)) {
|
|
3852
3855
|
let mt = 0;
|
|
3853
|
-
(N || []).forEach((
|
|
3856
|
+
(N || []).forEach((Lt, _t) => {
|
|
3854
3857
|
var Dt, $t;
|
|
3855
3858
|
const Ft = mt === 0 || mt < c.length && (c[mt] === `
|
|
3856
3859
|
` || c[mt] === "\r");
|
|
3857
3860
|
if (Ft && _t > 0 && mt++, Ft) {
|
|
3858
|
-
if (((Dt =
|
|
3859
|
-
const Ot =
|
|
3860
|
-
t.strokeStyle =
|
|
3861
|
+
if (((Dt = st.top) == null ? void 0 : Dt.width) > 0) {
|
|
3862
|
+
const Ot = L + _t * A - st.top.offset;
|
|
3863
|
+
t.strokeStyle = st.top.color || "#000000", t.lineWidth = st.top.width, t.beginPath();
|
|
3861
3864
|
const Vt = -n / 2 + A * 0.2;
|
|
3862
3865
|
t.moveTo(Vt, Ot), t.lineTo(n / 2 - A * 0.2, Ot), t.stroke();
|
|
3863
3866
|
}
|
|
3864
|
-
if ((($t =
|
|
3865
|
-
const Ot =
|
|
3866
|
-
t.strokeStyle =
|
|
3867
|
+
if ((($t = st.bottom) == null ? void 0 : $t.width) > 0) {
|
|
3868
|
+
const Ot = L + (_t + 1) * A - st.bottom.offset;
|
|
3869
|
+
t.strokeStyle = st.bottom.color || "#000000", t.lineWidth = st.bottom.width, t.beginPath();
|
|
3867
3870
|
const Vt = -n / 2 + A * 0.2;
|
|
3868
3871
|
t.moveTo(Vt, Ot), t.lineTo(n / 2 - A * 0.2, Ot), t.stroke();
|
|
3869
3872
|
}
|
|
3870
3873
|
}
|
|
3871
|
-
mt += (
|
|
3874
|
+
mt += (Lt.text || "").length;
|
|
3872
3875
|
});
|
|
3873
3876
|
}
|
|
3874
3877
|
if (e.stroke && e.stroke.width > 0) {
|
|
@@ -3881,7 +3884,7 @@ class ci {
|
|
|
3881
3884
|
} else
|
|
3882
3885
|
_t = (Math.abs(f) + Math.abs(l)) / 2 || 1;
|
|
3883
3886
|
t.lineWidth = (e.stroke.width || 1) / (_t || 1), t.globalAlpha = mt * this.normalizeOpacity(e.stroke.opacity ?? 100);
|
|
3884
|
-
let dt = 0, Ft =
|
|
3887
|
+
let dt = 0, Ft = L;
|
|
3885
3888
|
(N || []).forEach((Dt) => {
|
|
3886
3889
|
let $t = -X / 2;
|
|
3887
3890
|
k === "center" ? $t = 0 : k === "right" && ($t = X / 2), ot(Dt.text, $t, Ft, !0, dt), dt += (Dt.text || "").length, Ft += A, dt < c.length && (c[dt] === `
|
|
@@ -3924,7 +3927,7 @@ class ci {
|
|
|
3924
3927
|
}
|
|
3925
3928
|
}
|
|
3926
3929
|
} else y.length > 0 && (t.setLineDash(y), t.lineDashOffset = m);
|
|
3927
|
-
(o == null ? void 0 : o.type) === "Line" || e === 0 || s === 0 ? (this.applyPath(t, o, e, s, n), t.stroke()) : p === "inside" ? (t.lineWidth = l * 2, t.save(), this.applyPath(t, o, e, s, n), t.clip(), t.stroke(), t.restore()) : p === "outside" ? (t.lineWidth = l * 2,
|
|
3930
|
+
(o == null ? void 0 : o.type) === "Line" || e === 0 || s === 0 ? (this.applyPath(t, o, e, s, n), t.stroke()) : p === "inside" ? (t.lineWidth = l * 2, t.save(), this.applyPath(t, o, e, s, n), t.clip(), t.stroke(), t.restore()) : p === "outside" ? (t.lineWidth = l * 2, this.applyPath(t, o, e, s, n), t.stroke(), t.save(), t.globalCompositeOperation = "destination-out", this.applyPath(t, o, e, s, n), t.fill(), t.restore()) : (t.lineWidth = l, this.applyPath(t, o, e, s, n), t.stroke()), t.restore();
|
|
3928
3931
|
}
|
|
3929
3932
|
getPerimeter(t, i, o) {
|
|
3930
3933
|
switch (this.ensurePathPoints(t), t == null ? void 0 : t.type) {
|
|
@@ -4006,8 +4009,8 @@ class ci {
|
|
|
4006
4009
|
for (let d = 1; d <= f; d++) {
|
|
4007
4010
|
const u = d / f, v = 1 - u, b = u * u, m = v * v, y = m * v, S = b * u, C = y * i + 3 * m * u * e + 3 * v * b * n + S * r, w = y * o + 3 * m * u * s + 3 * v * b * a + S * h, M = C - p, I = w - c, k = Math.sqrt(M * M + I * I);
|
|
4008
4011
|
if (l + k >= t) {
|
|
4009
|
-
const T = t - l,
|
|
4010
|
-
return (d - 1 +
|
|
4012
|
+
const T = t - l, R = k === 0 ? 0 : T / k;
|
|
4013
|
+
return (d - 1 + R) / f;
|
|
4011
4014
|
}
|
|
4012
4015
|
l += k, p = C, c = w;
|
|
4013
4016
|
}
|
|
@@ -4171,8 +4174,8 @@ class ci {
|
|
|
4171
4174
|
for (let I = 0; I < S; I++) {
|
|
4172
4175
|
const k = Math.sin(I * 127.1 + m * 311.7 * l) * 43758.5, T = k - Math.floor(k);
|
|
4173
4176
|
if (T > 1 - y) {
|
|
4174
|
-
const
|
|
4175
|
-
t.save(), t.beginPath(), t.rect(-e / 2, P, e, M), t.clip(), t.globalAlpha = 0.8, t.drawImage(t.canvas, E, A, e, M, -e / 2 +
|
|
4177
|
+
const R = (T - (1 - y)) / y * C * (Math.random() > 0.5 ? 1 : -1), P = -s / 2 + I * M, _ = t.getTransform(), E = _.e - e / 2 + R, A = _.f + P;
|
|
4178
|
+
t.save(), t.beginPath(), t.rect(-e / 2, P, e, M), t.clip(), t.globalAlpha = 0.8, t.drawImage(t.canvas, E, A, e, M, -e / 2 + R, P, e, M), t.restore();
|
|
4176
4179
|
}
|
|
4177
4180
|
}
|
|
4178
4181
|
}
|
|
@@ -4344,13 +4347,13 @@ class ci {
|
|
|
4344
4347
|
}
|
|
4345
4348
|
}
|
|
4346
4349
|
renderInputBox(t, i) {
|
|
4347
|
-
var
|
|
4348
|
-
const o = this.objectStates.get(i.id), e = (o == null ? void 0 : o.options) || i.options || {}, s = ((
|
|
4350
|
+
var L, O;
|
|
4351
|
+
const o = this.objectStates.get(i.id), e = (o == null ? void 0 : o.options) || i.options || {}, s = ((L = i.geometry) == null ? void 0 : L.width) || 250, n = ((O = i.geometry) == null ? void 0 : O.height) || 45, a = this.focusedId === i.id, r = this.lastHoveredObjectId === i.id, h = e.previewState || "default", f = h !== "default" ? h : a ? "focused" : r ? "hovered" : "default", l = e.label || { visible: !0, text: "Label" }, p = e.helperText || { visible: !1, text: "Helper text" }, c = e.leftIcon || { visible: !1 }, d = e.rightIcon || { visible: !1 }, u = e.multiline === !0, v = e.corner_radius ?? 8, b = e.corners || { tl: v, tr: v, bl: v, br: v }, m = [b.tl, b.tr, b.br, b.bl];
|
|
4349
4352
|
let y = e.backgroundColor || "rgba(31, 41, 55, 1)", S = e.borderColor || "rgba(55, 65, 81, 1)", C = e.borderWidth ?? 1.5, w = e.color || "#ffffff", M = e.placeholderColor || "rgba(156, 163, 175, 1)", I = e.fontSize || 14;
|
|
4350
4353
|
const k = `${f}Style`, T = e[k];
|
|
4351
4354
|
T ? (T.backgroundColor !== void 0 && (y = 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 && (M = T.placeholderColor), T.fontSize !== void 0 && (I = T.fontSize)) : f === "focused" ? (S = e.focusBorderColor || "rgba(59, 130, 246, 1)", C = Math.max(C, 2)) : f === "hovered" || f === "hover" ? (S = e.hoverBorderColor || S, y = e.hoverBackgroundColor || y) : f === "disabled" ? (y = e.disabledBackgroundColor || "rgba(31, 41, 55, 0.6)", S = e.disabledBorderColor || "rgba(55, 65, 81, 0.4)") : f === "error" && (S = "rgba(239, 68, 68, 1)", C = Math.max(C, 2)), t.beginPath(), this.drawRoundRect(t, -s / 2, -n / 2, s, n, m);
|
|
4352
|
-
const
|
|
4353
|
-
if (
|
|
4355
|
+
const R = this.createCanvasFill(t, y, s, n);
|
|
4356
|
+
if (R && (t.fillStyle = R, t.fill()), C > 0) {
|
|
4354
4357
|
const D = this.createCanvasFill(t, S, s, n);
|
|
4355
4358
|
if (D && (t.strokeStyle = D, t.lineWidth = C, t.stroke()), f === "focused" || f === "focus") {
|
|
4356
4359
|
t.save(), t.beginPath();
|
|
@@ -4362,8 +4365,8 @@ class ci {
|
|
|
4362
4365
|
if (!D.visible || !D.svgPath) return;
|
|
4363
4366
|
const ot = D.size || 14, yt = D.offset ?? 16, bt = D.color || "#ffffff", gt = q ? -(s / 2) + yt : s / 2 - yt, Et = D.svgPath;
|
|
4364
4367
|
if (t.save(), t.translate(gt, 0), !Et.startsWith("<svg")) {
|
|
4365
|
-
const It = new Path2D(Et),
|
|
4366
|
-
t.scale(
|
|
4368
|
+
const It = new Path2D(Et), vt = ot / 24;
|
|
4369
|
+
t.scale(vt, vt), t.translate(-12, -12), t.fillStyle = bt, t.fill(It);
|
|
4367
4370
|
}
|
|
4368
4371
|
t.restore();
|
|
4369
4372
|
};
|
|
@@ -4380,9 +4383,9 @@ class ci {
|
|
|
4380
4383
|
D.forEach((bt, gt) => {
|
|
4381
4384
|
const Et = bt.split(" ");
|
|
4382
4385
|
let It = "";
|
|
4383
|
-
for (let
|
|
4384
|
-
const
|
|
4385
|
-
t.measureText(
|
|
4386
|
+
for (let vt = 0; vt < Et.length; vt++) {
|
|
4387
|
+
const Yt = It + Et[vt] + " ";
|
|
4388
|
+
t.measureText(Yt).width > X && vt > 0 ? (t.fillText(It, j, q), It = Et[vt] + " ", q += ot) : It = Yt;
|
|
4386
4389
|
}
|
|
4387
4390
|
t.fillText(It, j, q), yt = t.measureText(It).width, gt < D.length - 1 && (q += ot, yt = 0);
|
|
4388
4391
|
}), a && !A && Math.floor(performance.now() / 500) % 2 === 0 && t.fillRect(j + yt, q, 1.5, Y);
|
|
@@ -4408,11 +4411,11 @@ class ci {
|
|
|
4408
4411
|
}
|
|
4409
4412
|
}
|
|
4410
4413
|
renderSlider(t, i) {
|
|
4411
|
-
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, f = (s.max ?? 100) - r, l = f === 0 ? 0 : (a - r) / f, p = s.trackHeight || 4, c = s.trackRoundedness ?? 2, d = s.trackShape ?? "Rectangle", u = s.trackPath || "", v = s.accentColor || "#3b82f6", b = s.inactiveColor || "#374151", m = s.thumbShape || "Ellipse", y = s.thumbWidth ?? 16, S = s.thumbHeight ?? 16, C = s.thumbRoundedness ?? 0, w = s.thumbColor || "#ffffff", M = s.thumbPath || "", I = s.thumbIcon || "", k = s.showValueTooltip ?? !1, T = s.tooltipBgColor || "#333333",
|
|
4414
|
+
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, f = (s.max ?? 100) - r, l = f === 0 ? 0 : (a - r) / f, p = s.trackHeight || 4, c = s.trackRoundedness ?? 2, d = s.trackShape ?? "Rectangle", u = s.trackPath || "", v = s.accentColor || "#3b82f6", b = s.inactiveColor || "#374151", m = s.thumbShape || "Ellipse", y = s.thumbWidth ?? 16, S = s.thumbHeight ?? 16, C = s.thumbRoundedness ?? 0, w = s.thumbColor || "#ffffff", M = s.thumbPath || "", I = s.thumbIcon || "", k = s.showValueTooltip ?? !1, T = s.tooltipBgColor || "#333333", R = s.tooltipColor || "#ffffff", P = s.tooltipOffsetX ?? 0, _ = s.tooltipOffsetY ?? -25, E = (X, tt, L, O, D, q, ot) => {
|
|
4412
4415
|
if ((X === "Custom" || X === "Icon") && ot)
|
|
4413
4416
|
try {
|
|
4414
4417
|
const yt = new Path2D(ot);
|
|
4415
|
-
if (t.save(), t.translate(tt,
|
|
4418
|
+
if (t.save(), t.translate(tt, L), X === "Icon") {
|
|
4416
4419
|
const bt = Math.min(O, D) / 24;
|
|
4417
4420
|
t.scale(bt, bt), t.translate(-12, -12);
|
|
4418
4421
|
}
|
|
@@ -4422,28 +4425,28 @@ class ci {
|
|
|
4422
4425
|
console.error("Error drawing slider shape in engine:", yt);
|
|
4423
4426
|
}
|
|
4424
4427
|
if (t.beginPath(), X === "Ellipse")
|
|
4425
|
-
t.ellipse(tt,
|
|
4428
|
+
t.ellipse(tt, L, O / 2, D / 2, 0, 0, Math.PI * 2);
|
|
4426
4429
|
else if (X === "Rectangle")
|
|
4427
|
-
this.drawRoundRect(t, tt - O / 2,
|
|
4430
|
+
this.drawRoundRect(t, tt - O / 2, L - D / 2, O, D, q);
|
|
4428
4431
|
else if (X === "Triangle")
|
|
4429
|
-
t.moveTo(tt,
|
|
4432
|
+
t.moveTo(tt, L - D / 2), t.lineTo(tt + O / 2, L + D / 2), t.lineTo(tt - O / 2, L + D / 2), t.closePath();
|
|
4430
4433
|
else if (X === "Diamond")
|
|
4431
|
-
t.moveTo(tt,
|
|
4434
|
+
t.moveTo(tt, L - D / 2), t.lineTo(tt + O / 2, L), t.lineTo(tt, L + D / 2), t.lineTo(tt - O / 2, L), t.closePath();
|
|
4432
4435
|
else if (X === "Polygon") {
|
|
4433
4436
|
const yt = i.geometry.sides || 3, bt = i.geometry.radius || Math.min(O, D) / 2;
|
|
4434
4437
|
for (let gt = 0; gt < yt; gt++) {
|
|
4435
|
-
const Et = gt * 2 * Math.PI / yt - Math.PI / 2, It = tt + bt * Math.cos(Et),
|
|
4436
|
-
gt === 0 ? t.moveTo(It,
|
|
4438
|
+
const Et = gt * 2 * Math.PI / yt - Math.PI / 2, It = tt + bt * Math.cos(Et), vt = L + bt * Math.sin(Et);
|
|
4439
|
+
gt === 0 ? t.moveTo(It, vt) : t.lineTo(It, vt);
|
|
4437
4440
|
}
|
|
4438
4441
|
t.closePath();
|
|
4439
4442
|
} else if (X === "Star") {
|
|
4440
4443
|
const bt = Math.min(O, D) / 2, gt = bt / 2;
|
|
4441
4444
|
for (let Et = 0; Et < 10; Et++) {
|
|
4442
|
-
const It = Et % 2 === 0 ? bt : gt,
|
|
4443
|
-
t.lineTo(tt + It * Math.cos(
|
|
4445
|
+
const It = Et % 2 === 0 ? bt : gt, vt = Et * Math.PI / 5 - Math.PI / 2;
|
|
4446
|
+
t.lineTo(tt + It * Math.cos(vt), L + It * Math.sin(vt));
|
|
4444
4447
|
}
|
|
4445
4448
|
t.closePath();
|
|
4446
|
-
} else X === "Line" && (t.moveTo(tt - O / 2,
|
|
4449
|
+
} else X === "Line" && (t.moveTo(tt - O / 2, L), t.lineTo(tt + O / 2, L));
|
|
4447
4450
|
t.fill();
|
|
4448
4451
|
}, A = this.createCanvasFill(t, b, n, p);
|
|
4449
4452
|
A && (t.fillStyle = A, t.strokeStyle = A), d === "Line" ? (t.lineWidth = p, t.beginPath(), t.moveTo(-n / 2, 0), t.lineTo(n / 2, 0), t.stroke()) : E(d, 0, 0, n, p, c, u);
|
|
@@ -4460,19 +4463,19 @@ class ci {
|
|
|
4460
4463
|
t.save(), t.translate(z + P, _);
|
|
4461
4464
|
const X = Math.round(a).toString();
|
|
4462
4465
|
t.font = "10px Inter, sans-serif";
|
|
4463
|
-
const tt = t.measureText(X),
|
|
4464
|
-
t.beginPath(), this.drawRoundRect(t, -D / 2, -q / 2, D, q, 4), t.fillStyle = T, t.fill(), t.fillStyle =
|
|
4466
|
+
const tt = t.measureText(X), L = 6, O = 4, D = tt.width + L * 2, q = 14 + O;
|
|
4467
|
+
t.beginPath(), this.drawRoundRect(t, -D / 2, -q / 2, D, q, 4), t.fillStyle = T, t.fill(), t.fillStyle = R, t.textAlign = "center", t.textBaseline = "middle", t.fillText(X, 0, 0), t.restore();
|
|
4465
4468
|
}
|
|
4466
4469
|
const x = s.label || {}, F = s.helperText || {}, j = s.fontFamily || "Inter";
|
|
4467
4470
|
if (x.visible !== !1) {
|
|
4468
|
-
const X = x.text || "Label", tt = x.fontSize || 12,
|
|
4469
|
-
t.font = `600 ${tt}px "${j}", sans-serif`, t.fillStyle =
|
|
4471
|
+
const X = x.text || "Label", tt = x.fontSize || 12, L = x.color || "rgba(156, 163, 175, 1)", O = x.offset ?? 8;
|
|
4472
|
+
t.font = `600 ${tt}px "${j}", sans-serif`, t.fillStyle = L, t.textAlign = "left", t.textBaseline = "bottom";
|
|
4470
4473
|
const D = -(n / 2), q = -(p / 2) - O;
|
|
4471
4474
|
t.fillText(X, D, q);
|
|
4472
4475
|
}
|
|
4473
4476
|
if (F.visible === !0) {
|
|
4474
|
-
const X = F.text || "Helper text", tt = F.fontSize || 11,
|
|
4475
|
-
t.font = `400 ${tt}px "${j}", sans-serif`, t.fillStyle =
|
|
4477
|
+
const X = F.text || "Helper text", tt = F.fontSize || 11, L = F.color || "rgba(156, 163, 175, 1)", O = F.offset ?? 6;
|
|
4478
|
+
t.font = `400 ${tt}px "${j}", sans-serif`, t.fillStyle = L, t.textAlign = "left", t.textBaseline = "top";
|
|
4476
4479
|
const D = -(n / 2), q = p / 2 + O;
|
|
4477
4480
|
t.fillText(X, D, q);
|
|
4478
4481
|
}
|
|
@@ -4510,7 +4513,7 @@ class ci {
|
|
|
4510
4513
|
t.font = `${I} ${M}px ${k}`;
|
|
4511
4514
|
const T = f ? e.disabledColor || "#9ca3af" : !e.selectedOption && e.placeholder ? "#9ca3af" : u;
|
|
4512
4515
|
t.fillStyle = this.createCanvasFill(t, typeof T == "string" ? { type: "Solid", color: T } : T, s, n) || "#333333", t.textAlign = "left", t.textBaseline = "middle";
|
|
4513
|
-
const
|
|
4516
|
+
const R = y === "none" ? 0 : S + 8, P = s - m * 2 - R;
|
|
4514
4517
|
if (t.save(), t.beginPath(), t.rect(a + m, r, P, n), t.clip(), t.fillText(w, a + m, 0), t.restore(), p && !f) {
|
|
4515
4518
|
const E = r + n + 4, A = e.optionsList || [], W = e.itemHeight || 32, z = e.listPadding ?? 4, Y = A.length * W + z * 2, G = e.listCornerRadius ?? h;
|
|
4516
4519
|
t.save();
|
|
@@ -4519,13 +4522,13 @@ class ci {
|
|
|
4519
4522
|
const F = e.listBorderWidth ?? 1;
|
|
4520
4523
|
F > 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, Y) || "#e5e7eb", t.lineWidth = F, t.stroke()), t.restore();
|
|
4521
4524
|
const j = e.itemFontSize || M, X = e.itemFontFamily || k;
|
|
4522
|
-
t.font = `${I} ${j}px ${X}`, A.forEach((tt,
|
|
4523
|
-
const O = E + z +
|
|
4525
|
+
t.font = `${I} ${j}px ${X}`, A.forEach((tt, L) => {
|
|
4526
|
+
const O = E + z + L * W;
|
|
4524
4527
|
if (tt === e.selectedOption)
|
|
4525
4528
|
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 + F, O, s - F * 2, W), t.fillStyle = e.itemSelectedColor || e.accentColor || u || "#374151";
|
|
4526
4529
|
else if (t.fillStyle = e.listTextColor || u || "#333333", this.activeDropdownId === i.id && this._lastPointerPos) {
|
|
4527
4530
|
const q = this._lastPointerPos.y - (E + z), ot = Math.floor(q / W);
|
|
4528
|
-
|
|
4531
|
+
L === ot && (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 + F, O, s - F * 2, W), t.fillStyle = e.itemHoverColor || u);
|
|
4529
4532
|
}
|
|
4530
4533
|
t.fillText(tt, a + m, O + W / 2);
|
|
4531
4534
|
});
|
|
@@ -4543,14 +4546,14 @@ class ci {
|
|
|
4543
4546
|
M && (t.fillStyle = M, t.fill()), (y > 0 || r && l.borderColor) && (t.strokeStyle = m, t.lineWidth = y || (r ? 1 : 0), t.stroke());
|
|
4544
4547
|
const I = f.fontSize || 14, k = f.fontFamily || "Inter", T = f.fontWeight || 600;
|
|
4545
4548
|
t.font = `${T} ${I}px "${k}", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`, t.fillStyle = u, t.textAlign = "center", t.textBaseline = "middle";
|
|
4546
|
-
let
|
|
4549
|
+
let R = 0;
|
|
4547
4550
|
if (c.enabled && c.svgPath) {
|
|
4548
4551
|
const P = I * 1.1, _ = c.gap || 8, E = t.measureText(v), W = -(E.width + P + _) / 2, z = c.position === "left" ? W + P / 2 : W + E.width + _ + P / 2;
|
|
4549
|
-
|
|
4552
|
+
R = c.position === "left" ? W + P + _ + E.width / 2 : W + E.width / 2, t.save(), t.translate(z, 0);
|
|
4550
4553
|
const Y = new Path2D(c.svgPath), G = P / 24;
|
|
4551
4554
|
t.scale(G, G), t.translate(-12, -12), t.fillStyle = u, t.fill(Y), t.restore();
|
|
4552
4555
|
}
|
|
4553
|
-
t.fillText(v,
|
|
4556
|
+
t.fillText(v, R, 0), t.restore();
|
|
4554
4557
|
}
|
|
4555
4558
|
renderToggleButton(t, i) {
|
|
4556
4559
|
var v, b;
|
|
@@ -4560,7 +4563,7 @@ class ci {
|
|
|
4560
4563
|
t.font = `${l.fontWeight || 600} ${d}px "${u}", sans-serif`, t.fillStyle = c, t.textAlign = "center", t.textBaseline = "middle", t.fillText(l.text || "Toggle", 0, 0), t.restore();
|
|
4561
4564
|
}
|
|
4562
4565
|
renderToggle(t, i) {
|
|
4563
|
-
var G, N, J, x, F, j, X, tt,
|
|
4566
|
+
var G, N, J, x, F, j, X, tt, L, O, D, q;
|
|
4564
4567
|
const o = this.objectStates.get(i.id), e = (o == null ? void 0 : o.options) || i.options || {}, s = ((G = i.geometry) == null ? void 0 : G.width) || 52, n = ((N = i.geometry) == null ? void 0 : N.height) || 30, a = -s / 2, r = -n / 2, h = e.checked ?? !1, f = e.cornerRadius ?? e.corner_radius ?? n / 2, l = e.toggleStyle || {}, p = l.backgroundColor || e.activeColor || "#10b981", c = l.borderColor || e.borderColor || "transparent", d = l.borderWidth ?? e.borderWidth ?? 0, u = l.knobColor || e.knobColor || "#ffffff", v = h ? p : e.inactiveColor || "#374151", b = h ? c : e.borderColor || "transparent", m = h ? d : e.borderWidth ?? 0, y = h ? u : e.knobColor || "#ffffff";
|
|
4565
4568
|
e.disabled && (t.globalAlpha *= 0.5), t.beginPath(), this.drawRoundRect(t, a, r, s, n, f);
|
|
4566
4569
|
const S = this.createCanvasFill(t, v, s, n);
|
|
@@ -4569,8 +4572,8 @@ class ci {
|
|
|
4569
4572
|
const ot = this.createCanvasFill(t, b, s, n);
|
|
4570
4573
|
ot && (t.strokeStyle = ot, t.stroke());
|
|
4571
4574
|
}
|
|
4572
|
-
const C = 2, w = n - C * 2, M = w / 2, I = a + C, k = a + s - C - w, T = h ? k : I,
|
|
4573
|
-
t.beginPath(), t.arc(T + M,
|
|
4575
|
+
const C = 2, w = n - C * 2, M = w / 2, I = a + C, k = a + s - C - w, T = h ? k : I, R = r + C;
|
|
4576
|
+
t.beginPath(), t.arc(T + M, R + M, M, 0, Math.PI * 2);
|
|
4574
4577
|
const P = this.createCanvasFill(t, y, w, w);
|
|
4575
4578
|
P && (t.fillStyle = P, t.fill()), e.disabled && (t.globalAlpha *= 2);
|
|
4576
4579
|
let _ = !1, E = !1;
|
|
@@ -4579,7 +4582,7 @@ class ci {
|
|
|
4579
4582
|
const ot = e.leftLabel;
|
|
4580
4583
|
t.font = `${ot.fontWeight || 400} ${ot.fontSize || 12}px "${ot.fontFamily || "Inter"}", sans-serif`, t.fillStyle = W, t.textBaseline = "middle", t.textAlign = "right", t.fillText(A, a - (ot.gap || 8), 0), _ = !0;
|
|
4581
4584
|
}
|
|
4582
|
-
const z = (h ? (tt = l.rightLabel) == null ? void 0 : tt.text : null) || ((
|
|
4585
|
+
const z = (h ? (tt = l.rightLabel) == null ? void 0 : tt.text : null) || ((L = e.rightLabel) == null ? void 0 : L.text) || "", Y = (h ? (O = l.rightLabel) == null ? void 0 : O.color : null) || ((D = e.rightLabel) == null ? void 0 : D.color) || "#f3f4f6";
|
|
4583
4586
|
if ((q = e.rightLabel) != null && q.enabled && z) {
|
|
4584
4587
|
const ot = e.rightLabel;
|
|
4585
4588
|
t.font = `${ot.fontWeight || 400} ${ot.fontSize || 12}px "${ot.fontFamily || "Inter"}", sans-serif`, t.fillStyle = Y, t.textBaseline = "middle", t.textAlign = "left", t.fillText(z, a + s + (ot.gap || 8), 0), E = !0;
|
|
@@ -4588,8 +4591,8 @@ class ci {
|
|
|
4588
4591
|
const ot = e.label, yt = ot.fontSize || 14, bt = ot.fontWeight || 400, gt = ot.fontFamily || "Inter";
|
|
4589
4592
|
t.font = `${bt} ${yt}px "${gt}", sans-serif`, t.fillStyle = ot.color || "#f3f4f6", t.textBaseline = "middle";
|
|
4590
4593
|
const Et = ot.gap || 10;
|
|
4591
|
-
let It = 0,
|
|
4592
|
-
ot.position === "left" ? (t.textAlign = "right", It = a - Et,
|
|
4594
|
+
let It = 0, vt = 0;
|
|
4595
|
+
ot.position === "left" ? (t.textAlign = "right", It = a - Et, vt = 0) : ot.position === "right" ? (t.textAlign = "left", It = a + s + Et, vt = 0) : ot.position === "top" ? (t.textAlign = "center", It = 0, vt = r - Et, t.textBaseline = "bottom") : ot.position === "bottom" ? (t.textAlign = "center", It = 0, vt = r + n + Et, t.textBaseline = "top") : (t.textAlign = "left", It = a + s + Et, vt = 0), t.fillText(ot.text, It, vt);
|
|
4593
4596
|
}
|
|
4594
4597
|
}
|
|
4595
4598
|
renderCheckbox(t, i) {
|
|
@@ -4610,8 +4613,8 @@ class ci {
|
|
|
4610
4613
|
t.save(), t.beginPath();
|
|
4611
4614
|
const w = this.createCanvasFill(t, c, s, n);
|
|
4612
4615
|
t.strokeStyle = w || c, t.lineWidth = Math.max(2, s * 0.12), t.lineCap = "round", t.lineJoin = "round";
|
|
4613
|
-
const M = a + s * 0.25, I = r + n * 0.5, k = a + s * 0.45, T = r + n * 0.7,
|
|
4614
|
-
t.moveTo(M, I), t.lineTo(k, T), t.lineTo(
|
|
4616
|
+
const M = a + s * 0.25, I = r + n * 0.5, k = a + s * 0.45, T = r + n * 0.7, R = a + s * 0.75, P = r + n * 0.25;
|
|
4617
|
+
t.moveTo(M, I), t.lineTo(k, T), t.lineTo(R, P), t.stroke(), t.restore();
|
|
4615
4618
|
}
|
|
4616
4619
|
if (e.disabled && (t.globalAlpha *= 2), e.label && e.label.text) {
|
|
4617
4620
|
const w = e.label;
|
|
@@ -4631,16 +4634,16 @@ class ci {
|
|
|
4631
4634
|
f.forEach((I, k) => {
|
|
4632
4635
|
const T = r + k * M + y;
|
|
4633
4636
|
t.beginPath(), t.arc(a + y, T, y, 0, Math.PI * 2);
|
|
4634
|
-
const
|
|
4635
|
-
|
|
4637
|
+
const R = h === I, P = this.createCanvasFill(t, c, S, S), _ = this.createCanvasFill(t, d, S, S);
|
|
4638
|
+
R ? (t.strokeStyle = P || c, t.lineWidth = 2, t.stroke(), t.beginPath(), t.arc(a + y, T, y / 2, 0, Math.PI * 2), t.fillStyle = P || c, t.fill()) : (t.strokeStyle = _ || d, t.lineWidth = 1.5, t.stroke()), t.fillStyle = u, t.fillText(I, a + S + 8, T);
|
|
4636
4639
|
});
|
|
4637
4640
|
} else {
|
|
4638
4641
|
let M = a;
|
|
4639
4642
|
f.forEach((I) => {
|
|
4640
4643
|
const k = h === I, T = t.measureText(I).width;
|
|
4641
4644
|
t.beginPath(), t.arc(M + y, 0, y, 0, Math.PI * 2);
|
|
4642
|
-
const
|
|
4643
|
-
k ? (t.strokeStyle =
|
|
4645
|
+
const R = this.createCanvasFill(t, c, S, S), P = this.createCanvasFill(t, d, S, S);
|
|
4646
|
+
k ? (t.strokeStyle = R || c, t.lineWidth = 2, t.stroke(), t.beginPath(), t.arc(M + y, 0, y / 2, 0, Math.PI * 2), t.fillStyle = R || c, t.fill()) : (t.strokeStyle = P || d, t.lineWidth = 1.5, t.stroke()), t.fillStyle = u, t.fillText(I, M + S + 6, 0), M += S + 6 + T + p;
|
|
4644
4647
|
});
|
|
4645
4648
|
}
|
|
4646
4649
|
if (t.restore(), e.disabled && (t.globalAlpha *= 2), e.label && e.label.text) {
|
|
@@ -4652,10 +4655,10 @@ class ci {
|
|
|
4652
4655
|
}
|
|
4653
4656
|
}
|
|
4654
4657
|
renderBarChart(t, i) {
|
|
4655
|
-
var T,
|
|
4658
|
+
var T, R;
|
|
4656
4659
|
const o = this.objectStates.get(i.id), e = (o == null ? void 0 : o.options) || i.options || {}, s = {
|
|
4657
4660
|
width: ((T = i.geometry) == null ? void 0 : T.width) || 300,
|
|
4658
|
-
height: ((
|
|
4661
|
+
height: ((R = i.geometry) == null ? void 0 : R.height) || 180,
|
|
4659
4662
|
chartType: e.chartType || "grouped",
|
|
4660
4663
|
stylePreset: e.stylePreset || "default",
|
|
4661
4664
|
datasets: e.datasets || [{ id: "ds-1", label: "Revenue", data: [42, 67, 31, 55, 78, 48], color: "#6366f1" }],
|
|
@@ -4880,8 +4883,8 @@ class ci {
|
|
|
4880
4883
|
s.slices.forEach((C, w) => {
|
|
4881
4884
|
const M = C.value || 0;
|
|
4882
4885
|
if (M === 0) return;
|
|
4883
|
-
const I = M / m * c, k = -Math.PI / 2 + w * y + S / 2, T = k + y - S,
|
|
4884
|
-
if (t.beginPath(), t.moveTo(d, u), t.arc(d, u, I, k, T), t.closePath(), t.fillStyle =
|
|
4886
|
+
const I = M / m * c, k = -Math.PI / 2 + w * y + S / 2, T = k + y - S, R = s._resolveSliceColor(C, w);
|
|
4887
|
+
if (t.beginPath(), t.moveTo(d, u), t.arc(d, u, I, k, T), t.closePath(), t.fillStyle = R + "cc", t.fill(), t.strokeStyle = R, t.lineWidth = 1.5, t.stroke(), s.showLabels) {
|
|
4885
4888
|
const P = k + (T - k) / 2, _ = d + I * 0.65 * Math.cos(P), E = u + I * 0.65 * Math.sin(P), A = Math.round(M / r * 100);
|
|
4886
4889
|
t.save(), t.font = `bold ${s.labelFontSize}px Inter, sans-serif`, t.fillStyle = h.labelColor, t.textAlign = "center", t.textBaseline = "middle", t.fillText(`${A}%`, _, E), t.restore();
|
|
4887
4890
|
}
|
|
@@ -4895,14 +4898,14 @@ class ci {
|
|
|
4895
4898
|
C += I / r * Math.PI * 2;
|
|
4896
4899
|
return;
|
|
4897
4900
|
}
|
|
4898
|
-
const k = I / r * Math.PI * 2, T = C + S / 2,
|
|
4899
|
-
if (
|
|
4901
|
+
const k = I / r * Math.PI * 2, T = C + S / 2, R = C + k - S / 2;
|
|
4902
|
+
if (R <= T) {
|
|
4900
4903
|
C += k;
|
|
4901
4904
|
return;
|
|
4902
4905
|
}
|
|
4903
4906
|
const P = s._resolveSliceColor(w, M);
|
|
4904
|
-
if (t.beginPath(), t.fillStyle = P, y <= 0 ? (t.moveTo(d, u), t.arc(d, u, c, T,
|
|
4905
|
-
const _ = T + (
|
|
4907
|
+
if (t.beginPath(), t.fillStyle = P, y <= 0 ? (t.moveTo(d, u), t.arc(d, u, c, T, R), t.lineTo(d, u)) : (t.moveTo(d + c * Math.cos(T), u + c * Math.sin(T)), t.arc(d, u, c, T, R), t.arc(d, u, y, R, T, !0), t.closePath()), t.fill(), s.showLabels) {
|
|
4908
|
+
const _ = T + (R - T) / 2, E = y + (c - y) / 2, A = d + E * Math.cos(_), W = u + E * Math.sin(_), z = Math.round(I / r * 100);
|
|
4906
4909
|
t.save(), t.font = `bold ${s.labelFontSize}px Inter, sans-serif`, t.fillStyle = h.labelColor, t.textAlign = "center", t.textBaseline = "middle", t.fillText(`${z}%`, A, W), t.restore();
|
|
4907
4910
|
}
|
|
4908
4911
|
C += k;
|
|
@@ -4915,13 +4918,13 @@ class ci {
|
|
|
4915
4918
|
t.font = `${s.legendFontSize}px Inter, sans-serif`;
|
|
4916
4919
|
const m = 2, y = n / m, S = s.legendFontSize + 8, C = a / 2 - l + 10, w = -n / 2 + 10;
|
|
4917
4920
|
s.slices.forEach((M, I) => {
|
|
4918
|
-
const k = I % m, T = Math.floor(I / m),
|
|
4919
|
-
t.beginPath(), t.roundRect(
|
|
4921
|
+
const k = I % m, T = Math.floor(I / m), R = w + k * y, P = C + T * S, _ = s._resolveSliceColor(M, I), E = 7;
|
|
4922
|
+
t.beginPath(), t.roundRect(R, P - E / 2, E, E, 2), t.fillStyle = _, t.fill(), t.textAlign = "left", t.textBaseline = "middle", t.fillStyle = h.legendColor;
|
|
4920
4923
|
const A = Math.round((M.value || 0) / r * 100), W = `${M.label || "Item"} ${A}%`, z = y - E - 20;
|
|
4921
4924
|
let Y = W;
|
|
4922
4925
|
for (; t.measureText(Y).width > z && Y.length > 4; )
|
|
4923
4926
|
Y = Y.slice(0, -4) + "…";
|
|
4924
|
-
t.fillText(Y,
|
|
4927
|
+
t.fillText(Y, R + E + 4, P);
|
|
4925
4928
|
});
|
|
4926
4929
|
}
|
|
4927
4930
|
t.restore();
|
|
@@ -4944,17 +4947,17 @@ class ci {
|
|
|
4944
4947
|
const a = s.width !== void 0 ? s.width : ((I = t.geometry) == null ? void 0 : I.width) || 180, r = s.height !== void 0 ? s.height : ((k = t.geometry) == null ? void 0 : k.height) || 100, h = e.orientation || "vertical", f = e.itemGap !== void 0 ? e.itemGap : 16, l = e.fontSize || 14, p = this.getWorldTransform(t.id), c = i - p.x, d = o - p.y, u = -p.rotation * (Math.PI / 180), v = Math.cos(u), b = Math.sin(u), m = c * v - d * b, y = c * b + d * v, C = 8 * 2, w = -a / 2, M = -r / 2;
|
|
4945
4948
|
if (h === "vertical") {
|
|
4946
4949
|
const T = Math.max(C, l) + f;
|
|
4947
|
-
for (let
|
|
4948
|
-
const P = M +
|
|
4950
|
+
for (let R = 0; R < n.length; R++) {
|
|
4951
|
+
const P = M + R * T;
|
|
4949
4952
|
if (m >= w && m <= w + a && y >= P && y <= P + T)
|
|
4950
|
-
return
|
|
4953
|
+
return R;
|
|
4951
4954
|
}
|
|
4952
4955
|
} else {
|
|
4953
4956
|
let T = w;
|
|
4954
|
-
for (let
|
|
4955
|
-
const _ = n[
|
|
4957
|
+
for (let R = 0; R < n.length; R++) {
|
|
4958
|
+
const _ = n[R].length * 8, E = C + 6 + _ + f;
|
|
4956
4959
|
if (m >= T && m <= T + E && y >= M && y <= M + r)
|
|
4957
|
-
return
|
|
4960
|
+
return R;
|
|
4958
4961
|
T += E;
|
|
4959
4962
|
}
|
|
4960
4963
|
}
|
|
@@ -5190,9 +5193,9 @@ class ci {
|
|
|
5190
5193
|
}
|
|
5191
5194
|
}
|
|
5192
5195
|
t.shadowBlur = 0, t.save(), t.beginPath();
|
|
5193
|
-
const
|
|
5196
|
+
const R = this.drawCustomShape(t, e.containerShape || "rectangle", e.containerPath || "", a, r, s, n, h);
|
|
5194
5197
|
if (e.listLayout !== "circular")
|
|
5195
|
-
if (
|
|
5198
|
+
if (R && e.containerShape === "custom")
|
|
5196
5199
|
try {
|
|
5197
5200
|
const G = new Path2D(e.containerPath);
|
|
5198
5201
|
t.translate(a, r), t.scale(s / 100, n / 100), t.clip(G), t.scale(100 / s, 100 / n), t.translate(-a, -r);
|
|
@@ -5206,28 +5209,28 @@ class ci {
|
|
|
5206
5209
|
const J = e.listLayout || "linear", x = J === "circular" ? d : f === "vertical" ? s : d, F = J === "circular" || f === "vertical" ? c : n;
|
|
5207
5210
|
let j = 0, X = 0, tt = 0;
|
|
5208
5211
|
if (J === "circular") {
|
|
5209
|
-
const
|
|
5210
|
-
j =
|
|
5212
|
+
const vt = l.length || 1, Yt = Math.PI * 2 / vt, ie = e.circularStartAngle || 0, fe = e.circularRadius || 100, st = u * 0.01 + ie * Math.PI / 180, mt = N * Yt + st, Lt = a + s / 2, _t = r + n / 2;
|
|
5213
|
+
j = Lt + Math.cos(mt) * fe - x / 2, X = _t + Math.sin(mt) * fe - F / 2, tt = mt + (e.itemRotation || 0) * Math.PI / 180;
|
|
5211
5214
|
} else
|
|
5212
5215
|
j = f === "vertical" ? a : _, X = f === "vertical" ? _ : r, tt = (e.itemRotation || 0) * Math.PI / 180;
|
|
5213
|
-
const
|
|
5216
|
+
const L = C === N, O = w === N, D = O && e.activeItemShape ? e.activeItemShape : e.itemShape || "rectangle", q = O && e.activeItemShape ? e.activeItemPath : e.itemPath || "", ot = e.itemCornerRadius || 0;
|
|
5214
5217
|
if (t.save(), tt !== 0 && (t.translate(j + x / 2, X + F / 2), t.rotate(tt), t.translate(-(j + x / 2), -(X + F / 2))), O) {
|
|
5215
|
-
const
|
|
5216
|
-
t.fillStyle =
|
|
5217
|
-
const
|
|
5218
|
-
t.globalAlpha =
|
|
5219
|
-
} else if (
|
|
5218
|
+
const vt = this.createCanvasFill(t, m, x, F);
|
|
5219
|
+
t.fillStyle = vt || m;
|
|
5220
|
+
const Yt = t.globalAlpha;
|
|
5221
|
+
t.globalAlpha = Yt * 0.8, t.beginPath(), this.drawCustomShape(t, D, q, j, X, x, F, ot) || (t.rect(j, X, x, F), t.fill()), t.globalAlpha = Yt;
|
|
5222
|
+
} else if (L)
|
|
5220
5223
|
t.fillStyle = b ? "rgba(255, 255, 255, 0.1)" : "rgba(0, 0, 0, 0.05)", t.beginPath(), this.drawCustomShape(t, D, q, j, X, x, F, ot) || (t.rect(j, X, x, F), t.fill());
|
|
5221
5224
|
else if (S !== "transparent") {
|
|
5222
|
-
const
|
|
5223
|
-
t.fillStyle =
|
|
5225
|
+
const vt = this.createCanvasFill(t, S, x, F);
|
|
5226
|
+
t.fillStyle = vt || S, t.beginPath(), this.drawCustomShape(t, D, q, j, X, x, F, ot) || (t.rect(j, X, x, F), t.fill());
|
|
5224
5227
|
}
|
|
5225
|
-
if (O ||
|
|
5226
|
-
const
|
|
5227
|
-
t.fillStyle =
|
|
5228
|
+
if (O || L) {
|
|
5229
|
+
const vt = this.createCanvasFill(t, m, f === "vertical" ? 3 : x, f === "vertical" ? F : 3);
|
|
5230
|
+
t.fillStyle = vt || m, f === "vertical" ? t.fillRect(j, X, 3, F) : t.fillRect(j, X + F - 3, x, 3);
|
|
5228
5231
|
}
|
|
5229
5232
|
const yt = O ? "#ffffff" : b ? "rgba(255, 255, 255, 0.9)" : y;
|
|
5230
|
-
t.fillStyle = yt, t.font = O ||
|
|
5233
|
+
t.fillStyle = yt, t.font = O || L ? "600 14px Inter, sans-serif" : "400 14px Inter, sans-serif";
|
|
5231
5234
|
const bt = typeof G == "string" ? G : (G == null ? void 0 : G.label) || `Item ${N + 1}`, gt = j + (f === "vertical" ? 16 : x / 2), Et = X + F / 2;
|
|
5232
5235
|
f === "horizontal" || J === "circular" ? t.textAlign = "center" : t.textAlign = "left";
|
|
5233
5236
|
const It = J === "circular" ? j + x / 2 : gt;
|
|
@@ -5237,18 +5240,18 @@ class ci {
|
|
|
5237
5240
|
if (G > N || J === "circular" && l.length > 0) {
|
|
5238
5241
|
const F = e.scrollbarColor || "rgba(255,255,255,0.3)", j = e.scrollbarWidth || 4;
|
|
5239
5242
|
if (x) {
|
|
5240
|
-
const X = Math.min(s, n) / 2 - j / 2 - 2, tt = a + s / 2,
|
|
5243
|
+
const X = Math.min(s, n) / 2 - j / 2 - 2, tt = a + s / 2, L = r + n / 2;
|
|
5241
5244
|
if (t.strokeStyle = F, t.lineWidth = j, t.lineCap = "round", t.beginPath(), J === "circular") {
|
|
5242
5245
|
const O = Math.PI / 4, D = -(u * 0.01) - Math.PI / 2;
|
|
5243
|
-
t.arc(tt,
|
|
5246
|
+
t.arc(tt, L, X, D, D + O);
|
|
5244
5247
|
} else {
|
|
5245
5248
|
const O = Math.PI / 2, D = N / G, q = O * D, ot = -u / G * O, bt = -Math.PI / 4 + ot;
|
|
5246
|
-
t.arc(tt,
|
|
5249
|
+
t.arc(tt, L, X, bt, bt + q);
|
|
5247
5250
|
}
|
|
5248
5251
|
t.stroke();
|
|
5249
5252
|
} else {
|
|
5250
|
-
const X = N / G, tt = N * X,
|
|
5251
|
-
t.fillStyle = F, f === "vertical" ? t.fillRect(a + s - j - 2, r +
|
|
5253
|
+
const X = N / G, tt = N * X, L = -u / G * N;
|
|
5254
|
+
t.fillStyle = F, f === "vertical" ? t.fillRect(a + s - j - 2, r + L, j, tt) : t.fillRect(a + L, r + n - j - 2, tt, j);
|
|
5252
5255
|
}
|
|
5253
5256
|
}
|
|
5254
5257
|
}
|
|
@@ -5291,17 +5294,17 @@ class ci {
|
|
|
5291
5294
|
if (n.length === 0) return null;
|
|
5292
5295
|
const a = s.width !== void 0 ? s.width : ((z = t.geometry) == null ? void 0 : z.width) || 200, r = s.height !== void 0 ? s.height : ((Y = t.geometry) == null ? void 0 : Y.height) || 300, h = e.orientation || "vertical", f = e.itemGap ?? 10, l = e.itemHeight ?? 50, p = e.itemWidth ?? 200, c = e.scrollOffset ?? 0, d = e.padding ?? 0, u = this.getWorldTransform(t.id), v = i - u.x, b = o - u.y, m = -u.rotation * (Math.PI / 180), y = Math.cos(m), S = Math.sin(m), C = v * y - b * S, w = v * S + b * y, M = -a / 2, I = -r / 2, k = typeof d == "number" ? d : h === "vertical" ? d[0] : d[3];
|
|
5293
5296
|
let T = (h === "vertical" ? I : M) + c + k;
|
|
5294
|
-
const
|
|
5297
|
+
const R = e.listLayout || "linear", P = n.length || 1, _ = Math.PI * 2 / P, E = e.circularStartAngle || 0, A = e.circularRadius || 100, W = c * 0.01 + E * Math.PI / 180;
|
|
5295
5298
|
for (let G = 0; G < n.length; G++) {
|
|
5296
|
-
const N =
|
|
5299
|
+
const N = R === "circular" ? p : h === "vertical" ? a : p, J = R === "circular" || h === "vertical" ? l : r;
|
|
5297
5300
|
let x = 0, F = 0, j = 0;
|
|
5298
|
-
if (
|
|
5299
|
-
const X = G * _ + W, tt = M + a / 2,
|
|
5300
|
-
x = tt + Math.cos(X) * A - N / 2, F =
|
|
5301
|
+
if (R === "circular") {
|
|
5302
|
+
const X = G * _ + W, tt = M + a / 2, L = I + r / 2;
|
|
5303
|
+
x = tt + Math.cos(X) * A - N / 2, F = L + Math.sin(X) * A - J / 2, j = X + (e.itemRotation || 0) * Math.PI / 180;
|
|
5301
5304
|
} else
|
|
5302
5305
|
x = h === "vertical" ? M : T, F = h === "vertical" ? T : I, j = (e.itemRotation || 0) * Math.PI / 180;
|
|
5303
5306
|
if (j !== 0) {
|
|
5304
|
-
const X = x + N / 2, tt = F + J / 2,
|
|
5307
|
+
const X = x + N / 2, tt = F + J / 2, L = C - X, O = w - tt, D = -j, q = L * Math.cos(D) - O * Math.sin(D) + X, ot = L * Math.sin(D) + O * Math.cos(D) + tt;
|
|
5305
5308
|
if (q >= x && q <= x + N && ot >= F && ot <= F + J)
|
|
5306
5309
|
return G;
|
|
5307
5310
|
} else if (C >= x && C <= x + N && w >= F && w <= F + J)
|
|
@@ -5324,120 +5327,120 @@ class ci {
|
|
|
5324
5327
|
if (!e.behaviors || e.behaviors.length === 0) return;
|
|
5325
5328
|
const s = this.objectStates.get(e.id);
|
|
5326
5329
|
s && e.behaviors.forEach((n) => {
|
|
5327
|
-
var p, c, d, u, v, b, m, y, S, C, w, M, I, k, T,
|
|
5330
|
+
var p, c, d, u, v, b, m, y, S, C, w, M, I, k, T, R, P, _, E, A, W, z, Y, G, N, J, x, F, j, X, tt, L, O, D, q, ot, yt, bt, gt, Et, It, vt, Yt, ie, fe, st, mt, Lt, _t, dt, Ft, Dt, $t, Ot, Vt, ne, me, ye, Ut, Se, Pe, Ee, Ce, Ae, xe, se, jt, ht, ut, at, B, et, Q, Pt, xt, kt, At, Mt, $, Wt, Kt, te, Jt, pt, ct, Ct, rt, V, it, nt, St, Xt, Qt, oe, Gt, Ht, Nt, Ie, Re, Le, Oe, Fe, $e, Ye, zt, ae, we, Be, We, de, ce, he, ke, Xe, Ve, Ne, De, He;
|
|
5328
5331
|
if (!n.enabled) return;
|
|
5329
5332
|
const a = n.startTime || 0, r = n.endTime || 1 / 0;
|
|
5330
5333
|
if (this.currentTime < a || this.currentTime > r) return;
|
|
5331
5334
|
const h = s.x - i, f = s.y - o, l = Math.sqrt(h * h + f * f);
|
|
5332
5335
|
if (this.frameCount % 240 === 0 && Math.random() < 0.1 && this.log(`[ExodeUI] Executing ${n.type} on ${e.name}`), n.type === U.Proximity) {
|
|
5333
|
-
const H = ((p = n.settings) == null ? void 0 : p.radius) || 300,
|
|
5336
|
+
const H = ((p = n.settings) == null ? void 0 : p.radius) || 300, Z = ((c = n.settings) == null ? void 0 : c.falloff) || "smooth";
|
|
5334
5337
|
let K = 0;
|
|
5335
|
-
l < H && (
|
|
5338
|
+
l < H && (Z === "linear" ? K = 1 - l / H : K = Math.pow(1 - l / H, 2)), n.sensors.forEach((ft) => {
|
|
5336
5339
|
this.applyBehaviorSensor(s, ft, K, t, n.settings, e, h, f, l);
|
|
5337
5340
|
});
|
|
5338
5341
|
} else if (n.type === U.Magnetic) {
|
|
5339
|
-
const H = ((d = n.settings) == null ? void 0 : d.radius) || 400,
|
|
5342
|
+
const H = ((d = n.settings) == null ? void 0 : d.radius) || 400, Z = ((u = n.settings) == null ? void 0 : u.strength) || 0.5;
|
|
5340
5343
|
if (l < H && l > 5) {
|
|
5341
|
-
const K = 1 - l / H, ft = h * K *
|
|
5344
|
+
const K = 1 - l / H, ft = h * K * Z, Tt = f * K * Z;
|
|
5342
5345
|
s.x -= ft * t * 10, s.y -= Tt * t * 10;
|
|
5343
5346
|
}
|
|
5344
5347
|
} else if (n.type === U.Repel) {
|
|
5345
|
-
const H = ((v = n.settings) == null ? void 0 : v.radius) || 300,
|
|
5348
|
+
const H = ((v = n.settings) == null ? void 0 : v.radius) || 300, Z = ((b = n.settings) == null ? void 0 : b.strength) || 1;
|
|
5346
5349
|
if (l < H) {
|
|
5347
5350
|
const K = Math.pow(1 - l / H, 2);
|
|
5348
|
-
s.x += h / (l || 1) * K * 60 *
|
|
5351
|
+
s.x += h / (l || 1) * K * 60 * Z * t * 5, s.y += f / (l || 1) * K * 60 * Z * t * 5;
|
|
5349
5352
|
}
|
|
5350
5353
|
} else if (n.type === U.Orbit) {
|
|
5351
|
-
const H = ((m = n.settings) == null ? void 0 : m.speed) || 1,
|
|
5352
|
-
s.x += Math.cos(K) *
|
|
5354
|
+
const H = ((m = n.settings) == null ? void 0 : m.speed) || 1, Z = ((y = n.settings) == null ? void 0 : y.radius) || 30, K = this.currentTime * H * Math.PI * 2;
|
|
5355
|
+
s.x += Math.cos(K) * Z * t * 5, s.y += Math.sin(K) * Z * t * 5, s.rotation += 2 * t * 5;
|
|
5353
5356
|
} else if (n.type === U.Vortex) {
|
|
5354
|
-
const H = ((S = n.settings) == null ? void 0 : S.radius) || 400,
|
|
5357
|
+
const H = ((S = n.settings) == null ? void 0 : S.radius) || 400, Z = ((C = n.settings) == null ? void 0 : C.speed) || 2, K = ((w = n.settings) == null ? void 0 : w.strength) || 1;
|
|
5355
5358
|
if (l < H) {
|
|
5356
|
-
const ft = Math.pow(1 - l / H, 1.5), Tt = this.currentTime *
|
|
5357
|
-
s.x +=
|
|
5359
|
+
const ft = Math.pow(1 - l / H, 1.5), Tt = this.currentTime * Z * Math.PI * 2, Rt = Math.cos(Tt) * 30 - h * 0.4, Bt = Math.sin(Tt) * 30 - f * 0.4;
|
|
5360
|
+
s.x += Rt * ft * K * t * 5, s.y += Bt * ft * K * t * 5, s.rotation += 5 * ft * K * t * 5, s.scale_x *= 1 - ft * 0.1 * K * t, s.scale_y *= 1 - ft * 0.1 * K * t;
|
|
5358
5361
|
}
|
|
5359
5362
|
} else if (n.type === U.Fluid) {
|
|
5360
|
-
const H = ((M = n.settings) == null ? void 0 : M.radius) || 300,
|
|
5363
|
+
const H = ((M = n.settings) == null ? void 0 : M.radius) || 300, Z = ((I = n.settings) == null ? void 0 : I.strength) || 1;
|
|
5361
5364
|
if (l < H) {
|
|
5362
|
-
const K = Math.pow(1 - l / H, 1.2), ft = h / (l || 1) * K * 1.2 *
|
|
5363
|
-
s.x += ft * 10 * t * 5, s.y += Tt * 10 * t * 5, s.scale_x *= 1 + K * 0.3 *
|
|
5365
|
+
const K = Math.pow(1 - l / H, 1.2), ft = h / (l || 1) * K * 1.2 * Z, Tt = f / (l || 1) * K * 1.2 * Z;
|
|
5366
|
+
s.x += ft * 10 * t * 5, s.y += Tt * 10 * t * 5, s.scale_x *= 1 + K * 0.3 * Z * t, s.scale_y *= 1 + K * 0.3 * Z * t;
|
|
5364
5367
|
}
|
|
5365
5368
|
} else if (n.type === U.Elastic) {
|
|
5366
|
-
const H = ((k = n.settings) == null ? void 0 : k.radius) || 300,
|
|
5369
|
+
const H = ((k = n.settings) == null ? void 0 : k.radius) || 300, Z = ((T = n.settings) == null ? void 0 : T.strength) || 1;
|
|
5367
5370
|
if (l < H) {
|
|
5368
5371
|
const K = 1 - l / H;
|
|
5369
|
-
s.scale_x *= 1 + K * 0.4 *
|
|
5372
|
+
s.scale_x *= 1 + K * 0.4 * Z * t, s.scale_y *= 1 + K * 0.4 * Z * t;
|
|
5370
5373
|
}
|
|
5371
5374
|
} else if (n.type === U.Holographic) {
|
|
5372
|
-
const H = s.x - this.canvasWidth / 2,
|
|
5373
|
-
if (s.x -= H / 1e3 * K * t * 5, s.y -=
|
|
5375
|
+
const H = s.x - this.canvasWidth / 2, Z = s.y - this.canvasHeight / 2, K = ((R = n.settings) == null ? void 0 : R.factor) || 25;
|
|
5376
|
+
if (s.x -= H / 1e3 * K * t * 5, s.y -= Z / 1e3 * K * t * 5, s.style) {
|
|
5374
5377
|
const ft = 1 - Math.min(1, l / 400);
|
|
5375
5378
|
s.style.exposure = (s.style.exposure || 1) + ft * 0.5 * t;
|
|
5376
5379
|
}
|
|
5377
5380
|
} else if (n.type === U.Sticky) {
|
|
5378
|
-
const H = ((P = n.settings) == null ? void 0 : P.radius) || 80,
|
|
5381
|
+
const H = ((P = n.settings) == null ? void 0 : P.radius) || 80, Z = ((_ = n.settings) == null ? void 0 : _.strength) || 1;
|
|
5379
5382
|
if (l < H) {
|
|
5380
5383
|
const K = Math.pow(1 - l / H, 2);
|
|
5381
|
-
s.x -= h * K *
|
|
5384
|
+
s.x -= h * K * Z * t * 10, s.y -= f * K * Z * t * 10, s.scale_x *= 1 - K * 0.1 * Z * t, s.scale_y *= 1 - K * 0.1 * Z * t;
|
|
5382
5385
|
}
|
|
5383
5386
|
} else if (n.type === U.Dilation) {
|
|
5384
|
-
const H = ((E = n.settings) == null ? void 0 : E.size) || 120,
|
|
5387
|
+
const H = ((E = n.settings) == null ? void 0 : E.size) || 120, Z = ((A = n.settings) == null ? void 0 : A.strength) || 1;
|
|
5385
5388
|
if (l < H) {
|
|
5386
5389
|
const K = 1 - l / H;
|
|
5387
|
-
s.scale_x *= 1 + K * 0.5 *
|
|
5390
|
+
s.scale_x *= 1 + K * 0.5 * Z * t, s.scale_y *= 1 + K * 0.5 * Z * t;
|
|
5388
5391
|
}
|
|
5389
5392
|
} else if (n.type === U.Parallax) {
|
|
5390
|
-
const H = ((W = n.settings) == null ? void 0 : W.factor) || 15,
|
|
5391
|
-
s.x = this.lerp(s.x ?? ((x = e.transform) == null ? void 0 : x.x) ?? 0, ee, be), s.y = this.lerp(s.y ?? ((F = e.transform) == null ? void 0 : F.y) ?? 0, ue, be), s.rotate_x = this.lerp(s.rotate_x ?? ((j = e.transform) == null ? void 0 : j.rotate_x) ?? 0, Te, be), s.rotate_y = this.lerp(s.rotate_y ?? ((X = e.transform) == null ? void 0 : X.rotate_y) ?? 0,
|
|
5393
|
+
const H = ((W = n.settings) == null ? void 0 : W.factor) || 15, Z = ((z = n.settings) == null ? void 0 : z.strength) || 1, K = this.canvasWidth / 2, ft = this.canvasHeight / 2, Tt = this._lastPointerPos || { x: K, y: ft }, Rt = (Tt.x - K) / K, Bt = (Tt.y - ft) / ft, ee = (((Y = e.transform) == null ? void 0 : Y.x) ?? 0) + Rt * H * Z, ue = (((G = e.transform) == null ? void 0 : G.y) ?? 0) + Bt * H * Z, Te = (((N = e.transform) == null ? void 0 : N.rotate_x) ?? 0) - Bt * H * 1.5 * Z, re = (((J = e.transform) == null ? void 0 : J.rotate_y) ?? 0) + Rt * H * 1.5 * Z, be = Math.min(1, 10 * t);
|
|
5394
|
+
s.x = this.lerp(s.x ?? ((x = e.transform) == null ? void 0 : x.x) ?? 0, ee, be), s.y = this.lerp(s.y ?? ((F = e.transform) == null ? void 0 : F.y) ?? 0, ue, be), s.rotate_x = this.lerp(s.rotate_x ?? ((j = e.transform) == null ? void 0 : j.rotate_x) ?? 0, Te, be), s.rotate_y = this.lerp(s.rotate_y ?? ((X = e.transform) == null ? void 0 : X.rotate_y) ?? 0, re, be);
|
|
5392
5395
|
} else if (n.type === U.Fold) {
|
|
5393
5396
|
if (l < 300) {
|
|
5394
|
-
const H = 1 - l / 300,
|
|
5395
|
-
s.skew_x = this.lerp(s.skew_x ?? ((tt = e.transform) == null ? void 0 : tt.skew_x) ?? 0,
|
|
5397
|
+
const H = 1 - l / 300, Z = (h > 0 ? -1 : 1) * H * 10, K = 1 - H * 0.1, ft = f / 300 * H * 20, Tt = -(h / 300) * H * 20, Rt = Math.min(1, 10 * t);
|
|
5398
|
+
s.skew_x = this.lerp(s.skew_x ?? ((tt = e.transform) == null ? void 0 : tt.skew_x) ?? 0, Z, Rt), s.scale_y = this.lerp(s.scale_y ?? ((L = e.transform) == null ? void 0 : L.scale_y) ?? 1, (((O = e.transform) == null ? void 0 : O.scale_y) ?? 1) * K, Rt), s.rotate_x = this.lerp(s.rotate_x ?? ((D = e.transform) == null ? void 0 : D.rotate_x) ?? 0, ft, Rt), s.rotate_y = this.lerp(s.rotate_y ?? ((q = e.transform) == null ? void 0 : q.rotate_y) ?? 0, Tt, Rt), s.style = s.style || { ...e.style }, s.style.artEffect = { enabled: !0, type: "fold_overlay", intensity: ((ot = n.settings) == null ? void 0 : ot.opacity) ?? 0.5 };
|
|
5396
5399
|
}
|
|
5397
5400
|
} else if (n.type === U.Crumple) {
|
|
5398
5401
|
if (l < 300) {
|
|
5399
|
-
const H = 1 - l / 300,
|
|
5400
|
-
s.skew_x = this.lerp(s.skew_x ?? ((yt = e.transform) == null ? void 0 : yt.skew_x) ?? 0,
|
|
5402
|
+
const H = 1 - l / 300, Z = H * (Math.random() - 0.5) * 5, K = H * (Math.random() - 0.5) * 0.05, ft = Math.min(1, 15 * t);
|
|
5403
|
+
s.skew_x = this.lerp(s.skew_x ?? ((yt = e.transform) == null ? void 0 : yt.skew_x) ?? 0, Z, ft), s.scale_x = this.lerp(s.scale_x ?? ((bt = e.transform) == null ? void 0 : bt.scale_x) ?? 1, (((gt = e.transform) == null ? void 0 : gt.scale_x) ?? 1) * (1 + K), ft), s.scale_y = this.lerp(s.scale_y ?? ((Et = e.transform) == null ? void 0 : Et.scale_y) ?? 1, (((It = e.transform) == null ? void 0 : It.scale_y) ?? 1) * (1 + K), ft), s.style = s.style || { ...e.style }, s.style.artEffect = { enabled: !0, type: "crumple_overlay", intensity: ((vt = n.settings) == null ? void 0 : vt.intensity) ?? 1, scale: ((Yt = n.settings) == null ? void 0 : Yt.scale) ?? 2 };
|
|
5401
5404
|
}
|
|
5402
5405
|
} else if (n.type === U.Squash) {
|
|
5403
|
-
const H = ((
|
|
5404
|
-
l < (e.width || 100) && this.isMouseDown ? (s.scale_y = this.lerp(s.scale_y ?? 1, (((fe = e.transform) == null ? void 0 : fe.scale_y) ?? 1) * H, 0.3), s.scale_x = this.lerp(s.scale_x ?? 1, (((
|
|
5406
|
+
const H = ((ie = n.settings) == null ? void 0 : ie.strength) || 0.8;
|
|
5407
|
+
l < (e.width || 100) && this.isMouseDown ? (s.scale_y = this.lerp(s.scale_y ?? 1, (((fe = e.transform) == null ? void 0 : fe.scale_y) ?? 1) * H, 0.3), s.scale_x = this.lerp(s.scale_x ?? 1, (((st = e.transform) == null ? void 0 : st.scale_x) ?? 1) * (1 + (1 - H) * 0.4), 0.3)) : (s.scale_y = this.lerp(s.scale_y ?? 1, ((mt = e.transform) == null ? void 0 : mt.scale_y) ?? 1, 0.2), s.scale_x = this.lerp(s.scale_x ?? 1, ((Lt = e.transform) == null ? void 0 : Lt.scale_x) ?? 1, 0.2));
|
|
5405
5408
|
} else if (n.type === U.TextCounter) {
|
|
5406
|
-
const H = ((_t = n.settings) == null ? void 0 : _t.duration) || 2,
|
|
5409
|
+
const H = ((_t = n.settings) == null ? void 0 : _t.duration) || 2, Z = ((dt = n.settings) == null ? void 0 : dt.from) || 0, K = ((Ft = n.settings) == null ? void 0 : Ft.to) || 100;
|
|
5407
5410
|
n._runtimeStart === void 0 && (n._runtimeStart = this.currentTime);
|
|
5408
|
-
const ft = this.currentTime - n._runtimeStart, Tt = Math.min(1, ft / H),
|
|
5411
|
+
const ft = this.currentTime - n._runtimeStart, Tt = Math.min(1, ft / H), Rt = Math.floor(Z + (K - Z) * Tt);
|
|
5409
5412
|
if (((Dt = e.geometry) == null ? void 0 : Dt.type) === "Text") {
|
|
5410
5413
|
const Bt = (($t = n.settings) == null ? void 0 : $t.prefix) || "", ee = ((Ot = n.settings) == null ? void 0 : Ot.suffix) || "";
|
|
5411
|
-
s.geometry || (s.geometry = { ...e.geometry }), s.geometry.text = `${Bt}${
|
|
5414
|
+
s.geometry || (s.geometry = { ...e.geometry }), s.geometry.text = `${Bt}${Rt}${ee}`;
|
|
5412
5415
|
}
|
|
5413
5416
|
} else if (n.type === U.Spotlight) {
|
|
5414
|
-
const H = ((Vt = n.settings) == null ? void 0 : Vt.radius) || 250,
|
|
5417
|
+
const H = ((Vt = n.settings) == null ? void 0 : Vt.radius) || 250, Z = ((ne = n.settings) == null ? void 0 : ne.strength) || 1.5;
|
|
5415
5418
|
if (l < H) {
|
|
5416
5419
|
const K = Math.pow(1 - l / H, 2);
|
|
5417
|
-
s.style || (s.style = { ...e.style }), s.style.adjustments || (s.style.adjustments = { ...(me = e.style) == null ? void 0 : me.adjustments }), s.style.adjustments.exposure = (((Ut = (ye = e.style) == null ? void 0 : ye.adjustments) == null ? void 0 : Ut.exposure) || 0) + K *
|
|
5420
|
+
s.style || (s.style = { ...e.style }), s.style.adjustments || (s.style.adjustments = { ...(me = e.style) == null ? void 0 : me.adjustments }), s.style.adjustments.exposure = (((Ut = (ye = e.style) == null ? void 0 : ye.adjustments) == null ? void 0 : Ut.exposure) || 0) + K * Z * 50;
|
|
5418
5421
|
} else
|
|
5419
5422
|
(Se = s.style) != null && Se.adjustments && (s.style.adjustments.exposure = this.lerp(s.style.adjustments.exposure || 0, ((Ee = (Pe = e.style) == null ? void 0 : Pe.adjustments) == null ? void 0 : Ee.exposure) || 0, 0.1));
|
|
5420
5423
|
} else if (n.type === U.Noise || n.type === U.Float) {
|
|
5421
|
-
const H = (((Ce = n.settings) == null ? void 0 : Ce.frequency) || ((Ae = n.settings) == null ? void 0 : Ae.speed) || 1) * 2e-3,
|
|
5422
|
-
s.x += Math.sin(K * H) *
|
|
5424
|
+
const H = (((Ce = n.settings) == null ? void 0 : Ce.frequency) || ((Ae = n.settings) == null ? void 0 : Ae.speed) || 1) * 2e-3, Z = (((xe = n.settings) == null ? void 0 : xe.amplitude) || ((se = n.settings) == null ? void 0 : se.range) || 50) * (((jt = n.settings) == null ? void 0 : jt.strength) || 1), K = Date.now();
|
|
5425
|
+
s.x += Math.sin(K * H) * Z * t, s.y += Math.cos(K * H * 0.8) * Z * t, s.rotation += Math.sin(K * H * 0.5) * 5 * t;
|
|
5423
5426
|
} else if (n.type === U.Pulse) {
|
|
5424
|
-
const H = (((ht = n.settings) == null ? void 0 : ht.speed) || 1) * 5e-3,
|
|
5425
|
-
s.scale_x *= 1 + K *
|
|
5427
|
+
const H = (((ht = n.settings) == null ? void 0 : ht.speed) || 1) * 5e-3, Z = (((ut = n.settings) == null ? void 0 : ut.scale) || 1.2) - 1, K = Math.sin(Date.now() * H), ft = ((at = n.settings) == null ? void 0 : at.strength) || 1;
|
|
5428
|
+
s.scale_x *= 1 + K * Z * ft * t, s.scale_y *= 1 + K * Z * ft * t, s.style && (s.style.exposure = (s.style.exposure || 1) + Math.max(0, K) * 0.1 * ft * t);
|
|
5426
5429
|
} else if (n.type === U.Draggable) {
|
|
5427
|
-
const H = ((B = n.settings) == null ? void 0 : B.radius) || 150,
|
|
5428
|
-
if (l < H ||
|
|
5429
|
-
const K = ((
|
|
5430
|
+
const H = ((B = n.settings) == null ? void 0 : B.radius) || 150, Z = this.draggingBehaviors.has(e.id);
|
|
5431
|
+
if (l < H || Z) {
|
|
5432
|
+
const K = ((et = n.settings) == null ? void 0 : et.strength) || 1, ft = Z ? 1 : Math.max(0, 1 - l / H);
|
|
5430
5433
|
this.applyBehaviorSensor(s, Zt.PositionX, ft * K, t, n.settings), this.applyBehaviorSensor(s, Zt.PositionY, ft * K, t, n.settings);
|
|
5431
5434
|
}
|
|
5432
5435
|
} else if (n.type === U.Scroll) {
|
|
5433
|
-
const H = ((
|
|
5434
|
-
(H === "vertical" || H === "both") && (s.y += this.scrollOffset.y *
|
|
5436
|
+
const H = ((Q = n.settings) == null ? void 0 : Q.axis) || "vertical", Z = ((Pt = n.settings) == null ? void 0 : Pt.factor) || 0.5, K = ((xt = n.settings) == null ? void 0 : xt.strength) || 1, ft = ((kt = n.settings) == null ? void 0 : kt.scaleFactor) || 0;
|
|
5437
|
+
(H === "vertical" || H === "both") && (s.y += this.scrollOffset.y * Z * K * t), (H === "horizontal" || H === "both") && (s.x += this.scrollOffset.x * Z * K * t), ft !== 0 && (s.scale_x *= 1 + this.scrollOffset.y * ft * t, s.scale_y *= 1 + this.scrollOffset.y * ft * t);
|
|
5435
5438
|
} else if (n.type === U.LookAt) {
|
|
5436
|
-
const H = ((At = n.settings) == null ? void 0 : At.factor) || 1,
|
|
5437
|
-
s.rotation += Tt * H *
|
|
5439
|
+
const H = ((At = n.settings) == null ? void 0 : At.factor) || 1, Z = ((Mt = n.settings) == null ? void 0 : Mt.strength) || 1, K = Math.atan2(-f, -h) * (180 / Math.PI), ft = s.rotation, Tt = (K - ft + 180) % 360 - 180;
|
|
5440
|
+
s.rotation += Tt * H * Z * t * 10;
|
|
5438
5441
|
} else if (n.type === U.Scan) {
|
|
5439
|
-
const H = ((($ = n.settings) == null ? void 0 : $.speed) || 1) * 4e-3,
|
|
5440
|
-
s.style && (s.style.exposure = (s.style.exposure || 1) + K *
|
|
5442
|
+
const H = ((($ = n.settings) == null ? void 0 : $.speed) || 1) * 4e-3, Z = ((Wt = n.settings) == null ? void 0 : Wt.strength) || 1, K = (Math.sin(Date.now() * H) + 1) / 2;
|
|
5443
|
+
s.style && (s.style.exposure = (s.style.exposure || 1) + K * Z * t * 5), s.x += (K - 0.5) * 20 * Z * t;
|
|
5441
5444
|
} else if (n.type === U.Glint)
|
|
5442
5445
|
s.style = s.style || { ...e.style }, s.style.artEffect = {
|
|
5443
5446
|
enabled: !0,
|
|
@@ -5445,17 +5448,17 @@ class ci {
|
|
|
5445
5448
|
intensity: ((Kt = n.settings) == null ? void 0 : Kt.strength) ?? 0.8
|
|
5446
5449
|
};
|
|
5447
5450
|
else if (n.type === U.Ratchet) {
|
|
5448
|
-
const H = ((te = n.settings) == null ? void 0 : te.steps) || 12,
|
|
5449
|
-
s.rotation = this.lerp(s.rotation, K +
|
|
5451
|
+
const H = ((te = n.settings) == null ? void 0 : te.steps) || 12, Z = (((Jt = n.settings) == null ? void 0 : Jt.speed) || 1) * 30, K = Math.floor(s.rotation / (360 / H)) * (360 / H);
|
|
5452
|
+
s.rotation = this.lerp(s.rotation, K + Z * t, 0.1);
|
|
5450
5453
|
} else if (n.type === U.Jitter && l < 300) {
|
|
5451
|
-
const H = ((
|
|
5452
|
-
s.x += (Math.random() - 0.5) *
|
|
5454
|
+
const H = ((pt = n.settings) == null ? void 0 : pt.strength) || 1, Z = (((ct = n.settings) == null ? void 0 : ct.intensity) || 5) * H;
|
|
5455
|
+
s.x += (Math.random() - 0.5) * Z * t * 60, s.y += (Math.random() - 0.5) * Z * t * 60, s.rotation += (Math.random() - 0.5) * Z * t * 120;
|
|
5453
5456
|
} else if (n.type === U.Follower) {
|
|
5454
5457
|
const H = (Ct = n.settings) == null ? void 0 : Ct.targetId;
|
|
5455
5458
|
if (H) {
|
|
5456
|
-
const
|
|
5457
|
-
if (
|
|
5458
|
-
const K = ((rt = n.settings) == null ? void 0 : rt.stiffness) || 0.1, ft =
|
|
5459
|
+
const Z = this.objectStates.get(H);
|
|
5460
|
+
if (Z) {
|
|
5461
|
+
const K = ((rt = n.settings) == null ? void 0 : rt.stiffness) || 0.1, ft = Z.x - s.x, Tt = Z.y - s.y;
|
|
5459
5462
|
s.x += ft * K * t * 60, s.y += Tt * K * t * 60;
|
|
5460
5463
|
}
|
|
5461
5464
|
}
|
|
@@ -5465,55 +5468,55 @@ class ci {
|
|
|
5465
5468
|
const H = ((V = n.settings) == null ? void 0 : V.strength) || 9.8;
|
|
5466
5469
|
s.y += H * t * 10;
|
|
5467
5470
|
} else if (n.type === U.Velocity) {
|
|
5468
|
-
const H = ((
|
|
5469
|
-
s.x += H * t * 10, s.y +=
|
|
5471
|
+
const H = ((it = n.settings) == null ? void 0 : it.vx) || 0, Z = ((nt = n.settings) == null ? void 0 : nt.vy) || 0;
|
|
5472
|
+
s.x += H * t * 10, s.y += Z * t * 10;
|
|
5470
5473
|
} else if (n.type === U.Shear) {
|
|
5471
|
-
const H = ((
|
|
5472
|
-
if (l <
|
|
5473
|
-
const K = 1 - l /
|
|
5474
|
+
const H = ((St = n.settings) == null ? void 0 : St.strength) || 1, Z = ((Xt = n.settings) == null ? void 0 : Xt.radius) || 300;
|
|
5475
|
+
if (l < Z) {
|
|
5476
|
+
const K = 1 - l / Z;
|
|
5474
5477
|
s.skew_x = this.lerp(s.skew_x || 0, (((Qt = e.transform) == null ? void 0 : Qt.skew_x) || 0) + K * H * 30, 0.1);
|
|
5475
5478
|
} else
|
|
5476
|
-
s.skew_x = this.lerp(s.skew_x || 0, ((
|
|
5479
|
+
s.skew_x = this.lerp(s.skew_x || 0, ((oe = e.transform) == null ? void 0 : oe.skew_x) || 0, 0.05);
|
|
5477
5480
|
} else if (n.type === U.Lens) {
|
|
5478
|
-
const H = ((Gt = n.settings) == null ? void 0 : Gt.radius) || 200,
|
|
5481
|
+
const H = ((Gt = n.settings) == null ? void 0 : Gt.radius) || 200, Z = ((Ht = n.settings) == null ? void 0 : Ht.strength) || 0.5;
|
|
5479
5482
|
if (l < H) {
|
|
5480
5483
|
const K = Math.pow(1 - l / H, 2);
|
|
5481
|
-
s.scale_x = this.lerp(s.scale_x ?? 1, (((Nt = e.transform) == null ? void 0 : Nt.scale_x) ?? 1) * (1 + K *
|
|
5484
|
+
s.scale_x = this.lerp(s.scale_x ?? 1, (((Nt = e.transform) == null ? void 0 : Nt.scale_x) ?? 1) * (1 + K * Z), 0.2), s.scale_y = this.lerp(s.scale_y ?? 1, (((Ie = e.transform) == null ? void 0 : Ie.scale_y) ?? 1) * (1 + K * Z), 0.2);
|
|
5482
5485
|
} else
|
|
5483
|
-
s.scale_x = this.lerp(s.scale_x ?? 1, ((
|
|
5486
|
+
s.scale_x = this.lerp(s.scale_x ?? 1, ((Re = e.transform) == null ? void 0 : Re.scale_x) ?? 1, 0.1), s.scale_y = this.lerp(s.scale_y ?? 1, ((Le = e.transform) == null ? void 0 : Le.scale_y) ?? 1, 0.1);
|
|
5484
5487
|
} else if (n.type === U.LayoutAnimation) {
|
|
5485
|
-
const H = ((Oe = n.settings) == null ? void 0 : Oe.watchProperties) || ["x", "y", "scale_x", "scale_y", "opacity", "rotation"],
|
|
5488
|
+
const H = ((Oe = n.settings) == null ? void 0 : Oe.watchProperties) || ["x", "y", "scale_x", "scale_y", "opacity", "rotation"], Z = ((Fe = n.settings) == null ? void 0 : Fe.duration) || 0.3;
|
|
5486
5489
|
this._layoutAnimCache.has(e.id) || this._layoutAnimCache.set(e.id, /* @__PURE__ */ new Map());
|
|
5487
5490
|
const K = this._layoutAnimCache.get(e.id);
|
|
5488
5491
|
for (const ft of H) {
|
|
5489
5492
|
const Tt = this.getObjectProperty(s, e, ft);
|
|
5490
5493
|
if (Tt === void 0) continue;
|
|
5491
|
-
const
|
|
5492
|
-
if (!
|
|
5494
|
+
const Rt = K.get(ft);
|
|
5495
|
+
if (!Rt)
|
|
5493
5496
|
K.set(ft, {
|
|
5494
5497
|
from: Tt,
|
|
5495
5498
|
to: Tt,
|
|
5496
5499
|
startTime: this.currentTime,
|
|
5497
5500
|
duration: 0
|
|
5498
5501
|
});
|
|
5499
|
-
else if (
|
|
5502
|
+
else if (Rt.to !== Tt) {
|
|
5500
5503
|
const ee = this.getObjectProperty(s, e, ft);
|
|
5501
5504
|
K.set(ft, {
|
|
5502
|
-
from: ee ??
|
|
5505
|
+
from: ee ?? Rt.from,
|
|
5503
5506
|
to: Tt,
|
|
5504
5507
|
startTime: this.currentTime,
|
|
5505
|
-
duration: (($e = n.settings) == null ? void 0 : $e.duration) ??
|
|
5508
|
+
duration: (($e = n.settings) == null ? void 0 : $e.duration) ?? Z
|
|
5506
5509
|
});
|
|
5507
5510
|
}
|
|
5508
5511
|
const Bt = K.get(ft);
|
|
5509
5512
|
if (Bt.duration > 0 && Bt.from !== Bt.to) {
|
|
5510
|
-
const ee = this.currentTime - Bt.startTime, ue = Math.min(1, ee / Bt.duration), Te = this.applyEasing(ue, ((Ye = n.settings) == null ? void 0 : Ye.easing) || "easeOutCubic"),
|
|
5511
|
-
this.setObjectProperty(s, e, ft,
|
|
5513
|
+
const ee = this.currentTime - Bt.startTime, ue = Math.min(1, ee / Bt.duration), Te = this.applyEasing(ue, ((Ye = n.settings) == null ? void 0 : Ye.easing) || "easeOutCubic"), re = Bt.from + (Bt.to - Bt.from) * Te;
|
|
5514
|
+
this.setObjectProperty(s, e, ft, re);
|
|
5512
5515
|
}
|
|
5513
5516
|
}
|
|
5514
5517
|
} else if (n.type === U.StateReactive) {
|
|
5515
5518
|
this._layoutAnimCache.has(e.id) || this._layoutAnimCache.set(e.id, /* @__PURE__ */ new Map());
|
|
5516
|
-
const H = this._layoutAnimCache.get(e.id),
|
|
5519
|
+
const H = this._layoutAnimCache.get(e.id), Z = ((zt = n.settings) == null ? void 0 : zt.defaultDuration) || 0.3, K = [
|
|
5517
5520
|
"x",
|
|
5518
5521
|
"y",
|
|
5519
5522
|
"scale_x",
|
|
@@ -5531,39 +5534,39 @@ class ci {
|
|
|
5531
5534
|
for (const ft of K) {
|
|
5532
5535
|
const Tt = this.getObjectProperty(s, e, ft);
|
|
5533
5536
|
if (Tt === void 0 || typeof Tt != "number") continue;
|
|
5534
|
-
const
|
|
5535
|
-
if (!
|
|
5537
|
+
const Rt = H.get(ft);
|
|
5538
|
+
if (!Rt)
|
|
5536
5539
|
H.set(ft, {
|
|
5537
5540
|
from: Tt,
|
|
5538
5541
|
to: Tt,
|
|
5539
5542
|
startTime: this.currentTime,
|
|
5540
5543
|
duration: 0
|
|
5541
5544
|
});
|
|
5542
|
-
else if (
|
|
5545
|
+
else if (Rt.to !== Tt) {
|
|
5543
5546
|
const ee = this.getObjectProperty(s, e, ft);
|
|
5544
5547
|
H.set(ft, {
|
|
5545
|
-
from: ee ??
|
|
5548
|
+
from: ee ?? Rt.from,
|
|
5546
5549
|
to: Tt,
|
|
5547
5550
|
startTime: this.currentTime,
|
|
5548
|
-
duration:
|
|
5551
|
+
duration: Z
|
|
5549
5552
|
});
|
|
5550
5553
|
}
|
|
5551
5554
|
const Bt = H.get(ft);
|
|
5552
5555
|
if (Bt.duration > 0 && Bt.from !== Bt.to) {
|
|
5553
|
-
const ee = this.currentTime - Bt.startTime, ue = Math.min(1, ee / Bt.duration), Te = this.applyEasing(ue, ((
|
|
5554
|
-
this.setObjectProperty(s, e, ft,
|
|
5556
|
+
const ee = this.currentTime - Bt.startTime, ue = Math.min(1, ee / Bt.duration), Te = this.applyEasing(ue, ((ae = n.settings) == null ? void 0 : ae.defaultEasing) || "easeOutCubic"), re = Bt.from + (Bt.to - Bt.from) * Te;
|
|
5557
|
+
this.setObjectProperty(s, e, ft, re);
|
|
5555
5558
|
}
|
|
5556
5559
|
}
|
|
5557
5560
|
} else if (n.type === U.SpringChain) {
|
|
5558
|
-
const H = ((we = n.settings) == null ? void 0 : we.connections) || [],
|
|
5561
|
+
const H = ((we = n.settings) == null ? void 0 : we.connections) || [], Z = ((Be = n.settings) == null ? void 0 : Be.globalDamping) || 0.3;
|
|
5559
5562
|
this._springChainState.has(e.id) || this._springChainState.set(e.id, /* @__PURE__ */ new Map());
|
|
5560
5563
|
const K = this._springChainState.get(e.id);
|
|
5561
5564
|
for (const Tt of H) {
|
|
5562
5565
|
if (!K.has(Tt.targetId)) {
|
|
5563
|
-
const
|
|
5566
|
+
const Rt = this.objectStates.get(Tt.targetId);
|
|
5564
5567
|
K.set(Tt.targetId, {
|
|
5565
|
-
x: (
|
|
5566
|
-
y: (
|
|
5568
|
+
x: (Rt == null ? void 0 : Rt.x) ?? 0,
|
|
5569
|
+
y: (Rt == null ? void 0 : Rt.y) ?? 0,
|
|
5567
5570
|
vx: 0,
|
|
5568
5571
|
vy: 0
|
|
5569
5572
|
});
|
|
@@ -5574,46 +5577,46 @@ class ci {
|
|
|
5574
5577
|
if (ft) {
|
|
5575
5578
|
ft.x = s.x, ft.y = s.y;
|
|
5576
5579
|
for (const Tt of H) {
|
|
5577
|
-
const
|
|
5578
|
-
if (!
|
|
5579
|
-
const Bt =
|
|
5580
|
-
ft.vx += be * t * 10, ft.vy += Ue * t * 10,
|
|
5580
|
+
const Rt = K.get(Tt.targetId);
|
|
5581
|
+
if (!Rt) continue;
|
|
5582
|
+
const Bt = Rt.x - ft.x, ee = Rt.y - ft.y, ue = Math.sqrt(Bt * Bt + ee * ee) || 1e-3, re = (ue - (Tt.restLength || 50)) * (Tt.stiffness || 0.8), be = Bt / ue * re, Ue = ee / ue * re;
|
|
5583
|
+
ft.vx += be * t * 10, ft.vy += Ue * t * 10, Rt.vx -= be * t * 10, Rt.vy -= Ue * t * 10, ft.vx *= 1 - Z * t * 10, ft.vy *= 1 - Z * t * 10, Rt.vx *= 1 - Z * t * 10, Rt.vy *= 1 - Z * t * 10;
|
|
5581
5584
|
const pe = this.objectStates.get(Tt.targetId);
|
|
5582
|
-
pe && (pe.x +=
|
|
5585
|
+
pe && (pe.x += Rt.vx * t, pe.y += Rt.vy * t);
|
|
5583
5586
|
}
|
|
5584
5587
|
s.x += ft.vx * t, s.y += ft.vy * t;
|
|
5585
5588
|
}
|
|
5586
5589
|
} else if (n.type === U.ParticleEmitter) {
|
|
5587
|
-
const H = ((We = n.settings) == null ? void 0 : We.rate) || 10,
|
|
5590
|
+
const H = ((We = n.settings) == null ? void 0 : We.rate) || 10, Z = ((de = n.settings) == null ? void 0 : de.speed) || 100, K = ((ce = n.settings) == null ? void 0 : ce.size) || 5, ft = ((he = n.settings) == null ? void 0 : he.lifetime) || 2, Tt = ((ke = n.settings) == null ? void 0 : ke.gravity) || 0, Rt = ((Xe = n.settings) == null ? void 0 : Xe.color) || "#ffffff", Bt = ((Ve = n.settings) == null ? void 0 : Ve.maxParticles) || 200, ee = (Ne = n.settings) != null && Ne.rateInputId ? this.inputs.get(n.settings.rateInputId) ?? H : H, ue = (De = n.settings) != null && De.gravityInputId ? this.inputs.get(n.settings.gravityInputId) ?? Tt : Tt, Te = (He = n.settings) != null && He.speedInputId ? this.inputs.get(n.settings.speedInputId) ?? Z : Z;
|
|
5588
5591
|
this._emitterPools.has(e.id) || this._emitterPools.set(e.id, []);
|
|
5589
|
-
const
|
|
5592
|
+
const re = this._emitterPools.get(e.id);
|
|
5590
5593
|
let be = 0;
|
|
5591
5594
|
n._pendingBurst && n._pendingBurst > 0 && (be = n._pendingBurst, n._pendingBurst = 0);
|
|
5592
5595
|
const Ue = Math.floor(ee * t) + (be || 0);
|
|
5593
|
-
for (let pe = 0; pe < Math.min(Ue, Bt -
|
|
5594
|
-
const
|
|
5595
|
-
|
|
5596
|
+
for (let pe = 0; pe < Math.min(Ue, Bt - re.length); pe++) {
|
|
5597
|
+
const le = Math.random() * Math.PI * 2, ss = Te * (0.5 + Math.random() * 0.5);
|
|
5598
|
+
re.push({
|
|
5596
5599
|
x: s.x,
|
|
5597
5600
|
y: s.y,
|
|
5598
|
-
vx: Math.cos(
|
|
5599
|
-
vy: Math.sin(
|
|
5601
|
+
vx: Math.cos(le) * ss,
|
|
5602
|
+
vy: Math.sin(le) * ss,
|
|
5600
5603
|
life: 0,
|
|
5601
5604
|
maxLife: ft * (0.5 + Math.random() * 0.5),
|
|
5602
5605
|
size: K * (0.5 + Math.random()),
|
|
5603
|
-
color:
|
|
5606
|
+
color: Rt,
|
|
5604
5607
|
opacity: 1
|
|
5605
5608
|
});
|
|
5606
5609
|
}
|
|
5607
|
-
for (let pe =
|
|
5608
|
-
const
|
|
5609
|
-
|
|
5610
|
+
for (let pe = re.length - 1; pe >= 0; pe--) {
|
|
5611
|
+
const le = re[pe];
|
|
5612
|
+
le.vy += ue * t * 10, le.x += le.vx * t, le.y += le.vy * t, le.life += t, le.opacity = Math.max(0, 1 - le.life / le.maxLife), le.life >= le.maxLife && re.splice(pe, 1);
|
|
5610
5613
|
}
|
|
5611
5614
|
}
|
|
5612
5615
|
});
|
|
5613
5616
|
});
|
|
5614
5617
|
}
|
|
5615
5618
|
applyBehaviorSensor(t, i, o, e, s, n, a = 0, r = 0, h = 1) {
|
|
5616
|
-
var d, u, v, b, m, y, S, C, w, M, I, k, T,
|
|
5619
|
+
var d, u, v, b, m, y, S, C, w, M, I, k, T, R, P, _, E, A, W, z, Y, G, N, J;
|
|
5617
5620
|
const f = (s == null ? void 0 : s.intensity) || (s == null ? void 0 : s.strength) || 1, l = Math.min(1, 15 * e), p = h > 0 ? a / h : 0, c = h > 0 ? r / h : 0;
|
|
5618
5621
|
switch (i) {
|
|
5619
5622
|
case Zt.Scale: {
|
|
@@ -5664,7 +5667,7 @@ class ci {
|
|
|
5664
5667
|
}
|
|
5665
5668
|
case Zt.Exposure: {
|
|
5666
5669
|
t.style || (t.style = { ...n == null ? void 0 : n.style }), t.style.adjustments || (t.style.adjustments = { ...(T = n == null ? void 0 : n.style) == null ? void 0 : T.adjustments });
|
|
5667
|
-
const x = ((P = (
|
|
5670
|
+
const x = ((P = (R = n == null ? void 0 : n.style) == null ? void 0 : R.adjustments) == null ? void 0 : P.exposure) || 0, F = x + o * ((s == null ? void 0 : s.exposure) || 50) * f;
|
|
5668
5671
|
t.style.adjustments.exposure = (t.style.adjustments.exposure ?? x) * (1 - l) + F * l;
|
|
5669
5672
|
break;
|
|
5670
5673
|
}
|
|
@@ -5802,7 +5805,7 @@ const yi = Ss(({
|
|
|
5802
5805
|
isMouseDown: I,
|
|
5803
5806
|
inputs: k,
|
|
5804
5807
|
interactive: T = !0,
|
|
5805
|
-
onNavigation:
|
|
5808
|
+
onNavigation: R
|
|
5806
5809
|
}, P) => {
|
|
5807
5810
|
const _ = _e(null), E = _e(null);
|
|
5808
5811
|
E.current || (E.current = new ci());
|
|
@@ -5812,9 +5815,9 @@ const yi = Ss(({
|
|
|
5812
5815
|
}), []), ve(() => {
|
|
5813
5816
|
E.current.setLayout(e, s);
|
|
5814
5817
|
}, [e, s]), ve(() => {
|
|
5815
|
-
const
|
|
5816
|
-
a &&
|
|
5817
|
-
}, [a, r, h, f, l, p, c, d, u, v, b,
|
|
5818
|
+
const L = E.current;
|
|
5819
|
+
a && L.setTriggerCallback(a), r && L.setInputUpdateCallback((O, D) => r({ [O]: D })), h && L.setComponentChangeCallback((O) => h(O)), f && L.setToggleCallback(f), l && L.setInputChangeCallback(l), p && L.setInputFocusCallback(p), c && L.setInputBlurCallback(c), d && L.setOnLogCallback((O) => d(O, "info")), u && L.setLogicUpdateCallback(u), v && L.setButtonClickCallback(v), b && L.setGraphPointClickCallback((O) => b(O.objectId, O)), R && L.setNavigationCallback(R);
|
|
5820
|
+
}, [a, r, h, f, l, p, c, d, u, v, b, R]), ve(() => {
|
|
5818
5821
|
(async () => {
|
|
5819
5822
|
let O = g;
|
|
5820
5823
|
if (t && !g)
|
|
@@ -5829,7 +5832,7 @@ const yi = Ss(({
|
|
|
5829
5832
|
}
|
|
5830
5833
|
})();
|
|
5831
5834
|
}, [g, t, y]), ve(() => {
|
|
5832
|
-
const
|
|
5835
|
+
const L = (O) => {
|
|
5833
5836
|
if (!E.current || !J.current) return;
|
|
5834
5837
|
const D = E.current, q = _.current;
|
|
5835
5838
|
if (!q) return;
|
|
@@ -5839,62 +5842,62 @@ const yi = Ss(({
|
|
|
5839
5842
|
W.current === 0 && (W.current = yt);
|
|
5840
5843
|
let bt = yt - W.current;
|
|
5841
5844
|
bt > 0.1 && (bt = 0.1), W.current = yt;
|
|
5842
|
-
const gt = q.getBoundingClientRect(), Et = window.devicePixelRatio || 1, It = Math.round(gt.width * Et),
|
|
5843
|
-
(q.width !== It || q.height !==
|
|
5845
|
+
const gt = q.getBoundingClientRect(), Et = window.devicePixelRatio || 1, It = Math.round(gt.width * Et), vt = Math.round(gt.height * Et);
|
|
5846
|
+
(q.width !== It || q.height !== vt) && (q.width = It, q.height = vt);
|
|
5844
5847
|
try {
|
|
5845
5848
|
o ? D.advance(bt) : m !== void 0 && D.seek(m), D.render(ot, q.width, q.height);
|
|
5846
|
-
} catch (
|
|
5847
|
-
console.error("[ExodeUICanvas] Error in animation loop:",
|
|
5849
|
+
} catch (Yt) {
|
|
5850
|
+
console.error("[ExodeUICanvas] Error in animation loop:", Yt), d && d(`[Error] Animation loop crashed: ${Yt}`, "error");
|
|
5848
5851
|
}
|
|
5849
|
-
A.current = requestAnimationFrame(
|
|
5852
|
+
A.current = requestAnimationFrame(L);
|
|
5850
5853
|
};
|
|
5851
|
-
return A.current = requestAnimationFrame(
|
|
5854
|
+
return A.current = requestAnimationFrame(L), () => {
|
|
5852
5855
|
A.current && cancelAnimationFrame(A.current);
|
|
5853
5856
|
};
|
|
5854
5857
|
}, [o, m]), ve(() => {
|
|
5855
|
-
const
|
|
5856
|
-
S !== void 0 &&
|
|
5858
|
+
const L = E.current;
|
|
5859
|
+
S !== void 0 && L.updateInput("scrollY", S), C !== void 0 && L.updateInput("scrollX", C), w !== void 0 && L.updateInput("mouseX", w), M !== void 0 && L.updateInput("mouseY", M), I !== void 0 && L.updateInput("isMouseDown", I), k && Object.entries(k).forEach(([O, D]) => L.updateInput(O, D));
|
|
5857
5860
|
}, [S, C, w, M, I, k]);
|
|
5858
|
-
const x = (
|
|
5861
|
+
const x = (L, O) => {
|
|
5859
5862
|
if (!T || !_.current) return;
|
|
5860
|
-
|
|
5861
|
-
const D = _.current, q = D.getBoundingClientRect(), ot =
|
|
5863
|
+
L.stopPropagation(), "nativeEvent" in L && L.nativeEvent && typeof L.nativeEvent.stopImmediatePropagation == "function" ? L.nativeEvent.stopImmediatePropagation() : typeof L.stopImmediatePropagation == "function" && L.stopImmediatePropagation();
|
|
5864
|
+
const D = _.current, q = D.getBoundingClientRect(), ot = L.clientX - q.left, yt = L.clientY - q.top, bt = window.devicePixelRatio || 1;
|
|
5862
5865
|
(O === "click" || O === "down" || O === "up") && d && d(`[Canvas] Pointer ${O} at rect(${Math.round(ot)},${Math.round(yt)}) mapped to buffer(${Math.round(ot * bt)},${Math.round(yt * bt)})`, "info"), E.current.handlePointerInput(O, ot * bt, yt * bt, D.width, D.height);
|
|
5863
5866
|
};
|
|
5864
5867
|
ve(() => {
|
|
5865
5868
|
if (!T) return;
|
|
5866
|
-
const
|
|
5869
|
+
const L = (D) => {
|
|
5867
5870
|
var q, ot, yt;
|
|
5868
5871
|
((q = document.activeElement) == null ? void 0 : q.tagName) === "INPUT" || ((ot = document.activeElement) == null ? void 0 : ot.tagName) === "TEXTAREA" || (yt = E.current) == null || yt.handleKeyDown(D);
|
|
5869
5872
|
}, O = (D) => {
|
|
5870
5873
|
var q, ot, yt;
|
|
5871
5874
|
((q = document.activeElement) == null ? void 0 : q.tagName) === "INPUT" || ((ot = document.activeElement) == null ? void 0 : ot.tagName) === "TEXTAREA" || (yt = E.current) == null || yt.handleKeyUp(D);
|
|
5872
5875
|
};
|
|
5873
|
-
return window.addEventListener("keydown",
|
|
5874
|
-
window.removeEventListener("keydown",
|
|
5876
|
+
return window.addEventListener("keydown", L), window.addEventListener("keyup", O), () => {
|
|
5877
|
+
window.removeEventListener("keydown", L), window.removeEventListener("keyup", O);
|
|
5875
5878
|
};
|
|
5876
5879
|
}, [T]);
|
|
5877
5880
|
const [F, j] = Qe([]);
|
|
5878
5881
|
ve(() => {
|
|
5879
5882
|
if (g && g.objects) {
|
|
5880
|
-
const
|
|
5883
|
+
const L = g.objects.filter((O) => {
|
|
5881
5884
|
var D, q;
|
|
5882
5885
|
return O.type === "Joystick" && ((D = O.inputBinding) == null ? void 0 : D.type) === "keyboard" && ((q = O.inputBinding.keyboardConfig) == null ? void 0 : q.showVirtualKeyboard);
|
|
5883
5886
|
});
|
|
5884
|
-
j(
|
|
5887
|
+
j(L);
|
|
5885
5888
|
}
|
|
5886
5889
|
}, [g]);
|
|
5887
5890
|
const [, X] = Qe(0);
|
|
5888
5891
|
ve(() => {
|
|
5889
5892
|
if (F.length === 0) return;
|
|
5890
|
-
let
|
|
5893
|
+
let L;
|
|
5891
5894
|
const O = () => {
|
|
5892
|
-
X((D) => D + 1),
|
|
5895
|
+
X((D) => D + 1), L = requestAnimationFrame(O);
|
|
5893
5896
|
};
|
|
5894
|
-
return
|
|
5897
|
+
return L = requestAnimationFrame(O), () => cancelAnimationFrame(L);
|
|
5895
5898
|
}, [F.length]);
|
|
5896
|
-
const tt = () => F.map((
|
|
5897
|
-
const O =
|
|
5899
|
+
const tt = () => F.map((L) => {
|
|
5900
|
+
const O = L.inputBinding.keyboardConfig, D = (gt) => {
|
|
5898
5901
|
var It;
|
|
5899
5902
|
const Et = { key: gt, code: gt, preventDefault: () => {
|
|
5900
5903
|
} };
|
|
@@ -5999,27 +6002,27 @@ const yi = Ss(({
|
|
|
5999
6002
|
}
|
|
6000
6003
|
)
|
|
6001
6004
|
] })
|
|
6002
|
-
] },
|
|
6005
|
+
] }, L.id);
|
|
6003
6006
|
});
|
|
6004
6007
|
return /* @__PURE__ */ Je("div", { style: { position: "relative", width: "100%", height: "100%" }, children: [
|
|
6005
6008
|
/* @__PURE__ */ ge(
|
|
6006
6009
|
"canvas",
|
|
6007
6010
|
{
|
|
6008
6011
|
ref: _,
|
|
6009
|
-
onPointerDown: (
|
|
6012
|
+
onPointerDown: (L) => {
|
|
6010
6013
|
var O;
|
|
6011
|
-
x(
|
|
6014
|
+
x(L, "down"), (O = _.current) == null || O.focus();
|
|
6012
6015
|
},
|
|
6013
|
-
onPointerMove: (
|
|
6014
|
-
onPointerUp: (
|
|
6015
|
-
onPointerCancel: (
|
|
6016
|
-
onClick: (
|
|
6017
|
-
onWheel: (
|
|
6018
|
-
E.current.handleWheel(
|
|
6016
|
+
onPointerMove: (L) => x(L, "move"),
|
|
6017
|
+
onPointerUp: (L) => x(L, "up"),
|
|
6018
|
+
onPointerCancel: (L) => x(L, "up"),
|
|
6019
|
+
onClick: (L) => x(L, "click"),
|
|
6020
|
+
onWheel: (L) => {
|
|
6021
|
+
E.current.handleWheel(L.deltaX, L.deltaY);
|
|
6019
6022
|
},
|
|
6020
|
-
onKeyDown: (
|
|
6021
|
-
onKeyUp: (
|
|
6022
|
-
onContextMenu: (
|
|
6023
|
+
onKeyDown: (L) => E.current.handleKeyDown(L.nativeEvent),
|
|
6024
|
+
onKeyUp: (L) => E.current.handleKeyUp(L.nativeEvent),
|
|
6025
|
+
onContextMenu: (L) => L.preventDefault(),
|
|
6023
6026
|
tabIndex: 0,
|
|
6024
6027
|
style: {
|
|
6025
6028
|
...i,
|
|
@@ -6139,7 +6142,7 @@ const vi = ({ artboard: g, config: t }) => {
|
|
|
6139
6142
|
]
|
|
6140
6143
|
}
|
|
6141
6144
|
);
|
|
6142
|
-
}, hi = "6.3.
|
|
6145
|
+
}, hi = "6.3.40", fi = {
|
|
6143
6146
|
version: hi
|
|
6144
6147
|
}, Si = fi.version;
|
|
6145
6148
|
export {
|