shaders 2.3.66 → 2.3.68

package/dist/core/{AngularBlur-m_DWR-a1.js → AngularBlur-BBVuS72B.js}

@@ -18,7 +18,7 @@ const componentDefinition = {
 			default: 20,
 			description: "Intensity of the angular blur effect",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 100,
 				step: 1,

package/dist/core/{Ascii-CmRuGRU3.js → Ascii-C57qusEP.js}

@@ -120,7 +120,7 @@ const componentDefinition = {
 			default: 1,
 			description: "Character size within each cell (1.0 = optimal size, 0.0 = smallest)",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .05,
@@ -133,7 +133,7 @@ const componentDefinition = {
 			default: 1,
 			description: "Brightness curve adjustment. <1 brightens darks (more light characters), >1 darkens midtones (more dark characters). Use to better fit characters to image brightness range.",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: .25,
 				max: 3,
 				step: .05,

package/dist/core/{Aurora-CYCPE1wp.js → Aurora-LKsAmrmY.js}

@@ -1,6 +1,6 @@
 import { a as transformColor, l as transformPosition, o as transformColorSpace, t as colorSpaceOptions } from "./transformations-B5lM6fYX.js";
 import { t as createAnimatedTime } from "./time-BZqyVJXt.js";
-import { t as mixColors } from "./colorMixing-D_wMclqL.js";
+import { t as mixColors } from "./colorMixing-jSm3tbMv.js";
 import { Fn, clamp, exp, float, fract, mix, mx_noise_float, pow, screenUV, sin, smoothstep, step, vec2, vec3, vec4, viewportSize } from "three/tsl";
 const componentDefinition = {
 	name: "Aurora",
@@ -40,6 +40,7 @@ const componentDefinition = {
 		colorSpace: {
 			default: "linear",
 			transform: transformColorSpace,
+			compileTime: true,
 			description: "Color space for color interpolation",
 			ui: {
 				type: "select",
@@ -52,7 +53,7 @@ const componentDefinition = {
 			default: 50,
 			description: "Shifts color distribution across the curtain height",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 100,
 				step: 1,
@@ -64,7 +65,7 @@ const componentDefinition = {
 			default: 80,
 			description: "Overall aurora brightness",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 100,
 				step: 1,
@@ -100,7 +101,7 @@ const componentDefinition = {
 			default: 50,
 			description: "How much the curtains undulate",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 200,
 				step: 1,
@@ -112,7 +113,7 @@ const componentDefinition = {
 			default: 20,
 			description: "Density of vertical ray structures",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 100,
 				step: 1,
@@ -124,7 +125,7 @@ const componentDefinition = {
 			default: 120,
 			description: "How tall the aurora extends",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 10,
 				max: 200,
 				step: 1,
@@ -135,7 +136,7 @@ const componentDefinition = {
 		center: {
 			default: {
 				x: .5,
-				y: .5
+				y: 0
 			},
 			transform: transformPosition,
 			description: "Center position of the aurora",
@@ -149,7 +150,7 @@ const componentDefinition = {
 			default: 0,
 			description: "Random seed for variation",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 100,
 				step: 1,
@@ -163,7 +164,7 @@ const componentDefinition = {
 		const colorA = uniforms.colorA.uniform;
 		const colorB = uniforms.colorB.uniform;
 		const colorC = uniforms.colorC.uniform;
-		const csMode = uniforms.colorSpace.uniform;
+		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;

package/dist/core/{Beam-COjEb2JI.js → Beam-BkYNheGX.js}

@@ -1,5 +1,5 @@
 import { a as transformColor, l as transformPosition, o as transformColorSpace, t as colorSpaceOptions } from "./transformations-B5lM6fYX.js";
-import { t as mixColors } from "./colorMixing-D_wMclqL.js";
+import { t as mixColors } from "./colorMixing-jSm3tbMv.js";
 import { clamp, float, max, mix, pow, screenUV, smoothstep, sqrt, vec2, vec4, viewportSize } from "three/tsl";
 const componentDefinition = {
 	name: "Beam",
@@ -36,7 +36,7 @@ const componentDefinition = {
 			default: .2,
 			description: "Thickness at the start of the beam",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 2,
 				step: .1,
@@ -48,7 +48,7 @@ const componentDefinition = {
 			default: .2,
 			description: "Thickness at the end of the beam",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 2,
 				step: .1,
@@ -60,7 +60,7 @@ const componentDefinition = {
 			default: .5,
 			description: "Edge softness at the start of the beam",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 50,
 				step: .1,
@@ -72,7 +72,7 @@ const componentDefinition = {
 			default: .5,
 			description: "Edge softness at the end of the beam",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 20,
 				step: .1,
@@ -103,6 +103,7 @@ const componentDefinition = {
 		colorSpace: {
 			default: "linear",
 			transform: transformColorSpace,
+			compileTime: true,
 			description: "Color space for color interpolation",
 			ui: {
 				type: "select",
@@ -138,7 +139,7 @@ const componentDefinition = {
 		const colorT = smoothstep(float(1).sub(softness), float(1).add(softness), normalizedDist);
 		const insideCol = uniforms.insideColor.uniform;
 		const outsideCol = uniforms.outsideColor.uniform;
-		const beamColorRGB = mixColors(insideCol, outsideCol, colorT, uniforms.colorSpace.uniform).rgb;
+		const beamColorRGB = mixColors(insideCol, outsideCol, colorT, uniforms.colorSpace.uniform.value).rgb;
 		return vec4(beamColorRGB, insideCol.a.add(outsideCol.a).div(float(2)).mul(alpha));
 	}
 };

package/dist/core/{Blob-jHnoxt2N.js → Blob-CWfHiQeb.js}

@@ -1,6 +1,6 @@
 import { a as transformColor, l as transformPosition, o as transformColorSpace, t as colorSpaceOptions } from "./transformations-B5lM6fYX.js";
 import { t as createAnimatedTime } from "./time-BZqyVJXt.js";
-import { t as mixColors } from "./colorMixing-D_wMclqL.js";
+import { t as mixColors } from "./colorMixing-jSm3tbMv.js";
 import { dot, float, length, max, normalize, pow, reflect, screenUV, sin, smoothstep, vec2, vec3, vec4, viewportSize } from "three/tsl";
 const componentDefinition = {
 	name: "Blob",
@@ -55,7 +55,7 @@ const componentDefinition = {
 			default: .5,
 			description: "Softness of the blob edges (combines edge width and transition curve)",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .1,
@@ -67,7 +67,7 @@ const componentDefinition = {
 			default: .5,
 			description: "Intensity of specular highlight effect",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .1,
@@ -125,7 +125,7 @@ const componentDefinition = {
 			default: .5,
 			description: "Animation speed",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 2,
 				step: .1,
@@ -161,6 +161,7 @@ const componentDefinition = {
 		colorSpace: {
 			default: "linear",
 			transform: transformColorSpace,
+			compileTime: true,
 			description: "Color space for color interpolation",
 			ui: {
 				type: "select",
@@ -217,7 +218,7 @@ const componentDefinition = {
 		const colorNoise1 = sin(posX.add(animTime.mul(float(.4)))).mul(sin(posY.add(animTime.mul(float(.3))))).add(sin(posX.mul(float(.7)).add(posY.mul(float(.8))).add(animTime.mul(float(.2))))).mul(float(.5)).add(float(.5));
 		const colorNoise2 = sin(posX.mul(float(1.3)).sub(animTime.mul(float(.5)))).mul(sin(posY.mul(float(1.1)).add(animTime.mul(float(.6))))).add(sin(posX.mul(float(.5)).sub(posY.mul(float(.6)).sub(animTime.mul(float(.3)))))).mul(float(.5)).add(float(.5));
 		const combinedNoise = colorNoise1.mul(float(.6)).add(colorNoise2.mul(float(.4)));
-		const finalColorRGB = mixColors(colorA, colorB, smoothstep(float(.1), float(.9), combinedNoise), uniforms.colorSpace.uniform).rgb;
+		const finalColorRGB = mixColors(colorA, colorB, smoothstep(float(.1), float(.9), combinedNoise), uniforms.colorSpace.uniform.value).rgb;
 		const avgAlpha = colorA.a.add(colorB.a).div(float(2));
 		const highlightContribution = highlightColor.rgb.mul(finalHighlight);
 		return vec4(finalColorRGB.add(highlightContribution), avgAlpha.mul(blobMask));

package/dist/core/{Blur-DpAOfmjB.js → Blur-BguzqgHU.js}

@@ -10,7 +10,7 @@ const componentDefinition = {
 		default: 50,
 		description: "Intensity of the blur effect",
 		ui: {
-			type: "range",
+			type: ["range", "map"],
 			min: 0,
 			max: 100,
 			step: 1,

package/dist/core/{BrightnessContrast-zL5bGGzg.js → BrightnessContrast-BoR9bi58.js}

@@ -9,7 +9,7 @@ const componentDefinition = {
 			default: 0,
 			description: "Brightness adjustment (-1 to 1)",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: -1,
 				max: 1,
 				step: .05,
@@ -21,7 +21,7 @@ const componentDefinition = {
 			default: 0,
 			description: "Contrast adjustment (-1 to 1)",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: -1,
 				max: 1,
 				step: .05,

package/dist/core/{Bulge-CsNj4Jew.js → Bulge-B8jPaomW.js}

@@ -1,4 +1,4 @@
-import { t as applyEdgeHandling } from "./edges-Bd7GP4s2.js";
+import { t as applyEdgeHandling } from "./edges-CfGcQniB.js";
 import { c as transformEdges, l as transformPosition } from "./transformations-B5lM6fYX.js";
 import { t as unpremultiplyAlpha } from "./alpha-Byel9eTg.js";
 import { convertToTexture, float, length, max, screenUV, smoothstep, vec2, vec4, viewportSize } from "three/tsl";
@@ -26,7 +26,7 @@ const componentDefinition = {
 			default: 1,
 			description: "The intensity of the bulge effect (positive = bulge out, negative = pinch in)",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: -1,
 				max: 1,
 				step: .05,
@@ -38,7 +38,7 @@ const componentDefinition = {
 			default: 1,
 			description: "The radius of the bulge effect area",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 5,
 				step: .1,
@@ -50,7 +50,7 @@ const componentDefinition = {
 			default: .5,
 			description: "Controls the smoothness of the transition (0 = hard edge, 1 = very smooth)",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .05,
@@ -62,6 +62,7 @@ const componentDefinition = {
 			default: "stretch",
 			description: "How to handle edges when distortion pushes content out of bounds",
 			transform: transformEdges,
+			compileTime: true,
 			ui: {
 				type: "select",
 				options: [
@@ -110,7 +111,7 @@ const componentDefinition = {
 		const bulgedDelta = delta.mul(scaleFactor);
 		const bulgedUV = centerPos.add(bulgedDelta);
 		const finalUV = vec2(bulgedUV.x.div(aspect), bulgedUV.y);
-		return unpremultiplyAlpha(applyEdgeHandling(finalUV, childTexture.sample(finalUV), childTexture, uniforms.edges.uniform));
+		return unpremultiplyAlpha(applyEdgeHandling(finalUV, childTexture.sample(finalUV), childTexture, uniforms.edges.uniform.value));
 	}
 };
 var Bulge_default = componentDefinition;

package/dist/core/{CRTScreen-cc_j5lyg.js → CRTScreen-C5v58BPh.js}

@@ -11,7 +11,7 @@ const componentDefinition = {
 			default: 128,
 			description: "Size of individual TV pixels (lower = more pixels)",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 8,
 				max: 128,
 				step: 1,
@@ -23,7 +23,7 @@ const componentDefinition = {
 			default: 1,
 			description: "Chromatic aberration amount",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 10,
 				step: .1,
@@ -35,7 +35,7 @@ const componentDefinition = {
 			default: .3,
 			description: "Strength of horizontal scanlines",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .1,
@@ -47,7 +47,7 @@ const componentDefinition = {
 			default: 200,
 			description: "Number of scanlines across screen",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 100,
 				max: 800,
 				step: 10,
@@ -56,10 +56,10 @@ const componentDefinition = {
 			}
 		},
 		brightness: {
-			default: 1.1,
+			default: 1,
 			description: "Screen brightness boost",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: .5,
 				max: 2,
 				step: .1,
@@ -68,10 +68,10 @@ const componentDefinition = {
 			}
 		},
 		contrast: {
-			default: 1.2,
+			default: 1,
 			description: "Screen contrast enhancement",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: .5,
 				max: 2,
 				step: .1,
@@ -83,7 +83,7 @@ const componentDefinition = {
 			default: 1,
 			description: "Strength of corner darkening effect (0 = off)",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .1,
@@ -95,7 +95,7 @@ const componentDefinition = {
 			default: .5,
 			description: "How far the vignette extends inward (0 = edges only, 1 = reaches center)",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .05,

package/dist/core/{ChannelBlur-4f44pSJj.js → ChannelBlur-BAq9PV6G.js}

@@ -11,7 +11,7 @@ const componentDefinition = {
 			default: 0,
 			description: "Blur intensity for red channel",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 100,
 				step: 1,
@@ -23,7 +23,7 @@ const componentDefinition = {
 			default: 20,
 			description: "Blur intensity for green channel",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 100,
 				step: 1,
@@ -35,7 +35,7 @@ const componentDefinition = {
 			default: 40,
 			description: "Blur intensity for blue channel",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 100,
 				step: 1,

package/dist/core/{Checkerboard-DwiW08iJ.js → Checkerboard-BtVQVtsL.js}

@@ -1,5 +1,5 @@
 import { a as transformColor, o as transformColorSpace, t as colorSpaceOptions } from "./transformations-B5lM6fYX.js";
-import { t as mixColors } from "./colorMixing-D_wMclqL.js";
+import { t as mixColors } from "./colorMixing-jSm3tbMv.js";
 import { float, floor, fract, min, mod, screenUV, smoothstep, vec2, viewportSize } from "three/tsl";
 const componentDefinition = {
 	name: "Checkerboard",
@@ -30,7 +30,7 @@ const componentDefinition = {
 			default: 8,
 			description: "Number of cells along the shortest canvas edge (creates square cells)",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 1,
 				max: 50,
 				step: 1,
@@ -42,7 +42,7 @@ const componentDefinition = {
 			default: 0,
 			description: "Smoothness of the transition between colors (0 = hard edges, 1 = very soft)",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .1,
@@ -53,6 +53,7 @@ const componentDefinition = {
 		colorSpace: {
 			default: "linear",
 			transform: transformColorSpace,
+			compileTime: true,
 			description: "Color space for color interpolation",
 			ui: {
 				type: "select",
@@ -76,7 +77,7 @@ const componentDefinition = {
 		const softRange = softness.mul(.5).add(1e-4);
 		const edgeBlend = smoothstep(float(0), softRange, distToEdge);
 		const blendFactor = checkerValue.mul(edgeBlend).add(float(.5).mul(float(1).sub(edgeBlend)));
-		return mixColors(uniforms.colorA.uniform, uniforms.colorB.uniform, blendFactor, uniforms.colorSpace.uniform);
+		return mixColors(uniforms.colorA.uniform, uniforms.colorB.uniform, blendFactor, uniforms.colorSpace.uniform.value);
 	}
 };
 var Checkerboard_default = componentDefinition;

package/dist/core/{ChromaFlow-DfP9ZDg0.js → ChromaFlow-Cq6hDVjX.js}

@@ -69,12 +69,12 @@ const componentDefinition = {
 			}
 		},
 		radius: {
-			default: 1.5,
+			default: 3,
 			description: "Radius of the liquid effect",
 			ui: {
 				type: "range",
 				min: 0,
-				max: 3,
+				max: 5,
 				step: .1,
 				label: "Radius",
 				group: "Effect"

package/dist/core/{ChromaticAberration-VL5tfOeo.js → ChromaticAberration-Ck4Zd3W1.js}

@@ -12,7 +12,7 @@ const componentDefinition = {
 			default: .2,
 			description: "Overall strength of the chromatic aberration effect",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .05,
@@ -25,7 +25,7 @@ const componentDefinition = {
 			transform: transformAngle,
 			description: "Direction of the chromatic aberration in degrees",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 360,
 				step: 1,
@@ -37,7 +37,7 @@ const componentDefinition = {
 			default: -1,
 			description: "Red channel offset multiplier",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: -2,
 				max: 2,
 				step: .1,
@@ -49,7 +49,7 @@ const componentDefinition = {
 			default: 0,
 			description: "Green channel offset multiplier",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: -2,
 				max: 2,
 				step: .1,
@@ -61,7 +61,7 @@ const componentDefinition = {
 			default: 1,
 			description: "Blue channel offset multiplier",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: -2,
 				max: 2,
 				step: .1,

package/dist/core/{Circle-CUYMdgd5.js → Circle-DdVVbdgQ.js}

@@ -1,5 +1,5 @@
 import { a as transformColor, l as transformPosition, o as transformColorSpace, t as colorSpaceOptions } from "./transformations-B5lM6fYX.js";
-import { t as mixColors } from "./colorMixing-D_wMclqL.js";
+import { t as mixColors } from "./colorMixing-jSm3tbMv.js";
 import { float, length, screenUV, smoothstep, vec2, vec4, viewportSize } from "three/tsl";
 var transformStrokePosition = (value) => {
 	const mode = {
@@ -32,7 +32,7 @@ const componentDefinition = {
 			default: 1,
 			description: "The radius of the circle. A value of one (1) is sets the circle to fit the canvas.",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 2,
 				step: .05,
@@ -44,7 +44,7 @@ const componentDefinition = {
 			default: 0,
 			description: "Edge softness. Lower values like zero (0) are sharp, higher values like one (1) are softer.",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .01,
@@ -69,7 +69,7 @@ const componentDefinition = {
 			default: 0,
 			description: "The thickness of the stroke outline. Zero (0) means no stroke.",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: .5,
 				step: .01,
@@ -114,6 +114,7 @@ const componentDefinition = {
 		colorSpace: {
 			default: "linear",
 			transform: transformColorSpace,
+			compileTime: true,
 			description: "Color space for blending fill and stroke colors in soft edges",
 			ui: {
 				type: "select",
@@ -140,7 +141,7 @@ const componentDefinition = {
 		const strokeOuter = isInside.select(circleEdge, isCenter.select(circleEdge.add(halfThickness), circleEdge.add(strokeThickness)));
 		const overallMask = smoothstep(strokeOuter.sub(edgeSoftness), strokeOuter, distanceFromCenter).oneMinus();
 		const strokeBlend = strokeThickness.greaterThan(float(0)).select(smoothstep(strokeInner.sub(edgeSoftness), strokeInner, distanceFromCenter), float(0));
-		const blendedColor = mixColors(vec4(uniforms.color.uniform.rgb, uniforms.color.uniform.a), vec4(uniforms.strokeColor.uniform.rgb, uniforms.strokeColor.uniform.a), strokeBlend, uniforms.colorSpace.uniform);
+		const blendedColor = mixColors(vec4(uniforms.color.uniform.rgb, uniforms.color.uniform.a), vec4(uniforms.strokeColor.uniform.rgb, uniforms.strokeColor.uniform.a), strokeBlend, uniforms.colorSpace.uniform.value);
 		return vec4(blendedColor.xyz, blendedColor.w.mul(overallMask));
 	}
 };

package/dist/core/{ConcentricSpin-DBqXmCjg.js → ConcentricSpin-BQTBqzyV.js}

@@ -1,4 +1,4 @@
-import { t as applyEdgeHandling } from "./edges-Bd7GP4s2.js";
+import { t as applyEdgeHandling } from "./edges-CfGcQniB.js";
 import { c as transformEdges, l as transformPosition } from "./transformations-B5lM6fYX.js";
 import { t as createAnimatedTime } from "./time-BZqyVJXt.js";
 import { t as unpremultiplyAlpha } from "./alpha-Byel9eTg.js";
@@ -14,7 +14,7 @@ const componentDefinition = {
 			default: 20,
 			description: "Maximum rotation angle per ring",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 100,
 				step: 1,
@@ -26,7 +26,7 @@ const componentDefinition = {
 			default: 8,
 			description: "Number of concentric rings",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 1,
 				max: 30,
 				step: 1,
@@ -38,7 +38,7 @@ const componentDefinition = {
 			default: .03,
 			description: "Softness of transitions between rings",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .01,
@@ -74,7 +74,7 @@ const componentDefinition = {
 			default: .5,
 			description: "How much each ring varies in rotation speed and direction",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 0,
 				max: 1,
 				step: .01,
@@ -86,6 +86,7 @@ const componentDefinition = {
 			default: "mirror",
 			description: "How to handle edges when distortion pushes content out of bounds",
 			transform: transformEdges,
+			compileTime: true,
 			ui: {
 				type: "select",
 				options: [
@@ -166,7 +167,7 @@ const componentDefinition = {
 			const rotX = dx.mul(cosA).sub(dy.mul(sinA));
 			const rotY = dx.mul(sinA).add(dy.mul(cosA));
 			const distortedUV = vec2(rotX.div(aspect).add(center.x), rotY.add(center.y));
-			return unpremultiplyAlpha(applyEdgeHandling(distortedUV, childTexture.sample(distortedUV), childTexture, uniforms.edges.uniform));
+			return unpremultiplyAlpha(applyEdgeHandling(distortedUV, childTexture.sample(distortedUV), childTexture, uniforms.edges.uniform.value));
 		})();
 	}
 };

package/dist/core/{ContourLines-D2KRIOBw.js → ContourLines-yEb5IJ1Y.js}

@@ -19,7 +19,7 @@ const componentDefinition = {
 			default: 5,
 			description: "Number of contour levels",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: 2,
 				max: 30,
 				step: 1,
@@ -31,7 +31,7 @@ const componentDefinition = {
 			default: 2,
 			description: "Width of the contour lines in pixels",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: .5,
 				max: 5,
 				step: .1,
@@ -55,7 +55,7 @@ const componentDefinition = {
 			default: .5,
 			description: "Contour distribution. <1 clusters in bright, >1 clusters in dark",
 			ui: {
-				type: "range",
+				type: ["range", "map"],
 				min: .1,
 				max: 2,
 				step: .05,