@codingfactory/mediables-vue 2.4.9 → 2.4.11
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/{PixiFrameExporter-DPCwWe8X.cjs → PixiFrameExporter-BFSeVxaZ.cjs} +2 -2
- package/dist/{PixiFrameExporter-DPCwWe8X.cjs.map → PixiFrameExporter-BFSeVxaZ.cjs.map} +1 -1
- package/dist/{PixiFrameExporter-ECqRZTBE.js → PixiFrameExporter-RQEhkmOV.js} +2 -2
- package/dist/{PixiFrameExporter-ECqRZTBE.js.map → PixiFrameExporter-RQEhkmOV.js.map} +1 -1
- package/dist/{editor-Cw08D0SQ.js → editor-B9JJoibh.js} +232 -227
- package/dist/{editor-BUpGsg4D.cjs.map → editor-B9JJoibh.js.map} +1 -1
- package/dist/editor-DJk8cX17.cjs +42 -0
- package/dist/editor-DJk8cX17.cjs.map +1 -0
- package/dist/{index-DN3xPAXW.js → index-DVYNdIDl.js} +3976 -3971
- package/dist/{index-DN3xPAXW.js.map → index-DVYNdIDl.js.map} +1 -1
- package/dist/index-X57hziBV.cjs +342 -0
- package/dist/{index-Czunbwia.cjs.map → index-X57hziBV.cjs.map} +1 -1
- package/dist/mediables-vanilla.cjs +1 -1
- package/dist/mediables-vanilla.mjs +1 -1
- package/dist/mediables-vue.cjs +1 -1
- package/dist/mediables-vue.mjs +2 -2
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/dist/editor-BUpGsg4D.cjs +0 -42
- package/dist/editor-Cw08D0SQ.js.map +0 -1
- package/dist/index-Czunbwia.cjs +0 -342
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var j = (s, e, t) =>
|
|
1
|
+
var xe = Object.defineProperty;
|
|
2
|
+
var Ce = (s, e, t) => e in s ? xe(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t;
|
|
3
|
+
var j = (s, e, t) => Ce(s, typeof e != "symbol" ? e + "" : e, t);
|
|
4
4
|
import * as b from "pixi-filters";
|
|
5
5
|
import * as S from "pixi.js";
|
|
6
|
-
import { GlProgram as
|
|
7
|
-
class
|
|
6
|
+
import { GlProgram as we } from "pixi.js";
|
|
7
|
+
class O {
|
|
8
8
|
constructor() {
|
|
9
9
|
this._events = /* @__PURE__ */ new Map();
|
|
10
10
|
}
|
|
@@ -34,7 +34,7 @@ class B {
|
|
|
34
34
|
e ? this._events.delete(e) : this._events.clear();
|
|
35
35
|
}
|
|
36
36
|
}
|
|
37
|
-
class
|
|
37
|
+
class Se extends O {
|
|
38
38
|
constructor() {
|
|
39
39
|
super(), this._state = {
|
|
40
40
|
// Image state
|
|
@@ -189,10 +189,10 @@ class we extends B {
|
|
|
189
189
|
this.set("isDarkMode", this._state.theme === "dark");
|
|
190
190
|
}
|
|
191
191
|
}
|
|
192
|
-
function
|
|
193
|
-
return new
|
|
192
|
+
function ve() {
|
|
193
|
+
return new Se();
|
|
194
194
|
}
|
|
195
|
-
class
|
|
195
|
+
class ke extends O {
|
|
196
196
|
constructor() {
|
|
197
197
|
super(), this.app = null, this.sprite = null, this.originalTexture = null, this.baseTexture = null, this.fitScale = 1, this.zoom = 1, this._container = null, this._mountPromise = null;
|
|
198
198
|
}
|
|
@@ -346,8 +346,8 @@ class ve extends B {
|
|
|
346
346
|
else if (typeof _.getContext == "function") {
|
|
347
347
|
const C = document.createElement("canvas");
|
|
348
348
|
C.width = _.width, C.height = _.height;
|
|
349
|
-
const
|
|
350
|
-
|
|
349
|
+
const M = C.getContext("2d");
|
|
350
|
+
M && (M.drawImage(_, 0, 0), v = C.toDataURL(`image/${e}`, t));
|
|
351
351
|
}
|
|
352
352
|
return v || null;
|
|
353
353
|
} catch {
|
|
@@ -431,7 +431,7 @@ class ve extends B {
|
|
|
431
431
|
this.sprite = null, this.originalTexture = null, this.baseTexture = null, this._container = null, this.removeAllListeners();
|
|
432
432
|
}
|
|
433
433
|
}
|
|
434
|
-
const
|
|
434
|
+
const Pe = {
|
|
435
435
|
adjust: ["adjust", "advanced"],
|
|
436
436
|
// adjustment, adjustmentAdvanced, alpha, colorMatrix
|
|
437
437
|
blur: ["blur"],
|
|
@@ -447,7 +447,7 @@ const ke = {
|
|
|
447
447
|
stylize: ["stylize"]
|
|
448
448
|
// ascii, crt, crossHatch, dot, emboss
|
|
449
449
|
};
|
|
450
|
-
class
|
|
450
|
+
class Me extends O {
|
|
451
451
|
constructor(e, t) {
|
|
452
452
|
super(), this.state = e, this.renderer = t, this.instances = {}, this._filterRegistry = null;
|
|
453
453
|
}
|
|
@@ -482,7 +482,7 @@ class Pe extends B {
|
|
|
482
482
|
*/
|
|
483
483
|
getFiltersByCategory(e) {
|
|
484
484
|
if (!this._filterRegistry) return [];
|
|
485
|
-
const t =
|
|
485
|
+
const t = Pe[e] || [e], i = [], r = /* @__PURE__ */ new Set();
|
|
486
486
|
for (const a of t) {
|
|
487
487
|
const o = this._filterRegistry.getFiltersByCategory(a) || [];
|
|
488
488
|
for (const n of o)
|
|
@@ -624,7 +624,7 @@ class Pe extends B {
|
|
|
624
624
|
return this.instances[e] || null;
|
|
625
625
|
}
|
|
626
626
|
}
|
|
627
|
-
const
|
|
627
|
+
const I = class I extends O {
|
|
628
628
|
constructor(e, t) {
|
|
629
629
|
super(), this.state = e, this.renderer = t, this._overlayCanvas = null, this._isDragging = !1, this._dragStart = null, this._dragMode = null, this._startRect = null, this._hoverMode = null, this._lastAutoZoomCheck = 0, this.HANDLE_SIZE = 14, this.EDGE_HIT_PAD = 10, this._onPointerDown = this._handlePointerDown.bind(this), this._onPointerMove = this._handlePointerMove.bind(this), this._onPointerUp = this._handlePointerUp.bind(this);
|
|
630
630
|
}
|
|
@@ -701,7 +701,7 @@ const T = class T extends B {
|
|
|
701
701
|
if (!e || !r || !a || !o) return null;
|
|
702
702
|
const l = e.width > t, c = e.height > i;
|
|
703
703
|
if (!l && !c) return null;
|
|
704
|
-
const d =
|
|
704
|
+
const d = I.AUTO_ZOOM_PADDING;
|
|
705
705
|
let h = n;
|
|
706
706
|
if (l) {
|
|
707
707
|
const p = e.width / (d * r * o);
|
|
@@ -720,11 +720,11 @@ const T = class T extends B {
|
|
|
720
720
|
_checkAutoZoom() {
|
|
721
721
|
if (!this.state.get("autoZoomOnCropOverflow")) return;
|
|
722
722
|
const e = Date.now();
|
|
723
|
-
if (e - this._lastAutoZoomCheck <
|
|
723
|
+
if (e - this._lastAutoZoomCheck < I.AUTO_ZOOM_THROTTLE_MS) return;
|
|
724
724
|
this._lastAutoZoomCheck = e;
|
|
725
725
|
const t = this.state.get("crop.rect"), i = this.renderer.sprite, r = this.renderer.originalTexture;
|
|
726
726
|
if (!t || !i || !r) return;
|
|
727
|
-
const a =
|
|
727
|
+
const a = I.calcAutoZoom(
|
|
728
728
|
t,
|
|
729
729
|
i.width,
|
|
730
730
|
i.height,
|
|
@@ -894,10 +894,10 @@ const T = class T extends B {
|
|
|
894
894
|
if (h <= 0 || p <= 0) return null;
|
|
895
895
|
const g = new a.Container(), y = new a.Sprite(i);
|
|
896
896
|
if (this.state.get("crop.shape") === "circle") {
|
|
897
|
-
const V = Math.round(Math.max(h, p)),
|
|
898
|
-
m = Math.round(
|
|
899
|
-
const
|
|
900
|
-
typeof
|
|
897
|
+
const V = Math.round(Math.max(h, p)), ye = m + h / 2, _e = x + p / 2;
|
|
898
|
+
m = Math.round(ye - V / 2), x = Math.round(_e - V / 2), h = p = V;
|
|
899
|
+
const z = new a.Graphics();
|
|
900
|
+
typeof z.circle == "function" && typeof z.fill == "function" ? z.circle(h / 2, p / 2, h / 2).fill(16777215) : (z.beginFill(16777215, 1), z.drawCircle(h / 2, p / 2, h / 2), z.endFill()), y.mask = z, g.addChild(z);
|
|
901
901
|
}
|
|
902
902
|
y.x = -m, y.y = -x, g.addChild(y);
|
|
903
903
|
const _ = a.RenderTexture.create({ width: h, height: p });
|
|
@@ -910,8 +910,13 @@ const T = class T extends B {
|
|
|
910
910
|
v && v !== this.renderer.baseTexture && v.destroy(!0), this.renderer.originalTexture = _, e.stage.removeChild(t), t.destroy();
|
|
911
911
|
const C = new a.Sprite(_);
|
|
912
912
|
e.stage.addChild(C), this.renderer.sprite = C, this.renderer.fitScale = this.renderer.getFitScaleFor(_), this.renderer.setZoom(o, { keepCenter: !1 }), this.renderer.applyViewTransform(), this.renderer.render();
|
|
913
|
-
const
|
|
914
|
-
|
|
913
|
+
const M = this.state.get("crop.appliedRect"), me = M && Number.isFinite(M.x) && Number.isFinite(M.y) && Number.isFinite(M.width) && Number.isFinite(M.height) ? {
|
|
914
|
+
x: Math.round(M.x + m),
|
|
915
|
+
y: Math.round(M.y + x),
|
|
916
|
+
width: h,
|
|
917
|
+
height: p
|
|
918
|
+
} : { x: m, y: x, width: h, height: p }, ge = this.state.get("crop.shape") || "free", be = this.state.get("crop.aspect") || "free";
|
|
919
|
+
return this.disable(), this.state.set("crop.appliedRect", me), this.state.set("crop.appliedShape", ge), this.state.set("crop.appliedAspect", be), this.emit("applied", { width: h, height: p }), { texture: _, preservedZoom: o };
|
|
915
920
|
}
|
|
916
921
|
/**
|
|
917
922
|
* Apply a crop from saved texture-pixel coordinates (for state rehydration).
|
|
@@ -966,12 +971,12 @@ const T = class T extends B {
|
|
|
966
971
|
* Padding factor for auto-zoom: image will be ~91% of crop size (1/1.1).
|
|
967
972
|
* Higher values = more aggressive zoom-out, more padding around image.
|
|
968
973
|
*/
|
|
969
|
-
j(
|
|
974
|
+
j(I, "AUTO_ZOOM_PADDING", 1.1), /**
|
|
970
975
|
* Minimum interval (ms) between auto-zoom adjustments during drag.
|
|
971
976
|
*/
|
|
972
|
-
j(
|
|
973
|
-
let W =
|
|
974
|
-
class
|
|
977
|
+
j(I, "AUTO_ZOOM_THROTTLE_MS", 100);
|
|
978
|
+
let W = I;
|
|
979
|
+
class Fe {
|
|
975
980
|
/**
|
|
976
981
|
* Create a new RemoveBgManager
|
|
977
982
|
* @param {Object} options
|
|
@@ -1172,7 +1177,7 @@ function ce({ id: s, label: e, options: t = [], value: i, onChange: r }) {
|
|
|
1172
1177
|
n.value = l;
|
|
1173
1178
|
}, a;
|
|
1174
1179
|
}
|
|
1175
|
-
function
|
|
1180
|
+
function R({ label: s, className: e = "", onClick: t, icon: i = null, disabled: r = !1 }) {
|
|
1176
1181
|
const a = u("button", {
|
|
1177
1182
|
type: "button",
|
|
1178
1183
|
className: `btn ${e}`.trim(),
|
|
@@ -1218,8 +1223,8 @@ function Z({ label: s, icon: e, active: t = !1, onClick: i }) {
|
|
|
1218
1223
|
r.classList.toggle("active", a);
|
|
1219
1224
|
}, r;
|
|
1220
1225
|
}
|
|
1221
|
-
const he = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="48" d="M328 112L184 256l144 144"/></svg>', de = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="48" d="M184 112l144 144-144 144"/></svg>',
|
|
1222
|
-
class
|
|
1226
|
+
const he = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="48" d="M328 112L184 256l144 144"/></svg>', de = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="48" d="M184 112l144 144-144 144"/></svg>', Ae = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M221.09 64a157.09 157.09 0 10157.09 157.09A157.1 157.1 0 00221.09 64z"/><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M338.29 338.29L448 448M256 184v74m-37-37h74"/></svg>', ze = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M221.09 64a157.09 157.09 0 10157.09 157.09A157.1 157.1 0 00221.09 64z"/><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M338.29 338.29L448 448M184 221h74"/></svg>', Re = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M432 320v112H320M80 192V80h112M320 80h112v112M192 432H80V320"/></svg>', Ne = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M262.29 192.31a64 64 0 1057.4 57.4 64.13 64.13 0 00-57.4-57.4z"/><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M416.39 256a154.34 154.34 0 01-1.53 20.79l45.21 35.46a10.81 10.81 0 012.45 13.75l-42.77 74a10.81 10.81 0 01-13.14 4.59l-44.9-18.08a16.11 16.11 0 00-15.17 1.75A164.48 164.48 0 01325 400.8a15.94 15.94 0 00-8.82 12.14l-6.73 47.89a11.08 11.08 0 01-10.68 9.17h-85.54a11.11 11.11 0 01-10.69-8.87l-6.72-47.82a16.07 16.07 0 00-9-12.22 155.3 155.3 0 01-21.46-12.57 16 16 0 00-15.11-1.71l-44.89 18.07a10.81 10.81 0 01-13.14-4.58l-42.77-74a10.8 10.8 0 012.45-13.75l38.21-30a16.05 16.05 0 006-14.08c-.36-4.17-.58-8.33-.58-12.5s.21-8.27.58-12.35a16 16 0 00-6.07-13.94l-38.19-30A10.81 10.81 0 0149.48 186l42.77-74a10.81 10.81 0 0113.14-4.59l44.9 18.08a16.11 16.11 0 0015.17-1.75A164.48 164.48 0 01187 111.2a15.94 15.94 0 008.82-12.14l6.73-47.89A11.08 11.08 0 01213.23 42h85.54a11.11 11.11 0 0110.69 8.87l6.72 47.82a16.07 16.07 0 009 12.22 155.3 155.3 0 0121.46 12.57 16 16 0 0015.11 1.71l44.89-18.07a10.81 10.81 0 0113.14 4.58l42.77 74a10.8 10.8 0 01-2.45 13.75l-38.21 30a16.05 16.05 0 00-6.05 14.08c.33 4.14.55 8.3.55 12.47z"/></svg>', Te = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M400 320c0 88.37-55.63 144-144 144s-144-55.63-144-144c0-94.83 103.23-222.85 134.89-259.88a12 12 0 0118.23 0C296.77 97.15 400 225.17 400 320z"/><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M344 328a72 72 0 01-72 72"/></svg>', Ie = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-miterlimit="10" stroke-width="32" d="M430.11 347.9c-6.6-6.1-16.3-7.6-24.6-9-11.5-1.9-15.9-4-22.6-10-14.3-12.7-14.3-31.1 0-43.8l30.3-26.9c46.4-41 46.4-108.2 0-149.2-34.2-30.1-80.1-45-127.8-45-55.7 0-113.9 20.3-158.8 60.1-83.5 73.8-83.5 194.7 0 268.5 41.5 36.7 97.5 55 152.9 55.4h1.7c55.4 0 110-17.9 148.8-52.4 14.4-12.7 11.99-36.6.1-47.7z"/><circle cx="144" cy="208" r="32"/><circle cx="152" cy="311" r="32"/><circle cx="224" cy="144" r="32"/><circle cx="256" cy="367" r="32"/><circle cx="328" cy="144" r="32"/></svg>', Ee = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M259.92 262.91L216.4 149.77a9 9 0 00-16.8 0l-43.52 113.14a9 9 0 01-5.17 5.17L37.77 311.6a9 9 0 000 16.8l113.14 43.52a9 9 0 015.17 5.17l43.52 113.14a9 9 0 0016.8 0l43.52-113.14a9 9 0 015.17-5.17l113.14-43.52a9 9 0 000-16.8l-113.14-43.52a9 9 0 01-5.17-5.17zM108 68L88 16 68 68 16 88l52 20 20 52 20-52 52-20-52-20zM426.67 117.33L400 48l-26.67 69.33L304 144l69.33 26.67L400 240l26.67-69.33L496 144l-69.33-26.67z"/></svg>', Xe = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M176 112l80-80 80 80M255.98 32l.02 448M176 400l80 80 80-80M400 176l80 80-80 80M112 176l-80 80 80 80M32 256h448"/></svg>', Ye = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M315.27 33L96 304h128l-31.51 173.23a2.36 2.36 0 002.33 2.77h0a2.36 2.36 0 001.89-.95L416 208H288l31.66-173.25a2.45 2.45 0 00-2.44-2.75h0a2.42 2.42 0 00-1.95 1z"/></svg>', ue = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M144 48v272a48 48 0 0048 48h272"/><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M368 464V192a48 48 0 00-48-48H48"/></svg>', Be = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M380.93 57.37A32 32 0 00358.3 48H94.22A46.21 46.21 0 0048 94.22v323.56A46.21 46.21 0 0094.22 464h323.56A46.36 46.36 0 00464 417.78V153.7a32 32 0 00-9.37-22.63zM256 416a64 64 0 1164-64 63.92 63.92 0 01-64 64zm48-224H112a16 16 0 01-16-16v-64a16 16 0 0116-16h192a16 16 0 0116 16v64a16 16 0 01-16 16z"/></svg>', K = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M368 368L144 144M368 144L144 368"/></svg>', pe = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M320 146s24.36-12-64-12a160 160 0 10160 160"/><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M256 58l80 80-80 80"/></svg>', Oe = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M112 112l20 320c.95 18.49 14.4 32 32 32h184c17.67 0 30.87-13.51 32-32l20-320"/><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="32" d="M80 112h352"/><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M192 112V72h0a23.93 23.93 0 0124-24h80a23.93 23.93 0 0124 24h0v40M256 176v224M184 176l8 224M328 176l-8 224"/></svg>', Le = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M64 192v-72a40 40 0 0140-40h75.89a40 40 0 0122.19 6.72l27.84 18.56a40 40 0 0022.19 6.72H408a40 40 0 0140 40v40"/><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M479.9 226.55L463.68 392a40 40 0 01-39.93 40H88.25a40 40 0 01-39.93-40L32.1 226.55A32 32 0 0164 192h384.1a32 32 0 0131.8 34.55z"/></svg>', G = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M416 128L192 384l-96-96"/></svg>', De = '<svg viewBox="0 0 512 512" width="20" height="20"><rect x="64" y="64" width="384" height="384" rx="48" fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="32"/></svg>', Ue = '<svg viewBox="0 0 512 512" width="20" height="20"><circle cx="256" cy="256" r="208" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/></svg>', Ve = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M80 96h64l64 320h64l64-160h96"/></svg>', Q = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="32" d="M256 48v48M256 416v48M403.08 108.92l-33.94 33.94M142.86 369.14l-33.94 33.94M464 256h-48M96 256H48M403.08 403.08l-33.94-33.94M142.86 142.86l-33.94-33.94"/><circle cx="256" cy="256" r="80" fill="none" stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="32"/></svg>', J = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M160 136c0-30.62 4.51-61.61 16-88C99.57 81.27 48 159.32 48 248c0 119.29 96.71 216 216 216 88.68 0 166.73-51.57 200-128-26.39 11.49-57.38 16-88 16-119.29 0-216-96.71-216-216z"/></svg>', je = '<svg viewBox="0 0 512 512" width="20" height="20"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M436 80H76a44.05 44.05 0 00-44 44v264a44.05 44.05 0 0044 44h360a44.05 44.05 0 0044-44V124a44.05 44.05 0 00-44-44z"/><circle cx="256" cy="256" r="80" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M220 80v56M292 80v56M220 376v56M292 376v56M80 144h56M80 224h56M80 304h56M376 144h56M376 224h56M376 304h56"/></svg>';
|
|
1227
|
+
class qe {
|
|
1223
1228
|
constructor(e, t) {
|
|
1224
1229
|
this.state = e, this.editor = t, this.element = null, this._unsubscribers = [];
|
|
1225
1230
|
}
|
|
@@ -1230,7 +1235,7 @@ class je {
|
|
|
1230
1235
|
render() {
|
|
1231
1236
|
this.element = u("div", { className: "editor-toolbar" });
|
|
1232
1237
|
const e = u("div", { className: "toolbar-section toolbar-left" }), t = w({
|
|
1233
|
-
icon:
|
|
1238
|
+
icon: Le,
|
|
1234
1239
|
title: "Open Image",
|
|
1235
1240
|
className: "toolbar-btn",
|
|
1236
1241
|
testId: "btn-open-image",
|
|
@@ -1239,7 +1244,7 @@ class je {
|
|
|
1239
1244
|
});
|
|
1240
1245
|
e.appendChild(t);
|
|
1241
1246
|
const i = u("div", { className: "toolbar-section toolbar-center" }), r = w({
|
|
1242
|
-
icon:
|
|
1247
|
+
icon: ze,
|
|
1243
1248
|
title: "Zoom Out",
|
|
1244
1249
|
className: "toolbar-btn",
|
|
1245
1250
|
testId: "btn-zoom-out",
|
|
@@ -1256,7 +1261,7 @@ class je {
|
|
|
1256
1261
|
role: "status"
|
|
1257
1262
|
}, "100%");
|
|
1258
1263
|
const a = w({
|
|
1259
|
-
icon:
|
|
1264
|
+
icon: Ae,
|
|
1260
1265
|
title: "Zoom In",
|
|
1261
1266
|
className: "toolbar-btn",
|
|
1262
1267
|
testId: "btn-zoom-in",
|
|
@@ -1266,7 +1271,7 @@ class je {
|
|
|
1266
1271
|
this.editor.setZoom(h + 0.25);
|
|
1267
1272
|
}
|
|
1268
1273
|
}), o = w({
|
|
1269
|
-
icon:
|
|
1274
|
+
icon: Re,
|
|
1270
1275
|
title: "Fit to Screen",
|
|
1271
1276
|
className: "toolbar-btn",
|
|
1272
1277
|
testId: "btn-fit-screen",
|
|
@@ -1300,7 +1305,7 @@ class je {
|
|
|
1300
1305
|
ariaLabel: "Reset all changes",
|
|
1301
1306
|
onClick: () => this.editor.resetAll()
|
|
1302
1307
|
}), c = w({
|
|
1303
|
-
icon:
|
|
1308
|
+
icon: Be,
|
|
1304
1309
|
title: "Save Image",
|
|
1305
1310
|
className: "toolbar-btn toolbar-btn-primary",
|
|
1306
1311
|
testId: "btn-save-edit",
|
|
@@ -1349,23 +1354,23 @@ class je {
|
|
|
1349
1354
|
}
|
|
1350
1355
|
}
|
|
1351
1356
|
const L = [
|
|
1352
|
-
{ id: "adjust", name: "Adjust", icon:
|
|
1357
|
+
{ id: "adjust", name: "Adjust", icon: Ne },
|
|
1353
1358
|
// adjustment, adjustmentAdvanced, alpha
|
|
1354
|
-
{ id: "blur", name: "Blur", icon:
|
|
1359
|
+
{ id: "blur", name: "Blur", icon: Te },
|
|
1355
1360
|
// blur, kawaseBlur, motionBlur, radialBlur, etc.
|
|
1356
|
-
{ id: "color", name: "Color", icon:
|
|
1361
|
+
{ id: "color", name: "Color", icon: Ie },
|
|
1357
1362
|
// colorOverlay, grayscale, hslAdjustment, etc.
|
|
1358
|
-
{ id: "effects", name: "Effects", icon:
|
|
1363
|
+
{ id: "effects", name: "Effects", icon: Ee },
|
|
1359
1364
|
// noise, vignette, pixelate, dropShadow, etc.
|
|
1360
|
-
{ id: "distortion", name: "Distortion", icon:
|
|
1365
|
+
{ id: "distortion", name: "Distortion", icon: Xe },
|
|
1361
1366
|
// twist, bulgePinch, displacement, etc.
|
|
1362
|
-
{ id: "light", name: "Light", icon:
|
|
1367
|
+
{ id: "light", name: "Light", icon: Ye },
|
|
1363
1368
|
// bloom, glow, godray, advancedBloom
|
|
1364
|
-
{ id: "stylize", name: "Stylize", icon:
|
|
1369
|
+
{ id: "stylize", name: "Stylize", icon: je },
|
|
1365
1370
|
// ascii, crt, crossHatch, dot, emboss
|
|
1366
1371
|
{ id: "crop", name: "Crop", icon: ue }
|
|
1367
1372
|
];
|
|
1368
|
-
class
|
|
1373
|
+
class He {
|
|
1369
1374
|
constructor(e, t) {
|
|
1370
1375
|
this.state = e, this.editor = t, this.element = null, this._chips = /* @__PURE__ */ new Map(), this._scrollIndex = 0, this._unsubscribers = [];
|
|
1371
1376
|
}
|
|
@@ -1500,7 +1505,7 @@ class qe {
|
|
|
1500
1505
|
this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._chips.clear(), (e = this.element) == null || e.remove(), this.element = null;
|
|
1501
1506
|
}
|
|
1502
1507
|
}
|
|
1503
|
-
class
|
|
1508
|
+
class $e {
|
|
1504
1509
|
constructor(e, t) {
|
|
1505
1510
|
this.state = e, this.filterManager = t, this.element = null, this._filterCards = /* @__PURE__ */ new Map(), this._scrollIndex = 0, this._unsubscribers = [], this._onToggle = null, this._onSelect = null;
|
|
1506
1511
|
}
|
|
@@ -1657,7 +1662,7 @@ class He {
|
|
|
1657
1662
|
this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._filterCards.clear(), (e = this.element) == null || e.remove(), this.element = null;
|
|
1658
1663
|
}
|
|
1659
1664
|
}
|
|
1660
|
-
class
|
|
1665
|
+
class We {
|
|
1661
1666
|
constructor(e, t) {
|
|
1662
1667
|
this.state = e, this.filterManager = t, this.element = null, this._controls = /* @__PURE__ */ new Map(), this._onChange = null, this._onReset = null, this._onAction = null, this._unsubscribers = [];
|
|
1663
1668
|
}
|
|
@@ -1702,7 +1707,7 @@ class $e {
|
|
|
1702
1707
|
return;
|
|
1703
1708
|
}
|
|
1704
1709
|
const i = u("div", { className: "adjustments-header" });
|
|
1705
|
-
i.appendChild(u("span", { className: "adjustments-title" }, t.name)), i.appendChild(
|
|
1710
|
+
i.appendChild(u("span", { className: "adjustments-title" }, t.name)), i.appendChild(R({
|
|
1706
1711
|
label: "Reset",
|
|
1707
1712
|
className: "btn-text",
|
|
1708
1713
|
onClick: () => this._handleReset(e)
|
|
@@ -1759,7 +1764,7 @@ class $e {
|
|
|
1759
1764
|
});
|
|
1760
1765
|
case "button":
|
|
1761
1766
|
const n = u("div", { className: "button-control" });
|
|
1762
|
-
return n.appendChild(
|
|
1767
|
+
return n.appendChild(R({
|
|
1763
1768
|
label: r,
|
|
1764
1769
|
className: "btn-secondary",
|
|
1765
1770
|
onClick: () => this._handleAction(e, t.action || t.id)
|
|
@@ -1860,7 +1865,7 @@ class $e {
|
|
|
1860
1865
|
this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._controls.clear(), (e = this.element) == null || e.remove(), this.element = null;
|
|
1861
1866
|
}
|
|
1862
1867
|
}
|
|
1863
|
-
class
|
|
1868
|
+
class Ze {
|
|
1864
1869
|
constructor(e, t) {
|
|
1865
1870
|
this.state = e, this.filterManager = t, this._drawer = null, this._body = null, this._titleEl = null, this._isOpen = !1, this._currentFilterId = null, this._controls = /* @__PURE__ */ new Map(), this._onChange = null, this._onReset = null, this._onRemove = null, this._onAction = null, this._container = null;
|
|
1866
1871
|
}
|
|
@@ -1873,14 +1878,14 @@ class We {
|
|
|
1873
1878
|
this._onChange = t, this._onReset = i, this._onRemove = r, this._onAction = a, this._container = e, this._drawer = u("div", { className: "mobile-filter-drawer" });
|
|
1874
1879
|
const o = u("div", { className: "drawer-header" });
|
|
1875
1880
|
this._titleEl = u("span", { className: "drawer-title" }, "Filter");
|
|
1876
|
-
const n = u("div", { className: "drawer-header-actions" }), l =
|
|
1881
|
+
const n = u("div", { className: "drawer-header-actions" }), l = R({
|
|
1877
1882
|
label: "Reset",
|
|
1878
1883
|
className: "btn-text",
|
|
1879
1884
|
onClick: () => {
|
|
1880
1885
|
var h;
|
|
1881
1886
|
this._currentFilterId && ((h = this._onReset) == null || h.call(this, this._currentFilterId), this._renderControls());
|
|
1882
1887
|
}
|
|
1883
|
-
}), c =
|
|
1888
|
+
}), c = R({
|
|
1884
1889
|
label: "Remove",
|
|
1885
1890
|
className: "btn-text btn-danger",
|
|
1886
1891
|
onClick: () => {
|
|
@@ -2009,7 +2014,7 @@ class We {
|
|
|
2009
2014
|
}
|
|
2010
2015
|
case "button": {
|
|
2011
2016
|
const o = u("div", { className: "button-control" });
|
|
2012
|
-
return o.appendChild(
|
|
2017
|
+
return o.appendChild(R({
|
|
2013
2018
|
label: r,
|
|
2014
2019
|
className: "btn-secondary",
|
|
2015
2020
|
onClick: () => {
|
|
@@ -2056,7 +2061,7 @@ class We {
|
|
|
2056
2061
|
this._controls.clear(), (e = this._drawer) == null || e.remove(), this._drawer = null, this._isOpen = !1, this._currentFilterId = null, this._container = null;
|
|
2057
2062
|
}
|
|
2058
2063
|
}
|
|
2059
|
-
class
|
|
2064
|
+
class Ge {
|
|
2060
2065
|
constructor(e, t) {
|
|
2061
2066
|
this.state = e, this.filterManager = t, this.element = null, this._scrollContainer = null, this._chips = /* @__PURE__ */ new Map(), this._unsubscribers = [], this._onToggle = null, this._onSelect = null;
|
|
2062
2067
|
}
|
|
@@ -2129,11 +2134,11 @@ class Ze {
|
|
|
2129
2134
|
this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._chips.clear(), (e = this.element) == null || e.remove(), this.element = null;
|
|
2130
2135
|
}
|
|
2131
2136
|
}
|
|
2132
|
-
const
|
|
2133
|
-
{ id: "free", name: "Free", icon:
|
|
2134
|
-
{ id: "square", name: "Square", icon:
|
|
2135
|
-
{ id: "circle", name: "Circle", icon:
|
|
2136
|
-
],
|
|
2137
|
+
const Ke = [
|
|
2138
|
+
{ id: "free", name: "Free", icon: Ve },
|
|
2139
|
+
{ id: "square", name: "Square", icon: De },
|
|
2140
|
+
{ id: "circle", name: "Circle", icon: Ue }
|
|
2141
|
+
], Qe = [
|
|
2137
2142
|
{ id: "free", name: "Free" },
|
|
2138
2143
|
{ id: "1:1", name: "1:1" },
|
|
2139
2144
|
{ id: "4:3", name: "4:3" },
|
|
@@ -2141,7 +2146,7 @@ const Ge = [
|
|
|
2141
2146
|
{ id: "3:2", name: "3:2" },
|
|
2142
2147
|
{ id: "2:3", name: "2:3" }
|
|
2143
2148
|
];
|
|
2144
|
-
class
|
|
2149
|
+
class Je {
|
|
2145
2150
|
constructor(e, t) {
|
|
2146
2151
|
this.state = e, this.cropManager = t, this.element = null, this._shapeChips = /* @__PURE__ */ new Map(), this._aspectChips = /* @__PURE__ */ new Map(), this._unsubscribers = [];
|
|
2147
2152
|
}
|
|
@@ -2165,7 +2170,7 @@ class Qe {
|
|
|
2165
2170
|
const e = u("div", { className: "crop-section" });
|
|
2166
2171
|
e.appendChild(u("label", { className: "section-label" }, "Shape"));
|
|
2167
2172
|
const t = u("div", { className: "chip-row" }), i = this.state.get("crop.shape");
|
|
2168
|
-
|
|
2173
|
+
Ke.forEach((c) => {
|
|
2169
2174
|
const d = Z({
|
|
2170
2175
|
label: c.name,
|
|
2171
2176
|
icon: c.icon,
|
|
@@ -2175,7 +2180,7 @@ class Qe {
|
|
|
2175
2180
|
d.dataset.shape = c.id, d.dataset.testid = `crop-shape-${c.id}`, this._shapeChips.set(c.id, d), t.appendChild(d);
|
|
2176
2181
|
}), e.appendChild(t), this.element.appendChild(e), this.state.get("lockCropShape") && (e.style.display = "none"), this._shapeSection = e, this._aspectSection = u("div", { className: "crop-section" }), this._aspectSection.appendChild(u("label", { className: "section-label" }, "Aspect Ratio"));
|
|
2177
2182
|
const r = u("div", { className: "chip-row aspect-row" }), a = this.state.get("crop.aspect");
|
|
2178
|
-
|
|
2183
|
+
Qe.forEach((c) => {
|
|
2179
2184
|
const d = Z({
|
|
2180
2185
|
label: c.name,
|
|
2181
2186
|
active: a === c.id,
|
|
@@ -2183,14 +2188,14 @@ class Qe {
|
|
|
2183
2188
|
});
|
|
2184
2189
|
d.dataset.ratio = c.id, d.dataset.testid = `crop-ratio-${c.id}`, this._aspectChips.set(c.id, d), r.appendChild(d);
|
|
2185
2190
|
}), this._aspectSection.appendChild(r), this.element.appendChild(this._aspectSection), this._updateAspectVisibility();
|
|
2186
|
-
const o = u("div", { className: "crop-actions" }), n =
|
|
2191
|
+
const o = u("div", { className: "crop-actions" }), n = R({
|
|
2187
2192
|
label: "Cancel",
|
|
2188
2193
|
className: "btn-secondary crop-cancel-btn",
|
|
2189
2194
|
icon: K,
|
|
2190
2195
|
onClick: () => this.cropManager.cancel()
|
|
2191
2196
|
});
|
|
2192
2197
|
n.dataset.testid = "cancel-crop";
|
|
2193
|
-
const l =
|
|
2198
|
+
const l = R({
|
|
2194
2199
|
label: "Apply Crop",
|
|
2195
2200
|
className: "btn-primary crop-apply-btn",
|
|
2196
2201
|
icon: G,
|
|
@@ -2256,7 +2261,7 @@ class Qe {
|
|
|
2256
2261
|
this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._shapeChips.clear(), this._aspectChips.clear(), (e = this.element) == null || e.remove(), this.element = null;
|
|
2257
2262
|
}
|
|
2258
2263
|
}
|
|
2259
|
-
class
|
|
2264
|
+
class et {
|
|
2260
2265
|
constructor(e, t) {
|
|
2261
2266
|
this.state = e, this.filterManager = t, this.element = null, this._filterItems = /* @__PURE__ */ new Map(), this._unsubscribers = [], this._onRemove = null, this._onReset = null, this._onClearAll = null, this._onUpdateValue = null, this._onSelect = null;
|
|
2262
2267
|
}
|
|
@@ -2272,7 +2277,7 @@ class Je {
|
|
|
2272
2277
|
});
|
|
2273
2278
|
const o = u("div", { className: "panel-header" });
|
|
2274
2279
|
o.appendChild(u("h3", { className: "panel-title" }, "Active Filters"));
|
|
2275
|
-
const n =
|
|
2280
|
+
const n = R({
|
|
2276
2281
|
label: "Clear All",
|
|
2277
2282
|
className: "btn-text btn-danger",
|
|
2278
2283
|
onClick: () => this._handleClearAll()
|
|
@@ -2344,7 +2349,7 @@ class Je {
|
|
|
2344
2349
|
className: "btn-icon-sm",
|
|
2345
2350
|
onClick: () => this._handleReset(e)
|
|
2346
2351
|
}), d = w({
|
|
2347
|
-
icon:
|
|
2352
|
+
icon: Oe,
|
|
2348
2353
|
title: "Remove filter",
|
|
2349
2354
|
className: "btn-icon-sm btn-danger",
|
|
2350
2355
|
onClick: () => this._handleRemove(e)
|
|
@@ -2457,7 +2462,7 @@ class Je {
|
|
|
2457
2462
|
this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._filterItems.clear(), (e = this.element) == null || e.remove(), this.element = null;
|
|
2458
2463
|
}
|
|
2459
2464
|
}
|
|
2460
|
-
const
|
|
2465
|
+
const B = {
|
|
2461
2466
|
name: "free",
|
|
2462
2467
|
initialMode: "filters",
|
|
2463
2468
|
cropShape: "free",
|
|
@@ -2471,10 +2476,10 @@ const Y = {
|
|
|
2471
2476
|
maxExportHeight: void 0
|
|
2472
2477
|
}, H = {
|
|
2473
2478
|
free: {
|
|
2474
|
-
...
|
|
2479
|
+
...B
|
|
2475
2480
|
},
|
|
2476
2481
|
avatar: {
|
|
2477
|
-
...
|
|
2482
|
+
...B,
|
|
2478
2483
|
name: "avatar",
|
|
2479
2484
|
initialMode: "crop",
|
|
2480
2485
|
cropShape: "circle",
|
|
@@ -2484,7 +2489,7 @@ const Y = {
|
|
|
2484
2489
|
lockAspectRatio: !0
|
|
2485
2490
|
},
|
|
2486
2491
|
banner: {
|
|
2487
|
-
...
|
|
2492
|
+
...B,
|
|
2488
2493
|
name: "banner",
|
|
2489
2494
|
initialMode: "crop",
|
|
2490
2495
|
cropShape: "square",
|
|
@@ -2494,7 +2499,7 @@ const Y = {
|
|
|
2494
2499
|
lockAspectRatio: !0
|
|
2495
2500
|
},
|
|
2496
2501
|
product: {
|
|
2497
|
-
...
|
|
2502
|
+
...B,
|
|
2498
2503
|
name: "product",
|
|
2499
2504
|
initialMode: "filters",
|
|
2500
2505
|
cropShape: "square",
|
|
@@ -2504,15 +2509,15 @@ const Y = {
|
|
|
2504
2509
|
lockAspectRatio: !1
|
|
2505
2510
|
}
|
|
2506
2511
|
};
|
|
2507
|
-
function
|
|
2512
|
+
function tt(s) {
|
|
2508
2513
|
if (!s)
|
|
2509
2514
|
return { ...H.free };
|
|
2510
2515
|
if (typeof s == "object" && s !== null)
|
|
2511
|
-
return { ...
|
|
2516
|
+
return { ...B, ...s };
|
|
2512
2517
|
const e = H[s];
|
|
2513
2518
|
return e ? { ...e } : { ...H.free };
|
|
2514
2519
|
}
|
|
2515
|
-
class
|
|
2520
|
+
class ii extends O {
|
|
2516
2521
|
/**
|
|
2517
2522
|
* Create a new VanillaImageEditor
|
|
2518
2523
|
* @param {HTMLElement} container - Container element to mount the editor
|
|
@@ -2523,7 +2528,7 @@ class ei extends B {
|
|
|
2523
2528
|
if (super(), !e)
|
|
2524
2529
|
throw new Error("VanillaImageEditor: container element is required");
|
|
2525
2530
|
this._container = e, this._destroyed = !1, this._loadVersion = 0, this._objectUrls = /* @__PURE__ */ new Set();
|
|
2526
|
-
const i = t.preset ?
|
|
2531
|
+
const i = t.preset ? tt(t.preset) : null, r = i ? {
|
|
2527
2532
|
initialMode: i.initialMode === "crop" ? "crop" : "adjust",
|
|
2528
2533
|
cropShape: i.cropShape,
|
|
2529
2534
|
initialAspectRatio: i.aspectRatio
|
|
@@ -2541,7 +2546,7 @@ class ei extends B {
|
|
|
2541
2546
|
},
|
|
2542
2547
|
...r,
|
|
2543
2548
|
...t
|
|
2544
|
-
}, this._preset = i, this._state =
|
|
2549
|
+
}, this._preset = i, this._state = ve(), this._state.set("theme", this._options.theme), this._state.set("crop.shape", this._options.cropShape), this._state.set("crop.aspect", this._options.initialAspectRatio), this._preset && (this._state.set("lockCropShape", !!this._preset.lockCropShape), this._state.set("lockAspectRatio", !!this._preset.lockAspectRatio), this._state.set("showFilters", this._preset.showFilters !== !1), this._state.set("showCropControls", this._preset.showCropControls !== !1), this._state.set("autoZoomOnCropOverflow", !!this._preset.autoZoomOnCropOverflow)), this._renderer = new ke(), this._filterManager = new Me(this._state, this._renderer), this._cropManager = new W(this._state, this._renderer), this._removeBgManager = null, ((a = this._options.backgroundRemoval) == null ? void 0 : a.enabled) !== !1 && (this._removeBgManager = new Fe({
|
|
2545
2550
|
endpoint: (o = this._options.backgroundRemoval) == null ? void 0 : o.endpoint,
|
|
2546
2551
|
fallbackEndpoint: (n = this._options.backgroundRemoval) == null ? void 0 : n.fallbackEndpoint
|
|
2547
2552
|
})), this._loadingOverlay = null, this._isMobile = typeof window < "u" ? window.innerWidth <= 768 : !1, this._toolbar = null, this._categoryCarousel = null, this._filterCarousel = null, this._filterAdjustments = null, this._mobileFilterDrawer = null, this._mobileActiveFilters = null, this._cropControls = null, this._activeFiltersPanel = null, this._editorEl = null, this._canvasContainer = null, this._cropOverlay = null, this._controlsSection = null, this._filterControlsEl = null, this._fileInput = null, this._resizeObserver = null, this._init();
|
|
@@ -2577,31 +2582,31 @@ class ei extends B {
|
|
|
2577
2582
|
* Initialize UI components
|
|
2578
2583
|
*/
|
|
2579
2584
|
_initUI() {
|
|
2580
|
-
this._toolbar = new
|
|
2585
|
+
this._toolbar = new qe(this._state, this), this._toolbarContainer.appendChild(this._toolbar.render()), this._filterControlsEl = u("div", { className: "filter-controls-container" }), this._categoryCarousel = new He(this._state, this), this._filterControlsEl.appendChild(this._categoryCarousel.render((r) => {
|
|
2581
2586
|
}));
|
|
2582
2587
|
const e = u("div", { className: "filter-layout" }), t = u("div", { className: "filter-left-column" });
|
|
2583
|
-
this._filterCarousel = new
|
|
2588
|
+
this._filterCarousel = new $e(this._state, this._filterManager), t.appendChild(this._filterCarousel.render({
|
|
2584
2589
|
onToggle: (r, a) => this._handleFilterToggle(r, a),
|
|
2585
2590
|
onSelect: (r) => {
|
|
2586
2591
|
this._handleFilterSelect(r), this._isMobile && this._mobileFilterDrawer && this._mobileFilterDrawer.open(r);
|
|
2587
2592
|
}
|
|
2588
|
-
})), this._filterAdjustments = new
|
|
2593
|
+
})), this._filterAdjustments = new We(this._state, this._filterManager), t.appendChild(this._filterAdjustments.render({
|
|
2589
2594
|
onChange: (r, a, o) => this._handleFilterChange(r, a, o),
|
|
2590
2595
|
onReset: (r) => this._handleFilterReset(r),
|
|
2591
2596
|
onAction: (r, a) => this._handleFilterAction(r, a)
|
|
2592
2597
|
})), e.appendChild(t);
|
|
2593
2598
|
const i = u("div", { className: "filter-right-column" });
|
|
2594
|
-
this._activeFiltersPanel = new
|
|
2599
|
+
this._activeFiltersPanel = new et(this._state, this._filterManager), i.appendChild(this._activeFiltersPanel.render({
|
|
2595
2600
|
onRemove: (r) => this._handleFilterToggle(r, !1),
|
|
2596
2601
|
onReset: (r) => this._handleFilterReset(r),
|
|
2597
2602
|
onClearAll: () => this.resetAll(),
|
|
2598
2603
|
onSelect: (r) => this._handleFilterSelect(r)
|
|
2599
|
-
})), e.appendChild(i), this._filterControlsEl.appendChild(e), this._mobileActiveFilters = new
|
|
2604
|
+
})), e.appendChild(i), this._filterControlsEl.appendChild(e), this._mobileActiveFilters = new Ge(this._state, this._filterManager), this._filterControlsEl.appendChild(this._mobileActiveFilters.render({
|
|
2600
2605
|
onToggle: (r, a) => this._handleFilterToggle(r, a),
|
|
2601
2606
|
onSelect: (r) => {
|
|
2602
2607
|
this._handleFilterSelect(r), this._isMobile && this._mobileFilterDrawer && this._mobileFilterDrawer.open(r);
|
|
2603
2608
|
}
|
|
2604
|
-
})), this._cropControls = new
|
|
2609
|
+
})), this._cropControls = new Je(this._state, this._cropManager), this._cropControlsEl = this._cropControls.render(), this._cropControlsEl.style.display = "none", this._controlsSection.appendChild(this._filterControlsEl), this._controlsSection.appendChild(this._cropControlsEl), this._mobileFilterDrawer = new Ze(this._state, this._filterManager), this._mobileFilterDrawer.build(this._controlsSection, {
|
|
2605
2610
|
onChange: (r, a, o) => this._handleFilterChange(r, a, o),
|
|
2606
2611
|
onReset: (r) => this._handleFilterReset(r),
|
|
2607
2612
|
onRemove: (r) => {
|
|
@@ -2958,21 +2963,21 @@ class ei extends B {
|
|
|
2958
2963
|
this._objectUrls.clear(), (e = this._resizeObserver) == null || e.disconnect(), this._renderer.destroy(), this._cropManager.disable(), this._handleWindowResize && window.removeEventListener("resize", this._handleWindowResize), (t = this._toolbar) == null || t.destroy(), (i = this._categoryCarousel) == null || i.destroy(), (r = this._filterCarousel) == null || r.destroy(), (a = this._filterAdjustments) == null || a.destroy(), (o = this._mobileFilterDrawer) == null || o.destroy(), (n = this._mobileActiveFilters) == null || n.destroy(), (l = this._cropControls) == null || l.destroy(), (c = this._activeFiltersPanel) == null || c.destroy(), (d = this._editorEl) == null || d.remove(), this._container = null, this._state = null, this.emit("destroyed"), this.removeAllListeners();
|
|
2959
2964
|
}
|
|
2960
2965
|
}
|
|
2961
|
-
const k = /* @__PURE__ */ new Map(),
|
|
2962
|
-
function
|
|
2966
|
+
const k = /* @__PURE__ */ new Map(), E = /* @__PURE__ */ new Map();
|
|
2967
|
+
function it(s, e) {
|
|
2963
2968
|
return !Array.isArray(s.mediaTargets) || s.mediaTargets.length === 0 ? !0 : s.mediaTargets.includes(e);
|
|
2964
2969
|
}
|
|
2965
2970
|
function f(s) {
|
|
2966
2971
|
var e;
|
|
2967
|
-
return k.has(s.id), k.set(s.id, s),
|
|
2972
|
+
return k.has(s.id), k.set(s.id, s), E.has(s.category) || E.set(s.category, []), (e = E.get(s.category)) == null || e.push(s.id), s;
|
|
2968
2973
|
}
|
|
2969
|
-
function
|
|
2974
|
+
function rt(s) {
|
|
2970
2975
|
return k.get(s);
|
|
2971
2976
|
}
|
|
2972
2977
|
function U() {
|
|
2973
2978
|
return Array.from(k.values());
|
|
2974
2979
|
}
|
|
2975
|
-
function
|
|
2980
|
+
function st() {
|
|
2976
2981
|
U().map((t) => t.id), Object.entries(b).filter(
|
|
2977
2982
|
(t) => /Filter$/.test(t[0]) && typeof t[1] == "function"
|
|
2978
2983
|
).forEach(([t, i]) => {
|
|
@@ -2996,32 +3001,32 @@ function rt() {
|
|
|
2996
3001
|
});
|
|
2997
3002
|
});
|
|
2998
3003
|
}
|
|
2999
|
-
function
|
|
3000
|
-
return (
|
|
3004
|
+
function at(s) {
|
|
3005
|
+
return (E.get(s) || []).map((t) => k.get(t)).filter(Boolean);
|
|
3001
3006
|
}
|
|
3002
|
-
function
|
|
3003
|
-
return Array.from(
|
|
3007
|
+
function ot() {
|
|
3008
|
+
return Array.from(E.keys());
|
|
3004
3009
|
}
|
|
3005
|
-
function
|
|
3010
|
+
function ri(s) {
|
|
3006
3011
|
return k.has(s);
|
|
3007
3012
|
}
|
|
3008
|
-
function
|
|
3013
|
+
function nt(s) {
|
|
3009
3014
|
const e = k.get(s);
|
|
3010
3015
|
if (!e)
|
|
3011
3016
|
return !1;
|
|
3012
3017
|
k.delete(s);
|
|
3013
|
-
const t =
|
|
3018
|
+
const t = E.get(e.category);
|
|
3014
3019
|
if (t) {
|
|
3015
3020
|
const i = t.indexOf(s);
|
|
3016
|
-
i !== -1 && t.splice(i, 1), t.length === 0 &&
|
|
3021
|
+
i !== -1 && t.splice(i, 1), t.length === 0 && E.delete(e.category);
|
|
3017
3022
|
}
|
|
3018
3023
|
return !0;
|
|
3019
3024
|
}
|
|
3020
|
-
function
|
|
3025
|
+
function si(s, e) {
|
|
3021
3026
|
const t = k.get(s);
|
|
3022
|
-
return t ?
|
|
3027
|
+
return t ? it(t, e) : !1;
|
|
3023
3028
|
}
|
|
3024
|
-
function
|
|
3029
|
+
function lt() {
|
|
3025
3030
|
return Array.from(k.values()).map((s) => ({
|
|
3026
3031
|
id: s.id,
|
|
3027
3032
|
name: s.name,
|
|
@@ -3030,7 +3035,7 @@ function nt() {
|
|
|
3030
3035
|
}));
|
|
3031
3036
|
}
|
|
3032
3037
|
if (typeof window < "u") {
|
|
3033
|
-
window.__DEBUG_FILTERS_LIST = Array.from(k.keys()), window.getAllFilters = U, window.getFilter =
|
|
3038
|
+
window.__DEBUG_FILTERS_LIST = Array.from(k.keys()), window.getAllFilters = U, window.getFilter = rt, window.getFiltersByCategory = at, window.getRegisteredFilters = lt;
|
|
3034
3039
|
const s = f;
|
|
3035
3040
|
window.registerFilter = (e) => {
|
|
3036
3041
|
const t = s(e);
|
|
@@ -3040,7 +3045,7 @@ if (typeof window < "u") {
|
|
|
3040
3045
|
typeof window < "u" && (window.initializeFilterRegistry = window.initializeFilterRegistry || function() {
|
|
3041
3046
|
return [];
|
|
3042
3047
|
});
|
|
3043
|
-
const { AdjustmentFilter:
|
|
3048
|
+
const { AdjustmentFilter: ct } = b, { ColorMatrixFilter: ht } = S, F = {
|
|
3044
3049
|
gamma: 1,
|
|
3045
3050
|
saturation: 1,
|
|
3046
3051
|
contrast: 1,
|
|
@@ -3049,7 +3054,7 @@ const { AdjustmentFilter: lt } = b, { ColorMatrixFilter: ct } = S, M = {
|
|
|
3049
3054
|
green: 1,
|
|
3050
3055
|
blue: 1,
|
|
3051
3056
|
alpha: 1
|
|
3052
|
-
},
|
|
3057
|
+
}, dt = /* @__PURE__ */ new Set([
|
|
3053
3058
|
"gamma",
|
|
3054
3059
|
"saturation",
|
|
3055
3060
|
"contrast",
|
|
@@ -3059,7 +3064,7 @@ const { AdjustmentFilter: lt } = b, { ColorMatrixFilter: ct } = S, M = {
|
|
|
3059
3064
|
"blue",
|
|
3060
3065
|
"alpha"
|
|
3061
3066
|
]);
|
|
3062
|
-
function
|
|
3067
|
+
function A(s, e) {
|
|
3063
3068
|
if (typeof s == "number" && Number.isFinite(s))
|
|
3064
3069
|
return s;
|
|
3065
3070
|
if (typeof s == "string") {
|
|
@@ -3070,18 +3075,18 @@ function F(s, e) {
|
|
|
3070
3075
|
return e;
|
|
3071
3076
|
}
|
|
3072
3077
|
function ee(s) {
|
|
3073
|
-
return
|
|
3078
|
+
return dt.has(s);
|
|
3074
3079
|
}
|
|
3075
|
-
function
|
|
3080
|
+
function ut(s) {
|
|
3076
3081
|
return {
|
|
3077
|
-
gamma:
|
|
3078
|
-
saturation:
|
|
3079
|
-
contrast:
|
|
3080
|
-
brightness:
|
|
3081
|
-
red:
|
|
3082
|
-
green:
|
|
3083
|
-
blue:
|
|
3084
|
-
alpha:
|
|
3082
|
+
gamma: A(s.gamma, F.gamma),
|
|
3083
|
+
saturation: A(s.saturation, F.saturation),
|
|
3084
|
+
contrast: A(s.contrast, F.contrast),
|
|
3085
|
+
brightness: A(s.brightness, F.brightness),
|
|
3086
|
+
red: A(s.red, F.red),
|
|
3087
|
+
green: A(s.green, F.green),
|
|
3088
|
+
blue: A(s.blue, F.blue),
|
|
3089
|
+
alpha: A(s.alpha, F.alpha)
|
|
3085
3090
|
};
|
|
3086
3091
|
}
|
|
3087
3092
|
function te(s, e) {
|
|
@@ -3095,14 +3100,14 @@ f({
|
|
|
3095
3100
|
// Create an instance of the AdjustmentFilter with the provided parameters
|
|
3096
3101
|
createFilter: (s) => {
|
|
3097
3102
|
try {
|
|
3098
|
-
const e =
|
|
3103
|
+
const e = ut(s ?? {}), t = { ...e };
|
|
3099
3104
|
try {
|
|
3100
|
-
const i = new
|
|
3105
|
+
const i = new ct(t), r = i;
|
|
3101
3106
|
return r._customParams = { ...e }, r.updateUIParam = function(o, n) {
|
|
3102
3107
|
try {
|
|
3103
3108
|
if (!ee(o))
|
|
3104
3109
|
return;
|
|
3105
|
-
const l = this._customParams ?? { ...
|
|
3110
|
+
const l = this._customParams ?? { ...F }, c = A(n, l[o]);
|
|
3106
3111
|
l[o] = c, this._customParams = l;
|
|
3107
3112
|
const d = this;
|
|
3108
3113
|
o in d && (d[o] = c);
|
|
@@ -3110,12 +3115,12 @@ f({
|
|
|
3110
3115
|
}
|
|
3111
3116
|
}, i;
|
|
3112
3117
|
} catch {
|
|
3113
|
-
const r = new
|
|
3118
|
+
const r = new ht(), a = r;
|
|
3114
3119
|
return a._customParams = { ...e }, te(r, e), a.updateUIParam = function(n, l) {
|
|
3115
3120
|
try {
|
|
3116
3121
|
if (!ee(n))
|
|
3117
3122
|
return;
|
|
3118
|
-
const c = this._customParams ?? { ...
|
|
3123
|
+
const c = this._customParams ?? { ...F }, d = A(l, c[n]);
|
|
3119
3124
|
c[n] = d, this._customParams = c, te(this, c);
|
|
3120
3125
|
} catch {
|
|
3121
3126
|
}
|
|
@@ -3220,14 +3225,14 @@ f({
|
|
|
3220
3225
|
}
|
|
3221
3226
|
]
|
|
3222
3227
|
});
|
|
3223
|
-
const { ColorMatrixFilter:
|
|
3228
|
+
const { ColorMatrixFilter: pt } = S, T = {
|
|
3224
3229
|
brightness: 1,
|
|
3225
3230
|
contrast: 1,
|
|
3226
3231
|
saturation: 1,
|
|
3227
3232
|
hue: 0,
|
|
3228
3233
|
sepia: 0,
|
|
3229
3234
|
negative: !1
|
|
3230
|
-
},
|
|
3235
|
+
}, ft = /* @__PURE__ */ new Set([
|
|
3231
3236
|
"brightness",
|
|
3232
3237
|
"contrast",
|
|
3233
3238
|
"saturation",
|
|
@@ -3235,10 +3240,10 @@ const { ColorMatrixFilter: ut } = S, N = {
|
|
|
3235
3240
|
"sepia",
|
|
3236
3241
|
"negative"
|
|
3237
3242
|
]);
|
|
3238
|
-
function
|
|
3239
|
-
return
|
|
3243
|
+
function mt(s) {
|
|
3244
|
+
return ft.has(s);
|
|
3240
3245
|
}
|
|
3241
|
-
function
|
|
3246
|
+
function Y(s, e) {
|
|
3242
3247
|
if (typeof s == "number" && Number.isFinite(s))
|
|
3243
3248
|
return s;
|
|
3244
3249
|
if (typeof s == "string") {
|
|
@@ -3259,14 +3264,14 @@ function fe(s, e) {
|
|
|
3259
3264
|
}
|
|
3260
3265
|
return e;
|
|
3261
3266
|
}
|
|
3262
|
-
function
|
|
3267
|
+
function gt(s) {
|
|
3263
3268
|
return {
|
|
3264
|
-
brightness:
|
|
3265
|
-
contrast:
|
|
3266
|
-
saturation:
|
|
3267
|
-
hue:
|
|
3268
|
-
sepia:
|
|
3269
|
-
negative: fe(s.negative,
|
|
3269
|
+
brightness: Y(s.brightness, T.brightness),
|
|
3270
|
+
contrast: Y(s.contrast, T.contrast),
|
|
3271
|
+
saturation: Y(s.saturation, T.saturation),
|
|
3272
|
+
hue: Y(s.hue, T.hue),
|
|
3273
|
+
sepia: Y(s.sepia, T.sepia),
|
|
3274
|
+
negative: fe(s.negative, T.negative)
|
|
3270
3275
|
};
|
|
3271
3276
|
}
|
|
3272
3277
|
function ie(s, e) {
|
|
@@ -3280,17 +3285,17 @@ f({
|
|
|
3280
3285
|
// Create an instance of the ColorMatrixFilter with the provided parameters
|
|
3281
3286
|
createFilter: (s) => {
|
|
3282
3287
|
try {
|
|
3283
|
-
const e =
|
|
3288
|
+
const e = gt(s ?? {}), t = new pt(), i = t;
|
|
3284
3289
|
return i._customParams = { ...e }, ie(t, e), i.updateUIParam = function(a, o) {
|
|
3285
3290
|
try {
|
|
3286
|
-
if (!
|
|
3291
|
+
if (!mt(a))
|
|
3287
3292
|
return;
|
|
3288
|
-
const n = this._customParams ?? { ...
|
|
3293
|
+
const n = this._customParams ?? { ...T };
|
|
3289
3294
|
if (a === "negative")
|
|
3290
3295
|
n.negative = fe(o, n.negative);
|
|
3291
3296
|
else {
|
|
3292
3297
|
const l = a;
|
|
3293
|
-
n[l] =
|
|
3298
|
+
n[l] = Y(o, n[l]);
|
|
3294
3299
|
}
|
|
3295
3300
|
this._customParams = n, ie(this, n);
|
|
3296
3301
|
} catch {
|
|
@@ -3564,7 +3569,7 @@ f({
|
|
|
3564
3569
|
}
|
|
3565
3570
|
]
|
|
3566
3571
|
});
|
|
3567
|
-
const { ColorOverlayFilter:
|
|
3572
|
+
const { ColorOverlayFilter: bt } = b;
|
|
3568
3573
|
f({
|
|
3569
3574
|
id: "colorOverlay",
|
|
3570
3575
|
name: "Color Overlay",
|
|
@@ -3579,7 +3584,7 @@ f({
|
|
|
3579
3584
|
try {
|
|
3580
3585
|
let e = 16711680;
|
|
3581
3586
|
s.color && (typeof s.color == "string" ? e = parseInt(s.color.replace("#", "0x"), 16) : typeof s.color == "number" && (e = s.color));
|
|
3582
|
-
const t = new
|
|
3587
|
+
const t = new bt({
|
|
3583
3588
|
color: e,
|
|
3584
3589
|
alpha: s.alpha || 0.5
|
|
3585
3590
|
});
|
|
@@ -3811,7 +3816,7 @@ f({
|
|
|
3811
3816
|
}
|
|
3812
3817
|
]
|
|
3813
3818
|
});
|
|
3814
|
-
const { ColorMatrixFilter:
|
|
3819
|
+
const { ColorMatrixFilter: yt } = S;
|
|
3815
3820
|
f({
|
|
3816
3821
|
id: "grayscale",
|
|
3817
3822
|
name: "Grayscale",
|
|
@@ -3824,7 +3829,7 @@ f({
|
|
|
3824
3829
|
*/
|
|
3825
3830
|
createFilter: (s) => {
|
|
3826
3831
|
try {
|
|
3827
|
-
const e = new
|
|
3832
|
+
const e = new yt();
|
|
3828
3833
|
e._customParams = { ...s };
|
|
3829
3834
|
const t = s.intensity !== void 0 ? s.intensity : 1;
|
|
3830
3835
|
return re(e, t), e.updateUIParam = function(i, r) {
|
|
@@ -3864,7 +3869,7 @@ f({
|
|
|
3864
3869
|
function re(s, e) {
|
|
3865
3870
|
s.reset(), s.greyscale(e);
|
|
3866
3871
|
}
|
|
3867
|
-
const { HslAdjustmentFilter:
|
|
3872
|
+
const { HslAdjustmentFilter: _t } = b;
|
|
3868
3873
|
f({
|
|
3869
3874
|
id: "hsl-adjustment",
|
|
3870
3875
|
name: "HSL Adjustment",
|
|
@@ -3876,7 +3881,7 @@ f({
|
|
|
3876
3881
|
*/
|
|
3877
3882
|
createFilter: (s) => {
|
|
3878
3883
|
try {
|
|
3879
|
-
const e = new
|
|
3884
|
+
const e = new _t({
|
|
3880
3885
|
hue: s.hue !== void 0 ? s.hue : 0,
|
|
3881
3886
|
saturation: s.saturation !== void 0 ? s.saturation : 0,
|
|
3882
3887
|
lightness: s.lightness !== void 0 ? s.lightness : 0,
|
|
@@ -3974,7 +3979,7 @@ f({
|
|
|
3974
3979
|
}
|
|
3975
3980
|
]
|
|
3976
3981
|
});
|
|
3977
|
-
const { KawaseBlurFilter:
|
|
3982
|
+
const { KawaseBlurFilter: xt } = b;
|
|
3978
3983
|
f({
|
|
3979
3984
|
id: "kawase-blur",
|
|
3980
3985
|
name: "Kawase Blur",
|
|
@@ -3987,7 +3992,7 @@ f({
|
|
|
3987
3992
|
*/
|
|
3988
3993
|
createFilter: (s) => {
|
|
3989
3994
|
try {
|
|
3990
|
-
const e = new
|
|
3995
|
+
const e = new xt({
|
|
3991
3996
|
strength: s.strength || 4,
|
|
3992
3997
|
quality: s.quality || 3,
|
|
3993
3998
|
clamp: s.clamp || !1,
|
|
@@ -4092,7 +4097,7 @@ f({
|
|
|
4092
4097
|
}
|
|
4093
4098
|
]
|
|
4094
4099
|
});
|
|
4095
|
-
const { MotionBlurFilter:
|
|
4100
|
+
const { MotionBlurFilter: Ct } = b;
|
|
4096
4101
|
f({
|
|
4097
4102
|
id: "motion-blur",
|
|
4098
4103
|
name: "Motion Blur",
|
|
@@ -4105,7 +4110,7 @@ f({
|
|
|
4105
4110
|
*/
|
|
4106
4111
|
createFilter: (s) => {
|
|
4107
4112
|
try {
|
|
4108
|
-
const e = new
|
|
4113
|
+
const e = new Ct({
|
|
4109
4114
|
velocity: {
|
|
4110
4115
|
x: s.velocityX !== void 0 ? s.velocityX : 0,
|
|
4111
4116
|
y: s.velocityY !== void 0 ? s.velocityY : 0
|
|
@@ -4200,7 +4205,7 @@ f({
|
|
|
4200
4205
|
}
|
|
4201
4206
|
]
|
|
4202
4207
|
});
|
|
4203
|
-
const { RadialBlurFilter:
|
|
4208
|
+
const { RadialBlurFilter: wt } = b;
|
|
4204
4209
|
f({
|
|
4205
4210
|
id: "radial-blur",
|
|
4206
4211
|
name: "Radial Blur",
|
|
@@ -4209,7 +4214,7 @@ f({
|
|
|
4209
4214
|
// Create an instance of the RadialBlurFilter with the provided parameters
|
|
4210
4215
|
createFilter: (s) => {
|
|
4211
4216
|
try {
|
|
4212
|
-
const e = new
|
|
4217
|
+
const e = new wt({
|
|
4213
4218
|
angle: s.angle ?? 20,
|
|
4214
4219
|
center: { x: s.centerX ?? 0, y: s.centerY ?? 0 },
|
|
4215
4220
|
kernelSize: s.kernelSize ?? 15,
|
|
@@ -4324,7 +4329,7 @@ f({
|
|
|
4324
4329
|
}
|
|
4325
4330
|
]
|
|
4326
4331
|
});
|
|
4327
|
-
const { TiltShiftFilter:
|
|
4332
|
+
const { TiltShiftFilter: St } = b;
|
|
4328
4333
|
f({
|
|
4329
4334
|
id: "tilt-shift",
|
|
4330
4335
|
name: "Tilt Shift",
|
|
@@ -4333,7 +4338,7 @@ f({
|
|
|
4333
4338
|
// Create an instance of the TiltShiftFilter with the provided parameters
|
|
4334
4339
|
createFilter: (s) => {
|
|
4335
4340
|
try {
|
|
4336
|
-
const e = typeof s.blur == "number" ? s.blur : 100, t = typeof s.gradientBlur == "number" ? s.gradientBlur : 600, i = typeof s.startX == "number" ? s.startX : 0, r = typeof s.startY == "number" ? s.startY : 0.5, a = typeof s.endX == "number" ? s.endX : 1, o = typeof s.endY == "number" ? s.endY : 0.5, n = new
|
|
4341
|
+
const e = typeof s.blur == "number" ? s.blur : 100, t = typeof s.gradientBlur == "number" ? s.gradientBlur : 600, i = typeof s.startX == "number" ? s.startX : 0, r = typeof s.startY == "number" ? s.startY : 0.5, a = typeof s.endX == "number" ? s.endX : 1, o = typeof s.endY == "number" ? s.endY : 0.5, n = new St({
|
|
4337
4342
|
blur: Number(e),
|
|
4338
4343
|
gradientBlur: Number(t),
|
|
4339
4344
|
start: { x: Number(i), y: Number(r) },
|
|
@@ -4452,7 +4457,7 @@ f({
|
|
|
4452
4457
|
}
|
|
4453
4458
|
]
|
|
4454
4459
|
});
|
|
4455
|
-
const { ZoomBlurFilter:
|
|
4460
|
+
const { ZoomBlurFilter: vt } = b;
|
|
4456
4461
|
f({
|
|
4457
4462
|
id: "zoom-blur",
|
|
4458
4463
|
name: "Zoom Blur",
|
|
@@ -4465,7 +4470,7 @@ f({
|
|
|
4465
4470
|
*/
|
|
4466
4471
|
createFilter: (s) => {
|
|
4467
4472
|
try {
|
|
4468
|
-
const e = new
|
|
4473
|
+
const e = new vt({
|
|
4469
4474
|
strength: s.strength || 0.1,
|
|
4470
4475
|
center: {
|
|
4471
4476
|
x: s.centerX !== void 0 ? s.centerX : 0.5,
|
|
@@ -4906,7 +4911,7 @@ f({
|
|
|
4906
4911
|
}
|
|
4907
4912
|
]
|
|
4908
4913
|
});
|
|
4909
|
-
const
|
|
4914
|
+
const kt = b.ColorReplaceFilter;
|
|
4910
4915
|
f({
|
|
4911
4916
|
id: "color-replace",
|
|
4912
4917
|
name: "Color Replace",
|
|
@@ -4923,7 +4928,7 @@ f({
|
|
|
4923
4928
|
s.originalColor && (typeof s.originalColor == "string" ? e = parseInt(s.originalColor.replace("#", "0x"), 16) : typeof s.originalColor == "number" && (e = s.originalColor));
|
|
4924
4929
|
let t = 255;
|
|
4925
4930
|
s.targetColor && (typeof s.targetColor == "string" ? t = parseInt(s.targetColor.replace("#", "0x"), 16) : typeof s.targetColor == "number" && (t = s.targetColor));
|
|
4926
|
-
const i = new
|
|
4931
|
+
const i = new kt({
|
|
4927
4932
|
originalColor: e,
|
|
4928
4933
|
targetColor: t,
|
|
4929
4934
|
tolerance: s.tolerance || 0.4
|
|
@@ -4987,7 +4992,7 @@ f({
|
|
|
4987
4992
|
}
|
|
4988
4993
|
]
|
|
4989
4994
|
});
|
|
4990
|
-
const
|
|
4995
|
+
const Pt = b.MultiColorReplaceFilter;
|
|
4991
4996
|
f({
|
|
4992
4997
|
id: "multi-color-replace",
|
|
4993
4998
|
name: "Multi-Color Replace",
|
|
@@ -5013,7 +5018,7 @@ f({
|
|
|
5013
5018
|
const i = typeof s.originalColor3 == "string" ? parseInt(s.originalColor3.replace("#", "0x"), 16) : s.originalColor3, r = typeof s.targetColor3 == "string" ? parseInt(s.targetColor3.replace("#", "0x"), 16) : s.targetColor3;
|
|
5014
5019
|
e.push([i, r]);
|
|
5015
5020
|
}
|
|
5016
|
-
const t = new
|
|
5021
|
+
const t = new Pt(
|
|
5017
5022
|
e,
|
|
5018
5023
|
s.tolerance || 0.05,
|
|
5019
5024
|
3
|
|
@@ -5124,7 +5129,7 @@ f({
|
|
|
5124
5129
|
}
|
|
5125
5130
|
]
|
|
5126
5131
|
});
|
|
5127
|
-
const { RGBSplitFilter:
|
|
5132
|
+
const { RGBSplitFilter: Mt } = b;
|
|
5128
5133
|
f({
|
|
5129
5134
|
id: "rgb-split",
|
|
5130
5135
|
name: "RGB Split",
|
|
@@ -5145,7 +5150,7 @@ f({
|
|
|
5145
5150
|
}, i = {
|
|
5146
5151
|
x: s.blueX !== void 0 ? s.blueX : 0,
|
|
5147
5152
|
y: s.blueY !== void 0 ? s.blueY : 0
|
|
5148
|
-
}, r = new
|
|
5153
|
+
}, r = new Mt({
|
|
5149
5154
|
red: e,
|
|
5150
5155
|
green: t,
|
|
5151
5156
|
blue: i
|
|
@@ -5258,7 +5263,7 @@ f({
|
|
|
5258
5263
|
}
|
|
5259
5264
|
]
|
|
5260
5265
|
});
|
|
5261
|
-
const { AdvancedBloomFilter:
|
|
5266
|
+
const { AdvancedBloomFilter: Ft } = b;
|
|
5262
5267
|
f({
|
|
5263
5268
|
id: "advanced-bloom",
|
|
5264
5269
|
name: "Advanced Bloom",
|
|
@@ -5267,7 +5272,7 @@ f({
|
|
|
5267
5272
|
// Create an instance of the AdvancedBloomFilter with the provided parameters
|
|
5268
5273
|
createFilter: (s) => {
|
|
5269
5274
|
try {
|
|
5270
|
-
const e = new
|
|
5275
|
+
const e = new Ft({
|
|
5271
5276
|
threshold: s.threshold || 0.5,
|
|
5272
5277
|
bloomScale: s.bloomScale || 1,
|
|
5273
5278
|
brightness: s.brightness || 1,
|
|
@@ -5414,7 +5419,7 @@ f({
|
|
|
5414
5419
|
}
|
|
5415
5420
|
]
|
|
5416
5421
|
});
|
|
5417
|
-
const
|
|
5422
|
+
const At = b.AsciiFilter;
|
|
5418
5423
|
f({
|
|
5419
5424
|
id: "ascii",
|
|
5420
5425
|
name: "ASCII",
|
|
@@ -5426,7 +5431,7 @@ f({
|
|
|
5426
5431
|
const e = typeof s.size == "number" ? s.size : 8;
|
|
5427
5432
|
let t = s.color;
|
|
5428
5433
|
typeof t == "string" && t.startsWith("#") && (t = parseInt(t.replace("#", "0x"), 16));
|
|
5429
|
-
const i = s.replaceColor === !0, r = new
|
|
5434
|
+
const i = s.replaceColor === !0, r = new At({
|
|
5430
5435
|
size: e,
|
|
5431
5436
|
color: t,
|
|
5432
5437
|
replaceColor: i
|
|
@@ -5493,7 +5498,7 @@ f({
|
|
|
5493
5498
|
}
|
|
5494
5499
|
]
|
|
5495
5500
|
});
|
|
5496
|
-
const
|
|
5501
|
+
const zt = b.BackdropBlurFilter;
|
|
5497
5502
|
f({
|
|
5498
5503
|
id: "backdrop-blur",
|
|
5499
5504
|
name: "Backdrop Blur",
|
|
@@ -5502,7 +5507,7 @@ f({
|
|
|
5502
5507
|
// Create an instance of the BackdropBlurFilter with the provided parameters
|
|
5503
5508
|
createFilter: (s) => {
|
|
5504
5509
|
try {
|
|
5505
|
-
const e = new
|
|
5510
|
+
const e = new zt({
|
|
5506
5511
|
// Higher strength values (20-50) make the effect more noticeable
|
|
5507
5512
|
strength: s.strength || 20,
|
|
5508
5513
|
quality: s.quality || 4,
|
|
@@ -5600,7 +5605,7 @@ f({
|
|
|
5600
5605
|
}
|
|
5601
5606
|
]
|
|
5602
5607
|
});
|
|
5603
|
-
const { BevelFilter:
|
|
5608
|
+
const { BevelFilter: Rt } = b;
|
|
5604
5609
|
f({
|
|
5605
5610
|
id: "bevel",
|
|
5606
5611
|
name: "Bevel",
|
|
@@ -5612,7 +5617,7 @@ f({
|
|
|
5612
5617
|
*/
|
|
5613
5618
|
createFilter: (s) => {
|
|
5614
5619
|
try {
|
|
5615
|
-
const e = s.lightColor ? s.lightColor.replace("#", "0x") : "0xffffff", t = s.shadowColor ? s.shadowColor.replace("#", "0x") : "0x000000", i = new
|
|
5620
|
+
const e = s.lightColor ? s.lightColor.replace("#", "0x") : "0xffffff", t = s.shadowColor ? s.shadowColor.replace("#", "0x") : "0x000000", i = new Rt({
|
|
5616
5621
|
rotation: s.rotation !== void 0 ? s.rotation : 45,
|
|
5617
5622
|
thickness: s.thickness !== void 0 ? s.thickness : 2,
|
|
5618
5623
|
lightColor: parseInt(e, 16),
|
|
@@ -5728,7 +5733,7 @@ f({
|
|
|
5728
5733
|
}
|
|
5729
5734
|
]
|
|
5730
5735
|
});
|
|
5731
|
-
const { BloomFilter:
|
|
5736
|
+
const { BloomFilter: Nt } = b;
|
|
5732
5737
|
f({
|
|
5733
5738
|
id: "bloom",
|
|
5734
5739
|
name: "Bloom/Glow",
|
|
@@ -5737,7 +5742,7 @@ f({
|
|
|
5737
5742
|
// Create an instance of the BloomFilter with the provided parameters
|
|
5738
5743
|
createFilter: (s) => {
|
|
5739
5744
|
try {
|
|
5740
|
-
const e = typeof s.strengthX == "number" ? s.strengthX : 2, t = typeof s.strengthY == "number" ? s.strengthY : 2, i = typeof s.quality == "number" ? s.quality : 4, r = typeof s.resolution == "number" ? s.resolution : 1, a = typeof s.kernelSize == "number" ? s.kernelSize : 5, o = new
|
|
5745
|
+
const e = typeof s.strengthX == "number" ? s.strengthX : 2, t = typeof s.strengthY == "number" ? s.strengthY : 2, i = typeof s.quality == "number" ? s.quality : 4, r = typeof s.resolution == "number" ? s.resolution : 1, a = typeof s.kernelSize == "number" ? s.kernelSize : 5, o = new Nt({
|
|
5741
5746
|
strength: {
|
|
5742
5747
|
x: Number(e),
|
|
5743
5748
|
y: Number(t)
|
|
@@ -5840,7 +5845,7 @@ f({
|
|
|
5840
5845
|
}
|
|
5841
5846
|
]
|
|
5842
5847
|
});
|
|
5843
|
-
const { BulgePinchFilter:
|
|
5848
|
+
const { BulgePinchFilter: Tt } = b;
|
|
5844
5849
|
f({
|
|
5845
5850
|
id: "bulge-pinch",
|
|
5846
5851
|
// ID must match what the application expects
|
|
@@ -5850,7 +5855,7 @@ f({
|
|
|
5850
5855
|
// Create an instance of the BulgePinchFilter with the provided parameters
|
|
5851
5856
|
createFilter: (s) => {
|
|
5852
5857
|
try {
|
|
5853
|
-
const e = s.centerX ?? 0.5, t = s.centerY ?? 0.5, i = s.radius ?? 100, r = s.strength ?? 1, a = new
|
|
5858
|
+
const e = s.centerX ?? 0.5, t = s.centerY ?? 0.5, i = s.radius ?? 100, r = s.strength ?? 1, a = new Tt({
|
|
5854
5859
|
center: {
|
|
5855
5860
|
x: e,
|
|
5856
5861
|
y: t
|
|
@@ -5932,7 +5937,7 @@ f({
|
|
|
5932
5937
|
}
|
|
5933
5938
|
]
|
|
5934
5939
|
});
|
|
5935
|
-
const { ConvolutionFilter:
|
|
5940
|
+
const { ConvolutionFilter: It } = b, X = {
|
|
5936
5941
|
normal: [0, 0, 0, 0, 1, 0, 0, 0, 0],
|
|
5937
5942
|
gaussianBlur: [0.045, 0.122, 0.045, 0.122, 0.332, 0.122, 0.045, 0.122, 0.045],
|
|
5938
5943
|
boxBlur: [1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9],
|
|
@@ -5965,16 +5970,16 @@ f({
|
|
|
5965
5970
|
];
|
|
5966
5971
|
else {
|
|
5967
5972
|
const i = s.preset;
|
|
5968
|
-
e =
|
|
5973
|
+
e = X[i] || X.normal;
|
|
5969
5974
|
}
|
|
5970
|
-
const t = new
|
|
5975
|
+
const t = new It(e, s.width || 200, s.height || 200);
|
|
5971
5976
|
return t._customParams = { ...s }, t.updateUIParam = function(i, r) {
|
|
5972
5977
|
const a = this._customParams || {};
|
|
5973
5978
|
switch (this._customParams = a, a[i] = r, i) {
|
|
5974
5979
|
case "preset":
|
|
5975
5980
|
if (!a.customMatrix) {
|
|
5976
5981
|
const o = r;
|
|
5977
|
-
|
|
5982
|
+
X[o] && (this.matrix = X[o]);
|
|
5978
5983
|
}
|
|
5979
5984
|
break;
|
|
5980
5985
|
case "customMatrix":
|
|
@@ -5983,7 +5988,7 @@ f({
|
|
|
5983
5988
|
a.m00 = o[0], a.m01 = o[1], a.m02 = o[2], a.m10 = o[3], a.m11 = o[4], a.m12 = o[5], a.m20 = o[6], a.m21 = o[7], a.m22 = o[8];
|
|
5984
5989
|
} else {
|
|
5985
5990
|
const o = a.preset;
|
|
5986
|
-
this.matrix =
|
|
5991
|
+
this.matrix = X[o] || X.normal;
|
|
5987
5992
|
}
|
|
5988
5993
|
break;
|
|
5989
5994
|
case "m00":
|
|
@@ -6178,7 +6183,7 @@ f({
|
|
|
6178
6183
|
}
|
|
6179
6184
|
]
|
|
6180
6185
|
});
|
|
6181
|
-
const { CrossHatchFilter:
|
|
6186
|
+
const { CrossHatchFilter: Et } = b;
|
|
6182
6187
|
f({
|
|
6183
6188
|
id: "cross-hatch",
|
|
6184
6189
|
name: "Cross Hatch",
|
|
@@ -6188,7 +6193,7 @@ f({
|
|
|
6188
6193
|
// Note: CrossHatchFilter has NO parameters according to PixiJS examples
|
|
6189
6194
|
createFilter: (s) => {
|
|
6190
6195
|
try {
|
|
6191
|
-
const e = new
|
|
6196
|
+
const e = new Et();
|
|
6192
6197
|
return e.updateUIParam = function(t, i) {
|
|
6193
6198
|
return !0;
|
|
6194
6199
|
}, e;
|
|
@@ -6385,7 +6390,7 @@ f({
|
|
|
6385
6390
|
}
|
|
6386
6391
|
]
|
|
6387
6392
|
});
|
|
6388
|
-
const
|
|
6393
|
+
const Xt = S.DisplacementFilter, Yt = S.Sprite, $ = S.Texture;
|
|
6389
6394
|
f({
|
|
6390
6395
|
id: "displacement",
|
|
6391
6396
|
// ID must match what the application expects
|
|
@@ -6411,7 +6416,7 @@ f({
|
|
|
6411
6416
|
}
|
|
6412
6417
|
t = $.from(o);
|
|
6413
6418
|
}
|
|
6414
|
-
const i = new
|
|
6419
|
+
const i = new Yt(t), r = new Xt(i, s.scale || 50);
|
|
6415
6420
|
return r.scale.x = s.scaleX || 50, r.scale.y = s.scaleY || 50, r._customParams = { ...s }, r._displacementSprite = i, r.updateUIParam = function(a, o) {
|
|
6416
6421
|
const n = this._customParams || {};
|
|
6417
6422
|
switch (this._customParams = n, n[a] = o, a) {
|
|
@@ -6558,7 +6563,7 @@ f({
|
|
|
6558
6563
|
}
|
|
6559
6564
|
]
|
|
6560
6565
|
});
|
|
6561
|
-
const { EmbossFilter:
|
|
6566
|
+
const { EmbossFilter: Bt } = b;
|
|
6562
6567
|
f({
|
|
6563
6568
|
id: "emboss",
|
|
6564
6569
|
name: "Emboss",
|
|
@@ -6567,7 +6572,7 @@ f({
|
|
|
6567
6572
|
// Create an instance of the Emboss filter with the provided parameters
|
|
6568
6573
|
createFilter: (s) => {
|
|
6569
6574
|
try {
|
|
6570
|
-
const e = typeof s.strength == "number" ? s.strength : 5, t = new
|
|
6575
|
+
const e = typeof s.strength == "number" ? s.strength : 5, t = new Bt(e);
|
|
6571
6576
|
return t._customParams = {
|
|
6572
6577
|
strength: e
|
|
6573
6578
|
}, t.updateUIParam = function(i, r) {
|
|
@@ -6607,7 +6612,7 @@ f({
|
|
|
6607
6612
|
}
|
|
6608
6613
|
]
|
|
6609
6614
|
});
|
|
6610
|
-
const { GlitchFilter:
|
|
6615
|
+
const { GlitchFilter: Ot } = b, N = {
|
|
6611
6616
|
TRANSPARENT: 0,
|
|
6612
6617
|
ORIGINAL: 1,
|
|
6613
6618
|
LOOP: 2,
|
|
@@ -6621,7 +6626,7 @@ f({
|
|
|
6621
6626
|
description: "Apply digital distortion and glitch effects",
|
|
6622
6627
|
createFilter: (s) => {
|
|
6623
6628
|
try {
|
|
6624
|
-
const e = { x: s.redX, y: s.redY }, t = { x: s.greenX, y: s.greenY }, i = { x: s.blueX, y: s.blueY }, r = new
|
|
6629
|
+
const e = { x: s.redX, y: s.redY }, t = { x: s.greenX, y: s.greenY }, i = { x: s.blueX, y: s.blueY }, r = new Ot({
|
|
6625
6630
|
slices: s.slices,
|
|
6626
6631
|
offset: s.offset,
|
|
6627
6632
|
direction: s.direction,
|
|
@@ -6699,7 +6704,7 @@ f({
|
|
|
6699
6704
|
slices: 10,
|
|
6700
6705
|
offset: 100,
|
|
6701
6706
|
direction: 0,
|
|
6702
|
-
fillMode:
|
|
6707
|
+
fillMode: N.LOOP,
|
|
6703
6708
|
// LOOP mode looks better for the demo
|
|
6704
6709
|
seed: 0.5,
|
|
6705
6710
|
average: !1,
|
|
@@ -6762,13 +6767,13 @@ f({
|
|
|
6762
6767
|
label: "Fill Mode",
|
|
6763
6768
|
property: "fillMode",
|
|
6764
6769
|
options: [
|
|
6765
|
-
{ value:
|
|
6766
|
-
{ value:
|
|
6767
|
-
{ value:
|
|
6768
|
-
{ value:
|
|
6769
|
-
{ value:
|
|
6770
|
+
{ value: N.TRANSPARENT, label: "Transparent" },
|
|
6771
|
+
{ value: N.ORIGINAL, label: "Original" },
|
|
6772
|
+
{ value: N.LOOP, label: "Loop" },
|
|
6773
|
+
{ value: N.CLAMP, label: "Clamp" },
|
|
6774
|
+
{ value: N.MIRROR, label: "Mirror" }
|
|
6770
6775
|
],
|
|
6771
|
-
default:
|
|
6776
|
+
default: N.LOOP
|
|
6772
6777
|
},
|
|
6773
6778
|
{
|
|
6774
6779
|
id: "seed",
|
|
@@ -6862,7 +6867,7 @@ f({
|
|
|
6862
6867
|
}
|
|
6863
6868
|
]
|
|
6864
6869
|
});
|
|
6865
|
-
const { GlowFilter:
|
|
6870
|
+
const { GlowFilter: Lt } = b;
|
|
6866
6871
|
f({
|
|
6867
6872
|
id: "glow",
|
|
6868
6873
|
name: "Glow",
|
|
@@ -6871,7 +6876,7 @@ f({
|
|
|
6871
6876
|
// Create an instance of the GlowFilter with the provided parameters
|
|
6872
6877
|
createFilter: (s) => {
|
|
6873
6878
|
try {
|
|
6874
|
-
const e = parseInt(s.color.replace("#", "0x"), 16), t = new
|
|
6879
|
+
const e = parseInt(s.color.replace("#", "0x"), 16), t = new Lt({
|
|
6875
6880
|
distance: s.distance || 10,
|
|
6876
6881
|
outerStrength: s.outerStrength || 4,
|
|
6877
6882
|
innerStrength: s.innerStrength || 0,
|
|
@@ -6997,7 +7002,7 @@ f({
|
|
|
6997
7002
|
}
|
|
6998
7003
|
]
|
|
6999
7004
|
});
|
|
7000
|
-
const { GodrayFilter:
|
|
7005
|
+
const { GodrayFilter: Dt } = b;
|
|
7001
7006
|
f({
|
|
7002
7007
|
id: "godray",
|
|
7003
7008
|
name: "Godray",
|
|
@@ -7006,7 +7011,7 @@ f({
|
|
|
7006
7011
|
// Create an instance of the GodrayFilter with the provided parameters
|
|
7007
7012
|
createFilter: (s) => {
|
|
7008
7013
|
try {
|
|
7009
|
-
const e = new
|
|
7014
|
+
const e = new Dt({
|
|
7010
7015
|
angle: s.angle || 30,
|
|
7011
7016
|
parallel: s.parallel ?? !0,
|
|
7012
7017
|
center: {
|
|
@@ -7159,7 +7164,7 @@ f({
|
|
|
7159
7164
|
}
|
|
7160
7165
|
]
|
|
7161
7166
|
});
|
|
7162
|
-
const
|
|
7167
|
+
const Ut = b.SimpleLightmapFilter, ae = S.Texture;
|
|
7163
7168
|
f({
|
|
7164
7169
|
id: "lightmap",
|
|
7165
7170
|
name: "Lightmap",
|
|
@@ -7191,7 +7196,7 @@ f({
|
|
|
7191
7196
|
} catch {
|
|
7192
7197
|
n = 0;
|
|
7193
7198
|
}
|
|
7194
|
-
const l = new
|
|
7199
|
+
const l = new Ut(o, n, i);
|
|
7195
7200
|
return l._customParams = {
|
|
7196
7201
|
textureType: e,
|
|
7197
7202
|
color: t,
|
|
@@ -7290,7 +7295,7 @@ f({
|
|
|
7290
7295
|
}
|
|
7291
7296
|
]
|
|
7292
7297
|
});
|
|
7293
|
-
const { NoiseFilter:
|
|
7298
|
+
const { NoiseFilter: Vt } = S;
|
|
7294
7299
|
f({
|
|
7295
7300
|
id: "noise",
|
|
7296
7301
|
name: "Noise",
|
|
@@ -7298,7 +7303,7 @@ f({
|
|
|
7298
7303
|
description: "Add random noise to the image",
|
|
7299
7304
|
createFilter: (s) => {
|
|
7300
7305
|
try {
|
|
7301
|
-
const e = new
|
|
7306
|
+
const e = new Vt({
|
|
7302
7307
|
noise: s.noise || 0.5,
|
|
7303
7308
|
seed: s.seed || Math.random()
|
|
7304
7309
|
});
|
|
@@ -7375,7 +7380,7 @@ f({
|
|
|
7375
7380
|
}
|
|
7376
7381
|
]
|
|
7377
7382
|
});
|
|
7378
|
-
const { OldFilmFilter:
|
|
7383
|
+
const { OldFilmFilter: jt } = b;
|
|
7379
7384
|
f({
|
|
7380
7385
|
id: "old-film",
|
|
7381
7386
|
name: "Old Film",
|
|
@@ -7383,7 +7388,7 @@ f({
|
|
|
7383
7388
|
description: "Apply a vintage film effect with scratches and grain",
|
|
7384
7389
|
createFilter: (s) => {
|
|
7385
7390
|
try {
|
|
7386
|
-
const e = new
|
|
7391
|
+
const e = new jt({
|
|
7387
7392
|
sepia: s.sepia,
|
|
7388
7393
|
noise: s.noise,
|
|
7389
7394
|
noiseSize: s.noiseSize,
|
|
@@ -7564,7 +7569,7 @@ f({
|
|
|
7564
7569
|
}
|
|
7565
7570
|
]
|
|
7566
7571
|
});
|
|
7567
|
-
const { OutlineFilter:
|
|
7572
|
+
const { OutlineFilter: qt } = b;
|
|
7568
7573
|
f({
|
|
7569
7574
|
id: "outline",
|
|
7570
7575
|
name: "Outline",
|
|
@@ -7574,7 +7579,7 @@ f({
|
|
|
7574
7579
|
try {
|
|
7575
7580
|
let e = s.color;
|
|
7576
7581
|
typeof e == "string" && (e = parseInt(e.replace("#", "0x"), 16));
|
|
7577
|
-
const t = new
|
|
7582
|
+
const t = new qt({
|
|
7578
7583
|
thickness: s.thickness || 4,
|
|
7579
7584
|
color: e,
|
|
7580
7585
|
alpha: s.alpha || 1,
|
|
@@ -7664,7 +7669,7 @@ f({
|
|
|
7664
7669
|
}
|
|
7665
7670
|
]
|
|
7666
7671
|
});
|
|
7667
|
-
const { PixelateFilter:
|
|
7672
|
+
const { PixelateFilter: Ht } = b;
|
|
7668
7673
|
f({
|
|
7669
7674
|
id: "pixelate",
|
|
7670
7675
|
name: "Pixelate",
|
|
@@ -7672,7 +7677,7 @@ f({
|
|
|
7672
7677
|
description: "Create a pixelated or mosaic effect",
|
|
7673
7678
|
createFilter: (s) => {
|
|
7674
7679
|
try {
|
|
7675
|
-
const e = new
|
|
7680
|
+
const e = new Ht(
|
|
7676
7681
|
s.useUniform ? Math.max(4, s.size || 10) : [Math.max(4, s.sizeX || 10), Math.max(4, s.sizeY || 10)]
|
|
7677
7682
|
);
|
|
7678
7683
|
return e._customParams = { ...s }, e.updateUIParam = function(t, i) {
|
|
@@ -7755,7 +7760,7 @@ f({
|
|
|
7755
7760
|
}
|
|
7756
7761
|
]
|
|
7757
7762
|
});
|
|
7758
|
-
const { ReflectionFilter:
|
|
7763
|
+
const { ReflectionFilter: $t } = b;
|
|
7759
7764
|
f({
|
|
7760
7765
|
id: "reflection",
|
|
7761
7766
|
// ID must match what the application expects
|
|
@@ -7772,7 +7777,7 @@ f({
|
|
|
7772
7777
|
waveLength: new Float32Array([s.wavelengthStart ?? 30, s.wavelengthEnd ?? 100]),
|
|
7773
7778
|
alpha: new Float32Array([s.alphaStart ?? 1, s.alphaEnd ?? 1]),
|
|
7774
7779
|
time: s.time ?? 0
|
|
7775
|
-
}, t = new
|
|
7780
|
+
}, t = new $t(e);
|
|
7776
7781
|
return t._customParams = { ...s }, t.animating = s.animating ?? !1, t.updateUIParam = function(i, r) {
|
|
7777
7782
|
const a = this._customParams || {};
|
|
7778
7783
|
switch (this._customParams = a, a[i] = r, i) {
|
|
@@ -7923,7 +7928,7 @@ f({
|
|
|
7923
7928
|
}
|
|
7924
7929
|
]
|
|
7925
7930
|
});
|
|
7926
|
-
const { ShockwaveFilter:
|
|
7931
|
+
const { ShockwaveFilter: Wt } = b;
|
|
7927
7932
|
f({
|
|
7928
7933
|
id: "shockwave",
|
|
7929
7934
|
// ID must match what the application expects
|
|
@@ -7933,7 +7938,7 @@ f({
|
|
|
7933
7938
|
// Create an instance of the ShockwaveFilter with the provided parameters
|
|
7934
7939
|
createFilter: (s) => {
|
|
7935
7940
|
try {
|
|
7936
|
-
const e = s.centerX ?? 0.5, t = s.centerY ?? 0.5, i = { x: e, y: t }, r = s.amplitude ?? 30, a = s.wavelength ?? 160, o = s.speed ?? 500, n = s.brightness ?? 1, l = s.radius ?? -1, c = s.time ?? 0, d = new
|
|
7941
|
+
const e = s.centerX ?? 0.5, t = s.centerY ?? 0.5, i = { x: e, y: t }, r = s.amplitude ?? 30, a = s.wavelength ?? 160, o = s.speed ?? 500, n = s.brightness ?? 1, l = s.radius ?? -1, c = s.time ?? 0, d = new Wt({
|
|
7937
7942
|
center: i,
|
|
7938
7943
|
amplitude: r,
|
|
7939
7944
|
wavelength: a,
|
|
@@ -8075,7 +8080,7 @@ f({
|
|
|
8075
8080
|
}
|
|
8076
8081
|
]
|
|
8077
8082
|
});
|
|
8078
|
-
const { SimplexNoiseFilter:
|
|
8083
|
+
const { SimplexNoiseFilter: Zt } = b;
|
|
8079
8084
|
f({
|
|
8080
8085
|
id: "simplex-noise",
|
|
8081
8086
|
name: "Simplex Noise",
|
|
@@ -8083,7 +8088,7 @@ f({
|
|
|
8083
8088
|
description: "Apply procedural noise to create texture effects",
|
|
8084
8089
|
createFilter: (s) => {
|
|
8085
8090
|
try {
|
|
8086
|
-
const e = s.animating ? 0 : s.offsetZ || 0, t = new
|
|
8091
|
+
const e = s.animating ? 0 : s.offsetZ || 0, t = new Zt({
|
|
8087
8092
|
strength: s.strength,
|
|
8088
8093
|
noiseScale: s.noiseScale,
|
|
8089
8094
|
offsetX: s.offsetX,
|
|
@@ -8230,9 +8235,9 @@ f({
|
|
|
8230
8235
|
}
|
|
8231
8236
|
]
|
|
8232
8237
|
});
|
|
8233
|
-
class
|
|
8238
|
+
class Gt extends S.Filter {
|
|
8234
8239
|
constructor(e) {
|
|
8235
|
-
const t =
|
|
8240
|
+
const t = we.from({
|
|
8236
8241
|
vertex: `
|
|
8237
8242
|
attribute vec2 aPosition;
|
|
8238
8243
|
varying vec2 vTextureCoord;
|
|
@@ -8341,7 +8346,7 @@ f({
|
|
|
8341
8346
|
description: "Creates a twisting distortion effect around a central point",
|
|
8342
8347
|
createFilter: (s) => {
|
|
8343
8348
|
try {
|
|
8344
|
-
const e = new
|
|
8349
|
+
const e = new Gt({
|
|
8345
8350
|
centerX: s.centerX ?? 0.5,
|
|
8346
8351
|
centerY: s.centerY ?? 0.5,
|
|
8347
8352
|
radius: s.radius ?? 0.25,
|
|
@@ -8411,7 +8416,7 @@ f({
|
|
|
8411
8416
|
}
|
|
8412
8417
|
]
|
|
8413
8418
|
});
|
|
8414
|
-
const { AdjustmentFilter:
|
|
8419
|
+
const { AdjustmentFilter: Kt } = b;
|
|
8415
8420
|
function D(s) {
|
|
8416
8421
|
const e = typeof s == "string" ? parseInt(s.replace("#", "0x"), 16) : s;
|
|
8417
8422
|
return [
|
|
@@ -8420,7 +8425,7 @@ function D(s) {
|
|
|
8420
8425
|
(e & 255) / 255
|
|
8421
8426
|
];
|
|
8422
8427
|
}
|
|
8423
|
-
class
|
|
8428
|
+
class Qt extends Kt {
|
|
8424
8429
|
constructor(e = {}) {
|
|
8425
8430
|
super({
|
|
8426
8431
|
brightness: 1,
|
|
@@ -8463,7 +8468,7 @@ f({
|
|
|
8463
8468
|
description: "Add a classic darkened border effect to the image",
|
|
8464
8469
|
createFilter: (s) => {
|
|
8465
8470
|
try {
|
|
8466
|
-
const e = new
|
|
8471
|
+
const e = new Qt({
|
|
8467
8472
|
radius: s.radius || 0.8,
|
|
8468
8473
|
strength: s.strength || 1,
|
|
8469
8474
|
color: s.color || "#000000"
|
|
@@ -8527,22 +8532,22 @@ f({
|
|
|
8527
8532
|
}
|
|
8528
8533
|
]
|
|
8529
8534
|
});
|
|
8530
|
-
function
|
|
8535
|
+
function ai(s) {
|
|
8531
8536
|
try {
|
|
8532
8537
|
let e = [], t = [];
|
|
8533
8538
|
try {
|
|
8534
|
-
e = U(), e.length === 0 &&
|
|
8539
|
+
e = U(), e.length === 0 && st();
|
|
8535
8540
|
} catch {
|
|
8536
8541
|
}
|
|
8537
8542
|
const i = s == null ? void 0 : s.disabled;
|
|
8538
8543
|
if (Array.isArray(i) && i.length > 0) {
|
|
8539
8544
|
let r = 0;
|
|
8540
8545
|
for (const a of i)
|
|
8541
|
-
|
|
8546
|
+
nt(a) && r++;
|
|
8542
8547
|
r > 0;
|
|
8543
8548
|
}
|
|
8544
8549
|
try {
|
|
8545
|
-
e = U(), t =
|
|
8550
|
+
e = U(), t = ot();
|
|
8546
8551
|
} catch {
|
|
8547
8552
|
e || (e = []), t || (t = []);
|
|
8548
8553
|
}
|
|
@@ -8552,16 +8557,16 @@ function ri(s) {
|
|
|
8552
8557
|
}
|
|
8553
8558
|
}
|
|
8554
8559
|
export {
|
|
8555
|
-
|
|
8556
|
-
|
|
8557
|
-
|
|
8558
|
-
|
|
8559
|
-
|
|
8560
|
-
|
|
8561
|
-
|
|
8560
|
+
ii as V,
|
|
8561
|
+
rt as a,
|
|
8562
|
+
at as b,
|
|
8563
|
+
ot as c,
|
|
8564
|
+
st as d,
|
|
8565
|
+
si as e,
|
|
8566
|
+
lt as f,
|
|
8562
8567
|
U as g,
|
|
8563
|
-
|
|
8564
|
-
|
|
8568
|
+
ri as h,
|
|
8569
|
+
ai as i,
|
|
8565
8570
|
f as r
|
|
8566
8571
|
};
|
|
8567
|
-
//# sourceMappingURL=editor-
|
|
8572
|
+
//# sourceMappingURL=editor-B9JJoibh.js.map
|