@anu3ev/fabric-image-editor 0.5.7 → 0.5.8

package/dist/main.js

@@ -2,24 +2,24 @@ var ds = Object.defineProperty, ls = Object.defineProperties;
 var hs = Object.getOwnPropertyDescriptors;
 var Gt = Object.getOwnPropertySymbols;
 var _e = Object.prototype.hasOwnProperty, Ne = Object.prototype.propertyIsEnumerable;
-var Re = (h, t, e) => t in h ? ds(h, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[t] = e, _ = (h, t) => {
+var Re = (l, t, e) => t in l ? ds(l, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : l[t] = e, _ = (l, t) => {
   for (var e in t || (t = {}))
-    _e.call(t, e) && Re(h, e, t[e]);
+    _e.call(t, e) && Re(l, e, t[e]);
   if (Gt)
     for (var e of Gt(t))
-      Ne.call(t, e) && Re(h, e, t[e]);
-  return h;
-}, yt = (h, t) => ls(h, hs(t));
-var vt = (h, t) => {
+      Ne.call(t, e) && Re(l, e, t[e]);
+  return l;
+}, yt = (l, t) => ls(l, hs(t));
+var vt = (l, t) => {
   var e = {};
-  for (var s in h)
-    _e.call(h, s) && t.indexOf(s) < 0 && (e[s] = h[s]);
-  if (h != null && Gt)
-    for (var s of Gt(h))
-      t.indexOf(s) < 0 && Ne.call(h, s) && (e[s] = h[s]);
+  for (var s in l)
+    _e.call(l, s) && t.indexOf(s) < 0 && (e[s] = l[s]);
+  if (l != null && Gt)
+    for (var s of Gt(l))
+      t.indexOf(s) < 0 && Ne.call(l, s) && (e[s] = l[s]);
   return e;
 };
-var N = (h, t, e) => new Promise((s, o) => {
+var N = (l, t, e) => new Promise((s, o) => {
   var n = (r) => {
     try {
       a(e.next(r));
@@ -33,7 +33,7 @@ var N = (h, t, e) => new Promise((s, o) => {
       o(c);
     }
   }, a = (r) => r.done ? s(r.value) : Promise.resolve(r.value).then(n, i);
-  a((e = e.apply(h, t)).next());
+  a((e = e.apply(l, t)).next());
 });
 import { ActiveSelection as k, Textbox as nt, util as dt, controlsUtils as xe, InteractiveFabricObject as Be, Point as tt, FitContentLayout as ke, loadSVGFromURL as us, FabricImage as zt, Gradient as ze, Rect as gs, Circle as fs, Triangle as ps, Group as Et, Color as ms, classRegistry as Pe, loadSVGFromString as ys, Canvas as vs, Pattern as bs } from "fabric";
 import { create as Ms } from "jsondiffpatch";
@@ -361,11 +361,11 @@ class Ut {
       if (c != null && c.length && r)
         for (const d of c)
           try {
-            const l = r;
-            if (l.matches && l.matches(d) || l.closest && l.closest(d))
+            const h = r;
+            if (h.matches && h.matches(d) || h.closest && h.closest(d))
               return !0;
-          } catch (l) {
-            console.warn(`Error checking selection container with selector "${d}":`, l);
+          } catch (h) {
+            console.warn(`Error checking selection container with selector "${d}":`, h);
           }
     }
     return !1;
@@ -409,11 +409,11 @@ class As {
     return this.loaders[t] ? (this.cache.has(t) || this.cache.set(t, this.loaders[t]()), this.cache.get(t)) : Promise.reject(new Error(`Unknown module "${t}"`));
   }
 }
-function js(h) {
+function js(l) {
   return new Worker(
     "" + new URL("assets/worker-CN39s7P7.js", import.meta.url).href,
     {
-      name: h == null ? void 0 : h.name
+      name: l == null ? void 0 : l.name
     }
   );
 }
@@ -464,23 +464,23 @@ class Is {
   }
 }
 const rt = 12, Cs = 2, le = 8, he = 20, Ts = 100, ue = 20, ge = 8, Es = 100, qt = 32, ye = 1, Os = "#2B2D33", ve = "#3D8BF4", be = "#FFFFFF";
-function Vt(h, t, e, s, o) {
+function Vt(l, t, e, s, o) {
   const n = rt, i = Cs;
-  h.save(), h.translate(t, e), h.rotate(dt.degreesToRadians(o.angle)), h.fillStyle = be, h.strokeStyle = ve, h.lineWidth = ye, h.beginPath(), h.roundRect(-n / 2, -n / 2, n, n, i), h.fill(), h.stroke(), h.restore();
+  l.save(), l.translate(t, e), l.rotate(dt.degreesToRadians(o.angle)), l.fillStyle = be, l.strokeStyle = ve, l.lineWidth = ye, l.beginPath(), l.roundRect(-n / 2, -n / 2, n, n, i), l.fill(), l.stroke(), l.restore();
 }
-function Ue(h, t, e, s, o) {
+function Ue(l, t, e, s, o) {
   const n = le, i = he, a = Ts;
-  h.save(), h.translate(t, e), h.rotate(dt.degreesToRadians(o.angle)), h.fillStyle = be, h.strokeStyle = ve, h.lineWidth = ye, h.beginPath(), h.roundRect(-n / 2, -i / 2, n, i, a), h.fill(), h.stroke(), h.restore();
+  l.save(), l.translate(t, e), l.rotate(dt.degreesToRadians(o.angle)), l.fillStyle = be, l.strokeStyle = ve, l.lineWidth = ye, l.beginPath(), l.roundRect(-n / 2, -i / 2, n, i, a), l.fill(), l.stroke(), l.restore();
 }
-function Ye(h, t, e, s, o) {
+function Ye(l, t, e, s, o) {
   const n = ue, i = ge, a = Es;
-  h.save(), h.translate(t, e), h.rotate(dt.degreesToRadians(o.angle)), h.fillStyle = be, h.strokeStyle = ve, h.lineWidth = ye, h.beginPath(), h.roundRect(-n / 2, -i / 2, n, i, a), h.fill(), h.stroke(), h.restore();
+  l.save(), l.translate(t, e), l.rotate(dt.degreesToRadians(o.angle)), l.fillStyle = be, l.strokeStyle = ve, l.lineWidth = ye, l.beginPath(), l.roundRect(-n / 2, -i / 2, n, i, a), l.fill(), l.stroke(), l.restore();
 }
 const Ls = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE4Ljc1IDQuMzc1djMuNzVhLjYyNS42MjUgMCAwIDEtLjYyNS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDEgMC0xLjI1aDIuMTRsLTIuMDc3LTEuOTAzLS4wMi0uMDE5YTYuMjUgNi4yNSAwIDEgMC0uMTMgOC45NjcuNjI2LjYyNiAwIDAgMSAuODYuOTA5QTcuNDU2IDcuNDU2IDAgMCAxIDEwIDE3LjVoLS4xMDNhNy41IDcuNSAwIDEgMSA1LjM5Ni0xMi44MTJMMTcuNSA2LjcwM1Y0LjM3NWEuNjI1LjYyNSAwIDAgMSAxLjI1IDBaIi8+PC9zdmc+", es = new Image();
 es.src = Ls;
-function Ds(h, t, e, s, o) {
+function Ds(l, t, e, s, o) {
   const i = qt / 2;
-  h.save(), h.translate(t, e), h.rotate(dt.degreesToRadians(o.angle)), h.fillStyle = Os, h.beginPath(), h.arc(0, 0, i, 0, 2 * Math.PI), h.fill(), h.drawImage(es, -i / 2, -i / 2, i, i), h.restore();
+  l.save(), l.translate(t, e), l.rotate(dt.degreesToRadians(o.angle)), l.fillStyle = Os, l.beginPath(), l.arc(0, 0, i, 0, 2 * Math.PI), l.fill(), l.drawImage(es, -i / 2, -i / 2, i, i), l.restore();
 }
 const Rs = {
   // Угловые точки
@@ -602,14 +602,14 @@ class J {
       });
       if (!a)
         return e ? e.apply(this, n) : void 0;
-      const { left: r, top: c, width: d, height: l } = a;
+      const { left: r, top: c, width: d, height: h } = a;
       this.set({
         flipX: !1,
         flipY: !1,
         width: d,
-        height: l
+        height: h
       });
-      const u = new tt(r + d / 2, c + l / 2);
+      const u = new tt(r + d / 2, c + h / 2);
       return this.setPositionByOrigin(u, "center", "center"), a;
     };
     const s = t._onAfterObjectsChange;
@@ -624,7 +624,7 @@ class J {
         objects: r
       });
       if (!c) return a;
-      const { left: d, top: l, width: u, height: g } = c, f = new tt(d + u / 2, l + g / 2);
+      const { left: d, top: h, width: u, height: g } = c, f = new tt(d + u / 2, h + g / 2);
       return this.set({
         width: u,
         height: g
@@ -644,7 +644,7 @@ class J {
       const d = J.calculateActiveSelectionBounds({ objects: n });
       if (!d)
         return o.call(this, n, i);
-      const { left: l, top: u, width: g, height: f } = d, p = new tt(g, f), m = new tt(l + g / 2, u + f / 2);
+      const { left: h, top: u, width: g, height: f } = d, p = new tt(g, f), m = new tt(h + g / 2, u + f / 2);
       return r === "initialization" ? {
         center: m,
         relativeCorrection: new tt(0, 0),
@@ -720,8 +720,8 @@ const B = class B {
             const u = yield new FontFace(o, i, t.descriptors).load();
             e.fonts.add(u), B.registeredFontKeys.add(r);
             return;
-          } catch (l) {
-            console.warn(`Не удалось загрузить шрифт "${o}" через FontFace API`, l);
+          } catch (h) {
+            console.warn(`Не удалось загрузить шрифт "${o}" через FontFace API`, h);
           }
         B.injectFontFace({
           font: t,
@@ -747,7 +747,7 @@ const B = class B {
       "@font-face {",
       `  font-family: ${B.formatFontFamilyForCss(i)};`,
       `  src: ${e};`,
-      ...r.map((l) => `  ${l}`),
+      ...r.map((h) => `  ${h}`),
       "}"
     ];
     a.textContent = c.join(`
@@ -932,29 +932,29 @@ const _s = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMj
     sendBackwards: ks
   },
   handlers: {
-    copyPaste: (h) => N(null, null, function* () {
-      h.clipboardManager.copyPaste();
+    copyPaste: (l) => N(null, null, function* () {
+      l.clipboardManager.copyPaste();
     }),
-    delete: (h) => {
-      h.deletionManager.deleteSelectedObjects();
+    delete: (l) => {
+      l.deletionManager.deleteSelectedObjects();
     },
-    lock: (h) => {
-      h.objectLockManager.lockObject();
+    lock: (l) => {
+      l.objectLockManager.lockObject();
     },
-    unlock: (h) => {
-      h.objectLockManager.unlockObject();
+    unlock: (l) => {
+      l.objectLockManager.unlockObject();
     },
-    bringForward: (h) => {
-      h.layerManager.bringForward();
+    bringForward: (l) => {
+      l.layerManager.bringForward();
     },
-    bringToFront: (h) => {
-      h.layerManager.bringToFront();
+    bringToFront: (l) => {
+      l.layerManager.bringToFront();
     },
-    sendToBack: (h) => {
-      h.layerManager.sendToBack();
+    sendToBack: (l) => {
+      l.layerManager.sendToBack();
     },
-    sendBackwards: (h) => {
-      h.layerManager.sendBackwards();
+    sendBackwards: (l) => {
+      l.layerManager.sendBackwards();
     }
   }
 };
@@ -1381,14 +1381,14 @@ class Jt {
       if (!t) return;
       console.log("loadStateFromFullState fullState", t);
       const { canvas: e, canvasManager: s, interactionBlocker: o, backgroundManager: n } = this.editor, { width: i, height: a } = e;
-      o.overlayMask = null, Jt._serializeCustomData(t), yield e.loadFromJSON(t, (l, u) => {
-        Jt._deserializeCustomData(l, u);
+      o.overlayMask = null, Jt._serializeCustomData(t), yield e.loadFromJSON(t, (h, u) => {
+        Jt._deserializeCustomData(h, u);
       });
-      const r = e.getObjects().find((l) => l.id === "montage-area");
+      const r = e.getObjects().find((h) => h.id === "montage-area");
       r && (this.editor.montageArea = r, (i !== e.getWidth() || a !== e.getHeight()) && s.updateCanvas());
-      const c = e.getObjects().find((l) => l.id === "overlay-mask");
+      const c = e.getObjects().find((h) => h.id === "overlay-mask");
       c && (o.overlayMask = c, o.overlayMask.visible = !1);
-      const d = e.getObjects().find((l) => l.id === "background");
+      const d = e.getObjects().find((h) => h.id === "background");
       d ? (n.backgroundObject = d, n.refresh()) : n.removeBackground({ withoutSave: !0 }), e.renderAll(), e.fire("editor:history-state-loaded", {
         fullState: t,
         currentIndex: this.currentIndex,
@@ -1479,8 +1479,8 @@ class Jt {
     ((i = (n = (o = this.canvas).getObjects) == null ? void 0 : n.call(o)) != null ? i : []).forEach((a) => {
       const r = typeof a.type == "string" ? a.type.toLowerCase() : "";
       if (!(r === "textbox" || r === "i-text" || typeof a.isEditing == "boolean") || a.locked) return;
-      const d = !!a.lockMovementX, l = !!a.lockMovementY;
-      !d && !l || (e.push({
+      const d = !!a.lockMovementX, h = !!a.lockMovementY;
+      !d && !h || (e.push({
         object: a,
         lockMovementX: a.lockMovementX,
         lockMovementY: a.lockMovementY,
@@ -1538,7 +1538,7 @@ class ct {
         withoutSelection: a = !1
       } = t;
       if (!e) return null;
-      const { canvas: r, montageArea: c, transformManager: d, historyManager: l, errorManager: u } = this.editor, g = yield this.getContentType(e), f = ct.getFormatFromContentType(g), { acceptContentTypes: p, acceptFormats: m } = this;
+      const { canvas: r, montageArea: c, transformManager: d, historyManager: h, errorManager: u } = this.editor, g = yield this.getContentType(e), f = ct.getFormatFromContentType(g), { acceptContentTypes: p, acceptFormats: m } = this;
       if (!this.isAllowedContentType(g)) {
         const v = `Неверный contentType для изображения: ${g}. Ожидается один из: ${this.acceptContentTypes.join(", ")}.`;
         return u.emitError({
@@ -1558,7 +1558,7 @@ class ct {
           }
         }), null;
       }
-      l.suspendHistory();
+      h.suspendHistory();
       try {
         let v, b;
         if (e instanceof File)
@@ -1606,7 +1606,7 @@ class ct {
           const { width: A, height: j } = c, M = this.calculateScaleFactor({ imageObject: b, scaleType: s });
           s === "image-contain" && M < 1 ? d.fitObject({ object: b, type: "contain", withoutSave: !0 }) : s === "image-cover" && (I > A || y > j) && d.fitObject({ object: b, type: "cover", withoutSave: !0 });
         }
-        r.add(b), r.centerObject(b), a || r.setActiveObject(b), r.renderAll(), l.resumeHistory(), o || l.saveState();
+        r.add(b), r.centerObject(b), a || r.setActiveObject(b), r.renderAll(), h.resumeHistory(), o || h.saveState();
         const w = {
           image: b,
           format: f,
@@ -1635,7 +1635,7 @@ class ct {
             isBackground: i,
             withoutSelection: a
           }
-        }), l.resumeHistory(), null;
+        }), h.resumeHistory(), null;
       }
     });
   }
@@ -1688,10 +1688,10 @@ class ct {
         exportAsBlob: n = !1
       } = t, { canvas: i, montageArea: a, workerManager: r, interactionBlocker: c } = this.editor;
       try {
-        const d = s === "application/pdf", l = d ? "image/jpg" : s, u = ct.getFormatFromContentType(l);
+        const d = s === "application/pdf", h = d ? "image/jpg" : s, u = ct.getFormatFromContentType(h);
         a.setCoords();
         const { left: g, top: f, width: p, height: m } = a.getBoundingRect(), v = yield i.clone(["id", "format", "locked"]);
-        v.enableRetinaScaling = !1, ["image/jpg", "image/jpeg"].includes(l) && (v.backgroundColor = "#ffffff");
+        v.enableRetinaScaling = !1, ["image/jpg", "image/jpeg"].includes(h) && (v.backgroundColor = "#ffffff");
         const b = v.getObjects().find((S) => S.id === a.id);
         if (b && (b.visible = !1), c != null && c.isBlocked) {
           const S = v.getObjects().find((C) => C.id === c.overlayMask.id);
@@ -1723,7 +1723,7 @@ class ct {
           const S = {
             image: y,
             format: u,
-            contentType: l,
+            contentType: h,
             fileName: e
           };
           return i.fire("editor:canvas-exported", S), S;
@@ -1760,15 +1760,15 @@ class ct {
           const S = {
             image: A,
             format: u,
-            contentType: l,
+            contentType: h,
             fileName: e
           };
           return i.fire("editor:canvas-exported", S), S;
         }
         const j = u === "svg" && !I ? e.replace(/\.[^/.]+$/, ".png") : e, T = {
-          image: new File([y], j, { type: l }),
+          image: new File([y], j, { type: h }),
           format: u,
-          contentType: l,
+          contentType: h,
           fileName: j
         };
         return i.fire("editor:canvas-exported", T), T;
@@ -1845,10 +1845,10 @@ class ct {
           };
           return a.fire("editor:object-exported", v), v;
         }
-        const l = c.toCanvasElement({
+        const h = c.toCanvasElement({
           enableRetinaScaling: !1
         }), u = yield new Promise((p, m) => {
-          l.toBlob((v) => {
+          h.toBlob((v) => {
             v ? p(v) : m(new Error("Failed to create Blob from canvas"));
           });
         });
@@ -1998,9 +1998,9 @@ class ct {
     return e ? e[1] : "";
   }
 }
-const Tt = (h, t, e) => Math.max(Math.min(h, e), t), Ge = (h, t) => h * t, Xs = (h, t) => new tt(h / 2, t / 2);
-function Ks(h) {
-  return ((h == null ? void 0 : h.type) === "image" || (h == null ? void 0 : h.format) === "svg") && typeof (h == null ? void 0 : h.width) == "number" && typeof (h == null ? void 0 : h.height) == "number";
+const Tt = (l, t, e) => Math.max(Math.min(l, e), t), Ge = (l, t) => l * t, Xs = (l, t) => new tt(l / 2, t / 2);
+function Ks(l) {
+  return ((l == null ? void 0 : l.type) === "image" || (l == null ? void 0 : l.format) === "svg") && typeof (l == null ? void 0 : l.width) == "number" && typeof (l == null ? void 0 : l.height) == "number";
 }
 class Qs {
   /**
@@ -2039,8 +2039,8 @@ class Qs {
       this.setResolutionHeight(m);
       return;
     }
-    const { left: l, top: u } = this.getObjectDefaultCoords(i), g = n.getZoom();
-    n.setViewportTransform([g, 0, 0, g, l, u]), this.centerMontageArea(), s || this.editor.historyManager.saveState(), n.fire("editor:resolution-width-changed", {
+    const { left: h, top: u } = this.getObjectDefaultCoords(i), g = n.getZoom();
+    n.setViewportTransform([g, 0, 0, g, h, u]), this.centerMontageArea(), s || this.editor.historyManager.saveState(), n.fire("editor:resolution-width-changed", {
       width: d,
       preserveProportional: e,
       withoutSave: s,
@@ -2069,8 +2069,8 @@ class Qs {
       this.setResolutionWidth(m);
       return;
     }
-    const { left: l, top: u } = this.getObjectDefaultCoords(i), g = n.getZoom();
-    n.setViewportTransform([g, 0, 0, g, l, u]), this.centerMontageArea(), s || this.editor.historyManager.saveState(), n.fire("editor:resolution-height-changed", {
+    const { left: h, top: u } = this.getObjectDefaultCoords(i), g = n.getZoom();
+    n.setViewportTransform([g, 0, 0, g, h, u]), this.centerMontageArea(), s || this.editor.historyManager.saveState(), n.fire("editor:resolution-height-changed", {
       height: d,
       preserveProportional: e,
       withoutSave: s,
@@ -2156,22 +2156,22 @@ class Qs {
     if (a !== 0 || r !== 0) {
       const c = t.getActiveObject(), d = [];
       if ((c == null ? void 0 : c.type) === "activeselection") {
-        const l = c;
-        d.push(...l.getObjects()), t.discardActiveObject();
+        const h = c;
+        d.push(...h.getObjects()), t.discardActiveObject();
       }
-      if (t.getObjects().forEach((l) => {
-        l.id === "montage-area" || l.id === "overlay-mask" || l.id === "background" || (l.set({
-          left: l.left + a,
-          top: l.top + r
-        }), l.setCoords());
+      if (t.getObjects().forEach((h) => {
+        h.id === "montage-area" || h.id === "overlay-mask" || h.id === "background" || (h.set({
+          left: h.left + a,
+          top: h.top + r
+        }), h.setCoords());
       }), d.length > 0)
         if (d.length === 1)
           t.setActiveObject(d[0]);
         else {
-          const l = new k(d, {
+          const h = new k(d, {
             canvas: t
           });
-          t.setActiveObject(l);
+          t.setActiveObject(h);
         }
     }
     t.renderAll(), t.fire("editor:canvas-updated", {
@@ -2335,16 +2335,16 @@ class Qs {
       }
     } = this.editor, c = t || o.getActiveObject();
     if (!Ks(c)) return;
-    const { width: d, height: l } = c;
-    let u = Math.min(d, Mt), g = Math.min(l, wt);
+    const { width: d, height: h } = c;
+    let u = Math.min(d, Mt), g = Math.min(h, wt);
     if (e) {
       const {
         width: f,
         height: p
-      } = n, m = d / f, v = l / p, b = Math.max(m, v);
+      } = n, m = d / f, v = h / p, b = Math.max(m, v);
       u = f * b, g = p * b;
     }
-    this.setResolutionWidth(u, { withoutSave: !0 }), this.setResolutionHeight(g, { withoutSave: !0 }), this.editor.backgroundManager.backgroundObject && this.editor.backgroundManager.refresh(), (d > a || l > r) && this.editor.zoomManager.calculateAndApplyDefaultZoom(), i.resetObject({ object: c, withoutSave: !0 }), o.centerObject(c), o.renderAll(), s || this.editor.historyManager.saveState(), o.fire("editor:montage-area-scaled-to-image", {
+    this.setResolutionWidth(u, { withoutSave: !0 }), this.setResolutionHeight(g, { withoutSave: !0 }), this.editor.backgroundManager.backgroundObject && this.editor.backgroundManager.refresh(), (d > a || h > r) && this.editor.zoomManager.calculateAndApplyDefaultZoom(), i.resetObject({ object: c, withoutSave: !0 }), o.centerObject(c), o.renderAll(), s || this.editor.historyManager.saveState(), o.fire("editor:montage-area-scaled-to-image", {
       object: c,
       width: u,
       height: g,
@@ -2506,7 +2506,7 @@ class qs {
    * @private
    */
   _fitSingleObject(t, e) {
-    const { canvas: s, montageArea: o } = this.editor, { width: n, height: i, scaleX: a = 1, scaleY: r = 1, angle: c = 0 } = t, d = n * Math.abs(a), l = i * Math.abs(r), u = c * Math.PI / 180, g = Math.abs(Math.cos(u)), f = Math.abs(Math.sin(u)), p = d * g + l * f, m = d * f + l * g, v = o.width, b = o.height;
+    const { canvas: s, montageArea: o } = this.editor, { width: n, height: i, scaleX: a = 1, scaleY: r = 1, angle: c = 0 } = t, d = n * Math.abs(a), h = i * Math.abs(r), u = c * Math.PI / 180, g = Math.abs(Math.cos(u)), f = Math.abs(Math.sin(u)), p = d * g + h * f, m = d * f + h * g, v = o.width, b = o.height;
     let I;
     e === "contain" ? I = Math.min(v / p, b / m) : I = Math.max(v / p, b / m), t.set({
       scaleX: a * I,
@@ -2547,11 +2547,11 @@ class qs {
     }), e)
       this.fitObject({ object: c, withoutSave: !0, fitAsOneObject: !0 });
     else {
-      const { width: l, height: u } = n, { width: g, height: f } = c, p = i.calculateScaleFactor({
+      const { width: h, height: u } = n, { width: g, height: f } = c, p = i.calculateScaleFactor({
         imageObject: c,
         scaleType: r
       });
-      r === "contain" && p < 1 || r === "cover" && (g > l || f > u) ? this.fitObject({ object: c, withoutSave: !0, fitAsOneObject: !0 }) : c.set({ scaleX: 1, scaleY: 1 });
+      r === "contain" && p < 1 || r === "cover" && (g > h || f > u) ? this.fitObject({ object: c, withoutSave: !0, fitAsOneObject: !0 }) : c.set({ scaleX: 1, scaleY: 1 });
     }
     c.set({ flipX: !1, flipY: !1, angle: 0 }), o.centerObject(c), o.renderAll(), a.resumeHistory(), s || a.saveState(), o.fire("editor:object-reset", {
       object: c,
@@ -2584,7 +2584,7 @@ class Js {
    * @private
    */
   _getClampedPointerCoordinates(t) {
-    const { canvas: e, montageArea: s } = this.editor, o = e.getPointer(t, !0), n = e.viewportTransform, i = e.getZoom(), a = s.left - s.width / 2, r = s.left + s.width / 2, c = s.top - s.height / 2, d = s.top + s.height / 2, l = a * i + n[4], u = r * i + n[4], g = c * i + n[5], f = d * i + n[5], p = Math.max(l, Math.min(u, o.x)), m = Math.max(g, Math.min(f, o.y));
+    const { canvas: e, montageArea: s } = this.editor, o = e.getPointer(t, !0), n = e.viewportTransform, i = e.getZoom(), a = s.left - s.width / 2, r = s.left + s.width / 2, c = s.top - s.height / 2, d = s.top + s.height / 2, h = a * i + n[4], u = r * i + n[4], g = c * i + n[5], f = d * i + n[5], p = Math.max(h, Math.min(u, o.x)), m = Math.max(g, Math.min(f, o.y));
     return {
       x: p,
       y: m
@@ -2619,9 +2619,9 @@ class Js {
    * @private
    */
   _calculateEmptySpaceRatio(t) {
-    const { canvas: e, montageArea: s } = this.editor, o = e.viewportTransform, n = e.getWidth(), i = e.getHeight(), a = s.left - s.width / 2, r = s.left + s.width / 2, c = s.top - s.height / 2, d = s.top + s.height / 2, l = -o[4] / t, u = (-o[4] + n) / t, g = -o[5] / t, f = (-o[5] + i) / t, p = l < a, m = u > r, v = g < c, b = f > d;
+    const { canvas: e, montageArea: s } = this.editor, o = e.viewportTransform, n = e.getWidth(), i = e.getHeight(), a = s.left - s.width / 2, r = s.left + s.width / 2, c = s.top - s.height / 2, d = s.top + s.height / 2, h = -o[4] / t, u = (-o[4] + n) / t, g = -o[5] / t, f = (-o[5] + i) / t, p = h < a, m = u > r, v = g < c, b = f > d;
     if (!(p || m || v || b)) return 0;
-    const y = Math.max(0, a - l), w = Math.max(0, u - r), A = Math.max(0, c - g), j = Math.max(0, f - d), M = Math.max(y, w), T = Math.max(A, j), S = M / n, C = T / i;
+    const y = Math.max(0, a - h), w = Math.max(0, u - r), A = Math.max(0, c - g), j = Math.max(0, f - d), M = Math.max(y, w), T = Math.max(A, j), S = M / n, C = T / i;
     return Math.max(S, C);
   }
   /**
@@ -2635,10 +2635,10 @@ class Js {
    * @private
    */
   _calculateSmoothCenteringStep(t, e, s, o, n) {
-    const { canvas: i, montageArea: a } = this.editor, r = i.viewportTransform, c = i.getWidth(), d = i.getHeight(), l = t.x - r[4], u = t.y - r[5], g = Math.abs(o), f = e - s;
+    const { canvas: i, montageArea: a } = this.editor, r = i.viewportTransform, c = i.getWidth(), d = i.getHeight(), h = t.x - r[4], u = t.y - r[5], g = Math.abs(o), f = e - s;
     if (Math.abs(f) / g <= 0.1)
-      return { x: l, y: u };
-    const m = c / 2, v = d / 2, b = a.left, I = a.top, y = m - b * s, w = v - I * s, A = (y - r[4]) / (e - s), j = (w - r[5]) / (e - s), M = A * g, T = j * g, S = M * n, C = T * n, x = Math.abs(S) > Math.abs(l) ? l : S, F = Math.abs(C) > Math.abs(u) ? u : C;
+      return { x: h, y: u };
+    const m = c / 2, v = d / 2, b = a.left, I = a.top, y = m - b * s, w = v - I * s, A = (y - r[4]) / (e - s), j = (w - r[5]) / (e - s), M = A * g, T = j * g, S = M * n, C = T * n, x = Math.abs(S) > Math.abs(h) ? h : S, F = Math.abs(C) > Math.abs(u) ? u : C;
     return { x, y: F };
   }
   /**
@@ -2712,10 +2712,10 @@ class Js {
       });
       return;
     }
-    const l = this._getClampedPointerCoordinates(e);
+    const h = this._getClampedPointerCoordinates(e);
     this.zoom(t, {
-      pointX: l.x,
-      pointY: l.y
+      pointX: h.x,
+      pointY: h.y
     });
   }
   /**
@@ -2729,13 +2729,13 @@ class Js {
   zoom(t = He, e = {}) {
     var g, f;
     if (!t) return;
-    const { minZoom: s, maxZoom: o } = this, { canvas: n } = this.editor, i = t < 0, a = n.getZoom(), r = n.getCenterPoint(), c = (g = e.pointX) != null ? g : r.x, d = (f = e.pointY) != null ? f : r.y, l = new tt(c, d);
+    const { minZoom: s, maxZoom: o } = this, { canvas: n } = this.editor, i = t < 0, a = n.getZoom(), r = n.getCenterPoint(), c = (g = e.pointX) != null ? g : r.x, d = (f = e.pointY) != null ? f : r.y, h = new tt(c, d);
     this.editor.montageArea.setCoords(), this.editor.canvas.requestRenderAll();
     let u = Number((a + Number(t)).toFixed(3));
-    u > o && (u = o), u < s && (u = s), n.zoomToPoint(l, u), this.editor.panConstraintManager.updateBounds(), this._applyViewportCentering(u, i, t), n.fire("editor:zoom-changed", {
+    u > o && (u = o), u < s && (u = s), n.zoomToPoint(h, u), this.editor.panConstraintManager.updateBounds(), this._applyViewportCentering(u, i, t), n.fire("editor:zoom-changed", {
       currentZoom: n.getZoom(),
       zoom: u,
-      point: l
+      point: h
     });
   }
   /**
@@ -2911,8 +2911,9 @@ class Ot {
     endColor: s,
     startPosition: o,
     endPosition: n,
-    customData: i = {},
-    withoutSave: a = !1
+    colorStops: i,
+    customData: a = {},
+    withoutSave: r = !1
   }) {
     this.setGradientBackground({
       gradient: {
@@ -2921,10 +2922,11 @@ class Ot {
         startColor: e,
         endColor: s,
         startPosition: o,
-        endPosition: n
+        endPosition: n,
+        colorStops: i
       },
-      customData: i,
-      withoutSave: a
+      customData: a,
+      withoutSave: r
     });
   }
   /**
@@ -2939,8 +2941,9 @@ class Ot {
     endColor: n,
     startPosition: i,
     endPosition: a,
-    customData: r = {},
-    withoutSave: c = !1
+    colorStops: r,
+    customData: c = {},
+    withoutSave: d = !1
   }) {
     this.setGradientBackground({
       gradient: {
@@ -2951,10 +2954,11 @@ class Ot {
         startColor: o,
         endColor: n,
         startPosition: i,
-        endPosition: a
+        endPosition: a,
+        colorStops: r
       },
-      customData: r,
-      withoutSave: c
+      customData: c,
+      withoutSave: d
     });
   }
   /**
@@ -3095,37 +3099,45 @@ class Ot {
       startColor: e,
       endColor: s,
       startPosition: o = 0,
-      endPosition: n = 100
-    } = t, i = [
+      endPosition: n = 100,
+      colorStops: i
+    } = t;
+    let a;
+    if (i && i.length > 0 ? a = i.map((u) => ({
+      offset: u.offset / 100,
+      color: u.color
+    })) : e && s ? a = [
       { offset: o / 100, color: e },
       { offset: n / 100, color: s }
-    ];
-    if (t.type === "linear") {
-      const l = t.angle * Math.PI / 180, u = Ot._angleToCoords(l);
+    ] : a = [
+      { offset: 0, color: "#000000" },
+      { offset: 1, color: "#ffffff" }
+    ], t.type === "linear") {
+      const u = t.angle * Math.PI / 180, g = Ot._angleToCoords(u);
       return new ze({
         type: "linear",
         gradientUnits: "percentage",
-        coords: u,
-        colorStops: i
+        coords: g,
+        colorStops: a
       });
     }
     const {
-      centerX: a = 50,
-      centerY: r = 50,
-      radius: c = 50
-    } = t, d = {
-      x1: a / 100,
-      y1: r / 100,
-      x2: a / 100,
-      y2: r / 100,
+      centerX: r = 50,
+      centerY: c = 50,
+      radius: d = 50
+    } = t, h = {
+      x1: r / 100,
+      y1: c / 100,
+      x2: r / 100,
+      y2: c / 100,
       r1: 0,
-      r2: c / 100
+      r2: d / 100
     };
     return new ze({
       type: "radial",
       gradientUnits: "percentage",
-      coords: d,
-      colorStops: i
+      coords: h,
+      colorStops: a
     });
   }
   /**
@@ -3309,14 +3321,14 @@ class to {
    * @param flags.withoutAdding - Не добавлять объект в canvas
    */
   addRectangle(d = {}, { withoutSelection: r, withoutAdding: c } = {}) {
-    var l = d, {
+    var h = d, {
       id: t = `rect-${G()}`,
       left: e,
       top: s,
       width: o = 100,
       height: n = 100,
       fill: i = "blue"
-    } = l, a = vt(l, [
+    } = h, a = vt(h, [
       "id",
       "left",
       "top",
@@ -3364,14 +3376,14 @@ class to {
       "radius",
       "fill"
     ]);
-    const { canvas: l } = this.editor, u = new fs(_({
+    const { canvas: h } = this.editor, u = new fs(_({
       id: t,
       left: e,
       top: s,
       fill: n,
       radius: o
     }, i));
-    return !e && !s && l.centerObject(u), r || (l.add(u), a || l.setActiveObject(u), l.renderAll()), u;
+    return !e && !s && h.centerObject(u), r || (h.add(u), a || h.setActiveObject(u), h.renderAll()), u;
   }
   /**
    * Добавление треугольника
@@ -3391,14 +3403,14 @@ class to {
    * @param flags.withoutAdding - Не добавлять объект в canvas
    */
   addTriangle(d = {}, { withoutSelection: r, withoutAdding: c } = {}) {
-    var l = d, {
+    var h = d, {
       id: t = `triangle-${G()}`,
       left: e,
       top: s,
       width: o = 100,
       height: n = 100,
       fill: i = "yellow"
-    } = l, a = vt(l, [
+    } = h, a = vt(h, [
       "id",
       "left",
       "top",
@@ -3495,8 +3507,8 @@ class eo {
     return N(this, null, function* () {
       try {
         const o = t.toCanvasElement({ enableRetinaScaling: !1 }).toDataURL(), n = o.slice(5).split(";")[0], i = o.split(",")[1], a = atob(i), r = new Uint8Array(a.length);
-        for (let l = 0; l < a.length; l += 1)
-          r[l] = a.charCodeAt(l);
+        for (let h = 0; h < a.length; h += 1)
+          r[h] = a.charCodeAt(h);
         const c = new Blob([r.buffer], { type: n }), d = new ClipboardItem({ [n]: c });
         return yield navigator.clipboard.write([d]), console.info("Image copied to clipboard successfully"), !0;
       } catch (s) {
@@ -3615,13 +3627,13 @@ class eo {
       if (n.type !== "text/html" && i) {
         const c = new FileReader();
         c.onload = (d) => {
-          d.target && this._handleImageImport(d.target.result).catch((l) => {
+          d.target && this._handleImageImport(d.target.result).catch((h) => {
             this.editor.errorManager.emitError({
               origin: "ClipboardManager",
               method: "handlePasteEvent",
               code: "PASTE_IMAGE_FAILED",
               message: "Ошибка вставки изображения из буфера обмена",
-              data: l
+              data: h
             });
           });
         }, c.readAsDataURL(i);
@@ -3629,9 +3641,9 @@ class eo {
       }
       const a = t.getData("text/html");
       if (a) {
-        const l = new DOMParser().parseFromString(a, "text/html").querySelector("img");
-        if (l != null && l.src) {
-          this._handleImageImport(l.src).catch((u) => {
+        const h = new DOMParser().parseFromString(a, "text/html").querySelector("img");
+        if (h != null && h.src) {
+          this._handleImageImport(h.src).catch((u) => {
             this.editor.errorManager.emitError({
               origin: "ClipboardManager",
               method: "handlePasteEvent",
@@ -3828,8 +3840,8 @@ class so {
       const i = [];
       n.forEach((c) => {
         const d = c.removeAll();
-        s.remove(c), d.forEach((l) => {
-          s.add(l), i.push(l);
+        s.remove(c), d.forEach((h) => {
+          s.add(h), i.push(h);
         });
       });
       const a = new k(i, {
@@ -3910,8 +3922,8 @@ class we {
     const r = [];
     if (a.forEach((d) => {
       if (we._isUngroupableGroup(d)) {
-        const l = this._handleGroupDeletion(d);
-        r.push(...l);
+        const h = this._handleGroupDeletion(d);
+        r.push(...h);
         return;
       }
       o.remove(d), r.push(d);
@@ -4161,12 +4173,12 @@ class no {
   constrainPan(t, e) {
     if (!this.currentBounds || !this.currentBounds.canPan)
       return { x: 0, y: 0 };
-    const { canvas: s, montageArea: o } = this.editor, n = s.getZoom(), i = o.left, a = o.top, r = s.getWidth() / 2, c = s.getHeight() / 2, d = i * n + t - r, l = a * n + e - c, u = Math.max(
+    const { canvas: s, montageArea: o } = this.editor, n = s.getZoom(), i = o.left, a = o.top, r = s.getWidth() / 2, c = s.getHeight() / 2, d = i * n + t - r, h = a * n + e - c, u = Math.max(
       this.currentBounds.minX,
       Math.min(this.currentBounds.maxX, d)
     ), g = Math.max(
       this.currentBounds.minY,
-      Math.min(this.currentBounds.maxY, l)
+      Math.min(this.currentBounds.maxY, h)
     ), f = u + r - i * n, p = g + c - a * n;
     return {
       x: f,
@@ -4197,13 +4209,13 @@ class no {
   }
 }
 const at = ({
-  value: h,
+  value: l,
   min: t,
   max: e
-}) => Math.min(Math.max(h, t), e), Dt = class Dt extends nt {
+}) => Math.min(Math.max(l, t), e), Dt = class Dt extends nt {
   constructor(t, e = {}) {
-    var s, o, n, i, a, r, c, d, l;
-    super(t, e), this.backgroundOpacity = (s = e.backgroundOpacity) != null ? s : 1, this.paddingTop = (o = e.paddingTop) != null ? o : 0, this.paddingRight = (n = e.paddingRight) != null ? n : 0, this.paddingBottom = (i = e.paddingBottom) != null ? i : 0, this.paddingLeft = (a = e.paddingLeft) != null ? a : 0, this.radiusTopLeft = (r = e.radiusTopLeft) != null ? r : 0, this.radiusTopRight = (c = e.radiusTopRight) != null ? c : 0, this.radiusBottomRight = (d = e.radiusBottomRight) != null ? d : 0, this.radiusBottomLeft = (l = e.radiusBottomLeft) != null ? l : 0, this._roundDimensions();
+    var s, o, n, i, a, r, c, d, h;
+    super(t, e), this.backgroundOpacity = (s = e.backgroundOpacity) != null ? s : 1, this.paddingTop = (o = e.paddingTop) != null ? o : 0, this.paddingRight = (n = e.paddingRight) != null ? n : 0, this.paddingBottom = (i = e.paddingBottom) != null ? i : 0, this.paddingLeft = (a = e.paddingLeft) != null ? a : 0, this.radiusTopLeft = (r = e.radiusTopLeft) != null ? r : 0, this.radiusTopRight = (c = e.radiusTopRight) != null ? c : 0, this.radiusBottomRight = (d = e.radiusBottomRight) != null ? d : 0, this.radiusBottomLeft = (h = e.radiusBottomLeft) != null ? h : 0, this._roundDimensions();
   }
   /**
    * Пересчитывает размеры текста и округляет их до целых значений.
@@ -4251,11 +4263,11 @@ const at = ({
     var s, o;
     const e = this._getEffectiveBackgroundFill();
     if (e && e) {
-      const n = this._getPadding(), i = (s = this.width) != null ? s : 0, a = (o = this.height) != null ? o : 0, r = i + n.left + n.right, c = a + n.top + n.bottom, d = this._getCornerRadii({ width: r, height: c }), l = this._getLeftOffset() - n.left, u = this._getTopOffset() - n.top;
+      const n = this._getPadding(), i = (s = this.width) != null ? s : 0, a = (o = this.height) != null ? o : 0, r = i + n.left + n.right, c = a + n.top + n.bottom, d = this._getCornerRadii({ width: r, height: c }), h = this._getLeftOffset() - n.left, u = this._getTopOffset() - n.top;
       t.save(), Dt._renderRoundedRect({
         ctx: t,
         height: c,
-        left: l,
+        left: h,
         radii: d,
         top: u,
         width: r
@@ -4319,9 +4331,9 @@ const at = ({
     const a = s + i, r = n + e, {
       topLeft: c,
       topRight: d,
-      bottomRight: l,
+      bottomRight: h,
       bottomLeft: u
-    } = o, g = at({ value: c, min: 0, max: i }), f = at({ value: d, min: 0, max: i }), p = at({ value: l, min: 0, max: i }), m = at({ value: u, min: 0, max: i });
+    } = o, g = at({ value: c, min: 0, max: i }), f = at({ value: d, min: 0, max: i }), p = at({ value: h, min: 0, max: i }), m = at({ value: u, min: 0, max: i });
     t.beginPath(), t.moveTo(s + g, n), t.lineTo(a - f, n), t.quadraticCurveTo(a, n, a, n + f), t.lineTo(a, r - p), t.quadraticCurveTo(a, r, a - p, r), t.lineTo(s + m, r), t.quadraticCurveTo(s, r, s, r - m), t.lineTo(s, n + g), t.quadraticCurveTo(s, n, s + g, n), t.closePath();
   }
   /**
@@ -4362,51 +4374,51 @@ Dt.type = "background-textbox", Dt.cacheProperties = [
 ];
 let ee = Dt;
 const io = () => {
-  var h;
-  (h = Pe) != null && h.setClass && Pe.setClass(ee, "background-textbox");
-}, ao = ({ textbox: h }) => {
+  var l;
+  (l = Pe) != null && l.setClass && Pe.setClass(ee, "background-textbox");
+}, ao = ({ textbox: l }) => {
   var s, o;
-  if (!h.isEditing) return null;
-  const t = (s = h.selectionStart) != null ? s : 0, e = (o = h.selectionEnd) != null ? o : t;
+  if (!l.isEditing) return null;
+  const t = (s = l.selectionStart) != null ? s : 0, e = (o = l.selectionEnd) != null ? o : t;
   return t === e ? null : {
     start: Math.min(t, e),
     end: Math.max(t, e)
   };
-}, ro = ({ textbox: h }) => {
+}, ro = ({ textbox: l }) => {
   var e, s;
-  const t = (s = (e = h.text) == null ? void 0 : e.length) != null ? s : 0;
+  const t = (s = (e = l.text) == null ? void 0 : e.length) != null ? s : 0;
   return t <= 0 ? null : { start: 0, end: t };
-}, co = ({ textbox: h, range: t }) => {
+}, co = ({ textbox: l, range: t }) => {
   var s, o;
   if (!t) return !1;
-  const e = (o = (s = h.text) == null ? void 0 : s.length) != null ? o : 0;
+  const e = (o = (s = l.text) == null ? void 0 : s.length) != null ? o : 0;
   return e <= 0 ? !1 : t.start <= 0 && t.end >= e;
 }, ne = ({
-  textbox: h,
+  textbox: l,
   styles: t,
   range: e
 }) => {
   if (!t || !Object.keys(t).length) return !1;
   const { start: s, end: o } = e;
-  return o <= s ? !1 : (h.setSelectionStyles(t, s, o), !0);
+  return o <= s ? !1 : (l.setSelectionStyles(t, s, o), !0);
 }, Ve = ({
-  textbox: h,
+  textbox: l,
   range: t,
   property: e
 }) => {
   var o;
   if (!t) return;
-  const s = h.getSelectionStyles(
+  const s = l.getSelectionStyles(
     t.start,
     t.end,
     !0
   );
   if (s.length)
     return (o = s[0]) == null ? void 0 : o[e];
-}, Xe = ({ strokeColor: h, width: t }) => {
+}, Xe = ({ strokeColor: l, width: t }) => {
   if (!(t <= 0))
-    return h != null ? h : "#000000";
-}, Ke = ({ width: h = 0 }) => h ? Math.max(0, h) : 0, ie = ({ value: h }) => typeof h == "string" ? h.toLocaleUpperCase() : "", st = 0.01;
+    return l != null ? l : "#000000";
+}, Ke = ({ width: l = 0 }) => l ? Math.max(0, l) : 0, ie = ({ value: l }) => typeof l == "string" ? l.toLocaleUpperCase() : "", st = 0.01;
 class Z {
   constructor({ editor: t }) {
     var e;
@@ -4448,7 +4460,7 @@ class Z {
         baseLeft: r,
         baseFontSize: c,
         basePadding: d,
-        baseRadii: l,
+        baseRadii: h,
         baseStyles: u
       } = i, g = typeof ((X = n.original) == null ? void 0 : X.width) == "number" ? n.original.width : void 0, f = typeof ((It = n.original) == null ? void 0 : It.left) == "number" ? n.original.left : void 0, p = g != null ? g : a, m = f != null ? f : r, v = (Wt = n.corner) != null ? Wt : "", b = (mt = n.action) != null ? mt : "", I = ["ml", "mr"].includes(v) || b === "scaleX", y = ["mt", "mb"].includes(v) || b === "scaleY", w = ["tl", "tr", "bl", "br"].includes(v) || b === "scale", A = w || y;
       if (!I && !y && !w) return;
@@ -4470,11 +4482,11 @@ class Z {
         bottom: Math.max(0, d.bottom * M),
         left: Math.max(0, d.left * M)
       } : d, Q = q ? {
-        topLeft: Math.max(0, l.topLeft * M),
-        topRight: Math.max(0, l.topRight * M),
-        bottomRight: Math.max(0, l.bottomRight * M),
-        bottomLeft: Math.max(0, l.bottomLeft * M)
-      } : l, St = Object.keys(u).length > 0;
+        topLeft: Math.max(0, h.topLeft * M),
+        topRight: Math.max(0, h.topRight * M),
+        bottomRight: Math.max(0, h.bottomRight * M),
+        bottomLeft: Math.max(0, h.bottomLeft * M)
+      } : h, St = Object.keys(u).length > 0;
       let et;
       if (A && St) {
         const se = {};
@@ -4585,7 +4597,7 @@ class Z {
       const i = (b = o.width) != null ? b : o.calcTextWidth(), a = (y = (I = o.fontSize) != null ? I : n == null ? void 0 : n.baseFontSize) != null ? y : 16, r = !!(n.baseStyles && Object.keys(n.baseStyles).length), {
         paddingTop: c = 0,
         paddingRight: d = 0,
-        paddingBottom: l = 0,
+        paddingBottom: h = 0,
         paddingLeft: u = 0,
         radiusTopLeft: g = 0,
         radiusTopRight: f = 0,
@@ -4595,7 +4607,7 @@ class Z {
         width: i,
         paddingTop: c,
         paddingRight: d,
-        paddingBottom: l,
+        paddingBottom: h,
         paddingLeft: u,
         radiusTopLeft: g,
         radiusTopRight: f,
@@ -4625,7 +4637,7 @@ class Z {
       uppercase: r = !1,
       strikethrough: c = !1,
       align: d = "left",
-      color: l = "#000000",
+      color: h = "#000000",
       strokeColor: u,
       strokeWidth: g = 0,
       opacity: f = 1,
@@ -4681,7 +4693,7 @@ class Z {
       uppercase: r,
       linethrough: c,
       textAlign: d,
-      fill: l,
+      fill: h,
       stroke: z,
       strokeWidth: D,
       strokeUniform: !0,
@@ -4709,7 +4721,7 @@ class Z {
         italic: i,
         strikethrough: c,
         align: d,
-        color: l,
+        color: h,
         strokeColor: z,
         strokeWidth: D
       }),
@@ -4737,7 +4749,7 @@ class Z {
     const r = Z._getSnapshot(n), Nt = e, {
       text: c,
       fontFamily: d,
-      fontSize: l,
+      fontSize: h,
       bold: u,
       italic: g,
       underline: f,
@@ -4783,7 +4795,7 @@ class Z {
       "radiusBottomRight",
       "radiusBottomLeft"
     ]), L = _({}, V), D = ao({ textbox: n }), z = D ? this._expandRangeToFullLines({ textbox: n, range: D }) : null, H = {}, P = {}, K = {}, $ = co({ textbox: n, range: D }), q = !D || $, Y = !D;
-    if (d !== void 0 && (z && (P.fontFamily = d), q && (L.fontFamily = d, Y && (K.fontFamily = d))), l !== void 0 && (z && (P.fontSize = l), q && (L.fontSize = l, Y && (K.fontSize = l))), u !== void 0) {
+    if (d !== void 0 && (z && (P.fontFamily = d), q && (L.fontFamily = d, Y && (K.fontFamily = d))), h !== void 0 && (z && (P.fontSize = h), q && (L.fontSize = h, Y && (K.fontSize = h))), u !== void 0) {
       const X = u ? "bold" : "normal";
       D && (H.fontWeight = X), q && (L.fontWeight = X, Y && (K.fontWeight = X));
     }
@@ -4904,7 +4916,7 @@ class Z {
     if (!e) {
       const i = (s = t.width) != null ? s : t.calcTextWidth(), a = (o = t.left) != null ? o : 0, r = (n = t.fontSize) != null ? n : 16, { styles: c = {} } = t, {
         paddingTop: d = 0,
-        paddingRight: l = 0,
+        paddingRight: h = 0,
         paddingBottom: u = 0,
         paddingLeft: g = 0
       } = t, {
@@ -4919,7 +4931,7 @@ class Z {
         baseLeft: a,
         basePadding: {
           top: d,
-          right: l,
+          right: h,
           bottom: u,
           left: g
         },
@@ -4956,8 +4968,8 @@ class Z {
     }), c = Z._resolveDimension({
       rawValue: s,
       calculatedValue: a
-    }), d = Number.isFinite(r) ? Math.round(r) : null, l = Number.isFinite(c) ? Math.round(c) : null, u = {};
-    return d !== null && d !== r && (u.width = Math.max(0, d)), l !== null && l !== c && (u.height = Math.max(0, l)), Object.keys(u).length ? (t.set(u), !0) : !1;
+    }), d = Number.isFinite(r) ? Math.round(r) : null, h = Number.isFinite(c) ? Math.round(c) : null, u = {};
+    return d !== null && d !== r && (u.width = Math.max(0, d)), h !== null && h !== c && (u.height = Math.max(0, h)), Object.keys(u).length ? (t.set(u), !0) : !1;
   }
   /**
    * Формирует снимок текущих свойств текстового объекта для истории и событий.
@@ -4979,7 +4991,7 @@ class Z {
       fontSize: r,
       fontWeight: c,
       fontStyle: d,
-      underline: l,
+      underline: h,
       linethrough: u,
       textAlign: g,
       fill: f,
@@ -5017,7 +5029,7 @@ class Z {
         fontSize: r,
         fontWeight: c,
         fontStyle: d,
-        underline: l,
+        underline: h,
         linethrough: u,
         fill: f,
         stroke: p,
@@ -5052,23 +5064,23 @@ class Z {
   }
 }
 const ot = ({
-  value: h,
+  value: l,
   fallback: t = 0
-}) => typeof h == "number" && Number.isFinite(h) ? h : typeof t == "number" && Number.isFinite(t) ? t : 0, Kt = ({
-  value: h,
+}) => typeof l == "number" && Number.isFinite(l) ? l : typeof t == "number" && Number.isFinite(t) ? t : 0, Kt = ({
+  value: l,
   dimension: t,
   useRelativePositions: e
 }) => {
-  const s = ot({ value: h });
+  const s = ot({ value: l });
   return e ? s : s / (t || 1);
 }, lo = ({
-  object: h,
+  object: l,
   baseWidth: t,
   baseHeight: e,
   useRelativePositions: s,
   centerKeys: o
 }) => {
-  const n = h;
+  const n = l;
   if (typeof n[o.x] == "number" && typeof n[o.y] == "number")
     return {
       x: Kt({
@@ -5082,7 +5094,7 @@ const ot = ({
         useRelativePositions: s
       })
     };
-  const { left: a, top: r, width: c, height: d } = h, l = Kt({
+  const { left: a, top: r, width: c, height: d } = l, h = Kt({
     value: a,
     dimension: t,
     useRelativePositions: s
@@ -5092,11 +5104,11 @@ const ot = ({
     useRelativePositions: s
   }), g = ot({ value: c }) / (t || 1), f = ot({ value: d }) / (e || 1);
   return {
-    x: l + g / 2,
+    x: h + g / 2,
     y: u + f / 2
   };
 }, ho = ({
-  normalizedX: h,
+  normalizedX: l,
   normalizedY: t,
   bounds: e,
   targetSize: s,
@@ -5104,33 +5116,33 @@ const ot = ({
 }) => {
   const { left: n, top: i, width: a, height: r } = e;
   if (!o) {
-    const { width: l, height: u } = s, g = n + h * (l || a), f = i + t * (u || r);
+    const { width: h, height: u } = s, g = n + l * (h || a), f = i + t * (u || r);
     return new tt(g, f);
   }
-  const c = n + h * a, d = i + t * r;
+  const c = n + l * a, d = i + t * r;
   return new tt(c, d);
 }, uo = ({
-  object: h,
+  object: l,
   montageArea: t,
   bounds: e
 }) => {
   if (!t || !e) return null;
   try {
-    const s = h.getCenterPoint(), { left: o, top: n, width: i, height: a } = e, r = s.x - o, c = s.y - n, d = r / i, l = c / a;
+    const s = l.getCenterPoint(), { left: o, top: n, width: i, height: a } = e, r = s.x - o, c = s.y - n, d = r / i, h = c / a;
     return {
       x: d,
-      y: l
+      y: h
     };
   } catch (s) {
     return null;
   }
 }, ft = ({
-  object: h
+  object: l
 }) => {
-  if (!h) return null;
+  if (!l) return null;
   try {
-    h.setCoords();
-    const t = h.getBoundingRect(!1, !0), {
+    l.setCoords();
+    const t = l.getBoundingRect(!1, !0), {
       left: e = 0,
       top: s = 0,
       width: o = 0,
@@ -5148,38 +5160,43 @@ const ot = ({
     return null;
   }
 }, go = ({
-  x1: h,
+  x1: l,
   y1: t,
   x2: e,
   y2: s
-}) => (Math.atan2(s - t, e - h) * 180 / Math.PI + 360) % 360, fo = (h) => {
-  if (!h || typeof h != "object") return null;
-  const { type: t, coords: e, colorStops: s } = h, o = Array.isArray(s) ? s : [], n = o[0], i = o[o.length - 1], a = typeof (n == null ? void 0 : n.color) == "string" ? n.color : void 0, r = typeof (i == null ? void 0 : i.color) == "string" ? i.color : a, c = typeof (n == null ? void 0 : n.offset) == "number" ? n.offset * 100 : void 0, d = typeof (i == null ? void 0 : i.offset) == "number" ? i.offset * 100 : void 0;
+}) => (Math.atan2(s - t, e - l) * 180 / Math.PI + 360) % 360, fo = (l) => {
+  if (!l || typeof l != "object") return null;
+  const { type: t, coords: e, colorStops: s } = l, o = Array.isArray(s) ? s : [], n = o[0], i = o[o.length - 1], a = typeof (n == null ? void 0 : n.color) == "string" ? n.color : void 0, r = typeof (i == null ? void 0 : i.color) == "string" ? i.color : a, c = typeof (n == null ? void 0 : n.offset) == "number" ? n.offset * 100 : void 0, d = typeof (i == null ? void 0 : i.offset) == "number" ? i.offset * 100 : void 0, h = o.map((u) => ({
+    color: typeof u.color == "string" ? u.color : "#000000",
+    offset: typeof u.offset == "number" ? u.offset * 100 : 0
+  }));
   if (!a || !r || !e) return null;
   if (t === "linear") {
-    const { x1: l, y1: u, x2: g, y2: f } = e;
-    if (typeof l == "number" && typeof u == "number" && typeof g == "number" && typeof f == "number")
+    const { x1: u, y1: g, x2: f, y2: p } = e;
+    if (typeof u == "number" && typeof g == "number" && typeof f == "number" && typeof p == "number")
       return {
         type: "linear",
-        angle: go({ x1: l, y1: u, x2: g, y2: f }),
+        angle: go({ x1: u, y1: g, x2: f, y2: p }),
         startColor: a,
         endColor: r,
         startPosition: c,
-        endPosition: d
+        endPosition: d,
+        colorStops: h
       };
   }
   if (t === "radial") {
-    const { x1: l, y1: u, r2: g } = e;
-    if (typeof l == "number" && typeof u == "number" && typeof g == "number")
+    const { x1: u, y1: g, r2: f } = e;
+    if (typeof u == "number" && typeof g == "number" && typeof f == "number")
       return {
         type: "radial",
-        centerX: l * 100,
-        centerY: u * 100,
-        radius: g * 100,
+        centerX: u * 100,
+        centerY: g * 100,
+        radius: f * 100,
         startColor: a,
         endColor: r,
         startPosition: c,
-        endPosition: d
+        endPosition: d,
+        colorStops: h
       };
   }
   return null;
@@ -5203,7 +5220,7 @@ class R {
       montageArea: i,
       errorManager: a,
       backgroundManager: r
-    } = this.editor, c = n.getActiveObject(), d = R._collectObjects(c), { backgroundObject: l } = r != null ? r : {}, u = o && l ? [l] : [], g = [...d, ...u];
+    } = this.editor, c = n.getActiveObject(), d = R._collectObjects(c), { backgroundObject: h } = r != null ? r : {}, u = o && h ? [h] : [], g = [...d, ...u];
     if (!g.length)
       return a.emitWarning({
         origin: "TemplateManager",
@@ -5246,7 +5263,7 @@ class R {
         historyManager: i,
         errorManager: a,
         backgroundManager: r
-      } = this.editor, { objects: c, meta: d, id: l } = t != null ? t : {};
+      } = this.editor, { objects: c, meta: d, id: h } = t != null ? t : {};
       if (!(c != null && c.length))
         return a.emitWarning({
           origin: "TemplateManager",
@@ -5305,7 +5322,7 @@ class R {
           code: bt.TEMPLATE_MANAGER.APPLY_FAILED,
           message: "Ошибка применения шаблона",
           data: {
-            templateId: l,
+            templateId: h,
             error: I
           }
         }), null;
@@ -5369,7 +5386,7 @@ class R {
       scaleY: a
     } = e, r = t, c = "getElement" in r && typeof r.getElement == "function" ? r.getElement() : null, {
       naturalWidth: d = 0,
-      naturalHeight: l = 0,
+      naturalHeight: h = 0,
       width: u = 0,
       height: g = 0
     } = c instanceof HTMLImageElement ? c : {
@@ -5377,7 +5394,7 @@ class R {
       naturalHeight: 0,
       width: 0,
       height: 0
-    }, f = ot({ value: d || u || r.width, fallback: 0 }), p = ot({ value: l || g || r.height, fallback: 0 }), m = ot({ value: o, fallback: f }), v = ot({ value: n, fallback: p }), b = ot({ value: i, fallback: r.scaleX || 1 }), I = ot({ value: a, fallback: r.scaleY || 1 }), y = m * b, w = v * I, A = f ? y / f : null, j = p ? w / p : null, M = {};
+    }, f = ot({ value: d || u || r.width, fallback: 0 }), p = ot({ value: h || g || r.height, fallback: 0 }), m = ot({ value: o, fallback: f }), v = ot({ value: n, fallback: p }), b = ot({ value: i, fallback: r.scaleX || 1 }), I = ot({ value: a, fallback: r.scaleY || 1 }), y = m * b, w = v * I, A = f ? y / f : null, j = p ? w / p : null, M = {};
     f > 0 && (M.width = f), p > 0 && (M.height = p), A && A > 0 && (M.scaleX = A), j && j > 0 && (M.scaleY = j), r.set(M);
   }
   /**
@@ -5453,7 +5470,7 @@ class R {
     montageArea: a,
     useRelativePositions: r
   }) {
-    const c = t, { x: d, y: l } = lo({
+    const c = t, { x: d, y: h } = lo({
       object: t,
       baseWidth: n,
       baseHeight: i,
@@ -5472,7 +5489,7 @@ class R {
       anchorY: R._resolveAnchor(c, de)
     }), v = ho({
       normalizedX: d,
-      normalizedY: l,
+      normalizedY: h,
       bounds: m,
       targetSize: o,
       montageArea: a
@@ -5496,7 +5513,7 @@ class R {
     anchorY: a
   }) {
     if (!n) return t;
-    const r = (e || t.width) * o, c = (s || t.height) * o, d = t.width - r, l = t.height - c, u = t.left + R._calculateAnchorOffset(i, d), g = t.top + R._calculateAnchorOffset(a, l);
+    const r = (e || t.width) * o, c = (s || t.height) * o, d = t.width - r, h = t.height - c, u = t.left + R._calculateAnchorOffset(i, d), g = t.top + R._calculateAnchorOffset(a, h);
     return {
       left: u,
       top: g,
@@ -5593,7 +5610,7 @@ class R {
       top: r,
       width: c,
       height: d
-    } = e, l = t.getBoundingRect(!1, !0), u = s || c || 1, g = o || d || 1, f = uo({
+    } = e, h = t.getBoundingRect(!1, !0), u = s || c || 1, g = o || d || 1, f = uo({
       object: t,
       montageArea: n,
       bounds: e
@@ -5603,7 +5620,7 @@ class R {
         x: (y.x - a) / u,
         y: (y.y - r) / g
       };
-    })(), m = (l.left - a) / u, v = (l.top - r) / g, b = m + l.width / u, I = v + l.height / g;
+    })(), m = (h.left - a) / u, v = (h.top - r) / g, b = m + h.width / u, I = v + h.height / g;
     return i[ae] = p.x, i[re] = p.y, i[ce] = R._detectAnchor({
       center: p.x,
       start: m,
@@ -5723,13 +5740,13 @@ class R {
   }
 }
 const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
-  anchors: h,
+  anchors: l,
   positions: t,
   threshold: e
 }) => {
   let s = 0, o = e + 1, n = null;
   for (const i of t)
-    for (const a of h) {
+    for (const a of l) {
       const r = Math.abs(a - i);
       r > e || r >= o || (s = a - i, o = r, n = a);
     }
@@ -5738,11 +5755,11 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     guidePosition: n
   };
 }, mo = ({
-  activeBounds: h,
+  activeBounds: l,
   threshold: t,
   anchors: e
 }) => {
-  const { left: s, right: o, centerX: n, top: i, bottom: a, centerY: r } = h, c = Qe({
+  const { left: s, right: o, centerX: n, top: i, bottom: a, centerY: r } = l, c = Qe({
     anchors: e.vertical,
     positions: [s, n, o],
     threshold: t
@@ -5750,20 +5767,20 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     anchors: e.horizontal,
     positions: [i, r, a],
     threshold: t
-  }), l = [];
-  return c.guidePosition !== null && l.push({
+  }), h = [];
+  return c.guidePosition !== null && h.push({
     type: "vertical",
     position: c.guidePosition
-  }), d.guidePosition !== null && l.push({
+  }), d.guidePosition !== null && h.push({
     type: "horizontal",
     position: d.guidePosition
   }), {
     deltaX: c.delta,
     deltaY: d.delta,
-    guides: l
+    guides: h
   };
 }, ns = ({
-  activeBounds: h,
+  activeBounds: l,
   aligned: t,
   threshold: e,
   patterns: s,
@@ -5775,59 +5792,59 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     bottom: i,
     left: a,
     right: r
-  } = h, c = [];
+  } = l, c = [];
   for (const d of s)
-    for (const l of t)
+    for (const h of t)
       if (o === "vertical") {
-        const u = n - l.bottom, g = Math.abs(u - d.distance);
+        const u = n - h.bottom, g = Math.abs(u - d.distance);
         if (g <= e) {
           const m = d.distance - u, v = {
             type: o,
             axis: d.axis,
             refStart: d.start,
             refEnd: d.end,
-            activeStart: l.bottom,
-            activeEnd: l.bottom + d.distance,
+            activeStart: h.bottom,
+            activeEnd: h.bottom + d.distance,
             distance: d.distance
           };
           c.push({ delta: m, guide: v, diff: g });
         }
-        const f = l.top - i, p = Math.abs(f - d.distance);
+        const f = h.top - i, p = Math.abs(f - d.distance);
         if (p <= e) {
           const m = d.distance - f, v = {
             type: o,
             axis: d.axis,
             refStart: d.start,
             refEnd: d.end,
-            activeStart: l.top - d.distance,
-            activeEnd: l.top,
+            activeStart: h.top - d.distance,
+            activeEnd: h.top,
             distance: d.distance
           };
           c.push({ delta: m, guide: v, diff: p });
         }
       } else {
-        const u = a - l.right, g = Math.abs(u - d.distance);
+        const u = a - h.right, g = Math.abs(u - d.distance);
         if (g <= e) {
           const m = d.distance - u, v = {
             type: o,
             axis: d.axis,
             refStart: d.start,
             refEnd: d.end,
-            activeStart: l.right,
-            activeEnd: l.right + d.distance,
+            activeStart: h.right,
+            activeEnd: h.right + d.distance,
             distance: d.distance
           };
           c.push({ delta: m, guide: v, diff: g });
         }
-        const f = l.left - r, p = Math.abs(f - d.distance);
+        const f = h.left - r, p = Math.abs(f - d.distance);
         if (p <= e) {
           const m = d.distance - f, v = {
             type: o,
             axis: d.axis,
             refStart: d.start,
             refEnd: d.end,
-            activeStart: l.left - d.distance,
-            activeEnd: l.left,
+            activeStart: h.left - d.distance,
+            activeEnd: h.left,
             distance: d.distance
           };
           c.push({ delta: m, guide: v, diff: p });
@@ -5835,7 +5852,7 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
       }
   return c;
 }, yo = ({
-  activeBounds: h,
+  activeBounds: l,
   candidates: t,
   threshold: e,
   patterns: s
@@ -5846,18 +5863,18 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     bottom: i,
     left: a,
     right: r
-  } = h, c = t.filter((y) => Math.min(y.right, r) - Math.max(y.left, a) >= -e);
+  } = l, c = t.filter((y) => Math.min(y.right, r) - Math.max(y.left, a) >= -e);
   if (!c.length)
     return { delta: 0, guide: null };
   const d = [
     ...c.map((y) => ({ bounds: y, isActive: !1 })),
-    { bounds: h, isActive: !0 }
+    { bounds: l, isActive: !0 }
   ];
   d.sort((y, w) => y.bounds.top - w.bounds.top);
-  const l = d.findIndex((y) => y.isActive);
-  if (l === -1)
+  const h = d.findIndex((y) => y.isActive);
+  if (h === -1)
     return { delta: 0, guide: null };
-  const u = d[l - 1], g = d[l - 2], f = d[l + 1], p = d[l + 2], m = [], v = i - n;
+  const u = d[h - 1], g = d[h - 2], f = d[h + 1], p = d[h + 2], m = [], v = i - n;
   if (u && g) {
     const { bounds: y } = u, { bounds: w } = g, A = y.top - w.bottom, j = n - y.bottom, M = Math.abs(j - A);
     if (M <= e) {
@@ -5907,7 +5924,7 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     }
   }
   const b = ns({
-    activeBounds: h,
+    activeBounds: l,
     aligned: c,
     threshold: e,
     patterns: s,
@@ -5921,7 +5938,7 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     guide: I.guide
   };
 }, vo = ({
-  activeBounds: h,
+  activeBounds: l,
   candidates: t,
   threshold: e,
   patterns: s
@@ -5932,18 +5949,18 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     right: i,
     top: a,
     bottom: r
-  } = h, c = t.filter((y) => Math.min(y.bottom, r) - Math.max(y.top, a) >= -e);
+  } = l, c = t.filter((y) => Math.min(y.bottom, r) - Math.max(y.top, a) >= -e);
   if (!c.length)
     return { delta: 0, guide: null };
   const d = [
     ...c.map((y) => ({ bounds: y, isActive: !1 })),
-    { bounds: h, isActive: !0 }
+    { bounds: l, isActive: !0 }
   ];
   d.sort((y, w) => y.bounds.left - w.bounds.left);
-  const l = d.findIndex((y) => y.isActive);
-  if (l === -1)
+  const h = d.findIndex((y) => y.isActive);
+  if (h === -1)
     return { delta: 0, guide: null };
-  const u = d[l - 1], g = d[l - 2], f = d[l + 1], p = d[l + 2], m = [], v = i - n;
+  const u = d[h - 1], g = d[h - 2], f = d[h + 1], p = d[h + 2], m = [], v = i - n;
   if (u && g) {
     const { bounds: y } = u, { bounds: w } = g, A = y.left - w.right, j = n - y.right, M = Math.abs(j - A);
     if (M <= e) {
@@ -5993,7 +6010,7 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     }
   }
   const b = ns({
-    activeBounds: h,
+    activeBounds: l,
     aligned: c,
     threshold: e,
     patterns: s,
@@ -6007,18 +6024,18 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     guide: I.guide
   };
 }, bo = ({
-  activeBounds: h,
+  activeBounds: l,
   candidates: t,
   threshold: e,
   spacingPatterns: s
 }) => {
   const o = yo({
-    activeBounds: h,
+    activeBounds: l,
     candidates: t,
     threshold: e,
     patterns: s.vertical
   }), n = vo({
-    activeBounds: h,
+    activeBounds: l,
     candidates: t,
     threshold: e,
     patterns: s.horizontal
@@ -6029,7 +6046,7 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     guides: i
   };
 }, Mo = ({
-  context: h,
+  context: l,
   x: t,
   y: e,
   width: s,
@@ -6037,9 +6054,9 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
   radius: n
 }) => {
   const i = Math.min(n, s / 2, o / 2);
-  h.moveTo(t + i, e), h.lineTo(t + s - i, e), h.quadraticCurveTo(t + s, e, t + s, e + i), h.lineTo(t + s, e + o - i), h.quadraticCurveTo(t + s, e + o, t + s - i, e + o), h.lineTo(t + i, e + o), h.quadraticCurveTo(t, e + o, t, e + o - i), h.lineTo(t, e + i), h.quadraticCurveTo(t, e, t + i, e), h.closePath();
+  l.moveTo(t + i, e), l.lineTo(t + s - i, e), l.quadraticCurveTo(t + s, e, t + s, e + i), l.lineTo(t + s, e + o - i), l.quadraticCurveTo(t + s, e + o, t + s - i, e + o), l.lineTo(t + i, e + o), l.quadraticCurveTo(t, e + o, t, e + o - i), l.lineTo(t, e + i), l.quadraticCurveTo(t, e, t + i, e), l.closePath();
 }, me = ({
-  context: h,
+  context: l,
   type: t,
   axis: e,
   start: s,
@@ -6050,24 +6067,24 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
   textColor: r = "#ffffff",
   fontFamily: c = "sans-serif",
   lineWidth: d = 1,
-  padding: l = 4,
+  padding: h = 4,
   radius: u = 4,
   offsetAlongAxis: g = 0,
   offsetPerpendicular: f = 0
 }) => {
-  const p = i || 1, m = 12 / p, v = l / p, b = u / p, I = (s + o) / 2 + g, y = t === "vertical" ? e + f : I, w = t === "vertical" ? I : e + f;
-  h.save(), h.setLineDash([]), h.fillStyle = a, h.strokeStyle = a, h.lineWidth = d / p, h.font = `${m}px ${c}`, h.textAlign = "center", h.textBaseline = "middle";
-  const j = h.measureText(n).width + v * 2, M = m + v * 2, T = y - j / 2, S = w - M / 2;
-  h.beginPath(), Mo({
-    context: h,
+  const p = i || 1, m = 12 / p, v = h / p, b = u / p, I = (s + o) / 2 + g, y = t === "vertical" ? e + f : I, w = t === "vertical" ? I : e + f;
+  l.save(), l.setLineDash([]), l.fillStyle = a, l.strokeStyle = a, l.lineWidth = d / p, l.font = `${m}px ${c}`, l.textAlign = "center", l.textBaseline = "middle";
+  const j = l.measureText(n).width + v * 2, M = m + v * 2, T = y - j / 2, S = w - M / 2;
+  l.beginPath(), Mo({
+    context: l,
     x: T,
     y: S,
     width: j,
     height: M,
     radius: b
-  }), h.fill(), h.fillStyle = r, h.fillText(n, y, w), h.restore();
+  }), l.fill(), l.fillStyle = r, l.fillText(n, y, w), l.restore();
 }, wo = ({
-  context: h,
+  context: l,
   guide: t,
   zoom: e
 }) => {
@@ -6080,31 +6097,31 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     activeEnd: r,
     distance: c
   } = t, d = Math.round(c).toString();
-  h.beginPath(), s === "vertical" ? (h.moveTo(o, n), h.lineTo(o, i), h.moveTo(o, a), h.lineTo(o, r)) : (h.moveTo(n, o), h.lineTo(i, o), h.moveTo(a, o), h.lineTo(r, o)), h.stroke();
-  const l = os;
+  l.beginPath(), s === "vertical" ? (l.moveTo(o, n), l.lineTo(o, i), l.moveTo(o, a), l.lineTo(o, r)) : (l.moveTo(n, o), l.lineTo(i, o), l.moveTo(a, o), l.lineTo(r, o)), l.stroke();
+  const h = os;
   me({
-    context: h,
+    context: l,
     type: s,
     axis: o,
     start: n,
     end: i,
     text: d,
     zoom: e,
-    color: l,
+    color: h,
     lineWidth: pe
   }), me({
-    context: h,
+    context: l,
     type: s,
     axis: o,
     start: a,
     end: r,
     text: d,
     zoom: e,
-    color: l,
+    color: h,
     lineWidth: pe
   });
 }, qe = ({
-  anchors: h,
+  anchors: l,
   bounds: t
 }) => {
   const {
@@ -6115,24 +6132,24 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
     bottom: i,
     centerY: a
   } = t;
-  h.vertical.push(e, o, s), h.horizontal.push(n, a, i);
+  l.vertical.push(e, o, s), l.horizontal.push(n, a, i);
 }, Je = ({
-  bounds: h,
+  bounds: l,
   type: t,
   primaryStart: e,
   primaryEnd: s
 }) => {
-  const o = [], n = e === "top" ? "left" : "top", i = s === "bottom" ? "right" : "bottom", a = [...h].sort((r, c) => r[e] - c[e]);
+  const o = [], n = e === "top" ? "left" : "top", i = s === "bottom" ? "right" : "bottom", a = [...l].sort((r, c) => r[e] - c[e]);
   for (let r = 0; r < a.length; r += 1) {
     const c = a[r];
-    let d = null, l = Number.POSITIVE_INFINITY;
+    let d = null, h = Number.POSITIVE_INFINITY;
     for (let p = r + 1; p < a.length; p += 1) {
       const m = a[p];
       if (Math.min(c[i], m[i]) - Math.max(c[n], m[n]) < 0) continue;
       const b = m[e] - c[s];
-      b < 0 || b < l && (l = b, d = m);
+      b < 0 || b < h && (h = b, d = m);
     }
-    if (!d || l === Number.POSITIVE_INFINITY) continue;
+    if (!d || h === Number.POSITIVE_INFINITY) continue;
     const u = Math.max(c[n], d[n]), g = Math.min(c[i], d[i]), f = (u + g) / 2;
     o.push({
       type: t,
@@ -6144,34 +6161,34 @@ const po = 5, os = "#3D8BF4", pe = 1, Qt = 1, Qe = ({
   }
   return o;
 }, So = ({
-  bounds: h
+  bounds: l
 }) => {
   const t = Je({
-    bounds: h,
+    bounds: l,
     type: "vertical",
     primaryStart: "top",
     primaryEnd: "bottom"
   }), e = Je({
-    bounds: h,
+    bounds: l,
     type: "horizontal",
     primaryStart: "left",
     primaryEnd: "right"
   });
   return { vertical: t, horizontal: e };
 }, Ao = ["montage-area", "background", "interaction-blocker"], is = ({
-  activeObject: h
+  activeObject: l
 }) => {
   const t = /* @__PURE__ */ new Set();
-  return h && (t.add(h), h instanceof k && h.getObjects().forEach((e) => t.add(e))), t;
+  return l && (t.add(l), l instanceof k && l.getObjects().forEach((e) => t.add(e))), t;
 }, as = ({
-  object: h,
+  object: l,
   excluded: t,
   ignoredIds: e = Ao
 }) => {
-  if (t.has(h)) return !0;
-  const { visible: s = !0 } = h;
+  if (t.has(l)) return !0;
+  const { visible: s = !0 } = l;
   if (!s) return !0;
-  const { id: o } = h;
+  const { id: o } = l;
   return !!(o && e.includes(o));
 };
 class jo {
@@ -6241,12 +6258,12 @@ class jo {
       activeBounds: n,
       threshold: r,
       anchors: this.anchors
-    }), { deltaX: d, deltaY: l, guides: u } = c;
-    if (d !== 0 || l !== 0) {
+    }), { deltaX: d, deltaY: h, guides: u } = c;
+    if (d !== 0 || h !== 0) {
       const { left: v = 0, top: b = 0 } = e;
       e.set({
         left: v + d,
-        top: b + l
+        top: b + h
       }), e.setCoords(), n = (p = ft({ object: e })) != null ? p : n;
     }
     const g = this.cachedTargetBounds.length ? this.cachedTargetBounds : this._collectTargets({ activeObject: e }).map((v) => ft({ object: v })).filter((v) => !!v), f = bo({
@@ -6289,12 +6306,12 @@ class jo {
     if (!s) return;
     const o = e != null ? e : this._calculateViewportBounds(), { left: n, right: i, top: a, bottom: r } = o, { viewportTransform: c } = t, d = t.getZoom() || 1;
     s.save(), Array.isArray(c) && s.transform(...c), s.lineWidth = pe / d, s.strokeStyle = os, s.setLineDash([4, 4]);
-    for (const l of this.activeGuides)
-      s.beginPath(), l.type === "vertical" ? (s.moveTo(l.position, a), s.lineTo(l.position, r)) : (s.moveTo(n, l.position), s.lineTo(i, l.position)), s.stroke();
-    for (const l of this.activeSpacingGuides)
+    for (const h of this.activeGuides)
+      s.beginPath(), h.type === "vertical" ? (s.moveTo(h.position, a), s.lineTo(h.position, r)) : (s.moveTo(n, h.position), s.lineTo(i, h.position)), s.stroke();
+    for (const h of this.activeSpacingGuides)
       wo({
         context: s,
-        guide: l,
+        guide: h,
         zoom: d
       });
     s.restore();
@@ -6377,10 +6394,10 @@ class jo {
       i = 1,
       a = 0,
       r = 0
-    ] = e != null ? e : [], c = (0 - a) / n, d = (0 - r) / i, l = (s - a) / n, u = (o - r) / i;
+    ] = e != null ? e : [], c = (0 - a) / n, d = (0 - r) / i, h = (s - a) / n, u = (o - r) / i;
     return {
       left: c,
-      right: l,
+      right: h,
       top: d,
       bottom: u
     };
@@ -6565,7 +6582,7 @@ class Lt {
       centerY: c = 0
     } = t, {
       left: d = 0,
-      right: l = 0,
+      right: h = 0,
       top: u = 0,
       bottom: g = 0,
       centerY: f = 0
@@ -6581,19 +6598,19 @@ class Lt {
         distance: C
       }), o;
     }
-    if (l <= n) {
+    if (h <= n) {
       if (s) return o;
-      const C = n - l;
+      const C = n - h;
       return C > 0 && o.push({
         type: "horizontal",
         axis: b,
-        start: l,
+        start: h,
         end: n,
         distance: C
       }), o;
     }
     if (!s) return o;
-    const I = n < d, y = i > l, w = Math.min(n, d), A = Math.max(n, d), j = A - w;
+    const I = n < d, y = i > h, w = Math.min(n, d), A = Math.max(n, d), j = A - w;
     j > 0 && !I && o.push({
       type: "horizontal",
       axis: b,
@@ -6601,7 +6618,7 @@ class Lt {
       end: A,
       distance: j
     });
-    const M = Math.min(i, l), T = Math.max(i, l), S = T - M;
+    const M = Math.min(i, h), T = Math.max(i, h), S = T - M;
     return S > 0 && !y && o.push({
       type: "horizontal",
       axis: b,
@@ -6626,7 +6643,7 @@ class Lt {
       centerX: c = 0
     } = t, {
       top: d = 0,
-      bottom: l = 0,
+      bottom: h = 0,
       left: u = 0,
       right: g = 0,
       centerX: f = 0
@@ -6642,19 +6659,19 @@ class Lt {
         distance: C
       }), o;
     }
-    if (l <= n) {
+    if (h <= n) {
       if (s) return o;
-      const C = n - l;
+      const C = n - h;
       return C > 0 && o.push({
         type: "vertical",
         axis: b,
-        start: l,
+        start: h,
         end: n,
         distance: C
       }), o;
     }
     if (!s) return o;
-    const I = n < d, y = i > l, w = Math.min(n, d), A = Math.max(n, d), j = A - w;
+    const I = n < d, y = i > h, w = Math.min(n, d), A = Math.max(n, d), j = A - w;
     j > 0 && !I && o.push({
       type: "vertical",
       axis: b,
@@ -6662,7 +6679,7 @@ class Lt {
       end: A,
       distance: j
     });
-    const M = Math.min(i, l), T = Math.max(i, l), S = T - M;
+    const M = Math.min(i, h), T = Math.max(i, h), S = T - M;
     return S > 0 && !y && o.push({
       type: "vertical",
       axis: b,
@@ -6698,11 +6715,11 @@ class Lt {
     const { viewportTransform: s } = t, o = t.getZoom() || 1, n = this.activeGuides.some((c) => c.type === "vertical"), i = this.activeGuides.some((c) => c.type === "horizontal"), a = n && i && !this.isTargetMontageArea, r = a ? 12 / o : 0;
     e.save(), Array.isArray(s) && e.transform(...s), e.lineWidth = ts / o, e.strokeStyle = $e, e.setLineDash([]);
     for (const c of this.activeGuides) {
-      const { type: d, axis: l, start: u, end: g, distance: f } = c, p = Math.abs(g - u), m = u <= g ? -1 : 1, v = a ? m * (p / 2 + r) : 0, b = 0;
-      e.beginPath(), d === "vertical" ? (e.moveTo(l, u), e.lineTo(l, g)) : (e.moveTo(u, l), e.lineTo(g, l)), e.stroke(), me({
+      const { type: d, axis: h, start: u, end: g, distance: f } = c, p = Math.abs(g - u), m = u <= g ? -1 : 1, v = a ? m * (p / 2 + r) : 0, b = 0;
+      e.beginPath(), d === "vertical" ? (e.moveTo(h, u), e.lineTo(h, g)) : (e.moveTo(u, h), e.lineTo(g, h)), e.stroke(), me({
         context: e,
         type: d,
-        axis: l,
+        axis: h,
         start: u,
         end: g,
         text: Math.round(f).toString(),
@@ -6762,7 +6779,7 @@ class Se {
         initialStateJSON: r,
         scaleType: c,
         showRotationAngle: d,
-        _onReadyCallback: l
+        _onReadyCallback: h
       } = this.options;
       if (J.apply(), this.canvas = new vs(this.containerId, this.options), this.moduleLoader = new As(), this.workerManager = new Is(), this.errorManager = new Yt({ editor: this }), this.historyManager = new Jt({ editor: this }), this.toolbar = new Ys({ editor: this }), this.transformManager = new qs({ editor: this }), this.zoomManager = new Js({ editor: this }), this.canvasManager = new Qs({ editor: this }), this.imageManager = new ct({ editor: this }), this.layerManager = new $t({ editor: this }), this.shapeManager = new to({ editor: this }), this.interactionBlocker = new $s({ editor: this }), this.backgroundManager = new Ot({ editor: this }), this.clipboardManager = new eo({ editor: this }), this.objectLockManager = new te({ editor: this }), this.groupingManager = new so({ editor: this }), this.selectionManager = new oo({ editor: this }), this.deletionManager = new we({ editor: this }), this.panConstraintManager = new no({ editor: this }), this.snappingManager = new jo({ editor: this }), this.measurementManager = new Lt({ editor: this }), this.fontManager = new fe((u = this.options.fonts) != null ? u : []), this.textManager = new Z({ editor: this }), this.templateManager = new R({ editor: this }), d && (this.angleIndicator = new Me({ editor: this })), this._createMontageArea(), this._createClippingArea(), this.listeners = new Ut({ editor: this, options: this.options }), this.canvasManager.setEditorContainerWidth(t), this.canvasManager.setEditorContainerHeight(e), this.canvasManager.setCanvasWrapperWidth(s), this.canvasManager.setCanvasWrapperHeight(o), this.canvasManager.setCanvasCSSWidth(n), this.canvasManager.setCanvasCSSHeight(i), this.canvasManager.updateCanvas(), this.zoomManager.calculateAndApplyDefaultZoom(), yield this.fontManager.loadFonts(), a != null && a.source) {
         const {
@@ -6772,7 +6789,7 @@ class Se {
         } = a;
         yield this.imageManager.importImage({ source: g, scale: f, withoutSave: p });
       }
-      r && this.historyManager.loadStateFromFullState(r), this.historyManager.saveState(), console.log("editor:ready"), this.canvas.fire("editor:ready", this), typeof l == "function" && l(this);
+      r && this.historyManager.loadStateFromFullState(r), this.historyManager.saveState(), console.log("editor:ready"), this.canvas.fire("editor:ready", this), typeof h == "function" && h(this);
     });
   }
   /**
@@ -7753,15 +7770,15 @@ const E = [
    */
   fonts: Io
 };
-function Do(h, t = {}) {
-  const e = _(_({}, Co), t), s = document.getElementById(h);
+function Do(l, t = {}) {
+  const e = _(_({}, Co), t), s = document.getElementById(l);
   if (!s)
-    return Promise.reject(new Error(`Контейнер с ID "${h}" не найден.`));
+    return Promise.reject(new Error(`Контейнер с ID "${l}" не найден.`));
   const o = document.createElement("canvas");
-  return o.id = `${h}-canvas`, s.appendChild(o), e.editorContainer = s, new Promise((n) => {
+  return o.id = `${l}-canvas`, s.appendChild(o), e.editorContainer = s, new Promise((n) => {
     e._onReadyCallback = n;
     const i = new Se(o.id, e);
-    window[h] = i;
+    window[l] = i;
   });
 }
 export {