@editframe/elements 0.37.3-beta → 0.38.1

package/dist/preview/renderers.js.map

@@ -1 +1 @@
-{"version":3,"file":"renderers.js","names":[],"sources":["../../src/preview/renderers.ts"],"sourcesContent":["/**\n * Renderer strategy pattern for HTML-to-image rendering.\n * Provides a unified interface for native (drawElementImage) and foreignObject paths.\n */\n\nimport { isNativeCanvasApiAvailable, getRenderMode, type RenderMode } from \"./previewSettings.js\";\n\n/**\n * Options for rendering HTML to an image or canvas.\n */\nexport interface RenderOptions {\n  /** Skip device pixel ratio scaling (render at logical pixels) */\n  skipDprScaling?: boolean;\n  /** Scale factor for encoding internal canvases (foreignObject only) */\n  canvasScale?: number;\n  /** Whether to reuse an existing canvas (native only) */\n  reuseCanvas?: HTMLCanvasElement;\n}\n\n/**\n * Result of a render operation.\n * Native path returns a canvas, foreignObject path returns an image.\n */\nexport type RenderResult = HTMLCanvasElement | HTMLImageElement;\n\n/**\n * Renderer interface for HTML-to-image conversion.\n */\nexport interface Renderer {\n  /** The render mode this renderer implements */\n  readonly mode: RenderMode;\n  \n  /**\n   * Render an HTML container to an image or canvas.\n   * @param container - The HTML element to render\n   * @param width - Target width in logical pixels\n   * @param height - Target height in logical pixels\n   * @param options - Rendering options\n   * @returns Promise resolving to a canvas or image element\n   */\n  render(\n    container: HTMLElement,\n    width: number,\n    height: number,\n    options?: RenderOptions,\n  ): Promise<RenderResult>;\n  \n  /**\n   * Check if this renderer is available in the current environment.\n   */\n  isAvailable(): boolean;\n}\n\n/**\n * Get the effective render mode, validating that native is available when selected.\n * Falls back to foreignObject if native is selected but not available.\n */\nexport function getEffectiveRenderMode(): RenderMode {\n  const mode = getRenderMode();\n  \n  if (mode === \"native\" && !isNativeCanvasApiAvailable()) {\n    return \"foreignObject\";\n  }\n  \n  return mode;\n}\n\n/**\n * Check if a render result is a canvas element.\n */\nexport function isCanvas(result: RenderResult): result is HTMLCanvasElement {\n  return result instanceof HTMLCanvasElement;\n}\n\n/**\n * Check if a render result is an image element.\n */\nexport function isImage(result: RenderResult): result is HTMLImageElement {\n  return result instanceof HTMLImageElement;\n}\n"],"mappings":";;;;;;;AAyDA,SAAgB,yBAAqC;CACnD,MAAM,OAAO,eAAe;AAE5B,KAAI,SAAS,YAAY,CAAC,4BAA4B,CACpD,QAAO;AAGT,QAAO"}
+{"version":3,"file":"renderers.js","names":[],"sources":["../../src/preview/renderers.ts"],"sourcesContent":["/**\n * Renderer strategy pattern for HTML-to-image rendering.\n * Provides a unified interface for native (drawElementImage) and foreignObject paths.\n */\n\nimport {\n  isNativeCanvasApiAvailable,\n  getRenderMode,\n  type RenderMode,\n} from \"./previewSettings.js\";\n\n/**\n * Options for rendering HTML to an image or canvas.\n */\nexport interface RenderOptions {\n  /** Skip device pixel ratio scaling (render at logical pixels) */\n  skipDprScaling?: boolean;\n  /** Scale factor for encoding internal canvases (foreignObject only) */\n  canvasScale?: number;\n  /** Whether to reuse an existing canvas (native only) */\n  reuseCanvas?: HTMLCanvasElement;\n}\n\n/**\n * Result of a render operation.\n * Native path returns a canvas, foreignObject path returns an image.\n */\nexport type RenderResult = HTMLCanvasElement | HTMLImageElement;\n\n/**\n * Renderer interface for HTML-to-image conversion.\n */\nexport interface Renderer {\n  /** The render mode this renderer implements */\n  readonly mode: RenderMode;\n\n  /**\n   * Render an HTML container to an image or canvas.\n   * @param container - The HTML element to render\n   * @param width - Target width in logical pixels\n   * @param height - Target height in logical pixels\n   * @param options - Rendering options\n   * @returns Promise resolving to a canvas or image element\n   */\n  render(\n    container: HTMLElement,\n    width: number,\n    height: number,\n    options?: RenderOptions,\n  ): Promise<RenderResult>;\n\n  /**\n   * Check if this renderer is available in the current environment.\n   */\n  isAvailable(): boolean;\n}\n\n/**\n * Get the effective render mode, validating that native is available when selected.\n * Falls back to foreignObject if native is selected but not available.\n */\nexport function getEffectiveRenderMode(): RenderMode {\n  const mode = getRenderMode();\n\n  if (mode === \"native\" && !isNativeCanvasApiAvailable()) {\n    return \"foreignObject\";\n  }\n\n  return mode;\n}\n\n/**\n * Check if a render result is a canvas element.\n */\nexport function isCanvas(result: RenderResult): result is HTMLCanvasElement {\n  return result instanceof HTMLCanvasElement;\n}\n\n/**\n * Check if a render result is an image element.\n */\nexport function isImage(result: RenderResult): result is HTMLImageElement {\n  return result instanceof HTMLImageElement;\n}\n"],"mappings":";;;;;;;AA6DA,SAAgB,yBAAqC;CACnD,MAAM,OAAO,eAAe;AAE5B,KAAI,SAAS,YAAY,CAAC,4BAA4B,CACpD,QAAO;AAGT,QAAO;;;;;AAMT,SAAgB,SAAS,QAAmD;AAC1E,QAAO,kBAAkB;;;;;AAM3B,SAAgB,QAAQ,QAAkD;AACxE,QAAO,kBAAkB"}

