shaders 2.2.39 → 2.2.41

package/dist/solid/utils/generatePresetCode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"generatePresetCode.d.ts","sourceRoot":"","sources":["../../src/utils/generatePresetCode.ts"],"names":[],"mappings":"AAAA,UAAU,eAAe;IACvB,IAAI,EAAE,MAAM,CAAA;IACZ,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAC3B,QAAQ,CAAC,EAAE,eAAe,EAAE,CAAA;CAC7B;AAED,UAAU,YAAY;IACpB,UAAU,EAAE,eAAe,EAAE,CAAA;CAC9B;AAmrBD,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,YAAY,GAAG,MAAM,CAyC/D;AAGD,eAAO,MAAM,mBAAmB,UA4D/B,CAAA"}
+{"version":3,"file":"generatePresetCode.d.ts","sourceRoot":"","sources":["../../src/utils/generatePresetCode.ts"],"names":[],"mappings":"AAAA,UAAU,eAAe;IACvB,IAAI,EAAE,MAAM,CAAA;IACZ,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAC3B,QAAQ,CAAC,EAAE,eAAe,EAAE,CAAA;CAC7B;AAED,UAAU,YAAY;IACpB,UAAU,EAAE,eAAe,EAAE,CAAA;CAC9B;AAusBD,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,YAAY,GAAG,MAAM,CAyC/D;AAGD,eAAO,MAAM,mBAAmB,UA8D/B,CAAA"}

package/dist/solid/utils/generatePresetCode.js

@@ -514,6 +514,19 @@ const shaderMetadata = {
     "falloff": 0,
     "edges": "stretch"
   },
+  "Stripes": {
+    "opacity": 1,
+    "blendMode": "normal",
+    "colorA": "#000000",
+    "colorB": "#ffffff",
+    "angle": 45,
+    "density": 5,
+    "balance": 0.5,
+    "softness": 0,
+    "speed": 0.2,
+    "offset": 0,
+    "colorSpace": "linear"
+  },
   "Swirl": {
     "opacity": 1,
     "blendMode": "normal",
@@ -536,6 +549,13 @@ const shaderMetadata = {
       "y": 0.5
     }
   },
