@anu3ev/fabric-image-editor 0.9.24 → 0.9.26

package/dist/main.js

@@ -3404,72 +3404,24 @@ var Ut = class {
 		}
 	}
 	async exportObjectAsImageFile(t = {}) {
-		let { object: n, fileName: r, contentType: i, exportAsBase64: o = !1, exportAsBlob: s = !1 } = t, { canvas: c, workerManager: l } = this.editor, u = n || c.getActiveObject(), d = i ?? "image/png", f = this.getFormatFromContentType(d) || "png", p = r ?? `image.${f}`;
-		if (!u) return this.editor.errorManager.emitError({
+		let { object: n, exportAsBase64: r = !1, exportAsBlob: i = !1 } = t, { canvas: a } = this.editor, o = n || a.getActiveObject(), s = this._createObjectExportRequest({
+			object: o ?? void 0,
+			options: t
+		});
+		if (!e._hasExportObject({ request: s })) return this.editor.errorManager.emitError({
 			origin: "ImageManager",
 			method: "exportObjectAsImageFile",
 			code: "NO_OBJECT_SELECTED",
 			message: "Не выбран объект для экспорта",
 			data: {
-				contentType: d,
-				fileName: p,
-				exportAsBase64: o,
-				exportAsBlob: s
+				contentType: s.contentType,
+				fileName: s.fileName,
+				exportAsBase64: r,
+				exportAsBlob: i
 			}
 		}), null;
-		let { contentType: m, format: h = "" } = u, g = i ?? m ?? "image/png", _ = this.getFormatFromContentType(g) || h || "png", v = r ?? `image.${_}`;
 		try {
-			if (_ === "svg") {
-				let t = u.toSVG(), n = {
-					object: u,
-					image: e._exportSVGStringAsFile(t, {
-						exportAsBase64: o,
-						exportAsBlob: s,
-						fileName: v
-					}),
-					format: _,
-					contentType: "image/svg+xml",
-					fileName: v.replace(/\.[^/.]+$/, ".svg")
-				};
-				return c.fire("editor:object-exported", n), n;
-			}
-			if (o && u instanceof a) {
-				let e = await createImageBitmap(u.getElement()), t = {
-					object: u,
-					image: await l.post("toDataURL", {
-						contentType: g,
-						quality: 1,
-						bitmap: e
-					}, [e]),
-					format: _,
-					contentType: g,
-					fileName: v
-				};
-				return c.fire("editor:object-exported", t), t;
-			}
-			let t = u.toCanvasElement({ enableRetinaScaling: !1 }), n = await new Promise((e, n) => {
-				t.toBlob((t) => {
-					t ? e(t) : n(/* @__PURE__ */ Error("Failed to create Blob from canvas"));
-				});
-			});
-			if (s) {
-				let e = {
-					object: u,
-					image: n,
-					format: _,
-					contentType: g,
-					fileName: v
-				};
-				return c.fire("editor:object-exported", e), e;
-			}
-			let r = {
-				object: u,
-				image: new File([n], v, { type: g }),
-				format: _,
-				contentType: g,
-				fileName: v
-			};
-			return c.fire("editor:object-exported", r), r;
+			return s.format === "svg" ? this._exportSvgObject({ request: s }) : e._canExportImageElementAsBase64({ request: s }) ? await this._exportImageElementAsBase64({ request: s }) : await this._exportRenderedObject({ request: s });
 		} catch (e) {
 			return this.editor.errorManager.emitError({
 				origin: "ImageManager",
@@ -3477,14 +3429,120 @@ var Ut = class {
 				code: "IMAGE_EXPORT_FAILED",
 				message: `Ошибка экспорта объекта: ${e.message}`,
 				data: {
-					contentType: g,
-					fileName: v,
-					exportAsBase64: o,
-					exportAsBlob: s
+					contentType: s.contentType,
+					fileName: s.fileName,
+					exportAsBase64: r,
+					exportAsBlob: i
 				}
 			}), null;
 		}
 	}
+	_createObjectExportRequest({ object: e, options: t }) {
+		let { fileName: n, contentType: r, exportAsBase64: i = !1, exportAsBlob: a = !1 } = t, { contentType: o, format: s = "" } = e || {}, c = r ?? o ?? "image/png", l = this.getFormatFromContentType(c) || s || "png";
+		return {
+			object: e,
+			contentType: c,
+			format: l,
+			fileName: n ?? `image.${l}`,
+			exportAsBase64: i,
+			exportAsBlob: a
+		};
+	}
+	static _hasExportObject({ request: e }) {
+		return !!e.object;
+	}
+	static _canExportImageElementAsBase64({ request: t }) {
+		return !t.exportAsBase64 || !(t.object instanceof a) ? !1 : !e._hasVisibleImageCrop({ image: t.object });
+	}
+	static _hasVisibleImageCrop({ image: t }) {
+		let n = Number(t.cropX ?? 0), r = Number(t.cropY ?? 0), i = Number(t.width ?? 0), a = Number(t.height ?? 0), o = e._getImageElementSize({ image: t });
+		return !!(n || r || o.width && i && i < o.width || o.height && a && a < o.height);
+	}
+	static _getImageElementSize({ image: e }) {
+		let t = e.getElement();
+		return {
+			width: t.naturalWidth || t.videoWidth || t.width || 0,
+			height: t.naturalHeight || t.videoHeight || t.height || 0
+		};
+	}
+	_exportSvgObject({ request: t }) {
+		let { canvas: n } = this.editor, r = t.object.toSVG(), i = e._exportSVGStringAsFile(r, {
+			exportAsBase64: t.exportAsBase64,
+			exportAsBlob: t.exportAsBlob,
+			fileName: t.fileName
+		}), a = {
+			object: t.object,
+			image: i,
+			format: t.format,
+			contentType: "image/svg+xml",
+			fileName: t.fileName.replace(/\.[^/.]+$/, ".svg")
+		};
+		return n.fire("editor:object-exported", a), a;
+	}
+	async _exportImageElementAsBase64({ request: e }) {
+		let { canvas: t, workerManager: n } = this.editor, r = await createImageBitmap(e.object.getElement()), i = await n.post("toDataURL", {
+			contentType: e.contentType,
+			quality: 1,
+			bitmap: r
+		}, [r]), a = {
+			object: e.object,
+			image: i,
+			format: e.format,
+			contentType: e.contentType,
+			fileName: e.fileName
+		};
+		return t.fire("editor:object-exported", a), a;
+	}
+	async _exportRenderedObject({ request: e }) {
+		let { canvas: t } = this.editor, n = await this._createObjectBlob({ request: e });
+		if (e.exportAsBlob) {
+			let r = {
+				object: e.object,
+				image: n,
+				format: e.format,
+				contentType: e.contentType,
+				fileName: e.fileName
+			};
+			return t.fire("editor:object-exported", r), r;
+		}
+		if (e.exportAsBase64) {
+			let r = await this._convertBlobToDataUrl({
+				blob: n,
+				contentType: e.contentType
+			}), i = {
+				object: e.object,
+				image: r,
+				format: e.format,
+				contentType: e.contentType,
+				fileName: e.fileName
+			};
+			return t.fire("editor:object-exported", i), i;
+		}
+		let r = new File([n], e.fileName, { type: e.contentType }), i = {
+			object: e.object,
+			image: r,
+			format: e.format,
+			contentType: e.contentType,
+			fileName: e.fileName
+		};
+		return t.fire("editor:object-exported", i), i;
+	}
+	async _createObjectBlob({ request: e }) {
+		let t = e.object.toCanvasElement({ enableRetinaScaling: !1 });
+		return new Promise((n, r) => {
+			t.toBlob((e) => {
+				e ? n(e) : r(/* @__PURE__ */ Error("Failed to create Blob from canvas"));
+			}, e.contentType, 1);
+		});
+	}
+	async _convertBlobToDataUrl({ blob: e, contentType: t }) {
+		let { workerManager: n } = this.editor, r = await createImageBitmap(e);
+		return n.post("toDataURL", {
+			contentType: t,
+			quality: 1,
+			bitmap: r
+		}, [r]);
+	}
 	revokeBlobUrls() {
 		this._createdBlobUrls.forEach(URL.revokeObjectURL), this._createdBlobUrls = [];
 	}
@@ -13545,22 +13603,22 @@ var yo = class {
 		color: d,
 		lineWidth: 1
 	});
-}, ss = .01, cs = .1, ls = .5, us = 1e-6, ds = .02, fs = 1e-6, ps = 1;
-function ms({ target: e, transform: t, rawScaleX: n, rawScaleY: r, effectiveWidth: i, effectiveHeight: a, fallbackScale: o, isUniform: s, preservePlacement: c, snapGuards: l }) {
-	return As({
+}, ss = .1, cs = .5, ls = 1e-6, us = .02, ds = 1e-6, fs = 1;
+function ps({ target: e, transform: t, rawScaleX: n, rawScaleY: r, effectiveWidth: i, effectiveHeight: a, fallbackScale: o, isUniform: s, preservePlacement: c, snapGuards: l }) {
+	return js({
 		target: e,
 		snapGuards: l
 	}) ? {
 		scaleX: n,
 		scaleY: r
-	} : gs({
+	} : hs({
 		target: e,
 		effectiveWidth: i,
 		effectiveHeight: a,
 		transform: t,
 		preservePlacement: c,
 		snapGuards: l
-	}) || hs({
+	}) || ms({
 		target: e,
 		rawScaleX: n,
 		rawScaleY: r,
@@ -13568,7 +13626,7 @@ function ms({ target: e, transform: t, rawScaleX: n, rawScaleY: r, effectiveWidt
 		effectiveHeight: a,
 		preservePlacement: c,
 		snapGuards: l
-	}) || (xs({
+	}) || (bs({
 		target: e,
 		rawScaleX: n,
 		rawScaleY: r,
@@ -13582,18 +13640,18 @@ function ms({ target: e, transform: t, rawScaleX: n, rawScaleY: r, effectiveWidt
 			isUniform: s
 		}),
 		preservePlacement: c,
-		shouldPreferInsideCandidate: ks({
+		shouldPreferInsideCandidate: As({
 			target: e,
 			snapGuards: l
 		}),
 		snapGuards: l
 	}) ?? o);
 }
-function hs({ target: e, rawScaleX: t, rawScaleY: n, effectiveWidth: r, effectiveHeight: i, preservePlacement: a, snapGuards: o }) {
-	if (!js({
+function ms({ target: e, rawScaleX: t, rawScaleY: n, effectiveWidth: r, effectiveHeight: i, preservePlacement: a, snapGuards: o }) {
+	if (!Ms({
 		target: e,
 		snapGuards: o
-	}) || Ms({
+	}) || Ns({
 		target: e,
 		snapGuards: o
 	})) return null;
@@ -13601,13 +13659,13 @@ function hs({ target: e, rawScaleX: t, rawScaleY: n, effectiveWidth: r, effectiv
 		scaleX: t,
 		scaleY: n
 	};
-	return !_s({
+	return !gs({
 		target: e,
 		candidate: s,
 		preservePlacement: a,
-		maxDistance: ls,
+		maxDistance: cs,
 		snapGuards: o
-	}) || !ys({
+	}) || !vs({
 		target: e,
 		candidate: s,
 		effectiveWidth: r,
@@ -13615,8 +13673,8 @@ function hs({ target: e, rawScaleX: t, rawScaleY: n, effectiveWidth: r, effectiv
 		snapGuards: o
 	}) ? null : s;
 }
-function gs({ target: e, transform: t, effectiveWidth: n, effectiveHeight: r, preservePlacement: i, snapGuards: a }) {
-	if (!ks({
+function hs({ target: e, transform: t, effectiveWidth: n, effectiveHeight: r, preservePlacement: i, snapGuards: a }) {
+	if (!As({
 		target: e,
 		snapGuards: a
 	})) return null;
@@ -13625,12 +13683,12 @@ function gs({ target: e, transform: t, effectiveWidth: n, effectiveHeight: r, pr
 	let c = {
 		scaleX: o,
 		scaleY: s
-	}, l = _s({
+	}, l = gs({
 		target: e,
 		candidate: c,
 		preservePlacement: i,
 		snapGuards: a
-	}), u = vs({
+	}), u = _s({
 		target: e,
 		candidate: c,
 		effectiveWidth: n,
@@ -13639,7 +13697,7 @@ function gs({ target: e, transform: t, effectiveWidth: n, effectiveHeight: r, pr
 	});
 	return !l || !u ? null : c;
 }
-function _s({ target: e, candidate: t, preservePlacement: n, maxDistance: r = ps, snapGuards: i }) {
+function gs({ target: e, candidate: t, preservePlacement: n, maxDistance: r = fs, snapGuards: i }) {
 	let a = Ws({
 		target: e,
 		candidate: t,
@@ -13652,63 +13710,91 @@ function _s({ target: e, candidate: t, preservePlacement: n, maxDistance: r = ps
 	}) > r) return !1;
 	return !0;
 }
-function vs({ target: e, candidate: t, effectiveWidth: n, effectiveHeight: r, snapGuards: i }) {
-	for (let a of i) if (!Ts({
+function _s({ target: e, candidate: t, effectiveWidth: n, effectiveHeight: r, snapGuards: i }) {
+	for (let a of i) if (!Es({
 		target: e,
 		displaySize: a.type === "vertical" ? Math.abs(t.scaleX) * n : Math.abs(t.scaleY) * r,
 		snapGuard: a
 	})) return !1;
 	return !0;
 }
-function ys({ target: e, candidate: t, effectiveWidth: n, effectiveHeight: r, snapGuards: i }) {
-	for (let a of i) if (!bs({
+function vs({ target: e, candidate: t, effectiveWidth: n, effectiveHeight: r, snapGuards: i }) {
+	for (let a of i) if (!ys({
 		target: e,
 		displaySize: a.type === "vertical" ? Math.abs(t.scaleX) * n : Math.abs(t.scaleY) * r,
 		snapGuard: a
 	})) return !1;
 	return !0;
 }
-function bs({ target: e, displaySize: t, snapGuard: n }) {
-	let r = Ds({
+function ys({ target: e, displaySize: t, snapGuard: n }) {
+	let r = Os({
 		target: e,
 		snapGuard: n
 	});
 	if (r === null) return !1;
-	let i = Math.round(r + us);
+	let i = Math.round(r + ls);
 	return Math.round(t) <= i;
 }
-function xs({ target: e, rawScaleX: t, rawScaleY: n, effectiveWidth: r, effectiveHeight: i, candidates: a, preservePlacement: o, shouldPreferInsideCandidate: s, snapGuards: c }) {
-	let l = null, u = null, d = Infinity;
-	for (let t of a) {
-		let n = Us({
-			target: e,
-			candidate: t,
-			preservePlacement: o,
-			snapGuards: c
-		});
-		if (n.state === "on-guide") {
-			if (!s) return t;
-			l ||= t;
-		}
-		n.state === "inside" && (!s && !u && (u = t), s && n.distance < d && (u = t, d = n.distance));
-	}
-	return l && Ss({
+function bs({ target: e, rawScaleX: t, rawScaleY: n, effectiveWidth: r, effectiveHeight: i, candidates: a, preservePlacement: o, shouldPreferInsideCandidate: s, snapGuards: c }) {
+	if (!s) return xs({
+		target: e,
+		candidates: a,
+		preservePlacement: o,
+		snapGuards: c
+	});
+	let { insideCandidate: l, onGuideCandidate: u } = Ss({
+		target: e,
+		candidates: a,
+		preservePlacement: o,
+		snapGuards: c
+	});
+	return u && Cs({
 		target: e,
-		candidate: l,
+		candidate: u,
 		rawScaleX: t,
 		rawScaleY: n,
 		effectiveWidth: r,
 		effectiveHeight: i,
 		snapGuards: c
-	}) ? l : u || l || null;
+	}) ? u : l || u || null;
 }
-function Ss({ target: e, candidate: t, rawScaleX: n, rawScaleY: r, effectiveWidth: i, effectiveHeight: a, snapGuards: o }) {
+function xs({ target: e, candidates: t, preservePlacement: n, snapGuards: r }) {
+	let i = null;
+	for (let a of t) {
+		let t = Us({
+			target: e,
+			candidate: a,
+			preservePlacement: n,
+			snapGuards: r
+		});
+		if (t.state === "on-guide") return a;
+		t.state === "inside" && !i && (i = a);
+	}
+	return i;
+}
+function Ss({ target: e, candidates: t, preservePlacement: n, snapGuards: r }) {
+	let i = null, a = null, o = Infinity;
+	for (let s of t) {
+		let t = Us({
+			target: e,
+			candidate: s,
+			preservePlacement: n,
+			snapGuards: r
+		});
+		t.state === "on-guide" && !i && (i = s), t.state === "inside" && t.distance < o && (a = s, o = t.distance);
+	}
+	return {
+		insideCandidate: a,
+		onGuideCandidate: i
+	};
+}
+function Cs({ target: e, candidate: t, rawScaleX: n, rawScaleY: r, effectiveWidth: i, effectiveHeight: a, snapGuards: o }) {
 	for (let s of o) {
 		let o = s.type === "vertical" ? Math.abs(t.scaleX) * i : Math.abs(t.scaleY) * a, c = s.type === "vertical" ? Math.abs(n) * i : Math.abs(r) * a;
-		if (!Cs({ displaySize: o }) || !ws({
+		if (!ws({ displaySize: o }) || !Ts({
 			displaySize: o,
 			rawDisplaySize: c
-		}) || !Ts({
+		}) || !Es({
 			target: e,
 			displaySize: o,
 			snapGuard: s
@@ -13716,60 +13802,60 @@ function Ss({ target: e, candidate: t, rawScaleX: n, rawScaleY: r, effectiveWidt
 	}
 	return !0;
 }
-function Cs({ displaySize: e }) {
-	return Math.abs(e - Math.round(e)) <= us;
+function ws({ displaySize: e }) {
+	return Math.abs(e - Math.round(e)) <= ls;
 }
-function ws({ displaySize: e, rawDisplaySize: t }) {
-	return Math.abs(e - t) <= ds;
+function Ts({ displaySize: e, rawDisplaySize: t }) {
+	return Math.abs(e - t) <= us;
 }
-function Ts({ target: e, displaySize: t, snapGuard: n }) {
-	let r = Es({
+function Es({ target: e, displaySize: t, snapGuard: n }) {
+	let r = Ds({
 		target: e,
 		snapGuard: n
 	});
 	return r === null ? !1 : Math.round(t) <= r;
 }
-function Es({ target: e, snapGuard: t }) {
-	let n = Ds({
+function Ds({ target: e, snapGuard: t }) {
+	let n = Os({
 		target: e,
 		snapGuard: t
 	});
-	return n === null ? null : Math.round(n + us);
+	return n === null ? null : Math.round(n + ls);
 }
-function Ds({ target: e, snapGuard: t }) {
+function Os({ target: e, snapGuard: t }) {
 	let n = e, { cropSource: r } = n;
 	if (!r) return null;
 	let i = cn({ object: r });
 	if (!i) return null;
 	let a = t.type === "vertical" ? Math.abs(n.cropSourceScaleX ?? 1) : Math.abs(n.cropSourceScaleY ?? 1);
 	if (!Number.isFinite(a) || a <= 0) return null;
-	let o = Os({
+	let o = ks({
 		sourceBounds: i,
 		snapGuard: t
 	});
 	return !Number.isFinite(o) || o <= 0 ? null : o / a;
 }
-function Os({ sourceBounds: e, snapGuard: t }) {
+function ks({ sourceBounds: e, snapGuard: t }) {
 	let { edge: n, position: r } = t;
 	return n === "left" ? e.right - r : n === "right" ? r - e.left : n === "top" ? e.bottom - r : r - e.top;
 }
-function ks({ target: e, snapGuards: t }) {
-	return js({
+function As({ target: e, snapGuards: t }) {
+	return Ms({
 		target: e,
 		snapGuards: t
-	}) ? !Ms({
+	}) ? !Ns({
 		target: e,
 		snapGuards: t
 	}) : !1;
 }
-function As({ target: e, snapGuards: t }) {
-	if (js({
+function js({ target: e, snapGuards: t }) {
+	if (Ms({
 		target: e,
 		snapGuards: t
 	})) return !1;
 	let n = G({ object: e });
 	if (!n) return !1;
-	for (let e of t) if (!Is({ snapGuard: e }) || !Js({
+	for (let e of t) if (!Js({
 		bounds: n,
 		snapGuard: e
 	}) || !Ls({
@@ -13778,36 +13864,32 @@ function As({ target: e, snapGuards: t }) {
 	})) return !1;
 	return !0;
 }
-function js({ target: e, snapGuards: t }) {
+function Ms({ target: e, snapGuards: t }) {
 	if (typeof e.getObjectDisplaySize != "function") return !1;
-	let n = e, r = t.some((e) => e.type === "vertical" && !Fs({ scale: n.cropSourceScaleX })), i = t.some((e) => e.type === "horizontal" && !Fs({ scale: n.cropSourceScaleY }));
+	let n = e, r = t.some((e) => e.type === "vertical" && !Is({ scale: n.cropSourceScaleX })), i = t.some((e) => e.type === "horizontal" && !Is({ scale: n.cropSourceScaleY }));
 	return r || i;
 }
-function Ms({ target: e, snapGuards: t }) {
+function Ns({ target: e, snapGuards: t }) {
 	let { cropSource: n } = e;
 	if (!n) return !1;
 	let r = G({ object: n });
-	return r ? t.some((e) => Ns({
+	return r ? t.some((e) => Ps({
 		snapGuard: e,
 		sourceBounds: r
 	})) : !1;
 }
-function Ns({ snapGuard: e, sourceBounds: t }) {
+function Ps({ snapGuard: e, sourceBounds: t }) {
 	let { edge: n, position: r } = e, i = t.bottom;
-	return n === "left" && (i = t.left), n === "right" && (i = t.right), n === "top" && (i = t.top), Ps({
+	return n === "left" && (i = t.left), n === "right" && (i = t.right), n === "top" && (i = t.top), Fs({
 		position: r,
 		boundary: i
 	});
 }
-function Ps({ position: e, boundary: t }) {
-	return Math.abs(e - t) <= cs;
-}
-function Fs({ scale: e }) {
-	return Math.abs(Math.abs(e ?? 1) - 1) <= fs;
+function Fs({ position: e, boundary: t }) {
+	return Math.abs(e - t) <= ss;
 }
-function Is({ snapGuard: e }) {
-	let t = Math.round(e.position);
-	return Math.abs(e.position - t) <= ss;
+function Is({ scale: e }) {
+	return Math.abs(Math.abs(e ?? 1) - 1) <= ds;
 }
 function Ls({ bounds: e, snapGuard: t }) {
 	let n = t.type === "vertical" ? e.right - e.left : e.bottom - e.top;
@@ -13927,11 +14009,11 @@ function Ks({ bounds: e, snapGuard: t }) {
 }
 function qs({ bounds: e, snapGuard: t }) {
 	let { edge: n, position: r } = t;
-	return n === "left" ? e.left >= r - cs : n === "right" ? e.right <= r + cs : n === "top" ? e.top >= r - cs : e.bottom <= r + cs;
+	return n === "left" ? e.left >= r - ss : n === "right" ? e.right <= r + ss : n === "top" ? e.top >= r - ss : e.bottom <= r + ss;
 }
 function Js({ bounds: e, snapGuard: t }) {
 	let { edge: n, position: r } = t;
-	return n === "left" ? Math.abs(e.left - r) <= cs : n === "right" ? Math.abs(e.right - r) <= cs : n === "top" ? Math.abs(e.top - r) <= cs : Math.abs(e.bottom - r) <= cs;
+	return n === "left" ? Math.abs(e.left - r) <= ss : n === "right" ? Math.abs(e.right - r) <= ss : n === "top" ? Math.abs(e.top - r) <= ss : Math.abs(e.bottom - r) <= ss;
 }
 //#endregion
 //#region src/editor/snapping-manager/pixel-grid.ts
@@ -14053,7 +14135,7 @@ function oc({ target: e, transform: t, rawScaleX: n, rawScaleY: r, effectiveWidt
 		effectiveWidth: i,
 		effectiveHeight: a
 	});
-	return s.length === 0 ? c : ms({
+	return s.length === 0 ? c : ps({
 		target: e,
 		transform: t,
 		rawScaleX: n,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anu3ev/fabric-image-editor",
-  "version": "0.9.24",
+  "version": "0.9.26",
   "description": "TypeScript image editor library 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": [