fabricjs-document-engine 1.0.1 → 1.1.0

package/dist/engine/create-document-engine.cjs

@@ -9,6 +9,8 @@ const require_object_ids = require("../fabric/object-ids.cjs");
 const require_walk_objects = require("../fabric/walk-objects.cjs");
 const require_preflight_export = require("../export/preflight-export.cjs");
 const require_render_export = require("../export/render-export.cjs");
+const require_embed_assets = require("../export/svg/embed-assets.cjs");
+const require_svg_import = require("../import/svg-import.cjs");
 require("../document/document-format.cjs");
 const require_ids = require("../document/ids.cjs");
 const require_create_document = require("../document/create-document.cjs");
@@ -143,8 +145,11 @@ function createDocumentEngine(options) {
 		if (serialized.background !== void 0) document.canvas.background = serialized.background;
 		return document;
 	}
-	function toLoadError(error, signal) {
-		if (signal.aborted) return new require_errors.DocumentEngineError("LOAD_ABORTED", "Loading stopped because a newer load started", { cause: error });
+	function toLoadError(error, controller) {
+		if (controller.signal.aborted) {
+			const reason = cancelledByCaller.has(controller) ? "Loading was cancelled" : destroyed ? "Loading stopped because the engine was destroyed" : "Loading stopped because a newer load started";
+			return new require_errors.DocumentEngineError("LOAD_ABORTED", reason, { cause: error });
+		}
 		if (require_errors.isDocumentEngineError(error)) return error;
 		const reason = error instanceof Error ? error.message : String(error);
 		return new require_errors.DocumentEngineError("LOAD_FAILED", `Fabric could not load the document: ${reason}`, { cause: error });
@@ -167,19 +172,49 @@ function createDocumentEngine(options) {
 		if (!storage || discardUnsavedChanges || !saving.state().isDirty) return;
 		throw new require_errors.DocumentEngineError("UNSAVED_CHANGES", "The current document has unsaved changes. Save first, or pass { discardUnsavedChanges: true } to replace it anyway.");
 	}
-	function startLoad() {
+	const cancelledByCaller = /* @__PURE__ */ new WeakSet();
+	const unlinkCallerSignal = /* @__PURE__ */ new WeakMap();
+	function startLoad(callerSignal) {
 		activeLoad?.abort();
 		const controller = new AbortController();
 		activeLoad = controller;
+		if (callerSignal) {
+			const cancel = () => {
+				cancelledByCaller.add(controller);
+				controller.abort();
+			};
+			if (callerSignal.aborted) cancel();
+			else {
+				callerSignal.addEventListener("abort", cancel, { once: true });
+				unlinkCallerSignal.set(controller, () => callerSignal.removeEventListener("abort", cancel));
+			}
+		}
 		return controller;
 	}
+	function finishLoad(controller) {
+		unlinkCallerSignal.get(controller)?.();
+		unlinkCallerSignal.delete(controller);
+	}
 	async function loadMigratedDocument(input, loadOptions, importDetails, startedLoad) {
 		ensureUsable();
 		protectUnsavedChanges(loadOptions.discardUnsavedChanges);
-		const controller = startedLoad ?? startLoad();
+		const controller = startedLoad ?? startLoad(loadOptions.signal);
 		const documentId = describeDocumentId(input);
+		const report = (stage, done, total) => {
+			if (controller.signal.aborted) return;
+			const progress = {
+				documentId,
+				stage,
+				done,
+				total
+			};
+			loadOptions.onProgress?.(progress);
+			events.emit("load:progress", progress);
+		};
 		events.emit("load:start", { documentId });
 		try {
+			if (controller.signal.aborted) throw new Error("aborted");
+			report("prepare", 0, 1);
 			await recovery?.markLoadStarted(documentId);
 			if (controller.signal.aborted) throw new Error("aborted");
 			const { document: migrated, migratedFrom } = require_migrate_document.migrateDocument(require_content_limits.secureDocument(input, options.limits), {
@@ -188,13 +223,17 @@ function createDocumentEngine(options) {
 				...importDetails
 			});
 			const checked = checkDocument(migrated);
-			const { document, warnings } = await require_asset_pipeline.prepareAssetsForLoad(checked, assetOptions, controller.signal, options.limits?.isAllowedUrl);
+			report("prepare", 1, 1);
+			const { document, warnings } = await require_asset_pipeline.prepareAssetsForLoad(checked, assetOptions, controller.signal, options.limits?.isAllowedUrl, (done, total) => report("images", done, total));
 			if (controller.signal.aborted) throw new Error("aborted");
 			await history.withoutRecording(() => require_fabric_adapter.loadIntoCanvas(canvas, {
 				version: document.fabricVersion,
 				background: document.canvas.background,
 				objects: document.objects
-			}, controller.signal));
+			}, {
+				signal: controller.signal,
+				onObjects: (done, total) => report("objects", done, total)
+			}));
 			if (controller.signal.aborted) throw new Error("aborted");
 			if (loadOptions.restoreCanvasSize ?? true) canvas.setDimensions({
 				width: document.canvas.width,
@@ -211,6 +250,7 @@ function createDocumentEngine(options) {
 			recovery?.cancel();
 			saving.startSession(document.revision ?? 0);
 			canvas.requestRenderAll();
+			report("done", 1, 1);
 			if (warnings.length > 0) events.emit("assets:warning", { warnings });
 			events.emit("document:change", { documentId: document.id });
 			events.emit("load:success", {
@@ -220,10 +260,11 @@ function createDocumentEngine(options) {
 			});
 			return document;
 		} catch (error) {
-			const engineError = toLoadError(error, controller.signal);
+			const engineError = toLoadError(error, controller);
 			events.emit("load:error", { error: engineError });
 			throw engineError;
 		} finally {
+			finishLoad(controller);
 			if (activeLoad === controller) {
 				activeLoad = null;
 				await recovery?.markLoadFinished();
@@ -244,6 +285,16 @@ function createDocumentEngine(options) {
 			metadata
 		});
 	}
+	async function importSvg(svg, importOptions = {}) {
+		ensureUsable();
+		const result = await require_svg_import.readSvg(svg, importOptions, options.limits);
+		ensureUsable();
+		if (result.objects.length > 0) {
+			history.transaction("Import SVG", () => canvas.add(...result.objects));
+			canvas.requestRenderAll();
+		}
+		return result;
+	}
 	let savesSinceAutomaticVersion = 0;
 	let lastVersionTime = 0;
 	function nextVersionTimestamp() {
@@ -322,15 +373,17 @@ function createDocumentEngine(options) {
 		ensureUsable();
 		const source = requireStorage();
 		protectUnsavedChanges(loadOptions?.discardUnsavedChanges);
-		const controller = startLoad();
+		const controller = startLoad(loadOptions?.signal);
 		let stored;
 		try {
+			if (controller.signal.aborted) throw new Error("aborted");
 			stored = await source.loadDocument(documentId);
 			if (controller.signal.aborted) throw new Error("aborted");
 		} catch (error) {
+			finishLoad(controller);
 			if (activeLoad === controller) activeLoad = null;
 			if (controller.signal.aborted) {
-				const aborted = toLoadError(error, controller.signal);
+				const aborted = toLoadError(error, controller);
 				events.emit("load:error", { error: aborted });
 				throw aborted;
 			}
@@ -400,8 +453,8 @@ function createDocumentEngine(options) {
 	}
 	async function checkBeforeExport(exportOptions) {
 		ensureUsable();
-		const { format } = require_export_options.normalizeExportOptions(exportOptions);
-		return require_preflight_export.preflightExport(canvas, format, format === "json" ? [] : fontsOnCanvas(), assetOptions);
+		const { format, svg } = require_export_options.normalizeExportOptions(exportOptions);
+		return require_preflight_export.preflightExport(canvas, format, format === "json" ? [] : fontsOnCanvas(), assetOptions, svg);
 	}
 	function describeProblems(check) {
 		return check.problems.map((problem) => problem.message).join("; ");
@@ -430,24 +483,41 @@ function createDocumentEngine(options) {
 		if (!check.ok) throw new require_errors.DocumentEngineError("EXPORT_BLOCKED", `The export cannot run: ${describeProblems(check)}`, { problems: check.problems });
 		const format = settings.format;
 		try {
+			const warnings = [...check.warnings];
 			const rendered = require_render_export.withExportView(canvas, settings.background, format, () => {
 				const area = require_export_area.resolveExportArea(canvas, settings.area, settings.padding);
 				return {
 					area,
-					content: format === "svg" ? Promise.resolve(new Blob([require_render_export.renderSvg(canvas, area, settings.scale)], { type: require_render_export.mimeTypes.svg })) : require_render_export.renderRaster(canvas, area, format, settings.scale, settings.quality)
+					content: format === "svg" ? Promise.resolve(require_render_export.renderSvg(canvas, area, settings.scale, settings.svg)) : require_render_export.renderRaster(canvas, area, format, settings.scale, settings.quality)
 				};
 			});
-			const blob = await rendered.content;
+			let blob;
+			if (format === "svg") {
+				const embedded = await require_embed_assets.embedSvgAssets(await rendered.content, canvas, settings.svg, settings.signal, options.limits?.isAllowedUrl ?? require_content_limits.isSafeImageUrl);
+				stopIfCancelled();
+				if (settings.svg.embedImages === "require" && embedded.problems.length > 0) {
+					const problems = embedded.warnings.filter((warning) => warning.code === "IMAGE_NOT_EMBEDDED").map((warning) => ({
+						code: "IMAGE_NOT_EMBEDDED",
+						message: warning.message,
+						url: warning.url,
+						objectIds: warning.objectIds
+					}));
+					throw new require_errors.DocumentEngineError("EXPORT_BLOCKED", `The export cannot run: ${embedded.problems.join("; ")}`, { problems });
+				}
+				warnings.push(...embedded.warnings);
+				blob = new Blob([embedded.svg], { type: require_render_export.mimeTypes.svg });
+			} else blob = await rendered.content;
 			return {
 				format,
 				mimeType: blob.type || require_render_export.mimeTypes[format],
 				blob,
 				width: Math.round(rendered.area.width * settings.scale),
 				height: Math.round(rendered.area.height * settings.scale),
-				warnings: check.warnings
+				warnings
 			};
 		} catch (error) {
 			if (require_errors.isDocumentEngineError(error)) throw error;
+			if (settings.signal?.aborted) throw new require_errors.DocumentEngineError("EXPORT_ABORTED", "The export was cancelled", { cause: error });
 			if (error?.name === "SecurityError") {
 				const problem = {
 					code: "CROSS_ORIGIN_IMAGE",
@@ -542,6 +612,7 @@ function createDocumentEngine(options) {
 		loadDocument,
 		load,
 		importFabricJson,
+		importSvg,
 		createVersion: (name) => storeVersion(name ?? `Version ${(/* @__PURE__ */ new Date()).toLocaleString()}`, "named"),
 		listVersions: async (documentId) => requireVersions().listVersions(documentId ?? documentInfo.id),
 		restoreVersion,

package/dist/engine/create-document-engine.d.cts

@@ -3,10 +3,11 @@ import { AssetManifest } from "../assets/asset-manifest.cjs";
 import { AssetOptions, AssetReport, AssetWarning } from "../assets/asset-pipeline.cjs";
 import { ExportFormat, ExportOptions } from "../export/export-options.cjs";
 import { ExportPreflight } from "../export/preflight-export.cjs";
+import { ContentLimits } from "../security/content-limits.cjs";
+import { SvgImportOptions, SvgImportResult } from "../import/svg-import.cjs";
 import { NewDocumentOptions } from "../document/create-document.cjs";
 import { CustomObjectDefinition } from "../fabric/object-registry.cjs";
 import { HistoryOptions, HistoryState } from "../history/create-history.cjs";
-import { ContentLimits } from "../security/content-limits.cjs";
 import { VersionOptions, VersionSummary } from "../versions/document-version.cjs";
 import { InterruptedLoad, RecoveryOptions, RecoveryRecord } from "../recovery/recovery-controller.cjs";
 import { AutosaveOptions } from "../save/autosave-scheduler.cjs";
@@ -33,6 +34,22 @@ export interface DocumentEngineOptions {
 export interface LoadOptions {
   restoreCanvasSize?: boolean;
   discardUnsavedChanges?: boolean;
+  /** Cancels the load. The canvas keeps its current content and the load rejects with `LOAD_ABORTED`. */
+  signal?: AbortSignal;
+  /** Called as the load moves through its stages. The `load:progress` event carries the same values. */
+  onProgress?: (progress: LoadProgress) => void;
+}
+/**
+ * Where a load is. `prepare` covers validation and migration, `images` counts
+ * images checked, `objects` counts top-level objects created, and `done` comes
+ * once the canvas shows the document.
+ */
+export type LoadStage = "prepare" | "images" | "objects" | "done";
+export interface LoadProgress {
+  documentId: string | undefined;
+  stage: LoadStage;
+  done: number;
+  total: number;
 }
 export interface NewDocumentRequest extends NewDocumentOptions {
   discardUnsavedChanges?: boolean;
@@ -54,6 +71,7 @@ export interface DocumentEngineEvents {
   "load:start": {
     documentId: string | undefined;
   };
+  "load:progress": LoadProgress;
   "document:change": {
     documentId: string;
   };
@@ -120,6 +138,7 @@ export interface DocumentEngine {
   loadDocument(document: unknown, options?: LoadOptions): Promise<FabricDocument>;
   load(documentId: string, options?: LoadOptions): Promise<FabricDocument>;
   importFabricJson(json: string | Record<string, unknown>, options?: ImportOptions): Promise<FabricDocument>;
+  importSvg(svg: string, options?: SvgImportOptions): Promise<SvgImportResult>;
   createVersion(name?: string): Promise<VersionSummary>;
   listVersions(documentId?: string): Promise<VersionSummary[]>;
   restoreVersion(versionId: string): Promise<FabricDocument>;

package/dist/engine/create-document-engine.d.ts

@@ -3,10 +3,11 @@ import { AssetManifest } from "../assets/asset-manifest.js";
 import { AssetOptions, AssetReport, AssetWarning } from "../assets/asset-pipeline.js";
 import { ExportFormat, ExportOptions } from "../export/export-options.js";
 import { ExportPreflight } from "../export/preflight-export.js";
+import { ContentLimits } from "../security/content-limits.js";
+import { SvgImportOptions, SvgImportResult } from "../import/svg-import.js";
 import { NewDocumentOptions } from "../document/create-document.js";
 import { CustomObjectDefinition } from "../fabric/object-registry.js";
 import { HistoryOptions, HistoryState } from "../history/create-history.js";
-import { ContentLimits } from "../security/content-limits.js";
 import { VersionOptions, VersionSummary } from "../versions/document-version.js";
 import { InterruptedLoad, RecoveryOptions, RecoveryRecord } from "../recovery/recovery-controller.js";
 import { AutosaveOptions } from "../save/autosave-scheduler.js";
@@ -33,6 +34,22 @@ export interface DocumentEngineOptions {
 export interface LoadOptions {
   restoreCanvasSize?: boolean;
   discardUnsavedChanges?: boolean;
+  /** Cancels the load. The canvas keeps its current content and the load rejects with `LOAD_ABORTED`. */
+  signal?: AbortSignal;
+  /** Called as the load moves through its stages. The `load:progress` event carries the same values. */
+  onProgress?: (progress: LoadProgress) => void;
+}
+/**
+ * Where a load is. `prepare` covers validation and migration, `images` counts
+ * images checked, `objects` counts top-level objects created, and `done` comes
+ * once the canvas shows the document.
+ */
+export type LoadStage = "prepare" | "images" | "objects" | "done";
+export interface LoadProgress {
+  documentId: string | undefined;
+  stage: LoadStage;
+  done: number;
+  total: number;
 }
 export interface NewDocumentRequest extends NewDocumentOptions {
   discardUnsavedChanges?: boolean;
@@ -54,6 +71,7 @@ export interface DocumentEngineEvents {
   "load:start": {
     documentId: string | undefined;
   };
+  "load:progress": LoadProgress;
   "document:change": {
     documentId: string;
   };
@@ -120,6 +138,7 @@ export interface DocumentEngine {
   loadDocument(document: unknown, options?: LoadOptions): Promise<FabricDocument>;
   load(documentId: string, options?: LoadOptions): Promise<FabricDocument>;
   importFabricJson(json: string | Record<string, unknown>, options?: ImportOptions): Promise<FabricDocument>;
+  importSvg(svg: string, options?: SvgImportOptions): Promise<SvgImportResult>;
   createVersion(name?: string): Promise<VersionSummary>;
   listVersions(documentId?: string): Promise<VersionSummary[]>;
   restoreVersion(versionId: string): Promise<FabricDocument>;

package/dist/engine/create-document-engine.js

@@ -1,6 +1,6 @@
 import { buildAssetManifest } from "../assets/asset-manifest.js";
 import { DocumentEngineError, isDocumentEngineError } from "./errors.js";
-import { secureDocument } from "../security/content-limits.js";
+import { isSafeImageUrl, secureDocument } from "../security/content-limits.js";
 import { isSameUrl } from "../assets/image-check.js";
 import { inspectAssets, prepareAssetsForLoad, prepareAssetsForSave } from "../assets/asset-pipeline.js";
 import { resolveExportArea } from "../export/export-area.js";
@@ -9,6 +9,8 @@ import { readObjectId, writeObjectId } from "../fabric/object-ids.js";
 import { collectSerializedTypes, walkObjects } from "../fabric/walk-objects.js";
 import { preflightExport } from "../export/preflight-export.js";
 import { mimeTypes, renderRaster, renderSvg, withExportView } from "../export/render-export.js";
+import { embedSvgAssets } from "../export/svg/embed-assets.js";
+import { readSvg } from "../import/svg-import.js";
 import "../document/document-format.js";
 import { createId } from "../document/ids.js";
 import { createDocumentInfo } from "../document/create-document.js";
@@ -143,8 +145,11 @@ function createDocumentEngine(options) {
 		if (serialized.background !== void 0) document.canvas.background = serialized.background;
 		return document;
 	}
-	function toLoadError(error, signal) {
-		if (signal.aborted) return new DocumentEngineError("LOAD_ABORTED", "Loading stopped because a newer load started", { cause: error });
+	function toLoadError(error, controller) {
+		if (controller.signal.aborted) {
+			const reason = cancelledByCaller.has(controller) ? "Loading was cancelled" : destroyed ? "Loading stopped because the engine was destroyed" : "Loading stopped because a newer load started";
+			return new DocumentEngineError("LOAD_ABORTED", reason, { cause: error });
+		}
 		if (isDocumentEngineError(error)) return error;
 		const reason = error instanceof Error ? error.message : String(error);
 		return new DocumentEngineError("LOAD_FAILED", `Fabric could not load the document: ${reason}`, { cause: error });
@@ -167,19 +172,49 @@ function createDocumentEngine(options) {
 		if (!storage || discardUnsavedChanges || !saving.state().isDirty) return;
 		throw new DocumentEngineError("UNSAVED_CHANGES", "The current document has unsaved changes. Save first, or pass { discardUnsavedChanges: true } to replace it anyway.");
 	}
-	function startLoad() {
+	const cancelledByCaller = /* @__PURE__ */ new WeakSet();
+	const unlinkCallerSignal = /* @__PURE__ */ new WeakMap();
+	function startLoad(callerSignal) {
 		activeLoad?.abort();
 		const controller = new AbortController();
 		activeLoad = controller;
+		if (callerSignal) {
+			const cancel = () => {
+				cancelledByCaller.add(controller);
+				controller.abort();
+			};
+			if (callerSignal.aborted) cancel();
+			else {
+				callerSignal.addEventListener("abort", cancel, { once: true });
+				unlinkCallerSignal.set(controller, () => callerSignal.removeEventListener("abort", cancel));
+			}
+		}
 		return controller;
 	}
+	function finishLoad(controller) {
+		unlinkCallerSignal.get(controller)?.();
+		unlinkCallerSignal.delete(controller);
+	}
 	async function loadMigratedDocument(input, loadOptions, importDetails, startedLoad) {
 		ensureUsable();
 		protectUnsavedChanges(loadOptions.discardUnsavedChanges);
-		const controller = startedLoad ?? startLoad();
+		const controller = startedLoad ?? startLoad(loadOptions.signal);
 		const documentId = describeDocumentId(input);
+		const report = (stage, done, total) => {
+			if (controller.signal.aborted) return;
+			const progress = {
+				documentId,
+				stage,
+				done,
+				total
+			};
+			loadOptions.onProgress?.(progress);
+			events.emit("load:progress", progress);
+		};
 		events.emit("load:start", { documentId });
 		try {
+			if (controller.signal.aborted) throw new Error("aborted");
+			report("prepare", 0, 1);
 			await recovery?.markLoadStarted(documentId);
 			if (controller.signal.aborted) throw new Error("aborted");
 			const { document: migrated, migratedFrom } = migrateDocument(secureDocument(input, options.limits), {
@@ -188,13 +223,17 @@ function createDocumentEngine(options) {
 				...importDetails
 			});
 			const checked = checkDocument(migrated);
-			const { document, warnings } = await prepareAssetsForLoad(checked, assetOptions, controller.signal, options.limits?.isAllowedUrl);
+			report("prepare", 1, 1);
+			const { document, warnings } = await prepareAssetsForLoad(checked, assetOptions, controller.signal, options.limits?.isAllowedUrl, (done, total) => report("images", done, total));
 			if (controller.signal.aborted) throw new Error("aborted");
 			await history.withoutRecording(() => loadIntoCanvas(canvas, {
 				version: document.fabricVersion,
 				background: document.canvas.background,
 				objects: document.objects
-			}, controller.signal));
+			}, {
+				signal: controller.signal,
+				onObjects: (done, total) => report("objects", done, total)
+			}));
 			if (controller.signal.aborted) throw new Error("aborted");
 			if (loadOptions.restoreCanvasSize ?? true) canvas.setDimensions({
 				width: document.canvas.width,
@@ -211,6 +250,7 @@ function createDocumentEngine(options) {
 			recovery?.cancel();
 			saving.startSession(document.revision ?? 0);
 			canvas.requestRenderAll();
+			report("done", 1, 1);
 			if (warnings.length > 0) events.emit("assets:warning", { warnings });
 			events.emit("document:change", { documentId: document.id });
 			events.emit("load:success", {
@@ -220,10 +260,11 @@ function createDocumentEngine(options) {
 			});
 			return document;
 		} catch (error) {
-			const engineError = toLoadError(error, controller.signal);
+			const engineError = toLoadError(error, controller);
 			events.emit("load:error", { error: engineError });
 			throw engineError;
 		} finally {
+			finishLoad(controller);
 			if (activeLoad === controller) {
 				activeLoad = null;
 				await recovery?.markLoadFinished();
@@ -244,6 +285,16 @@ function createDocumentEngine(options) {
 			metadata
 		});
 	}
+	async function importSvg(svg, importOptions = {}) {
+		ensureUsable();
+		const result = await readSvg(svg, importOptions, options.limits);
+		ensureUsable();
+		if (result.objects.length > 0) {
+			history.transaction("Import SVG", () => canvas.add(...result.objects));
+			canvas.requestRenderAll();
+		}
+		return result;
+	}
 	let savesSinceAutomaticVersion = 0;
 	let lastVersionTime = 0;
 	function nextVersionTimestamp() {
@@ -322,15 +373,17 @@ function createDocumentEngine(options) {
 		ensureUsable();
 		const source = requireStorage();
 		protectUnsavedChanges(loadOptions?.discardUnsavedChanges);
-		const controller = startLoad();
+		const controller = startLoad(loadOptions?.signal);
 		let stored;
 		try {
+			if (controller.signal.aborted) throw new Error("aborted");
 			stored = await source.loadDocument(documentId);
 			if (controller.signal.aborted) throw new Error("aborted");
 		} catch (error) {
+			finishLoad(controller);
 			if (activeLoad === controller) activeLoad = null;
 			if (controller.signal.aborted) {
-				const aborted = toLoadError(error, controller.signal);
+				const aborted = toLoadError(error, controller);
 				events.emit("load:error", { error: aborted });
 				throw aborted;
 			}
@@ -400,8 +453,8 @@ function createDocumentEngine(options) {
 	}
 	async function checkBeforeExport(exportOptions) {
 		ensureUsable();
-		const { format } = normalizeExportOptions(exportOptions);
-		return preflightExport(canvas, format, format === "json" ? [] : fontsOnCanvas(), assetOptions);
+		const { format, svg } = normalizeExportOptions(exportOptions);
+		return preflightExport(canvas, format, format === "json" ? [] : fontsOnCanvas(), assetOptions, svg);
 	}
 	function describeProblems(check) {
 		return check.problems.map((problem) => problem.message).join("; ");
@@ -430,24 +483,41 @@ function createDocumentEngine(options) {
 		if (!check.ok) throw new DocumentEngineError("EXPORT_BLOCKED", `The export cannot run: ${describeProblems(check)}`, { problems: check.problems });
 		const format = settings.format;
 		try {
+			const warnings = [...check.warnings];
 			const rendered = withExportView(canvas, settings.background, format, () => {
 				const area = resolveExportArea(canvas, settings.area, settings.padding);
 				return {
 					area,
-					content: format === "svg" ? Promise.resolve(new Blob([renderSvg(canvas, area, settings.scale)], { type: mimeTypes.svg })) : renderRaster(canvas, area, format, settings.scale, settings.quality)
+					content: format === "svg" ? Promise.resolve(renderSvg(canvas, area, settings.scale, settings.svg)) : renderRaster(canvas, area, format, settings.scale, settings.quality)
 				};
 			});
-			const blob = await rendered.content;
+			let blob;
+			if (format === "svg") {
+				const embedded = await embedSvgAssets(await rendered.content, canvas, settings.svg, settings.signal, options.limits?.isAllowedUrl ?? isSafeImageUrl);
+				stopIfCancelled();
+				if (settings.svg.embedImages === "require" && embedded.problems.length > 0) {
+					const problems = embedded.warnings.filter((warning) => warning.code === "IMAGE_NOT_EMBEDDED").map((warning) => ({
+						code: "IMAGE_NOT_EMBEDDED",
+						message: warning.message,
+						url: warning.url,
+						objectIds: warning.objectIds
+					}));
+					throw new DocumentEngineError("EXPORT_BLOCKED", `The export cannot run: ${embedded.problems.join("; ")}`, { problems });
+				}
+				warnings.push(...embedded.warnings);
+				blob = new Blob([embedded.svg], { type: mimeTypes.svg });
+			} else blob = await rendered.content;
 			return {
 				format,
 				mimeType: blob.type || mimeTypes[format],
 				blob,
 				width: Math.round(rendered.area.width * settings.scale),
 				height: Math.round(rendered.area.height * settings.scale),
-				warnings: check.warnings
+				warnings
 			};
 		} catch (error) {
 			if (isDocumentEngineError(error)) throw error;
+			if (settings.signal?.aborted) throw new DocumentEngineError("EXPORT_ABORTED", "The export was cancelled", { cause: error });
 			if (error?.name === "SecurityError") {
 				const problem = {
 					code: "CROSS_ORIGIN_IMAGE",
@@ -542,6 +612,7 @@ function createDocumentEngine(options) {
 		loadDocument,
 		load,
 		importFabricJson,
+		importSvg,
 		createVersion: (name) => storeVersion(name ?? `Version ${(/* @__PURE__ */ new Date()).toLocaleString()}`, "named"),
 		listVersions: async (documentId) => requireVersions().listVersions(documentId ?? documentInfo.id),
 		restoreVersion,

package/dist/engine/errors.d.cts

@@ -1,7 +1,7 @@
 import { FontAsset, ImageAsset } from "../assets/asset-manifest.cjs";
 import { ExportProblem } from "../export/preflight-export.cjs";
 //#region src/engine/errors.d.ts
-export type DocumentErrorCode = "INVALID_DOCUMENT" | "UNSAFE_DOCUMENT" | "UNSUPPORTED_SCHEMA" | "UNKNOWN_OBJECT_TYPE" | "INVALID_CUSTOM_OBJECT" | "LOAD_ABORTED" | "LOAD_FAILED" | "MISSING_ASSETS" | "MISSING_FONTS" | "ASSET_UPLOAD_FAILED" | "STORAGE_MISSING" | "UNSAVED_CHANGES" | "SAVE_FAILED" | "SAVE_CONFLICT" | "SAVE_CANCELLED" | "DOCUMENT_NOT_FOUND" | "HISTORY_FAILED" | "RECOVERY_MISSING" | "RECOVERY_NOT_FOUND" | "RECOVERY_FAILED" | "MIGRATION_FAILED" | "VERSIONS_UNSUPPORTED" | "VERSION_NOT_FOUND" | "VERSION_FAILED" | "INVALID_EXPORT_OPTIONS" | "EXPORT_BLOCKED" | "EXPORT_FAILED" | "EXPORT_ABORTED" | "ENGINE_DESTROYED";
+export type DocumentErrorCode = "INVALID_DOCUMENT" | "UNSAFE_DOCUMENT" | "UNSUPPORTED_SCHEMA" | "UNKNOWN_OBJECT_TYPE" | "INVALID_CUSTOM_OBJECT" | "LOAD_ABORTED" | "LOAD_FAILED" | "MISSING_ASSETS" | "MISSING_FONTS" | "ASSET_UPLOAD_FAILED" | "STORAGE_MISSING" | "UNSAVED_CHANGES" | "SAVE_FAILED" | "SAVE_CONFLICT" | "SAVE_CANCELLED" | "DOCUMENT_NOT_FOUND" | "HISTORY_FAILED" | "RECOVERY_MISSING" | "RECOVERY_NOT_FOUND" | "RECOVERY_FAILED" | "MIGRATION_FAILED" | "VERSIONS_UNSUPPORTED" | "VERSION_NOT_FOUND" | "VERSION_FAILED" | "INVALID_EXPORT_OPTIONS" | "EXPORT_BLOCKED" | "EXPORT_FAILED" | "EXPORT_ABORTED" | "SVG_IMPORT_FAILED" | "PDF_UNAVAILABLE" | "PDF_FAILED" | "ENGINE_DESTROYED";
 export interface DocumentIssue {
   code: DocumentErrorCode;
   path: string;

package/dist/engine/errors.d.ts

@@ -1,7 +1,7 @@
 import { FontAsset, ImageAsset } from "../assets/asset-manifest.js";
 import { ExportProblem } from "../export/preflight-export.js";
 //#region src/engine/errors.d.ts
-export type DocumentErrorCode = "INVALID_DOCUMENT" | "UNSAFE_DOCUMENT" | "UNSUPPORTED_SCHEMA" | "UNKNOWN_OBJECT_TYPE" | "INVALID_CUSTOM_OBJECT" | "LOAD_ABORTED" | "LOAD_FAILED" | "MISSING_ASSETS" | "MISSING_FONTS" | "ASSET_UPLOAD_FAILED" | "STORAGE_MISSING" | "UNSAVED_CHANGES" | "SAVE_FAILED" | "SAVE_CONFLICT" | "SAVE_CANCELLED" | "DOCUMENT_NOT_FOUND" | "HISTORY_FAILED" | "RECOVERY_MISSING" | "RECOVERY_NOT_FOUND" | "RECOVERY_FAILED" | "MIGRATION_FAILED" | "VERSIONS_UNSUPPORTED" | "VERSION_NOT_FOUND" | "VERSION_FAILED" | "INVALID_EXPORT_OPTIONS" | "EXPORT_BLOCKED" | "EXPORT_FAILED" | "EXPORT_ABORTED" | "ENGINE_DESTROYED";
+export type DocumentErrorCode = "INVALID_DOCUMENT" | "UNSAFE_DOCUMENT" | "UNSUPPORTED_SCHEMA" | "UNKNOWN_OBJECT_TYPE" | "INVALID_CUSTOM_OBJECT" | "LOAD_ABORTED" | "LOAD_FAILED" | "MISSING_ASSETS" | "MISSING_FONTS" | "ASSET_UPLOAD_FAILED" | "STORAGE_MISSING" | "UNSAVED_CHANGES" | "SAVE_FAILED" | "SAVE_CONFLICT" | "SAVE_CANCELLED" | "DOCUMENT_NOT_FOUND" | "HISTORY_FAILED" | "RECOVERY_MISSING" | "RECOVERY_NOT_FOUND" | "RECOVERY_FAILED" | "MIGRATION_FAILED" | "VERSIONS_UNSUPPORTED" | "VERSION_NOT_FOUND" | "VERSION_FAILED" | "INVALID_EXPORT_OPTIONS" | "EXPORT_BLOCKED" | "EXPORT_FAILED" | "EXPORT_ABORTED" | "SVG_IMPORT_FAILED" | "PDF_UNAVAILABLE" | "PDF_FAILED" | "ENGINE_DESTROYED";
 export interface DocumentIssue {
   code: DocumentErrorCode;
   path: string;