+  "Tint": {
+    "opacity": 1,
+    "blendMode": "normal",
+    "color": "#ff8800",
+    "amount": 0.5,
+    "preserveLuminosity": true
+  },
   "Tritone": {
     "opacity": 1,
     "blendMode": "normal",
@@ -745,8 +765,10 @@ const availableComponents = [
   "Spiral",
   "Strands",
   "Stretch",
+  "Stripes",
   "Swirl",
   "TiltShift",
+  "Tint",
   "Tritone",
   "Twirl",
   "Vibrance",

package/dist/svelte/components/Stripes.svelte.d.ts

@@ -0,0 +1,19 @@
+import { type BlendMode, type TransformConfig } from '../../core';
+import { type ComponentProps } from '../../core/shaders/Stripes';
+/**
+ * Define component props including blend mode, opacity, visibility, masking, and transformation
+ */
+interface ExtendedComponentProps extends Partial<ComponentProps> {
+    blendMode?: BlendMode;
+    opacity?: number;
+    visible?: boolean;
+    id?: string;
+    maskSource?: string;
+    maskType?: string;
+    renderOrder?: number;
+    transform?: Partial<TransformConfig>;
+    children?: import('svelte').Snippet;
+}
+declare const Stripes: import("svelte").Component<ExtendedComponentProps, {}, "">;
+type Stripes = ReturnType<typeof Stripes>;
+export default Stripes;

package/dist/svelte/components/Tint.svelte.d.ts

@@ -0,0 +1,19 @@
+import { type BlendMode, type TransformConfig } from '../../core';
+import { type ComponentProps } from '../../core/shaders/Tint';
+/**
+ * Define component props including blend mode, opacity, visibility, masking, and transformation
+ */
+interface ExtendedComponentProps extends Partial<ComponentProps> {
+    blendMode?: BlendMode;
+    opacity?: number;
+    visible?: boolean;
+    id?: string;
+    maskSource?: string;
+    maskType?: string;
+    renderOrder?: number;
+    transform?: Partial<TransformConfig>;
+    children?: import('svelte').Snippet;
+}
+declare const Tint: import("svelte").Component<ExtendedComponentProps, {}, "">;
+type Tint = ReturnType<typeof Tint>;
+export default Tint;

package/dist/svelte/{generatePresetCode-By5juLjK.js → generatePresetCode-x1dhDaQ3.js}

@@ -512,6 +512,19 @@ var shaderMetadata = {
 		"falloff": 0,
 		"edges": "stretch"
 	},
+	"Stripes": {
+		"opacity": 1,
+		"blendMode": "normal",
+		"colorA": "#000000",
+		"colorB": "#ffffff",
+		"angle": 45,
+		"density": 5,
+		"balance": .5,
+		"softness": 0,
+		"speed": .2,
+		"offset": 0,
+		"colorSpace": "linear"
+	},
 	"Swirl": {
 		"opacity": 1,
 		"blendMode": "normal",
@@ -534,6 +547,13 @@ var shaderMetadata = {
 			"y": .5
 		}
 	},
+	"Tint": {
+		"opacity": 1,
+		"blendMode": "normal",
+		"color": "#ff8800",
+		"amount": .5,
+		"preserveLuminosity": true
+	},
 	"Tritone": {
 		"opacity": 1,
 		"blendMode": "normal",
@@ -694,8 +714,10 @@ const availableComponents = [
 	"Spiral",
 	"Strands",
 	"Stretch",
+	"Stripes",
 	"Swirl",
 	"TiltShift",
+	"Tint",
 	"Tritone",
 	"Twirl",
 	"Vibrance",

package/dist/svelte/index.d.ts

@@ -49,8 +49,10 @@ export { default as Spherize } from './components/Spherize.svelte';
 export { default as Spiral } from './components/Spiral.svelte';
 export { default as Strands } from './components/Strands.svelte';
 export { default as Stretch } from './components/Stretch.svelte';
+export { default as Stripes } from './components/Stripes.svelte';
 export { default as Swirl } from './components/Swirl.svelte';
 export { default as TiltShift } from './components/TiltShift.svelte';
+export { default as Tint } from './components/Tint.svelte';
 export { default as Tritone } from './components/Tritone.svelte';
 export { default as Twirl } from './components/Twirl.svelte';
 export { default as Vibrance } from './components/Vibrance.svelte';

package/dist/svelte/index.js

@@ -1,4 +1,4 @@
-import { n as generatePresetCode } from "./generatePresetCode-By5juLjK.js";
+import { n as generatePresetCode } from "./generatePresetCode-x1dhDaQ3.js";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { getContext, onDestroy, onMount, setContext } from "svelte";
@@ -54,13 +54,15 @@ import { componentDefinition as componentDefinition$47 } from "../core/shaders/S
 import { componentDefinition as componentDefinition$48 } from "../core/shaders/Spiral/index.js";
 import { componentDefinition as componentDefinition$49 } from "../core/shaders/Strands/index.js";
 import { componentDefinition as componentDefinition$50 } from "../core/shaders/Stretch/index.js";
-import { componentDefinition as componentDefinition$51 } from "../core/shaders/Swirl/index.js";
-import { componentDefinition as componentDefinition$52 } from "../core/shaders/TiltShift/index.js";
-import { componentDefinition as componentDefinition$53 } from "../core/shaders/Tritone/index.js";
-import { componentDefinition as componentDefinition$54 } from "../core/shaders/Twirl/index.js";
-import { componentDefinition as componentDefinition$55 } from "../core/shaders/Vibrance/index.js";
-import { componentDefinition as componentDefinition$56 } from "../core/shaders/WaveDistortion/index.js";
-import { componentDefinition as componentDefinition$57 } from "../core/shaders/ZoomBlur/index.js";
+import { componentDefinition as componentDefinition$51 } from "../core/shaders/Stripes/index.js";
+import { componentDefinition as componentDefinition$52 } from "../core/shaders/Swirl/index.js";
+import { componentDefinition as componentDefinition$53 } from "../core/shaders/TiltShift/index.js";
+import { componentDefinition as componentDefinition$54 } from "../core/shaders/Tint/index.js";
+import { componentDefinition as componentDefinition$55 } from "../core/shaders/Tritone/index.js";
+import { componentDefinition as componentDefinition$56 } from "../core/shaders/Twirl/index.js";
+import { componentDefinition as componentDefinition$57 } from "../core/shaders/Vibrance/index.js";
+import { componentDefinition as componentDefinition$58 } from "../core/shaders/WaveDistortion/index.js";
+import { componentDefinition as componentDefinition$59 } from "../core/shaders/ZoomBlur/index.js";
 import { vec4 } from "three/tsl";
 import { TelemetryCollector, isExternalUser, shouldCollectTelemetry } from "../core/telemetry/index.js";
 function AngularBlur($$anchor, $$props) {
@@ -5673,7 +5675,7 @@ function Stretch($$anchor, $$props) {
 	children?.($$anchor);
 	$.pop();
 }
-function Swirl($$anchor, $$props) {
+function Stripes($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -5783,7 +5785,7 @@ function Swirl($$anchor, $$props) {
 	children?.($$anchor);
 	$.pop();
 }
-function TiltShift($$anchor, $$props) {
+function Swirl($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -5893,7 +5895,7 @@ function TiltShift($$anchor, $$props) {
 	children?.($$anchor);
 	$.pop();
 }
-function Tritone($$anchor, $$props) {
+function TiltShift($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6003,7 +6005,7 @@ function Tritone($$anchor, $$props) {
 	children?.($$anchor);
 	$.pop();
 }
-function Twirl($$anchor, $$props) {
+function Tint($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6113,7 +6115,7 @@ function Twirl($$anchor, $$props) {
 	children?.($$anchor);
 	$.pop();
 }
-function Vibrance($$anchor, $$props) {
+function Tritone($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6223,7 +6225,7 @@ function Vibrance($$anchor, $$props) {
 	children?.($$anchor);
 	$.pop();
 }
-function WaveDistortion($$anchor, $$props) {
+function Twirl($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6333,7 +6335,7 @@ function WaveDistortion($$anchor, $$props) {
 	children?.($$anchor);
 	$.pop();
 }
-function ZoomBlur($$anchor, $$props) {
+function Vibrance($$anchor, $$props) {
 	$.push($$props, true);
 	const DEFAULT_TRANSFORM = {
 		offsetX: 0,
@@ -6443,6 +6445,226 @@ function ZoomBlur($$anchor, $$props) {
 	children?.($$anchor);
 	$.pop();
 }
+function WaveDistortion($$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",
+		renderOrder: 0,
+		visible: true,
+		...Object.entries(componentDefinition$58.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 ?? componentDefaults.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 || `${componentDefinition$58.name.toLowerCase()}_${Math.random().toString(36).substring(7)}`;
+	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$58, $.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 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,
+			transform: $.get(effectiveTransform)
+		});
+	});
+	onMount(() => {
+		if (componentDefinition$58 && typeof componentDefinition$58.fragmentNode === "function") {
+			parentRegister(instanceId, componentDefinition$58.fragmentNode, parentId, {
+				blendMode,
+				opacity,
+				visible: visible !== false ? true : false,
+				id,
+				mask: maskSource ? {
+					source: maskSource,
+					type: maskType || "alpha"
+				} : void 0,
+				renderOrder,
+				transform: $.get(effectiveTransform)
+			}, uniforms);
+			$.set(isRegistered, true);
+		} else console.error("componentDefinition.fragmentNode is not a function:", {
+			componentDefinition: componentDefinition$58,
+			fragmentNode: componentDefinition$58?.fragmentNode,
+			type: typeof componentDefinition$58?.fragmentNode
+		});
+	});
+	onDestroy(() => {
+		$.set(isRegistered, false);
+		parentRegister(instanceId, null, null, null, null);
+	});
+	children?.($$anchor);
+	$.pop();
+}
+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",
+		renderOrder: 0,
+		visible: true,
+		...Object.entries(componentDefinition$59.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 ?? componentDefaults.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 || `${componentDefinition$59.name.toLowerCase()}_${Math.random().toString(36).substring(7)}`;
+	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$59, $.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 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,
+			transform: $.get(effectiveTransform)
+		});
+	});
+	onMount(() => {
+		if (componentDefinition$59 && typeof componentDefinition$59.fragmentNode === "function") {
+			parentRegister(instanceId, componentDefinition$59.fragmentNode, parentId, {
+				blendMode,
+				opacity,
+				visible: visible !== false ? true : false,
+				id,
+				mask: maskSource ? {
+					source: maskSource,
+					type: maskType || "alpha"
+				} : void 0,
+				renderOrder,
+				transform: $.get(effectiveTransform)
+			}, uniforms);
+			$.set(isRegistered, true);
+		} else console.error("componentDefinition.fragmentNode is not a function:", {
+			componentDefinition: componentDefinition$59,
+			fragmentNode: componentDefinition$59?.fragmentNode,
+			type: typeof componentDefinition$59?.fragmentNode
+		});
+	});
+	onDestroy(() => {
+		$.set(isRegistered, false);
+		parentRegister(instanceId, null, null, null, null);
+	});
+	children?.($$anchor);
+	$.pop();
+}
 var root = $.from_html(`<div><canvas data-renderer="shaders" style="width: 100%; height: 100%; display: block;"></canvas> <!></div>`);
 function Shader($$anchor, $$props) {
 	$.push($$props, true);
@@ -6545,4 +6767,4 @@ function Shader($$anchor, $$props) {
 	$.append($$anchor, div);
 	$.pop();
 }
-export { AngularBlur, Ascii, Beam, Blob, Blur, BrightnessContrast, Bulge, CRTScreen, ChannelBlur, Checkerboard, ChromaFlow, ChromaticAberration, Circle, CursorTrail, DiffuseBlur, Dither, DotGrid, Duotone, FilmGrain, FloatingParticles, GlassTiles, Glow, Godrays, Grayscale, Grid, GridDistortion, Group, Halftone, HueShift, ImageTexture, Invert, LinearBlur, LinearGradient, Liquify, Perspective, Pixelate, PolarCoordinates, Posterize, ProgressiveBlur, RadialGradient, RectangularCoordinates, Ripples, Saturation, Shader, Sharpness, SimplexNoise, SineWave, SolidColor, Spherize, Spiral, Strands, Stretch, Swirl, TiltShift, Tritone, Twirl, Vibrance, WaveDistortion, ZoomBlur, generatePresetCode };
+export { AngularBlur, Ascii, Beam, Blob, Blur, BrightnessContrast, Bulge, CRTScreen, ChannelBlur, Checkerboard, ChromaFlow, ChromaticAberration, Circle, CursorTrail, DiffuseBlur, Dither, DotGrid, Duotone, FilmGrain, FloatingParticles, GlassTiles, Glow, Godrays, Grayscale, Grid, GridDistortion, Group, Halftone, HueShift, ImageTexture, Invert, LinearBlur, LinearGradient, Liquify, Perspective, Pixelate, PolarCoordinates, Posterize, ProgressiveBlur, RadialGradient, RectangularCoordinates, Ripples, Saturation, Shader, Sharpness, SimplexNoise, SineWave, SolidColor, Spherize, Spiral, Strands, Stretch, Stripes, Swirl, TiltShift, Tint, Tritone, Twirl, Vibrance, WaveDistortion, ZoomBlur, generatePresetCode };

package/dist/svelte/utils/generatePresetCode.js

@@ -1,2 +1,2 @@
-import { n as generatePresetCode, t as availableComponents } from "../generatePresetCode-By5juLjK.js";
+import { n as generatePresetCode, t as availableComponents } from "../generatePresetCode-x1dhDaQ3.js";
 export { availableComponents, generatePresetCode };

package/dist/vue/components/Stripes.vue.d.ts

@@ -0,0 +1,57 @@
+import { BlendMode, TransformConfig } from '../../core';
+import { ComponentProps } from '../../core/shaders/Stripes';
+
+/**
+ * Define component props including blend mode, opacity, visibility, masking, and transformation
+ */
+interface ExtendedComponentProps extends Partial<ComponentProps> {
+    blendMode?: BlendMode;
+    opacity?: number;
+    visible?: boolean;
+    id?: string;
+    maskSource?: string;
+    maskType?: string;
+    renderOrder?: number;
+    transform?: Partial<TransformConfig>;
+}
+declare function __VLS_template(): {
+    default?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ExtendedComponentProps>, {
+    blendMode: string;
+    renderOrder: number;
+    visible: boolean;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ExtendedComponentProps>, {
+    blendMode: string;
+    renderOrder: number;
+    visible: boolean;
+}>>> & Readonly<{}>, {
+    blendMode: BlendMode;
+    visible: boolean;
+    renderOrder: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=Stripes.vue.d.ts.map

package/dist/vue/components/Stripes.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stripes.vue.d.ts","sourceRoot":"","sources":["../../src/components/Stripes.vue"],"names":[],"mappings":"AAGA,OAAO,EAGL,KAAK,SAAS,EAId,KAAK,eAAe,EACrB,MAAM,cAAc,CAAA;AAGrB,OAAO,EAAsB,KAAK,cAAc,EAAC,MAAM,sBAAsB,CAAA;AAI7E;;GAEG;AACH,UAAU,sBAAuB,SAAQ,OAAO,CAAC,cAAc,CAAC;IAC9D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CACtC;AAgOD,iBAAS,cAAc;qBA0BM,GAAG;EAG/B;AAQD,QAAA,MAAM,eAAe;;;;;;;;;eA7QP,SAAS;aAEX,OAAO;iBAIH,MAAM;4EA6QpB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAAvG,wBAAwG;AACxG,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAE1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QACxE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KACb,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACT,CAAC;AACN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC;AACxD,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAAE,QAAO;QAClD,MAAM,EAAE,CAAC,CAAC;KACT,CAAA;CAAE,CAAC"}

package/dist/vue/components/Tint.vue.d.ts

@@ -0,0 +1,57 @@
+import { BlendMode, TransformConfig } from '../../core';
+import { ComponentProps } from '../../core/shaders/Tint';
+
+/**
+ * Define component props including blend mode, opacity, visibility, masking, and transformation
+ */
+interface ExtendedComponentProps extends Partial<ComponentProps> {
+    blendMode?: BlendMode;
+    opacity?: number;
+    visible?: boolean;
+    id?: string;
+    maskSource?: string;
+    maskType?: string;
+    renderOrder?: number;
+    transform?: Partial<TransformConfig>;
+}
+declare function __VLS_template(): {
+    default?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ExtendedComponentProps>, {
+    blendMode: string;
+    renderOrder: number;
+    visible: boolean;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ExtendedComponentProps>, {
+    blendMode: string;
+    renderOrder: number;
+    visible: boolean;
+}>>> & Readonly<{}>, {
+    blendMode: BlendMode;
+    visible: boolean;
+    renderOrder: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=Tint.vue.d.ts.map

package/dist/vue/components/Tint.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tint.vue.d.ts","sourceRoot":"","sources":["../../src/components/Tint.vue"],"names":[],"mappings":"AAGA,OAAO,EAGL,KAAK,SAAS,EAId,KAAK,eAAe,EACrB,MAAM,cAAc,CAAA;AAGrB,OAAO,EAAsB,KAAK,cAAc,EAAC,MAAM,mBAAmB,CAAA;AAI1E;;GAEG;AACH,UAAU,sBAAuB,SAAQ,OAAO,CAAC,cAAc,CAAC;IAC9D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CACtC;AAgOD,iBAAS,cAAc;qBA0BM,GAAG;EAG/B;AAQD,QAAA,MAAM,eAAe;;;;;;;;;eA7QP,SAAS;aAEX,OAAO;iBAIH,MAAM;4EA6QpB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAAvG,wBAAwG;AACxG,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAE1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QACxE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KACb,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACT,CAAC;AACN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC;AACxD,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAAE,QAAO;QAClD,MAAM,EAAE,CAAC,CAAC;KACT,CAAA;CAAE,CAAC"}

package/dist/vue/{generatePresetCode-REXb9hnv.js → generatePresetCode-BaNcX5ua.js}

@@ -510,6 +510,19 @@ var shaderMetadata = {
 		"falloff": 0,
 		"edges": "stretch"
 	},
+	"Stripes": {
+		"opacity": 1,
+		"blendMode": "normal",
+		"colorA": "#000000",
+		"colorB": "#ffffff",
+		"angle": 45,
+		"density": 5,
+		"balance": .5,
+		"softness": 0,
+		"speed": .2,
+		"offset": 0,
+		"colorSpace": "linear"
+	},
 	"Swirl": {
 		"opacity": 1,
 		"blendMode": "normal",
@@ -532,6 +545,13 @@ var shaderMetadata = {
 			"y": .5
 		}
 	},
+	"Tint": {
+		"opacity": 1,
+		"blendMode": "normal",
+		"color": "#ff8800",
+		"amount": .5,
+		"preserveLuminosity": true
+	},
 	"Tritone": {
 		"opacity": 1,
 		"blendMode": "normal",
@@ -693,8 +713,10 @@ const availableComponents = [
 	"Spiral",
 	"Strands",
 	"Stretch",
+	"Stripes",
 	"Swirl",
 	"TiltShift",
+	"Tint",
 	"Tritone",
 	"Twirl",
 	"Vibrance",

package/dist/vue/index.d.ts

@@ -49,8 +49,10 @@ export { default as Spherize } from './components/Spherize.vue';
 export { default as Spiral } from './components/Spiral.vue';
 export { default as Strands } from './components/Strands.vue';
 export { default as Stretch } from './components/Stretch.vue';
+export { default as Stripes } from './components/Stripes.vue';
 export { default as Swirl } from './components/Swirl.vue';
 export { default as TiltShift } from './components/TiltShift.vue';
+export { default as Tint } from './components/Tint.vue';
 export { default as Tritone } from './components/Tritone.vue';
 export { default as Twirl } from './components/Twirl.vue';
 export { default as Vibrance } from './components/Vibrance.vue';