shaders 3.0.452 → 3.1.454

package/dist/core/Ellipse-WuGsM7Gr.js

@@ -0,0 +1,168 @@
+import { rn as vec2f, rt as src_default, un as f32 } from "./edges-CD7gCAto.js";
+import { C as defineSdfShapeShader } from "./porters-DUtQounc.js";
+import { C as sdf_exports, E as strokeMaskFromSdf, a as ShapeMask, h as ellipseSdf, w as shapeLocalCoords } from "./device-B0ZwBfOg.js";
+const ellipseShape = src_default.fn([
+	vec2f,
+	f32,
+	f32,
+	f32,
+	f32,
+	f32,
+	f32,
+	vec2f,
+	f32
+], ShapeMask)(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((center, radiusX, radiusY, rotation, softness, strokeThickness, strokePosition, uv, aspect) => {
+	"use gpu";
+	const local = shapeLocalCoords(center, rotation, uv, aspect);
+	return strokeMaskFromSdf(ellipseSdf(local.x, local.y, radiusX, radiusY), softness, strokeThickness, strokePosition);
+}), {
+	v: 1,
+	name: void 0,
+	ast: {
+		"params": [
+			{
+				"type": "i",
+				"name": "center"
+			},
+			{
+				"type": "i",
+				"name": "radiusX"
+			},
+			{
+				"type": "i",
+				"name": "radiusY"
+			},
+			{
+				"type": "i",
+				"name": "rotation"
+			},
+			{
+				"type": "i",
+				"name": "softness"
+			},
+			{
+				"type": "i",
+				"name": "strokeThickness"
+			},
+			{
+				"type": "i",
+				"name": "strokePosition"
+			},
+			{
+				"type": "i",
+				"name": "uv"
+			},
+			{
+				"type": "i",
+				"name": "aspect"
+			}
+		],
+		"body": [0, [
+			[
+				13,
+				"local",
+				[
+					6,
+					[
+						7,
+						"sdf",
+						"shapeLocalCoords"
+					],
+					[
+						"center",
+						"rotation",
+						"uv",
+						"aspect"
+					]
+				]
+			],
+			[
+				13,
+				"dist",
+				[
+					6,
+					[
+						7,
+						"sdf",
+						"ellipseSdf"
+					],
+					[
+						[
+							7,
+							"local",
+							"x"
+						],
+						[
+							7,
+							"local",
+							"y"
+						],
+						"radiusX",
+						"radiusY"
+					]
+				]
+			],
+			[10, [
+				6,
+				[
+					7,
+					"sdf",
+					"strokeMaskFromSdf"
+				],
+				[
+					"dist",
+					"softness",
+					"strokeThickness",
+					"strokePosition"
+				]
+			]]
+		]],
+		"externalNames": ["sdf"]
+	},
+	externals: () => ({ sdf: sdf_exports })
+}) && $.f)({}));
+const componentDefinition = defineSdfShapeShader({
+	name: "Ellipse",
+	description: "Ellipse with independently adjustable horizontal and vertical radii",
+	shapeFn: ellipseShape,
+	shapeFnName: "ellipseShape",
+	bodyArgs: [
+		"radiusX",
+		"radiusY",
+		"rotation"
+	],
+	colorDescription: "Fill color of the ellipse",
+	centerDescription: "Center position of the ellipse",
+	bounds: { size: {
+		width: "radiusX",
+		height: "radiusY"
+	} },
+	shapeProps: {
+		radiusX: {
+			default: .35,
+			description: "Horizontal semi-axis radius",
+			ui: {
+				type: "range",
+				min: .01,
+				max: 1,
+				step: .01,
+				label: "Width",
+				group: "Shape"
+			}
+		},
+		radiusY: {
+			default: .2,
+			description: "Vertical semi-axis radius",
+			ui: {
+				type: "range",
+				min: .01,
+				max: 1,
+				step: .01,
+				label: "Height",
+				group: "Shape"
+			}
+		}
+	}
+});
+var Ellipse_default = componentDefinition;
+export { componentDefinition as n, ellipseShape as r, Ellipse_default as t };

package/dist/core/{Emboss-UmDoGSQF.js → Emboss-D5RYAc-U.js}

