@anu3ev/fabric-image-editor 0.1.63 → 0.1.65

package/dist/main.js

@@ -35,7 +35,7 @@ var v = (r, e, t) => new Promise((s, n) => {
   }, o = (d) => d.done ? s(d.value) : Promise.resolve(d.value).then(i, a);
   o((t = t.apply(r, e)).next());
 });
-import { ActiveSelection as p, util as H, controlsUtils as Ie, InteractiveFabricObject as ve, loadSVGFromURL as Ae, FabricImage as U, Point as P, Rect as Se, Circle as Ce, Triangle as Ne, Group as $, Canvas as De, Pattern as Le } from "fabric";
+import { ActiveSelection as p, util as H, controlsUtils as Ie, InteractiveFabricObject as ve, loadSVGFromURL as Ae, FabricImage as Z, Point as P, Rect as Se, Circle as Ce, Triangle as Ne, Group as $, Canvas as De, Pattern as Le } from "fabric";
 import { create as we } from "jsondiffpatch";
 import Ee from "diff-match-patch";
 var Oe = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict", L = function() {
@@ -436,17 +436,17 @@ class xe {
     this.worker.terminate();
   }
 }
-const N = 12, Be = 2, J = 8, K = 20, Ze = 100, q = 20, ee = 8, Ue = 100, F = 32, te = 1, ze = "#2B2D33", se = "#3D8BF4", ne = "#FFFFFF";
+const N = 12, Be = 2, J = 8, K = 20, Ue = 100, q = 20, ee = 8, Ze = 100, F = 32, te = 1, ze = "#2B2D33", se = "#3D8BF4", ne = "#FFFFFF";
 function W(r, e, t, s, n) {
   const i = N, a = Be;
   r.save(), r.translate(e, t), r.rotate(H.degreesToRadians(n.angle)), r.fillStyle = ne, r.strokeStyle = se, r.lineWidth = te, r.beginPath(), r.roundRect(-i / 2, -i / 2, i, i, a), r.fill(), r.stroke(), r.restore();
 }
 function ge(r, e, t, s, n) {
-  const i = J, a = K, o = Ze;
+  const i = J, a = K, o = Ue;
   r.save(), r.translate(e, t), r.rotate(H.degreesToRadians(n.angle)), r.fillStyle = ne, r.strokeStyle = se, r.lineWidth = te, r.beginPath(), r.roundRect(-i / 2, -a / 2, i, a, o), r.fill(), r.stroke(), r.restore();
 }
 function ue(r, e, t, s, n) {
-  const i = q, a = ee, o = Ue;
+  const i = q, a = ee, o = Ze;
   r.save(), r.translate(e, t), r.rotate(H.degreesToRadians(n.angle)), r.fillStyle = ne, r.strokeStyle = se, r.lineWidth = te, r.beginPath(), r.roundRect(-i / 2, -a / 2, i, a, o), r.fill(), r.stroke(), r.restore();
 }
 const Re = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE4Ljc1IDQuMzc1djMuNzVhLjYyNS42MjUgMCAwIDEtLjYyNS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDEgMC0xLjI1aDIuMTRsLTIuMDc3LTEuOTAzLS4wMi0uMDE5YTYuMjUgNi4yNSAwIDEgMC0uMTMgOC45NjcuNjI2LjYyNiAwIDAgMSAuODYuOTA5QTcuNDU2IDcuNDU2IDAgMCAxIDEwIDE3LjVoLS4xMDNhNy41IDcuNSAwIDEgMSA1LjM5Ni0xMi44MTJMMTcuNSA2LjcwM1Y0LjM3NWEuNjI1LjYyNSAwIDAgMSAxLjI1IDBaIi8+PC9zdmc+", me = new Image();