package/dist/preview/rendering/ScaleConfig.js

@@ -0,0 +1,74 @@
+//#region src/preview/rendering/ScaleConfig.ts
+/**
+* Immutable scaling configuration for a serialization operation.
+*
+* All scaling decisions are computed once at construction and cached.
+* This ensures consistency across all stages of serialization.
+*/
+var ScaleConfig = class ScaleConfig {
+	constructor(width, height, exportScale) {
+		this.qualityMultiplier = 1.5;
+		this.inputWidth = width;
+		this.inputHeight = height;
+		this.exportScale = exportScale;
+		this.outputWidth = Math.floor(width * exportScale);
+		this.outputHeight = Math.floor(height * exportScale);
+		this.needsDOMScaling = exportScale < 1;
+		Object.freeze(this);
+	}
+	/**
+	* Compute optimal encoding scale for a canvas element.
+	*
+	* This is Stage 3 of the scaling architecture. Canvas pixels are scaled
+	* independently from DOM content because they have intrinsic resolution.
+	*
+	* Algorithm:
+	* 1. Calculate display scale (CSS size vs natural size)
+	* 2. Multiply by export scale
+	* 3. Multiply by quality multiplier (1.5x for sharpness)
+	* 4. Cap at 1.0 (never upscale beyond natural resolution)
+	*
+	* @param params - Canvas dimensions (natural and display)
+	* @returns Optimal scale for encoding (0.0 to 1.0)
+	*/
+	computeCanvasScale(params) {
+		const { naturalWidth, naturalHeight, displayWidth, displayHeight } = params;
+		const displayScaleX = displayWidth / naturalWidth;
+		const displayScaleY = displayHeight / naturalHeight;
+		const displayScale = Math.min(displayScaleX, displayScaleY);
+		return Math.min(1, displayScale * this.exportScale * this.qualityMultiplier);
+	}
+	/**
+	* Get the CSS transform value for DOM scaling.
+	* Returns null if no scaling is needed.
+	*/
+	getDOMTransform() {
+		return this.needsDOMScaling ? `scale(${this.exportScale})` : null;
+	}
+	/**
+	* Get the wrapper dimensions for the CSS transform.
+	* When DOM is scaled, the wrapper must be larger to accommodate
+	* the scaled-down content.
+	*/
+	getDOMWrapperDimensions() {
+		if (!this.needsDOMScaling) return {
+			width: this.outputWidth,
+			height: this.outputHeight
+		};
+		return {
+			width: Math.floor(this.outputWidth / this.exportScale),
+			height: Math.floor(this.outputHeight / this.exportScale)
+		};
+	}
+	/**
+	* Create a ScaleConfig from legacy options.
+	* Maintains backward compatibility with existing callsites.
+	*/
+	static fromOptions(width, height, canvasScale) {
+		return new ScaleConfig(width, height, canvasScale);
+	}
+};
+
+//#endregion
+export { ScaleConfig };
+//# sourceMappingURL=ScaleConfig.js.map