@@ -1,8 +1,8 @@
-import { Bt as smoothstep, P as unpremultiplyAlpha, Vt as sqrt, Wt as data_exports, an as vec3f, bt as clamp, cn as f32, d as ZERO, dn as __export, gt as abs, ht as select, kt as max, m as call, nn as vec2f, rt as std_exports, sn as vec4f, tt as src_default, v as floatE, xt as cos, zt as sin } from "./edges-Dm0I-Ud7.js";
-import { h as sdf_exports } from "./sdf-B5E-Vv1j.js";
-import { f as sdf3d_exports, n as shapeEffectBoundingBoxDeclaration, t as resolveShapeType } from "./shapeEffectBounds-CjOvQ3n3.js";
-import { i as sdfSpaceUV, r as offsetUV } from "./glass-ClmiwTb0.js";
-import { c as transformPosition } from "./transformations-CsPUHppB.js";
+import { At as max, Bt as sin, Gt as data_exports, Ht as sqrt, I as unpremultiplyAlpha, St as cos, Vt as smoothstep, _t as abs, at as std_exports, cn as vec4f, f as ZERO, gt as select, h as call, on as vec3f, pn as __export, rn as vec2f, rt as src_default, un as f32, xt as clamp, y as floatE } from "./edges-CD7gCAto.js";
+import { C as sdf_exports } from "./device-B0ZwBfOg.js";
+import { i as shapeEffectBoundingBoxDeclaration, n as sdf3d_exports } from "./sdf3d-CP87OlsQ.js";
+import { i as sdfSpaceUV, r as offsetUV } from "./glass-D8xs_kIG.js";
+import { c as transformPosition } from "./transformations-B-zNWNdd.js";
 var emboss_exports = /* @__PURE__ */ __export({
 	applyEmbossEffect: () => applyEmbossEffect$1,
 	embossComposite: () => embossComposite,
@@ -1409,8 +1409,8 @@ function applyEmbossEffect$1(params, sdfSampler, childTexture, options) {
 	]);
 }
 var { applyEmbossEffect } = emboss_exports;
-var { createSvgSdfSampler, createAnalyticSdfSampler, driveAnalyticSubProps, ANALYTIC_SDF_EXTRA_FIELDS } = sdf_exports;
-var { createVolumetricFieldComputeNode, buildVolumetricFieldSampler, VOLUMETRIC_FIELD_EXTRA_FIELDS, is3dShapeType, isVolumetricShapeType } = sdf3d_exports;
+var { ANALYTIC_SDF_EXTRA_FIELDS } = sdf_exports;
+var { createVolumetricFieldComputeNode, resolveShapeFieldSampler, VOLUMETRIC_FIELD_EXTRA_FIELDS } = sdf3d_exports;
 var DEFAULT_SHAPE_CONFIG = JSON.stringify({
 	type: "circleSDF",
 	radius: .35
@@ -1542,37 +1542,16 @@ const componentDefinition = {
 			description: "Active SDF shape type — triggers recompile when shape is switched. When empty, derived from shape JSON at mount time."
 		}
 	},
-	compute: (params) => {
-		const vf = createVolumetricFieldComputeNode(params, () => params.getCpuValue("shape"), "none", "firstLobe");
-		return vf ? {
-			outputs: vf.outputs,
-			getComputeNodes: (fp) => vf.getComputeNodes(fp)
-		} : null;
-	},
+	compute: (params) => createVolumetricFieldComputeNode(params, () => params.getCpuValue("shape"), "none", "firstLobe"),
 	fragment: (params) => {
-		const { childNode, computeOutputs, convertToTexture, propValues, getCpuValue, uniforms } = params;
+		const { childNode, convertToTexture } = params;
 		if (!childNode) return ZERO;
 		const childTexture = convertToTexture(childNode);
-		const fieldTex = computeOutputs?.volumetricFieldTexture;
-		if (fieldTex) {
-			const s = buildVolumetricFieldSampler(fieldTex, {
-				originX: uniforms._vfOriginX,
-				originY: uniforms._vfOriginY,
-				spanX: uniforms._vfSpanX,
-				spanY: uniforms._vfSpanY,
-				activeResF: uniforms._vfActiveRes,
-				rBound: uniforms._vfRBound
-			});
-			return applyEmbossEffect(params, s.volumetricFieldSampler, childTexture, {
-				volumetric: true,
-				gradSampler: s.volumetricFieldSamplerFast
-			});
-		}
-		const shapeSdfUrl = propValues.shapeSdfUrl || "";
-		const shapeType = propValues.shapeType || "";
-		if (shapeSdfUrl) return applyEmbossEffect(params, createSvgSdfSampler(params, shapeSdfUrl), childTexture, { volumetric: isVolumetricShapeType(shapeType) });
-		const st = resolveShapeType(shapeType, getCpuValue("shape"));
-		return applyEmbossEffect(params, createAnalyticSdfSampler(st, driveAnalyticSubProps(params, () => getCpuValue("shape"))), childTexture, { volumetric: is3dShapeType(st) });
+		const { sampler, gradSampler, volumetric } = resolveShapeFieldSampler(params);
+		return applyEmbossEffect(params, sampler, childTexture, {
+			volumetric,
+			gradSampler
+		});
 	}
 };
 var Emboss_default = componentDefinition;

