@codingfactory/mediables-vue 2.4.19 → 2.4.21

package/dist/{editor-BfdrdqUU.js → editor-DWDUrVRz.js}

@@ -224,6 +224,29 @@ class Pe extends U {
     } catch {
     }
   }
+  /**
+   * Wait for the next animation frame, with a timeout fallback for environments
+   * where the frame callback never arrives while the editor is open.
+   * @param {number} timeoutMs
+   * @returns {Promise<void>}
+   */
+  _waitForNextFrame(e = 32) {
+    return new Promise((t) => {
+      if (typeof window > "u") {
+        t();
+        return;
+      }
+      let i = !1, r = 0;
+      const a = () => {
+        i || (i = !0, window.clearTimeout(r), t());
+      };
+      if (r = window.setTimeout(a, e), typeof window.requestAnimationFrame == "function") {
+        window.requestAnimationFrame(() => a());
+        return;
+      }
+      a();
+    });
+  }
   /**
    * Calculate fit scale for a texture
    * @param {PIXI.Texture} tex
@@ -300,7 +323,7 @@ class Pe extends U {
       return !1;
     this.originalTexture = r, this.baseTexture = r, this.sprite && (this.app.stage.removeChild(this.sprite), this.sprite.destroy()), this.sprite = new t.Sprite(r), this.app.stage.addChild(this.sprite), this.fitScale = this.getFitScaleFor(r), this.zoom = 1;
     const { w: a, h: o } = this._getCssSize();
-    if (this.applyViewTransform({ center: { x: a / 2, y: o / 2 } }), await new Promise(requestAnimationFrame), !((d = this.app) != null && d.renderer)) return !1;
+    if (this.applyViewTransform({ center: { x: a / 2, y: o / 2 } }), await this._waitForNextFrame(), !((d = this.app) != null && d.renderer)) return !1;
     const n = this.getFitScaleFor(r);
     return Math.abs(n - this.fitScale) / Math.max(1e-6, n) > 0.02 && (this.fitScale = n, this.applyViewTransform({ center: { x: a / 2, y: o / 2 } })), this.render(), this.emit("textureLoaded", { width: r.width, height: r.height }), !0;
   }
@@ -974,7 +997,12 @@ const X = class X extends U {
    * @param {'free'|'1:1'|'4:3'|'16:9'|'3:2'|'2:3'|string} aspect
    */
   setAspect(e) {
-    this.state.get("lockAspectRatio") || (this.state.set("crop.aspect", e), this.applyAspectRatio(), this.constrainCropRect(), this.drawOverlay());
+    if (this.state.get("lockAspectRatio")) return;
+    if (this.state.get("crop.shape") !== "free") {
+      if (this.state.get("lockCropShape")) return;
+      this.state.set("crop.shape", "free");
+    }
+    this.state.set("crop.aspect", e), this.applyAspectRatio(), this.constrainCropRect(), this.drawOverlay();
   }
 };
 /**
@@ -1379,8 +1407,18 @@ const j = [
   { id: "stylize", name: "Stylize", icon: qe },
   // ascii, crt, crossHatch, dot, emboss
   { id: "crop", name: "Crop", icon: ge }
-];
-class $e {
+], $e = {
+  adjust: "adjust",
+  blur: "blur",
+  color: "color",
+  effects: "effects",
+  distortion: "distortion",
+  light: "light",
+  stylize: "stylize",
+  advanced: "adjust"
+  // colorMatrix goes to adjust category
+};
+class We {
   constructor(e, t) {
     this.state = e, this.editor = t, this.element = null, this._chips = /* @__PURE__ */ new Map(), this._scrollIndex = 0, this._unsubscribers = [];
   }
@@ -1519,7 +1557,7 @@ class $e {
     this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._chips.clear(), (e = this.element) == null || e.remove(), this.element = null;
   }
 }
