@codingfactory/mediables-vue 2.4.15 → 2.4.17

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.
@@ -1,10 +1,10 @@
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);
1
+ var Ce = Object.defineProperty;
2
+ var we = (s, e, t) => e in s ? Ce(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t;
3
+ var W = (s, e, t) => we(s, typeof e != "symbol" ? e + "" : e, t);
4
4
  import * as b from "pixi-filters";
5
- import * as S from "pixi.js";
6
- import { GlProgram as we } from "pixi.js";
7
- class O {
5
+ import * as w from "pixi.js";
6
+ import { GlProgram as Se } from "pixi.js";
7
+ class U {
8
8
  constructor() {
9
9
  this._events = /* @__PURE__ */ new Map();
10
10
  }
@@ -34,7 +34,7 @@ class O {
34
34
  e ? this._events.delete(e) : this._events.clear();
35
35
  }
36
36
  }
37
- class Se extends O {
37
+ class ve extends U {
38
38
  constructor() {
39
39
  super(), this._state = {
40
40
  // Image state
@@ -189,10 +189,10 @@ class Se extends O {
189
189
  this.set("isDarkMode", this._state.theme === "dark");
190
190
  }
191
191
  }
192
- function ve() {
193
- return new Se();
192
+ function ke() {
193
+ return new ve();
194
194
  }
195
- class ke extends O {
195
+ class Pe extends U {
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
  }
@@ -313,47 +313,47 @@ class ke extends O {
313
313
  * @returns {string|null} Data URL
314
314
  */
315
315
  exportImage(e = "png", t = 0.92, i = 0, r = !0) {
316
- var y;
317
- if (!((y = this.app) != null && y.renderer) || !this.originalTexture || !this.sprite)
316
+ var S;
317
+ if (!((S = this.app) != null && S.renderer) || !this.originalTexture || !this.sprite)
318
318
  return null;
319
319
  const a = window.PIXI, o = Math.round(this.originalTexture.width), n = Math.round(this.originalTexture.height);
320
320
  if (o <= 0 || n <= 0)
321
321
  return null;
322
- let l = o;
322
+ let l = o, c = n;
323
323
  if (i > 0) {
324
- const _ = Math.max(o, n);
325
- let v = i / _;
326
- r && (v = Math.min(1, v)), l = Math.round(o * v);
324
+ const M = Math.max(o, n);
325
+ let F = i / M;
326
+ r && (F = Math.min(1, F)), l = Math.round(o * F), c = Math.round(n * F);
327
327
  }
328
- const c = this.sprite, d = c.x, h = c.y, p = c.width, m = c.height;
329
- if (p <= 0 || m <= 0)
328
+ const d = this.sprite, h = d.x, p = d.y, m = d.scale.x, _ = d.scale.y, g = d.width, y = d.height;
329
+ if (g <= 0 || y <= 0)
330
330
  return null;
331
- const x = l / p;
332
- let g = null;
331
+ const v = l / g, x = c / y;
332
+ let P = null;
333
333
  try {
334
- if (c.x = 0, c.y = 0, g = a.RenderTexture.create({
335
- width: Math.ceil(p),
336
- height: Math.ceil(m),
337
- resolution: x
338
- }), this.app.renderer.render({ container: this.app.stage, target: g }), !this.app.renderer.extract)
334
+ if (d.x = 0, d.y = 0, d.scale.x = m * v, d.scale.y = _ * x, P = a.RenderTexture.create({
335
+ width: Math.ceil(l),
336
+ height: Math.ceil(c),
337
+ resolution: 1
338
+ }), this.app.renderer.render({ container: this.app.stage, target: P }), !this.app.renderer.extract)
339
339
  return null;
340
- const _ = this.app.renderer.extract.canvas(g);
341
- if (!_)
340
+ const M = this.app.renderer.extract.canvas(P);
341
+ if (!M)
342
342
  return null;
343
- let v = null;
344
- if (typeof _.toDataURL == "function")
345
- v = _.toDataURL(`image/${e}`, t);
346
- else if (typeof _.getContext == "function") {
347
- const C = document.createElement("canvas");
348
- C.width = _.width, C.height = _.height;
349
- const M = C.getContext("2d");
350
- M && (M.drawImage(_, 0, 0), v = C.toDataURL(`image/${e}`, t));
343
+ let F = null;
344
+ if (typeof M.toDataURL == "function")
345
+ F = M.toDataURL(`image/${e}`, t);
346
+ else if (typeof M.getContext == "function") {
347
+ const B = document.createElement("canvas");
348
+ B.width = M.width, B.height = M.height;
349
+ const V = B.getContext("2d");
350
+ V && (V.drawImage(M, 0, 0), F = B.toDataURL(`image/${e}`, t));
351
351
  }
352
- return v || null;
352
+ return F || null;
353
353
  } catch {
354
354
  return null;
355
355
  } finally {
356
- c.x = d, c.y = h, g && g.destroy(!0);
356
+ d.x = h, d.y = p, d.scale.x = m, d.scale.y = _, P && P.destroy(!0);
357
357
  }
358
358
  }
359
359
  /**
@@ -431,7 +431,7 @@ class ke extends O {
431
431
  this.sprite = null, this.originalTexture = null, this.baseTexture = null, this._container = null, this.removeAllListeners();
432
432
  }
433
433
  }
434
- const Pe = {
434
+ const Me = {
435
435
  adjust: ["adjust", "advanced"],
436
436
  // adjustment, adjustmentAdvanced, alpha, colorMatrix
437
437
  blur: ["blur"],
@@ -447,7 +447,7 @@ const Pe = {
447
447
  stylize: ["stylize"]
448
448
  // ascii, crt, crossHatch, dot, emboss
449
449
  };
450
- class Me extends O {
450
+ class Fe extends U {
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 Me extends O {
482
482
  */
483
483
  getFiltersByCategory(e) {
484
484
  if (!this._filterRegistry) return [];
485
- const t = Pe[e] || [e], i = [], r = /* @__PURE__ */ new Set();
485
+ const t = Me[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 Me extends O {
624
624
  return this.instances[e] || null;
625
625
  }
626
626
  }
627
- const I = class I extends O {
627
+ const X = class X extends U {
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 I = class I extends O {
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 = I.AUTO_ZOOM_PADDING;
704
+ const d = X.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 I = class I extends O {
720
720
  _checkAutoZoom() {
721
721
  if (!this.state.get("autoZoomOnCropOverflow")) return;
722
722
  const e = Date.now();
723
- if (e - this._lastAutoZoomCheck < I.AUTO_ZOOM_THROTTLE_MS) return;
723
+ if (e - this._lastAutoZoomCheck < X.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 = I.calcAutoZoom(
727
+ const a = X.calcAutoZoom(
728
728
  t,
729
729
  i.width,
730
730
  i.height,
@@ -752,8 +752,8 @@ const I = class I extends O {
752
752
  if (!l) return;
753
753
  const c = this.state.get("crop.shape");
754
754
  if (n.save(), c === "circle") {
755
- const y = l.x + l.width / 2, P = l.y + l.height / 2, _ = Math.min(l.width, l.height) / 2;
756
- n.beginPath(), n.arc(y, P, _, 0, Math.PI * 2), n.clip();
755
+ const y = l.x + l.width / 2, v = l.y + l.height / 2, x = Math.min(l.width, l.height) / 2;
756
+ n.beginPath(), n.arc(y, v, x, 0, Math.PI * 2), n.clip();
757
757
  } else
758
758
  n.beginPath(), n.rect(l.x, l.y, l.width, l.height), n.clip();
759
759
  n.clearRect(l.x, l.y, l.width, l.height), n.restore(), n.strokeStyle = "#ffffff", n.lineWidth = 2, n.setLineDash([5, 5]), c === "circle" ? (n.beginPath(), n.arc(
@@ -771,15 +771,15 @@ const I = class I extends O {
771
771
  { x: l.x + l.width, y: l.y, m: "resize-ne" },
772
772
  { x: l.x, y: l.y + l.height, m: "resize-sw" },
773
773
  { x: l.x + l.width, y: l.y + l.height, m: "resize-se" }
774
- ], x = [
774
+ ], _ = [
775
775
  { x: l.x + l.width / 2, y: l.y, m: "n" },
776
776
  { x: l.x + l.width / 2, y: l.y + l.height, m: "s" },
777
777
  { x: l.x, y: l.y + l.height / 2, m: "w" },
778
778
  { x: l.x + l.width, y: l.y + l.height / 2, m: "e" }
779
- ], g = [...m, ...x];
779
+ ], g = [...m, ..._];
780
780
  for (const y of g) {
781
- const P = this._hoverMode === y.m, _ = P ? p + 4 : p;
782
- n.beginPath(), n.rect(y.x - _ / 2, y.y - _ / 2, _, _), n.fillStyle = P ? "#4da3ff" : "#ffffff", n.strokeStyle = "rgba(0,0,0,0.6)", n.lineWidth = 1, n.fill(), n.stroke();
781
+ const v = this._hoverMode === y.m, x = v ? p + 4 : p;
782
+ n.beginPath(), n.rect(y.x - x / 2, y.y - x / 2, x, x), n.fillStyle = v ? "#4da3ff" : "#ffffff", n.strokeStyle = "rgba(0,0,0,0.6)", n.lineWidth = 1, n.fill(), n.stroke();
783
783
  }
784
784
  }
785
785
  /**
@@ -890,33 +890,33 @@ const I = class I extends O {
890
890
  const e = this.renderer.app, t = this.renderer.sprite, i = this.renderer.originalTexture, r = this.state.get("crop.rect");
891
891
  if (!r || !t || !e || !i) return null;
892
892
  const a = window.PIXI, o = this.renderer.zoom, n = i.width / t.width, l = i.height / t.height, c = (r.x - t.x) * n, d = (r.y - t.y) * l;
893
- let h = Math.round(Math.max(1, r.width * n)), p = Math.round(Math.max(1, r.height * l)), m = Math.round(c), x = Math.round(d);
893
+ let h = Math.round(Math.max(1, r.width * n)), p = Math.round(Math.max(1, r.height * l)), m = Math.round(c), _ = Math.round(d);
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)), 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);
897
+ const $ = Math.round(Math.max(h, p)), _e = m + h / 2, xe = _ + p / 2;
898
+ m = Math.round(_e - $ / 2), _ = Math.round(xe - $ / 2), h = p = $;
899
+ const R = new a.Graphics();
900
+ typeof R.circle == "function" && typeof R.fill == "function" ? R.circle(h / 2, p / 2, h / 2).fill(16777215) : (R.beginFill(16777215, 1), R.drawCircle(h / 2, p / 2, h / 2), R.endFill()), y.mask = R, g.addChild(R);
901
901
  }
902
- y.x = -m, y.y = -x, g.addChild(y);
903
- const _ = a.RenderTexture.create({ width: h, height: p });
902
+ y.x = -m, y.y = -_, g.addChild(y);
903
+ const x = a.RenderTexture.create({ width: h, height: p });
904
904
  e.renderer.render({
905
905
  container: g,
906
- target: _,
906
+ target: x,
907
907
  clear: !0
908
908
  }), g.destroy({ children: !0 });
909
- const v = this.renderer.originalTexture;
910
- v && v !== this.renderer.baseTexture && v.destroy(!0), this.renderer.originalTexture = _, e.stage.removeChild(t), t.destroy();
911
- const C = new a.Sprite(_);
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 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),
909
+ const P = this.renderer.originalTexture;
910
+ P && P !== this.renderer.baseTexture && P.destroy(!0), this.renderer.originalTexture = x, e.stage.removeChild(t), t.destroy();
911
+ const S = new a.Sprite(x);
912
+ e.stage.addChild(S), this.renderer.sprite = S, this.renderer.fitScale = this.renderer.getFitScaleFor(x), this.renderer.setZoom(o, { keepCenter: !1 }), this.renderer.applyViewTransform(), this.renderer.render();
913
+ const T = this.state.get("crop.appliedRect"), F = T && Number.isFinite(T.x) && Number.isFinite(T.y) && Number.isFinite(T.width) && Number.isFinite(T.height) ? {
914
+ x: Math.round(T.x + m),
915
+ y: Math.round(T.y + _),
916
916
  width: h,
917
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 };
918
+ } : { x: m, y: _, width: h, height: p }, B = this.state.get("crop.shape") || "free", V = this.state.get("crop.aspect") || "free";
919
+ return this.disable(), this.state.set("crop.appliedRect", F), this.state.set("crop.appliedShape", B), this.state.set("crop.appliedAspect", V), this.emit("applied", { width: h, height: p }), { texture: x, preservedZoom: o };
920
920
  }
921
921
  /**
922
922
  * Apply a crop from saved texture-pixel coordinates (for state rehydration).
@@ -933,18 +933,18 @@ const I = class I extends O {
933
933
  if (l <= 0 || c <= 0) return null;
934
934
  const p = new o.Container(), m = new o.Sprite(a);
935
935
  if (t === "circle") {
936
- const P = Math.round(Math.max(l, c)), _ = d + l / 2, v = h + c / 2;
937
- d = Math.round(_ - P / 2), h = Math.round(v - P / 2), l = c = P;
938
- const C = new o.Graphics();
939
- typeof C.circle == "function" && typeof C.fill == "function" ? C.circle(l / 2, c / 2, l / 2).fill(16777215) : (C.beginFill(16777215, 1), C.drawCircle(l / 2, c / 2, l / 2), C.endFill()), m.mask = C, p.addChild(C);
936
+ const v = Math.round(Math.max(l, c)), x = d + l / 2, P = h + c / 2;
937
+ d = Math.round(x - v / 2), h = Math.round(P - v / 2), l = c = v;
938
+ const S = new o.Graphics();
939
+ typeof S.circle == "function" && typeof S.fill == "function" ? S.circle(l / 2, c / 2, l / 2).fill(16777215) : (S.beginFill(16777215, 1), S.drawCircle(l / 2, c / 2, l / 2), S.endFill()), m.mask = S, p.addChild(S);
940
940
  }
941
941
  m.x = -d, m.y = -h, p.addChild(m);
942
- const x = o.RenderTexture.create({ width: l, height: c });
943
- i.renderer.render({ container: p, target: x, clear: !0 }), p.destroy({ children: !0 });
942
+ const _ = o.RenderTexture.create({ width: l, height: c });
943
+ i.renderer.render({ container: p, target: _, clear: !0 }), p.destroy({ children: !0 });
944
944
  const g = this.renderer.originalTexture;
945
- g && g !== this.renderer.baseTexture && g.destroy(!0), this.renderer.originalTexture = x, i.stage.removeChild(r), r.destroy();
946
- const y = new o.Sprite(x);
947
- return i.stage.addChild(y), this.renderer.sprite = y, this.renderer.fitScale = this.renderer.getFitScaleFor(x), this.renderer.setZoom(n, { keepCenter: !1 }), this.renderer.applyViewTransform(), this.renderer.render(), { texture: x, preservedZoom: n };
945
+ g && g !== this.renderer.baseTexture && g.destroy(!0), this.renderer.originalTexture = _, i.stage.removeChild(r), r.destroy();
946
+ const y = new o.Sprite(_);
947
+ return i.stage.addChild(y), this.renderer.sprite = y, this.renderer.fitScale = this.renderer.getFitScaleFor(_), this.renderer.setZoom(n, { keepCenter: !1 }), this.renderer.applyViewTransform(), this.renderer.render(), { texture: _, preservedZoom: n };
948
948
  }
949
949
  /**
950
950
  * Cancel crop
@@ -971,12 +971,12 @@ const I = class I extends O {
971
971
  * Padding factor for auto-zoom: image will be ~91% of crop size (1/1.1).
972
972
  * Higher values = more aggressive zoom-out, more padding around image.
973
973
  */
974
- j(I, "AUTO_ZOOM_PADDING", 1.1), /**
974
+ W(X, "AUTO_ZOOM_PADDING", 1.1), /**
975
975
  * Minimum interval (ms) between auto-zoom adjustments during drag.
976
976
  */
977
- j(I, "AUTO_ZOOM_THROTTLE_MS", 100);
978
- let W = I;
979
- class Fe {
977
+ W(X, "AUTO_ZOOM_THROTTLE_MS", 100);
978
+ let Q = X;
979
+ class Ae {
980
980
  /**
981
981
  * Create a new RemoveBgManager
982
982
  * @param {Object} options
@@ -1102,7 +1102,7 @@ function u(s, e = {}, ...t) {
1102
1102
  typeof r == "string" ? i.appendChild(document.createTextNode(r)) : r instanceof HTMLElement && i.appendChild(r);
1103
1103
  return i;
1104
1104
  }
1105
- function oe({ id: s, label: e, min: t = 0, max: i = 1, step: r = 0.01, value: a = 0.5, onChange: o }) {
1105
+ function he({ id: s, label: e, min: t = 0, max: i = 1, step: r = 0.01, value: a = 0.5, onChange: o }) {
1106
1106
  const n = s.includes("-") ? s.split("-").slice(1).join("-") : s, l = u("div", {
1107
1107
  className: "slider-control slider-wrapper",
1108
1108
  "data-control": n,
@@ -1111,7 +1111,7 @@ function oe({ id: s, label: e, min: t = 0, max: i = 1, step: r = 0.01, value: a
1111
1111
  "div",
1112
1112
  { className: "slider-header" },
1113
1113
  u("label", { for: s, className: "slider-label" }, e),
1114
- u("span", { className: "slider-value", id: `${s}-value` }, q(a))
1114
+ u("span", { className: "slider-value", id: `${s}-value` }, Z(a))
1115
1115
  ), d = u("input", {
1116
1116
  type: "range",
1117
1117
  id: s,
@@ -1122,19 +1122,19 @@ function oe({ id: s, label: e, min: t = 0, max: i = 1, step: r = 0.01, value: a
1122
1122
  value: String(a),
1123
1123
  onInput: (h) => {
1124
1124
  const p = parseFloat(h.target.value), m = l.querySelector(".slider-value");
1125
- m && (m.textContent = q(p)), o == null || o(p);
1125
+ m && (m.textContent = Z(p)), o == null || o(p);
1126
1126
  }
1127
1127
  });
1128
1128
  return l.appendChild(c), l.appendChild(d), l.setValue = (h) => {
1129
1129
  d.value = String(h);
1130
1130
  const p = l.querySelector(".slider-value");
1131
- p && (p.textContent = q(h));
1131
+ p && (p.textContent = Z(h));
1132
1132
  }, l;
1133
1133
  }
1134
- function q(s) {
1134
+ function Z(s) {
1135
1135
  return Number.isInteger(s) ? String(s) : s.toFixed(2);
1136
1136
  }
1137
- function ne({ id: s, label: e, checked: t = !1, onChange: i }) {
1137
+ function de({ id: s, label: e, checked: t = !1, onChange: i }) {
1138
1138
  const r = u("div", { className: "toggle-control" }), a = u("label", { className: "toggle-label", for: s }, e), o = u("input", {
1139
1139
  type: "checkbox",
1140
1140
  id: s,
@@ -1151,7 +1151,7 @@ function ne({ id: s, label: e, checked: t = !1, onChange: i }) {
1151
1151
  o.checked = c;
1152
1152
  }, r;
1153
1153
  }
1154
- function le({ id: s, label: e, value: t = "#000000", onChange: i }) {
1154
+ function ue({ id: s, label: e, value: t = "#000000", onChange: i }) {
1155
1155
  const r = u("div", { className: "color-control" }), a = u("label", { className: "color-label", for: s }, e), o = u("input", {
1156
1156
  type: "color",
1157
1157
  id: s,
@@ -1163,7 +1163,7 @@ function le({ id: s, label: e, value: t = "#000000", onChange: i }) {
1163
1163
  o.value = n;
1164
1164
  }, r;
1165
1165
  }
1166
- function ce({ id: s, label: e, options: t = [], value: i, onChange: r }) {
1166
+ function pe({ id: s, label: e, options: t = [], value: i, onChange: r }) {
1167
1167
  const a = u("div", { className: "select-control" }), o = u("label", { className: "select-label", for: s }, e), n = u("select", {
1168
1168
  id: s,
1169
1169
  className: "select-input",
@@ -1177,7 +1177,7 @@ function ce({ id: s, label: e, options: t = [], value: i, onChange: r }) {
1177
1177
  n.value = l;
1178
1178
  }, a;
1179
1179
  }
1180
- function R({ label: s, className: e = "", onClick: t, icon: i = null, disabled: r = !1 }) {
1180
+ function N({ label: s, className: e = "", onClick: t, icon: i = null, disabled: r = !1 }) {
1181
1181
  const a = u("button", {
1182
1182
  type: "button",
1183
1183
  className: `btn ${e}`.trim(),
@@ -1192,7 +1192,7 @@ function R({ label: s, className: e = "", onClick: t, icon: i = null, disabled:
1192
1192
  }
1193
1193
  return s && a.appendChild(document.createTextNode(s)), a;
1194
1194
  }
1195
- function w({ icon: s, title: e, className: t = "", onClick: i, disabled: r = !1, testId: a = null, ariaLabel: o = null }) {
1195
+ function C({ icon: s, title: e, className: t = "", onClick: i, disabled: r = !1, testId: a = null, ariaLabel: o = null }) {
1196
1196
  const n = {
1197
1197
  type: "button",
1198
1198
  className: `icon-btn ${t}`.trim(),
@@ -1207,7 +1207,7 @@ function w({ icon: s, title: e, className: t = "", onClick: i, disabled: r = !1,
1207
1207
  const c = l.querySelector("svg");
1208
1208
  return c && c.setAttribute("aria-hidden", "true"), l;
1209
1209
  }
1210
- function Z({ label: s, icon: e, active: t = !1, onClick: i }) {
1210
+ function J({ label: s, icon: e, active: t = !1, onClick: i }) {
1211
1211
  const r = u("button", {
1212
1212
  type: "button",
1213
1213
  className: `chip ${t ? "active" : ""}`.trim(),
@@ -1223,8 +1223,8 @@ function Z({ label: s, icon: e, active: t = !1, onClick: i }) {
1223
1223
  r.classList.toggle("active", a);
1224
1224
  }, r;
1225
1225
  }
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 {
1226
+ const fe = '<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>', me = '<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>', 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 448M256 184v74m-37-37h74"/></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="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>', 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="M432 320v112H320M80 192V80h112M320 80h112v112M192 432H80V320"/></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="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>', Ie = '<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>', Ee = '<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>', 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="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>', 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="M176 112l80-80 80 80M255.98 32l.02 448M176 400l80 80 80-80M400 176l80 80-80 80M112 176l-80 80 80 80M32 256h448"/></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="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>', ge = '<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>', 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="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>', 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="M368 368L144 144M368 144L144 368"/></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="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>', 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="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>', De = '<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>', 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="M416 128L192 384l-96-96"/></svg>', Ue = '<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>', Ve = '<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>', 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="M80 96h64l64 320h64l64-160h96"/></svg>', ie = '<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>', 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="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>', qe = '<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 He {
1228
1228
  constructor(e, t) {
1229
1229
  this.state = e, this.editor = t, this.element = null, this._unsubscribers = [];
1230
1230
  }
@@ -1234,8 +1234,8 @@ class qe {
1234
1234
  */
1235
1235
  render() {
1236
1236
  this.element = u("div", { className: "editor-toolbar" });
1237
- const e = u("div", { className: "toolbar-section toolbar-left" }), t = w({
1238
- icon: Le,
1237
+ const e = u("div", { className: "toolbar-section toolbar-left" }), t = C({
1238
+ icon: De,
1239
1239
  title: "Open Image",
1240
1240
  className: "toolbar-btn",
1241
1241
  testId: "btn-open-image",
@@ -1243,8 +1243,8 @@ class qe {
1243
1243
  onClick: () => this.editor.openFilePicker()
1244
1244
  });
1245
1245
  e.appendChild(t);
1246
- const i = u("div", { className: "toolbar-section toolbar-center" }), r = w({
1247
- icon: ze,
1246
+ const i = u("div", { className: "toolbar-section toolbar-center" }), r = C({
1247
+ icon: Re,
1248
1248
  title: "Zoom Out",
1249
1249
  className: "toolbar-btn",
1250
1250
  testId: "btn-zoom-out",
@@ -1260,8 +1260,8 @@ class qe {
1260
1260
  "aria-atomic": "true",
1261
1261
  role: "status"
1262
1262
  }, "100%");
1263
- const a = w({
1264
- icon: Ae,
1263
+ const a = C({
1264
+ icon: ze,
1265
1265
  title: "Zoom In",
1266
1266
  className: "toolbar-btn",
1267
1267
  testId: "btn-zoom-in",
@@ -1270,8 +1270,8 @@ class qe {
1270
1270
  const h = this.state.get("zoom");
1271
1271
  this.editor.setZoom(h + 0.25);
1272
1272
  }
1273
- }), o = w({
1274
- icon: Re,
1273
+ }), o = C({
1274
+ icon: Ne,
1275
1275
  title: "Fit to Screen",
1276
1276
  className: "toolbar-btn",
1277
1277
  testId: "btn-fit-screen",
@@ -1280,15 +1280,15 @@ class qe {
1280
1280
  });
1281
1281
  i.appendChild(r), i.appendChild(this._zoomLabel), i.appendChild(a), i.appendChild(o);
1282
1282
  const n = u("div", { className: "toolbar-section toolbar-right" });
1283
- this._themeBtn = w({
1284
- icon: this.state.get("isDarkMode") ? Q : J,
1283
+ this._themeBtn = C({
1284
+ icon: this.state.get("isDarkMode") ? ie : re,
1285
1285
  title: "Toggle Theme",
1286
1286
  className: "toolbar-btn toolbar-btn-theme",
1287
1287
  testId: "btn-toggle-theme",
1288
1288
  ariaLabel: "Toggle theme",
1289
1289
  onClick: () => this.editor.toggleTheme()
1290
- }), this._cropBtn = w({
1291
- icon: ue,
1290
+ }), this._cropBtn = C({
1291
+ icon: ge,
1292
1292
  title: "Crop",
1293
1293
  className: "toolbar-btn toolbar-btn-crop",
1294
1294
  testId: "btn-crop",
@@ -1297,22 +1297,22 @@ class qe {
1297
1297
  this.state.get("mode") === "crop" ? this.editor.setMode("filters") : this.editor.setMode("crop");
1298
1298
  }
1299
1299
  });
1300
- const l = w({
1301
- icon: pe,
1300
+ const l = C({
1301
+ icon: be,
1302
1302
  title: "Reset All",
1303
1303
  className: "toolbar-btn",
1304
1304
  testId: "btn-reset-all",
1305
1305
  ariaLabel: "Reset all changes",
1306
1306
  onClick: () => this.editor.resetAll()
1307
- }), c = w({
1308
- icon: Be,
1307
+ }), c = C({
1308
+ icon: Oe,
1309
1309
  title: "Save Image",
1310
1310
  className: "toolbar-btn toolbar-btn-primary",
1311
1311
  testId: "btn-save-edit",
1312
1312
  ariaLabel: "Save image",
1313
1313
  onClick: () => this.editor.save()
1314
- }), d = w({
1315
- icon: K,
1314
+ }), d = C({
1315
+ icon: te,
1316
1316
  title: "Close",
1317
1317
  className: "toolbar-btn",
1318
1318
  testId: "btn-cancel-edit",
@@ -1330,7 +1330,7 @@ class qe {
1330
1330
  });
1331
1331
  this._unsubscribers.push(e);
1332
1332
  const t = this.state.on("change:isDarkMode", ({ value: r }) => {
1333
- this._themeBtn.innerHTML = r ? Q : J;
1333
+ this._themeBtn.innerHTML = r ? ie : re;
1334
1334
  });
1335
1335
  this._unsubscribers.push(t);
1336
1336
  const i = this.state.on("change:mode", ({ value: r }) => {
@@ -1353,24 +1353,24 @@ class qe {
1353
1353
  this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], (e = this.element) == null || e.remove(), this.element = null;
1354
1354
  }
1355
1355
  }
1356
- const L = [
1357
- { id: "adjust", name: "Adjust", icon: Ne },
1356
+ const j = [
1357
+ { id: "adjust", name: "Adjust", icon: Te },
1358
1358
  // adjustment, adjustmentAdvanced, alpha
1359
- { id: "blur", name: "Blur", icon: Te },
1359
+ { id: "blur", name: "Blur", icon: Ie },
1360
1360
  // blur, kawaseBlur, motionBlur, radialBlur, etc.
1361
- { id: "color", name: "Color", icon: Ie },
1361
+ { id: "color", name: "Color", icon: Ee },
1362
1362
  // colorOverlay, grayscale, hslAdjustment, etc.
1363
- { id: "effects", name: "Effects", icon: Ee },
1363
+ { id: "effects", name: "Effects", icon: Xe },
1364
1364
  // noise, vignette, pixelate, dropShadow, etc.
1365
- { id: "distortion", name: "Distortion", icon: Xe },
1365
+ { id: "distortion", name: "Distortion", icon: Ye },
1366
1366
  // twist, bulgePinch, displacement, etc.
1367
- { id: "light", name: "Light", icon: Ye },
1367
+ { id: "light", name: "Light", icon: Be },
1368
1368
  // bloom, glow, godray, advancedBloom
1369
- { id: "stylize", name: "Stylize", icon: je },
1369
+ { id: "stylize", name: "Stylize", icon: qe },
1370
1370
  // ascii, crt, crossHatch, dot, emboss
1371
- { id: "crop", name: "Crop", icon: ue }
1371
+ { id: "crop", name: "Crop", icon: ge }
1372
1372
  ];
1373
- class He {
1373
+ class $e {
1374
1374
  constructor(e, t) {
1375
1375
  this.state = e, this.editor = t, this.element = null, this._chips = /* @__PURE__ */ new Map(), this._scrollIndex = 0, this._unsubscribers = [];
1376
1376
  }
@@ -1383,21 +1383,21 @@ class He {
1383
1383
  this._onSelect = e, this.element = u("div", {
1384
1384
  className: "category-carousel-container",
1385
1385
  "data-testid": "category-carousel"
1386
- }), this._leftBtn = w({
1387
- icon: he,
1386
+ }), this._leftBtn = C({
1387
+ icon: fe,
1388
1388
  title: "Previous categories",
1389
1389
  className: "carousel-nav carousel-nav-left",
1390
1390
  onClick: () => this._scrollLeft()
1391
- }), this._carousel = u("div", { className: "category-carousel" }), L.forEach((i) => {
1392
- const r = Z({
1391
+ }), this._carousel = u("div", { className: "category-carousel" }), j.forEach((i) => {
1392
+ const r = J({
1393
1393
  label: i.name,
1394
1394
  icon: i.icon,
1395
1395
  active: this.state.get("selectedCategory") === i.id,
1396
1396
  onClick: () => this._selectCategory(i.id)
1397
1397
  });
1398
1398
  r.dataset.categoryId = i.id, r.dataset.category = i.id, r.dataset.testid = `category-${i.id}`, this._chips.set(i.id, r), this._carousel.appendChild(r);
1399
- }), this._rightBtn = w({
1400
- icon: de,
1399
+ }), this._rightBtn = C({
1400
+ icon: me,
1401
1401
  title: "Next categories",
1402
1402
  className: "carousel-nav carousel-nav-right",
1403
1403
  onClick: () => this._scrollRight()
@@ -1406,7 +1406,7 @@ class He {
1406
1406
  role: "tablist",
1407
1407
  "aria-label": "Category pages"
1408
1408
  });
1409
- const t = Math.ceil(L.length / 3);
1409
+ const t = Math.ceil(j.length / 3);
1410
1410
  for (let i = 0; i < t; i++) {
1411
1411
  const r = u("button", {
1412
1412
  type: "button",
@@ -1436,8 +1436,12 @@ class He {
1436
1436
  * @param {string} categoryId
1437
1437
  */
1438
1438
  _selectCategory(e) {
1439
- var t;
1440
- this.state.set("selectedCategory", e), e === "crop" ? this.editor.setMode("crop") : this.editor.setMode("filters"), (t = this._onSelect) == null || t.call(this, e);
1439
+ var r;
1440
+ this.state.set("selectedCategory", e);
1441
+ const t = this.state.get("mode");
1442
+ e === "crop" ? t !== "crop" && this.editor.setMode("crop") : t !== "filters" && this.editor.setMode("filters");
1443
+ const i = this._chips.get(e);
1444
+ i && this._carousel && i.scrollIntoView({ behavior: "smooth", inline: "center", block: "nearest" }), (r = this._onSelect) == null || r.call(this, e);
1441
1445
  }
1442
1446
  /**
1443
1447
  * Scroll carousel left
@@ -1449,7 +1453,7 @@ class He {
1449
1453
  * Scroll carousel right
1450
1454
  */
1451
1455
  _scrollRight() {
1452
- this._scrollIndex < L.length - 3 && (this._scrollIndex++, this._scrollCarousel());
1456
+ this._scrollIndex < j.length - 3 && (this._scrollIndex++, this._scrollCarousel());
1453
1457
  }
1454
1458
  /**
1455
1459
  * Scroll to a specific page
@@ -1476,7 +1480,7 @@ class He {
1476
1480
  * Update navigation button states
1477
1481
  */
1478
1482
  _updateNavButtons() {
1479
- this._leftBtn && (this._leftBtn.disabled = this._scrollIndex === 0), this._rightBtn && (this._rightBtn.disabled = this._scrollIndex >= L.length - 3);
1483
+ this._leftBtn && (this._leftBtn.disabled = this._scrollIndex === 0), this._rightBtn && (this._rightBtn.disabled = this._scrollIndex >= j.length - 3);
1480
1484
  }
1481
1485
  /**
1482
1486
  * Update pagination dot states
@@ -1505,7 +1509,7 @@ class He {
1505
1509
  this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._chips.clear(), (e = this.element) == null || e.remove(), this.element = null;
1506
1510
  }
1507
1511
  }
1508
- class $e {
1512
+ class We {
1509
1513
  constructor(e, t) {
1510
1514
  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;
1511
1515
  }
@@ -1515,13 +1519,13 @@ class $e {
1515
1519
  * @returns {HTMLElement}
1516
1520
  */
1517
1521
  render({ onToggle: e, onSelect: t }) {
1518
- return this._onToggle = e, this._onSelect = t, this.element = u("div", { className: "filter-carousel-container" }), this._leftBtn = w({
1519
- icon: he,
1522
+ return this._onToggle = e, this._onSelect = t, this.element = u("div", { className: "filter-carousel-container" }), this._leftBtn = C({
1523
+ icon: fe,
1520
1524
  title: "Previous filters",
1521
1525
  className: "carousel-nav carousel-nav-left",
1522
1526
  onClick: () => this._scrollLeft()
1523
- }), this._carousel = u("div", { className: "filter-carousel" }), this._rightBtn = w({
1524
- icon: de,
1527
+ }), this._carousel = u("div", { className: "filter-carousel" }), this._rightBtn = C({
1528
+ icon: me,
1525
1529
  title: "Next filters",
1526
1530
  className: "carousel-nav carousel-nav-right",
1527
1531
  onClick: () => this._scrollRight()
@@ -1583,7 +1587,7 @@ class $e {
1583
1587
  this._handleToggle(e.id, h), h && (this.state.set("selectedFilter", e.id), (p = this._onSelect) == null || p.call(this, e.id));
1584
1588
  }
1585
1589
  });
1586
- return l.innerHTML = t ? G : "", r.appendChild(a), r.appendChild(n), r.appendChild(l), r._toggle = l, r._isActive = t, r;
1590
+ return l.innerHTML = t ? ee : "", r.appendChild(a), r.appendChild(n), r.appendChild(l), r._toggle = l, r._isActive = t, r;
1587
1591
  }
1588
1592
  /**
1589
1593
  * Handle filter card click (select)
@@ -1609,7 +1613,7 @@ class $e {
1609
1613
  const e = this.state.get("activeFilters");
1610
1614
  this._filterCards.forEach((t, i) => {
1611
1615
  const r = e.has(i);
1612
- t.classList.toggle("active", r), t._toggle.classList.toggle("active", r), t._toggle.innerHTML = r ? G : "", t._isActive = r;
1616
+ t.classList.toggle("active", r), t._toggle.classList.toggle("active", r), t._toggle.innerHTML = r ? ee : "", t._isActive = r;
1613
1617
  });
1614
1618
  }
1615
1619
  /**
@@ -1662,7 +1666,7 @@ class $e {
1662
1666
  this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._filterCards.clear(), (e = this.element) == null || e.remove(), this.element = null;
1663
1667
  }
1664
1668
  }
1665
- class We {
1669
+ class Ze {
1666
1670
  constructor(e, t) {
1667
1671
  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 = [];
1668
1672
  }
@@ -1707,7 +1711,7 @@ class We {
1707
1711
  return;
1708
1712
  }
1709
1713
  const i = u("div", { className: "adjustments-header" });
1710
- i.appendChild(u("span", { className: "adjustments-title" }, t.name)), i.appendChild(R({
1714
+ i.appendChild(u("span", { className: "adjustments-title" }, t.name)), i.appendChild(N({
1711
1715
  label: "Reset",
1712
1716
  className: "btn-text",
1713
1717
  onClick: () => this._handleReset(e)
@@ -1730,7 +1734,7 @@ class We {
1730
1734
  const r = t.label || t.id;
1731
1735
  switch (this._normalizeControlType(t.type)) {
1732
1736
  case "slider":
1733
- return oe({
1737
+ return he({
1734
1738
  id: `${e}-${t.id}`,
1735
1739
  label: r,
1736
1740
  min: t.min ?? 0,
@@ -1740,14 +1744,14 @@ class We {
1740
1744
  onChange: (l) => this._handleChange(e, t.id, l)
1741
1745
  });
1742
1746
  case "toggle":
1743
- return ne({
1747
+ return de({
1744
1748
  id: `${e}-${t.id}`,
1745
1749
  label: r,
1746
1750
  checked: !!i,
1747
1751
  onChange: (l) => this._handleChange(e, t.id, l)
1748
1752
  });
1749
1753
  case "color":
1750
- return le({
1754
+ return ue({
1751
1755
  id: `${e}-${t.id}`,
1752
1756
  label: r,
1753
1757
  value: typeof i == "string" && i.startsWith("#") ? i : t.default || "#000000",
@@ -1755,7 +1759,7 @@ class We {
1755
1759
  });
1756
1760
  case "select":
1757
1761
  const o = this._normalizeOptions(t.options);
1758
- return ce({
1762
+ return pe({
1759
1763
  id: `${e}-${t.id}`,
1760
1764
  label: r,
1761
1765
  options: o,
@@ -1764,7 +1768,7 @@ class We {
1764
1768
  });
1765
1769
  case "button":
1766
1770
  const n = u("div", { className: "button-control" });
1767
- return n.appendChild(R({
1771
+ return n.appendChild(N({
1768
1772
  label: r,
1769
1773
  className: "btn-secondary",
1770
1774
  onClick: () => this._handleAction(e, t.action || t.id)
@@ -1865,7 +1869,7 @@ class We {
1865
1869
  this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._controls.clear(), (e = this.element) == null || e.remove(), this.element = null;
1866
1870
  }
1867
1871
  }
1868
- class Ze {
1872
+ class Ge {
1869
1873
  constructor(e, t) {
1870
1874
  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;
1871
1875
  }
@@ -1878,22 +1882,22 @@ class Ze {
1878
1882
  this._onChange = t, this._onReset = i, this._onRemove = r, this._onAction = a, this._container = e, this._drawer = u("div", { className: "mobile-filter-drawer" });
1879
1883
  const o = u("div", { className: "drawer-header" });
1880
1884
  this._titleEl = u("span", { className: "drawer-title" }, "Filter");
1881
- const n = u("div", { className: "drawer-header-actions" }), l = R({
1885
+ const n = u("div", { className: "drawer-header-actions" }), l = N({
1882
1886
  label: "Reset",
1883
1887
  className: "btn-text",
1884
1888
  onClick: () => {
1885
1889
  var h;
1886
1890
  this._currentFilterId && ((h = this._onReset) == null || h.call(this, this._currentFilterId), this._renderControls());
1887
1891
  }
1888
- }), c = R({
1892
+ }), c = N({
1889
1893
  label: "Remove",
1890
1894
  className: "btn-text btn-danger",
1891
1895
  onClick: () => {
1892
1896
  var h;
1893
1897
  this._currentFilterId && ((h = this._onRemove) == null || h.call(this, this._currentFilterId), this.close());
1894
1898
  }
1895
- }), d = w({
1896
- icon: K,
1899
+ }), d = C({
1900
+ icon: te,
1897
1901
  title: "Close",
1898
1902
  className: "btn-icon-sm",
1899
1903
  ariaLabel: "Close drawer",
@@ -1967,7 +1971,7 @@ class Ze {
1967
1971
  const r = t.label || t.id;
1968
1972
  switch (this._normalizeControlType(t.type)) {
1969
1973
  case "slider":
1970
- return oe({
1974
+ return he({
1971
1975
  id: `drawer-${e}-${t.id}`,
1972
1976
  label: r,
1973
1977
  min: t.min ?? 0,
@@ -1980,7 +1984,7 @@ class Ze {
1980
1984
  }
1981
1985
  });
1982
1986
  case "toggle":
1983
- return ne({
1987
+ return de({
1984
1988
  id: `drawer-${e}-${t.id}`,
1985
1989
  label: r,
1986
1990
  checked: !!i,
@@ -1990,7 +1994,7 @@ class Ze {
1990
1994
  }
1991
1995
  });
1992
1996
  case "color":
1993
- return le({
1997
+ return ue({
1994
1998
  id: `drawer-${e}-${t.id}`,
1995
1999
  label: r,
1996
2000
  value: typeof i == "string" && i.startsWith("#") ? i : t.default || "#000000",
@@ -2001,7 +2005,7 @@ class Ze {
2001
2005
  });
2002
2006
  case "select": {
2003
2007
  const o = this._normalizeOptions(t.options);
2004
- return ce({
2008
+ return pe({
2005
2009
  id: `drawer-${e}-${t.id}`,
2006
2010
  label: r,
2007
2011
  options: o,
@@ -2014,7 +2018,7 @@ class Ze {
2014
2018
  }
2015
2019
  case "button": {
2016
2020
  const o = u("div", { className: "button-control" });
2017
- return o.appendChild(R({
2021
+ return o.appendChild(N({
2018
2022
  label: r,
2019
2023
  className: "btn-secondary",
2020
2024
  onClick: () => {
@@ -2061,7 +2065,7 @@ class Ze {
2061
2065
  this._controls.clear(), (e = this._drawer) == null || e.remove(), this._drawer = null, this._isOpen = !1, this._currentFilterId = null, this._container = null;
2062
2066
  }
2063
2067
  }
2064
- class Ge {
2068
+ class Ke {
2065
2069
  constructor(e, t) {
2066
2070
  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;
2067
2071
  }
@@ -2134,11 +2138,11 @@ class Ge {
2134
2138
  this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._chips.clear(), (e = this.element) == null || e.remove(), this.element = null;
2135
2139
  }
2136
2140
  }
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 = [
2141
+ const Qe = [
2142
+ { id: "free", name: "Free", icon: je },
2143
+ { id: "square", name: "Square", icon: Ue },
2144
+ { id: "circle", name: "Circle", icon: Ve }
2145
+ ], Je = [
2142
2146
  { id: "free", name: "Free" },
2143
2147
  { id: "1:1", name: "1:1" },
2144
2148
  { id: "4:3", name: "4:3" },
@@ -2146,7 +2150,7 @@ const Ke = [
2146
2150
  { id: "3:2", name: "3:2" },
2147
2151
  { id: "2:3", name: "2:3" }
2148
2152
  ];
2149
- class Je {
2153
+ class et {
2150
2154
  constructor(e, t) {
2151
2155
  this.state = e, this.cropManager = t, this.element = null, this._shapeChips = /* @__PURE__ */ new Map(), this._aspectChips = /* @__PURE__ */ new Map(), this._unsubscribers = [];
2152
2156
  }
@@ -2170,8 +2174,8 @@ class Je {
2170
2174
  const e = u("div", { className: "crop-section" });
2171
2175
  e.appendChild(u("label", { className: "section-label" }, "Shape"));
2172
2176
  const t = u("div", { className: "chip-row" }), i = this.state.get("crop.shape");
2173
- Ke.forEach((c) => {
2174
- const d = Z({
2177
+ Qe.forEach((c) => {
2178
+ const d = J({
2175
2179
  label: c.name,
2176
2180
  icon: c.icon,
2177
2181
  active: i === c.id,
@@ -2180,25 +2184,25 @@ class Je {
2180
2184
  d.dataset.shape = c.id, d.dataset.testid = `crop-shape-${c.id}`, this._shapeChips.set(c.id, d), t.appendChild(d);
2181
2185
  }), 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"));
2182
2186
  const r = u("div", { className: "chip-row aspect-row" }), a = this.state.get("crop.aspect");
2183
- Qe.forEach((c) => {
2184
- const d = Z({
2187
+ Je.forEach((c) => {
2188
+ const d = J({
2185
2189
  label: c.name,
2186
2190
  active: a === c.id,
2187
2191
  onClick: () => this._selectAspect(c.id)
2188
2192
  });
2189
2193
  d.dataset.ratio = c.id, d.dataset.testid = `crop-ratio-${c.id}`, this._aspectChips.set(c.id, d), r.appendChild(d);
2190
2194
  }), this._aspectSection.appendChild(r), this.element.appendChild(this._aspectSection), this._updateAspectVisibility();
2191
- const o = u("div", { className: "crop-actions" }), n = R({
2195
+ const o = u("div", { className: "crop-actions" }), n = N({
2192
2196
  label: "Cancel",
2193
2197
  className: "btn-secondary crop-cancel-btn",
2194
- icon: K,
2198
+ icon: te,
2195
2199
  onClick: () => this.cropManager.cancel()
2196
2200
  });
2197
2201
  n.dataset.testid = "cancel-crop";
2198
- const l = R({
2202
+ const l = N({
2199
2203
  label: "Apply Crop",
2200
2204
  className: "btn-primary crop-apply-btn",
2201
- icon: G,
2205
+ icon: ee,
2202
2206
  onClick: () => this._applyCropAndReturnToFilters()
2203
2207
  });
2204
2208
  return l.dataset.testid = "apply-crop", o.appendChild(n), o.appendChild(l), this.element.appendChild(o), this._subscribeToState(), this.element;
@@ -2261,7 +2265,7 @@ class Je {
2261
2265
  this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._shapeChips.clear(), this._aspectChips.clear(), (e = this.element) == null || e.remove(), this.element = null;
2262
2266
  }
2263
2267
  }
2264
- class et {
2268
+ class tt {
2265
2269
  constructor(e, t) {
2266
2270
  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;
2267
2271
  }
@@ -2277,7 +2281,7 @@ class et {
2277
2281
  });
2278
2282
  const o = u("div", { className: "panel-header" });
2279
2283
  o.appendChild(u("h3", { className: "panel-title" }, "Active Filters"));
2280
- const n = R({
2284
+ const n = N({
2281
2285
  label: "Clear All",
2282
2286
  className: "btn-text btn-danger",
2283
2287
  onClick: () => this._handleClearAll()
@@ -2343,13 +2347,13 @@ class et {
2343
2347
  onClick: (m) => {
2344
2348
  m.target.closest(".filter-item-actions") || this._handleSelect(e);
2345
2349
  }
2346
- }), o = u("div", { className: "filter-item-header" }), n = u("span", { className: "filter-item-name" }, t.name), l = u("div", { className: "filter-item-actions" }), c = w({
2347
- icon: pe,
2350
+ }), o = u("div", { className: "filter-item-header" }), n = u("span", { className: "filter-item-name" }, t.name), l = u("div", { className: "filter-item-actions" }), c = C({
2351
+ icon: be,
2348
2352
  title: "Reset filter",
2349
2353
  className: "btn-icon-sm",
2350
2354
  onClick: () => this._handleReset(e)
2351
- }), d = w({
2352
- icon: Oe,
2355
+ }), d = C({
2356
+ icon: Le,
2353
2357
  title: "Remove filter",
2354
2358
  className: "btn-icon-sm btn-danger",
2355
2359
  onClick: () => this._handleRemove(e)
@@ -2462,7 +2466,7 @@ class et {
2462
2466
  this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._filterItems.clear(), (e = this.element) == null || e.remove(), this.element = null;
2463
2467
  }
2464
2468
  }
2465
- const B = {
2469
+ const D = {
2466
2470
  name: "free",
2467
2471
  initialMode: "filters",
2468
2472
  cropShape: "free",
@@ -2474,12 +2478,12 @@ const B = {
2474
2478
  showCropControls: !0,
2475
2479
  maxExportWidth: void 0,
2476
2480
  maxExportHeight: void 0
2477
- }, H = {
2481
+ }, G = {
2478
2482
  free: {
2479
- ...B
2483
+ ...D
2480
2484
  },
2481
2485
  avatar: {
2482
- ...B,
2486
+ ...D,
2483
2487
  name: "avatar",
2484
2488
  initialMode: "crop",
2485
2489
  cropShape: "circle",
@@ -2489,7 +2493,7 @@ const B = {
2489
2493
  lockAspectRatio: !0
2490
2494
  },
2491
2495
  banner: {
2492
- ...B,
2496
+ ...D,
2493
2497
  name: "banner",
2494
2498
  initialMode: "crop",
2495
2499
  cropShape: "square",
@@ -2499,7 +2503,7 @@ const B = {
2499
2503
  lockAspectRatio: !0
2500
2504
  },
2501
2505
  product: {
2502
- ...B,
2506
+ ...D,
2503
2507
  name: "product",
2504
2508
  initialMode: "filters",
2505
2509
  cropShape: "square",
@@ -2509,15 +2513,15 @@ const B = {
2509
2513
  lockAspectRatio: !1
2510
2514
  }
2511
2515
  };
2512
- function tt(s) {
2516
+ function it(s) {
2513
2517
  if (!s)
2514
- return { ...H.free };
2518
+ return { ...G.free };
2515
2519
  if (typeof s == "object" && s !== null)
2516
- return { ...B, ...s };
2517
- const e = H[s];
2518
- return e ? { ...e } : { ...H.free };
2520
+ return { ...D, ...s };
2521
+ const e = G[s];
2522
+ return e ? { ...e } : { ...G.free };
2519
2523
  }
2520
- class ii extends O {
2524
+ class ii extends U {
2521
2525
  /**
2522
2526
  * Create a new VanillaImageEditor
2523
2527
  * @param {HTMLElement} container - Container element to mount the editor
@@ -2528,7 +2532,7 @@ class ii extends O {
2528
2532
  if (super(), !e)
2529
2533
  throw new Error("VanillaImageEditor: container element is required");
2530
2534
  this._container = e, this._destroyed = !1, this._loadVersion = 0, this._objectUrls = /* @__PURE__ */ new Set();
2531
- const i = t.preset ? tt(t.preset) : null, r = i ? {
2535
+ const i = t.preset ? it(t.preset) : null, r = i ? {
2532
2536
  initialMode: i.initialMode === "crop" ? "crop" : "adjust",
2533
2537
  cropShape: i.cropShape,
2534
2538
  initialAspectRatio: i.aspectRatio
@@ -2546,7 +2550,7 @@ class ii extends O {
2546
2550
  },
2547
2551
  ...r,
2548
2552
  ...t
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({
2553
+ }, this._preset = i, this._state = ke(), 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 Pe(), this._filterManager = new Fe(this._state, this._renderer), this._cropManager = new Q(this._state, this._renderer), this._removeBgManager = null, ((a = this._options.backgroundRemoval) == null ? void 0 : a.enabled) !== !1 && (this._removeBgManager = new Ae({
2550
2554
  endpoint: (o = this._options.backgroundRemoval) == null ? void 0 : o.endpoint,
2551
2555
  fallbackEndpoint: (n = this._options.backgroundRemoval) == null ? void 0 : n.fallbackEndpoint
2552
2556
  })), 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();
@@ -2582,31 +2586,31 @@ class ii extends O {
2582
2586
  * Initialize UI components
2583
2587
  */
2584
2588
  _initUI() {
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) => {
2589
+ this._toolbar = new He(this._state, this), this._toolbarContainer.appendChild(this._toolbar.render()), this._filterControlsEl = u("div", { className: "filter-controls-container" }), this._categoryCarousel = new $e(this._state, this), this._filterControlsEl.appendChild(this._categoryCarousel.render((r) => {
2586
2590
  }));
2587
2591
  const e = u("div", { className: "filter-layout" }), t = u("div", { className: "filter-left-column" });
2588
- this._filterCarousel = new $e(this._state, this._filterManager), t.appendChild(this._filterCarousel.render({
2592
+ this._filterCarousel = new We(this._state, this._filterManager), t.appendChild(this._filterCarousel.render({
2589
2593
  onToggle: (r, a) => this._handleFilterToggle(r, a),
2590
2594
  onSelect: (r) => {
2591
2595
  this._handleFilterSelect(r), this._isMobile && this._mobileFilterDrawer && this._mobileFilterDrawer.open(r);
2592
2596
  }
2593
- })), this._filterAdjustments = new We(this._state, this._filterManager), t.appendChild(this._filterAdjustments.render({
2597
+ })), this._filterAdjustments = new Ze(this._state, this._filterManager), t.appendChild(this._filterAdjustments.render({
2594
2598
  onChange: (r, a, o) => this._handleFilterChange(r, a, o),
2595
2599
  onReset: (r) => this._handleFilterReset(r),
2596
2600
  onAction: (r, a) => this._handleFilterAction(r, a)
2597
2601
  })), e.appendChild(t);
2598
2602
  const i = u("div", { className: "filter-right-column" });
2599
- this._activeFiltersPanel = new et(this._state, this._filterManager), i.appendChild(this._activeFiltersPanel.render({
2603
+ this._activeFiltersPanel = new tt(this._state, this._filterManager), i.appendChild(this._activeFiltersPanel.render({
2600
2604
  onRemove: (r) => this._handleFilterToggle(r, !1),
2601
2605
  onReset: (r) => this._handleFilterReset(r),
2602
2606
  onClearAll: () => this.resetAll(),
2603
2607
  onSelect: (r) => this._handleFilterSelect(r)
2604
- })), e.appendChild(i), this._filterControlsEl.appendChild(e), this._mobileActiveFilters = new Ge(this._state, this._filterManager), this._filterControlsEl.appendChild(this._mobileActiveFilters.render({
2608
+ })), e.appendChild(i), this._filterControlsEl.appendChild(e), this._mobileActiveFilters = new Ke(this._state, this._filterManager), this._filterControlsEl.appendChild(this._mobileActiveFilters.render({
2605
2609
  onToggle: (r, a) => this._handleFilterToggle(r, a),
2606
2610
  onSelect: (r) => {
2607
2611
  this._handleFilterSelect(r), this._isMobile && this._mobileFilterDrawer && this._mobileFilterDrawer.open(r);
2608
2612
  }
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, {
2613
+ })), this._cropControls = new et(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 Ge(this._state, this._filterManager), this._mobileFilterDrawer.build(this._controlsSection, {
2610
2614
  onChange: (r, a, o) => this._handleFilterChange(r, a, o),
2611
2615
  onReset: (r) => this._handleFilterReset(r),
2612
2616
  onRemove: (r) => {
@@ -2963,22 +2967,22 @@ class ii extends O {
2963
2967
  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();
2964
2968
  }
2965
2969
  }
2966
- const k = /* @__PURE__ */ new Map(), E = /* @__PURE__ */ new Map();
2967
- function it(s, e) {
2970
+ const k = /* @__PURE__ */ new Map(), Y = /* @__PURE__ */ new Map();
2971
+ function rt(s, e) {
2968
2972
  return !Array.isArray(s.mediaTargets) || s.mediaTargets.length === 0 ? !0 : s.mediaTargets.includes(e);
2969
2973
  }
2970
2974
  function f(s) {
2971
2975
  var e;
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;
2976
+ return k.has(s.id), k.set(s.id, s), Y.has(s.category) || Y.set(s.category, []), (e = Y.get(s.category)) == null || e.push(s.id), s;
2973
2977
  }
2974
- function rt(s) {
2978
+ function st(s) {
2975
2979
  return k.get(s);
2976
2980
  }
2977
- function U() {
2981
+ function H() {
2978
2982
  return Array.from(k.values());
2979
2983
  }
2980
- function st() {
2981
- U().map((t) => t.id), Object.entries(b).filter(
2984
+ function at() {
2985
+ H().map((t) => t.id), Object.entries(b).filter(
2982
2986
  (t) => /Filter$/.test(t[0]) && typeof t[1] == "function"
2983
2987
  ).forEach(([t, i]) => {
2984
2988
  const r = t.replace(/Filter$/, "").replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
@@ -3001,32 +3005,32 @@ function st() {
3001
3005
  });
3002
3006
  });
3003
3007
  }
3004
- function at(s) {
3005
- return (E.get(s) || []).map((t) => k.get(t)).filter(Boolean);
3008
+ function ot(s) {
3009
+ return (Y.get(s) || []).map((t) => k.get(t)).filter(Boolean);
3006
3010
  }
3007
- function ot() {
3008
- return Array.from(E.keys());
3011
+ function nt() {
3012
+ return Array.from(Y.keys());
3009
3013
  }
3010
3014
  function ri(s) {
3011
3015
  return k.has(s);
3012
3016
  }
3013
- function nt(s) {
3017
+ function lt(s) {
3014
3018
  const e = k.get(s);
3015
3019
  if (!e)
3016
3020
  return !1;
3017
3021
  k.delete(s);
3018
- const t = E.get(e.category);
3022
+ const t = Y.get(e.category);
3019
3023
  if (t) {
3020
3024
  const i = t.indexOf(s);
3021
- i !== -1 && t.splice(i, 1), t.length === 0 && E.delete(e.category);
3025
+ i !== -1 && t.splice(i, 1), t.length === 0 && Y.delete(e.category);
3022
3026
  }
3023
3027
  return !0;
3024
3028
  }
3025
3029
  function si(s, e) {
3026
3030
  const t = k.get(s);
3027
- return t ? it(t, e) : !1;
3031
+ return t ? rt(t, e) : !1;
3028
3032
  }
3029
- function lt() {
3033
+ function ct() {
3030
3034
  return Array.from(k.values()).map((s) => ({
3031
3035
  id: s.id,
3032
3036
  name: s.name,
@@ -3035,7 +3039,7 @@ function lt() {
3035
3039
  }));
3036
3040
  }
3037
3041
  if (typeof window < "u") {
3038
- window.__DEBUG_FILTERS_LIST = Array.from(k.keys()), window.getAllFilters = U, window.getFilter = rt, window.getFiltersByCategory = at, window.getRegisteredFilters = lt;
3042
+ window.__DEBUG_FILTERS_LIST = Array.from(k.keys()), window.getAllFilters = H, window.getFilter = st, window.getFiltersByCategory = ot, window.getRegisteredFilters = ct;
3039
3043
  const s = f;
3040
3044
  window.registerFilter = (e) => {
3041
3045
  const t = s(e);
@@ -3045,7 +3049,7 @@ if (typeof window < "u") {
3045
3049
  typeof window < "u" && (window.initializeFilterRegistry = window.initializeFilterRegistry || function() {
3046
3050
  return [];
3047
3051
  });
3048
- const { AdjustmentFilter: ct } = b, { ColorMatrixFilter: ht } = S, F = {
3052
+ const { AdjustmentFilter: ht } = b, { ColorMatrixFilter: dt } = w, A = {
3049
3053
  gamma: 1,
3050
3054
  saturation: 1,
3051
3055
  contrast: 1,
@@ -3054,7 +3058,7 @@ const { AdjustmentFilter: ct } = b, { ColorMatrixFilter: ht } = S, F = {
3054
3058
  green: 1,
3055
3059
  blue: 1,
3056
3060
  alpha: 1
3057
- }, dt = /* @__PURE__ */ new Set([
3061
+ }, ut = /* @__PURE__ */ new Set([
3058
3062
  "gamma",
3059
3063
  "saturation",
3060
3064
  "contrast",
@@ -3064,7 +3068,7 @@ const { AdjustmentFilter: ct } = b, { ColorMatrixFilter: ht } = S, F = {
3064
3068
  "blue",
3065
3069
  "alpha"
3066
3070
  ]);
3067
- function A(s, e) {
3071
+ function z(s, e) {
3068
3072
  if (typeof s == "number" && Number.isFinite(s))
3069
3073
  return s;
3070
3074
  if (typeof s == "string") {
@@ -3074,22 +3078,22 @@ function A(s, e) {
3074
3078
  }
3075
3079
  return e;
3076
3080
  }
3077
- function ee(s) {
3078
- return dt.has(s);
3081
+ function se(s) {
3082
+ return ut.has(s);
3079
3083
  }
3080
- function ut(s) {
3084
+ function pt(s) {
3081
3085
  return {
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)
3086
+ gamma: z(s.gamma, A.gamma),
3087
+ saturation: z(s.saturation, A.saturation),
3088
+ contrast: z(s.contrast, A.contrast),
3089
+ brightness: z(s.brightness, A.brightness),
3090
+ red: z(s.red, A.red),
3091
+ green: z(s.green, A.green),
3092
+ blue: z(s.blue, A.blue),
3093
+ alpha: z(s.alpha, A.alpha)
3090
3094
  };
3091
3095
  }
3092
- function te(s, e) {
3096
+ function ae(s, e) {
3093
3097
  s.reset(), s.brightness(e.brightness, !0), s.contrast(e.contrast, !0), s.saturate(e.saturation, !0);
3094
3098
  }
3095
3099
  f({
@@ -3100,14 +3104,14 @@ f({
3100
3104
  // Create an instance of the AdjustmentFilter with the provided parameters
3101
3105
  createFilter: (s) => {
3102
3106
  try {
3103
- const e = ut(s ?? {}), t = { ...e };
3107
+ const e = pt(s ?? {}), t = { ...e };
3104
3108
  try {
3105
- const i = new ct(t), r = i;
3109
+ const i = new ht(t), r = i;
3106
3110
  return r._customParams = { ...e }, r.updateUIParam = function(o, n) {
3107
3111
  try {
3108
- if (!ee(o))
3112
+ if (!se(o))
3109
3113
  return;
3110
- const l = this._customParams ?? { ...F }, c = A(n, l[o]);
3114
+ const l = this._customParams ?? { ...A }, c = z(n, l[o]);
3111
3115
  l[o] = c, this._customParams = l;
3112
3116
  const d = this;
3113
3117
  o in d && (d[o] = c);
@@ -3115,13 +3119,13 @@ f({
3115
3119
  }
3116
3120
  }, i;
3117
3121
  } catch {
3118
- const r = new ht(), a = r;
3119
- return a._customParams = { ...e }, te(r, e), a.updateUIParam = function(n, l) {
3122
+ const r = new dt(), a = r;
3123
+ return a._customParams = { ...e }, ae(r, e), a.updateUIParam = function(n, l) {
3120
3124
  try {
3121
- if (!ee(n))
3125
+ if (!se(n))
3122
3126
  return;
3123
- const c = this._customParams ?? { ...F }, d = A(l, c[n]);
3124
- c[n] = d, this._customParams = c, te(this, c);
3127
+ const c = this._customParams ?? { ...A }, d = z(l, c[n]);
3128
+ c[n] = d, this._customParams = c, ae(this, c);
3125
3129
  } catch {
3126
3130
  }
3127
3131
  }, r;
@@ -3225,14 +3229,14 @@ f({
3225
3229
  }
3226
3230
  ]
3227
3231
  });
3228
- const { ColorMatrixFilter: pt } = S, T = {
3232
+ const { ColorMatrixFilter: ft } = w, E = {
3229
3233
  brightness: 1,
3230
3234
  contrast: 1,
3231
3235
  saturation: 1,
3232
3236
  hue: 0,
3233
3237
  sepia: 0,
3234
3238
  negative: !1
3235
- }, ft = /* @__PURE__ */ new Set([
3239
+ }, mt = /* @__PURE__ */ new Set([
3236
3240
  "brightness",
3237
3241
  "contrast",
3238
3242
  "saturation",
@@ -3240,10 +3244,10 @@ const { ColorMatrixFilter: pt } = S, T = {
3240
3244
  "sepia",
3241
3245
  "negative"
3242
3246
  ]);
3243
- function mt(s) {
3244
- return ft.has(s);
3247
+ function gt(s) {
3248
+ return mt.has(s);
3245
3249
  }
3246
- function Y(s, e) {
3250
+ function L(s, e) {
3247
3251
  if (typeof s == "number" && Number.isFinite(s))
3248
3252
  return s;
3249
3253
  if (typeof s == "string") {
@@ -3253,7 +3257,7 @@ function Y(s, e) {
3253
3257
  }
3254
3258
  return e;
3255
3259
  }
3256
- function fe(s, e) {
3260
+ function ye(s, e) {
3257
3261
  if (typeof s == "boolean")
3258
3262
  return s;
3259
3263
  if (typeof s == "string") {
@@ -3264,17 +3268,17 @@ function fe(s, e) {
3264
3268
  }
3265
3269
  return e;
3266
3270
  }
3267
- function gt(s) {
3271
+ function bt(s) {
3268
3272
  return {
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)
3273
+ brightness: L(s.brightness, E.brightness),
3274
+ contrast: L(s.contrast, E.contrast),
3275
+ saturation: L(s.saturation, E.saturation),
3276
+ hue: L(s.hue, E.hue),
3277
+ sepia: L(s.sepia, E.sepia),
3278
+ negative: ye(s.negative, E.negative)
3275
3279
  };
3276
3280
  }
3277
- function ie(s, e) {
3281
+ function oe(s, e) {
3278
3282
  s.reset(), e.brightness !== 1 && s.brightness(e.brightness, !0), e.contrast !== 1 && s.contrast(e.contrast, !0), e.saturation !== 1 && s.saturate(e.saturation, !0), e.hue !== 0 && s.hue(e.hue, !0), e.sepia > 0 && s.sepia(!0), e.negative && s.negative(!0);
3279
3283
  }
3280
3284
  f({
@@ -3285,19 +3289,19 @@ f({
3285
3289
  // Create an instance of the ColorMatrixFilter with the provided parameters
3286
3290
  createFilter: (s) => {
3287
3291
  try {
3288
- const e = gt(s ?? {}), t = new pt(), i = t;
3289
- return i._customParams = { ...e }, ie(t, e), i.updateUIParam = function(a, o) {
3292
+ const e = bt(s ?? {}), t = new ft(), i = t;
3293
+ return i._customParams = { ...e }, oe(t, e), i.updateUIParam = function(a, o) {
3290
3294
  try {
3291
- if (!mt(a))
3295
+ if (!gt(a))
3292
3296
  return;
3293
- const n = this._customParams ?? { ...T };
3297
+ const n = this._customParams ?? { ...E };
3294
3298
  if (a === "negative")
3295
- n.negative = fe(o, n.negative);
3299
+ n.negative = ye(o, n.negative);
3296
3300
  else {
3297
3301
  const l = a;
3298
- n[l] = Y(o, n[l]);
3302
+ n[l] = L(o, n[l]);
3299
3303
  }
3300
- this._customParams = n, ie(this, n);
3304
+ this._customParams = n, oe(this, n);
3301
3305
  } catch {
3302
3306
  }
3303
3307
  }, t;
@@ -3383,7 +3387,7 @@ f({
3383
3387
  // Create an instance of the ColorMatrixFilter with alpha adjustment
3384
3388
  createFilter: (s) => {
3385
3389
  try {
3386
- const e = s.alpha !== void 0 ? s.alpha : 1, t = new S.ColorMatrixFilter();
3390
+ const e = s.alpha !== void 0 ? s.alpha : 1, t = new w.ColorMatrixFilter();
3387
3391
  return t.alpha = e, t._customParams = {
3388
3392
  alpha: e
3389
3393
  }, t.updateUIParam = function(i, r) {
@@ -3430,7 +3434,7 @@ f({
3430
3434
  */
3431
3435
  createFilter: (s) => {
3432
3436
  try {
3433
- const e = new S.BlurFilter({
3437
+ const e = new w.BlurFilter({
3434
3438
  strength: s.blur || 8,
3435
3439
  quality: s.quality || 4
3436
3440
  });
@@ -3489,7 +3493,7 @@ f({
3489
3493
  description: "Advanced color adjustments including sepia, hue rotation, and more",
3490
3494
  // Create an instance of the ColorMatrixFilter with the provided parameters
3491
3495
  createFilter: (s) => {
3492
- const e = S.ColorMatrixFilter;
3496
+ const e = w.ColorMatrixFilter;
3493
3497
  if (!e)
3494
3498
  return null;
3495
3499
  const t = new e();
@@ -3569,7 +3573,7 @@ f({
3569
3573
  }
3570
3574
  ]
3571
3575
  });
3572
- const { ColorOverlayFilter: bt } = b;
3576
+ const { ColorOverlayFilter: yt } = b;
3573
3577
  f({
3574
3578
  id: "colorOverlay",
3575
3579
  name: "Color Overlay",
@@ -3584,7 +3588,7 @@ f({
3584
3588
  try {
3585
3589
  let e = 16711680;
3586
3590
  s.color && (typeof s.color == "string" ? e = parseInt(s.color.replace("#", "0x"), 16) : typeof s.color == "number" && (e = s.color));
3587
- const t = new bt({
3591
+ const t = new yt({
3588
3592
  color: e,
3589
3593
  alpha: s.alpha || 0.5
3590
3594
  });
@@ -3816,7 +3820,7 @@ f({
3816
3820
  }
3817
3821
  ]
3818
3822
  });
3819
- const { ColorMatrixFilter: yt } = S;
3823
+ const { ColorMatrixFilter: _t } = w;
3820
3824
  f({
3821
3825
  id: "grayscale",
3822
3826
  name: "Grayscale",
@@ -3829,14 +3833,14 @@ f({
3829
3833
  */
3830
3834
  createFilter: (s) => {
3831
3835
  try {
3832
- const e = new yt();
3836
+ const e = new _t();
3833
3837
  e._customParams = { ...s };
3834
3838
  const t = s.intensity !== void 0 ? s.intensity : 1;
3835
- return re(e, t), e.updateUIParam = function(i, r) {
3839
+ return ne(e, t), e.updateUIParam = function(i, r) {
3836
3840
  const a = this._customParams || {};
3837
3841
  switch (this._customParams = a, a[i] = r, i) {
3838
3842
  case "intensity":
3839
- re(this, r);
3843
+ ne(this, r);
3840
3844
  break;
3841
3845
  default:
3842
3846
  i in this && (this[i] = r);
@@ -3866,10 +3870,10 @@ f({
3866
3870
  }
3867
3871
  ]
3868
3872
  });
3869
- function re(s, e) {
3873
+ function ne(s, e) {
3870
3874
  s.reset(), s.greyscale(e);
3871
3875
  }
3872
- const { HslAdjustmentFilter: _t } = b;
3876
+ const { HslAdjustmentFilter: xt } = b;
3873
3877
  f({
3874
3878
  id: "hsl-adjustment",
3875
3879
  name: "HSL Adjustment",
@@ -3881,7 +3885,7 @@ f({
3881
3885
  */
3882
3886
  createFilter: (s) => {
3883
3887
  try {
3884
- const e = new _t({
3888
+ const e = new xt({
3885
3889
  hue: s.hue !== void 0 ? s.hue : 0,
3886
3890
  saturation: s.saturation !== void 0 ? s.saturation : 0,
3887
3891
  lightness: s.lightness !== void 0 ? s.lightness : 0,
@@ -3979,7 +3983,7 @@ f({
3979
3983
  }
3980
3984
  ]
3981
3985
  });
3982
- const { KawaseBlurFilter: xt } = b;
3986
+ const { KawaseBlurFilter: Ct } = b;
3983
3987
  f({
3984
3988
  id: "kawase-blur",
3985
3989
  name: "Kawase Blur",
@@ -3992,7 +3996,7 @@ f({
3992
3996
  */
3993
3997
  createFilter: (s) => {
3994
3998
  try {
3995
- const e = new xt({
3999
+ const e = new Ct({
3996
4000
  strength: s.strength || 4,
3997
4001
  quality: s.quality || 3,
3998
4002
  clamp: s.clamp || !1,
@@ -4097,7 +4101,7 @@ f({
4097
4101
  }
4098
4102
  ]
4099
4103
  });
4100
- const { MotionBlurFilter: Ct } = b;
4104
+ const { MotionBlurFilter: wt } = b;
4101
4105
  f({
4102
4106
  id: "motion-blur",
4103
4107
  name: "Motion Blur",
@@ -4110,7 +4114,7 @@ f({
4110
4114
  */
4111
4115
  createFilter: (s) => {
4112
4116
  try {
4113
- const e = new Ct({
4117
+ const e = new wt({
4114
4118
  velocity: {
4115
4119
  x: s.velocityX !== void 0 ? s.velocityX : 0,
4116
4120
  y: s.velocityY !== void 0 ? s.velocityY : 0
@@ -4205,7 +4209,7 @@ f({
4205
4209
  }
4206
4210
  ]
4207
4211
  });
4208
- const { RadialBlurFilter: wt } = b;
4212
+ const { RadialBlurFilter: St } = b;
4209
4213
  f({
4210
4214
  id: "radial-blur",
4211
4215
  name: "Radial Blur",
@@ -4214,7 +4218,7 @@ f({
4214
4218
  // Create an instance of the RadialBlurFilter with the provided parameters
4215
4219
  createFilter: (s) => {
4216
4220
  try {
4217
- const e = new wt({
4221
+ const e = new St({
4218
4222
  angle: s.angle ?? 20,
4219
4223
  center: { x: s.centerX ?? 0, y: s.centerY ?? 0 },
4220
4224
  kernelSize: s.kernelSize ?? 15,
@@ -4329,7 +4333,7 @@ f({
4329
4333
  }
4330
4334
  ]
4331
4335
  });
4332
- const { TiltShiftFilter: St } = b;
4336
+ const { TiltShiftFilter: vt } = b;
4333
4337
  f({
4334
4338
  id: "tilt-shift",
4335
4339
  name: "Tilt Shift",
@@ -4338,7 +4342,7 @@ f({
4338
4342
  // Create an instance of the TiltShiftFilter with the provided parameters
4339
4343
  createFilter: (s) => {
4340
4344
  try {
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({
4345
+ 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 vt({
4342
4346
  blur: Number(e),
4343
4347
  gradientBlur: Number(t),
4344
4348
  start: { x: Number(i), y: Number(r) },
@@ -4457,7 +4461,7 @@ f({
4457
4461
  }
4458
4462
  ]
4459
4463
  });
4460
- const { ZoomBlurFilter: vt } = b;
4464
+ const { ZoomBlurFilter: kt } = b;
4461
4465
  f({
4462
4466
  id: "zoom-blur",
4463
4467
  name: "Zoom Blur",
@@ -4470,7 +4474,7 @@ f({
4470
4474
  */
4471
4475
  createFilter: (s) => {
4472
4476
  try {
4473
- const e = new vt({
4477
+ const e = new kt({
4474
4478
  strength: s.strength || 0.1,
4475
4479
  center: {
4476
4480
  x: s.centerX !== void 0 ? s.centerX : 0.5,
@@ -4584,7 +4588,7 @@ f({
4584
4588
  }
4585
4589
  ]
4586
4590
  });
4587
- const { ColorGradientFilter: se } = b;
4591
+ const { ColorGradientFilter: le } = b;
4588
4592
  f({
4589
4593
  id: "color-gradient",
4590
4594
  name: "Color Gradient",
@@ -4608,7 +4612,7 @@ f({
4608
4612
  { offset: 0, color: 16711680, alpha: 1 },
4609
4613
  { offset: 1, color: 255, alpha: 1 }
4610
4614
  ]), e.sort((i, r) => i.offset - r.offset);
4611
- const t = new se({
4615
+ const t = new le({
4612
4616
  type: s.gradientType,
4613
4617
  // 0: linear, 1: radial, 2: conic
4614
4618
  stops: e,
@@ -4698,7 +4702,7 @@ f({
4698
4702
  case "cssGradient":
4699
4703
  if (r && typeof r == "string" && r.trim() !== "")
4700
4704
  try {
4701
- const h = new se({ css: r });
4705
+ const h = new le({ css: r });
4702
4706
  this.type = h.type, this.angle = h.angle, this.stops = [...h.stops], a.colorStops = this.stops.map((p) => ({
4703
4707
  offset: p.offset,
4704
4708
  color: typeof p.color == "number" ? "#" + p.color.toString(16).padStart(6, "0") : p.color,
@@ -4721,9 +4725,9 @@ f({
4721
4725
  if (/colorStops\[\d+\]\..*/.test(i)) {
4722
4726
  const h = i.match(/colorStops\[(\d+)\]\.(.*)/);
4723
4727
  if (h) {
4724
- const [p, m, x] = h, g = parseInt(m), y = [...this.stops];
4728
+ const [p, m, _] = h, g = parseInt(m), y = [...this.stops];
4725
4729
  if (g >= 0 && g < y.length)
4726
- return x === "color" && typeof r == "string" ? y[g].color = parseInt(r.replace("#", "0x")) : (x === "offset" || x === "alpha") && (y[g][x] = r), this.stops = y, this.stops.sort((P, _) => P.offset - _.offset), a.colorStops = this.getColorStopsForUI(), !0;
4730
+ return _ === "color" && typeof r == "string" ? y[g].color = parseInt(r.replace("#", "0x")) : (_ === "offset" || _ === "alpha") && (y[g][_] = r), this.stops = y, this.stops.sort((v, x) => v.offset - x.offset), a.colorStops = this.getColorStopsForUI(), !0;
4727
4731
  }
4728
4732
  } else i in this && (this[i] = r);
4729
4733
  break;
@@ -4840,7 +4844,7 @@ f({
4840
4844
  if (!e)
4841
4845
  return null;
4842
4846
  let t = null;
4843
- s.texturePath ? t = S.Texture.from(s.texturePath) : t = S.Texture.from("/examples/filters-main/examples/images/colormap.png");
4847
+ s.texturePath ? t = w.Texture.from(s.texturePath) : t = w.Texture.from("/examples/filters-main/examples/images/colormap.png");
4844
4848
  const i = new e({
4845
4849
  colorMap: t,
4846
4850
  nearest: s.nearest,
@@ -4850,7 +4854,7 @@ f({
4850
4854
  const o = this._customParams || {};
4851
4855
  switch (this._customParams = o, o[r] = a, r) {
4852
4856
  case "texturePath":
4853
- a && (this.colorMap = S.Texture.from(a));
4857
+ a && (this.colorMap = w.Texture.from(a));
4854
4858
  break;
4855
4859
  case "mix":
4856
4860
  this.mix = a;
@@ -4911,7 +4915,7 @@ f({
4911
4915
  }
4912
4916
  ]
4913
4917
  });
4914
- const kt = b.ColorReplaceFilter;
4918
+ const Pt = b.ColorReplaceFilter;
4915
4919
  f({
4916
4920
  id: "color-replace",
4917
4921
  name: "Color Replace",
@@ -4928,7 +4932,7 @@ f({
4928
4932
  s.originalColor && (typeof s.originalColor == "string" ? e = parseInt(s.originalColor.replace("#", "0x"), 16) : typeof s.originalColor == "number" && (e = s.originalColor));
4929
4933
  let t = 255;
4930
4934
  s.targetColor && (typeof s.targetColor == "string" ? t = parseInt(s.targetColor.replace("#", "0x"), 16) : typeof s.targetColor == "number" && (t = s.targetColor));
4931
- const i = new kt({
4935
+ const i = new Pt({
4932
4936
  originalColor: e,
4933
4937
  targetColor: t,
4934
4938
  tolerance: s.tolerance || 0.4
@@ -4992,7 +4996,7 @@ f({
4992
4996
  }
4993
4997
  ]
4994
4998
  });
4995
- const Pt = b.MultiColorReplaceFilter;
4999
+ const Mt = b.MultiColorReplaceFilter;
4996
5000
  f({
4997
5001
  id: "multi-color-replace",
4998
5002
  name: "Multi-Color Replace",
@@ -5018,7 +5022,7 @@ f({
5018
5022
  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;
5019
5023
  e.push([i, r]);
5020
5024
  }
5021
- const t = new Pt(
5025
+ const t = new Mt(
5022
5026
  e,
5023
5027
  s.tolerance || 0.05,
5024
5028
  3
@@ -5129,7 +5133,7 @@ f({
5129
5133
  }
5130
5134
  ]
5131
5135
  });
5132
- const { RGBSplitFilter: Mt } = b;
5136
+ const { RGBSplitFilter: Ft } = b;
5133
5137
  f({
5134
5138
  id: "rgb-split",
5135
5139
  name: "RGB Split",
@@ -5150,7 +5154,7 @@ f({
5150
5154
  }, i = {
5151
5155
  x: s.blueX !== void 0 ? s.blueX : 0,
5152
5156
  y: s.blueY !== void 0 ? s.blueY : 0
5153
- }, r = new Mt({
5157
+ }, r = new Ft({
5154
5158
  red: e,
5155
5159
  green: t,
5156
5160
  blue: i
@@ -5263,7 +5267,7 @@ f({
5263
5267
  }
5264
5268
  ]
5265
5269
  });
5266
- const { AdvancedBloomFilter: Ft } = b;
5270
+ const { AdvancedBloomFilter: At } = b;
5267
5271
  f({
5268
5272
  id: "advanced-bloom",
5269
5273
  name: "Advanced Bloom",
@@ -5272,7 +5276,7 @@ f({
5272
5276
  // Create an instance of the AdvancedBloomFilter with the provided parameters
5273
5277
  createFilter: (s) => {
5274
5278
  try {
5275
- const e = new Ft({
5279
+ const e = new At({
5276
5280
  threshold: s.threshold || 0.5,
5277
5281
  bloomScale: s.bloomScale || 1,
5278
5282
  brightness: s.brightness || 1,
@@ -5419,7 +5423,7 @@ f({
5419
5423
  }
5420
5424
  ]
5421
5425
  });
5422
- const At = b.AsciiFilter;
5426
+ const zt = b.AsciiFilter;
5423
5427
  f({
5424
5428
  id: "ascii",
5425
5429
  name: "ASCII",
@@ -5431,7 +5435,7 @@ f({
5431
5435
  const e = typeof s.size == "number" ? s.size : 8;
5432
5436
  let t = s.color;
5433
5437
  typeof t == "string" && t.startsWith("#") && (t = parseInt(t.replace("#", "0x"), 16));
5434
- const i = s.replaceColor === !0, r = new At({
5438
+ const i = s.replaceColor === !0, r = new zt({
5435
5439
  size: e,
5436
5440
  color: t,
5437
5441
  replaceColor: i
@@ -5498,7 +5502,7 @@ f({
5498
5502
  }
5499
5503
  ]
5500
5504
  });
5501
- const zt = b.BackdropBlurFilter;
5505
+ const Rt = b.BackdropBlurFilter;
5502
5506
  f({
5503
5507
  id: "backdrop-blur",
5504
5508
  name: "Backdrop Blur",
@@ -5507,7 +5511,7 @@ f({
5507
5511
  // Create an instance of the BackdropBlurFilter with the provided parameters
5508
5512
  createFilter: (s) => {
5509
5513
  try {
5510
- const e = new zt({
5514
+ const e = new Rt({
5511
5515
  // Higher strength values (20-50) make the effect more noticeable
5512
5516
  strength: s.strength || 20,
5513
5517
  quality: s.quality || 4,
@@ -5605,7 +5609,7 @@ f({
5605
5609
  }
5606
5610
  ]
5607
5611
  });
5608
- const { BevelFilter: Rt } = b;
5612
+ const { BevelFilter: Nt } = b;
5609
5613
  f({
5610
5614
  id: "bevel",
5611
5615
  name: "Bevel",
@@ -5617,7 +5621,7 @@ f({
5617
5621
  */
5618
5622
  createFilter: (s) => {
5619
5623
  try {
5620
- const e = s.lightColor ? s.lightColor.replace("#", "0x") : "0xffffff", t = s.shadowColor ? s.shadowColor.replace("#", "0x") : "0x000000", i = new Rt({
5624
+ const e = s.lightColor ? s.lightColor.replace("#", "0x") : "0xffffff", t = s.shadowColor ? s.shadowColor.replace("#", "0x") : "0x000000", i = new Nt({
5621
5625
  rotation: s.rotation !== void 0 ? s.rotation : 45,
5622
5626
  thickness: s.thickness !== void 0 ? s.thickness : 2,
5623
5627
  lightColor: parseInt(e, 16),
@@ -5733,7 +5737,7 @@ f({
5733
5737
  }
5734
5738
  ]
5735
5739
  });
5736
- const { BloomFilter: Nt } = b;
5740
+ const { BloomFilter: Tt } = b;
5737
5741
  f({
5738
5742
  id: "bloom",
5739
5743
  name: "Bloom/Glow",
@@ -5742,7 +5746,7 @@ f({
5742
5746
  // Create an instance of the BloomFilter with the provided parameters
5743
5747
  createFilter: (s) => {
5744
5748
  try {
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({
5749
+ 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 Tt({
5746
5750
  strength: {
5747
5751
  x: Number(e),
5748
5752
  y: Number(t)
@@ -5845,7 +5849,7 @@ f({
5845
5849
  }
5846
5850
  ]
5847
5851
  });
5848
- const { BulgePinchFilter: Tt } = b;
5852
+ const { BulgePinchFilter: It } = b;
5849
5853
  f({
5850
5854
  id: "bulge-pinch",
5851
5855
  // ID must match what the application expects
@@ -5855,7 +5859,7 @@ f({
5855
5859
  // Create an instance of the BulgePinchFilter with the provided parameters
5856
5860
  createFilter: (s) => {
5857
5861
  try {
5858
- const e = s.centerX ?? 0.5, t = s.centerY ?? 0.5, i = s.radius ?? 100, r = s.strength ?? 1, a = new Tt({
5862
+ const e = s.centerX ?? 0.5, t = s.centerY ?? 0.5, i = s.radius ?? 100, r = s.strength ?? 1, a = new It({
5859
5863
  center: {
5860
5864
  x: e,
5861
5865
  y: t
@@ -5937,7 +5941,7 @@ f({
5937
5941
  }
5938
5942
  ]
5939
5943
  });
5940
- const { ConvolutionFilter: It } = b, X = {
5944
+ const { ConvolutionFilter: Et } = b, O = {
5941
5945
  normal: [0, 0, 0, 0, 1, 0, 0, 0, 0],
5942
5946
  gaussianBlur: [0.045, 0.122, 0.045, 0.122, 0.332, 0.122, 0.045, 0.122, 0.045],
5943
5947
  boxBlur: [1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9],
@@ -5970,16 +5974,16 @@ f({
5970
5974
  ];
5971
5975
  else {
5972
5976
  const i = s.preset;
5973
- e = X[i] || X.normal;
5977
+ e = O[i] || O.normal;
5974
5978
  }
5975
- const t = new It(e, s.width || 200, s.height || 200);
5979
+ const t = new Et(e, s.width || 200, s.height || 200);
5976
5980
  return t._customParams = { ...s }, t.updateUIParam = function(i, r) {
5977
5981
  const a = this._customParams || {};
5978
5982
  switch (this._customParams = a, a[i] = r, i) {
5979
5983
  case "preset":
5980
5984
  if (!a.customMatrix) {
5981
5985
  const o = r;
5982
- X[o] && (this.matrix = X[o]);
5986
+ O[o] && (this.matrix = O[o]);
5983
5987
  }
5984
5988
  break;
5985
5989
  case "customMatrix":
@@ -5988,7 +5992,7 @@ f({
5988
5992
  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];
5989
5993
  } else {
5990
5994
  const o = a.preset;
5991
- this.matrix = X[o] || X.normal;
5995
+ this.matrix = O[o] || O.normal;
5992
5996
  }
5993
5997
  break;
5994
5998
  case "m00":
@@ -6183,7 +6187,7 @@ f({
6183
6187
  }
6184
6188
  ]
6185
6189
  });
6186
- const { CrossHatchFilter: Et } = b;
6190
+ const { CrossHatchFilter: Xt } = b;
6187
6191
  f({
6188
6192
  id: "cross-hatch",
6189
6193
  name: "Cross Hatch",
@@ -6193,7 +6197,7 @@ f({
6193
6197
  // Note: CrossHatchFilter has NO parameters according to PixiJS examples
6194
6198
  createFilter: (s) => {
6195
6199
  try {
6196
- const e = new Et();
6200
+ const e = new Xt();
6197
6201
  return e.updateUIParam = function(t, i) {
6198
6202
  return !0;
6199
6203
  }, e;
@@ -6390,7 +6394,7 @@ f({
6390
6394
  }
6391
6395
  ]
6392
6396
  });
6393
- const Xt = S.DisplacementFilter, Yt = S.Sprite, $ = S.Texture;
6397
+ const Yt = w.DisplacementFilter, Bt = w.Sprite, K = w.Texture;
6394
6398
  f({
6395
6399
  id: "displacement",
6396
6400
  // ID must match what the application expects
@@ -6403,7 +6407,7 @@ f({
6403
6407
  const e = s.mapTexture || "/assets/images/displacement_map.png";
6404
6408
  let t;
6405
6409
  try {
6406
- t = $.from(e), t.source.addressMode = "repeat";
6410
+ t = K.from(e), t.source.addressMode = "repeat";
6407
6411
  } catch {
6408
6412
  const o = document.createElement("canvas");
6409
6413
  o.width = 256, o.height = 256;
@@ -6414,9 +6418,9 @@ f({
6414
6418
  for (let c = 0; c < 10; c++)
6415
6419
  (l + c) % 2 === 0 && n.fillRect(l * 25, c * 25, 25, 25);
6416
6420
  }
6417
- t = $.from(o);
6421
+ t = K.from(o);
6418
6422
  }
6419
- const i = new Yt(t), r = new Xt(i, s.scale || 50);
6423
+ const i = new Bt(t), r = new Yt(i, s.scale || 50);
6420
6424
  return r.scale.x = s.scaleX || 50, r.scale.y = s.scaleY || 50, r._customParams = { ...s }, r._displacementSprite = i, r.updateUIParam = function(a, o) {
6421
6425
  const n = this._customParams || {};
6422
6426
  switch (this._customParams = n, n[a] = o, a) {
@@ -6430,7 +6434,7 @@ f({
6430
6434
  try {
6431
6435
  const l = this._displacementSprite;
6432
6436
  if (l) {
6433
- const c = $.from(o);
6437
+ const c = K.from(o);
6434
6438
  c.source.addressMode = "repeat", l.texture = c;
6435
6439
  }
6436
6440
  } catch {
@@ -6563,7 +6567,7 @@ f({
6563
6567
  }
6564
6568
  ]
6565
6569
  });
6566
- const { EmbossFilter: Bt } = b;
6570
+ const { EmbossFilter: Ot } = b;
6567
6571
  f({
6568
6572
  id: "emboss",
6569
6573
  name: "Emboss",
@@ -6572,7 +6576,7 @@ f({
6572
6576
  // Create an instance of the Emboss filter with the provided parameters
6573
6577
  createFilter: (s) => {
6574
6578
  try {
6575
- const e = typeof s.strength == "number" ? s.strength : 5, t = new Bt(e);
6579
+ const e = typeof s.strength == "number" ? s.strength : 5, t = new Ot(e);
6576
6580
  return t._customParams = {
6577
6581
  strength: e
6578
6582
  }, t.updateUIParam = function(i, r) {
@@ -6612,7 +6616,7 @@ f({
6612
6616
  }
6613
6617
  ]
6614
6618
  });
6615
- const { GlitchFilter: Ot } = b, N = {
6619
+ const { GlitchFilter: Lt } = b, I = {
6616
6620
  TRANSPARENT: 0,
6617
6621
  ORIGINAL: 1,
6618
6622
  LOOP: 2,
@@ -6626,7 +6630,7 @@ f({
6626
6630
  description: "Apply digital distortion and glitch effects",
6627
6631
  createFilter: (s) => {
6628
6632
  try {
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({
6633
+ const e = { x: s.redX, y: s.redY }, t = { x: s.greenX, y: s.greenY }, i = { x: s.blueX, y: s.blueY }, r = new Lt({
6630
6634
  slices: s.slices,
6631
6635
  offset: s.offset,
6632
6636
  direction: s.direction,
@@ -6704,7 +6708,7 @@ f({
6704
6708
  slices: 10,
6705
6709
  offset: 100,
6706
6710
  direction: 0,
6707
- fillMode: N.LOOP,
6711
+ fillMode: I.LOOP,
6708
6712
  // LOOP mode looks better for the demo
6709
6713
  seed: 0.5,
6710
6714
  average: !1,
@@ -6767,13 +6771,13 @@ f({
6767
6771
  label: "Fill Mode",
6768
6772
  property: "fillMode",
6769
6773
  options: [
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" }
6774
+ { value: I.TRANSPARENT, label: "Transparent" },
6775
+ { value: I.ORIGINAL, label: "Original" },
6776
+ { value: I.LOOP, label: "Loop" },
6777
+ { value: I.CLAMP, label: "Clamp" },
6778
+ { value: I.MIRROR, label: "Mirror" }
6775
6779
  ],
6776
- default: N.LOOP
6780
+ default: I.LOOP
6777
6781
  },
6778
6782
  {
6779
6783
  id: "seed",
@@ -6867,7 +6871,7 @@ f({
6867
6871
  }
6868
6872
  ]
6869
6873
  });
6870
- const { GlowFilter: Lt } = b;
6874
+ const { GlowFilter: Dt } = b;
6871
6875
  f({
6872
6876
  id: "glow",
6873
6877
  name: "Glow",
@@ -6876,7 +6880,7 @@ f({
6876
6880
  // Create an instance of the GlowFilter with the provided parameters
6877
6881
  createFilter: (s) => {
6878
6882
  try {
6879
- const e = parseInt(s.color.replace("#", "0x"), 16), t = new Lt({
6883
+ const e = parseInt(s.color.replace("#", "0x"), 16), t = new Dt({
6880
6884
  distance: s.distance || 10,
6881
6885
  outerStrength: s.outerStrength || 4,
6882
6886
  innerStrength: s.innerStrength || 0,
@@ -7002,7 +7006,7 @@ f({
7002
7006
  }
7003
7007
  ]
7004
7008
  });
7005
- const { GodrayFilter: Dt } = b;
7009
+ const { GodrayFilter: Ut } = b;
7006
7010
  f({
7007
7011
  id: "godray",
7008
7012
  name: "Godray",
@@ -7011,7 +7015,7 @@ f({
7011
7015
  // Create an instance of the GodrayFilter with the provided parameters
7012
7016
  createFilter: (s) => {
7013
7017
  try {
7014
- const e = new Dt({
7018
+ const e = new Ut({
7015
7019
  angle: s.angle || 30,
7016
7020
  parallel: s.parallel ?? !0,
7017
7021
  center: {
@@ -7164,7 +7168,7 @@ f({
7164
7168
  }
7165
7169
  ]
7166
7170
  });
7167
- const Ut = b.SimpleLightmapFilter, ae = S.Texture;
7171
+ const Vt = b.SimpleLightmapFilter, ce = w.Texture;
7168
7172
  f({
7169
7173
  id: "lightmap",
7170
7174
  name: "Lightmap",
@@ -7189,14 +7193,14 @@ f({
7189
7193
  const c = a.createRadialGradient(128, 128, 10, 128, 128, 160);
7190
7194
  c.addColorStop(0, "white"), c.addColorStop(0.3, "rgba(220, 220, 220, 1)"), c.addColorStop(0.6, "rgba(150, 150, 150, 1)"), c.addColorStop(1, "black"), a.fillStyle = c, a.fillRect(0, 0, 256, 256);
7191
7195
  }
7192
- const o = ae.from(r);
7196
+ const o = ce.from(r);
7193
7197
  let n;
7194
7198
  try {
7195
7199
  typeof t == "string" && t.startsWith("#") ? n = parseInt(t.replace("#", "0x"), 16) : n = 0;
7196
7200
  } catch {
7197
7201
  n = 0;
7198
7202
  }
7199
- const l = new Ut(o, n, i);
7203
+ const l = new Vt(o, n, i);
7200
7204
  return l._customParams = {
7201
7205
  textureType: e,
7202
7206
  color: t,
@@ -7222,8 +7226,8 @@ f({
7222
7226
  const g = m.createRadialGradient(128, 128, 10, 128, 128, 160);
7223
7227
  g.addColorStop(0, "white"), g.addColorStop(0.3, "rgba(220, 220, 220, 1)"), g.addColorStop(0.6, "rgba(150, 150, 150, 1)"), g.addColorStop(1, "black"), m.fillStyle = g, m.fillRect(0, 0, 256, 256);
7224
7228
  }
7225
- const x = ae.from(p);
7226
- if (this.lightMap = x, this.enabled !== void 0) {
7229
+ const _ = ce.from(p);
7230
+ if (this.lightMap = _, this.enabled !== void 0) {
7227
7231
  const g = this.enabled;
7228
7232
  this.enabled = !1, setTimeout(() => {
7229
7233
  this.enabled = g;
@@ -7295,7 +7299,7 @@ f({
7295
7299
  }
7296
7300
  ]
7297
7301
  });
7298
- const { NoiseFilter: Vt } = S;
7302
+ const { NoiseFilter: jt } = w;
7299
7303
  f({
7300
7304
  id: "noise",
7301
7305
  name: "Noise",
@@ -7303,7 +7307,7 @@ f({
7303
7307
  description: "Add random noise to the image",
7304
7308
  createFilter: (s) => {
7305
7309
  try {
7306
- const e = new Vt({
7310
+ const e = new jt({
7307
7311
  noise: s.noise || 0.5,
7308
7312
  seed: s.seed || Math.random()
7309
7313
  });
@@ -7380,7 +7384,7 @@ f({
7380
7384
  }
7381
7385
  ]
7382
7386
  });
7383
- const { OldFilmFilter: jt } = b;
7387
+ const { OldFilmFilter: qt } = b;
7384
7388
  f({
7385
7389
  id: "old-film",
7386
7390
  name: "Old Film",
@@ -7388,7 +7392,7 @@ f({
7388
7392
  description: "Apply a vintage film effect with scratches and grain",
7389
7393
  createFilter: (s) => {
7390
7394
  try {
7391
- const e = new jt({
7395
+ const e = new qt({
7392
7396
  sepia: s.sepia,
7393
7397
  noise: s.noise,
7394
7398
  noiseSize: s.noiseSize,
@@ -7569,7 +7573,7 @@ f({
7569
7573
  }
7570
7574
  ]
7571
7575
  });
7572
- const { OutlineFilter: qt } = b;
7576
+ const { OutlineFilter: Ht } = b;
7573
7577
  f({
7574
7578
  id: "outline",
7575
7579
  name: "Outline",
@@ -7579,7 +7583,7 @@ f({
7579
7583
  try {
7580
7584
  let e = s.color;
7581
7585
  typeof e == "string" && (e = parseInt(e.replace("#", "0x"), 16));
7582
- const t = new qt({
7586
+ const t = new Ht({
7583
7587
  thickness: s.thickness || 4,
7584
7588
  color: e,
7585
7589
  alpha: s.alpha || 1,
@@ -7669,7 +7673,7 @@ f({
7669
7673
  }
7670
7674
  ]
7671
7675
  });
7672
- const { PixelateFilter: Ht } = b;
7676
+ const { PixelateFilter: $t } = b;
7673
7677
  f({
7674
7678
  id: "pixelate",
7675
7679
  name: "Pixelate",
@@ -7677,7 +7681,7 @@ f({
7677
7681
  description: "Create a pixelated or mosaic effect",
7678
7682
  createFilter: (s) => {
7679
7683
  try {
7680
- const e = new Ht(
7684
+ const e = new $t(
7681
7685
  s.useUniform ? Math.max(4, s.size || 10) : [Math.max(4, s.sizeX || 10), Math.max(4, s.sizeY || 10)]
7682
7686
  );
7683
7687
  return e._customParams = { ...s }, e.updateUIParam = function(t, i) {
@@ -7760,7 +7764,7 @@ f({
7760
7764
  }
7761
7765
  ]
7762
7766
  });
7763
- const { ReflectionFilter: $t } = b;
7767
+ const { ReflectionFilter: Wt } = b;
7764
7768
  f({
7765
7769
  id: "reflection",
7766
7770
  // ID must match what the application expects
@@ -7777,7 +7781,7 @@ f({
7777
7781
  waveLength: new Float32Array([s.wavelengthStart ?? 30, s.wavelengthEnd ?? 100]),
7778
7782
  alpha: new Float32Array([s.alphaStart ?? 1, s.alphaEnd ?? 1]),
7779
7783
  time: s.time ?? 0
7780
- }, t = new $t(e);
7784
+ }, t = new Wt(e);
7781
7785
  return t._customParams = { ...s }, t.animating = s.animating ?? !1, t.updateUIParam = function(i, r) {
7782
7786
  const a = this._customParams || {};
7783
7787
  switch (this._customParams = a, a[i] = r, i) {
@@ -7928,7 +7932,7 @@ f({
7928
7932
  }
7929
7933
  ]
7930
7934
  });
7931
- const { ShockwaveFilter: Wt } = b;
7935
+ const { ShockwaveFilter: Zt } = b;
7932
7936
  f({
7933
7937
  id: "shockwave",
7934
7938
  // ID must match what the application expects
@@ -7938,7 +7942,7 @@ f({
7938
7942
  // Create an instance of the ShockwaveFilter with the provided parameters
7939
7943
  createFilter: (s) => {
7940
7944
  try {
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({
7945
+ 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 Zt({
7942
7946
  center: i,
7943
7947
  amplitude: r,
7944
7948
  wavelength: a,
@@ -8080,7 +8084,7 @@ f({
8080
8084
  }
8081
8085
  ]
8082
8086
  });
8083
- const { SimplexNoiseFilter: Zt } = b;
8087
+ const { SimplexNoiseFilter: Gt } = b;
8084
8088
  f({
8085
8089
  id: "simplex-noise",
8086
8090
  name: "Simplex Noise",
@@ -8088,7 +8092,7 @@ f({
8088
8092
  description: "Apply procedural noise to create texture effects",
8089
8093
  createFilter: (s) => {
8090
8094
  try {
8091
- const e = s.animating ? 0 : s.offsetZ || 0, t = new Zt({
8095
+ const e = s.animating ? 0 : s.offsetZ || 0, t = new Gt({
8092
8096
  strength: s.strength,
8093
8097
  noiseScale: s.noiseScale,
8094
8098
  offsetX: s.offsetX,
@@ -8235,9 +8239,9 @@ f({
8235
8239
  }
8236
8240
  ]
8237
8241
  });
8238
- class Gt extends S.Filter {
8242
+ class Kt extends w.Filter {
8239
8243
  constructor(e) {
8240
- const t = we.from({
8244
+ const t = Se.from({
8241
8245
  vertex: `
8242
8246
  attribute vec2 aPosition;
8243
8247
  varying vec2 vTextureCoord;
@@ -8346,7 +8350,7 @@ f({
8346
8350
  description: "Creates a twisting distortion effect around a central point",
8347
8351
  createFilter: (s) => {
8348
8352
  try {
8349
- const e = new Gt({
8353
+ const e = new Kt({
8350
8354
  centerX: s.centerX ?? 0.5,
8351
8355
  centerY: s.centerY ?? 0.5,
8352
8356
  radius: s.radius ?? 0.25,
@@ -8416,8 +8420,8 @@ f({
8416
8420
  }
8417
8421
  ]
8418
8422
  });
8419
- const { AdjustmentFilter: Kt } = b;
8420
- function D(s) {
8423
+ const { AdjustmentFilter: Qt } = b;
8424
+ function q(s) {
8421
8425
  const e = typeof s == "string" ? parseInt(s.replace("#", "0x"), 16) : s;
8422
8426
  return [
8423
8427
  (e >> 16 & 255) / 255,
@@ -8425,14 +8429,14 @@ function D(s) {
8425
8429
  (e & 255) / 255
8426
8430
  ];
8427
8431
  }
8428
- class Qt extends Kt {
8432
+ class Jt extends Qt {
8429
8433
  constructor(e = {}) {
8430
8434
  super({
8431
8435
  brightness: 1,
8432
8436
  contrast: 1,
8433
8437
  saturation: 1,
8434
8438
  alpha: 1
8435
- }), this._radius = 0.8, this._strength = 1, this._colorRgb = [0, 0, 0], this._colorValue = "#000000", this._radius = e.radius ?? 0.8, this._strength = e.strength ?? 1, e.color !== void 0 && (typeof e.color == "string" ? (this._colorValue = e.color, this._colorRgb = D(e.color)) : (this._colorValue = "#" + e.color.toString(16).padStart(6, "0"), this._colorRgb = D(e.color))), this.updateVignette();
8439
+ }), this._radius = 0.8, this._strength = 1, this._colorRgb = [0, 0, 0], this._colorValue = "#000000", this._radius = e.radius ?? 0.8, this._strength = e.strength ?? 1, e.color !== void 0 && (typeof e.color == "string" ? (this._colorValue = e.color, this._colorRgb = q(e.color)) : (this._colorValue = "#" + e.color.toString(16).padStart(6, "0"), this._colorRgb = q(e.color))), this.updateVignette();
8436
8440
  }
8437
8441
  /**
8438
8442
  * Updates the filter parameters to simulate a vignette effect
@@ -8458,7 +8462,7 @@ class Qt extends Kt {
8458
8462
  return this._colorValue;
8459
8463
  }
8460
8464
  set color(e) {
8461
- typeof e == "string" ? (this._colorValue = e, this._colorRgb = D(e)) : (this._colorValue = "#" + e.toString(16).padStart(6, "0"), this._colorRgb = D(e)), this.updateVignette();
8465
+ typeof e == "string" ? (this._colorValue = e, this._colorRgb = q(e)) : (this._colorValue = "#" + e.toString(16).padStart(6, "0"), this._colorRgb = q(e)), this.updateVignette();
8462
8466
  }
8463
8467
  }
8464
8468
  f({
@@ -8468,7 +8472,7 @@ f({
8468
8472
  description: "Add a classic darkened border effect to the image",
8469
8473
  createFilter: (s) => {
8470
8474
  try {
8471
- const e = new Qt({
8475
+ const e = new Jt({
8472
8476
  radius: s.radius || 0.8,
8473
8477
  strength: s.strength || 1,
8474
8478
  color: s.color || "#000000"
@@ -8536,18 +8540,18 @@ function ai(s) {
8536
8540
  try {
8537
8541
  let e = [], t = [];
8538
8542
  try {
8539
- e = U(), e.length === 0 && st();
8543
+ e = H(), e.length === 0 && at();
8540
8544
  } catch {
8541
8545
  }
8542
8546
  const i = s == null ? void 0 : s.disabled;
8543
8547
  if (Array.isArray(i) && i.length > 0) {
8544
8548
  let r = 0;
8545
8549
  for (const a of i)
8546
- nt(a) && r++;
8550
+ lt(a) && r++;
8547
8551
  r > 0;
8548
8552
  }
8549
8553
  try {
8550
- e = U(), t = ot();
8554
+ e = H(), t = nt();
8551
8555
  } catch {
8552
8556
  e || (e = []), t || (t = []);
8553
8557
  }
@@ -8558,15 +8562,15 @@ function ai(s) {
8558
8562
  }
8559
8563
  export {
8560
8564
  ii as V,
8561
- rt as a,
8562
- at as b,
8563
- ot as c,
8564
- st as d,
8565
+ st as a,
8566
+ ot as b,
8567
+ nt as c,
8568
+ at as d,
8565
8569
  si as e,
8566
- lt as f,
8567
- U as g,
8570
+ ct as f,
8571
+ H as g,
8568
8572
  ri as h,
8569
8573
  ai as i,
8570
8574
  f as r
8571
8575
  };
8572
- //# sourceMappingURL=editor-B9JJoibh.js.map
8576
+ //# sourceMappingURL=editor-COzKP3ld.js.map