shaders 2.3.50 → 2.3.52

package/dist/svelte/index.js

@@ -1,82 +1,84 @@
-import { n as generatePresetCode } from "./generatePresetCode-Co-oSFXj.js";
+import { n as generatePresetCode } from "./generatePresetCode-DXODN9t6.js";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { getContext, onDestroy, onMount, setContext } from "svelte";
 import { createUniformsMap, shaderRenderer } from "../core/index.js";
 import { componentDefinition } from "../core/shaders/AngularBlur/index.js";
 import { componentDefinition as componentDefinition$1 } from "../core/shaders/Ascii/index.js";
-import { componentDefinition as componentDefinition$2 } from "../core/shaders/Beam/index.js";
-import { componentDefinition as componentDefinition$3 } from "../core/shaders/Blob/index.js";
-import { componentDefinition as componentDefinition$4 } from "../core/shaders/Blur/index.js";
-import { componentDefinition as componentDefinition$5 } from "../core/shaders/BrightnessContrast/index.js";
-import { componentDefinition as componentDefinition$6 } from "../core/shaders/Bulge/index.js";
-import { componentDefinition as componentDefinition$7 } from "../core/shaders/CRTScreen/index.js";
-import { componentDefinition as componentDefinition$8 } from "../core/shaders/ChannelBlur/index.js";
-import { componentDefinition as componentDefinition$9 } from "../core/shaders/Checkerboard/index.js";
-import { componentDefinition as componentDefinition$10 } from "../core/shaders/ChromaFlow/index.js";
-import { componentDefinition as componentDefinition$11 } from "../core/shaders/ChromaticAberration/index.js";
-import { componentDefinition as componentDefinition$12 } from "../core/shaders/Circle/index.js";
-import { componentDefinition as componentDefinition$13 } from "../core/shaders/ConcentricSpin/index.js";
-import { componentDefinition as componentDefinition$14 } from "../core/shaders/ContourLines/index.js";
-import { componentDefinition as componentDefinition$15 } from "../core/shaders/CursorTrail/index.js";
-import { componentDefinition as componentDefinition$16 } from "../core/shaders/DiffuseBlur/index.js";
-import { componentDefinition as componentDefinition$17 } from "../core/shaders/Dither/index.js";
-import { componentDefinition as componentDefinition$18 } from "../core/shaders/DotGrid/index.js";
-import { componentDefinition as componentDefinition$19 } from "../core/shaders/Duotone/index.js";
-import { componentDefinition as componentDefinition$20 } from "../core/shaders/FilmGrain/index.js";
-import { componentDefinition as componentDefinition$21 } from "../core/shaders/FloatingParticles/index.js";
-import { componentDefinition as componentDefinition$22 } from "../core/shaders/FlowField/index.js";
-import { componentDefinition as componentDefinition$23 } from "../core/shaders/GlassTiles/index.js";
-import { componentDefinition as componentDefinition$24 } from "../core/shaders/Glitch/index.js";
-import { componentDefinition as componentDefinition$25 } from "../core/shaders/Glow/index.js";
-import { componentDefinition as componentDefinition$26 } from "../core/shaders/Godrays/index.js";
-import { componentDefinition as componentDefinition$27 } from "../core/shaders/Grayscale/index.js";
-import { componentDefinition as componentDefinition$28 } from "../core/shaders/Grid/index.js";
-import { componentDefinition as componentDefinition$29 } from "../core/shaders/GridDistortion/index.js";
-import { componentDefinition as componentDefinition$30 } from "../core/shaders/Group/index.js";
-import { componentDefinition as componentDefinition$31 } from "../core/shaders/Halftone/index.js";
-import { componentDefinition as componentDefinition$32 } from "../core/shaders/HueShift/index.js";
-import { componentDefinition as componentDefinition$33 } from "../core/shaders/ImageTexture/index.js";
-import { componentDefinition as componentDefinition$34 } from "../core/shaders/Invert/index.js";
-import { componentDefinition as componentDefinition$35 } from "../core/shaders/Kaleidoscope/index.js";
-import { componentDefinition as componentDefinition$36 } from "../core/shaders/LensFlare/index.js";
-import { componentDefinition as componentDefinition$37 } from "../core/shaders/LinearBlur/index.js";
-import { componentDefinition as componentDefinition$38 } from "../core/shaders/LinearGradient/index.js";
-import { componentDefinition as componentDefinition$39 } from "../core/shaders/Liquify/index.js";
-import { componentDefinition as componentDefinition$40 } from "../core/shaders/Mirror/index.js";
-import { componentDefinition as componentDefinition$41 } from "../core/shaders/Perspective/index.js";
-import { componentDefinition as componentDefinition$42 } from "../core/shaders/Pixelate/index.js";
-import { componentDefinition as componentDefinition$43 } from "../core/shaders/Plasma/index.js";
-import { componentDefinition as componentDefinition$44 } from "../core/shaders/PolarCoordinates/index.js";
-import { componentDefinition as componentDefinition$45 } from "../core/shaders/Posterize/index.js";
-import { componentDefinition as componentDefinition$46 } from "../core/shaders/ProgressiveBlur/index.js";
-import { componentDefinition as componentDefinition$47 } from "../core/shaders/RadialGradient/index.js";
-import { componentDefinition as componentDefinition$48 } from "../core/shaders/RectangularCoordinates/index.js";
-import { componentDefinition as componentDefinition$49 } from "../core/shaders/Ripples/index.js";
-import { componentDefinition as componentDefinition$50 } from "../core/shaders/Saturation/index.js";
-import { componentDefinition as componentDefinition$51 } from "../core/shaders/Sharpness/index.js";
-import { componentDefinition as componentDefinition$52 } from "../core/shaders/Shatter/index.js";
-import { componentDefinition as componentDefinition$53 } from "../core/shaders/SimplexNoise/index.js";
-import { componentDefinition as componentDefinition$54 } from "../core/shaders/SineWave/index.js";
-import { componentDefinition as componentDefinition$55 } from "../core/shaders/SolidColor/index.js";
-import { componentDefinition as componentDefinition$56 } from "../core/shaders/Spherize/index.js";
-import { componentDefinition as componentDefinition$57 } from "../core/shaders/Spiral/index.js";
-import { componentDefinition as componentDefinition$58 } from "../core/shaders/Strands/index.js";
-import { componentDefinition as componentDefinition$59 } from "../core/shaders/Stretch/index.js";
-import { componentDefinition as componentDefinition$60 } from "../core/shaders/Stripes/index.js";
-import { componentDefinition as componentDefinition$61 } from "../core/shaders/Swirl/index.js";
-import { componentDefinition as componentDefinition$62 } from "../core/shaders/TiltShift/index.js";
-import { componentDefinition as componentDefinition$63 } from "../core/shaders/Tint/index.js";
-import { componentDefinition as componentDefinition$64 } from "../core/shaders/Tritone/index.js";
-import { componentDefinition as componentDefinition$65 } from "../core/shaders/Twirl/index.js";
-import { componentDefinition as componentDefinition$66 } from "../core/shaders/Vibrance/index.js";
-import { componentDefinition as componentDefinition$67 } from "../core/shaders/VideoTexture/index.js";
-import { componentDefinition as componentDefinition$68 } from "../core/shaders/WaveDistortion/index.js";
-import { componentDefinition as componentDefinition$69 } from "../core/shaders/WebcamTexture/index.js";
-import { componentDefinition as componentDefinition$70 } from "../core/shaders/ZoomBlur/index.js";
+import { componentDefinition as componentDefinition$2 } from "../core/shaders/Aurora/index.js";
+import { componentDefinition as componentDefinition$3 } from "../core/shaders/Beam/index.js";
+import { componentDefinition as componentDefinition$4 } from "../core/shaders/Blob/index.js";
+import { componentDefinition as componentDefinition$5 } from "../core/shaders/Blur/index.js";
+import { componentDefinition as componentDefinition$6 } from "../core/shaders/BrightnessContrast/index.js";
+import { componentDefinition as componentDefinition$7 } from "../core/shaders/Bulge/index.js";
+import { componentDefinition as componentDefinition$8 } from "../core/shaders/CRTScreen/index.js";
+import { componentDefinition as componentDefinition$9 } from "../core/shaders/ChannelBlur/index.js";
+import { componentDefinition as componentDefinition$10 } from "../core/shaders/Checkerboard/index.js";
+import { componentDefinition as componentDefinition$11 } from "../core/shaders/ChromaFlow/index.js";
+import { componentDefinition as componentDefinition$12 } from "../core/shaders/ChromaticAberration/index.js";
+import { componentDefinition as componentDefinition$13 } from "../core/shaders/Circle/index.js";
+import { componentDefinition as componentDefinition$14 } from "../core/shaders/ConcentricSpin/index.js";
+import { componentDefinition as componentDefinition$15 } from "../core/shaders/ContourLines/index.js";
+import { componentDefinition as componentDefinition$16 } from "../core/shaders/CursorTrail/index.js";
+import { componentDefinition as componentDefinition$17 } from "../core/shaders/DiffuseBlur/index.js";
+import { componentDefinition as componentDefinition$18 } from "../core/shaders/Dither/index.js";
+import { componentDefinition as componentDefinition$19 } from "../core/shaders/DotGrid/index.js";
+import { componentDefinition as componentDefinition$20 } from "../core/shaders/Duotone/index.js";
+import { componentDefinition as componentDefinition$21 } from "../core/shaders/FilmGrain/index.js";
+import { componentDefinition as componentDefinition$22 } from "../core/shaders/FloatingParticles/index.js";
+import { componentDefinition as componentDefinition$23 } from "../core/shaders/FlowField/index.js";
+import { componentDefinition as componentDefinition$24 } from "../core/shaders/GlassTiles/index.js";
+import { componentDefinition as componentDefinition$25 } from "../core/shaders/Glitch/index.js";
+import { componentDefinition as componentDefinition$26 } from "../core/shaders/Glow/index.js";
+import { componentDefinition as componentDefinition$27 } from "../core/shaders/Godrays/index.js";
+import { componentDefinition as componentDefinition$28 } from "../core/shaders/Grayscale/index.js";
+import { componentDefinition as componentDefinition$29 } from "../core/shaders/Grid/index.js";
+import { componentDefinition as componentDefinition$30 } from "../core/shaders/GridDistortion/index.js";
+import { componentDefinition as componentDefinition$31 } from "../core/shaders/Group/index.js";
+import { componentDefinition as componentDefinition$32 } from "../core/shaders/Halftone/index.js";
+import { componentDefinition as componentDefinition$33 } from "../core/shaders/HueShift/index.js";
+import { componentDefinition as componentDefinition$34 } from "../core/shaders/ImageTexture/index.js";
+import { componentDefinition as componentDefinition$35 } from "../core/shaders/Invert/index.js";
+import { componentDefinition as componentDefinition$36 } from "../core/shaders/Kaleidoscope/index.js";
+import { componentDefinition as componentDefinition$37 } from "../core/shaders/LensFlare/index.js";
+import { componentDefinition as componentDefinition$38 } from "../core/shaders/LinearBlur/index.js";
+import { componentDefinition as componentDefinition$39 } from "../core/shaders/LinearGradient/index.js";
+import { componentDefinition as componentDefinition$40 } from "../core/shaders/Liquify/index.js";
+import { componentDefinition as componentDefinition$41 } from "../core/shaders/Mirror/index.js";
+import { componentDefinition as componentDefinition$42 } from "../core/shaders/Perspective/index.js";
+import { componentDefinition as componentDefinition$43 } from "../core/shaders/Pixelate/index.js";
+import { componentDefinition as componentDefinition$44 } from "../core/shaders/Plasma/index.js";
+import { componentDefinition as componentDefinition$45 } from "../core/shaders/PolarCoordinates/index.js";
+import { componentDefinition as componentDefinition$46 } from "../core/shaders/Posterize/index.js";
+import { componentDefinition as componentDefinition$47 } from "../core/shaders/ProgressiveBlur/index.js";
+import { componentDefinition as componentDefinition$48 } from "../core/shaders/RadialGradient/index.js";
+import { componentDefinition as componentDefinition$49 } from "../core/shaders/RectangularCoordinates/index.js";
+import { componentDefinition as componentDefinition$50 } from "../core/shaders/Ripples/index.js";
+import { componentDefinition as componentDefinition$51 } from "../core/shaders/Saturation/index.js";
+import { componentDefinition as componentDefinition$52 } from "../core/shaders/Sharpness/index.js";
+import { componentDefinition as componentDefinition$53 } from "../core/shaders/Shatter/index.js";
+import { componentDefinition as componentDefinition$54 } from "../core/shaders/SimplexNoise/index.js";
+import { componentDefinition as componentDefinition$55 } from "../core/shaders/SineWave/index.js";
+import { componentDefinition as componentDefinition$56 } from "../core/shaders/SolidColor/index.js";
+import { componentDefinition as componentDefinition$57 } from "../core/shaders/Spherize/index.js";
+import { componentDefinition as componentDefinition$58 } from "../core/shaders/Spiral/index.js";
+import { componentDefinition as componentDefinition$59 } from "../core/shaders/Strands/index.js";
+import { componentDefinition as componentDefinition$60 } from "../core/shaders/Stretch/index.js";
+import { componentDefinition as componentDefinition$61 } from "../core/shaders/Stripes/index.js";
+import { componentDefinition as componentDefinition$62 } from "../core/shaders/StudioBackground/index.js";
+import { componentDefinition as componentDefinition$63 } from "../core/shaders/Swirl/index.js";
+import { componentDefinition as componentDefinition$64 } from "../core/shaders/TiltShift/index.js";
+import { componentDefinition as componentDefinition$65 } from "../core/shaders/Tint/index.js";
+import { componentDefinition as componentDefinition$66 } from "../core/shaders/Tritone/index.js";
+import { componentDefinition as componentDefinition$67 } from "../core/shaders/Twirl/index.js";
+import { componentDefinition as componentDefinition$68 } from "../core/shaders/Vibrance/index.js";
+import { componentDefinition as componentDefinition$69 } from "../core/shaders/VideoTexture/index.js";
+import { componentDefinition as componentDefinition$70 } from "../core/shaders/WaveDistortion/index.js";
+import { componentDefinition as componentDefinition$71 } from "../core/shaders/WebcamTexture/index.js";
+import { componentDefinition as componentDefinition$72 } from "../core/shaders/ZoomBlur/index.js";
 import { vec4 } from "three/tsl";
 import { TelemetryCollector, isExternalUser, shouldCollectTelemetry } from "../core/telemetry/index.js";