@@ -688,7 +688,9 @@ class Je {
       d.innerHTML = i[n] ? `<img src="${i[n]}" title="${s}" />` : s, Object.assign(d.style, a), d.onclick = () => {
         var c;
         return (c = o[n]) == null ? void 0 : c.call(o, this.editor);
-      }, this.el.appendChild(d);
+      }, d.onmousedown = (c) => {
+        c.stopPropagation(), c.preventDefault();
+      }, d.ondragstart = (c) => c.preventDefault(), this.el.appendChild(d);
     }
   }
   /**
@@ -963,7 +965,7 @@ class Ke {
     });
   }
 }
-const qe = 0.1, et = 2, tt = 0.1, st = 90, B = 16, Z = 16, O = 4096, T = 4096;
+const qe = 0.1, et = 2, tt = 0.1, st = 90, B = 16, U = 16, O = 4096, T = 4096;
 class D {
   constructor({ editor: e }) {
     this.editor = e, this.options = e.options, this._createdBlobUrls = [], this.acceptContentTypes = this.editor.options.acceptContentTypes, this.acceptFormats = this.getAllowedFormatsFromContentTypes();
@@ -1019,17 +1021,17 @@ class D {
           const b = yield Ae(m);
           M = H.groupSVGElements(b.objects, b.options);
         } else
-          M = yield U.fromURL(m, { crossOrigin: "anonymous" });
+          M = yield Z.fromURL(m, { crossOrigin: "anonymous" });
         const { width: f, height: j } = M;
-        if (M instanceof U) {
+        if (M instanceof Z) {
           const b = M.getElement();
           let S = "";
           if (b instanceof HTMLImageElement ? S = b.src : b instanceof HTMLCanvasElement && (S = b.toDataURL()), j > T || f > O) {
             const w = yield this.resizeImageToBoundaries(S, "max"), E = URL.createObjectURL(w);
-            this._createdBlobUrls.push(E), M = yield U.fromURL(E, { crossOrigin: "anonymous" });
-          } else if (j < Z || f < B) {
+            this._createdBlobUrls.push(E), M = yield Z.fromURL(E, { crossOrigin: "anonymous" });
+          } else if (j < U || f < B) {
             const w = yield this.resizeImageToBoundaries(S, "min"), E = URL.createObjectURL(w);
-            this._createdBlobUrls.push(E), M = yield U.fromURL(E, { crossOrigin: "anonymous" });
+            this._createdBlobUrls.push(E), M = yield Z.fromURL(E, { crossOrigin: "anonymous" });
           }
         }
         if (M.set("id", `${M.type}-${L()}`), M.set("format", h), s === "scale-montage")
@@ -1070,14 +1072,14 @@ class D {
   resizeImageToBoundaries(e, t = "max") {
     return v(this, null, function* () {
       let s = `Размер изображения больше максимального размера канваса, поэтому оно будет уменьшено до максимальных размеров c сохранением пропорций: ${O}x${T}`;
-      t === "min" && (s = `Размер изображения меньше минимального размера канваса, поэтому оно будет увеличено до минимальных размеров c сохранением пропорций: ${B}x${Z}`);
+      t === "min" && (s = `Размер изображения меньше минимального размера канваса, поэтому оно будет увеличено до минимальных размеров c сохранением пропорций: ${B}x${U}`);
       const n = {
         dataURL: e,
         sizeType: t,
         maxWidth: O,
         maxHeight: T,
         minWidth: B,
-        minHeight: Z
+        minHeight: U
       };
       return this.editor.errorManager.emitWarning({
         origin: "ImageManager",
@@ -1243,7 +1245,7 @@ class D {
           };
           return o.fire("editor:object-exported", j), j;
         }
-        if (i && c instanceof U) {
+        if (i && c instanceof Z) {
           const M = yield createImageBitmap(c.getElement()), f = yield d.post(
             "toDataURL",
             {
@@ -1477,7 +1479,7 @@ class at {
       canvas: i,
       montageArea: a,
       options: { canvasBackstoreHeight: o }
-    } = this.editor, { width: d, height: c } = a, l = x(Number(e), Z, T);
+    } = this.editor, { width: d, height: c } = a, l = x(Number(e), U, T);
     if (!o || o === "auto" || n ? this.adaptCanvasToContainer() : o ? this.setCanvasBackstoreHeight(Number(o)) : this.setCanvasBackstoreHeight(l), a.set({ height: l }), (m = i.clipPath) == null || m.set({ height: l }), t) {
       const M = l / c, f = Me(d, M);
       this.setResolutionWidth(f);
@@ -1539,7 +1541,7 @@ class at {
    */
   setCanvasBackstoreHeight(e) {
     if (!e || typeof e != "number") return;
-    const t = x(e, Z, T);
+    const t = x(e, U, T);
     this.editor.canvas.setDimensions({ height: t }, { backstoreOnly: !0 });
   }
   /**
@@ -1548,7 +1550,7 @@ class at {
    * с учётом минимальных и максимальных значений.
    */
   adaptCanvasToContainer() {
-    const { canvas: e } = this.editor, t = this.getEditorContainer(), s = t.clientWidth, n = t.clientHeight, i = x(s, B, O), a = x(n, Z, T);
+    const { canvas: e } = this.editor, t = this.getEditorContainer(), s = t.clientWidth, n = t.clientHeight, i = x(s, B, O), a = x(n, U, T);
     e.setDimensions({ width: i, height: a }, { backstoreOnly: !0 });
   }
   /**
@@ -1814,9 +1816,7 @@ class ot {
    */
   calculateAndApplyDefaultZoom(e = this.options.defaultScale) {
     const { canvas: t } = this.editor, s = t.editorContainer, n = s.clientWidth, i = s.clientHeight, { width: a, height: o } = this.editor.montageArea, d = n / a * e, c = i / o * e;
-    this.defaultZoom = Math.min(d, c);
-    const { defaultZoom: l, maxZoomFactor: h, minZoom: g, maxZoom: u } = this;
-    this.minZoom = Math.min(l / h, g), this.maxZoom = Math.max(l * h, u), this.setZoom();
+    this.defaultZoom = Math.min(d, c), this.setZoom();
   }
   /**
    * Увеличение/уменьшение масштаба
@@ -1832,11 +1832,7 @@ class ot {
     if (!e) return;
     const { minZoom: s, maxZoom: n } = this, { canvas: i } = this.editor, a = i.getZoom(), o = i.getCenterPoint(), d = (g = t.pointX) != null ? g : o.x, c = (u = t.pointY) != null ? u : o.y, l = new P(d, c);
     let h = Number((a + Number(e)).toFixed(2));
-    h > n && (h = n), h < s && (h = s), i.zoomToPoint(l, h), console.log({
-      currentZoom: a,
-      zoom: h,
-      point: l
-    }), i.fire("editor:zoom-changed", {
+    h > n && (h = n), h < s && (h = s), i.zoomToPoint(l, h), i.fire("editor:zoom-changed", {
       currentZoom: i.getZoom(),
       zoom: h,
       point: l

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anu3ev/fabric-image-editor",
-  "version": "0.1.63",
+  "version": "0.1.65",
   "description": "JavaScript image editor built on FabricJS, allowing you to create instances with an integrated montage area and providing an API to modify and manage state.",
   "module": "dist/main.js",
   "files": [