framefields 2.5.2 → 2.5.5

package/dist/{renderer-Db_wphHH.mjs → renderer-YBwN9uyj.mjs}

@@ -1,14 +1,14 @@
 import "./chunk-D7gtBK74.mjs";
-import { Ot as getActiveMediaMetadata, an as reportRenderDiagnostic, cn as resolveNumber, on as resolveBoolean, p as DEFAULT_DURATION_MS } from "./dist-DFeF-ygz.mjs";
-import { a as resolveFrameNumber, c as solveHomography, n as defineRenderer, t as audioRegistry } from "./renderer-C9r0-KY4.mjs";
-import { K as parseColor, M as generateExtrudedTextGeometry, P as getPrimitiveGeometry, W as measureMaxCaptionHeight, Z as poseNodes, ct as Camera3D, d as ScreenSpaceRelightPipeline, dt as Light3D, et as resolveTextSpans, ht as Vector3Math, it as srtLoader, j as fitSpansToText, l as Renderer3D, n as AudioLatentTrackCache, p as SlugFontCache, pt as Matrix4Math, rt as spansText, st as resolveMediaSourceUrl, z as jointMatrices } from "./dist-DBWkkSvJ.mjs";
-import { a as createFullscreenPipeline, l as fragmentBindGroupLayout, n as PREMULTIPLIED_BLEND, t as FULLSCREEN_QUAD_WGSL } from "./gpu-Dq_uI_00.mjs";
-import { a as resolveLayerDuration, f as measureText, n as decodeAudioSource } from "./dist-DHQVWaV2.mjs";
+import { Ot as getActiveMediaMetadata, an as reportRenderDiagnostic, cn as resolveNumber, on as resolveBoolean, p as DEFAULT_DURATION_MS } from "./dist-D021IFfp.mjs";
+import { l as solveHomography, n as defineRenderer, o as resolveFrameNumber, r as effectReach, t as audioRegistry } from "./renderer-BgmO1Dzw.mjs";
+import { B as jointMatrices, F as getPrimitiveGeometry, G as measureMaxCaptionHeight, M as fitSpansToText, N as generateExtrudedTextGeometry, Q as poseNodes, at as srtLoader, ct as resolveMediaSourceUrl, d as ScreenSpaceRelightPipeline, ft as Light3D, gt as Vector3Math, it as spansText, l as Renderer3D, lt as Camera3D, mt as Matrix4Math, n as AudioLatentTrackCache, p as SlugFontCache, q as parseColor, tt as resolveTextSpans } from "./dist-BuirkW-f.mjs";
+import { a as createFullscreenPipeline, l as fragmentBindGroupLayout, n as PREMULTIPLIED_BLEND, t as FULLSCREEN_QUAD_WGSL } from "./gpu-BRBIoxMC.mjs";
+import { a as resolveLayerDuration, f as measureText, n as decodeAudioSource } from "./dist-DBdxM6xv.mjs";
 import { o as TemporalDeflickerPipeline } from "./dist-C_SMBmHr.mjs";
-import { B as evaluateTrackAtFrame, F as computeLayout, H as initLayout, M as collectNodeOps, z as evaluateKeyframes } from "./program-BdPDtfVv.mjs";
+import { B as evaluateTrackAtFrame, F as computeLayout, H as initLayout, M as collectNodeOps, z as evaluateKeyframes } from "./program-O2bWX0cs.mjs";
 import gsapModule from "gsap";
 