package/dist/core/{Engraving-CN0OrgUo.js → Engraving-DNNHKvIr.js}

@@ -1,8 +1,10 @@
-import { Bt as smoothstep, Ct as dot, Ot as length, P as unpremultiplyAlpha, Wt as data_exports, an as vec3f, b as vec4, bt as clamp, cn as f32, d as ZERO, jt as mix, kt as max, m as call, nn as vec2f, rt as std_exports, sn as vec4f, tt as src_default, v as floatE, vt as atan2, xt as cos, zt as sin } from "./edges-Dm0I-Ud7.js";
-import { p as noise_exports, u as mxNoiseFloat2 } from "./noise-C_ZfgxTN.js";
-import { a as transformColor, c as transformPosition, r as transformAngle } from "./transformations-CsPUHppB.js";
-var TAU = 6.283185307179586;
-var DEG_TO_RAD = .017453292519943295;
+import { At as max, Bt as sin, Gt as data_exports, Mt as mix, St as cos, Vt as smoothstep, at as std_exports, cn as vec4f, h as call, kt as length, on as vec3f, rn as vec2f, rt as src_default, un as f32, wt as dot, x as vec4, xt as clamp, y as floatE, yt as atan2 } from "./edges-CD7gCAto.js";
+import { o as TAU$1, t as DEG_TO_RAD$1 } from "./constants-DoOzbl5b.js";
+import { x as defineRttFilter } from "./porters-DUtQounc.js";
+import { p as noise_exports, u as mxNoiseFloat2 } from "./noise-Bd6IGS0W.js";
+import { a as transformColor, c as transformPosition, r as transformAngle } from "./transformations-B-zNWNdd.js";
+var TAU = TAU$1;
+var DEG_TO_RAD = DEG_TO_RAD$1;
 var transformStyle = (value) => value === "spiral" ? 2 : value === "line" ? 0 : 1;
 var styleModeOf = (raw) => typeof raw === "number" ? raw : transformStyle(String(raw));
 const engravingPlate = src_default.fn([
@@ -1208,13 +1210,11 @@ function makeEngravingComposite(style) {
 		})
 	}) && $.f)({})).$name(`engravingComposite_${style}`);
 }
-const componentDefinition = {
+const componentDefinition = defineRttFilter({
 	name: "Engraving",
 	boundingBoxDeclaration: { aspectRatio: null },
 	category: "Stylize",
 	description: "Copper-plate line engraving — the image is redrawn as flowing line work whose weight swells with darkness, lines displaced by the form like a banknote portrait: a single plate, cross-hatched shadow plates, or one continuous spiral cut",
-	requiresRTT: true,
-	requiresChild: true,
 	blendWithChildren: false,
 	props: {
 		style: {
@@ -1339,9 +1339,9 @@ const componentDefinition = {
 			}
 		}
 	},
-	fragment: ({ childNode, ctx, uniforms, propValues, convertToTexture }) => {
-		if (!childNode) return ZERO;
-		const childColor = call(unpremultiplyAlpha, "unpremultiplyAlpha", [convertToTexture(childNode).sample(ctx.uv)]);
+	resultAlpha: "straight",
+	build: ({ sampleStraight, ctx, uniforms, propValues }) => {
+		const childColor = sampleStraight(ctx.uv);
 		const style = styleModeOf(propValues.style);
 		const composite = makeEngravingComposite(style);
 		const p0 = vec4(uniforms.angle, uniforms.frequency, uniforms.relief, uniforms.waviness);
@@ -1357,6 +1357,6 @@ const componentDefinition = {
 			p1
 		]);
 	}
-};
+});
 var Engraving_default = componentDefinition;
 export { makeEngravingComposite as a, engravingSpiralPlate as i, componentDefinition as n, engravingPlate as r, Engraving_default as t };

