@snowcone-app/canvas 0.28.0 → 0.29.0
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/{CanvasRenderer-B_3GISlW.js → CanvasRenderer-_lFoIoz5.js} +1083 -1071
- package/dist/CanvasRenderer-_lFoIoz5.js.map +1 -0
- package/dist/{CanvasStateV1-kL09wsAn.js → CanvasStateV1-BMxr6xb8.js} +7 -4
- package/dist/{CanvasStateV1-kL09wsAn.js.map → CanvasStateV1-BMxr6xb8.js.map} +1 -1
- package/dist/{ContextualToolbars-C69oYLdw.js → ContextualToolbars-0jWvnQgp.js} +1718 -1656
- package/dist/ContextualToolbars-0jWvnQgp.js.map +1 -0
- package/dist/{EditorCanvasImpl-CrI9C_xM.js → EditorCanvasImpl-BNz8TPFs.js} +8 -8
- package/dist/{EditorCanvasImpl-CrI9C_xM.js.map → EditorCanvasImpl-BNz8TPFs.js.map} +1 -1
- package/dist/{ExportManager-J2xK86uq.js → ExportManager-B8Td7uR5.js} +1043 -964
- package/dist/ExportManager-B8Td7uR5.js.map +1 -0
- package/dist/{FontAnalyzer-PE6nysqE.js → FontAnalyzer-D4Sg-P6_.js} +1234 -1172
- package/dist/FontAnalyzer-D4Sg-P6_.js.map +1 -0
- package/dist/{ImagePanel-CmQCxBGm.js → ImagePanel-CN2Bu3hf.js} +6 -6
- package/dist/{ImagePanel-CmQCxBGm.js.map → ImagePanel-CN2Bu3hf.js.map} +1 -1
- package/dist/{SnowconeCanvas-CQiFVR0X.js → SnowconeCanvas-CR_LdRFP.js} +27 -27
- package/dist/{SnowconeCanvas-CQiFVR0X.js.map → SnowconeCanvas-CR_LdRFP.js.map} +1 -1
- package/dist/{UnifiedFontService-BJzoqfBF.js → UnifiedFontService-CgYnYTj7.js} +7 -7
- package/dist/{UnifiedFontService-BJzoqfBF.js.map → UnifiedFontService-CgYnYTj7.js.map} +1 -1
- package/dist/advanced.mjs +14 -14
- package/dist/components/toolbars/SecondaryPanels.d.ts +11 -0
- package/dist/core/TextElement.d.ts +13 -0
- package/dist/core/TextMetrics.d.ts +17 -3
- package/dist/core/rich-text-layout.d.ts +2 -0
- package/dist/core/text-spacing.d.ts +74 -0
- package/dist/{custom-icons-BWiUGqD6.js → custom-icons-B5TRC1Ed.js} +2 -2
- package/dist/{custom-icons-BWiUGqD6.js.map → custom-icons-B5TRC1Ed.js.map} +1 -1
- package/dist/{design-builder-bquxIHct.js → design-builder-COj0zkxu.js} +2 -2
- package/dist/{design-builder-bquxIHct.js.map → design-builder-COj0zkxu.js.map} +1 -1
- package/dist/{editorErrors-8uDRMhow.js → editorErrors-CCvoKj_P.js} +2 -2
- package/dist/{editorErrors-8uDRMhow.js.map → editorErrors-CCvoKj_P.js.map} +1 -1
- package/dist/{embed-L3oRIgsj.js → embed-BTRtoktw.js} +10 -10
- package/dist/{embed-L3oRIgsj.js.map → embed-BTRtoktw.js.map} +1 -1
- package/dist/embed.mjs +6 -6
- package/dist/{guards-BlbhM5MX.js → guards-uQtEQJbs.js} +2 -2
- package/dist/{guards-BlbhM5MX.js.map → guards-uQtEQJbs.js.map} +1 -1
- package/dist/hooks/useTextToolbar.d.ts +8 -0
- package/dist/index.mjs +8 -8
- package/dist/internals.mjs +5 -5
- package/dist/rendering/renderer-types.d.ts +4 -0
- package/dist/rendering/rich-text-renderer.d.ts +4 -0
- package/dist/rendering/text-renderer.d.ts +4 -1
- package/dist/state/CanvasStateV1.d.ts +3 -0
- package/dist/{template-fields-ai7vnW8g.js → template-fields-BLRp84Ny.js} +6 -6
- package/dist/{template-fields-ai7vnW8g.js.map → template-fields-BLRp84Ny.js.map} +1 -1
- package/dist/testing.mjs +4 -4
- package/dist/types/index.d.ts +26 -0
- package/dist/{usePieceGuideBundle-CMe5br2a.js → usePieceGuideBundle-CTQszfKA.js} +2 -2
- package/dist/{usePieceGuideBundle-CMe5br2a.js.map → usePieceGuideBundle-CTQszfKA.js.map} +1 -1
- package/dist/utils/featureApplied.d.ts +6 -0
- package/dist/{validation-B8kIYutI.js → validation-eCebhplp.js} +1940 -1935
- package/dist/validation-eCebhplp.js.map +1 -0
- package/dist/workers/export-worker.bundle.string.d.ts +1 -1
- package/example/package.json +1 -1
- package/package.json +1 -1
- package/dist/CanvasRenderer-B_3GISlW.js.map +0 -1
- package/dist/ContextualToolbars-C69oYLdw.js.map +0 -1
- package/dist/ExportManager-J2xK86uq.js.map +0 -1
- package/dist/FontAnalyzer-PE6nysqE.js.map +0 -1
- package/dist/validation-B8kIYutI.js.map +0 -1
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { c as
|
|
2
|
-
let
|
|
3
|
-
function
|
|
4
|
-
|
|
1
|
+
import { c as U, G as me, a2 as Be, a3 as Le, a4 as Ne, a5 as ye, a6 as Wn, a7 as Ue, a8 as Z, a0 as We, a1 as ze, a9 as sn, aa as zn, z as Xn, R as Ge, ab as He, ac as q, ad as Ve, ae as vn, P as je, S as qe, I as En, M as Xe, W as Ye, H as Ke, D as Je, O as Ze, J as Qe, K as nt, A as Yn } from "./FontAnalyzer-D4Sg-P6_.js";
|
|
2
|
+
let $e = null;
|
|
3
|
+
function et(e) {
|
|
4
|
+
$e = e;
|
|
5
5
|
}
|
|
6
|
-
function
|
|
7
|
-
return
|
|
6
|
+
function Ca() {
|
|
7
|
+
return $e;
|
|
8
8
|
}
|
|
9
|
-
const
|
|
9
|
+
const tt = U("TextureManager"), cn = class cn {
|
|
10
10
|
/**
|
|
11
11
|
* Load a texture by ID or URL
|
|
12
12
|
*/
|
|
@@ -20,7 +20,7 @@ const Ze = N("TextureManager"), sn = class sn {
|
|
|
20
20
|
s.crossOrigin = "anonymous", s.onload = () => {
|
|
21
21
|
this.cache.set(n, s), this.cache.set(t, s), this.loading.delete(n), this.loading.delete(t), r(s);
|
|
22
22
|
}, s.onerror = () => {
|
|
23
|
-
|
|
23
|
+
tt.error("Failed to load texture:", t), this.loading.delete(n), this.loading.delete(t), o(new Error(`Failed to load texture: ${t}`));
|
|
24
24
|
}, s.src = t;
|
|
25
25
|
});
|
|
26
26
|
return this.loading.set(n, a), t !== n && this.loading.set(t, a), a;
|
|
@@ -86,7 +86,7 @@ const Ze = N("TextureManager"), sn = class sn {
|
|
|
86
86
|
return (t == null ? void 0 : t.presetColor) || "#ffffff";
|
|
87
87
|
}
|
|
88
88
|
};
|
|
89
|
-
|
|
89
|
+
cn.cache = /* @__PURE__ */ new Map(), cn.loading = /* @__PURE__ */ new Map(), cn.TEXTURES = [
|
|
90
90
|
{
|
|
91
91
|
id: "glass-frame",
|
|
92
92
|
name: "Glass Frame",
|
|
@@ -96,33 +96,33 @@ sn.cache = /* @__PURE__ */ new Map(), sn.loading = /* @__PURE__ */ new Map(), sn
|
|
|
96
96
|
// Light gray
|
|
97
97
|
}
|
|
98
98
|
];
|
|
99
|
-
let
|
|
100
|
-
const
|
|
99
|
+
let J = cn;
|
|
100
|
+
const at = U("ElementPreviewRenderer"), rt = {
|
|
101
101
|
width: 40,
|
|
102
102
|
height: 40,
|
|
103
103
|
padding: 4,
|
|
104
104
|
backgroundColor: "transparent"
|
|
105
105
|
};
|
|
106
|
-
function
|
|
107
|
-
|
|
108
|
-
const t = { ...
|
|
106
|
+
function st(e, n = {}) {
|
|
107
|
+
Hn();
|
|
108
|
+
const t = { ...rt, ...n }, a = document.createElement("canvas");
|
|
109
109
|
a.width = t.width, a.height = t.height;
|
|
110
110
|
const r = a.getContext("2d");
|
|
111
111
|
if (!r)
|
|
112
112
|
return "";
|
|
113
113
|
t.backgroundColor !== "transparent" && (r.fillStyle = t.backgroundColor, r.fillRect(0, 0, t.width, t.height)), r.save();
|
|
114
114
|
try {
|
|
115
|
-
e instanceof
|
|
115
|
+
e instanceof me ? ot(r, e, t) : it(r, e, t);
|
|
116
116
|
} catch (o) {
|
|
117
|
-
|
|
117
|
+
at.warn("Failed to generate preview:", o);
|
|
118
118
|
}
|
|
119
119
|
return r.restore(), a.toDataURL("image/png");
|
|
120
120
|
}
|
|
121
|
-
function
|
|
121
|
+
function it(e, n, t) {
|
|
122
122
|
var f;
|
|
123
123
|
const a = ((f = n.getBoundingBox) == null ? void 0 : f.call(n)) || { x: 0, y: 0, width: 100, height: 100 }, r = a.width, o = a.height;
|
|
124
124
|
if (r === 0 || o === 0) {
|
|
125
|
-
|
|
125
|
+
Kn(e, n, t);
|
|
126
126
|
return;
|
|
127
127
|
}
|
|
128
128
|
const s = t.width - t.padding * 2, c = t.height - t.padding * 2, i = Math.min(
|
|
@@ -131,14 +131,14 @@ function tt(e, n, t) {
|
|
|
131
131
|
1
|
|
132
132
|
// Don't scale up, only down
|
|
133
133
|
), l = r * i, d = o * i, u = t.padding + (s - l) / 2, p = t.padding + (c - d) / 2;
|
|
134
|
-
e.save(), e.translate(u - a.x * i, p - a.y * i), e.scale(i, i), typeof n.render == "function" ? n.render(e, !1, !1) :
|
|
134
|
+
e.save(), e.translate(u - a.x * i, p - a.y * i), e.scale(i, i), typeof n.render == "function" ? n.render(e, !1, !1) : Kn(e, n, t), e.restore();
|
|
135
135
|
}
|
|
136
|
-
function
|
|
136
|
+
function Kn(e, n, t) {
|
|
137
137
|
e.fillStyle = "#888888", e.font = "10px Arial", e.textAlign = "center", e.textBaseline = "middle";
|
|
138
138
|
const a = n.transformType || "Element";
|
|
139
139
|
e.fillText(a, t.width / 2, t.height / 2);
|
|
140
140
|
}
|
|
141
|
-
function
|
|
141
|
+
function ot(e, n, t) {
|
|
142
142
|
const a = t.width - t.padding * 2, r = t.height - t.padding * 2, o = t.padding, s = t.padding;
|
|
143
143
|
e.fillStyle = "#888888", e.strokeStyle = "#666666", e.lineWidth = 1;
|
|
144
144
|
const c = r * 0.7, i = s + r * 0.3, l = a * 0.4, d = r * 0.2;
|
|
@@ -148,21 +148,21 @@ function at(e, n, t) {
|
|
|
148
148
|
i + c / 2
|
|
149
149
|
));
|
|
150
150
|
}
|
|
151
|
-
function
|
|
151
|
+
function ka(e, n, t) {
|
|
152
152
|
var l;
|
|
153
153
|
e.translate(n.x || 0, n.y || 0), e.rotate(-(n.rotation || 0) * Math.PI / 180);
|
|
154
154
|
const a = n, r = a.fontSize || 24, o = a.fontFamily || "Arial", s = a.bold || !1, c = a.italic || !1;
|
|
155
|
-
e.font =
|
|
155
|
+
e.font = Be(r, o, s, c);
|
|
156
156
|
const i = a.text || "";
|
|
157
157
|
if (n.transformType === "custom") {
|
|
158
|
-
const u = ((l = n.transformData) == null ? void 0 : l.width) || 200, p =
|
|
159
|
-
e.rect(-f / 2,
|
|
158
|
+
const u = ((l = n.transformData) == null ? void 0 : l.width) || 200, p = Le(i, r, o, s, c), f = Math.min(p, u), $ = r * 1.2;
|
|
159
|
+
e.rect(-f / 2, -$ / 2, f, $);
|
|
160
160
|
} else {
|
|
161
161
|
const d = e.measureText(i).width;
|
|
162
162
|
e.beginPath(), e.moveTo(-d / 2, 0), e.lineTo(d / 2, 0), e.moveTo(-d / 2, -r), e.lineTo(d / 2, -r), e.moveTo(-d / 2, r * 0.2), e.lineTo(d / 2, r * 0.2);
|
|
163
163
|
}
|
|
164
164
|
}
|
|
165
|
-
function
|
|
165
|
+
function ct(e, n) {
|
|
166
166
|
if (!n.transformData) return;
|
|
167
167
|
const { borderRadius: t = 0 } = n.transformData, a = n.transformData.width ?? 100, r = n.transformData.height ?? 100;
|
|
168
168
|
if (e.translate(n.x || 0, n.y || 0), e.rotate(-(n.rotation || 0) * Math.PI / 180), e.beginPath(), t > 0) {
|
|
@@ -171,22 +171,22 @@ function rt(e, n) {
|
|
|
171
171
|
} else
|
|
172
172
|
e.rect(-a / 2, -r / 2, a, r);
|
|
173
173
|
}
|
|
174
|
-
function
|
|
174
|
+
function Ta(e, n, t, a) {
|
|
175
175
|
e.beginPath(), e.arc(n, t, a, 0, Math.PI * 2), e.closePath();
|
|
176
176
|
}
|
|
177
|
-
function
|
|
177
|
+
function _a(e, n, t, a, r) {
|
|
178
178
|
e.beginPath(), e.rect(n, t, a, r), e.closePath();
|
|
179
179
|
}
|
|
180
|
-
function
|
|
180
|
+
function xe(e, n) {
|
|
181
181
|
e.strokeStyle = n.color, e.lineWidth = n.width, e.lineCap = n.lineCap || "butt", e.lineJoin = n.lineJoin || "miter", n.miterLimit !== void 0 && (e.miterLimit = n.miterLimit), n.dashArray && n.dashArray.length > 0 ? e.setLineDash(n.dashArray) : e.setLineDash([]), n.opacity !== void 0 && (e.globalAlpha = n.opacity);
|
|
182
182
|
}
|
|
183
|
-
function
|
|
183
|
+
function lt(e, n) {
|
|
184
184
|
if (typeof OffscreenCanvas < "u")
|
|
185
185
|
return new OffscreenCanvas(e, n);
|
|
186
186
|
const t = document.createElement("canvas");
|
|
187
187
|
return t.width = e, t.height = n, t;
|
|
188
188
|
}
|
|
189
|
-
function
|
|
189
|
+
function ve(e, n, t) {
|
|
190
190
|
var i;
|
|
191
191
|
if (!((i = n.stroke) != null && i.enabled)) return;
|
|
192
192
|
const a = n;
|
|
@@ -194,148 +194,149 @@ function me(e, n, t) {
|
|
|
194
194
|
const o = (t == null ? void 0 : t.isKnockout) === !0, s = n.stroke.opacity ?? 1;
|
|
195
195
|
if (!o && s < 1)
|
|
196
196
|
try {
|
|
197
|
-
|
|
197
|
+
dt(e, n, a, t, s);
|
|
198
198
|
} catch {
|
|
199
|
-
|
|
199
|
+
on(e, n, a, t, !1);
|
|
200
200
|
}
|
|
201
201
|
else
|
|
202
|
-
|
|
202
|
+
on(e, n, a, t, o);
|
|
203
203
|
}
|
|
204
|
-
function
|
|
205
|
-
var
|
|
206
|
-
const o = t.text || "", s = t.fontSize || 24, c = n.stroke.width, i = n.stroke.feather || 0, l = n.transformType === "custom" && ((
|
|
207
|
-
if (
|
|
208
|
-
|
|
204
|
+
function dt(e, n, t, a, r) {
|
|
205
|
+
var k, _;
|
|
206
|
+
const o = t.text || "", s = t.fontSize || 24, c = n.stroke.width, i = n.stroke.feather || 0, l = n.transformType === "custom" && ((k = n.transformData) == null ? void 0 : k.width), d = l ? ((_ = n.transformData) == null ? void 0 : _.width) ?? 200 : 0, u = l ? d + c * 2 + i * 2 + 40 : s * o.length * 0.7 + c * 2 + i * 2 + 40, p = s * 3 + c * 2 + i * 2 + 40, f = e.getTransform(), $ = Math.max(Math.abs(f.a), Math.abs(f.d), 1), h = Math.ceil(u * $ / 2) * 2, b = Math.ceil(p * $ / 2) * 2;
|
|
207
|
+
if (h <= 0 || b <= 0) {
|
|
208
|
+
on(e, n, t, a, !1);
|
|
209
209
|
return;
|
|
210
210
|
}
|
|
211
|
-
const
|
|
212
|
-
if (
|
|
213
|
-
|
|
211
|
+
const v = lt(h, b), y = v.getContext("2d");
|
|
212
|
+
if (!y) {
|
|
213
|
+
on(e, n, t, a, !1);
|
|
214
214
|
return;
|
|
215
215
|
}
|
|
216
|
-
const
|
|
217
|
-
|
|
216
|
+
const x = n.x || 0, m = n.y || 0, g = f.a * x + f.c * m + f.e, C = f.b * x + f.d * m + f.f;
|
|
217
|
+
y.setTransform(
|
|
218
218
|
f.a,
|
|
219
219
|
f.b,
|
|
220
220
|
f.c,
|
|
221
221
|
f.d,
|
|
222
|
-
|
|
223
|
-
|
|
222
|
+
h / 2 - g + f.e,
|
|
223
|
+
b / 2 - C + f.f
|
|
224
224
|
);
|
|
225
225
|
const T = n.stroke.opacity;
|
|
226
|
-
n.stroke.opacity = 1,
|
|
227
|
-
|
|
228
|
-
Math.round(
|
|
229
|
-
Math.round(
|
|
226
|
+
n.stroke.opacity = 1, on(y, n, t, a, !1), n.stroke.opacity = T, e.save(), e.resetTransform(), e.globalAlpha = r, e.drawImage(
|
|
227
|
+
v,
|
|
228
|
+
Math.round(g - h / 2),
|
|
229
|
+
Math.round(C - b / 2)
|
|
230
230
|
), e.restore();
|
|
231
231
|
}
|
|
232
|
-
function
|
|
232
|
+
function on(e, n, t, a, r) {
|
|
233
233
|
var f;
|
|
234
234
|
const o = t.text || "";
|
|
235
235
|
e.save(), a != null && a.positionApplied || (e.translate(n.x || 0, n.y || 0), e.rotate(-(n.rotation || 0) * Math.PI / 180));
|
|
236
236
|
const s = t.fontSize || 24, c = t.fontFamily || "Arial", i = t.bold || !1, l = t.italic || !1, d = t.textAlign || "center";
|
|
237
237
|
e.font = `${l ? "italic " : ""}${i ? "bold " : ""}${s}px ${c}`, e.textAlign = d, e.textBaseline = "alphabetic", r ? (e.strokeStyle = "#000000", e.globalAlpha = 1) : (e.strokeStyle = n.stroke.color, n.stroke.opacity !== void 0 && (e.globalAlpha = n.stroke.opacity)), e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "round", e.lineJoin = n.stroke.lineJoin || "round", n.stroke.miterLimit !== void 0 && (e.miterLimit = n.stroke.miterLimit), !r && n.stroke.feather && n.stroke.feather > 0 && "filter" in e && (e.filter = `blur(${n.stroke.feather}px)`);
|
|
238
|
-
const u =
|
|
238
|
+
const u = Ne(s, c, i, l);
|
|
239
239
|
if (n.transformType === "custom" && ((f = n.transformData) == null ? void 0 : f.width)) {
|
|
240
|
-
const
|
|
240
|
+
const $ = n.transformData, h = ($ == null ? void 0 : $.width) ?? 200, b = h - Z * 2, v = t.letterSpacing ?? 0, { lines: y, height: x } = ye(
|
|
241
241
|
o,
|
|
242
|
-
|
|
242
|
+
b,
|
|
243
243
|
s,
|
|
244
244
|
c,
|
|
245
245
|
i,
|
|
246
246
|
l,
|
|
247
247
|
void 0,
|
|
248
248
|
// No locked line count for stroke
|
|
249
|
-
!0
|
|
249
|
+
!0,
|
|
250
250
|
// strict: wrap exactly at maxWidth
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
const P = k.match(/^ +/), A = P ? P[0].length : 0;
|
|
257
|
-
A > 0 && (w = w.substring(A));
|
|
258
|
-
}
|
|
251
|
+
{ letterSpacing: v, lineHeight: t.lineHeight }
|
|
252
|
+
), m = -h / 2, g = -x / 2, C = s * (t.lineHeight ?? Wn);
|
|
253
|
+
y.forEach((T, k) => {
|
|
254
|
+
const _ = k === 0, w = k === y.length - 1;
|
|
255
|
+
let A = T;
|
|
259
256
|
if (!_) {
|
|
260
|
-
const P =
|
|
261
|
-
|
|
257
|
+
const P = T.match(/^ +/), I = P ? P[0].length : 0;
|
|
258
|
+
I > 0 && (A = A.substring(I));
|
|
262
259
|
}
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
260
|
+
if (!w) {
|
|
261
|
+
const P = A.match(/ +$/), I = P ? P[0].length : 0;
|
|
262
|
+
I > 0 && (A = A.substring(0, A.length - I));
|
|
263
|
+
}
|
|
264
|
+
let E = m + Z;
|
|
265
|
+
d === "center" ? E = m + h / 2 : d === "right" && (E = m + h - Z);
|
|
266
|
+
const S = g + u.ascent + k * C;
|
|
267
|
+
Ue(e, A, E, S, v);
|
|
267
268
|
});
|
|
268
269
|
} else {
|
|
269
|
-
const
|
|
270
|
-
e.strokeText(o, 0,
|
|
270
|
+
const b = -u.height / 2 + u.ascent;
|
|
271
|
+
e.strokeText(o, 0, b);
|
|
271
272
|
}
|
|
272
273
|
e.restore();
|
|
273
274
|
}
|
|
274
|
-
function
|
|
275
|
+
function ft(e, n, t) {
|
|
275
276
|
var r;
|
|
276
277
|
if (!((r = n.stroke) != null && r.enabled) || !n.transformData) return;
|
|
277
278
|
const a = (t == null ? void 0 : t.isKnockout) === !0;
|
|
278
|
-
e.save(), a ? (e.strokeStyle = "#000000", e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", e.globalAlpha = 1, n.stroke.miterLimit !== void 0 && (e.miterLimit = n.stroke.miterLimit)) :
|
|
279
|
+
e.save(), a ? (e.strokeStyle = "#000000", e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", e.globalAlpha = 1, n.stroke.miterLimit !== void 0 && (e.miterLimit = n.stroke.miterLimit)) : xe(e, n.stroke), !a && n.stroke.feather && n.stroke.feather > 0 && "filter" in e && (e.filter = `blur(${n.stroke.feather}px)`), ct(e, n), e.stroke(), e.restore();
|
|
279
280
|
}
|
|
280
|
-
function
|
|
281
|
-
n.enabled && (e.save(),
|
|
281
|
+
function Ea(e, n, t) {
|
|
282
|
+
n.enabled && (e.save(), xe(e, n), n.feather && n.feather > 0 && "filter" in e && (e.filter = `blur(${n.feather}px)`), e.beginPath(), t(), e.stroke(), e.restore());
|
|
282
283
|
}
|
|
283
|
-
const
|
|
284
|
-
function
|
|
284
|
+
const Jn = U("GlyphRenderer");
|
|
285
|
+
function ut(e, n, t, a, r, o, s, c = {}) {
|
|
285
286
|
try {
|
|
286
287
|
const i = [];
|
|
287
|
-
Object.entries(s).forEach(([
|
|
288
|
-
|
|
288
|
+
Object.entries(s).forEach(([b, v]) => {
|
|
289
|
+
v && i.push(b);
|
|
289
290
|
});
|
|
290
291
|
const l = [];
|
|
291
|
-
n.GSUB && n.GSUB.featureList && n.GSUB.featureList.forEach((
|
|
292
|
-
l.push(
|
|
292
|
+
n.GSUB && n.GSUB.featureList && n.GSUB.featureList.forEach((b) => {
|
|
293
|
+
l.push(b.tag);
|
|
293
294
|
});
|
|
294
295
|
const d = {};
|
|
295
|
-
d.ccmp = !0, d.locl = !0, d.kern = !0, i.forEach((
|
|
296
|
-
d[
|
|
296
|
+
d.ccmp = !0, d.locl = !0, d.kern = !0, i.forEach((b) => {
|
|
297
|
+
d[b] = !0;
|
|
297
298
|
}), d.calt && (d.liga = !0, d.init = !0, d.fina = !0);
|
|
298
299
|
const u = n.layout(t, d, "latn"), p = o / n.unitsPerEm;
|
|
299
300
|
let f = 0;
|
|
300
|
-
u.glyphs.forEach((
|
|
301
|
-
f +=
|
|
301
|
+
u.glyphs.forEach((b) => {
|
|
302
|
+
f += b.advanceWidth * p;
|
|
302
303
|
});
|
|
303
|
-
let
|
|
304
|
-
c.align === "center" ?
|
|
305
|
-
let
|
|
306
|
-
u.glyphs.forEach((
|
|
307
|
-
const
|
|
308
|
-
let
|
|
304
|
+
let $ = a;
|
|
305
|
+
c.align === "center" ? $ = a - f / 2 : c.align === "right" && ($ = a - f), e.save(), e.fillStyle = c.color || "#000000";
|
|
306
|
+
let h = $;
|
|
307
|
+
u.glyphs.forEach((b, v) => {
|
|
308
|
+
const y = u.positions[v];
|
|
309
|
+
let x = null;
|
|
309
310
|
try {
|
|
310
|
-
if (
|
|
311
|
-
|
|
312
|
-
else if (
|
|
313
|
-
const
|
|
314
|
-
if (
|
|
315
|
-
|
|
311
|
+
if (b.path && typeof b.path.toPath == "function")
|
|
312
|
+
x = b.path.toPath();
|
|
313
|
+
else if (b.path && typeof b.path.toSVG == "function") {
|
|
314
|
+
const m = b.path.toSVG();
|
|
315
|
+
if (m && /^[MmLlHhVvCcSsQqTtAaZz]/.test(m))
|
|
316
|
+
x = m;
|
|
316
317
|
else {
|
|
317
|
-
const
|
|
318
|
-
|
|
318
|
+
const g = m == null ? void 0 : m.match(/\bd=["']([^"']+)["']/);
|
|
319
|
+
x = g ? g[1] : null;
|
|
319
320
|
}
|
|
320
321
|
}
|
|
321
|
-
} catch (
|
|
322
|
-
|
|
322
|
+
} catch (m) {
|
|
323
|
+
Jn.warn("Error getting path for glyph:", b.name, m);
|
|
323
324
|
}
|
|
324
|
-
if (
|
|
325
|
-
const
|
|
326
|
-
e.save(), e.translate(
|
|
325
|
+
if (x) {
|
|
326
|
+
const m = new Path2D(x);
|
|
327
|
+
e.save(), e.translate(h + y.xOffset * p, r + y.yOffset * p), e.scale(p, -p), e.fill(m), e.restore();
|
|
327
328
|
}
|
|
328
|
-
|
|
329
|
+
h += b.advanceWidth * p;
|
|
329
330
|
}), e.restore();
|
|
330
331
|
} catch (i) {
|
|
331
|
-
|
|
332
|
+
Jn.error("Error rendering with fontkit:", i), e.fillStyle = c.color || "#000000", e.textAlign = c.align || "left", e.fillText(t, a, r);
|
|
332
333
|
}
|
|
333
334
|
}
|
|
334
|
-
function
|
|
335
|
-
const l = ((
|
|
336
|
-
for (const
|
|
337
|
-
const
|
|
338
|
-
if (
|
|
335
|
+
function pt(e, n, t, a, r, o, s, c = {}) {
|
|
336
|
+
const l = ((b) => {
|
|
337
|
+
for (const v of b) {
|
|
338
|
+
const y = v.codePointAt(0);
|
|
339
|
+
if (y && y >= 983040 && y <= 1048573) return !0;
|
|
339
340
|
}
|
|
340
341
|
return !1;
|
|
341
342
|
})(t);
|
|
@@ -344,172 +345,177 @@ function lt(e, n, t, a, r, o, s, c = {}) {
|
|
|
344
345
|
return;
|
|
345
346
|
}
|
|
346
347
|
const d = /* @__PURE__ */ new Map();
|
|
347
|
-
s && s.forEach((
|
|
348
|
-
d.set(
|
|
348
|
+
s && s.forEach((b) => {
|
|
349
|
+
d.set(b.charIndex, b.glyphIndex);
|
|
349
350
|
});
|
|
350
351
|
const u = o / n.unitsPerEm, p = Array.from(t);
|
|
351
352
|
let f = 0;
|
|
352
|
-
p.forEach((
|
|
353
|
-
const
|
|
354
|
-
let
|
|
355
|
-
if (
|
|
356
|
-
|
|
357
|
-
else if (
|
|
358
|
-
const
|
|
359
|
-
|
|
360
|
-
}
|
|
361
|
-
const
|
|
362
|
-
|
|
353
|
+
p.forEach((b, v) => {
|
|
354
|
+
const y = b.codePointAt(0) || 0;
|
|
355
|
+
let x;
|
|
356
|
+
if (y >= 983040 && y <= 1048573)
|
|
357
|
+
x = y - 983040;
|
|
358
|
+
else if (x = d.get(v), x === void 0) {
|
|
359
|
+
const g = n.glyphForCodePoint(y);
|
|
360
|
+
x = g ? g.id : 0;
|
|
361
|
+
}
|
|
362
|
+
const m = n.getGlyph(x);
|
|
363
|
+
m && (f += m.advanceWidth * u);
|
|
363
364
|
});
|
|
364
|
-
let
|
|
365
|
-
c.align === "center" ?
|
|
366
|
-
let
|
|
367
|
-
p.forEach((
|
|
368
|
-
const
|
|
369
|
-
let
|
|
370
|
-
if (
|
|
371
|
-
|
|
372
|
-
else if (
|
|
373
|
-
const
|
|
374
|
-
|
|
375
|
-
}
|
|
376
|
-
const
|
|
377
|
-
if (
|
|
378
|
-
const
|
|
379
|
-
if (
|
|
380
|
-
const
|
|
381
|
-
e.save(), e.translate(
|
|
365
|
+
let $ = a;
|
|
366
|
+
c.align === "center" ? $ = a - f / 2 : c.align === "right" && ($ = a - f), e.save(), e.fillStyle = c.color || "#000000";
|
|
367
|
+
let h = $;
|
|
368
|
+
p.forEach((b, v) => {
|
|
369
|
+
const y = b.codePointAt(0) || 0;
|
|
370
|
+
let x;
|
|
371
|
+
if (y >= 983040 && y <= 1048573)
|
|
372
|
+
x = y - 983040;
|
|
373
|
+
else if (x = d.get(v), x === void 0) {
|
|
374
|
+
const g = n.glyphForCodePoint(y);
|
|
375
|
+
x = g ? g.id : 0;
|
|
376
|
+
}
|
|
377
|
+
const m = n.getGlyph(x);
|
|
378
|
+
if (m) {
|
|
379
|
+
const g = m.path.toSVG();
|
|
380
|
+
if (g) {
|
|
381
|
+
const C = new Path2D(g);
|
|
382
|
+
e.save(), e.translate(h, r), e.scale(u, -u), e.fill(C), e.restore();
|
|
382
383
|
}
|
|
383
|
-
|
|
384
|
+
h += m.advanceWidth * u;
|
|
384
385
|
}
|
|
385
386
|
}), e.restore();
|
|
386
387
|
}
|
|
387
|
-
function
|
|
388
|
+
function ht(e, n, t, a, r) {
|
|
388
389
|
e.fillStyle = t.color;
|
|
389
|
-
const o = t.textAlign || "center", s =
|
|
390
|
-
let
|
|
391
|
-
a !== void 0 && a > 0 && !r ? (
|
|
392
|
-
const b =
|
|
393
|
-
b.forEach((
|
|
394
|
-
|
|
395
|
-
isParagraphStart:
|
|
396
|
-
isParagraphEnd:
|
|
390
|
+
const o = t.textAlign || "center", s = (h) => h.letterSpacing !== void 0 ? h.letterSpacing : t.letterSpacing ?? 0, c = We(n);
|
|
391
|
+
let i, l;
|
|
392
|
+
a !== void 0 && a > 0 && !r ? (i = [], l = [], c.forEach((h) => {
|
|
393
|
+
const b = ze(h, a, t);
|
|
394
|
+
b.forEach((v, y) => {
|
|
395
|
+
i.push(v), l.push({
|
|
396
|
+
isParagraphStart: y === 0,
|
|
397
|
+
isParagraphEnd: y === b.length - 1
|
|
397
398
|
});
|
|
398
399
|
});
|
|
399
|
-
})) : (
|
|
400
|
+
})) : (i = c, l = c.map(() => ({
|
|
400
401
|
isParagraphStart: !0,
|
|
401
402
|
isParagraphEnd: !0
|
|
402
403
|
})));
|
|
403
|
-
const
|
|
404
|
-
|
|
405
|
-
const
|
|
406
|
-
let
|
|
407
|
-
const
|
|
408
|
-
|
|
409
|
-
const P =
|
|
410
|
-
e.font =
|
|
411
|
-
const
|
|
412
|
-
|
|
413
|
-
const
|
|
414
|
-
|
|
404
|
+
const d = [];
|
|
405
|
+
i.forEach((h, b) => {
|
|
406
|
+
const v = [];
|
|
407
|
+
let y = 0, x = 0;
|
|
408
|
+
const m = l[b].isParagraphStart, g = l[b].isParagraphEnd;
|
|
409
|
+
h.forEach((S) => {
|
|
410
|
+
const P = S.style.fontSize !== void 0 ? S.style.fontSize : t.fontSize, I = S.style.fontFamily !== void 0 ? S.style.fontFamily : t.fontFamily, D = S.style.bold !== void 0 ? S.style.bold : t.bold || !1, F = S.style.italic !== void 0 ? S.style.italic : t.italic || !1;
|
|
411
|
+
e.font = B(P, I, D, F);
|
|
412
|
+
const M = sn(e.measureText(S.text).width, S.text, s(S.style));
|
|
413
|
+
v.push(M);
|
|
414
|
+
const L = dn(P, I, D, F);
|
|
415
|
+
y = Math.max(y, L.height), x = Math.max(x, L.ascent);
|
|
415
416
|
});
|
|
416
|
-
const
|
|
417
|
-
let
|
|
418
|
-
|
|
419
|
-
const P =
|
|
420
|
-
let
|
|
421
|
-
const
|
|
422
|
-
if (!
|
|
423
|
-
const
|
|
424
|
-
|
|
417
|
+
const C = h.map((S) => S.text).join(""), T = C.match(/^ +/), k = C.match(/ +$/), _ = T ? T[0].length : 0, w = k ? k[0].length : 0;
|
|
418
|
+
let A = 0, E = 0;
|
|
419
|
+
h.forEach((S) => {
|
|
420
|
+
const P = S.style.fontSize !== void 0 ? S.style.fontSize : t.fontSize, I = S.style.fontFamily !== void 0 ? S.style.fontFamily : t.fontFamily, D = S.style.bold !== void 0 ? S.style.bold : t.bold || !1, F = S.style.italic !== void 0 ? S.style.italic : t.italic || !1;
|
|
421
|
+
let M = S.text;
|
|
422
|
+
const L = E, Cn = E + S.text.length;
|
|
423
|
+
if (!m && _ > 0 && L < _) {
|
|
424
|
+
const R = Math.min(_ - L, S.text.length);
|
|
425
|
+
M = M.substring(R);
|
|
425
426
|
}
|
|
426
|
-
if (!g &&
|
|
427
|
-
const
|
|
428
|
-
if (
|
|
429
|
-
const H = !
|
|
430
|
-
|
|
427
|
+
if (!g && w > 0) {
|
|
428
|
+
const R = C.length - w;
|
|
429
|
+
if (Cn > R) {
|
|
430
|
+
const H = !m && _ > 0 && L < _ ? Math.min(_ - L, S.text.length) : 0, kn = Math.max(0, R - L - H);
|
|
431
|
+
M = M.substring(0, kn);
|
|
431
432
|
}
|
|
432
433
|
}
|
|
433
|
-
E +=
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
434
|
+
E += S.text.length, M.length > 0 && (e.save(), e.font = B(P, I, D, F), A += sn(
|
|
435
|
+
e.measureText(M).width,
|
|
436
|
+
M,
|
|
437
|
+
s(S.style)
|
|
438
|
+
), e.restore());
|
|
439
|
+
}), d.push({
|
|
440
|
+
spans: h,
|
|
441
|
+
width: A,
|
|
437
442
|
// Use adjusted width for alignment (may be 0 for empty lines)
|
|
438
|
-
height:
|
|
439
|
-
ascent:
|
|
440
|
-
spanWidths:
|
|
441
|
-
isParagraphStart:
|
|
443
|
+
height: y,
|
|
444
|
+
ascent: x,
|
|
445
|
+
spanWidths: v,
|
|
446
|
+
isParagraphStart: m,
|
|
442
447
|
// Store metadata with line
|
|
443
448
|
isParagraphEnd: g
|
|
444
449
|
});
|
|
445
450
|
});
|
|
446
|
-
const
|
|
447
|
-
let
|
|
448
|
-
|
|
449
|
-
const
|
|
450
|
-
|
|
451
|
-
const { spans:
|
|
451
|
+
const u = dn(t.fontSize, t.fontFamily, t.bold, t.italic), p = t.fontSize * (t.lineHeight ?? Wn);
|
|
452
|
+
let f;
|
|
453
|
+
d.length === 0 ? f = 0 : d.length === 1 ? f = u.height : f = (d.length - 1) * p + u.height;
|
|
454
|
+
const $ = -f / 2;
|
|
455
|
+
d.forEach((h, b) => {
|
|
456
|
+
const { spans: v, width: y, isParagraphStart: x, isParagraphEnd: m } = h;
|
|
452
457
|
let g;
|
|
453
|
-
o === "center" ? g = -
|
|
454
|
-
const
|
|
458
|
+
o === "center" ? g = -y / 2 : o === "right" ? g = a !== void 0 ? a / 2 - y : -y : g = a !== void 0 ? -a / 2 : 0;
|
|
459
|
+
const C = $ + u.ascent + b * p, T = v.map((S) => S.text).join(""), k = T.match(/^ +/), _ = T.match(/ +$/), w = k ? k[0].length : 0, A = _ ? _[0].length : 0;
|
|
455
460
|
let E = 0;
|
|
456
|
-
|
|
457
|
-
const P =
|
|
458
|
-
let
|
|
459
|
-
if (
|
|
460
|
-
const
|
|
461
|
-
|
|
461
|
+
v.forEach((S) => {
|
|
462
|
+
const P = S.style.fontSize !== void 0 ? S.style.fontSize : t.fontSize, I = S.style.fontFamily !== void 0 ? S.style.fontFamily : t.fontFamily, D = S.style.color !== void 0 ? S.style.color : t.color, F = S.style.bold !== void 0 ? S.style.bold : t.bold || !1, M = S.style.italic !== void 0 ? S.style.italic : t.italic || !1, L = S.style.underline !== void 0 ? S.style.underline : t.underline || !1, Cn = S.style.strikethrough !== void 0 ? S.style.strikethrough : t.strikethrough || !1;
|
|
463
|
+
let R = S.text, H = E, kn = E + S.text.length;
|
|
464
|
+
if (!x && w > 0 && H < w) {
|
|
465
|
+
const V = Math.min(w - H, S.text.length);
|
|
466
|
+
R = R.substring(V);
|
|
462
467
|
}
|
|
463
|
-
if (!
|
|
464
|
-
const
|
|
465
|
-
if (
|
|
466
|
-
const
|
|
467
|
-
|
|
468
|
+
if (!m && A > 0) {
|
|
469
|
+
const V = T.length - A;
|
|
470
|
+
if (kn > V) {
|
|
471
|
+
const tn = !x && w > 0 && H < w ? Math.min(w - H, S.text.length) : 0, j = Math.max(0, V - H - tn);
|
|
472
|
+
R = R.substring(0, j);
|
|
468
473
|
}
|
|
469
474
|
}
|
|
470
|
-
if (E +=
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
475
|
+
if (E += S.text.length, R.length > 0) {
|
|
476
|
+
const V = s(S.style);
|
|
477
|
+
e.font = B(P, I, F, M), e.fillStyle = D, e.textBaseline = "alphabetic", e.textAlign = "left", zn(e, R, g, C, V);
|
|
478
|
+
const tn = sn(e.measureText(R).width, R, V);
|
|
479
|
+
if (L) {
|
|
480
|
+
const j = C + P * 0.1;
|
|
481
|
+
e.beginPath(), e.moveTo(g, j), e.lineTo(g + tn, j), e.lineWidth = Math.max(1, P * 0.05), e.strokeStyle = D, e.stroke();
|
|
482
|
+
}
|
|
483
|
+
if (Cn) {
|
|
484
|
+
const j = C - P * 0.25;
|
|
485
|
+
e.beginPath(), e.moveTo(g, j), e.lineTo(g + tn, j), e.lineWidth = Math.max(1, P * 0.05), e.strokeStyle = D, e.stroke();
|
|
486
|
+
}
|
|
487
|
+
g += tn;
|
|
482
488
|
}
|
|
483
489
|
});
|
|
484
490
|
});
|
|
485
491
|
}
|
|
486
|
-
const
|
|
487
|
-
let
|
|
488
|
-
function
|
|
489
|
-
if (!
|
|
492
|
+
const An = U("canvas-renderer");
|
|
493
|
+
let pn = null;
|
|
494
|
+
function Gn() {
|
|
495
|
+
if (!pn)
|
|
490
496
|
if (typeof OffscreenCanvas < "u")
|
|
491
|
-
|
|
497
|
+
pn = new OffscreenCanvas(1, 1).getContext("2d");
|
|
492
498
|
else if (typeof document < "u")
|
|
493
|
-
|
|
499
|
+
pn = document.createElement("canvas").getContext("2d");
|
|
494
500
|
else
|
|
495
501
|
throw new Error("No canvas context available");
|
|
496
|
-
return
|
|
502
|
+
return pn;
|
|
497
503
|
}
|
|
498
|
-
function
|
|
504
|
+
function B(e, n, t = !1, a = !1) {
|
|
499
505
|
const r = [];
|
|
500
506
|
return a && r.push("italic"), t && r.push("bold"), r.push(`${e}px`), r.push(n), r.join(" ");
|
|
501
507
|
}
|
|
502
|
-
function
|
|
503
|
-
const
|
|
504
|
-
return
|
|
508
|
+
function Zn(e, n, t, a = !1, r = !1, o = 0) {
|
|
509
|
+
const s = Gn();
|
|
510
|
+
return s.font = B(n, t, a, r), sn(s.measureText(e).width, e, o);
|
|
505
511
|
}
|
|
506
|
-
function
|
|
507
|
-
const r =
|
|
508
|
-
r.font =
|
|
512
|
+
function dn(e, n, t = !1, a = !1) {
|
|
513
|
+
const r = Gn();
|
|
514
|
+
r.font = B(e, n, t, a);
|
|
509
515
|
const s = r.measureText("ÁÉÍgjpqy"), c = s.actualBoundingBoxAscent || e * 0.8, i = s.actualBoundingBoxDescent || e * 0.2, l = c + i;
|
|
510
516
|
return { ascent: c, descent: i, height: l };
|
|
511
517
|
}
|
|
512
|
-
function
|
|
518
|
+
function Aa(e, n) {
|
|
513
519
|
const t = e.map((r, o) => ({
|
|
514
520
|
isParagraphStart: !n && o === 0,
|
|
515
521
|
isParagraphEnd: !n && o === e.length - 1
|
|
@@ -522,23 +528,23 @@ function ka(e, n) {
|
|
|
522
528
|
return s || (i = i.replace(/^ +/, "")), c || (i = i.replace(/ +$/, "")), i;
|
|
523
529
|
}).filter((r) => r.length > 0);
|
|
524
530
|
}
|
|
525
|
-
function
|
|
531
|
+
function bt(e, n) {
|
|
526
532
|
const t = n.fontSize, a = n.fontFamily, r = n.bold || !1, o = n.italic || !1, s = n.textAlign || "center", c = n.text;
|
|
527
|
-
e.font =
|
|
528
|
-
const i =
|
|
529
|
-
e
|
|
533
|
+
e.font = B(t, a, r, o), e.textAlign = s, e.textBaseline = "alphabetic", e.fillStyle = n.color;
|
|
534
|
+
const i = dn(t, a, r, o), u = -i.height / 2 + i.ascent;
|
|
535
|
+
zn(e, c, 0, u, n.letterSpacing);
|
|
530
536
|
}
|
|
531
|
-
function
|
|
532
|
-
const c =
|
|
533
|
-
if (c.font =
|
|
537
|
+
function gt(e, n, t, a, r = !1, o = !1, s) {
|
|
538
|
+
const c = Gn();
|
|
539
|
+
if (c.font = B(t, a, r, o), e.trim().length === 0)
|
|
534
540
|
return [e];
|
|
535
541
|
if (e.includes(`
|
|
536
542
|
`)) {
|
|
537
|
-
const
|
|
543
|
+
const k = e.split(`
|
|
538
544
|
`), _ = [];
|
|
539
|
-
for (let w = 0; w <
|
|
540
|
-
const
|
|
541
|
-
_.push(...
|
|
545
|
+
for (let w = 0; w < k.length; w++) {
|
|
546
|
+
const A = k[w], E = gt(A, n, t, a, r, o);
|
|
547
|
+
_.push(...E);
|
|
542
548
|
}
|
|
543
549
|
return _;
|
|
544
550
|
}
|
|
@@ -546,87 +552,87 @@ function ut(e, n, t, a, r = !1, o = !1, s) {
|
|
|
546
552
|
if (s !== void 0 && s > 0) {
|
|
547
553
|
if (s === 1)
|
|
548
554
|
return [d + f.join(" ") + u];
|
|
549
|
-
const
|
|
555
|
+
const k = [], _ = Math.ceil(f.length / s);
|
|
550
556
|
for (let w = 0; w < f.length; w += _) {
|
|
551
|
-
const
|
|
552
|
-
w === 0 && w + _ >= f.length ?
|
|
553
|
-
}
|
|
554
|
-
return
|
|
555
|
-
}
|
|
556
|
-
const
|
|
557
|
-
if (
|
|
558
|
-
return [
|
|
559
|
-
const
|
|
560
|
-
let
|
|
561
|
-
const T = Math.max(15, n * (
|
|
562
|
-
for (let
|
|
563
|
-
const _ = f[
|
|
564
|
-
c.measureText(w).width > n + T ? (
|
|
565
|
-
}
|
|
566
|
-
return
|
|
557
|
+
const E = f.slice(w, w + _).join(" ");
|
|
558
|
+
w === 0 && w + _ >= f.length ? k.push(d + E + u) : w === 0 ? k.push(d + E) : w + _ >= f.length ? k.push(E + u) : k.push(E);
|
|
559
|
+
}
|
|
560
|
+
return k;
|
|
561
|
+
}
|
|
562
|
+
const $ = f.join(" "), h = d + $ + u, b = c.measureText(h).width, v = n < 200, x = Math.max(20, n * (v ? 0.08 : 0.05));
|
|
563
|
+
if (b <= n + x)
|
|
564
|
+
return [h];
|
|
565
|
+
const m = [];
|
|
566
|
+
let g = f[0];
|
|
567
|
+
const T = Math.max(15, n * (v ? 0.05 : 0.03));
|
|
568
|
+
for (let k = 1; k < f.length; k++) {
|
|
569
|
+
const _ = f[k], w = g + " " + _;
|
|
570
|
+
c.measureText(w).width > n + T ? (m.push(g), g = _) : g = w;
|
|
571
|
+
}
|
|
572
|
+
return m.push(g), m.length > 0 && (m[0] = d + m[0], m[m.length - 1] = m[m.length - 1] + u), m;
|
|
567
573
|
}
|
|
568
|
-
function
|
|
569
|
-
e.font =
|
|
570
|
-
const
|
|
571
|
-
for (const
|
|
572
|
-
const
|
|
573
|
-
if (
|
|
574
|
+
function Pa(e, n, t, a, r, o, s = "left", c = 0, i = 0, l = 1.2, d = !1, u = !1, p = !1, f = !1, $, h) {
|
|
575
|
+
e.font = B(r, o, d, u), e.textBaseline = "alphabetic", e.textAlign = s;
|
|
576
|
+
const b = (w) => {
|
|
577
|
+
for (const A of w) {
|
|
578
|
+
const E = A.codePointAt(0);
|
|
579
|
+
if (E && E >= 983040 && E <= 1048573)
|
|
574
580
|
return !0;
|
|
575
581
|
}
|
|
576
582
|
return !1;
|
|
577
|
-
},
|
|
578
|
-
|
|
579
|
-
`[renderMultilineText] Font ${o} not loaded for fontkit rendering. Text may not render correctly. Has PUA: ${
|
|
580
|
-
),
|
|
581
|
-
|
|
583
|
+
}, v = $ && Object.values($).some((w) => w), y = h && h.length > 0, x = n.join(" "), m = b(x), g = v || y || m, C = g ? Xn.getFontSync(o, d ? 700 : 400) : null;
|
|
584
|
+
g && !C && (An.warn(
|
|
585
|
+
`[renderMultilineText] Font ${o} not loaded for fontkit rendering. Text may not render correctly. Has PUA: ${m}, Text: "${x}"`
|
|
586
|
+
), Xn.loadFont(o, d ? 700 : 400).catch((w) => {
|
|
587
|
+
An.error("[renderMultilineText] Error loading font:", w);
|
|
582
588
|
}));
|
|
583
|
-
const T =
|
|
589
|
+
const T = dn(r, o, d, u), k = r * l;
|
|
584
590
|
let _ = 0;
|
|
585
|
-
n.forEach((w,
|
|
586
|
-
let
|
|
587
|
-
s === "center" ?
|
|
588
|
-
const
|
|
589
|
-
const
|
|
590
|
-
return
|
|
591
|
+
n.forEach((w, A) => {
|
|
592
|
+
let E = t + i;
|
|
593
|
+
s === "center" ? E = t + c / 2 : s === "right" && (E = t + c - i);
|
|
594
|
+
const S = a + T.ascent + A * k, P = Array.from(w).length, I = y ? h.filter((D) => {
|
|
595
|
+
const F = D.charIndex - _;
|
|
596
|
+
return F >= 0 && F < P;
|
|
591
597
|
}).map((D) => ({
|
|
592
598
|
...D,
|
|
593
599
|
charIndex: D.charIndex - _
|
|
594
600
|
// Adjust to line-relative index
|
|
595
601
|
})) : [];
|
|
596
|
-
if (
|
|
602
|
+
if (C && (v || I.length > 0 || m) ? I.length > 0 || b(w) ? pt(e, C, w, E, S, r, I, {
|
|
597
603
|
color: e.fillStyle,
|
|
598
604
|
align: s === "start" || s === "end" ? "left" : s
|
|
599
|
-
}) :
|
|
605
|
+
}) : $ && ut(e, C, w, E, S, r, $, {
|
|
600
606
|
color: e.fillStyle,
|
|
601
607
|
align: s === "start" || s === "end" ? "left" : s
|
|
602
|
-
}) : e.fillText(w,
|
|
603
|
-
const D =
|
|
604
|
-
let
|
|
605
|
-
s === "center" ?
|
|
606
|
-
const M =
|
|
607
|
-
e.beginPath(), e.moveTo(
|
|
608
|
+
}) : e.fillText(w, E, S), _ += P + 1, p) {
|
|
609
|
+
const D = Zn(w, r, o, d, u);
|
|
610
|
+
let F = E;
|
|
611
|
+
s === "center" ? F = E - D / 2 : s === "right" && (F = E - D);
|
|
612
|
+
const M = S + r * 0.1;
|
|
613
|
+
e.beginPath(), e.moveTo(F, M), e.lineTo(F + D, M), e.lineWidth = Math.max(1, r * 0.05), e.strokeStyle = e.fillStyle, e.stroke();
|
|
608
614
|
}
|
|
609
615
|
if (f) {
|
|
610
|
-
const D =
|
|
611
|
-
let
|
|
612
|
-
s === "center" ?
|
|
613
|
-
const M =
|
|
614
|
-
e.beginPath(), e.moveTo(
|
|
616
|
+
const D = Zn(w, r, o, d, u);
|
|
617
|
+
let F = E;
|
|
618
|
+
s === "center" ? F = E - D / 2 : s === "right" && (F = E - D);
|
|
619
|
+
const M = S - r * 0.25;
|
|
620
|
+
e.beginPath(), e.moveTo(F, M), e.lineTo(F + D, M), e.lineWidth = Math.max(1, r * 0.05), e.strokeStyle = e.fillStyle, e.stroke();
|
|
615
621
|
}
|
|
616
622
|
});
|
|
617
623
|
}
|
|
618
|
-
function
|
|
619
|
-
|
|
624
|
+
function Pn(e, n) {
|
|
625
|
+
mt(e, n);
|
|
620
626
|
}
|
|
621
|
-
function
|
|
627
|
+
function mt(e, n) {
|
|
622
628
|
var r;
|
|
623
|
-
(r = n.stroke) != null && r.enabled &&
|
|
624
|
-
const t = n.transformData, a = ((t == null ? void 0 : t.width) ?? 100) -
|
|
629
|
+
(r = n.stroke) != null && r.enabled && ve(e, n), e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180);
|
|
630
|
+
const t = n.transformData, a = ((t == null ? void 0 : t.width) ?? 100) - Z * 2;
|
|
625
631
|
if (n.richText) {
|
|
626
|
-
const o =
|
|
632
|
+
const o = Ge.fromJSON(n.richText);
|
|
627
633
|
e.save(), e.translate(0, 0);
|
|
628
634
|
const s = n._lockedLineCount;
|
|
629
|
-
|
|
635
|
+
ht(
|
|
630
636
|
e,
|
|
631
637
|
o,
|
|
632
638
|
{
|
|
@@ -637,14 +643,16 @@ function pt(e, n) {
|
|
|
637
643
|
italic: n.italic,
|
|
638
644
|
underline: n.underline,
|
|
639
645
|
strikethrough: n.strikethrough,
|
|
640
|
-
textAlign: n.textAlign
|
|
646
|
+
textAlign: n.textAlign,
|
|
647
|
+
letterSpacing: n.letterSpacing,
|
|
648
|
+
lineHeight: n.lineHeight
|
|
641
649
|
},
|
|
642
650
|
a,
|
|
643
651
|
s
|
|
644
652
|
), e.restore();
|
|
645
653
|
} else if (n.text) {
|
|
646
654
|
e.fillStyle = n.color;
|
|
647
|
-
const o = n._lockedLineCount, { lines:
|
|
655
|
+
const o = n._lockedLineCount, s = n.letterSpacing ?? 0, { lines: c, height: i } = ye(
|
|
648
656
|
n.text,
|
|
649
657
|
a,
|
|
650
658
|
n.fontSize,
|
|
@@ -652,109 +660,110 @@ function pt(e, n) {
|
|
|
652
660
|
n.bold,
|
|
653
661
|
n.italic,
|
|
654
662
|
o,
|
|
655
|
-
!0
|
|
663
|
+
!0,
|
|
656
664
|
// strict: true
|
|
657
|
-
|
|
665
|
+
{ letterSpacing: s, lineHeight: n.lineHeight }
|
|
666
|
+
), l = dn(
|
|
658
667
|
n.fontSize,
|
|
659
668
|
n.fontFamily,
|
|
660
669
|
n.bold,
|
|
661
670
|
n.italic
|
|
662
|
-
),
|
|
663
|
-
e.font = `${n.italic ? "italic " : ""}${n.bold ? "bold " : ""}${n.fontSize}px ${n.fontFamily}`, e.textBaseline = "alphabetic", e.textAlign = n.textAlign,
|
|
664
|
-
const
|
|
665
|
-
let
|
|
666
|
-
if (!
|
|
667
|
-
const
|
|
668
|
-
g > 0 && (
|
|
671
|
+
), d = -((t == null ? void 0 : t.width) ?? 100) / 2, u = -i / 2, p = n.fontSize * (n.lineHeight ?? Wn);
|
|
672
|
+
e.font = `${n.italic ? "italic " : ""}${n.bold ? "bold " : ""}${n.fontSize}px ${n.fontFamily}`, e.textBaseline = "alphabetic", e.textAlign = n.textAlign, c.forEach((f, $) => {
|
|
673
|
+
const h = $ === 0, b = $ === c.length - 1;
|
|
674
|
+
let v = f;
|
|
675
|
+
if (!h) {
|
|
676
|
+
const m = f.match(/^ +/), g = m ? m[0].length : 0;
|
|
677
|
+
g > 0 && (v = v.substring(g));
|
|
669
678
|
}
|
|
670
679
|
if (!b) {
|
|
671
|
-
const
|
|
672
|
-
g > 0 && (
|
|
680
|
+
const m = v.match(/ +$/), g = m ? m[0].length : 0;
|
|
681
|
+
g > 0 && (v = v.substring(0, v.length - g));
|
|
673
682
|
}
|
|
674
|
-
let
|
|
675
|
-
n.textAlign === "center" ?
|
|
676
|
-
const
|
|
677
|
-
if (e
|
|
678
|
-
const
|
|
679
|
-
let g =
|
|
680
|
-
if (n.textAlign === "center" ? g -=
|
|
681
|
-
const
|
|
682
|
-
e.fillRect(g,
|
|
683
|
+
let y = d + Z;
|
|
684
|
+
n.textAlign === "center" ? y = d + ((t == null ? void 0 : t.width) ?? 100) / 2 : n.textAlign === "right" && (y = d + ((t == null ? void 0 : t.width) ?? 100) - Z);
|
|
685
|
+
const x = u + l.ascent + $ * p;
|
|
686
|
+
if (zn(e, v, y, x, s), v.length > 0) {
|
|
687
|
+
const m = sn(e.measureText(v).width, v, s);
|
|
688
|
+
let g = y;
|
|
689
|
+
if (n.textAlign === "center" ? g -= m / 2 : n.textAlign === "right" && (g -= m), n.underline) {
|
|
690
|
+
const C = x + n.fontSize * 0.1;
|
|
691
|
+
e.fillRect(g, C, m, Math.max(1, n.fontSize * 0.05));
|
|
683
692
|
}
|
|
684
693
|
if (n.strikethrough) {
|
|
685
|
-
const
|
|
686
|
-
e.fillRect(g,
|
|
694
|
+
const C = x - l.ascent * 0.4;
|
|
695
|
+
e.fillRect(g, C, m, Math.max(1, n.fontSize * 0.05));
|
|
687
696
|
}
|
|
688
697
|
}
|
|
689
698
|
});
|
|
690
699
|
}
|
|
691
700
|
e.restore();
|
|
692
701
|
}
|
|
693
|
-
function
|
|
702
|
+
function Ia(e, n) {
|
|
694
703
|
var s;
|
|
695
704
|
const t = n.opacity ?? 1, a = !!((s = n.stroke) != null && s.enabled), r = n.type === "custom";
|
|
696
705
|
if (t < 1 && a && r) {
|
|
697
|
-
|
|
706
|
+
yt(e, n, t);
|
|
698
707
|
return;
|
|
699
708
|
}
|
|
700
709
|
const o = e.globalAlpha;
|
|
701
|
-
t !== 1 && (e.globalAlpha = t),
|
|
710
|
+
t !== 1 && (e.globalAlpha = t), In(e, n), e.globalAlpha = o;
|
|
702
711
|
}
|
|
703
|
-
function
|
|
704
|
-
var
|
|
705
|
-
const a = n.transformData, r = n.fontSize || 24, o = ((
|
|
712
|
+
function yt(e, n, t) {
|
|
713
|
+
var b;
|
|
714
|
+
const a = n.transformData, r = n.fontSize || 24, o = ((b = n.stroke) == null ? void 0 : b.width) || 0, s = ((a == null ? void 0 : a.width) ?? r * n.text.length * 0.7) + o * 2 + 40, c = r * 3 + o * 2 + 40, i = e.getTransform(), l = Math.max(Math.abs(i.a), Math.abs(i.d), 1), d = Math.ceil(s * l), u = Math.ceil(c * l);
|
|
706
715
|
let p;
|
|
707
716
|
typeof OffscreenCanvas < "u" ? p = new OffscreenCanvas(d, u) : (p = document.createElement("canvas"), p.width = d, p.height = u);
|
|
708
717
|
const f = p.getContext("2d");
|
|
709
718
|
if (!f) {
|
|
710
|
-
const
|
|
711
|
-
e.globalAlpha = t,
|
|
719
|
+
const v = e.globalAlpha;
|
|
720
|
+
e.globalAlpha = t, In(e, n), e.globalAlpha = v;
|
|
712
721
|
return;
|
|
713
722
|
}
|
|
714
|
-
const
|
|
723
|
+
const $ = i.a * n.x + i.e, h = i.d * n.y + i.f;
|
|
715
724
|
f.setTransform(
|
|
716
725
|
i.a,
|
|
717
726
|
i.b,
|
|
718
727
|
i.c,
|
|
719
728
|
i.d,
|
|
720
|
-
i.e -
|
|
721
|
-
i.f -
|
|
722
|
-
),
|
|
729
|
+
i.e - $ + d / 2,
|
|
730
|
+
i.f - h + u / 2
|
|
731
|
+
), In(f, n), e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.globalAlpha = t, e.drawImage(p, $ - d / 2, h - u / 2), e.restore();
|
|
723
732
|
}
|
|
724
|
-
function
|
|
733
|
+
function In(e, n) {
|
|
725
734
|
switch (n.type) {
|
|
726
735
|
case "custom":
|
|
727
|
-
|
|
736
|
+
Pn(e, n);
|
|
728
737
|
break;
|
|
729
738
|
case "circle":
|
|
730
|
-
|
|
739
|
+
we(e, n);
|
|
731
740
|
break;
|
|
732
741
|
case "wave":
|
|
733
|
-
|
|
742
|
+
Se(e, n);
|
|
734
743
|
break;
|
|
735
744
|
case "arch":
|
|
736
|
-
|
|
745
|
+
Ce(e, n);
|
|
737
746
|
break;
|
|
738
747
|
case "ascend":
|
|
739
|
-
|
|
748
|
+
ke(e, n);
|
|
740
749
|
break;
|
|
741
750
|
case "lean":
|
|
742
|
-
|
|
751
|
+
Te(e, n);
|
|
743
752
|
break;
|
|
744
753
|
case "flag":
|
|
745
|
-
|
|
754
|
+
_e(e, n);
|
|
746
755
|
break;
|
|
747
756
|
default:
|
|
748
|
-
|
|
757
|
+
An.warn(`[canvas-renderer] Unsupported transform type: ${n.type}`), Pn(e, n);
|
|
749
758
|
}
|
|
750
759
|
}
|
|
751
|
-
function
|
|
760
|
+
function $t(e, n) {
|
|
752
761
|
if (typeof OffscreenCanvas < "u")
|
|
753
762
|
return new OffscreenCanvas(e, n);
|
|
754
763
|
const t = document.createElement("canvas");
|
|
755
764
|
return t.width = e, t.height = n, t;
|
|
756
765
|
}
|
|
757
|
-
function
|
|
766
|
+
function nn(e, n, t) {
|
|
758
767
|
if (t != null && t.enabled)
|
|
759
768
|
if (e.strokeStyle = t.color, e.lineWidth = t.width, e.lineCap = t.lineCap || "round", e.lineJoin = t.lineJoin || "round", t.miterLimit !== void 0 && (e.miterLimit = t.miterLimit), t.opacity !== void 0) {
|
|
760
769
|
const a = e.globalAlpha;
|
|
@@ -762,49 +771,49 @@ function Q(e, n, t) {
|
|
|
762
771
|
} else
|
|
763
772
|
e.strokeText(n, 0, 0);
|
|
764
773
|
}
|
|
765
|
-
function
|
|
774
|
+
function en(e, n, t) {
|
|
766
775
|
const a = n.stroke, r = (a == null ? void 0 : a.opacity) ?? 1, o = e.globalAlpha, s = (a == null ? void 0 : a.enabled) && r < 1, c = (a == null ? void 0 : a.enabled) && o < 1;
|
|
767
776
|
if (!(s || c)) {
|
|
768
777
|
t(e, n);
|
|
769
778
|
return;
|
|
770
779
|
}
|
|
771
|
-
const l = n.fontSize || 24, d = a.width || 0, u = n.transformData, p = l * n.text.length * 0.7, f = u.width ?? (u.radius ? u.radius * 2 : 0),
|
|
772
|
-
if (T <= 0 ||
|
|
780
|
+
const l = n.fontSize || 24, d = a.width || 0, u = n.transformData, p = l * n.text.length * 0.7, f = u.width ?? (u.radius ? u.radius * 2 : 0), $ = Math.max(f, p), h = (a.feather || 0) * 2, b = d * 4 + h + l + 40, v = $ + b, y = u.archHeight ? Math.abs(u.archHeight) * l * 2 : 0, x = u.radius ? u.radius : 0, m = l * 3 + b + y + x, g = e.getTransform(), C = Math.max(Math.abs(g.a), Math.abs(g.d), 1), T = Math.ceil(v * C / 2) * 2, k = Math.ceil(m * C / 2) * 2;
|
|
781
|
+
if (T <= 0 || k <= 0) {
|
|
773
782
|
t(e, n);
|
|
774
783
|
return;
|
|
775
784
|
}
|
|
776
|
-
const _ =
|
|
785
|
+
const _ = $t(T, k), w = _.getContext("2d");
|
|
777
786
|
if (!w) {
|
|
778
787
|
t(e, n);
|
|
779
788
|
return;
|
|
780
789
|
}
|
|
781
|
-
const
|
|
790
|
+
const A = n.x || 0, E = n.y || 0, S = g.a * A + g.c * E + g.e, P = g.b * A + g.d * E + g.f, I = Math.round(S - T / 2), D = Math.round(P - k / 2);
|
|
782
791
|
if (w.setTransform(
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
T / 2 -
|
|
788
|
-
|
|
792
|
+
g.a,
|
|
793
|
+
g.b,
|
|
794
|
+
g.c,
|
|
795
|
+
g.d,
|
|
796
|
+
T / 2 - S + g.e,
|
|
797
|
+
k / 2 - P + g.f
|
|
789
798
|
), c) {
|
|
790
799
|
w.globalAlpha = 1;
|
|
791
|
-
const
|
|
792
|
-
s && (a.opacity = 1), t(w, n), s && (a.opacity =
|
|
800
|
+
const L = a.opacity;
|
|
801
|
+
s && (a.opacity = 1), t(w, n), s && (a.opacity = L), e.save(), e.resetTransform(), e.globalAlpha = o, e.drawImage(_, I, D), e.restore();
|
|
793
802
|
return;
|
|
794
803
|
}
|
|
795
|
-
const
|
|
796
|
-
a.opacity = 1, t(w, n), a.opacity =
|
|
804
|
+
const F = a.opacity;
|
|
805
|
+
a.opacity = 1, t(w, n), a.opacity = F;
|
|
797
806
|
const M = a.enabled;
|
|
798
807
|
a.enabled = !1, t(e, n), a.enabled = M, e.save(), e.resetTransform(), e.globalAlpha = r, e.drawImage(
|
|
799
808
|
_,
|
|
800
|
-
|
|
809
|
+
I,
|
|
801
810
|
D
|
|
802
811
|
), e.restore();
|
|
803
812
|
}
|
|
804
|
-
function
|
|
805
|
-
|
|
813
|
+
function we(e, n) {
|
|
814
|
+
en(e, n, xt);
|
|
806
815
|
}
|
|
807
|
-
function
|
|
816
|
+
function xt(e, n) {
|
|
808
817
|
const t = n.transformData;
|
|
809
818
|
e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.scale(t.scale, t.scale);
|
|
810
819
|
const a = n.bold ? "bold" : "normal", r = n.italic ? "italic" : "normal";
|
|
@@ -813,84 +822,84 @@ function gt(e, n) {
|
|
|
813
822
|
if (t.reverse) {
|
|
814
823
|
let i = Math.PI / 2 + c / (2 * t.radius);
|
|
815
824
|
o.forEach((l, d) => {
|
|
816
|
-
const p = s[d] / t.radius, f = Math.cos(i - p / 2) * t.radius,
|
|
817
|
-
e.save(), e.translate(f,
|
|
825
|
+
const p = s[d] / t.radius, f = Math.cos(i - p / 2) * t.radius, $ = Math.sin(i - p / 2) * t.radius;
|
|
826
|
+
e.save(), e.translate(f, $), e.rotate(i - p / 2 - Math.PI / 2), nn(e, l, n.stroke), e.fillText(l, 0, 0), e.restore(), i -= p;
|
|
818
827
|
});
|
|
819
828
|
} else {
|
|
820
829
|
let i = -Math.PI / 2 - c / (2 * t.radius);
|
|
821
830
|
o.forEach((l, d) => {
|
|
822
|
-
const p = s[d] / t.radius, f = Math.cos(i + p / 2) * t.radius,
|
|
823
|
-
e.save(), e.translate(f,
|
|
831
|
+
const p = s[d] / t.radius, f = Math.cos(i + p / 2) * t.radius, $ = Math.sin(i + p / 2) * t.radius;
|
|
832
|
+
e.save(), e.translate(f, $), e.rotate(i + p / 2 + Math.PI / 2), nn(e, l, n.stroke), e.fillText(l, 0, 0), e.restore(), i += p;
|
|
824
833
|
});
|
|
825
834
|
}
|
|
826
835
|
e.restore();
|
|
827
836
|
}
|
|
828
|
-
function
|
|
829
|
-
|
|
837
|
+
function Se(e, n) {
|
|
838
|
+
en(e, n, vt);
|
|
830
839
|
}
|
|
831
|
-
function
|
|
840
|
+
function vt(e, n) {
|
|
832
841
|
const t = n.transformData;
|
|
833
|
-
e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font =
|
|
842
|
+
e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = B(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
|
|
834
843
|
const a = n.text.split("");
|
|
835
844
|
let o = -a.reduce((s, c) => s + e.measureText(c).width, 0) / 2;
|
|
836
845
|
a.forEach((s) => {
|
|
837
846
|
const c = e.measureText(s).width, i = o + c / 2, l = i / (t.width / 2), d = t.amplitude * n.fontSize * Math.sin(t.frequency * Math.PI * l), u = t.amplitude * t.frequency * Math.PI * Math.cos(t.frequency * Math.PI * l);
|
|
838
|
-
e.save(), e.translate(i, d), e.transform(1, u *
|
|
847
|
+
e.save(), e.translate(i, d), e.transform(1, u * He, 0, 1, 0, 0), nn(e, s, n.stroke), e.fillText(s, 0, 0), e.restore(), o += c;
|
|
839
848
|
}), e.restore();
|
|
840
849
|
}
|
|
841
|
-
function
|
|
842
|
-
|
|
850
|
+
function Ce(e, n) {
|
|
851
|
+
en(e, n, wt);
|
|
843
852
|
}
|
|
844
|
-
function
|
|
853
|
+
function wt(e, n) {
|
|
845
854
|
const t = n.transformData;
|
|
846
|
-
e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font =
|
|
855
|
+
e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = B(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
|
|
847
856
|
const a = n.text.split(""), r = a.reduce((c, i) => c + e.measureText(i).width, 0), o = t.width / 2;
|
|
848
857
|
let s = -r / 2;
|
|
849
858
|
a.forEach((c) => {
|
|
850
859
|
const i = e.measureText(c).width, l = s + i / 2, d = l / o, u = (Math.pow(d, 2) - 1) * t.archHeight * n.fontSize, p = 2 * d * t.archHeight;
|
|
851
|
-
e.save(), e.translate(l, u), e.transform(1, p * 0.3, 0, 1, 0, 0),
|
|
860
|
+
e.save(), e.translate(l, u), e.transform(1, p * 0.3, 0, 1, 0, 0), nn(e, c, n.stroke), e.fillText(c, 0, 0), e.restore(), s += i;
|
|
852
861
|
}), e.restore();
|
|
853
862
|
}
|
|
854
|
-
function
|
|
855
|
-
|
|
863
|
+
function ke(e, n) {
|
|
864
|
+
en(e, n, St);
|
|
856
865
|
}
|
|
857
|
-
function
|
|
866
|
+
function St(e, n) {
|
|
858
867
|
const t = n.transformData;
|
|
859
|
-
e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font =
|
|
868
|
+
e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = B(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
|
|
860
869
|
const a = n.text.split(""), r = a.reduce((c, i) => c + e.measureText(i).width, 0), o = t.ascendAngle * Math.PI / 180;
|
|
861
870
|
let s = -r / 2;
|
|
862
871
|
a.forEach((c) => {
|
|
863
872
|
const i = e.measureText(c).width, l = s + i / 2, d = l * Math.tan(o), u = Math.tan(o);
|
|
864
|
-
e.save(), e.translate(l, d), e.transform(1, u * 1, 0, 1, 0, 0),
|
|
873
|
+
e.save(), e.translate(l, d), e.transform(1, u * 1, 0, 1, 0, 0), nn(e, c, n.stroke), e.fillText(c, 0, 0), e.restore(), s += i;
|
|
865
874
|
}), e.restore();
|
|
866
875
|
}
|
|
867
|
-
function
|
|
868
|
-
|
|
876
|
+
function Te(e, n) {
|
|
877
|
+
en(e, n, Ct);
|
|
869
878
|
}
|
|
870
|
-
function
|
|
879
|
+
function Ct(e, n) {
|
|
871
880
|
var r;
|
|
872
881
|
const t = n.transformData;
|
|
873
882
|
e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180);
|
|
874
883
|
const a = -t.leanAmount * Math.PI / 4;
|
|
875
|
-
e.transform(1, 0, Math.tan(a), 1, 0, 0), e.font =
|
|
884
|
+
e.transform(1, 0, Math.tan(a), 1, 0, 0), e.font = B(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle", (r = n.stroke) != null && r.enabled && (e.save(), e.strokeStyle = n.stroke.color, e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "round", e.lineJoin = n.stroke.lineJoin || "round", n.stroke.opacity !== void 0 && (e.globalAlpha = n.stroke.opacity), e.strokeText(n.text, 0, 0), e.restore()), e.fillText(n.text, 0, 0), e.restore();
|
|
876
885
|
}
|
|
877
|
-
function
|
|
878
|
-
|
|
886
|
+
function _e(e, n) {
|
|
887
|
+
en(e, n, kt);
|
|
879
888
|
}
|
|
880
|
-
function
|
|
889
|
+
function kt(e, n) {
|
|
881
890
|
const t = n.transformData;
|
|
882
|
-
e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font =
|
|
891
|
+
e.save(), e.translate(n.x, n.y), e.rotate(-n.rotation * Math.PI / 180), e.font = B(n.fontSize, n.fontFamily, n.bold, n.italic), e.fillStyle = n.color, e.textAlign = "center", e.textBaseline = "middle";
|
|
883
892
|
const a = n.text.split("");
|
|
884
893
|
let o = -a.reduce((s, c) => s + e.measureText(c).width, 0) / 2;
|
|
885
894
|
a.forEach((s) => {
|
|
886
|
-
const c = e.measureText(s).width, i = o + c / 2, l = i / (t.width / 2), d = Math.abs(l), u = t.amplitude * d, p = u * n.fontSize * Math.sin(t.frequency * Math.PI * l), f = u * t.frequency * Math.PI * Math.cos(t.frequency * Math.PI * l),
|
|
887
|
-
e.save(), e.translate(i, p), e.transform(1,
|
|
895
|
+
const c = e.measureText(s).width, i = o + c / 2, l = i / (t.width / 2), d = Math.abs(l), u = t.amplitude * d, p = u * n.fontSize * Math.sin(t.frequency * Math.PI * l), f = u * t.frequency * Math.PI * Math.cos(t.frequency * Math.PI * l), $ = t.amplitude * Math.sign(l) * Math.sin(t.frequency * Math.PI * l), h = f + $;
|
|
896
|
+
e.save(), e.translate(i, p), e.transform(1, h * 0.3, 0, 1, 0, 0), nn(e, s, n.stroke), e.fillText(s, 0, 0), e.restore(), o += c;
|
|
888
897
|
}), e.restore();
|
|
889
898
|
}
|
|
890
|
-
function
|
|
899
|
+
function X(e) {
|
|
891
900
|
return (n, t) => e(n, t);
|
|
892
901
|
}
|
|
893
|
-
function
|
|
902
|
+
function Tt(e, n) {
|
|
894
903
|
e.save();
|
|
895
904
|
const t = e.canvas, a = t.width, r = t.height, o = e.getTransform(), s = [];
|
|
896
905
|
let c = [];
|
|
@@ -920,52 +929,53 @@ function wt(e, n) {
|
|
|
920
929
|
}
|
|
921
930
|
e.restore();
|
|
922
931
|
}
|
|
923
|
-
var
|
|
924
|
-
function
|
|
925
|
-
|
|
932
|
+
var Qn = !1;
|
|
933
|
+
function Hn() {
|
|
934
|
+
Qn || (Qn = !0, q("arch", X(Ce)), q("ascend", X(ke)), q("circle", X(we)), q("flag", X(_e)), q("lean", X(Te)), q("wave", X(Se)), q(
|
|
926
935
|
"custom",
|
|
927
|
-
(e, n) =>
|
|
928
|
-
),
|
|
929
|
-
(e, n) =>
|
|
936
|
+
(e, n) => Pn(e, n)
|
|
937
|
+
), Ve(Tt), et(
|
|
938
|
+
(e, n) => st(e, n)
|
|
930
939
|
), globalThis.__scElementPaintersInstalled = !0);
|
|
931
940
|
}
|
|
932
|
-
|
|
933
|
-
function
|
|
941
|
+
Hn();
|
|
942
|
+
function Vn(e, n, t = {}) {
|
|
934
943
|
const a = t.mode || "both";
|
|
935
944
|
switch (e.save(), e.translate(n.x || 0, n.y || 0), e.rotate(-(n.rotation || 0) * Math.PI / 180), n.transformType) {
|
|
936
945
|
case "image":
|
|
937
|
-
|
|
946
|
+
Et(e, n, a, t);
|
|
938
947
|
break;
|
|
939
948
|
case "shape":
|
|
940
|
-
|
|
949
|
+
At(e, n, a, t);
|
|
941
950
|
break;
|
|
942
951
|
case "group":
|
|
943
952
|
break;
|
|
944
953
|
default:
|
|
945
|
-
|
|
954
|
+
_t(e, n, a, t);
|
|
946
955
|
break;
|
|
947
956
|
}
|
|
948
957
|
e.restore();
|
|
949
958
|
}
|
|
950
|
-
function
|
|
959
|
+
function _t(e, n, t, a) {
|
|
951
960
|
var s;
|
|
952
961
|
const r = n, o = r.text || "";
|
|
953
|
-
o && ((t === "stroke" || t === "both") && ((s = n.stroke) != null && s.enabled) && (e.save(),
|
|
962
|
+
o && ((t === "stroke" || t === "both") && ((s = n.stroke) != null && s.enabled) && (e.save(), ve(e, n, { ...a.renderingContext, positionApplied: !0 }), e.restore()), (t === "fill" || t === "both") && (e.save(), bt(e, {
|
|
954
963
|
text: o,
|
|
955
964
|
fontSize: r.fontSize || 24,
|
|
956
965
|
fontFamily: r.fontFamily || "Arial",
|
|
957
966
|
bold: r.bold || !1,
|
|
958
967
|
italic: r.italic || !1,
|
|
959
968
|
textAlign: r.textAlign || "center",
|
|
960
|
-
color: r.color || "#000000"
|
|
969
|
+
color: r.color || "#000000",
|
|
970
|
+
letterSpacing: r.letterSpacing
|
|
961
971
|
}), e.restore()));
|
|
962
972
|
}
|
|
963
|
-
function
|
|
973
|
+
function Et(e, n, t, a) {
|
|
964
974
|
var o;
|
|
965
975
|
if (!n.transformData) return;
|
|
966
976
|
const r = n.transformData;
|
|
967
977
|
if (t === "fill" || t === "both")
|
|
968
|
-
if (
|
|
978
|
+
if (Mt(e, n), a.loadedImage) {
|
|
969
979
|
e.save(), e.clip();
|
|
970
980
|
const s = r.flipHorizontal ? -1 : 1, c = r.flipVertical ? -1 : 1;
|
|
971
981
|
e.scale(s, c);
|
|
@@ -973,34 +983,34 @@ function Ct(e, n, t, a) {
|
|
|
973
983
|
e.drawImage(a.loadedImage, -i / 2, -l / 2, i, l), e.restore();
|
|
974
984
|
} else
|
|
975
985
|
e.fillStyle = "#cccccc", e.fill();
|
|
976
|
-
(t === "stroke" || t === "both") && ((o = n.stroke) != null && o.enabled) && (e.save(),
|
|
986
|
+
(t === "stroke" || t === "both") && ((o = n.stroke) != null && o.enabled) && (e.save(), ft(e, n, a.renderingContext), e.restore());
|
|
977
987
|
}
|
|
978
|
-
function
|
|
988
|
+
function At(e, n, t, a) {
|
|
979
989
|
var s, c;
|
|
980
990
|
if (!n.transformData) return;
|
|
981
991
|
const r = n.transformData, o = ((s = a.renderingContext) == null ? void 0 : s.isKnockout) === !0;
|
|
982
|
-
e.beginPath(),
|
|
992
|
+
e.beginPath(), Ee(e, r), (t === "fill" || t === "both") && (e.fillStyle = o ? "#000000" : r.fillColor || "#3b82f6", e.globalAlpha = o ? 1 : r.fillOpacity ?? 1, e.fill()), (t === "stroke" || t === "both") && ((c = n.stroke) != null && c.enabled) && (e.save(), Ft(e, n, a.renderingContext), e.restore());
|
|
983
993
|
}
|
|
984
|
-
function
|
|
994
|
+
function Ee(e, n) {
|
|
985
995
|
const { shapeType: t } = n, a = n.width ?? 100, r = n.height ?? 100;
|
|
986
996
|
switch (t) {
|
|
987
997
|
case "rectangle":
|
|
988
|
-
|
|
998
|
+
ne(e, n, a, r);
|
|
989
999
|
break;
|
|
990
1000
|
case "circle":
|
|
991
|
-
|
|
1001
|
+
Pt(e, Math.min(a, r) / 2);
|
|
992
1002
|
break;
|
|
993
1003
|
case "ellipse":
|
|
994
|
-
|
|
1004
|
+
It(e, a / 2, r / 2);
|
|
995
1005
|
break;
|
|
996
1006
|
case "star":
|
|
997
|
-
|
|
1007
|
+
Dt(e, n, Math.min(a, r) / 2);
|
|
998
1008
|
break;
|
|
999
1009
|
default:
|
|
1000
|
-
|
|
1010
|
+
ne(e, n, a, r);
|
|
1001
1011
|
}
|
|
1002
1012
|
}
|
|
1003
|
-
function
|
|
1013
|
+
function ne(e, n, t, a) {
|
|
1004
1014
|
const r = n.borderRadius || 0, o = -t / 2, s = -a / 2;
|
|
1005
1015
|
if (r > 0) {
|
|
1006
1016
|
const c = Math.min(r / 100 * Math.min(t, a), t / 2, a / 2);
|
|
@@ -1008,13 +1018,13 @@ function Kn(e, n, t, a) {
|
|
|
1008
1018
|
} else
|
|
1009
1019
|
e.rect(o, s, t, a);
|
|
1010
1020
|
}
|
|
1011
|
-
function
|
|
1021
|
+
function Pt(e, n) {
|
|
1012
1022
|
e.arc(0, 0, n, 0, Math.PI * 2);
|
|
1013
1023
|
}
|
|
1014
|
-
function
|
|
1024
|
+
function It(e, n, t) {
|
|
1015
1025
|
e.ellipse(0, 0, n, t, 0, 0, Math.PI * 2);
|
|
1016
1026
|
}
|
|
1017
|
-
function
|
|
1027
|
+
function Dt(e, n, t) {
|
|
1018
1028
|
const a = Math.max(3, Math.min(20, n.points || 5)), r = Math.max(0.1, Math.min(0.9, n.innerRadius || 0.4)), o = t * r, s = Math.PI / a, c = -Math.PI / 2;
|
|
1019
1029
|
for (let i = 0; i < a * 2; i++) {
|
|
1020
1030
|
const l = c + s * i, d = i % 2 === 0 ? t : o, u = Math.cos(l) * d, p = Math.sin(l) * d;
|
|
@@ -1022,13 +1032,13 @@ function Et(e, n, t) {
|
|
|
1022
1032
|
}
|
|
1023
1033
|
e.closePath();
|
|
1024
1034
|
}
|
|
1025
|
-
function
|
|
1035
|
+
function Ft(e, n, t) {
|
|
1026
1036
|
var r;
|
|
1027
1037
|
if (!((r = n.stroke) != null && r.enabled) || !n.transformData) return;
|
|
1028
1038
|
const a = (t == null ? void 0 : t.isKnockout) === !0;
|
|
1029
|
-
e.save(), a ? (e.strokeStyle = "#000000", e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", e.globalAlpha = 1) : (e.strokeStyle = n.stroke.color, e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", n.stroke.opacity !== void 0 && (e.globalAlpha = n.stroke.opacity)), n.stroke.miterLimit !== void 0 && (e.miterLimit = n.stroke.miterLimit), n.stroke.dashArray && n.stroke.dashArray.length > 0 && e.setLineDash(n.stroke.dashArray), !a && n.stroke.feather && n.stroke.feather > 0 && "filter" in e && (e.filter = `blur(${n.stroke.feather}px)`), e.beginPath(),
|
|
1039
|
+
e.save(), a ? (e.strokeStyle = "#000000", e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", e.globalAlpha = 1) : (e.strokeStyle = n.stroke.color, e.lineWidth = n.stroke.width, e.lineCap = n.stroke.lineCap || "butt", e.lineJoin = n.stroke.lineJoin || "miter", n.stroke.opacity !== void 0 && (e.globalAlpha = n.stroke.opacity)), n.stroke.miterLimit !== void 0 && (e.miterLimit = n.stroke.miterLimit), n.stroke.dashArray && n.stroke.dashArray.length > 0 && e.setLineDash(n.stroke.dashArray), !a && n.stroke.feather && n.stroke.feather > 0 && "filter" in e && (e.filter = `blur(${n.stroke.feather}px)`), e.beginPath(), Ee(e, n.transformData), e.stroke(), e.restore();
|
|
1030
1040
|
}
|
|
1031
|
-
function
|
|
1041
|
+
function Mt(e, n) {
|
|
1032
1042
|
if (!n.transformData) return;
|
|
1033
1043
|
const { borderRadius: t } = n.transformData, a = n.transformData.width ?? 100, r = n.transformData.height ?? 100, o = -a / 2, s = -r / 2;
|
|
1034
1044
|
if (e.beginPath(), t && t > 0) {
|
|
@@ -1037,8 +1047,8 @@ function Pt(e, n) {
|
|
|
1037
1047
|
} else
|
|
1038
1048
|
e.rect(o, s, a, r);
|
|
1039
1049
|
}
|
|
1040
|
-
function
|
|
1041
|
-
var
|
|
1050
|
+
function Dn(e, n, t, a, r, o, s = "destination-out") {
|
|
1051
|
+
var x;
|
|
1042
1052
|
if (!n.knockoutParts) return;
|
|
1043
1053
|
if (!(n.knockoutParts.fill || n.knockoutParts.stroke)) {
|
|
1044
1054
|
a(e, n);
|
|
@@ -1046,25 +1056,25 @@ function An(e, n, t, a, r, o, s = "destination-out") {
|
|
|
1046
1056
|
}
|
|
1047
1057
|
const i = e.getTransform();
|
|
1048
1058
|
e.save();
|
|
1049
|
-
const l = n.knockoutParts.scope || "group", d =
|
|
1059
|
+
const l = n.knockoutParts.scope || "group", d = Ot(n, l, t);
|
|
1050
1060
|
if (d.length === 0 && l === "artboard") {
|
|
1051
|
-
|
|
1061
|
+
Bt(e, n, a), e.restore();
|
|
1052
1062
|
return;
|
|
1053
1063
|
}
|
|
1054
1064
|
if (d.length === 0) {
|
|
1055
1065
|
a(e, n), e.restore();
|
|
1056
1066
|
return;
|
|
1057
1067
|
}
|
|
1058
|
-
const u = e.canvas, f = e.getTransform().a,
|
|
1059
|
-
if (!
|
|
1060
|
-
|
|
1061
|
-
for (const
|
|
1062
|
-
a(
|
|
1063
|
-
n.knockoutParts.fill && !n.knockoutParts.stroke && ((
|
|
1064
|
-
const
|
|
1065
|
-
e.drawImage(
|
|
1066
|
-
const
|
|
1067
|
-
(Math.abs(
|
|
1068
|
+
const u = e.canvas, f = e.getTransform().a, $ = Lt(u.width, u.height), h = $.getContext("2d");
|
|
1069
|
+
if (!h) return;
|
|
1070
|
+
h.scale(f, f), r && o && (h.fillStyle = r, h.fillRect(o.x, o.y, o.width, o.height));
|
|
1071
|
+
for (const m of d)
|
|
1072
|
+
a(h, m);
|
|
1073
|
+
n.knockoutParts.fill && !n.knockoutParts.stroke && ((x = n.stroke) != null && x.enabled) && (h.save(), Mn(h, n), h.restore()), h.save(), h.globalCompositeOperation = s, n.knockoutParts.fill && Fn(h, n), n.knockoutParts.stroke && Mn(h, n), h.restore(), n.knockoutParts.fill || (h.save(), Fn(h, n), h.restore());
|
|
1074
|
+
const b = u.width / f, v = u.height / f;
|
|
1075
|
+
e.drawImage($, 0, 0, b, v), e.restore();
|
|
1076
|
+
const y = e.getTransform();
|
|
1077
|
+
(Math.abs(y.a - i.a) > 1e-3 || Math.abs(y.d - i.d) > 1e-3 || Math.abs(y.e - i.e) > 1e-3 || Math.abs(y.f - i.f) > 1e-3) && e.setTransform(
|
|
1068
1078
|
i.a,
|
|
1069
1079
|
i.b,
|
|
1070
1080
|
i.c,
|
|
@@ -1073,59 +1083,59 @@ function An(e, n, t, a, r, o, s = "destination-out") {
|
|
|
1073
1083
|
i.f
|
|
1074
1084
|
);
|
|
1075
1085
|
}
|
|
1076
|
-
function
|
|
1077
|
-
|
|
1086
|
+
function Da(e, n, t, a, r, o) {
|
|
1087
|
+
Dn(e, n, t, a, r, o, "destination-out");
|
|
1078
1088
|
}
|
|
1079
|
-
function
|
|
1080
|
-
return n === "artboard" ?
|
|
1089
|
+
function Ot(e, n, t) {
|
|
1090
|
+
return n === "artboard" ? Ae(e, t) : Rt(e, t);
|
|
1081
1091
|
}
|
|
1082
|
-
function
|
|
1092
|
+
function Ae(e, n) {
|
|
1083
1093
|
const t = n.findIndex((a) => a.id === e.id);
|
|
1084
1094
|
return t === -1 ? [] : n.slice(0, t);
|
|
1085
1095
|
}
|
|
1086
|
-
function
|
|
1087
|
-
const t =
|
|
1096
|
+
function Rt(e, n) {
|
|
1097
|
+
const t = Pe(e, n);
|
|
1088
1098
|
if (!t)
|
|
1089
|
-
return
|
|
1099
|
+
return Ae(e, n);
|
|
1090
1100
|
if (t.transformType !== "group" || !t.children)
|
|
1091
1101
|
return [];
|
|
1092
1102
|
const a = t.children.findIndex((r) => r.id === e.id);
|
|
1093
1103
|
return a === -1 ? [] : t.children.slice(0, a);
|
|
1094
1104
|
}
|
|
1095
|
-
function
|
|
1105
|
+
function Pe(e, n) {
|
|
1096
1106
|
for (const t of n)
|
|
1097
1107
|
if (t.transformType === "group" && t.children) {
|
|
1098
1108
|
if (t.children.some((r) => r.id === e.id))
|
|
1099
1109
|
return t;
|
|
1100
|
-
const a =
|
|
1110
|
+
const a = Pe(e, t.children);
|
|
1101
1111
|
if (a)
|
|
1102
1112
|
return a;
|
|
1103
1113
|
}
|
|
1104
1114
|
return null;
|
|
1105
1115
|
}
|
|
1106
|
-
function
|
|
1107
|
-
|
|
1116
|
+
function Fn(e, n, t) {
|
|
1117
|
+
Vn(e, n, {
|
|
1108
1118
|
mode: "fill",
|
|
1109
1119
|
renderingContext: { isKnockout: !0 }
|
|
1110
1120
|
});
|
|
1111
1121
|
}
|
|
1112
|
-
function
|
|
1122
|
+
function Mn(e, n) {
|
|
1113
1123
|
var t;
|
|
1114
|
-
(t = n.stroke) != null && t.enabled &&
|
|
1124
|
+
(t = n.stroke) != null && t.enabled && Vn(e, n, {
|
|
1115
1125
|
mode: "stroke",
|
|
1116
1126
|
renderingContext: { isKnockout: !0 }
|
|
1117
1127
|
});
|
|
1118
1128
|
}
|
|
1119
|
-
function
|
|
1129
|
+
function Bt(e, n, t) {
|
|
1120
1130
|
var r;
|
|
1121
1131
|
const a = n.knockoutParts;
|
|
1122
1132
|
if (!a) {
|
|
1123
1133
|
t(e, n);
|
|
1124
1134
|
return;
|
|
1125
1135
|
}
|
|
1126
|
-
a.fill || (e.save(),
|
|
1136
|
+
a.fill || (e.save(), Fn(e, n), e.restore()), !a.stroke && ((r = n.stroke) != null && r.enabled) && (e.save(), Mn(e, n), e.restore());
|
|
1127
1137
|
}
|
|
1128
|
-
function
|
|
1138
|
+
function Lt(e, n) {
|
|
1129
1139
|
if (typeof OffscreenCanvas < "u")
|
|
1130
1140
|
return new OffscreenCanvas(e, n);
|
|
1131
1141
|
if (typeof document < "u") {
|
|
@@ -1134,7 +1144,7 @@ function Mt(e, n) {
|
|
|
1134
1144
|
}
|
|
1135
1145
|
throw new Error("No canvas context available");
|
|
1136
1146
|
}
|
|
1137
|
-
function
|
|
1147
|
+
function ee(e, n, t, a, r = 0) {
|
|
1138
1148
|
if (t <= 0 || a <= 0 || e <= 0 || n <= 0)
|
|
1139
1149
|
return { width: e + r, height: n + r };
|
|
1140
1150
|
const o = t / a, s = e / n;
|
|
@@ -1144,11 +1154,11 @@ function Jn(e, n, t, a, r = 0) {
|
|
|
1144
1154
|
height: i + r
|
|
1145
1155
|
};
|
|
1146
1156
|
}
|
|
1147
|
-
const
|
|
1148
|
-
function
|
|
1157
|
+
const an = 64, Tn = 512;
|
|
1158
|
+
function Nt(e, n) {
|
|
1149
1159
|
e.beginPath(), e.arc(n / 2, n / 2, n * 0.45, 0, Math.PI * 2), e.fill();
|
|
1150
1160
|
}
|
|
1151
|
-
function
|
|
1161
|
+
function Ut(e, n) {
|
|
1152
1162
|
const t = n / 2, a = n / 2, r = n * 0.45, o = r * 0.4, s = 5;
|
|
1153
1163
|
e.beginPath();
|
|
1154
1164
|
for (let c = 0; c < s * 2; c++) {
|
|
@@ -1157,15 +1167,15 @@ function Rt(e, n) {
|
|
|
1157
1167
|
}
|
|
1158
1168
|
e.closePath(), e.fill();
|
|
1159
1169
|
}
|
|
1160
|
-
function
|
|
1170
|
+
function Wt(e, n) {
|
|
1161
1171
|
const t = n / 2, a = n * 0.42;
|
|
1162
1172
|
e.beginPath(), e.moveTo(t, n * 0.82), e.bezierCurveTo(t - a * 1.1, n * 0.6, t - a * 1.3, n * 0.2, t, n * 0.35), e.bezierCurveTo(t + a * 1.3, n * 0.2, t + a * 1.1, n * 0.6, t, n * 0.82), e.closePath(), e.fill();
|
|
1163
1173
|
}
|
|
1164
|
-
function
|
|
1174
|
+
function zt(e, n) {
|
|
1165
1175
|
const t = n / 2, a = n / 2, r = n * 0.4, o = n * 0.48;
|
|
1166
1176
|
e.beginPath(), e.moveTo(t, a - o), e.lineTo(t + r, a), e.lineTo(t, a + o), e.lineTo(t - r, a), e.closePath(), e.fill();
|
|
1167
1177
|
}
|
|
1168
|
-
function
|
|
1178
|
+
function Gt(e, n) {
|
|
1169
1179
|
const t = n / 2, a = n / 2, r = n * 0.44;
|
|
1170
1180
|
e.beginPath();
|
|
1171
1181
|
for (let o = 0; o < 6; o++) {
|
|
@@ -1174,11 +1184,11 @@ function Nt(e, n) {
|
|
|
1174
1184
|
}
|
|
1175
1185
|
e.closePath(), e.fill();
|
|
1176
1186
|
}
|
|
1177
|
-
function
|
|
1187
|
+
function Ht(e, n) {
|
|
1178
1188
|
const t = n / 2, a = n * 0.4, r = n * 0.12;
|
|
1179
1189
|
e.beginPath(), e.moveTo(t, r), e.lineTo(t + a, n * 0.25), e.lineTo(t + a, n * 0.55), e.quadraticCurveTo(t + a * 0.3, n * 0.8, t, n * 0.9), e.quadraticCurveTo(t - a * 0.3, n * 0.8, t - a, n * 0.55), e.lineTo(t - a, n * 0.25), e.closePath(), e.fill();
|
|
1180
1190
|
}
|
|
1181
|
-
function
|
|
1191
|
+
function Vt(e, n) {
|
|
1182
1192
|
const t = n / 2, a = n / 2;
|
|
1183
1193
|
let r = 42;
|
|
1184
1194
|
const o = () => (r = (r * 16807 + 0) % 2147483647, r / 2147483647);
|
|
@@ -1188,7 +1198,7 @@ function zt(e, n) {
|
|
|
1188
1198
|
e.beginPath(), e.arc(t + Math.cos(c) * i, a + Math.sin(c) * i, l, 0, Math.PI * 2), e.fill();
|
|
1189
1199
|
}
|
|
1190
1200
|
}
|
|
1191
|
-
function
|
|
1201
|
+
function jt(e, n) {
|
|
1192
1202
|
let t = 123;
|
|
1193
1203
|
const a = () => (t = (t * 16807 + 0) % 2147483647, t / 2147483647), r = n * 0.08, o = 40;
|
|
1194
1204
|
e.beginPath(), e.moveTo(r, r);
|
|
@@ -1210,7 +1220,7 @@ function Wt(e, n) {
|
|
|
1210
1220
|
}
|
|
1211
1221
|
e.closePath(), e.fill();
|
|
1212
1222
|
}
|
|
1213
|
-
function
|
|
1223
|
+
function qt(e, n) {
|
|
1214
1224
|
let t = 77;
|
|
1215
1225
|
const a = () => (t = (t * 16807 + 0) % 2147483647, t / 2147483647), r = n * 0.25, o = n * 0.75, s = n * 0.1;
|
|
1216
1226
|
e.beginPath(), e.moveTo(s, r + a() * n * 0.05);
|
|
@@ -1224,101 +1234,101 @@ function Gt(e, n) {
|
|
|
1224
1234
|
}
|
|
1225
1235
|
e.closePath(), e.fill();
|
|
1226
1236
|
}
|
|
1227
|
-
function
|
|
1237
|
+
function Xt(e, n) {
|
|
1228
1238
|
const t = n / 2, a = n * 0.55;
|
|
1229
1239
|
e.beginPath(), e.arc(t, a, n * 0.2, 0, Math.PI * 2), e.fill(), e.beginPath(), e.arc(t - n * 0.18, a + n * 0.02, n * 0.15, 0, Math.PI * 2), e.fill(), e.beginPath(), e.arc(t + n * 0.18, a + n * 0.02, n * 0.16, 0, Math.PI * 2), e.fill(), e.beginPath(), e.arc(t - n * 0.06, a - n * 0.14, n * 0.14, 0, Math.PI * 2), e.fill(), e.beginPath(), e.arc(t + n * 0.1, a - n * 0.12, n * 0.12, 0, Math.PI * 2), e.fill();
|
|
1230
1240
|
}
|
|
1231
|
-
const
|
|
1241
|
+
const Yt = [
|
|
1232
1242
|
// Geometric
|
|
1233
|
-
{ id: "circle", name: "Circle", description: "Perfect circle", imageUrl: "builtin-mask:circle", thumbnailUrl: "", category: "geometric", draw:
|
|
1234
|
-
{ id: "star", name: "Star", description: "5-pointed star", imageUrl: "builtin-mask:star", thumbnailUrl: "", category: "geometric", draw:
|
|
1235
|
-
{ id: "heart", name: "Heart", description: "Heart shape", imageUrl: "builtin-mask:heart", thumbnailUrl: "", category: "geometric", draw:
|
|
1236
|
-
{ id: "diamond", name: "Diamond", description: "Diamond/rhombus", imageUrl: "builtin-mask:diamond", thumbnailUrl: "", category: "geometric", draw:
|
|
1237
|
-
{ id: "hexagon", name: "Hexagon", description: "Regular hexagon", imageUrl: "builtin-mask:hexagon", thumbnailUrl: "", category: "geometric", draw:
|
|
1238
|
-
{ id: "shield", name: "Shield", description: "Shield/crest shape", imageUrl: "builtin-mask:shield", thumbnailUrl: "", category: "geometric", draw:
|
|
1243
|
+
{ id: "circle", name: "Circle", description: "Perfect circle", imageUrl: "builtin-mask:circle", thumbnailUrl: "", category: "geometric", draw: Nt },
|
|
1244
|
+
{ id: "star", name: "Star", description: "5-pointed star", imageUrl: "builtin-mask:star", thumbnailUrl: "", category: "geometric", draw: Ut },
|
|
1245
|
+
{ id: "heart", name: "Heart", description: "Heart shape", imageUrl: "builtin-mask:heart", thumbnailUrl: "", category: "geometric", draw: Wt },
|
|
1246
|
+
{ id: "diamond", name: "Diamond", description: "Diamond/rhombus", imageUrl: "builtin-mask:diamond", thumbnailUrl: "", category: "geometric", draw: zt },
|
|
1247
|
+
{ id: "hexagon", name: "Hexagon", description: "Regular hexagon", imageUrl: "builtin-mask:hexagon", thumbnailUrl: "", category: "geometric", draw: Gt },
|
|
1248
|
+
{ id: "shield", name: "Shield", description: "Shield/crest shape", imageUrl: "builtin-mask:shield", thumbnailUrl: "", category: "geometric", draw: Ht },
|
|
1239
1249
|
// Organic
|
|
1240
|
-
{ id: "splatter", name: "Splatter", description: "Ink splatter", imageUrl: "builtin-mask:splatter", thumbnailUrl: "", category: "organic", draw:
|
|
1241
|
-
{ id: "torn-edge", name: "Torn Edge", description: "Rough torn paper edge", imageUrl: "builtin-mask:torn-edge", thumbnailUrl: "", category: "organic", draw:
|
|
1242
|
-
{ id: "paint-stroke", name: "Paint Stroke", description: "Horizontal brush stroke", imageUrl: "builtin-mask:paint-stroke", thumbnailUrl: "", category: "organic", draw:
|
|
1243
|
-
{ id: "cloud", name: "Cloud", description: "Soft cloud shape", imageUrl: "builtin-mask:cloud", thumbnailUrl: "", category: "organic", draw:
|
|
1250
|
+
{ id: "splatter", name: "Splatter", description: "Ink splatter", imageUrl: "builtin-mask:splatter", thumbnailUrl: "", category: "organic", draw: Vt },
|
|
1251
|
+
{ id: "torn-edge", name: "Torn Edge", description: "Rough torn paper edge", imageUrl: "builtin-mask:torn-edge", thumbnailUrl: "", category: "organic", draw: jt },
|
|
1252
|
+
{ id: "paint-stroke", name: "Paint Stroke", description: "Horizontal brush stroke", imageUrl: "builtin-mask:paint-stroke", thumbnailUrl: "", category: "organic", draw: qt },
|
|
1253
|
+
{ id: "cloud", name: "Cloud", description: "Soft cloud shape", imageUrl: "builtin-mask:cloud", thumbnailUrl: "", category: "organic", draw: Xt }
|
|
1244
1254
|
];
|
|
1245
|
-
let
|
|
1246
|
-
function
|
|
1255
|
+
let te = !1;
|
|
1256
|
+
function ae(e, n) {
|
|
1247
1257
|
if (typeof document > "u") return null;
|
|
1248
1258
|
const t = document.createElement("canvas");
|
|
1249
1259
|
return t.width = e, t.height = n, t;
|
|
1250
1260
|
}
|
|
1251
|
-
function
|
|
1252
|
-
if (typeof document > "u" ||
|
|
1253
|
-
|
|
1254
|
-
const e =
|
|
1255
|
-
for (const n of
|
|
1256
|
-
const t =
|
|
1261
|
+
function Kt() {
|
|
1262
|
+
if (typeof document > "u" || te) return;
|
|
1263
|
+
te = !0;
|
|
1264
|
+
const e = vn.getInstance();
|
|
1265
|
+
for (const n of Yt) {
|
|
1266
|
+
const t = ae(Tn, Tn);
|
|
1257
1267
|
if (!t) continue;
|
|
1258
1268
|
const a = t.getContext("2d");
|
|
1259
1269
|
if (!a) continue;
|
|
1260
|
-
a.fillStyle = "white", n.draw(a,
|
|
1270
|
+
a.fillStyle = "white", n.draw(a, Tn);
|
|
1261
1271
|
const r = t.toDataURL("image/png"), o = e.acquire(n.imageUrl);
|
|
1262
1272
|
o.crossOrigin = "anonymous", o.src = r;
|
|
1263
|
-
const s =
|
|
1273
|
+
const s = ae(an, an);
|
|
1264
1274
|
if (s) {
|
|
1265
1275
|
const c = s.getContext("2d");
|
|
1266
|
-
c && (c.fillStyle = "#1a1a2e", c.fillRect(0, 0,
|
|
1276
|
+
c && (c.fillStyle = "#1a1a2e", c.fillRect(0, 0, an, an), c.fillStyle = "white", n.draw(c, an), n.thumbnailUrl = s.toDataURL("image/png"));
|
|
1267
1277
|
}
|
|
1268
1278
|
}
|
|
1269
1279
|
}
|
|
1270
|
-
const
|
|
1271
|
-
function
|
|
1280
|
+
const Jt = U("MaskRenderer"), On = /* @__PURE__ */ new Map(), Zt = /* @__PURE__ */ new Map();
|
|
1281
|
+
function Fa(e) {
|
|
1272
1282
|
const n = [];
|
|
1273
|
-
|
|
1283
|
+
On.forEach((t, a) => {
|
|
1274
1284
|
a.startsWith(e) && n.push(a);
|
|
1275
|
-
}), n.forEach((t) =>
|
|
1285
|
+
}), n.forEach((t) => On.delete(t));
|
|
1276
1286
|
}
|
|
1277
|
-
function
|
|
1278
|
-
|
|
1287
|
+
function Ma() {
|
|
1288
|
+
On.clear();
|
|
1279
1289
|
}
|
|
1280
|
-
function
|
|
1290
|
+
function re(e, n, t) {
|
|
1281
1291
|
if (!n.masks || n.masks.length === 0) {
|
|
1282
1292
|
t(e);
|
|
1283
1293
|
return;
|
|
1284
1294
|
}
|
|
1285
|
-
const a = e.canvas, r =
|
|
1295
|
+
const a = e.canvas, r = bn(a.width, a.height), o = r.getContext("2d");
|
|
1286
1296
|
if (!o) {
|
|
1287
|
-
|
|
1297
|
+
Jt.error("[renderWithMasks] Failed to get offscreen context");
|
|
1288
1298
|
return;
|
|
1289
1299
|
}
|
|
1290
1300
|
const s = e.getTransform();
|
|
1291
1301
|
o.setTransform(s), t(o);
|
|
1292
1302
|
for (const c of n.masks)
|
|
1293
|
-
|
|
1303
|
+
Qt(o, c, n);
|
|
1294
1304
|
e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.drawImage(r, 0, 0), e.restore();
|
|
1295
1305
|
}
|
|
1296
|
-
function
|
|
1306
|
+
function Qt(e, n, t) {
|
|
1297
1307
|
switch (n.type) {
|
|
1298
1308
|
case "clip":
|
|
1299
|
-
|
|
1309
|
+
na(e, n, t);
|
|
1300
1310
|
break;
|
|
1301
1311
|
case "alpha":
|
|
1302
|
-
|
|
1312
|
+
ea(e, n, t);
|
|
1303
1313
|
break;
|
|
1304
1314
|
case "luma":
|
|
1305
|
-
|
|
1315
|
+
ta(e, n, t);
|
|
1306
1316
|
break;
|
|
1307
1317
|
case "distress":
|
|
1308
|
-
|
|
1318
|
+
aa(e, n, t);
|
|
1309
1319
|
break;
|
|
1310
1320
|
}
|
|
1311
1321
|
}
|
|
1312
|
-
function
|
|
1313
|
-
e.save(), e.globalCompositeOperation = n.inverted ? "destination-out" : "destination-in", n.opacity !== void 0 && (e.globalAlpha = n.opacity),
|
|
1322
|
+
function na(e, n, t) {
|
|
1323
|
+
e.save(), e.globalCompositeOperation = n.inverted ? "destination-out" : "destination-in", n.opacity !== void 0 && (e.globalAlpha = n.opacity), wn(e, n.maskElement, t), e.restore();
|
|
1314
1324
|
}
|
|
1315
|
-
function
|
|
1316
|
-
e.save(), e.globalCompositeOperation = n.inverted ? "destination-out" : "destination-in", n.opacity !== void 0 && (e.globalAlpha = n.opacity),
|
|
1325
|
+
function ea(e, n, t) {
|
|
1326
|
+
e.save(), e.globalCompositeOperation = n.inverted ? "destination-out" : "destination-in", n.opacity !== void 0 && (e.globalAlpha = n.opacity), wn(e, n.maskElement, t), n.feather && n.feather > 0 && Ie(e, n.feather), e.restore();
|
|
1317
1327
|
}
|
|
1318
|
-
function
|
|
1319
|
-
const a =
|
|
1328
|
+
function ta(e, n, t) {
|
|
1329
|
+
const a = bn(e.canvas.width, e.canvas.height), r = a.getContext("2d");
|
|
1320
1330
|
if (!r) return;
|
|
1321
|
-
|
|
1331
|
+
wn(r, n.maskElement, t);
|
|
1322
1332
|
const o = r.getImageData(0, 0, a.width, a.height), s = o.data;
|
|
1323
1333
|
for (let c = 0; c < s.length; c += 4) {
|
|
1324
1334
|
const i = s[c], l = s[c + 1], d = s[c + 2], u = 0.299 * i + 0.587 * l + 0.114 * d;
|
|
@@ -1326,10 +1336,10 @@ function Zt(e, n, t) {
|
|
|
1326
1336
|
}
|
|
1327
1337
|
r.putImageData(o, 0, 0), e.save(), e.globalCompositeOperation = "destination-in", n.opacity !== void 0 && (e.globalAlpha = n.opacity), e.drawImage(a, 0, 0), e.restore();
|
|
1328
1338
|
}
|
|
1329
|
-
function
|
|
1330
|
-
e.save(), e.globalCompositeOperation = n.inverted ? "destination-in" : "destination-out", n.opacity !== void 0 && (e.globalAlpha = n.opacity),
|
|
1339
|
+
function aa(e, n, t) {
|
|
1340
|
+
e.save(), e.globalCompositeOperation = n.inverted ? "destination-in" : "destination-out", n.opacity !== void 0 && (e.globalAlpha = n.opacity), wn(e, n.maskElement, t), n.feather && n.feather > 0 && Ie(e, n.feather), e.restore();
|
|
1331
1341
|
}
|
|
1332
|
-
function
|
|
1342
|
+
function wn(e, n, t) {
|
|
1333
1343
|
const a = t.x || 0, r = t.y || 0, o = n.x || 0, s = n.y || 0, c = {
|
|
1334
1344
|
...n,
|
|
1335
1345
|
x: a + o,
|
|
@@ -1342,49 +1352,49 @@ function xn(e, n, t) {
|
|
|
1342
1352
|
width: u + i,
|
|
1343
1353
|
height: p + i
|
|
1344
1354
|
});
|
|
1345
|
-
let
|
|
1355
|
+
let $, h;
|
|
1346
1356
|
if (n.transformType === "image") {
|
|
1347
|
-
const
|
|
1348
|
-
if (
|
|
1357
|
+
const m = n;
|
|
1358
|
+
if (m.imageUrl)
|
|
1349
1359
|
if (typeof document < "u") {
|
|
1350
|
-
|
|
1351
|
-
const
|
|
1352
|
-
|
|
1360
|
+
m.imageUrl.startsWith("builtin-mask:") && Kt();
|
|
1361
|
+
const g = vn.getInstance(), C = g.acquire(m.imageUrl);
|
|
1362
|
+
C.complete && C.naturalWidth > 0 && ($ = C), g.release(m.imageUrl);
|
|
1353
1363
|
} else
|
|
1354
|
-
|
|
1364
|
+
h = Zt.get(m.imageUrl);
|
|
1355
1365
|
}
|
|
1356
|
-
const
|
|
1357
|
-
if (
|
|
1366
|
+
const b = c.transformData, v = (f == null ? void 0 : f.width) || 0, y = (f == null ? void 0 : f.height) || 0, x = v > 0 && y > 0 && u > 0 && p > 0 && Math.abs(v / y - u / p) > 1e-3;
|
|
1367
|
+
if (h) {
|
|
1358
1368
|
e.save();
|
|
1359
|
-
const
|
|
1360
|
-
if (e.translate(c.x || 0, c.y || 0), e.rotate(-(c.rotation || 0) * Math.PI / 180),
|
|
1361
|
-
const
|
|
1369
|
+
const m = (b == null ? void 0 : b.width) || h.width, g = (b == null ? void 0 : b.height) || h.height;
|
|
1370
|
+
if (e.translate(c.x || 0, c.y || 0), e.rotate(-(c.rotation || 0) * Math.PI / 180), x) {
|
|
1371
|
+
const C = ee(
|
|
1372
|
+
m,
|
|
1362
1373
|
g,
|
|
1374
|
+
v,
|
|
1363
1375
|
y,
|
|
1364
|
-
S,
|
|
1365
|
-
$,
|
|
1366
1376
|
0
|
|
1367
1377
|
);
|
|
1368
|
-
e.drawImage(
|
|
1378
|
+
e.drawImage(h, -C.width / 2, -C.height / 2, C.width, C.height);
|
|
1369
1379
|
} else
|
|
1370
|
-
e.drawImage(
|
|
1380
|
+
e.drawImage(h, -m / 2, -g / 2, m, g);
|
|
1371
1381
|
e.restore();
|
|
1372
|
-
} else if (
|
|
1373
|
-
const
|
|
1382
|
+
} else if (x && $) {
|
|
1383
|
+
const m = (b == null ? void 0 : b.width) || u, g = (b == null ? void 0 : b.height) || p, C = ee(
|
|
1384
|
+
m,
|
|
1374
1385
|
g,
|
|
1386
|
+
v,
|
|
1375
1387
|
y,
|
|
1376
|
-
S,
|
|
1377
|
-
$,
|
|
1378
1388
|
0
|
|
1379
1389
|
);
|
|
1380
|
-
e.save(), e.translate(c.x || 0, c.y || 0), e.rotate(-(c.rotation || 0) * Math.PI / 180), e.drawImage(
|
|
1390
|
+
e.save(), e.translate(c.x || 0, c.y || 0), e.rotate(-(c.rotation || 0) * Math.PI / 180), e.drawImage($, -C.width / 2, -C.height / 2, C.width, C.height), e.restore();
|
|
1381
1391
|
} else
|
|
1382
|
-
|
|
1392
|
+
Vn(e, c, { mode: "both", loadedImage: $ });
|
|
1383
1393
|
}
|
|
1384
|
-
function
|
|
1394
|
+
function Ie(e, n) {
|
|
1385
1395
|
"filter" in e && (e.filter = `blur(${n}px)`);
|
|
1386
1396
|
}
|
|
1387
|
-
function
|
|
1397
|
+
function bn(e, n) {
|
|
1388
1398
|
if (typeof OffscreenCanvas < "u")
|
|
1389
1399
|
return new OffscreenCanvas(e, n);
|
|
1390
1400
|
if (typeof document < "u") {
|
|
@@ -1393,51 +1403,51 @@ function pn(e, n) {
|
|
|
1393
1403
|
}
|
|
1394
1404
|
throw new Error("No canvas context available");
|
|
1395
1405
|
}
|
|
1396
|
-
function
|
|
1406
|
+
function ra(e, n, t, a) {
|
|
1397
1407
|
if (!n.enabled || !n.imageUrl || n.opacity <= 0) return;
|
|
1398
|
-
const r =
|
|
1408
|
+
const r = vn.getInstance(), o = r.acquire(n.imageUrl);
|
|
1399
1409
|
if (!o.complete || o.naturalWidth === 0) {
|
|
1400
1410
|
r.release(n.imageUrl);
|
|
1401
1411
|
return;
|
|
1402
1412
|
}
|
|
1403
|
-
const { x: s, y: c, width: i, height: l } = t, d = e.getTransform(), u = d.a * s + d.e, p = d.d * c + d.f, f = d.a * i,
|
|
1404
|
-
if (
|
|
1413
|
+
const { x: s, y: c, width: i, height: l } = t, d = e.getTransform(), u = d.a * s + d.e, p = d.d * c + d.f, f = d.a * i, $ = d.d * l, h = Math.ceil(f), b = Math.ceil($);
|
|
1414
|
+
if (h <= 0 || b <= 0) {
|
|
1405
1415
|
r.release(n.imageUrl);
|
|
1406
1416
|
return;
|
|
1407
1417
|
}
|
|
1408
|
-
const
|
|
1409
|
-
if (
|
|
1418
|
+
const v = bn(h, b), y = v.getContext("2d");
|
|
1419
|
+
if (!y) {
|
|
1410
1420
|
r.release(n.imageUrl);
|
|
1411
1421
|
return;
|
|
1412
1422
|
}
|
|
1413
|
-
|
|
1423
|
+
y.drawImage(
|
|
1414
1424
|
e.canvas,
|
|
1415
1425
|
u,
|
|
1416
1426
|
p,
|
|
1417
1427
|
f,
|
|
1418
|
-
|
|
1428
|
+
$,
|
|
1419
1429
|
0,
|
|
1420
1430
|
0,
|
|
1421
|
-
|
|
1422
|
-
|
|
1431
|
+
h,
|
|
1432
|
+
b
|
|
1423
1433
|
);
|
|
1424
|
-
let
|
|
1425
|
-
if (n.maskType === "luma" ?
|
|
1426
|
-
const
|
|
1427
|
-
if (
|
|
1428
|
-
|
|
1429
|
-
const
|
|
1430
|
-
for (let
|
|
1431
|
-
const _ = 0.299 * T[
|
|
1432
|
-
T[
|
|
1434
|
+
let x;
|
|
1435
|
+
if (n.maskType === "luma" ? x = "destination-in" : x = n.inverted ? "destination-out" : "destination-in", n.maskType === "luma") {
|
|
1436
|
+
const m = bn(h, b), g = m.getContext("2d");
|
|
1437
|
+
if (g) {
|
|
1438
|
+
g.drawImage(o, 0, 0, h, b);
|
|
1439
|
+
const C = g.getImageData(0, 0, h, b), T = C.data;
|
|
1440
|
+
for (let k = 0; k < T.length; k += 4) {
|
|
1441
|
+
const _ = 0.299 * T[k] + 0.587 * T[k + 1] + 0.114 * T[k + 2];
|
|
1442
|
+
T[k + 3] = n.inverted ? 255 - _ : _;
|
|
1433
1443
|
}
|
|
1434
|
-
|
|
1444
|
+
g.putImageData(C, 0, 0), y.globalCompositeOperation = "destination-in", y.globalAlpha = n.opacity / 100, y.drawImage(m, 0, 0);
|
|
1435
1445
|
}
|
|
1436
1446
|
} else
|
|
1437
|
-
|
|
1438
|
-
|
|
1447
|
+
y.globalCompositeOperation = x, y.globalAlpha = n.opacity / 100, y.drawImage(o, 0, 0, h, b);
|
|
1448
|
+
y.globalCompositeOperation = "source-over", y.globalAlpha = 1, e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.clearRect(u, p, f, $), a && (e.fillStyle = a, e.fillRect(u, p, f, $)), e.drawImage(v, u, p), e.restore(), r.release(n.imageUrl);
|
|
1439
1449
|
}
|
|
1440
|
-
class
|
|
1450
|
+
class sa {
|
|
1441
1451
|
constructor(n = Math.random()) {
|
|
1442
1452
|
this.perm = [];
|
|
1443
1453
|
for (let a = 0; a < 256; a++)
|
|
@@ -1475,55 +1485,55 @@ class ea {
|
|
|
1475
1485
|
);
|
|
1476
1486
|
}
|
|
1477
1487
|
}
|
|
1478
|
-
function
|
|
1479
|
-
const s =
|
|
1488
|
+
function _n(e, n, t, a = Date.now()) {
|
|
1489
|
+
const s = Sn(e, n).getContext("2d").createImageData(e, n), c = s.data, i = new sa(a), l = 0.02, d = 1 - t / 100;
|
|
1480
1490
|
for (let u = 0; u < n; u++)
|
|
1481
1491
|
for (let p = 0; p < e; p++) {
|
|
1482
1492
|
const f = (u * e + p) * 4;
|
|
1483
|
-
let
|
|
1484
|
-
|
|
1485
|
-
const
|
|
1486
|
-
|
|
1487
|
-
const
|
|
1488
|
-
c[f] = 255, c[f + 1] = 255, c[f + 2] = 255, c[f + 3] =
|
|
1493
|
+
let $ = 0;
|
|
1494
|
+
$ += i.noise(p * l, u * l) * 0.5, $ += i.noise(p * l * 2, u * l * 2) * 0.25, $ += i.noise(p * l * 4, u * l * 4) * 0.125, $ = ($ + 1) / 2;
|
|
1495
|
+
const h = Math.min(p / e, (e - p) / e) * 2, b = Math.min(u / n, (n - u) / n) * 2, v = Math.min(h, b);
|
|
1496
|
+
$ *= 0.7 + v * 0.3;
|
|
1497
|
+
const y = $ > d ? 255 : 0;
|
|
1498
|
+
c[f] = 255, c[f + 1] = 255, c[f + 2] = 255, c[f + 3] = y;
|
|
1489
1499
|
}
|
|
1490
1500
|
return s;
|
|
1491
1501
|
}
|
|
1492
|
-
function
|
|
1493
|
-
const o =
|
|
1502
|
+
function ia(e, n, t, a = Date.now()) {
|
|
1503
|
+
const o = Sn(e, n).getContext("2d");
|
|
1494
1504
|
o.clearRect(0, 0, e, n), o.strokeStyle = "#000000", o.lineWidth = 1 + t / 50, o.lineCap = "round";
|
|
1495
|
-
const s =
|
|
1505
|
+
const s = jn(a), c = Math.floor(t / 100 * 30 + 5);
|
|
1496
1506
|
for (let i = 0; i < c; i++) {
|
|
1497
1507
|
const l = s() * e, d = s() * n;
|
|
1498
|
-
|
|
1508
|
+
Rn(o, l, d, s() * Math.PI * 2, 50 + s() * 100, s, 0);
|
|
1499
1509
|
}
|
|
1500
1510
|
return o.getImageData(0, 0, e, n);
|
|
1501
1511
|
}
|
|
1502
|
-
function
|
|
1512
|
+
function Rn(e, n, t, a, r, o, s) {
|
|
1503
1513
|
if (s > 3 || r < 10) return;
|
|
1504
1514
|
const c = n + Math.cos(a) * r, i = t + Math.sin(a) * r;
|
|
1505
1515
|
if (e.beginPath(), e.moveTo(n, t), e.lineTo(c, i), e.stroke(), o() > 0.5) {
|
|
1506
1516
|
const l = a + (o() - 0.5) * Math.PI / 2;
|
|
1507
|
-
|
|
1517
|
+
Rn(e, c, i, l, r * 0.6, o, s + 1);
|
|
1508
1518
|
}
|
|
1509
1519
|
if (o() > 0.7) {
|
|
1510
1520
|
const l = a - (o() - 0.5) * Math.PI / 2;
|
|
1511
|
-
|
|
1521
|
+
Rn(e, c, i, l, r * 0.6, o, s + 1);
|
|
1512
1522
|
}
|
|
1513
1523
|
}
|
|
1514
|
-
function
|
|
1515
|
-
const s =
|
|
1524
|
+
function hn(e, n, t, a = Date.now()) {
|
|
1525
|
+
const s = Sn(e, n).getContext("2d").createImageData(e, n), c = s.data, i = jn(a), l = t / 100 * 0.5;
|
|
1516
1526
|
for (let d = 0; d < n; d++)
|
|
1517
1527
|
for (let u = 0; u < e; u++) {
|
|
1518
|
-
const p = (d * e + u) * 4,
|
|
1519
|
-
c[p] = 0, c[p + 1] = 0, c[p + 2] = 0, c[p + 3] =
|
|
1528
|
+
const p = (d * e + u) * 4, $ = i() < l ? 255 : 0;
|
|
1529
|
+
c[p] = 0, c[p + 1] = 0, c[p + 2] = 0, c[p + 3] = $;
|
|
1520
1530
|
}
|
|
1521
1531
|
return s;
|
|
1522
1532
|
}
|
|
1523
|
-
function
|
|
1524
|
-
const o =
|
|
1533
|
+
function oa(e, n, t, a = Date.now()) {
|
|
1534
|
+
const o = Sn(e, n).getContext("2d");
|
|
1525
1535
|
o.fillStyle = "#000000";
|
|
1526
|
-
const s =
|
|
1536
|
+
const s = jn(a), c = 4 + t / 100 * 6, i = c * 2;
|
|
1527
1537
|
for (let l = 0; l < n; l += i)
|
|
1528
1538
|
for (let d = 0; d < e; d += i)
|
|
1529
1539
|
if (s() < t / 100) {
|
|
@@ -1532,7 +1542,7 @@ function aa(e, n, t, a = Date.now()) {
|
|
|
1532
1542
|
}
|
|
1533
1543
|
return o.getImageData(0, 0, e, n);
|
|
1534
1544
|
}
|
|
1535
|
-
function
|
|
1545
|
+
function Sn(e, n) {
|
|
1536
1546
|
if (typeof OffscreenCanvas < "u")
|
|
1537
1547
|
return new OffscreenCanvas(e, n);
|
|
1538
1548
|
if (typeof document < "u") {
|
|
@@ -1541,31 +1551,31 @@ function vn(e, n) {
|
|
|
1541
1551
|
}
|
|
1542
1552
|
throw new Error("No canvas context available");
|
|
1543
1553
|
}
|
|
1544
|
-
function
|
|
1554
|
+
function jn(e) {
|
|
1545
1555
|
let n = Math.sin(e++) * 1e4;
|
|
1546
1556
|
return () => (n = Math.sin(e++) * 1e4, n - Math.floor(n));
|
|
1547
1557
|
}
|
|
1548
|
-
const
|
|
1549
|
-
function
|
|
1558
|
+
const N = 42, Y = 512, K = 64;
|
|
1559
|
+
function Bn(e) {
|
|
1550
1560
|
const n = e.data;
|
|
1551
1561
|
for (let t = 0; t < n.length; t += 4)
|
|
1552
1562
|
n[t] = 255, n[t + 1] = 255, n[t + 2] = 255;
|
|
1553
1563
|
return e;
|
|
1554
1564
|
}
|
|
1555
|
-
function
|
|
1565
|
+
function ca(e, n) {
|
|
1556
1566
|
const t = e.data, a = n.data;
|
|
1557
1567
|
for (let r = 0; r < t.length; r += 4)
|
|
1558
1568
|
t[r] = 255, t[r + 1] = 255, t[r + 2] = 255, t[r + 3] = Math.min(255, t[r + 3] + a[r + 3]);
|
|
1559
1569
|
return e;
|
|
1560
1570
|
}
|
|
1561
|
-
const
|
|
1571
|
+
const la = [
|
|
1562
1572
|
{
|
|
1563
1573
|
id: "grunge-heavy",
|
|
1564
1574
|
name: "Heavy Grunge",
|
|
1565
1575
|
textureUrl: "builtin:grunge-heavy",
|
|
1566
1576
|
thumbnailUrl: "",
|
|
1567
1577
|
description: "Dense random splatters",
|
|
1568
|
-
generate: (e, n) =>
|
|
1578
|
+
generate: (e, n) => hn(e, n, 80, N)
|
|
1569
1579
|
},
|
|
1570
1580
|
{
|
|
1571
1581
|
id: "grunge-fine",
|
|
@@ -1573,7 +1583,7 @@ const sa = [
|
|
|
1573
1583
|
textureUrl: "builtin:grunge-fine",
|
|
1574
1584
|
thumbnailUrl: "",
|
|
1575
1585
|
description: "Sparse fine grain",
|
|
1576
|
-
generate: (e, n) =>
|
|
1586
|
+
generate: (e, n) => hn(e, n, 25, N + 1)
|
|
1577
1587
|
},
|
|
1578
1588
|
{
|
|
1579
1589
|
id: "concrete",
|
|
@@ -1581,7 +1591,7 @@ const sa = [
|
|
|
1581
1591
|
textureUrl: "builtin:concrete",
|
|
1582
1592
|
thumbnailUrl: "",
|
|
1583
1593
|
description: "Rough surface via Perlin noise",
|
|
1584
|
-
generate: (e, n) =>
|
|
1594
|
+
generate: (e, n) => _n(e, n, 55, N + 2)
|
|
1585
1595
|
},
|
|
1586
1596
|
{
|
|
1587
1597
|
id: "paper",
|
|
@@ -1589,7 +1599,7 @@ const sa = [
|
|
|
1589
1599
|
textureUrl: "builtin:paper",
|
|
1590
1600
|
thumbnailUrl: "",
|
|
1591
1601
|
description: "Subtle aging",
|
|
1592
|
-
generate: (e, n) =>
|
|
1602
|
+
generate: (e, n) => _n(e, n, 20, N + 3)
|
|
1593
1603
|
},
|
|
1594
1604
|
{
|
|
1595
1605
|
id: "rust",
|
|
@@ -1598,8 +1608,8 @@ const sa = [
|
|
|
1598
1608
|
thumbnailUrl: "",
|
|
1599
1609
|
description: "Noise + splatter combined",
|
|
1600
1610
|
generate: (e, n) => {
|
|
1601
|
-
const t =
|
|
1602
|
-
return
|
|
1611
|
+
const t = _n(e, n, 45, N + 4), a = hn(e, n, 35, N + 5);
|
|
1612
|
+
return ca(Bn(t), Bn(a));
|
|
1603
1613
|
}
|
|
1604
1614
|
},
|
|
1605
1615
|
{
|
|
@@ -1608,7 +1618,7 @@ const sa = [
|
|
|
1608
1618
|
textureUrl: "builtin:scratches",
|
|
1609
1619
|
thumbnailUrl: "",
|
|
1610
1620
|
description: "Branching crack lines",
|
|
1611
|
-
generate: (e, n) =>
|
|
1621
|
+
generate: (e, n) => ia(e, n, 55, N + 6)
|
|
1612
1622
|
},
|
|
1613
1623
|
{
|
|
1614
1624
|
id: "halftone",
|
|
@@ -1616,7 +1626,7 @@ const sa = [
|
|
|
1616
1626
|
textureUrl: "builtin:halftone",
|
|
1617
1627
|
thumbnailUrl: "",
|
|
1618
1628
|
description: "Dot grid pattern",
|
|
1619
|
-
generate: (e, n) =>
|
|
1629
|
+
generate: (e, n) => oa(e, n, 55, N + 7)
|
|
1620
1630
|
},
|
|
1621
1631
|
{
|
|
1622
1632
|
id: "spray",
|
|
@@ -1624,132 +1634,132 @@ const sa = [
|
|
|
1624
1634
|
textureUrl: "builtin:spray",
|
|
1625
1635
|
thumbnailUrl: "",
|
|
1626
1636
|
description: "Medium random splatter",
|
|
1627
|
-
generate: (e, n) =>
|
|
1637
|
+
generate: (e, n) => hn(e, n, 55, N + 8)
|
|
1628
1638
|
}
|
|
1629
1639
|
];
|
|
1630
|
-
let
|
|
1631
|
-
function
|
|
1640
|
+
let se = !1;
|
|
1641
|
+
function da(e, n) {
|
|
1632
1642
|
if (typeof OffscreenCanvas < "u")
|
|
1633
1643
|
return new OffscreenCanvas(e, n);
|
|
1634
1644
|
const t = document.createElement("canvas");
|
|
1635
1645
|
return t.width = e, t.height = n, t;
|
|
1636
1646
|
}
|
|
1637
|
-
function
|
|
1647
|
+
function ie(e, n) {
|
|
1638
1648
|
if (typeof document > "u") return null;
|
|
1639
1649
|
const t = document.createElement("canvas");
|
|
1640
1650
|
return t.width = e, t.height = n, t;
|
|
1641
1651
|
}
|
|
1642
|
-
function
|
|
1643
|
-
const n =
|
|
1652
|
+
function fa(e) {
|
|
1653
|
+
const n = ie(e.width, e.height);
|
|
1644
1654
|
if (!n) return "";
|
|
1645
1655
|
const t = n.getContext("2d");
|
|
1646
1656
|
if (!t) return "";
|
|
1647
1657
|
t.putImageData(e, 0, 0);
|
|
1648
|
-
const a =
|
|
1658
|
+
const a = ie(K, K);
|
|
1649
1659
|
if (!a) return "";
|
|
1650
1660
|
const r = a.getContext("2d");
|
|
1651
1661
|
if (!r) return "";
|
|
1652
|
-
r.drawImage(n, 0, 0, e.width, e.height, 0, 0,
|
|
1653
|
-
const o = r.getImageData(0, 0,
|
|
1662
|
+
r.drawImage(n, 0, 0, e.width, e.height, 0, 0, K, K);
|
|
1663
|
+
const o = r.getImageData(0, 0, K, K), s = o.data;
|
|
1654
1664
|
for (let c = 0; c < s.length; c += 4) {
|
|
1655
1665
|
const i = s[c + 3], l = 255 - Math.round(i / 255 * 195);
|
|
1656
1666
|
s[c] = l, s[c + 1] = l, s[c + 2] = l, s[c + 3] = 255;
|
|
1657
1667
|
}
|
|
1658
1668
|
return r.putImageData(o, 0, 0), a.toDataURL("image/png");
|
|
1659
1669
|
}
|
|
1660
|
-
function
|
|
1661
|
-
if (!
|
|
1662
|
-
|
|
1663
|
-
for (const e of
|
|
1664
|
-
const n = e.generate(
|
|
1665
|
-
|
|
1666
|
-
const t =
|
|
1667
|
-
a && (a.putImageData(n, 0, 0),
|
|
1670
|
+
function ua() {
|
|
1671
|
+
if (!se) {
|
|
1672
|
+
se = !0;
|
|
1673
|
+
for (const e of la) {
|
|
1674
|
+
const n = e.generate(Y, Y);
|
|
1675
|
+
Bn(n);
|
|
1676
|
+
const t = da(Y, Y), a = t.getContext("2d");
|
|
1677
|
+
a && (a.putImageData(n, 0, 0), pa(e.textureUrl, t, Y, Y)), typeof document < "u" && (e.thumbnailUrl = fa(n));
|
|
1668
1678
|
}
|
|
1669
1679
|
}
|
|
1670
1680
|
}
|
|
1671
|
-
const
|
|
1672
|
-
function
|
|
1681
|
+
const z = /* @__PURE__ */ new Set(), G = /* @__PURE__ */ new Map(), gn = /* @__PURE__ */ new Map();
|
|
1682
|
+
function oe(e, n) {
|
|
1673
1683
|
if (typeof OffscreenCanvas < "u")
|
|
1674
1684
|
return new OffscreenCanvas(e, n);
|
|
1675
1685
|
const t = document.createElement("canvas");
|
|
1676
1686
|
return t.width = e, t.height = n, t;
|
|
1677
1687
|
}
|
|
1678
|
-
function
|
|
1688
|
+
function ce(e) {
|
|
1679
1689
|
return e.getContext("2d");
|
|
1680
1690
|
}
|
|
1681
|
-
function
|
|
1682
|
-
const { width: n, height: t } = e, a =
|
|
1691
|
+
function le(e) {
|
|
1692
|
+
const { width: n, height: t } = e, a = oe(n, t), r = ce(a);
|
|
1683
1693
|
if (!r) throw new Error("Failed to get 2d context for temp canvas");
|
|
1684
1694
|
r.drawImage(e, 0, 0);
|
|
1685
1695
|
const o = r.getImageData(0, 0, n, t), s = o.data;
|
|
1686
1696
|
for (let l = 0; l < s.length; l += 4) {
|
|
1687
|
-
const d = s[l], u = s[l + 1], p = s[l + 2],
|
|
1688
|
-
s[l] = 255, s[l + 1] = 255, s[l + 2] = 255, s[l + 3] =
|
|
1697
|
+
const d = s[l], u = s[l + 1], p = s[l + 2], $ = 255 - (0.299 * d + 0.587 * u + 0.114 * p);
|
|
1698
|
+
s[l] = 255, s[l + 1] = 255, s[l + 2] = 255, s[l + 3] = $;
|
|
1689
1699
|
}
|
|
1690
|
-
const c =
|
|
1700
|
+
const c = oe(n, t), i = ce(c);
|
|
1691
1701
|
if (!i) throw new Error("Failed to get 2d context for mask canvas");
|
|
1692
1702
|
return i.putImageData(o, 0, 0), { alphaMask: c, width: n, height: t };
|
|
1693
1703
|
}
|
|
1694
|
-
function
|
|
1704
|
+
function De(e) {
|
|
1695
1705
|
const n = G.get(e);
|
|
1696
1706
|
if (n) return n;
|
|
1697
1707
|
if (e.startsWith("builtin:")) {
|
|
1698
|
-
|
|
1708
|
+
ua();
|
|
1699
1709
|
const t = G.get(e);
|
|
1700
1710
|
return t || null;
|
|
1701
1711
|
}
|
|
1702
|
-
return
|
|
1712
|
+
return z.has(e) || (z.add(e), Fe(e)), null;
|
|
1703
1713
|
}
|
|
1704
|
-
function
|
|
1714
|
+
function Oa(e) {
|
|
1705
1715
|
return G.has(e) ? Promise.resolve() : new Promise((n) => {
|
|
1706
1716
|
if (G.has(e)) {
|
|
1707
1717
|
n();
|
|
1708
1718
|
return;
|
|
1709
1719
|
}
|
|
1710
|
-
const t =
|
|
1711
|
-
t.push(n),
|
|
1720
|
+
const t = gn.get(e) || [];
|
|
1721
|
+
t.push(n), gn.set(e, t), z.has(e) || (z.add(e), Fe(e));
|
|
1712
1722
|
});
|
|
1713
1723
|
}
|
|
1714
|
-
function
|
|
1715
|
-
G.has(e) || (G.set(e, { alphaMask: n, width: t, height: a }),
|
|
1724
|
+
function pa(e, n, t, a) {
|
|
1725
|
+
G.has(e) || (G.set(e, { alphaMask: n, width: t, height: a }), rn(e));
|
|
1716
1726
|
}
|
|
1717
|
-
function
|
|
1718
|
-
const n =
|
|
1719
|
-
n && (n.forEach((t) => t()),
|
|
1727
|
+
function rn(e) {
|
|
1728
|
+
const n = gn.get(e);
|
|
1729
|
+
n && (n.forEach((t) => t()), gn.delete(e));
|
|
1720
1730
|
}
|
|
1721
|
-
function
|
|
1731
|
+
function Fe(e) {
|
|
1722
1732
|
if (typeof document < "u") {
|
|
1723
1733
|
const n = new Image();
|
|
1724
1734
|
n.crossOrigin = "anonymous", n.onload = () => {
|
|
1725
|
-
const t =
|
|
1726
|
-
G.set(e, t),
|
|
1735
|
+
const t = le(n);
|
|
1736
|
+
G.set(e, t), z.delete(e), rn(e);
|
|
1727
1737
|
}, n.onerror = () => {
|
|
1728
|
-
|
|
1738
|
+
z.delete(e), rn(e);
|
|
1729
1739
|
}, n.src = e;
|
|
1730
1740
|
} else
|
|
1731
1741
|
fetch(e).then((n) => n.blob()).then((n) => createImageBitmap(n)).then((n) => {
|
|
1732
|
-
const t =
|
|
1733
|
-
G.set(e, t),
|
|
1742
|
+
const t = le(n);
|
|
1743
|
+
G.set(e, t), z.delete(e), rn(e);
|
|
1734
1744
|
}).catch(() => {
|
|
1735
|
-
|
|
1745
|
+
z.delete(e), rn(e);
|
|
1736
1746
|
});
|
|
1737
1747
|
}
|
|
1738
|
-
function
|
|
1748
|
+
function Me(e, n) {
|
|
1739
1749
|
if (typeof OffscreenCanvas < "u")
|
|
1740
1750
|
return new OffscreenCanvas(e, n);
|
|
1741
1751
|
const t = document.createElement("canvas");
|
|
1742
1752
|
return t.width = e, t.height = n, t;
|
|
1743
1753
|
}
|
|
1744
|
-
function
|
|
1754
|
+
function ha(e, n, t, a) {
|
|
1745
1755
|
if (!n.enabled || !n.textureUrl || n.intensity <= 0) return;
|
|
1746
|
-
const r =
|
|
1756
|
+
const r = De(n.textureUrl);
|
|
1747
1757
|
if (!r) return;
|
|
1748
|
-
const { x: o, y: s, width: c, height: i } = t, l = e.getTransform(), d = l.a * o + l.e, u = l.d * s + l.f, p = l.a * c, f = l.d * i,
|
|
1749
|
-
if (
|
|
1750
|
-
const
|
|
1751
|
-
if (!
|
|
1752
|
-
|
|
1758
|
+
const { x: o, y: s, width: c, height: i } = t, l = e.getTransform(), d = l.a * o + l.e, u = l.d * s + l.f, p = l.a * c, f = l.d * i, $ = Math.ceil(p), h = Math.ceil(f);
|
|
1759
|
+
if ($ <= 0 || h <= 0) return;
|
|
1760
|
+
const b = Me($, h), v = b.getContext("2d");
|
|
1761
|
+
if (!v) return;
|
|
1762
|
+
v.drawImage(
|
|
1753
1763
|
e.canvas,
|
|
1754
1764
|
d,
|
|
1755
1765
|
u,
|
|
@@ -1757,27 +1767,27 @@ function da(e, n, t, a) {
|
|
|
1757
1767
|
f,
|
|
1758
1768
|
0,
|
|
1759
1769
|
0,
|
|
1760
|
-
|
|
1761
|
-
|
|
1770
|
+
$,
|
|
1771
|
+
h
|
|
1762
1772
|
);
|
|
1763
|
-
const
|
|
1764
|
-
if (
|
|
1765
|
-
const
|
|
1766
|
-
for (let _ = 0; _ <
|
|
1767
|
-
const w = Math.floor(_ /
|
|
1768
|
-
for (let
|
|
1769
|
-
const
|
|
1770
|
-
|
|
1773
|
+
const y = r.alphaMask.getContext("2d");
|
|
1774
|
+
if (y) {
|
|
1775
|
+
const x = n.intensity / 100, m = y.getImageData(0, 0, r.width, r.height).data, g = r.width, C = r.height, T = v.getImageData(0, 0, $, h), k = T.data;
|
|
1776
|
+
for (let _ = 0; _ < h; _++) {
|
|
1777
|
+
const w = Math.floor(_ / h * C);
|
|
1778
|
+
for (let A = 0; A < $; A++) {
|
|
1779
|
+
const E = Math.floor(A / $ * g), S = m[(w * g + E) * 4 + 3] / 255, P = (_ * $ + A) * 4;
|
|
1780
|
+
k[P + 3] = Math.round(k[P + 3] * (1 - S * x));
|
|
1771
1781
|
}
|
|
1772
1782
|
}
|
|
1773
|
-
|
|
1783
|
+
v.putImageData(T, 0, 0);
|
|
1774
1784
|
} else
|
|
1775
|
-
|
|
1776
|
-
|
|
1785
|
+
v.globalCompositeOperation = "destination-out", v.globalAlpha = n.intensity / 100, v.drawImage(r.alphaMask, 0, 0, $, h), v.globalCompositeOperation = "source-over";
|
|
1786
|
+
v.globalAlpha = 1, e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.clearRect(d, u, p, f), a && (e.fillStyle = a, e.fillRect(d, u, p, f)), e.drawImage(b, d, u), e.restore();
|
|
1777
1787
|
}
|
|
1778
|
-
function
|
|
1788
|
+
function de(e, n, t, a) {
|
|
1779
1789
|
if (!n.enabled || n.style !== "custom" || !n.textureUrl) return;
|
|
1780
|
-
const r =
|
|
1790
|
+
const r = De(n.textureUrl);
|
|
1781
1791
|
if (!r) {
|
|
1782
1792
|
a(e);
|
|
1783
1793
|
return;
|
|
@@ -1787,40 +1797,40 @@ function ie(e, n, t, a) {
|
|
|
1787
1797
|
y: t.y - p,
|
|
1788
1798
|
width: t.width + u * 2,
|
|
1789
1799
|
height: t.height + p * 2
|
|
1790
|
-
},
|
|
1791
|
-
if (
|
|
1800
|
+
}, $ = s.a * f.x + s.e, h = s.d * f.y + s.f, b = s.a * f.width, v = s.d * f.height, y = Math.ceil(b), x = Math.ceil(v);
|
|
1801
|
+
if (y <= 0 || x <= 0) {
|
|
1792
1802
|
a(e);
|
|
1793
1803
|
return;
|
|
1794
1804
|
}
|
|
1795
|
-
const
|
|
1796
|
-
if (!
|
|
1805
|
+
const m = Me(y, x), g = m.getContext("2d");
|
|
1806
|
+
if (!g) {
|
|
1797
1807
|
a(e);
|
|
1798
1808
|
return;
|
|
1799
1809
|
}
|
|
1800
|
-
|
|
1810
|
+
g.setTransform(
|
|
1801
1811
|
s.a,
|
|
1802
1812
|
s.b,
|
|
1803
1813
|
s.c,
|
|
1804
1814
|
s.d,
|
|
1805
|
-
s.e -
|
|
1806
|
-
s.f -
|
|
1807
|
-
), a(
|
|
1808
|
-
const
|
|
1809
|
-
if (
|
|
1810
|
-
const T =
|
|
1811
|
-
for (let
|
|
1812
|
-
const
|
|
1813
|
-
for (let
|
|
1814
|
-
const
|
|
1815
|
-
|
|
1815
|
+
s.e - $,
|
|
1816
|
+
s.f - h
|
|
1817
|
+
), a(g), g.setTransform(1, 0, 0, 1, 0, 0);
|
|
1818
|
+
const C = r.alphaMask.getContext("2d");
|
|
1819
|
+
if (C) {
|
|
1820
|
+
const T = C.getImageData(0, 0, r.width, r.height).data, k = r.width, _ = r.height, w = g.getImageData(0, 0, y, x), A = w.data;
|
|
1821
|
+
for (let E = 0; E < x; E++) {
|
|
1822
|
+
const S = Math.floor(E / x * _);
|
|
1823
|
+
for (let P = 0; P < y; P++) {
|
|
1824
|
+
const I = Math.floor(P / y * k), D = T[(S * k + I) * 4 + 3] / 255, F = (E * y + P) * 4;
|
|
1825
|
+
A[F + 3] = Math.round(A[F + 3] * (1 - D * o));
|
|
1816
1826
|
}
|
|
1817
1827
|
}
|
|
1818
|
-
|
|
1828
|
+
g.putImageData(w, 0, 0);
|
|
1819
1829
|
} else
|
|
1820
|
-
|
|
1821
|
-
e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.drawImage(
|
|
1830
|
+
g.globalCompositeOperation = "destination-out", g.globalAlpha = o, g.drawImage(r.alphaMask, 0, 0, y, x), g.globalCompositeOperation = "source-over", g.globalAlpha = 1;
|
|
1831
|
+
e.save(), e.setTransform(1, 0, 0, 1, 0, 0), e.drawImage(m, $, h), e.restore();
|
|
1822
1832
|
}
|
|
1823
|
-
class
|
|
1833
|
+
class mn {
|
|
1824
1834
|
/**
|
|
1825
1835
|
* Create an element instance from a JSON configuration
|
|
1826
1836
|
* TypeScript ensures all transform types are handled
|
|
@@ -1833,33 +1843,33 @@ class bn {
|
|
|
1833
1843
|
const { transformType: t } = n;
|
|
1834
1844
|
switch (t) {
|
|
1835
1845
|
case "custom":
|
|
1836
|
-
return new
|
|
1846
|
+
return new nt(n);
|
|
1837
1847
|
case "distort":
|
|
1838
1848
|
throw new Error("DistortTransform is not yet implemented");
|
|
1839
1849
|
case "circle":
|
|
1840
|
-
return new
|
|
1850
|
+
return new Qe(n);
|
|
1841
1851
|
case "lean":
|
|
1842
|
-
return new
|
|
1852
|
+
return new Ze(n);
|
|
1843
1853
|
case "arch":
|
|
1844
|
-
return new
|
|
1854
|
+
return new Je(n);
|
|
1845
1855
|
case "ascend":
|
|
1846
|
-
return new
|
|
1856
|
+
return new Ke(n);
|
|
1847
1857
|
case "wave":
|
|
1848
|
-
return new
|
|
1858
|
+
return new Ye(n);
|
|
1849
1859
|
case "flag":
|
|
1850
|
-
return new
|
|
1860
|
+
return new Xe(n);
|
|
1851
1861
|
case "image":
|
|
1852
|
-
return new
|
|
1862
|
+
return new En(n);
|
|
1853
1863
|
case "group": {
|
|
1854
1864
|
const r = (n.children || []).map(
|
|
1855
|
-
(i) =>
|
|
1856
|
-
), { children: o, ...s } = n, c = new
|
|
1865
|
+
(i) => mn.createFromJSON(i)
|
|
1866
|
+
), { children: o, ...s } = n, c = new me(s);
|
|
1857
1867
|
return r.forEach((i) => c.addChild(i)), c;
|
|
1858
1868
|
}
|
|
1859
1869
|
case "shape":
|
|
1860
|
-
return new
|
|
1870
|
+
return new qe(n);
|
|
1861
1871
|
case "path":
|
|
1862
|
-
return new
|
|
1872
|
+
return new je(n);
|
|
1863
1873
|
default:
|
|
1864
1874
|
const a = t;
|
|
1865
1875
|
throw new Error(`Unknown transform type: ${a}`);
|
|
@@ -2073,7 +2083,7 @@ class bn {
|
|
|
2073
2083
|
return this.createFromJSON(t);
|
|
2074
2084
|
}
|
|
2075
2085
|
}
|
|
2076
|
-
const
|
|
2086
|
+
const fe = U("ImportManager"), qn = class qn {
|
|
2077
2087
|
/**
|
|
2078
2088
|
* Import workspace from JSON file
|
|
2079
2089
|
*/
|
|
@@ -2088,7 +2098,7 @@ const oe = N("ImportManager"), Gn = class Gn {
|
|
|
2088
2098
|
return this.migrateV1Document(a);
|
|
2089
2099
|
const r = [], o = [];
|
|
2090
2100
|
return a.artboards.forEach((s) => {
|
|
2091
|
-
const c =
|
|
2101
|
+
const c = Yn.fromJSON({
|
|
2092
2102
|
id: s.id,
|
|
2093
2103
|
name: s.name,
|
|
2094
2104
|
x: s.x,
|
|
@@ -2099,9 +2109,9 @@ const oe = N("ImportManager"), Gn = class Gn {
|
|
|
2099
2109
|
elementIds: s.elements.map((l) => l.id || "")
|
|
2100
2110
|
}), i = s.elements.map((l) => {
|
|
2101
2111
|
try {
|
|
2102
|
-
return
|
|
2112
|
+
return mn.createFromJSON(l);
|
|
2103
2113
|
} catch (d) {
|
|
2104
|
-
return
|
|
2114
|
+
return fe.error("Failed to create element:", l, d), null;
|
|
2105
2115
|
}
|
|
2106
2116
|
}).filter((l) => l !== null);
|
|
2107
2117
|
r.push(c), o.push(...i);
|
|
@@ -2124,7 +2134,7 @@ const oe = N("ImportManager"), Gn = class Gn {
|
|
|
2124
2134
|
static async migrateV1Document(n) {
|
|
2125
2135
|
var t, a, r;
|
|
2126
2136
|
try {
|
|
2127
|
-
const o = n.elements || [], s = new
|
|
2137
|
+
const o = n.elements || [], s = new Yn({
|
|
2128
2138
|
id: "artboard-migrated",
|
|
2129
2139
|
name: "Artboard 1",
|
|
2130
2140
|
x: 0,
|
|
@@ -2134,9 +2144,9 @@ const oe = N("ImportManager"), Gn = class Gn {
|
|
|
2134
2144
|
backgroundColor: ((r = n.canvas) == null ? void 0 : r.backgroundColor) || "#ffffff"
|
|
2135
2145
|
}), c = o.map((i) => {
|
|
2136
2146
|
try {
|
|
2137
|
-
return
|
|
2147
|
+
return mn.createFromJSON(i);
|
|
2138
2148
|
} catch (l) {
|
|
2139
|
-
return
|
|
2149
|
+
return fe.error("Failed to create element:", i, l), null;
|
|
2140
2150
|
}
|
|
2141
2151
|
}).filter((i) => i !== null);
|
|
2142
2152
|
return c.forEach((i) => {
|
|
@@ -2287,14 +2297,14 @@ const oe = N("ImportManager"), Gn = class Gn {
|
|
|
2287
2297
|
await Promise.all(r);
|
|
2288
2298
|
}
|
|
2289
2299
|
};
|
|
2290
|
-
|
|
2291
|
-
let
|
|
2292
|
-
const
|
|
2293
|
-
function
|
|
2294
|
-
const t = n ?
|
|
2300
|
+
qn.SUPPORTED_VERSIONS = ["1.0.0", "2.0.0"];
|
|
2301
|
+
let ue = qn;
|
|
2302
|
+
const pe = U("element-serializer"), Oe = 4e3, fn = /* @__PURE__ */ new Set();
|
|
2303
|
+
function ba(e, n) {
|
|
2304
|
+
const t = n ? ga(n) : "no-src";
|
|
2295
2305
|
return `${e}:${t}`;
|
|
2296
2306
|
}
|
|
2297
|
-
function
|
|
2307
|
+
function ga(e) {
|
|
2298
2308
|
let n = 0;
|
|
2299
2309
|
for (let t = 0; t < e.length; t++) {
|
|
2300
2310
|
const a = e.charCodeAt(t);
|
|
@@ -2302,20 +2312,20 @@ function ua(e) {
|
|
|
2302
2312
|
}
|
|
2303
2313
|
return n.toString(36);
|
|
2304
2314
|
}
|
|
2305
|
-
function
|
|
2306
|
-
|
|
2315
|
+
function Ln() {
|
|
2316
|
+
fn.clear();
|
|
2307
2317
|
}
|
|
2308
|
-
function
|
|
2309
|
-
for (const n of
|
|
2310
|
-
n.startsWith(`${e}:`) &&
|
|
2318
|
+
function Re(e) {
|
|
2319
|
+
for (const n of fn)
|
|
2320
|
+
n.startsWith(`${e}:`) && fn.delete(n);
|
|
2311
2321
|
}
|
|
2312
|
-
function
|
|
2313
|
-
|
|
2322
|
+
function ma(e) {
|
|
2323
|
+
fn.add(e);
|
|
2314
2324
|
}
|
|
2315
|
-
function
|
|
2316
|
-
return
|
|
2325
|
+
function ya(e) {
|
|
2326
|
+
return fn.has(e);
|
|
2317
2327
|
}
|
|
2318
|
-
async function
|
|
2328
|
+
async function $a(e, n = Oe) {
|
|
2319
2329
|
const { naturalWidth: t, naturalHeight: a } = e;
|
|
2320
2330
|
if (t <= n && a <= n)
|
|
2321
2331
|
return createImageBitmap(e);
|
|
@@ -2326,20 +2336,20 @@ async function ba(e, n = Ie) {
|
|
|
2326
2336
|
resizeQuality: "high"
|
|
2327
2337
|
});
|
|
2328
2338
|
}
|
|
2329
|
-
let
|
|
2330
|
-
function
|
|
2331
|
-
|
|
2339
|
+
let yn = null, $n = null;
|
|
2340
|
+
function xa(e, n) {
|
|
2341
|
+
yn = e, $n = n;
|
|
2332
2342
|
}
|
|
2333
|
-
function
|
|
2334
|
-
|
|
2343
|
+
function va() {
|
|
2344
|
+
yn = null, $n = null;
|
|
2335
2345
|
}
|
|
2336
|
-
function
|
|
2337
|
-
|
|
2346
|
+
function Ra() {
|
|
2347
|
+
Ln(), yn && yn();
|
|
2338
2348
|
}
|
|
2339
|
-
function
|
|
2340
|
-
|
|
2349
|
+
function Ba(e) {
|
|
2350
|
+
Re(e), $n && $n(e);
|
|
2341
2351
|
}
|
|
2342
|
-
function
|
|
2352
|
+
function Nn(e, n) {
|
|
2343
2353
|
const t = e;
|
|
2344
2354
|
if (typeof t.fontFamily == "string" && n.add(t.fontFamily), t.richText && typeof t.richText == "object") {
|
|
2345
2355
|
const a = t.richText;
|
|
@@ -2354,14 +2364,14 @@ function Rn(e, n) {
|
|
|
2354
2364
|
}
|
|
2355
2365
|
if (t.children && Array.isArray(t.children))
|
|
2356
2366
|
for (const a of t.children)
|
|
2357
|
-
|
|
2367
|
+
Nn(a, n);
|
|
2358
2368
|
if (e.masks && Array.isArray(e.masks))
|
|
2359
2369
|
for (const a of e.masks)
|
|
2360
|
-
a.maskElement &&
|
|
2370
|
+
a.maskElement && Nn(a.maskElement, n);
|
|
2361
2371
|
}
|
|
2362
|
-
function
|
|
2372
|
+
function he(e) {
|
|
2363
2373
|
if (typeof document > "u") return e;
|
|
2364
|
-
const n =
|
|
2374
|
+
const n = vn.getInstance();
|
|
2365
2375
|
return e.map((t) => {
|
|
2366
2376
|
if (!(t != null && t.maskElement) || t.maskElement.transformType !== "image") return t;
|
|
2367
2377
|
const a = t.maskElement.imageUrl;
|
|
@@ -2377,41 +2387,41 @@ function de(e) {
|
|
|
2377
2387
|
} : t;
|
|
2378
2388
|
});
|
|
2379
2389
|
}
|
|
2380
|
-
async function
|
|
2390
|
+
async function be(e, n, t = Oe) {
|
|
2381
2391
|
const a = n.filter((i) => e.hasElementId(i.id)), r = [], o = [], s = /* @__PURE__ */ new Set();
|
|
2382
2392
|
for (const i of a) {
|
|
2383
2393
|
const l = i.toJSON();
|
|
2384
|
-
if (
|
|
2385
|
-
|
|
2394
|
+
if (Nn(l, s), i instanceof En && !i.imageElement) {
|
|
2395
|
+
pe.warn(`[element-serializer] Skipping image ${i.id}: image not loaded (state: ${i.imageLoadState})`);
|
|
2386
2396
|
continue;
|
|
2387
2397
|
}
|
|
2388
|
-
if (i instanceof
|
|
2398
|
+
if (i instanceof En && i.imageElement)
|
|
2389
2399
|
try {
|
|
2390
|
-
const d =
|
|
2391
|
-
if (!
|
|
2392
|
-
const
|
|
2393
|
-
o.push({ cacheKey: d, bitmap:
|
|
2400
|
+
const d = ba(i.id, i.imageUrl);
|
|
2401
|
+
if (!ya(d)) {
|
|
2402
|
+
const x = await $a(i.imageElement, t);
|
|
2403
|
+
o.push({ cacheKey: d, bitmap: x }), ma(d);
|
|
2394
2404
|
}
|
|
2395
|
-
const p = i.transformData || {}, f = l.masks && l.masks.length > 0,
|
|
2405
|
+
const p = i.transformData || {}, f = l.masks && l.masks.length > 0, $ = f ? p.width : p.width * (p.cropWidth ?? 1), h = f ? p.height : p.height * (p.cropHeight ?? 1), b = {
|
|
2396
2406
|
id: i.id,
|
|
2397
2407
|
type: "image",
|
|
2398
2408
|
x: i.x,
|
|
2399
2409
|
y: i.y,
|
|
2400
|
-
width:
|
|
2401
|
-
height:
|
|
2410
|
+
width: $,
|
|
2411
|
+
height: h,
|
|
2402
2412
|
rotation: i.rotation || 0,
|
|
2403
2413
|
bitmapCacheKey: d
|
|
2404
2414
|
};
|
|
2405
2415
|
if (!f && (p.cropX !== 0 || p.cropY !== 0 || p.cropWidth !== 1 || p.cropHeight !== 1)) {
|
|
2406
|
-
const
|
|
2407
|
-
let
|
|
2408
|
-
(
|
|
2416
|
+
const x = i.imageElement.naturalWidth, m = i.imageElement.naturalHeight;
|
|
2417
|
+
let g = 1;
|
|
2418
|
+
(x > t || m > t) && (g = t / Math.max(x, m)), b.cropX = p.cropX * x * g, b.cropY = p.cropY * m * g, b.cropWidth = p.cropWidth * x * g, b.cropHeight = p.cropHeight * m * g;
|
|
2409
2419
|
}
|
|
2410
|
-
p.flipHorizontal && (
|
|
2411
|
-
const
|
|
2412
|
-
i.distressEffect && (
|
|
2420
|
+
p.flipHorizontal && (b.flipHorizontal = p.flipHorizontal), p.flipVertical && (b.flipVertical = p.flipVertical), p.borderRadius && (b.borderRadius = p.borderRadius), i.opacity !== void 0 && (b.opacity = i.opacity);
|
|
2421
|
+
const y = b;
|
|
2422
|
+
i.distressEffect && (y.distressEffect = { ...i.distressEffect }), l.masks && l.masks.length > 0 && (y.masks = he(l.masks)), l.blendMode && (y.blendMode = l.blendMode), l.knockoutParts && (y.knockoutParts = l.knockoutParts), "getVisualBoundingBox" in i && typeof i.getVisualBoundingBox == "function" ? y._boundingBox = i.getVisualBoundingBox() : "getBoundingBox" in i && typeof i.getBoundingBox == "function" && (y._boundingBox = i.getBoundingBox()), r.push(y);
|
|
2413
2423
|
} catch (d) {
|
|
2414
|
-
|
|
2424
|
+
pe.error(`[element-serializer] Failed to create ImageBitmap for ${l.id}:`, d);
|
|
2415
2425
|
}
|
|
2416
2426
|
else {
|
|
2417
2427
|
const d = {
|
|
@@ -2419,7 +2429,7 @@ async function fe(e, n, t = Ie) {
|
|
|
2419
2429
|
type: l.transformType
|
|
2420
2430
|
// Map transformType to type for worker compatibility
|
|
2421
2431
|
};
|
|
2422
|
-
d.masks && Array.isArray(d.masks) && d.masks.length > 0 && (d.masks =
|
|
2432
|
+
d.masks && Array.isArray(d.masks) && d.masks.length > 0 && (d.masks = he(d.masks)), "getVisualBoundingBox" in i && typeof i.getVisualBoundingBox == "function" ? d._boundingBox = i.getVisualBoundingBox() : "getBoundingBox" in i && typeof i.getBoundingBox == "function" && (d._boundingBox = i.getBoundingBox()), r.push(d);
|
|
2423
2433
|
}
|
|
2424
2434
|
}
|
|
2425
2435
|
const c = Array.from(s);
|
|
@@ -2444,7 +2454,7 @@ async function fe(e, n, t = Ie) {
|
|
|
2444
2454
|
newBitmaps: o
|
|
2445
2455
|
};
|
|
2446
2456
|
}
|
|
2447
|
-
const
|
|
2457
|
+
const wa = `"use strict";
|
|
2448
2458
|
(() => {
|
|
2449
2459
|
var __create = Object.create;
|
|
2450
2460
|
var __defProp = Object.defineProperty;
|
|
@@ -21839,7 +21849,7 @@ const ya = `"use strict";
|
|
|
21839
21849
|
* Check if two styles are equal
|
|
21840
21850
|
*/
|
|
21841
21851
|
stylesEqual(a, b) {
|
|
21842
|
-
return a.color === b.color && a.fontFamily === b.fontFamily && a.fontSize === b.fontSize && a.bold === b.bold && a.italic === b.italic && a.underline === b.underline && a.strikethrough === b.strikethrough;
|
|
21852
|
+
return a.color === b.color && a.fontFamily === b.fontFamily && a.fontSize === b.fontSize && a.bold === b.bold && a.italic === b.italic && a.underline === b.underline && a.strikethrough === b.strikethrough && a.letterSpacing === b.letterSpacing;
|
|
21843
21853
|
}
|
|
21844
21854
|
/**
|
|
21845
21855
|
* Clone this RichText instance
|
|
@@ -22199,6 +22209,58 @@ const ya = `"use strict";
|
|
|
22199
22209
|
ctx.restore();
|
|
22200
22210
|
}
|
|
22201
22211
|
|
|
22212
|
+
// src/core/text-spacing.ts
|
|
22213
|
+
function countSpacedChars(text) {
|
|
22214
|
+
return Array.from(text).length;
|
|
22215
|
+
}
|
|
22216
|
+
function spacedTextWidth(rawWidth, text, letterSpacing) {
|
|
22217
|
+
if (!letterSpacing) return rawWidth;
|
|
22218
|
+
return rawWidth + letterSpacing * countSpacedChars(text);
|
|
22219
|
+
}
|
|
22220
|
+
function getSpacedCharOffsets(ctx, text, letterSpacing) {
|
|
22221
|
+
const chars = Array.from(text);
|
|
22222
|
+
const offsets = [0];
|
|
22223
|
+
let prefix = "";
|
|
22224
|
+
for (let i = 0; i < chars.length; i++) {
|
|
22225
|
+
prefix += chars[i];
|
|
22226
|
+
offsets.push(ctx.measureText(prefix).width + letterSpacing * (i + 1));
|
|
22227
|
+
}
|
|
22228
|
+
return offsets;
|
|
22229
|
+
}
|
|
22230
|
+
function leftAnchoredStartX(ctx, x, totalWidth) {
|
|
22231
|
+
switch (ctx.textAlign) {
|
|
22232
|
+
case "center":
|
|
22233
|
+
return x - totalWidth / 2;
|
|
22234
|
+
case "right":
|
|
22235
|
+
case "end":
|
|
22236
|
+
return x - totalWidth;
|
|
22237
|
+
default:
|
|
22238
|
+
return x;
|
|
22239
|
+
}
|
|
22240
|
+
}
|
|
22241
|
+
function drawTextWithSpacing(op, ctx, text, x, y, letterSpacing) {
|
|
22242
|
+
if (!letterSpacing || text.length === 0) {
|
|
22243
|
+
ctx[op](text, x, y);
|
|
22244
|
+
return;
|
|
22245
|
+
}
|
|
22246
|
+
const offsets = getSpacedCharOffsets(ctx, text, letterSpacing);
|
|
22247
|
+
const totalWidth = offsets[offsets.length - 1];
|
|
22248
|
+
const startX = leftAnchoredStartX(ctx, x, totalWidth);
|
|
22249
|
+
const previousAlign = ctx.textAlign;
|
|
22250
|
+
ctx.textAlign = "left";
|
|
22251
|
+
const chars = Array.from(text);
|
|
22252
|
+
for (let i = 0; i < chars.length; i++) {
|
|
22253
|
+
ctx[op](chars[i], startX + offsets[i], y);
|
|
22254
|
+
}
|
|
22255
|
+
ctx.textAlign = previousAlign;
|
|
22256
|
+
}
|
|
22257
|
+
function fillTextWithSpacing(ctx, text, x, y, letterSpacing) {
|
|
22258
|
+
drawTextWithSpacing("fillText", ctx, text, x, y, letterSpacing);
|
|
22259
|
+
}
|
|
22260
|
+
function strokeTextWithSpacing(ctx, text, x, y, letterSpacing) {
|
|
22261
|
+
drawTextWithSpacing("strokeText", ctx, text, x, y, letterSpacing);
|
|
22262
|
+
}
|
|
22263
|
+
|
|
22202
22264
|
// src/core/TextMetrics.ts
|
|
22203
22265
|
var _measureCanvas = null;
|
|
22204
22266
|
function getMeasureCanvas() {
|
|
@@ -22225,10 +22287,12 @@ const ya = `"use strict";
|
|
|
22225
22287
|
parts.push(fontFamily);
|
|
22226
22288
|
return parts.join(" ");
|
|
22227
22289
|
}
|
|
22228
|
-
function wrapText(text, maxWidth, fontSize, fontFamily, bold = false, italic = false, lockedLineCount, strict = false) {
|
|
22290
|
+
function wrapText(text, maxWidth, fontSize, fontFamily, bold = false, italic = false, lockedLineCount, strict = false, opts) {
|
|
22229
22291
|
const canvas = getMeasureCanvas();
|
|
22230
22292
|
const ctx = canvas.getContext("2d");
|
|
22231
22293
|
ctx.font = buildFontString2(fontSize, fontFamily, bold, italic);
|
|
22294
|
+
const letterSpacing = opts?.letterSpacing ?? 0;
|
|
22295
|
+
const measure = (t) => spacedTextWidth(ctx.measureText(t).width, t, letterSpacing);
|
|
22232
22296
|
if (text.trim().length === 0) {
|
|
22233
22297
|
return [text];
|
|
22234
22298
|
}
|
|
@@ -22237,7 +22301,7 @@ const ya = `"use strict";
|
|
|
22237
22301
|
const allWrappedLines = [];
|
|
22238
22302
|
for (let i = 0; i < explicitLines.length; i++) {
|
|
22239
22303
|
const line = explicitLines[i];
|
|
22240
|
-
const wrappedLine = wrapText(line, maxWidth, fontSize, fontFamily, bold, italic, void 0, strict);
|
|
22304
|
+
const wrappedLine = wrapText(line, maxWidth, fontSize, fontFamily, bold, italic, void 0, strict, opts);
|
|
22241
22305
|
allWrappedLines.push(...wrappedLine);
|
|
22242
22306
|
}
|
|
22243
22307
|
return allWrappedLines;
|
|
@@ -22266,7 +22330,7 @@ const ya = `"use strict";
|
|
|
22266
22330
|
}
|
|
22267
22331
|
const allText = words.join(" ");
|
|
22268
22332
|
const allTextWithSpaces = leadingSpaces + allText + trailingSpaces;
|
|
22269
|
-
const allTextWidth =
|
|
22333
|
+
const allTextWidth = measure(allTextWithSpaces);
|
|
22270
22334
|
const isSmallSize = maxWidth < 200;
|
|
22271
22335
|
const wrapTolerancePercent = strict ? 0 : isSmallSize ? 0.08 : 0.05;
|
|
22272
22336
|
const wrapTolerance = strict ? 0 : Math.max(20, maxWidth * wrapTolerancePercent);
|
|
@@ -22279,7 +22343,7 @@ const ya = `"use strict";
|
|
|
22279
22343
|
const lineTolerance = strict ? 0 : Math.max(15, maxWidth * lineTolerancePercent);
|
|
22280
22344
|
for (let i = 0; i < words.length; i++) {
|
|
22281
22345
|
const word = words[i];
|
|
22282
|
-
const wordWidth =
|
|
22346
|
+
const wordWidth = measure(word);
|
|
22283
22347
|
if (wordWidth > maxWidth + lineTolerance) {
|
|
22284
22348
|
if (currentLine.length > 0) {
|
|
22285
22349
|
lines.push(currentLine);
|
|
@@ -22289,7 +22353,7 @@ const ya = `"use strict";
|
|
|
22289
22353
|
let charBuffer = "";
|
|
22290
22354
|
for (const char of chars) {
|
|
22291
22355
|
const testBuffer = charBuffer + char;
|
|
22292
|
-
const bufferWidth =
|
|
22356
|
+
const bufferWidth = measure(testBuffer);
|
|
22293
22357
|
if (bufferWidth > maxWidth + lineTolerance && charBuffer.length > 0) {
|
|
22294
22358
|
lines.push(charBuffer);
|
|
22295
22359
|
charBuffer = char;
|
|
@@ -22300,8 +22364,8 @@ const ya = `"use strict";
|
|
|
22300
22364
|
currentLine = charBuffer;
|
|
22301
22365
|
} else {
|
|
22302
22366
|
const testLine = currentLine.length > 0 ? currentLine + " " + word : word;
|
|
22303
|
-
const
|
|
22304
|
-
if (
|
|
22367
|
+
const testLineWidth = measure(testLine);
|
|
22368
|
+
if (testLineWidth > maxWidth + lineTolerance && currentLine.length > 0) {
|
|
22305
22369
|
lines.push(currentLine);
|
|
22306
22370
|
currentLine = word;
|
|
22307
22371
|
} else {
|
|
@@ -22315,7 +22379,7 @@ const ya = `"use strict";
|
|
|
22315
22379
|
if (lines.length > 0) {
|
|
22316
22380
|
if (leadingSpaces.length > 0) {
|
|
22317
22381
|
const firstLineWithSpace = leadingSpaces + lines[0];
|
|
22318
|
-
const firstLineWidth =
|
|
22382
|
+
const firstLineWidth = measure(firstLineWithSpace);
|
|
22319
22383
|
if (firstLineWidth > maxWidth + lineTolerance) {
|
|
22320
22384
|
lines.unshift(leadingSpaces);
|
|
22321
22385
|
} else {
|
|
@@ -22325,7 +22389,7 @@ const ya = `"use strict";
|
|
|
22325
22389
|
if (trailingSpaces.length > 0) {
|
|
22326
22390
|
const lastIdx = lines.length - 1;
|
|
22327
22391
|
const lastLineWithSpace = lines[lastIdx] + trailingSpaces;
|
|
22328
|
-
const lastLineWidth =
|
|
22392
|
+
const lastLineWidth = measure(lastLineWithSpace);
|
|
22329
22393
|
if (lastLineWidth > maxWidth + lineTolerance) {
|
|
22330
22394
|
lines.push(trailingSpaces);
|
|
22331
22395
|
} else {
|
|
@@ -22346,8 +22410,9 @@ const ya = `"use strict";
|
|
|
22346
22410
|
const height = ascent + descent;
|
|
22347
22411
|
return { ascent, descent, height };
|
|
22348
22412
|
}
|
|
22349
|
-
function calculateVisualBoundsWithSpaceCollapsing(text, maxWidth, fontSize, fontFamily, bold = false, italic = false, lockedLineCount, strict = false) {
|
|
22350
|
-
const
|
|
22413
|
+
function calculateVisualBoundsWithSpaceCollapsing(text, maxWidth, fontSize, fontFamily, bold = false, italic = false, lockedLineCount, strict = false, opts) {
|
|
22414
|
+
const letterSpacing = opts?.letterSpacing ?? 0;
|
|
22415
|
+
const lines = wrapText(text, maxWidth, fontSize, fontFamily, bold, italic, lockedLineCount, strict, opts);
|
|
22351
22416
|
const hasExplicitNewlines = text.includes("\\n");
|
|
22352
22417
|
const paragraphMetadata = lines.map((_, index) => ({
|
|
22353
22418
|
isParagraphStart: !hasExplicitNewlines && index === 0,
|
|
@@ -22381,12 +22446,12 @@ const ya = `"use strict";
|
|
|
22381
22446
|
totalLineCount++;
|
|
22382
22447
|
if (visibleText.length > 0) {
|
|
22383
22448
|
visibleLines.push(visibleText);
|
|
22384
|
-
const lineWidth = ctx.measureText(visibleText).width;
|
|
22449
|
+
const lineWidth = spacedTextWidth(ctx.measureText(visibleText).width, visibleText, letterSpacing);
|
|
22385
22450
|
maxLineWidth = Math.max(maxLineWidth, lineWidth);
|
|
22386
22451
|
}
|
|
22387
22452
|
});
|
|
22388
22453
|
let height;
|
|
22389
|
-
const lineHeight = LINE_HEIGHT_MULTIPLIER;
|
|
22454
|
+
const lineHeight = opts?.lineHeight ?? LINE_HEIGHT_MULTIPLIER;
|
|
22390
22455
|
if (totalLineCount === 1) {
|
|
22391
22456
|
height = fontMetrics.height;
|
|
22392
22457
|
} else if (totalLineCount === 0) {
|
|
@@ -22566,6 +22631,7 @@ const ya = `"use strict";
|
|
|
22566
22631
|
const transformData = element.transformData;
|
|
22567
22632
|
const width = transformData?.width ?? 200;
|
|
22568
22633
|
const availableWidth = width - HORIZONTAL_PADDING * 2;
|
|
22634
|
+
const letterSpacing = textElement.letterSpacing ?? 0;
|
|
22569
22635
|
const { lines, height: visualHeight } = calculateVisualBoundsWithSpaceCollapsing(
|
|
22570
22636
|
text,
|
|
22571
22637
|
availableWidth,
|
|
@@ -22575,12 +22641,13 @@ const ya = `"use strict";
|
|
|
22575
22641
|
italic,
|
|
22576
22642
|
void 0,
|
|
22577
22643
|
// No locked line count for stroke
|
|
22578
|
-
true
|
|
22644
|
+
true,
|
|
22579
22645
|
// strict: wrap exactly at maxWidth
|
|
22646
|
+
{ letterSpacing, lineHeight: textElement.lineHeight }
|
|
22580
22647
|
);
|
|
22581
22648
|
const topLeftX = -width / 2;
|
|
22582
22649
|
const topLeftY = -visualHeight / 2;
|
|
22583
|
-
const lineSpacing = fontSize * LINE_HEIGHT_MULTIPLIER;
|
|
22650
|
+
const lineSpacing = fontSize * (textElement.lineHeight ?? LINE_HEIGHT_MULTIPLIER);
|
|
22584
22651
|
lines.forEach((line, index) => {
|
|
22585
22652
|
const isParagraphStart = index === 0;
|
|
22586
22653
|
const isParagraphEnd = index === lines.length - 1;
|
|
@@ -22606,7 +22673,7 @@ const ya = `"use strict";
|
|
|
22606
22673
|
xPos = topLeftX + width - HORIZONTAL_PADDING;
|
|
22607
22674
|
}
|
|
22608
22675
|
const yPos = topLeftY + fontMetrics.ascent + index * lineSpacing;
|
|
22609
|
-
ctx
|
|
22676
|
+
strokeTextWithSpacing(ctx, visibleText, xPos, yPos, letterSpacing);
|
|
22610
22677
|
});
|
|
22611
22678
|
} else {
|
|
22612
22679
|
const visualHeight = fontMetrics.height;
|
|
@@ -23345,11 +23412,12 @@ const ya = `"use strict";
|
|
|
23345
23412
|
const fontFamily = style.fontFamily || element.fontFamily;
|
|
23346
23413
|
const bold = style.bold !== void 0 ? style.bold : element.bold || false;
|
|
23347
23414
|
const italic = style.italic !== void 0 ? style.italic : element.italic || false;
|
|
23415
|
+
const letterSpacing = style.letterSpacing !== void 0 ? style.letterSpacing : element.letterSpacing ?? 0;
|
|
23348
23416
|
ctx.font = buildFontString2(fontSize, fontFamily, bold, italic);
|
|
23349
|
-
return ctx.measureText(text).width;
|
|
23417
|
+
return spacedTextWidth(ctx.measureText(text).width, text, letterSpacing);
|
|
23350
23418
|
};
|
|
23351
23419
|
const stylesMatch = (s1, s2) => {
|
|
23352
|
-
return s1.fontSize === s2.fontSize && s1.fontFamily === s2.fontFamily && s1.color === s2.color && s1.bold === s2.bold && s1.italic === s2.italic && s1.underline === s2.underline && s1.strikethrough === s2.strikethrough;
|
|
23420
|
+
return s1.fontSize === s2.fontSize && s1.fontFamily === s2.fontFamily && s1.color === s2.color && s1.bold === s2.bold && s1.italic === s2.italic && s1.underline === s2.underline && s1.strikethrough === s2.strikethrough && s1.letterSpacing === s2.letterSpacing;
|
|
23353
23421
|
};
|
|
23354
23422
|
const mergedSpans = [];
|
|
23355
23423
|
spans.forEach((span) => {
|
|
@@ -23523,6 +23591,7 @@ const ya = `"use strict";
|
|
|
23523
23591
|
function renderRichTextFillOnly(ctx, richText, element, maxWidth, lockedLineCount) {
|
|
23524
23592
|
ctx.fillStyle = element.color;
|
|
23525
23593
|
const textAlign = element.textAlign || "center";
|
|
23594
|
+
const resolveSpacing = (style) => style.letterSpacing !== void 0 ? style.letterSpacing : element.letterSpacing ?? 0;
|
|
23526
23595
|
const explicitLines = splitRichTextIntoLines(richText);
|
|
23527
23596
|
let lines;
|
|
23528
23597
|
let paragraphMetadata;
|
|
@@ -23561,7 +23630,7 @@ const ya = `"use strict";
|
|
|
23561
23630
|
const bold = span.style.bold !== void 0 ? span.style.bold : element.bold || false;
|
|
23562
23631
|
const italic = span.style.italic !== void 0 ? span.style.italic : element.italic || false;
|
|
23563
23632
|
ctx.font = buildFontString(fontSize, fontFamily, bold, italic);
|
|
23564
|
-
const width = ctx.measureText(span.text).width;
|
|
23633
|
+
const width = spacedTextWidth(ctx.measureText(span.text).width, span.text, resolveSpacing(span.style));
|
|
23565
23634
|
spanWidths.push(width);
|
|
23566
23635
|
lineWidth += width;
|
|
23567
23636
|
const metrics = getFontMetrics2(fontSize, fontFamily, bold, italic);
|
|
@@ -23599,7 +23668,11 @@ const ya = `"use strict";
|
|
|
23599
23668
|
if (visibleText.length > 0) {
|
|
23600
23669
|
ctx.save();
|
|
23601
23670
|
ctx.font = buildFontString(fontSize, fontFamily, bold, italic);
|
|
23602
|
-
adjustedLineWidth +=
|
|
23671
|
+
adjustedLineWidth += spacedTextWidth(
|
|
23672
|
+
ctx.measureText(visibleText).width,
|
|
23673
|
+
visibleText,
|
|
23674
|
+
resolveSpacing(span.style)
|
|
23675
|
+
);
|
|
23603
23676
|
ctx.restore();
|
|
23604
23677
|
}
|
|
23605
23678
|
});
|
|
@@ -23617,7 +23690,7 @@ const ya = `"use strict";
|
|
|
23617
23690
|
maxLineHeight = Math.max(maxLineHeight, lineHeight);
|
|
23618
23691
|
});
|
|
23619
23692
|
const elementFontMetrics = getFontMetrics2(element.fontSize, element.fontFamily, element.bold, element.italic);
|
|
23620
|
-
const lineSpacing = element.fontSize * LINE_HEIGHT_MULTIPLIER;
|
|
23693
|
+
const lineSpacing = element.fontSize * (element.lineHeight ?? LINE_HEIGHT_MULTIPLIER);
|
|
23621
23694
|
let totalHeight;
|
|
23622
23695
|
if (lineMetrics.length === 0) {
|
|
23623
23696
|
totalHeight = 0;
|
|
@@ -23669,12 +23742,13 @@ const ya = `"use strict";
|
|
|
23669
23742
|
}
|
|
23670
23743
|
charIndexInLine += span.text.length;
|
|
23671
23744
|
if (renderText.length > 0) {
|
|
23745
|
+
const letterSpacing = resolveSpacing(span.style);
|
|
23672
23746
|
ctx.font = buildFontString(fontSize, fontFamily, bold, italic);
|
|
23673
23747
|
ctx.fillStyle = color;
|
|
23674
23748
|
ctx.textBaseline = "alphabetic";
|
|
23675
23749
|
ctx.textAlign = "left";
|
|
23676
|
-
ctx
|
|
23677
|
-
const renderedWidth = ctx.measureText(renderText).width;
|
|
23750
|
+
fillTextWithSpacing(ctx, renderText, currentX, baselineY, letterSpacing);
|
|
23751
|
+
const renderedWidth = spacedTextWidth(ctx.measureText(renderText).width, renderText, letterSpacing);
|
|
23678
23752
|
if (underline) {
|
|
23679
23753
|
const underlineY = baselineY + fontSize * 0.1;
|
|
23680
23754
|
ctx.beginPath();
|
|
@@ -23753,7 +23827,7 @@ const ya = `"use strict";
|
|
|
23753
23827
|
const visualHeight = fontMetrics.height;
|
|
23754
23828
|
const topLeftY = -visualHeight / 2;
|
|
23755
23829
|
const yPos = topLeftY + fontMetrics.ascent;
|
|
23756
|
-
ctx
|
|
23830
|
+
fillTextWithSpacing(ctx, text, 0, yPos, element.letterSpacing);
|
|
23757
23831
|
}
|
|
23758
23832
|
function renderCustomTransform(ctx, elementData) {
|
|
23759
23833
|
renderCustomTransformNormal(ctx, elementData);
|
|
@@ -23783,7 +23857,9 @@ const ya = `"use strict";
|
|
|
23783
23857
|
italic: elementData.italic,
|
|
23784
23858
|
underline: elementData.underline,
|
|
23785
23859
|
strikethrough: elementData.strikethrough,
|
|
23786
|
-
textAlign: elementData.textAlign
|
|
23860
|
+
textAlign: elementData.textAlign,
|
|
23861
|
+
letterSpacing: elementData.letterSpacing,
|
|
23862
|
+
lineHeight: elementData.lineHeight
|
|
23787
23863
|
},
|
|
23788
23864
|
availableWidth,
|
|
23789
23865
|
lockedLineCount
|
|
@@ -23793,6 +23869,7 @@ const ya = `"use strict";
|
|
|
23793
23869
|
if (elementData.text) {
|
|
23794
23870
|
ctx.fillStyle = elementData.color;
|
|
23795
23871
|
const lockedLineCount = elementData._lockedLineCount;
|
|
23872
|
+
const letterSpacing = elementData.letterSpacing ?? 0;
|
|
23796
23873
|
const { lines, height: visualHeight } = calculateVisualBoundsWithSpaceCollapsing(
|
|
23797
23874
|
elementData.text,
|
|
23798
23875
|
availableWidth,
|
|
@@ -23801,8 +23878,9 @@ const ya = `"use strict";
|
|
|
23801
23878
|
elementData.bold,
|
|
23802
23879
|
elementData.italic,
|
|
23803
23880
|
lockedLineCount,
|
|
23804
|
-
true
|
|
23881
|
+
true,
|
|
23805
23882
|
// strict: true
|
|
23883
|
+
{ letterSpacing, lineHeight: elementData.lineHeight }
|
|
23806
23884
|
);
|
|
23807
23885
|
const fontMetrics = getFontMetrics2(
|
|
23808
23886
|
elementData.fontSize,
|
|
@@ -23812,7 +23890,7 @@ const ya = `"use strict";
|
|
|
23812
23890
|
);
|
|
23813
23891
|
const topLeftX = -(transformData?.width ?? 100) / 2;
|
|
23814
23892
|
const topLeftY = -visualHeight / 2;
|
|
23815
|
-
const lineSpacing = elementData.fontSize * LINE_HEIGHT_MULTIPLIER;
|
|
23893
|
+
const lineSpacing = elementData.fontSize * (elementData.lineHeight ?? LINE_HEIGHT_MULTIPLIER);
|
|
23816
23894
|
ctx.font = \`\${elementData.italic ? "italic " : ""}\${elementData.bold ? "bold " : ""}\${elementData.fontSize}px \${elementData.fontFamily}\`;
|
|
23817
23895
|
ctx.textBaseline = "alphabetic";
|
|
23818
23896
|
ctx.textAlign = elementData.textAlign;
|
|
@@ -23841,9 +23919,9 @@ const ya = `"use strict";
|
|
|
23841
23919
|
xPos = topLeftX + (transformData?.width ?? 100) - HORIZONTAL_PADDING;
|
|
23842
23920
|
}
|
|
23843
23921
|
const yPos = topLeftY + fontMetrics.ascent + index * lineSpacing;
|
|
23844
|
-
ctx
|
|
23922
|
+
fillTextWithSpacing(ctx, visibleText, xPos, yPos, letterSpacing);
|
|
23845
23923
|
if (visibleText.length > 0) {
|
|
23846
|
-
const lineWidth = ctx.measureText(visibleText).width;
|
|
23924
|
+
const lineWidth = spacedTextWidth(ctx.measureText(visibleText).width, visibleText, letterSpacing);
|
|
23847
23925
|
let decorationX = xPos;
|
|
23848
23926
|
if (elementData.textAlign === "center") decorationX -= lineWidth / 2;
|
|
23849
23927
|
else if (elementData.textAlign === "right") decorationX -= lineWidth;
|
|
@@ -24257,7 +24335,8 @@ const ya = `"use strict";
|
|
|
24257
24335
|
bold: textElement.bold || false,
|
|
24258
24336
|
italic: textElement.italic || false,
|
|
24259
24337
|
textAlign: textElement.textAlign || "center",
|
|
24260
|
-
color: textElement.color || "#000000"
|
|
24338
|
+
color: textElement.color || "#000000",
|
|
24339
|
+
letterSpacing: textElement.letterSpacing
|
|
24261
24340
|
});
|
|
24262
24341
|
ctx.restore();
|
|
24263
24342
|
}
|
|
@@ -26314,8 +26393,8 @@ const ya = `"use strict";
|
|
|
26314
26393
|
console.error("[Export Worker] Unhandled promise rejection:", event.reason);
|
|
26315
26394
|
};
|
|
26316
26395
|
})();
|
|
26317
|
-
`, O =
|
|
26318
|
-
class
|
|
26396
|
+
`, O = U("WorkerExport");
|
|
26397
|
+
class un {
|
|
26319
26398
|
constructor() {
|
|
26320
26399
|
this.worker = null, this.workerBlobUrl = null, this.pendingRequests = /* @__PURE__ */ new Map(), this.requestQueue = [], this.blobRequestQueue = [], this.isProcessingQueue = !1, this.isReady = !1, this.readyPromise = null, this.requestIdCounter = 0, this.workerCrashCount = 0, this.MAX_CRASHES_BEFORE_FALLBACK = 3, this.lastCrashTime = 0, this.CRASH_RESET_TIMEOUT = 6e4, this.progressListeners = /* @__PURE__ */ new Set(), this.idleTimeout = null, this.IDLE_TIMEOUT_MS = 3e4;
|
|
26321
26400
|
}
|
|
@@ -26377,7 +26456,7 @@ class dn {
|
|
|
26377
26456
|
* Call this when exiting editor mode to free memory.
|
|
26378
26457
|
*/
|
|
26379
26458
|
clearWorkerBitmapCache() {
|
|
26380
|
-
if (
|
|
26459
|
+
if (Ln(), this.worker && this.isReady) {
|
|
26381
26460
|
const n = {
|
|
26382
26461
|
type: "clear-all-bitmaps"
|
|
26383
26462
|
};
|
|
@@ -26389,7 +26468,7 @@ class dn {
|
|
|
26389
26468
|
* Call this when an element is removed or its image source changes.
|
|
26390
26469
|
*/
|
|
26391
26470
|
clearWorkerBitmap(n) {
|
|
26392
|
-
if (
|
|
26471
|
+
if (Re(n), this.worker && this.isReady) {
|
|
26393
26472
|
const t = {
|
|
26394
26473
|
type: "clear-bitmap",
|
|
26395
26474
|
elementId: n
|
|
@@ -26413,13 +26492,13 @@ class dn {
|
|
|
26413
26492
|
async initialize() {
|
|
26414
26493
|
if (this.worker)
|
|
26415
26494
|
return this.readyPromise || Promise.resolve();
|
|
26416
|
-
if (!
|
|
26495
|
+
if (!un.supportsWorkerExport())
|
|
26417
26496
|
throw new Error("Browser does not support OffscreenCanvas or Web Workers");
|
|
26418
26497
|
return this.readyPromise = new Promise((n, t) => {
|
|
26419
26498
|
try {
|
|
26420
26499
|
let a;
|
|
26421
26500
|
try {
|
|
26422
|
-
const s = new Blob([
|
|
26501
|
+
const s = new Blob([wa], { type: "application/javascript" });
|
|
26423
26502
|
a = URL.createObjectURL(s), this.workerBlobUrl = a;
|
|
26424
26503
|
} catch (s) {
|
|
26425
26504
|
O.error("Failed to create worker blob:", s), t(new Error(`Worker creation failed: ${s instanceof Error ? s.message : String(s)}`));
|
|
@@ -26433,7 +26512,7 @@ class dn {
|
|
|
26433
26512
|
const r = setTimeout(() => {
|
|
26434
26513
|
t(new Error("Worker initialization timeout"));
|
|
26435
26514
|
}, 15e3), o = (s) => {
|
|
26436
|
-
s.data.type === "ready" && (clearTimeout(r), this.isReady = !0,
|
|
26515
|
+
s.data.type === "ready" && (clearTimeout(r), this.isReady = !0, xa(
|
|
26437
26516
|
() => this.clearWorkerBitmapCache(),
|
|
26438
26517
|
(c) => this.clearWorkerBitmap(c)
|
|
26439
26518
|
), n());
|
|
@@ -26510,7 +26589,7 @@ class dn {
|
|
|
26510
26589
|
const { artboard: t, elements: a, config: r } = n;
|
|
26511
26590
|
if ((!this.worker || !this.isReady) && await this.initialize(), !this.worker)
|
|
26512
26591
|
throw new Error("Worker is not initialized");
|
|
26513
|
-
const o = `export-${++this.requestIdCounter}-${Date.now()}`, s = performance.now(), { data: c, newBitmaps: i } = await
|
|
26592
|
+
const o = `export-${++this.requestIdCounter}-${Date.now()}`, s = performance.now(), { data: c, newBitmaps: i } = await be(t, a);
|
|
26514
26593
|
i.length > 0 && this.registerBitmapsWithWorker(i);
|
|
26515
26594
|
const l = {
|
|
26516
26595
|
type: "export",
|
|
@@ -26521,15 +26600,15 @@ class dn {
|
|
|
26521
26600
|
scale: r.scale || 1,
|
|
26522
26601
|
format: r.format || "png",
|
|
26523
26602
|
quality: r.quality || 0.95
|
|
26524
|
-
}, d = new Promise((
|
|
26603
|
+
}, d = new Promise(($, h) => {
|
|
26525
26604
|
this.pendingRequests.set(o, {
|
|
26526
26605
|
requestId: o,
|
|
26527
|
-
resolve:
|
|
26528
|
-
reject:
|
|
26606
|
+
resolve: $,
|
|
26607
|
+
reject: h,
|
|
26529
26608
|
startTime: s,
|
|
26530
26609
|
returnFormat: "dataUrl"
|
|
26531
26610
|
}), setTimeout(() => {
|
|
26532
|
-
this.pendingRequests.has(o) && (this.pendingRequests.delete(o),
|
|
26611
|
+
this.pendingRequests.has(o) && (this.pendingRequests.delete(o), h(new Error("Export request timeout")));
|
|
26533
26612
|
}, 3e4);
|
|
26534
26613
|
});
|
|
26535
26614
|
this.worker.postMessage(l);
|
|
@@ -26567,7 +26646,7 @@ class dn {
|
|
|
26567
26646
|
const { artboard: t, elements: a, config: r } = n;
|
|
26568
26647
|
if ((!this.worker || !this.isReady) && await this.initialize(), !this.worker)
|
|
26569
26648
|
throw new Error("Worker is not initialized");
|
|
26570
|
-
const o = `export-blob-${++this.requestIdCounter}-${Date.now()}`, s = performance.now(), { data: c, newBitmaps: i } = await
|
|
26649
|
+
const o = `export-blob-${++this.requestIdCounter}-${Date.now()}`, s = performance.now(), { data: c, newBitmaps: i } = await be(t, a);
|
|
26571
26650
|
i.length > 0 && this.registerBitmapsWithWorker(i);
|
|
26572
26651
|
const l = {
|
|
26573
26652
|
type: "export",
|
|
@@ -26579,15 +26658,15 @@ class dn {
|
|
|
26579
26658
|
format: r.format || "png",
|
|
26580
26659
|
quality: r.quality || 0.95,
|
|
26581
26660
|
returnFormat: "blob"
|
|
26582
|
-
}, d = new Promise((
|
|
26661
|
+
}, d = new Promise((h, b) => {
|
|
26583
26662
|
this.pendingRequests.set(o, {
|
|
26584
26663
|
requestId: o,
|
|
26585
|
-
resolve:
|
|
26586
|
-
reject:
|
|
26664
|
+
resolve: h,
|
|
26665
|
+
reject: b,
|
|
26587
26666
|
startTime: s,
|
|
26588
26667
|
returnFormat: "blob"
|
|
26589
26668
|
}), setTimeout(() => {
|
|
26590
|
-
this.pendingRequests.has(o) && (this.pendingRequests.delete(o),
|
|
26669
|
+
this.pendingRequests.has(o) && (this.pendingRequests.delete(o), b(new Error("Export request timeout")));
|
|
26591
26670
|
}, 3e4);
|
|
26592
26671
|
});
|
|
26593
26672
|
this.worker.postMessage(l);
|
|
@@ -26681,7 +26760,7 @@ class dn {
|
|
|
26681
26760
|
t.reject(new Error("Worker terminated")), this.pendingRequests.delete(n);
|
|
26682
26761
|
for (; this.requestQueue.length > 0; )
|
|
26683
26762
|
this.requestQueue.shift().reject(new Error("Worker terminated"));
|
|
26684
|
-
this.worker.terminate(), this.worker = null, this.isReady = !1, this.readyPromise = null,
|
|
26763
|
+
this.worker.terminate(), this.worker = null, this.isReady = !1, this.readyPromise = null, Ln(), va(), this.workerBlobUrl && (URL.revokeObjectURL(this.workerBlobUrl), this.workerBlobUrl = null);
|
|
26685
26764
|
}
|
|
26686
26765
|
}
|
|
26687
26766
|
/**
|
|
@@ -26696,32 +26775,32 @@ class dn {
|
|
|
26696
26775
|
};
|
|
26697
26776
|
}
|
|
26698
26777
|
}
|
|
26699
|
-
let
|
|
26700
|
-
function
|
|
26701
|
-
return
|
|
26778
|
+
let Q = null;
|
|
26779
|
+
function La() {
|
|
26780
|
+
return Q || (Q = new un()), Q;
|
|
26702
26781
|
}
|
|
26703
|
-
function
|
|
26704
|
-
|
|
26782
|
+
function Na() {
|
|
26783
|
+
Q && (Q.terminate(), Q = null);
|
|
26705
26784
|
}
|
|
26706
|
-
|
|
26707
|
-
const
|
|
26708
|
-
function
|
|
26785
|
+
Hn();
|
|
26786
|
+
const W = U("Export");
|
|
26787
|
+
function Un(e, n) {
|
|
26709
26788
|
var t;
|
|
26710
26789
|
if (!(!e || typeof e != "object")) {
|
|
26711
26790
|
if (typeof e.fontFamily == "string" && e.fontFamily.trim() && n.add(e.fontFamily), e.richText && Array.isArray(e.richText.spans))
|
|
26712
26791
|
for (const a of e.richText.spans)
|
|
26713
26792
|
(t = a == null ? void 0 : a.style) != null && t.fontFamily && typeof a.style.fontFamily == "string" && n.add(a.style.fontFamily);
|
|
26714
26793
|
if (Array.isArray(e.children))
|
|
26715
|
-
for (const a of e.children)
|
|
26794
|
+
for (const a of e.children) Un(a, n);
|
|
26716
26795
|
if (Array.isArray(e.masks))
|
|
26717
26796
|
for (const a of e.masks)
|
|
26718
|
-
a != null && a.maskElement &&
|
|
26797
|
+
a != null && a.maskElement && Un(a.maskElement, n);
|
|
26719
26798
|
}
|
|
26720
26799
|
}
|
|
26721
|
-
async function
|
|
26800
|
+
async function ge(e) {
|
|
26722
26801
|
if (typeof document > "u" || !document.fonts) return;
|
|
26723
26802
|
const n = /* @__PURE__ */ new Set();
|
|
26724
|
-
for (const a of e)
|
|
26803
|
+
for (const a of e) Un(a, n);
|
|
26725
26804
|
if (n.size === 0) return;
|
|
26726
26805
|
const t = [];
|
|
26727
26806
|
for (const a of n)
|
|
@@ -26729,12 +26808,12 @@ async function ue(e) {
|
|
|
26729
26808
|
}));
|
|
26730
26809
|
await Promise.all(t), document.fonts.ready && await document.fonts.ready;
|
|
26731
26810
|
}
|
|
26732
|
-
const
|
|
26811
|
+
const ln = class ln {
|
|
26733
26812
|
/**
|
|
26734
26813
|
* Check if worker export is supported in this browser
|
|
26735
26814
|
*/
|
|
26736
26815
|
static supportsWorkerExport() {
|
|
26737
|
-
return
|
|
26816
|
+
return un.supportsWorkerExport();
|
|
26738
26817
|
}
|
|
26739
26818
|
/**
|
|
26740
26819
|
* Get or initialize the worker manager
|
|
@@ -26742,9 +26821,9 @@ const on = class on {
|
|
|
26742
26821
|
static async getWorkerManager() {
|
|
26743
26822
|
return this.supportsWorkerExport() ? this.workerManager ? this.workerManager : this.workerInitPromise ? (await this.workerInitPromise, this.workerManager) : (this.workerInitPromise = (async () => {
|
|
26744
26823
|
try {
|
|
26745
|
-
this.workerManager = new
|
|
26824
|
+
this.workerManager = new un(), await this.workerManager.initialize();
|
|
26746
26825
|
} catch (n) {
|
|
26747
|
-
|
|
26826
|
+
W.error("Failed to initialize worker:", n), this.workerManager = null;
|
|
26748
26827
|
}
|
|
26749
26828
|
})(), await this.workerInitPromise, this.workerInitPromise = null, this.workerManager) : null;
|
|
26750
26829
|
}
|
|
@@ -26801,8 +26880,8 @@ const on = class on {
|
|
|
26801
26880
|
transparentBackground: i,
|
|
26802
26881
|
backgroundColor: l,
|
|
26803
26882
|
forceMainThread: u
|
|
26804
|
-
}), f = await this.dataUrlToBlob(p),
|
|
26805
|
-
this.downloadBlob(f,
|
|
26883
|
+
}), f = await this.dataUrlToBlob(p), $ = (/* @__PURE__ */ new Date()).toISOString().replace(/[:.]/g, "-").split("T")[0], h = d || `${n.name}-${$}.${o}`;
|
|
26884
|
+
this.downloadBlob(f, h);
|
|
26806
26885
|
}
|
|
26807
26886
|
/**
|
|
26808
26887
|
* Export artboard to data URL (for preview/testing)
|
|
@@ -26821,7 +26900,7 @@ const on = class on {
|
|
|
26821
26900
|
try {
|
|
26822
26901
|
const u = await this.getWorkerManager();
|
|
26823
26902
|
if (u) {
|
|
26824
|
-
const p = new Set(n.getElementIds()), f = t.filter((
|
|
26903
|
+
const p = new Set(n.getElementIds()), f = t.filter((h) => p.has(h.id));
|
|
26825
26904
|
return (await u.exportArtboardToDataURL(n, f, {
|
|
26826
26905
|
scale: c,
|
|
26827
26906
|
format: o === "jpg" ? "jpeg" : o,
|
|
@@ -26829,7 +26908,7 @@ const on = class on {
|
|
|
26829
26908
|
})).dataUrl;
|
|
26830
26909
|
}
|
|
26831
26910
|
} catch (u) {
|
|
26832
|
-
|
|
26911
|
+
W.warn("Worker export failed, falling back to main thread:", u);
|
|
26833
26912
|
}
|
|
26834
26913
|
return this.mainThreadExportToDataURL(n, t, a, {
|
|
26835
26914
|
format: o,
|
|
@@ -26857,7 +26936,7 @@ const on = class on {
|
|
|
26857
26936
|
try {
|
|
26858
26937
|
const u = await this.getWorkerManager();
|
|
26859
26938
|
if (u) {
|
|
26860
|
-
const p = new Set(n.getElementIds()), f = t.filter((
|
|
26939
|
+
const p = new Set(n.getElementIds()), f = t.filter((h) => p.has(h.id));
|
|
26861
26940
|
return (await u.exportArtboardToBlob(n, f, {
|
|
26862
26941
|
scale: c,
|
|
26863
26942
|
format: o === "jpg" ? "jpeg" : o,
|
|
@@ -26865,7 +26944,7 @@ const on = class on {
|
|
|
26865
26944
|
})).blob;
|
|
26866
26945
|
}
|
|
26867
26946
|
} catch (u) {
|
|
26868
|
-
|
|
26947
|
+
W.warn("Worker blob export failed, falling back to main thread:", u);
|
|
26869
26948
|
}
|
|
26870
26949
|
return this.mainThreadExportToBlob(n, t, a, {
|
|
26871
26950
|
format: o,
|
|
@@ -26889,53 +26968,53 @@ const on = class on {
|
|
|
26889
26968
|
transparentBackground: i = !1,
|
|
26890
26969
|
backgroundColor: l = n.backgroundColor
|
|
26891
26970
|
} = r;
|
|
26892
|
-
await
|
|
26971
|
+
await ge(t);
|
|
26893
26972
|
const d = document.createElement("canvas"), u = n.width * c, p = n.height * c;
|
|
26894
26973
|
d.width = u, d.height = p;
|
|
26895
26974
|
const f = d.getContext("2d");
|
|
26896
26975
|
if (f.scale(c, c), !i && n.exportBackground) {
|
|
26897
26976
|
if (f.save(), this.applyExportBackgroundClipPath(f, n), n.backgroundType === "texture" && n.backgroundTexture) {
|
|
26898
|
-
const
|
|
26899
|
-
f.fillStyle =
|
|
26900
|
-
const
|
|
26901
|
-
|
|
26977
|
+
const m = J.getTexturePresetColor(n.backgroundTexture);
|
|
26978
|
+
f.fillStyle = m, f.fillRect(0, 0, n.width, n.height);
|
|
26979
|
+
const g = J.getTexture(n.backgroundTexture);
|
|
26980
|
+
g && g.complete && f.drawImage(g, 0, 0, n.width, n.height);
|
|
26902
26981
|
} else
|
|
26903
26982
|
f.fillStyle = l || n.backgroundColor, f.fillRect(0, 0, n.width, n.height);
|
|
26904
26983
|
f.restore();
|
|
26905
26984
|
}
|
|
26906
26985
|
f.save(), f.translate(-n.x, -n.y), this.applyExportClipPath(f, n);
|
|
26907
|
-
const
|
|
26908
|
-
|
|
26909
|
-
const
|
|
26910
|
-
if (!
|
|
26911
|
-
const
|
|
26912
|
-
|
|
26913
|
-
},
|
|
26914
|
-
return
|
|
26915
|
-
var
|
|
26916
|
-
if (
|
|
26917
|
-
const T =
|
|
26986
|
+
const $ = new Set(n.getElementIds()), h = t.filter((m) => $.has(m.id)), b = /* @__PURE__ */ new Map();
|
|
26987
|
+
h.forEach((m) => b.set(m.id, m));
|
|
26988
|
+
const v = (m, g) => {
|
|
26989
|
+
if (!g.id) return;
|
|
26990
|
+
const C = b.get(g.id);
|
|
26991
|
+
C && C.render(m, !1);
|
|
26992
|
+
}, y = h.map((m) => m.toJSON()), x = /* @__PURE__ */ new Set();
|
|
26993
|
+
return h.forEach((m, g) => {
|
|
26994
|
+
var C;
|
|
26995
|
+
if (m.blendMode === "knockout" || m.blendMode === "clip") {
|
|
26996
|
+
const T = y[g], k = m.blendMode === "knockout" ? "destination-out" : "destination-in", _ = ((C = T.knockoutParts) == null ? void 0 : C.scope) || "group", w = y.findIndex((A) => A.id === T.id);
|
|
26918
26997
|
if (w !== -1 && _ === "artboard")
|
|
26919
|
-
for (let
|
|
26920
|
-
const
|
|
26921
|
-
|
|
26998
|
+
for (let A = 0; A < w; A++) {
|
|
26999
|
+
const E = y[A].id;
|
|
27000
|
+
E && x.add(E);
|
|
26922
27001
|
}
|
|
26923
|
-
|
|
27002
|
+
Dn(
|
|
26924
27003
|
f,
|
|
26925
27004
|
T,
|
|
26926
|
-
|
|
26927
|
-
|
|
27005
|
+
y,
|
|
27006
|
+
v,
|
|
26928
27007
|
i || !n.exportBackground ? void 0 : l,
|
|
26929
27008
|
n,
|
|
26930
|
-
|
|
26931
|
-
),
|
|
27009
|
+
k
|
|
27010
|
+
), x.add(m.id);
|
|
26932
27011
|
}
|
|
26933
|
-
}),
|
|
26934
|
-
|
|
26935
|
-
}), f.restore(), new Promise((
|
|
27012
|
+
}), h.forEach((m) => {
|
|
27013
|
+
x.has(m.id) || m.render(f, !1);
|
|
27014
|
+
}), f.restore(), new Promise((m, g) => {
|
|
26936
27015
|
d.toBlob(
|
|
26937
|
-
(
|
|
26938
|
-
|
|
27016
|
+
(C) => {
|
|
27017
|
+
C ? m(C) : g(new Error("Failed to create blob from canvas"));
|
|
26939
27018
|
},
|
|
26940
27019
|
o === "jpg" || o === "jpeg" ? "image/jpeg" : o === "webp" ? "image/webp" : "image/png",
|
|
26941
27020
|
s
|
|
@@ -26949,7 +27028,7 @@ const on = class on {
|
|
|
26949
27028
|
* worker), so font readiness matters here even when no fallback occurred.
|
|
26950
27029
|
*/
|
|
26951
27030
|
static async mainThreadExportToDataURL(n, t, a, r = {}) {
|
|
26952
|
-
var
|
|
27031
|
+
var g, C;
|
|
26953
27032
|
const {
|
|
26954
27033
|
format: o = "png",
|
|
26955
27034
|
quality: s = 0.95,
|
|
@@ -26957,79 +27036,79 @@ const on = class on {
|
|
|
26957
27036
|
transparentBackground: i = !1,
|
|
26958
27037
|
backgroundColor: l = n.backgroundColor
|
|
26959
27038
|
} = r;
|
|
26960
|
-
await
|
|
27039
|
+
await ge(t);
|
|
26961
27040
|
const d = document.createElement("canvas"), u = n.width * c, p = n.height * c;
|
|
26962
27041
|
d.width = u, d.height = p;
|
|
26963
27042
|
const f = d.getContext("2d");
|
|
26964
27043
|
if (f.scale(c, c), !i && n.exportBackground) {
|
|
26965
27044
|
if (f.save(), this.applyExportBackgroundClipPath(f, n), n.backgroundType === "texture" && n.backgroundTexture) {
|
|
26966
|
-
const T =
|
|
27045
|
+
const T = J.getTexturePresetColor(n.backgroundTexture);
|
|
26967
27046
|
f.fillStyle = T, f.fillRect(0, 0, n.width, n.height);
|
|
26968
|
-
const
|
|
26969
|
-
|
|
27047
|
+
const k = J.getTexture(n.backgroundTexture);
|
|
27048
|
+
k && k.complete ? f.drawImage(k, 0, 0, n.width, n.height) : W.warn("Texture not loaded for export:", n.backgroundTexture);
|
|
26970
27049
|
} else
|
|
26971
27050
|
f.fillStyle = l, f.fillRect(0, 0, n.width, n.height);
|
|
26972
27051
|
f.restore();
|
|
26973
27052
|
}
|
|
26974
27053
|
f.save(), f.translate(-n.x, -n.y), this.applyExportClipPath(f, n);
|
|
26975
|
-
const
|
|
26976
|
-
|
|
26977
|
-
const
|
|
26978
|
-
if (!
|
|
26979
|
-
const _ =
|
|
26980
|
-
_ ? _.render(T, !1) :
|
|
26981
|
-
},
|
|
26982
|
-
|
|
27054
|
+
const $ = new Set(n.getElementIds()), h = t.filter((T) => $.has(T.id)), b = /* @__PURE__ */ new Map();
|
|
27055
|
+
h.forEach((T) => b.set(T.id, T));
|
|
27056
|
+
const v = (T, k) => {
|
|
27057
|
+
if (!k.id) return;
|
|
27058
|
+
const _ = b.get(k.id);
|
|
27059
|
+
_ ? _.render(T, !1) : W.warn("Element not found in map:", k.id);
|
|
27060
|
+
}, y = h.map((T) => T.toJSON()), x = /* @__PURE__ */ new Set();
|
|
27061
|
+
h.forEach((T, k) => {
|
|
26983
27062
|
var _;
|
|
26984
27063
|
if (T.blendMode === "knockout" || T.blendMode === "clip") {
|
|
26985
|
-
const w =
|
|
26986
|
-
if (
|
|
26987
|
-
for (let
|
|
26988
|
-
const
|
|
26989
|
-
|
|
27064
|
+
const w = y[k], A = T.blendMode === "knockout" ? "destination-out" : "destination-in", E = ((_ = w.knockoutParts) == null ? void 0 : _.scope) || "group", S = y.findIndex((P) => P.id === w.id);
|
|
27065
|
+
if (S !== -1 && E === "artboard")
|
|
27066
|
+
for (let P = 0; P < S; P++) {
|
|
27067
|
+
const I = y[P].id;
|
|
27068
|
+
I && x.add(I);
|
|
26990
27069
|
}
|
|
26991
|
-
|
|
27070
|
+
Dn(
|
|
26992
27071
|
f,
|
|
26993
27072
|
w,
|
|
26994
|
-
|
|
26995
|
-
|
|
27073
|
+
y,
|
|
27074
|
+
v,
|
|
26996
27075
|
i || !n.exportBackground ? void 0 : l,
|
|
26997
27076
|
n,
|
|
26998
|
-
|
|
26999
|
-
),
|
|
27077
|
+
A
|
|
27078
|
+
), x.add(T.id);
|
|
27000
27079
|
}
|
|
27001
|
-
}),
|
|
27080
|
+
}), h.forEach((T, k) => {
|
|
27002
27081
|
var _;
|
|
27003
|
-
if (!
|
|
27004
|
-
const w =
|
|
27005
|
-
T.render(
|
|
27082
|
+
if (!x.has(T.id)) {
|
|
27083
|
+
const w = y[k], A = ((_ = w == null ? void 0 : w.distressEffect) == null ? void 0 : _.enabled) && w.distressEffect.style === "custom" && w.distressEffect.textureUrl, E = (w == null ? void 0 : w.masks) && w.masks.length > 0, S = (P) => {
|
|
27084
|
+
T.render(P, !1);
|
|
27006
27085
|
};
|
|
27007
|
-
if (
|
|
27008
|
-
|
|
27009
|
-
const
|
|
27010
|
-
|
|
27086
|
+
if (E && A)
|
|
27087
|
+
re(f, w, (P) => {
|
|
27088
|
+
const I = T.getVisualBoundingBox();
|
|
27089
|
+
de(P, w.distressEffect, I, S);
|
|
27011
27090
|
});
|
|
27012
|
-
else if (
|
|
27013
|
-
|
|
27014
|
-
else if (
|
|
27015
|
-
const
|
|
27016
|
-
|
|
27091
|
+
else if (E)
|
|
27092
|
+
re(f, w, S);
|
|
27093
|
+
else if (A) {
|
|
27094
|
+
const P = T.getVisualBoundingBox();
|
|
27095
|
+
de(f, w.distressEffect, P, S);
|
|
27017
27096
|
} else
|
|
27018
27097
|
T.render(f, !1);
|
|
27019
27098
|
}
|
|
27020
|
-
}), (
|
|
27099
|
+
}), (g = n.distressTexture) != null && g.enabled && ha(f, n.distressTexture, {
|
|
27021
27100
|
x: n.x,
|
|
27022
27101
|
y: n.y,
|
|
27023
27102
|
width: n.width,
|
|
27024
27103
|
height: n.height
|
|
27025
|
-
}), (
|
|
27104
|
+
}), (C = n.imageMask) != null && C.enabled && ra(f, n.imageMask, {
|
|
27026
27105
|
x: n.x,
|
|
27027
27106
|
y: n.y,
|
|
27028
27107
|
width: n.width,
|
|
27029
27108
|
height: n.height
|
|
27030
27109
|
}), f.restore();
|
|
27031
|
-
const
|
|
27032
|
-
return d.toDataURL(
|
|
27110
|
+
const m = o === "png" ? "image/png" : o === "webp" ? "image/webp" : "image/jpeg";
|
|
27111
|
+
return d.toDataURL(m, s);
|
|
27033
27112
|
}
|
|
27034
27113
|
/**
|
|
27035
27114
|
* Apply clip path for export background (uses 0,0 as origin since background is drawn before translate)
|
|
@@ -27050,7 +27129,7 @@ const on = class on {
|
|
|
27050
27129
|
n.clip(i);
|
|
27051
27130
|
return;
|
|
27052
27131
|
} catch (i) {
|
|
27053
|
-
|
|
27132
|
+
W.warn("Invalid SVG path, falling back to rectangle:", i), n.rect(s, c, a, r);
|
|
27054
27133
|
}
|
|
27055
27134
|
n.clip();
|
|
27056
27135
|
}
|
|
@@ -27074,7 +27153,7 @@ const on = class on {
|
|
|
27074
27153
|
n.translate(a, r), n.clip(i), n.translate(-a, -r);
|
|
27075
27154
|
return;
|
|
27076
27155
|
} catch (i) {
|
|
27077
|
-
|
|
27156
|
+
W.warn("Invalid SVG path, falling back to rectangle:", i), n.rect(a, r, o, s);
|
|
27078
27157
|
}
|
|
27079
27158
|
n.clip();
|
|
27080
27159
|
}
|
|
@@ -27134,24 +27213,24 @@ const on = class on {
|
|
|
27134
27213
|
try {
|
|
27135
27214
|
const l = performance.now(), d = await this.getWorkerManager();
|
|
27136
27215
|
if (d) {
|
|
27137
|
-
const u = new Set(n.getElementIds()), p = t.filter((
|
|
27216
|
+
const u = new Set(n.getElementIds()), p = t.filter((b) => u.has(b.id)), f = await d.exportArtboardToDataURL(n, p, {
|
|
27138
27217
|
scale: r.scale || 1,
|
|
27139
27218
|
format: (r.format === "jpg" ? "jpeg" : r.format) || "png",
|
|
27140
27219
|
quality: r.quality || 0.95
|
|
27141
|
-
}),
|
|
27220
|
+
}), $ = performance.now() - l, h = c / $;
|
|
27142
27221
|
return {
|
|
27143
27222
|
...i,
|
|
27144
27223
|
worker: {
|
|
27145
|
-
time:
|
|
27224
|
+
time: $,
|
|
27146
27225
|
dataUrl: f.dataUrl,
|
|
27147
27226
|
mainThreadBlockTime: f.mainThreadBlockTime
|
|
27148
27227
|
},
|
|
27149
|
-
speedup:
|
|
27150
|
-
recommendation:
|
|
27228
|
+
speedup: h,
|
|
27229
|
+
recommendation: h > 1.2 ? `Worker export is ${h.toFixed(2)}x faster - recommended for continuous export` : h < 0.8 ? `Main thread export is ${(1 / h).toFixed(2)}x faster - worker overhead not worth it for single exports` : "Performance is similar, but worker keeps UI responsive during export"
|
|
27151
27230
|
};
|
|
27152
27231
|
}
|
|
27153
27232
|
} catch (l) {
|
|
27154
|
-
|
|
27233
|
+
W.error("Worker benchmark failed:", l), i.recommendation = "Worker export not available - using main thread export";
|
|
27155
27234
|
}
|
|
27156
27235
|
else
|
|
27157
27236
|
i.recommendation = "Worker export not supported in this browser - using main thread export";
|
|
@@ -27173,23 +27252,23 @@ const on = class on {
|
|
|
27173
27252
|
for (setTimeout(() => {
|
|
27174
27253
|
d = !1;
|
|
27175
27254
|
}, o); d; ) {
|
|
27176
|
-
const
|
|
27255
|
+
const y = performance.now();
|
|
27177
27256
|
await this.exportArtboardToDataURL(n, t, a, {
|
|
27178
27257
|
forceMainThread: !c
|
|
27179
27258
|
});
|
|
27180
|
-
const
|
|
27181
|
-
i.push(
|
|
27259
|
+
const x = performance.now() - y;
|
|
27260
|
+
i.push(x), c || (l += x), await new Promise((m) => setTimeout(m, Math.max(0, s - x)));
|
|
27182
27261
|
}
|
|
27183
|
-
const u = i.length, p = i.reduce((
|
|
27262
|
+
const u = i.length, p = i.reduce((y, x) => y + x, 0) / u, f = Math.min(...i), $ = Math.max(...i), h = u / o * 1e3, b = l / o * 100, v = b > 20 ? `Main thread blocked ${b.toFixed(1)}% of the time - STRONGLY recommend worker export` : b > 10 ? `Main thread blocked ${b.toFixed(1)}% of the time - consider worker export` : `Main thread blocked ${b.toFixed(1)}% of the time - performance is acceptable`;
|
|
27184
27263
|
return {
|
|
27185
27264
|
totalExports: u,
|
|
27186
27265
|
duration: o,
|
|
27187
27266
|
averageTime: p,
|
|
27188
27267
|
minTime: f,
|
|
27189
|
-
maxTime:
|
|
27268
|
+
maxTime: $,
|
|
27190
27269
|
totalMainThreadBlockTime: l,
|
|
27191
|
-
exportsPerSecond:
|
|
27192
|
-
recommendation:
|
|
27270
|
+
exportsPerSecond: h,
|
|
27271
|
+
recommendation: v
|
|
27193
27272
|
};
|
|
27194
27273
|
}
|
|
27195
27274
|
/**
|
|
@@ -27261,60 +27340,60 @@ const on = class on {
|
|
|
27261
27340
|
return "previewBackgroundColor" in t && delete t.previewBackgroundColor, t;
|
|
27262
27341
|
}
|
|
27263
27342
|
};
|
|
27264
|
-
|
|
27265
|
-
let
|
|
27266
|
-
const
|
|
27343
|
+
ln.CURRENT_VERSION = "2.0.0", ln.workerManager = null, ln.workerInitPromise = null;
|
|
27344
|
+
let xn = ln;
|
|
27345
|
+
const Ua = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
27267
27346
|
__proto__: null,
|
|
27268
|
-
ExportManager:
|
|
27269
|
-
default:
|
|
27347
|
+
ExportManager: xn,
|
|
27348
|
+
default: xn
|
|
27270
27349
|
}, Symbol.toStringTag, { value: "Module" }));
|
|
27271
27350
|
export {
|
|
27272
|
-
|
|
27273
|
-
|
|
27274
|
-
|
|
27275
|
-
|
|
27276
|
-
|
|
27277
|
-
|
|
27278
|
-
|
|
27279
|
-
|
|
27280
|
-
|
|
27281
|
-
|
|
27282
|
-
|
|
27283
|
-
|
|
27284
|
-
|
|
27285
|
-
|
|
27286
|
-
|
|
27287
|
-
|
|
27288
|
-
|
|
27289
|
-
|
|
27290
|
-
|
|
27291
|
-
|
|
27292
|
-
|
|
27293
|
-
|
|
27294
|
-
|
|
27295
|
-
|
|
27296
|
-
|
|
27297
|
-
|
|
27298
|
-
|
|
27299
|
-
|
|
27300
|
-
|
|
27301
|
-
|
|
27302
|
-
|
|
27303
|
-
|
|
27304
|
-
|
|
27305
|
-
|
|
27306
|
-
|
|
27307
|
-
|
|
27308
|
-
|
|
27309
|
-
|
|
27310
|
-
|
|
27311
|
-
|
|
27312
|
-
|
|
27313
|
-
|
|
27314
|
-
|
|
27315
|
-
|
|
27316
|
-
|
|
27317
|
-
|
|
27318
|
-
|
|
27351
|
+
Na as A,
|
|
27352
|
+
Re as B,
|
|
27353
|
+
gt as C,
|
|
27354
|
+
Oe as D,
|
|
27355
|
+
xn as E,
|
|
27356
|
+
mn as F,
|
|
27357
|
+
ua as G,
|
|
27358
|
+
la as H,
|
|
27359
|
+
ue as I,
|
|
27360
|
+
Oa as J,
|
|
27361
|
+
Dn as K,
|
|
27362
|
+
de as L,
|
|
27363
|
+
ha as M,
|
|
27364
|
+
ra as N,
|
|
27365
|
+
Hn as O,
|
|
27366
|
+
Kt as P,
|
|
27367
|
+
Yt as Q,
|
|
27368
|
+
st as R,
|
|
27369
|
+
Ua as S,
|
|
27370
|
+
J as T,
|
|
27371
|
+
un as W,
|
|
27372
|
+
Aa as a,
|
|
27373
|
+
xe as b,
|
|
27374
|
+
B as c,
|
|
27375
|
+
Ra as d,
|
|
27376
|
+
Ma as e,
|
|
27377
|
+
Ln as f,
|
|
27378
|
+
Ca as g,
|
|
27379
|
+
Ta as h,
|
|
27380
|
+
ct as i,
|
|
27381
|
+
_a as j,
|
|
27382
|
+
ka as k,
|
|
27383
|
+
dn as l,
|
|
27384
|
+
La as m,
|
|
27385
|
+
Fa as n,
|
|
27386
|
+
Zn as o,
|
|
27387
|
+
Ba as p,
|
|
27388
|
+
Pn as q,
|
|
27389
|
+
ft as r,
|
|
27390
|
+
Pa as s,
|
|
27391
|
+
Ea as t,
|
|
27392
|
+
ht as u,
|
|
27393
|
+
Ia as v,
|
|
27394
|
+
bt as w,
|
|
27395
|
+
ve as x,
|
|
27396
|
+
Da as y,
|
|
27397
|
+
re as z
|
|
27319
27398
|
};
|
|
27320
|
-
//# sourceMappingURL=ExportManager-
|
|
27399
|
+
//# sourceMappingURL=ExportManager-B8Td7uR5.js.map
|