package/dist/preview/rendering/ScaleConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScaleConfig.js","names":[],"sources":["../../../src/preview/rendering/ScaleConfig.ts"],"sourcesContent":["/**\n * ScaleConfig - Unified scaling configuration for timeline serialization.\n *\n * Consolidates the multi-stage scaling architecture into a single,\n * well-defined abstraction with clear contracts.\n *\n * Previously, scaling was applied in 4 separate stages with implicit contracts:\n * 1. captureTimelineToDataUri: scaled output dimensions\n * 2. captureElementParts: CSS transform wrapper for DOM content\n * 3. serializeCanvas: independent optimalScale calculation per canvas\n * 4. encodeCanvasesInParallel: received pre-scaled snapshots\n *\n * Now, ScaleConfig centralizes all scaling logic and makes the contracts explicit.\n */\n\nexport interface CanvasScaleParams {\n  /** Natural canvas pixel dimensions */\n  naturalWidth: number;\n  naturalHeight: number;\n  /** CSS display dimensions (how big it appears) */\n  displayWidth: number;\n  displayHeight: number;\n}\n\n/**\n * Immutable scaling configuration for a serialization operation.\n *\n * All scaling decisions are computed once at construction and cached.\n * This ensures consistency across all stages of serialization.\n */\nexport class ScaleConfig {\n  /** User-specified export scale (e.g., 0.25 for thumbnails, 1.0 for full resolution) */\n  readonly exportScale: number;\n\n  /** Input dimensions (before scaling) */\n  readonly inputWidth: number;\n  readonly inputHeight: number;\n\n  /** Output SVG dimensions (after scaling) */\n  readonly outputWidth: number;\n  readonly outputHeight: number;\n\n  /** Whether DOM content needs CSS transform:scale() wrapper */\n  readonly needsDOMScaling: boolean;\n\n  /** Quality multiplier for canvas encoding (1.5x for sharpness) */\n  readonly qualityMultiplier: number = 1.5;\n\n  constructor(width: number, height: number, exportScale: number) {\n    this.inputWidth = width;\n    this.inputHeight = height;\n    this.exportScale = exportScale;\n\n    // Compute output dimensions (Stage 1)\n    this.outputWidth = Math.floor(width * exportScale);\n    this.outputHeight = Math.floor(height * exportScale);\n\n    // Determine if DOM needs CSS scaling (Stage 2)\n    this.needsDOMScaling = exportScale < 1;\n\n    // Freeze to ensure immutability\n    Object.freeze(this);\n  }\n\n  /**\n   * Compute optimal encoding scale for a canvas element.\n   *\n   * This is Stage 3 of the scaling architecture. Canvas pixels are scaled\n   * independently from DOM content because they have intrinsic resolution.\n   *\n   * Algorithm:\n   * 1. Calculate display scale (CSS size vs natural size)\n   * 2. Multiply by export scale\n   * 3. Multiply by quality multiplier (1.5x for sharpness)\n   * 4. Cap at 1.0 (never upscale beyond natural resolution)\n   *\n   * @param params - Canvas dimensions (natural and display)\n   * @returns Optimal scale for encoding (0.0 to 1.0)\n   */\n  computeCanvasScale(params: CanvasScaleParams): number {\n    const { naturalWidth, naturalHeight, displayWidth, displayHeight } = params;\n\n    // Calculate how much smaller the display is vs natural size\n    const displayScaleX = displayWidth / naturalWidth;\n    const displayScaleY = displayHeight / naturalHeight;\n    const displayScale = Math.min(displayScaleX, displayScaleY);\n\n    // Combine display scale, export scale, and quality multiplier\n    // Cap at 1.0 to never upscale beyond natural resolution\n    const optimalScale = Math.min(\n      1.0,\n      displayScale * this.exportScale * this.qualityMultiplier,\n    );\n\n    return optimalScale;\n  }\n\n  /**\n   * Get the CSS transform value for DOM scaling.\n   * Returns null if no scaling is needed.\n   */\n  getDOMTransform(): string | null {\n    return this.needsDOMScaling ? `scale(${this.exportScale})` : null;\n  }\n\n  /**\n   * Get the wrapper dimensions for the CSS transform.\n   * When DOM is scaled, the wrapper must be larger to accommodate\n   * the scaled-down content.\n   */\n  getDOMWrapperDimensions(): { width: number; height: number } {\n    if (!this.needsDOMScaling) {\n      return { width: this.outputWidth, height: this.outputHeight };\n    }\n\n    return {\n      width: Math.floor(this.outputWidth / this.exportScale),\n      height: Math.floor(this.outputHeight / this.exportScale),\n    };\n  }\n\n  /**\n   * Create a ScaleConfig from legacy options.\n   * Maintains backward compatibility with existing callsites.\n   */\n  static fromOptions(\n    width: number,\n    height: number,\n    canvasScale: number,\n  ): ScaleConfig {\n    return new ScaleConfig(width, height, canvasScale);\n  }\n}\n"],"mappings":";;;;;;;AA8BA,IAAa,cAAb,MAAa,YAAY;CAkBvB,YAAY,OAAe,QAAgB,aAAqB;2BAF3B;AAGnC,OAAK,aAAa;AAClB,OAAK,cAAc;AACnB,OAAK,cAAc;AAGnB,OAAK,cAAc,KAAK,MAAM,QAAQ,YAAY;AAClD,OAAK,eAAe,KAAK,MAAM,SAAS,YAAY;AAGpD,OAAK,kBAAkB,cAAc;AAGrC,SAAO,OAAO,KAAK;;;;;;;;;;;;;;;;;CAkBrB,mBAAmB,QAAmC;EACpD,MAAM,EAAE,cAAc,eAAe,cAAc,kBAAkB;EAGrE,MAAM,gBAAgB,eAAe;EACrC,MAAM,gBAAgB,gBAAgB;EACtC,MAAM,eAAe,KAAK,IAAI,eAAe,cAAc;AAS3D,SALqB,KAAK,IACxB,GACA,eAAe,KAAK,cAAc,KAAK,kBACxC;;;;;;CASH,kBAAiC;AAC/B,SAAO,KAAK,kBAAkB,SAAS,KAAK,YAAY,KAAK;;;;;;;CAQ/D,0BAA6D;AAC3D,MAAI,CAAC,KAAK,gBACR,QAAO;GAAE,OAAO,KAAK;GAAa,QAAQ,KAAK;GAAc;AAG/D,SAAO;GACL,OAAO,KAAK,MAAM,KAAK,cAAc,KAAK,YAAY;GACtD,QAAQ,KAAK,MAAM,KAAK,eAAe,KAAK,YAAY;GACzD;;;;;;CAOH,OAAO,YACL,OACA,QACA,aACa;AACb,SAAO,IAAI,YAAY,OAAO,QAAQ,YAAY"}

package/dist/preview/rendering/inlineImages.d.ts

@@ -0,0 +1,13 @@
+//#region src/preview/rendering/inlineImages.d.ts
+
+/**
+ * Clear the inline image cache. Useful for memory management in long-running sessions.
+ */
+declare function clearInlineImageCache(): void;
+/**
+ * Get current inline image cache size for diagnostics.
+ */
+declare function getInlineImageCacheSize(): number;
+//#endregion
+export { clearInlineImageCache, getInlineImageCacheSize };
+//# sourceMappingURL=inlineImages.d.ts.map

package/dist/preview/rendering/inlineImages.js

@@ -1,56 +1,19 @@
-import { logger } from "../logger.js";
-
 //#region src/preview/rendering/inlineImages.ts
-/** Maximum number of cached inline images before eviction */
-const MAX_INLINE_IMAGE_CACHE_SIZE = 100;
 /** Image cache for inlining external images as data URIs (foreignObject path) */
 const _inlineImageCache = /* @__PURE__ */ new Map();
 /**
-* Convert a Blob to a data URL.
-*/
-function blobToDataURL(blob) {
-	return new Promise((resolve, reject) => {
-		const reader = new FileReader();
-		reader.onload = () => resolve(reader.result);
-		reader.onerror = reject;
-		reader.readAsDataURL(blob);
-	});
-}
-/**
-* Inline all images in a container as base64 data URIs.
-* SVG foreignObject can't load external images due to security restrictions.
-* Uses an LRU-style cache with size limits to prevent memory leaks.
-*/
-async function inlineImages(container) {
-	const images = container.querySelectorAll("img");
-	for (const image of images) {
-		const src = image.getAttribute("src");
-		if (!src || src.startsWith("data:")) continue;
-		const cached = _inlineImageCache.get(src);
-		if (cached) {
-			image.setAttribute("src", cached);
-			continue;
-		}
-		try {
-			const dataUrl = await blobToDataURL(await (await fetch(src)).blob());
-			image.setAttribute("src", dataUrl);
-			if (_inlineImageCache.size >= MAX_INLINE_IMAGE_CACHE_SIZE) {
-				const firstKey = _inlineImageCache.keys().next().value;
-				if (firstKey) _inlineImageCache.delete(firstKey);
-			}
-			_inlineImageCache.set(src, dataUrl);
-		} catch (e) {
-			logger.warn("Failed to inline image:", src, e);
-		}
-	}
-}
-/**
 * Clear the inline image cache. Useful for memory management in long-running sessions.
 */
 function clearInlineImageCache() {
 	_inlineImageCache.clear();
 }
+/**
+* Get current inline image cache size for diagnostics.
+*/
+function getInlineImageCacheSize() {
+	return _inlineImageCache.size;
+}
 
 //#endregion
-export { clearInlineImageCache, inlineImages };
+export { clearInlineImageCache, getInlineImageCacheSize };
 //# sourceMappingURL=inlineImages.js.map

package/dist/preview/rendering/inlineImages.js.map

@@ -1 +1 @@
-{"version":3,"file":"inlineImages.js","names":[],"sources":["../../../src/preview/rendering/inlineImages.ts"],"sourcesContent":["/**\n * Image inlining utilities for SVG foreignObject rendering.\n * SVG foreignObject can't load external images due to security restrictions,\n * so we convert them to base64 data URIs.\n */\n\nimport { logger } from \"../logger.js\";\n\n/** Maximum number of cached inline images before eviction */\nconst MAX_INLINE_IMAGE_CACHE_SIZE = 100;\n\n/** Image cache for inlining external images as data URIs (foreignObject path) */\nconst _inlineImageCache = new Map<string, string>();\n\n/**\n * Convert a Blob to a data URL.\n */\nfunction blobToDataURL(blob: Blob): Promise<string> {\n  return new Promise((resolve, reject) => {\n    const reader = new FileReader();\n    reader.onload = () => resolve(reader.result as string);\n    reader.onerror = reject;\n    reader.readAsDataURL(blob);\n  });\n}\n\n/**\n * Inline all images in a container as base64 data URIs.\n * SVG foreignObject can't load external images due to security restrictions.\n * Uses an LRU-style cache with size limits to prevent memory leaks.\n */\nexport async function inlineImages(container: HTMLElement): Promise<void> {\n  const images = container.querySelectorAll(\"img\");\n  for (const image of images) {\n    const src = image.getAttribute(\"src\");\n    if (!src || src.startsWith(\"data:\")) continue;\n\n    const cached = _inlineImageCache.get(src);\n    if (cached) {\n      image.setAttribute(\"src\", cached);\n      continue;\n    }\n\n    try {\n      const response = await fetch(src);\n      const blob = await response.blob();\n      const dataUrl = await blobToDataURL(blob);\n      image.setAttribute(\"src\", dataUrl);\n      \n      // Evict oldest entries if cache is full (simple FIFO eviction)\n      if (_inlineImageCache.size >= MAX_INLINE_IMAGE_CACHE_SIZE) {\n        const firstKey = _inlineImageCache.keys().next().value;\n        if (firstKey) _inlineImageCache.delete(firstKey);\n      }\n      _inlineImageCache.set(src, dataUrl);\n    } catch (e) {\n      logger.warn(\"Failed to inline image:\", src, e);\n    }\n  }\n}\n\n/**\n * Clear the inline image cache. Useful for memory management in long-running sessions.\n */\nexport function clearInlineImageCache(): void {\n  _inlineImageCache.clear();\n}\n\n/**\n * Get current inline image cache size for diagnostics.\n */\nexport function getInlineImageCacheSize(): number {\n  return _inlineImageCache.size;\n}\n"],"mappings":";;;;AASA,MAAM,8BAA8B;;AAGpC,MAAM,oCAAoB,IAAI,KAAqB;;;;AAKnD,SAAS,cAAc,MAA6B;AAClD,QAAO,IAAI,SAAS,SAAS,WAAW;EACtC,MAAM,SAAS,IAAI,YAAY;AAC/B,SAAO,eAAe,QAAQ,OAAO,OAAiB;AACtD,SAAO,UAAU;AACjB,SAAO,cAAc,KAAK;GAC1B;;;;;;;AAQJ,eAAsB,aAAa,WAAuC;CACxE,MAAM,SAAS,UAAU,iBAAiB,MAAM;AAChD,MAAK,MAAM,SAAS,QAAQ;EAC1B,MAAM,MAAM,MAAM,aAAa,MAAM;AACrC,MAAI,CAAC,OAAO,IAAI,WAAW,QAAQ,CAAE;EAErC,MAAM,SAAS,kBAAkB,IAAI,IAAI;AACzC,MAAI,QAAQ;AACV,SAAM,aAAa,OAAO,OAAO;AACjC;;AAGF,MAAI;GAGF,MAAM,UAAU,MAAM,cADT,OADI,MAAM,MAAM,IAAI,EACL,MAAM,CACO;AACzC,SAAM,aAAa,OAAO,QAAQ;AAGlC,OAAI,kBAAkB,QAAQ,6BAA6B;IACzD,MAAM,WAAW,kBAAkB,MAAM,CAAC,MAAM,CAAC;AACjD,QAAI,SAAU,mBAAkB,OAAO,SAAS;;AAElD,qBAAkB,IAAI,KAAK,QAAQ;WAC5B,GAAG;AACV,UAAO,KAAK,2BAA2B,KAAK,EAAE;;;;;;;AAQpD,SAAgB,wBAA8B;AAC5C,mBAAkB,OAAO"}
+{"version":3,"file":"inlineImages.js","names":[],"sources":["../../../src/preview/rendering/inlineImages.ts"],"sourcesContent":["/**\n * Image inlining utilities for SVG foreignObject rendering.\n * SVG foreignObject can't load external images due to security restrictions,\n * so we convert them to base64 data URIs.\n */\n\nimport { logger } from \"../logger.js\";\n\n/** Maximum number of cached inline images before eviction */\nconst MAX_INLINE_IMAGE_CACHE_SIZE = 100;\n\n/** Image cache for inlining external images as data URIs (foreignObject path) */\nconst _inlineImageCache = new Map<string, string>();\n\n/**\n * Convert a Blob to a data URL.\n */\nfunction blobToDataURL(blob: Blob): Promise<string> {\n  return new Promise((resolve, reject) => {\n    const reader = new FileReader();\n    reader.onload = () => resolve(reader.result as string);\n    reader.onerror = reject;\n    reader.readAsDataURL(blob);\n  });\n}\n\n/**\n * Inline all images in a container as base64 data URIs.\n * SVG foreignObject can't load external images due to security restrictions.\n * Uses an LRU-style cache with size limits to prevent memory leaks.\n */\nexport async function inlineImages(container: HTMLElement): Promise<void> {\n  const images = container.querySelectorAll(\"img\");\n  for (const image of images) {\n    const src = image.getAttribute(\"src\");\n    if (!src || src.startsWith(\"data:\")) continue;\n\n    const cached = _inlineImageCache.get(src);\n    if (cached) {\n      image.setAttribute(\"src\", cached);\n      continue;\n    }\n\n    try {\n      const response = await fetch(src);\n      const blob = await response.blob();\n      const dataUrl = await blobToDataURL(blob);\n      image.setAttribute(\"src\", dataUrl);\n\n      // Evict oldest entries if cache is full (simple FIFO eviction)\n      if (_inlineImageCache.size >= MAX_INLINE_IMAGE_CACHE_SIZE) {\n        const firstKey = _inlineImageCache.keys().next().value;\n        if (firstKey) _inlineImageCache.delete(firstKey);\n      }\n      _inlineImageCache.set(src, dataUrl);\n    } catch (e) {\n      logger.warn(\"Failed to inline image:\", src, e);\n    }\n  }\n}\n\n/**\n * Clear the inline image cache. Useful for memory management in long-running sessions.\n */\nexport function clearInlineImageCache(): void {\n  _inlineImageCache.clear();\n}\n\n/**\n * Get current inline image cache size for diagnostics.\n */\nexport function getInlineImageCacheSize(): number {\n  return _inlineImageCache.size;\n}\n"],"mappings":";;AAYA,MAAM,oCAAoB,IAAI,KAAqB;;;;AAoDnD,SAAgB,wBAA8B;AAC5C,mBAAkB,OAAO;;;;;AAM3B,SAAgB,0BAAkC;AAChD,QAAO,kBAAkB"}

package/dist/preview/rendering/loadImage.d.ts

@@ -0,0 +1,8 @@
+//#region src/preview/rendering/loadImage.d.ts
+/**
+ * Load an image from a data URI. Returns a Promise that resolves when loaded.
+ */
+declare function loadImageFromDataUri(dataUri: string): Promise<HTMLImageElement>;
+//#endregion
+export { loadImageFromDataUri };
+//# sourceMappingURL=loadImage.d.ts.map

package/dist/preview/rendering/loadImage.js

@@ -0,0 +1,22 @@
+import { defaultProfiler } from "../RenderProfiler.js";
+
+//#region src/preview/rendering/loadImage.ts
+/**
+* Load an image from a data URI. Returns a Promise that resolves when loaded.
+*/
+function loadImageFromDataUri(dataUri) {
+	const img = new Image();
+	const imageLoadStart = performance.now();
+	return new Promise((resolve, reject) => {
+		img.onload = () => {
+			defaultProfiler.addTime("imageLoad", performance.now() - imageLoadStart);
+			resolve(img);
+		};
+		img.onerror = reject;
+		img.src = dataUri;
+	});
+}
+
+//#endregion
+export { loadImageFromDataUri };
+//# sourceMappingURL=loadImage.js.map

package/dist/preview/rendering/loadImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"loadImage.js","names":[],"sources":["../../../src/preview/rendering/loadImage.ts"],"sourcesContent":["import { defaultProfiler } from \"../RenderProfiler.js\";\n\n/**\n * Load an image from a data URI. Returns a Promise that resolves when loaded.\n */\nexport function loadImageFromDataUri(\n  dataUri: string,\n): Promise<HTMLImageElement> {\n  const img = new Image();\n  const imageLoadStart = performance.now();\n\n  return new Promise<HTMLImageElement>((resolve, reject) => {\n    img.onload = () => {\n      defaultProfiler.addTime(\"imageLoad\", performance.now() - imageLoadStart);\n      resolve(img);\n    };\n    img.onerror = reject;\n    img.src = dataUri;\n  });\n}\n"],"mappings":";;;;;;AAKA,SAAgB,qBACd,SAC2B;CAC3B,MAAM,MAAM,IAAI,OAAO;CACvB,MAAM,iBAAiB,YAAY,KAAK;AAExC,QAAO,IAAI,SAA2B,SAAS,WAAW;AACxD,MAAI,eAAe;AACjB,mBAAgB,QAAQ,aAAa,YAAY,KAAK,GAAG,eAAe;AACxE,WAAQ,IAAI;;AAEd,MAAI,UAAU;AACd,MAAI,MAAM;GACV"}

package/dist/preview/rendering/renderToImageNative.js

@@ -27,15 +27,15 @@ function createDprCanvas(options) {
 /**
 * Render HTML content to canvas using native HTML-in-Canvas API (drawElementImage).
 * This is much faster than the foreignObject approach and avoids canvas tainting.
-* 
+*
 * Note: The native API renders at device pixel ratio, so we capture at DPR scale
 * and then downsample to logical pixels to match the foreignObject path's output.
-* 
+*
 * @param container - The HTML element to render
 * @param width - Target width in logical pixels
 * @param height - Target height in logical pixels
 * @param options - Rendering options (skipWait for batch mode)
-* 
+*
 * @see https://github.com/WICG/html-in-canvas
 */
 async function renderToImageNative(container, width, height, options = {}) {

package/dist/preview/rendering/renderToImageNative.js.map

@@ -1 +1 @@
-{"version":3,"file":"renderToImageNative.js","names":["captureCanvas: HTMLCanvasElement","dpr"],"sources":["../../../src/preview/rendering/renderToImageNative.ts"],"sourcesContent":["/**\n * Native HTML-in-Canvas rendering using drawElementImage API.\n */\n\nimport type { HtmlInCanvasContext, HtmlInCanvasElement, NativeRenderOptions } from \"./types.js\";\nimport { defaultProfiler } from \"../RenderProfiler.js\";\n\n/** Track canvases that have been initialized for layoutsubtree (only need to wait once) */\nconst _layoutInitializedCanvases = new WeakSet<HTMLCanvasElement>();\n\n/**\n * Wait for next animation frame (allows browser to complete layout)\n */\nfunction waitForFrame(): Promise<void> {\n  return new Promise(resolve => requestAnimationFrame(() => resolve()));\n}\n\n/**\n * Create a canvas element with proper DPR handling.\n * Buffer size is based on renderWidth/renderHeight (internal resolution).\n * CSS size is based on fullWidth/fullHeight (logical display size).\n */\nexport function createDprCanvas(options: {\n  renderWidth: number;\n  renderHeight: number;\n  scale: number;\n  dpr?: number;\n  fullWidth: number;\n  fullHeight: number;\n}): HTMLCanvasElement {\n  const { renderWidth, renderHeight, scale, fullWidth, fullHeight } = options;\n  const dpr = options.dpr ?? window.devicePixelRatio ?? 1;\n  \n  const canvas = document.createElement(\"canvas\");\n  canvas.width = Math.floor(renderWidth * scale * dpr);\n  canvas.height = Math.floor(renderHeight * scale * dpr);\n  canvas.style.width = `${Math.floor(fullWidth * scale)}px`;\n  canvas.style.height = `${Math.floor(fullHeight * scale)}px`;\n  \n  return canvas;\n}\n\n/**\n * Render HTML content to canvas using native HTML-in-Canvas API (drawElementImage).\n * This is much faster than the foreignObject approach and avoids canvas tainting.\n * \n * Note: The native API renders at device pixel ratio, so we capture at DPR scale\n * and then downsample to logical pixels to match the foreignObject path's output.\n * \n * @param container - The HTML element to render\n * @param width - Target width in logical pixels\n * @param height - Target height in logical pixels\n * @param options - Rendering options (skipWait for batch mode)\n * \n * @see https://github.com/WICG/html-in-canvas\n */\nexport async function renderToImageNative(\n  container: HTMLElement,\n  width: number,\n  height: number,\n  options: NativeRenderOptions = {},\n): Promise<HTMLCanvasElement> {\n  const t0 = performance.now();\n  const { reuseCanvas, skipDprScaling = false } = options;\n  // Use 1x DPR when skipDprScaling is true (for video export) - 4x fewer pixels!\n  const dpr = skipDprScaling ? 1 : (window.devicePixelRatio || 1);\n  \n  // Use provided canvas or create new one\n  let captureCanvas: HTMLCanvasElement;\n  let shouldCleanup = false;\n  \n  if (reuseCanvas) {\n    captureCanvas = reuseCanvas;\n    \n    // Ensure canvas dimensions match (both attribute and CSS)\n    const dpr = skipDprScaling ? 1 : (window.devicePixelRatio || 1);\n    const targetWidth = Math.floor(width * dpr);\n    const targetHeight = Math.floor(height * dpr);\n    \n    // Set attribute dimensions (pixel buffer size)\n    if (captureCanvas.width !== targetWidth) {\n      captureCanvas.width = targetWidth;\n    }\n    if (captureCanvas.height !== targetHeight) {\n      captureCanvas.height = targetHeight;\n    }\n    \n    // Ensure CSS dimensions and positioning (same as non-reuse path)\n    // This ensures consistent behavior and avoids layout issues\n    captureCanvas.style.cssText = `\n      position: fixed;\n      left: 0;\n      top: 0;\n      width: ${width}px;\n      height: ${height}px;\n      opacity: 0;\n      pointer-events: none;\n      z-index: -9999;\n    `;\n    \n    // Ensure layoutsubtree is set (required for drawElementImage)\n    if (!captureCanvas.hasAttribute(\"layoutsubtree\")) {\n      captureCanvas.setAttribute(\"layoutsubtree\", \"\");\n      (captureCanvas as HtmlInCanvasElement).layoutSubtree = true;\n    }\n    \n    // Ensure canvas is in DOM (required for drawElementImage layout)\n    if (!captureCanvas.parentNode) {\n      document.body.appendChild(captureCanvas);\n    }\n    \n    // Ensure container is child of canvas\n    if (container.parentElement !== captureCanvas) {\n      captureCanvas.appendChild(container);\n    }\n    \n    // Ensure container is visible (not display: none) for layout\n    // drawElementImage requires the element to be laid out\n    const containerStyle = getComputedStyle(container);\n    if (containerStyle.display === 'none') {\n      container.style.display = 'block';\n    }\n    \n    // Force synchronous layout ONLY on first use with this canvas\n    // For batch rendering (video export), repeated layout forces are expensive\n    // We only need to force layout once to ensure everything is ready\n    if (!_layoutInitializedCanvases.has(captureCanvas)) {\n      void captureCanvas.offsetHeight;\n      void container.offsetHeight;\n      getComputedStyle(captureCanvas).opacity;\n      getComputedStyle(container).opacity;\n      _layoutInitializedCanvases.add(captureCanvas);\n    }\n  } else {\n    captureCanvas = document.createElement(\"canvas\");\n    captureCanvas.width = Math.floor(width * dpr);\n    captureCanvas.height = Math.floor(height * dpr);\n    \n    // Enable HTML-in-Canvas mode via layoutsubtree attribute/property\n    captureCanvas.setAttribute(\"layoutsubtree\", \"\");\n    (captureCanvas as HtmlInCanvasElement).layoutSubtree = true;\n    \n    captureCanvas.appendChild(container);\n    \n    captureCanvas.style.cssText = `\n      position: fixed;\n      left: 0;\n      top: 0;\n      width: ${width}px;\n      height: ${height}px;\n      opacity: 0;\n      pointer-events: none;\n      z-index: -9999;\n    `;\n    document.body.appendChild(captureCanvas);\n    shouldCleanup = true;\n  }\n  \n  const t1 = performance.now();\n  defaultProfiler.addTime(\"setup\", t1 - t0);\n  \n  try {\n    // Force style calculation to ensure CSS is computed before capture\n    // This ensures both canvas and container are laid out (required for drawElementImage)\n    getComputedStyle(container).opacity;\n    \n    // When reusing canvas with layoutsubtree, wait for initial layout (first use only)\n    // Use a WeakSet to track canvases that have been initialized\n    if (reuseCanvas && (captureCanvas as any).layoutSubtree && !_layoutInitializedCanvases.has(captureCanvas)) {\n      await waitForFrame();\n      _layoutInitializedCanvases.add(captureCanvas);\n      \n      // Canvas may have been detached during async wait (e.g., test cleanup)\n      if (!captureCanvas.parentNode) {\n        return captureCanvas;\n      }\n    }\n    \n    const ctx = captureCanvas.getContext(\"2d\") as HtmlInCanvasContext;\n    ctx.drawElementImage(container, 0, 0);\n  } finally {\n    // Only clean up if we created the canvas\n    if (shouldCleanup && captureCanvas.parentNode) {\n      captureCanvas.parentNode.removeChild(captureCanvas);\n    }\n  }\n  \n  const t2 = performance.now();\n  defaultProfiler.addTime(\"draw\", t2 - t1);\n  \n  // If DPR is 1, no downsampling needed - return as-is\n  if (dpr === 1) {\n    defaultProfiler.incrementRenderCount();\n    return captureCanvas;\n  }\n  \n  // Downsample to logical pixel dimensions to match foreignObject path output\n  // This ensures consistent behavior regardless of which rendering path is used\n  const outputCanvas = document.createElement(\"canvas\");\n  outputCanvas.width = width;\n  outputCanvas.height = height;\n  \n  const outputCtx = outputCanvas.getContext(\"2d\")!;\n  // Draw the DPR-scaled capture onto the 1x output canvas\n  outputCtx.drawImage(\n    captureCanvas,\n    0, 0, captureCanvas.width, captureCanvas.height,  // source (full DPR capture)\n    0, 0, width, height  // destination (logical pixels)\n  );\n  \n  const t3 = performance.now();\n  defaultProfiler.addTime(\"downsample\", t3 - t2);\n  defaultProfiler.incrementRenderCount();\n  \n  return outputCanvas;\n}\n"],"mappings":"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"}
+{"version":3,"file":"renderToImageNative.js","names":["captureCanvas: HTMLCanvasElement","dpr"],"sources":["../../../src/preview/rendering/renderToImageNative.ts"],"sourcesContent":["/**\n * Native HTML-in-Canvas rendering using drawElementImage API.\n */\n\nimport type {\n  HtmlInCanvasContext,\n  HtmlInCanvasElement,\n  NativeRenderOptions,\n} from \"./types.js\";\nimport { defaultProfiler } from \"../RenderProfiler.js\";\n\n/** Track canvases that have been initialized for layoutsubtree (only need to wait once) */\nconst _layoutInitializedCanvases = new WeakSet<HTMLCanvasElement>();\n\n/**\n * Wait for next animation frame (allows browser to complete layout)\n */\nfunction waitForFrame(): Promise<void> {\n  return new Promise((resolve) => requestAnimationFrame(() => resolve()));\n}\n\n/**\n * Create a canvas element with proper DPR handling.\n * Buffer size is based on renderWidth/renderHeight (internal resolution).\n * CSS size is based on fullWidth/fullHeight (logical display size).\n */\nexport function createDprCanvas(options: {\n  renderWidth: number;\n  renderHeight: number;\n  scale: number;\n  dpr?: number;\n  fullWidth: number;\n  fullHeight: number;\n}): HTMLCanvasElement {\n  const { renderWidth, renderHeight, scale, fullWidth, fullHeight } = options;\n  const dpr = options.dpr ?? window.devicePixelRatio ?? 1;\n\n  const canvas = document.createElement(\"canvas\");\n  canvas.width = Math.floor(renderWidth * scale * dpr);\n  canvas.height = Math.floor(renderHeight * scale * dpr);\n  canvas.style.width = `${Math.floor(fullWidth * scale)}px`;\n  canvas.style.height = `${Math.floor(fullHeight * scale)}px`;\n\n  return canvas;\n}\n\n/**\n * Render HTML content to canvas using native HTML-in-Canvas API (drawElementImage).\n * This is much faster than the foreignObject approach and avoids canvas tainting.\n *\n * Note: The native API renders at device pixel ratio, so we capture at DPR scale\n * and then downsample to logical pixels to match the foreignObject path's output.\n *\n * @param container - The HTML element to render\n * @param width - Target width in logical pixels\n * @param height - Target height in logical pixels\n * @param options - Rendering options (skipWait for batch mode)\n *\n * @see https://github.com/WICG/html-in-canvas\n */\nexport async function renderToImageNative(\n  container: HTMLElement,\n  width: number,\n  height: number,\n  options: NativeRenderOptions = {},\n): Promise<HTMLCanvasElement> {\n  const t0 = performance.now();\n  const { reuseCanvas, skipDprScaling = false } = options;\n  // Use 1x DPR when skipDprScaling is true (for video export) - 4x fewer pixels!\n  const dpr = skipDprScaling ? 1 : window.devicePixelRatio || 1;\n\n  // Use provided canvas or create new one\n  let captureCanvas: HTMLCanvasElement;\n  let shouldCleanup = false;\n\n  if (reuseCanvas) {\n    captureCanvas = reuseCanvas;\n\n    // Ensure canvas dimensions match (both attribute and CSS)\n    const dpr = skipDprScaling ? 1 : window.devicePixelRatio || 1;\n    const targetWidth = Math.floor(width * dpr);\n    const targetHeight = Math.floor(height * dpr);\n\n    // Set attribute dimensions (pixel buffer size)\n    if (captureCanvas.width !== targetWidth) {\n      captureCanvas.width = targetWidth;\n    }\n    if (captureCanvas.height !== targetHeight) {\n      captureCanvas.height = targetHeight;\n    }\n\n    // Ensure CSS dimensions and positioning (same as non-reuse path)\n    // This ensures consistent behavior and avoids layout issues\n    captureCanvas.style.cssText = `\n      position: fixed;\n      left: 0;\n      top: 0;\n      width: ${width}px;\n      height: ${height}px;\n      opacity: 0;\n      pointer-events: none;\n      z-index: -9999;\n    `;\n\n    // Ensure layoutsubtree is set (required for drawElementImage)\n    if (!captureCanvas.hasAttribute(\"layoutsubtree\")) {\n      captureCanvas.setAttribute(\"layoutsubtree\", \"\");\n      (captureCanvas as HtmlInCanvasElement).layoutSubtree = true;\n    }\n\n    // Ensure canvas is in DOM (required for drawElementImage layout)\n    if (!captureCanvas.parentNode) {\n      document.body.appendChild(captureCanvas);\n    }\n\n    // Ensure container is child of canvas\n    if (container.parentElement !== captureCanvas) {\n      captureCanvas.appendChild(container);\n    }\n\n    // Ensure container is visible (not display: none) for layout\n    // drawElementImage requires the element to be laid out\n    const containerStyle = getComputedStyle(container);\n    if (containerStyle.display === \"none\") {\n      container.style.display = \"block\";\n    }\n\n    // Force synchronous layout ONLY on first use with this canvas\n    // For batch rendering (video export), repeated layout forces are expensive\n    // We only need to force layout once to ensure everything is ready\n    if (!_layoutInitializedCanvases.has(captureCanvas)) {\n      void captureCanvas.offsetHeight;\n      void container.offsetHeight;\n      getComputedStyle(captureCanvas).opacity;\n      getComputedStyle(container).opacity;\n      _layoutInitializedCanvases.add(captureCanvas);\n    }\n  } else {\n    captureCanvas = document.createElement(\"canvas\");\n    captureCanvas.width = Math.floor(width * dpr);\n    captureCanvas.height = Math.floor(height * dpr);\n\n    // Enable HTML-in-Canvas mode via layoutsubtree attribute/property\n    captureCanvas.setAttribute(\"layoutsubtree\", \"\");\n    (captureCanvas as HtmlInCanvasElement).layoutSubtree = true;\n\n    captureCanvas.appendChild(container);\n\n    captureCanvas.style.cssText = `\n      position: fixed;\n      left: 0;\n      top: 0;\n      width: ${width}px;\n      height: ${height}px;\n      opacity: 0;\n      pointer-events: none;\n      z-index: -9999;\n    `;\n    document.body.appendChild(captureCanvas);\n    shouldCleanup = true;\n  }\n\n  const t1 = performance.now();\n  defaultProfiler.addTime(\"setup\", t1 - t0);\n\n  try {\n    // Force style calculation to ensure CSS is computed before capture\n    // This ensures both canvas and container are laid out (required for drawElementImage)\n    getComputedStyle(container).opacity;\n\n    // When reusing canvas with layoutsubtree, wait for initial layout (first use only)\n    // Use a WeakSet to track canvases that have been initialized\n    if (\n      reuseCanvas &&\n      (captureCanvas as any).layoutSubtree &&\n      !_layoutInitializedCanvases.has(captureCanvas)\n    ) {\n      await waitForFrame();\n      _layoutInitializedCanvases.add(captureCanvas);\n\n      // Canvas may have been detached during async wait (e.g., test cleanup)\n      if (!captureCanvas.parentNode) {\n        return captureCanvas;\n      }\n    }\n\n    const ctx = captureCanvas.getContext(\"2d\") as HtmlInCanvasContext;\n    ctx.drawElementImage(container, 0, 0);\n  } finally {\n    // Only clean up if we created the canvas\n    if (shouldCleanup && captureCanvas.parentNode) {\n      captureCanvas.parentNode.removeChild(captureCanvas);\n    }\n  }\n\n  const t2 = performance.now();\n  defaultProfiler.addTime(\"draw\", t2 - t1);\n\n  // If DPR is 1, no downsampling needed - return as-is\n  if (dpr === 1) {\n    defaultProfiler.incrementRenderCount();\n    return captureCanvas;\n  }\n\n  // Downsample to logical pixel dimensions to match foreignObject path output\n  // This ensures consistent behavior regardless of which rendering path is used\n  const outputCanvas = document.createElement(\"canvas\");\n  outputCanvas.width = width;\n  outputCanvas.height = height;\n\n  const outputCtx = outputCanvas.getContext(\"2d\")!;\n  // Draw the DPR-scaled capture onto the 1x output canvas\n  outputCtx.drawImage(\n    captureCanvas,\n    0,\n    0,\n    captureCanvas.width,\n    captureCanvas.height, // source (full DPR capture)\n    0,\n    0,\n    width,\n    height, // destination (logical pixels)\n  );\n\n  const t3 = performance.now();\n  defaultProfiler.addTime(\"downsample\", t3 - t2);\n  defaultProfiler.incrementRenderCount();\n\n  return outputCanvas;\n}\n"],"mappings":"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"}