-class We {
+class Ze {
   constructor(e, t) {
     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;
   }
@@ -1676,7 +1714,7 @@ class We {
     this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._filterCards.clear(), (e = this.element) == null || e.remove(), this.element = null;
   }
 }
-class Ze {
+class Ge {
   constructor(e, t) {
     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 = [];
   }
@@ -1879,7 +1917,7 @@ class Ze {
     this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._controls.clear(), (e = this.element) == null || e.remove(), this.element = null;
   }
 }
-class Ge {
+class Ke {
   constructor(e, t) {
     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;
   }
@@ -2075,7 +2113,7 @@ class Ge {
     this._controls.clear(), (e = this._drawer) == null || e.remove(), this._drawer = null, this._isOpen = !1, this._currentFilterId = null, this._container = null;
   }
 }
-class Ke {
+class Qe {
   constructor(e, t) {
     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;
   }
@@ -2148,11 +2186,11 @@ class Ke {
     this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._chips.clear(), (e = this.element) == null || e.remove(), this.element = null;
   }
 }
-const Qe = [
+const Je = [
   { id: "free", name: "Free", icon: je },
   { id: "square", name: "Square", icon: Ue },
   { id: "circle", name: "Circle", icon: Ve }
-], Je = [
+], et = [
   { id: "free", name: "Free" },
   { id: "1:1", name: "1:1" },
   { id: "4:3", name: "4:3" },
@@ -2160,7 +2198,7 @@ const Qe = [
   { id: "3:2", name: "3:2" },
   { id: "2:3", name: "2:3" }
 ];
-class et {
+class tt {
   constructor(e, t) {
     this.state = e, this.cropManager = t, this.element = null, this._shapeChips = /* @__PURE__ */ new Map(), this._aspectChips = /* @__PURE__ */ new Map(), this._unsubscribers = [];
   }
@@ -2184,7 +2222,7 @@ class et {
     const e = u("div", { className: "crop-section" });
     e.appendChild(u("label", { className: "section-label" }, "Shape"));
     const t = u("div", { className: "chip-row" }), i = this.state.get("crop.shape");
-    Qe.forEach((c) => {
+    Je.forEach((c) => {
       const d = J({
         label: c.name,
         icon: c.icon,
@@ -2194,7 +2232,7 @@ class et {
       d.dataset.shape = c.id, d.dataset.testid = `crop-shape-${c.id}`, this._shapeChips.set(c.id, d), t.appendChild(d);
     }), 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"));
     const r = u("div", { className: "chip-row aspect-row" }), a = this.state.get("crop.aspect");
-    Je.forEach((c) => {
+    et.forEach((c) => {
       const d = J({
         label: c.name,
         active: a === c.id,
@@ -2275,7 +2313,7 @@ class et {
     this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._shapeChips.clear(), this._aspectChips.clear(), (e = this.element) == null || e.remove(), this.element = null;
   }
 }
-class tt {
+class it {
   constructor(e, t) {
     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;
   }
@@ -2476,7 +2514,7 @@ class tt {
     this._unsubscribers.forEach((t) => t()), this._unsubscribers = [], this._filterItems.clear(), (e = this.element) == null || e.remove(), this.element = null;
   }
 }
-const D = {
+const L = {
   name: "free",
   initialMode: "filters",
   cropShape: "free",
@@ -2490,10 +2528,10 @@ const D = {
   maxExportHeight: void 0
 }, G = {
   free: {
-    ...D
+    ...L
   },
   avatar: {
-    ...D,
+    ...L,
     name: "avatar",
     initialMode: "crop",
     cropShape: "circle",
@@ -2503,7 +2541,7 @@ const D = {
     lockAspectRatio: !0
   },
   banner: {
-    ...D,
+    ...L,
     name: "banner",
     initialMode: "crop",
     cropShape: "square",
@@ -2512,8 +2550,18 @@ const D = {
     lockCropShape: !1,
     lockAspectRatio: !0
   },
+  cover: {
+    ...L,
+    name: "cover",
+    initialMode: "crop",
+    cropShape: "free",
+    aspectRatio: "24:5",
+    autoZoomOnCropOverflow: !0,
+    lockCropShape: !0,
+    lockAspectRatio: !0
+  },
   product: {
-    ...D,
+    ...L,
     name: "product",
     initialMode: "filters",
     cropShape: "square",
@@ -2523,15 +2571,15 @@ const D = {
     lockAspectRatio: !1
   }
 };
-function it(s) {
+function rt(s) {
   if (!s)
     return { ...G.free };
   if (typeof s == "object" && s !== null)
-    return { ...D, ...s };
+    return { ...L, ...s };
   const e = G[s];
   return e ? { ...e } : { ...G.free };
 }
-class ii extends U {
+class ri extends U {
   /**
    * Create a new VanillaImageEditor
    * @param {HTMLElement} container - Container element to mount the editor
@@ -2542,7 +2590,7 @@ class ii extends U {
     if (super(), !e)
       throw new Error("VanillaImageEditor: container element is required");
     this._container = e, this._destroyed = !1, this._loadVersion = 0, this._objectUrls = /* @__PURE__ */ new Set();
-    const i = t.preset ? it(t.preset) : null, r = i ? {
+    const i = t.preset ? rt(t.preset) : null, r = i ? {
       initialMode: i.initialMode === "crop" ? "crop" : "adjust",
       cropShape: i.cropShape,
       initialAspectRatio: i.aspectRatio
@@ -2596,31 +2644,31 @@ class ii extends U {
    * Initialize UI components
    */
   _initUI() {
-    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) => {
+    this._toolbar = new He(this._state, this), this._toolbarContainer.appendChild(this._toolbar.render()), this._filterControlsEl = u("div", { className: "filter-controls-container" }), this._categoryCarousel = new We(this._state, this), this._filterControlsEl.appendChild(this._categoryCarousel.render((r) => {
     }));
     const e = u("div", { className: "filter-layout" }), t = u("div", { className: "filter-left-column" });
-    this._filterCarousel = new We(this._state, this._filterManager), t.appendChild(this._filterCarousel.render({
+    this._filterCarousel = new Ze(this._state, this._filterManager), t.appendChild(this._filterCarousel.render({
       onToggle: (r, a) => this._handleFilterToggle(r, a),
       onSelect: (r) => {
         this._handleFilterSelect(r), this._isMobile && this._mobileFilterDrawer && this._mobileFilterDrawer.open(r);
       }
-    })), this._filterAdjustments = new Ze(this._state, this._filterManager), t.appendChild(this._filterAdjustments.render({
+    })), this._filterAdjustments = new Ge(this._state, this._filterManager), t.appendChild(this._filterAdjustments.render({
       onChange: (r, a, o) => this._handleFilterChange(r, a, o),
       onReset: (r) => this._handleFilterReset(r),
       onAction: (r, a) => this._handleFilterAction(r, a)
     })), e.appendChild(t);
     const i = u("div", { className: "filter-right-column" });
-    this._activeFiltersPanel = new tt(this._state, this._filterManager), i.appendChild(this._activeFiltersPanel.render({
+    this._activeFiltersPanel = new it(this._state, this._filterManager), i.appendChild(this._activeFiltersPanel.render({
       onRemove: (r) => this._handleFilterToggle(r, !1),
       onReset: (r) => this._handleFilterReset(r),
       onClearAll: () => this.resetAll(),
       onSelect: (r) => this._handleFilterSelect(r)
-    })), e.appendChild(i), this._filterControlsEl.appendChild(e), this._mobileActiveFilters = new Ke(this._state, this._filterManager), this._filterControlsEl.appendChild(this._mobileActiveFilters.render({
+    })), e.appendChild(i), this._filterControlsEl.appendChild(e), this._mobileActiveFilters = new Qe(this._state, this._filterManager), this._filterControlsEl.appendChild(this._mobileActiveFilters.render({
       onToggle: (r, a) => this._handleFilterToggle(r, a),
       onSelect: (r) => {
         this._handleFilterSelect(r), this._isMobile && this._mobileFilterDrawer && this._mobileFilterDrawer.open(r);
       }
-    })), 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, {
+    })), this._cropControls = new tt(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 Ke(this._state, this._filterManager), this._mobileFilterDrawer.build(this._controlsSection, {
       onChange: (r, a, o) => this._handleFilterChange(r, a, o),
       onReset: (r) => this._handleFilterReset(r),
       onRemove: (r) => {
@@ -2772,10 +2820,19 @@ class ii extends U {
         e.crop.rect && (this._cropManager.applyFromPixelRect(e.crop.rect, t), this._state.set("crop.appliedRect", { ...e.crop.rect }), this._state.set("crop.appliedShape", t), this._state.set("crop.appliedAspect", i)), this._state.set("crop.shape", t), this._state.set("crop.aspect", i);
       }
       if (Array.isArray(e.filters)) {
-        for (const t of e.filters)
-          if (t.enabled && (this._state.toggleFilter(t.id, !0), this._filterManager.initializeValues(t.id), t.values))
-            for (const [i, r] of Object.entries(t.values))
-              this._state.setFilterValue(t.id, i, r);
+        let t = null;
+        for (const i of e.filters)
+          if (i.enabled && (t === null && (t = i.id), this._state.toggleFilter(i.id, !0), this._filterManager.initializeValues(i.id), i.values))
+            for (const [r, a] of Object.entries(i.values))
+              this._state.setFilterValue(i.id, r, a);
+        if (t !== null) {
+          this._state.set("selectedFilter", t);
+          const i = this._filterManager.getFilterDef(t);
+          if (typeof (i == null ? void 0 : i.category) == "string") {
+            const r = $e[i.category] ?? i.category;
+            this._state.set("selectedCategory", r);
+          }
+        }
         this._filterManager.applyFilters();
       }
     }
@@ -2978,20 +3035,20 @@ class ii extends U {
   }
 }
 const k = /* @__PURE__ */ new Map(), Y = /* @__PURE__ */ new Map();
-function rt(s, e) {
+function st(s, e) {
   return !Array.isArray(s.mediaTargets) || s.mediaTargets.length === 0 ? !0 : s.mediaTargets.includes(e);
 }
 function m(s) {
   var e;
   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;
 }
-function st(s) {
+function at(s) {
   return k.get(s);
 }
 function H() {
   return Array.from(k.values());
 }
-function at() {
+function ot() {
   H().map((t) => t.id), Object.entries(b).filter(
     (t) => /Filter$/.test(t[0]) && typeof t[1] == "function"
   ).forEach(([t, i]) => {
@@ -3015,16 +3072,16 @@ function at() {
     });
   });
 }
-function ot(s) {
+function nt(s) {
   return (Y.get(s) || []).map((t) => k.get(t)).filter(Boolean);
 }
-function nt() {
+function lt() {
   return Array.from(Y.keys());
 }
-function ri(s) {
+function si(s) {
   return k.has(s);
 }
-function lt(s) {
+function ct(s) {
   const e = k.get(s);
   if (!e)
     return !1;
@@ -3036,11 +3093,11 @@ function lt(s) {
   }
   return !0;
 }
-function si(s, e) {
+function ai(s, e) {
   const t = k.get(s);
-  return t ? rt(t, e) : !1;
+  return t ? st(t, e) : !1;
 }
-function ct() {
+function ht() {
   return Array.from(k.values()).map((s) => ({
     id: s.id,
     name: s.name,
@@ -3049,7 +3106,7 @@ function ct() {
   }));
 }
 if (typeof window < "u") {
-  window.__DEBUG_FILTERS_LIST = Array.from(k.keys()), window.getAllFilters = H, window.getFilter = st, window.getFiltersByCategory = ot, window.getRegisteredFilters = ct;
+  window.__DEBUG_FILTERS_LIST = Array.from(k.keys()), window.getAllFilters = H, window.getFilter = at, window.getFiltersByCategory = nt, window.getRegisteredFilters = ht;
   const s = m;
   window.registerFilter = (e) => {
     const t = s(e);
@@ -3059,7 +3116,7 @@ if (typeof window < "u") {
 typeof window < "u" && (window.initializeFilterRegistry = window.initializeFilterRegistry || function() {
   return [];
 });
-const { AdjustmentFilter: ht } = b, { ColorMatrixFilter: dt } = w, A = {
+const { AdjustmentFilter: dt } = b, { ColorMatrixFilter: ut } = w, A = {
   gamma: 1,
   saturation: 1,
   contrast: 1,
@@ -3068,7 +3125,7 @@ const { AdjustmentFilter: ht } = b, { ColorMatrixFilter: dt } = w, A = {
   green: 1,
   blue: 1,
   alpha: 1
-}, ut = /* @__PURE__ */ new Set([
+}, pt = /* @__PURE__ */ new Set([
   "gamma",
   "saturation",
   "contrast",
@@ -3089,9 +3146,9 @@ function z(s, e) {
   return e;
 }
 function se(s) {
-  return ut.has(s);
+  return pt.has(s);
 }
-function pt(s) {
+function ft(s) {
   return {
     gamma: z(s.gamma, A.gamma),
     saturation: z(s.saturation, A.saturation),
@@ -3114,9 +3171,9 @@ m({
   // Create an instance of the AdjustmentFilter with the provided parameters
   createFilter: (s) => {
     try {
-      const e = pt(s ?? {}), t = { ...e };
+      const e = ft(s ?? {}), t = { ...e };
       try {
-        const i = new ht(t), r = i;
+        const i = new dt(t), r = i;
         return r._customParams = { ...e }, r.updateUIParam = function(o, n) {
           try {
             if (!se(o))
@@ -3129,7 +3186,7 @@ m({
           }
         }, i;
       } catch {
-        const r = new dt(), a = r;
+        const r = new ut(), a = r;
         return a._customParams = { ...e }, ae(r, e), a.updateUIParam = function(n, l) {
           try {
             if (!se(n))
@@ -3239,14 +3296,14 @@ m({
     }
   ]
 });
-const { ColorMatrixFilter: ft } = w, E = {
+const { ColorMatrixFilter: mt } = w, E = {
   brightness: 1,
   contrast: 1,
   saturation: 1,
   hue: 0,
   sepia: 0,
   negative: !1
-}, mt = /* @__PURE__ */ new Set([
+}, gt = /* @__PURE__ */ new Set([
   "brightness",
   "contrast",
   "saturation",
@@ -3254,10 +3311,10 @@ const { ColorMatrixFilter: ft } = w, E = {
   "sepia",
   "negative"
 ]);
-function gt(s) {
-  return mt.has(s);
+function bt(s) {
+  return gt.has(s);
 }
-function L(s, e) {
+function D(s, e) {
   if (typeof s == "number" && Number.isFinite(s))
     return s;
   if (typeof s == "string") {
@@ -3278,13 +3335,13 @@ function ye(s, e) {
   }
   return e;
 }
-function bt(s) {
+function yt(s) {
   return {
-    brightness: L(s.brightness, E.brightness),
-    contrast: L(s.contrast, E.contrast),
-    saturation: L(s.saturation, E.saturation),
-    hue: L(s.hue, E.hue),
-    sepia: L(s.sepia, E.sepia),
+    brightness: D(s.brightness, E.brightness),
+    contrast: D(s.contrast, E.contrast),
+    saturation: D(s.saturation, E.saturation),
+    hue: D(s.hue, E.hue),
+    sepia: D(s.sepia, E.sepia),
     negative: ye(s.negative, E.negative)
   };
 }
@@ -3299,17 +3356,17 @@ m({
   // Create an instance of the ColorMatrixFilter with the provided parameters
   createFilter: (s) => {
     try {
-      const e = bt(s ?? {}), t = new ft(), i = t;
+      const e = yt(s ?? {}), t = new mt(), i = t;
       return i._customParams = { ...e }, oe(t, e), i.updateUIParam = function(a, o) {
         try {
-          if (!gt(a))
+          if (!bt(a))
             return;
           const n = this._customParams ?? { ...E };
           if (a === "negative")
             n.negative = ye(o, n.negative);
           else {
             const l = a;
-            n[l] = L(o, n[l]);
+            n[l] = D(o, n[l]);
           }
           this._customParams = n, oe(this, n);
         } catch {
@@ -3583,7 +3640,7 @@ m({
     }
   ]
 });
-const { ColorOverlayFilter: yt } = b;
+const { ColorOverlayFilter: _t } = b;
 m({
   id: "colorOverlay",
   name: "Color Overlay",
@@ -3598,7 +3655,7 @@ m({
     try {
       let e = 16711680;
       s.color && (typeof s.color == "string" ? e = parseInt(s.color.replace("#", "0x"), 16) : typeof s.color == "number" && (e = s.color));
-      const t = new yt({
+      const t = new _t({
         color: e,
         alpha: s.alpha || 0.5
       });
@@ -3830,7 +3887,7 @@ m({
     }
   ]
 });
-const { ColorMatrixFilter: _t } = w;
+const { ColorMatrixFilter: xt } = w;
 m({
   id: "grayscale",
   name: "Grayscale",
@@ -3843,7 +3900,7 @@ m({
    */
   createFilter: (s) => {
     try {
-      const e = new _t();
+      const e = new xt();
       e._customParams = { ...s };
       const t = s.intensity !== void 0 ? s.intensity : 1;
       return ne(e, t), e.updateUIParam = function(i, r) {
@@ -3883,7 +3940,7 @@ m({
 function ne(s, e) {
   s.reset(), s.greyscale(e);
 }
-const { HslAdjustmentFilter: xt } = b;
+const { HslAdjustmentFilter: Ct } = b;
 m({
   id: "hsl-adjustment",
   name: "HSL Adjustment",
@@ -3895,7 +3952,7 @@ m({
    */
   createFilter: (s) => {
     try {
-      const e = new xt({
+      const e = new Ct({
         hue: s.hue !== void 0 ? s.hue : 0,
         saturation: s.saturation !== void 0 ? s.saturation : 0,
         lightness: s.lightness !== void 0 ? s.lightness : 0,
@@ -3993,7 +4050,7 @@ m({
     }
   ]
 });
-const { KawaseBlurFilter: Ct } = b;
+const { KawaseBlurFilter: wt } = b;
 m({
   id: "kawase-blur",
   name: "Kawase Blur",
@@ -4006,7 +4063,7 @@ m({
    */
   createFilter: (s) => {
     try {
-      const e = new Ct({
+      const e = new wt({
         strength: s.strength || 4,
         quality: s.quality || 3,
         clamp: s.clamp || !1,
@@ -4111,7 +4168,7 @@ m({
     }
   ]
 });
-const { MotionBlurFilter: wt } = b;
+const { MotionBlurFilter: St } = b;
 m({
   id: "motion-blur",
   name: "Motion Blur",
@@ -4124,7 +4181,7 @@ m({
    */
   createFilter: (s) => {
     try {
-      const e = new wt({
+      const e = new St({
         velocity: {
           x: s.velocityX !== void 0 ? s.velocityX : 0,
           y: s.velocityY !== void 0 ? s.velocityY : 0
@@ -4219,7 +4276,7 @@ m({
     }
   ]
 });
-const { RadialBlurFilter: St } = b;
+const { RadialBlurFilter: vt } = b;
 m({
   id: "radial-blur",
   name: "Radial Blur",
@@ -4228,7 +4285,7 @@ m({
   // Create an instance of the RadialBlurFilter with the provided parameters
   createFilter: (s) => {
     try {
-      const e = new St({
+      const e = new vt({
         angle: s.angle ?? 20,
         center: { x: s.centerX ?? 0, y: s.centerY ?? 0 },
         kernelSize: s.kernelSize ?? 15,
@@ -4343,7 +4400,7 @@ m({
     }
   ]
 });
-const { TiltShiftFilter: vt } = b;
+const { TiltShiftFilter: kt } = b;
 m({
   id: "tilt-shift",
   name: "Tilt Shift",
@@ -4352,7 +4409,7 @@ m({
   // Create an instance of the TiltShiftFilter with the provided parameters
   createFilter: (s) => {
     try {
-      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({
+      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 kt({
         blur: Number(e),
         gradientBlur: Number(t),
         start: { x: Number(i), y: Number(r) },
@@ -4471,7 +4528,7 @@ m({
     }
   ]
 });
-const { ZoomBlurFilter: kt } = b;
+const { ZoomBlurFilter: Pt } = b;
 m({
   id: "zoom-blur",
   name: "Zoom Blur",
@@ -4484,7 +4541,7 @@ m({
    */
   createFilter: (s) => {
     try {
-      const e = new kt({
+      const e = new Pt({
         strength: s.strength || 0.1,
         center: {
           x: s.centerX !== void 0 ? s.centerX : 0.5,
@@ -4925,7 +4982,7 @@ m({
     }
   ]
 });
-const Pt = b.ColorReplaceFilter;
+const Mt = b.ColorReplaceFilter;
 m({
   id: "color-replace",
   name: "Color Replace",
@@ -4942,7 +4999,7 @@ m({
       s.originalColor && (typeof s.originalColor == "string" ? e = parseInt(s.originalColor.replace("#", "0x"), 16) : typeof s.originalColor == "number" && (e = s.originalColor));
       let t = 255;
       s.targetColor && (typeof s.targetColor == "string" ? t = parseInt(s.targetColor.replace("#", "0x"), 16) : typeof s.targetColor == "number" && (t = s.targetColor));
-      const i = new Pt({
+      const i = new Mt({
         originalColor: e,
         targetColor: t,
         tolerance: s.tolerance || 0.4
@@ -5006,7 +5063,7 @@ m({
     }
   ]
 });
-const Mt = b.MultiColorReplaceFilter;
+const Ft = b.MultiColorReplaceFilter;
 m({
   id: "multi-color-replace",
   name: "Multi-Color Replace",
@@ -5032,7 +5089,7 @@ m({
         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;
         e.push([i, r]);
       }
-      const t = new Mt(
+      const t = new Ft(
         e,
         s.tolerance || 0.05,
         3
@@ -5143,7 +5200,7 @@ m({
     }
   ]
 });
-const { RGBSplitFilter: Ft } = b;
+const { RGBSplitFilter: At } = b;
 m({
   id: "rgb-split",
   name: "RGB Split",
@@ -5164,7 +5221,7 @@ m({
       }, i = {
         x: s.blueX !== void 0 ? s.blueX : 0,
         y: s.blueY !== void 0 ? s.blueY : 0
-      }, r = new Ft({
+      }, r = new At({
         red: e,
         green: t,
         blue: i
@@ -5277,7 +5334,7 @@ m({
     }
   ]
 });
-const { AdvancedBloomFilter: At } = b;
+const { AdvancedBloomFilter: zt } = b;
 m({
   id: "advanced-bloom",
   name: "Advanced Bloom",
@@ -5286,7 +5343,7 @@ m({
   // Create an instance of the AdvancedBloomFilter with the provided parameters
   createFilter: (s) => {
     try {
-      const e = new At({
+      const e = new zt({
         threshold: s.threshold || 0.5,
         bloomScale: s.bloomScale || 1,
         brightness: s.brightness || 1,
@@ -5433,7 +5490,7 @@ m({
     }
   ]
 });
-const zt = b.AsciiFilter;
+const Rt = b.AsciiFilter;
 m({
   id: "ascii",
   name: "ASCII",
@@ -5445,7 +5502,7 @@ m({
       const e = typeof s.size == "number" ? s.size : 8;
       let t = s.color;
       typeof t == "string" && t.startsWith("#") && (t = parseInt(t.replace("#", "0x"), 16));
-      const i = s.replaceColor === !0, r = new zt({
+      const i = s.replaceColor === !0, r = new Rt({
         size: e,
         color: t,
         replaceColor: i
@@ -5512,7 +5569,7 @@ m({
     }
   ]
 });
-const Rt = b.BackdropBlurFilter;
+const Nt = b.BackdropBlurFilter;
 m({
   id: "backdrop-blur",
   name: "Backdrop Blur",
@@ -5521,7 +5578,7 @@ m({
   // Create an instance of the BackdropBlurFilter with the provided parameters
   createFilter: (s) => {
     try {
-      const e = new Rt({
+      const e = new Nt({
         // Higher strength values (20-50) make the effect more noticeable
         strength: s.strength || 20,
         quality: s.quality || 4,
@@ -5619,7 +5676,7 @@ m({
     }
   ]
 });
-const { BevelFilter: Nt } = b;
+const { BevelFilter: Tt } = b;
 m({
   id: "bevel",
   name: "Bevel",
@@ -5631,7 +5688,7 @@ m({
    */
   createFilter: (s) => {
     try {
-      const e = s.lightColor ? s.lightColor.replace("#", "0x") : "0xffffff", t = s.shadowColor ? s.shadowColor.replace("#", "0x") : "0x000000", i = new Nt({
+      const e = s.lightColor ? s.lightColor.replace("#", "0x") : "0xffffff", t = s.shadowColor ? s.shadowColor.replace("#", "0x") : "0x000000", i = new Tt({
         rotation: s.rotation !== void 0 ? s.rotation : 45,
         thickness: s.thickness !== void 0 ? s.thickness : 2,
         lightColor: parseInt(e, 16),
@@ -5747,7 +5804,7 @@ m({
     }
   ]
 });
-const { BloomFilter: Tt } = b;
+const { BloomFilter: It } = b;
 m({
   id: "bloom",
   name: "Bloom/Glow",
@@ -5756,7 +5813,7 @@ m({
   // Create an instance of the BloomFilter with the provided parameters
   createFilter: (s) => {
     try {
-      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({
+      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 It({
         strength: {
           x: Number(e),
           y: Number(t)
@@ -5859,7 +5916,7 @@ m({
     }
   ]
 });
-const { BulgePinchFilter: It } = b;
+const { BulgePinchFilter: Et } = b;
 m({
   id: "bulge-pinch",
   // ID must match what the application expects
@@ -5869,7 +5926,7 @@ m({
   // Create an instance of the BulgePinchFilter with the provided parameters
   createFilter: (s) => {
     try {
-      const e = s.centerX ?? 0.5, t = s.centerY ?? 0.5, i = s.radius ?? 100, r = s.strength ?? 1, a = new It({
+      const e = s.centerX ?? 0.5, t = s.centerY ?? 0.5, i = s.radius ?? 100, r = s.strength ?? 1, a = new Et({
         center: {
           x: e,
           y: t
@@ -5951,7 +6008,7 @@ m({
     }
   ]
 });
-const { ConvolutionFilter: Et } = b, O = {
+const { ConvolutionFilter: Xt } = b, O = {
   normal: [0, 0, 0, 0, 1, 0, 0, 0, 0],
   gaussianBlur: [0.045, 0.122, 0.045, 0.122, 0.332, 0.122, 0.045, 0.122, 0.045],
   boxBlur: [1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9],
@@ -5986,7 +6043,7 @@ m({
         const i = s.preset;
         e = O[i] || O.normal;
       }
-      const t = new Et(e, s.width || 200, s.height || 200);
+      const t = new Xt(e, s.width || 200, s.height || 200);
       return t._customParams = { ...s }, t.updateUIParam = function(i, r) {
         const a = this._customParams || {};
         switch (this._customParams = a, a[i] = r, i) {
@@ -6197,7 +6254,7 @@ m({
     }
   ]
 });
-const { CrossHatchFilter: Xt } = b;
+const { CrossHatchFilter: Yt } = b;
 m({
   id: "cross-hatch",
   name: "Cross Hatch",
@@ -6207,7 +6264,7 @@ m({
   // Note: CrossHatchFilter has NO parameters according to PixiJS examples
   createFilter: (s) => {
     try {
-      const e = new Xt();
+      const e = new Yt();
       return e.updateUIParam = function(t, i) {
         return !0;
       }, e;
@@ -6404,7 +6461,7 @@ m({
     }
   ]
 });
-const Yt = w.DisplacementFilter, Bt = w.Sprite, K = w.Texture;
+const Bt = w.DisplacementFilter, Ot = w.Sprite, K = w.Texture;
 m({
   id: "displacement",
   // ID must match what the application expects
@@ -6430,7 +6487,7 @@ m({
         }
         t = K.from(o);
       }
-      const i = new Bt(t), r = new Yt(i, s.scale || 50);
+      const i = new Ot(t), r = new Bt(i, s.scale || 50);
       return r.scale.x = s.scaleX || 50, r.scale.y = s.scaleY || 50, r._customParams = { ...s }, r._displacementSprite = i, r.updateUIParam = function(a, o) {
         const n = this._customParams || {};
         switch (this._customParams = n, n[a] = o, a) {
@@ -6577,7 +6634,7 @@ m({
     }
   ]
 });
-const { EmbossFilter: Ot } = b;
+const { EmbossFilter: Lt } = b;
 m({
   id: "emboss",
   name: "Emboss",
@@ -6586,7 +6643,7 @@ m({
   // Create an instance of the Emboss filter with the provided parameters
   createFilter: (s) => {
     try {
-      const e = typeof s.strength == "number" ? s.strength : 5, t = new Ot(e);
+      const e = typeof s.strength == "number" ? s.strength : 5, t = new Lt(e);
       return t._customParams = {
         strength: e
       }, t.updateUIParam = function(i, r) {
@@ -6626,7 +6683,7 @@ m({
     }
   ]
 });
-const { GlitchFilter: Lt } = b, I = {
+const { GlitchFilter: Dt } = b, I = {
   TRANSPARENT: 0,
   ORIGINAL: 1,
   LOOP: 2,
@@ -6640,7 +6697,7 @@ m({
   description: "Apply digital distortion and glitch effects",
   createFilter: (s) => {
     try {
-      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({
+      const e = { x: s.redX, y: s.redY }, t = { x: s.greenX, y: s.greenY }, i = { x: s.blueX, y: s.blueY }, r = new Dt({
         slices: s.slices,
         offset: s.offset,
         direction: s.direction,
@@ -6881,7 +6938,7 @@ m({
     }
   ]
 });
-const { GlowFilter: Dt } = b;
+const { GlowFilter: Ut } = b;
 m({
   id: "glow",
   name: "Glow",
@@ -6890,7 +6947,7 @@ m({
   // Create an instance of the GlowFilter with the provided parameters
   createFilter: (s) => {
     try {
-      const e = parseInt(s.color.replace("#", "0x"), 16), t = new Dt({
+      const e = parseInt(s.color.replace("#", "0x"), 16), t = new Ut({
         distance: s.distance || 10,
         outerStrength: s.outerStrength || 4,
         innerStrength: s.innerStrength || 0,
@@ -7016,7 +7073,7 @@ m({
     }
   ]
 });
-const { GodrayFilter: Ut } = b;
+const { GodrayFilter: Vt } = b;
 m({
   id: "godray",
   name: "Godray",
@@ -7025,7 +7082,7 @@ m({
   // Create an instance of the GodrayFilter with the provided parameters
   createFilter: (s) => {
     try {
-      const e = new Ut({
+      const e = new Vt({
         angle: s.angle || 30,
         parallel: s.parallel ?? !0,
         center: {
@@ -7178,7 +7235,7 @@ m({
     }
   ]
 });
-const Vt = b.SimpleLightmapFilter, ce = w.Texture;
+const jt = b.SimpleLightmapFilter, ce = w.Texture;
 m({
   id: "lightmap",
   name: "Lightmap",
@@ -7210,7 +7267,7 @@ m({
       } catch {
         n = 0;
       }
-      const l = new Vt(o, n, i);
+      const l = new jt(o, n, i);
       return l._customParams = {
         textureType: e,
         color: t,
@@ -7309,7 +7366,7 @@ m({
     }
   ]
 });
-const { NoiseFilter: jt } = w;
+const { NoiseFilter: qt } = w;
 m({
   id: "noise",
   name: "Noise",
@@ -7317,7 +7374,7 @@ m({
   description: "Add random noise to the image",
   createFilter: (s) => {
     try {
-      const e = new jt({
+      const e = new qt({
         noise: s.noise || 0.5,
         seed: s.seed || Math.random()
       });
@@ -7394,7 +7451,7 @@ m({
     }
   ]
 });
-const { OldFilmFilter: qt } = b;
+const { OldFilmFilter: Ht } = b;
 m({
   id: "old-film",
   name: "Old Film",
@@ -7402,7 +7459,7 @@ m({
   description: "Apply a vintage film effect with scratches and grain",
   createFilter: (s) => {
     try {
-      const e = new qt({
+      const e = new Ht({
         sepia: s.sepia,
         noise: s.noise,
         noiseSize: s.noiseSize,
@@ -7583,7 +7640,7 @@ m({
     }
   ]
 });
-const { OutlineFilter: Ht } = b;
+const { OutlineFilter: $t } = b;
 m({
   id: "outline",
   name: "Outline",
@@ -7593,7 +7650,7 @@ m({
     try {
       let e = s.color;
       typeof e == "string" && (e = parseInt(e.replace("#", "0x"), 16));
-      const t = new Ht({
+      const t = new $t({
         thickness: s.thickness || 4,
         color: e,
         alpha: s.alpha || 1,
@@ -7683,7 +7740,7 @@ m({
     }
   ]
 });
-const { PixelateFilter: $t } = b;
+const { PixelateFilter: Wt } = b;
 m({
   id: "pixelate",
   name: "Pixelate",
@@ -7691,7 +7748,7 @@ m({
   description: "Create a pixelated or mosaic effect",
   createFilter: (s) => {
     try {
-      const e = new $t(
+      const e = new Wt(
         s.useUniform ? Math.max(4, s.size || 10) : [Math.max(4, s.sizeX || 10), Math.max(4, s.sizeY || 10)]
       );
       return e._customParams = { ...s }, e.updateUIParam = function(t, i) {
@@ -7774,7 +7831,7 @@ m({
     }
   ]
 });
-const { ReflectionFilter: Wt } = b;
+const { ReflectionFilter: Zt } = b;
 m({
   id: "reflection",
   // ID must match what the application expects
@@ -7791,7 +7848,7 @@ m({
         waveLength: new Float32Array([s.wavelengthStart ?? 30, s.wavelengthEnd ?? 100]),
         alpha: new Float32Array([s.alphaStart ?? 1, s.alphaEnd ?? 1]),
         time: s.time ?? 0
-      }, t = new Wt(e);
+      }, t = new Zt(e);
       return t._customParams = { ...s }, t.animating = s.animating ?? !1, t.updateUIParam = function(i, r) {
         const a = this._customParams || {};
         switch (this._customParams = a, a[i] = r, i) {
@@ -7942,7 +7999,7 @@ m({
     }
   ]
 });
-const { ShockwaveFilter: Zt } = b;
+const { ShockwaveFilter: Gt } = b;
 m({
   id: "shockwave",
   // ID must match what the application expects
@@ -7952,7 +8009,7 @@ m({
   // Create an instance of the ShockwaveFilter with the provided parameters
   createFilter: (s) => {
     try {
-      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({
+      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 Gt({
         center: i,
         amplitude: r,
         wavelength: a,
@@ -8094,7 +8151,7 @@ m({
     }
   ]
 });
-const { SimplexNoiseFilter: Gt } = b;
+const { SimplexNoiseFilter: Kt } = b;
 m({
   id: "simplex-noise",
   name: "Simplex Noise",
@@ -8102,7 +8159,7 @@ m({
   description: "Apply procedural noise to create texture effects",
   createFilter: (s) => {
     try {
-      const e = s.animating ? 0 : s.offsetZ || 0, t = new Gt({
+      const e = s.animating ? 0 : s.offsetZ || 0, t = new Kt({
         strength: s.strength,
         noiseScale: s.noiseScale,
         offsetX: s.offsetX,
@@ -8249,7 +8306,7 @@ m({
     }
   ]
 });
-class Kt extends w.Filter {
+class Qt extends w.Filter {
   constructor(e) {
     const t = Se.from({
       vertex: `
@@ -8360,7 +8417,7 @@ m({
   description: "Creates a twisting distortion effect around a central point",
   createFilter: (s) => {
     try {
-      const e = new Kt({
+      const e = new Qt({
         centerX: s.centerX ?? 0.5,
         centerY: s.centerY ?? 0.5,
         radius: s.radius ?? 0.25,
@@ -8430,7 +8487,7 @@ m({
     }
   ]
 });
-const { AdjustmentFilter: Qt } = b;
+const { AdjustmentFilter: Jt } = b;
 function q(s) {
   const e = typeof s == "string" ? parseInt(s.replace("#", "0x"), 16) : s;
   return [
@@ -8439,7 +8496,7 @@ function q(s) {
     (e & 255) / 255
   ];
 }
-class Jt extends Qt {
+class ei extends Jt {
   constructor(e = {}) {
     super({
       brightness: 1,
@@ -8482,7 +8539,7 @@ m({
   description: "Add a classic darkened border effect to the image",
   createFilter: (s) => {
     try {
-      const e = new Jt({
+      const e = new ei({
         radius: s.radius || 0.8,
         strength: s.strength || 1,
         color: s.color || "#000000"
@@ -8546,22 +8603,22 @@ m({
     }
   ]
 });
-function ai(s) {
+function oi(s) {
   try {
     let e = [], t = [];
     try {
-      e = H(), e.length === 0 && at();
+      e = H(), e.length === 0 && ot();
     } catch {
     }
     const i = s == null ? void 0 : s.disabled;
     if (Array.isArray(i) && i.length > 0) {
       let r = 0;
       for (const a of i)
-        lt(a) && r++;
+        ct(a) && r++;
       r > 0;
     }
     try {
-      e = H(), t = nt();
+      e = H(), t = lt();
     } catch {
       e || (e = []), t || (t = []);
     }
@@ -8571,16 +8628,16 @@ function ai(s) {
   }
 }
 export {
-  ii as V,
-  st as a,
-  ot as b,
-  nt as c,
-  at as d,
-  si as e,
-  ct as f,
+  ri as V,
+  at as a,
+  nt as b,
+  lt as c,
+  ot as d,
+  ai as e,
+  ht as f,
   H as g,
-  ri as h,
-  ai as i,
+  si as h,
+  oi as i,
   m as r
 };
-//# sourceMappingURL=editor-BfdrdqUU.js.map
+//# sourceMappingURL=editor-DWDUrVRz.js.map