exodeui 6.3.40 → 6.3.42
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 +22 -22
- package/dist/index.mjs +723 -715
- 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++) {
|
|
@@ -83,16 +83,16 @@ function ps(g) {
|
|
|
83
83
|
b.widths[G] = z.widths[Y];
|
|
84
84
|
const N = z.kinds[Y];
|
|
85
85
|
if (N === 2) {
|
|
86
|
-
const
|
|
87
|
-
|
|
88
|
-
` ||
|
|
86
|
+
const J = _[Y];
|
|
87
|
+
J === `
|
|
88
|
+
` || J === "\r" ? b.kinds[G] = 2 : b.kinds[G] = 0;
|
|
89
89
|
} else
|
|
90
90
|
b.kinds[G] = N;
|
|
91
91
|
}
|
|
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,19 +218,19 @@ 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 ?
|
|
225
|
-
var F,
|
|
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
|
+
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) :
|
|
228
|
-
const
|
|
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
|
+
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,
|
|
231
231
|
x: G + Y.w / 2 - l / 2,
|
|
232
232
|
y: N + Y.h / 2 - p / 2,
|
|
233
|
-
width:
|
|
233
|
+
width: J && h ? A.width : void 0,
|
|
234
234
|
height: x ? h ? void 0 : A.height : void 0
|
|
235
235
|
}), h ? z += Y.h + s : W += Y.w + s;
|
|
236
236
|
}), h ? w += A.width + s : M += A.height + s;
|
|
@@ -241,29 +241,29 @@ 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,
|
|
249
|
-
var
|
|
250
|
-
const P =
|
|
248
|
+
return t.forEach((T, R) => {
|
|
249
|
+
var j, X;
|
|
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((
|
|
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
|
-
let N = (Y == null ? void 0 : Y.width) ?? G.width ?? 100,
|
|
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") {
|
|
257
|
-
const
|
|
258
|
-
N =
|
|
257
|
+
const tt = (Y == null ? void 0 : Y.radius) ?? G.radius ?? (Y == null ? void 0 : Y.outer_radius) ?? G.outer_radius ?? 50;
|
|
258
|
+
N = tt * 2, J = tt * 2;
|
|
259
259
|
}
|
|
260
|
-
N *= T.transform.scale_x || 1,
|
|
260
|
+
N *= T.transform.scale_x || 1, J *= T.transform.scale_y || 1;
|
|
261
261
|
let x = W, F = z;
|
|
262
|
-
y ? x += (E - N) / 2 : S && (x += E - N), C ? F += (A -
|
|
262
|
+
y ? x += (E - N) / 2 : S && (x += E - N), C ? F += (A - J) / 2 : w && (F += A - J), k.push({
|
|
263
263
|
id: T.id,
|
|
264
264
|
x: x + N / 2 - f / 2,
|
|
265
|
-
y: F +
|
|
266
|
-
width: ((
|
|
265
|
+
y: F + J / 2 - l / 2,
|
|
266
|
+
width: ((j = T.layoutProps) == null ? void 0 : j.width) === "fill" ? E : void 0,
|
|
267
267
|
height: ((X = T.layoutProps) == null ? void 0 : X.height) === "fill" ? A : void 0
|
|
268
268
|
});
|
|
269
269
|
}), { childUpdates: k };
|
|
@@ -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
|
-
const
|
|
597
|
-
if (Math.hypot(I.x - k.x, I.y - k.y) <
|
|
596
|
+
const J = 1;
|
|
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
|
-
let
|
|
599
|
+
let j = 0, X = 0;
|
|
600
600
|
if (F !== 0) {
|
|
601
|
-
const
|
|
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
|
-
|
|
603
|
+
j = tt, X = L;
|
|
604
604
|
else {
|
|
605
|
-
const ot = -x[2] / F, yt = x[0] / F, bt = Math.hypot(ot, yt),
|
|
606
|
-
|
|
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 = L + gt * Math.cos(O);
|
|
607
607
|
}
|
|
608
|
-
const D = Math.hypot(v -
|
|
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,
|
|
611
|
-
l = l * (1 - Yt) + bt * Yt, p = p * (1 - Yt) +
|
|
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;
|
|
@@ -1992,19 +1992,19 @@ class ci {
|
|
|
1992
1992
|
let C = y.geometry;
|
|
1993
1993
|
if (y.type === "Frame" || y.type === "Group" || !C || C.type !== "Path" && C.type !== "Ellipse" && C.type !== "Rectangle") {
|
|
1994
1994
|
const F = (m = this.artboard) == null ? void 0 : m.objects.find(
|
|
1995
|
-
(
|
|
1995
|
+
(j) => j.parentId === y.id && j.type === "Shape" && j.geometry && (j.geometry.type === "Path" || j.geometry.type === "Ellipse" || j.geometry.type === "Rectangle")
|
|
1996
1996
|
);
|
|
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),
|
|
2004
|
-
A = Math.atan2(
|
|
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
|
+
A = Math.atan2(tt, X) * 180 / Math.PI + (r.offsetRotation || 0);
|
|
2005
2005
|
}
|
|
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,
|
|
2007
|
-
if (e.x = e.x + (
|
|
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;
|
|
2007
|
+
if (e.x = e.x + (J - e.x) * h, e.y = e.y + (x - e.y) * h, r.orient) {
|
|
2008
2008
|
let F = (A - e.rotation) % 360;
|
|
2009
2009
|
F > 180 && (F -= 360), F < -180 && (F += 360), e.rotation = e.rotation + F * h;
|
|
2010
2010
|
}
|
|
@@ -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
|
-
const G = C.x - y / 2 + w + Y * W, N = C.y + S / 2 - M - z / T * k,
|
|
2288
|
-
|
|
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 < 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
|
-
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,
|
|
2590
|
-
let X =
|
|
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 = R;
|
|
2591
2591
|
if (T) {
|
|
2592
|
-
const
|
|
2593
|
-
let
|
|
2594
|
-
|
|
2592
|
+
const tt = `_internal_${F}_${l.id}`;
|
|
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 =
|
|
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,
|
|
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,
|
|
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),
|
|
2966
|
-
}), a === 0 && (a =
|
|
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)
|
|
@@ -2973,48 +2973,48 @@ class ci {
|
|
|
2973
2973
|
if (delete l.cornerRadius, l.corner_radius = f, l.type === "Path" && i.weights && i.bindMatrices && l.points) {
|
|
2974
2974
|
const X = this.getGlobalTransform(i.id);
|
|
2975
2975
|
if (X) {
|
|
2976
|
-
const
|
|
2976
|
+
const tt = li(
|
|
2977
2977
|
l.points,
|
|
2978
2978
|
i.weights,
|
|
2979
2979
|
i.bindMatrices,
|
|
2980
2980
|
X,
|
|
2981
|
-
(
|
|
2981
|
+
(L) => this.getGlobalTransform(L)
|
|
2982
2982
|
);
|
|
2983
|
-
l = { ...l, points:
|
|
2983
|
+
l = { ...l, points: tt };
|
|
2984
2984
|
}
|
|
2985
2985
|
}
|
|
2986
2986
|
if (e.visible === !1)
|
|
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
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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,
|
|
3006
|
+
if (!this.isObjectInView(t, tt, L, a, r, ht))
|
|
3007
3007
|
continue;
|
|
3008
3008
|
}
|
|
3009
3009
|
this.debug_objectsRendered++, t.save();
|
|
3010
|
-
const bt = [],
|
|
3011
|
-
|
|
3012
|
-
const Et = n.effects || ((
|
|
3010
|
+
const bt = [], gt = n.blur || ((T = i.style) == null ? void 0 : T.blur);
|
|
3011
|
+
gt && gt.amount > 0 && bt.push(`blur(${gt.amount}px)`);
|
|
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 vt = It, Yt = (vt == null ? void 0 : vt.isEnabled) !== !1,
|
|
3016
|
-
Yt &&
|
|
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")),
|
|
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,
|
|
@@ -3025,35 +3025,35 @@ class ci {
|
|
|
3025
3025
|
blur: 0,
|
|
3026
3026
|
negative: 0,
|
|
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,
|
|
3031
|
-
let
|
|
3032
|
-
if (ht !== 0 && (
|
|
3033
|
-
<feComponentTransfer in="${
|
|
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
|
+
let xt = "", kt = "SourceGraphic";
|
|
3032
|
+
if (ht !== 0 && (xt += `
|
|
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>`,
|
|
3038
|
-
const Mt = (
|
|
3039
|
-
|
|
3040
|
-
<feComponentTransfer in="${
|
|
3037
|
+
</feComponentTransfer>`, kt = "exposure"), ut !== 0) {
|
|
3038
|
+
const Mt = (ut + 100) / 100, $ = 0.5 * (1 - Mt);
|
|
3039
|
+
xt += `
|
|
3040
|
+
<feComponentTransfer in="${kt}" result="contrast">
|
|
3041
3041
|
<feFuncR type="linear" slope="${Mt}" intercept="${$}"/>
|
|
3042
3042
|
<feFuncG type="linear" slope="${Mt}" intercept="${$}"/>
|
|
3043
3043
|
<feFuncB type="linear" slope="${Mt}" intercept="${$}"/>
|
|
3044
|
-
</feComponentTransfer>`,
|
|
3044
|
+
</feComponentTransfer>`, kt = "contrast";
|
|
3045
3045
|
}
|
|
3046
|
-
if (at !== 1 && (
|
|
3046
|
+
if (at !== 1 && (xt += `<feColorMatrix in="${kt}" type="saturate" values="${at}" result="saturate"/>`, kt = "saturate"), dt.hue && (xt += `<feColorMatrix in="${kt}" type="hueRotate" values="${dt.hue}" result="hue"/>`, kt = "hue"), dt.negative) {
|
|
3047
3047
|
const Mt = 1 - dt.negative / 50;
|
|
3048
|
-
|
|
3049
|
-
<feColorMatrix in="${
|
|
3048
|
+
xt += `
|
|
3049
|
+
<feColorMatrix in="${kt}" type="matrix" result="invert"
|
|
3050
3050
|
values="${Mt} 0 0 0 ${1 - Mt}
|
|
3051
3051
|
0 ${Mt} 0 0 ${1 - Mt}
|
|
3052
3052
|
0 0 ${Mt} 0 ${1 - Mt}
|
|
3053
|
-
0 0 0 1 0"/>`,
|
|
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,
|
|
@@ -3075,10 +3075,10 @@ class ci {
|
|
|
3075
3075
|
1,
|
|
3076
3076
|
0
|
|
3077
3077
|
].join(" ");
|
|
3078
|
-
|
|
3078
|
+
xt += `<feColorMatrix in="${kt}" type="matrix" values="${Jt}" result="advanced"/>`, kt = "advanced";
|
|
3079
3079
|
}
|
|
3080
|
-
if (dt.blur && (
|
|
3081
|
-
const Mt = `<svg xmlns="http://www.w3.org/2000/svg"><filter id="f" color-interpolation-filters="sRGB">${
|
|
3080
|
+
if (dt.blur && (xt += `<feGaussianBlur in="${kt}" stdDeviation="${dt.blur}" result="blur"/>`, kt = "blur"), xt) {
|
|
3081
|
+
const Mt = `<svg xmlns="http://www.w3.org/2000/svg"><filter id="f" color-interpolation-filters="sRGB">${xt}</filter></svg>`, $ = btoa(Mt);
|
|
3082
3082
|
bt.push(`url('data:image/svg+xml;base64,${$}#f')`);
|
|
3083
3083
|
}
|
|
3084
3084
|
}
|
|
@@ -3130,71 +3130,70 @@ class ci {
|
|
|
3130
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],
|
|
3133
|
+
const ht = me[0], ut = o.get(ht.maskId), at = this.objectStates.get(ut.id);
|
|
3134
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(
|
|
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(
|
|
3144
3144
|
D * Ae,
|
|
3145
3145
|
q * xe
|
|
3146
3146
|
), n.shadow && n.shadow.isEnabled !== !0 && ((n.shadow.blur || 0) > 0 || Math.abs(n.shadow.offsetX || 0) > 0 || Math.abs(n.shadow.offsetY || 0) > 0) && (n.shadow.isEnabled = !0);
|
|
3147
|
-
const
|
|
3148
|
-
if (
|
|
3149
|
-
let ht =
|
|
3147
|
+
const se = n.shadow;
|
|
3148
|
+
if (se && se.isEnabled !== !1) {
|
|
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
|
-
const
|
|
3155
|
-
|
|
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
|
+
Q = `rgba(${At}, ${Mt}, ${$}, ${ut})`;
|
|
3156
3156
|
} else if (ht.startsWith("rgba")) {
|
|
3157
|
-
const
|
|
3158
|
-
if (
|
|
3159
|
-
const
|
|
3160
|
-
|
|
3157
|
+
const kt = ht.match(/[\d.]+/g);
|
|
3158
|
+
if (kt && kt.length >= 4) {
|
|
3159
|
+
const At = kt[0], Mt = kt[1], $ = kt[2], Wt = kt[3];
|
|
3160
|
+
Q = `rgba(${At}, ${Mt}, ${$}, ${parseFloat(Wt) * ut})`;
|
|
3161
3161
|
}
|
|
3162
3162
|
}
|
|
3163
|
-
const
|
|
3164
|
-
t.shadowColor =
|
|
3165
|
-
}
|
|
3166
|
-
t.shadowColor = "transparent", t.shadowBlur = 0, t.shadowOffsetX = 0, t.shadowOffsetY = 0;
|
|
3163
|
+
const Pt = t.getTransform(), xt = Math.sqrt(Pt.a * Pt.a + Pt.b * Pt.b) || 1;
|
|
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
|
-
},
|
|
3186
|
-
const at = n.stroke && n.stroke.width > 0 && n.stroke.isEnabled !== !1, B = (((
|
|
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));
|
|
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,
|
|
@@ -3213,17 +3212,17 @@ class ci {
|
|
|
3213
3212
|
B.trimEnd ?? 1,
|
|
3214
3213
|
B.trimOffset ?? 0,
|
|
3215
3214
|
B.dashOffset ?? 0
|
|
3216
|
-
].join("|") : "nostroke",
|
|
3215
|
+
].join("|") : "nostroke", kt = [
|
|
3217
3216
|
i.id,
|
|
3218
|
-
|
|
3219
|
-
|
|
3220
|
-
|
|
3217
|
+
ut.join("_"),
|
|
3218
|
+
Pt,
|
|
3219
|
+
xt,
|
|
3221
3220
|
e.opacity ?? 100,
|
|
3222
3221
|
e.visible !== !1 ? "v" : "h"
|
|
3223
3222
|
].join("_");
|
|
3224
|
-
let
|
|
3225
|
-
if (!
|
|
3226
|
-
|
|
3223
|
+
let At = this.imageCache.get(kt);
|
|
3224
|
+
if (!At) {
|
|
3225
|
+
At = new Image(), At.crossOrigin = "anonymous";
|
|
3227
3226
|
let $ = ht;
|
|
3228
3227
|
$.match(/xmlns=["']http:\/\/www\.w3\.org\/2000\/svg["']/i) || ($ = $.replace(/<svg([^>]*)>/i, (rt, V) => `<svg xmlns="http://www.w3.org/2000/svg"${V}>`));
|
|
3229
3228
|
let Wt = s.width || a || 100, Kt = s.height || r || 100;
|
|
@@ -3231,14 +3230,14 @@ class ci {
|
|
|
3231
3230
|
if (te && (Wt = parseFloat(te[1]), Kt = parseFloat(te[2])), $ = $.replace(/<svg([^>]*)>/i, (rt, V) => {
|
|
3232
3231
|
let it = V.replace(/\b(?:width|height)=["'][^"']*["']/gi, " ");
|
|
3233
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}>`;
|
|
3234
|
-
}), s.colors && s.colors.length > 0 &&
|
|
3235
|
-
if (
|
|
3233
|
+
}), s.colors && s.colors.length > 0 && ut.length > 0 && s.colors.forEach((rt, V) => {
|
|
3234
|
+
if (ut[V]) {
|
|
3236
3235
|
const it = rt.replace(/[-\/\\^$*+?.()|[\]{}]/g, "\\$&"), nt = new RegExp(it, "gi");
|
|
3237
|
-
$ = $.replace(nt,
|
|
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 =
|
|
3240
|
+
const rt = Q ? "#FFFFFF" : at.color, V = Q ? 1 : this.normalizeOpacity(at.opacity ?? 100);
|
|
3242
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
3243
|
const rt = "exode-fill", V = this.normalizeOpacity(at.opacity ?? 100), it = (at.stops || []).map((St) => {
|
|
@@ -3267,9 +3266,9 @@ class ci {
|
|
|
3267
3266
|
}
|
|
3268
3267
|
const Xt = St(rt.center, 0, 0.5) * 100, Qt = St(rt.center, 1, 0.5) * 100, oe = (rt.radius ?? 0.5) * 100;
|
|
3269
3268
|
return `<radialGradient id="${V}" cx="${Xt}%" cy="${Qt}%" r="${oe}%" gradientUnits="objectBoundingBox">${nt}</radialGradient>`;
|
|
3270
|
-
},
|
|
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 =
|
|
3271
|
+
const rt = Q ? 1 : this.normalizeOpacity(B.opacity ?? 100), V = Q ? "#FFFFFF" : B.color || (at == null ? void 0 : at.color) || "#000000";
|
|
3273
3272
|
let it = "";
|
|
3274
3273
|
const nt = B.fill;
|
|
3275
3274
|
if (nt && nt.type) {
|
|
@@ -3277,7 +3276,7 @@ class ci {
|
|
|
3277
3276
|
it = nt.color || B.color || "#000000";
|
|
3278
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(
|
|
@@ -3297,11 +3296,11 @@ class ci {
|
|
|
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,
|
|
3303
|
+
const zt = Math.max(0, Math.min(1, Le)), ae = Math.max(0, Math.min(1, Oe));
|
|
3305
3304
|
this.frameCount % 600 === 0 && this.debugLog(`SVG Trim - Object: ${i.name || i.id}, Start: ${zt}, End: ${ae}`);
|
|
3306
3305
|
const we = (St + Xt) * 2, Be = (Fe % 1 + 1) % 1, We = ($e % 1 + 1) % 1;
|
|
3307
3306
|
let de = "", ce = 0;
|
|
@@ -3319,7 +3318,7 @@ class ci {
|
|
|
3319
3318
|
if (!/\bstroke\s*=\s*["']/i.test(ht) && !new RegExp("(?<![a-z-])stroke\\s*:", "i").test(ht)) {
|
|
3320
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
3323
|
zt = ` stroke-dasharray="0 ${he}"`, ae = ' stroke-dashoffset="0"';
|
|
3325
3324
|
else {
|
|
@@ -3335,19 +3334,19 @@ class ci {
|
|
|
3335
3334
|
}
|
|
3336
3335
|
} else B && B.isEnabled === !1 && ($ = $.replace(/\bstroke\s*=\s*["'][^"']*["']/gi, 'stroke="none"'), $ = $.replace(new RegExp(`(?<![a-z-])stroke\\s*:\\s*(?!none|transparent)[^;"')]+`, "gi"), "stroke:none"));
|
|
3337
3336
|
const ct = new Blob([$], { type: "image/svg+xml" }), Ct = URL.createObjectURL(ct);
|
|
3338
|
-
|
|
3337
|
+
At.onload = () => {
|
|
3339
3338
|
if (URL.revokeObjectURL(Ct), this.frameCount % 900 === 0) {
|
|
3340
|
-
const rt = this.imageCache.get(
|
|
3339
|
+
const rt = this.imageCache.get(kt);
|
|
3341
3340
|
rt && this.debugLog(`SVG Payload Ready: ${i.name || i.id} (${rt.naturalWidth}x${rt.naturalHeight})`);
|
|
3342
3341
|
}
|
|
3343
|
-
},
|
|
3342
|
+
}, At.onerror = () => {
|
|
3344
3343
|
URL.revokeObjectURL(Ct), this.debugLog(`SVG Error: Failed to load payload for ${i.name || i.id}`);
|
|
3345
|
-
},
|
|
3344
|
+
}, At.src = Ct, this.imageCache.set(kt, At);
|
|
3346
3345
|
}
|
|
3347
3346
|
let Mt = null;
|
|
3348
|
-
if (
|
|
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,53 @@ 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
|
-
this.applyPath(t, l, a, r, f), t.save(), n.blur && n.blur.amount > 0 && (t.filter = `blur(${n.blur.amount}px)`)
|
|
3361
|
-
const ht = Yt && se === "BackgroundBlur";
|
|
3362
|
-
if (ht)
|
|
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")
|
|
3363
3360
|
this.applyBackgroundBlurGlass(t, l, a, r, f, vt);
|
|
3364
3361
|
else if (n.fill) {
|
|
3365
|
-
const
|
|
3362
|
+
const ut = t.globalAlpha;
|
|
3366
3363
|
if (((F = n.fill) == null ? void 0 : F.type) === "Image" && (n.fill.originalSrc || n.fill.src)) {
|
|
3367
|
-
const
|
|
3368
|
-
let
|
|
3369
|
-
|
|
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());
|
|
3370
3367
|
} else {
|
|
3371
|
-
const
|
|
3372
|
-
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();
|
|
3373
3370
|
}
|
|
3374
|
-
t.globalAlpha =
|
|
3371
|
+
t.globalAlpha = ut;
|
|
3375
3372
|
}
|
|
3376
|
-
t.restore(), n.stroke && n.stroke.width > 0 &&
|
|
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));
|
|
3377
3374
|
} else if (i.type === "Frame" || i.type === "Group" && !i.isStructuralGroup) {
|
|
3378
|
-
const ht = e.width ?? s.width ?? i.width ?? a,
|
|
3379
|
-
t.save(), t.beginPath(), this.drawRoundRect(t, -ht / 2, -
|
|
3380
|
-
|
|
3381
|
-
if (B)
|
|
3382
|
-
this.applyBackgroundBlurGlass(t, K, ht, mt, at, vt);
|
|
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);
|
|
3383
3378
|
else if (n.fill && n.fill.type !== "None") {
|
|
3384
|
-
const
|
|
3385
|
-
t.fillStyle =
|
|
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;
|
|
3386
3381
|
}
|
|
3387
|
-
t.restore(), n.stroke && n.stroke.width > 0 && n.stroke.isEnabled !== !1
|
|
3388
|
-
|
|
3389
|
-
|
|
3390
|
-
|
|
3382
|
+
if (t.restore(), n.stroke && n.stroke.width > 0 && n.stroke.isEnabled !== !1) {
|
|
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);
|
|
3385
|
+
}
|
|
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));
|
|
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;
|
|
3391
3389
|
if (t.save(), at) {
|
|
3392
3390
|
t.beginPath();
|
|
3393
|
-
const
|
|
3394
|
-
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();
|
|
3395
3393
|
}
|
|
3396
3394
|
let B = 0;
|
|
3397
|
-
for (i.children.forEach((
|
|
3398
|
-
const
|
|
3399
|
-
if (!
|
|
3400
|
-
const
|
|
3401
|
-
if (
|
|
3402
|
-
const
|
|
3403
|
-
this.applyObjectTransform(t,
|
|
3404
|
-
const Mt = (
|
|
3405
|
-
this.applyPath(t,
|
|
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;
|
|
3399
|
+
if (xt && xt.isMask && (Pt == null ? void 0 : Pt.visible) !== !1) {
|
|
3400
|
+
const kt = xt.width || 0, At = xt.height || 0;
|
|
3401
|
+
this.applyObjectTransform(t, et);
|
|
3402
|
+
const Mt = (Pt == null ? void 0 : Pt.corner_radius) ?? (xt == null ? void 0 : xt.corner_radius) ?? 0;
|
|
3403
|
+
this.applyPath(t, xt, kt, At, Mt), t.clip(), B++;
|
|
3406
3404
|
} else
|
|
3407
|
-
this.renderObject(t,
|
|
3405
|
+
this.renderObject(t, Q, o);
|
|
3408
3406
|
}); B > 0; )
|
|
3409
3407
|
t.restore(), B--;
|
|
3410
3408
|
t.restore();
|
|
@@ -3419,23 +3417,23 @@ class ci {
|
|
|
3419
3417
|
isVisible: !0
|
|
3420
3418
|
}] : [])).filter((B) => B.isVisible !== !1 && o.has(B.maskId)).forEach((B) => {
|
|
3421
3419
|
var Mt, $, Wt, Kt, te, Jt;
|
|
3422
|
-
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;
|
|
3423
3421
|
if ((B.type || "alpha") === "luma") {
|
|
3424
|
-
(!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,
|
|
3425
|
-
const
|
|
3426
|
-
if (((Mt =
|
|
3427
|
-
const nt =
|
|
3428
|
-
this._renderText(this.lumaCtx,
|
|
3429
|
-
} else if ((($ =
|
|
3430
|
-
const nt =
|
|
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;
|
|
3431
3429
|
if (nt) {
|
|
3432
3430
|
let St = this.imageCache.get(nt);
|
|
3433
|
-
St || (St = new Image(), St.src = nt, this.imageCache.set(nt, St)), St.complete && St.naturalWidth > 0 ? this.lumaCtx.drawImage(St, -
|
|
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());
|
|
3434
3432
|
}
|
|
3435
|
-
} else if (((Wt =
|
|
3436
|
-
const nt =
|
|
3433
|
+
} else if (((Wt = et.geometry) == null ? void 0 : Wt.type) === "SVG") {
|
|
3434
|
+
const nt = et.geometry.svgContent;
|
|
3437
3435
|
if (nt) {
|
|
3438
|
-
const St = `__lumamask_${
|
|
3436
|
+
const St = `__lumamask_${et.id}`;
|
|
3439
3437
|
let Xt = this.imageCache.get(St);
|
|
3440
3438
|
if (!Xt) {
|
|
3441
3439
|
Xt = new Image();
|
|
@@ -3444,34 +3442,34 @@ class ci {
|
|
|
3444
3442
|
this.artboard && this.reset();
|
|
3445
3443
|
}, this.imageCache.set(St, Xt);
|
|
3446
3444
|
}
|
|
3447
|
-
Xt.complete && Xt.naturalWidth > 0 ? this.lumaCtx.drawImage(Xt, -
|
|
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());
|
|
3448
3446
|
}
|
|
3449
3447
|
} else
|
|
3450
|
-
this.applyPath(this.lumaCtx,
|
|
3448
|
+
this.applyPath(this.lumaCtx, et.geometry, pt, ct, Ct), this.lumaCtx.fillStyle = "#ffffff", this.lumaCtx.fill();
|
|
3451
3449
|
this.lumaCtx.restore();
|
|
3452
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;
|
|
3453
3451
|
for (let nt = 0; nt < it.length; nt += 4) {
|
|
3454
3452
|
const St = V[nt], Xt = V[nt + 1], Qt = V[nt + 2];
|
|
3455
3453
|
let oe = (0.299 * St + 0.587 * Xt + 0.114 * Qt) / 255;
|
|
3456
|
-
|
|
3454
|
+
xt && (oe = 1 - oe), it[nt + 3] *= oe;
|
|
3457
3455
|
}
|
|
3458
3456
|
this.maskCtx.putImageData(rt, 0, 0);
|
|
3459
3457
|
} else {
|
|
3460
|
-
this.maskCtx.save(), this.rootTransform && this.maskCtx.setTransform(this.rootTransform), this.maskCtx.globalCompositeOperation =
|
|
3461
|
-
const
|
|
3462
|
-
if (((Kt =
|
|
3463
|
-
const rt =
|
|
3464
|
-
this._renderText(this.maskCtx,
|
|
3465
|
-
} else if (((te =
|
|
3466
|
-
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;
|
|
3467
3465
|
if (rt) {
|
|
3468
3466
|
let V = this.imageCache.get(rt);
|
|
3469
|
-
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());
|
|
3470
3468
|
}
|
|
3471
|
-
} else if (((Jt =
|
|
3472
|
-
const rt =
|
|
3469
|
+
} else if (((Jt = et.geometry) == null ? void 0 : Jt.type) === "SVG") {
|
|
3470
|
+
const rt = et.geometry.svgContent;
|
|
3473
3471
|
if (rt) {
|
|
3474
|
-
const V = `__alphamask_${
|
|
3472
|
+
const V = `__alphamask_${et.id}`;
|
|
3475
3473
|
let it = this.imageCache.get(V);
|
|
3476
3474
|
if (!it) {
|
|
3477
3475
|
it = new Image();
|
|
@@ -3480,10 +3478,10 @@ class ci {
|
|
|
3480
3478
|
this.artboard && this.reset();
|
|
3481
3479
|
}, this.imageCache.set(V, it);
|
|
3482
3480
|
}
|
|
3483
|
-
it.complete && it.naturalWidth > 0 ? this.maskCtx.drawImage(it, -
|
|
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());
|
|
3484
3482
|
}
|
|
3485
3483
|
} else
|
|
3486
|
-
this.applyPath(this.maskCtx,
|
|
3484
|
+
this.applyPath(this.maskCtx, et.geometry, pt, ct, Ct), this.maskCtx.fillStyle = "#ffffff", this.maskCtx.fill();
|
|
3487
3485
|
this.maskCtx.restore();
|
|
3488
3486
|
}
|
|
3489
3487
|
}), Ot.save(), Ot.setTransform(1, 0, 0, 1, 0, 0);
|
|
@@ -3494,7 +3492,7 @@ class ci {
|
|
|
3494
3492
|
}
|
|
3495
3493
|
}
|
|
3496
3494
|
_renderText(t, i, o, e, s, n, a, r = !1, h = !1, f = 1, l = 1) {
|
|
3497
|
-
var yt, bt,
|
|
3495
|
+
var yt, bt, gt, Et, It, vt, Yt, ie, fe;
|
|
3498
3496
|
let p = o.text || "";
|
|
3499
3497
|
if (o.textInputId && !r) {
|
|
3500
3498
|
const st = this.inputs.get(o.textInputId);
|
|
@@ -3503,10 +3501,10 @@ class ci {
|
|
|
3503
3501
|
if (o.svgPath) {
|
|
3504
3502
|
const st = o.svgPath;
|
|
3505
3503
|
t.save();
|
|
3506
|
-
const
|
|
3507
|
-
t.fillStyle =
|
|
3508
|
-
const
|
|
3509
|
-
t.fill(
|
|
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);
|
|
3507
|
+
t.fill(_t), t.restore();
|
|
3510
3508
|
return;
|
|
3511
3509
|
}
|
|
3512
3510
|
let c = p || "";
|
|
@@ -3519,8 +3517,8 @@ class ci {
|
|
|
3519
3517
|
let y = o.fontFamily || "Inter";
|
|
3520
3518
|
const S = ["Bold", "SemiBold", "Medium", "Regular", "Light", "Thin", "ExtraBold", "Black", "Italic"];
|
|
3521
3519
|
S.forEach((st) => {
|
|
3522
|
-
const
|
|
3523
|
-
|
|
3520
|
+
const mt = new RegExp(`[\\s-]${st}$`, "i");
|
|
3521
|
+
mt.test(y) && (y = y.replace(mt, "").trim());
|
|
3524
3522
|
});
|
|
3525
3523
|
const M = `${o.smallCaps === !0 ? "small-caps " : ""}${v} ${b} ${m}px "${y}", sans-serif`;
|
|
3526
3524
|
t.font = M;
|
|
@@ -3536,8 +3534,8 @@ class ci {
|
|
|
3536
3534
|
T = st.unit === "PERCENT" ? st.value / 100 * m : st.value;
|
|
3537
3535
|
}
|
|
3538
3536
|
t.letterSpacing !== void 0 && (t.letterSpacing = `${T}px`);
|
|
3539
|
-
const
|
|
3540
|
-
|
|
3537
|
+
const R = o.kerning || "auto", P = o.kerningValue || 0;
|
|
3538
|
+
R === "manual" && P !== 0 && (t.letterSpacing = `${T + P}px`);
|
|
3541
3539
|
const _ = o.paragraphSpacing || 0;
|
|
3542
3540
|
let E = o.lineHeight ?? 1.2;
|
|
3543
3541
|
typeof E == "string" && (E = parseFloat(E)), E > 5 && m > 0 && (E = E / m);
|
|
@@ -3560,34 +3558,34 @@ class ci {
|
|
|
3560
3558
|
hyphenation: o.hyphenation,
|
|
3561
3559
|
composer: o.composer,
|
|
3562
3560
|
balanceRaggedLines: o.balanceRaggedLines
|
|
3563
|
-
}), N = G.lines || [],
|
|
3564
|
-
let
|
|
3565
|
-
if (X === 0 ||
|
|
3566
|
-
let st = 0,
|
|
3567
|
-
const
|
|
3568
|
-
(N || []).forEach((
|
|
3569
|
-
const dt =
|
|
3570
|
-
Ft > st && (st = Ft),
|
|
3571
|
-
` ||
|
|
3572
|
-
` &&
|
|
3573
|
-
}), (X === 0 || X >= 1e5) && (X = st),
|
|
3561
|
+
}), N = G.lines || [], J = G.maxFontSize || m, x = this.fontLeadingFactors[y] ?? 0.5, F = (A - m) * x;
|
|
3562
|
+
let j = G.height, X = n, tt = a;
|
|
3563
|
+
if (X === 0 || tt === 0 || X >= 1e5) {
|
|
3564
|
+
let st = 0, mt = 0;
|
|
3565
|
+
const Lt = G.fullText || c;
|
|
3566
|
+
(N || []).forEach((_t) => {
|
|
3567
|
+
const dt = _t.text || "", Ft = t.measureText(dt).width + (dt.length > 0 ? (dt.length - 1) * T : 0);
|
|
3568
|
+
Ft > st && (st = Ft), mt += dt.length, mt < Lt.length && (Lt[mt] === `
|
|
3569
|
+
` || Lt[mt] === "\r") && (mt++, Lt[mt - 1] === "\r" && Lt[mt] === `
|
|
3570
|
+
` && mt++);
|
|
3571
|
+
}), (X === 0 || X >= 1e5) && (X = st), tt === 0 && (tt = j || 0);
|
|
3574
3572
|
}
|
|
3575
|
-
let
|
|
3576
|
-
a > 0 && a >
|
|
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;
|
|
3577
3575
|
let O = null, D = 0;
|
|
3578
3576
|
if (o.pathId && this.artboard) {
|
|
3579
|
-
const st = this.artboard.objects.find((
|
|
3577
|
+
const st = this.artboard.objects.find((mt) => mt.id === o.pathId);
|
|
3580
3578
|
if (st && st.type === "Shape" && ((Yt = st.geometry) == null ? void 0 : Yt.type) === "Path") {
|
|
3581
|
-
const
|
|
3582
|
-
O = { geo:
|
|
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);
|
|
3583
3581
|
}
|
|
3584
3582
|
}
|
|
3585
|
-
const q = (st,
|
|
3586
|
-
var
|
|
3587
|
-
if (T === 0 && (!o.enableSegments || !((
|
|
3588
|
-
let
|
|
3583
|
+
const q = (st, mt) => {
|
|
3584
|
+
var _t, dt;
|
|
3585
|
+
if (T === 0 && (!o.enableSegments || !((_t = o.segments) != null && _t.length))) return t.measureText(st).width;
|
|
3586
|
+
let Lt = 0;
|
|
3589
3587
|
for (let Ft = 0; Ft < st.length; Ft++) {
|
|
3590
|
-
const Dt =
|
|
3588
|
+
const Dt = mt + Ft;
|
|
3591
3589
|
let $t = 0;
|
|
3592
3590
|
if (o.enableSegments === !0 && ((dt = o.segments) == null ? void 0 : dt.length) > 0) {
|
|
3593
3591
|
let Ot = 0, Vt = null;
|
|
@@ -3607,40 +3605,40 @@ class ci {
|
|
|
3607
3605
|
$t = t.measureText(st[Ft]).width;
|
|
3608
3606
|
} else
|
|
3609
3607
|
$t = t.measureText(st[Ft]).width;
|
|
3610
|
-
|
|
3608
|
+
Lt += $t + T;
|
|
3611
3609
|
}
|
|
3612
|
-
return
|
|
3613
|
-
}, ot = (st,
|
|
3610
|
+
return Lt - (st.length > 0 ? T : 0);
|
|
3611
|
+
}, ot = (st, mt, Lt, _t, dt) => {
|
|
3614
3612
|
var me, ye;
|
|
3615
3613
|
const Dt = (dt === 0 || c[dt - 1] === `
|
|
3616
3614
|
` || c[dt - 1] === "\r") && o.paragraphIndent ? o.paragraphIndent : 0, $t = (!r || h) && (i.behaviors || []).some(
|
|
3617
3615
|
(Ut) => Ut.enabled && (Ut.type.toString().includes("Text") || ["Typewriter", "Scramble", "Wave", "Bounce", "GlitchText", "Reveal3D", "RevealSlide", "RevealBlur"].includes(Ut.type))
|
|
3618
|
-
), Ot = !o.pathId && !$t && (o.enableSegments !== !0 || !o.segments || o.segments.length === 0), Vt = o.baselineShift || 0, ne =
|
|
3616
|
+
), Ot = !o.pathId && !$t && (o.enableSegments !== !0 || !o.segments || o.segments.length === 0), Vt = o.baselineShift || 0, ne = Lt + Vt;
|
|
3619
3617
|
if (Ot)
|
|
3620
|
-
t.font = M,
|
|
3618
|
+
t.font = M, _t ? t.strokeText(st, mt + Dt, ne) : t.fillText(st, mt + Dt, ne);
|
|
3621
3619
|
else {
|
|
3622
3620
|
const Ut = q(st, dt);
|
|
3623
|
-
let Se =
|
|
3621
|
+
let Se = mt + Dt;
|
|
3624
3622
|
k === "center" ? Se -= Ut / 2 : k === "right" && (Se -= Ut);
|
|
3625
3623
|
const Pe = dt + st.length >= c.length || c[dt + st.length] === `
|
|
3626
3624
|
` || c[dt + st.length] === "\r";
|
|
3627
3625
|
let Ee = 0, Ce = 0;
|
|
3628
3626
|
const Ae = o.justifyMinWordSpacing, xe = o.justifyMaxWordSpacing;
|
|
3629
3627
|
if (k === "justify" && !Pe && Ut > 0 && !o.pathId) {
|
|
3630
|
-
const
|
|
3628
|
+
const ut = W ? Ut : Y - z * 2 + 0, at = Math.max(0, ut - Ut);
|
|
3631
3629
|
for (let B = 0; B < st.length; B++)
|
|
3632
3630
|
st[B] === " " && Ce++;
|
|
3633
3631
|
if (Ce > 0) {
|
|
3634
3632
|
const B = t.measureText(" ").width;
|
|
3635
|
-
let
|
|
3636
|
-
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));
|
|
3637
3635
|
}
|
|
3638
3636
|
}
|
|
3639
|
-
let
|
|
3640
|
-
o.pathId && D > 0 && O && (k === "center" ?
|
|
3637
|
+
let se = o.pathOffset || 0;
|
|
3638
|
+
o.pathId && D > 0 && O && (k === "center" ? se += D / 2 - Ut / 2 : k === "right" && (se += D - Ut));
|
|
3641
3639
|
let jt = Se;
|
|
3642
3640
|
const ht = r && !h ? [] : ((me = i.behaviors) == null ? void 0 : me.filter(
|
|
3643
|
-
(
|
|
3641
|
+
(ut) => [
|
|
3644
3642
|
U.Typewriter,
|
|
3645
3643
|
U.Scramble,
|
|
3646
3644
|
U.Wave,
|
|
@@ -3670,117 +3668,117 @@ class ci {
|
|
|
3670
3668
|
U.TextZing,
|
|
3671
3669
|
U.TextPerspective,
|
|
3672
3670
|
U.TextMirror
|
|
3673
|
-
].includes(
|
|
3671
|
+
].includes(ut.type) && ut.enabled
|
|
3674
3672
|
)) || [];
|
|
3675
|
-
for (let
|
|
3676
|
-
let at = st[
|
|
3677
|
-
const B = dt +
|
|
3678
|
-
let
|
|
3679
|
-
ht.forEach((
|
|
3680
|
-
const ct =
|
|
3681
|
-
if (
|
|
3682
|
-
this.currentTime * (ct.speed || 1) - B * (ct.stagger || 0.05) < 0 && (
|
|
3683
|
-
else 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)
|
|
3680
|
+
this.currentTime * (ct.speed || 1) - B * (ct.stagger || 0.05) < 0 && (At = 0);
|
|
3681
|
+
else if (pt.type === U.Scramble)
|
|
3684
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)]);
|
|
3685
|
-
else if (
|
|
3686
|
-
|
|
3687
|
-
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) {
|
|
3688
3686
|
const V = Math.max(0, this.currentTime % 2 - B * (ct.stagger || 0.1));
|
|
3689
|
-
V < 1 && (
|
|
3690
|
-
} else if (
|
|
3687
|
+
V < 1 && (Q -= Math.abs(Math.sin(V * Math.PI)) * (ct.height || 50) * Ct);
|
|
3688
|
+
} else if (pt.type === U.TextTrail) {
|
|
3691
3689
|
const V = this.pointerHistory[Math.max(0, this.pointerHistory.length - 1 - B * (ct.delay || 5))];
|
|
3692
|
-
V && (
|
|
3693
|
-
} 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) {
|
|
3694
3692
|
const V = Math.max(0, Math.min(1, this.currentTime * (ct.speed || 1) - B * (ct.stagger || 0.1)));
|
|
3695
|
-
|
|
3696
|
-
} else if (
|
|
3693
|
+
Pt *= V, xt *= V, At = V;
|
|
3694
|
+
} else if (pt.type === U.RevealSlide) {
|
|
3697
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";
|
|
3698
|
-
nt === "up" ?
|
|
3699
|
-
} else if (
|
|
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) {
|
|
3700
3698
|
const V = Math.max(0, Math.min(1, this.currentTime * 1.2 - B * 0.1));
|
|
3701
|
-
|
|
3702
|
-
} else if (
|
|
3699
|
+
At = V, et += (1 - V) * 5;
|
|
3700
|
+
} else if (pt.type === U.TextLiquid) {
|
|
3703
3701
|
const V = Math.max(0, Math.sin(rt * 1e-3 * (ct.speed || 1) + B * 0.5));
|
|
3704
|
-
|
|
3705
|
-
} else if (
|
|
3702
|
+
Q += V * (ct.amplitude || 10) * Ct, xt *= 1 + V * 0.2;
|
|
3703
|
+
} else if (pt.type === U.TextVortex) {
|
|
3706
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);
|
|
3707
|
-
|
|
3708
|
-
} else if (
|
|
3705
|
+
et += Math.cos(V) * it * Ct, Q += Math.sin(V) * it * Ct;
|
|
3706
|
+
} else if (pt.type === U.TextExplosion) {
|
|
3709
3707
|
const V = ct.force || 1, it = this.currentTime % 2;
|
|
3710
3708
|
if (it < 1) {
|
|
3711
3709
|
const nt = (B / st.length - 0.5) * Math.PI * 2, St = it * 100 * V;
|
|
3712
|
-
|
|
3710
|
+
et += Math.cos(nt) * St * Ct, Q += Math.sin(nt) * St * Ct, At = 1 - it;
|
|
3713
3711
|
}
|
|
3714
|
-
} else if (
|
|
3712
|
+
} else if (pt.type === U.TextRain) {
|
|
3715
3713
|
const V = ct.speed || 1, it = ct.height || 100, nt = (rt * 1e-3 * V + B * 0.1) % 1;
|
|
3716
|
-
|
|
3717
|
-
} else if (
|
|
3714
|
+
Q -= (1 - nt) * it * Ct, At = nt > 0.1 ? 1 : nt * 10;
|
|
3715
|
+
} else if (pt.type === U.TextGravity) {
|
|
3718
3716
|
const V = ct.gravity || 9.8, it = this.currentTime % 3 / 3, nt = 0.5 * V * Math.pow(it * 10, 2);
|
|
3719
|
-
nt < 100 ?
|
|
3720
|
-
} else if (
|
|
3717
|
+
nt < 100 ? Q += nt * Ct : Q += 100 * Ct;
|
|
3718
|
+
} else if (pt.type === U.TextMatrix) {
|
|
3721
3719
|
const V = ct.speed || 1;
|
|
3722
3720
|
if (Math.random() < 0.1 * V) {
|
|
3723
3721
|
const nt = "0123456789ABCDEF!@#$%^&*";
|
|
3724
3722
|
Mt = nt[Math.floor(Math.random() * nt.length)];
|
|
3725
3723
|
}
|
|
3726
|
-
|
|
3727
|
-
} else if (
|
|
3724
|
+
At = 0.3 + (Math.sin(rt * 0.01 * V + B) + 1) / 2 * 0.7;
|
|
3725
|
+
} else if (pt.type === U.TextNeon) {
|
|
3728
3726
|
const V = Math.random() > 0.95 ? 0.5 : 1;
|
|
3729
|
-
|
|
3730
|
-
} else if (
|
|
3731
|
-
Math.sin(B * 1.5 + rt * 2e-3 * (ct.speed || 1)) > 0.5 && (
|
|
3732
|
-
else if (
|
|
3727
|
+
At = (0.7 + (Math.sin(rt * 5e-3) + 1) / 2 * 0.3) * V;
|
|
3728
|
+
} else if (pt.type === U.TextDissolve)
|
|
3729
|
+
Math.sin(B * 1.5 + rt * 2e-3 * (ct.speed || 1)) > 0.5 && (At = 0);
|
|
3730
|
+
else if (pt.type === U.TextOrganic) {
|
|
3733
3731
|
const V = ct.speed || 1, it = ct.amplitude || 10;
|
|
3734
|
-
|
|
3735
|
-
} else if (
|
|
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) {
|
|
3736
3734
|
const it = 1 + (Math.sin(rt * 3e-3 + B * 0.2) + 1) / 2 * 0.2 * Ct;
|
|
3737
|
-
|
|
3738
|
-
} else if (
|
|
3735
|
+
Pt *= it, xt *= it;
|
|
3736
|
+
} else if (pt.type === U.TextSpin) {
|
|
3739
3737
|
const V = ct.speed || 1;
|
|
3740
|
-
|
|
3741
|
-
} else if (
|
|
3738
|
+
kt += rt * 0.01 * V + B;
|
|
3739
|
+
} else if (pt.type === U.TextMagnet) {
|
|
3742
3740
|
const V = this.pointerHistory[this.pointerHistory.length - 1];
|
|
3743
3741
|
if (V) {
|
|
3744
|
-
const it = V.x - (s.x + jt), nt = V.y - (s.y +
|
|
3745
|
-
|
|
3742
|
+
const it = V.x - (s.x + jt), nt = V.y - (s.y + Lt);
|
|
3743
|
+
kt = Math.atan2(nt, it);
|
|
3746
3744
|
}
|
|
3747
|
-
} else if (
|
|
3745
|
+
} else if (pt.type === U.TextPerspective) {
|
|
3748
3746
|
const V = st.length / 2, it = (B - V) / V, nt = 1 - Math.abs(it) * 0.3 * Ct;
|
|
3749
|
-
|
|
3750
|
-
} else if (
|
|
3751
|
-
|
|
3752
|
-
else if (
|
|
3747
|
+
Pt *= nt, xt *= nt, et += it * 20 * Ct;
|
|
3748
|
+
} else if (pt.type === U.TextMirror)
|
|
3749
|
+
At *= 0.8;
|
|
3750
|
+
else if (pt.type === U.TextFloral) {
|
|
3753
3751
|
const V = ct.speed || 1, it = ct.stagger || 0.1, nt = (rt * 1e-3 * V + B * it) % 2;
|
|
3754
|
-
nt < 1 && (
|
|
3755
|
-
} else if (
|
|
3752
|
+
nt < 1 && (Pt *= nt, xt *= nt, kt += nt * Math.PI);
|
|
3753
|
+
} else if (pt.type === U.TextSmoke) {
|
|
3756
3754
|
const V = ct.speed || 1, it = ct.height || 50, nt = (rt * 5e-4 * V + B * 0.2) % 1;
|
|
3757
|
-
|
|
3758
|
-
} else if (
|
|
3755
|
+
Q -= nt * it * Ct, et += Math.sin(rt * 2e-3 + B) * 5 * Ct, At = 1 - nt;
|
|
3756
|
+
} else if (pt.type === U.TextVariable) {
|
|
3759
3757
|
const V = ct.speed || 1, it = ct.intensity || 1.5, nt = (Math.sin(rt * 4e-3 * V + B * 0.3) + 1) / 2;
|
|
3760
|
-
|
|
3761
|
-
} else if (
|
|
3758
|
+
Pt *= 1 + nt * (it - 1) * Ct;
|
|
3759
|
+
} else if (pt.type === U.TextZing) {
|
|
3762
3760
|
const V = ct.speed || 2, it = ct.distance || 100, nt = (rt * 2e-3 * V + B * 0.05) % 1;
|
|
3763
|
-
|
|
3764
|
-
} else if (
|
|
3761
|
+
et += (1 - nt) * it * Ct, At = nt;
|
|
3762
|
+
} else if (pt.type === U.TextElastic) {
|
|
3765
3763
|
const V = ct.stiffness || 0.2, it = ct.damping || 0.1, nt = Math.sin(rt * 0.01) * Math.exp(-rt * 1e-3 * it);
|
|
3766
|
-
|
|
3767
|
-
} else if (
|
|
3764
|
+
xt *= 1 + nt * V * Ct;
|
|
3765
|
+
} else if (pt.type === U.TextGlitch3D) {
|
|
3768
3766
|
const V = ct.intensity || 5;
|
|
3769
|
-
Math.random() < 0.2 && (
|
|
3770
|
-
} 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) {
|
|
3771
3769
|
const V = ct.intensity || 5;
|
|
3772
|
-
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));
|
|
3773
3771
|
}
|
|
3774
3772
|
});
|
|
3775
3773
|
let $ = null, Wt = o.textDecoration || "none", Kt = m;
|
|
3776
3774
|
if (o.enableSegments === !0 && ((ye = o.segments) == null ? void 0 : ye.length) > 0) {
|
|
3777
|
-
let
|
|
3775
|
+
let pt = 0, ct = null;
|
|
3778
3776
|
for (const Ct of o.segments) {
|
|
3779
|
-
if (B <
|
|
3777
|
+
if (B < pt + (Ct.text || "").length) {
|
|
3780
3778
|
ct = Ct;
|
|
3781
3779
|
break;
|
|
3782
3780
|
}
|
|
3783
|
-
|
|
3781
|
+
pt += (Ct.text || "").length;
|
|
3784
3782
|
}
|
|
3785
3783
|
if (ct) {
|
|
3786
3784
|
let Ct = ct.fontFamily || o.fontFamily || "Inter";
|
|
@@ -3789,110 +3787,110 @@ class ci {
|
|
|
3789
3787
|
nt.test(Ct) && (Ct = Ct.replace(nt, "").trim());
|
|
3790
3788
|
});
|
|
3791
3789
|
const rt = this.mapFontWeight((ct.fontWeight || o.fontWeight || "400").toString()), V = ct.fontStyle || v;
|
|
3792
|
-
Kt = ct.fontSize || m, t.font = `${V} ${rt} ${Kt}px "${Ct}", sans-serif`, ct.fill && ($ = ct.fill), ct.textDecoration && (Wt = ct.textDecoration), Kt <
|
|
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);
|
|
3793
3791
|
}
|
|
3794
3792
|
} else
|
|
3795
3793
|
t.font = M;
|
|
3796
3794
|
const te = t.globalAlpha;
|
|
3797
|
-
t.globalAlpha *=
|
|
3795
|
+
t.globalAlpha *= At, t.save();
|
|
3798
3796
|
const Jt = t.measureText(Mt).width;
|
|
3799
3797
|
if (O && D > 0) {
|
|
3800
|
-
const
|
|
3801
|
-
t.translate(rt.x + St +
|
|
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));
|
|
3802
3800
|
} else
|
|
3803
|
-
t.translate(jt +
|
|
3804
|
-
if (t.scale(
|
|
3805
|
-
const
|
|
3806
|
-
t.fillStyle =
|
|
3801
|
+
t.translate(jt + et + Jt / 2, Lt + Q), kt !== 0 && t.rotate(kt);
|
|
3802
|
+
if (t.scale(Pt, xt), $ && !r && !h) {
|
|
3803
|
+
const pt = this.createCanvasFill(t, $, X, tt);
|
|
3804
|
+
t.fillStyle = pt || $.color || "#000000";
|
|
3807
3805
|
} else if (!r && !h) {
|
|
3808
|
-
const
|
|
3809
|
-
t.fillStyle =
|
|
3806
|
+
const pt = this.createCanvasFill(t, e.fill, X, tt);
|
|
3807
|
+
t.fillStyle = pt || e.fill.color || "#000000";
|
|
3810
3808
|
}
|
|
3811
|
-
if (
|
|
3809
|
+
if (At > 0)
|
|
3812
3810
|
if (r || h) {
|
|
3813
|
-
const
|
|
3814
|
-
t.fillStyle =
|
|
3815
|
-
} else
|
|
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);
|
|
3813
|
+
} else _t ? t.strokeText(Mt, -Jt / 2, 0) : t.fillText(Mt, -Jt / 2, 0);
|
|
3816
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;
|
|
3817
3815
|
}
|
|
3818
3816
|
}
|
|
3819
3817
|
};
|
|
3820
3818
|
if (r) {
|
|
3821
|
-
let st = 0,
|
|
3822
|
-
(N || []).forEach((
|
|
3823
|
-
const
|
|
3819
|
+
let st = 0, mt = L;
|
|
3820
|
+
(N || []).forEach((Lt) => {
|
|
3821
|
+
const _t = Lt.text || "", dt = c.indexOf(_t, st);
|
|
3824
3822
|
dt !== -1 && (st = dt);
|
|
3825
3823
|
let Ft = -X / 2;
|
|
3826
|
-
k === "center" ? Ft = 0 : k === "right" && (Ft = X / 2), ot(
|
|
3824
|
+
k === "center" ? Ft = 0 : k === "right" && (Ft = X / 2), ot(_t, Ft, mt, !1, st), st += _t.length, mt += A;
|
|
3827
3825
|
});
|
|
3828
3826
|
} else if (h) {
|
|
3829
|
-
let st = 0,
|
|
3830
|
-
(N || []).forEach((
|
|
3831
|
-
const
|
|
3827
|
+
let st = 0, mt = L;
|
|
3828
|
+
(N || []).forEach((Lt) => {
|
|
3829
|
+
const _t = Lt.text || "";
|
|
3832
3830
|
let dt = -X / 2;
|
|
3833
|
-
k === "center" ? dt = 0 : k === "right" && (dt = X / 2), ot(
|
|
3831
|
+
k === "center" ? dt = 0 : k === "right" && (dt = X / 2), ot(_t, dt, mt, !1, st), st += _t.length, st < c.length && (c[st] === `
|
|
3834
3832
|
` || c[st] === "\r") && (st++, c[st - 1] === "\r" && c[st] === `
|
|
3835
|
-
` && st++),
|
|
3833
|
+
` && st++), mt += A;
|
|
3836
3834
|
});
|
|
3837
3835
|
} else {
|
|
3838
3836
|
if (e.fill) {
|
|
3839
|
-
const
|
|
3840
|
-
t.fillStyle =
|
|
3841
|
-
const
|
|
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);
|
|
3839
|
+
const _t = G.fullText || (o.enableSegments ? (o.segments || []).map((Dt) => {
|
|
3842
3840
|
let $t = Dt.text || "";
|
|
3843
3841
|
const Ot = Dt.textCase || o.textCase || "none";
|
|
3844
3842
|
return Ot === "uppercase" ? $t.toUpperCase() : Ot === "lowercase" ? $t.toLowerCase() : Ot === "capitalize" ? $t.replace(/\b\w/g, (Vt) => Vt.toUpperCase()) : $t;
|
|
3845
3843
|
}).join("") : c);
|
|
3846
|
-
let dt = 0, Ft =
|
|
3844
|
+
let dt = 0, Ft = L;
|
|
3847
3845
|
(N || []).forEach((Dt) => {
|
|
3848
3846
|
const $t = Dt.text || "";
|
|
3849
3847
|
let Ot = -X / 2;
|
|
3850
|
-
k === "center" ? Ot = 0 : k === "right" && (Ot = X / 2), ot($t, Ot, Ft, !1, dt), dt += $t.length, Ft += A, dt <
|
|
3851
|
-
` ||
|
|
3848
|
+
k === "center" ? Ot = 0 : k === "right" && (Ot = X / 2), ot($t, Ot, Ft, !1, dt), dt += $t.length, Ft += A, dt < _t.length && (_t[dt] === `
|
|
3849
|
+
` || _t[dt] === "\r") && (_ > 0 && (Ft += _), dt++, _t[dt - 1] === "\r" && _t[dt] === `
|
|
3852
3850
|
` && dt++);
|
|
3853
|
-
}), t.globalAlpha =
|
|
3851
|
+
}), t.globalAlpha = mt;
|
|
3854
3852
|
}
|
|
3855
3853
|
const st = o.paragraphRule;
|
|
3856
|
-
if (st && (((
|
|
3857
|
-
let
|
|
3858
|
-
(N || []).forEach((
|
|
3854
|
+
if (st && (((ie = st.top) == null ? void 0 : ie.width) > 0 || ((fe = st.bottom) == null ? void 0 : fe.width) > 0)) {
|
|
3855
|
+
let mt = 0;
|
|
3856
|
+
(N || []).forEach((Lt, _t) => {
|
|
3859
3857
|
var Dt, $t;
|
|
3860
|
-
const Ft =
|
|
3861
|
-
` || c[
|
|
3862
|
-
if (Ft &&
|
|
3858
|
+
const Ft = mt === 0 || mt < c.length && (c[mt] === `
|
|
3859
|
+
` || c[mt] === "\r");
|
|
3860
|
+
if (Ft && _t > 0 && mt++, Ft) {
|
|
3863
3861
|
if (((Dt = st.top) == null ? void 0 : Dt.width) > 0) {
|
|
3864
|
-
const Ot =
|
|
3862
|
+
const Ot = L + _t * A - st.top.offset;
|
|
3865
3863
|
t.strokeStyle = st.top.color || "#000000", t.lineWidth = st.top.width, t.beginPath();
|
|
3866
3864
|
const Vt = -n / 2 + A * 0.2;
|
|
3867
3865
|
t.moveTo(Vt, Ot), t.lineTo(n / 2 - A * 0.2, Ot), t.stroke();
|
|
3868
3866
|
}
|
|
3869
3867
|
if ((($t = st.bottom) == null ? void 0 : $t.width) > 0) {
|
|
3870
|
-
const Ot =
|
|
3868
|
+
const Ot = L + (_t + 1) * A - st.bottom.offset;
|
|
3871
3869
|
t.strokeStyle = st.bottom.color || "#000000", t.lineWidth = st.bottom.width, t.beginPath();
|
|
3872
3870
|
const Vt = -n / 2 + A * 0.2;
|
|
3873
3871
|
t.moveTo(Vt, Ot), t.lineTo(n / 2 - A * 0.2, Ot), t.stroke();
|
|
3874
3872
|
}
|
|
3875
3873
|
}
|
|
3876
|
-
|
|
3874
|
+
mt += (Lt.text || "").length;
|
|
3877
3875
|
});
|
|
3878
3876
|
}
|
|
3879
3877
|
if (e.stroke && e.stroke.width > 0) {
|
|
3880
|
-
const
|
|
3878
|
+
const mt = t.globalAlpha;
|
|
3881
3879
|
e.fill && e.fill.type !== "None" && e.fill.isEnabled !== !1 && e.fill.opacity !== 0 && e.fill.color !== "transparent" && e.fill.color !== "rgba(0,0,0,0)" && (t.shadowColor = "transparent", t.shadowBlur = 0, t.shadowOffsetX = 0, t.shadowOffsetY = 0), t.strokeStyle = e.stroke.color;
|
|
3882
|
-
let
|
|
3880
|
+
let _t = 1;
|
|
3883
3881
|
if (this.rootTransform) {
|
|
3884
3882
|
const Dt = t.getTransform(), $t = Math.sqrt(Dt.a * Dt.a + Dt.b * Dt.b) || 1, Ot = this.rootTransform, Vt = Math.sqrt(Ot.a * Ot.a + Ot.b * Ot.b) || 1;
|
|
3885
|
-
|
|
3883
|
+
_t = $t / Vt;
|
|
3886
3884
|
} else
|
|
3887
|
-
|
|
3888
|
-
t.lineWidth = (e.stroke.width || 1) / (
|
|
3889
|
-
let dt = 0, Ft =
|
|
3885
|
+
_t = (Math.abs(f) + Math.abs(l)) / 2 || 1;
|
|
3886
|
+
t.lineWidth = (e.stroke.width || 1) / (_t || 1), t.globalAlpha = mt * this.normalizeOpacity(e.stroke.opacity ?? 100);
|
|
3887
|
+
let dt = 0, Ft = L;
|
|
3890
3888
|
(N || []).forEach((Dt) => {
|
|
3891
3889
|
let $t = -X / 2;
|
|
3892
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] === `
|
|
3893
3891
|
` || c[dt] === "\r") && (_ > 0 && (Ft += _), dt++, c[dt - 1] === "\r" && c[dt] === `
|
|
3894
3892
|
` && dt++);
|
|
3895
|
-
}), t.globalAlpha =
|
|
3893
|
+
}), t.globalAlpha = mt;
|
|
3896
3894
|
}
|
|
3897
3895
|
}
|
|
3898
3896
|
}
|
|
@@ -3929,7 +3927,17 @@ class ci {
|
|
|
3929
3927
|
}
|
|
3930
3928
|
}
|
|
3931
3929
|
} else y.length > 0 && (t.setLineDash(y), t.lineDashOffset = m);
|
|
3932
|
-
(o == null ? void 0 : o.type) === "Line" || e === 0 || s === 0
|
|
3930
|
+
if ((o == null ? void 0 : o.type) === "Line" || e === 0 || s === 0)
|
|
3931
|
+
this.applyPath(t, o, e, s, n), t.stroke();
|
|
3932
|
+
else if (p === "inside")
|
|
3933
|
+
t.lineWidth = l * 2, t.save(), this.applyPath(t, o, e, s, n), t.clip(), t.stroke(), t.restore();
|
|
3934
|
+
else if (p === "outside") {
|
|
3935
|
+
t.save(), t.beginPath();
|
|
3936
|
+
const S = Math.max(e, s, 2e4);
|
|
3937
|
+
t.rect(-S, -S, S * 2, S * 2), this.applyPath(t, o, e, s, n), t.clip("evenodd"), t.lineWidth = l * 2, t.beginPath(), this.applyPath(t, o, e, s, n), t.stroke(), t.restore();
|
|
3938
|
+
} else
|
|
3939
|
+
t.lineWidth = l, this.applyPath(t, o, e, s, n), t.stroke();
|
|
3940
|
+
t.restore();
|
|
3933
3941
|
}
|
|
3934
3942
|
getPerimeter(t, i, o) {
|
|
3935
3943
|
switch (this.ensurePathPoints(t), t == null ? void 0 : t.type) {
|
|
@@ -4011,8 +4019,8 @@ class ci {
|
|
|
4011
4019
|
for (let d = 1; d <= f; d++) {
|
|
4012
4020
|
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);
|
|
4013
4021
|
if (l + k >= t) {
|
|
4014
|
-
const T = t - l,
|
|
4015
|
-
return (d - 1 +
|
|
4022
|
+
const T = t - l, R = k === 0 ? 0 : T / k;
|
|
4023
|
+
return (d - 1 + R) / f;
|
|
4016
4024
|
}
|
|
4017
4025
|
l += k, p = C, c = w;
|
|
4018
4026
|
}
|
|
@@ -4176,8 +4184,8 @@ class ci {
|
|
|
4176
4184
|
for (let I = 0; I < S; I++) {
|
|
4177
4185
|
const k = Math.sin(I * 127.1 + m * 311.7 * l) * 43758.5, T = k - Math.floor(k);
|
|
4178
4186
|
if (T > 1 - y) {
|
|
4179
|
-
const
|
|
4180
|
-
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 +
|
|
4187
|
+
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;
|
|
4188
|
+
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();
|
|
4181
4189
|
}
|
|
4182
4190
|
}
|
|
4183
4191
|
}
|
|
@@ -4259,7 +4267,7 @@ class ci {
|
|
|
4259
4267
|
const d = t.createPattern(this._noiseTileCanvas, "repeat");
|
|
4260
4268
|
d && (t.fillStyle = d, t.fillRect(-o / 2, -e / 2, o, e));
|
|
4261
4269
|
}
|
|
4262
|
-
t.restore();
|
|
4270
|
+
t.restore(), t.save(), t.globalAlpha = 1, t.strokeStyle = "rgba(255, 255, 255, 0.25)", t.lineWidth = 1.5, this.applyPath(t, i, o, e, s), t.stroke(), t.restore();
|
|
4263
4271
|
}
|
|
4264
4272
|
applyPath(t, i, o, e, s) {
|
|
4265
4273
|
i != null && i.data && (i.type === "Path" || i.type === "Subtract" || i.type === "Union" || i.type === "Intersect" || i.type === "Exclude" || i.type), t.beginPath(), this._tracePath(t, i, o, e, s);
|
|
@@ -4349,13 +4357,13 @@ class ci {
|
|
|
4349
4357
|
}
|
|
4350
4358
|
}
|
|
4351
4359
|
renderInputBox(t, i) {
|
|
4352
|
-
var
|
|
4353
|
-
const o = this.objectStates.get(i.id), e = (o == null ? void 0 : o.options) || i.options || {}, s = ((
|
|
4360
|
+
var L, O;
|
|
4361
|
+
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];
|
|
4354
4362
|
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;
|
|
4355
4363
|
const k = `${f}Style`, T = e[k];
|
|
4356
4364
|
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);
|
|
4357
|
-
const
|
|
4358
|
-
if (
|
|
4365
|
+
const R = this.createCanvasFill(t, y, s, n);
|
|
4366
|
+
if (R && (t.fillStyle = R, t.fill()), C > 0) {
|
|
4359
4367
|
const D = this.createCanvasFill(t, S, s, n);
|
|
4360
4368
|
if (D && (t.strokeStyle = D, t.lineWidth = C, t.stroke()), f === "focused" || f === "focus") {
|
|
4361
4369
|
t.save(), t.beginPath();
|
|
@@ -4365,8 +4373,8 @@ class ci {
|
|
|
4365
4373
|
}
|
|
4366
4374
|
const P = (D, q) => {
|
|
4367
4375
|
if (!D.visible || !D.svgPath) return;
|
|
4368
|
-
const ot = D.size || 14, yt = D.offset ?? 16, bt = D.color || "#ffffff",
|
|
4369
|
-
if (t.save(), t.translate(
|
|
4376
|
+
const ot = D.size || 14, yt = D.offset ?? 16, bt = D.color || "#ffffff", gt = q ? -(s / 2) + yt : s / 2 - yt, Et = D.svgPath;
|
|
4377
|
+
if (t.save(), t.translate(gt, 0), !Et.startsWith("<svg")) {
|
|
4370
4378
|
const It = new Path2D(Et), vt = ot / 24;
|
|
4371
4379
|
t.scale(vt, vt), t.translate(-12, -12), t.fillStyle = bt, t.fill(It);
|
|
4372
4380
|
}
|
|
@@ -4375,49 +4383,49 @@ class ci {
|
|
|
4375
4383
|
P(c, !0), P(d, !1);
|
|
4376
4384
|
const _ = e.text || "", E = e.placeholder || "Enter text...", A = !_, W = _ || E, z = A ? M : w, Y = I, G = e.fontFamily || "Inter", N = e.fontWeight || 400;
|
|
4377
4385
|
t.font = `${N} ${Y}px "${G}", sans-serif`, t.fillStyle = z, t.textAlign = "left", t.textBaseline = u ? "top" : "middle";
|
|
4378
|
-
const
|
|
4379
|
-
if (t.save(), t.beginPath(), t.rect(
|
|
4380
|
-
const D =
|
|
4386
|
+
const J = e.inputPadding ?? 16, x = c.visible ? (c.offset ?? 16) + (c.size || 14) / 2 + 8 : J, F = d.visible ? (d.offset ?? 16) + (d.size || 14) / 2 + 8 : J, j = -(s / 2) + x, X = s - x - F, tt = e.inputType === "password" ? "•".repeat(W.length) : W;
|
|
4387
|
+
if (t.save(), t.beginPath(), t.rect(j - 2, -n / 2 + 4, X + 4, n - 8), t.clip(), u) {
|
|
4388
|
+
const D = tt.split(`
|
|
4381
4389
|
`);
|
|
4382
|
-
let q = -n / 2 +
|
|
4390
|
+
let q = -n / 2 + J;
|
|
4383
4391
|
const ot = Y * 1.2;
|
|
4384
4392
|
let yt = 0;
|
|
4385
|
-
D.forEach((bt,
|
|
4393
|
+
D.forEach((bt, gt) => {
|
|
4386
4394
|
const Et = bt.split(" ");
|
|
4387
4395
|
let It = "";
|
|
4388
4396
|
for (let vt = 0; vt < Et.length; vt++) {
|
|
4389
4397
|
const Yt = It + Et[vt] + " ";
|
|
4390
|
-
t.measureText(Yt).width > X && vt > 0 ? (t.fillText(It,
|
|
4398
|
+
t.measureText(Yt).width > X && vt > 0 ? (t.fillText(It, j, q), It = Et[vt] + " ", q += ot) : It = Yt;
|
|
4391
4399
|
}
|
|
4392
|
-
t.fillText(It,
|
|
4393
|
-
}), a && !A && Math.floor(performance.now() / 500) % 2 === 0 && t.fillRect(
|
|
4400
|
+
t.fillText(It, j, q), yt = t.measureText(It).width, gt < D.length - 1 && (q += ot, yt = 0);
|
|
4401
|
+
}), a && !A && Math.floor(performance.now() / 500) % 2 === 0 && t.fillRect(j + yt, q, 1.5, Y);
|
|
4394
4402
|
} else {
|
|
4395
|
-
const q = t.measureText(
|
|
4403
|
+
const q = t.measureText(tt).width;
|
|
4396
4404
|
let ot = 0;
|
|
4397
|
-
if (q > X && (ot = q - X), t.fillText(
|
|
4398
|
-
const bt =
|
|
4405
|
+
if (q > X && (ot = q - X), t.fillText(tt, j - ot, 0), a && !A && Math.floor(performance.now() / 500) % 2 === 0) {
|
|
4406
|
+
const bt = j + q - ot;
|
|
4399
4407
|
t.fillRect(bt, -(Y / 2), 1.5, Y);
|
|
4400
4408
|
}
|
|
4401
4409
|
}
|
|
4402
4410
|
if (t.restore(), l.visible !== !1) {
|
|
4403
4411
|
const D = l.text || "Label", q = l.fontSize || 12, ot = l.color || "rgba(156, 163, 175, 1)", yt = l.offset ?? 8;
|
|
4404
4412
|
t.font = `600 ${q}px "${G}", sans-serif`, t.fillStyle = ot, t.textAlign = "left", t.textBaseline = "bottom";
|
|
4405
|
-
const bt = -(s / 2),
|
|
4406
|
-
t.fillText(D, bt,
|
|
4413
|
+
const bt = -(s / 2), gt = -(n / 2) - yt;
|
|
4414
|
+
t.fillText(D, bt, gt);
|
|
4407
4415
|
}
|
|
4408
4416
|
if (p.visible === !0) {
|
|
4409
4417
|
const D = p.text || "Helper text", q = p.fontSize || 11, ot = f === "error" ? "rgba(239, 68, 68, 1)" : p.color || "rgba(156, 163, 175, 1)", yt = p.offset ?? 6;
|
|
4410
4418
|
t.font = `400 ${q}px "${G}", sans-serif`, t.fillStyle = ot, t.textAlign = "left", t.textBaseline = "top";
|
|
4411
|
-
const bt = -(s / 2),
|
|
4412
|
-
t.fillText(D, bt,
|
|
4419
|
+
const bt = -(s / 2), gt = n / 2 + yt;
|
|
4420
|
+
t.fillText(D, bt, gt);
|
|
4413
4421
|
}
|
|
4414
4422
|
}
|
|
4415
4423
|
renderSlider(t, i) {
|
|
4416
|
-
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",
|
|
4424
|
+
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) => {
|
|
4417
4425
|
if ((X === "Custom" || X === "Icon") && ot)
|
|
4418
4426
|
try {
|
|
4419
4427
|
const yt = new Path2D(ot);
|
|
4420
|
-
if (t.save(), t.translate(
|
|
4428
|
+
if (t.save(), t.translate(tt, L), X === "Icon") {
|
|
4421
4429
|
const bt = Math.min(O, D) / 24;
|
|
4422
4430
|
t.scale(bt, bt), t.translate(-12, -12);
|
|
4423
4431
|
}
|
|
@@ -4427,28 +4435,28 @@ class ci {
|
|
|
4427
4435
|
console.error("Error drawing slider shape in engine:", yt);
|
|
4428
4436
|
}
|
|
4429
4437
|
if (t.beginPath(), X === "Ellipse")
|
|
4430
|
-
t.ellipse(
|
|
4438
|
+
t.ellipse(tt, L, O / 2, D / 2, 0, 0, Math.PI * 2);
|
|
4431
4439
|
else if (X === "Rectangle")
|
|
4432
|
-
this.drawRoundRect(t,
|
|
4440
|
+
this.drawRoundRect(t, tt - O / 2, L - D / 2, O, D, q);
|
|
4433
4441
|
else if (X === "Triangle")
|
|
4434
|
-
t.moveTo(
|
|
4442
|
+
t.moveTo(tt, L - D / 2), t.lineTo(tt + O / 2, L + D / 2), t.lineTo(tt - O / 2, L + D / 2), t.closePath();
|
|
4435
4443
|
else if (X === "Diamond")
|
|
4436
|
-
t.moveTo(
|
|
4444
|
+
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();
|
|
4437
4445
|
else if (X === "Polygon") {
|
|
4438
4446
|
const yt = i.geometry.sides || 3, bt = i.geometry.radius || Math.min(O, D) / 2;
|
|
4439
|
-
for (let
|
|
4440
|
-
const Et =
|
|
4441
|
-
|
|
4447
|
+
for (let gt = 0; gt < yt; gt++) {
|
|
4448
|
+
const Et = gt * 2 * Math.PI / yt - Math.PI / 2, It = tt + bt * Math.cos(Et), vt = L + bt * Math.sin(Et);
|
|
4449
|
+
gt === 0 ? t.moveTo(It, vt) : t.lineTo(It, vt);
|
|
4442
4450
|
}
|
|
4443
4451
|
t.closePath();
|
|
4444
4452
|
} else if (X === "Star") {
|
|
4445
|
-
const bt = Math.min(O, D) / 2,
|
|
4453
|
+
const bt = Math.min(O, D) / 2, gt = bt / 2;
|
|
4446
4454
|
for (let Et = 0; Et < 10; Et++) {
|
|
4447
|
-
const It = Et % 2 === 0 ? bt :
|
|
4448
|
-
t.lineTo(
|
|
4455
|
+
const It = Et % 2 === 0 ? bt : gt, vt = Et * Math.PI / 5 - Math.PI / 2;
|
|
4456
|
+
t.lineTo(tt + It * Math.cos(vt), L + It * Math.sin(vt));
|
|
4449
4457
|
}
|
|
4450
4458
|
t.closePath();
|
|
4451
|
-
} else X === "Line" && (t.moveTo(
|
|
4459
|
+
} else X === "Line" && (t.moveTo(tt - O / 2, L), t.lineTo(tt + O / 2, L));
|
|
4452
4460
|
t.fill();
|
|
4453
4461
|
}, A = this.createCanvasFill(t, b, n, p);
|
|
4454
4462
|
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,24 +4468,24 @@ class ci {
|
|
|
4460
4468
|
t.save(), t.translate(z, 0);
|
|
4461
4469
|
const G = t.getTransform(), N = Math.sqrt(G.a * G.a + G.b * G.b) || 1;
|
|
4462
4470
|
t.shadowColor = "rgba(0,0,0,0.2)", t.shadowBlur = 4 * N, t.shadowOffsetY = 1 * N;
|
|
4463
|
-
const
|
|
4464
|
-
if (
|
|
4471
|
+
const J = this.createCanvasFill(t, w, y, S);
|
|
4472
|
+
if (J && (t.fillStyle = J), E(m, 0, 0, y, S, C, m === "Icon" ? I : M), t.restore(), k) {
|
|
4465
4473
|
t.save(), t.translate(z + P, _);
|
|
4466
4474
|
const X = Math.round(a).toString();
|
|
4467
4475
|
t.font = "10px Inter, sans-serif";
|
|
4468
|
-
const
|
|
4469
|
-
t.beginPath(), this.drawRoundRect(t, -D / 2, -q / 2, D, q, 4), t.fillStyle = T, t.fill(), t.fillStyle =
|
|
4476
|
+
const tt = t.measureText(X), L = 6, O = 4, D = tt.width + L * 2, q = 14 + O;
|
|
4477
|
+
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();
|
|
4470
4478
|
}
|
|
4471
|
-
const x = s.label || {}, F = s.helperText || {},
|
|
4479
|
+
const x = s.label || {}, F = s.helperText || {}, j = s.fontFamily || "Inter";
|
|
4472
4480
|
if (x.visible !== !1) {
|
|
4473
|
-
const X = x.text || "Label",
|
|
4474
|
-
t.font = `600 ${
|
|
4481
|
+
const X = x.text || "Label", tt = x.fontSize || 12, L = x.color || "rgba(156, 163, 175, 1)", O = x.offset ?? 8;
|
|
4482
|
+
t.font = `600 ${tt}px "${j}", sans-serif`, t.fillStyle = L, t.textAlign = "left", t.textBaseline = "bottom";
|
|
4475
4483
|
const D = -(n / 2), q = -(p / 2) - O;
|
|
4476
4484
|
t.fillText(X, D, q);
|
|
4477
4485
|
}
|
|
4478
4486
|
if (F.visible === !0) {
|
|
4479
|
-
const X = F.text || "Helper text",
|
|
4480
|
-
t.font = `400 ${
|
|
4487
|
+
const X = F.text || "Helper text", tt = F.fontSize || 11, L = F.color || "rgba(156, 163, 175, 1)", O = F.offset ?? 6;
|
|
4488
|
+
t.font = `400 ${tt}px "${j}", sans-serif`, t.fillStyle = L, t.textAlign = "left", t.textBaseline = "top";
|
|
4481
4489
|
const D = -(n / 2), q = p / 2 + O;
|
|
4482
4490
|
t.fillText(X, D, q);
|
|
4483
4491
|
}
|
|
@@ -4515,24 +4523,24 @@ class ci {
|
|
|
4515
4523
|
t.font = `${I} ${M}px ${k}`;
|
|
4516
4524
|
const T = f ? e.disabledColor || "#9ca3af" : !e.selectedOption && e.placeholder ? "#9ca3af" : u;
|
|
4517
4525
|
t.fillStyle = this.createCanvasFill(t, typeof T == "string" ? { type: "Solid", color: T } : T, s, n) || "#333333", t.textAlign = "left", t.textBaseline = "middle";
|
|
4518
|
-
const
|
|
4526
|
+
const R = y === "none" ? 0 : S + 8, P = s - m * 2 - R;
|
|
4519
4527
|
if (t.save(), t.beginPath(), t.rect(a + m, r, P, n), t.clip(), t.fillText(w, a + m, 0), t.restore(), p && !f) {
|
|
4520
4528
|
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;
|
|
4521
4529
|
t.save();
|
|
4522
|
-
const N = e.listShadow || {},
|
|
4530
|
+
const N = e.listShadow || {}, J = t.getTransform(), x = Math.sqrt(J.a * J.a + J.b * J.b) || 1;
|
|
4523
4531
|
t.shadowColor = typeof N.color == "string" ? N.color : ((_ = N.color) == null ? void 0 : _.color) || "rgba(0,0,0,0.15)", t.shadowBlur = (N.blur ?? 12) * x, t.shadowOffsetY = (N.offsetY ?? 6) * x, t.shadowOffsetX = (N.offsetX ?? 0) * x, t.beginPath(), this.drawRoundRect(t, a, E, s, Y, G), t.fillStyle = this.createCanvasFill(t, typeof e.listBackgroundColor == "string" ? { type: "Solid", color: e.listBackgroundColor } : e.listBackgroundColor || { type: "Solid", color: "#ffffff" }, s, Y) || "#ffffff", t.fill();
|
|
4524
4532
|
const F = e.listBorderWidth ?? 1;
|
|
4525
4533
|
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();
|
|
4526
|
-
const
|
|
4527
|
-
t.font = `${I} ${
|
|
4528
|
-
const O = E + z +
|
|
4529
|
-
if (
|
|
4534
|
+
const j = e.itemFontSize || M, X = e.itemFontFamily || k;
|
|
4535
|
+
t.font = `${I} ${j}px ${X}`, A.forEach((tt, L) => {
|
|
4536
|
+
const O = E + z + L * W;
|
|
4537
|
+
if (tt === e.selectedOption)
|
|
4530
4538
|
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";
|
|
4531
4539
|
else if (t.fillStyle = e.listTextColor || u || "#333333", this.activeDropdownId === i.id && this._lastPointerPos) {
|
|
4532
4540
|
const q = this._lastPointerPos.y - (E + z), ot = Math.floor(q / W);
|
|
4533
|
-
|
|
4541
|
+
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);
|
|
4534
4542
|
}
|
|
4535
|
-
t.fillText(
|
|
4543
|
+
t.fillText(tt, a + m, O + W / 2);
|
|
4536
4544
|
});
|
|
4537
4545
|
}
|
|
4538
4546
|
t.globalAlpha = v;
|
|
@@ -4548,14 +4556,14 @@ class ci {
|
|
|
4548
4556
|
M && (t.fillStyle = M, t.fill()), (y > 0 || r && l.borderColor) && (t.strokeStyle = m, t.lineWidth = y || (r ? 1 : 0), t.stroke());
|
|
4549
4557
|
const I = f.fontSize || 14, k = f.fontFamily || "Inter", T = f.fontWeight || 600;
|
|
4550
4558
|
t.font = `${T} ${I}px "${k}", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`, t.fillStyle = u, t.textAlign = "center", t.textBaseline = "middle";
|
|
4551
|
-
let
|
|
4559
|
+
let R = 0;
|
|
4552
4560
|
if (c.enabled && c.svgPath) {
|
|
4553
4561
|
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;
|
|
4554
|
-
|
|
4562
|
+
R = c.position === "left" ? W + P + _ + E.width / 2 : W + E.width / 2, t.save(), t.translate(z, 0);
|
|
4555
4563
|
const Y = new Path2D(c.svgPath), G = P / 24;
|
|
4556
4564
|
t.scale(G, G), t.translate(-12, -12), t.fillStyle = u, t.fill(Y), t.restore();
|
|
4557
4565
|
}
|
|
4558
|
-
t.fillText(v,
|
|
4566
|
+
t.fillText(v, R, 0), t.restore();
|
|
4559
4567
|
}
|
|
4560
4568
|
renderToggleButton(t, i) {
|
|
4561
4569
|
var v, b;
|
|
@@ -4565,7 +4573,7 @@ class ci {
|
|
|
4565
4573
|
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();
|
|
4566
4574
|
}
|
|
4567
4575
|
renderToggle(t, i) {
|
|
4568
|
-
var G, N,
|
|
4576
|
+
var G, N, J, x, F, j, X, tt, L, O, D, q;
|
|
4569
4577
|
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";
|
|
4570
4578
|
e.disabled && (t.globalAlpha *= 0.5), t.beginPath(), this.drawRoundRect(t, a, r, s, n, f);
|
|
4571
4579
|
const S = this.createCanvasFill(t, v, s, n);
|
|
@@ -4574,24 +4582,24 @@ class ci {
|
|
|
4574
4582
|
const ot = this.createCanvasFill(t, b, s, n);
|
|
4575
4583
|
ot && (t.strokeStyle = ot, t.stroke());
|
|
4576
4584
|
}
|
|
4577
|
-
const C = 2, w = n - C * 2, M = w / 2, I = a + C, k = a + s - C - w, T = h ? k : I,
|
|
4578
|
-
t.beginPath(), t.arc(T + M,
|
|
4585
|
+
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;
|
|
4586
|
+
t.beginPath(), t.arc(T + M, R + M, M, 0, Math.PI * 2);
|
|
4579
4587
|
const P = this.createCanvasFill(t, y, w, w);
|
|
4580
4588
|
P && (t.fillStyle = P, t.fill()), e.disabled && (t.globalAlpha *= 2);
|
|
4581
4589
|
let _ = !1, E = !1;
|
|
4582
|
-
const A = (h ? (
|
|
4590
|
+
const A = (h ? (J = l.leftLabel) == null ? void 0 : J.text : null) || ((x = e.leftLabel) == null ? void 0 : x.text) || "", W = (h ? (F = l.leftLabel) == null ? void 0 : F.color : null) || ((j = e.leftLabel) == null ? void 0 : j.color) || "#f3f4f6";
|
|
4583
4591
|
if ((X = e.leftLabel) != null && X.enabled && A) {
|
|
4584
4592
|
const ot = e.leftLabel;
|
|
4585
4593
|
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;
|
|
4586
4594
|
}
|
|
4587
|
-
const z = (h ? (
|
|
4595
|
+
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";
|
|
4588
4596
|
if ((q = e.rightLabel) != null && q.enabled && z) {
|
|
4589
4597
|
const ot = e.rightLabel;
|
|
4590
4598
|
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;
|
|
4591
4599
|
}
|
|
4592
4600
|
if (!_ && !E && e.label && e.label.text) {
|
|
4593
|
-
const ot = e.label, yt = ot.fontSize || 14, bt = ot.fontWeight || 400,
|
|
4594
|
-
t.font = `${bt} ${yt}px "${
|
|
4601
|
+
const ot = e.label, yt = ot.fontSize || 14, bt = ot.fontWeight || 400, gt = ot.fontFamily || "Inter";
|
|
4602
|
+
t.font = `${bt} ${yt}px "${gt}", sans-serif`, t.fillStyle = ot.color || "#f3f4f6", t.textBaseline = "middle";
|
|
4595
4603
|
const Et = ot.gap || 10;
|
|
4596
4604
|
let It = 0, vt = 0;
|
|
4597
4605
|
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);
|
|
@@ -4615,8 +4623,8 @@ class ci {
|
|
|
4615
4623
|
t.save(), t.beginPath();
|
|
4616
4624
|
const w = this.createCanvasFill(t, c, s, n);
|
|
4617
4625
|
t.strokeStyle = w || c, t.lineWidth = Math.max(2, s * 0.12), t.lineCap = "round", t.lineJoin = "round";
|
|
4618
|
-
const M = a + s * 0.25, I = r + n * 0.5, k = a + s * 0.45, T = r + n * 0.7,
|
|
4619
|
-
t.moveTo(M, I), t.lineTo(k, T), t.lineTo(
|
|
4626
|
+
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;
|
|
4627
|
+
t.moveTo(M, I), t.lineTo(k, T), t.lineTo(R, P), t.stroke(), t.restore();
|
|
4620
4628
|
}
|
|
4621
4629
|
if (e.disabled && (t.globalAlpha *= 2), e.label && e.label.text) {
|
|
4622
4630
|
const w = e.label;
|
|
@@ -4636,16 +4644,16 @@ class ci {
|
|
|
4636
4644
|
f.forEach((I, k) => {
|
|
4637
4645
|
const T = r + k * M + y;
|
|
4638
4646
|
t.beginPath(), t.arc(a + y, T, y, 0, Math.PI * 2);
|
|
4639
|
-
const
|
|
4640
|
-
|
|
4647
|
+
const R = h === I, P = this.createCanvasFill(t, c, S, S), _ = this.createCanvasFill(t, d, S, S);
|
|
4648
|
+
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);
|
|
4641
4649
|
});
|
|
4642
4650
|
} else {
|
|
4643
4651
|
let M = a;
|
|
4644
4652
|
f.forEach((I) => {
|
|
4645
4653
|
const k = h === I, T = t.measureText(I).width;
|
|
4646
4654
|
t.beginPath(), t.arc(M + y, 0, y, 0, Math.PI * 2);
|
|
4647
|
-
const
|
|
4648
|
-
k ? (t.strokeStyle =
|
|
4655
|
+
const R = this.createCanvasFill(t, c, S, S), P = this.createCanvasFill(t, d, S, S);
|
|
4656
|
+
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;
|
|
4649
4657
|
});
|
|
4650
4658
|
}
|
|
4651
4659
|
if (t.restore(), e.disabled && (t.globalAlpha *= 2), e.label && e.label.text) {
|
|
@@ -4657,10 +4665,10 @@ class ci {
|
|
|
4657
4665
|
}
|
|
4658
4666
|
}
|
|
4659
4667
|
renderBarChart(t, i) {
|
|
4660
|
-
var T,
|
|
4668
|
+
var T, R;
|
|
4661
4669
|
const o = this.objectStates.get(i.id), e = (o == null ? void 0 : o.options) || i.options || {}, s = {
|
|
4662
4670
|
width: ((T = i.geometry) == null ? void 0 : T.width) || 300,
|
|
4663
|
-
height: ((
|
|
4671
|
+
height: ((R = i.geometry) == null ? void 0 : R.height) || 180,
|
|
4664
4672
|
chartType: e.chartType || "grouped",
|
|
4665
4673
|
stylePreset: e.stylePreset || "default",
|
|
4666
4674
|
datasets: e.datasets || [{ id: "ds-1", label: "Revenue", data: [42, 67, 31, 55, 78, 48], color: "#6366f1" }],
|
|
@@ -4789,10 +4797,10 @@ class ci {
|
|
|
4789
4797
|
s.datasets.forEach((W, z) => {
|
|
4790
4798
|
const Y = W.data[_] ?? 0;
|
|
4791
4799
|
if (Y === 0) return;
|
|
4792
|
-
const G = Y / u * M, N = Math.min(s.barWidth * d + s.barGap, P - 8),
|
|
4800
|
+
const G = Y / u * M, N = Math.min(s.barWidth * d + s.barGap, P - 8), J = E - N / 2, x = A;
|
|
4793
4801
|
A += G;
|
|
4794
4802
|
const F = s._resolveColor(W.color, z);
|
|
4795
|
-
t.beginPath(), t.fillStyle = s._makeGradient(t, F, x,
|
|
4803
|
+
t.beginPath(), t.fillStyle = s._makeGradient(t, F, x, J, x + G, J), s._drawRoundedBar(t, x, J, G, N, z === d - 1 ? s.barCornerRadius : 0, !1), s.barStyle === "outline" || s.barStyle === "dashed" ? (t.fillStyle = "transparent", t.strokeStyle = s.barBorderColor === "auto" ? F : s.barBorderColor, t.lineWidth = s.barBorderWidth, s.barStyle === "dashed" && t.setLineDash([4, 4]), t.stroke(), t.setLineDash([])) : t.fill();
|
|
4796
4804
|
});
|
|
4797
4805
|
}
|
|
4798
4806
|
} else {
|
|
@@ -4804,10 +4812,10 @@ class ci {
|
|
|
4804
4812
|
s.datasets.forEach((W, z) => {
|
|
4805
4813
|
const Y = W.data[_] ?? 0;
|
|
4806
4814
|
if (Y === 0) return;
|
|
4807
|
-
const G = Y / u * I, N = Math.min(s.barWidth * d + s.barGap, P - 8),
|
|
4815
|
+
const G = Y / u * I, N = Math.min(s.barWidth * d + s.barGap, P - 8), J = E - N / 2, x = A - G;
|
|
4808
4816
|
A -= G;
|
|
4809
4817
|
const F = s._resolveColor(W.color, z);
|
|
4810
|
-
t.beginPath(), t.fillStyle = s._makeGradient(t, F,
|
|
4818
|
+
t.beginPath(), t.fillStyle = s._makeGradient(t, F, J, x, J, x + G), s._drawRoundedBar(t, J, x, N, G, z === d - 1 ? s.barCornerRadius : 0, !0), s.barStyle === "outline" || s.barStyle === "dashed" ? (t.fillStyle = "transparent", t.strokeStyle = s.barBorderColor === "auto" ? F : s.barBorderColor, t.lineWidth = s.barBorderWidth, s.barStyle === "dashed" && t.setLineDash([4, 4]), t.stroke(), t.setLineDash([])) : t.fill();
|
|
4811
4819
|
});
|
|
4812
4820
|
}
|
|
4813
4821
|
}
|
|
@@ -4818,10 +4826,10 @@ class ci {
|
|
|
4818
4826
|
s.showXLabels && (t.font = s.axisLabelFontSize + "px Inter, sans-serif", t.textAlign = "right", t.textBaseline = "middle", t.fillStyle = f.axisLabelColor, t.shadowColor = "transparent", t.fillText(s.categories[A] || "", C - 5, W), s.enableShadows && (t.shadowColor = s.shadowColor));
|
|
4819
4827
|
const z = W - _ / 2;
|
|
4820
4828
|
s.datasets.forEach((Y, G) => {
|
|
4821
|
-
const N = Y.data[A] ?? 0,
|
|
4822
|
-
if (
|
|
4823
|
-
const x = z + G * (s.barWidth + s.barGap), F = N >= 0 ? E : E -
|
|
4824
|
-
t.beginPath(), t.fillStyle = s._makeGradient(t,
|
|
4829
|
+
const N = Y.data[A] ?? 0, J = Math.abs(N / u * M);
|
|
4830
|
+
if (J < 1) return;
|
|
4831
|
+
const x = z + G * (s.barWidth + s.barGap), F = N >= 0 ? E : E - J, j = s._resolveColor(Y.color, G);
|
|
4832
|
+
t.beginPath(), t.fillStyle = s._makeGradient(t, j, F, x, F + J, x), s._drawRoundedBar(t, F, x, J, s.barWidth, s.barCornerRadius, !1), s.barStyle === "outline" || s.barStyle === "dashed" ? (t.fillStyle = "transparent", t.strokeStyle = s.barBorderColor === "auto" ? j : s.barBorderColor, t.lineWidth = s.barBorderWidth, s.barStyle === "dashed" && t.setLineDash([4, 4]), t.stroke(), t.setLineDash([])) : t.fill(), s.showValueOnTop && N !== 0 && (t.font = (s.valueFontWeight || "bold") + " " + (s.valueFontSize || 10) + "px Inter, sans-serif", t.textAlign = N >= 0 ? "left" : "right", t.textBaseline = "middle", t.fillStyle = s.valueColor === "auto" ? j : s.valueColor || "#fff", t.shadowColor = "transparent", t.fillText(N.toString(), N >= 0 ? F + J + 4 : F - 4, x + s.barWidth / 2), s.enableShadows && (t.shadowColor = s.shadowColor));
|
|
4825
4833
|
});
|
|
4826
4834
|
}
|
|
4827
4835
|
} else {
|
|
@@ -4831,10 +4839,10 @@ class ci {
|
|
|
4831
4839
|
s.showXLabels && (t.font = s.axisLabelFontSize + "px Inter, sans-serif", t.textAlign = "center", t.textBaseline = "top", t.fillStyle = f.axisLabelColor, t.shadowColor = "transparent", t.fillText(s.categories[A] || "", W, w + I + 5), s.enableShadows && (t.shadowColor = s.shadowColor));
|
|
4832
4840
|
const z = W - _ / 2;
|
|
4833
4841
|
s.datasets.forEach((Y, G) => {
|
|
4834
|
-
const N = Y.data[A] ?? 0,
|
|
4835
|
-
if (
|
|
4836
|
-
const x = z + G * (s.barWidth + s.barGap), F = N >= 0 ? E -
|
|
4837
|
-
t.beginPath(), t.fillStyle = s._makeGradient(t,
|
|
4842
|
+
const N = Y.data[A] ?? 0, J = Math.abs(N / u * I);
|
|
4843
|
+
if (J < 1) return;
|
|
4844
|
+
const x = z + G * (s.barWidth + s.barGap), F = N >= 0 ? E - J : E, j = s._resolveColor(Y.color, G);
|
|
4845
|
+
t.beginPath(), t.fillStyle = s._makeGradient(t, j, x, F, x, F + J), s._drawRoundedBar(t, x, F, s.barWidth, J, s.barCornerRadius, !0), s.barStyle === "outline" || s.barStyle === "dashed" ? (t.fillStyle = "transparent", t.strokeStyle = s.barBorderColor === "auto" ? j : s.barBorderColor, t.lineWidth = s.barBorderWidth, s.barStyle === "dashed" && t.setLineDash([4, 4]), t.stroke(), t.setLineDash([])) : t.fill(), s.showValueOnTop && N !== 0 && (t.font = (s.valueFontWeight || "bold") + " " + (s.valueFontSize || 10) + "px Inter, sans-serif", t.textAlign = "center", t.textBaseline = N >= 0 ? "bottom" : "top", t.fillStyle = s.valueColor === "auto" ? j : s.valueColor || "#fff", t.shadowColor = "transparent", t.fillText(N.toString(), x + s.barWidth / 2, N >= 0 ? F - 4 : F + J + 4), s.enableShadows && (t.shadowColor = s.shadowColor));
|
|
4838
4846
|
});
|
|
4839
4847
|
}
|
|
4840
4848
|
}
|
|
@@ -4885,8 +4893,8 @@ class ci {
|
|
|
4885
4893
|
s.slices.forEach((C, w) => {
|
|
4886
4894
|
const M = C.value || 0;
|
|
4887
4895
|
if (M === 0) return;
|
|
4888
|
-
const I = M / m * c, k = -Math.PI / 2 + w * y + S / 2, T = k + y - S,
|
|
4889
|
-
if (t.beginPath(), t.moveTo(d, u), t.arc(d, u, I, k, T), t.closePath(), t.fillStyle =
|
|
4896
|
+
const I = M / m * c, k = -Math.PI / 2 + w * y + S / 2, T = k + y - S, R = s._resolveSliceColor(C, w);
|
|
4897
|
+
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) {
|
|
4890
4898
|
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);
|
|
4891
4899
|
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();
|
|
4892
4900
|
}
|
|
@@ -4900,14 +4908,14 @@ class ci {
|
|
|
4900
4908
|
C += I / r * Math.PI * 2;
|
|
4901
4909
|
return;
|
|
4902
4910
|
}
|
|
4903
|
-
const k = I / r * Math.PI * 2, T = C + S / 2,
|
|
4904
|
-
if (
|
|
4911
|
+
const k = I / r * Math.PI * 2, T = C + S / 2, R = C + k - S / 2;
|
|
4912
|
+
if (R <= T) {
|
|
4905
4913
|
C += k;
|
|
4906
4914
|
return;
|
|
4907
4915
|
}
|
|
4908
4916
|
const P = s._resolveSliceColor(w, M);
|
|
4909
|
-
if (t.beginPath(), t.fillStyle = P, y <= 0 ? (t.moveTo(d, u), t.arc(d, u, c, T,
|
|
4910
|
-
const _ = T + (
|
|
4917
|
+
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) {
|
|
4918
|
+
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);
|
|
4911
4919
|
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();
|
|
4912
4920
|
}
|
|
4913
4921
|
C += k;
|
|
@@ -4920,13 +4928,13 @@ class ci {
|
|
|
4920
4928
|
t.font = `${s.legendFontSize}px Inter, sans-serif`;
|
|
4921
4929
|
const m = 2, y = n / m, S = s.legendFontSize + 8, C = a / 2 - l + 10, w = -n / 2 + 10;
|
|
4922
4930
|
s.slices.forEach((M, I) => {
|
|
4923
|
-
const k = I % m, T = Math.floor(I / m),
|
|
4924
|
-
t.beginPath(), t.roundRect(
|
|
4931
|
+
const k = I % m, T = Math.floor(I / m), R = w + k * y, P = C + T * S, _ = s._resolveSliceColor(M, I), E = 7;
|
|
4932
|
+
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;
|
|
4925
4933
|
const A = Math.round((M.value || 0) / r * 100), W = `${M.label || "Item"} ${A}%`, z = y - E - 20;
|
|
4926
4934
|
let Y = W;
|
|
4927
4935
|
for (; t.measureText(Y).width > z && Y.length > 4; )
|
|
4928
4936
|
Y = Y.slice(0, -4) + "…";
|
|
4929
|
-
t.fillText(Y,
|
|
4937
|
+
t.fillText(Y, R + E + 4, P);
|
|
4930
4938
|
});
|
|
4931
4939
|
}
|
|
4932
4940
|
t.restore();
|
|
@@ -4949,17 +4957,17 @@ class ci {
|
|
|
4949
4957
|
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;
|
|
4950
4958
|
if (h === "vertical") {
|
|
4951
4959
|
const T = Math.max(C, l) + f;
|
|
4952
|
-
for (let
|
|
4953
|
-
const P = M +
|
|
4960
|
+
for (let R = 0; R < n.length; R++) {
|
|
4961
|
+
const P = M + R * T;
|
|
4954
4962
|
if (m >= w && m <= w + a && y >= P && y <= P + T)
|
|
4955
|
-
return
|
|
4963
|
+
return R;
|
|
4956
4964
|
}
|
|
4957
4965
|
} else {
|
|
4958
4966
|
let T = w;
|
|
4959
|
-
for (let
|
|
4960
|
-
const _ = n[
|
|
4967
|
+
for (let R = 0; R < n.length; R++) {
|
|
4968
|
+
const _ = n[R].length * 8, E = C + 6 + _ + f;
|
|
4961
4969
|
if (m >= T && m <= T + E && y >= M && y <= M + r)
|
|
4962
|
-
return
|
|
4970
|
+
return R;
|
|
4963
4971
|
T += E;
|
|
4964
4972
|
}
|
|
4965
4973
|
}
|
|
@@ -5187,17 +5195,17 @@ class ci {
|
|
|
5187
5195
|
const x = this.drawCustomShape(t, e.containerShape || "rectangle", e.containerPath || "", a, r, s, n, h);
|
|
5188
5196
|
t.fill();
|
|
5189
5197
|
}
|
|
5190
|
-
const
|
|
5191
|
-
if (
|
|
5192
|
-
t.strokeStyle = e.borderColor || "#cccccc", t.lineWidth =
|
|
5198
|
+
const J = e.borderWidth ?? 0;
|
|
5199
|
+
if (J > 0) {
|
|
5200
|
+
t.strokeStyle = e.borderColor || "#cccccc", t.lineWidth = J, t.beginPath();
|
|
5193
5201
|
const x = this.drawCustomShape(t, e.containerShape || "rectangle", e.containerPath || "", a, r, s, n, h);
|
|
5194
5202
|
t.stroke();
|
|
5195
5203
|
}
|
|
5196
5204
|
}
|
|
5197
5205
|
t.shadowBlur = 0, t.save(), t.beginPath();
|
|
5198
|
-
const
|
|
5206
|
+
const R = this.drawCustomShape(t, e.containerShape || "rectangle", e.containerPath || "", a, r, s, n, h);
|
|
5199
5207
|
if (e.listLayout !== "circular")
|
|
5200
|
-
if (
|
|
5208
|
+
if (R && e.containerShape === "custom")
|
|
5201
5209
|
try {
|
|
5202
5210
|
const G = new Path2D(e.containerPath);
|
|
5203
5211
|
t.translate(a, r), t.scale(s / 100, n / 100), t.clip(G), t.scale(100 / s, 100 / n), t.translate(-a, -r);
|
|
@@ -5208,52 +5216,52 @@ class ci {
|
|
|
5208
5216
|
const P = typeof v == "number" ? v : f === "vertical" ? v[0] : v[3];
|
|
5209
5217
|
let _ = (f === "vertical" ? r : a) + u + P;
|
|
5210
5218
|
if (t.textBaseline = "middle", l.forEach((G, N) => {
|
|
5211
|
-
const
|
|
5212
|
-
let
|
|
5213
|
-
if (
|
|
5214
|
-
const vt = l.length || 1, Yt = Math.PI * 2 / vt,
|
|
5215
|
-
|
|
5219
|
+
const J = e.listLayout || "linear", x = J === "circular" ? d : f === "vertical" ? s : d, F = J === "circular" || f === "vertical" ? c : n;
|
|
5220
|
+
let j = 0, X = 0, tt = 0;
|
|
5221
|
+
if (J === "circular") {
|
|
5222
|
+
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;
|
|
5223
|
+
j = Lt + Math.cos(mt) * fe - x / 2, X = _t + Math.sin(mt) * fe - F / 2, tt = mt + (e.itemRotation || 0) * Math.PI / 180;
|
|
5216
5224
|
} else
|
|
5217
|
-
|
|
5218
|
-
const
|
|
5219
|
-
if (t.save(),
|
|
5225
|
+
j = f === "vertical" ? a : _, X = f === "vertical" ? _ : r, tt = (e.itemRotation || 0) * Math.PI / 180;
|
|
5226
|
+
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;
|
|
5227
|
+
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) {
|
|
5220
5228
|
const vt = this.createCanvasFill(t, m, x, F);
|
|
5221
5229
|
t.fillStyle = vt || m;
|
|
5222
5230
|
const Yt = t.globalAlpha;
|
|
5223
|
-
t.globalAlpha = Yt * 0.8, t.beginPath(), this.drawCustomShape(t, D, q,
|
|
5224
|
-
} else if (
|
|
5225
|
-
t.fillStyle = b ? "rgba(255, 255, 255, 0.1)" : "rgba(0, 0, 0, 0.05)", t.beginPath(), this.drawCustomShape(t, D, q,
|
|
5231
|
+
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;
|
|
5232
|
+
} else if (L)
|
|
5233
|
+
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());
|
|
5226
5234
|
else if (S !== "transparent") {
|
|
5227
5235
|
const vt = this.createCanvasFill(t, S, x, F);
|
|
5228
|
-
t.fillStyle = vt || S, t.beginPath(), this.drawCustomShape(t, D, q,
|
|
5236
|
+
t.fillStyle = vt || S, t.beginPath(), this.drawCustomShape(t, D, q, j, X, x, F, ot) || (t.rect(j, X, x, F), t.fill());
|
|
5229
5237
|
}
|
|
5230
|
-
if (O ||
|
|
5238
|
+
if (O || L) {
|
|
5231
5239
|
const vt = this.createCanvasFill(t, m, f === "vertical" ? 3 : x, f === "vertical" ? F : 3);
|
|
5232
|
-
t.fillStyle = vt || m, f === "vertical" ? t.fillRect(
|
|
5240
|
+
t.fillStyle = vt || m, f === "vertical" ? t.fillRect(j, X, 3, F) : t.fillRect(j, X + F - 3, x, 3);
|
|
5233
5241
|
}
|
|
5234
5242
|
const yt = O ? "#ffffff" : b ? "rgba(255, 255, 255, 0.9)" : y;
|
|
5235
|
-
t.fillStyle = yt, t.font = O ||
|
|
5236
|
-
const bt = typeof G == "string" ? G : (G == null ? void 0 : G.label) || `Item ${N + 1}`,
|
|
5237
|
-
f === "horizontal" ||
|
|
5238
|
-
const It =
|
|
5243
|
+
t.fillStyle = yt, t.font = O || L ? "600 14px Inter, sans-serif" : "400 14px Inter, sans-serif";
|
|
5244
|
+
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;
|
|
5245
|
+
f === "horizontal" || J === "circular" ? t.textAlign = "center" : t.textAlign = "left";
|
|
5246
|
+
const It = J === "circular" ? j + x / 2 : gt;
|
|
5239
5247
|
t.fillText(bt, It, Et), t.restore(), _ += (f === "vertical" ? c : d) + p;
|
|
5240
5248
|
}), t.restore(), e.showScrollbar !== !1) {
|
|
5241
|
-
const G = (l.length || 0) * (f === "vertical" ? c : d) + ((l.length || 0) - 1) * p, N = f === "vertical" ? n : s,
|
|
5242
|
-
if (G > N ||
|
|
5243
|
-
const F = e.scrollbarColor || "rgba(255,255,255,0.3)",
|
|
5249
|
+
const G = (l.length || 0) * (f === "vertical" ? c : d) + ((l.length || 0) - 1) * p, N = f === "vertical" ? n : s, J = e.listLayout || "linear", x = e.containerShape === "circle" || J === "circular";
|
|
5250
|
+
if (G > N || J === "circular" && l.length > 0) {
|
|
5251
|
+
const F = e.scrollbarColor || "rgba(255,255,255,0.3)", j = e.scrollbarWidth || 4;
|
|
5244
5252
|
if (x) {
|
|
5245
|
-
const X = Math.min(s, n) / 2 -
|
|
5246
|
-
if (t.strokeStyle = F, t.lineWidth =
|
|
5253
|
+
const X = Math.min(s, n) / 2 - j / 2 - 2, tt = a + s / 2, L = r + n / 2;
|
|
5254
|
+
if (t.strokeStyle = F, t.lineWidth = j, t.lineCap = "round", t.beginPath(), J === "circular") {
|
|
5247
5255
|
const O = Math.PI / 4, D = -(u * 0.01) - Math.PI / 2;
|
|
5248
|
-
t.arc(
|
|
5256
|
+
t.arc(tt, L, X, D, D + O);
|
|
5249
5257
|
} else {
|
|
5250
5258
|
const O = Math.PI / 2, D = N / G, q = O * D, ot = -u / G * O, bt = -Math.PI / 4 + ot;
|
|
5251
|
-
t.arc(
|
|
5259
|
+
t.arc(tt, L, X, bt, bt + q);
|
|
5252
5260
|
}
|
|
5253
5261
|
t.stroke();
|
|
5254
5262
|
} else {
|
|
5255
|
-
const X = N / G,
|
|
5256
|
-
t.fillStyle = F, f === "vertical" ? t.fillRect(a + s -
|
|
5263
|
+
const X = N / G, tt = N * X, L = -u / G * N;
|
|
5264
|
+
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);
|
|
5257
5265
|
}
|
|
5258
5266
|
}
|
|
5259
5267
|
}
|
|
@@ -5296,20 +5304,20 @@ class ci {
|
|
|
5296
5304
|
if (n.length === 0) return null;
|
|
5297
5305
|
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];
|
|
5298
5306
|
let T = (h === "vertical" ? I : M) + c + k;
|
|
5299
|
-
const
|
|
5307
|
+
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;
|
|
5300
5308
|
for (let G = 0; G < n.length; G++) {
|
|
5301
|
-
const N =
|
|
5302
|
-
let x = 0, F = 0,
|
|
5303
|
-
if (
|
|
5304
|
-
const X = G * _ + W,
|
|
5305
|
-
x =
|
|
5309
|
+
const N = R === "circular" ? p : h === "vertical" ? a : p, J = R === "circular" || h === "vertical" ? l : r;
|
|
5310
|
+
let x = 0, F = 0, j = 0;
|
|
5311
|
+
if (R === "circular") {
|
|
5312
|
+
const X = G * _ + W, tt = M + a / 2, L = I + r / 2;
|
|
5313
|
+
x = tt + Math.cos(X) * A - N / 2, F = L + Math.sin(X) * A - J / 2, j = X + (e.itemRotation || 0) * Math.PI / 180;
|
|
5306
5314
|
} else
|
|
5307
|
-
x = h === "vertical" ? M : T, F = h === "vertical" ? T : I,
|
|
5308
|
-
if (
|
|
5309
|
-
const X = x + N / 2,
|
|
5310
|
-
if (q >= x && q <= x + N && ot >= F && ot <= F +
|
|
5315
|
+
x = h === "vertical" ? M : T, F = h === "vertical" ? T : I, j = (e.itemRotation || 0) * Math.PI / 180;
|
|
5316
|
+
if (j !== 0) {
|
|
5317
|
+
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;
|
|
5318
|
+
if (q >= x && q <= x + N && ot >= F && ot <= F + J)
|
|
5311
5319
|
return G;
|
|
5312
|
-
} else if (C >= x && C <= x + N && w >= F && w <= F +
|
|
5320
|
+
} else if (C >= x && C <= x + N && w >= F && w <= F + J)
|
|
5313
5321
|
return G;
|
|
5314
5322
|
T += (h === "vertical" ? l : p) + f;
|
|
5315
5323
|
}
|
|
@@ -5329,120 +5337,120 @@ class ci {
|
|
|
5329
5337
|
if (!e.behaviors || e.behaviors.length === 0) return;
|
|
5330
5338
|
const s = this.objectStates.get(e.id);
|
|
5331
5339
|
s && e.behaviors.forEach((n) => {
|
|
5332
|
-
var p, c, d, u, v, b, m, y, S, C, w, M, I, k, T,
|
|
5340
|
+
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;
|
|
5333
5341
|
if (!n.enabled) return;
|
|
5334
5342
|
const a = n.startTime || 0, r = n.endTime || 1 / 0;
|
|
5335
5343
|
if (this.currentTime < a || this.currentTime > r) return;
|
|
5336
5344
|
const h = s.x - i, f = s.y - o, l = Math.sqrt(h * h + f * f);
|
|
5337
5345
|
if (this.frameCount % 240 === 0 && Math.random() < 0.1 && this.log(`[ExodeUI] Executing ${n.type} on ${e.name}`), n.type === U.Proximity) {
|
|
5338
5346
|
const H = ((p = n.settings) == null ? void 0 : p.radius) || 300, Z = ((c = n.settings) == null ? void 0 : c.falloff) || "smooth";
|
|
5339
|
-
let
|
|
5340
|
-
l < H && (Z === "linear" ?
|
|
5341
|
-
this.applyBehaviorSensor(s, ft,
|
|
5347
|
+
let K = 0;
|
|
5348
|
+
l < H && (Z === "linear" ? K = 1 - l / H : K = Math.pow(1 - l / H, 2)), n.sensors.forEach((ft) => {
|
|
5349
|
+
this.applyBehaviorSensor(s, ft, K, t, n.settings, e, h, f, l);
|
|
5342
5350
|
});
|
|
5343
5351
|
} else if (n.type === U.Magnetic) {
|
|
5344
5352
|
const H = ((d = n.settings) == null ? void 0 : d.radius) || 400, Z = ((u = n.settings) == null ? void 0 : u.strength) || 0.5;
|
|
5345
5353
|
if (l < H && l > 5) {
|
|
5346
|
-
const
|
|
5347
|
-
s.x -= ft * t * 10, s.y -=
|
|
5354
|
+
const K = 1 - l / H, ft = h * K * Z, Tt = f * K * Z;
|
|
5355
|
+
s.x -= ft * t * 10, s.y -= Tt * t * 10;
|
|
5348
5356
|
}
|
|
5349
5357
|
} else if (n.type === U.Repel) {
|
|
5350
5358
|
const H = ((v = n.settings) == null ? void 0 : v.radius) || 300, Z = ((b = n.settings) == null ? void 0 : b.strength) || 1;
|
|
5351
5359
|
if (l < H) {
|
|
5352
|
-
const
|
|
5353
|
-
s.x += h / (l || 1) *
|
|
5360
|
+
const K = Math.pow(1 - l / H, 2);
|
|
5361
|
+
s.x += h / (l || 1) * K * 60 * Z * t * 5, s.y += f / (l || 1) * K * 60 * Z * t * 5;
|
|
5354
5362
|
}
|
|
5355
5363
|
} else if (n.type === U.Orbit) {
|
|
5356
|
-
const H = ((m = n.settings) == null ? void 0 : m.speed) || 1, Z = ((y = n.settings) == null ? void 0 : y.radius) || 30,
|
|
5357
|
-
s.x += Math.cos(
|
|
5364
|
+
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;
|
|
5365
|
+
s.x += Math.cos(K) * Z * t * 5, s.y += Math.sin(K) * Z * t * 5, s.rotation += 2 * t * 5;
|
|
5358
5366
|
} else if (n.type === U.Vortex) {
|
|
5359
|
-
const H = ((S = n.settings) == null ? void 0 : S.radius) || 400, Z = ((C = n.settings) == null ? void 0 : C.speed) || 2,
|
|
5367
|
+
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;
|
|
5360
5368
|
if (l < H) {
|
|
5361
|
-
const ft = Math.pow(1 - l / H, 1.5),
|
|
5362
|
-
s.x +=
|
|
5369
|
+
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;
|
|
5370
|
+
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;
|
|
5363
5371
|
}
|
|
5364
5372
|
} else if (n.type === U.Fluid) {
|
|
5365
5373
|
const H = ((M = n.settings) == null ? void 0 : M.radius) || 300, Z = ((I = n.settings) == null ? void 0 : I.strength) || 1;
|
|
5366
5374
|
if (l < H) {
|
|
5367
|
-
const
|
|
5368
|
-
s.x += ft * 10 * t * 5, s.y +=
|
|
5375
|
+
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;
|
|
5376
|
+
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;
|
|
5369
5377
|
}
|
|
5370
5378
|
} else if (n.type === U.Elastic) {
|
|
5371
5379
|
const H = ((k = n.settings) == null ? void 0 : k.radius) || 300, Z = ((T = n.settings) == null ? void 0 : T.strength) || 1;
|
|
5372
5380
|
if (l < H) {
|
|
5373
|
-
const
|
|
5374
|
-
s.scale_x *= 1 +
|
|
5381
|
+
const K = 1 - l / H;
|
|
5382
|
+
s.scale_x *= 1 + K * 0.4 * Z * t, s.scale_y *= 1 + K * 0.4 * Z * t;
|
|
5375
5383
|
}
|
|
5376
5384
|
} else if (n.type === U.Holographic) {
|
|
5377
|
-
const H = s.x - this.canvasWidth / 2, Z = s.y - this.canvasHeight / 2,
|
|
5378
|
-
if (s.x -= H / 1e3 *
|
|
5385
|
+
const H = s.x - this.canvasWidth / 2, Z = s.y - this.canvasHeight / 2, K = ((R = n.settings) == null ? void 0 : R.factor) || 25;
|
|
5386
|
+
if (s.x -= H / 1e3 * K * t * 5, s.y -= Z / 1e3 * K * t * 5, s.style) {
|
|
5379
5387
|
const ft = 1 - Math.min(1, l / 400);
|
|
5380
5388
|
s.style.exposure = (s.style.exposure || 1) + ft * 0.5 * t;
|
|
5381
5389
|
}
|
|
5382
5390
|
} else if (n.type === U.Sticky) {
|
|
5383
5391
|
const H = ((P = n.settings) == null ? void 0 : P.radius) || 80, Z = ((_ = n.settings) == null ? void 0 : _.strength) || 1;
|
|
5384
5392
|
if (l < H) {
|
|
5385
|
-
const
|
|
5386
|
-
s.x -= h *
|
|
5393
|
+
const K = Math.pow(1 - l / H, 2);
|
|
5394
|
+
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;
|
|
5387
5395
|
}
|
|
5388
5396
|
} else if (n.type === U.Dilation) {
|
|
5389
5397
|
const H = ((E = n.settings) == null ? void 0 : E.size) || 120, Z = ((A = n.settings) == null ? void 0 : A.strength) || 1;
|
|
5390
5398
|
if (l < H) {
|
|
5391
|
-
const
|
|
5392
|
-
s.scale_x *= 1 +
|
|
5399
|
+
const K = 1 - l / H;
|
|
5400
|
+
s.scale_x *= 1 + K * 0.5 * Z * t, s.scale_y *= 1 + K * 0.5 * Z * t;
|
|
5393
5401
|
}
|
|
5394
5402
|
} else if (n.type === U.Parallax) {
|
|
5395
|
-
const H = ((W = n.settings) == null ? void 0 : W.factor) || 15, Z = ((z = n.settings) == null ? void 0 : z.strength) || 1,
|
|
5396
|
-
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 ?? ((
|
|
5403
|
+
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);
|
|
5404
|
+
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);
|
|
5397
5405
|
} else if (n.type === U.Fold) {
|
|
5398
5406
|
if (l < 300) {
|
|
5399
|
-
const H = 1 - l / 300, Z = (h > 0 ? -1 : 1) * H * 10,
|
|
5400
|
-
s.skew_x = this.lerp(s.skew_x ?? ((
|
|
5407
|
+
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);
|
|
5408
|
+
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 };
|
|
5401
5409
|
}
|
|
5402
5410
|
} else if (n.type === U.Crumple) {
|
|
5403
5411
|
if (l < 300) {
|
|
5404
|
-
const H = 1 - l / 300, Z = H * (Math.random() - 0.5) * 5,
|
|
5405
|
-
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, (((
|
|
5412
|
+
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);
|
|
5413
|
+
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 };
|
|
5406
5414
|
}
|
|
5407
5415
|
} else if (n.type === U.Squash) {
|
|
5408
|
-
const H = ((
|
|
5409
|
-
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, ((
|
|
5416
|
+
const H = ((ie = n.settings) == null ? void 0 : ie.strength) || 0.8;
|
|
5417
|
+
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));
|
|
5410
5418
|
} else if (n.type === U.TextCounter) {
|
|
5411
|
-
const H = ((
|
|
5419
|
+
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;
|
|
5412
5420
|
n._runtimeStart === void 0 && (n._runtimeStart = this.currentTime);
|
|
5413
|
-
const ft = this.currentTime - n._runtimeStart,
|
|
5421
|
+
const ft = this.currentTime - n._runtimeStart, Tt = Math.min(1, ft / H), Rt = Math.floor(Z + (K - Z) * Tt);
|
|
5414
5422
|
if (((Dt = e.geometry) == null ? void 0 : Dt.type) === "Text") {
|
|
5415
5423
|
const Bt = (($t = n.settings) == null ? void 0 : $t.prefix) || "", ee = ((Ot = n.settings) == null ? void 0 : Ot.suffix) || "";
|
|
5416
|
-
s.geometry || (s.geometry = { ...e.geometry }), s.geometry.text = `${Bt}${
|
|
5424
|
+
s.geometry || (s.geometry = { ...e.geometry }), s.geometry.text = `${Bt}${Rt}${ee}`;
|
|
5417
5425
|
}
|
|
5418
5426
|
} else if (n.type === U.Spotlight) {
|
|
5419
5427
|
const H = ((Vt = n.settings) == null ? void 0 : Vt.radius) || 250, Z = ((ne = n.settings) == null ? void 0 : ne.strength) || 1.5;
|
|
5420
5428
|
if (l < H) {
|
|
5421
|
-
const
|
|
5422
|
-
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) +
|
|
5429
|
+
const K = Math.pow(1 - l / H, 2);
|
|
5430
|
+
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;
|
|
5423
5431
|
} else
|
|
5424
5432
|
(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));
|
|
5425
5433
|
} else if (n.type === U.Noise || n.type === U.Float) {
|
|
5426
|
-
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) || ((
|
|
5427
|
-
s.x += Math.sin(
|
|
5434
|
+
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();
|
|
5435
|
+
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;
|
|
5428
5436
|
} else if (n.type === U.Pulse) {
|
|
5429
|
-
const H = (((ht = n.settings) == null ? void 0 : ht.speed) || 1) * 5e-3, Z = (((
|
|
5430
|
-
s.scale_x *= 1 +
|
|
5437
|
+
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;
|
|
5438
|
+
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);
|
|
5431
5439
|
} else if (n.type === U.Draggable) {
|
|
5432
5440
|
const H = ((B = n.settings) == null ? void 0 : B.radius) || 150, Z = this.draggingBehaviors.has(e.id);
|
|
5433
5441
|
if (l < H || Z) {
|
|
5434
|
-
const
|
|
5435
|
-
this.applyBehaviorSensor(s, Zt.PositionX, ft *
|
|
5442
|
+
const K = ((et = n.settings) == null ? void 0 : et.strength) || 1, ft = Z ? 1 : Math.max(0, 1 - l / H);
|
|
5443
|
+
this.applyBehaviorSensor(s, Zt.PositionX, ft * K, t, n.settings), this.applyBehaviorSensor(s, Zt.PositionY, ft * K, t, n.settings);
|
|
5436
5444
|
}
|
|
5437
5445
|
} else if (n.type === U.Scroll) {
|
|
5438
|
-
const H = ((
|
|
5439
|
-
(H === "vertical" || H === "both") && (s.y += this.scrollOffset.y * Z *
|
|
5446
|
+
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;
|
|
5447
|
+
(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);
|
|
5440
5448
|
} else if (n.type === U.LookAt) {
|
|
5441
|
-
const H = ((
|
|
5442
|
-
s.rotation +=
|
|
5449
|
+
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;
|
|
5450
|
+
s.rotation += Tt * H * Z * t * 10;
|
|
5443
5451
|
} else if (n.type === U.Scan) {
|
|
5444
|
-
const H = ((($ = n.settings) == null ? void 0 : $.speed) || 1) * 4e-3, Z = ((Wt = n.settings) == null ? void 0 : Wt.strength) || 1,
|
|
5445
|
-
s.style && (s.style.exposure = (s.style.exposure || 1) +
|
|
5452
|
+
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;
|
|
5453
|
+
s.style && (s.style.exposure = (s.style.exposure || 1) + K * Z * t * 5), s.x += (K - 0.5) * 20 * Z * t;
|
|
5446
5454
|
} else if (n.type === U.Glint)
|
|
5447
5455
|
s.style = s.style || { ...e.style }, s.style.artEffect = {
|
|
5448
5456
|
enabled: !0,
|
|
@@ -5450,18 +5458,18 @@ class ci {
|
|
|
5450
5458
|
intensity: ((Kt = n.settings) == null ? void 0 : Kt.strength) ?? 0.8
|
|
5451
5459
|
};
|
|
5452
5460
|
else if (n.type === U.Ratchet) {
|
|
5453
|
-
const H = ((te = n.settings) == null ? void 0 : te.steps) || 12, Z = (((Jt = n.settings) == null ? void 0 : Jt.speed) || 1) * 30,
|
|
5454
|
-
s.rotation = this.lerp(s.rotation,
|
|
5461
|
+
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);
|
|
5462
|
+
s.rotation = this.lerp(s.rotation, K + Z * t, 0.1);
|
|
5455
5463
|
} else if (n.type === U.Jitter && l < 300) {
|
|
5456
|
-
const H = ((
|
|
5464
|
+
const H = ((pt = n.settings) == null ? void 0 : pt.strength) || 1, Z = (((ct = n.settings) == null ? void 0 : ct.intensity) || 5) * H;
|
|
5457
5465
|
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;
|
|
5458
5466
|
} else if (n.type === U.Follower) {
|
|
5459
5467
|
const H = (Ct = n.settings) == null ? void 0 : Ct.targetId;
|
|
5460
5468
|
if (H) {
|
|
5461
5469
|
const Z = this.objectStates.get(H);
|
|
5462
5470
|
if (Z) {
|
|
5463
|
-
const
|
|
5464
|
-
s.x += ft *
|
|
5471
|
+
const K = ((rt = n.settings) == null ? void 0 : rt.stiffness) || 0.1, ft = Z.x - s.x, Tt = Z.y - s.y;
|
|
5472
|
+
s.x += ft * K * t * 60, s.y += Tt * K * t * 60;
|
|
5465
5473
|
}
|
|
5466
5474
|
}
|
|
5467
5475
|
} else if (n.type === U.Wrap)
|
|
@@ -5475,42 +5483,42 @@ class ci {
|
|
|
5475
5483
|
} else if (n.type === U.Shear) {
|
|
5476
5484
|
const H = ((St = n.settings) == null ? void 0 : St.strength) || 1, Z = ((Xt = n.settings) == null ? void 0 : Xt.radius) || 300;
|
|
5477
5485
|
if (l < Z) {
|
|
5478
|
-
const
|
|
5479
|
-
s.skew_x = this.lerp(s.skew_x || 0, (((Qt = e.transform) == null ? void 0 : Qt.skew_x) || 0) +
|
|
5486
|
+
const K = 1 - l / Z;
|
|
5487
|
+
s.skew_x = this.lerp(s.skew_x || 0, (((Qt = e.transform) == null ? void 0 : Qt.skew_x) || 0) + K * H * 30, 0.1);
|
|
5480
5488
|
} else
|
|
5481
5489
|
s.skew_x = this.lerp(s.skew_x || 0, ((oe = e.transform) == null ? void 0 : oe.skew_x) || 0, 0.05);
|
|
5482
5490
|
} else if (n.type === U.Lens) {
|
|
5483
5491
|
const H = ((Gt = n.settings) == null ? void 0 : Gt.radius) || 200, Z = ((Ht = n.settings) == null ? void 0 : Ht.strength) || 0.5;
|
|
5484
5492
|
if (l < H) {
|
|
5485
|
-
const
|
|
5486
|
-
s.scale_x = this.lerp(s.scale_x ?? 1, (((Nt = e.transform) == null ? void 0 : Nt.scale_x) ?? 1) * (1 +
|
|
5493
|
+
const K = Math.pow(1 - l / H, 2);
|
|
5494
|
+
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);
|
|
5487
5495
|
} else
|
|
5488
|
-
s.scale_x = this.lerp(s.scale_x ?? 1, ((
|
|
5496
|
+
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);
|
|
5489
5497
|
} else if (n.type === U.LayoutAnimation) {
|
|
5490
5498
|
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;
|
|
5491
5499
|
this._layoutAnimCache.has(e.id) || this._layoutAnimCache.set(e.id, /* @__PURE__ */ new Map());
|
|
5492
|
-
const
|
|
5500
|
+
const K = this._layoutAnimCache.get(e.id);
|
|
5493
5501
|
for (const ft of H) {
|
|
5494
|
-
const
|
|
5495
|
-
if (
|
|
5496
|
-
const
|
|
5497
|
-
if (!
|
|
5498
|
-
|
|
5499
|
-
from:
|
|
5500
|
-
to:
|
|
5502
|
+
const Tt = this.getObjectProperty(s, e, ft);
|
|
5503
|
+
if (Tt === void 0) continue;
|
|
5504
|
+
const Rt = K.get(ft);
|
|
5505
|
+
if (!Rt)
|
|
5506
|
+
K.set(ft, {
|
|
5507
|
+
from: Tt,
|
|
5508
|
+
to: Tt,
|
|
5501
5509
|
startTime: this.currentTime,
|
|
5502
5510
|
duration: 0
|
|
5503
5511
|
});
|
|
5504
|
-
else if (
|
|
5512
|
+
else if (Rt.to !== Tt) {
|
|
5505
5513
|
const ee = this.getObjectProperty(s, e, ft);
|
|
5506
|
-
|
|
5507
|
-
from: ee ??
|
|
5508
|
-
to:
|
|
5514
|
+
K.set(ft, {
|
|
5515
|
+
from: ee ?? Rt.from,
|
|
5516
|
+
to: Tt,
|
|
5509
5517
|
startTime: this.currentTime,
|
|
5510
5518
|
duration: (($e = n.settings) == null ? void 0 : $e.duration) ?? Z
|
|
5511
5519
|
});
|
|
5512
5520
|
}
|
|
5513
|
-
const Bt =
|
|
5521
|
+
const Bt = K.get(ft);
|
|
5514
5522
|
if (Bt.duration > 0 && Bt.from !== Bt.to) {
|
|
5515
5523
|
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;
|
|
5516
5524
|
this.setObjectProperty(s, e, ft, re);
|
|
@@ -5518,7 +5526,7 @@ class ci {
|
|
|
5518
5526
|
}
|
|
5519
5527
|
} else if (n.type === U.StateReactive) {
|
|
5520
5528
|
this._layoutAnimCache.has(e.id) || this._layoutAnimCache.set(e.id, /* @__PURE__ */ new Map());
|
|
5521
|
-
const H = this._layoutAnimCache.get(e.id), Z = ((zt = n.settings) == null ? void 0 : zt.defaultDuration) || 0.3,
|
|
5529
|
+
const H = this._layoutAnimCache.get(e.id), Z = ((zt = n.settings) == null ? void 0 : zt.defaultDuration) || 0.3, K = [
|
|
5522
5530
|
"x",
|
|
5523
5531
|
"y",
|
|
5524
5532
|
"scale_x",
|
|
@@ -5533,22 +5541,22 @@ class ci {
|
|
|
5533
5541
|
"style.shadow.offsetX",
|
|
5534
5542
|
"style.shadow.offsetY"
|
|
5535
5543
|
];
|
|
5536
|
-
for (const ft of
|
|
5537
|
-
const
|
|
5538
|
-
if (
|
|
5539
|
-
const
|
|
5540
|
-
if (!
|
|
5544
|
+
for (const ft of K) {
|
|
5545
|
+
const Tt = this.getObjectProperty(s, e, ft);
|
|
5546
|
+
if (Tt === void 0 || typeof Tt != "number") continue;
|
|
5547
|
+
const Rt = H.get(ft);
|
|
5548
|
+
if (!Rt)
|
|
5541
5549
|
H.set(ft, {
|
|
5542
|
-
from:
|
|
5543
|
-
to:
|
|
5550
|
+
from: Tt,
|
|
5551
|
+
to: Tt,
|
|
5544
5552
|
startTime: this.currentTime,
|
|
5545
5553
|
duration: 0
|
|
5546
5554
|
});
|
|
5547
|
-
else if (
|
|
5555
|
+
else if (Rt.to !== Tt) {
|
|
5548
5556
|
const ee = this.getObjectProperty(s, e, ft);
|
|
5549
5557
|
H.set(ft, {
|
|
5550
|
-
from: ee ??
|
|
5551
|
-
to:
|
|
5558
|
+
from: ee ?? Rt.from,
|
|
5559
|
+
to: Tt,
|
|
5552
5560
|
startTime: this.currentTime,
|
|
5553
5561
|
duration: Z
|
|
5554
5562
|
});
|
|
@@ -5562,34 +5570,34 @@ class ci {
|
|
|
5562
5570
|
} else if (n.type === U.SpringChain) {
|
|
5563
5571
|
const H = ((we = n.settings) == null ? void 0 : we.connections) || [], Z = ((Be = n.settings) == null ? void 0 : Be.globalDamping) || 0.3;
|
|
5564
5572
|
this._springChainState.has(e.id) || this._springChainState.set(e.id, /* @__PURE__ */ new Map());
|
|
5565
|
-
const
|
|
5566
|
-
for (const
|
|
5567
|
-
if (!
|
|
5568
|
-
const
|
|
5569
|
-
|
|
5570
|
-
x: (
|
|
5571
|
-
y: (
|
|
5573
|
+
const K = this._springChainState.get(e.id);
|
|
5574
|
+
for (const Tt of H) {
|
|
5575
|
+
if (!K.has(Tt.targetId)) {
|
|
5576
|
+
const Rt = this.objectStates.get(Tt.targetId);
|
|
5577
|
+
K.set(Tt.targetId, {
|
|
5578
|
+
x: (Rt == null ? void 0 : Rt.x) ?? 0,
|
|
5579
|
+
y: (Rt == null ? void 0 : Rt.y) ?? 0,
|
|
5572
5580
|
vx: 0,
|
|
5573
5581
|
vy: 0
|
|
5574
5582
|
});
|
|
5575
5583
|
}
|
|
5576
|
-
|
|
5584
|
+
K.has(e.id) || K.set(e.id, { x: s.x, y: s.y, vx: 0, vy: 0 });
|
|
5577
5585
|
}
|
|
5578
|
-
const ft =
|
|
5586
|
+
const ft = K.get(e.id);
|
|
5579
5587
|
if (ft) {
|
|
5580
5588
|
ft.x = s.x, ft.y = s.y;
|
|
5581
|
-
for (const
|
|
5582
|
-
const
|
|
5583
|
-
if (!
|
|
5584
|
-
const Bt =
|
|
5585
|
-
ft.vx += be * t * 10, ft.vy += Ue * t * 10,
|
|
5586
|
-
const pe = this.objectStates.get(
|
|
5587
|
-
pe && (pe.x +=
|
|
5589
|
+
for (const Tt of H) {
|
|
5590
|
+
const Rt = K.get(Tt.targetId);
|
|
5591
|
+
if (!Rt) continue;
|
|
5592
|
+
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;
|
|
5593
|
+
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;
|
|
5594
|
+
const pe = this.objectStates.get(Tt.targetId);
|
|
5595
|
+
pe && (pe.x += Rt.vx * t, pe.y += Rt.vy * t);
|
|
5588
5596
|
}
|
|
5589
5597
|
s.x += ft.vx * t, s.y += ft.vy * t;
|
|
5590
5598
|
}
|
|
5591
5599
|
} else if (n.type === U.ParticleEmitter) {
|
|
5592
|
-
const H = ((We = n.settings) == null ? void 0 : We.rate) || 10, Z = ((de = n.settings) == null ? void 0 : de.speed) || 100,
|
|
5600
|
+
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;
|
|
5593
5601
|
this._emitterPools.has(e.id) || this._emitterPools.set(e.id, []);
|
|
5594
5602
|
const re = this._emitterPools.get(e.id);
|
|
5595
5603
|
let be = 0;
|
|
@@ -5604,8 +5612,8 @@ class ci {
|
|
|
5604
5612
|
vy: Math.sin(le) * ss,
|
|
5605
5613
|
life: 0,
|
|
5606
5614
|
maxLife: ft * (0.5 + Math.random() * 0.5),
|
|
5607
|
-
size:
|
|
5608
|
-
color:
|
|
5615
|
+
size: K * (0.5 + Math.random()),
|
|
5616
|
+
color: Rt,
|
|
5609
5617
|
opacity: 1
|
|
5610
5618
|
});
|
|
5611
5619
|
}
|
|
@@ -5618,12 +5626,12 @@ class ci {
|
|
|
5618
5626
|
});
|
|
5619
5627
|
}
|
|
5620
5628
|
applyBehaviorSensor(t, i, o, e, s, n, a = 0, r = 0, h = 1) {
|
|
5621
|
-
var d, u, v, b, m, y, S, C, w, M, I, k, T,
|
|
5629
|
+
var d, u, v, b, m, y, S, C, w, M, I, k, T, R, P, _, E, A, W, z, Y, G, N, J;
|
|
5622
5630
|
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;
|
|
5623
5631
|
switch (i) {
|
|
5624
5632
|
case Zt.Scale: {
|
|
5625
|
-
const x = ((d = n == null ? void 0 : n.transform) == null ? void 0 : d.scale_x) ?? 1, F = ((u = n == null ? void 0 : n.transform) == null ? void 0 : u.scale_y) ?? 1,
|
|
5626
|
-
t.scale_x = (t.scale_x ?? x) * (1 - l) +
|
|
5633
|
+
const x = ((d = n == null ? void 0 : n.transform) == null ? void 0 : d.scale_x) ?? 1, F = ((u = n == null ? void 0 : n.transform) == null ? void 0 : u.scale_y) ?? 1, j = x * (1 + o * f * 0.4), X = F * (1 + o * f * 0.4);
|
|
5634
|
+
t.scale_x = (t.scale_x ?? x) * (1 - l) + j * l, t.scale_y = (t.scale_y ?? F) * (1 - l) + X * l;
|
|
5627
5635
|
break;
|
|
5628
5636
|
}
|
|
5629
5637
|
case Zt.Opacity: {
|
|
@@ -5669,7 +5677,7 @@ class ci {
|
|
|
5669
5677
|
}
|
|
5670
5678
|
case Zt.Exposure: {
|
|
5671
5679
|
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 });
|
|
5672
|
-
const x = ((P = (
|
|
5680
|
+
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;
|
|
5673
5681
|
t.style.adjustments.exposure = (t.style.adjustments.exposure ?? x) * (1 - l) + F * l;
|
|
5674
5682
|
break;
|
|
5675
5683
|
}
|
|
@@ -5698,7 +5706,7 @@ class ci {
|
|
|
5698
5706
|
}
|
|
5699
5707
|
case Zt.LetterSpacing: {
|
|
5700
5708
|
t.geometry || (t.geometry = {});
|
|
5701
|
-
const x = ((
|
|
5709
|
+
const x = ((J = n == null ? void 0 : n.geometry) == null ? void 0 : J.letterSpacing) || 0, F = x + o * f * 10;
|
|
5702
5710
|
t.geometry.letterSpacing = (t.geometry.letterSpacing ?? x) * (1 - l) + F * l;
|
|
5703
5711
|
break;
|
|
5704
5712
|
}
|
|
@@ -5807,19 +5815,19 @@ const yi = Ss(({
|
|
|
5807
5815
|
isMouseDown: I,
|
|
5808
5816
|
inputs: k,
|
|
5809
5817
|
interactive: T = !0,
|
|
5810
|
-
onNavigation:
|
|
5818
|
+
onNavigation: R
|
|
5811
5819
|
}, P) => {
|
|
5812
5820
|
const _ = _e(null), E = _e(null);
|
|
5813
5821
|
E.current || (E.current = new ci());
|
|
5814
|
-
const A = _e(void 0), W = _e(0), z = _e(null), Y = _e(y), G = _e(null), [, N] = Qe(g || null),
|
|
5815
|
-
Cs(P, () => _.current), ve(() => (
|
|
5816
|
-
|
|
5822
|
+
const A = _e(void 0), W = _e(0), z = _e(null), Y = _e(y), G = _e(null), [, N] = Qe(g || null), J = _e(!0);
|
|
5823
|
+
Cs(P, () => _.current), ve(() => (J.current = !0, () => {
|
|
5824
|
+
J.current = !1, A.current && cancelAnimationFrame(A.current);
|
|
5817
5825
|
}), []), ve(() => {
|
|
5818
5826
|
E.current.setLayout(e, s);
|
|
5819
5827
|
}, [e, s]), ve(() => {
|
|
5820
|
-
const
|
|
5821
|
-
a &&
|
|
5822
|
-
}, [a, r, h, f, l, p, c, d, u, v, b,
|
|
5828
|
+
const L = E.current;
|
|
5829
|
+
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);
|
|
5830
|
+
}, [a, r, h, f, l, p, c, d, u, v, b, R]), ve(() => {
|
|
5823
5831
|
(async () => {
|
|
5824
5832
|
let O = g;
|
|
5825
5833
|
if (t && !g)
|
|
@@ -5834,8 +5842,8 @@ const yi = Ss(({
|
|
|
5834
5842
|
}
|
|
5835
5843
|
})();
|
|
5836
5844
|
}, [g, t, y]), ve(() => {
|
|
5837
|
-
const
|
|
5838
|
-
if (!E.current || !
|
|
5845
|
+
const L = (O) => {
|
|
5846
|
+
if (!E.current || !J.current) return;
|
|
5839
5847
|
const D = E.current, q = _.current;
|
|
5840
5848
|
if (!q) return;
|
|
5841
5849
|
const ot = q.getContext("2d");
|
|
@@ -5844,75 +5852,75 @@ const yi = Ss(({
|
|
|
5844
5852
|
W.current === 0 && (W.current = yt);
|
|
5845
5853
|
let bt = yt - W.current;
|
|
5846
5854
|
bt > 0.1 && (bt = 0.1), W.current = yt;
|
|
5847
|
-
const
|
|
5855
|
+
const gt = q.getBoundingClientRect(), Et = window.devicePixelRatio || 1, It = Math.round(gt.width * Et), vt = Math.round(gt.height * Et);
|
|
5848
5856
|
(q.width !== It || q.height !== vt) && (q.width = It, q.height = vt);
|
|
5849
5857
|
try {
|
|
5850
5858
|
o ? D.advance(bt) : m !== void 0 && D.seek(m), D.render(ot, q.width, q.height);
|
|
5851
5859
|
} catch (Yt) {
|
|
5852
5860
|
console.error("[ExodeUICanvas] Error in animation loop:", Yt), d && d(`[Error] Animation loop crashed: ${Yt}`, "error");
|
|
5853
5861
|
}
|
|
5854
|
-
A.current = requestAnimationFrame(
|
|
5862
|
+
A.current = requestAnimationFrame(L);
|
|
5855
5863
|
};
|
|
5856
|
-
return A.current = requestAnimationFrame(
|
|
5864
|
+
return A.current = requestAnimationFrame(L), () => {
|
|
5857
5865
|
A.current && cancelAnimationFrame(A.current);
|
|
5858
5866
|
};
|
|
5859
5867
|
}, [o, m]), ve(() => {
|
|
5860
|
-
const
|
|
5861
|
-
S !== void 0 &&
|
|
5868
|
+
const L = E.current;
|
|
5869
|
+
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));
|
|
5862
5870
|
}, [S, C, w, M, I, k]);
|
|
5863
|
-
const x = (
|
|
5871
|
+
const x = (L, O) => {
|
|
5864
5872
|
if (!T || !_.current) return;
|
|
5865
|
-
|
|
5866
|
-
const D = _.current, q = D.getBoundingClientRect(), ot =
|
|
5873
|
+
L.stopPropagation(), "nativeEvent" in L && L.nativeEvent && typeof L.nativeEvent.stopImmediatePropagation == "function" ? L.nativeEvent.stopImmediatePropagation() : typeof L.stopImmediatePropagation == "function" && L.stopImmediatePropagation();
|
|
5874
|
+
const D = _.current, q = D.getBoundingClientRect(), ot = L.clientX - q.left, yt = L.clientY - q.top, bt = window.devicePixelRatio || 1;
|
|
5867
5875
|
(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);
|
|
5868
5876
|
};
|
|
5869
5877
|
ve(() => {
|
|
5870
5878
|
if (!T) return;
|
|
5871
|
-
const
|
|
5879
|
+
const L = (D) => {
|
|
5872
5880
|
var q, ot, yt;
|
|
5873
5881
|
((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);
|
|
5874
5882
|
}, O = (D) => {
|
|
5875
5883
|
var q, ot, yt;
|
|
5876
5884
|
((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);
|
|
5877
5885
|
};
|
|
5878
|
-
return window.addEventListener("keydown",
|
|
5879
|
-
window.removeEventListener("keydown",
|
|
5886
|
+
return window.addEventListener("keydown", L), window.addEventListener("keyup", O), () => {
|
|
5887
|
+
window.removeEventListener("keydown", L), window.removeEventListener("keyup", O);
|
|
5880
5888
|
};
|
|
5881
5889
|
}, [T]);
|
|
5882
|
-
const [F,
|
|
5890
|
+
const [F, j] = Qe([]);
|
|
5883
5891
|
ve(() => {
|
|
5884
5892
|
if (g && g.objects) {
|
|
5885
|
-
const
|
|
5893
|
+
const L = g.objects.filter((O) => {
|
|
5886
5894
|
var D, q;
|
|
5887
5895
|
return O.type === "Joystick" && ((D = O.inputBinding) == null ? void 0 : D.type) === "keyboard" && ((q = O.inputBinding.keyboardConfig) == null ? void 0 : q.showVirtualKeyboard);
|
|
5888
5896
|
});
|
|
5889
|
-
|
|
5897
|
+
j(L);
|
|
5890
5898
|
}
|
|
5891
5899
|
}, [g]);
|
|
5892
5900
|
const [, X] = Qe(0);
|
|
5893
5901
|
ve(() => {
|
|
5894
5902
|
if (F.length === 0) return;
|
|
5895
|
-
let
|
|
5903
|
+
let L;
|
|
5896
5904
|
const O = () => {
|
|
5897
|
-
X((D) => D + 1),
|
|
5905
|
+
X((D) => D + 1), L = requestAnimationFrame(O);
|
|
5898
5906
|
};
|
|
5899
|
-
return
|
|
5907
|
+
return L = requestAnimationFrame(O), () => cancelAnimationFrame(L);
|
|
5900
5908
|
}, [F.length]);
|
|
5901
|
-
const
|
|
5902
|
-
const O =
|
|
5909
|
+
const tt = () => F.map((L) => {
|
|
5910
|
+
const O = L.inputBinding.keyboardConfig, D = (gt) => {
|
|
5903
5911
|
var It;
|
|
5904
|
-
const Et = { key:
|
|
5912
|
+
const Et = { key: gt, code: gt, preventDefault: () => {
|
|
5905
5913
|
} };
|
|
5906
5914
|
(It = E.current) == null || It.handleKeyDown(Et);
|
|
5907
|
-
}, q = (
|
|
5915
|
+
}, q = (gt) => {
|
|
5908
5916
|
var It;
|
|
5909
|
-
const Et = { key:
|
|
5917
|
+
const Et = { key: gt, code: gt, preventDefault: () => {
|
|
5910
5918
|
} };
|
|
5911
5919
|
(It = E.current) == null || It.handleKeyUp(Et);
|
|
5912
|
-
}, ot = E.current, yt = (
|
|
5920
|
+
}, ot = E.current, yt = (gt) => ot && ot.activeKeys ? ot.activeKeys.has(gt.toLowerCase()) : !1, bt = (gt) => ({
|
|
5913
5921
|
width: "50px",
|
|
5914
5922
|
height: "50px",
|
|
5915
|
-
background:
|
|
5923
|
+
background: gt ? "rgba(255, 255, 255, 0.4)" : "rgba(0, 0, 0, 0.4)",
|
|
5916
5924
|
border: "1px solid rgba(255, 255, 255, 0.2)",
|
|
5917
5925
|
borderRadius: "12px",
|
|
5918
5926
|
display: "flex",
|
|
@@ -5925,7 +5933,7 @@ const yi = Ss(({
|
|
|
5925
5933
|
cursor: "pointer",
|
|
5926
5934
|
backdropFilter: "blur(8px)",
|
|
5927
5935
|
transition: "background 0.1s",
|
|
5928
|
-
boxShadow:
|
|
5936
|
+
boxShadow: gt ? "none" : "0 4px 6px rgba(0,0,0,0.1)"
|
|
5929
5937
|
});
|
|
5930
5938
|
return /* @__PURE__ */ Je("div", { style: {
|
|
5931
5939
|
position: "absolute",
|
|
@@ -5945,11 +5953,11 @@ const yi = Ss(({
|
|
|
5945
5953
|
onMouseDown: () => D(O.upKey),
|
|
5946
5954
|
onMouseUp: () => q(O.upKey),
|
|
5947
5955
|
onMouseLeave: () => q(O.upKey),
|
|
5948
|
-
onTouchStart: (
|
|
5949
|
-
|
|
5956
|
+
onTouchStart: (gt) => {
|
|
5957
|
+
gt.preventDefault(), D(O.upKey);
|
|
5950
5958
|
},
|
|
5951
|
-
onTouchEnd: (
|
|
5952
|
-
|
|
5959
|
+
onTouchEnd: (gt) => {
|
|
5960
|
+
gt.preventDefault(), q(O.upKey);
|
|
5953
5961
|
},
|
|
5954
5962
|
children: O.upKey.toUpperCase()
|
|
5955
5963
|
}
|
|
@@ -5962,11 +5970,11 @@ const yi = Ss(({
|
|
|
5962
5970
|
onMouseDown: () => D(O.leftKey),
|
|
5963
5971
|
onMouseUp: () => q(O.leftKey),
|
|
5964
5972
|
onMouseLeave: () => q(O.leftKey),
|
|
5965
|
-
onTouchStart: (
|
|
5966
|
-
|
|
5973
|
+
onTouchStart: (gt) => {
|
|
5974
|
+
gt.preventDefault(), D(O.leftKey);
|
|
5967
5975
|
},
|
|
5968
|
-
onTouchEnd: (
|
|
5969
|
-
|
|
5976
|
+
onTouchEnd: (gt) => {
|
|
5977
|
+
gt.preventDefault(), q(O.leftKey);
|
|
5970
5978
|
},
|
|
5971
5979
|
children: O.leftKey.toUpperCase()
|
|
5972
5980
|
}
|
|
@@ -5978,11 +5986,11 @@ const yi = Ss(({
|
|
|
5978
5986
|
onMouseDown: () => D(O.downKey),
|
|
5979
5987
|
onMouseUp: () => q(O.downKey),
|
|
5980
5988
|
onMouseLeave: () => q(O.downKey),
|
|
5981
|
-
onTouchStart: (
|
|
5982
|
-
|
|
5989
|
+
onTouchStart: (gt) => {
|
|
5990
|
+
gt.preventDefault(), D(O.downKey);
|
|
5983
5991
|
},
|
|
5984
|
-
onTouchEnd: (
|
|
5985
|
-
|
|
5992
|
+
onTouchEnd: (gt) => {
|
|
5993
|
+
gt.preventDefault(), q(O.downKey);
|
|
5986
5994
|
},
|
|
5987
5995
|
children: O.downKey.toUpperCase()
|
|
5988
5996
|
}
|
|
@@ -5994,37 +6002,37 @@ const yi = Ss(({
|
|
|
5994
6002
|
onMouseDown: () => D(O.rightKey),
|
|
5995
6003
|
onMouseUp: () => q(O.rightKey),
|
|
5996
6004
|
onMouseLeave: () => q(O.rightKey),
|
|
5997
|
-
onTouchStart: (
|
|
5998
|
-
|
|
6005
|
+
onTouchStart: (gt) => {
|
|
6006
|
+
gt.preventDefault(), D(O.rightKey);
|
|
5999
6007
|
},
|
|
6000
|
-
onTouchEnd: (
|
|
6001
|
-
|
|
6008
|
+
onTouchEnd: (gt) => {
|
|
6009
|
+
gt.preventDefault(), q(O.rightKey);
|
|
6002
6010
|
},
|
|
6003
6011
|
children: O.rightKey.toUpperCase()
|
|
6004
6012
|
}
|
|
6005
6013
|
)
|
|
6006
6014
|
] })
|
|
6007
|
-
] },
|
|
6015
|
+
] }, L.id);
|
|
6008
6016
|
});
|
|
6009
6017
|
return /* @__PURE__ */ Je("div", { style: { position: "relative", width: "100%", height: "100%" }, children: [
|
|
6010
6018
|
/* @__PURE__ */ ge(
|
|
6011
6019
|
"canvas",
|
|
6012
6020
|
{
|
|
6013
6021
|
ref: _,
|
|
6014
|
-
onPointerDown: (
|
|
6022
|
+
onPointerDown: (L) => {
|
|
6015
6023
|
var O;
|
|
6016
|
-
x(
|
|
6024
|
+
x(L, "down"), (O = _.current) == null || O.focus();
|
|
6017
6025
|
},
|
|
6018
|
-
onPointerMove: (
|
|
6019
|
-
onPointerUp: (
|
|
6020
|
-
onPointerCancel: (
|
|
6021
|
-
onClick: (
|
|
6022
|
-
onWheel: (
|
|
6023
|
-
E.current.handleWheel(
|
|
6026
|
+
onPointerMove: (L) => x(L, "move"),
|
|
6027
|
+
onPointerUp: (L) => x(L, "up"),
|
|
6028
|
+
onPointerCancel: (L) => x(L, "up"),
|
|
6029
|
+
onClick: (L) => x(L, "click"),
|
|
6030
|
+
onWheel: (L) => {
|
|
6031
|
+
E.current.handleWheel(L.deltaX, L.deltaY);
|
|
6024
6032
|
},
|
|
6025
|
-
onKeyDown: (
|
|
6026
|
-
onKeyUp: (
|
|
6027
|
-
onContextMenu: (
|
|
6033
|
+
onKeyDown: (L) => E.current.handleKeyDown(L.nativeEvent),
|
|
6034
|
+
onKeyUp: (L) => E.current.handleKeyUp(L.nativeEvent),
|
|
6035
|
+
onContextMenu: (L) => L.preventDefault(),
|
|
6028
6036
|
tabIndex: 0,
|
|
6029
6037
|
style: {
|
|
6030
6038
|
...i,
|
|
@@ -6037,7 +6045,7 @@ const yi = Ss(({
|
|
|
6037
6045
|
}
|
|
6038
6046
|
}
|
|
6039
6047
|
),
|
|
6040
|
-
|
|
6048
|
+
tt()
|
|
6041
6049
|
] });
|
|
6042
6050
|
});
|
|
6043
6051
|
function bi() {
|
|
@@ -6144,7 +6152,7 @@ const vi = ({ artboard: g, config: t }) => {
|
|
|
6144
6152
|
]
|
|
6145
6153
|
}
|
|
6146
6154
|
);
|
|
6147
|
-
}, hi = "6.3.
|
|
6155
|
+
}, hi = "6.3.41", fi = {
|
|
6148
6156
|
version: hi
|
|
6149
6157
|
}, Si = fi.version;
|
|
6150
6158
|
export {
|