shaders 2.5.109 → 2.5.110

package/dist/core/{Aurora-BPHeGEZ_.js → Aurora-KcUDr49P.js}

@@ -1,7 +1,7 @@
 import { a as transformColor, l as transformPosition, o as transformColorSpace, t as colorSpaceOptions } from "./transformations-B5lM6fYX.js";
 import { t as mixColors } from "./colorMixing-BPpDnR5I.js";
 import { t as createAnimatedTime } from "./time-DUqSFWvT.js";
-import { Fn, clamp, exp, float, fract, mix, mx_noise_float, pow, screenUV, sin, smoothstep, step, vec2, vec3, vec4, viewportSize } from "three/tsl";
+import { Fn, clamp, exp, float, fract, mix, mx_noise_float, pow, screenUV, sin, smoothstep, vec2, vec3, vec4, viewportSize } from "three/tsl";
 const componentDefinition = {
 	name: "Aurora",
 	category: "Textures",
@@ -75,6 +75,7 @@ const componentDefinition = {
 		},
 		curtainCount: {
 			default: 4,
+			compileTime: true,
 			description: "Number of aurora curtain layers",
 			ui: {
 				type: "range",
@@ -167,7 +168,7 @@ const componentDefinition = {
 		const csMode = uniforms.colorSpace.uniform.value;
 		const balanceExp = mix(float(2.5), float(.4), uniforms.balance.uniform.mul(.01));
 		const intensity = uniforms.intensity.uniform.mul(.018);
-		const curtainCount = uniforms.curtainCount.uniform;
+		const curtainCount = uniforms.curtainCount.uniform.value | 0;
 		const waviness = uniforms.waviness.uniform.mul(.01);
 		const rayAmount = uniforms.rayDensity.uniform.mul(.01);
 		const auroraHeight = uniforms.height.uniform.mul(.01);
@@ -209,18 +210,24 @@ const componentDefinition = {
 			const a1 = auroraCurtain(uv$1, float(0), float(0));
 			weightedT.assign(weightedT.add(a1.x.mul(a1.y)));
 			totalAlpha.assign(totalAlpha.add(a1.y));
-			const a2 = auroraCurtain(uv$1, float(1), float(3.1));
-			const w2 = a2.y.mul(step(float(2), curtainCount)).mul(.65);
-			weightedT.assign(weightedT.add(a2.x.mul(w2)));
-			totalAlpha.assign(totalAlpha.add(w2));
-			const a3 = auroraCurtain(uv$1, float(2), float(6.7));
-			const w3 = a3.y.mul(step(float(3), curtainCount)).mul(.45);
-			weightedT.assign(weightedT.add(a3.x.mul(w3)));
-			totalAlpha.assign(totalAlpha.add(w3));
-			const a4 = auroraCurtain(uv$1, float(3), float(9.4));
-			const w4 = a4.y.mul(step(float(4), curtainCount)).mul(.3);
-			weightedT.assign(weightedT.add(a4.x.mul(w4)));
-			totalAlpha.assign(totalAlpha.add(w4));
+			if (curtainCount >= 2) {
+				const a2 = auroraCurtain(uv$1, float(1), float(3.1));
+				const w2 = a2.y.mul(.65);
+				weightedT.assign(weightedT.add(a2.x.mul(w2)));
+				totalAlpha.assign(totalAlpha.add(w2));
+			}
+			if (curtainCount >= 3) {
+				const a3 = auroraCurtain(uv$1, float(2), float(6.7));
+				const w3 = a3.y.mul(.45);
+				weightedT.assign(weightedT.add(a3.x.mul(w3)));
+				totalAlpha.assign(totalAlpha.add(w3));
+			}
+			if (curtainCount >= 4) {
+				const a4 = auroraCurtain(uv$1, float(3), float(9.4));
+				const w4 = a4.y.mul(.3);
+				weightedT.assign(weightedT.add(a4.x.mul(w4)));
+				totalAlpha.assign(totalAlpha.add(w4));
+			}
 			const avgT = pow(weightedT.div(totalAlpha.add(.001)), balanceExp);
 			const lowToMid = smoothstep(float(0), float(.2), avgT);
 			const midToHigh = smoothstep(float(.4), float(.85), avgT);

package/dist/core/{Blur-Cxx3ZuHi.js → Blur-DG7lJKPo.js}

@@ -1,6 +1,6 @@
 import { t as unpremultiplyAlpha } from "./alpha-C4ptedXe.js";
-import { n as createVariableGaussianBlurCompute, t as createGaussianBlurCompute } from "./computeBlur-DeXZ99YL.js";
-import { Fn, If, clamp, convertToTexture, dot, float, instanceIndex, int, mix, pow, screenUV, texture, textureLoad, textureStore, uint, uvec2, vec2, vec3, vec4, viewportSize } from "three/tsl";
+import { i as createVariableGaussianBlurCompute, r as createGaussianBlurCompute } from "./computeBlur-DCRhuYEi.js";
+import { Fn, If, clamp, convertToTexture, dot, float, instanceIndex, int, mix, pow, screenUV, texture, textureLoad, textureStore, uint, uniform, uvec2, vec2, vec3, vec4, viewportSize } from "three/tsl";
 const componentDefinition = {
 	name: "Blur",
 	category: "Blurs",
@@ -19,7 +19,7 @@ const componentDefinition = {
 			group: "Effect"
 		}
 	} },
-	computeNode: ({ childNode, onCleanup, dimensions, renderer, uniforms }) => {
+	computeNode: ({ childNode, onCleanup, dimensions, renderer, uniforms, onResize }) => {
 		if (!childNode) return null;
 		const childTexture = convertToTexture(childNode);
 		onCleanup(() => {
@@ -30,16 +30,21 @@ const componentDefinition = {
 		const texHeight = Math.round(dimensions.height * dpr);
 		const mapInfo = uniforms.intensity.mapComputeInfo;
 		if (mapInfo) {
-			const { computeNodes: blurNodes, outputTexture: outputTexture$1, blurMapWriteNode } = createVariableGaussianBlurCompute(childTexture, texWidth, texHeight, onCleanup);
-			const w = uint(texWidth);
-			const h = uint(texHeight);
+			const blur$1 = createVariableGaussianBlurCompute(childTexture, texWidth, texHeight, onCleanup);
+			const { computeNodes: blurNodes, outputTexture: outputTexture$1, blurMapWriteNode, computeWidth, computeHeight } = blur$1;
+			const inputWidthU = uniform(texWidth);
+			const inputHeightU = uniform(texHeight);
+			const cw = uint(computeWidth);
+			const ch = uint(computeHeight);
 			const { sourceTexture, channel, inputMin, inputMax, outputMin, outputMax, curve } = mapInfo;
 			const fillBlurMap = Fn(() => {
 				const idx = instanceIndex;
-				const x = idx.mod(w);
-				const y = idx.div(w);
-				If(y.lessThan(h), () => {
-					const sample = textureLoad(sourceTexture, uvec2(x, y), int(0));
+				const cx = idx.mod(cw);
+				const cy = idx.div(cw);
+				If(cy.lessThan(ch), () => {
+					const u = cx.toFloat().add(float(.5)).div(float(computeWidth));
+					const v = cy.toFloat().add(float(.5)).div(float(computeHeight));
+					const sample = textureLoad(sourceTexture, uvec2(u.mul(inputWidthU).round().toInt().clamp(int(0), int(inputWidthU.sub(1))).toUint(), v.mul(inputHeightU).round().toInt().clamp(int(0), int(inputHeightU.sub(1))).toUint()), int(0));
 					let raw;
 					if (channel === "alpha") raw = sample.a;
 					else if (channel === "alphaInverted") raw = sample.a.oneMinus();
@@ -47,9 +52,16 @@ const componentDefinition = {
 					else raw = dot(sample.rgb, vec3(.2126, .7152, .0722));
 					const inputRange = inputMax.sub(inputMin).max(float(1e-4));
 					const radius = mix(outputMin, outputMax, pow(clamp(raw.sub(inputMin).div(inputRange), float(0), float(1)), pow(float(2), curve.negate().mul(float(2))))).mul(float(.36));
-					textureStore(blurMapWriteNode, uvec2(x, y), vec4(radius, float(0), float(0), float(1))).toWriteOnly();
+					textureStore(blurMapWriteNode, uvec2(cx, cy), vec4(radius, float(0), float(0), float(1))).toWriteOnly();
 				});
-			})().compute(texWidth * texHeight, [256]);
+			})().compute(computeWidth * computeHeight, [256]);
+			onResize(({ width, height }) => {
+				const newW = Math.round(width * dpr);
+				const newH = Math.round(height * dpr);
+				inputWidthU.value = newW;
+				inputHeightU.value = newH;
+				blur$1.setInputDimensions(newW, newH);
+			});
 			return {
 				outputs: {
 					childTexture,
@@ -58,7 +70,11 @@ const componentDefinition = {
 				getComputeNodes: () => [fillBlurMap, ...blurNodes]
 			};
 		}
-		const { computeNodes, outputTexture, updateRadius } = createGaussianBlurCompute(childTexture, texWidth, texHeight, onCleanup);
+		const blur = createGaussianBlurCompute(childTexture, texWidth, texHeight, onCleanup);
+		const { computeNodes, outputTexture, updateRadius } = blur;
+		onResize(({ width, height }) => {
+			blur.setInputDimensions(Math.round(width * dpr), Math.round(height * dpr));
+		});
 		return {
 			outputs: {
 				childTexture,

package/dist/core/{ChannelBlur-Cth0biwG.js → ChannelBlur-BhcCkwcO.js}

@@ -1,5 +1,5 @@
 import { t as unpremultiplyAlpha } from "./alpha-C4ptedXe.js";
-import { t as createGaussianBlurCompute } from "./computeBlur-DeXZ99YL.js";
+import { r as createGaussianBlurCompute } from "./computeBlur-DCRhuYEi.js";
 import { Fn, convertToTexture, float, mix, screenUV, texture, vec2, vec4, viewportSize } from "three/tsl";
 const componentDefinition = {
 	name: "ChannelBlur",
@@ -45,14 +45,18 @@ const componentDefinition = {
 			}
 		}
 	},
-	computeNode: ({ childNode, onCleanup, dimensions, renderer, uniforms }) => {
+	computeNode: ({ childNode, onCleanup, dimensions, renderer, uniforms, onResize }) => {
 		if (!childNode) return null;
 		const childTexture = convertToTexture(childNode);
 		onCleanup(() => {
 			if (childTexture?.renderTarget?.dispose) childTexture.renderTarget.dispose();
 		});
 		const dpr = renderer?.getPixelRatio?.() ?? 1;
-		const { computeNodes, outputTexture, updateRadius } = createGaussianBlurCompute(childTexture, Math.round(dimensions.width * dpr), Math.round(dimensions.height * dpr), onCleanup);
+		const blur = createGaussianBlurCompute(childTexture, Math.round(dimensions.width * dpr), Math.round(dimensions.height * dpr), onCleanup);
+		const { computeNodes, outputTexture, updateRadius } = blur;
+		onResize(({ width, height }) => {
+			blur.setInputDimensions(Math.round(width * dpr), Math.round(height * dpr));
+		});
 		return {
 			outputs: {
 				childTexture,

package/dist/core/{ContourLines-KTHC32hd.js → ContourLines-tDBvQOvb.js}

@@ -77,6 +77,7 @@ const componentDefinition = {
 			default: "luminance",
 			description: "Use luminance or alpha channel for contours",
 			transform: transformSource,
+			compileTime: true,
 			ui: {
 				type: "select",
 				options: [{
@@ -94,6 +95,7 @@ const componentDefinition = {
 			default: "source",
 			description: "Use source image colors or custom colors",
 			transform: transformColorMode,
+			compileTime: true,
 			ui: {
 				type: "select",
 				options: [{
@@ -144,18 +146,17 @@ const componentDefinition = {
 		const customBgColor = vec3(bgColorVec.x, bgColorVec.y, bgColorVec.z);
 		const customBgAlpha = bgColorVec.w;
 		const originalColor = childNode;
-		const luminance = dot(originalColor.rgb, vec3(.2126, .7152, .0722));
-		const rawSourceValue = uniforms.source.uniform.equal(float(1)).select(originalColor.a, luminance);
+		const rawSourceValue = uniforms.source.uniform.value === 1 ? originalColor.a : dot(originalColor.rgb, vec3(.2126, .7152, .0722));
 		const scaledValue = pow(isInverted.select(oneMinus(rawSourceValue), rawSourceValue), gamma).mul(levels).add(.5);
 		const fw = fwidth(scaledValue).max(float(1e-4));
 		const normalizedDist = fract(scaledValue.add(.5)).sub(.5).abs().div(fw);
 		const transitionFactor = softness.mul(.99).add(.01);
 		const lineMask = smoothstep(lineWidth.mul(oneMinus(transitionFactor)), lineWidth, normalizedDist).oneMinus();
-		const isCustomMode = uniforms.colorMode.uniform.equal(float(1));
-		const lineColor = isCustomMode.select(customLineColor, originalColor.rgb);
-		const lineAlpha = isCustomMode.select(customLineAlpha, float(1));
-		const bgColor = isCustomMode.select(customBgColor, vec3(0, 0, 0));
-		const bgAlpha = isCustomMode.select(customBgAlpha, float(0));
+		const colorMode = uniforms.colorMode.uniform.value;
+		const lineColor = colorMode === 1 ? customLineColor : originalColor.rgb;
+		const lineAlpha = colorMode === 1 ? customLineAlpha : float(1);
+		const bgColor = colorMode === 1 ? customBgColor : vec3(0, 0, 0);
+		const bgAlpha = colorMode === 1 ? customBgAlpha : float(0);
 		return vec4(mix(bgColor, lineColor, lineMask), mix(bgAlpha, lineAlpha, lineMask));
 	}
 };

package/dist/core/{CursorTrail-R4IBB4eu.js → CursorTrail-CgRMXbTG.js}

@@ -79,7 +79,7 @@ const componentDefinition = {
 			}
 		}
 	},
-	computeNode: ({ uniforms, onCleanup, dimensions, renderer }) => {
+	computeNode: ({ uniforms, onCleanup, renderer }) => {
 		const trailBuffer = attributeArray(GRID_SIZE * GRID_SIZE, "vec4");
 		const trailTex = new StorageTexture(GRID_SIZE, GRID_SIZE);
 		trailTex.type = FloatType;
@@ -140,7 +140,7 @@ const componentDefinition = {
 				const currentTime = Date.now();
 				const dt = Math.min((currentTime - lastTime) / 1e3, .016);
 				lastTime = currentTime;
-				const aspect = dimensions.width / dimensions.height;
+				const aspect = Math.max(1, params.dimensions.width) / Math.max(1, params.dimensions.height);
 				const radius = uniforms.radius.uniform.value * .1;
 				const length$1 = uniforms.length.uniform.value;
 				const shrink = uniforms.shrink.uniform.value;
@@ -177,7 +177,7 @@ const componentDefinition = {
 			}
 		};
 	},
-	fragmentNode: ({ uniforms, onBeforeRender, onCleanup, dimensions, computeOutputs }) => {
+	fragmentNode: ({ uniforms, onBeforeRender, onCleanup, computeOutputs }) => {
 		let trailField;
 		if (computeOutputs?.trailTexture) trailField = texture(computeOutputs.trailTexture);
 		else {
@@ -190,11 +190,11 @@ const componentDefinition = {
 			let prevX = .5;
 			let prevY = .5;
 			let lastTime = Date.now();
-			onBeforeRender(({ pointer }) => {
+			onBeforeRender(({ pointer, dimensions }) => {
 				const currentTime = Date.now();
 				const dt = Math.min((currentTime - lastTime) / 1e3, .016);
 				lastTime = currentTime;
-				const aspect = dimensions.width / dimensions.height;
+				const aspect = Math.max(1, dimensions.width) / Math.max(1, dimensions.height);
 				const radius = uniforms.radius.uniform.value * .1;
 				const length$1 = uniforms.length.uniform.value;
 				const shrink = uniforms.shrink.uniform.value;

package/dist/core/{DropShadow-jMhnYPXZ.js → DropShadow-B7FzTp4H.js}

@@ -85,6 +85,7 @@ const componentDefinition = {
 		cutout: {
 			default: false,
 			transform: transformBoolean,
+			compileTime: true,
 			description: "Hide the original layer and show only the shadow",
 			ui: {
 				type: "checkbox",
@@ -130,16 +131,21 @@ const componentDefinition = {
 			}
 			return total;
 		})().mul(uniforms.intensity.uniform);
-		const isCutout = uniforms.cutout.uniform.equal(float(1));
 		const shadowColor = uniforms.color.uniform;
-		const shadowPremulRGB = shadowColor.rgb.mul(shadowColor.a).mul(shadowAlpha);
 		const shadowA = shadowColor.a.mul(shadowAlpha);
-		const oneMinusOrigA = float(1).sub(originalColor.a);
-		const normalRGB = originalColor.rgb.add(shadowPremulRGB.mul(oneMinusOrigA));
-		const normalA = max(originalColor.a.add(shadowA.mul(oneMinusOrigA)), originalColor.a);
-		const cutoutA = clamp(shadowA.sub(originalColor.a), float(0), float(1));
-		const cutoutRGB = shadowColor.rgb.mul(shadowColor.a).mul(cutoutA);
-		return unpremultiplyAlpha(vec4(isCutout.select(cutoutRGB, normalRGB), isCutout.select(cutoutA, normalA)));
+		const cutout = uniforms.cutout.uniform.value === 1;
+		let resultRGB;
+		let resultA;
+		if (cutout) {
+			resultA = clamp(shadowA.sub(originalColor.a), float(0), float(1));
+			resultRGB = shadowColor.rgb.mul(shadowColor.a).mul(resultA);
+		} else {
+			const shadowPremulRGB = shadowColor.rgb.mul(shadowColor.a).mul(shadowAlpha);
+			const oneMinusOrigA = float(1).sub(originalColor.a);
+			resultRGB = originalColor.rgb.add(shadowPremulRGB.mul(oneMinusOrigA));
+			resultA = max(originalColor.a.add(shadowA.mul(oneMinusOrigA)), originalColor.a);
+		}
+		return unpremultiplyAlpha(vec4(resultRGB, resultA));
 	}
 };
 var DropShadow_default = componentDefinition;

package/dist/core/{Duotone-Bl02WcA2.js → Duotone-CqQ0NMxS.js}

@@ -1,12 +1,10 @@
 import { a as transformColor, o as transformColorSpace, t as colorSpaceOptions } from "./transformations-B5lM6fYX.js";
-import { t as unpremultiplyAlpha } from "./alpha-C4ptedXe.js";
 import { t as mixColors } from "./colorMixing-BPpDnR5I.js";
-import { convertToTexture, dot, screenUV, smoothstep, vec3, vec4 } from "three/tsl";
+import { dot, smoothstep, vec3, vec4 } from "three/tsl";
 const componentDefinition = {
 	name: "Duotone",
 	category: "Adjustments",
 	description: "Map colors to two tones based on luminance",
-	requiresRTT: true,
 	requiresChild: true,
 	props: {
 		colorA: {
@@ -54,16 +52,11 @@ const componentDefinition = {
 			}
 		}
 	},
-	fragmentNode: ({ uniforms, childNode, onCleanup }) => {
+	fragmentNode: ({ uniforms, childNode }) => {
 		if (!childNode) return vec4(0, 0, 0, 0);
-		const childTexture = convertToTexture(childNode);
-		onCleanup(() => {
-			if (childTexture?.renderTarget?.dispose) childTexture.renderTarget.dispose();
-		});
-		const inputColor = unpremultiplyAlpha(childTexture.sample(screenUV));
-		const luminance = dot(inputColor.rgb, vec3(.299, .587, .114));
+		const luminance = dot(vec3(childNode.r, childNode.g, childNode.b), vec3(.299, .587, .114));
 		const adjustedLuminance = smoothstep(uniforms.blend.uniform.sub(.5), uniforms.blend.uniform.add(.5), luminance);
-		return vec4(mixColors(uniforms.colorA.uniform, uniforms.colorB.uniform, adjustedLuminance, uniforms.colorSpace.uniform.value).rgb, inputColor.a);
+		return vec4(mixColors(uniforms.colorA.uniform, uniforms.colorB.uniform, adjustedLuminance, uniforms.colorSpace.uniform.value).rgb, childNode.a);
 	}
 };
 var Duotone_default = componentDefinition;

package/dist/core/{FloatingParticles-BtwGRl_d.js → FloatingParticles-DpYA0_TE.js}

@@ -206,7 +206,7 @@ const componentDefinition = {
 				const layerHash = hash2_2(vec2(alpha, float(i).mul(7.919)));
 				const speedMod = float(1).add(layerHash.x.sub(.5).mul(speedVar));
 				const angleDelta = layerHash.y.sub(.5).mul(angleVar).mul(2);
-				const variedAngle = angleRad.add(angleDelta);
+				const variedAngle = angleRad.add(angleDelta).toVar();
 				const variedDir = vec2(cos(variedAngle), sin(variedAngle));
 				const movement = baseMovement.mul(speedMod).add(variedDir.sub(baseMovementDir).mul(animTime));
 				const layerParticles = renderParticle(uv$2.mul(size).add(movement).add(offset)).mul(alpha);
@@ -221,7 +221,11 @@ const componentDefinition = {
 		const aspectRatio = viewportSize.x.div(viewportSize.y);
 		const particles = layeredParticles(vec2(uv$1.x.mul(aspectRatio), uv$1.y).mul(uniforms.particleDensity.uniform));
 		const particleAlpha = length(particles);
-		if (childNode) return vec4(mix(childNode.xyz, particles, particleAlpha.greaterThan(.01).select(particleAlpha, 0)), childNode.w);
+		if (childNode) {
+			const mixedColor = mix(childNode.xyz, particles, particleAlpha.greaterThan(.01).select(particleAlpha, 0));
+			const pa = particleAlpha.clamp(0, 1);
+			return vec4(mixedColor, pa.add(childNode.w.mul(float(1).sub(pa))));
+		}
 		return vec4(particles, particleAlpha);
 	}
 };

package/dist/core/{Form3D-DaPbLGUi.js → Form3D-Bufw6tZb.js}

@@ -338,12 +338,24 @@ const componentDefinition = {
 		});
 		const t = createAnimatedTime(params, uniforms.speed);
 		const shapeType = uniforms.shape3dType.uniform.value;
+		let _parseCacheKey = null;
+		let _parseCacheVal = {};
 		const parse = (raw) => {
+			let key;
 			try {
-				return JSON.parse(typeof raw === "string" ? raw : JSON.stringify(raw));
+				key = typeof raw === "string" ? raw : JSON.stringify(raw);
 			} catch {
-				return {};
+				key = null;
 			}
+			if (key !== null && key === _parseCacheKey) return _parseCacheVal;
+			try {
+				_parseCacheVal = JSON.parse(key ?? (typeof raw === "string" ? raw : "{}"));
+				_parseCacheKey = key;
+			} catch {
+				_parseCacheVal = {};
+				_parseCacheKey = null;
+			}
+			return _parseCacheVal;
 		};
 		const cfg0 = parse(uniforms.shape3d.uniform.value);
 		const DEG = Math.PI / 180;

package/dist/core/{Glass-TRSXbuE6.js → Glass-Bz9IKI2q.js}

@@ -1,5 +1,5 @@
 import { a as transformColor, l as transformPosition } from "./transformations-B5lM6fYX.js";
-import { t as createGaussianBlurCompute } from "./computeBlur-DeXZ99YL.js";
+import { r as createGaussianBlurCompute } from "./computeBlur-DCRhuYEi.js";
 import { n as createAnalyticSdfSampler, r as createSvgSdfSampler } from "./sdf-DyC2H_qS.js";
 import { Fn, If, clamp, convertToTexture, dot, exp2, float, max, mix, pow, screenUV, smoothstep, sqrt, texture, uniform, vec2, vec3, vec4, viewportSize } from "three/tsl";
 var GOLDEN_ANGLE = 2.3999632297286535;
@@ -391,7 +391,7 @@ const componentDefinition = {
 			description: "Active SDF shape type — triggers recompile when shape is switched. When empty, derived from shape JSON at mount time."
 		}
 	},
-	computeNode: ({ uniforms, childNode, onCleanup, dimensions, renderer }) => {
+	computeNode: ({ uniforms, childNode, onCleanup, dimensions, renderer, onResize }) => {
 		if (!childNode) return null;
 		const blurValue = uniforms.blur.uniform.value;
 		if (typeof blurValue === "number" && blurValue <= 0) return null;
@@ -400,7 +400,11 @@ const componentDefinition = {
 			if (childTexture?.renderTarget?.dispose) childTexture.renderTarget.dispose();
 		});
 		const dpr = renderer?.getPixelRatio?.() ?? 1;
-		const { computeNodes, outputTexture, updateRadius } = createGaussianBlurCompute(childTexture, Math.round(dimensions.width * dpr), Math.round(dimensions.height * dpr), onCleanup, .5);
+		const blur = createGaussianBlurCompute(childTexture, Math.round(dimensions.width * dpr), Math.round(dimensions.height * dpr), onCleanup);
+		const { computeNodes, outputTexture, updateRadius } = blur;
+		onResize(({ width, height }) => {
+			blur.setInputDimensions(Math.round(width * dpr), Math.round(height * dpr));
+		});
 		return {
 			outputs: {
 				childTexture,

package/dist/core/{Glow-8bKkyehK.js → Glow-CUv1yHLZ.js}

@@ -1,6 +1,8 @@
 import { t as unpremultiplyAlpha } from "./alpha-C4ptedXe.js";
-import { n as createVariableGaussianBlurCompute, t as createGaussianBlurCompute } from "./computeBlur-DeXZ99YL.js";
-import { Fn, If, clamp, convertToTexture, dot, float, instanceIndex, int, max, mix, pow, screenUV, texture, textureLoad, textureStore, uint, uvec2, vec2, vec3, vec4, viewportSize } from "three/tsl";
+import { i as createVariableGaussianBlurCompute, n as DEFAULT_COMPUTE_WIDTH, t as DEFAULT_COMPUTE_HEIGHT } from "./computeBlur-DCRhuYEi.js";
+import { StorageTexture } from "three/webgpu";
+import { FloatType } from "three";
+import { Fn, If, clamp, convertToTexture, dot, float, instanceIndex, int, max, mix, pow, screenUV, storageTexture, texture, textureLoad, textureStore, uint, uniform, uvec2, vec2, vec3, vec4, viewportSize } from "three/tsl";
 const componentDefinition = {
 	name: "Glow",
 	category: "Stylize",
@@ -14,8 +16,8 @@ const componentDefinition = {
 			ui: {
 				type: ["range", "map"],
 				min: 0,
-				max: 10,
-				step: .1,
+				max: 50,
+				step: .5,
 				label: "Intensity",
 				group: "Effect"
 			}
@@ -27,26 +29,28 @@ const componentDefinition = {
 				type: ["range", "map"],
 				min: 0,
 				max: 1,
-				step: .1,
+				step: .05,
 				label: "Threshold",
 				group: "Effect"
 			}
 		},
 		size: {
-			default: 10,
-			description: "Size/spread of the glow effect",
+			default: 25,
+			description: "Glow spread in pixels (clean up to ~72px, mild banding above)",
+			compileTimeWhen: (prev, next) => prev === 0 !== (next === 0),
 			ui: {
 				type: ["range", "map"],
-				min: 1,
-				max: 20,
-				step: .1,
+				min: 0,
+				max: 100,
+				step: 1,
 				label: "Glow Size",
 				group: "Effect"
 			}
 		}
 	},
-	computeNode: ({ childNode, onCleanup, dimensions, renderer, uniforms }) => {
+	computeNode: ({ childNode, onCleanup, dimensions, renderer, uniforms, onResize }) => {
 		if (!childNode) return null;
+		if (uniforms.size.uniform.value === 0) return null;
 		const childTexture = convertToTexture(childNode);
 		onCleanup(() => {
 			if (childTexture?.renderTarget?.dispose) childTexture.renderTarget.dispose();
@@ -54,63 +58,72 @@ const componentDefinition = {
 		const dpr = renderer?.getPixelRatio?.() ?? 1;
 		const texWidth = Math.round(dimensions.width * dpr);
 		const texHeight = Math.round(dimensions.height * dpr);
+		const computeWidth = DEFAULT_COMPUTE_WIDTH;
+		const computeHeight = 640;
+		const brightTex = new StorageTexture(computeWidth, computeHeight);
+		brightTex.type = FloatType;
+		const brightWriteNode = storageTexture(brightTex);
+		const brightReadNode = storageTexture(brightTex).toReadOnly();
+		onCleanup(() => {
+			brightTex.dispose();
+		});
+		const { computeNodes: blurNodes, outputTexture: blurredTex, blurMapWriteNode } = createVariableGaussianBlurCompute(brightReadNode, computeWidth, computeHeight, onCleanup);
+		const inputWidthU = uniform(texWidth);
+		const inputHeightU = uniform(texHeight);
+		const cw = uint(computeWidth);
+		const ch = uint(computeHeight);
 		const sizeMapInfo = uniforms.size.mapComputeInfo;
-		if (sizeMapInfo) {
-			const { computeNodes: blurNodes, outputTexture: outputTexture$1, blurMapWriteNode } = createVariableGaussianBlurCompute(childTexture, texWidth, texHeight, onCleanup);
-			const w = uint(texWidth);
-			const h = uint(texHeight);
-			const { sourceTexture, channel, inputMin, inputMax, outputMin, outputMax, curve } = sizeMapInfo;
-			const fillBlurMap = Fn(() => {
-				const idx = instanceIndex;
-				const x = idx.mod(w);
-				const y = idx.div(w);
-				If(y.lessThan(h), () => {
-					const sample = textureLoad(sourceTexture, uvec2(x, y), int(0));
+		const extractAndFill = Fn(() => {
+			const idx = instanceIndex;
+			const cx = idx.mod(cw);
+			const cy = idx.div(cw);
+			If(cy.lessThan(ch), () => {
+				const u = cx.toFloat().add(float(.5)).div(float(computeWidth));
+				const v = cy.toFloat().add(float(.5)).div(float(computeHeight));
+				const srcX = u.mul(inputWidthU).round().toInt().clamp(int(0), int(inputWidthU.sub(1))).toUint();
+				const srcY = v.mul(inputHeightU).round().toInt().clamp(int(0), int(inputHeightU.sub(1))).toUint();
+				const sample = textureLoad(childTexture, uvec2(srcX, srcY), int(0));
+				const lum = dot(sample.rgb, vec3(.2126, .7152, .0722));
+				const mask = max(float(0), lum.sub(uniforms.threshold.uniform));
+				textureStore(brightWriteNode, uvec2(cx, cy), vec4(sample.rgb.mul(mask), sample.a)).toWriteOnly();
+				let radius;
+				if (sizeMapInfo) {
+					const { sourceTexture, channel, inputMin, inputMax, outputMin, outputMax, curve } = sizeMapInfo;
+					const mapSample = textureLoad(sourceTexture, uvec2(srcX, srcY), int(0));
 					let raw;
-					if (channel === "alpha") raw = sample.a;
-					else if (channel === "alphaInverted") raw = sample.a.oneMinus();
-					else if (channel === "luminanceInverted") raw = dot(sample.rgb, vec3(.2126, .7152, .0722)).oneMinus();
-					else raw = dot(sample.rgb, vec3(.2126, .7152, .0722));
+					if (channel === "alpha") raw = mapSample.a;
+					else if (channel === "alphaInverted") raw = mapSample.a.oneMinus();
+					else if (channel === "luminanceInverted") raw = dot(mapSample.rgb, vec3(.2126, .7152, .0722)).oneMinus();
+					else raw = dot(mapSample.rgb, vec3(.2126, .7152, .0722));
 					const inputRange = inputMax.sub(inputMin).max(float(1e-4));
-					const radius = mix(outputMin, outputMax, pow(clamp(raw.sub(inputMin).div(inputRange), float(0), float(1)), pow(float(2), curve.negate().mul(float(2)))));
-					textureStore(blurMapWriteNode, uvec2(x, y), vec4(radius, float(0), float(0), float(1))).toWriteOnly();
-				});
-			})().compute(texWidth * texHeight, [256]);
-			return {
-				outputs: {
-					childTexture,
-					blurredTexture: outputTexture$1
-				},
-				getComputeNodes: () => [fillBlurMap, ...blurNodes]
-			};
-		}
-		const { computeNodes, outputTexture, updateRadius } = createGaussianBlurCompute(childTexture, texWidth, texHeight, onCleanup);
+					radius = mix(outputMin, outputMax, pow(clamp(raw.sub(inputMin).div(inputRange), float(0), float(1)), pow(float(2), curve.negate().mul(float(2)))));
+				} else radius = uniforms.size.uniform;
+				textureStore(blurMapWriteNode, uvec2(cx, cy), vec4(radius, float(0), float(0), float(1))).toWriteOnly();
+			});
+		})().compute(computeWidth * computeHeight, [256]);
+		onResize(({ width, height }) => {
+			const newW = Math.round(width * dpr);
+			const newH = Math.round(height * dpr);
+			inputWidthU.value = newW;
+			inputHeightU.value = newH;
+		});
 		return {
 			outputs: {
 				childTexture,
-				blurredTexture: outputTexture
+				blurredTexture: blurredTex
 			},
-			getComputeNodes: () => {
-				const sizeEntry = uniforms.size;
-				const size = sizeEntry.getCpuValue?.() ?? (typeof sizeEntry.uniform.value === "number" ? sizeEntry.uniform.value : null);
-				if (size !== null) updateRadius(size);
-				return computeNodes;
-			}
+			getComputeNodes: () => [extractAndFill, ...blurNodes]
 		};
 	},
 	fragmentNode: ({ uniforms, childNode, onCleanup, computeOutputs }) => {
 		if (!childNode) return vec4(0, 0, 0, 0);
+		if (uniforms.size.uniform.value === 0) return childNode;
 		if (computeOutputs?.blurredTexture) {
-			const originalColor$1 = computeOutputs.childTexture.sample(screenUV);
-			const blurredColor = texture(computeOutputs.blurredTexture).sample(screenUV);
-			const luminance = dot(originalColor$1.rgb, vec3(.299, .587, .114));
-			const brightnessMask = max(float(0), luminance.sub(uniforms.threshold.uniform));
-			const intensity$1 = uniforms.intensity.uniform;
-			const glow = blurredColor.mul(brightnessMask).mul(intensity$1);
-			const finalColor = originalColor$1.rgb.add(glow.rgb);
-			const finalAlpha = max(originalColor$1.a, glow.a);
+			const original = computeOutputs.childTexture.sample(screenUV);
+			const bloom = texture(computeOutputs.blurredTexture).sample(screenUV);
 			const sizePin = uniforms.size.uniform.mul(float(0));
-			return unpremultiplyAlpha(vec4(finalColor.add(sizePin), finalAlpha));
+			const intensity$1 = uniforms.intensity.uniform;
+			return unpremultiplyAlpha(vec4(original.rgb.add(bloom.rgb.mul(intensity$1)).add(sizePin), original.a));
 		}
 		const childTexture = convertToTexture(childNode);
 		onCleanup(() => {

package/dist/core/{GridDistortion-CpSiGEGV.js → GridDistortion-SRyevgsp.js}

@@ -116,7 +116,7 @@ const componentDefinition = {
 			}
 		}
 	},
-	computeNode: ({ uniforms, onCleanup, dimensions }) => {
+	computeNode: ({ uniforms, onCleanup }) => {
 		const GRID_SIZE = uniforms?.gridSize?.uniform?.value ? Math.max(8, Math.min(128, Math.floor(uniforms.gridSize.uniform.value))) : DEFAULT_GRID_SIZE;
 		const buffer = attributeArray(GRID_SIZE * GRID_SIZE, "vec4");
 		const dispTex = new StorageTexture(GRID_SIZE, GRID_SIZE);
@@ -179,7 +179,7 @@ const componentDefinition = {
 				const currentTime = Date.now();
 				const dt = Math.min((currentTime - lastTime) / 1e3, .016);
 				lastTime = currentTime;
-				const aspect = dimensions.width / Math.max(dimensions.height, 1);
+				const aspect = Math.max(1, params.dimensions.width) / Math.max(1, params.dimensions.height);
 				const velX = dt > 0 ? (params.pointer.x - prevX) / dt : 0;
 				const velY = dt > 0 ? (params.pointer.y - prevY) / dt : 0;
 				smoothVelX = smoothVelX * .85 + velX * .15;
@@ -203,7 +203,7 @@ const componentDefinition = {
 			}
 		};
 	},
-	fragmentNode: ({ uniforms, onBeforeRender, childNode, onCleanup, dimensions, computeOutputs }) => {
+	fragmentNode: ({ uniforms, onBeforeRender, childNode, onCleanup, computeOutputs }) => {
 		let displacementField;
 		let GRID_SIZE;
 		if (computeOutputs?.displacement) {
@@ -217,7 +217,7 @@ const componentDefinition = {
 			const mouseVelX = uniform(0);
 			const mouseVelY = uniform(0);
 			let prevX = .5, prevY = .5, lastTime = Date.now();
-			onBeforeRender(({ pointer }) => {
+			onBeforeRender(({ pointer, dimensions }) => {
 				const currentTime = Date.now();
 				const dt = Math.min((currentTime - lastTime) / 1e3, .016);
 				lastTime = currentTime;

package/dist/core/{HueShift-BtGVMu7q.js → HueShift-ctEX5vfo.js}

@@ -7,6 +7,7 @@ const componentDefinition = {
 	props: { shift: {
 		default: 0,
 		description: "The amount to shift the hue by",
+		compileTimeWhen: (prev, next) => prev === 0 !== (next === 0),
 		ui: {
 			type: ["range", "map"],
 			min: -180,
@@ -22,6 +23,7 @@ const componentDefinition = {
 			console.error("You must pass a child component into the Hue Shift shader.");
 			return vec4(0);
 		}
+		if (uniforms.shift.uniform.value === 0) return childNode;
 		const angle = uniforms.shift.uniform;
 		const cosA = cos(angle);
 		const sinA = sin(angle);