@anu3ev/fabric-image-editor 0.1.11 → 0.1.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/main.js +320 -216
  2. package/package.json +1 -1
package/dist/main.js CHANGED
@@ -1,4 +1,4 @@
1
- import { ActiveSelection as Z, util as z, controlsUtils as Oe, InteractiveFabricObject as Te, loadSVGFromURL as Ee, FabricImage as de, Point as ke, Rect as xe, Circle as Be, Triangle as Ze, Group as ze, Pattern as Ue, Canvas as Pe } from "fabric";
1
+ import { ActiveSelection as z, util as U, controlsUtils as Oe, InteractiveFabricObject as Te, loadSVGFromURL as Ee, FabricImage as de, Point as ke, Rect as xe, Circle as Be, Triangle as Ze, Group as ze, Pattern as Ue, Canvas as Pe } from "fabric";
2
2
  import { create as Ye } from "jsondiffpatch";
3
3
  var He = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict", I = function() {
4
4
  for (var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 21, t = "", a = crypto.getRandomValues(new Uint8Array(e |= 0)); e--; )
@@ -28,7 +28,7 @@ function We(o) {
28
28
  });
29
29
  };
30
30
  }
31
- class B {
31
+ class Z {
32
32
  /**
33
33
  * Конструктор принимает редактор и опции.
34
34
  * @param {Object} params
@@ -49,7 +49,7 @@ class B {
49
49
  editor: t,
50
50
  options: a = {}
51
51
  } = e;
52
- this.editor = t, this.canvas = t.canvas, this.options = a, this.isUndoRedoKeyPressed = !1, this.handleAdaptCanvasToContainerBound = B.debounce(this.handleAdaptCanvasToContainer.bind(this), 500), this.handleCopyEventBound = this.handleCopyEvent.bind(this), this.handlePasteEventBound = this.handlePasteEvent.bind(this), this.handleUndoRedoEventBound = this.handleUndoRedoEvent.bind(this), this.handleUndoRedoKeyUpBound = this.handleUndoRedoKeyUp.bind(this), this.handleSelectAllEventBound = this.handleSelectAllEvent.bind(this), this.handleDeleteObjectsEventBound = this.handleDeleteObjectsEvent.bind(this), this.handleObjectModifiedHistoryBound = B.debounce(this.handleObjectModifiedHistory.bind(this), 300), this.handleObjectRotatingHistoryBound = B.debounce(this.handleObjectRotatingHistory.bind(this), 300), this.handleObjectAddedHistoryBound = this.handleObjectAddedHistory.bind(this), this.handleObjectRemovedHistoryBound = this.handleObjectRemovedHistory.bind(this), this.handleOverlayUpdateBound = this.handleOverlayUpdate.bind(this), this.handleCanvasDragStartBound = this.handleCanvasDragStart.bind(this), this.handleCanvasDraggingBound = this.handleCanvasDragging.bind(this), this.handleCanvasDragEndBound = this.handleCanvasDragEnd.bind(this), this.handleMouseWheelZoomBound = this.handleMouseWheelZoom.bind(this), this.handleBringToFrontBound = this.handleBringToFront.bind(this), this.handleResetObjectFitBound = this.handleResetObjectFit.bind(this), this.handleLockedSelectionBound = this._filterLockedSelection.bind(this), this.init();
52
+ this.editor = t, this.canvas = t.canvas, this.options = a, this.isUndoRedoKeyPressed = !1, this.handleAdaptCanvasToContainerBound = Z.debounce(this.handleAdaptCanvasToContainer.bind(this), 500), this.handleCopyEventBound = this.handleCopyEvent.bind(this), this.handlePasteEventBound = this.handlePasteEvent.bind(this), this.handleUndoRedoEventBound = this.handleUndoRedoEvent.bind(this), this.handleUndoRedoKeyUpBound = this.handleUndoRedoKeyUp.bind(this), this.handleSelectAllEventBound = this.handleSelectAllEvent.bind(this), this.handleDeleteObjectsEventBound = this.handleDeleteObjectsEvent.bind(this), this.handleObjectModifiedHistoryBound = Z.debounce(this.handleObjectModifiedHistory.bind(this), 300), this.handleObjectRotatingHistoryBound = Z.debounce(this.handleObjectRotatingHistory.bind(this), 300), this.handleObjectAddedHistoryBound = this.handleObjectAddedHistory.bind(this), this.handleObjectRemovedHistoryBound = this.handleObjectRemovedHistory.bind(this), this.handleOverlayUpdateBound = this.handleOverlayUpdate.bind(this), this.handleCanvasDragStartBound = this.handleCanvasDragStart.bind(this), this.handleCanvasDraggingBound = this.handleCanvasDragging.bind(this), this.handleCanvasDragEndBound = this.handleCanvasDragEnd.bind(this), this.handleMouseWheelZoomBound = this.handleMouseWheelZoom.bind(this), this.handleBringToFrontBound = this.handleBringToFront.bind(this), this.handleResetObjectFitBound = this.handleResetObjectFit.bind(this), this.handleLockedSelectionBound = this._filterLockedSelection.bind(this), this.init();
53
53
  }
54
54
  /**
55
55
  * Инициализация всех обработчиков согласно опциям.
@@ -103,7 +103,7 @@ class B {
103
103
  this.canvas.setActiveObject(n[0]);
104
104
  return;
105
105
  }
106
- var i = new Z(n, {
106
+ var i = new z(n, {
107
107
  canvas: this.canvas
108
108
  });
109
109
  this.canvas.setActiveObject(i), this.canvas.requestRenderAll();
@@ -176,6 +176,8 @@ class B {
176
176
  * @param {Object} event — объект события
177
177
  * @param {Object} event.clipboardData — данные из буфера обмена
178
178
  * @param {Array} event.clipboardData.items — элементы буфера обмена
179
+ *
180
+ * TODO: Попробовать вынести методы в классы-менеджеры.
179
181
  */
180
182
  handlePasteEvent(e) {
181
183
  var t, {
@@ -183,25 +185,27 @@ class B {
183
185
  } = e;
184
186
  if (a != null && (t = a.items) !== null && t !== void 0 && t.length) {
185
187
  var {
186
- items: r
187
- } = a, n = r[r.length - 1];
188
- if (n.type.indexOf("image") !== -1) {
189
- var i = n.getAsFile();
190
- if (!i) return;
191
- var s = new FileReader();
192
- s.onload = (h) => {
188
+ imageManager: r
189
+ } = this.editor, {
190
+ items: n
191
+ } = a, i = n[n.length - 1];
192
+ if (i.type.indexOf("image") !== -1) {
193
+ var s = i.getAsFile();
194
+ if (!s) return;
195
+ var c = new FileReader();
196
+ c.onload = (g) => {
193
197
  this.editor.imageManager.importImage({
194
- source: h.target.result
198
+ source: g.target.result
195
199
  });
196
- }, s.readAsDataURL(i);
200
+ }, c.readAsDataURL(s);
197
201
  return;
198
202
  }
199
- var c = a.getData("text/html");
200
- if (c) {
201
- var u = new DOMParser(), l = u.parseFromString(c, "text/html"), d = l.querySelector("img");
202
- if (d != null && d.src) {
203
- this.editor.imageManager.importImage({
204
- source: d.src
203
+ var u = a.getData("text/html");
204
+ if (u) {
205
+ var l = new DOMParser(), d = l.parseFromString(u, "text/html"), h = d.querySelector("img");
206
+ if (h != null && h.src) {
207
+ r.importImage({
208
+ source: h.src
205
209
  });
206
210
  return;
207
211
  }
@@ -440,50 +444,50 @@ class Re {
440
444
  this.worker.terminate();
441
445
  }
442
446
  }
443
- var p = 12, Ve = 2, G = 8, X = 20, Fe = 100, Q = 20, J = 8, Ge = 100, K = 32, $ = 1, Xe = "#2B2D33", q = "#3D8BF4", ee = "#FFFFFF";
444
- function U(o, e, t, a, r) {
447
+ var p = 12, Ve = 2, X = 8, Q = 20, Fe = 100, J = 20, K = 8, Ge = 100, $ = 32, q = 1, Xe = "#2B2D33", ee = "#3D8BF4", te = "#FFFFFF";
448
+ function Y(o, e, t, a, r) {
445
449
  var n = p, i = Ve;
446
- o.save(), o.translate(e, t), o.rotate(z.degreesToRadians(r.angle)), o.fillStyle = ee, o.strokeStyle = q, o.lineWidth = $, o.beginPath(), o.roundRect(-12 / 2, -12 / 2, n, n, i), o.fill(), o.stroke(), o.restore();
450
+ o.save(), o.translate(e, t), o.rotate(U.degreesToRadians(r.angle)), o.fillStyle = te, o.strokeStyle = ee, o.lineWidth = q, o.beginPath(), o.roundRect(-12 / 2, -12 / 2, n, n, i), o.fill(), o.stroke(), o.restore();
447
451
  }
448
452
  function he(o, e, t, a, r) {
449
- var n = G, i = X, s = Fe;
450
- o.save(), o.translate(e, t), o.rotate(z.degreesToRadians(r.angle)), o.fillStyle = ee, o.strokeStyle = q, o.lineWidth = $, o.beginPath(), o.roundRect(-8 / 2, -20 / 2, n, i, s), o.fill(), o.stroke(), o.restore();
453
+ var n = X, i = Q, s = Fe;
454
+ o.save(), o.translate(e, t), o.rotate(U.degreesToRadians(r.angle)), o.fillStyle = te, o.strokeStyle = ee, o.lineWidth = q, o.beginPath(), o.roundRect(-8 / 2, -20 / 2, n, i, s), o.fill(), o.stroke(), o.restore();
451
455
  }
452
456
  function ge(o, e, t, a, r) {
453
- var n = Q, i = J, s = Ge;
454
- o.save(), o.translate(e, t), o.rotate(z.degreesToRadians(r.angle)), o.fillStyle = ee, o.strokeStyle = q, o.lineWidth = $, o.beginPath(), o.roundRect(-20 / 2, -8 / 2, n, i, s), o.fill(), o.stroke(), o.restore();
457
+ var n = J, i = K, s = Ge;
458
+ o.save(), o.translate(e, t), o.rotate(U.degreesToRadians(r.angle)), o.fillStyle = te, o.strokeStyle = ee, o.lineWidth = q, o.beginPath(), o.roundRect(-20 / 2, -8 / 2, n, i, s), o.fill(), o.stroke(), o.restore();
455
459
  }
456
460
  var Qe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE4Ljc1IDQuMzc1djMuNzVhLjYyNS42MjUgMCAwIDEtLjYyNS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDEgMC0xLjI1aDIuMTRsLTIuMDc3LTEuOTAzLS4wMi0uMDE5YTYuMjUgNi4yNSAwIDEgMC0uMTMgOC45NjcuNjI2LjYyNiAwIDAgMSAuODYuOTA5QTcuNDU2IDcuNDU2IDAgMCAxIDEwIDE3LjVoLS4xMDNhNy41IDcuNSAwIDEgMSA1LjM5Ni0xMi44MTJMMTcuNSA2LjcwM1Y0LjM3NWEuNjI1LjYyNSAwIDAgMSAxLjI1IDBaIi8+PC9zdmc+", Ae = new Image();
457
461
  Ae.src = Qe;
458
462
  function Je(o, e, t, a, r) {
459
- var n = K, i = n / 2;
460
- o.save(), o.translate(e, t), o.rotate(z.degreesToRadians(r.angle)), o.fillStyle = Xe, o.beginPath(), o.arc(0, 0, i, 0, 2 * Math.PI), o.fill(), o.drawImage(Ae, -16 / 2, -16 / 2, i, i), o.restore();
463
+ var n = $, i = n / 2;
464
+ o.save(), o.translate(e, t), o.rotate(U.degreesToRadians(r.angle)), o.fillStyle = Xe, o.beginPath(), o.arc(0, 0, i, 0, 2 * Math.PI), o.fill(), o.drawImage(Ae, -16 / 2, -16 / 2, i, i), o.restore();
461
465
  }
462
466
  var Ke = {
463
467
  // Угловые точки
464
468
  tl: {
465
- render: U,
469
+ render: Y,
466
470
  sizeX: p,
467
471
  sizeY: p,
468
472
  offsetX: 0,
469
473
  offsetY: 0
470
474
  },
471
475
  tr: {
472
- render: U,
476
+ render: Y,
473
477
  sizeX: p,
474
478
  sizeY: p,
475
479
  offsetX: 0,
476
480
  offsetY: 0
477
481
  },
478
482
  bl: {
479
- render: U,
483
+ render: Y,
480
484
  sizeX: p,
481
485
  sizeY: p,
482
486
  offsetX: 0,
483
487
  offsetY: 0
484
488
  },
485
489
  br: {
486
- render: U,
490
+ render: Y,
487
491
  sizeX: p,
488
492
  sizeY: p,
489
493
  offsetX: 0,
@@ -492,38 +496,38 @@ var Ke = {
492
496
  // Середина вертикалей
493
497
  ml: {
494
498
  render: he,
495
- sizeX: G,
496
- sizeY: X,
499
+ sizeX: X,
500
+ sizeY: Q,
497
501
  offsetX: 0,
498
502
  offsetY: 0
499
503
  },
500
504
  mr: {
501
505
  render: he,
502
- sizeX: G,
503
- sizeY: X,
506
+ sizeX: X,
507
+ sizeY: Q,
504
508
  offsetX: 0,
505
509
  offsetY: 0
506
510
  },
507
511
  // Середина горизонталей
508
512
  mt: {
509
513
  render: ge,
510
- sizeX: Q,
511
- sizeY: J,
514
+ sizeX: J,
515
+ sizeY: K,
512
516
  offsetX: 0,
513
517
  offsetY: 0
514
518
  },
515
519
  mb: {
516
520
  render: ge,
517
- sizeX: Q,
518
- sizeY: J,
521
+ sizeX: J,
522
+ sizeY: K,
519
523
  offsetX: 0,
520
524
  offsetY: 0
521
525
  },
522
526
  // Специальный «rotate» контрол
523
527
  mtr: {
524
528
  render: Je,
525
- sizeX: K,
526
- sizeY: K,
529
+ sizeX: $,
530
+ sizeY: $,
527
531
  offsetX: 0,
528
532
  offsetY: -32
529
533
  }
@@ -567,7 +571,7 @@ function st(o) {
567
571
  });
568
572
  };
569
573
  }
570
- const E = {
574
+ const k = {
571
575
  style: {
572
576
  position: "absolute",
573
577
  display: "none",
@@ -678,7 +682,7 @@ function me(o, e) {
678
682
  }
679
683
  return t;
680
684
  }
681
- function M(o) {
685
+ function j(o) {
682
686
  for (var e = 1; e < arguments.length; e++) {
683
687
  var t = arguments[e] != null ? arguments[e] : {};
684
688
  e % 2 ? me(Object(t), !0).forEach(function(a) {
@@ -718,11 +722,11 @@ class lt {
718
722
  if (this.options = t.options, !!this.options.showToolbar) {
719
723
  this.editor = t, this.canvas = t.canvas;
720
724
  var a = this.options.toolbar || {};
721
- this.config = M(M(M({}, E), a), {}, {
722
- style: M(M({}, E.style), a.style || {}),
723
- btnStyle: M(M({}, E.btnStyle), a.btnStyle || {}),
724
- icons: M(M({}, E.icons), a.icons || {}),
725
- handlers: M(M({}, E.handlers), a.handlers || {})
725
+ this.config = j(j(j({}, k), a), {}, {
726
+ style: j(j({}, k.style), a.style || {}),
727
+ btnStyle: j(j({}, k.btnStyle), a.btnStyle || {}),
728
+ icons: j(j({}, k.icons), a.icons || {}),
729
+ handlers: j(j({}, k.handlers), a.handlers || {})
726
730
  }), this.currentTarget = null, this.currentLocked = null, this.isTransforming = !1, this._onMouseDown = this._handleMouseDown.bind(this), this._onObjectMoving = this._startTransform.bind(this), this._onObjectScaling = this._startTransform.bind(this), this._onObjectRotating = this._startTransform.bind(this), this._onMouseUp = this._endTransform.bind(this), this._onObjectModified = this._endTransform.bind(this), this._onSelectionChange = this._updateToolbar.bind(this), this._onSelectionClear = () => {
727
731
  this.el.style.display = "none";
728
732
  }, this._createDOM(), this._bindEvents();
@@ -866,7 +870,7 @@ function fe(o, e, t, a, r, n, i) {
866
870
  }
867
871
  s.done ? e(c) : Promise.resolve(c).then(a, r);
868
872
  }
869
- function R(o) {
873
+ function V(o) {
870
874
  return function() {
871
875
  var e = this, t = arguments;
872
876
  return new Promise(function(a, r) {
@@ -890,7 +894,7 @@ class ht {
890
894
  var {
891
895
  editor: t
892
896
  } = e;
893
- this.editor = t, this.canvas = t.canvas, this._historySuspendCount = 0, this.baseState = null, this.patches = [], this.currentIndex = 0, this.maxHistoryLength = t.options.maxHistoryLength, this._createDiffPatcher();
897
+ this.editor = t, this.canvas = t.canvas, this._historySuspendCount = 0, this.baseState = null, this.patches = [], this.currentIndex = 0, this.maxHistoryLength = t.options.maxHistoryLength, this.totalChangesCount = 0, this.baseStateChangesCount = 0, this._createDiffPatcher();
894
898
  }
895
899
  /** Проверка, нужно ли пропускать сохранение истории */
896
900
  get skipHistory() {
@@ -918,6 +922,20 @@ class ht {
918
922
  resumeHistory() {
919
923
  this._historySuspendCount = Math.max(0, this._historySuspendCount - 1);
920
924
  }
925
+ /**
926
+ * Проверяет, есть ли в редакторе несохранённые изменения
927
+ * @returns {boolean}
928
+ */
929
+ hasUnsavedChanges() {
930
+ return this.totalChangesCount > 0;
931
+ }
932
+ /**
933
+ * Получает текущую позицию в общей истории изменений
934
+ * @returns {number}
935
+ */
936
+ getCurrentChangePosition() {
937
+ return this.baseStateChangesCount + this.currentIndex;
938
+ }
921
939
  /**
922
940
  * Получаем полное состояние, применяя все диффы к базовому состоянию.
923
941
  */
@@ -946,7 +964,7 @@ class ht {
946
964
  console.log("Нет изменений для сохранения.");
947
965
  return;
948
966
  }
949
- console.log("baseState", this.baseState), this.currentIndex < this.patches.length && this.patches.splice(this.currentIndex), console.log("diff", a), this.patches.push(a), this.currentIndex += 1, this.patches.length > this.maxHistoryLength && (this.baseState = this.diffPatcher.patch(this.baseState, this.patches[0]), this.patches.shift(), this.currentIndex -= 1), console.log("Состояние сохранено. Текущий индекс истории:", this.currentIndex);
967
+ console.log("baseState", this.baseState), this.currentIndex < this.patches.length && this.patches.splice(this.currentIndex), console.log("diff", a), this.totalChangesCount += 1, this.patches.push(a), this.currentIndex += 1, this.patches.length > this.maxHistoryLength && (this.baseState = this.diffPatcher.patch(this.baseState, this.patches[0]), this.patches.shift(), this.currentIndex -= 1, this.baseStateChangesCount += 1), console.log("Состояние сохранено. Текущий индекс истории:", this.currentIndex);
950
968
  }
951
969
  }
952
970
  /**
@@ -956,7 +974,7 @@ class ht {
956
974
  */
957
975
  loadStateFromFullState(e) {
958
976
  var t = this;
959
- return R(function* () {
977
+ return V(function* () {
960
978
  if (e) {
961
979
  console.log("loadStateFromFullState fullState", e), yield t.canvas.loadFromJSON(e);
962
980
  var a = t.canvas.getObjects().find((n) => n.id === "montage-area");
@@ -972,7 +990,7 @@ class ht {
972
990
  */
973
991
  undo() {
974
992
  var e = this;
975
- return R(function* () {
993
+ return V(function* () {
976
994
  if (!e.skipHistory) {
977
995
  if (e.currentIndex <= 0) {
978
996
  console.log("Нет предыдущих состояний для отмены.");
@@ -980,7 +998,7 @@ class ht {
980
998
  }
981
999
  e.suspendHistory();
982
1000
  try {
983
- e.currentIndex -= 1;
1001
+ e.currentIndex -= 1, e.totalChangesCount -= 1;
984
1002
  var t = e.getFullState();
985
1003
  yield e.loadStateFromFullState(t), console.log("Undo выполнен. Текущий индекс истории:", e.currentIndex), e.canvas.fire("editor:undo");
986
1004
  } catch (a) {
@@ -999,7 +1017,7 @@ class ht {
999
1017
  */
1000
1018
  redo() {
1001
1019
  var e = this;
1002
- return R(function* () {
1020
+ return V(function* () {
1003
1021
  if (!e.skipHistory) {
1004
1022
  if (e.currentIndex >= e.patches.length) {
1005
1023
  console.log("Нет состояний для повтора.");
@@ -1007,7 +1025,7 @@ class ht {
1007
1025
  }
1008
1026
  e.suspendHistory();
1009
1027
  try {
1010
- e.currentIndex += 1;
1028
+ e.currentIndex += 1, e.totalChangesCount += 1;
1011
1029
  var t = e.getFullState();
1012
1030
  console.log("fullState", t), yield e.loadStateFromFullState(t), console.log("Redo выполнен. Текущий индекс истории:", e.currentIndex), e.canvas.fire("editor:redo");
1013
1031
  } catch (a) {
@@ -1021,7 +1039,7 @@ class ht {
1021
1039
  })();
1022
1040
  }
1023
1041
  }
1024
- var gt = 0.1, vt = 2, mt = 0.1, ft = 90, k = 16, x = 16, D = 4096, C = 4096;
1042
+ var gt = 0.1, vt = 2, mt = 0.1, ft = 90, x = 16, B = 16, D = 4096, N = 4096;
1025
1043
  function Me(o, e, t, a, r, n, i) {
1026
1044
  try {
1027
1045
  var s = o[n](i), c = s.value;
@@ -1030,7 +1048,7 @@ function Me(o, e, t, a, r, n, i) {
1030
1048
  }
1031
1049
  s.done ? e(c) : Promise.resolve(c).then(a, r);
1032
1050
  }
1033
- function P(o) {
1051
+ function T(o) {
1034
1052
  return function() {
1035
1053
  var e = this, t = arguments;
1036
1054
  return new Promise(function(a, r) {
@@ -1045,7 +1063,7 @@ function P(o) {
1045
1063
  });
1046
1064
  };
1047
1065
  }
1048
- class L {
1066
+ class C {
1049
1067
  /**
1050
1068
  * @param {object} options
1051
1069
  * @param {ImageEditor} options.editor - экземпляр редактора с доступом к canvas
@@ -1069,82 +1087,89 @@ class L {
1069
1087
  */
1070
1088
  importImage(e) {
1071
1089
  var t = this;
1072
- return P(function* () {
1090
+ return T(function* () {
1073
1091
  var {
1074
1092
  source: a,
1075
1093
  scale: r = "image-".concat(t.options.scaleType),
1076
- withoutSave: n = !1,
1077
- contentType: i = "image/png"
1094
+ withoutSave: n = !1
1078
1095
  } = e;
1079
1096
  if (a) {
1097
+ var i = yield t.getContentType(a);
1098
+ if (!t.isAllowedContentType(i)) {
1099
+ var s = "Неверный contentType для изображения: ".concat(i, ". Ожидается один из: ").concat(t.options.acceptContentTypes.join(", "), ".");
1100
+ console.error("ImageManager. ".concat(s)), t.editor.canvas.fire("editor:error", {
1101
+ message: s
1102
+ });
1103
+ return;
1104
+ }
1080
1105
  var {
1081
- canvas: s,
1082
- montageArea: c,
1083
- transformManager: u,
1084
- historyManager: l
1106
+ canvas: c,
1107
+ montageArea: u,
1108
+ transformManager: l,
1109
+ historyManager: d
1085
1110
  } = t.editor;
1086
- l.suspendHistory();
1111
+ d.suspendHistory();
1087
1112
  try {
1088
- var d, h;
1113
+ var h, g;
1089
1114
  if (a instanceof File)
1090
- d = URL.createObjectURL(a);
1115
+ h = URL.createObjectURL(a);
1091
1116
  else if (typeof a == "string") {
1092
- var g = yield fetch(a, {
1117
+ var v = yield fetch(a, {
1093
1118
  mode: "cors"
1094
- }), v = yield g.blob({
1119
+ }), f = yield v.blob({
1095
1120
  type: i,
1096
1121
  quality: 1
1097
1122
  });
1098
- d = URL.createObjectURL(v);
1123
+ h = URL.createObjectURL(f);
1099
1124
  } else
1100
1125
  throw new Error("ImportImage. Неверный тип источника изображения. Ожидается URL или объект File.");
1101
- t._createdBlobUrls.push(d);
1102
- var m = L.getFormatFromContentType(i);
1103
- if (m === "svg") {
1104
- var j = yield Ee(d);
1105
- h = z.groupSVGElements(j.objects, j.options);
1126
+ t._createdBlobUrls.push(h);
1127
+ var y = C.getFormatFromContentType(i);
1128
+ if (y === "svg") {
1129
+ var m = yield Ee(h);
1130
+ g = U.groupSVGElements(m.objects, m.options);
1106
1131
  } else
1107
- h = yield de.fromURL(d, {
1132
+ g = yield de.fromURL(h, {
1108
1133
  crossOrigin: "anonymous"
1109
1134
  });
1110
1135
  var {
1111
- width: f,
1112
- height: b
1113
- } = h;
1114
- if (b > C || f > D) {
1115
- var y = yield t.resizeImageToBoundaries(h._element.src, "max"), S = URL.createObjectURL(y);
1116
- t._createdBlobUrls.push(S), h = yield de.fromURL(S, {
1136
+ width: b,
1137
+ height: M
1138
+ } = g;
1139
+ if (M > N || b > D) {
1140
+ var L = yield t.resizeImageToBoundaries(g._element.src, "max"), O = URL.createObjectURL(L);
1141
+ t._createdBlobUrls.push(O), g = yield de.fromURL(O, {
1117
1142
  crossOrigin: "anonymous"
1118
1143
  });
1119
1144
  }
1120
- if (h.set("id", "".concat(h.type, "-").concat(I())), h.set("format", m), r === "scale-montage")
1145
+ if (g.set("id", "".concat(g.type, "-").concat(I())), g.set("format", y), r === "scale-montage")
1121
1146
  t.editor.canvasManager.scaleMontageAreaToImage({
1122
- object: h,
1147
+ object: g,
1123
1148
  withoutSave: !0
1124
1149
  });
1125
1150
  else {
1126
1151
  var {
1127
- width: O,
1152
+ width: S,
1128
1153
  height: A
1129
- } = c, w = t.calculateScaleFactor({
1130
- imageObject: h,
1154
+ } = u, P = t.calculateScaleFactor({
1155
+ imageObject: g,
1131
1156
  scaleType: r
1132
1157
  });
1133
- r === "image-contain" && w < 1 ? u.fitObject({
1134
- object: h,
1158
+ r === "image-contain" && P < 1 ? l.fitObject({
1159
+ object: g,
1135
1160
  type: "contain",
1136
1161
  withoutSave: !0
1137
- }) : r === "image-cover" && (f > O || b > A) && u.fitObject({
1138
- object: h,
1162
+ }) : r === "image-cover" && (b > S || M > A) && l.fitObject({
1163
+ object: g,
1139
1164
  type: "cover",
1140
1165
  withoutSave: !0
1141
1166
  });
1142
1167
  }
1143
- s.add(h), s.centerObject(h), s.setActiveObject(h), s.renderAll(), l.resumeHistory(), n || l.saveState();
1144
- } catch (T) {
1145
- console.error("importImage. Ошибка импорта изображения: ", T), s.fire("editor:error", {
1146
- message: "Ошибка импорта изображения: ".concat(T.message)
1147
- }), l.resumeHistory();
1168
+ c.add(g), c.centerObject(g), c.setActiveObject(g), c.renderAll(), d.resumeHistory(), n || d.saveState();
1169
+ } catch (E) {
1170
+ console.error("importImage. Ошибка импорта изображения: ", E), c.fire("editor:error", {
1171
+ message: "Ошибка импорта изображения: ".concat(E.message)
1172
+ }), d.resumeHistory();
1148
1173
  }
1149
1174
  }
1150
1175
  })();
@@ -1159,15 +1184,15 @@ class L {
1159
1184
  */
1160
1185
  resizeImageToBoundaries(e) {
1161
1186
  var t = arguments, a = this;
1162
- return P(function* () {
1163
- var r = t.length > 1 && t[1] !== void 0 ? t[1] : "max", n = "Размер изображения больше максимального размера канваса, поэтому оно будет уменьшено до максимальных размеров: ".concat(D, "x").concat(C);
1187
+ return T(function* () {
1188
+ var r = t.length > 1 && t[1] !== void 0 ? t[1] : "max", n = "Размер изображения больше максимального размера канваса, поэтому оно будет уменьшено до максимальных размеров: ".concat(D, "x").concat(N);
1164
1189
  console.warn("importImage. ".concat(n)), a.editor.canvas.fire("editor:warning", {
1165
1190
  message: n
1166
1191
  });
1167
1192
  var i = yield a.editor.workerManager.post("resizeImage", {
1168
1193
  dataURL: e,
1169
1194
  maxWidth: D,
1170
- maxHeight: C,
1195
+ maxHeight: N,
1171
1196
  sizeType: r
1172
1197
  });
1173
1198
  return i;
@@ -1186,7 +1211,7 @@ class L {
1186
1211
  */
1187
1212
  exportCanvasAsImageFile() {
1188
1213
  var e = arguments, t = this;
1189
- return P(function* () {
1214
+ return T(function* () {
1190
1215
  var {
1191
1216
  fileName: a = "image.png",
1192
1217
  contentType: r = "image/png",
@@ -1196,74 +1221,74 @@ class L {
1196
1221
  canvas: s,
1197
1222
  montageArea: c,
1198
1223
  workerManager: u
1199
- } = t.editor, l = r === "application/pdf", d = l ? "image/jpg" : r, h = L.getFormatFromContentType(d);
1224
+ } = t.editor, l = r === "application/pdf", d = l ? "image/jpg" : r, h = C.getFormatFromContentType(d);
1200
1225
  c.setCoords();
1201
1226
  var {
1202
1227
  left: g,
1203
1228
  top: v,
1204
- width: m,
1205
- height: j
1206
- } = c.getBoundingRect(), f = yield s.clone(["id", "format", "locked"]);
1207
- ["image/jpg", "image/jpeg"].includes(d) && (f.backgroundColor = "#ffffff");
1208
- var b = f.getObjects().find((N) => N.id === c.id);
1209
- b.visible = !1, f.viewportTransform = [1, 0, 0, 1, -g, -v], f.setDimensions({
1210
- width: m,
1211
- height: j
1229
+ width: f,
1230
+ height: y
1231
+ } = c.getBoundingRect(), m = yield s.clone(["id", "format", "locked"]);
1232
+ ["image/jpg", "image/jpeg"].includes(d) && (m.backgroundColor = "#ffffff");
1233
+ var b = m.getObjects().find((w) => w.id === c.id);
1234
+ b.visible = !1, m.viewportTransform = [1, 0, 0, 1, -g, -v], m.setDimensions({
1235
+ width: f,
1236
+ height: y
1212
1237
  }, {
1213
1238
  backstoreOnly: !0
1214
- }), f.renderAll();
1215
- var y = f.getObjects().filter((N) => N.format).every((N) => N.format === "svg");
1216
- if (h === "svg" && y) {
1217
- var S = f.toSVG();
1218
- f.dispose();
1219
- var O = L._exportSVGStringAsFile(S, {
1239
+ }), m.renderAll();
1240
+ var M = m.getObjects().filter((w) => w.format).every((w) => w.format === "svg");
1241
+ if (h === "svg" && M) {
1242
+ var L = m.toSVG();
1243
+ m.dispose();
1244
+ var O = C._exportSVGStringAsFile(L, {
1220
1245
  exportAsBase64: n,
1221
1246
  exportAsBlob: i,
1222
1247
  fileName: a
1223
- }), A = {
1248
+ }), S = {
1224
1249
  image: O,
1225
1250
  format: "svg",
1226
1251
  contentType: "image/svg+xml",
1227
1252
  fileName: a.replace(/\.[^/.]+$/, ".svg")
1228
1253
  };
1229
- return s.fire("editor:canvas-exported", A), A;
1254
+ return s.fire("editor:canvas-exported", S), S;
1230
1255
  }
1231
- var w = yield new Promise((N) => {
1232
- f.getElement().toBlob(N);
1256
+ var A = yield new Promise((w) => {
1257
+ m.getElement().toBlob(w);
1233
1258
  });
1234
- if (f.dispose(), i) {
1235
- var T = {
1236
- image: w,
1259
+ if (m.dispose(), i) {
1260
+ var P = {
1261
+ image: A,
1237
1262
  format: h,
1238
1263
  contentType: d,
1239
1264
  fileName: a
1240
1265
  };
1241
- return s.fire("editor:canvas-exported", T), T;
1266
+ return s.fire("editor:canvas-exported", P), P;
1242
1267
  }
1243
- var ae = yield createImageBitmap(w), re = yield u.post("toDataURL", {
1268
+ var E = yield createImageBitmap(A), re = yield u.post("toDataURL", {
1244
1269
  format: h,
1245
1270
  quality: 1,
1246
- bitmap: ae
1247
- }, [ae]);
1271
+ bitmap: E
1272
+ }, [E]);
1248
1273
  if (l) {
1249
- var ne = 0.264583, H = m * ne, W = j * ne, we = (yield t.editor.moduleLoader.loadModule("jspdf")).jsPDF, _ = new we({
1250
- orientation: H > W ? "landscape" : "portrait",
1274
+ var ne = 0.264583, W = f * ne, _ = y * ne, we = (yield t.editor.moduleLoader.loadModule("jspdf")).jsPDF, R = new we({
1275
+ orientation: W > _ ? "landscape" : "portrait",
1251
1276
  unit: "mm",
1252
- format: [H, W]
1277
+ format: [W, _]
1253
1278
  });
1254
- if (_.addImage(re, "JPG", 0, 0, H, W), n) {
1255
- var Ne = _.output("datauristring"), ie = {
1256
- image: Ne,
1279
+ if (R.addImage(re, "JPG", 0, 0, W, _), n) {
1280
+ var Ce = R.output("datauristring"), ie = {
1281
+ image: Ce,
1257
1282
  format: "pdf",
1258
1283
  contentType: "application/pdf",
1259
1284
  fileName: a
1260
1285
  };
1261
1286
  return s.fire("editor:canvas-exported", ie), ie;
1262
1287
  }
1263
- var De = _.output("blob"), Ce = new File([De], a, {
1288
+ var De = R.output("blob"), Ne = new File([De], a, {
1264
1289
  type: "application/pdf"
1265
1290
  }), oe = {
1266
- image: Ce,
1291
+ image: Ne,
1267
1292
  format: "pdf",
1268
1293
  contentType: "application/pdf",
1269
1294
  fileName: a
@@ -1279,7 +1304,7 @@ class L {
1279
1304
  };
1280
1305
  return s.fire("editor:canvas-exported", se), se;
1281
1306
  }
1282
- var ce = h === "svg" && !y ? a.replace(/\.[^/.]+$/, ".png") : a, Le = new File([w], ce, {
1307
+ var ce = h === "svg" && !M ? a.replace(/\.[^/.]+$/, ".png") : a, Le = new File([A], ce, {
1283
1308
  type: d
1284
1309
  }), ue = {
1285
1310
  image: Le,
@@ -1303,7 +1328,7 @@ class L {
1303
1328
  */
1304
1329
  exportObjectAsImageFile() {
1305
1330
  var e = arguments, t = this;
1306
- return P(function* () {
1331
+ return T(function* () {
1307
1332
  var {
1308
1333
  object: a,
1309
1334
  fileName: r = "image.png",
@@ -1318,7 +1343,7 @@ class L {
1318
1343
  return console.error("exportObjectAsDataURL. Не выбран объект"), c.fire("editor:error", {
1319
1344
  message: "Не выбран объект для экспорта"
1320
1345
  }), "";
1321
- var d = L.getFormatFromContentType(n);
1346
+ var d = C.getFormatFromContentType(n);
1322
1347
  if (d === "svg") {
1323
1348
  var h = l.toSVG(), g = t._exportSVGStringAsFile(h, {
1324
1349
  exportAsBase64: i,
@@ -1333,39 +1358,39 @@ class L {
1333
1358
  return c.fire("editor:object-exported", v), v;
1334
1359
  }
1335
1360
  if (i) {
1336
- var m = yield createImageBitmap(l._element), j = yield u.post("toDataURL", {
1361
+ var f = yield createImageBitmap(l._element), y = yield u.post("toDataURL", {
1337
1362
  format: d,
1338
1363
  quality: 1,
1339
- bitmap: m
1340
- }, [m]), f = {
1341
- image: j,
1364
+ bitmap: f
1365
+ }, [f]), m = {
1366
+ image: y,
1342
1367
  format: d,
1343
1368
  contentType: n,
1344
1369
  fileName: r
1345
1370
  };
1346
- return c.fire("editor:object-exported", f), f;
1371
+ return c.fire("editor:object-exported", m), m;
1347
1372
  }
1348
- var b = l.toCanvasElement(), y = yield new Promise((w) => {
1349
- b.toBlob(w);
1373
+ var b = l.toCanvasElement(), M = yield new Promise((A) => {
1374
+ b.toBlob(A);
1350
1375
  });
1351
1376
  if (s) {
1352
- var S = {
1353
- image: y,
1377
+ var L = {
1378
+ image: M,
1354
1379
  format: d,
1355
1380
  contentType: n,
1356
1381
  fileName: r
1357
1382
  };
1358
- return c.fire("editor:object-exported", S), S;
1383
+ return c.fire("editor:object-exported", L), L;
1359
1384
  }
1360
- var O = new File([y], r, {
1385
+ var O = new File([M], r, {
1361
1386
  type: n
1362
- }), A = {
1387
+ }), S = {
1363
1388
  image: O,
1364
1389
  format: d,
1365
1390
  contentType: n,
1366
1391
  fileName: r
1367
1392
  };
1368
- return c.fire("editor:object-exported", A), A;
1393
+ return c.fire("editor:object-exported", S), S;
1369
1394
  })();
1370
1395
  }
1371
1396
  /**
@@ -1409,6 +1434,84 @@ class L {
1409
1434
  var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "", t = e.match(/^[^/]+\/([^+;]+)/);
1410
1435
  return t ? t[1] : "";
1411
1436
  }
1437
+ /**
1438
+ * Проверяет, является ли contentType допустимым типом изображения.
1439
+ * @param {string} contentType - тип контента
1440
+ * @returns {boolean} true, если contentType допустим, иначе false
1441
+ */
1442
+ isAllowedContentType() {
1443
+ var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "", {
1444
+ acceptContentTypes: t
1445
+ } = this.editor.options;
1446
+ return t.includes(e);
1447
+ }
1448
+ /**
1449
+ * Проверяет, является ли формат допустимым.
1450
+ * @param {string} format - формат изображения, например 'png', 'jpeg', 'svg'
1451
+ * @returns {boolean} true, если формат допустим, иначе false
1452
+ */
1453
+ isAllowedFormat() {
1454
+ var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "", {
1455
+ acceptContentTypes: t
1456
+ } = this.editor.options, a = "image/".concat(e);
1457
+ return t.includes(a);
1458
+ }
1459
+ /**
1460
+ * Получает contentType изображения из источника
1461
+ * @param {File|string} source - URL изображения или объект File
1462
+ * @returns {Promise<string>|string} - MIME-тип изображения
1463
+ * @public
1464
+ */
1465
+ getContentType(e) {
1466
+ var t = this;
1467
+ return T(function* () {
1468
+ return typeof e == "string" ? t.getContentTypeFromUrl(e) : e.type || "application/octet-stream";
1469
+ })();
1470
+ }
1471
+ /**
1472
+ * Получает contentType изображения через HTTP HEAD запрос или анализ URL
1473
+ * @param {string} src - URL изображения
1474
+ * @returns {Promise<string>} - MIME-тип изображения
1475
+ * @public
1476
+ */
1477
+ getContentTypeFromUrl(e) {
1478
+ var t = this;
1479
+ return T(function* () {
1480
+ if (e.startsWith("data:")) {
1481
+ var a = e.match(/^data:([^;]+)/);
1482
+ return a ? a[1] : "application/octet-stream";
1483
+ }
1484
+ try {
1485
+ var r = yield fetch(e, {
1486
+ method: "HEAD"
1487
+ }), n = r.headers.get("content-type");
1488
+ if (n && n.startsWith("image/"))
1489
+ return n.split(";")[0];
1490
+ } catch (i) {
1491
+ console.warn("HEAD запрос неудачен, определяем тип по расширению:", i);
1492
+ }
1493
+ return t.getContentTypeFromExtension(e);
1494
+ })();
1495
+ }
1496
+ /**
1497
+ * Определяет contentType по расширению файла в URL
1498
+ * @param {string} url - URL файла
1499
+ * @returns {string} - MIME-тип
1500
+ * @public
1501
+ */
1502
+ getContentTypeFromExtension(e) {
1503
+ try {
1504
+ var t, {
1505
+ acceptContentTypes: a
1506
+ } = this.editor.options, r = new URL(e), n = (t = r.pathname.split(".").pop()) === null || t === void 0 ? void 0 : t.toLowerCase(), i = {};
1507
+ return a.forEach((s) => {
1508
+ var c = C.getFormatFromContentType(s);
1509
+ c && (i[c] = s);
1510
+ }), i[n] || "application/octet-stream";
1511
+ } catch (s) {
1512
+ return console.warn("Не удалось определить расширение из URL:", e, s), "application/octet-stream";
1513
+ }
1514
+ }
1412
1515
  /**
1413
1516
  * Рассчитывает коэффициент масштабирования изображения.
1414
1517
  * @param {object} imageObject - объект изображения
@@ -1465,7 +1568,7 @@ class Mt {
1465
1568
  } = this.editor, {
1466
1569
  width: c,
1467
1570
  height: u
1468
- } = i, l = Number(Math.max(Math.min(e, D), k));
1571
+ } = i, l = Number(Math.max(Math.min(e, D), x));
1469
1572
  if (!s || s === "auto" || r ? this.adaptCanvasToContainer() : s ? this.setCanvasBackstoreWidth(s) : this.setCanvasBackstoreWidth(l), i.set({
1470
1573
  width: l
1471
1574
  }), n.clipPath.set({
@@ -1478,8 +1581,8 @@ class Mt {
1478
1581
  var {
1479
1582
  left: g,
1480
1583
  top: v
1481
- } = this.getObjectDefaultCoords(i), m = n.getZoom();
1482
- n.setViewportTransform([m, 0, 0, m, g, v]), this.centerMontageArea(), a || this.editor.historyManager.saveState(), n == null || n.fire("editor:resolution-width-changed", {
1584
+ } = this.getObjectDefaultCoords(i), f = n.getZoom();
1585
+ n.setViewportTransform([f, 0, 0, f, g, v]), this.centerMontageArea(), a || this.editor.historyManager.saveState(), n == null || n.fire("editor:resolution-width-changed", {
1483
1586
  width: e
1484
1587
  });
1485
1588
  }
@@ -1508,7 +1611,7 @@ class Mt {
1508
1611
  } = this.editor, {
1509
1612
  width: c,
1510
1613
  height: u
1511
- } = i, l = Number(Math.max(Math.min(e, C), x));
1614
+ } = i, l = Number(Math.max(Math.min(e, N), B));
1512
1615
  if (!s || s === "auto" || r ? this.adaptCanvasToContainer() : s ? this.setCanvasBackstoreHeight(s) : this.setCanvasBackstoreHeight(l), i.set({
1513
1616
  height: l
1514
1617
  }), n.clipPath.set({
@@ -1521,8 +1624,8 @@ class Mt {
1521
1624
  var {
1522
1625
  left: g,
1523
1626
  top: v
1524
- } = this.getObjectDefaultCoords(i), m = n.getZoom();
1525
- n.setViewportTransform([m, 0, 0, m, g, v]), this.centerMontageArea(), a || this.editor.historyManager.saveState(), n == null || n.fire("editor:resolution-height-changed", {
1627
+ } = this.getObjectDefaultCoords(i), f = n.getZoom();
1628
+ n.setViewportTransform([f, 0, 0, f, g, v]), this.centerMontageArea(), a || this.editor.historyManager.saveState(), n == null || n.fire("editor:resolution-height-changed", {
1526
1629
  height: e
1527
1630
  });
1528
1631
  }
@@ -1570,7 +1673,7 @@ class Mt {
1570
1673
  }
1571
1674
  setCanvasBackstoreWidth(e) {
1572
1675
  if (!(!e || typeof e != "number")) {
1573
- var t = Math.max(Math.min(e, D), k);
1676
+ var t = Math.max(Math.min(e, D), x);
1574
1677
  this.editor.canvas.setDimensions({
1575
1678
  width: t
1576
1679
  }, {
@@ -1580,7 +1683,7 @@ class Mt {
1580
1683
  }
1581
1684
  setCanvasBackstoreHeight(e) {
1582
1685
  if (!(!e || typeof e != "number")) {
1583
- var t = Math.max(Math.min(e, C), x);
1686
+ var t = Math.max(Math.min(e, N), B);
1584
1687
  this.editor.canvas.setDimensions({
1585
1688
  height: t
1586
1689
  }, {
@@ -1591,7 +1694,7 @@ class Mt {
1591
1694
  adaptCanvasToContainer() {
1592
1695
  var {
1593
1696
  canvas: e
1594
- } = this.editor, t = e.editorContainer, a = t.clientWidth, r = t.clientHeight, n = Math.max(Math.min(a, D), k), i = Math.max(Math.min(r, C), x);
1697
+ } = this.editor, t = e.editorContainer, a = t.clientWidth, r = t.clientHeight, n = Math.max(Math.min(a, D), x), i = Math.max(Math.min(r, N), B);
1595
1698
  console.log("adaptCanvasToContainer newWidth", n), console.log("adaptCanvasToContainer newHeight", i), e.setDimensions({
1596
1699
  width: n,
1597
1700
  height: i
@@ -1752,19 +1855,19 @@ class Mt {
1752
1855
  width: l,
1753
1856
  height: d
1754
1857
  } = u;
1755
- if (l < k || d < x) {
1756
- var h = "Размер изображения меньше минимального размера канваса, поэтому оно будет растянуто до минимальных размеров: ".concat(k, "x").concat(x);
1858
+ if (l < x || d < B) {
1859
+ var h = "Размер изображения меньше минимального размера канваса, поэтому оно будет растянуто до минимальных размеров: ".concat(x, "x").concat(B);
1757
1860
  console.warn("scaleMontageAreaToImage. ".concat(h)), r.fire("editor:warning", {
1758
1861
  message: h
1759
1862
  });
1760
1863
  }
1761
- var g = Math.min(l, D), v = Math.min(d, C);
1864
+ var g = Math.min(l, D), v = Math.min(d, N);
1762
1865
  if (t) {
1763
1866
  var {
1764
- width: m,
1765
- height: j
1766
- } = n, f = l / m, b = d / j, y = Math.max(f, b);
1767
- g = m * y, v = j * y;
1867
+ width: f,
1868
+ height: y
1869
+ } = n, m = l / f, b = d / y, M = Math.max(m, b);
1870
+ g = f * M, v = y * M;
1768
1871
  }
1769
1872
  this.setResolutionWidth(g, {
1770
1873
  withoutSave: !0
@@ -2020,32 +2123,31 @@ class jt {
2020
2123
  fitAsOneObject: r
2021
2124
  } = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, {
2022
2125
  canvas: n,
2023
- montageArea: i,
2024
- imageManager: s,
2025
- historyManager: c
2026
- } = this.editor, u = e || n.getActiveObject();
2027
- if (u) {
2028
- if (["activeselection"].includes(u.type) && !r) {
2029
- var l = u.getObjects();
2030
- n.discardActiveObject(), l.forEach((g) => {
2031
- var v = s.calculateScaleFactor({
2032
- imageObject: g,
2126
+ imageManager: i,
2127
+ historyManager: s
2128
+ } = this.editor, c = e || n.getActiveObject();
2129
+ if (c) {
2130
+ if (["activeselection"].includes(c.type) && !r) {
2131
+ var u = c.getObjects();
2132
+ n.discardActiveObject(), u.forEach((h) => {
2133
+ var g = i.calculateScaleFactor({
2134
+ imageObject: h,
2033
2135
  scaleType: t
2034
2136
  });
2035
- g.scale(v), n.centerObject(g);
2137
+ h.scale(g), n.centerObject(h);
2036
2138
  });
2037
- var d = new Z(l, {
2139
+ var l = new z(u, {
2038
2140
  canvas: n
2039
2141
  });
2040
- n.setActiveObject(d);
2142
+ n.setActiveObject(l);
2041
2143
  } else {
2042
- var h = s.calculateScaleFactor({
2043
- imageObject: u,
2144
+ var d = i.calculateScaleFactor({
2145
+ imageObject: c,
2044
2146
  scaleType: t
2045
2147
  });
2046
- u.scale(h), n.centerObject(u);
2148
+ c.scale(d), n.centerObject(c);
2047
2149
  }
2048
- n.renderAll(), a || c.saveState(), n.fire("editor:image-fitted", {
2150
+ n.renderAll(), a || s.saveState(), n.fire("editor:image-fitted", {
2049
2151
  type: t
2050
2152
  });
2051
2153
  }
@@ -2217,7 +2319,7 @@ class yt {
2217
2319
  }
2218
2320
  }
2219
2321
  }
2220
- class Y {
2322
+ class H {
2221
2323
  /**
2222
2324
  * @param {object} options
2223
2325
  * @param {ImageEditor} options.editor - экземпляр редактора с доступом к canvas
@@ -2264,7 +2366,7 @@ class Y {
2264
2366
  } = this.editor;
2265
2367
  r.suspendHistory();
2266
2368
  var n = e || a.getActiveObject();
2267
- n && (n.type === "activeselection" ? Y._moveSelectionForward(a, n) : a.bringObjectForward(n), a.renderAll(), r.resumeHistory(), t || r.saveState(), a.fire("editor:object-bring-forward"));
2369
+ n && (n.type === "activeselection" ? H._moveSelectionForward(a, n) : a.bringObjectForward(n), a.renderAll(), r.resumeHistory(), t || r.saveState(), a.fire("editor:object-bring-forward"));
2268
2370
  }
2269
2371
  /**
2270
2372
  * Отправить объект на задний план по оси Z
@@ -2314,7 +2416,7 @@ class Y {
2314
2416
  } = this.editor;
2315
2417
  n.suspendHistory();
2316
2418
  var s = e || a.getActiveObject();
2317
- s && (s.type === "activeselection" ? Y._moveSelectionBackwards(a, s) : a.sendObjectBackwards(s), a.sendObjectToBack(r), a.sendObjectToBack(i), a.renderAll(), n.resumeHistory(), t || n.saveState(), a.fire("editor:object-send-backwards"));
2419
+ s && (s.type === "activeselection" ? H._moveSelectionBackwards(a, s) : a.sendObjectBackwards(s), a.sendObjectToBack(r), a.sendObjectToBack(i), a.renderAll(), n.resumeHistory(), t || n.saveState(), a.fire("editor:object-send-backwards"));
2318
2420
  }
2319
2421
  /**
2320
2422
  * Сдвигает выделенные объекты на один уровень вверх относительно ближайшего верхнего объекта
@@ -2364,7 +2466,7 @@ function je(o, e) {
2364
2466
  }
2365
2467
  return t;
2366
2468
  }
2367
- function V(o) {
2469
+ function F(o) {
2368
2470
  for (var e = 1; e < arguments.length; e++) {
2369
2471
  var t = arguments[e] != null ? arguments[e] : {};
2370
2472
  e % 2 ? je(Object(t), !0).forEach(function(a) {
@@ -2392,16 +2494,16 @@ function wt(o, e) {
2392
2494
  }
2393
2495
  return (e === "string" ? String : Number)(o);
2394
2496
  }
2395
- function F(o, e) {
2497
+ function G(o, e) {
2396
2498
  if (o == null) return {};
2397
- var t, a, r = Nt(o, e);
2499
+ var t, a, r = Ct(o, e);
2398
2500
  if (Object.getOwnPropertySymbols) {
2399
2501
  var n = Object.getOwnPropertySymbols(o);
2400
2502
  for (a = 0; a < n.length; a++) t = n[a], e.indexOf(t) === -1 && {}.propertyIsEnumerable.call(o, t) && (r[t] = o[t]);
2401
2503
  }
2402
2504
  return r;
2403
2505
  }
2404
- function Nt(o, e) {
2506
+ function Ct(o, e) {
2405
2507
  if (o == null) return {};
2406
2508
  var t = {};
2407
2509
  for (var a in o) if ({}.hasOwnProperty.call(o, a)) {
@@ -2444,12 +2546,12 @@ class Dt {
2444
2546
  width: n = 100,
2445
2547
  height: i = 100,
2446
2548
  fill: s = "blue"
2447
- } = e, c = F(e, pt), {
2549
+ } = e, c = G(e, pt), {
2448
2550
  withoutSelection: u,
2449
2551
  withoutAdding: l
2450
2552
  } = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {}, {
2451
2553
  canvas: d
2452
- } = this.editor, h = new xe(V({
2554
+ } = this.editor, h = new xe(F({
2453
2555
  id: t,
2454
2556
  left: a,
2455
2557
  top: r,
@@ -2480,12 +2582,12 @@ class Dt {
2480
2582
  top: r,
2481
2583
  radius: n = 50,
2482
2584
  fill: i = "green"
2483
- } = e, s = F(e, bt), {
2585
+ } = e, s = G(e, bt), {
2484
2586
  withoutSelection: c,
2485
2587
  withoutAdding: u
2486
2588
  } = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {}, {
2487
2589
  canvas: l
2488
- } = this.editor, d = new Be(V({
2590
+ } = this.editor, d = new Be(F({
2489
2591
  id: t,
2490
2592
  left: a,
2491
2593
  top: r,
@@ -2517,12 +2619,12 @@ class Dt {
2517
2619
  width: n = 100,
2518
2620
  height: i = 100,
2519
2621
  fill: s = "yellow"
2520
- } = e, c = F(e, It), {
2622
+ } = e, c = G(e, It), {
2521
2623
  withoutSelection: u,
2522
2624
  withoutAdding: l
2523
2625
  } = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {}, {
2524
2626
  canvas: d
2525
- } = this.editor, h = new Ze(V({
2627
+ } = this.editor, h = new Ze(F({
2526
2628
  id: t,
2527
2629
  left: a,
2528
2630
  top: r,
@@ -2556,7 +2658,7 @@ function pe(o) {
2556
2658
  });
2557
2659
  };
2558
2660
  }
2559
- class Ct {
2661
+ class Nt {
2560
2662
  /**
2561
2663
  * @param {object} options
2562
2664
  * @param {ImageEditor} options.editor - экземпляр редактора с доступом к canvas
@@ -2579,7 +2681,7 @@ class Ct {
2579
2681
  } = e.editor, a = t.getActiveObject();
2580
2682
  if (a)
2581
2683
  try {
2582
- var r = yield a.clone();
2684
+ var r = yield a.clone(["format"]);
2583
2685
  if (e.clipboard = r, typeof ClipboardItem == "undefined" || !navigator.clipboard) {
2584
2686
  console.warn(
2585
2687
  // eslint-disable-next-line max-len
@@ -2622,13 +2724,13 @@ class Ct {
2622
2724
  canvas: t
2623
2725
  } = e.editor;
2624
2726
  if (e.clipboard) {
2625
- var a = yield e.clipboard.clone();
2727
+ var a = yield e.clipboard.clone(["format"]);
2626
2728
  t.discardActiveObject(), a.set({
2627
2729
  id: "".concat(a.type, "-").concat(I()),
2628
2730
  left: a.left + 10,
2629
2731
  top: a.top + 10,
2630
2732
  evented: !0
2631
- }), a instanceof Z ? (a.canvas = t, a.forEachObject((r) => {
2733
+ }), a instanceof z ? (a.canvas = t, a.forEachObject((r) => {
2632
2734
  t.add(r);
2633
2735
  })) : t.add(a), t.setActiveObject(a), t.requestRenderAll(), t.fire("editor:object-pasted", {
2634
2736
  object: a
@@ -2773,7 +2875,7 @@ class Ot {
2773
2875
  if (!(!n || n.type !== "group")) {
2774
2876
  var i = n.removeAll();
2775
2877
  a.remove(n), i.forEach((c) => a.add(c));
2776
- var s = new Z(i, {
2878
+ var s = new z(i, {
2777
2879
  canvas: a
2778
2880
  });
2779
2881
  a.setActiveObject(s), a.renderAll(), r.resumeHistory(), t || r.saveState(), a.fire("editor:objects-ungrouped");
@@ -2802,7 +2904,7 @@ class Tt {
2802
2904
  objectLockManager: a
2803
2905
  } = this.editor;
2804
2906
  e.discardActiveObject();
2805
- var r = t.getObjects(), n = r.some((s) => s.locked), i = r.length > 1 ? new Z(t.getObjects(), {
2907
+ var r = t.getObjects(), n = r.some((s) => s.locked), i = r.length > 1 ? new z(t.getObjects(), {
2806
2908
  canvas: e
2807
2909
  }) : r[0];
2808
2910
  n && a.lockObject({
@@ -2872,7 +2974,7 @@ function kt(o) {
2872
2974
  });
2873
2975
  };
2874
2976
  }
2875
- class te {
2977
+ class ae {
2876
2978
  constructor(e) {
2877
2979
  var t = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
2878
2980
  this.options = t;
@@ -2906,15 +3008,15 @@ class te {
2906
3008
  editor: e
2907
3009
  }), e.canvasManager = new Mt({
2908
3010
  editor: e
2909
- }), e.imageManager = new L({
3011
+ }), e.imageManager = new C({
2910
3012
  editor: e
2911
- }), e.layerManager = new Y({
3013
+ }), e.layerManager = new H({
2912
3014
  editor: e
2913
3015
  }), e.shapeManager = new Dt({
2914
3016
  editor: e
2915
3017
  }), e.interactionBlocker = new yt({
2916
3018
  editor: e
2917
- }), e.clipboardManager = new Ct({
3019
+ }), e.clipboardManager = new Nt({
2918
3020
  editor: e
2919
3021
  }), e.objectLockManager = new Lt({
2920
3022
  editor: e
@@ -2924,21 +3026,19 @@ class te {
2924
3026
  editor: e
2925
3027
  }), e.deletionManager = new Et({
2926
3028
  editor: e
2927
- }), e._createMonageArea(), e._createClippingArea(), e.listeners = new B({
3029
+ }), e._createMonageArea(), e._createClippingArea(), e.listeners = new Z({
2928
3030
  editor: e,
2929
3031
  options: e.options
2930
3032
  }), e.canvasManager.setEditorContainerWidth(t), e.canvasManager.setEditorContainerHeight(a), e.canvasManager.setCanvasWrapperWidth(r), e.canvasManager.setCanvasWrapperHeight(n), e.canvasManager.setCanvasCSSWidth(i), e.canvasManager.setCanvasCSSHeight(s), c != null && c.source) {
2931
3033
  var {
2932
3034
  source: h,
2933
3035
  scale: g = "image-".concat(l),
2934
- withoutSave: v = !0,
2935
- contentType: m
3036
+ withoutSave: v = !0
2936
3037
  } = c;
2937
3038
  yield e.imageManager.importImage({
2938
3039
  source: h,
2939
3040
  scale: g,
2940
- withoutSave: v,
2941
- contentType: m
3041
+ withoutSave: v
2942
3042
  });
2943
3043
  } else
2944
3044
  e.canvasManager.setDefaultScale({
@@ -2960,7 +3060,7 @@ class te {
2960
3060
  this.montageArea = this.shapeManager.addRectangle({
2961
3061
  width: e,
2962
3062
  height: t,
2963
- fill: te._createMosaicPattern(),
3063
+ fill: ae._createMosaicPattern(),
2964
3064
  stroke: null,
2965
3065
  strokeWidth: 0,
2966
3066
  selectable: !1,
@@ -3055,6 +3155,10 @@ const xt = {
3055
3155
  maxHistoryLength: 50,
3056
3156
  // Дефолтный тип скейлинга для объектов (cotain/cover)
3057
3157
  scaleType: "contain",
3158
+ /**
3159
+ * Массив допустимых форматов изображений для загрузки в редактор.
3160
+ */
3161
+ acceptContentTypes: ["image/png", "image/jpeg", "image/jpg", "image/svg+xml", "image/webp"],
3058
3162
  // Показывать панель инструментов для выделенного объекта
3059
3163
  showToolbar: !0,
3060
3164
  // Настройки панели инструментов выделенного объекта.
@@ -3176,7 +3280,7 @@ function Yt(o) {
3176
3280
  var r = document.createElement("canvas");
3177
3281
  return r.id = "".concat(o, "-canvas"), a.appendChild(r), t.editorContainer = a, new Promise((n) => {
3178
3282
  t._onReadyCallback = n;
3179
- var i = new te(r.id, t);
3283
+ var i = new ae(r.id, t);
3180
3284
  window[o] = i;
3181
3285
  });
3182
3286
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@anu3ev/fabric-image-editor",
3
- "version": "0.1.11",
3
+ "version": "0.1.13",
4
4
  "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.",
5
5
  "module": "dist/main.js",
6
6
  "files": [