-var root$71 = $.from_html(`<span style="display:contents"><!></span>`);
+var root$73 = $.from_html(`<span style="display:contents"><!></span>`);
 function AngularBlur($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
@@ -196,7 +198,7 @@ function AngularBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$71();
+	var span = root$73();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -205,7 +207,7 @@ function AngularBlur($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$70 = $.from_html(`<span style="display:contents"><!></span>`);
+var root$72 = $.from_html(`<span style="display:contents"><!></span>`);
 function Ascii($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
@@ -325,7 +327,7 @@ function Ascii($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$70();
+	var span = root$72();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -334,8 +336,8 @@ function Ascii($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$69 = $.from_html(`<span style="display:contents"><!></span>`);
-function Beam($$anchor, $$props) {
+var root$71 = $.from_html(`<span style="display:contents"><!></span>`);
+function Aurora($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -454,7 +456,7 @@ function Beam($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$69();
+	var span = root$71();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -463,8 +465,8 @@ function Beam($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$68 = $.from_html(`<span style="display:contents"><!></span>`);
-function Blob($$anchor, $$props) {
+var root$70 = $.from_html(`<span style="display:contents"><!></span>`);
+function Beam($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -583,7 +585,7 @@ function Blob($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$68();
+	var span = root$70();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -592,8 +594,8 @@ function Blob($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$67 = $.from_html(`<span style="display:contents"><!></span>`);
-function Blur($$anchor, $$props) {
+var root$69 = $.from_html(`<span style="display:contents"><!></span>`);
+function Blob($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -712,7 +714,7 @@ function Blur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$67();
+	var span = root$69();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -721,8 +723,8 @@ function Blur($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$66 = $.from_html(`<span style="display:contents"><!></span>`);
-function BrightnessContrast($$anchor, $$props) {
+var root$68 = $.from_html(`<span style="display:contents"><!></span>`);
+function Blur($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -841,7 +843,7 @@ function BrightnessContrast($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$66();
+	var span = root$68();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -850,8 +852,8 @@ function BrightnessContrast($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$65 = $.from_html(`<span style="display:contents"><!></span>`);
-function Bulge($$anchor, $$props) {
+var root$67 = $.from_html(`<span style="display:contents"><!></span>`);
+function BrightnessContrast($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -970,7 +972,7 @@ function Bulge($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$65();
+	var span = root$67();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -979,8 +981,8 @@ function Bulge($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$64 = $.from_html(`<span style="display:contents"><!></span>`);
-function CRTScreen($$anchor, $$props) {
+var root$66 = $.from_html(`<span style="display:contents"><!></span>`);
+function Bulge($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -1099,7 +1101,7 @@ function CRTScreen($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$64();
+	var span = root$66();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -1108,8 +1110,8 @@ function CRTScreen($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$63 = $.from_html(`<span style="display:contents"><!></span>`);
-function ChannelBlur($$anchor, $$props) {
+var root$65 = $.from_html(`<span style="display:contents"><!></span>`);
+function CRTScreen($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -1228,7 +1230,7 @@ function ChannelBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$63();
+	var span = root$65();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -1237,8 +1239,8 @@ function ChannelBlur($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$62 = $.from_html(`<span style="display:contents"><!></span>`);
-function Checkerboard($$anchor, $$props) {
+var root$64 = $.from_html(`<span style="display:contents"><!></span>`);
+function ChannelBlur($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -1357,7 +1359,7 @@ function Checkerboard($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$62();
+	var span = root$64();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -1366,8 +1368,8 @@ function Checkerboard($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$61 = $.from_html(`<span style="display:contents"><!></span>`);
-function ChromaFlow($$anchor, $$props) {
+var root$63 = $.from_html(`<span style="display:contents"><!></span>`);
+function Checkerboard($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -1486,7 +1488,7 @@ function ChromaFlow($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$61();
+	var span = root$63();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -1495,8 +1497,8 @@ function ChromaFlow($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$60 = $.from_html(`<span style="display:contents"><!></span>`);
-function ChromaticAberration($$anchor, $$props) {
+var root$62 = $.from_html(`<span style="display:contents"><!></span>`);
+function ChromaFlow($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -1615,7 +1617,7 @@ function ChromaticAberration($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$60();
+	var span = root$62();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -1624,8 +1626,8 @@ function ChromaticAberration($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$59 = $.from_html(`<span style="display:contents"><!></span>`);
-function Circle($$anchor, $$props) {
+var root$61 = $.from_html(`<span style="display:contents"><!></span>`);
+function ChromaticAberration($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -1744,7 +1746,7 @@ function Circle($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$59();
+	var span = root$61();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -1753,8 +1755,8 @@ function Circle($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$58 = $.from_html(`<span style="display:contents"><!></span>`);
-function ConcentricSpin($$anchor, $$props) {
+var root$60 = $.from_html(`<span style="display:contents"><!></span>`);
+function Circle($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -1873,7 +1875,7 @@ function ConcentricSpin($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$58();
+	var span = root$60();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -1882,8 +1884,8 @@ function ConcentricSpin($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$57 = $.from_html(`<span style="display:contents"><!></span>`);
-function ContourLines($$anchor, $$props) {
+var root$59 = $.from_html(`<span style="display:contents"><!></span>`);
+function ConcentricSpin($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -2002,7 +2004,7 @@ function ContourLines($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$57();
+	var span = root$59();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -2011,8 +2013,8 @@ function ContourLines($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$56 = $.from_html(`<span style="display:contents"><!></span>`);
-function CursorTrail($$anchor, $$props) {
+var root$58 = $.from_html(`<span style="display:contents"><!></span>`);
+function ContourLines($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -2131,7 +2133,7 @@ function CursorTrail($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$56();
+	var span = root$58();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -2140,8 +2142,8 @@ function CursorTrail($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$55 = $.from_html(`<span style="display:contents"><!></span>`);
-function DiffuseBlur($$anchor, $$props) {
+var root$57 = $.from_html(`<span style="display:contents"><!></span>`);
+function CursorTrail($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -2260,7 +2262,7 @@ function DiffuseBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$55();
+	var span = root$57();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -2269,8 +2271,8 @@ function DiffuseBlur($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$54 = $.from_html(`<span style="display:contents"><!></span>`);
-function Dither($$anchor, $$props) {
+var root$56 = $.from_html(`<span style="display:contents"><!></span>`);
+function DiffuseBlur($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -2389,7 +2391,7 @@ function Dither($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$54();
+	var span = root$56();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -2398,8 +2400,8 @@ function Dither($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$53 = $.from_html(`<span style="display:contents"><!></span>`);
-function DotGrid($$anchor, $$props) {
+var root$55 = $.from_html(`<span style="display:contents"><!></span>`);
+function Dither($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -2518,7 +2520,7 @@ function DotGrid($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$53();
+	var span = root$55();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -2527,8 +2529,8 @@ function DotGrid($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$52 = $.from_html(`<span style="display:contents"><!></span>`);
-function Duotone($$anchor, $$props) {
+var root$54 = $.from_html(`<span style="display:contents"><!></span>`);
+function DotGrid($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -2647,7 +2649,7 @@ function Duotone($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$52();
+	var span = root$54();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -2656,8 +2658,8 @@ function Duotone($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$51 = $.from_html(`<span style="display:contents"><!></span>`);
-function FilmGrain($$anchor, $$props) {
+var root$53 = $.from_html(`<span style="display:contents"><!></span>`);
+function Duotone($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -2776,7 +2778,7 @@ function FilmGrain($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$51();
+	var span = root$53();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -2785,8 +2787,8 @@ function FilmGrain($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$50 = $.from_html(`<span style="display:contents"><!></span>`);
-function FloatingParticles($$anchor, $$props) {
+var root$52 = $.from_html(`<span style="display:contents"><!></span>`);
+function FilmGrain($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -2905,7 +2907,7 @@ function FloatingParticles($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$50();
+	var span = root$52();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -2914,8 +2916,8 @@ function FloatingParticles($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$49 = $.from_html(`<span style="display:contents"><!></span>`);
-function FlowField($$anchor, $$props) {
+var root$51 = $.from_html(`<span style="display:contents"><!></span>`);
+function FloatingParticles($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -3034,7 +3036,7 @@ function FlowField($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$49();
+	var span = root$51();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -3043,8 +3045,8 @@ function FlowField($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$48 = $.from_html(`<span style="display:contents"><!></span>`);
-function GlassTiles($$anchor, $$props) {
+var root$50 = $.from_html(`<span style="display:contents"><!></span>`);
+function FlowField($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -3163,7 +3165,7 @@ function GlassTiles($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$48();
+	var span = root$50();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -3172,8 +3174,8 @@ function GlassTiles($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$47 = $.from_html(`<span style="display:contents"><!></span>`);
-function Glitch($$anchor, $$props) {
+var root$49 = $.from_html(`<span style="display:contents"><!></span>`);
+function GlassTiles($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -3292,7 +3294,7 @@ function Glitch($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$47();
+	var span = root$49();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -3301,8 +3303,8 @@ function Glitch($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$46 = $.from_html(`<span style="display:contents"><!></span>`);
-function Glow($$anchor, $$props) {
+var root$48 = $.from_html(`<span style="display:contents"><!></span>`);
+function Glitch($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -3421,7 +3423,7 @@ function Glow($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$46();
+	var span = root$48();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -3430,8 +3432,8 @@ function Glow($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$45 = $.from_html(`<span style="display:contents"><!></span>`);
-function Godrays($$anchor, $$props) {
+var root$47 = $.from_html(`<span style="display:contents"><!></span>`);
+function Glow($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -3550,7 +3552,7 @@ function Godrays($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$45();
+	var span = root$47();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -3559,8 +3561,8 @@ function Godrays($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$44 = $.from_html(`<span style="display:contents"><!></span>`);
-function Grayscale($$anchor, $$props) {
+var root$46 = $.from_html(`<span style="display:contents"><!></span>`);
+function Godrays($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -3679,7 +3681,7 @@ function Grayscale($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$44();
+	var span = root$46();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -3688,8 +3690,8 @@ function Grayscale($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$43 = $.from_html(`<span style="display:contents"><!></span>`);
-function Grid($$anchor, $$props) {
+var root$45 = $.from_html(`<span style="display:contents"><!></span>`);
+function Grayscale($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -3808,7 +3810,7 @@ function Grid($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$43();
+	var span = root$45();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -3817,8 +3819,8 @@ function Grid($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$42 = $.from_html(`<span style="display:contents"><!></span>`);
-function GridDistortion($$anchor, $$props) {
+var root$44 = $.from_html(`<span style="display:contents"><!></span>`);
+function Grid($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -3937,7 +3939,7 @@ function GridDistortion($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$42();
+	var span = root$44();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -3946,8 +3948,8 @@ function GridDistortion($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$41 = $.from_html(`<span style="display:contents"><!></span>`);
-function Group($$anchor, $$props) {
+var root$43 = $.from_html(`<span style="display:contents"><!></span>`);
+function GridDistortion($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -4066,7 +4068,7 @@ function Group($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$41();
+	var span = root$43();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -4075,8 +4077,8 @@ function Group($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$40 = $.from_html(`<span style="display:contents"><!></span>`);
-function Halftone($$anchor, $$props) {
+var root$42 = $.from_html(`<span style="display:contents"><!></span>`);
+function Group($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -4195,7 +4197,7 @@ function Halftone($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$40();
+	var span = root$42();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -4204,8 +4206,8 @@ function Halftone($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$39 = $.from_html(`<span style="display:contents"><!></span>`);
-function HueShift($$anchor, $$props) {
+var root$41 = $.from_html(`<span style="display:contents"><!></span>`);
+function Halftone($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -4324,7 +4326,7 @@ function HueShift($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$39();
+	var span = root$41();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -4333,8 +4335,8 @@ function HueShift($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$38 = $.from_html(`<span style="display:contents"><!></span>`);
-function ImageTexture($$anchor, $$props) {
+var root$40 = $.from_html(`<span style="display:contents"><!></span>`);
+function HueShift($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -4453,7 +4455,7 @@ function ImageTexture($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$38();
+	var span = root$40();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -4462,8 +4464,8 @@ function ImageTexture($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$37 = $.from_html(`<span style="display:contents"><!></span>`);
-function Invert($$anchor, $$props) {
+var root$39 = $.from_html(`<span style="display:contents"><!></span>`);
+function ImageTexture($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -4582,7 +4584,7 @@ function Invert($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$37();
+	var span = root$39();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -4591,8 +4593,8 @@ function Invert($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$36 = $.from_html(`<span style="display:contents"><!></span>`);
-function Kaleidoscope($$anchor, $$props) {
+var root$38 = $.from_html(`<span style="display:contents"><!></span>`);
+function Invert($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -4711,7 +4713,7 @@ function Kaleidoscope($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$36();
+	var span = root$38();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -4720,8 +4722,8 @@ function Kaleidoscope($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$35 = $.from_html(`<span style="display:contents"><!></span>`);
-function LensFlare($$anchor, $$props) {
+var root$37 = $.from_html(`<span style="display:contents"><!></span>`);
+function Kaleidoscope($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -4840,7 +4842,7 @@ function LensFlare($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$35();
+	var span = root$37();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -4849,8 +4851,8 @@ function LensFlare($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$34 = $.from_html(`<span style="display:contents"><!></span>`);
-function LinearBlur($$anchor, $$props) {
+var root$36 = $.from_html(`<span style="display:contents"><!></span>`);
+function LensFlare($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -4969,7 +4971,7 @@ function LinearBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$34();
+	var span = root$36();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -4978,8 +4980,8 @@ function LinearBlur($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$33 = $.from_html(`<span style="display:contents"><!></span>`);
-function LinearGradient($$anchor, $$props) {
+var root$35 = $.from_html(`<span style="display:contents"><!></span>`);
+function LinearBlur($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -5098,7 +5100,7 @@ function LinearGradient($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$33();
+	var span = root$35();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -5107,8 +5109,8 @@ function LinearGradient($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$32 = $.from_html(`<span style="display:contents"><!></span>`);
-function Liquify($$anchor, $$props) {
+var root$34 = $.from_html(`<span style="display:contents"><!></span>`);
+function LinearGradient($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -5227,7 +5229,7 @@ function Liquify($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$32();
+	var span = root$34();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -5236,8 +5238,8 @@ function Liquify($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$31 = $.from_html(`<span style="display:contents"><!></span>`);
-function Mirror($$anchor, $$props) {
+var root$33 = $.from_html(`<span style="display:contents"><!></span>`);
+function Liquify($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -5356,7 +5358,7 @@ function Mirror($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$31();
+	var span = root$33();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -5365,8 +5367,8 @@ function Mirror($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$30 = $.from_html(`<span style="display:contents"><!></span>`);
-function Perspective($$anchor, $$props) {
+var root$32 = $.from_html(`<span style="display:contents"><!></span>`);
+function Mirror($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -5485,7 +5487,7 @@ function Perspective($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$30();
+	var span = root$32();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -5494,8 +5496,8 @@ function Perspective($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$29 = $.from_html(`<span style="display:contents"><!></span>`);
-function Pixelate($$anchor, $$props) {
+var root$31 = $.from_html(`<span style="display:contents"><!></span>`);
+function Perspective($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -5614,7 +5616,7 @@ function Pixelate($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$29();
+	var span = root$31();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -5623,8 +5625,8 @@ function Pixelate($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$28 = $.from_html(`<span style="display:contents"><!></span>`);
-function Plasma($$anchor, $$props) {
+var root$30 = $.from_html(`<span style="display:contents"><!></span>`);
+function Pixelate($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -5743,7 +5745,7 @@ function Plasma($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$28();
+	var span = root$30();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -5752,8 +5754,8 @@ function Plasma($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$27 = $.from_html(`<span style="display:contents"><!></span>`);
-function PolarCoordinates($$anchor, $$props) {
+var root$29 = $.from_html(`<span style="display:contents"><!></span>`);
+function Plasma($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -5872,7 +5874,7 @@ function PolarCoordinates($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$27();
+	var span = root$29();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -5881,8 +5883,8 @@ function PolarCoordinates($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$26 = $.from_html(`<span style="display:contents"><!></span>`);
-function Posterize($$anchor, $$props) {
+var root$28 = $.from_html(`<span style="display:contents"><!></span>`);
+function PolarCoordinates($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6001,7 +6003,7 @@ function Posterize($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$26();
+	var span = root$28();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -6010,8 +6012,8 @@ function Posterize($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$25 = $.from_html(`<span style="display:contents"><!></span>`);
-function ProgressiveBlur($$anchor, $$props) {
+var root$27 = $.from_html(`<span style="display:contents"><!></span>`);
+function Posterize($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6130,7 +6132,7 @@ function ProgressiveBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$25();
+	var span = root$27();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -6139,8 +6141,8 @@ function ProgressiveBlur($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$24 = $.from_html(`<span style="display:contents"><!></span>`);
-function RadialGradient($$anchor, $$props) {
+var root$26 = $.from_html(`<span style="display:contents"><!></span>`);
+function ProgressiveBlur($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6259,7 +6261,7 @@ function RadialGradient($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$24();
+	var span = root$26();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -6268,8 +6270,8 @@ function RadialGradient($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$23 = $.from_html(`<span style="display:contents"><!></span>`);
-function RectangularCoordinates($$anchor, $$props) {
+var root$25 = $.from_html(`<span style="display:contents"><!></span>`);
+function RadialGradient($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6388,7 +6390,7 @@ function RectangularCoordinates($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$23();
+	var span = root$25();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -6397,8 +6399,8 @@ function RectangularCoordinates($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$22 = $.from_html(`<span style="display:contents"><!></span>`);
-function Ripples($$anchor, $$props) {
+var root$24 = $.from_html(`<span style="display:contents"><!></span>`);
+function RectangularCoordinates($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6517,7 +6519,7 @@ function Ripples($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$22();
+	var span = root$24();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -6526,8 +6528,8 @@ function Ripples($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$21 = $.from_html(`<span style="display:contents"><!></span>`);
-function Saturation($$anchor, $$props) {
+var root$23 = $.from_html(`<span style="display:contents"><!></span>`);
+function Ripples($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6646,7 +6648,7 @@ function Saturation($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$21();
+	var span = root$23();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -6655,8 +6657,8 @@ function Saturation($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$20 = $.from_html(`<span style="display:contents"><!></span>`);
-function Sharpness($$anchor, $$props) {
+var root$22 = $.from_html(`<span style="display:contents"><!></span>`);
+function Saturation($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6775,7 +6777,7 @@ function Sharpness($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$20();
+	var span = root$22();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -6784,8 +6786,8 @@ function Sharpness($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$19 = $.from_html(`<span style="display:contents"><!></span>`);
-function Shatter($$anchor, $$props) {
+var root$21 = $.from_html(`<span style="display:contents"><!></span>`);
+function Sharpness($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6904,7 +6906,7 @@ function Shatter($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$19();
+	var span = root$21();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -6913,8 +6915,8 @@ function Shatter($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$18 = $.from_html(`<span style="display:contents"><!></span>`);
-function SimplexNoise($$anchor, $$props) {
+var root$20 = $.from_html(`<span style="display:contents"><!></span>`);
+function Shatter($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -7033,7 +7035,7 @@ function SimplexNoise($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$18();
+	var span = root$20();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -7042,8 +7044,8 @@ function SimplexNoise($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$17 = $.from_html(`<span style="display:contents"><!></span>`);
-function SineWave($$anchor, $$props) {
+var root$19 = $.from_html(`<span style="display:contents"><!></span>`);
+function SimplexNoise($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -7162,7 +7164,7 @@ function SineWave($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$17();
+	var span = root$19();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -7171,8 +7173,8 @@ function SineWave($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$16 = $.from_html(`<span style="display:contents"><!></span>`);
-function SolidColor($$anchor, $$props) {
+var root$18 = $.from_html(`<span style="display:contents"><!></span>`);
+function SineWave($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -7291,7 +7293,7 @@ function SolidColor($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$16();
+	var span = root$18();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -7300,8 +7302,8 @@ function SolidColor($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$15 = $.from_html(`<span style="display:contents"><!></span>`);
-function Spherize($$anchor, $$props) {
+var root$17 = $.from_html(`<span style="display:contents"><!></span>`);
+function SolidColor($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -7420,7 +7422,7 @@ function Spherize($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$15();
+	var span = root$17();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -7429,8 +7431,8 @@ function Spherize($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$14 = $.from_html(`<span style="display:contents"><!></span>`);
-function Spiral($$anchor, $$props) {
+var root$16 = $.from_html(`<span style="display:contents"><!></span>`);
+function Spherize($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -7549,7 +7551,7 @@ function Spiral($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$14();
+	var span = root$16();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -7558,8 +7560,8 @@ function Spiral($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$13 = $.from_html(`<span style="display:contents"><!></span>`);
-function Strands($$anchor, $$props) {
+var root$15 = $.from_html(`<span style="display:contents"><!></span>`);
+function Spiral($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -7678,7 +7680,7 @@ function Strands($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$13();
+	var span = root$15();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -7687,8 +7689,8 @@ function Strands($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$12 = $.from_html(`<span style="display:contents"><!></span>`);
-function Stretch($$anchor, $$props) {
+var root$14 = $.from_html(`<span style="display:contents"><!></span>`);
+function Strands($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -7807,7 +7809,7 @@ function Stretch($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$12();
+	var span = root$14();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -7816,8 +7818,8 @@ function Stretch($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$11 = $.from_html(`<span style="display:contents"><!></span>`);
-function Stripes($$anchor, $$props) {
+var root$13 = $.from_html(`<span style="display:contents"><!></span>`);
+function Stretch($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -7936,7 +7938,7 @@ function Stripes($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$11();
+	var span = root$13();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -7945,8 +7947,8 @@ function Stripes($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$10 = $.from_html(`<span style="display:contents"><!></span>`);
-function Swirl($$anchor, $$props) {
+var root$12 = $.from_html(`<span style="display:contents"><!></span>`);
+function Stripes($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -8065,7 +8067,7 @@ function Swirl($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$10();
+	var span = root$12();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -8074,8 +8076,8 @@ function Swirl($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$9 = $.from_html(`<span style="display:contents"><!></span>`);
-function TiltShift($$anchor, $$props) {
+var root$11 = $.from_html(`<span style="display:contents"><!></span>`);
+function StudioBackground($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -8194,7 +8196,7 @@ function TiltShift($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$9();
+	var span = root$11();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -8203,8 +8205,8 @@ function TiltShift($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$8 = $.from_html(`<span style="display:contents"><!></span>`);
-function Tint($$anchor, $$props) {
+var root$10 = $.from_html(`<span style="display:contents"><!></span>`);
+function Swirl($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -8323,7 +8325,7 @@ function Tint($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$8();
+	var span = root$10();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -8332,8 +8334,8 @@ function Tint($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$7 = $.from_html(`<span style="display:contents"><!></span>`);
-function Tritone($$anchor, $$props) {
+var root$9 = $.from_html(`<span style="display:contents"><!></span>`);
+function TiltShift($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -8452,7 +8454,7 @@ function Tritone($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$7();
+	var span = root$9();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -8461,8 +8463,8 @@ function Tritone($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$6 = $.from_html(`<span style="display:contents"><!></span>`);
-function Twirl($$anchor, $$props) {
+var root$8 = $.from_html(`<span style="display:contents"><!></span>`);
+function Tint($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -8581,7 +8583,7 @@ function Twirl($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$6();
+	var span = root$8();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -8590,8 +8592,8 @@ function Twirl($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$5 = $.from_html(`<span style="display:contents"><!></span>`);
-function Vibrance($$anchor, $$props) {
+var root$7 = $.from_html(`<span style="display:contents"><!></span>`);
+function Tritone($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -8710,7 +8712,7 @@ function Vibrance($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$5();
+	var span = root$7();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -8719,8 +8721,8 @@ function Vibrance($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$4 = $.from_html(`<span style="display:contents"><!></span>`);
-function VideoTexture($$anchor, $$props) {
+var root$6 = $.from_html(`<span style="display:contents"><!></span>`);
+function Twirl($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -8839,7 +8841,7 @@ function VideoTexture($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$4();
+	var span = root$6();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -8848,8 +8850,8 @@ function VideoTexture($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$3 = $.from_html(`<span style="display:contents"><!></span>`);
-function WaveDistortion($$anchor, $$props) {
+var root$5 = $.from_html(`<span style="display:contents"><!></span>`);
+function Vibrance($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -8968,7 +8970,7 @@ function WaveDistortion($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$3();
+	var span = root$5();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -8977,8 +8979,8 @@ function WaveDistortion($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$2 = $.from_html(`<span style="display:contents"><!></span>`);
-function WebcamTexture($$anchor, $$props) {
+var root$4 = $.from_html(`<span style="display:contents"><!></span>`);
+function VideoTexture($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -9097,7 +9099,7 @@ function WebcamTexture($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var span = root$2();
+	var span = root$4();
 	var node = $.child(span);
 	children?.(node);
 	$.reset(span);
@@ -9106,8 +9108,8 @@ function WebcamTexture($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-var root$1 = $.from_html(`<span style="display:contents"><!></span>`);
-function ZoomBlur($$anchor, $$props) {
+var root$3 = $.from_html(`<span style="display:contents"><!></span>`);
+function WaveDistortion($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -9226,6 +9228,264 @@ function ZoomBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
+	var span = root$3();
+	var node = $.child(span);
+	children?.(node);
+	$.reset(span);
+	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
+	$.template_effect(() => $.set_attribute(span, "data-shader-id", instanceId));
+	$.append($$anchor, span);
+	$.pop();
+}
+var root$2 = $.from_html(`<span style="display:contents"><!></span>`);
+function WebcamTexture($$anchor, $$props) {
+	$.push($$props, true);
+	const DEFAULT_TRANSFORM = {
+		offsetX: 0,
+		offsetY: 0,
+		rotation: 0,
+		scale: 1,
+		anchorX: .5,
+		anchorY: .5,
+		edges: "transparent"
+	};
+	const componentDefaults = {
+		blendMode: "normal",
+		visible: true,
+		...Object.entries(componentDefinition$71.props).reduce((acc, [key, config]) => {
+			acc[key] = config.default;
+			return acc;
+		}, {})
+	};
+	const props = $.rest_props($$props, [
+		"$$slots",
+		"$$events",
+		"$$legacy"
+	]);
+	const blendMode = $$props.blendMode ?? componentDefaults.blendMode;
+	const opacity = $$props.opacity;
+	const visible = $$props.visible ?? componentDefaults.visible;
+	const id = $$props.id;
+	const maskSource = $$props.maskSource;
+	const maskType = $$props.maskType;
+	const renderOrder = $$props.renderOrder;
+	const { children } = props;
+	const effectiveTransform = $.derived(() => ({
+		...DEFAULT_TRANSFORM,
+		...$$props.transform
+	}));
+	const parentId = getContext("shaderParentId");
+	if (parentId === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
+	const instanceId = id || Math.random().toString(36).substring(2, 10);
+	setContext("shaderParentId", instanceId);
+	const shaderReadyProps = $.derived(() => {
+		let baseProps = { ...componentDefaults };
+		for (const key in props) if (key !== "blendMode" && key !== "opacity" && key !== "visible" && key !== "id" && key !== "maskSource" && key !== "maskType" && key !== "renderOrder" && key !== "transform" && key !== "children") {
+			const propValue = props[key];
+			const defaultValue = componentDefaults[key];
+			if (propValue !== void 0 && propValue !== defaultValue) baseProps[key] = propValue;
+		}
+		return baseProps;
+	});
+	const uniforms = createUniformsMap(componentDefinition$71, $.get(shaderReadyProps), instanceId);
+	const parentRegister = getContext("shaderNodeRegister");
+	if (parentRegister === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
+	const parentUniformUpdate = getContext("shaderUniformUpdate");
+	if (parentUniformUpdate === void 0) throw new Error("Shader components require shaderUniformUpdate from parent");
+	const parentMetadataUpdate = getContext("shaderMetadataUpdate");
+	if (parentMetadataUpdate === void 0) throw new Error("Shader components require shaderMetadataUpdate from parent");
+	let orderMarker;
+	let detectedRenderOrder = void 0;
+	let isRegistered = $.state(false);
+	Object.entries(uniforms).forEach(([propName, { uniform, transform }]) => {
+		$.user_effect(() => {
+			if (!$.get(isRegistered)) return;
+			if (uniform && uniform.value !== void 0) {
+				const newValue = props[propName];
+				if (newValue !== void 0) parentUniformUpdate(instanceId, propName, newValue);
+			}
+		});
+	});
+	$.user_effect(() => {
+		if (!$.get(isRegistered)) return;
+		parentMetadataUpdate(instanceId, {
+			blendMode,
+			opacity,
+			visible: visible === false ? false : true,
+			id,
+			mask: maskSource ? {
+				source: maskSource,
+				type: maskType || "alpha"
+			} : void 0,
+			renderOrder: renderOrder ?? detectedRenderOrder,
+			transform: $.get(effectiveTransform)
+		});
+	});
+	onMount(() => {
+		if (componentDefinition$71 && typeof componentDefinition$71.fragmentNode === "function") {
+			parentRegister(instanceId, componentDefinition$71.fragmentNode, parentId, {
+				blendMode,
+				opacity,
+				visible: visible !== false ? true : false,
+				id,
+				mask: maskSource ? {
+					source: maskSource,
+					type: maskType || "alpha"
+				} : void 0,
+				renderOrder: renderOrder ?? detectedRenderOrder,
+				transform: $.get(effectiveTransform)
+			}, uniforms);
+			$.set(isRegistered, true);
+			if (renderOrder === void 0 && orderMarker) {
+				const parent = orderMarker.parentElement;
+				if (parent) {
+					const siblings = parent.querySelectorAll(":scope > [data-shader-id]");
+					const position = Array.from(siblings).indexOf(orderMarker);
+					if (position >= 0) {
+						detectedRenderOrder = position;
+						parentMetadataUpdate(instanceId, { renderOrder: position });
+					}
+				}
+			}
+		} else console.error("componentDefinition.fragmentNode is not a function:", {
+			componentDefinition: componentDefinition$71,
+			fragmentNode: componentDefinition$71?.fragmentNode,
+			type: typeof componentDefinition$71?.fragmentNode
+		});
+	});
+	onDestroy(() => {
+		$.set(isRegistered, false);
+		parentRegister(instanceId, null, null, null, null);
+	});
+	var span = root$2();
+	var node = $.child(span);
+	children?.(node);
+	$.reset(span);
+	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
+	$.template_effect(() => $.set_attribute(span, "data-shader-id", instanceId));
+	$.append($$anchor, span);
+	$.pop();
+}
+var root$1 = $.from_html(`<span style="display:contents"><!></span>`);
+function ZoomBlur($$anchor, $$props) {
+	$.push($$props, true);
+	const DEFAULT_TRANSFORM = {
+		offsetX: 0,
+		offsetY: 0,
+		rotation: 0,
+		scale: 1,
+		anchorX: .5,
+		anchorY: .5,
+		edges: "transparent"
+	};
+	const componentDefaults = {
+		blendMode: "normal",
+		visible: true,
+		...Object.entries(componentDefinition$72.props).reduce((acc, [key, config]) => {
+			acc[key] = config.default;
+			return acc;
+		}, {})
+	};
+	const props = $.rest_props($$props, [
+		"$$slots",
+		"$$events",
+		"$$legacy"
+	]);
+	const blendMode = $$props.blendMode ?? componentDefaults.blendMode;
+	const opacity = $$props.opacity;
+	const visible = $$props.visible ?? componentDefaults.visible;
+	const id = $$props.id;
+	const maskSource = $$props.maskSource;
+	const maskType = $$props.maskType;
+	const renderOrder = $$props.renderOrder;
+	const { children } = props;
+	const effectiveTransform = $.derived(() => ({
+		...DEFAULT_TRANSFORM,
+		...$$props.transform
+	}));
+	const parentId = getContext("shaderParentId");
+	if (parentId === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
+	const instanceId = id || Math.random().toString(36).substring(2, 10);
+	setContext("shaderParentId", instanceId);
+	const shaderReadyProps = $.derived(() => {
+		let baseProps = { ...componentDefaults };
+		for (const key in props) if (key !== "blendMode" && key !== "opacity" && key !== "visible" && key !== "id" && key !== "maskSource" && key !== "maskType" && key !== "renderOrder" && key !== "transform" && key !== "children") {
+			const propValue = props[key];
+			const defaultValue = componentDefaults[key];
+			if (propValue !== void 0 && propValue !== defaultValue) baseProps[key] = propValue;
+		}
+		return baseProps;
+	});
+	const uniforms = createUniformsMap(componentDefinition$72, $.get(shaderReadyProps), instanceId);
+	const parentRegister = getContext("shaderNodeRegister");
+	if (parentRegister === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
+	const parentUniformUpdate = getContext("shaderUniformUpdate");
+	if (parentUniformUpdate === void 0) throw new Error("Shader components require shaderUniformUpdate from parent");
+	const parentMetadataUpdate = getContext("shaderMetadataUpdate");
+	if (parentMetadataUpdate === void 0) throw new Error("Shader components require shaderMetadataUpdate from parent");
+	let orderMarker;
+	let detectedRenderOrder = void 0;
+	let isRegistered = $.state(false);
+	Object.entries(uniforms).forEach(([propName, { uniform, transform }]) => {
+		$.user_effect(() => {
+			if (!$.get(isRegistered)) return;
+			if (uniform && uniform.value !== void 0) {
+				const newValue = props[propName];
+				if (newValue !== void 0) parentUniformUpdate(instanceId, propName, newValue);
+			}
+		});
+	});
+	$.user_effect(() => {
+		if (!$.get(isRegistered)) return;
+		parentMetadataUpdate(instanceId, {
+			blendMode,
+			opacity,
+			visible: visible === false ? false : true,
+			id,
+			mask: maskSource ? {
+				source: maskSource,
+				type: maskType || "alpha"
+			} : void 0,
+			renderOrder: renderOrder ?? detectedRenderOrder,
+			transform: $.get(effectiveTransform)
+		});
+	});
+	onMount(() => {
+		if (componentDefinition$72 && typeof componentDefinition$72.fragmentNode === "function") {
+			parentRegister(instanceId, componentDefinition$72.fragmentNode, parentId, {
+				blendMode,
+				opacity,
+				visible: visible !== false ? true : false,
+				id,
+				mask: maskSource ? {
+					source: maskSource,
+					type: maskType || "alpha"
+				} : void 0,
+				renderOrder: renderOrder ?? detectedRenderOrder,
+				transform: $.get(effectiveTransform)
+			}, uniforms);
+			$.set(isRegistered, true);
+			if (renderOrder === void 0 && orderMarker) {
+				const parent = orderMarker.parentElement;
+				if (parent) {
+					const siblings = parent.querySelectorAll(":scope > [data-shader-id]");
+					const position = Array.from(siblings).indexOf(orderMarker);
+					if (position >= 0) {
+						detectedRenderOrder = position;
+						parentMetadataUpdate(instanceId, { renderOrder: position });
+					}
+				}
+			}
+		} else console.error("componentDefinition.fragmentNode is not a function:", {
+			componentDefinition: componentDefinition$72,
+			fragmentNode: componentDefinition$72?.fragmentNode,
+			type: typeof componentDefinition$72?.fragmentNode
+		});
+	});
+	onDestroy(() => {
+		$.set(isRegistered, false);
+		parentRegister(instanceId, null, null, null, null);
+	});
 	var span = root$1();
 	var node = $.child(span);
 	children?.(node);
@@ -9367,4 +9627,4 @@ function Shader($$anchor, $$props) {
 	$.append($$anchor, div);
 	$.pop();
 }
-export { AngularBlur, Ascii, Beam, Blob, Blur, BrightnessContrast, Bulge, CRTScreen, ChannelBlur, Checkerboard, ChromaFlow, ChromaticAberration, Circle, ConcentricSpin, ContourLines, CursorTrail, DiffuseBlur, Dither, DotGrid, Duotone, FilmGrain, FloatingParticles, FlowField, GlassTiles, Glitch, Glow, Godrays, Grayscale, Grid, GridDistortion, Group, Halftone, HueShift, ImageTexture, Invert, Kaleidoscope, LensFlare, LinearBlur, LinearGradient, Liquify, Mirror, Perspective, Pixelate, Plasma, PolarCoordinates, Posterize, ProgressiveBlur, RadialGradient, RectangularCoordinates, Ripples, Saturation, Shader, Sharpness, Shatter, SimplexNoise, SineWave, SolidColor, Spherize, Spiral, Strands, Stretch, Stripes, Swirl, TiltShift, Tint, Tritone, Twirl, Vibrance, VideoTexture, WaveDistortion, WebcamTexture, ZoomBlur, generatePresetCode };
+export { AngularBlur, Ascii, Aurora, Beam, Blob, Blur, BrightnessContrast, Bulge, CRTScreen, ChannelBlur, Checkerboard, ChromaFlow, ChromaticAberration, Circle, ConcentricSpin, ContourLines, CursorTrail, DiffuseBlur, Dither, DotGrid, Duotone, FilmGrain, FloatingParticles, FlowField, GlassTiles, Glitch, Glow, Godrays, Grayscale, Grid, GridDistortion, Group, Halftone, HueShift, ImageTexture, Invert, Kaleidoscope, LensFlare, LinearBlur, LinearGradient, Liquify, Mirror, Perspective, Pixelate, Plasma, PolarCoordinates, Posterize, ProgressiveBlur, RadialGradient, RectangularCoordinates, Ripples, Saturation, Shader, Sharpness, Shatter, SimplexNoise, SineWave, SolidColor, Spherize, Spiral, Strands, Stretch, Stripes, StudioBackground, Swirl, TiltShift, Tint, Tritone, Twirl, Vibrance, VideoTexture, WaveDistortion, WebcamTexture, ZoomBlur, generatePresetCode };