@editframe/elements 0.37.3-beta → 0.38.1

package/dist/preview/rendering/serializeTimelineDirect.js

@@ -1,9 +1,23 @@
-import { isVisibleAtTime } from "../previewTypes.js";
-import { collectDocumentStyles } from "../renderTimegroupPreview.js";
 import { encodeCanvasesInParallel } from "../encoding/canvasEncoder.js";
+import { isTemporal, isVisibleAtTime } from "../previewTypes.js";
+import { ScaleConfig } from "./ScaleConfig.js";
 
 //#region src/preview/rendering/serializeTimelineDirect.ts
 /**
+* Collect document styles for shadow DOM injection.
+*/
+function collectDocumentStyles() {
+	const rules = [];
+	try {
+		for (const sheet of document.styleSheets) try {
+			if (sheet.cssRules) for (const rule of sheet.cssRules) rules.push(rule.cssText);
+		} catch {}
+	} catch (e) {
+		console.warn("[collectDocumentStyles] Failed to access document.styleSheets:", e);
+	}
+	return rules.join("\n");
+}
+/**
 * Elements to skip entirely when serializing.
 * NOTE: SLOT is NOT skipped - it's handled specially to serialize light DOM children.
 */
@@ -129,27 +143,50 @@ function escapeXML(str) {
 	return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&apos;");
 }
 /**
+* Resolve the natural display value for an element that has display:none
+* set as an inline style (e.g., from temporal visibility via updateAnimations).
+*
+* Temporarily removes the inline display override so getComputedStyle falls
+* through to the element's stylesheet rules (including shadow DOM :host styles),
+* reads the natural value, then restores the override.
+*/
+function resolveNaturalDisplay(element) {
+	const htmlEl = element;
+	if (htmlEl.style?.getPropertyValue("display") === "none" && htmlEl.style) {
+		htmlEl.style.removeProperty("display");
+		const natural = getComputedStyle(element).getPropertyValue("display");
+		htmlEl.style.setProperty("display", "none");
+		return natural || "block";
+	}
+	return "block";
+}
+/**
 * Serialize computed styles as inline style string.
-* Handles display:none → block conversion for non-caption elements
-* (temporal visibility is handled separately).
+* Handles display:none recovery for non-caption elements by resolving
+* the element's natural display value from its stylesheet rules.
+* @param element - The element to serialize styles for
+* @param styles - Optional pre-computed CSSStyleDeclaration (avoids redundant getComputedStyle calls)
 */
