framefields 2.0.11 → 2.1.1

package/dist/{renderer-DpGc-N3G.mjs → renderer-NXdm6HLb.mjs}

@@ -1,9 +1,10 @@
-import { n as defineRenderer } from "./renderer-CtVkU_GA.mjs";
-import { a as configBuilder, i as VideoResultSchema, n as ImageResultSchema } from "./dist-BYqNNwsl.mjs";
-import { et as probeVideoSize } from "./dist-Cxi68OuY.mjs";
+import { n as defineRenderer } from "./renderer-BSitV56h.mjs";
+import { a as configBuilder, i as VideoResultSchema, n as ImageResultSchema } from "./dist-BY0bIWgr.mjs";
+import { q as probeVideoSize } from "./dist-DkuDAIrG.mjs";
+import { a as createFullscreenPipeline, c as drawTextureToTarget, l as fragmentBindGroupLayout, o as drawChildToTexture, s as drawFullscreenPass, t as FULLSCREEN_QUAD_WGSL } from "./gpu-DG3gI88-.mjs";
 import { z } from "zod";
 
-//#region ../../nodes/node-rotate/dist/renderers-BzrxSSux.mjs
+//#region ../../nodes/node-rotate/dist/renderers-D7DemTXH.mjs
 const rotateConfig = configBuilder().field("angle", z.number().default(90), {
 	bindable: true,
 	dataTypes: ["Number", "Signal"],
@@ -51,27 +52,7 @@ struct RotateUniforms {
 @group(0) @binding(0) var<uniform> u : RotateUniforms;
 @group(1) @binding(0) var tex        : texture_2d<f32>;
 @group(1) @binding(1) var samp       : sampler;
-
-struct VSOut {
-	@builtin(position) pos : vec4<f32>,
-	@location(0) uv        : vec2<f32>,
-};
-
-@vertex fn vs(@builtin(vertex_index) vi: u32) -> VSOut {
-	var pos = array<vec2<f32>, 4>(
-		vec2<f32>(-1.0, 1.0),
-		vec2<f32>(1.0, 1.0),
-		vec2<f32>(-1.0, -1.0),
-		vec2<f32>(1.0, -1.0)
-	);
-	var uv = array<vec2<f32>, 4>(
-		vec2<f32>(0.0, 0.0),
-		vec2<f32>(1.0, 0.0),
-		vec2<f32>(0.0, 1.0),
-		vec2<f32>(1.0, 1.0)
-	);
-	return VSOut(vec4<f32>(pos[vi], 0.0, 1.0), uv[vi]);
-}
+${FULLSCREEN_QUAD_WGSL}
 
 @fragment fn fs(in : VSOut) -> @location(0) vec4<f32> {
 	let p = (in.uv - vec2<f32>(0.5)) * u.outSize;
@@ -91,36 +72,15 @@ const uniformData = new Float32Array(8);
 function getRotateResources(device, targetFormat) {
 	const cached = deviceResourceCache.get(device);
 	if (cached) return cached;
-	const uniformLayout = device.createBindGroupLayout({ entries: [{
-		binding: 0,
-		visibility: GPUShaderStage.FRAGMENT,
-		buffer: { type: "uniform" }
-	}] });
-	const textureLayout = device.createBindGroupLayout({ entries: [{
-		binding: 0,
-		visibility: GPUShaderStage.FRAGMENT,
-		texture: { sampleType: "float" }
-	}, {
-		binding: 1,
-		visibility: GPUShaderStage.FRAGMENT,
-		sampler: { type: "filtering" }
-	}] });
-	const shaderModule = device.createShaderModule({ code: WGSL_ROTATE_SHADER });
+	const uniformLayout = fragmentBindGroupLayout(device, ["uniform"]);
+	const textureLayout = fragmentBindGroupLayout(device, ["texture", "sampler"]);
 	const res = {
 		uniformLayout,
 		textureLayout,
-		pipeline: device.createRenderPipeline({
-			layout: device.createPipelineLayout({ bindGroupLayouts: [uniformLayout, textureLayout] }),
-			vertex: {
-				module: shaderModule,
-				entryPoint: "vs"
-			},
-			fragment: {
-				module: shaderModule,
-				entryPoint: "fs",
-				targets: [{ format: targetFormat }]
-			},
-			primitive: { topology: "triangle-strip" }
+		pipeline: createFullscreenPipeline(device, {
+			module: device.createShaderModule({ code: WGSL_ROTATE_SHADER }),
+			layouts: [uniformLayout, textureLayout],
+			format: targetFormat
 		})
 	};
 	deviceResourceCache.set(device, res);
@@ -156,7 +116,7 @@ async function intrinsicSize(media) {
 	return null;
 }
 const WebGPURenderer = async (args) => {
-	const { ctx, encoder, pass, targetView, targetTexture, targetWidth, targetHeight, props, drawChild } = args;
+	const { ctx, encoder, pass, targetTexture, targetWidth, targetHeight, props } = args;
 	const op = props.virtualMedia?.operation;
 	if (op?.op !== "Rotate" || !op) return;
 	const childMedia = props.virtualMedia.children?.[0];
@@ -170,29 +130,16 @@ const WebGPURenderer = async (args) => {
 	const intrinsic = await intrinsicSize(childMedia);
 	const sourceWidth = intrinsic?.width ?? props.containerWidth ?? width;
 	const sourceHeight = intrinsic?.height ?? props.containerHeight ?? height;
-	const childTex = ctx.renderer.getTemporaryTexture(sourceWidth, sourceHeight, [...props.excludeTextures || [], targetTexture]);
-	const childView = childTex.createView();
-	ctx.renderer.beginFrame(encoder, childView, {
-		r: 0,
-		g: 0,
-		b: 0,
-		a: 0
-	}, sourceWidth, sourceHeight, "clear").end();
-	ctx.renderer.pushScissor({
-		x: 0,
-		y: 0,
+	const { texture: childTex } = await drawChildToTexture(args, childMedia, {
 		width: sourceWidth,
-		height: sourceHeight
+		height: sourceHeight,
+		props: {
+			...props,
+			containerWidth: sourceWidth,
+			containerHeight: sourceHeight,
+			virtualMedia: childMedia
+		}
 	});
-	ctx.renderer.pushIdentity();
-	await drawChild(childMedia, {
-		...props,
-		containerWidth: sourceWidth,
-		containerHeight: sourceHeight,
-		virtualMedia: childMedia
-	}, childView, childTex, sourceWidth, sourceHeight);
-	ctx.renderer.popTransform();
-	ctx.renderer.popScissor();
 	const angle = resolveNumber(op.angle, 90, compositionFrame, fps);
 	const scale = Math.max(.01, resolveNumber(op.scale, 1, compositionFrame, fps));
 	const size = rotatedSourceSize(sourceWidth, sourceHeight, width, height, angle, op.fit ?? "cover");
@@ -226,38 +173,11 @@ const WebGPURenderer = async (args) => {
 		targetTexture,
 		...props.excludeTextures || []
 	]);
-	const renderPass = encoder.beginRenderPass({ colorAttachments: [{
-		view: outTex.createView(),
-		loadOp: "clear",
-		storeOp: "store",
-		clearValue: {
-			r: 0,
-			g: 0,
-			b: 0,
-			a: 0
-		}
-	}] });
-	renderPass.setPipeline(pipeline);
-	renderPass.setBindGroup(0, uBindGroup);
-	renderPass.setBindGroup(1, tBindGroup);
-	renderPass.draw(4);
-	renderPass.end();
-	const finalPass = ctx.renderer.beginFrame(encoder, targetView, {
-		r: 0,
-		g: 0,
-		b: 0,
-		a: 0
-	}, targetWidth, targetHeight, "load");
-	ctx.renderer.drawTexture(finalPass, outTex, {
-		x: 0,
-		y: 0,
-		width: targetWidth,
-		height: targetHeight
-	}, { opacity: op.opacity ?? 1 });
-	args.pass = finalPass;
+	drawFullscreenPass(encoder, outTex.createView(), pipeline, [uBindGroup, tBindGroup]);
+	drawTextureToTarget(args, outTex, op.opacity ?? 1);
 };
 var renderers_default = defineRenderer({ WebGPURenderer });
 
 //#endregion
 export { renderers_default as t };
-//# sourceMappingURL=renderer-DpGc-N3G.mjs.map
+//# sourceMappingURL=renderer-NXdm6HLb.mjs.map

package/dist/renderer-NXdm6HLb.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderer-NXdm6HLb.mjs","names":[],"sources":["../../../nodes/node-rotate/dist/renderers-D7DemTXH.mjs"],"sourcesContent":["import { ImageResultSchema, VideoResultSchema, configBuilder } from \"@framefields/node-sdk\";\nimport { z } from \"zod\";\nimport { defineRenderer } from \"@framefields/node-sdk/renderer\";\nimport { FULLSCREEN_QUAD_WGSL, createFullscreenPipeline, drawChildToTexture, drawFullscreenPass, drawTextureToTarget, fragmentBindGroupLayout } from \"@framefields/node-sdk/gpu\";\nimport { probeVideoSize } from \"@framefields/webgpu-renderers\";\n\n//#region src/shared/config.ts\nconst rotateConfig = configBuilder().field(\"angle\", z.number().default(90), {\n\tbindable: true,\n\tdataTypes: [\"Number\", \"Signal\"],\n\tlabel: \"Angle Signal\",\n\tdescription: \"Rotation in degrees about the frame center, clockwise. Any value; 90 / 180 / 270 fix footage shot sideways or upside down.\"\n}).field(\"fit\", z.enum([\n\t\"cover\",\n\t\"contain\",\n\t\"fill\"\n]).default(\"cover\"), { description: \"How the rotated source sits in the output: cover fills it (cropping the overhang), contain shows all of it (transparent margins), fill keeps the unrotated source stretched to the output and only turns it.\" }).field(\"scale\", z.number().min(.01).max(20).default(1), {\n\tbindable: true,\n\tdataTypes: [\"Number\", \"Signal\"],\n\tlabel: \"Scale Signal\",\n\tdescription: \"Extra zoom applied after the fit (1 = exactly fitted).\"\n}).build();\nconst RotateNodeConfigSchema = rotateConfig.schema;\nconst RotateResultSchema = z.union([ImageResultSchema, VideoResultSchema]);\nconst ROTATE_OUTPUT_TYPE_MAP = {\n\tVideo: \"Video\",\n\tLottie: \"Video\",\n\tGIF: \"GIF\",\n\tImage: \"Image\",\n\tSVG: \"Image\"\n};\n/**\n* Size (px) of the rotated source inside a `targetWidth × targetHeight` output.\n* `cover` is the smallest size whose rotated rectangle still covers the whole\n* output; `contain` the largest whose rotated bounding box fits inside it.\n*/\nfunction rotatedSourceSize(sourceWidth, sourceHeight, targetWidth, targetHeight, angleDeg, fit) {\n\tif (fit === \"fill\") return {\n\t\twidth: targetWidth,\n\t\theight: targetHeight\n\t};\n\tconst rad = angleDeg * Math.PI / 180;\n\tconst c = Math.abs(Math.cos(rad));\n\tconst s = Math.abs(Math.sin(rad));\n\tconst k = fit === \"cover\" ? Math.max((c * targetWidth + s * targetHeight) / sourceWidth, (s * targetWidth + c * targetHeight) / sourceHeight) : Math.min(targetWidth / (c * sourceWidth + s * sourceHeight), targetHeight / (s * sourceWidth + c * sourceHeight));\n\treturn {\n\t\twidth: sourceWidth * k,\n\t\theight: sourceHeight * k\n\t};\n}\n\n//#endregion\n//#region src/renderers/webgpu-renderer.ts\nconst WGSL_ROTATE_SHADER = `\nstruct RotateUniforms {\n\toutSize: vec2<f32>,\n\tsize   : vec2<f32>,\n\tcs     : vec2<f32>,\n\t_pad   : vec2<f32>,\n};\n\n@group(0) @binding(0) var<uniform> u : RotateUniforms;\n@group(1) @binding(0) var tex        : texture_2d<f32>;\n@group(1) @binding(1) var samp       : sampler;\n${FULLSCREEN_QUAD_WGSL}\n\n@fragment fn fs(in : VSOut) -> @location(0) vec4<f32> {\n\tlet p = (in.uv - vec2<f32>(0.5)) * u.outSize;\n\t// Clockwise on screen (y down): undo it with the transpose.\n\tlet q = vec2<f32>(u.cs.x * p.x + u.cs.y * p.y, -u.cs.y * p.x + u.cs.x * p.y);\n\tlet uv = q / u.size + vec2<f32>(0.5);\n\t// Distance (output px) inside the source rectangle's nearest edge.\n\tlet edge = (vec2<f32>(0.5) - abs(uv - vec2<f32>(0.5))) * u.size;\n\tlet coverage = clamp(min(edge.x, edge.y) + 0.5, 0.0, 1.0);\n\tlet color = textureSampleLevel(tex, samp, clamp(uv, vec2<f32>(0.0), vec2<f32>(1.0)), 0.0);\n\t// Premultiplied: coverage scales every channel.\n\treturn color * coverage;\n}\n`;\nconst deviceResourceCache = /* @__PURE__ */ new WeakMap();\nconst uniformData = new Float32Array(8);\nfunction getRotateResources(device, targetFormat) {\n\tconst cached = deviceResourceCache.get(device);\n\tif (cached) return cached;\n\tconst uniformLayout = fragmentBindGroupLayout(device, [\"uniform\"]);\n\tconst textureLayout = fragmentBindGroupLayout(device, [\"texture\", \"sampler\"]);\n\tconst res = {\n\t\tuniformLayout,\n\t\ttextureLayout,\n\t\tpipeline: createFullscreenPipeline(device, {\n\t\t\tmodule: device.createShaderModule({ code: WGSL_ROTATE_SHADER }),\n\t\t\tlayouts: [uniformLayout, textureLayout],\n\t\t\tformat: targetFormat\n\t\t})\n\t};\n\tdeviceResourceCache.set(device, res);\n\treturn res;\n}\nfunction resolveNumber(raw, fallback, frame, fps) {\n\tconst value = typeof raw === \"function\" ? raw(frame, fps) : raw !== null && typeof raw === \"object\" ? \"get\" in raw && typeof raw.get === \"function\" ? raw.get({\n\t\tframe,\n\t\tfps\n\t}) : \"value\" in raw ? raw.value : raw : raw;\n\tconst n = Number(value ?? fallback);\n\treturn Number.isFinite(n) ? n : fallback;\n}\n/**\n* The child's own size: the nearest stated metadata down the chain, else the\n* source file's display size. A layer built from a bare path states none, and\n* guessing the layer box would turn a 16:9 clip into a squeezed 9:16 one.\n*/\nasync function intrinsicSize(media) {\n\tfor (let node = media; node;) {\n\t\tconst { width, height } = node.metadata ?? {};\n\t\tif (width && height) return {\n\t\t\twidth,\n\t\t\theight\n\t\t};\n\t\tconst op = node.operation;\n\t\tif (op.op === \"source\") {\n\t\t\tconst url = typeof op.url === \"string\" ? op.url : op.source;\n\t\t\treturn typeof url === \"string\" ? probeVideoSize(url) : null;\n\t\t}\n\t\tnode = node.children?.[0];\n\t}\n\treturn null;\n}\nconst WebGPURenderer = async (args) => {\n\tconst { ctx, encoder, pass, targetTexture, targetWidth, targetHeight, props } = args;\n\tconst op = props.virtualMedia?.operation;\n\tif (op?.op !== \"Rotate\" || !op) return;\n\tconst childMedia = props.virtualMedia.children?.[0];\n\tif (!childMedia) return;\n\tpass.end();\n\tconst frame = props.frame ?? 0;\n\tconst compositionFrame = props.compositionFrame ?? frame;\n\tconst fps = props.fps || 30;\n\tconst width = targetWidth;\n\tconst height = targetHeight;\n\tconst intrinsic = await intrinsicSize(childMedia);\n\tconst sourceWidth = intrinsic?.width ?? props.containerWidth ?? width;\n\tconst sourceHeight = intrinsic?.height ?? props.containerHeight ?? height;\n\tconst { texture: childTex } = await drawChildToTexture(args, childMedia, {\n\t\twidth: sourceWidth,\n\t\theight: sourceHeight,\n\t\tprops: {\n\t\t\t...props,\n\t\t\tcontainerWidth: sourceWidth,\n\t\t\tcontainerHeight: sourceHeight,\n\t\t\tvirtualMedia: childMedia\n\t\t}\n\t});\n\tconst angle = resolveNumber(op.angle, 90, compositionFrame, fps);\n\tconst scale = Math.max(.01, resolveNumber(op.scale, 1, compositionFrame, fps));\n\tconst size = rotatedSourceSize(sourceWidth, sourceHeight, width, height, angle, op.fit ?? \"cover\");\n\tconst rad = angle * Math.PI / 180;\n\tuniformData[0] = width;\n\tuniformData[1] = height;\n\tuniformData[2] = size.width * scale;\n\tuniformData[3] = size.height * scale;\n\tuniformData[4] = Math.cos(rad);\n\tuniformData[5] = Math.sin(rad);\n\tconst { pipeline, uniformLayout, textureLayout } = getRotateResources(ctx.device, ctx.renderer.format);\n\tconst uBindGroup = ctx.device.createBindGroup({\n\t\tlayout: uniformLayout,\n\t\tentries: [{\n\t\t\tbinding: 0,\n\t\t\tresource: { buffer: ctx.renderer.getTemporaryBuffer(uniformData) }\n\t\t}]\n\t});\n\tconst tBindGroup = ctx.device.createBindGroup({\n\t\tlayout: textureLayout,\n\t\tentries: [{\n\t\t\tbinding: 0,\n\t\t\tresource: childTex.createView()\n\t\t}, {\n\t\t\tbinding: 1,\n\t\t\tresource: ctx.renderer.samplerCache.getSampler(ctx.device)\n\t\t}]\n\t});\n\tconst outTex = ctx.renderer.getTemporaryTexture(width, height, [\n\t\tchildTex,\n\t\ttargetTexture,\n\t\t...props.excludeTextures || []\n\t]);\n\tdrawFullscreenPass(encoder, outTex.createView(), pipeline, [uBindGroup, tBindGroup]);\n\tdrawTextureToTarget(args, outTex, op.opacity ?? 1);\n};\n\n//#endregion\n//#region src/renderers/index.ts\nvar renderers_default = defineRenderer({ WebGPURenderer });\n\n//#endregion\nexport { rotateConfig as a, RotateResultSchema as i, ROTATE_OUTPUT_TYPE_MAP as n, rotatedSourceSize as o, RotateNodeConfigSchema as r, renderers_default as t };\n//# sourceMappingURL=renderers-D7DemTXH.mjs.map"],"mappings":"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"}

package/dist/renderer-OLaYikwi.mjs

@@ -0,0 +1,5 @@
+import "./chunk-GBe2k3y8.mjs";
+import "./dist-DkuDAIrG.mjs";
+import { t as renderers_default } from "./renderer-D8-zNjyz.mjs";
+
+export { renderers_default as default };

package/dist/renderer-Q75RC5Uz.mjs

@@ -0,0 +1,5 @@
+import "./chunk-GBe2k3y8.mjs";
+import "./dist-DkuDAIrG.mjs";
+import { t as renderers_default } from "./renderer-DzrM1KMN.mjs";
+
+export { renderers_default as default };

package/dist/renderer-T0LJ4Po3.mjs

@@ -0,0 +1,5 @@
+import "./chunk-GBe2k3y8.mjs";
+import "./dist-DkuDAIrG.mjs";
+import { t as renderers_default } from "./renderer-D0aZNkQE.mjs";
+
+export { renderers_default as default };

package/dist/renderer-VuXt1hfq.mjs

@@ -0,0 +1,5 @@
+import "./chunk-GBe2k3y8.mjs";
+import "./dist-DkuDAIrG.mjs";
+import { t as renderers_default } from "./renderer-C7UZLOYk.mjs";
+
+export { renderers_default as default };

package/dist/{renderer-BfAWZziM.mjs → renderer-_1xGBbxn.mjs}

@@ -1,12 +1,14 @@
-import { Gt as reportRenderDiagnostic, Jt as resolveNumber, Kt as resolveBoolean, p as DEFAULT_DURATION_MS, wt as getActiveMediaMetadata } from "./dist-CbG3QxDw.mjs";
-import { n as defineRenderer, t as audioRegistry } from "./renderer-CtVkU_GA.mjs";
-import { $ as poseNodes, H as jointMatrices, I as generateExtrudedTextGeometry, R as getPrimitiveGeometry, S as Vector3Math, Y as parseColor, a as Camera3D, c as Light3D, ct as resolveMediaSourceUrl, g as ScreenSpaceRelightPipeline, it as srtLoader, l as Matrix4Math, m as Renderer3D, n as AudioLatentTrackCache, q as measureMaxCaptionHeight, y as SlugFontCache } from "./dist-Cxi68OuY.mjs";
-import { a as resolveLayerDuration, g as measureText, n as decodeAudioSource } from "./dist-BAVZdFEJ.mjs";
-import { o as TemporalDeflickerPipeline } from "./dist-C_hjvkdN.mjs";
-import { Ct as collectNodeOps, Dt as computeLayout, Ut as evaluateTrackAtFrame, Zt as initLayout } from "./program-BmNKgzja.mjs";
+import "./chunk-GBe2k3y8.mjs";
+import { Gt as reportRenderDiagnostic, Jt as resolveNumber, Kt as resolveBoolean, p as DEFAULT_DURATION_MS, wt as getActiveMediaMetadata } from "./dist-fjKpBYkc.mjs";
+import { a as resolveFrameNumber, c as solveHomography, n as defineRenderer, t as audioRegistry } from "./renderer-BSitV56h.mjs";
+import { B as measureMaxCaptionHeight, F as jointMatrices, H as parseColor, K as poseNodes, O as fitSpansToText, Q as srtLoader, Y as resolveTextSpans, Z as spansText, ct as Matrix4Math, d as ScreenSpaceRelightPipeline, j as getPrimitiveGeometry, k as generateExtrudedTextGeometry, l as Renderer3D, n as AudioLatentTrackCache, nt as resolveMediaSourceUrl, ot as Light3D, p as SlugFontCache, rt as Camera3D, ut as Vector3Math } from "./dist-DkuDAIrG.mjs";
+import { a as createFullscreenPipeline, l as fragmentBindGroupLayout, n as PREMULTIPLIED_BLEND, t as FULLSCREEN_QUAD_WGSL } from "./gpu-DG3gI88-.mjs";
+import { a as resolveLayerDuration, f as measureText, n as decodeAudioSource } from "./dist-Bb8BoMiw.mjs";
+import { o as TemporalDeflickerPipeline } from "./dist-0QGroRYZ.mjs";
+import { F as computeLayout, M as collectNodeOps, V as initLayout, z as evaluateTrackAtFrame } from "./program-Cc5AsBHz.mjs";
 import gsapModule from "gsap";
 
-//#region ../../nodes/node-compositor/dist/renderers-BAr6K7E8.mjs
+//#region ../../nodes/node-compositor/dist/renderers-3FvTVSSB.mjs
 /**
 * Solves a cubic bezier curve defined by control points (x1, y1) and (x2, y2)
 * for a given progress parameter t in [0, 1].
@@ -924,104 +926,6 @@ const Transform3DMath = {
 	}
 };
 /**
-* Computes an 8-parameter 3x3 homography matrix mapping destination coordinates (quad)
-* to normalized source coordinates (unit square [0, 1]^2).
-*
-* The homography H maps destination (x, y) to source (u, v):
-*   u = (h00*x + h01*y + h02) / (h20*x + h21*y + h22)
-*   v = (h10*x + h11*y + h12) / (h20*x + h21*y + h22)
-*
-* Resulting array: [h00, h01, h02, h10, h11, h12, h20, h21, 1.0]
-*/
-function solveHomography(dstPoints, srcPoints = [
-	{
-		x: 0,
-		y: 0
-	},
-	{
-		x: 1,
-		y: 0
-	},
-	{
-		x: 0,
-		y: 1
-	},
-	{
-		x: 1,
-		y: 1
-	}
-]) {
-	const A = [];
-	const B = [];
-	for (let i = 0; i < 4; i++) {
-		const xi = dstPoints[i]?.x ?? 0;
-		const yi = dstPoints[i]?.y ?? 0;
-		const ui = srcPoints[i]?.x ?? 0;
-		const vi = srcPoints[i]?.y ?? 0;
-		A.push([
-			xi,
-			yi,
-			1,
-			0,
-			0,
-			0,
-			-xi * ui,
-			-yi * ui
-		]);
-		B.push(ui);
-		A.push([
-			0,
-			0,
-			0,
-			xi,
-			yi,
-			1,
-			-xi * vi,
-			-yi * vi
-		]);
-		B.push(vi);
-	}
-	const n = 8;
-	for (let i = 0; i < n; i++) {
-		let maxRow = i;
-		let maxVal = Math.abs(A[i][i]);
-		for (let k = i + 1; k < n; k++) if (Math.abs(A[k][i]) > maxVal) {
-			maxVal = Math.abs(A[k][i]);
-			maxRow = k;
-		}
-		const tempRow = A[i];
-		A[i] = A[maxRow];
-		A[maxRow] = tempRow;
-		const tempB = B[i];
-		B[i] = B[maxRow];
-		B[maxRow] = tempB;
-		const pivot = A[i][i];
-		if (Math.abs(pivot) < 1e-12) A[i][i] = pivot < 0 ? -1e-12 : 1e-12;
-		for (let k = i + 1; k < n; k++) {
-			const factor = A[k][i] / A[i][i];
-			for (let j = i; j < n; j++) A[k][j] -= factor * A[i][j];
-			B[k] -= factor * B[i];
-		}
-	}
-	const h = new Array(8).fill(0);
-	for (let i = n - 1; i >= 0; i--) {
-		let sum = B[i];
-		for (let j = i + 1; j < n; j++) sum -= A[i][j] * h[j];
-		h[i] = sum / A[i][i];
-	}
-	return [
-		h[0],
-		h[1],
-		h[2],
-		h[3],
-		h[4],
-		h[5],
-		h[6],
-		h[7],
-		1
-	];
-}
-/**
 * Checks whether a layer operation or compiled stub activates the 3D perspective path.
 */
 function has3DTransform(target, lop) {
@@ -1067,27 +971,7 @@ struct HomographyUniforms {
 @group(0) @binding(0) var<uniform> u : HomographyUniforms;
 @group(1) @binding(0) var tex        : texture_2d<f32>;
 @group(1) @binding(1) var samp       : sampler;
-
-struct VSOut {
-	@builtin(position) pos : vec4<f32>,
-	@location(0) uv        : vec2<f32>,
-};
-
-@vertex fn vs(@builtin(vertex_index) vi: u32) -> VSOut {
-	var pos = array<vec2<f32>, 4>(
-		vec2<f32>(-1.0, 1.0),
-		vec2<f32>(1.0, 1.0),
-		vec2<f32>(-1.0, -1.0),
-		vec2<f32>(1.0, -1.0)
-	);
-	var uv = array<vec2<f32>, 4>(
-		vec2<f32>(0.0, 0.0),
-		vec2<f32>(1.0, 0.0),
-		vec2<f32>(0.0, 1.0),
-		vec2<f32>(1.0, 1.0)
-	);
-	return VSOut(vec4<f32>(pos[vi], 0.0, 1.0), uv[vi]);
-}
+${FULLSCREEN_QUAD_WGSL}
 
 @fragment fn fs(in : VSOut) -> @location(0) vec4<f32> {
 	let x = in.uv.x;
@@ -1113,52 +997,18 @@ const deviceHomographyCache = /* @__PURE__ */ new WeakMap();
 function getHomographyResources(device, format) {
 	let res = deviceHomographyCache.get(device);
 	if (!res) {
-		const uniformLayout = device.createBindGroupLayout({ entries: [{
-			binding: 0,
-			visibility: GPUShaderStage.FRAGMENT,
-			buffer: { type: "uniform" }
-		}] });
-		const textureLayout = device.createBindGroupLayout({ entries: [{
-			binding: 0,
-			visibility: GPUShaderStage.FRAGMENT,
-			texture: { sampleType: "float" }
-		}, {
-			binding: 1,
-			visibility: GPUShaderStage.FRAGMENT,
-			sampler: { type: "filtering" }
-		}] });
-		const module = device.createShaderModule({
-			label: "compositor_homography.wgsl",
-			code: compositorHomographyWgsl
-		});
+		const uniformLayout = fragmentBindGroupLayout(device, ["uniform"]);
+		const textureLayout = fragmentBindGroupLayout(device, ["texture", "sampler"]);
 		res = {
-			pipeline: device.createRenderPipeline({
+			pipeline: createFullscreenPipeline(device, {
 				label: "CompositorHomographyPipeline",
-				layout: device.createPipelineLayout({ bindGroupLayouts: [uniformLayout, textureLayout] }),
-				vertex: {
-					module,
-					entryPoint: "vs"
-				},
-				fragment: {
-					module,
-					entryPoint: "fs",
-					targets: [{
-						format,
-						blend: {
-							color: {
-								srcFactor: "one",
-								dstFactor: "one-minus-src-alpha",
-								operation: "add"
-							},
-							alpha: {
-								srcFactor: "one",
-								dstFactor: "one-minus-src-alpha",
-								operation: "add"
-							}
-						}
-					}]
-				},
-				primitive: { topology: "triangle-strip" }
+				module: device.createShaderModule({
+					label: "compositor_homography.wgsl",
+					code: compositorHomographyWgsl
+				}),
+				layouts: [uniformLayout, textureLayout],
+				format,
+				blend: PREMULTIPLIED_BLEND
 			}),
 			uniformLayout,
 			textureLayout
@@ -1207,48 +1057,15 @@ function getTemporalDeflickerPipeline(device, layerKey) {
 	}
 	return pipe;
 }
-function resolveVal(val, fallback, frame, fps) {
-	if (val === void 0 || val === null) return fallback;
-	if (typeof val === "number") return Number.isFinite(val) ? val : fallback;
-	if (typeof val === "object" && val !== null) {
-		if ("get" in val && typeof val.get === "function") try {
-			const res = val.get({
-				frame,
-				fps,
-				time: fps > 0 ? frame / fps : 0,
-				duration: 0,
-				durationMs: 0,
-				progress: 0,
-				deltaTime: fps > 0 ? 1 / fps : 0
-			});
-			const n$1 = Number(res);
-			if (Number.isFinite(n$1)) return n$1;
-		} catch {}
-		if ("value" in val) {
-			const n$1 = Number(val.value);
-			if (Number.isFinite(n$1)) return n$1;
-		}
-	}
-	if (typeof val === "function") try {
-		const n$1 = Number(val({
-			frame,
-			fps,
-			time: fps > 0 ? frame / fps : 0
-		}));
-		if (Number.isFinite(n$1)) return n$1;
-	} catch {}
-	const n = Number(val);
-	return Number.isFinite(n) ? n : fallback;
-}
 function synthesizeRelightLights(relightOpts, sceneLights, bounds, shiftedFrame, fps) {
 	if (sceneLights.length > 0 || relightOpts.lightType === void 0 && relightOpts.intensity === void 0 && relightOpts.lightPosX === void 0) return sceneLights;
 	const lightTypeStr = String(relightOpts.lightType ?? "point").toLowerCase();
 	const lightKind = lightTypeStr === "directional" ? "directional" : lightTypeStr === "spot" ? "spot" : "point";
-	const intensity = resolveVal(relightOpts.intensity ?? 1, 1, shiftedFrame, fps);
-	const normX = resolveVal(relightOpts.lightPosX, .5, shiftedFrame, fps);
-	const normY = resolveVal(relightOpts.lightPosY, .5, shiftedFrame, fps);
-	const normZ = resolveVal(relightOpts.lightPosZ, .25, shiftedFrame, fps);
-	const normRadius = resolveVal(relightOpts.lightRadius, .75, shiftedFrame, fps);
+	const intensity = resolveFrameNumber(relightOpts.intensity ?? 1, 1, shiftedFrame, fps);
+	const normX = resolveFrameNumber(relightOpts.lightPosX, .5, shiftedFrame, fps);
+	const normY = resolveFrameNumber(relightOpts.lightPosY, .5, shiftedFrame, fps);
+	const normZ = resolveFrameNumber(relightOpts.lightPosZ, .25, shiftedFrame, fps);
+	const normRadius = resolveFrameNumber(relightOpts.lightRadius, .75, shiftedFrame, fps);
 	const lightX = bounds.x + normX * bounds.width;
 	const lightY = bounds.y + normY * bounds.height;
 	const lightZ = normZ * Math.max(bounds.width, bounds.height);
@@ -1263,7 +1080,7 @@ function synthesizeRelightLights(relightOpts, sceneLights, bounds, shiftedFrame,
 		radius: lightRadius,
 		decay: 1
 	};
-	const ambientInt = resolveVal(relightOpts.ambientIntensity, .15, shiftedFrame, fps);
+	const ambientInt = resolveFrameNumber(relightOpts.ambientIntensity, .15, shiftedFrame, fps);
 	return [{
 		lightType: "ambient",
 		color: relightOpts.ambientColor ?? "#ffffff",
@@ -1489,7 +1306,8 @@ const CompositorWebGPURenderer = async (args) => {
 						fontFamily: node.fontFamily,
 						letterSpacing: node.letterSpacing,
 						lineHeight: node.lineHeight,
-						padding: node.padding
+						padding: node.padding,
+						direction: node.direction
 					};
 					if (constraintWidth !== void 0) {
 						const isAuto = typeof node.width !== "number";
@@ -2687,11 +2505,11 @@ const CompositorWebGPURenderer = async (args) => {
 						viewportHeight: targetH,
 						layerX: 0,
 						layerY: 0,
-						roughness: resolveVal(target?.roughness ?? target?.relightRoughness ?? relightOpts$1.specularRoughness ?? relightOpts$1.roughness, .35, compositionFrame, fps ?? 24),
-						specularStrength: resolveVal(target?.specularStrength ?? target?.relightSpecularStrength ?? relightOpts$1.specularStrength, .7, compositionFrame, fps ?? 24),
-						metallic: resolveVal(target?.metallic ?? target?.relightMetallic ?? relightOpts$1.metallic, 0, compositionFrame, fps ?? 24),
-						ambientIntensity: resolveVal(target?.ambientIntensity ?? target?.relightAmbientIntensity ?? relightOpts$1.ambientIntensity, .15, compositionFrame, fps ?? 24),
-						depthScale: resolveVal(target?.depthScale ?? target?.relightDepthScale ?? relightOpts$1.depthScale, 1, compositionFrame, fps ?? 24),
+						roughness: resolveFrameNumber(target?.roughness ?? target?.relightRoughness ?? relightOpts$1.specularRoughness ?? relightOpts$1.roughness, .35, compositionFrame, fps ?? 24),
+						specularStrength: resolveFrameNumber(target?.specularStrength ?? target?.relightSpecularStrength ?? relightOpts$1.specularStrength, .7, compositionFrame, fps ?? 24),
+						metallic: resolveFrameNumber(target?.metallic ?? target?.relightMetallic ?? relightOpts$1.metallic, 0, compositionFrame, fps ?? 24),
+						ambientIntensity: resolveFrameNumber(target?.ambientIntensity ?? target?.relightAmbientIntensity ?? relightOpts$1.ambientIntensity, .15, compositionFrame, fps ?? 24),
+						depthScale: resolveFrameNumber(target?.depthScale ?? target?.relightDepthScale ?? relightOpts$1.depthScale, 1, compositionFrame, fps ?? 24),
 						opacity: 1
 					}, "clear");
 					activeGroupTex = relitTex;
@@ -2736,7 +2554,18 @@ const CompositorWebGPURenderer = async (args) => {
 				content = nodeVM.children?.[0];
 				isCaption = content?.operation?.dataType === "Caption" || lop.dataType === "Caption" || (content?.operation)?.srtText !== void 0;
 			} else if (kind === "text") {
-				const fullText = lop.text ?? "";
+				const rawSpans = target?.spans ?? lop.spans;
+				const spanFps = fps ?? 24;
+				const spans = rawSpans?.length ? resolveTextSpans(rawSpans, {
+					frame: compositionFrame,
+					fps: spanFps,
+					time: compositionFrame / spanFps,
+					duration: composeDuration / 1e3,
+					durationMs: composeDuration,
+					progress: composeDuration > 0 ? Math.min(1, compositionFrame / spanFps * 1e3 / composeDuration) : 0,
+					deltaTime: 1 / spanFps
+				}) : void 0;
+				const fullText = spans ? spansText(spans) : lop.text ?? "";
 				let displayText = fullText;
 				let resolvedAnimators = rawAnimators;
 				if (Array.isArray(rawAnimators) && rawAnimators.length > 0) resolvedAnimators = rawAnimators.map((animator, idx) => {
@@ -2802,6 +2631,7 @@ const CompositorWebGPURenderer = async (args) => {
 					operation: {
 						op: "text",
 						text: displayText,
+						spans: spans && displayText !== fullText ? fitSpansToText(spans, displayText) : spans,
 						animators: resolvedAnimators,
 						pathOptions: target?.pathOptions ?? lop.pathOptions,
 						typewriter: target?.typewriter ?? lop.typewriter,
@@ -2816,7 +2646,8 @@ const CompositorWebGPURenderer = async (args) => {
 						fontStyle: lop.fontStyle,
 						fontWeight: lop.fontWeight,
 						fill: target?.fill ?? target?.color ?? lop.fill,
-						align: lop.align === "start" ? "left" : lop.align === "end" ? "right" : lop.align,
+						align: lop.align,
+						direction: lop.direction,
 						verticalAlign: lop.verticalAlign,
 						letterSpacing: target?.letterSpacing ?? lop.letterSpacing,
 						lineHeight: lop.lineHeight,
@@ -2853,6 +2684,7 @@ const CompositorWebGPURenderer = async (args) => {
 						durationMs: layerDurationInMS,
 						opacity: 1,
 						fps,
+						...typeof lop.dpr === "number" && { dpr: lop.dpr },
 						excludeTextures: [
 							activeTex,
 							targetTexture,
@@ -2868,7 +2700,8 @@ const CompositorWebGPURenderer = async (args) => {
 							fontStyle: lop.fontStyle,
 							fill: lop.fill,
 							color: lop.fill,
-							align: lop.align === "start" ? "left" : lop.align === "end" ? "right" : lop.align ?? "center",
+							align: lop.align ?? "center",
+							direction: lop.direction,
 							verticalAlign: lop.verticalAlign ?? lop.textAlignVertical,
 							lineHeight: lop.lineHeight,
 							letterSpacing: lop.letterSpacing,
@@ -3037,11 +2870,11 @@ const CompositorWebGPURenderer = async (args) => {
 					viewportHeight: texH,
 					layerX: sampledX,
 					layerY: sampledY,
-					roughness: resolveVal(target?.roughness ?? target?.relightRoughness ?? relightOpts.specularRoughness ?? relightOpts.roughness, .35, compositionFrame, fps ?? 24),
-					specularStrength: resolveVal(target?.specularStrength ?? target?.relightSpecularStrength ?? relightOpts.specularStrength, .7, compositionFrame, fps ?? 24),
-					metallic: resolveVal(target?.metallic ?? target?.relightMetallic ?? relightOpts.metallic, 0, compositionFrame, fps ?? 24),
-					ambientIntensity: resolveVal(target?.ambientIntensity ?? target?.relightAmbientIntensity ?? relightOpts.ambientIntensity, .15, compositionFrame, fps ?? 24),
-					depthScale: resolveVal(target?.depthScale ?? target?.relightDepthScale ?? relightOpts.depthScale, 1, compositionFrame, fps ?? 24),
+					roughness: resolveFrameNumber(target?.roughness ?? target?.relightRoughness ?? relightOpts.specularRoughness ?? relightOpts.roughness, .35, compositionFrame, fps ?? 24),
+					specularStrength: resolveFrameNumber(target?.specularStrength ?? target?.relightSpecularStrength ?? relightOpts.specularStrength, .7, compositionFrame, fps ?? 24),
+					metallic: resolveFrameNumber(target?.metallic ?? target?.relightMetallic ?? relightOpts.metallic, 0, compositionFrame, fps ?? 24),
+					ambientIntensity: resolveFrameNumber(target?.ambientIntensity ?? target?.relightAmbientIntensity ?? relightOpts.ambientIntensity, .15, compositionFrame, fps ?? 24),
+					depthScale: resolveFrameNumber(target?.depthScale ?? target?.relightDepthScale ?? relightOpts.depthScale, 1, compositionFrame, fps ?? 24),
 					opacity: 1
 				}, "clear");
 				finalTex = relitTex;
@@ -3482,5 +3315,5 @@ audioRegistry.register("CompositorLayer", compositorLayerAudioProcessor);
 var renderers_default = defineRenderer({ WebGPURenderer: CompositorWebGPURenderer });
 
 //#endregion
-export { Transform3DMath, renderers_default as default, has3DTransform, solveHomography };
-//# sourceMappingURL=renderer-BfAWZziM.mjs.map
+export { Transform3DMath, renderers_default as default, has3DTransform };
+//# sourceMappingURL=renderer-_1xGBbxn.mjs.map