shaders 2.2.6 → 2.2.9

package/dist/registry.js

@@ -5187,6 +5187,164 @@ export const shaderRegistry = [
       }
     }
   },
+  {
+    "name": "Stretch",
+    "category": "Distortions",
+    "description": "Stretch content towards a direction from a center point",
+    "fileName": "Stretch",
+    "requiresChild": true,
+    "definition": {
+      "name": "Stretch",
+      "category": "Distortions",
+      "description": "Stretch content towards a direction from a center point",
+      "requiresRTT": true,
+      "requiresChild": true,
+      "props": {
+        "center": {
+          "default": {
+            "x": 0.5,
+            "y": 0.5
+          },
+          "description": "The center point of the stretch effect",
+          "ui": {
+            "type": "position",
+            "label": "Center"
+          }
+        },
+        "strength": {
+          "default": 1,
+          "description": "The intensity of the stretch effect",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Strength"
+          }
+        },
+        "angle": {
+          "default": 0,
+          "description": "The direction of the stretch in degrees",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 360,
+            "step": 1,
+            "label": "Angle"
+          }
+        },
+        "falloff": {
+          "default": 0,
+          "description": "Controls the sharpness of the transition (0 = sharp edge, 1 = gradual transition)",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Falloff"
+          }
+        },
+        "edges": {
+          "default": "stretch",
+          "description": "How to handle edges when distortion pushes content out of bounds",
+          "ui": {
+            "type": "select",
+            "options": [
+              {
+                "label": "Stretch",
+                "value": "stretch"
+              },
+              {
+                "label": "Transparent",
+                "value": "transparent"
+              },
+              {
+                "label": "Mirror",
+                "value": "mirror"
+              },
+              {
+                "label": "Wrap",
+                "value": "wrap"
+              }
+            ],
+            "label": "Edges"
+          }
+        }
+      }
+    },
+    "propsMetadata": {
+      "center": {
+        "ui": {
+          "type": "position",
+          "label": "Center"
+        },
+        "default": {
+          "x": 0.5,
+          "y": 0.5
+        },
+        "description": "The center point of the stretch effect"
+      },
+      "strength": {
+        "ui": {
+          "type": "range",
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Strength"
+        },
+        "default": 1,
+        "description": "The intensity of the stretch effect"
+      },
+      "angle": {
+        "ui": {
+          "type": "range",
+          "min": 0,
+          "max": 360,
+          "step": 1,
+          "label": "Angle"
+        },
+        "default": 0,
+        "description": "The direction of the stretch in degrees"
+      },
+      "falloff": {
+        "ui": {
+          "type": "range",
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Falloff"
+        },
+        "default": 0,
+        "description": "Controls the sharpness of the transition (0 = sharp edge, 1 = gradual transition)"
+      },
+      "edges": {
+        "ui": {
+          "type": "select",
+          "options": [
+            {
+              "label": "Stretch",
+              "value": "stretch"
+            },
+            {
+              "label": "Transparent",
+              "value": "transparent"
+            },
+            {
+              "label": "Mirror",
+              "value": "mirror"
+            },
+            {
+              "label": "Wrap",
+              "value": "wrap"
+            }
+          ],
+          "label": "Edges"
+        },
+        "default": "stretch",
+        "description": "How to handle edges when distortion pushes content out of bounds"
+      }
+    }
+  },
   {
     "name": "Swirl",
     "category": "Base Layers",

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

@@ -1,15 +1,17 @@
-import { type BlendMode } from 'shaders/core';
+import { type BlendMode, type TransformConfig } from 'shaders/core';
 import { type ComponentProps } from 'shaders/core/Stretch';
 /**
- * Define component props including blend mode, opacity, and masking
+ * 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 Stretch: import("svelte").Component<ExtendedComponentProps, {}, "">;

package/dist/svelte/generatePresetCode-CbulNGo3.js

@@ -0,0 +1,316 @@
+var p = {
+  AngularBlur: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Ascii: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Blob: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Blur: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Bulge: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  CRTScreen: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  ChannelBlur: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Checkerboard: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  ChromaFlow: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  ChromaticAberration: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Circle: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  CursorTrail: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  DiffuseBlur: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Dither: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  DotGrid: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Duotone: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  FilmGrain: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  FloatingParticles: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  GlassTiles: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Glow: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Godrays: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Grayscale: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Grid: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  GridDistortion: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Group: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Halftone: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  HueShift: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  ImageTexture: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Invert: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  LinearBlur: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  LinearGradient: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Liquify: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Pixelate: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  PolarCoordinates: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Posterize: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  ProgressiveBlur: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  RadialGradient: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  RectangularCoordinates: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Ripples: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Saturation: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  SimplexNoise: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  SineWave: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  SolidColor: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Spiral: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Strands: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Stretch: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Swirl: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  TiltShift: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Tritone: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Twirl: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  Vibrance: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  WaveDistortion: {
+    opacity: 1,
+    blendMode: "normal"
+  },
+  ZoomBlur: {
+    opacity: 1,
+    blendMode: "normal"
+  }
+};
+function c(l, t, e = "  ") {
+  return Object.entries(l).filter(([o, r]) => {
+    const n = p[t] || {};
+    if (n.hasOwnProperty(o)) {
+      const a = n[o];
+      return typeof r == "object" && typeof a == "object" ? JSON.stringify(r) !== JSON.stringify(a) : r !== a;
+    }
+    return !(o === "opacity" && r === 1 || o === "blendMode" && r === "normal");
+  }).map(([o, r]) => typeof r == "string" ? `${o}="${r}"` : typeof r == "object" ? `${o}={${JSON.stringify(r)}}` : `${o}={${r}}`).join(`
+` + e + "  ");
+}
+function s(l, t) {
+  const e = [];
+  function o(r) {
+    for (const n of r)
+      e.push(n), n.children && o(n.children);
+  }
+  return o(t), e.some((r) => r.props?.maskSource === l);
+}
+function m(l) {
+  const t = (e, o = "  ") => {
+    const r = e.props ? c(e.props, e.type, o) : "";
+    let n = "";
+    e.id && s(e.id, l.components) && (n = `id="${e.id}"`);
+    const a = [n, r].filter(Boolean).join(`
+` + o + "  ");
+    if (e.children && e.children.length > 0) {
+      const i = e.children.map((d) => t(d, o + "  ")).join(`
+`);
+      return a ? `${o}<${e.type}
+${o}  ${a}>
+${i}
+${o}</${e.type}>` : `${o}<${e.type}>
+${i}
+${o}</${e.type}>`;
+    } else return a ? `${o}<${e.type}
+${o}  ${a} />` : `${o}<${e.type} />`;
+  };
+  return `<Shader>
+${l.components.map((e) => t(e)).join(`
+`)}
+</Shader>`;
+}
+const y = [
+  "AngularBlur",
+  "Ascii",
+  "Blob",
+  "Blur",
+  "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",
+  "Pixelate",
+  "PolarCoordinates",
+  "Posterize",
+  "ProgressiveBlur",
+  "RadialGradient",
+  "RectangularCoordinates",
+  "Ripples",
+  "Saturation",
+  "SimplexNoise",
+  "SineWave",
+  "SolidColor",
+  "Spiral",
+  "Strands",
+  "Stretch",
+  "Swirl",
+  "TiltShift",
+  "Tritone",
+  "Twirl",
+  "Vibrance",
+  "WaveDistortion",
+  "ZoomBlur"
+];
+export {
+  m as n,
+  y as t
+};

package/dist/{react/utils/generatePresetCode.d.ts → svelte/generatePresetCode.template.d.ts}

@@ -8,6 +8,5 @@ interface PresetConfig {
     components: ComponentConfig[];
 }
 export declare function generatePresetCode(preset: PresetConfig): string;
-export declare const availableComponents: string[];
+export declare const availableComponents: any[];
 export {};
-//# sourceMappingURL=generatePresetCode.d.ts.map

package/dist/svelte/index.d.ts

@@ -43,6 +43,7 @@ export { default as SineWave } from './components/SineWave.svelte';
 export { default as SolidColor } from './components/SolidColor.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 Swirl } from './components/Swirl.svelte';
 export { default as TiltShift } from './components/TiltShift.svelte';
 export { default as Tritone } from './components/Tritone.svelte';