-function serializeComputedStyles(element) {
-	const styles = getComputedStyle(element);
+function serializeComputedStyles(element, styles) {
+	const computed = styles ?? getComputedStyle(element);
 	const styleParts = [];
 	const tagName = element.tagName;
 	const isCaptionChild = CAPTION_CHILD_TAGS.has(tagName);
+	const htmlEl = element;
+	const hasExplicitWidth = !!htmlEl.style?.getPropertyValue("width");
+	const hasExplicitHeight = !!htmlEl.style?.getPropertyValue("height");
 	for (const prop of SERIALIZED_STYLE_PROPERTIES) {
-		const value = styles[prop];
+		const kebab = prop.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
+		const value = computed.getPropertyValue(kebab);
 		if (!value || value === "") continue;
 		let finalValue = value;
 		if (prop === "display") {
-			if (tagName === "EF-TEXT") finalValue = element.getAttribute("split") === "line" ? "flex" : "inline-flex";
-			else if (tagName === "EF-TEXT-SEGMENT") finalValue = element.hasAttribute("data-line-segment") ? "block" : "inline-block";
-			else if (value === "none" && !isCaptionChild) finalValue = "block";
+			if (value === "none" && !isCaptionChild) finalValue = resolveNaturalDisplay(element);
 		}
 		if (prop === "visibility") finalValue = "visible";
 		if (prop === "clipPath") continue;
-		const kebab = prop.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
+		if (prop === "width" && !hasExplicitWidth) continue;
+		if (prop === "height" && !hasExplicitHeight) continue;
 		styleParts.push(`${kebab}:${finalValue}`);
 	}
 	styleParts.push("animation:none", "transition:none");
@@ -168,75 +205,153 @@ function serializeAttributes(element, parts) {
 /**
 * Check if a canvas element should preserve alpha channel.
 * EF-WAVEFORM always needs alpha, EF-IMAGE checks hasAlpha property.
+* EF-SURFACE needs alpha because:
+*   1. Without a target, its canvas is transparent and CSS background should show through
+*   2. The target element may have transparent content
+* Raw canvas elements must preserve alpha - we don't know what they contain.
 */
 function shouldPreserveAlpha(sourceElement) {
 	const tagName = sourceElement.tagName;
 	if (tagName === "EF-WAVEFORM") return true;
+	if (tagName === "EF-SURFACE") return true;
 	if (tagName === "EF-IMAGE") return "hasAlpha" in sourceElement && sourceElement.hasAlpha === true;
+	if (sourceElement instanceof HTMLCanvasElement) return true;
 	return false;
 }
 /**
+* Find the capture proxy canvas for an offscreen-rendered canvas.
+* When a canvas is transferred to offscreen via transferControlToOffscreen(),
+* the main thread can no longer read pixels from it. OffscreenCompositionCanvas
+* creates a hidden capture canvas (marked with data-offscreen-capture) that
+* receives ImageBitmap frames from the worker.
+*/
+function findCaptureProxy(canvas) {
+	const container = canvas.parentElement;
+	if (!container) return null;
+	return container.querySelector("canvas[data-offscreen-capture=\"true\"]");
+}
+/**
+* Read pixels directly from a WebGL canvas's drawing buffer via gl.readPixels().
+*
+* drawImage(webglCanvas) reads from the compositor's "presented" surface, which
+* is only refreshed during requestAnimationFrame / compositing cycles. In hidden
+* browser tabs, compositing is suspended, so drawImage returns stale pixels even
+* though gl.render() produced new content in the drawing buffer.
+*
+* readPixels() reads from the drawing buffer directly, bypassing the compositor.
+*
+* Returns null for non-WebGL canvases (getContext returns null when a different
+* context type is already active).
+*/
+function readWebGLPixels(canvas) {
+	const gl = canvas.getContext("webgl2") ?? canvas.getContext("webgl");
+	if (!gl) return null;
+	const width = canvas.width;
+	const height = canvas.height;
+	if (width === 0 || height === 0) return null;
+	gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+	const pixels = new Uint8Array(width * height * 4);
+	gl.readPixels(0, 0, width, height, gl.RGBA, gl.UNSIGNED_BYTE, pixels);
+	const rowSize = width * 4;
+	const halfHeight = Math.floor(height / 2);
+	const temp = new Uint8Array(rowSize);
+	for (let y = 0; y < halfHeight; y++) {
+		const topOffset = y * rowSize;
+		const bottomOffset = (height - 1 - y) * rowSize;
+		temp.set(pixels.subarray(topOffset, topOffset + rowSize));
+		pixels.set(pixels.subarray(bottomOffset, bottomOffset + rowSize), topOffset);
+		pixels.set(temp, bottomOffset);
+	}
+	return new Uint8ClampedArray(pixels.buffer);
+}
+/**
 * Create a snapshot copy of a canvas's current pixels.
 * This captures the pixels synchronously before any async encoding,
 * preventing race conditions where the source canvas is modified.
+*
+* For WebGL canvases, uses gl.readPixels() to bypass the compositor's
+* presentation layer (which is suspended in hidden browser tabs).
+*
+* For offscreen-rendered canvases, this automatically uses the capture proxy
+* canvas instead of the transferred display canvas.
 */
 function snapshotCanvas(canvas, scale, preserveAlpha) {
-	const targetWidth = Math.max(1, Math.floor(canvas.width * scale));
-	const targetHeight = Math.max(1, Math.floor(canvas.height * scale));
+	const sourceCanvas = findCaptureProxy(canvas) ?? canvas;
+	const targetWidth = Math.max(1, Math.floor(sourceCanvas.width * scale));
+	const targetHeight = Math.max(1, Math.floor(sourceCanvas.height * scale));
 	const copy = document.createElement("canvas");
 	copy.width = targetWidth;
 	copy.height = targetHeight;
 	if (preserveAlpha) copy.dataset.preserveAlpha = "true";
 	const ctx = copy.getContext("2d");
-	if (ctx && canvas.width > 0 && canvas.height > 0) ctx.drawImage(canvas, 0, 0, targetWidth, targetHeight);
+	if (ctx && sourceCanvas.width > 0 && sourceCanvas.height > 0) {
+		const glPixels = document.hidden ? readWebGLPixels(sourceCanvas) : null;
+		if (glPixels) {
+			const srcW = sourceCanvas.width;
+			const srcH = sourceCanvas.height;
+			const imageData = new ImageData(glPixels, srcW, srcH);
+			if (targetWidth === srcW && targetHeight === srcH) ctx.putImageData(imageData, 0, 0);
+			else {
+				const temp = document.createElement("canvas");
+				temp.width = srcW;
+				temp.height = srcH;
+				temp.getContext("2d").putImageData(imageData, 0, 0);
+				ctx.drawImage(temp, 0, 0, targetWidth, targetHeight);
+			}
+		} else ctx.drawImage(sourceCanvas, 0, 0, targetWidth, targetHeight);
+	}
 	return copy;
 }
 /**
 * Serialize a canvas element as an <img> with base64 data URL.
 * Creates a snapshot of current pixels before async encoding to prevent race conditions.
-* 
+*
 * OPTIMIZATION: Calculate optimal encoding resolution based on:
 * 1. CSS display size (how big it actually appears)
 * 2. Video export scale (output resolution multiplier)
 * 3. Quality multiplier (for sharpness, default 1.5x)
 */
 function serializeCanvas(sourceElement, canvas, parts, canvasJobs, options) {
-	const width = canvas.width;
-	const height = canvas.height;
+	const sourceCanvas = findCaptureProxy(canvas) ?? canvas;
+	const width = sourceCanvas.width;
+	const height = sourceCanvas.height;
 	if (width === 0 || height === 0) return;
-	const styleStr = serializeComputedStyles(sourceElement);
 	const computedStyle = getComputedStyle(sourceElement);
+	const styleStr = serializeComputedStyles(sourceElement, computedStyle);
 	const computedWidth = computedStyle.width;
 	const computedHeight = computedStyle.height;
-	const styleParts = styleStr ? styleStr.split(";").filter((s) => s.trim()) : [];
-	const hasWidth = styleParts.some((s) => s.trim().startsWith("width:"));
-	const hasHeight = styleParts.some((s) => s.trim().startsWith("height:"));
-	if (!hasWidth) styleParts.push(`width:${computedWidth || `${width}px`}`);
-	if (!hasHeight) styleParts.push(`height:${computedHeight || `${height}px`}`);
-	styleParts.push(`display:block`);
-	const finalStyle = styleParts.join(";");
+	const filteredParts = (styleStr ? styleStr.split(";").filter((s) => s.trim()) : []).filter((s) => {
+		const trimmed = s.trim();
+		return !trimmed.startsWith("width:") && !trimmed.startsWith("height:");
+	});
+	const displayWidth = computedWidth || `${width}px`;
+	const displayHeight = computedHeight || `${height}px`;
+	filteredParts.push(`width:${displayWidth}`);
+	filteredParts.push(`height:${displayHeight}`);
+	filteredParts.push(`display:block`);
+	const finalStyle = filteredParts.join(";");
 	const preserveAlpha = shouldPreserveAlpha(sourceElement);
-	let optimalScale = options.canvasScale;
-	const qualityMultiplier = 1.5;
+	let optimalScale = options.scaleConfig.exportScale;
 	try {
-		const cssWidth = parseFloat(computedWidth) || canvas.width;
-		const cssHeight = parseFloat(computedHeight) || canvas.height;
-		const displayScaleX = cssWidth / canvas.width;
-		const displayScaleY = cssHeight / canvas.height;
-		const displayScale = Math.min(displayScaleX, displayScaleY);
-		optimalScale = Math.min(1, displayScale * options.canvasScale * qualityMultiplier);
+		const cssWidth = parseFloat(computedWidth) || sourceCanvas.width;
+		const cssHeight = parseFloat(computedHeight) || sourceCanvas.height;
+		optimalScale = options.scaleConfig.computeCanvasScale({
+			naturalWidth: sourceCanvas.width,
+			naturalHeight: sourceCanvas.height,
+			displayWidth: cssWidth,
+			displayHeight: cssHeight
+		});
 	} catch (e) {
 		console.warn(`[serializeCanvas] Failed to get computed style for ${sourceElement.tagName}:`, e);
 	}
 	const snapshot = snapshotCanvas(canvas, optimalScale, preserveAlpha);
 	parts.push(`<img style="${escapeXML(finalStyle)}" src="`);
 	const promiseIndex = parts.length;
-	const sourceMap = /* @__PURE__ */ new WeakMap();
-	sourceMap.set(snapshot, sourceElement);
+	options.sourceMap.set(snapshot, sourceElement);
 	const encodePromise = encodeCanvasesInParallel([snapshot], {
 		scale: 1,
 		renderContext: options.renderContext,
-		sourceMap
+		sourceMap: options.sourceMap
 	}).then((results) => results[0]?.dataUrl || "");
 	parts.push(encodePromise);
 	canvasJobs.push({
@@ -280,7 +395,8 @@ function serializeElement(element, parts, canvasJobs, options, parentIsSVG = fal
 		serializeSlottedContent(slotHost, parts, canvasJobs, options, parentIsSVG);
 		return;
 	}
-	if (!isTemporallyVisible(element, options.timeMs)) return;
+	if (!isVisibleAtTime(element, options.timeMs)) return;
+	if (isTemporal(element) && element.style?.getPropertyValue("display") === "none") return;
 	if (element.tagName.includes("-") && element.shadowRoot) {
 		const shadowCanvas = element.shadowRoot.querySelector("canvas");
 		if (shadowCanvas) {
@@ -292,9 +408,11 @@ function serializeElement(element, parts, canvasJobs, options, parentIsSVG = fal
 			serializeImageAsCanvas(element, shadowImg, parts, canvasJobs, options);
 			return;
 		}
-		const computedDisplay = getComputedStyle(element).display;
+		const computedStyle = getComputedStyle(element);
+		let computedDisplay = computedStyle.display;
+		if (computedDisplay === "none") computedDisplay = resolveNaturalDisplay(element);
 		const containerTag = computedDisplay === "inline" || computedDisplay === "inline-block" || computedDisplay === "inline-flex" ? "span" : "div";
-		let styleStr$1 = serializeComputedStyles(element);
+		let styleStr$1 = serializeComputedStyles(element, computedStyle);
 		parts.push(`<${containerTag}`);
 		for (const attr of element.attributes) {
 			const name = attr.name.toLowerCase();
@@ -334,46 +452,84 @@ function serializeElement(element, parts, canvasJobs, options, parentIsSVG = fal
 	parts.push(`</${tagName}>`);
 }
 /**
-* Check if an element is temporally visible at the given time.
-* Returns false if the element or any ancestor is outside its temporal bounds.
+* TextEncoder instance for SVG-to-base64 encoding.
+* encode() converts to UTF-8 bytes in a single native call, then we
+* base64-encode the bytes. ~33% overhead vs ~200% for percent-encoding.
 */
-function isTemporallyVisible(element, timeMs) {
-	if (!isVisibleAtTime(element, timeMs)) return false;
-	return true;
-}
+const textEncoder = new TextEncoder();
 /**
-* Serialize a timeline element directly to XHTML string.
-* 
-* @param timeline - The timeline element to serialize (e.g., EFTimegroup)
-* @param width - Output width
-* @param height - Output height
-* @param options - Serialization options (renderContext, canvasScale, timeMs)
-* @returns XHTML string with all canvases encoded as base64 data URLs
+* Synchronous DOM capture phase. Walks the element tree, snapshots canvas
+* pixels, and kicks off async encoding. Returns parts array containing
+* string fragments and encoding promises.
+*
+* After this function returns, the source element's DOM is no longer
+* referenced — the clone can safely be seeked to the next frame.
+*
+* SCALING ARCHITECTURE (unified via ScaleConfig):
+*
+* ScaleConfig centralizes all scaling logic and provides:
+* 1. Output SVG dimensions (width * exportScale, height * exportScale)
+* 2. DOM scaling wrapper (CSS transform:scale when exportScale < 1)
+* 3. Per-canvas optimal encoding scale via computeCanvasScale()
+*
+* Canvas scaling is independent from DOM scaling because:
+* - Canvas elements have intrinsic pixel dimensions and can be downsampled
+*   efficiently before encoding (prevents encoding 1920px at full resolution
+*   when displayed at 420px)
+* - DOM content has no intrinsic resolution and must be scaled via CSS
+*   transforms, which the browser handles during SVG foreignObject rendering
+*
+* Example: 1920x1080 @ 0.5 export scale
+* - Output SVG: 960x540
+* - DOM wrapper: transform:scale(0.5) on 1920x1080 content
+* - Canvas (1920px displayed at 420px): encoded at ~0.16x (315px)
+*   via computeCanvasScale(420/1920 * 0.5 * 1.5 quality = 0.164)
 */
-async function serializeTimelineToXHTML(timeline, width, height, options) {
+function captureElementParts(element, width, height, options) {
 	const parts = [];
 	const canvasJobs = [];
-	const documentStyles = collectDocumentStyles();
-	parts.push(`<div xmlns="http://www.w3.org/1999/xhtml" style="width:${width}px;height:${height}px;overflow:hidden;position:relative;">`);
+	const sourceMap = /* @__PURE__ */ new WeakMap();
+	const scaleConfig = ScaleConfig.fromOptions(width, height, options.canvasScale);
+	const documentStyles = options.renderContext?.getCachedDocumentStyles() ?? collectDocumentStyles();
+	if (options.renderContext && documentStyles) options.renderContext.setCachedDocumentStyles(documentStyles);
+	parts.push(`<div xmlns="http://www.w3.org/1999/xhtml" style="width:${scaleConfig.outputWidth}px;height:${scaleConfig.outputHeight}px;overflow:hidden;position:relative;">`);
 	if (documentStyles) parts.push(`<style type="text/css"><![CDATA[${documentStyles}]]></style>`);
-	serializeElement(timeline, parts, canvasJobs, options);
+	const domTransform = scaleConfig.getDOMTransform();
+	if (domTransform) {
+		const wrapperDims = scaleConfig.getDOMWrapperDimensions();
+		parts.push(`<div style="transform:${domTransform};transform-origin:0 0;width:${wrapperDims.width}px;height:${wrapperDims.height}px;">`);
+	}
+	serializeElement(element, parts, canvasJobs, {
+		renderContext: options.renderContext,
+		timeMs: options.timeMs,
+		scaleConfig,
+		sourceMap
+	});
+	if (domTransform) parts.push("</div>");
 	parts.push("</div>");
-	return (await Promise.all(parts)).join("");
+	return parts;
 }
 /**
-* Serialize timeline to SVG foreignObject data URI (ready for rendering).
-* 
-* @param timeline - The timeline element to serialize
-* @param width - Output width
-* @param height - Output height
-* @param options - Serialization options
-* @returns SVG data URI
+* Synchronous capture with deferred data URI encoding.
+*
+* Walks the DOM and snapshots canvas pixels synchronously, then returns
+* a promise that resolves to the SVG data URI once async canvas-to-base64
+* encoding completes. The source element is NOT referenced after this
+* function returns — the caller can immediately mutate/seek the clone.
 */
-async function serializeTimelineToDataUri(timeline, width, height, options) {
-	const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}"><foreignObject x="0" y="0" width="${width}" height="${height}">${await serializeTimelineToXHTML(timeline, width, height, options)}</foreignObject></svg>`;
-	return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svg)}`;
+function captureTimelineToDataUri(element, width, height, options) {
+	const scaleConfig = ScaleConfig.fromOptions(width, height, options.canvasScale);
+	const parts = captureElementParts(element, width, height, options);
+	return Promise.all(parts).then((resolvedParts) => {
+		const xhtml = resolvedParts.join("");
+		const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${scaleConfig.outputWidth}" height="${scaleConfig.outputHeight}"><foreignObject x="0" y="0" width="${scaleConfig.outputWidth}" height="${scaleConfig.outputHeight}">${xhtml}</foreignObject></svg>`;
+		const bytes = textEncoder.encode(svg);
+		let binary = "";
+		for (let i = 0; i < bytes.length; i += 8192) binary += String.fromCharCode.apply(null, bytes.subarray(i, i + 8192));
+		return `data:image/svg+xml;base64,${btoa(binary)}`;
+	});
 }
 
 //#endregion
-export { serializeTimelineToDataUri };
+export { captureTimelineToDataUri };
 //# sourceMappingURL=serializeTimelineDirect.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"serializeTimelineDirect.js","names":["styleParts: string[]","styleStr","parts: Array<string | Promise<string>>","canvasJobs: CanvasJob[]"],"sources":["../../../src/preview/rendering/serializeTimelineDirect.ts"],"sourcesContent":["/**\n * Direct timeline serialization - no intermediate passive structure.\n * \n * Walks the timeline DOM once and builds XML string directly with promise parts\n * for async canvas encoding. 3x faster than DOM creation + XMLSerializer.\n * \n * Architecture:\n * 1. Walk timeline recursively\n * 2. Build array of string parts (some are promises for canvas encoding)\n * 3. Handle shadow DOM by serializing shadow content instead of light DOM\n * 4. Await all promises\n * 5. Join parts into final XML\n */\n\nimport { encodeCanvasesInParallel } from \"../encoding/canvasEncoder.js\";\nimport type { RenderContext } from \"../RenderContext.js\";\nimport { isVisibleAtTime } from \"../previewTypes.js\";\nimport { collectDocumentStyles } from \"../renderTimegroupPreview.js\";\n\n/**\n * Elements to skip entirely when serializing.\n * NOTE: SLOT is NOT skipped - it's handled specially to serialize light DOM children.\n */\nconst SKIP_TAGS = new Set([\n  \"EF-AUDIO\",\n  \"EF-THUMBNAIL-STRIP\",\n  \"EF-FILMSTRIP\",\n  \"EF-TIMELINE\",\n  \"EF-WORKBENCH\",\n  \"SCRIPT\",\n  \"STYLE\",\n  \"TEMPLATE\",\n]);\n\n\n/**\n * HTML void elements - these cannot have children and must be self-closing in XHTML.\n * Using `<br />` instead of `<br></br>`.\n */\nconst VOID_ELEMENTS = new Set([\n  \"area\", \"base\", \"br\", \"col\", \"embed\", \"hr\", \"img\", \"input\",\n  \"link\", \"meta\", \"param\", \"source\", \"track\", \"wbr\",\n]);\n\n/**\n * CSS properties to serialize as inline styles.\n */\nconst SERIALIZED_STYLE_PROPERTIES = [\n  \"display\", \"visibility\", \"opacity\",\n  \"position\", \"top\", \"right\", \"bottom\", \"left\", \"zIndex\",\n  \"width\", \"height\", \"minWidth\", \"minHeight\", \"maxWidth\", \"maxHeight\",\n  \"flexGrow\", \"flexShrink\", \"flexBasis\", \"flexDirection\", \"flexWrap\",\n  \"justifyContent\", \"alignItems\", \"alignContent\", \"alignSelf\", \"gap\",\n  \"gridTemplate\", \"gridColumn\", \"gridRow\", \"gridArea\",\n  \"margin\", \"padding\", \"boxSizing\",\n  \"border\", \"borderTop\", \"borderRight\", \"borderBottom\", \"borderLeft\", \"borderRadius\",\n  \"background\", \"color\", \"boxShadow\", \"filter\", \"backdropFilter\", \"clipPath\",\n  \"fontFamily\", \"fontSize\", \"fontWeight\", \"fontStyle\", \"fontVariant\",\n  \"textAlign\", \"textDecoration\", \"textTransform\",\n  \"letterSpacing\", \"wordSpacing\", \"whiteSpace\", \"textOverflow\", \"lineHeight\",\n  \"verticalAlign\",\n  \"transform\", \"transformOrigin\", \"transformStyle\",\n  \"perspective\", \"perspectiveOrigin\", \"backfaceVisibility\",\n  \"cursor\", \"pointerEvents\", \"userSelect\", \"overflow\", \"objectFit\", \"objectPosition\",\n] as const;\n\n/**\n * Caption child elements that should preserve display:none.\n * These use display:none for content visibility, not temporal visibility.\n */\nconst CAPTION_CHILD_TAGS = new Set([\n  'EF-CAPTIONS-ACTIVE-WORD',\n  'EF-CAPTIONS-BEFORE-ACTIVE-WORD',\n  'EF-CAPTIONS-AFTER-ACTIVE-WORD',\n  'EF-CAPTIONS-SEGMENT',\n]);\n\ninterface SerializationOptions {\n  renderContext?: RenderContext;\n  canvasScale: number;\n  timeMs: number;\n}\n\ninterface CanvasJob {\n  canvas: HTMLCanvasElement;\n  sourceElement: Element;\n  promiseIndex: number;\n}\n\n/**\n * Escape special XML characters.\n */\nfunction escapeXML(str: string): string {\n  return str\n    .replace(/&/g, '&amp;')\n    .replace(/</g, '&lt;')\n    .replace(/>/g, '&gt;')\n    .replace(/\"/g, '&quot;')\n    .replace(/'/g, '&apos;');\n}\n\n\n/**\n * Serialize computed styles as inline style string.\n * Handles display:none → block conversion for non-caption elements\n * (temporal visibility is handled separately).\n */\nfunction serializeComputedStyles(element: Element): string {\n  const styles = getComputedStyle(element);\n  const styleParts: string[] = [];\n  const tagName = element.tagName;\n  const isCaptionChild = CAPTION_CHILD_TAGS.has(tagName);\n  \n  for (const prop of SERIALIZED_STYLE_PROPERTIES) {\n    const value = styles[prop as any];\n    // Skip only truly empty values\n    if (!value || value === '') {\n      continue;\n    }\n    \n    // Handle display property specially\n    let finalValue = value;\n    if (prop === 'display') {\n      // Fix for cloned Lit elements: shadow DOM stylesheets aren't adopted properly\n      // so computed display is wrong. Use the correct values based on element type.\n      if (tagName === 'EF-TEXT') {\n        // EFText: inline-flex (or flex for split=\"line\")\n        finalValue = element.getAttribute('split') === 'line' ? 'flex' : 'inline-flex';\n      } else if (tagName === 'EF-TEXT-SEGMENT') {\n        // EFTextSegment: inline-block (or block for data-line-segment)\n        finalValue = element.hasAttribute('data-line-segment') ? 'block' : 'inline-block';\n      }\n      // For non-caption elements, convert display:none to block since temporal\n      // visibility is handled separately, not by CSS display\n      else if (value === 'none' && !isCaptionChild) {\n        finalValue = 'block';\n      }\n    }\n    \n    // Force visibility:visible - the source container may have visibility:hidden\n    // for off-screen rendering, but we want the serialized output to be visible\n    if (prop === 'visibility') {\n      finalValue = 'visible';\n    }\n    \n    // Skip clipPath - clones always render without clip-path\n    // (source may have clip-path: inset(100%) from proxy mode)\n    if (prop === 'clipPath') {\n      continue;\n    }\n    \n    // Convert camelCase to kebab-case\n    const kebab = prop.replace(/[A-Z]/g, m => `-${m.toLowerCase()}`);\n    styleParts.push(`${kebab}:${finalValue}`);\n  }\n  \n  // Disable animations/transitions to prevent re-animation\n  styleParts.push('animation:none', 'transition:none');\n  \n  return styleParts.join(';');\n}\n\n/**\n * Serialize element attributes (excluding style, id, xmlns, event handlers).\n */\nfunction serializeAttributes(element: Element, parts: Array<string | Promise<string>>): void {\n  for (const attr of element.attributes) {\n    const name = attr.name.toLowerCase();\n    // Skip: id, style, xmlns (namespace handled separately), event handlers\n    if (name === 'id' || name === 'style' || name === 'xmlns' || name.startsWith('on')) {\n      continue;\n    }\n    parts.push(` ${attr.name}=\"${escapeXML(attr.value)}\"`);\n  }\n}\n\n/**\n * Check if a canvas element should preserve alpha channel.\n * EF-WAVEFORM always needs alpha, EF-IMAGE checks hasAlpha property.\n */\nfunction shouldPreserveAlpha(sourceElement: Element): boolean {\n  const tagName = sourceElement.tagName;\n  if (tagName === 'EF-WAVEFORM') {\n    return true;\n  }\n  if (tagName === 'EF-IMAGE') {\n    return 'hasAlpha' in sourceElement && (sourceElement as any).hasAlpha === true;\n  }\n  return false;\n}\n\n/**\n * Create a snapshot copy of a canvas's current pixels.\n * This captures the pixels synchronously before any async encoding,\n * preventing race conditions where the source canvas is modified.\n */\nfunction snapshotCanvas(\n  canvas: HTMLCanvasElement,\n  scale: number,\n  preserveAlpha: boolean\n): HTMLCanvasElement {\n  const targetWidth = Math.max(1, Math.floor(canvas.width * scale));\n  const targetHeight = Math.max(1, Math.floor(canvas.height * scale));\n  \n  const copy = document.createElement('canvas');\n  copy.width = targetWidth;\n  copy.height = targetHeight;\n  \n  if (preserveAlpha) {\n    copy.dataset.preserveAlpha = 'true';\n  }\n  \n  const ctx = copy.getContext('2d');\n  if (ctx && canvas.width > 0 && canvas.height > 0) {\n    // drawImage with scaling is SYNCHRONOUS - pixels are copied immediately\n    ctx.drawImage(canvas, 0, 0, targetWidth, targetHeight);\n  }\n  \n  return copy;\n}\n\n/**\n * Serialize a canvas element as an <img> with base64 data URL.\n * Creates a snapshot of current pixels before async encoding to prevent race conditions.\n * \n * OPTIMIZATION: Calculate optimal encoding resolution based on:\n * 1. CSS display size (how big it actually appears)\n * 2. Video export scale (output resolution multiplier)\n * 3. Quality multiplier (for sharpness, default 1.5x)\n */\nfunction serializeCanvas(\n  sourceElement: Element,\n  canvas: HTMLCanvasElement,\n  parts: Array<string | Promise<string>>,\n  canvasJobs: CanvasJob[],\n  options: SerializationOptions\n): void {\n  // Use intrinsic canvas dimensions, not computed styles (which may be zoom-affected)\n  const width = canvas.width;\n  const height = canvas.height;\n  \n  // Skip empty canvases\n  if (width === 0 || height === 0) {\n    return;\n  }\n  \n  // Get all computed styles from source element\n  const styleStr = serializeComputedStyles(sourceElement);\n  \n  // Get computed dimensions from source element (respects CSS like w-[420px])\n  const computedStyle = getComputedStyle(sourceElement);\n  const computedWidth = computedStyle.width;\n  const computedHeight = computedStyle.height;\n  \n  // Use computed dimensions if available, otherwise fall back to canvas natural dimensions\n  const styleParts = styleStr ? styleStr.split(';').filter(s => s.trim()) : [];\n  \n  // Only override dimensions if they weren't already captured from computed styles\n  const hasWidth = styleParts.some(s => s.trim().startsWith('width:'));\n  const hasHeight = styleParts.some(s => s.trim().startsWith('height:'));\n  \n  if (!hasWidth) {\n    styleParts.push(`width:${computedWidth || `${width}px`}`);\n  }\n  if (!hasHeight) {\n    styleParts.push(`height:${computedHeight || `${height}px`}`);\n  }\n  styleParts.push(`display:block`);\n  \n  const finalStyle = styleParts.join(';');\n  \n  // Check if we need to preserve alpha channel\n  const preserveAlpha = shouldPreserveAlpha(sourceElement);\n  \n  // CRITICAL: Calculate optimal encoding scale BEFORE creating snapshot.\n  // This prevents encoding at full resolution when CSS display size is much smaller.\n  let optimalScale = options.canvasScale; // Start with video export scale\n  const qualityMultiplier = 1.5; // Encode at 1.5x display size for quality\n  \n  try {\n    const cssWidth = parseFloat(computedWidth) || canvas.width;\n    const cssHeight = parseFloat(computedHeight) || canvas.height;\n    \n    // Calculate how much smaller the display is vs natural size\n    const displayScaleX = cssWidth / canvas.width;\n    const displayScaleY = cssHeight / canvas.height;\n    const displayScale = Math.min(displayScaleX, displayScaleY);\n    \n    // Combine display scale, video scale, and quality multiplier\n    // Clamp to 1.0 max (never upscale beyond natural resolution)\n    optimalScale = Math.min(1.0, displayScale * options.canvasScale * qualityMultiplier);\n  } catch (e) {\n    // Fallback to just video scale if we can't get computed style\n    console.warn(`[serializeCanvas] Failed to get computed style for ${sourceElement.tagName}:`, e);\n  }\n  \n  // CRITICAL: Create a snapshot of canvas pixels SYNCHRONOUSLY before any async work.\n  // This prevents race conditions where concurrent renders overwrite the shared\n  // shadow canvas while encoding is in progress.\n  const snapshot = snapshotCanvas(canvas, optimalScale, preserveAlpha);\n  \n  // Open img tag with all styles from source element\n  parts.push(`<img style=\"${escapeXML(finalStyle)}\" src=\"`);\n  \n  // Kick off async encoding of the SNAPSHOT (not the live canvas)\n  const promiseIndex = parts.length;\n  const sourceMap = new WeakMap<HTMLCanvasElement, Element>();\n  sourceMap.set(snapshot, sourceElement);\n  \n  // Snapshot is already scaled, so encode at 1.0 scale\n  const encodePromise = encodeCanvasesInParallel([snapshot], {\n    scale: 1.0,\n    renderContext: options.renderContext,\n    sourceMap,\n  }).then(results => results[0]?.dataUrl || '');\n  \n  parts.push(encodePromise);\n  canvasJobs.push({ canvas: snapshot, sourceElement, promiseIndex });\n  \n  // Close img tag\n  parts.push('\" />');\n}\n\n/**\n * Serialize an image element as a canvas (for shadow DOM img elements).\n */\nfunction serializeImageAsCanvas(\n  sourceElement: Element,\n  img: HTMLImageElement,\n  parts: Array<string | Promise<string>>,\n  canvasJobs: CanvasJob[],\n  options: SerializationOptions\n): void {\n  // Convert img to canvas for serialization\n  const canvas = document.createElement('canvas');\n  canvas.width = img.naturalWidth;\n  canvas.height = img.naturalHeight;\n  \n  const ctx = canvas.getContext('2d');\n  if (ctx) {\n    try {\n      ctx.drawImage(img, 0, 0);\n    } catch (e) {\n      // Cross-origin image - skip\n      return;\n    }\n  }\n  \n  serializeCanvas(sourceElement, canvas, parts, canvasJobs, options);\n}\n\n/**\n * Serialize slotted light DOM children of a host element.\n */\nfunction serializeSlottedContent(\n  slotHost: Element,\n  parts: Array<string | Promise<string>>,\n  canvasJobs: CanvasJob[],\n  options: SerializationOptions,\n  parentIsSVG: boolean\n): void {\n  for (const slottedChild of slotHost.childNodes) {\n    if (slottedChild.nodeType === Node.TEXT_NODE) {\n      const text = slottedChild.textContent;\n      if (text && text.length > 0) {\n        parts.push(escapeXML(text));\n      }\n    } else if (slottedChild.nodeType === Node.ELEMENT_NODE) {\n      serializeElement(slottedChild as Element, parts, canvasJobs, options, parentIsSVG, null);\n    }\n  }\n}\n\n/**\n * Recursively serialize an element and its children to XML parts.\n * @param slotHost - When serializing inside shadow DOM, the custom element whose light DOM children should be serialized for slots\n */\nfunction serializeElement(\n  element: Element,\n  parts: Array<string | Promise<string>>,\n  canvasJobs: CanvasJob[],\n  options: SerializationOptions,\n  parentIsSVG = false,\n  slotHost: Element | null = null\n): void {\n  // Skip certain elements\n  if (SKIP_TAGS.has(element.tagName)) {\n    return;\n  }\n  \n  // Handle SLOT elements - serialize light DOM children of the slot host\n  if (element.tagName === 'SLOT' && slotHost) {\n    serializeSlottedContent(slotHost, parts, canvasJobs, options, parentIsSVG);\n    return;\n  }\n  \n  // Check temporal visibility - skip elements outside their time bounds\n  // This is non-destructive (doesn't modify DOM)\n  // NOTE: We do NOT check CSS visibility/display here because:\n  // 1. The container may have visibility:hidden for off-screen rendering\n  // 2. Temporal elements control their own visibility via time bounds\n  if (!isTemporallyVisible(element, options.timeMs)) {\n    return;\n  }\n  \n  // Custom element with shadow DOM?\n  const isCustom = element.tagName.includes('-');\n  if (isCustom && element.shadowRoot) {\n    const shadowCanvas = element.shadowRoot.querySelector('canvas');\n    if (shadowCanvas) {\n      serializeCanvas(element, shadowCanvas, parts, canvasJobs, options);\n      return;\n    }\n    \n    const shadowImg = element.shadowRoot.querySelector('img');\n    if (shadowImg?.complete && shadowImg.naturalWidth > 0) {\n      serializeImageAsCanvas(element, shadowImg, parts, canvasJobs, options);\n      return;\n    }\n    \n    // Serialize custom element with its styles, then shadow DOM content inside\n    // Use span for inline/inline-block/inline-flex elements to preserve inline behavior\n    const computedDisplay = getComputedStyle(element).display;\n    const isInline = computedDisplay === 'inline' || computedDisplay === 'inline-block' || computedDisplay === 'inline-flex';\n    const containerTag = isInline ? 'span' : 'div';\n    \n    let styleStr = serializeComputedStyles(element);\n    \n    \n    parts.push(`<${containerTag}`);\n    \n    // Copy data attributes and class from custom element\n    for (const attr of element.attributes) {\n      const name = attr.name.toLowerCase();\n      if (name === 'class' || name.startsWith('data-')) {\n        parts.push(` ${attr.name}=\"${escapeXML(attr.value)}\"`);\n      }\n    }\n    \n    if (styleStr) {\n      parts.push(` style=\"${escapeXML(styleStr)}\"`);\n    }\n    parts.push('>');\n    \n    // Serialize shadow DOM content with this element as the slot host\n    for (const child of element.shadowRoot.childNodes) {\n      if (child.nodeType === Node.TEXT_NODE) {\n        const text = child.textContent;\n        if (text && text.length > 0) {\n          parts.push(escapeXML(text));\n        }\n      } else if (child.nodeType === Node.ELEMENT_NODE) {\n        // Pass this element as slotHost so nested SLOTs can access light DOM children\n        serializeElement(child as Element, parts, canvasJobs, options, parentIsSVG, element);\n      }\n    }\n    \n    parts.push(`</${containerTag}>`);\n    return;\n  }\n  \n  // Raw canvas in light DOM\n  if (element instanceof HTMLCanvasElement) {\n    serializeCanvas(element, element, parts, canvasJobs, options);\n    return;\n  }\n  \n  // Standard element - serialize to XHTML\n  const tagName = element.tagName.toLowerCase();\n  const isSVG = element instanceof SVGElement;\n  const isVoid = VOID_ELEMENTS.has(tagName);\n  \n  // Open tag with namespace (only add xmlns for root SVG elements, not children)\n  if (isSVG && !parentIsSVG) {\n    // Root SVG element - needs xmlns declaration\n    parts.push(`<${tagName} xmlns=\"http://www.w3.org/2000/svg\"`);\n  } else {\n    parts.push(`<${tagName}`);\n  }\n  \n  // Attributes\n  serializeAttributes(element, parts);\n  \n  // Computed styles as inline style attribute\n  const styleStr = serializeComputedStyles(element);\n  if (styleStr) {\n    parts.push(` style=\"${escapeXML(styleStr)}\"`);\n  }\n  \n  // Void elements: self-close with /> (XHTML requirement)\n  if (isVoid) {\n    parts.push(' />');\n    return;\n  }\n  \n  parts.push('>');\n  \n  // Children (shadow or light)\n  const children = element.shadowRoot?.childNodes || element.childNodes;\n  for (const child of children) {\n    if (child.nodeType === Node.TEXT_NODE) {\n      const text = child.textContent;\n      if (text && text.length > 0) {\n        parts.push(escapeXML(text));\n      }\n    } else if (child.nodeType === Node.ELEMENT_NODE) {\n      // Preserve slotHost when recursing into standard elements inside shadow DOM\n      serializeElement(child as Element, parts, canvasJobs, options, isSVG, slotHost);\n    }\n  }\n  \n  // Close tag\n  parts.push(`</${tagName}>`);\n}\n\n/**\n * Check if an element is temporally visible at the given time.\n * Returns false if the element or any ancestor is outside its temporal bounds.\n */\nfunction isTemporallyVisible(element: Element, timeMs: number): boolean {\n  // Check this element's temporal bounds\n  if (!isVisibleAtTime(element, timeMs)) {\n    return false;\n  }\n  return true;\n}\n\n/**\n * Serialize a timeline element directly to XHTML string.\n * \n * @param timeline - The timeline element to serialize (e.g., EFTimegroup)\n * @param width - Output width\n * @param height - Output height\n * @param options - Serialization options (renderContext, canvasScale, timeMs)\n * @returns XHTML string with all canvases encoded as base64 data URLs\n */\nexport async function serializeTimelineToXHTML(\n  timeline: Element,\n  width: number,\n  height: number,\n  options: SerializationOptions\n): Promise<string> {\n  // Note: Temporal visibility is checked non-destructively during serialization\n  // We do NOT modify the source DOM - this allows serializing the main timeline safely\n  \n  const parts: Array<string | Promise<string>> = [];\n  const canvasJobs: CanvasJob[] = [];\n  \n  // Collect document styles for proper CSS cascade\n  const documentStyles = collectDocumentStyles();\n  \n  // Open wrapper div with embedded styles\n  parts.push(\n    `<div xmlns=\"http://www.w3.org/1999/xhtml\" ` +\n    `style=\"width:${width}px;height:${height}px;overflow:hidden;position:relative;\">`\n  );\n  \n  // Inject document styles (CSS content is wrapped in CDATA to avoid XML escaping issues)\n  if (documentStyles) {\n    parts.push(`<style type=\"text/css\"><![CDATA[${documentStyles}]]></style>`);\n  }\n  \n  // Recursively serialize timeline\n  serializeElement(timeline, parts, canvasJobs, options);\n  \n  // Close wrapper\n  parts.push('</div>');\n  \n  // Wait for all canvas encodings to complete\n  const resolvedParts = await Promise.all(parts);\n  \n  // Join into final XHTML string\n  const xhtml = resolvedParts.join('');\n  \n  return xhtml;\n}\n\n/**\n * Serialize timeline to SVG foreignObject data URI (ready for rendering).\n * \n * @param timeline - The timeline element to serialize\n * @param width - Output width\n * @param height - Output height\n * @param options - Serialization options\n * @returns SVG data URI\n */\nexport async function serializeTimelineToDataUri(\n  timeline: Element,\n  width: number,\n  height: number,\n  options: SerializationOptions\n): Promise<string> {\n  const xhtml = await serializeTimelineToXHTML(timeline, width, height, options);\n  \n  // Wrap in SVG foreignObject\n  // Use explicit pixel dimensions for foreignObject to match SVG viewport exactly\n  const svg = \n    `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"${width}\" height=\"${height}\">` +\n    `<foreignObject x=\"0\" y=\"0\" width=\"${width}\" height=\"${height}\">${xhtml}</foreignObject>` +\n    `</svg>`;\n  \n  // Use percent-encoding instead of base64 for faster encoding\n  // encodeURIComponent is faster than btoa(unescape(encodeURIComponent()))\n  return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svg)}`;\n}\n"],"mappings":"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"}
+{"version":3,"file":"serializeTimelineDirect.js","names":["rules: string[]","styleParts: string[]","styleStr","parts: Array<string | Promise<string>>","canvasJobs: CanvasJob[]"],"sources":["../../../src/preview/rendering/serializeTimelineDirect.ts"],"sourcesContent":["/**\n * Direct timeline serialization - no intermediate passive structure.\n *\n * Walks the timeline DOM once and builds XML string directly with promise parts\n * for async canvas encoding. 3x faster than DOM creation + XMLSerializer.\n *\n * Architecture:\n * 1. Walk timeline recursively\n * 2. Build array of string parts (some are promises for canvas encoding)\n * 3. Handle shadow DOM by serializing shadow content instead of light DOM\n * 4. Await all promises\n * 5. Join parts into final XML\n */\n\nimport { encodeCanvasesInParallel } from \"../encoding/canvasEncoder.js\";\nimport type { RenderContext } from \"../RenderContext.js\";\nimport { isTemporal, isVisibleAtTime } from \"../previewTypes.js\";\nimport { ScaleConfig } from \"./ScaleConfig.js\";\n\n/**\n * Collect document styles for shadow DOM injection.\n */\nfunction collectDocumentStyles(): string {\n  const rules: string[] = [];\n  try {\n    for (const sheet of document.styleSheets) {\n      try {\n        if (sheet.cssRules) {\n          for (const rule of sheet.cssRules) {\n            rules.push(rule.cssText);\n          }\n        }\n      } catch {\n        // Expected: cross-origin stylesheets block cssRules access\n      }\n    }\n  } catch (e) {\n    console.warn(\n      \"[collectDocumentStyles] Failed to access document.styleSheets:\",\n      e,\n    );\n  }\n  return rules.join(\"\\n\");\n}\n\n/**\n * Elements to skip entirely when serializing.\n * NOTE: SLOT is NOT skipped - it's handled specially to serialize light DOM children.\n */\nconst SKIP_TAGS = new Set([\n  \"EF-AUDIO\",\n  \"EF-THUMBNAIL-STRIP\",\n  \"EF-FILMSTRIP\",\n  \"EF-TIMELINE\",\n  \"EF-WORKBENCH\",\n  \"SCRIPT\",\n  \"STYLE\",\n  \"TEMPLATE\",\n]);\n\n/**\n * HTML void elements - these cannot have children and must be self-closing in XHTML.\n * Using `<br />` instead of `<br></br>`.\n */\nconst VOID_ELEMENTS = new Set([\n  \"area\",\n  \"base\",\n  \"br\",\n  \"col\",\n  \"embed\",\n  \"hr\",\n  \"img\",\n  \"input\",\n  \"link\",\n  \"meta\",\n  \"param\",\n  \"source\",\n  \"track\",\n  \"wbr\",\n]);\n\n/**\n * CSS properties to serialize as inline styles.\n */\nconst SERIALIZED_STYLE_PROPERTIES = [\n  \"display\",\n  \"visibility\",\n  \"opacity\",\n  \"position\",\n  \"top\",\n  \"right\",\n  \"bottom\",\n  \"left\",\n  \"zIndex\",\n  \"width\",\n  \"height\",\n  \"minWidth\",\n  \"minHeight\",\n  \"maxWidth\",\n  \"maxHeight\",\n  \"flexGrow\",\n  \"flexShrink\",\n  \"flexBasis\",\n  \"flexDirection\",\n  \"flexWrap\",\n  \"justifyContent\",\n  \"alignItems\",\n  \"alignContent\",\n  \"alignSelf\",\n  \"gap\",\n  \"gridTemplate\",\n  \"gridColumn\",\n  \"gridRow\",\n  \"gridArea\",\n  \"margin\",\n  \"padding\",\n  \"boxSizing\",\n  \"border\",\n  \"borderTop\",\n  \"borderRight\",\n  \"borderBottom\",\n  \"borderLeft\",\n  \"borderRadius\",\n  \"background\",\n  \"color\",\n  \"boxShadow\",\n  \"filter\",\n  \"backdropFilter\",\n  \"clipPath\",\n  \"fontFamily\",\n  \"fontSize\",\n  \"fontWeight\",\n  \"fontStyle\",\n  \"fontVariant\",\n  \"textAlign\",\n  \"textDecoration\",\n  \"textTransform\",\n  \"letterSpacing\",\n  \"wordSpacing\",\n  \"whiteSpace\",\n  \"textOverflow\",\n  \"lineHeight\",\n  \"verticalAlign\",\n  \"transform\",\n  \"transformOrigin\",\n  \"transformStyle\",\n  \"perspective\",\n  \"perspectiveOrigin\",\n  \"backfaceVisibility\",\n  \"cursor\",\n  \"pointerEvents\",\n  \"userSelect\",\n  \"overflow\",\n  \"objectFit\",\n  \"objectPosition\",\n] as const;\n\n/**\n * Caption child elements that should preserve display:none.\n * These use display:none for content visibility, not temporal visibility.\n */\nconst CAPTION_CHILD_TAGS = new Set([\n  \"EF-CAPTIONS-ACTIVE-WORD\",\n  \"EF-CAPTIONS-BEFORE-ACTIVE-WORD\",\n  \"EF-CAPTIONS-AFTER-ACTIVE-WORD\",\n  \"EF-CAPTIONS-SEGMENT\",\n]);\n\ninterface SerializationOptions {\n  renderContext?: RenderContext;\n  canvasScale: number;\n  timeMs: number;\n}\n\ninterface InternalSerializationOptions {\n  renderContext?: RenderContext;\n  timeMs: number;\n  scaleConfig: ScaleConfig;\n  sourceMap: WeakMap<HTMLCanvasElement, Element>;\n}\n\ninterface CanvasJob {\n  canvas: HTMLCanvasElement;\n  sourceElement: Element;\n  promiseIndex: number;\n}\n\n/**\n * Escape special XML characters.\n */\nfunction escapeXML(str: string): string {\n  return str\n    .replace(/&/g, \"&amp;\")\n    .replace(/</g, \"&lt;\")\n    .replace(/>/g, \"&gt;\")\n    .replace(/\"/g, \"&quot;\")\n    .replace(/'/g, \"&apos;\");\n}\n\n/**\n * Resolve the natural display value for an element that has display:none\n * set as an inline style (e.g., from temporal visibility via updateAnimations).\n *\n * Temporarily removes the inline display override so getComputedStyle falls\n * through to the element's stylesheet rules (including shadow DOM :host styles),\n * reads the natural value, then restores the override.\n */\nfunction resolveNaturalDisplay(element: Element): string {\n  const htmlEl = element as HTMLElement;\n  const inlineDisplay = htmlEl.style?.getPropertyValue(\"display\");\n  if (inlineDisplay === \"none\" && htmlEl.style) {\n    htmlEl.style.removeProperty(\"display\");\n    const natural = getComputedStyle(element).getPropertyValue(\"display\");\n    htmlEl.style.setProperty(\"display\", \"none\");\n    return natural || \"block\";\n  }\n  return \"block\";\n}\n\n/**\n * Serialize computed styles as inline style string.\n * Handles display:none recovery for non-caption elements by resolving\n * the element's natural display value from its stylesheet rules.\n * @param element - The element to serialize styles for\n * @param styles - Optional pre-computed CSSStyleDeclaration (avoids redundant getComputedStyle calls)\n */\nfunction serializeComputedStyles(\n  element: Element,\n  styles?: CSSStyleDeclaration,\n): string {\n  const computed = styles ?? getComputedStyle(element);\n  const styleParts: string[] = [];\n  const tagName = element.tagName;\n  const isCaptionChild = CAPTION_CHILD_TAGS.has(tagName);\n\n  // Check if the element has explicit width/height in its inline style.\n  // For elements that auto-size to content (inline, inline-block text),\n  // serializing the computed \"used\" pixel width/height would lock them to\n  // exact dimensions that may not match the foreignObject rendering context,\n  // causing text wrapping when font metrics differ slightly.\n  const htmlEl = element as HTMLElement;\n  const hasExplicitWidth = !!htmlEl.style?.getPropertyValue(\"width\");\n  const hasExplicitHeight = !!htmlEl.style?.getPropertyValue(\"height\");\n\n  for (const prop of SERIALIZED_STYLE_PROPERTIES) {\n    // Convert camelCase to kebab-case first\n    const kebab = prop.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);\n    const value = computed.getPropertyValue(kebab);\n\n    // Skip only truly empty values\n    if (!value || value === \"\") {\n      continue;\n    }\n\n    // Handle display property specially\n    let finalValue = value;\n    if (prop === \"display\") {\n      // For non-caption elements, recover the natural display value when display:none\n      // was set by the temporal visibility system (updateAnimations). This prevents\n      // inline elements (like ef-text-segment) from being serialized as display:block.\n      if (value === \"none\" && !isCaptionChild) {\n        finalValue = resolveNaturalDisplay(element);\n      }\n    }\n\n    // Force visibility:visible - the source container may have visibility:hidden\n    // for off-screen rendering, but we want the serialized output to be visible\n    if (prop === \"visibility\") {\n      finalValue = \"visible\";\n    }\n\n    // Skip clipPath - clones always render without clip-path\n    // (source may have clip-path: inset(100%) from proxy mode)\n    if (prop === \"clipPath\") {\n      continue;\n    }\n\n    // Skip width/height when not explicitly set on the element.\n    // getComputedStyle returns \"used\" pixel values for width/height even when\n    // the specified value is auto. Serializing these pixel values locks\n    // content-sized elements (text segments, inline-block spans) to exact\n    // dimensions, which breaks when the foreignObject context renders text\n    // with different font metrics.\n    if (prop === \"width\" && !hasExplicitWidth) {\n      continue;\n    }\n    if (prop === \"height\" && !hasExplicitHeight) {\n      continue;\n    }\n\n    styleParts.push(`${kebab}:${finalValue}`);\n  }\n\n  // Disable animations/transitions to prevent re-animation\n  styleParts.push(\"animation:none\", \"transition:none\");\n\n  return styleParts.join(\";\");\n}\n\n/**\n * Serialize element attributes (excluding style, id, xmlns, event handlers).\n */\nfunction serializeAttributes(\n  element: Element,\n  parts: Array<string | Promise<string>>,\n): void {\n  for (const attr of element.attributes) {\n    const name = attr.name.toLowerCase();\n    // Skip: id, style, xmlns (namespace handled separately), event handlers\n    if (\n      name === \"id\" ||\n      name === \"style\" ||\n      name === \"xmlns\" ||\n      name.startsWith(\"on\")\n    ) {\n      continue;\n    }\n    parts.push(` ${attr.name}=\"${escapeXML(attr.value)}\"`);\n  }\n}\n\n/**\n * Check if a canvas element should preserve alpha channel.\n * EF-WAVEFORM always needs alpha, EF-IMAGE checks hasAlpha property.\n * EF-SURFACE needs alpha because:\n *   1. Without a target, its canvas is transparent and CSS background should show through\n *   2. The target element may have transparent content\n * Raw canvas elements must preserve alpha - we don't know what they contain.\n */\nfunction shouldPreserveAlpha(sourceElement: Element): boolean {\n  const tagName = sourceElement.tagName;\n  if (tagName === \"EF-WAVEFORM\") {\n    return true;\n  }\n  if (tagName === \"EF-SURFACE\") {\n    // Surface needs alpha to allow CSS background to show through empty areas\n    return true;\n  }\n  if (tagName === \"EF-IMAGE\") {\n    return (\n      \"hasAlpha\" in sourceElement && (sourceElement as any).hasAlpha === true\n    );\n  }\n  // Raw canvas elements must preserve alpha\n  if (sourceElement instanceof HTMLCanvasElement) {\n    return true;\n  }\n  return false;\n}\n\n/**\n * Find the capture proxy canvas for an offscreen-rendered canvas.\n * When a canvas is transferred to offscreen via transferControlToOffscreen(),\n * the main thread can no longer read pixels from it. OffscreenCompositionCanvas\n * creates a hidden capture canvas (marked with data-offscreen-capture) that\n * receives ImageBitmap frames from the worker.\n */\nfunction findCaptureProxy(canvas: HTMLCanvasElement): HTMLCanvasElement | null {\n  const container = canvas.parentElement;\n  if (!container) return null;\n  return container.querySelector('canvas[data-offscreen-capture=\"true\"]');\n}\n\n/**\n * Read pixels directly from a WebGL canvas's drawing buffer via gl.readPixels().\n *\n * drawImage(webglCanvas) reads from the compositor's \"presented\" surface, which\n * is only refreshed during requestAnimationFrame / compositing cycles. In hidden\n * browser tabs, compositing is suspended, so drawImage returns stale pixels even\n * though gl.render() produced new content in the drawing buffer.\n *\n * readPixels() reads from the drawing buffer directly, bypassing the compositor.\n *\n * Returns null for non-WebGL canvases (getContext returns null when a different\n * context type is already active).\n */\nfunction readWebGLPixels(canvas: HTMLCanvasElement): Uint8ClampedArray | null {\n  const gl = (canvas.getContext(\"webgl2\") ??\n    canvas.getContext(\"webgl\")) as WebGLRenderingContext | null;\n  if (!gl) return null;\n\n  const width = canvas.width;\n  const height = canvas.height;\n  if (width === 0 || height === 0) return null;\n\n  // Ensure we read from the drawing buffer, not a leftover FBO\n  gl.bindFramebuffer(gl.FRAMEBUFFER, null);\n\n  const pixels = new Uint8Array(width * height * 4);\n  gl.readPixels(0, 0, width, height, gl.RGBA, gl.UNSIGNED_BYTE, pixels);\n\n  // readPixels returns rows bottom-to-top; flip to top-to-bottom for ImageData\n  const rowSize = width * 4;\n  const halfHeight = Math.floor(height / 2);\n  const temp = new Uint8Array(rowSize);\n  for (let y = 0; y < halfHeight; y++) {\n    const topOffset = y * rowSize;\n    const bottomOffset = (height - 1 - y) * rowSize;\n    temp.set(pixels.subarray(topOffset, topOffset + rowSize));\n    pixels.set(\n      pixels.subarray(bottomOffset, bottomOffset + rowSize),\n      topOffset,\n    );\n    pixels.set(temp, bottomOffset);\n  }\n\n  return new Uint8ClampedArray(pixels.buffer);\n}\n\n/**\n * Create a snapshot copy of a canvas's current pixels.\n * This captures the pixels synchronously before any async encoding,\n * preventing race conditions where the source canvas is modified.\n *\n * For WebGL canvases, uses gl.readPixels() to bypass the compositor's\n * presentation layer (which is suspended in hidden browser tabs).\n *\n * For offscreen-rendered canvases, this automatically uses the capture proxy\n * canvas instead of the transferred display canvas.\n */\nfunction snapshotCanvas(\n  canvas: HTMLCanvasElement,\n  scale: number,\n  preserveAlpha: boolean,\n): HTMLCanvasElement {\n  // If this canvas was transferred to offscreen, use its capture proxy\n  const captureProxy = findCaptureProxy(canvas);\n  const sourceCanvas = captureProxy ?? canvas;\n\n  const targetWidth = Math.max(1, Math.floor(sourceCanvas.width * scale));\n  const targetHeight = Math.max(1, Math.floor(sourceCanvas.height * scale));\n\n  const copy = document.createElement(\"canvas\");\n  copy.width = targetWidth;\n  copy.height = targetHeight;\n\n  if (preserveAlpha) {\n    copy.dataset.preserveAlpha = \"true\";\n  }\n\n  const ctx = copy.getContext(\"2d\");\n  if (ctx && sourceCanvas.width > 0 && sourceCanvas.height > 0) {\n    // Try reading directly from WebGL drawing buffer (bypasses compositor)\n    // Only needed when page is hidden - compositor is suspended in hidden tabs\n    const useGlBypass = document.hidden;\n    const glPixels = useGlBypass ? readWebGLPixels(sourceCanvas) : null;\n    if (glPixels) {\n      const srcW = sourceCanvas.width;\n      const srcH = sourceCanvas.height;\n      const imageData = new ImageData(\n        glPixels as unknown as Uint8ClampedArray<ArrayBuffer>,\n        srcW,\n        srcH,\n      );\n\n      if (targetWidth === srcW && targetHeight === srcH) {\n        ctx.putImageData(imageData, 0, 0);\n      } else {\n        // putImageData doesn't scale — bounce through a temp canvas\n        const temp = document.createElement(\"canvas\");\n        temp.width = srcW;\n        temp.height = srcH;\n        temp.getContext(\"2d\")!.putImageData(imageData, 0, 0);\n        ctx.drawImage(temp, 0, 0, targetWidth, targetHeight);\n      }\n    } else {\n      // Non-WebGL canvas: drawImage is synchronous and correct\n      ctx.drawImage(sourceCanvas, 0, 0, targetWidth, targetHeight);\n    }\n  }\n\n  return copy;\n}\n\n/**\n * Serialize a canvas element as an <img> with base64 data URL.\n * Creates a snapshot of current pixels before async encoding to prevent race conditions.\n *\n * OPTIMIZATION: Calculate optimal encoding resolution based on:\n * 1. CSS display size (how big it actually appears)\n * 2. Video export scale (output resolution multiplier)\n * 3. Quality multiplier (for sharpness, default 1.5x)\n */\nfunction serializeCanvas(\n  sourceElement: Element,\n  canvas: HTMLCanvasElement,\n  parts: Array<string | Promise<string>>,\n  canvasJobs: CanvasJob[],\n  options: InternalSerializationOptions,\n): void {\n  // If this canvas was transferred to offscreen, use its capture proxy\n  const captureProxy = findCaptureProxy(canvas);\n  const sourceCanvas = captureProxy ?? canvas;\n\n  // Use intrinsic canvas dimensions, not computed styles (which may be zoom-affected)\n  const width = sourceCanvas.width;\n  const height = sourceCanvas.height;\n\n  // Skip empty canvases\n  if (width === 0 || height === 0) {\n    return;\n  }\n\n  // Get computed style once and reuse\n  const computedStyle = getComputedStyle(sourceElement);\n  const styleStr = serializeComputedStyles(sourceElement, computedStyle);\n\n  // Get computed dimensions from source element (respects CSS like w-[420px])\n  const computedWidth = computedStyle.width;\n  const computedHeight = computedStyle.height;\n\n  // Preserve the source element's object-fit and object-position for correct scaling.\n  // These CSS properties control how the canvas content fits its container and must be\n  // carried through to the serialized <img> to maintain visual fidelity.\n  const styleParts = styleStr\n    ? styleStr.split(\";\").filter((s) => s.trim())\n    : [];\n\n  // Remove width/height from computed styles (we'll set them explicitly from computed dimensions)\n  const filteredParts = styleParts.filter((s) => {\n    const trimmed = s.trim();\n    return !trimmed.startsWith(\"width:\") && !trimmed.startsWith(\"height:\");\n  });\n\n  // Use host element dimensions if available, otherwise fall back to canvas natural dimensions\n  const displayWidth = computedWidth || `${width}px`;\n  const displayHeight = computedHeight || `${height}px`;\n\n  filteredParts.push(`width:${displayWidth}`);\n  filteredParts.push(`height:${displayHeight}`);\n  filteredParts.push(`display:block`);\n\n  const finalStyle = filteredParts.join(\";\");\n\n  // Check if we need to preserve alpha channel\n  const preserveAlpha = shouldPreserveAlpha(sourceElement);\n\n  // CRITICAL: Calculate optimal encoding scale BEFORE creating snapshot.\n  // This prevents encoding at full resolution when CSS display size is much smaller.\n  let optimalScale = options.scaleConfig.exportScale; // Start with export scale as fallback\n\n  try {\n    const cssWidth = parseFloat(computedWidth) || sourceCanvas.width;\n    const cssHeight = parseFloat(computedHeight) || sourceCanvas.height;\n\n    // Use ScaleConfig to compute optimal canvas scale\n    optimalScale = options.scaleConfig.computeCanvasScale({\n      naturalWidth: sourceCanvas.width,\n      naturalHeight: sourceCanvas.height,\n      displayWidth: cssWidth,\n      displayHeight: cssHeight,\n    });\n  } catch (e) {\n    // Fallback to export scale if we can't get computed style\n    console.warn(\n      `[serializeCanvas] Failed to get computed style for ${sourceElement.tagName}:`,\n      e,\n    );\n  }\n\n  // CRITICAL: Create a snapshot of canvas pixels SYNCHRONOUSLY before any async work.\n  // This prevents race conditions where concurrent renders overwrite the shared\n  // shadow canvas while encoding is in progress.\n  // Note: snapshotCanvas already handles finding the capture proxy internally\n  const snapshot = snapshotCanvas(canvas, optimalScale, preserveAlpha);\n\n  // Open img tag with all styles from source element\n  parts.push(`<img style=\"${escapeXML(finalStyle)}\" src=\"`);\n\n  // Kick off async encoding of the SNAPSHOT (not the live canvas)\n  const promiseIndex = parts.length;\n  options.sourceMap.set(snapshot, sourceElement);\n\n  // Snapshot is already scaled, so encode at 1.0 scale\n  const encodePromise = encodeCanvasesInParallel([snapshot], {\n    scale: 1.0,\n    renderContext: options.renderContext,\n    sourceMap: options.sourceMap,\n  }).then((results) => results[0]?.dataUrl || \"\");\n\n  parts.push(encodePromise);\n  canvasJobs.push({ canvas: snapshot, sourceElement, promiseIndex });\n\n  // Close img tag\n  parts.push('\" />');\n}\n\n/**\n * Serialize an image element as a canvas (for shadow DOM img elements).\n */\nfunction serializeImageAsCanvas(\n  sourceElement: Element,\n  img: HTMLImageElement,\n  parts: Array<string | Promise<string>>,\n  canvasJobs: CanvasJob[],\n  options: InternalSerializationOptions,\n): void {\n  // Convert img to canvas for serialization\n  const canvas = document.createElement(\"canvas\");\n  canvas.width = img.naturalWidth;\n  canvas.height = img.naturalHeight;\n\n  const ctx = canvas.getContext(\"2d\");\n  if (ctx) {\n    try {\n      ctx.drawImage(img, 0, 0);\n    } catch (e) {\n      // Cross-origin image - skip\n      return;\n    }\n  }\n\n  serializeCanvas(sourceElement, canvas, parts, canvasJobs, options);\n}\n\n/**\n * Serialize slotted light DOM children of a host element.\n */\nfunction serializeSlottedContent(\n  slotHost: Element,\n  parts: Array<string | Promise<string>>,\n  canvasJobs: CanvasJob[],\n  options: InternalSerializationOptions,\n  parentIsSVG: boolean,\n): void {\n  for (const slottedChild of slotHost.childNodes) {\n    if (slottedChild.nodeType === Node.TEXT_NODE) {\n      const text = slottedChild.textContent;\n      if (text && text.length > 0) {\n        parts.push(escapeXML(text));\n      }\n    } else if (slottedChild.nodeType === Node.ELEMENT_NODE) {\n      serializeElement(\n        slottedChild as Element,\n        parts,\n        canvasJobs,\n        options,\n        parentIsSVG,\n        null,\n      );\n    }\n  }\n}\n\n/**\n * Recursively serialize an element and its children to XML parts.\n * @param slotHost - When serializing inside shadow DOM, the custom element whose light DOM children should be serialized for slots\n */\nfunction serializeElement(\n  element: Element,\n  parts: Array<string | Promise<string>>,\n  canvasJobs: CanvasJob[],\n  options: InternalSerializationOptions,\n  parentIsSVG = false,\n  slotHost: Element | null = null,\n): void {\n  // Skip certain elements\n  if (SKIP_TAGS.has(element.tagName)) {\n    return;\n  }\n\n  // Handle SLOT elements - serialize light DOM children of the slot host\n  if (element.tagName === \"SLOT\" && slotHost) {\n    serializeSlottedContent(slotHost, parts, canvasJobs, options, parentIsSVG);\n    return;\n  }\n\n  // Check temporal visibility - skip elements outside their time bounds\n  // This is non-destructive (doesn't modify DOM)\n  // NOTE: Ancestor checking is unnecessary - serializeElement walks top-down,\n  // so if a parent is temporally invisible, its children are never visited\n  if (!isVisibleAtTime(element, options.timeMs)) {\n    return;\n  }\n\n  // Respect updateAnimations' visibility decision for temporal elements.\n  // isVisibleAtTime uses inclusive end bounds, but updateAnimations uses\n  // exclusive end for mid-composition elements (VisibilityPolicy). When\n  // updateAnimations has set display:none, that is the authoritative decision.\n  if (\n    isTemporal(element) &&\n    (element as HTMLElement).style?.getPropertyValue(\"display\") === \"none\"\n  ) {\n    return;\n  }\n\n  // Custom element with shadow DOM?\n  const isCustom = element.tagName.includes(\"-\");\n  if (isCustom && element.shadowRoot) {\n    const shadowCanvas = element.shadowRoot.querySelector(\"canvas\");\n    if (shadowCanvas) {\n      serializeCanvas(element, shadowCanvas, parts, canvasJobs, options);\n      return;\n    }\n\n    const shadowImg = element.shadowRoot.querySelector(\"img\");\n    if (shadowImg?.complete && shadowImg.naturalWidth > 0) {\n      serializeImageAsCanvas(element, shadowImg, parts, canvasJobs, options);\n      return;\n    }\n\n    // Serialize custom element with its styles, then shadow DOM content inside\n    // Use span for inline/inline-block/inline-flex elements to preserve inline behavior\n    const computedStyle = getComputedStyle(element);\n    let computedDisplay = computedStyle.display;\n    // If display:none was set by temporal visibility, resolve the natural display\n    // to determine the correct container tag (span vs div)\n    if (computedDisplay === \"none\") {\n      computedDisplay = resolveNaturalDisplay(element);\n    }\n    const isInline =\n      computedDisplay === \"inline\" ||\n      computedDisplay === \"inline-block\" ||\n      computedDisplay === \"inline-flex\";\n    const containerTag = isInline ? \"span\" : \"div\";\n\n    let styleStr = serializeComputedStyles(element, computedStyle);\n\n    parts.push(`<${containerTag}`);\n\n    // Copy data attributes and class from custom element\n    for (const attr of element.attributes) {\n      const name = attr.name.toLowerCase();\n      if (name === \"class\" || name.startsWith(\"data-\")) {\n        parts.push(` ${attr.name}=\"${escapeXML(attr.value)}\"`);\n      }\n    }\n\n    if (styleStr) {\n      parts.push(` style=\"${escapeXML(styleStr)}\"`);\n    }\n    parts.push(\">\");\n\n    // Serialize shadow DOM content with this element as the slot host\n    for (const child of element.shadowRoot.childNodes) {\n      if (child.nodeType === Node.TEXT_NODE) {\n        const text = child.textContent;\n        if (text && text.length > 0) {\n          parts.push(escapeXML(text));\n        }\n      } else if (child.nodeType === Node.ELEMENT_NODE) {\n        // Pass this element as slotHost so nested SLOTs can access light DOM children\n        serializeElement(\n          child as Element,\n          parts,\n          canvasJobs,\n          options,\n          parentIsSVG,\n          element,\n        );\n      }\n    }\n\n    parts.push(`</${containerTag}>`);\n    return;\n  }\n\n  // Raw canvas in light DOM\n  if (element instanceof HTMLCanvasElement) {\n    serializeCanvas(element, element, parts, canvasJobs, options);\n    return;\n  }\n\n  // Standard element - serialize to XHTML\n  const tagName = element.tagName.toLowerCase();\n  const isSVG = element instanceof SVGElement;\n  const isVoid = VOID_ELEMENTS.has(tagName);\n\n  // Open tag with namespace (only add xmlns for root SVG elements, not children)\n  if (isSVG && !parentIsSVG) {\n    // Root SVG element - needs xmlns declaration\n    parts.push(`<${tagName} xmlns=\"http://www.w3.org/2000/svg\"`);\n  } else {\n    parts.push(`<${tagName}`);\n  }\n\n  // Attributes\n  serializeAttributes(element, parts);\n\n  // Computed styles as inline style attribute\n  const styleStr = serializeComputedStyles(element);\n  if (styleStr) {\n    parts.push(` style=\"${escapeXML(styleStr)}\"`);\n  }\n\n  // Void elements: self-close with /> (XHTML requirement)\n  if (isVoid) {\n    parts.push(\" />\");\n    return;\n  }\n\n  parts.push(\">\");\n\n  // Children (shadow or light)\n  const children = element.shadowRoot?.childNodes || element.childNodes;\n  for (const child of children) {\n    if (child.nodeType === Node.TEXT_NODE) {\n      const text = child.textContent;\n      if (text && text.length > 0) {\n        parts.push(escapeXML(text));\n      }\n    } else if (child.nodeType === Node.ELEMENT_NODE) {\n      // Preserve slotHost when recursing into standard elements inside shadow DOM\n      serializeElement(\n        child as Element,\n        parts,\n        canvasJobs,\n        options,\n        isSVG,\n        slotHost,\n      );\n    }\n  }\n\n  // Close tag\n  parts.push(`</${tagName}>`);\n}\n\n/**\n * TextEncoder instance for SVG-to-base64 encoding.\n * encode() converts to UTF-8 bytes in a single native call, then we\n * base64-encode the bytes. ~33% overhead vs ~200% for percent-encoding.\n */\nconst textEncoder = new TextEncoder();\n\n/**\n * Synchronous DOM capture phase. Walks the element tree, snapshots canvas\n * pixels, and kicks off async encoding. Returns parts array containing\n * string fragments and encoding promises.\n *\n * After this function returns, the source element's DOM is no longer\n * referenced — the clone can safely be seeked to the next frame.\n *\n * SCALING ARCHITECTURE (unified via ScaleConfig):\n *\n * ScaleConfig centralizes all scaling logic and provides:\n * 1. Output SVG dimensions (width * exportScale, height * exportScale)\n * 2. DOM scaling wrapper (CSS transform:scale when exportScale < 1)\n * 3. Per-canvas optimal encoding scale via computeCanvasScale()\n *\n * Canvas scaling is independent from DOM scaling because:\n * - Canvas elements have intrinsic pixel dimensions and can be downsampled\n *   efficiently before encoding (prevents encoding 1920px at full resolution\n *   when displayed at 420px)\n * - DOM content has no intrinsic resolution and must be scaled via CSS\n *   transforms, which the browser handles during SVG foreignObject rendering\n *\n * Example: 1920x1080 @ 0.5 export scale\n * - Output SVG: 960x540\n * - DOM wrapper: transform:scale(0.5) on 1920x1080 content\n * - Canvas (1920px displayed at 420px): encoded at ~0.16x (315px)\n *   via computeCanvasScale(420/1920 * 0.5 * 1.5 quality = 0.164)\n */\nexport function captureElementParts(\n  element: Element,\n  width: number,\n  height: number,\n  options: SerializationOptions,\n): Array<string | Promise<string>> {\n  const parts: Array<string | Promise<string>> = [];\n  const canvasJobs: CanvasJob[] = [];\n  const sourceMap = new WeakMap<HTMLCanvasElement, Element>();\n\n  // Create ScaleConfig to centralize all scaling logic\n  const scaleConfig = ScaleConfig.fromOptions(\n    width,\n    height,\n    options.canvasScale,\n  );\n\n  const documentStyles =\n    options.renderContext?.getCachedDocumentStyles() ?? collectDocumentStyles();\n  if (options.renderContext && documentStyles) {\n    options.renderContext.setCachedDocumentStyles(documentStyles);\n  }\n\n  parts.push(\n    `<div xmlns=\"http://www.w3.org/1999/xhtml\" ` +\n      `style=\"width:${scaleConfig.outputWidth}px;height:${scaleConfig.outputHeight}px;overflow:hidden;position:relative;\">`,\n  );\n\n  if (documentStyles) {\n    parts.push(`<style type=\"text/css\"><![CDATA[${documentStyles}]]></style>`);\n  }\n\n  // Apply DOM scaling wrapper if needed\n  const domTransform = scaleConfig.getDOMTransform();\n  if (domTransform) {\n    const wrapperDims = scaleConfig.getDOMWrapperDimensions();\n    parts.push(\n      `<div style=\"transform:${domTransform};transform-origin:0 0;` +\n        `width:${wrapperDims.width}px;height:${wrapperDims.height}px;\">`,\n    );\n  }\n\n  // Create internal options with ScaleConfig\n  const internalOptions: InternalSerializationOptions = {\n    renderContext: options.renderContext,\n    timeMs: options.timeMs,\n    scaleConfig,\n    sourceMap,\n  };\n\n  serializeElement(element, parts, canvasJobs, internalOptions);\n\n  if (domTransform) {\n    parts.push(\"</div>\");\n  }\n\n  parts.push(\"</div>\");\n\n  return parts;\n}\n\n/**\n * Serialize any element directly to XHTML string.\n *\n * @param element - The element to serialize (timegroup, temporal element, or plain DOM)\n * @param width - Output width\n * @param height - Output height\n * @param options - Serialization options (renderContext, canvasScale, timeMs)\n * @returns XHTML string with all canvases encoded as base64 data URLs\n */\nexport async function serializeElementToXHTML(\n  element: Element,\n  width: number,\n  height: number,\n  options: SerializationOptions,\n): Promise<string> {\n  const parts = captureElementParts(element, width, height, options);\n  const resolvedParts = await Promise.all(parts);\n  return resolvedParts.join(\"\");\n}\n\n/**\n * Synchronous capture with deferred data URI encoding.\n *\n * Walks the DOM and snapshots canvas pixels synchronously, then returns\n * a promise that resolves to the SVG data URI once async canvas-to-base64\n * encoding completes. The source element is NOT referenced after this\n * function returns — the caller can immediately mutate/seek the clone.\n */\nexport function captureTimelineToDataUri(\n  element: Element,\n  width: number,\n  height: number,\n  options: SerializationOptions,\n): Promise<string> {\n  // Create ScaleConfig to compute scaled dimensions\n  const scaleConfig = ScaleConfig.fromOptions(\n    width,\n    height,\n    options.canvasScale,\n  );\n\n  const parts = captureElementParts(element, width, height, options);\n\n  return Promise.all(parts).then((resolvedParts) => {\n    const xhtml = resolvedParts.join(\"\");\n    const svg =\n      `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"${scaleConfig.outputWidth}\" height=\"${scaleConfig.outputHeight}\">` +\n      `<foreignObject x=\"0\" y=\"0\" width=\"${scaleConfig.outputWidth}\" height=\"${scaleConfig.outputHeight}\">${xhtml}</foreignObject>` +\n      `</svg>`;\n    // Encode SVG to base64 data URI inline (avoids module-level function reference issues)\n    const bytes = textEncoder.encode(svg);\n    let binary = \"\";\n    for (let i = 0; i < bytes.length; i += 8192) {\n      binary += String.fromCharCode.apply(\n        null,\n        bytes.subarray(i, i + 8192) as unknown as number[],\n      );\n    }\n    return `data:image/svg+xml;base64,${btoa(binary)}`;\n  });\n}\n"],"mappings":"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"}