package/dist/core/{ErosionNoise-Wu1fxJfJ.js → ErosionNoise-w1aTuwY4.js}

@@ -1,7 +1,8 @@
-import { Wt as data_exports, cn as f32, m as call, nn as vec2f, rt as std_exports, tt as src_default, wt as exp } from "./edges-Dm0I-Ud7.js";
-import { i as erosion12, p as noise_exports } from "./noise-C_ZfgxTN.js";
-import { n as toneAndColorExpr } from "./noiseColor-88y7I7KI.js";
-import { i as noiseToneProps, t as noiseColorProps } from "./noiseColor-Buljb-6r.js";
+import { h as call, rn as vec2f, rt as src_default, un as f32 } from "./edges-CD7gCAto.js";
+import { i as fields_exports, t as aspectScaledDomain } from "./fields-CC0756V2.js";
+import { i as erosion12, p as noise_exports } from "./noise-Bd6IGS0W.js";
+import { n as toneAndColorExpr } from "./noiseColor-DYhX5Js1.js";
+import { i as noiseToneProps, t as noiseColorProps } from "./noiseColor-DRDY44sf.js";
 const erosionNoiseField = src_default.fn([
 	vec2f,
 	vec2f,
@@ -9,8 +10,7 @@ const erosionNoiseField = src_default.fn([
 	f32
 ], f32)(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((uv, viewport, scale, seed) => {
 	"use gpu";
-	const aspect = __tsover_div(viewport.x, viewport.y);
-	const pos = vec2f(__tsover_mul(uv.x, aspect), uv.y).mul(exp(scale)).add(seed);
+	const pos = aspectScaledDomain(uv, viewport, scale, seed);
 	return __tsover_add(__tsover_mul(erosion12(pos).x, .5), .5);
 }), {
 	v: 1,
@@ -34,113 +34,50 @@ const erosionNoiseField = src_default.fn([
 				"name": "seed"
 			}
 		],
-		"body": [0, [
+		"body": [0, [[
+			13,
+			"pos",
 			[
-				13,
-				"aspect",
+				6,
 				[
-					1,
-					[
-						7,
-						"viewport",
-						"x"
-					],
-					"/",
-					[
-						7,
-						"viewport",
-						"y"
-					]
-				]
-			],
-			[
-				13,
-				"aspectUV",
+					7,
+					"fields",
+					"aspectScaledDomain"
+				],
 				[
-					6,
-					[
-						7,
-						"d",
-						"vec2f"
-					],
-					[[
-						1,
-						[
-							7,
-							"uv",
-							"x"
-						],
-						"*",
-						"aspect"
-					], [
-						7,
-						"uv",
-						"y"
-					]]
+					"uv",
+					"viewport",
+					"scale",
+					"seed"
 				]
-			],
+			]
+		], [10, [
+			1,
 			[
-				13,
-				"pos",
-				[
-					6,
-					[
-						7,
-						[
-							6,
-							[
-								7,
-								"aspectUV",
-								"mul"
-							],
-							[[
-								6,
-								[
-									7,
-									"std",
-									"exp"
-								],
-								["scale"]
-							]]
-						],
-						"add"
-					],
-					["seed"]
-				]
-			],
-			[10, [
 				1,
 				[
-					1,
+					7,
 					[
-						7,
+						6,
 						[
-							6,
-							[
-								7,
-								"noise",
-								"erosion12"
-							],
-							["pos"]
+							7,
+							"noise",
+							"erosion12"
 						],
-						"x"
+						["pos"]
 					],
-					"*",
-					[5, "0.5"]
+					"x"
 				],
-				"+",
+				"*",
 				[5, "0.5"]
-			]]
-		]],
-		"externalNames": [
-			"d",
-			"std",
-			"noise"
-		]
+			],
+			"+",
+			[5, "0.5"]
+		]]]],
+		"externalNames": ["fields", "noise"]
 	},
 	externals: () => ({
-		d: data_exports,
-		std: std_exports,
+		fields: fields_exports,
 		noise: noise_exports
 	})
 }) && $.f)({}));

package/dist/core/{Exposure-B5oEoUk-.js → Exposure-BSsbosYN.js}