-//#region ../../nodes/node-compositor/dist/renderers-1O3UOrUy.mjs
+//#region ../../nodes/node-compositor/dist/renderers-D7DbsafK.mjs
 /**
 * Solves a cubic bezier curve defined by control points (x1, y1) and (x2, y2)
 * for a given progress parameter t in [0, 1].
@@ -1283,6 +1283,94 @@ function computeContainerScissor(matrix, width, height) {
 		height: Math.max(0, Math.round(maxY - minY))
 	};
 }
+/**
+* How far a layer's effects draw past its pixels, px: the sum of what each
+* effect's renderer declares (`reach`), or null as soon as one doesn't
+* (it then runs over the whole target, as any effect may need to).
+*/
+function effectsReach(effects) {
+	let reach = 0;
+	for (const e of effects) {
+		const op = e && typeof e.toOperation === "function" ? e.toOperation() : e;
+		const r = op ? effectReach(op) : null;
+		if (r === null) return null;
+		reach += r;
+	}
+	return reach;
+}
+function expandRect(r, by) {
+	return {
+		x: r.x - by,
+		y: r.y - by,
+		width: r.width + by * 2,
+		height: r.height + by * 2
+	};
+}
+/** `r` within a `width` × `height` target, in whole pixels; null when nothing is left. */
+function clampRect(r, width, height) {
+	const x0 = Math.max(0, Math.floor(r.x));
+	const y0 = Math.max(0, Math.floor(r.y));
+	const x1 = Math.min(width, Math.ceil(r.x + r.width));
+	const y1 = Math.min(height, Math.ceil(r.y + r.height));
+	return x1 > x0 && y1 > y0 ? {
+		x: x0,
+		y: y0,
+		width: x1 - x0,
+		height: y1 - y0
+	} : null;
+}
+/**
+* `applyLayerEffects` over `region` of a full-target texture only: the
+* region is cut out, its effects run at its size, and the result lands back
+* at its place in a full-target texture. Without a region (or when it is
+* most of the target) the effects run over the whole texture.
+*/
+async function applyLayerEffectsInRegion(region, effects, sourceTex, width, height, ctx, encoder, props, drawChild, excludes, shiftedFrame, compositionFrame, fps, isVideoMode, layerId) {
+	const run = (tex, w, h, ex) => applyLayerEffects(effects, tex, w, h, ctx, encoder, props, drawChild, ex, shiftedFrame, compositionFrame, fps, isVideoMode, layerId);
+	if (!region || region.width * region.height > width * height * .6) return run(sourceTex, width, height, excludes);
+	const blit = (dest, w, h, src, at) => {
+		const pass = ctx.renderer.beginFrame(encoder, dest.createView(), {
+			r: 0,
+			g: 0,
+			b: 0,
+			a: 0
+		}, w, h, "clear");
+		ctx.renderer.pushScissor({
+			x: 0,
+			y: 0,
+			width: w,
+			height: h
+		});
+		ctx.renderer.pushIdentity();
+		ctx.renderer.drawTexture(pass, src, at, { opacity: 1 });
+		ctx.renderer.popTransform();
+		ctx.renderer.popScissor();
+		pass.end();
+	};
+	const cut = ctx.renderer.getTemporaryTexture(region.width, region.height, [sourceTex, ...excludes]);
+	blit(cut, region.width, region.height, sourceTex, {
+		x: -region.x,
+		y: -region.y,
+		width,
+		height
+	});
+	const fx = await run(cut, region.width, region.height, [
+		sourceTex,
+		cut,
+		...excludes
+	]);
+	const out = ctx.renderer.getTemporaryTexture(width, height, [
+		fx.texture,
+		sourceTex,
+		cut,
+		...excludes
+	]);
+	blit(out, width, height, fx.texture, region);
+	return {
+		texture: out,
+		view: out.createView()
+	};
+}
 async function applyLayerEffects(effects, sourceTex, width, height, ctx, encoder, props, drawChild, excludes, shiftedFrame, compositionFrame, fps, isVideoMode, layerId) {
 	const remainingEffects = effects.filter((e) => {
 		if (!e || typeof e !== "object") return false;
@@ -1759,6 +1847,30 @@ const CompositorWebGPURenderer = async (args) => {
 			};
 		};
 		let nodeIndex = 0;
+		/**
+		* True when every child of a rounded box sits where the rounding can't
+		* touch it (inside the inset at which the corner arcs meet 45°), as laid
+		* out and moved this frame, untransformed and without effects of its own.
+		*/
+		const childrenClearOfCorners = (children, box, radius) => {
+			const k = radius * (1 - Math.SQRT1_2);
+			for (const child of children) {
+				const cop = child.operation;
+				if (!cop) return false;
+				const t = targetsById[cop.id || cop.inputHandleId];
+				if (t?.hidden || cop.hidden) continue;
+				const r = rects[cop.id];
+				if (!r) return false;
+				const v = (key, d) => t?.[key] ?? cop[key] ?? d;
+				if (v("scale", 1) !== 1 || v("scaleX", 1) !== 1 || v("scaleY", 1) !== 1 || v("rotation", 0) !== 0 || v("rotateX", 0) !== 0 || v("rotateY", 0) !== 0) return false;
+				if (Array.isArray(cop.effects) && cop.effects.length > 0) return false;
+				if ((t?.animators ?? cop.animators)?.length) return false;
+				const x = r.x - box.x + (v("x", 0) - (cop.x ?? 0));
+				const y = r.y - box.y + (v("y", 0) - (cop.y ?? 0));
+				if (x < k || y < k || x + r.width > box.width - k || y + r.height > box.height - k) return false;
+			}
+			return true;
+		};
 		const renderNodeTree = async (vms, initialTex, initialView, excludes, accumulatedOpacity = 1, parentMatrix = new DOMMatrix(), parentRect = null, targetW = nativeWidth, targetH = nativeHeight, parent3DMatrix = null, isRootScene = false) => {
 			const sorted = [...vms].sort((a, b) => {
 				return (a.operation?.zIndex ?? 0) - (b.operation?.zIndex ?? 0);
@@ -2575,6 +2687,97 @@ const CompositorWebGPURenderer = async (args) => {
 					if (scissorRect) ctx.renderer.popScissor();
 					return res;
 				}
+				if ((!nodeVM.children || nodeVM.children.length === 0) && (!Array.isArray(lop.effects) || lop.effects.length === 0) && blendMode === "normal" && !(target?.motionBlurShutter ?? lop.motionBlurShutter) && (typeof lop.relighting !== "object" || !lop.relighting) && (typeof lop.relight !== "object" || !lop.relight) && (typeof target?.relighting !== "object" || !target?.relighting) && (typeof target?.relight !== "object" || !target?.relight) && (typeof lop.deflicker !== "object" || !lop.deflicker) && (typeof target?.deflicker !== "object" || !target?.deflicker)) {
+					if (layerOpacity <= 0) return {
+						finalTex: activeTex,
+						finalView: activeView
+					};
+					const br$2 = Math.min(target?.borderRadius ?? lop.borderRadius ?? lop.strokeRadius ?? 0, layerW / 2, layerH / 2);
+					const paint = shouldPaintContainerBackground(kind, lop.background);
+					const border = lop.borderWidth !== void 0 && lop.borderColor ? createBorderTexture(ctx, encoder, layerW, layerH, br$2, lop.borderWidth, lop.borderColor, lop.strokeAlign ?? "inside", [
+						activeTex,
+						targetTexture,
+						...excludes
+					]) : null;
+					if (paint || border) {
+						const pass$1 = ctx.renderer.beginFrame(encoder, activeView, {
+							r: 0,
+							g: 0,
+							b: 0,
+							a: 0
+						}, targetW, targetH, "load");
+						ctx.renderer.pushTransform(layerMatrix);
+						if (paint) ctx.renderer.drawRect(pass$1, {
+							x: 0,
+							y: 0,
+							width: layerW,
+							height: layerH
+						}, lop.background, br$2, { opacity: layerOpacity });
+						if (border) ctx.renderer.drawTexture(pass$1, border.borderTex, {
+							x: border.ox,
+							y: border.oy,
+							width: border.ow,
+							height: border.oh
+						}, { opacity: layerOpacity });
+						ctx.renderer.popTransform();
+						pass$1.end();
+					}
+					return {
+						finalTex: activeTex,
+						finalView: activeView
+					};
+				}
+				if (nodeVM.children && nodeVM.children.length > 0 && (!Array.isArray(lop.effects) || lop.effects.length === 0) && layerOpacity === 1 && blendMode === "normal" && !(target?.motionBlurShutter ?? lop.motionBlurShutter) && (typeof lop.relighting !== "object" || !lop.relighting) && (typeof lop.relight !== "object" || !lop.relight) && (typeof target?.relighting !== "object" || !target?.relighting) && (typeof target?.relight !== "object" || !target?.relight) && (typeof lop.deflicker !== "object" || !lop.deflicker) && (typeof target?.deflicker !== "object" || !target?.deflicker) && (clipRadius <= 0 || childrenClearOfCorners(nodeVM.children, rect, clipRadius))) {
+					const br$2 = Math.min(target?.borderRadius ?? lop.borderRadius ?? lop.strokeRadius ?? 0, layerW / 2, layerH / 2);
+					if (shouldPaintContainerBackground(kind, lop.background)) {
+						const bgPass = ctx.renderer.beginFrame(encoder, activeView, {
+							r: 0,
+							g: 0,
+							b: 0,
+							a: 0
+						}, targetW, targetH, "load");
+						ctx.renderer.pushTransform(layerMatrix);
+						ctx.renderer.drawRect(bgPass, {
+							x: 0,
+							y: 0,
+							width: layerW,
+							height: layerH
+						}, lop.background, br$2, { opacity: 1 });
+						ctx.renderer.popTransform();
+						bgPass.end();
+					}
+					if (scissorRect) ctx.renderer.pushScissorIntersect(scissorRect);
+					const res = await renderNodeTree(nodeVM.children, activeTex, activeView, excludes, accumulatedOpacity, layerMatrix, rect, targetW, targetH, null, isRootScene);
+					if (scissorRect) ctx.renderer.popScissor();
+					activeTex = res.finalTex;
+					activeView = res.finalView;
+					const border = lop.borderWidth !== void 0 && lop.borderColor ? createBorderTexture(ctx, encoder, layerW, layerH, br$2, lop.borderWidth, lop.borderColor, lop.strokeAlign ?? "inside", [
+						activeTex,
+						targetTexture,
+						...excludes
+					]) : null;
+					if (border) {
+						const pass$1 = ctx.renderer.beginFrame(encoder, activeView, {
+							r: 0,
+							g: 0,
+							b: 0,
+							a: 0
+						}, targetW, targetH, "load");
+						ctx.renderer.pushTransform(layerMatrix);
+						ctx.renderer.drawTexture(pass$1, border.borderTex, {
+							x: border.ox,
+							y: border.oy,
+							width: border.ow,
+							height: border.oh
+						}, { opacity: 1 });
+						ctx.renderer.popTransform();
+						pass$1.end();
+					}
+					return {
+						finalTex: activeTex,
+						finalView: activeView
+					};
+				}
 				const groupExcludes = [
 					activeTex,
 					targetTexture,
@@ -2716,7 +2919,8 @@ const CompositorWebGPURenderer = async (args) => {
 					activeGroupView = relitView;
 				}
 				if (Array.isArray(lop.effects) && lop.effects.length > 0) {
-					const postEffects = await applyLayerEffects(lop.effects, activeGroupTex, targetW, targetH, ctx, encoder, props, drawChild, [
+					const reach = shouldClip ? effectsReach(lop.effects) : null;
+					const postEffects = await applyLayerEffectsInRegion(reach === null ? null : clampRect(expandRect(computeContainerScissor(layerMatrix, layerW, layerH), reach), targetW, targetH), lop.effects, activeGroupTex, targetW, targetH, ctx, encoder, props, drawChild, [
 						activeTex,
 						targetTexture,
 						...excludes
@@ -3374,6 +3578,8 @@ const CompositorWebGPURenderer = async (args) => {
 		args.pass = finalPass;
 	}
 };
+/** Pixels of room around a border texture for its anti-aliased edge. */
+const BORDER_AA_MARGIN = 2;
 function createBorderTexture(ctx, encoder, w, h, br, borderWidth, borderColor, strokeAlign, excludeTextures) {
 	if (w <= 0 || h <= 0 || !borderColor || !borderWidth || borderWidth <= 0) return null;
 	let ox = 0;
@@ -3409,8 +3615,9 @@ function createBorderTexture(ctx, encoder, w, h, br, borderWidth, borderColor, s
 		innerRadius = 0;
 	}
 	if (ow <= 0 || oh <= 0) return null;
-	const borderTexW = Math.ceil(ow);
-	const borderTexH = Math.ceil(oh);
+	const m = BORDER_AA_MARGIN;
+	const borderTexW = Math.ceil(ow + 2 * m);
+	const borderTexH = Math.ceil(oh + 2 * m);
 	const outerTex = ctx.renderer.getTemporaryTexture(borderTexW, borderTexH, excludeTextures);
 	const outerView = outerTex.createView();
 	ctx.renderer.beginFrame(encoder, outerView, {
@@ -3426,8 +3633,8 @@ function createBorderTexture(ctx, encoder, w, h, br, borderWidth, borderColor, s
 		a: 0
 	}, borderTexW, borderTexH, "load");
 	ctx.renderer.drawRect(outerDrawPass, {
-		x: 0,
-		y: 0,
+		x: m,
+		y: m,
 		width: ow,
 		height: oh
 	}, borderColor, outerRadius);
@@ -3450,8 +3657,8 @@ function createBorderTexture(ctx, encoder, w, h, br, borderWidth, borderColor, s
 			a: 0
 		}, borderTexW, borderTexH, "load");
 		ctx.renderer.drawRect(innerDrawPass, {
-			x: borderWidth,
-			y: borderWidth,
+			x: m + borderWidth,
+			y: m + borderWidth,
 			width: innerW,
 			height: innerH
 		}, {
@@ -3463,18 +3670,18 @@ function createBorderTexture(ctx, encoder, w, h, br, borderWidth, borderColor, s
 		innerDrawPass.end();
 		return {
 			borderTex: ctx.renderer.composite(encoder, outerTex, innerTex, "mask-out", excludeTextures),
-			ox,
-			oy,
-			ow,
-			oh
+			ox: ox - m,
+			oy: oy - m,
+			ow: borderTexW,
+			oh: borderTexH
 		};
 	}
 	return {
 		borderTex: outerTex,
-		ox,
-		oy,
-		ow,
-		oh
+		ox: ox - m,
+		oy: oy - m,
+		ow: borderTexW,
+		oh: borderTexH
 	};
 }
 const compositorLayerAudioProcessor = async (channels, sampleRate, virtualMedia, ctx) => {
@@ -3530,4 +3737,4 @@ var renderers_default = defineRenderer({ WebGPURenderer: CompositorWebGPURendere
 
 //#endregion
 export { Transform3DMath, renderers_default as default, has3DTransform };
-//# sourceMappingURL=renderer-Db_wphHH.mjs.map
+//# sourceMappingURL=renderer-YBwN9uyj.mjs.map