@@ -1,4 +1,5 @@
-import { Wt as data_exports, cn as f32, d as ZERO, m as call, sn as vec4f, tt as src_default } from "./edges-Dm0I-Ud7.js";
+import { Gt as data_exports, cn as vec4f, rt as src_default, un as f32 } from "./edges-CD7gCAto.js";
+import { S as definePointwiseFilter } from "./porters-DUtQounc.js";
 const exposureColor = src_default.fn([vec4f, f32], vec4f)(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((color, gain) => {
 	"use gpu";
 	return vec4f(color.xyz.mul(gain), color.w);
@@ -46,15 +47,15 @@ const exposureColor = src_default.fn([vec4f, f32], vec4f)(/* @__PURE__ */ (($) =
 	},
 	externals: () => ({ d: data_exports })
 }) && $.f)({}));
-const componentDefinition = {
+const componentDefinition = definePointwiseFilter({
 	name: "Exposure",
 	boundingBoxDeclaration: { aspectRatio: null },
 	category: "Adjustments",
 	description: "Multiplicative exposure (gain) on the child. Unlike additive brightness, it scales values around black — blacks stay black while highlights can be pushed past 1.0 to feed HDR bloom and tone-mapping roll-off. Pointwise, so no extra render pass is needed.",
-	requiresChild: true,
 	props: { exposure: {
 		default: 1,
 		description: "Brightness multiplier (gain). 1 = unchanged, >1 pushes highlights past white for HDR bloom, <1 darkens.",
+		compileTimeWhen: (prev, next) => prev === 1 !== (next === 1),
 		ui: {
 			type: ["range", "map"],
 			min: 0,
@@ -64,13 +65,16 @@ const componentDefinition = {
 			group: "Adjustments"
 		}
 	} },
-	fragment: ({ uniforms, childNode }) => {
-		if (!childNode) {
-			console.error("You must pass a child component into the Exposure shader.");
-			return ZERO;
-		}
-		return call(exposureColor, "exposureColor", [childNode, uniforms.exposure]);
-	}
-};
+	body: {
+		fn: exposureColor,
+		hint: "exposureColor"
+	},
+	args: ({ uniforms }) => [uniforms.exposure],
+	identity: {
+		props: ["exposure"],
+		when: (p) => (p.exposure ?? 1) === 1
+	},
+	missingChildMessage: "You must pass a child component into the Exposure shader."
+});
 var Exposure_default = componentDefinition;
 export { componentDefinition as n, exposureColor as r, Exposure_default as t };

package/dist/core/{FallingLines-CsNVa3dc.js → FallingLines-C1YT49dj.js}

@@ -1,7 +1,9 @@
-import { Bt as smoothstep, Dt as fract, Et as floor, U as mixColorsLinear, Vt as sqrt, W as mixColorsVariants, Wt as data_exports, b as vec4, bt as clamp, cn as f32, gt as abs, kt as max, m as call, nn as vec2f, rt as std_exports, tt as src_default, ut as fwidth, xt as cos, zt as sin } from "./edges-Dm0I-Ud7.js";
-import { t as animatedTime } from "./porters-DnWlc17D.js";
-import { a as transformColor, o as transformColorSpace, t as colorSpaceOptions } from "./transformations-CsPUHppB.js";
-var DEG_TO_RAD = Math.PI / 180;
+import { At as max, Bt as sin, Dt as floor, G as mixColorsLinear, Gt as data_exports, Ht as sqrt, K as mixColorsVariants, Ot as fract, St as cos, Vt as smoothstep, _t as abs, at as std_exports, ft as fwidth, h as call, rn as vec2f, rt as src_default, un as f32, x as vec4, xt as clamp } from "./edges-CD7gCAto.js";
+import { t as DEG_TO_RAD$1 } from "./constants-DoOzbl5b.js";
+import { r as geom_exports, t as aspectOf } from "./geom-90G-d_hc.js";
+import { t as animatedTime } from "./porters-DUtQounc.js";
+import { a as transformColor, o as transformColorSpace, t as colorSpaceOptions } from "./transformations-B-zNWNdd.js";
+var DEG_TO_RAD = DEG_TO_RAD$1;
 var colHash = src_default.fn([f32], vec2f)(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((idx) => {
 	"use gpu";
 	return vec2f(fract(__tsover_mul(sin(__tsover_mul(idx, 127.1)), 43758.5453123)), fract(__tsover_mul(sin(__tsover_mul(idx, 311.7)), 38291.3421)));
@@ -94,7 +96,7 @@ const fallingLinesField = src_default.fn([
 	f32
 ], vec2f)(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((uv, vp, angle, density, speedVariance, trailLength, strokeWidth, rounding, balance, animTime) => {
 	"use gpu";
-	const aspect = __tsover_div(vp.x, vp.y);
+	const aspect = aspectOf(vp);
 	const centeredUV = vec2f(__tsover_mul(uv.x, aspect), uv.y).sub(vec2f(__tsover_mul(aspect, .5), .5));
 	const angleRad = __tsover_mul(angle, DEG_TO_RAD);
 	const cosA = cos(angleRad);
@@ -177,18 +179,13 @@ const fallingLinesField = src_default.fn([
 				13,
 				"aspect",
 				[
-					1,
+					6,
 					[
 						7,
-						"vp",
-						"x"
+						"geom",
+						"aspectOf"
 					],
-					"/",
-					[
-						7,
-						"vp",
-						"y"
-					]
+					["vp"]
 				]
 			],
 			[
@@ -896,6 +893,7 @@ const fallingLinesField = src_default.fn([
 			]]
 		]],
 		"externalNames": [
+			"geom",
 			"d",
 			"DEG_TO_RAD",
 			"std",
@@ -903,6 +901,7 @@ const fallingLinesField = src_default.fn([
 		]
 	},
 	externals: () => ({
+		geom: geom_exports,
 		d: data_exports,
 		DEG_TO_RAD,
 		std: std_exports,

package/dist/core/{FilmGrain-Br5EDq0B.js → FilmGrain-BeZQzxdU.js}

@@ -1,4 +1,5 @@
-import { Ct as dot, Dt as fract, Nt as pow, Wt as data_exports, an as vec3f, bt as clamp, cn as f32, d as ZERO, m as call, nn as vec2f, rt as std_exports, sn as vec4f, tt as src_default, zt as sin } from "./edges-Dm0I-Ud7.js";
+import { Bt as sin, Gt as data_exports, Ot as fract, Pt as pow, at as std_exports, cn as vec4f, on as vec3f, rn as vec2f, rt as src_default, un as f32, wt as dot, xt as clamp } from "./edges-CD7gCAto.js";
+import { S as definePointwiseFilter } from "./porters-DUtQounc.js";
 const filmGrainColor = src_default.fn([
 	vec4f,
 	vec2f,
@@ -255,12 +256,11 @@ const filmGrainColor = src_default.fn([
 		d: data_exports
 	})
 }) && $.f)({}));
-const componentDefinition = {
+const componentDefinition = definePointwiseFilter({
 	name: "FilmGrain",
 	boundingBoxDeclaration: { aspectRatio: null },
 	category: "Stylize",
 	description: "Analog film grain texture overlay, weighted toward darker areas",
-	requiresChild: true,
 	extraFields: { animTime: {
 		schema: f32,
 		initial: 0
@@ -269,6 +269,7 @@ const componentDefinition = {
 		strength: {
 			default: .5,
 			description: "Intensity of the film grain noise",
+			compileTimeWhen: (prev, next) => prev === 0 !== (next === 0),
 			ui: {
 				type: ["range", "map"],
 				min: 0,
@@ -301,24 +302,29 @@ const componentDefinition = {
 			transform: (value) => value ? 1 : 0
 		}
 	},
-	fragment: (params) => {
-		const { childNode, uniforms, ctx } = params;
-		if (!childNode) return ZERO;
+	body: {
+		fn: filmGrainColor,
+		hint: "filmGrainColor"
+	},
+	args: ({ uniforms, ctx }) => [
+		ctx.uv,
+		ctx.viewportSize,
+		uniforms.strength,
+		uniforms.bias,
+		uniforms.animTime
+	],
+	identity: {
+		props: ["strength"],
+		when: (p) => (p.strength ?? .5) === 0
+	},
+	setup: (params) => {
 		let animTimeAcc = 0;
 		params.onBeforeRender(({ deltaTime }) => {
 			const on = params.getCpuValue("animated") > 0 ? 1 : 0;
 			animTimeAcc += deltaTime * on * 10;
 			params.setExtraField("animTime", animTimeAcc);
 		});
-		return call(filmGrainColor, "filmGrainColor", [
-			childNode,
-			ctx.uv,
-			ctx.viewportSize,
-			uniforms.strength,
-			uniforms.bias,
-			uniforms.animTime
-		]);
 	}
-};
+});
 var FilmGrain_default = componentDefinition;
 export { componentDefinition as n, filmGrainColor as r, FilmGrain_default as t };