@paper-design/shaders-react 0.0.40 → 0.0.42

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 export { ShaderMount } from './shader-mount.js';
-export type { ShaderMountProps, ShaderComponentProps, ShaderMountRef } from './shader-mount.js';
+export type { ShaderMountProps, ShaderComponentProps } from './shader-mount.js';
 export { MeshGradient, meshGradientPresets } from './shaders/mesh-gradient.js';
 export type { MeshGradientProps } from './shaders/mesh-gradient.js';
 export type { MeshGradientUniforms, MeshGradientParams } from '@paper-design/shaders';
@@ -58,5 +58,5 @@ export { ColorPanels, colorPanelsPresets } from './shaders/color-panels.js';
 export type { ColorPanelsProps } from './shaders/color-panels.js';
 export type { ColorPanelsUniforms, ColorPanelsParams } from '@paper-design/shaders';
 export { isPaperShaderElement, getShaderColorFromString } from '@paper-design/shaders';
-export type { ShaderFit, ShaderSizingParams, ShaderSizingUniforms } from '@paper-design/shaders';
+export type { PaperShaderElement, ShaderFit, ShaderSizingParams, ShaderSizingUniforms } from '@paper-design/shaders';
 export { colorPanelsMeta, dotOrbitMeta, godRaysMeta, grainGradientMeta, meshGradientMeta, metaballsMeta, pulsingBorderMeta, simplexNoiseMeta, smokeRingMeta, swirlMeta, voronoiMeta, warpMeta, } from '@paper-design/shaders';

package/dist/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/index.ts"],
-  "sourcesContent": ["export { ShaderMount } from './shader-mount.js';\nexport type { ShaderMountProps, ShaderComponentProps, ShaderMountRef } from './shader-mount.js';\n\nexport { MeshGradient, meshGradientPresets } from './shaders/mesh-gradient.js';\nexport type { MeshGradientProps } from './shaders/mesh-gradient.js';\nexport type { MeshGradientUniforms, MeshGradientParams } from '@paper-design/shaders';\n\nexport { SmokeRing, smokeRingPresets } from './shaders/smoke-ring.js';\nexport type { SmokeRingProps } from './shaders/smoke-ring.js';\nexport type { SmokeRingUniforms, SmokeRingParams } from '@paper-design/shaders';\n\nexport { NeuroNoise, neuroNoisePresets } from './shaders/neuro-noise.js';\nexport type { NeuroNoiseProps } from './shaders/neuro-noise.js';\nexport type { NeuroNoiseUniforms, NeuroNoiseParams } from '@paper-design/shaders';\n\nexport { DotOrbit, dotOrbitPresets } from './shaders/dot-orbit.js';\nexport type { DotOrbitProps } from './shaders/dot-orbit.js';\nexport type { DotOrbitUniforms, DotOrbitParams } from '@paper-design/shaders';\n\nexport { DotGrid, dotGridPresets } from './shaders/dot-grid.js';\nexport type { DotGridProps } from './shaders/dot-grid.js';\nexport type { DotGridUniforms, DotGridParams } from '@paper-design/shaders';\n\nexport { SimplexNoise, simplexNoisePresets } from './shaders/simplex-noise.js';\nexport type { SimplexNoiseProps } from './shaders/simplex-noise.js';\nexport type { SimplexNoiseUniforms, SimplexNoiseParams } from '@paper-design/shaders';\n\nexport { Metaballs, metaballsPresets } from './shaders/metaballs.js';\nexport type { MetaballsProps } from './shaders/metaballs.js';\nexport type { MetaballsUniforms, MetaballsParams } from '@paper-design/shaders';\n\nexport { Waves, wavesPresets } from './shaders/waves.js';\nexport type { WavesProps } from './shaders/waves.js';\nexport type { WavesUniforms, WavesParams } from '@paper-design/shaders';\n\nexport { PerlinNoise, perlinNoisePresets } from './shaders/perlin-noise.js';\nexport type { PerlinNoiseProps } from './shaders/perlin-noise.js';\nexport type { PerlinNoiseUniforms, PerlinNoiseParams } from '@paper-design/shaders';\n\nexport { Voronoi, voronoiPresets } from './shaders/voronoi.js';\nexport type { VoronoiProps } from './shaders/voronoi.js';\nexport type { VoronoiUniforms, VoronoiParams } from '@paper-design/shaders';\n\nexport { Warp, warpPresets } from './shaders/warp.js';\nexport type { WarpProps } from './shaders/warp.js';\nexport type { WarpUniforms, WarpParams, WarpPattern } from '@paper-design/shaders';\n\nexport { GodRays, godRaysPresets } from './shaders/god-rays.js';\nexport type { GodRaysProps } from './shaders/god-rays.js';\nexport type { GodRaysUniforms, GodRaysParams } from '@paper-design/shaders';\n\nexport { Spiral, spiralPresets } from './shaders/spiral.js';\nexport type { SpiralProps } from './shaders/spiral.js';\nexport type { SpiralUniforms, SpiralParams } from '@paper-design/shaders';\n\nexport { Swirl, swirlPresets } from './shaders/swirl.js';\nexport type { SwirlProps } from './shaders/swirl.js';\nexport type { SwirlUniforms, SwirlParams } from '@paper-design/shaders';\n\nexport { Dithering, ditheringPresets } from './shaders/dithering.js';\nexport type { DitheringProps } from './shaders/dithering.js';\nexport type { DitheringUniforms, DitheringParams } from '@paper-design/shaders';\n\nexport { GrainGradient, grainGradientPresets } from './shaders/grain-gradient.js';\nexport type { GrainGradientProps } from './shaders/grain-gradient.js';\nexport type { GrainGradientUniforms, GrainGradientParams } from '@paper-design/shaders';\n\nexport { LiquidMetal, liquidMetalPresets } from './shaders/liquid-metal.js';\nexport type { LiquidMetalProps } from './shaders/liquid-metal.js';\nexport type { LiquidMetalUniforms, LiquidMetalParams } from '@paper-design/shaders';\n\nexport { PulsingBorder, pulsingBorderPresets } from './shaders/pulsing-border.js';\nexport type { PulsingBorderProps } from './shaders/pulsing-border.js';\nexport type { PulsingBorderUniforms, PulsingBorderParams } from '@paper-design/shaders';\n\nexport { ColorPanels, colorPanelsPresets } from './shaders/color-panels.js';\nexport type { ColorPanelsProps } from './shaders/color-panels.js';\nexport type { ColorPanelsUniforms, ColorPanelsParams } from '@paper-design/shaders';\n\nexport { isPaperShaderElement, getShaderColorFromString } from '@paper-design/shaders';\nexport type { ShaderFit, ShaderSizingParams, ShaderSizingUniforms } from '@paper-design/shaders';\n\nexport {\n  colorPanelsMeta,\n  dotOrbitMeta,\n  godRaysMeta,\n  grainGradientMeta,\n  meshGradientMeta,\n  metaballsMeta,\n  pulsingBorderMeta,\n  simplexNoiseMeta,\n  smokeRingMeta,\n  swirlMeta,\n  voronoiMeta,\n  warpMeta,\n} from '@paper-design/shaders';\n"],
+  "sourcesContent": ["export { ShaderMount } from './shader-mount.js';\nexport type { ShaderMountProps, ShaderComponentProps } from './shader-mount.js';\n\nexport { MeshGradient, meshGradientPresets } from './shaders/mesh-gradient.js';\nexport type { MeshGradientProps } from './shaders/mesh-gradient.js';\nexport type { MeshGradientUniforms, MeshGradientParams } from '@paper-design/shaders';\n\nexport { SmokeRing, smokeRingPresets } from './shaders/smoke-ring.js';\nexport type { SmokeRingProps } from './shaders/smoke-ring.js';\nexport type { SmokeRingUniforms, SmokeRingParams } from '@paper-design/shaders';\n\nexport { NeuroNoise, neuroNoisePresets } from './shaders/neuro-noise.js';\nexport type { NeuroNoiseProps } from './shaders/neuro-noise.js';\nexport type { NeuroNoiseUniforms, NeuroNoiseParams } from '@paper-design/shaders';\n\nexport { DotOrbit, dotOrbitPresets } from './shaders/dot-orbit.js';\nexport type { DotOrbitProps } from './shaders/dot-orbit.js';\nexport type { DotOrbitUniforms, DotOrbitParams } from '@paper-design/shaders';\n\nexport { DotGrid, dotGridPresets } from './shaders/dot-grid.js';\nexport type { DotGridProps } from './shaders/dot-grid.js';\nexport type { DotGridUniforms, DotGridParams } from '@paper-design/shaders';\n\nexport { SimplexNoise, simplexNoisePresets } from './shaders/simplex-noise.js';\nexport type { SimplexNoiseProps } from './shaders/simplex-noise.js';\nexport type { SimplexNoiseUniforms, SimplexNoiseParams } from '@paper-design/shaders';\n\nexport { Metaballs, metaballsPresets } from './shaders/metaballs.js';\nexport type { MetaballsProps } from './shaders/metaballs.js';\nexport type { MetaballsUniforms, MetaballsParams } from '@paper-design/shaders';\n\nexport { Waves, wavesPresets } from './shaders/waves.js';\nexport type { WavesProps } from './shaders/waves.js';\nexport type { WavesUniforms, WavesParams } from '@paper-design/shaders';\n\nexport { PerlinNoise, perlinNoisePresets } from './shaders/perlin-noise.js';\nexport type { PerlinNoiseProps } from './shaders/perlin-noise.js';\nexport type { PerlinNoiseUniforms, PerlinNoiseParams } from '@paper-design/shaders';\n\nexport { Voronoi, voronoiPresets } from './shaders/voronoi.js';\nexport type { VoronoiProps } from './shaders/voronoi.js';\nexport type { VoronoiUniforms, VoronoiParams } from '@paper-design/shaders';\n\nexport { Warp, warpPresets } from './shaders/warp.js';\nexport type { WarpProps } from './shaders/warp.js';\nexport type { WarpUniforms, WarpParams, WarpPattern } from '@paper-design/shaders';\n\nexport { GodRays, godRaysPresets } from './shaders/god-rays.js';\nexport type { GodRaysProps } from './shaders/god-rays.js';\nexport type { GodRaysUniforms, GodRaysParams } from '@paper-design/shaders';\n\nexport { Spiral, spiralPresets } from './shaders/spiral.js';\nexport type { SpiralProps } from './shaders/spiral.js';\nexport type { SpiralUniforms, SpiralParams } from '@paper-design/shaders';\n\nexport { Swirl, swirlPresets } from './shaders/swirl.js';\nexport type { SwirlProps } from './shaders/swirl.js';\nexport type { SwirlUniforms, SwirlParams } from '@paper-design/shaders';\n\nexport { Dithering, ditheringPresets } from './shaders/dithering.js';\nexport type { DitheringProps } from './shaders/dithering.js';\nexport type { DitheringUniforms, DitheringParams } from '@paper-design/shaders';\n\nexport { GrainGradient, grainGradientPresets } from './shaders/grain-gradient.js';\nexport type { GrainGradientProps } from './shaders/grain-gradient.js';\nexport type { GrainGradientUniforms, GrainGradientParams } from '@paper-design/shaders';\n\nexport { LiquidMetal, liquidMetalPresets } from './shaders/liquid-metal.js';\nexport type { LiquidMetalProps } from './shaders/liquid-metal.js';\nexport type { LiquidMetalUniforms, LiquidMetalParams } from '@paper-design/shaders';\n\nexport { PulsingBorder, pulsingBorderPresets } from './shaders/pulsing-border.js';\nexport type { PulsingBorderProps } from './shaders/pulsing-border.js';\nexport type { PulsingBorderUniforms, PulsingBorderParams } from '@paper-design/shaders';\n\nexport { ColorPanels, colorPanelsPresets } from './shaders/color-panels.js';\nexport type { ColorPanelsProps } from './shaders/color-panels.js';\nexport type { ColorPanelsUniforms, ColorPanelsParams } from '@paper-design/shaders';\n\nexport { isPaperShaderElement, getShaderColorFromString } from '@paper-design/shaders';\nexport type { PaperShaderElement, ShaderFit, ShaderSizingParams, ShaderSizingUniforms } from '@paper-design/shaders';\n\nexport {\n  colorPanelsMeta,\n  dotOrbitMeta,\n  godRaysMeta,\n  grainGradientMeta,\n  meshGradientMeta,\n  metaballsMeta,\n  pulsingBorderMeta,\n  simplexNoiseMeta,\n  smokeRingMeta,\n  swirlMeta,\n  voronoiMeta,\n  warpMeta,\n} from '@paper-design/shaders';\n"],
   "mappings": ";;;;;AAAA,SAAS,mBAAmB;AAG5B,SAAS,cAAc,2BAA2B;AAIlD,SAAS,WAAW,wBAAwB;AAI5C,SAAS,YAAY,yBAAyB;AAI9C,SAAS,UAAU,uBAAuB;AAI1C,SAAS,SAAS,sBAAsB;AAIxC,SAAS,cAAc,2BAA2B;AAIlD,SAAS,WAAW,wBAAwB;AAI5C,SAAS,OAAO,oBAAoB;AAIpC,SAAS,aAAa,0BAA0B;AAIhD,SAAS,SAAS,sBAAsB;AAIxC,SAAS,MAAM,mBAAmB;AAIlC,SAAS,SAAS,sBAAsB;AAIxC,SAAS,QAAQ,qBAAqB;AAItC,SAAS,OAAO,oBAAoB;AAIpC,SAAS,WAAW,wBAAwB;AAI5C,SAAS,eAAe,4BAA4B;AAIpD,SAAS,aAAa,0BAA0B;AAIhD,SAAS,eAAe,4BAA4B;AAIpD,SAAS,aAAa,0BAA0B;AAIhD,SAAS,sBAAsB,gCAAgC;AAG/D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;",
   "names": []
 }

package/dist/shader-mount.d.ts

@@ -1,19 +1,18 @@
-import { ShaderMount as ShaderMountVanilla, type ShaderMotionParams } from '@paper-design/shaders';
-export interface ShaderMountRef extends HTMLDivElement {
-    paperShaderMount?: ShaderMountVanilla;
-}
+import { type PaperShaderElement, type ShaderMotionParams } from '@paper-design/shaders';
 /** React Shader Mount can also accept strings as uniform values, which will assumed to be URLs and loaded as images */
 interface ShaderMountUniformsReact {
     [key: string]: string | boolean | number | number[] | number[][] | HTMLImageElement;
 }
-export interface ShaderMountProps extends Omit<React.ComponentProps<'div'>, 'color'>, ShaderMotionParams {
+export interface ShaderMountProps extends Omit<React.ComponentProps<'div'>, 'color' | 'ref'>, ShaderMotionParams {
+    ref?: React.Ref<PaperShaderElement>;
     fragmentShader: string;
     uniforms: ShaderMountUniformsReact;
     minPixelRatio?: number;
     maxPixelCount?: number;
     webGlContextAttributes?: WebGLContextAttributes;
 }
-export interface ShaderComponentProps extends Omit<React.ComponentProps<'div'>, 'color'> {
+export interface ShaderComponentProps extends Omit<React.ComponentProps<'div'>, 'color' | 'ref'> {
+    ref?: React.Ref<PaperShaderElement>;
     minPixelRatio?: number;
     maxPixelCount?: number;
     webGlContextAttributes?: WebGLContextAttributes;

package/dist/shader-mount.js

@@ -116,7 +116,8 @@ const ShaderMount = forwardRef(
     useEffect(() => {
       shaderMountRef.current?.setFrame(frame);
     }, [frame, isInitialized]);
-    return /* @__PURE__ */ jsx("div", { ref: useMergeRefs([divRef, forwardedRef]), ...divProps });
+    const mergedRef = useMergeRefs([divRef, forwardedRef]);
+    return /* @__PURE__ */ jsx("div", { ref: mergedRef, ...divProps });
   }
 );
 ShaderMount.displayName = "ShaderMount";

package/dist/shader-mount.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/shader-mount.tsx"],
-  "sourcesContent": ["'use client';\n\nimport { useEffect, useRef, forwardRef, useState } from 'react';\nimport {\n  ShaderMount as ShaderMountVanilla,\n  type ShaderMotionParams,\n  type ShaderMountUniforms,\n} from '@paper-design/shaders';\nimport { useMergeRefs } from './use-merge-refs.js';\n\nexport interface ShaderMountRef extends HTMLDivElement {\n  paperShaderMount?: ShaderMountVanilla;\n}\n\n/** React Shader Mount can also accept strings as uniform values, which will assumed to be URLs and loaded as images */\ninterface ShaderMountUniformsReact {\n  [key: string]: string | boolean | number | number[] | number[][] | HTMLImageElement;\n}\n\nexport interface ShaderMountProps extends Omit<React.ComponentProps<'div'>, 'color'>, ShaderMotionParams {\n  fragmentShader: string;\n  uniforms: ShaderMountUniformsReact;\n  minPixelRatio?: number;\n  maxPixelCount?: number;\n  webGlContextAttributes?: WebGLContextAttributes;\n}\n\nexport interface ShaderComponentProps extends Omit<React.ComponentProps<'div'>, 'color'> {\n  minPixelRatio?: number;\n  maxPixelCount?: number;\n  webGlContextAttributes?: WebGLContextAttributes;\n}\n\n/** Parse the provided uniforms, turning URL strings into loaded images */\nasync function processUniforms(uniformsProp: ShaderMountUniformsReact): Promise<ShaderMountUniforms> {\n  const processedUniforms = {} as ShaderMountUniforms;\n  const imageLoadPromises: Promise<void>[] = [];\n\n  const isValidUrl = (url: string): boolean => {\n    try {\n      // Handle absolute paths\n      if (url.startsWith('/')) return true;\n      // Check if it's a valid URL\n      new URL(url);\n      return true;\n    } catch {\n      return false;\n    }\n  };\n\n  const isExternalUrl = (url: string): boolean => {\n    try {\n      if (url.startsWith('/')) return false;\n      const urlObject = new URL(url, window.location.origin);\n      return urlObject.origin !== window.location.origin;\n    } catch {\n      return false;\n    }\n  };\n\n  Object.entries(uniformsProp).forEach(([key, value]) => {\n    if (typeof value === 'string') {\n      // Make sure the provided string is a valid URL or just skip trying to set this uniform entirely\n      if (!isValidUrl(value)) {\n        console.warn(`Uniform \"${key}\" has invalid URL \"${value}\". Skipping image loading.`);\n        return;\n      }\n\n      const imagePromise = new Promise<void>((resolve, reject) => {\n        const img = new Image();\n        if (isExternalUrl(value)) {\n          img.crossOrigin = 'anonymous';\n        }\n        img.onload = () => {\n          processedUniforms[key] = img;\n          resolve();\n        };\n        img.onerror = () => {\n          console.error(`Could not set uniforms. Failed to load image at ${value}`);\n          reject();\n        };\n        img.src = value;\n      });\n      imageLoadPromises.push(imagePromise);\n    } else {\n      processedUniforms[key] = value;\n    }\n  });\n\n  await Promise.all(imageLoadPromises);\n  return processedUniforms;\n}\n\n/**\n * A React component that mounts a shader and updates its uniforms as the component's props change\n * If you pass a string as a uniform value, it will be assumed to be a URL and attempted to be loaded as an image\n */\nexport const ShaderMount: React.FC<ShaderMountProps> = forwardRef<ShaderMountRef, ShaderMountProps>(\n  function ShaderMountImpl(\n    {\n      fragmentShader,\n      uniforms: uniformsProp,\n      webGlContextAttributes,\n      speed = 0,\n      frame = 0,\n      minPixelRatio,\n      maxPixelCount,\n      ...divProps\n    },\n    forwardedRef\n  ) {\n    const [isInitialized, setIsInitialized] = useState(false);\n    const divRef = useRef<HTMLDivElement>(null);\n    const shaderMountRef: React.RefObject<ShaderMountVanilla | null> = useRef<ShaderMountVanilla>(null);\n\n    // Initialize the ShaderMountVanilla\n    useEffect(() => {\n      const initShader = async () => {\n        const uniforms = await processUniforms(uniformsProp);\n\n        if (divRef.current && !shaderMountRef.current) {\n          shaderMountRef.current = new ShaderMountVanilla(\n            divRef.current,\n            fragmentShader,\n            uniforms,\n            webGlContextAttributes,\n            speed,\n            frame,\n            minPixelRatio,\n            maxPixelCount\n          );\n\n          setIsInitialized(true);\n        }\n      };\n\n      initShader();\n\n      return () => {\n        shaderMountRef.current?.dispose();\n        shaderMountRef.current = null;\n      };\n    }, [fragmentShader, webGlContextAttributes]);\n\n    // Uniforms\n    useEffect(() => {\n      const updateUniforms = async () => {\n        const uniforms = await processUniforms(uniformsProp);\n        shaderMountRef.current?.setUniforms(uniforms);\n      };\n\n      updateUniforms();\n    }, [uniformsProp, isInitialized]);\n\n    // Speed\n    useEffect(() => {\n      shaderMountRef.current?.setSpeed(speed);\n    }, [speed, isInitialized]);\n\n    // Max Pixel Count\n    useEffect(() => {\n      shaderMountRef.current?.setMaxPixelCount(maxPixelCount);\n    }, [maxPixelCount, isInitialized]);\n\n    // Min Pixel Ratio\n    useEffect(() => {\n      shaderMountRef.current?.setMinPixelRatio(minPixelRatio);\n    }, [minPixelRatio, isInitialized]);\n\n    // Frame\n    useEffect(() => {\n      shaderMountRef.current?.setFrame(frame);\n    }, [frame, isInitialized]);\n\n    return <div ref={useMergeRefs([divRef, forwardedRef])} {...divProps} />;\n  }\n);\n\nShaderMount.displayName = 'ShaderMount';\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client';\n\nimport { useEffect, useRef, forwardRef, useState } from 'react';\nimport {\n  ShaderMount as ShaderMountVanilla,\n  type PaperShaderElement,\n  type ShaderMotionParams,\n  type ShaderMountUniforms,\n} from '@paper-design/shaders';\nimport { useMergeRefs } from './use-merge-refs.js';\n\n/** React Shader Mount can also accept strings as uniform values, which will assumed to be URLs and loaded as images */\ninterface ShaderMountUniformsReact {\n  [key: string]: string | boolean | number | number[] | number[][] | HTMLImageElement;\n}\n\nexport interface ShaderMountProps extends Omit<React.ComponentProps<'div'>, 'color' | 'ref'>, ShaderMotionParams {\n  ref?: React.Ref<PaperShaderElement>;\n  fragmentShader: string;\n  uniforms: ShaderMountUniformsReact;\n  minPixelRatio?: number;\n  maxPixelCount?: number;\n  webGlContextAttributes?: WebGLContextAttributes;\n}\n\nexport interface ShaderComponentProps extends Omit<React.ComponentProps<'div'>, 'color' | 'ref'> {\n  ref?: React.Ref<PaperShaderElement>;\n  minPixelRatio?: number;\n  maxPixelCount?: number;\n  webGlContextAttributes?: WebGLContextAttributes;\n}\n\n/** Parse the provided uniforms, turning URL strings into loaded images */\nasync function processUniforms(uniformsProp: ShaderMountUniformsReact): Promise<ShaderMountUniforms> {\n  const processedUniforms = {} as ShaderMountUniforms;\n  const imageLoadPromises: Promise<void>[] = [];\n\n  const isValidUrl = (url: string): boolean => {\n    try {\n      // Handle absolute paths\n      if (url.startsWith('/')) return true;\n      // Check if it's a valid URL\n      new URL(url);\n      return true;\n    } catch {\n      return false;\n    }\n  };\n\n  const isExternalUrl = (url: string): boolean => {\n    try {\n      if (url.startsWith('/')) return false;\n      const urlObject = new URL(url, window.location.origin);\n      return urlObject.origin !== window.location.origin;\n    } catch {\n      return false;\n    }\n  };\n\n  Object.entries(uniformsProp).forEach(([key, value]) => {\n    if (typeof value === 'string') {\n      // Make sure the provided string is a valid URL or just skip trying to set this uniform entirely\n      if (!isValidUrl(value)) {\n        console.warn(`Uniform \"${key}\" has invalid URL \"${value}\". Skipping image loading.`);\n        return;\n      }\n\n      const imagePromise = new Promise<void>((resolve, reject) => {\n        const img = new Image();\n        if (isExternalUrl(value)) {\n          img.crossOrigin = 'anonymous';\n        }\n        img.onload = () => {\n          processedUniforms[key] = img;\n          resolve();\n        };\n        img.onerror = () => {\n          console.error(`Could not set uniforms. Failed to load image at ${value}`);\n          reject();\n        };\n        img.src = value;\n      });\n      imageLoadPromises.push(imagePromise);\n    } else {\n      processedUniforms[key] = value;\n    }\n  });\n\n  await Promise.all(imageLoadPromises);\n  return processedUniforms;\n}\n\n/**\n * A React component that mounts a shader and updates its uniforms as the component's props change\n * If you pass a string as a uniform value, it will be assumed to be a URL and attempted to be loaded as an image\n */\nexport const ShaderMount: React.FC<ShaderMountProps> = forwardRef<PaperShaderElement, ShaderMountProps>(\n  function ShaderMountImpl(\n    {\n      fragmentShader,\n      uniforms: uniformsProp,\n      webGlContextAttributes,\n      speed = 0,\n      frame = 0,\n      minPixelRatio,\n      maxPixelCount,\n      ...divProps\n    },\n    forwardedRef\n  ) {\n    const [isInitialized, setIsInitialized] = useState(false);\n    const divRef = useRef<PaperShaderElement>(null);\n    const shaderMountRef: React.RefObject<ShaderMountVanilla | null> = useRef<ShaderMountVanilla>(null);\n\n    // Initialize the ShaderMountVanilla\n    useEffect(() => {\n      const initShader = async () => {\n        const uniforms = await processUniforms(uniformsProp);\n\n        if (divRef.current && !shaderMountRef.current) {\n          shaderMountRef.current = new ShaderMountVanilla(\n            divRef.current,\n            fragmentShader,\n            uniforms,\n            webGlContextAttributes,\n            speed,\n            frame,\n            minPixelRatio,\n            maxPixelCount\n          );\n\n          setIsInitialized(true);\n        }\n      };\n\n      initShader();\n\n      return () => {\n        shaderMountRef.current?.dispose();\n        shaderMountRef.current = null;\n      };\n    }, [fragmentShader, webGlContextAttributes]);\n\n    // Uniforms\n    useEffect(() => {\n      const updateUniforms = async () => {\n        const uniforms = await processUniforms(uniformsProp);\n        shaderMountRef.current?.setUniforms(uniforms);\n      };\n\n      updateUniforms();\n    }, [uniformsProp, isInitialized]);\n\n    // Speed\n    useEffect(() => {\n      shaderMountRef.current?.setSpeed(speed);\n    }, [speed, isInitialized]);\n\n    // Max Pixel Count\n    useEffect(() => {\n      shaderMountRef.current?.setMaxPixelCount(maxPixelCount);\n    }, [maxPixelCount, isInitialized]);\n\n    // Min Pixel Ratio\n    useEffect(() => {\n      shaderMountRef.current?.setMinPixelRatio(minPixelRatio);\n    }, [minPixelRatio, isInitialized]);\n\n    // Frame\n    useEffect(() => {\n      shaderMountRef.current?.setFrame(frame);\n    }, [frame, isInitialized]);\n\n    const mergedRef = useMergeRefs([divRef, forwardedRef]) as unknown as React.RefObject<HTMLDivElement>;\n    return <div ref={mergedRef} {...divProps} />;\n  }\n);\n\nShaderMount.displayName = 'ShaderMount';\n"],
+  "mappings": ";;;;;;AAEA,SAAS,WAAW,QAAQ,YAAY,gBAAgB;AACxD;AAAA,EACE,eAAe;AAAA,OAIV;AACP,SAAS,oBAAoB;AAqKlB;AA7IX,eAAe,gBAAgB,cAAsE;AACnG,QAAM,oBAAoB,CAAC;AAC3B,QAAM,oBAAqC,CAAC;AAE5C,QAAM,aAAa,CAAC,QAAyB;AAC3C,QAAI;AAEF,UAAI,IAAI,WAAW,GAAG,EAAG,QAAO;AAEhC,UAAI,IAAI,GAAG;AACX,aAAO;AAAA,IACT,QAAQ;AACN,aAAO;AAAA,IACT;AAAA,EACF;AAEA,QAAM,gBAAgB,CAAC,QAAyB;AAC9C,QAAI;AACF,UAAI,IAAI,WAAW,GAAG,EAAG,QAAO;AAChC,YAAM,YAAY,IAAI,IAAI,KAAK,OAAO,SAAS,MAAM;AACrD,aAAO,UAAU,WAAW,OAAO,SAAS;AAAA,IAC9C,QAAQ;AACN,aAAO;AAAA,IACT;AAAA,EACF;AAEA,SAAO,QAAQ,YAAY,EAAE,QAAQ,CAAC,CAAC,KAAK,KAAK,MAAM;AACrD,QAAI,OAAO,UAAU,UAAU;AAE7B,UAAI,CAAC,WAAW,KAAK,GAAG;AACtB,gBAAQ,KAAK,YAAY,GAAG,sBAAsB,KAAK,4BAA4B;AACnF;AAAA,MACF;AAEA,YAAM,eAAe,IAAI,QAAc,CAAC,SAAS,WAAW;AAC1D,cAAM,MAAM,IAAI,MAAM;AACtB,YAAI,cAAc,KAAK,GAAG;AACxB,cAAI,cAAc;AAAA,QACpB;AACA,YAAI,SAAS,MAAM;AACjB,4BAAkB,GAAG,IAAI;AACzB,kBAAQ;AAAA,QACV;AACA,YAAI,UAAU,MAAM;AAClB,kBAAQ,MAAM,mDAAmD,KAAK,EAAE;AACxE,iBAAO;AAAA,QACT;AACA,YAAI,MAAM;AAAA,MACZ,CAAC;AACD,wBAAkB,KAAK,YAAY;AAAA,IACrC,OAAO;AACL,wBAAkB,GAAG,IAAI;AAAA,IAC3B;AAAA,EACF,CAAC;AAED,QAAM,QAAQ,IAAI,iBAAiB;AACnC,SAAO;AACT;AAMO,MAAM,cAA0C;AAAA,EACrD,SAAS,gBACP;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,cACA;AACA,UAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,KAAK;AACxD,UAAM,SAAS,OAA2B,IAAI;AAC9C,UAAM,iBAA6D,OAA2B,IAAI;AAGlG,cAAU,MAAM;AACd,YAAM,aAAa,YAAY;AAC7B,cAAM,WAAW,MAAM,gBAAgB,YAAY;AAEnD,YAAI,OAAO,WAAW,CAAC,eAAe,SAAS;AAC7C,yBAAe,UAAU,IAAI;AAAA,YAC3B,OAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAEA,2BAAiB,IAAI;AAAA,QACvB;AAAA,MACF;AAEA,iBAAW;AAEX,aAAO,MAAM;AACX,uBAAe,SAAS,QAAQ;AAChC,uBAAe,UAAU;AAAA,MAC3B;AAAA,IACF,GAAG,CAAC,gBAAgB,sBAAsB,CAAC;AAG3C,cAAU,MAAM;AACd,YAAM,iBAAiB,YAAY;AACjC,cAAM,WAAW,MAAM,gBAAgB,YAAY;AACnD,uBAAe,SAAS,YAAY,QAAQ;AAAA,MAC9C;AAEA,qBAAe;AAAA,IACjB,GAAG,CAAC,cAAc,aAAa,CAAC;AAGhC,cAAU,MAAM;AACd,qBAAe,SAAS,SAAS,KAAK;AAAA,IACxC,GAAG,CAAC,OAAO,aAAa,CAAC;AAGzB,cAAU,MAAM;AACd,qBAAe,SAAS,iBAAiB,aAAa;AAAA,IACxD,GAAG,CAAC,eAAe,aAAa,CAAC;AAGjC,cAAU,MAAM;AACd,qBAAe,SAAS,iBAAiB,aAAa;AAAA,IACxD,GAAG,CAAC,eAAe,aAAa,CAAC;AAGjC,cAAU,MAAM;AACd,qBAAe,SAAS,SAAS,KAAK;AAAA,IACxC,GAAG,CAAC,OAAO,aAAa,CAAC;AAEzB,UAAM,YAAY,aAAa,CAAC,QAAQ,YAAY,CAAC;AACrD,WAAO,oBAAC,SAAI,KAAK,WAAY,GAAG,UAAU;AAAA,EAC5C;AACF;AAEA,YAAY,cAAc;",
   "names": []
 }

package/dist/shaders/dithering.js

@@ -87,7 +87,7 @@ const swirlPreset = {
     speed: 1,
     frame: 0,
     colorBack: "#000000",
-    colorFront: "#263740",
+    colorFront: "#89a7b8",
     shape: "swirl",
     type: "8x8",
     pxSize: 2
@@ -100,7 +100,7 @@ const spherePreset = {
     speed: 1,
     frame: 0,
     colorBack: "#301c2a",
-    colorFront: "#366341",
+    colorFront: "#56ae6c",
     shape: "sphere",
     type: "4x4",
     pxSize: 2.5

package/dist/shaders/dithering.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/dithering.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport {\n  getShaderColorFromString,\n  ditheringFragmentShader,\n  ShaderFitOptions,\n  type DitheringUniforms,\n  type DitheringParams,\n  type ShaderPreset,\n  defaultPatternSizing,\n  defaultObjectSizing,\n  DitheringTypes,\n} from '@paper-design/shaders';\nimport { DitheringShapes } from '@paper-design/shaders';\n\nexport interface DitheringProps extends ShaderComponentProps, DitheringParams {}\n\ntype DitheringPreset = ShaderPreset<DitheringParams>;\n\nexport const defaultPreset: DitheringPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#252531',\n    colorFront: '#b59f82',\n    shape: 'simplex',\n    type: '4x4',\n    pxSize: 2,\n  },\n};\n\nexport const warpPreset: DitheringPreset = {\n  name: 'Warp',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#2f6e83',\n    colorFront: '#dceae8',\n    shape: 'warp',\n    type: '4x4',\n    pxSize: 2,\n  },\n} as const;\n\nexport const sinePreset: DitheringPreset = {\n  name: 'Sine Wave',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#730d54',\n    colorFront: '#00becc',\n    shape: 'wave',\n    type: '4x4',\n    pxSize: 11,\n  },\n} as const;\n\nexport const bugsPreset: DitheringPreset = {\n  name: 'Bugs',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000000',\n    colorFront: '#008000',\n    shape: 'dots',\n    type: 'random',\n    pxSize: 9,\n  },\n} as const;\n\nexport const ripplePreset: DitheringPreset = {\n  name: 'Ripple',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#603520',\n    colorFront: '#c67953',\n    shape: 'ripple',\n    type: '2x2',\n    pxSize: 3,\n  },\n} as const;\n\nexport const swirlPreset: DitheringPreset = {\n  name: 'Swirl',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000000',\n    colorFront: '#263740',\n    shape: 'swirl',\n    type: '8x8',\n    pxSize: 2,\n  },\n} as const;\n\nexport const spherePreset: DitheringPreset = {\n  name: 'Sphere',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#301c2a',\n    colorFront: '#366341',\n    shape: 'sphere',\n    type: '4x4',\n    pxSize: 2.5,\n  },\n} as const;\n\nexport const ditheringPresets: DitheringPreset[] = [\n  defaultPreset,\n  spherePreset,\n  sinePreset,\n  warpPreset,\n  ripplePreset,\n  bugsPreset,\n  swirlPreset,\n];\n\nexport const Dithering: React.FC<DitheringProps> = memo(function DitheringImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colorFront = defaultPreset.params.colorFront,\n  shape = defaultPreset.params.shape,\n  type = defaultPreset.params.type,\n  pxSize = defaultPreset.params.pxSize,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colorFront: getShaderColorFromString(colorFront),\n    u_shape: DitheringShapes[shape],\n    u_type: DitheringTypes[type],\n    u_pxSize: pxSize,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies DitheringUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={ditheringFragmentShader} uniforms={uniforms} />\n  );\n});\n"],
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport {\n  getShaderColorFromString,\n  ditheringFragmentShader,\n  ShaderFitOptions,\n  type DitheringUniforms,\n  type DitheringParams,\n  type ShaderPreset,\n  defaultPatternSizing,\n  defaultObjectSizing,\n  DitheringTypes,\n} from '@paper-design/shaders';\nimport { DitheringShapes } from '@paper-design/shaders';\n\nexport interface DitheringProps extends ShaderComponentProps, DitheringParams {}\n\ntype DitheringPreset = ShaderPreset<DitheringParams>;\n\nexport const defaultPreset: DitheringPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#252531',\n    colorFront: '#b59f82',\n    shape: 'simplex',\n    type: '4x4',\n    pxSize: 2,\n  },\n};\n\nexport const warpPreset: DitheringPreset = {\n  name: 'Warp',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#2f6e83',\n    colorFront: '#dceae8',\n    shape: 'warp',\n    type: '4x4',\n    pxSize: 2,\n  },\n} as const;\n\nexport const sinePreset: DitheringPreset = {\n  name: 'Sine Wave',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#730d54',\n    colorFront: '#00becc',\n    shape: 'wave',\n    type: '4x4',\n    pxSize: 11,\n  },\n} as const;\n\nexport const bugsPreset: DitheringPreset = {\n  name: 'Bugs',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000000',\n    colorFront: '#008000',\n    shape: 'dots',\n    type: 'random',\n    pxSize: 9,\n  },\n} as const;\n\nexport const ripplePreset: DitheringPreset = {\n  name: 'Ripple',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#603520',\n    colorFront: '#c67953',\n    shape: 'ripple',\n    type: '2x2',\n    pxSize: 3,\n  },\n} as const;\n\nexport const swirlPreset: DitheringPreset = {\n  name: 'Swirl',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000000',\n    colorFront: '#89a7b8',\n    shape: 'swirl',\n    type: '8x8',\n    pxSize: 2,\n  },\n} as const;\n\nexport const spherePreset: DitheringPreset = {\n  name: 'Sphere',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#301c2a',\n    colorFront: '#56ae6c',\n    shape: 'sphere',\n    type: '4x4',\n    pxSize: 2.5,\n  },\n} as const;\n\nexport const ditheringPresets: DitheringPreset[] = [\n  defaultPreset,\n  spherePreset,\n  sinePreset,\n  warpPreset,\n  ripplePreset,\n  bugsPreset,\n  swirlPreset,\n];\n\nexport const Dithering: React.FC<DitheringProps> = memo(function DitheringImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colorFront = defaultPreset.params.colorFront,\n  shape = defaultPreset.params.shape,\n  type = defaultPreset.params.type,\n  pxSize = defaultPreset.params.pxSize,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colorFront: getShaderColorFromString(colorFront),\n    u_shape: DitheringShapes[shape],\n    u_type: DitheringTypes[type],\n    u_pxSize: pxSize,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies DitheringUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={ditheringFragmentShader} uniforms={uniforms} />\n  );\n});\n"],
   "mappings": "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",
   "names": []
 }

package/dist/shaders/dot-orbit.js

@@ -19,8 +19,8 @@ const defaultPreset = {
     ...defaultPatternSizing,
     speed: 2,
     frame: 0,
-    colorBack: "#03001f",
-    colors: ["#661400", "#ccbb00", "#cc0088"],
+    colorBack: "#000000",
+    colors: ["#D2822D", "#0C3D80", "#B41A57", "#37A166"],
     size: 0.9,
     sizeRange: 0,
     spreading: 1,

package/dist/shaders/dot-orbit.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/dot-orbit.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  getShaderColorFromString,\n  dotOrbitFragmentShader,\n  ShaderFitOptions,\n  type DotOrbitParams,\n  type DotOrbitUniforms,\n  type ShaderPreset,\n  defaultPatternSizing,\n} from '@paper-design/shaders';\n\nexport interface DotOrbitProps extends ShaderComponentProps, DotOrbitParams {}\n\ntype DotOrbitPreset = ShaderPreset<DotOrbitParams>;\n\nexport const defaultPreset: DotOrbitPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 2,\n    frame: 0,\n    colorBack: '#03001f',\n    colors: ['#661400', '#ccbb00', '#cc0088'],\n    size: 0.9,\n    sizeRange: 0,\n    spreading: 1,\n    stepsPerColor: 2,\n  },\n};\n\nexport const dotOrbitPresets: DotOrbitPreset[] = [defaultPreset];\n\nexport const DotOrbit: React.FC<DotOrbitProps> = memo(function DotOrbitImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  size = defaultPreset.params.size,\n  sizeRange = defaultPreset.params.sizeRange,\n  spreading = defaultPreset.params.spreading,\n  stepsPerColor = defaultPreset.params.stepsPerColor,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: DotOrbitProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_size: size,\n    u_sizeRange: sizeRange,\n    u_spreading: spreading,\n    u_stepsPerColor: stepsPerColor,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies DotOrbitUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={dotOrbitFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
-  "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EAIA;AAAA,OACK;AAqEH;AA/DG,MAAM,gBAAgC;AAAA,EAC3C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,WAAW;AAAA,IACX,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,IACxC,MAAM;AAAA,IACN,WAAW;AAAA,IACX,WAAW;AAAA,IACX,eAAe;AAAA,EACjB;AACF;AAEO,MAAM,kBAAoC,CAAC,aAAa;AAExD,MAAM,WAAoC,KAAK,SAAS,aAAa;AAAA;AAAA,EAE1E,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,YAAY,cAAc,OAAO;AAAA,EACjC,SAAS,cAAc,OAAO;AAAA,EAC9B,OAAO,cAAc,OAAO;AAAA,EAC5B,YAAY,cAAc,OAAO;AAAA,EACjC,YAAY,cAAc,OAAO;AAAA,EACjC,gBAAgB,cAAc,OAAO;AAAA;AAAA,EAGrC,MAAM,cAAc,OAAO;AAAA,EAC3B,QAAQ,cAAc,OAAO;AAAA,EAC7B,WAAW,cAAc,OAAO;AAAA,EAChC,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAkB;AAChB,QAAM,WAAW;AAAA;AAAA,IAEf,aAAa,yBAAyB,SAAS;AAAA,IAC/C,UAAU,OAAO,IAAI,wBAAwB;AAAA,IAC7C,eAAe,OAAO;AAAA,IACtB,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,aAAa;AAAA,IACb,iBAAiB;AAAA;AAAA,IAGjB,OAAO,iBAAiB,GAAG;AAAA,IAC3B,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE,oBAAC,eAAa,GAAG,OAAO,OAAc,OAAc,gBAAgB,wBAAwB,UAAoB;AAEpH,GAAG,kBAAkB;",
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  getShaderColorFromString,\n  dotOrbitFragmentShader,\n  ShaderFitOptions,\n  type DotOrbitParams,\n  type DotOrbitUniforms,\n  type ShaderPreset,\n  defaultPatternSizing,\n} from '@paper-design/shaders';\n\nexport interface DotOrbitProps extends ShaderComponentProps, DotOrbitParams {}\n\ntype DotOrbitPreset = ShaderPreset<DotOrbitParams>;\n\nexport const defaultPreset: DotOrbitPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 2,\n    frame: 0,\n    colorBack: '#000000',\n    colors: ['#D2822D', '#0C3D80', '#B41A57', '#37A166'],\n    size: 0.9,\n    sizeRange: 0,\n    spreading: 1,\n    stepsPerColor: 2,\n  },\n};\n\nexport const dotOrbitPresets: DotOrbitPreset[] = [defaultPreset];\n\nexport const DotOrbit: React.FC<DotOrbitProps> = memo(function DotOrbitImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  size = defaultPreset.params.size,\n  sizeRange = defaultPreset.params.sizeRange,\n  spreading = defaultPreset.params.spreading,\n  stepsPerColor = defaultPreset.params.stepsPerColor,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: DotOrbitProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_size: size,\n    u_sizeRange: sizeRange,\n    u_spreading: spreading,\n    u_stepsPerColor: stepsPerColor,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies DotOrbitUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={dotOrbitFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
+  "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EAIA;AAAA,OACK;AAqEH;AA/DG,MAAM,gBAAgC;AAAA,EAC3C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,WAAW;AAAA,IACX,QAAQ,CAAC,WAAW,WAAW,WAAW,SAAS;AAAA,IACnD,MAAM;AAAA,IACN,WAAW;AAAA,IACX,WAAW;AAAA,IACX,eAAe;AAAA,EACjB;AACF;AAEO,MAAM,kBAAoC,CAAC,aAAa;AAExD,MAAM,WAAoC,KAAK,SAAS,aAAa;AAAA;AAAA,EAE1E,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,YAAY,cAAc,OAAO;AAAA,EACjC,SAAS,cAAc,OAAO;AAAA,EAC9B,OAAO,cAAc,OAAO;AAAA,EAC5B,YAAY,cAAc,OAAO;AAAA,EACjC,YAAY,cAAc,OAAO;AAAA,EACjC,gBAAgB,cAAc,OAAO;AAAA;AAAA,EAGrC,MAAM,cAAc,OAAO;AAAA,EAC3B,QAAQ,cAAc,OAAO;AAAA,EAC7B,WAAW,cAAc,OAAO;AAAA,EAChC,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAkB;AAChB,QAAM,WAAW;AAAA;AAAA,IAEf,aAAa,yBAAyB,SAAS;AAAA,IAC/C,UAAU,OAAO,IAAI,wBAAwB;AAAA,IAC7C,eAAe,OAAO;AAAA,IACtB,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,aAAa;AAAA,IACb,iBAAiB;AAAA;AAAA,IAGjB,OAAO,iBAAiB,GAAG;AAAA,IAC3B,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE,oBAAC,eAAa,GAAG,OAAO,OAAc,OAAc,gBAAgB,wBAAwB,UAAoB;AAEpH,GAAG,kBAAkB;",
   "names": []
 }

package/dist/shaders/god-rays.js

@@ -22,10 +22,10 @@ const defaultPreset = {
     colorBack: "#002238",
     colorBloom: "#555522",
     colors: ["#ffcd66", "#ffb899", "#a8fffb"],
-    density: 6,
+    density: 0.55,
     spotty: 0.28,
     midIntensity: 1,
-    midSize: 3,
+    midSize: 0.4,
     intensity: 0.3,
     bloom: 0,
     speed: 1,
@@ -40,10 +40,10 @@ const auroraPreset = {
     colorBack: "#404040",
     colorBloom: "#ff8888",
     colors: ["#666eff", "#66ff99", "#66d9ff"],
-    density: 2.4,
+    density: 0.5,
     spotty: 0.9,
     midIntensity: 0.8,
-    midSize: 2.1,
+    midSize: 0.2,
     intensity: 0.5,
     bloom: 1,
     speed: 0.5,
@@ -57,7 +57,7 @@ const warpPreset = {
     colorBack: "#000000",
     colorBloom: "#222288",
     colors: ["#ff00c4", "#ff8c00", "#ffffff"],
-    density: 1.2,
+    density: 0.45,
     spotty: 0.15,
     midIntensity: 0,
     midSize: 0,
@@ -76,9 +76,9 @@ const linearPreset = {
     colorBack: "#000000",
     colorBloom: "#eeeeee",
     colors: ["#ffffff1f", "#ffffff3d", "#ffffff29"],
-    density: 1.2,
+    density: 0.41,
     spotty: 0.25,
-    midSize: 1.1,
+    midSize: 0.1,
     midIntensity: 0.75,
     intensity: 0.79,
     bloom: 1,
@@ -96,7 +96,7 @@ const etherPreset = {
     colors: ["#148effa6", "#c4dffebe", "#232a47"],
     density: 0.3,
     spotty: 0.77,
-    midSize: 1.1,
+    midSize: 0.1,
     midIntensity: 0.5,
     intensity: 0.6,
     bloom: 0.6,

package/dist/shaders/god-rays.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/god-rays.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  godRaysFragmentShader,\n  ShaderFitOptions,\n  type GodRaysParams,\n  type GodRaysUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface GodRaysProps extends ShaderComponentProps, GodRaysParams {}\n\ntype GodRaysPreset = ShaderPreset<GodRaysParams>;\n\nexport const defaultPreset: GodRaysPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    offsetX: -0.4,\n    offsetY: -0.4,\n    colorBack: '#002238',\n    colorBloom: '#555522',\n    colors: ['#ffcd66', '#ffb899', '#a8fffb'],\n    density: 6,\n    spotty: 0.28,\n    midIntensity: 1,\n    midSize: 3,\n    intensity: 0.3,\n    bloom: 0,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const auroraPreset: GodRaysPreset = {\n  name: 'Aurora',\n  params: {\n    ...defaultObjectSizing,\n    offsetY: 1,\n    colorBack: '#404040',\n    colorBloom: '#ff8888',\n    colors: ['#666eff', '#66ff99', '#66d9ff'],\n    density: 2.4,\n    spotty: 0.9,\n    midIntensity: 0.8,\n    midSize: 2.1,\n    intensity: 0.5,\n    bloom: 1,\n    speed: 0.5,\n    frame: 0,\n  },\n};\n\nexport const warpPreset: GodRaysPreset = {\n  name: 'Warp',\n  params: {\n    ...defaultObjectSizing,\n    colorBack: '#000000',\n    colorBloom: '#222288',\n    colors: ['#ff00c4', '#ff8c00', '#ffffff'],\n    density: 1.2,\n    spotty: 0.15,\n    midIntensity: 0,\n    midSize: 0,\n    intensity: 0.79,\n    bloom: 0.4,\n    speed: 2,\n    frame: 0,\n  },\n};\n\nexport const linearPreset: GodRaysPreset = {\n  name: 'Linear',\n  params: {\n    ...defaultObjectSizing,\n    offsetX: 0.2,\n    offsetY: -0.7,\n    colorBack: '#000000',\n    colorBloom: '#eeeeee',\n    colors: ['#ffffff1f', '#ffffff3d', '#ffffff29'],\n    density: 1.2,\n    spotty: 0.25,\n    midSize: 1.1,\n    midIntensity: 0.75,\n    intensity: 0.79,\n    bloom: 1,\n    speed: 0.5,\n    frame: 0,\n  },\n};\n\nexport const etherPreset: GodRaysPreset = {\n  name: 'Ether',\n  params: {\n    ...defaultObjectSizing,\n    offsetX: -0.6,\n    colorBack: '#090f1d',\n    colorBloom: '#ffffff',\n    colors: ['#148effa6', '#c4dffebe', '#232a47'],\n    density: 0.3,\n    spotty: 0.77,\n    midSize: 1.1,\n    midIntensity: 0.5,\n    intensity: 0.6,\n    bloom: 0.6,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const godRaysPresets: GodRaysPreset[] = [defaultPreset, auroraPreset, warpPreset, linearPreset, etherPreset];\n\nexport const GodRays: React.FC<GodRaysProps> = memo(function GodRaysImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBloom = defaultPreset.params.colorBloom,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  density = defaultPreset.params.density,\n  spotty = defaultPreset.params.spotty,\n  midIntensity = defaultPreset.params.midIntensity,\n  midSize = defaultPreset.params.midSize,\n  intensity = defaultPreset.params.intensity,\n  bloom = defaultPreset.params.bloom,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: GodRaysProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBloom: getShaderColorFromString(colorBloom),\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_density: density,\n    u_spotty: spotty,\n    u_midIntensity: midIntensity,\n    u_midSize: midSize,\n    u_intensity: intensity,\n    u_bloom: bloom,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies GodRaysUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={godRaysFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  godRaysFragmentShader,\n  ShaderFitOptions,\n  type GodRaysParams,\n  type GodRaysUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface GodRaysProps extends ShaderComponentProps, GodRaysParams {}\n\ntype GodRaysPreset = ShaderPreset<GodRaysParams>;\n\nexport const defaultPreset: GodRaysPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    offsetX: -0.4,\n    offsetY: -0.4,\n    colorBack: '#002238',\n    colorBloom: '#555522',\n    colors: ['#ffcd66', '#ffb899', '#a8fffb'],\n    density: 0.55,\n    spotty: 0.28,\n    midIntensity: 1,\n    midSize: 0.4,\n    intensity: 0.3,\n    bloom: 0,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const auroraPreset: GodRaysPreset = {\n  name: 'Aurora',\n  params: {\n    ...defaultObjectSizing,\n    offsetY: 1,\n    colorBack: '#404040',\n    colorBloom: '#ff8888',\n    colors: ['#666eff', '#66ff99', '#66d9ff'],\n    density: 0.5,\n    spotty: 0.9,\n    midIntensity: 0.8,\n    midSize: 0.2,\n    intensity: 0.5,\n    bloom: 1,\n    speed: 0.5,\n    frame: 0,\n  },\n};\n\nexport const warpPreset: GodRaysPreset = {\n  name: 'Warp',\n  params: {\n    ...defaultObjectSizing,\n    colorBack: '#000000',\n    colorBloom: '#222288',\n    colors: ['#ff00c4', '#ff8c00', '#ffffff'],\n    density: 0.45,\n    spotty: 0.15,\n    midIntensity: 0,\n    midSize: 0,\n    intensity: 0.79,\n    bloom: 0.4,\n    speed: 2,\n    frame: 0,\n  },\n};\n\nexport const linearPreset: GodRaysPreset = {\n  name: 'Linear',\n  params: {\n    ...defaultObjectSizing,\n    offsetX: 0.2,\n    offsetY: -0.7,\n    colorBack: '#000000',\n    colorBloom: '#eeeeee',\n    colors: ['#ffffff1f', '#ffffff3d', '#ffffff29'],\n    density: 0.41,\n    spotty: 0.25,\n    midSize: 0.1,\n    midIntensity: 0.75,\n    intensity: 0.79,\n    bloom: 1,\n    speed: 0.5,\n    frame: 0,\n  },\n};\n\nexport const etherPreset: GodRaysPreset = {\n  name: 'Ether',\n  params: {\n    ...defaultObjectSizing,\n    offsetX: -0.6,\n    colorBack: '#090f1d',\n    colorBloom: '#ffffff',\n    colors: ['#148effa6', '#c4dffebe', '#232a47'],\n    density: 0.3,\n    spotty: 0.77,\n    midSize: 0.1,\n    midIntensity: 0.5,\n    intensity: 0.6,\n    bloom: 0.6,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const godRaysPresets: GodRaysPreset[] = [defaultPreset, auroraPreset, warpPreset, linearPreset, etherPreset];\n\nexport const GodRays: React.FC<GodRaysProps> = memo(function GodRaysImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBloom = defaultPreset.params.colorBloom,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  density = defaultPreset.params.density,\n  spotty = defaultPreset.params.spotty,\n  midIntensity = defaultPreset.params.midIntensity,\n  midSize = defaultPreset.params.midSize,\n  intensity = defaultPreset.params.intensity,\n  bloom = defaultPreset.params.bloom,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: GodRaysProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBloom: getShaderColorFromString(colorBloom),\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_density: density,\n    u_spotty: spotty,\n    u_midIntensity: midIntensity,\n    u_midSize: midSize,\n    u_intensity: intensity,\n    u_bloom: bloom,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies GodRaysUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={godRaysFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
   "mappings": "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",
   "names": []
 }

package/dist/shaders/grain-gradient.d.ts

@@ -9,7 +9,6 @@ export declare const truchetPreset: GrainGradientPreset;
 export declare const cornersPreset: GrainGradientPreset;
 export declare const ripplePreset: GrainGradientPreset;
 export declare const blobPreset: GrainGradientPreset;
-export declare const spherePreset: GrainGradientPreset;
 export declare const moonPreset: GrainGradientPreset;
 export declare const grainGradientPresets: GrainGradientPreset[];
 export declare const GrainGradient: React.FC<GrainGradientProps>;

package/dist/shaders/grain-gradient.js

@@ -7,6 +7,7 @@ import { memo } from "react";
 import { ShaderMount } from "../shader-mount.js";
 import {
   getShaderColorFromString,
+  getShaderNoiseTexture,
   grainGradientFragmentShader,
   ShaderFitOptions,
   defaultPatternSizing,
@@ -101,20 +102,6 @@ const blobPreset = {
     shape: "blob"
   }
 };
-const spherePreset = {
-  name: "Sphere",
-  params: {
-    ...defaultObjectSizing,
-    speed: 1,
-    frame: 0,
-    colorBack: "#000319",
-    colors: ["#0059b3", "#37f5f5", "#18c039"],
-    softness: 1,
-    intensity: 0.15,
-    noise: 0.5,
-    shape: "sphere"
-  }
-};
 const moonPreset = {
   name: "Moon",
   params: {
@@ -137,7 +124,6 @@ const grainGradientPresets = [
   truchetPreset,
   ripplePreset,
   blobPreset,
-  spherePreset,
   moonPreset
 ];
 const GrainGradient = memo(function GrainGradientImpl({
@@ -162,6 +148,7 @@ const GrainGradient = memo(function GrainGradientImpl({
   worldHeight = defaultPreset.params.worldHeight,
   ...props
 }) {
+  const noiseTexture = typeof window !== "undefined" && { u_noiseTexture: getShaderNoiseTexture() };
   const uniforms = {
     // Own uniforms
     u_colorBack: getShaderColorFromString(colorBack),
@@ -171,6 +158,7 @@ const GrainGradient = memo(function GrainGradientImpl({
     u_intensity: intensity,
     u_noise: noise,
     u_shape: GrainGradientShapes[shape],
+    ...noiseTexture,
     // Sizing uniforms
     u_fit: ShaderFitOptions[fit],
     u_scale: scale,
@@ -202,7 +190,6 @@ export {
   grainGradientPresets,
   moonPreset,
   ripplePreset,
-  spherePreset,
   truchetPreset
 };
 //# sourceMappingURL=grain-gradient.js.map

package/dist/shaders/grain-gradient.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/grain-gradient.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport {\n  getShaderColorFromString,\n  grainGradientFragmentShader,\n  ShaderFitOptions,\n  type GrainGradientUniforms,\n  type GrainGradientParams,\n  type ShaderPreset,\n  defaultPatternSizing,\n  defaultObjectSizing,\n  GrainGradientShapes,\n} from '@paper-design/shaders';\n\nexport interface GrainGradientProps extends ShaderComponentProps, GrainGradientParams {}\n\ntype GrainGradientPreset = ShaderPreset<GrainGradientParams>;\n\nexport const defaultPreset: GrainGradientPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000a0f',\n    colors: ['#c4730b', '#bdad5f', '#d8ccc7'],\n    softness: 0.7,\n    intensity: 0.15,\n    noise: 0.5,\n    shape: 'wave',\n  },\n};\n\nexport const dotsPreset: GrainGradientPreset = {\n  name: 'Dots',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.6,\n    speed: 1,\n    frame: 0,\n    colorBack: '#0a0000',\n    colors: ['#6f0000', '#0080ff', '#f2ebc9'],\n    softness: 0.75,\n    intensity: 0.15,\n    noise: 0.7,\n    shape: 'dots',\n  },\n};\n\nexport const truchetPreset: GrainGradientPreset = {\n  name: 'Truchet',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#0a0000',\n    colors: ['#6f2200', '#eabb7c', '#39b523'],\n    softness: 0,\n    intensity: 0.2,\n    noise: 1,\n    shape: 'truchet',\n  },\n};\n\nexport const cornersPreset: GrainGradientPreset = {\n  name: 'Corners',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#031018',\n    colors: ['#00aeff', '#00ffcc', '#ffc800'],\n    softness: 0.4,\n    intensity: 0.35,\n    noise: 0.35,\n    shape: 'corners',\n  },\n};\n\nexport const ripplePreset: GrainGradientPreset = {\n  name: 'Ripple',\n  params: {\n    ...defaultObjectSizing,\n    scale: 0.5,\n    speed: 1,\n    frame: 0,\n    colorBack: '#140a00',\n    colors: ['#6f2d00', '#88ddae', '#2c0b1d'],\n    softness: 0.5,\n    intensity: 0.5,\n    noise: 0.5,\n    shape: 'ripple',\n  },\n};\n\nexport const blobPreset: GrainGradientPreset = {\n  name: 'Blob',\n  params: {\n    ...defaultObjectSizing,\n    scale: 1.3,\n    speed: 1,\n    frame: 0,\n    colorBack: '#0f0e18',\n    colors: ['#3e6172', '#a49b74', '#568c50'],\n    softness: 0,\n    intensity: 0.15,\n    noise: 0.5,\n    shape: 'blob',\n  },\n};\n\nexport const spherePreset: GrainGradientPreset = {\n  name: 'Sphere',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000319',\n    colors: ['#0059b3', '#37f5f5', '#18c039'],\n    softness: 1,\n    intensity: 0.15,\n    noise: 0.5,\n    shape: 'sphere',\n  },\n};\n\nexport const moonPreset: GrainGradientPreset = {\n  name: 'Moon',\n  params: {\n    ...defaultObjectSizing,\n    scale: 0.6,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000000',\n    colors: ['#000000', '#28272d', '#ffeccc'],\n    softness: 1,\n    intensity: 0.56,\n    noise: 1,\n    shape: 'sphere',\n  },\n};\n\nexport const grainGradientPresets: GrainGradientPreset[] = [\n  cornersPreset,\n  defaultPreset,\n  dotsPreset,\n  truchetPreset,\n  ripplePreset,\n  blobPreset,\n  spherePreset,\n  moonPreset,\n];\n\nexport const GrainGradient: React.FC<GrainGradientProps> = memo(function GrainGradientImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  softness = defaultPreset.params.softness,\n  intensity = defaultPreset.params.intensity,\n  noise = defaultPreset.params.noise,\n  shape = defaultPreset.params.shape,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_softness: softness,\n    u_intensity: intensity,\n    u_noise: noise,\n    u_shape: GrainGradientShapes[shape],\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies GrainGradientUniforms;\n\n  return (\n    <ShaderMount\n      {...props}\n      speed={speed}\n      frame={frame}\n      fragmentShader={grainGradientFragmentShader}\n      uniforms={uniforms}\n    />\n  );\n});\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport {\n  getShaderColorFromString,\n  getShaderNoiseTexture,\n  grainGradientFragmentShader,\n  ShaderFitOptions,\n  type GrainGradientUniforms,\n  type GrainGradientParams,\n  type ShaderPreset,\n  defaultPatternSizing,\n  defaultObjectSizing,\n  GrainGradientShapes,\n} from '@paper-design/shaders';\n\nexport interface GrainGradientProps extends ShaderComponentProps, GrainGradientParams {}\n\ntype GrainGradientPreset = ShaderPreset<GrainGradientParams>;\n\nexport const defaultPreset: GrainGradientPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000a0f',\n    colors: ['#c4730b', '#bdad5f', '#d8ccc7'],\n    softness: 0.7,\n    intensity: 0.15,\n    noise: 0.5,\n    shape: 'wave',\n  },\n};\n\nexport const dotsPreset: GrainGradientPreset = {\n  name: 'Dots',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.6,\n    speed: 1,\n    frame: 0,\n    colorBack: '#0a0000',\n    colors: ['#6f0000', '#0080ff', '#f2ebc9'],\n    softness: 0.75,\n    intensity: 0.15,\n    noise: 0.7,\n    shape: 'dots',\n  },\n};\n\nexport const truchetPreset: GrainGradientPreset = {\n  name: 'Truchet',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#0a0000',\n    colors: ['#6f2200', '#eabb7c', '#39b523'],\n    softness: 0,\n    intensity: 0.2,\n    noise: 1,\n    shape: 'truchet',\n  },\n};\n\nexport const cornersPreset: GrainGradientPreset = {\n  name: 'Corners',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#031018',\n    colors: ['#00aeff', '#00ffcc', '#ffc800'],\n    softness: 0.4,\n    intensity: 0.35,\n    noise: 0.35,\n    shape: 'corners',\n  },\n};\n\nexport const ripplePreset: GrainGradientPreset = {\n  name: 'Ripple',\n  params: {\n    ...defaultObjectSizing,\n    scale: 0.5,\n    speed: 1,\n    frame: 0,\n    colorBack: '#140a00',\n    colors: ['#6f2d00', '#88ddae', '#2c0b1d'],\n    softness: 0.5,\n    intensity: 0.5,\n    noise: 0.5,\n    shape: 'ripple',\n  },\n};\n\nexport const blobPreset: GrainGradientPreset = {\n  name: 'Blob',\n  params: {\n    ...defaultObjectSizing,\n    scale: 1.3,\n    speed: 1,\n    frame: 0,\n    colorBack: '#0f0e18',\n    colors: ['#3e6172', '#a49b74', '#568c50'],\n    softness: 0,\n    intensity: 0.15,\n    noise: 0.5,\n    shape: 'blob',\n  },\n};\n\nexport const moonPreset: GrainGradientPreset = {\n  name: 'Moon',\n  params: {\n    ...defaultObjectSizing,\n    scale: 0.6,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000000',\n    colors: ['#000000', '#28272d', '#ffeccc'],\n    softness: 1,\n    intensity: 0.56,\n    noise: 1,\n    shape: 'sphere',\n  },\n};\n\nexport const grainGradientPresets: GrainGradientPreset[] = [\n  cornersPreset,\n  defaultPreset,\n  dotsPreset,\n  truchetPreset,\n  ripplePreset,\n  blobPreset,\n  moonPreset,\n];\n\nexport const GrainGradient: React.FC<GrainGradientProps> = memo(function GrainGradientImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  softness = defaultPreset.params.softness,\n  intensity = defaultPreset.params.intensity,\n  noise = defaultPreset.params.noise,\n  shape = defaultPreset.params.shape,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: GrainGradientProps) {\n  const noiseTexture = typeof window !== 'undefined' && { u_noiseTexture: getShaderNoiseTexture() };\n\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_softness: softness,\n    u_intensity: intensity,\n    u_noise: noise,\n    u_shape: GrainGradientShapes[shape],\n    ...noiseTexture,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies GrainGradientUniforms;\n\n  return (\n    <ShaderMount\n      {...props}\n      speed={speed}\n      frame={frame}\n      fragmentShader={grainGradientFragmentShader}\n      uniforms={uniforms}\n    />\n  );\n});\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/shaders/metaballs.js

@@ -20,10 +20,10 @@ const defaultPreset = {
     scale: 1,
     speed: 1,
     frame: 0,
-    colorBack: "#ffffff",
-    colors: ["#b399ff", "#99ffc4", "#ffe699", "#e099ff"],
+    colorBack: "#103086",
+    colors: ["#FFC802", "#FF5601", "#FFC206"],
     count: 7,
-    size: 1
+    size: 0.75
   }
 };
 const metaballsPresets = [defaultPreset];

package/dist/shaders/metaballs.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/metaballs.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  metaballsFragmentShader,\n  ShaderFitOptions,\n  type MetaballsParams,\n  type MetaballsUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface MetaballsProps extends ShaderComponentProps, MetaballsParams {}\n\ntype MetaballsPreset = ShaderPreset<MetaballsParams>;\n\nexport const defaultPreset: MetaballsPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    scale: 1,\n    speed: 1,\n    frame: 0,\n    colorBack: '#ffffff',\n    colors: ['#b399ff', '#99ffc4', '#ffe699', '#e099ff'],\n    count: 7,\n    size: 1,\n  },\n};\n\nexport const metaballsPresets: MetaballsPreset[] = [defaultPreset];\n\nexport const Metaballs: React.FC<MetaballsProps> = memo(function MetaballsImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  size = defaultPreset.params.size,\n  count = defaultPreset.params.count,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  rotation = defaultPreset.params.rotation,\n  scale = defaultPreset.params.scale,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: MetaballsProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_size: size,\n    u_count: count,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_rotation: rotation,\n    u_scale: scale,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies MetaballsUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={metaballsFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
-  "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AAgEH;AA1DG,MAAM,gBAAiC;AAAA,EAC5C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,WAAW;AAAA,IACX,QAAQ,CAAC,WAAW,WAAW,WAAW,SAAS;AAAA,IACnD,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AACF;AAEO,MAAM,mBAAsC,CAAC,aAAa;AAE1D,MAAM,YAAsC,KAAK,SAAS,cAAc;AAAA;AAAA,EAE7E,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,YAAY,cAAc,OAAO;AAAA,EACjC,SAAS,cAAc,OAAO;AAAA,EAC9B,OAAO,cAAc,OAAO;AAAA,EAC5B,QAAQ,cAAc,OAAO;AAAA;AAAA,EAG7B,MAAM,cAAc,OAAO;AAAA,EAC3B,WAAW,cAAc,OAAO;AAAA,EAChC,QAAQ,cAAc,OAAO;AAAA,EAC7B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAmB;AACjB,QAAM,WAAW;AAAA;AAAA,IAEf,aAAa,yBAAyB,SAAS;AAAA,IAC/C,UAAU,OAAO,IAAI,wBAAwB;AAAA,IAC7C,eAAe,OAAO;AAAA,IACtB,QAAQ;AAAA,IACR,SAAS;AAAA;AAAA,IAGT,OAAO,iBAAiB,GAAG;AAAA,IAC3B,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE,oBAAC,eAAa,GAAG,OAAO,OAAc,OAAc,gBAAgB,yBAAyB,UAAoB;AAErH,GAAG,kBAAkB;",
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  metaballsFragmentShader,\n  ShaderFitOptions,\n  type MetaballsParams,\n  type MetaballsUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface MetaballsProps extends ShaderComponentProps, MetaballsParams {}\n\ntype MetaballsPreset = ShaderPreset<MetaballsParams>;\n\nexport const defaultPreset: MetaballsPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    scale: 1,\n    speed: 1,\n    frame: 0,\n    colorBack: '#103086',\n    colors: ['#FFC802', '#FF5601', '#FFC206'],\n    count: 7,\n    size: 0.75,\n  },\n};\n\nexport const metaballsPresets: MetaballsPreset[] = [defaultPreset];\n\nexport const Metaballs: React.FC<MetaballsProps> = memo(function MetaballsImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  size = defaultPreset.params.size,\n  count = defaultPreset.params.count,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  rotation = defaultPreset.params.rotation,\n  scale = defaultPreset.params.scale,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: MetaballsProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_size: size,\n    u_count: count,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_rotation: rotation,\n    u_scale: scale,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies MetaballsUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={metaballsFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
+  "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AAgEH;AA1DG,MAAM,gBAAiC;AAAA,EAC5C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,WAAW;AAAA,IACX,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,IACxC,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AACF;AAEO,MAAM,mBAAsC,CAAC,aAAa;AAE1D,MAAM,YAAsC,KAAK,SAAS,cAAc;AAAA;AAAA,EAE7E,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,YAAY,cAAc,OAAO;AAAA,EACjC,SAAS,cAAc,OAAO;AAAA,EAC9B,OAAO,cAAc,OAAO;AAAA,EAC5B,QAAQ,cAAc,OAAO;AAAA;AAAA,EAG7B,MAAM,cAAc,OAAO;AAAA,EAC3B,WAAW,cAAc,OAAO;AAAA,EAChC,QAAQ,cAAc,OAAO;AAAA,EAC7B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAmB;AACjB,QAAM,WAAW;AAAA;AAAA,IAEf,aAAa,yBAAyB,SAAS;AAAA,IAC/C,UAAU,OAAO,IAAI,wBAAwB;AAAA,IAC7C,eAAe,OAAO;AAAA,IACtB,QAAQ;AAAA,IACR,SAAS;AAAA;AAAA,IAGT,OAAO,iBAAiB,GAAG;AAAA,IAC3B,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE,oBAAC,eAAa,GAAG,OAAO,OAAc,OAAc,gBAAgB,yBAAyB,UAAoB;AAErH,GAAG,kBAAkB;",
   "names": []
 }

package/dist/shaders/pulsing-border.js

@@ -18,7 +18,7 @@ const defaultPreset = {
   name: "Default",
   params: {
     ...defaultObjectSizing,
-    scale: 0.7,
+    scale: 0.85,
     speed: 1,
     frame: 0,
     colorBack: "#000000",
@@ -63,16 +63,16 @@ const innerBorderPreset = {
     speed: 1,
     frame: 0,
     colorBack: "#181821",
-    colors: ["#f5ad2b", "#2294d9", "#bf00ff"],
+    colors: ["#2294d9", "#79fac5", "#e39e22"],
     roundness: 0,
-    thickness: 0,
-    softness: 0.4,
-    intensity: 0,
+    thickness: 0.05,
+    softness: 1,
+    intensity: 2,
     spotsPerColor: 3,
-    spotSize: 0.18,
-    pulse: 0.04,
-    smoke: 0.75,
-    smokeSize: 0.92
+    spotSize: 0.15,
+    pulse: 0.5,
+    smoke: 0,
+    smokeSize: 0
   }
 };
 const pulsingBorderPresets = [defaultPreset, circlePreset, innerBorderPreset];

package/dist/shaders/pulsing-border.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/pulsing-border.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  getShaderNoiseTexture,\n  pulsingBorderFragmentShader,\n  ShaderFitOptions,\n  type PulsingBorderParams,\n  type PulsingBorderUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface PulsingBorderProps extends ShaderComponentProps, PulsingBorderParams {}\n\ntype PulsingBorderPreset = ShaderPreset<PulsingBorderParams>;\n\nexport const defaultPreset: PulsingBorderPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    scale: 0.7,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000000',\n    colors: ['#f2244f', '#4da6e6'],\n    roundness: 0.5,\n    thickness: 0.02,\n    softness: 0.5,\n    intensity: 2.4,\n    spotsPerColor: 4,\n    spotSize: 0.15,\n    pulse: 0,\n    smoke: 1,\n    smokeSize: 1.3,\n  },\n};\n\nexport const circlePreset: PulsingBorderPreset = {\n  name: 'Circle',\n  params: {\n    ...defaultObjectSizing,\n    worldWidth: 200,\n    worldHeight: 200,\n    scale: 0.5,\n    speed: 1,\n    frame: 0,\n    colorBack: '#0f191f',\n    colors: ['#ffdd33', '#ff8c00', '#ff002b'],\n    roundness: 1,\n    thickness: 0.03,\n    softness: 0.2,\n    intensity: 2,\n    spotsPerColor: 4,\n    spotSize: 0.15,\n    pulse: 0,\n    smoke: 0,\n    smokeSize: 1,\n  },\n};\n\nexport const innerBorderPreset: PulsingBorderPreset = {\n  name: 'Inner Border',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1.0,\n    frame: 0,\n    colorBack: '#181821',\n    colors: ['#f5ad2b', '#2294d9', '#bf00ff'],\n    roundness: 0,\n    thickness: 0,\n    softness: 0.4,\n    intensity: 0,\n    spotsPerColor: 3,\n    spotSize: 0.18,\n    pulse: 0.04,\n    smoke: 0.75,\n    smokeSize: 0.92,\n  },\n};\n\nexport const pulsingBorderPresets: PulsingBorderPreset[] = [defaultPreset, circlePreset, innerBorderPreset];\n\nexport const PulsingBorder: React.FC<PulsingBorderProps> = memo(function PulsingBorderImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colors = defaultPreset.params.colors,\n  colorBack = defaultPreset.params.colorBack,\n  roundness = defaultPreset.params.roundness,\n  thickness = defaultPreset.params.thickness,\n  softness = defaultPreset.params.softness,\n  intensity = defaultPreset.params.intensity,\n  spotsPerColor = defaultPreset.params.spotsPerColor,\n  spotSize = defaultPreset.params.spotSize,\n  pulse = defaultPreset.params.pulse,\n  smoke = defaultPreset.params.smoke,\n  smokeSize = defaultPreset.params.smokeSize,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  rotation = defaultPreset.params.rotation,\n  scale = defaultPreset.params.scale,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: PulsingBorderProps) {\n  const noiseTexture = typeof window !== 'undefined' && { u_noiseTexture: getShaderNoiseTexture(0) };\n  const pulseTexture = typeof window !== 'undefined' && { u_pulseTexture: getShaderNoiseTexture(1) };\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_roundness: roundness,\n    u_thickness: thickness,\n    u_softness: softness,\n    u_intensity: intensity,\n    u_spotsPerColor: spotsPerColor,\n    u_spotSize: spotSize,\n    u_pulse: pulse,\n    u_smoke: smoke,\n    u_smokeSize: smokeSize,\n    ...pulseTexture,\n    ...noiseTexture,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_rotation: rotation,\n    u_scale: scale,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies PulsingBorderUniforms;\n\n  return (\n    <ShaderMount\n      {...props}\n      speed={speed}\n      frame={frame}\n      fragmentShader={pulsingBorderFragmentShader}\n      uniforms={uniforms}\n    />\n  );\n}, colorPropsAreEqual);\n"],
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  getShaderNoiseTexture,\n  pulsingBorderFragmentShader,\n  ShaderFitOptions,\n  type PulsingBorderParams,\n  type PulsingBorderUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface PulsingBorderProps extends ShaderComponentProps, PulsingBorderParams {}\n\ntype PulsingBorderPreset = ShaderPreset<PulsingBorderParams>;\n\nexport const defaultPreset: PulsingBorderPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    scale: 0.85,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000000',\n    colors: ['#f2244f', '#4da6e6'],\n    roundness: 0.5,\n    thickness: 0.02,\n    softness: 0.5,\n    intensity: 2.4,\n    spotsPerColor: 4,\n    spotSize: 0.15,\n    pulse: 0,\n    smoke: 1,\n    smokeSize: 1.3,\n  },\n};\n\nexport const circlePreset: PulsingBorderPreset = {\n  name: 'Circle',\n  params: {\n    ...defaultObjectSizing,\n    worldWidth: 200,\n    worldHeight: 200,\n    scale: 0.5,\n    speed: 1,\n    frame: 0,\n    colorBack: '#0f191f',\n    colors: ['#ffdd33', '#ff8c00', '#ff002b'],\n    roundness: 1,\n    thickness: 0.03,\n    softness: 0.2,\n    intensity: 2,\n    spotsPerColor: 4,\n    spotSize: 0.15,\n    pulse: 0,\n    smoke: 0,\n    smokeSize: 1,\n  },\n};\n\nexport const innerBorderPreset: PulsingBorderPreset = {\n  name: 'Inner Border',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1.0,\n    frame: 0,\n    colorBack: '#181821',\n    colors: ['#2294d9', '#79fac5', '#e39e22'],\n    roundness: 0,\n    thickness: 0.05,\n    softness: 1,\n    intensity: 2,\n    spotsPerColor: 3,\n    spotSize: 0.15,\n    pulse: 0.5,\n    smoke: 0,\n    smokeSize: 0,\n  },\n};\n\nexport const pulsingBorderPresets: PulsingBorderPreset[] = [defaultPreset, circlePreset, innerBorderPreset];\n\nexport const PulsingBorder: React.FC<PulsingBorderProps> = memo(function PulsingBorderImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colors = defaultPreset.params.colors,\n  colorBack = defaultPreset.params.colorBack,\n  roundness = defaultPreset.params.roundness,\n  thickness = defaultPreset.params.thickness,\n  softness = defaultPreset.params.softness,\n  intensity = defaultPreset.params.intensity,\n  spotsPerColor = defaultPreset.params.spotsPerColor,\n  spotSize = defaultPreset.params.spotSize,\n  pulse = defaultPreset.params.pulse,\n  smoke = defaultPreset.params.smoke,\n  smokeSize = defaultPreset.params.smokeSize,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  rotation = defaultPreset.params.rotation,\n  scale = defaultPreset.params.scale,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: PulsingBorderProps) {\n  const noiseTexture = typeof window !== 'undefined' && { u_noiseTexture: getShaderNoiseTexture(0) };\n  const pulseTexture = typeof window !== 'undefined' && { u_pulseTexture: getShaderNoiseTexture(1) };\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_roundness: roundness,\n    u_thickness: thickness,\n    u_softness: softness,\n    u_intensity: intensity,\n    u_spotsPerColor: spotsPerColor,\n    u_spotSize: spotSize,\n    u_pulse: pulse,\n    u_smoke: smoke,\n    u_smokeSize: smokeSize,\n    ...pulseTexture,\n    ...noiseTexture,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_rotation: rotation,\n    u_scale: scale,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies PulsingBorderUniforms;\n\n  return (\n    <ShaderMount\n      {...props}\n      speed={speed}\n      frame={frame}\n      fragmentShader={pulsingBorderFragmentShader}\n      uniforms={uniforms}\n    />\n  );\n}, colorPropsAreEqual);\n"],
   "mappings": "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",
   "names": []
 }

package/dist/shaders/smoke-ring.js

@@ -35,13 +35,13 @@ const poisonPreset = {
     ...defaultObjectSizing,
     speed: 1,
     frame: 0,
-    colorBack: "#000000",
-    colors: ["#d4ff00", "#0c7f08"],
-    noiseScale: 2.2,
-    noiseIterations: 10,
+    colorBack: "#003d00",
+    colors: ["#d4ff00", "#077d52", "#aaff00"],
+    noiseScale: 3.3,
+    noiseIterations: 3,
     radius: 0.4,
     thickness: 0.2,
-    innerShape: 0.6
+    innerShape: 4
   }
 };
 const linePreset = {
@@ -66,7 +66,7 @@ const cloudPreset = {
     frame: 0,
     colorBack: "#3b9bff",
     colors: ["#ffffff"],
-    noiseScale: 1.5,
+    noiseScale: 3,
     noiseIterations: 10,
     radius: 0.5,
     thickness: 0.65,

package/dist/shaders/smoke-ring.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/smoke-ring.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  getShaderNoiseTexture,\n  smokeRingFragmentShader,\n  ShaderFitOptions,\n  type ShaderPreset,\n  type SmokeRingParams,\n  type SmokeRingUniforms,\n} from '@paper-design/shaders';\n\nexport interface SmokeRingProps extends ShaderComponentProps, SmokeRingParams {}\n\ntype SmokeRingPreset = ShaderPreset<SmokeRingParams>;\n\nexport const defaultPreset: SmokeRingPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    speed: 0.4,\n    frame: 0,\n    colorBack: '#ffffff',\n    colors: ['#136c5e', '#0f0224'],\n    noiseScale: 5,\n    noiseIterations: 10,\n    radius: 0.5,\n    thickness: 0.25,\n    innerShape: 1.2,\n  },\n};\n\nexport const poisonPreset: SmokeRingPreset = {\n  name: 'Poison',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000000',\n    colors: ['#d4ff00', '#0c7f08'],\n    noiseScale: 2.2,\n    noiseIterations: 10,\n    radius: 0.4,\n    thickness: 0.2,\n    innerShape: 0.6,\n  },\n};\n\nexport const linePreset: SmokeRingPreset = {\n  name: 'Line',\n  params: {\n    ...defaultObjectSizing,\n    frame: 0,\n    colorBack: '#000000',\n    colors: ['#1fe8ff', '#4540a4'],\n    noiseScale: 1.1,\n    noiseIterations: 2,\n    radius: 0.38,\n    thickness: 0.01,\n    innerShape: 0.88,\n    speed: 4,\n  },\n};\n\nexport const cloudPreset: SmokeRingPreset = {\n  name: 'Cloud',\n  params: {\n    ...defaultObjectSizing,\n    frame: 0,\n    colorBack: '#3b9bff',\n    colors: ['#ffffff'],\n    noiseScale: 1.5,\n    noiseIterations: 10,\n    radius: 0.5,\n    thickness: 0.65,\n    innerShape: 0.9,\n    speed: 0.5,\n  },\n};\n\nexport const smokeRingPresets: SmokeRingPreset[] = [defaultPreset, linePreset, poisonPreset, cloudPreset];\n\nexport const SmokeRing: React.FC<SmokeRingProps> = memo(function SmokeRingImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  noiseScale = defaultPreset.params.noiseScale,\n  thickness = defaultPreset.params.thickness,\n  radius = defaultPreset.params.radius,\n  innerShape = defaultPreset.params.innerShape,\n  noiseIterations = defaultPreset.params.noiseIterations,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: SmokeRingProps) {\n  const noiseTexture = typeof window !== 'undefined' && { u_noiseTexture: getShaderNoiseTexture() };\n\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_noiseScale: noiseScale,\n    u_thickness: thickness,\n    u_radius: radius,\n    u_innerShape: innerShape,\n    u_noiseIterations: noiseIterations,\n    ...noiseTexture,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies SmokeRingUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={smokeRingFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  getShaderNoiseTexture,\n  smokeRingFragmentShader,\n  ShaderFitOptions,\n  type ShaderPreset,\n  type SmokeRingParams,\n  type SmokeRingUniforms,\n} from '@paper-design/shaders';\n\nexport interface SmokeRingProps extends ShaderComponentProps, SmokeRingParams {}\n\ntype SmokeRingPreset = ShaderPreset<SmokeRingParams>;\n\nexport const defaultPreset: SmokeRingPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    speed: 0.4,\n    frame: 0,\n    colorBack: '#ffffff',\n    colors: ['#136c5e', '#0f0224'],\n    noiseScale: 5,\n    noiseIterations: 10,\n    radius: 0.5,\n    thickness: 0.25,\n    innerShape: 1.2,\n  },\n};\n\nexport const poisonPreset: SmokeRingPreset = {\n  name: 'Poison',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#003d00',\n    colors: ['#d4ff00', '#077d52', '#aaff00'],\n    noiseScale: 3.3,\n    noiseIterations: 3,\n    radius: 0.4,\n    thickness: 0.2,\n    innerShape: 4,\n  },\n};\n\nexport const linePreset: SmokeRingPreset = {\n  name: 'Line',\n  params: {\n    ...defaultObjectSizing,\n    frame: 0,\n    colorBack: '#000000',\n    colors: ['#1fe8ff', '#4540a4'],\n    noiseScale: 1.1,\n    noiseIterations: 2,\n    radius: 0.38,\n    thickness: 0.01,\n    innerShape: 0.88,\n    speed: 4,\n  },\n};\n\nexport const cloudPreset: SmokeRingPreset = {\n  name: 'Cloud',\n  params: {\n    ...defaultObjectSizing,\n    frame: 0,\n    colorBack: '#3b9bff',\n    colors: ['#ffffff'],\n    noiseScale: 3,\n    noiseIterations: 10,\n    radius: 0.5,\n    thickness: 0.65,\n    innerShape: 0.9,\n    speed: 0.5,\n  },\n};\n\nexport const smokeRingPresets: SmokeRingPreset[] = [defaultPreset, linePreset, poisonPreset, cloudPreset];\n\nexport const SmokeRing: React.FC<SmokeRingProps> = memo(function SmokeRingImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  noiseScale = defaultPreset.params.noiseScale,\n  thickness = defaultPreset.params.thickness,\n  radius = defaultPreset.params.radius,\n  innerShape = defaultPreset.params.innerShape,\n  noiseIterations = defaultPreset.params.noiseIterations,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: SmokeRingProps) {\n  const noiseTexture = typeof window !== 'undefined' && { u_noiseTexture: getShaderNoiseTexture() };\n\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_noiseScale: noiseScale,\n    u_thickness: thickness,\n    u_radius: radius,\n    u_innerShape: innerShape,\n    u_noiseIterations: noiseIterations,\n    ...noiseTexture,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies SmokeRingUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={smokeRingFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/shaders/spiral.js

@@ -75,7 +75,7 @@ const sandPreset = {
     ...defaultPatternSizing,
     colorBack: "#dedede",
     colorFront: "#a09560",
-    scale: 3,
+    scale: 0.75,
     density: 0,
     distortion: 0,
     strokeWidth: 0.15,

package/dist/shaders/spiral.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/spiral.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  ShaderFitOptions,\n  spiralFragmentShader,\n  type ShaderPreset,\n  type SpiralParams,\n  type SpiralUniforms,\n} from '@paper-design/shaders';\n\nexport interface SpiralProps extends ShaderComponentProps, SpiralParams {}\n\ntype SpiralPreset = ShaderPreset<SpiralParams>;\n\nexport const defaultPreset: SpiralPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#fafafa',\n    colorFront: '#808080',\n    density: 0,\n    distortion: 0,\n    strokeWidth: 0.5,\n    strokeTaper: 0,\n    strokeCap: 0,\n    noiseFrequency: 0,\n    noisePower: 0,\n    softness: 0.01,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const noisyPreset: SpiralPreset = {\n  name: 'Noisy',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#a1ef2a',\n    colorFront: '#288918',\n    scale: 1.3,\n    density: 0.5,\n    distortion: 0,\n    strokeWidth: 0.5,\n    strokeTaper: 0,\n    strokeCap: 0.5,\n    noiseFrequency: 0.1,\n    noisePower: 1,\n    softness: 0,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const dropletPreset: SpiralPreset = {\n  name: 'Droplet',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#effafe',\n    colorFront: '#bf40a0',\n    scale: 0.65,\n    density: 0,\n    distortion: 0,\n    strokeWidth: 0.05,\n    strokeTaper: 0,\n    strokeCap: 1,\n    noiseFrequency: 0,\n    noisePower: 0,\n    softness: 0,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const sandPreset: SpiralPreset = {\n  name: 'Sand',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#dedede',\n    colorFront: '#a09560',\n    scale: 3,\n    density: 0,\n    distortion: 0,\n    strokeWidth: 0.15,\n    strokeTaper: 0,\n    strokeCap: 0,\n    noiseFrequency: 30,\n    noisePower: 1,\n    softness: 0.2,\n    speed: 0,\n    frame: 0,\n  },\n};\n\nexport const swirlPreset: SpiralPreset = {\n  name: 'Swirl',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#b3e6d9',\n    colorFront: '#1a2b4d',\n    scale: 4,\n    density: 0.8,\n    distortion: 0,\n    strokeWidth: 0.5,\n    strokeTaper: 0,\n    strokeCap: 0,\n    noiseFrequency: 0,\n    noisePower: 0,\n    softness: 0.5,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const hookPreset: SpiralPreset = {\n  name: 'Hook',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#85c2e0',\n    colorFront: '#000000',\n    scale: 0.8,\n    density: 0,\n    distortion: 0,\n    strokeWidth: 0.5,\n    strokeTaper: 0.5,\n    strokeCap: 0,\n    noiseFrequency: 0,\n    noisePower: 0,\n    softness: 0.02,\n    speed: 3,\n    frame: 0,\n  },\n};\n\nexport const vinylPreset: SpiralPreset = {\n  name: 'Vinyl',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#c2babb',\n    colorFront: '#262626',\n    density: 0,\n    distortion: 0.3,\n    strokeWidth: 0.95,\n    strokeTaper: 0,\n    strokeCap: 1,\n    noiseFrequency: 0,\n    noisePower: 0,\n    softness: 0.11,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const spiralPresets: SpiralPreset[] = [\n  defaultPreset,\n  noisyPreset,\n  dropletPreset,\n  swirlPreset,\n  sandPreset,\n  hookPreset,\n  vinylPreset,\n];\n\nexport const Spiral: React.FC<SpiralProps> = memo(function SpiralImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colorFront = defaultPreset.params.colorFront,\n  density = defaultPreset.params.density,\n  distortion = defaultPreset.params.distortion,\n  strokeWidth = defaultPreset.params.strokeWidth,\n  strokeTaper = defaultPreset.params.strokeTaper,\n  strokeCap = defaultPreset.params.strokeCap,\n  noiseFrequency = defaultPreset.params.noiseFrequency,\n  noisePower = defaultPreset.params.noisePower,\n  softness = defaultPreset.params.softness,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  rotation = defaultPreset.params.rotation,\n  scale = defaultPreset.params.scale,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: SpiralProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colorFront: getShaderColorFromString(colorFront),\n    u_density: density,\n    u_distortion: distortion,\n    u_strokeWidth: strokeWidth,\n    u_strokeTaper: strokeTaper,\n    u_strokeCap: strokeCap,\n    u_noiseFrequency: noiseFrequency,\n    u_noisePower: noisePower,\n    u_softness: softness,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies SpiralUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={spiralFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  ShaderFitOptions,\n  spiralFragmentShader,\n  type ShaderPreset,\n  type SpiralParams,\n  type SpiralUniforms,\n} from '@paper-design/shaders';\n\nexport interface SpiralProps extends ShaderComponentProps, SpiralParams {}\n\ntype SpiralPreset = ShaderPreset<SpiralParams>;\n\nexport const defaultPreset: SpiralPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#fafafa',\n    colorFront: '#808080',\n    density: 0,\n    distortion: 0,\n    strokeWidth: 0.5,\n    strokeTaper: 0,\n    strokeCap: 0,\n    noiseFrequency: 0,\n    noisePower: 0,\n    softness: 0.01,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const noisyPreset: SpiralPreset = {\n  name: 'Noisy',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#a1ef2a',\n    colorFront: '#288918',\n    scale: 1.3,\n    density: 0.5,\n    distortion: 0,\n    strokeWidth: 0.5,\n    strokeTaper: 0,\n    strokeCap: 0.5,\n    noiseFrequency: 0.1,\n    noisePower: 1,\n    softness: 0,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const dropletPreset: SpiralPreset = {\n  name: 'Droplet',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#effafe',\n    colorFront: '#bf40a0',\n    scale: 0.65,\n    density: 0,\n    distortion: 0,\n    strokeWidth: 0.05,\n    strokeTaper: 0,\n    strokeCap: 1,\n    noiseFrequency: 0,\n    noisePower: 0,\n    softness: 0,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const sandPreset: SpiralPreset = {\n  name: 'Sand',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#dedede',\n    colorFront: '#a09560',\n    scale: 0.75,\n    density: 0,\n    distortion: 0,\n    strokeWidth: 0.15,\n    strokeTaper: 0,\n    strokeCap: 0,\n    noiseFrequency: 30,\n    noisePower: 1,\n    softness: 0.2,\n    speed: 0,\n    frame: 0,\n  },\n};\n\nexport const swirlPreset: SpiralPreset = {\n  name: 'Swirl',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#b3e6d9',\n    colorFront: '#1a2b4d',\n    scale: 4,\n    density: 0.8,\n    distortion: 0,\n    strokeWidth: 0.5,\n    strokeTaper: 0,\n    strokeCap: 0,\n    noiseFrequency: 0,\n    noisePower: 0,\n    softness: 0.5,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const hookPreset: SpiralPreset = {\n  name: 'Hook',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#85c2e0',\n    colorFront: '#000000',\n    scale: 0.8,\n    density: 0,\n    distortion: 0,\n    strokeWidth: 0.5,\n    strokeTaper: 0.5,\n    strokeCap: 0,\n    noiseFrequency: 0,\n    noisePower: 0,\n    softness: 0.02,\n    speed: 3,\n    frame: 0,\n  },\n};\n\nexport const vinylPreset: SpiralPreset = {\n  name: 'Vinyl',\n  params: {\n    ...defaultPatternSizing,\n    colorBack: '#c2babb',\n    colorFront: '#262626',\n    density: 0,\n    distortion: 0.3,\n    strokeWidth: 0.95,\n    strokeTaper: 0,\n    strokeCap: 1,\n    noiseFrequency: 0,\n    noisePower: 0,\n    softness: 0.11,\n    speed: 1,\n    frame: 0,\n  },\n};\n\nexport const spiralPresets: SpiralPreset[] = [\n  defaultPreset,\n  noisyPreset,\n  dropletPreset,\n  swirlPreset,\n  sandPreset,\n  hookPreset,\n  vinylPreset,\n];\n\nexport const Spiral: React.FC<SpiralProps> = memo(function SpiralImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colorFront = defaultPreset.params.colorFront,\n  density = defaultPreset.params.density,\n  distortion = defaultPreset.params.distortion,\n  strokeWidth = defaultPreset.params.strokeWidth,\n  strokeTaper = defaultPreset.params.strokeTaper,\n  strokeCap = defaultPreset.params.strokeCap,\n  noiseFrequency = defaultPreset.params.noiseFrequency,\n  noisePower = defaultPreset.params.noisePower,\n  softness = defaultPreset.params.softness,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  rotation = defaultPreset.params.rotation,\n  scale = defaultPreset.params.scale,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: SpiralProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colorFront: getShaderColorFromString(colorFront),\n    u_density: density,\n    u_distortion: distortion,\n    u_strokeWidth: strokeWidth,\n    u_strokeTaper: strokeTaper,\n    u_strokeCap: strokeCap,\n    u_noiseFrequency: noiseFrequency,\n    u_noisePower: noisePower,\n    u_softness: softness,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies SpiralUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={spiralFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
   "mappings": "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",
   "names": []
 }

package/dist/shaders/swirl.js

@@ -40,7 +40,7 @@ const openingPreset = {
     speed: 0.6,
     frame: 0,
     colorBack: "#8b2e5f",
-    colors: ["#b14467", "#e67a62", "#ff715c", "#ffc55c", "#f9f97c"],
+    colors: ["#b14467", "#e67a62", "#ffbdb3"],
     bandCount: 3,
     twist: 0.3,
     softness: 0,
@@ -70,7 +70,7 @@ const candyPreset = {
     speed: 1,
     frame: 0,
     colorBack: "#ffcd66",
-    colors: ["#6bbceb", "#8a1fff"],
+    colors: ["#6bbceb", "#8a1fff", "#ff9fff"],
     bandCount: 2.5,
     twist: 0.2,
     softness: 1,

package/dist/shaders/swirl.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/swirl.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  ShaderFitOptions,\n  swirlFragmentShader,\n  type ShaderPreset,\n  type SwirlParams,\n  type SwirlUniforms,\n} from '@paper-design/shaders';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\n\nexport interface SwirlProps extends ShaderComponentProps, SwirlParams {}\n\ntype SwirlPreset = ShaderPreset<SwirlParams>;\n\nexport const defaultPreset: SwirlPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    scale: 2.28,\n    offsetX: -0.4,\n    offsetY: 0.3,\n    speed: 0.32,\n    frame: 0,\n    colorBack: '#452424',\n    colors: ['#0b7f05', '#ffe785', '#ff335c'],\n    bandCount: 5,\n    twist: 0.11,\n    softness: 0.01,\n    noiseFrequency: 1.2,\n    noisePower: 0.46,\n  },\n};\n\nexport const openingPreset: SwirlPreset = {\n  name: 'Opening',\n  params: {\n    ...defaultObjectSizing,\n    offsetX: -0.4,\n    offsetY: 0.86,\n    speed: 0.6,\n    frame: 0,\n    colorBack: '#8b2e5f',\n    colors: ['#b14467', '#e67a62', '#ff715c', '#ffc55c', '#f9f97c'],\n    bandCount: 3,\n    twist: 0.3,\n    softness: 0,\n    noiseFrequency: 2,\n    noisePower: 0,\n  },\n} as const;\n\nexport const jamesBondPreset: SwirlPreset = {\n  name: '007',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000000',\n    colors: ['#2e2e2e', '#000000', '#ffffff'],\n    bandCount: 4,\n    twist: 0.4,\n    softness: 0,\n    noiseFrequency: 0,\n    noisePower: 0,\n  },\n} as const;\n\nexport const candyPreset: SwirlPreset = {\n  name: 'Candy',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#ffcd66',\n    colors: ['#6bbceb', '#8a1fff'],\n    bandCount: 2.5,\n    twist: 0.2,\n    softness: 1,\n    noiseFrequency: 0,\n    noisePower: 0,\n  },\n} as const;\n\nexport const swirlPresets: SwirlPreset[] = [defaultPreset, openingPreset, jamesBondPreset, candyPreset];\n\nexport const Swirl: React.FC<SwirlProps> = memo(function SwirlImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  bandCount = defaultPreset.params.bandCount,\n  twist = defaultPreset.params.twist,\n  softness = defaultPreset.params.softness,\n  noiseFrequency = defaultPreset.params.noiseFrequency,\n  noisePower = defaultPreset.params.noisePower,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  rotation = defaultPreset.params.rotation,\n  scale = defaultPreset.params.scale,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: SwirlProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_bandCount: bandCount,\n    u_twist: twist,\n    u_softness: softness,\n    u_noiseFrequency: noiseFrequency,\n    u_noisePower: noisePower,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies SwirlUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={swirlFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  ShaderFitOptions,\n  swirlFragmentShader,\n  type ShaderPreset,\n  type SwirlParams,\n  type SwirlUniforms,\n} from '@paper-design/shaders';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\n\nexport interface SwirlProps extends ShaderComponentProps, SwirlParams {}\n\ntype SwirlPreset = ShaderPreset<SwirlParams>;\n\nexport const defaultPreset: SwirlPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    scale: 2.28,\n    offsetX: -0.4,\n    offsetY: 0.3,\n    speed: 0.32,\n    frame: 0,\n    colorBack: '#452424',\n    colors: ['#0b7f05', '#ffe785', '#ff335c'],\n    bandCount: 5,\n    twist: 0.11,\n    softness: 0.01,\n    noiseFrequency: 1.2,\n    noisePower: 0.46,\n  },\n};\n\nexport const openingPreset: SwirlPreset = {\n  name: 'Opening',\n  params: {\n    ...defaultObjectSizing,\n    offsetX: -0.4,\n    offsetY: 0.86,\n    speed: 0.6,\n    frame: 0,\n    colorBack: '#8b2e5f',\n    colors: ['#b14467', '#e67a62', '#ffbdb3'],\n    bandCount: 3,\n    twist: 0.3,\n    softness: 0,\n    noiseFrequency: 2,\n    noisePower: 0,\n  },\n} as const;\n\nexport const jamesBondPreset: SwirlPreset = {\n  name: '007',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#000000',\n    colors: ['#2e2e2e', '#000000', '#ffffff'],\n    bandCount: 4,\n    twist: 0.4,\n    softness: 0,\n    noiseFrequency: 0,\n    noisePower: 0,\n  },\n} as const;\n\nexport const candyPreset: SwirlPreset = {\n  name: 'Candy',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#ffcd66',\n    colors: ['#6bbceb', '#8a1fff', '#ff9fff'],\n    bandCount: 2.5,\n    twist: 0.2,\n    softness: 1,\n    noiseFrequency: 0,\n    noisePower: 0,\n  },\n} as const;\n\nexport const swirlPresets: SwirlPreset[] = [defaultPreset, openingPreset, jamesBondPreset, candyPreset];\n\nexport const Swirl: React.FC<SwirlProps> = memo(function SwirlImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  bandCount = defaultPreset.params.bandCount,\n  twist = defaultPreset.params.twist,\n  softness = defaultPreset.params.softness,\n  noiseFrequency = defaultPreset.params.noiseFrequency,\n  noisePower = defaultPreset.params.noisePower,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  rotation = defaultPreset.params.rotation,\n  scale = defaultPreset.params.scale,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: SwirlProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_bandCount: bandCount,\n    u_twist: twist,\n    u_softness: softness,\n    u_noiseFrequency: noiseFrequency,\n    u_noisePower: noisePower,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies SwirlUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={swirlFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/shaders/voronoi.d.ts

@@ -4,7 +4,7 @@ export interface VoronoiProps extends ShaderComponentProps, VoronoiParams {
 }
 type VoronoiPreset = ShaderPreset<VoronoiParams>;
 export declare const defaultPreset: VoronoiPreset;
-export declare const shadowPreset: VoronoiPreset;
+export declare const cellsPreset: VoronoiPreset;
 export declare const voronoiPresets: VoronoiPreset[];
 export declare const Voronoi: React.FC<VoronoiProps>;
 export {};

package/dist/shaders/voronoi.js

@@ -21,7 +21,7 @@ const defaultPreset = {
     speed: 0.5,
     frame: 0,
     colors: ["#e65c1a", "#e6c31a", "#1aace6"],
-    stepsPerColor: 1,
+    stepsPerColor: 2,
     colorGlow: "#5500ff",
     colorGap: "#ffffff",
     distortion: 0.42,
@@ -29,22 +29,23 @@ const defaultPreset = {
     glow: 0
   }
 };
-const shadowPreset = {
-  name: "Shadow",
+const cellsPreset = {
+  name: "Cells",
   params: {
     ...defaultPatternSizing,
+    scale: 0.5,
     speed: 0.5,
     frame: 0,
-    colors: ["#faf7fe", "#fefdf7", "#fbf7fe"],
+    colors: ["#ffffff"],
     stepsPerColor: 1,
-    colorGlow: "#76587a",
-    colorGap: "#ffffff",
-    distortion: 0.23,
-    gap: 0,
+    colorGlow: "#ffffff",
+    colorGap: "#ff0073",
+    distortion: 0.5,
+    gap: 0.03,
     glow: 0.8
   }
 };
-const voronoiPresets = [defaultPreset, shadowPreset];
+const voronoiPresets = [defaultPreset, cellsPreset];
 const Voronoi = memo(function VoronoiImpl({
   // Own props
   speed = defaultPreset.params.speed,
@@ -95,8 +96,8 @@ const Voronoi = memo(function VoronoiImpl({
 }, colorPropsAreEqual);
 export {
   Voronoi,
+  cellsPreset,
   defaultPreset,
-  shadowPreset,
   voronoiPresets
 };
 //# sourceMappingURL=voronoi.js.map

package/dist/shaders/voronoi.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/voronoi.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  getShaderNoiseTexture,\n  voronoiFragmentShader,\n  ShaderFitOptions,\n  type VoronoiParams,\n  type VoronoiUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface VoronoiProps extends ShaderComponentProps, VoronoiParams {}\n\ntype VoronoiPreset = ShaderPreset<VoronoiParams>;\n\nexport const defaultPreset: VoronoiPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 0.5,\n    frame: 0,\n    colors: ['#e65c1a', '#e6c31a', '#1aace6'],\n    stepsPerColor: 1,\n    colorGlow: '#5500ff',\n    colorGap: '#ffffff',\n    distortion: 0.42,\n    gap: 0.06,\n    glow: 0,\n  },\n};\n\nexport const shadowPreset: VoronoiPreset = {\n  name: 'Shadow',\n  params: {\n    ...defaultPatternSizing,\n    speed: 0.5,\n    frame: 0,\n    colors: ['#faf7fe', '#fefdf7', '#fbf7fe'],\n    stepsPerColor: 1,\n    colorGlow: '#76587a',\n    colorGap: '#ffffff',\n    distortion: 0.23,\n    gap: 0,\n    glow: 0.8,\n  },\n};\n\nexport const voronoiPresets: VoronoiPreset[] = [defaultPreset, shadowPreset];\n\nexport const Voronoi: React.FC<VoronoiProps> = memo(function VoronoiImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colors = defaultPreset.params.colors,\n  stepsPerColor = defaultPreset.params.stepsPerColor,\n  colorGlow = defaultPreset.params.colorGlow,\n  colorGap = defaultPreset.params.colorGap,\n  distortion = defaultPreset.params.distortion,\n  gap = defaultPreset.params.gap,\n  glow = defaultPreset.params.glow,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: VoronoiProps) {\n  const noiseTexture = typeof window !== 'undefined' && { u_noiseTexture: getShaderNoiseTexture() };\n\n  const uniforms = {\n    // Own uniforms\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_stepsPerColor: stepsPerColor,\n    u_colorGlow: getShaderColorFromString(colorGlow),\n    u_colorGap: getShaderColorFromString(colorGap),\n    u_distortion: distortion,\n    u_gap: gap,\n    u_glow: glow,\n    ...noiseTexture,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies VoronoiUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={voronoiFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
-  "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AA2FH;AArFG,MAAM,gBAA+B;AAAA,EAC1C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,IACxC,eAAe;AAAA,IACf,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,KAAK;AAAA,IACL,MAAM;AAAA,EACR;AACF;AAEO,MAAM,eAA8B;AAAA,EACzC,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,IACxC,eAAe;AAAA,IACf,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,KAAK;AAAA,IACL,MAAM;AAAA,EACR;AACF;AAEO,MAAM,iBAAkC,CAAC,eAAe,YAAY;AAEpE,MAAM,UAAkC,KAAK,SAAS,YAAY;AAAA;AAAA,EAEvE,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,SAAS,cAAc,OAAO;AAAA,EAC9B,gBAAgB,cAAc,OAAO;AAAA,EACrC,YAAY,cAAc,OAAO;AAAA,EACjC,WAAW,cAAc,OAAO;AAAA,EAChC,aAAa,cAAc,OAAO;AAAA,EAClC,MAAM,cAAc,OAAO;AAAA,EAC3B,OAAO,cAAc,OAAO;AAAA;AAAA,EAG5B,MAAM,cAAc,OAAO;AAAA,EAC3B,QAAQ,cAAc,OAAO;AAAA,EAC7B,WAAW,cAAc,OAAO;AAAA,EAChC,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAiB;AACf,QAAM,eAAe,OAAO,WAAW,eAAe,EAAE,gBAAgB,sBAAsB,EAAE;AAEhG,QAAM,WAAW;AAAA;AAAA,IAEf,UAAU,OAAO,IAAI,wBAAwB;AAAA,IAC7C,eAAe,OAAO;AAAA,IACtB,iBAAiB;AAAA,IACjB,aAAa,yBAAyB,SAAS;AAAA,IAC/C,YAAY,yBAAyB,QAAQ;AAAA,IAC7C,cAAc;AAAA,IACd,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,GAAG;AAAA;AAAA,IAGH,OAAO,iBAAiB,GAAG;AAAA,IAC3B,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE,oBAAC,eAAa,GAAG,OAAO,OAAc,OAAc,gBAAgB,uBAAuB,UAAoB;AAEnH,GAAG,kBAAkB;",
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  getShaderNoiseTexture,\n  voronoiFragmentShader,\n  ShaderFitOptions,\n  type VoronoiParams,\n  type VoronoiUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface VoronoiProps extends ShaderComponentProps, VoronoiParams {}\n\ntype VoronoiPreset = ShaderPreset<VoronoiParams>;\n\nexport const defaultPreset: VoronoiPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 0.5,\n    frame: 0,\n    colors: ['#e65c1a', '#e6c31a', '#1aace6'],\n    stepsPerColor: 2,\n    colorGlow: '#5500ff',\n    colorGap: '#ffffff',\n    distortion: 0.42,\n    gap: 0.06,\n    glow: 0,\n  },\n};\n\nexport const cellsPreset: VoronoiPreset = {\n  name: 'Cells',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.5,\n    speed: 0.5,\n    frame: 0,\n    colors: ['#ffffff'],\n    stepsPerColor: 1,\n    colorGlow: '#ffffff',\n    colorGap: '#ff0073',\n    distortion: 0.5,\n    gap: 0.03,\n    glow: 0.8,\n  },\n};\n\nexport const voronoiPresets: VoronoiPreset[] = [defaultPreset, cellsPreset];\n\nexport const Voronoi: React.FC<VoronoiProps> = memo(function VoronoiImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colors = defaultPreset.params.colors,\n  stepsPerColor = defaultPreset.params.stepsPerColor,\n  colorGlow = defaultPreset.params.colorGlow,\n  colorGap = defaultPreset.params.colorGap,\n  distortion = defaultPreset.params.distortion,\n  gap = defaultPreset.params.gap,\n  glow = defaultPreset.params.glow,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: VoronoiProps) {\n  const noiseTexture = typeof window !== 'undefined' && { u_noiseTexture: getShaderNoiseTexture() };\n\n  const uniforms = {\n    // Own uniforms\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_stepsPerColor: stepsPerColor,\n    u_colorGlow: getShaderColorFromString(colorGlow),\n    u_colorGap: getShaderColorFromString(colorGap),\n    u_distortion: distortion,\n    u_gap: gap,\n    u_glow: glow,\n    ...noiseTexture,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies VoronoiUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={voronoiFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
+  "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AA4FH;AAtFG,MAAM,gBAA+B;AAAA,EAC1C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,IACxC,eAAe;AAAA,IACf,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,KAAK;AAAA,IACL,MAAM;AAAA,EACR;AACF;AAEO,MAAM,cAA6B;AAAA,EACxC,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,SAAS;AAAA,IAClB,eAAe;AAAA,IACf,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,KAAK;AAAA,IACL,MAAM;AAAA,EACR;AACF;AAEO,MAAM,iBAAkC,CAAC,eAAe,WAAW;AAEnE,MAAM,UAAkC,KAAK,SAAS,YAAY;AAAA;AAAA,EAEvE,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,SAAS,cAAc,OAAO;AAAA,EAC9B,gBAAgB,cAAc,OAAO;AAAA,EACrC,YAAY,cAAc,OAAO;AAAA,EACjC,WAAW,cAAc,OAAO;AAAA,EAChC,aAAa,cAAc,OAAO;AAAA,EAClC,MAAM,cAAc,OAAO;AAAA,EAC3B,OAAO,cAAc,OAAO;AAAA;AAAA,EAG5B,MAAM,cAAc,OAAO;AAAA,EAC3B,QAAQ,cAAc,OAAO;AAAA,EAC7B,WAAW,cAAc,OAAO;AAAA,EAChC,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAiB;AACf,QAAM,eAAe,OAAO,WAAW,eAAe,EAAE,gBAAgB,sBAAsB,EAAE;AAEhG,QAAM,WAAW;AAAA;AAAA,IAEf,UAAU,OAAO,IAAI,wBAAwB;AAAA,IAC7C,eAAe,OAAO;AAAA,IACtB,iBAAiB;AAAA,IACjB,aAAa,yBAAyB,SAAS;AAAA,IAC/C,YAAY,yBAAyB,QAAQ;AAAA,IAC7C,cAAc;AAAA,IACd,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,GAAG;AAAA;AAAA,IAGH,OAAO,iBAAiB,GAAG;AAAA,IAC3B,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE,oBAAC,eAAa,GAAG,OAAO,OAAc,OAAc,gBAAgB,uBAAuB,UAAoB;AAEnH,GAAG,kBAAkB;",
   "names": []
 }

package/dist/shaders/warp.js

@@ -55,7 +55,7 @@ const presetCauldron = {
     ...defaultPatternSizing,
     scale: 0.9,
     rotation: 160,
-    speed: 20,
+    speed: 10,
     frame: 0,
     colors: ["#a7e58b", "#324472", "#0a180d"],
     proportion: 0.64,
@@ -111,7 +111,7 @@ const presetInk = {
     scale: 1.2,
     rotation: 44,
     offsetY: -0.3,
-    speed: 10,
+    speed: 2.5,
     frame: 0,
     colors: ["#111314", "#9faeab", "#f3fee7", "#f3fee7"],
     proportion: 0.05,
@@ -129,7 +129,7 @@ const presetKelp = {
     ...defaultPatternSizing,
     scale: 0.65,
     rotation: 50,
-    speed: 80,
+    speed: 20,
     frame: 0,
     colors: ["#dbff8f", "#404f3e", "#091316"],
     proportion: 0.67,
@@ -148,7 +148,7 @@ const presetNectar = {
     scale: 2,
     offsetY: 0.6,
     rotation: 0,
-    speed: 30,
+    speed: 4.2,
     frame: 0,
     colors: ["#151310", "#d3a86b", "#f0edea"],
     proportion: 0.24,
@@ -166,7 +166,7 @@ const presetPassion = {
     ...defaultPatternSizing,
     scale: 2.5,
     rotation: 1.35,
-    speed: 15,
+    speed: 3,
     frame: 0,
     colors: ["#3b1515", "#954751", "#ffc085"],
     proportion: 0.5,
@@ -185,7 +185,7 @@ const presetPhantom = {
     scale: 1.2,
     rotation: 180,
     offsetY: -0.2,
-    speed: 30,
+    speed: 12.5,
     frame: 0,
     colors: ["#12112c", "#7b89f2", "#d7dcfb"],
     proportion: 0.5,

package/dist/shaders/warp.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/warp.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  warpFragmentShader,\n  ShaderFitOptions,\n  type WarpParams,\n  type WarpUniforms,\n  type ShaderPreset,\n  WarpPatterns,\n} from '@paper-design/shaders';\n\nexport interface WarpProps extends ShaderComponentProps, WarpParams {}\n\ntype WarpPreset = ShaderPreset<WarpParams>;\n\nexport const defaultPreset: WarpPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    rotation: 0,\n    speed: 1,\n    frame: 0,\n    colors: ['#262626', '#2e383d', '#64a5ce', '#ffffff'],\n    proportion: 0.45,\n    softness: 1,\n    distortion: 0.25,\n    swirl: 0.8,\n    swirlIterations: 10,\n    shapeScale: 0.1,\n    shape: 'checks',\n  },\n};\n\nexport const presetAbyss: WarpPreset = {\n  name: 'The Abyss',\n  params: {\n    ...defaultPatternSizing,\n    scale: 3,\n    rotation: 2,\n    speed: 0.6,\n    frame: 0,\n    colors: ['#15122e', '#7b89f2', '#ffffff'],\n    proportion: 0,\n    softness: 1,\n    distortion: 0.09,\n    swirl: 0.48,\n    swirlIterations: 5,\n    shapeScale: 0.85,\n    shape: 'edge',\n  },\n};\n\nexport const presetCauldron: WarpPreset = {\n  name: 'Cauldron Pot',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.9,\n    rotation: 160,\n    speed: 20,\n    frame: 0,\n    colors: ['#a7e58b', '#324472', '#0a180d'],\n    proportion: 0.64,\n    softness: 1.5,\n    distortion: 0.2,\n    swirl: 0.86,\n    swirlIterations: 7,\n    shapeScale: 0.6,\n    shape: 'edge',\n  },\n};\n\nexport const presetFilteredLight: WarpPreset = {\n  name: 'Filtered Light',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.3,\n    rotation: 45,\n    speed: 3.2,\n    frame: 0,\n    colors: ['#171714', '#d4d8be', '#f9f9e0'],\n    proportion: 0.4,\n    softness: 1,\n    distortion: 0.09,\n    swirl: 0.1,\n    swirlIterations: 0,\n    shapeScale: 0.1,\n    shape: 'stripes',\n  },\n};\n\nexport const presetIceberg: WarpPreset = {\n  name: 'Iceberg',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.8,\n    rotation: 190,\n    offsetX: 0.3,\n    speed: 0.5,\n    frame: 0,\n    colors: ['#ffffff', '#324771', '#0a180d'],\n    proportion: 0.3,\n    softness: 1.2,\n    distortion: 0.2,\n    swirl: 0.86,\n    swirlIterations: 7,\n    shapeScale: 0,\n    shape: 'checks',\n  },\n};\n\nexport const presetInk: WarpPreset = {\n  name: 'Live Ink',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1.2,\n    rotation: 44,\n    offsetY: -0.3,\n    speed: 10,\n    frame: 0,\n    colors: ['#111314', '#9faeab', '#f3fee7', '#f3fee7'],\n    proportion: 0.05,\n    softness: 0,\n    distortion: 0.25,\n    swirl: 0.8,\n    swirlIterations: 10,\n    shapeScale: 0.28,\n    shape: 'checks',\n  },\n};\n\nexport const presetKelp: WarpPreset = {\n  name: 'Kelp',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.65,\n    rotation: 50,\n    speed: 80,\n    frame: 0,\n    colors: ['#dbff8f', '#404f3e', '#091316'],\n    proportion: 0.67,\n    softness: 0.05,\n    distortion: 0,\n    swirl: 0.15,\n    swirlIterations: 0,\n    shapeScale: 0.74,\n    shape: 'stripes',\n  },\n};\n\nexport const presetNectar: WarpPreset = {\n  name: 'Nectar',\n  params: {\n    ...defaultPatternSizing,\n    scale: 2,\n    offsetY: 0.6,\n    rotation: 0,\n    speed: 30,\n    frame: 0,\n    colors: ['#151310', '#d3a86b', '#f0edea'],\n    proportion: 0.24,\n    softness: 1,\n    distortion: 0.21,\n    swirl: 0.57,\n    swirlIterations: 10,\n    shapeScale: 0.75,\n    shape: 'edge',\n  },\n};\n\nexport const presetPassion: WarpPreset = {\n  name: 'Passion',\n  params: {\n    ...defaultPatternSizing,\n    scale: 2.5,\n    rotation: 1.35,\n    speed: 15,\n    frame: 0,\n    colors: ['#3b1515', '#954751', '#ffc085'],\n    proportion: 0.5,\n    softness: 1,\n    distortion: 0.09,\n    swirl: 0.9,\n    swirlIterations: 6,\n    shapeScale: 0.25,\n    shape: 'checks',\n  },\n};\n\nexport const presetPhantom: WarpPreset = {\n  name: 'Phantom',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1.2,\n    rotation: 180,\n    offsetY: -0.2,\n    speed: 30,\n    frame: 0,\n    colors: ['#12112c', '#7b89f2', '#d7dcfb'],\n    proportion: 0.5,\n    softness: 1,\n    distortion: 0.2,\n    swirl: 0.3,\n    swirlIterations: 7,\n    shapeScale: 0.1,\n    shape: 'checks',\n  },\n};\n\nexport const presetSilk: WarpPreset = {\n  name: 'Silk',\n  params: {\n    ...defaultPatternSizing,\n    scale: 2,\n    rotation: 0,\n    speed: 5,\n    frame: 0,\n    colors: ['#141111', '#665551', '#baaea9'],\n    proportion: 0,\n    softness: 1,\n    distortion: 0.3,\n    swirl: 0.6,\n    swirlIterations: 11,\n    shapeScale: 0.25,\n    shape: 'stripes',\n  },\n};\n\nexport const warpPresets: WarpPreset[] = [\n  defaultPreset,\n  presetAbyss,\n  presetCauldron,\n  presetFilteredLight,\n  presetIceberg,\n  presetInk,\n  presetKelp,\n  presetNectar,\n  presetPassion,\n  presetPhantom,\n  presetSilk,\n];\n\nexport const Warp: React.FC<WarpProps> = memo(function WarpImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colors = defaultPreset.params.colors,\n  proportion = defaultPreset.params.proportion,\n  softness = defaultPreset.params.softness,\n  distortion = defaultPreset.params.distortion,\n  swirl = defaultPreset.params.swirl,\n  swirlIterations = defaultPreset.params.swirlIterations,\n  shapeScale = defaultPreset.params.shapeScale,\n  shape = defaultPreset.params.shape,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: WarpProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_proportion: proportion,\n    u_softness: softness,\n    u_distortion: distortion,\n    u_swirl: swirl,\n    u_swirlIterations: swirlIterations,\n    u_shapeScale: shapeScale,\n    u_shape: WarpPatterns[shape],\n\n    // Sizing uniforms\n    u_scale: scale,\n    u_rotation: rotation,\n    u_fit: ShaderFitOptions[fit],\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies WarpUniforms;\n\n  return <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={warpFragmentShader} uniforms={uniforms} />;\n}, colorPropsAreEqual);\n"],
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  warpFragmentShader,\n  ShaderFitOptions,\n  type WarpParams,\n  type WarpUniforms,\n  type ShaderPreset,\n  WarpPatterns,\n} from '@paper-design/shaders';\n\nexport interface WarpProps extends ShaderComponentProps, WarpParams {}\n\ntype WarpPreset = ShaderPreset<WarpParams>;\n\nexport const defaultPreset: WarpPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    rotation: 0,\n    speed: 1,\n    frame: 0,\n    colors: ['#262626', '#2e383d', '#64a5ce', '#ffffff'],\n    proportion: 0.45,\n    softness: 1,\n    distortion: 0.25,\n    swirl: 0.8,\n    swirlIterations: 10,\n    shapeScale: 0.1,\n    shape: 'checks',\n  },\n};\n\nexport const presetAbyss: WarpPreset = {\n  name: 'The Abyss',\n  params: {\n    ...defaultPatternSizing,\n    scale: 3,\n    rotation: 2,\n    speed: 0.6,\n    frame: 0,\n    colors: ['#15122e', '#7b89f2', '#ffffff'],\n    proportion: 0,\n    softness: 1,\n    distortion: 0.09,\n    swirl: 0.48,\n    swirlIterations: 5,\n    shapeScale: 0.85,\n    shape: 'edge',\n  },\n};\n\nexport const presetCauldron: WarpPreset = {\n  name: 'Cauldron Pot',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.9,\n    rotation: 160,\n    speed: 10,\n    frame: 0,\n    colors: ['#a7e58b', '#324472', '#0a180d'],\n    proportion: 0.64,\n    softness: 1.5,\n    distortion: 0.2,\n    swirl: 0.86,\n    swirlIterations: 7,\n    shapeScale: 0.6,\n    shape: 'edge',\n  },\n};\n\nexport const presetFilteredLight: WarpPreset = {\n  name: 'Filtered Light',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.3,\n    rotation: 45,\n    speed: 3.2,\n    frame: 0,\n    colors: ['#171714', '#d4d8be', '#f9f9e0'],\n    proportion: 0.4,\n    softness: 1,\n    distortion: 0.09,\n    swirl: 0.1,\n    swirlIterations: 0,\n    shapeScale: 0.1,\n    shape: 'stripes',\n  },\n};\n\nexport const presetIceberg: WarpPreset = {\n  name: 'Iceberg',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.8,\n    rotation: 190,\n    offsetX: 0.3,\n    speed: 0.5,\n    frame: 0,\n    colors: ['#ffffff', '#324771', '#0a180d'],\n    proportion: 0.3,\n    softness: 1.2,\n    distortion: 0.2,\n    swirl: 0.86,\n    swirlIterations: 7,\n    shapeScale: 0,\n    shape: 'checks',\n  },\n};\n\nexport const presetInk: WarpPreset = {\n  name: 'Live Ink',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1.2,\n    rotation: 44,\n    offsetY: -0.3,\n    speed: 2.5,\n    frame: 0,\n    colors: ['#111314', '#9faeab', '#f3fee7', '#f3fee7'],\n    proportion: 0.05,\n    softness: 0,\n    distortion: 0.25,\n    swirl: 0.8,\n    swirlIterations: 10,\n    shapeScale: 0.28,\n    shape: 'checks',\n  },\n};\n\nexport const presetKelp: WarpPreset = {\n  name: 'Kelp',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.65,\n    rotation: 50,\n    speed: 20,\n    frame: 0,\n    colors: ['#dbff8f', '#404f3e', '#091316'],\n    proportion: 0.67,\n    softness: 0.05,\n    distortion: 0,\n    swirl: 0.15,\n    swirlIterations: 0,\n    shapeScale: 0.74,\n    shape: 'stripes',\n  },\n};\n\nexport const presetNectar: WarpPreset = {\n  name: 'Nectar',\n  params: {\n    ...defaultPatternSizing,\n    scale: 2,\n    offsetY: 0.6,\n    rotation: 0,\n    speed: 4.2,\n    frame: 0,\n    colors: ['#151310', '#d3a86b', '#f0edea'],\n    proportion: 0.24,\n    softness: 1,\n    distortion: 0.21,\n    swirl: 0.57,\n    swirlIterations: 10,\n    shapeScale: 0.75,\n    shape: 'edge',\n  },\n};\n\nexport const presetPassion: WarpPreset = {\n  name: 'Passion',\n  params: {\n    ...defaultPatternSizing,\n    scale: 2.5,\n    rotation: 1.35,\n    speed: 3,\n    frame: 0,\n    colors: ['#3b1515', '#954751', '#ffc085'],\n    proportion: 0.5,\n    softness: 1,\n    distortion: 0.09,\n    swirl: 0.9,\n    swirlIterations: 6,\n    shapeScale: 0.25,\n    shape: 'checks',\n  },\n};\n\nexport const presetPhantom: WarpPreset = {\n  name: 'Phantom',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1.2,\n    rotation: 180,\n    offsetY: -0.2,\n    speed: 12.5,\n    frame: 0,\n    colors: ['#12112c', '#7b89f2', '#d7dcfb'],\n    proportion: 0.5,\n    softness: 1,\n    distortion: 0.2,\n    swirl: 0.3,\n    swirlIterations: 7,\n    shapeScale: 0.1,\n    shape: 'checks',\n  },\n};\n\nexport const presetSilk: WarpPreset = {\n  name: 'Silk',\n  params: {\n    ...defaultPatternSizing,\n    scale: 2,\n    rotation: 0,\n    speed: 5,\n    frame: 0,\n    colors: ['#141111', '#665551', '#baaea9'],\n    proportion: 0,\n    softness: 1,\n    distortion: 0.3,\n    swirl: 0.6,\n    swirlIterations: 11,\n    shapeScale: 0.25,\n    shape: 'stripes',\n  },\n};\n\nexport const warpPresets: WarpPreset[] = [\n  defaultPreset,\n  presetAbyss,\n  presetCauldron,\n  presetFilteredLight,\n  presetIceberg,\n  presetInk,\n  presetKelp,\n  presetNectar,\n  presetPassion,\n  presetPhantom,\n  presetSilk,\n];\n\nexport const Warp: React.FC<WarpProps> = memo(function WarpImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colors = defaultPreset.params.colors,\n  proportion = defaultPreset.params.proportion,\n  softness = defaultPreset.params.softness,\n  distortion = defaultPreset.params.distortion,\n  swirl = defaultPreset.params.swirl,\n  swirlIterations = defaultPreset.params.swirlIterations,\n  shapeScale = defaultPreset.params.shapeScale,\n  shape = defaultPreset.params.shape,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: WarpProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_proportion: proportion,\n    u_softness: softness,\n    u_distortion: distortion,\n    u_swirl: swirl,\n    u_swirlIterations: swirlIterations,\n    u_shapeScale: shapeScale,\n    u_shape: WarpPatterns[shape],\n\n    // Sizing uniforms\n    u_scale: scale,\n    u_rotation: rotation,\n    u_fit: ShaderFitOptions[fit],\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies WarpUniforms;\n\n  return <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={warpFragmentShader} uniforms={uniforms} />;\n}, colorPropsAreEqual);\n"],
   "mappings": "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",
   "names": []
 }

package/dist/shaders/waves.d.ts

@@ -4,10 +4,8 @@ export interface WavesProps extends ShaderComponentProps, WavesParams {
 }
 type WavesPreset = ShaderPreset<WavesParams>;
 export declare const defaultPreset: WavesPreset;
-export declare const spikesPreset: WavesPreset;
 export declare const groovyPreset: WavesPreset;
 export declare const tangledUpPreset: WavesPreset;
-export declare const zigZagPreset: WavesPreset;
 export declare const waveRidePreset: WavesPreset;
 export declare const wavesPresets: WavesPreset[];
 export declare const Waves: React.FC<WavesProps>;

package/dist/shaders/waves.js

@@ -17,8 +17,7 @@ const defaultPreset = {
   name: "Default",
   params: {
     ...defaultPatternSizing,
-    scale: 1.6,
-    rotation: 0,
+    scale: 1,
     colorFront: "#ffffff",
     colorBack: "#102c70",
     shape: 0,
@@ -26,36 +25,20 @@ const defaultPreset = {
     amplitude: 0.6,
     spacing: 0.65,
     proportion: 0.15,
-    softness: 0
-  }
-};
-const spikesPreset = {
-  name: "Spikes",
-  params: {
-    ...defaultPatternSizing,
-    scale: 1 / 2.3,
-    rotation: 0,
-    colorFront: "#fdffe6",
-    colorBack: "#34123b",
-    shape: 0,
-    frequency: 0.5,
-    amplitude: 0.9,
-    spacing: 0.37,
-    proportion: 0.93,
-    softness: 0.15
+    softness: 0.05
   }
 };
 const groovyPreset = {
   name: "Groovy",
   params: {
     ...defaultPatternSizing,
-    scale: 1 / 0.5,
-    rotation: 1,
+    scale: 5,
+    rotation: 90,
     colorFront: "#fcfcee",
     colorBack: "#ff896b",
-    shape: 2.37,
+    shape: 3,
     frequency: 0.2,
-    amplitude: 0.67,
+    amplitude: 0.25,
     spacing: 1.17,
     proportion: 0.57,
     softness: 0
@@ -65,58 +48,35 @@ const tangledUpPreset = {
   name: "Tangled up",
   params: {
     ...defaultPatternSizing,
-    scale: 1 / 3.04,
-    rotation: 1,
+    scale: 0.5,
+    rotation: 0,
     colorFront: "#133a41",
     colorBack: "#c2d8b6",
     shape: 3,
     frequency: 0.44,
     amplitude: 0.57,
     spacing: 1.05,
-    proportion: 0.97,
-    softness: 0
-  }
-};
-const zigZagPreset = {
-  name: "Zig zag",
-  params: {
-    ...defaultPatternSizing,
-    scale: 1 / 2.7,
-    rotation: 1,
-    colorFront: "#000000",
-    colorBack: "#e6e6e6",
-    shape: 0,
-    frequency: 0.6,
-    amplitude: 0.8,
-    spacing: 0.5,
-    proportion: 1,
-    softness: 0.5
+    proportion: 0.75,
+    softness: 0.02
   }
 };
 const waveRidePreset = {
   name: "Ride the wave",
   params: {
     ...defaultPatternSizing,
-    scale: 1 / 0.84,
+    scale: 1.7,
     rotation: 0,
     colorFront: "#fdffe6",
     colorBack: "#1f1f1f",
-    shape: 2.23,
-    frequency: 0.1,
-    amplitude: 0.6,
-    spacing: 0.41,
-    proportion: 0.99,
+    shape: 2.25,
+    frequency: 0.2,
+    amplitude: 1,
+    spacing: 1.25,
+    proportion: 1,
     softness: 0
   }
 };
-const wavesPresets = [
-  defaultPreset,
-  spikesPreset,
-  groovyPreset,
-  tangledUpPreset,
-  zigZagPreset,
-  waveRidePreset
-];
+const wavesPresets = [defaultPreset, groovyPreset, tangledUpPreset, waveRidePreset];
 const Waves = memo(function WavesImpl({
   // Own props
   colorFront = defaultPreset.params.colorFront,
@@ -169,10 +129,8 @@ export {
   Waves,
   defaultPreset,
   groovyPreset,
-  spikesPreset,
   tangledUpPreset,
   waveRidePreset,
-  wavesPresets,
-  zigZagPreset
+  wavesPresets
 };
 //# sourceMappingURL=waves.js.map

package/dist/shaders/waves.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/waves.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  wavesFragmentShader,\n  ShaderFitOptions,\n  type WavesParams,\n  type WavesUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface WavesProps extends ShaderComponentProps, WavesParams {}\n\ntype WavesPreset = ShaderPreset<WavesParams>;\n\nexport const defaultPreset: WavesPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1.6,\n    rotation: 0,\n    colorFront: '#ffffff',\n    colorBack: '#102c70',\n    shape: 0,\n    frequency: 0.5,\n    amplitude: 0.6,\n    spacing: 0.65,\n    proportion: 0.15,\n    softness: 0,\n  },\n};\n\nexport const spikesPreset: WavesPreset = {\n  name: 'Spikes',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 2.3,\n    rotation: 0,\n    colorFront: '#fdffe6',\n    colorBack: '#34123b',\n    shape: 0,\n    frequency: 0.5,\n    amplitude: 0.9,\n    spacing: 0.37,\n    proportion: 0.93,\n    softness: 0.15,\n  },\n};\n\nexport const groovyPreset: WavesPreset = {\n  name: 'Groovy',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 0.5,\n    rotation: 1,\n    colorFront: '#fcfcee',\n    colorBack: '#ff896b',\n    shape: 2.37,\n    frequency: 0.2,\n    amplitude: 0.67,\n    spacing: 1.17,\n    proportion: 0.57,\n    softness: 0,\n  },\n};\n\nexport const tangledUpPreset: WavesPreset = {\n  name: 'Tangled up',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 3.04,\n    rotation: 1,\n    colorFront: '#133a41',\n    colorBack: '#c2d8b6',\n    shape: 3,\n    frequency: 0.44,\n    amplitude: 0.57,\n    spacing: 1.05,\n    proportion: 0.97,\n    softness: 0,\n  },\n};\n\nexport const zigZagPreset: WavesPreset = {\n  name: 'Zig zag',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 2.7,\n    rotation: 1,\n    colorFront: '#000000',\n    colorBack: '#e6e6e6',\n    shape: 0,\n    frequency: 0.6,\n    amplitude: 0.8,\n    spacing: 0.5,\n    proportion: 1,\n    softness: 0.5,\n  },\n};\n\nexport const waveRidePreset: WavesPreset = {\n  name: 'Ride the wave',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 0.84,\n    rotation: 0,\n    colorFront: '#fdffe6',\n    colorBack: '#1f1f1f',\n    shape: 2.23,\n    frequency: 0.1,\n    amplitude: 0.6,\n    spacing: 0.41,\n    proportion: 0.99,\n    softness: 0,\n  },\n};\n\nexport const wavesPresets: WavesPreset[] = [\n  defaultPreset,\n  spikesPreset,\n  groovyPreset,\n  tangledUpPreset,\n  zigZagPreset,\n  waveRidePreset,\n];\n\nexport const Waves: React.FC<WavesProps> = memo(function WavesImpl({\n  // Own props\n  colorFront = defaultPreset.params.colorFront,\n  colorBack = defaultPreset.params.colorBack,\n  shape = defaultPreset.params.shape,\n  frequency = defaultPreset.params.frequency,\n  amplitude = defaultPreset.params.amplitude,\n  spacing = defaultPreset.params.spacing,\n  proportion = defaultPreset.params.proportion,\n  softness = defaultPreset.params.softness,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n\n  // Other props\n  maxPixelCount = 6016 * 3384, // Higher max resolution for this shader\n  ...props\n}: WavesProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorFront: getShaderColorFromString(colorFront),\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_shape: shape,\n    u_frequency: frequency,\n    u_amplitude: amplitude,\n    u_spacing: spacing,\n    u_proportion: proportion,\n    u_softness: softness,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies WavesUniforms;\n\n  return <ShaderMount {...props} fragmentShader={wavesFragmentShader} uniforms={uniforms} />;\n}, colorPropsAreEqual);\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  wavesFragmentShader,\n  ShaderFitOptions,\n  type WavesParams,\n  type WavesUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface WavesProps extends ShaderComponentProps, WavesParams {}\n\ntype WavesPreset = ShaderPreset<WavesParams>;\n\nexport const defaultPreset: WavesPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1,\n    colorFront: '#ffffff',\n    colorBack: '#102c70',\n    shape: 0,\n    frequency: 0.5,\n    amplitude: 0.6,\n    spacing: 0.65,\n    proportion: 0.15,\n    softness: 0.05,\n  },\n};\n\nexport const groovyPreset: WavesPreset = {\n  name: 'Groovy',\n  params: {\n    ...defaultPatternSizing,\n    scale: 5,\n    rotation: 90,\n    colorFront: '#fcfcee',\n    colorBack: '#ff896b',\n    shape: 3,\n    frequency: 0.2,\n    amplitude: 0.25,\n    spacing: 1.17,\n    proportion: 0.57,\n    softness: 0,\n  },\n};\n\nexport const tangledUpPreset: WavesPreset = {\n  name: 'Tangled up',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.5,\n    rotation: 0,\n    colorFront: '#133a41',\n    colorBack: '#c2d8b6',\n    shape: 3,\n    frequency: 0.44,\n    amplitude: 0.57,\n    spacing: 1.05,\n    proportion: 0.75,\n    softness: 0.02,\n  },\n};\n\nexport const waveRidePreset: WavesPreset = {\n  name: 'Ride the wave',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1.7,\n    rotation: 0,\n    colorFront: '#fdffe6',\n    colorBack: '#1f1f1f',\n    shape: 2.25,\n    frequency: 0.2,\n    amplitude: 1,\n    spacing: 1.25,\n    proportion: 1,\n    softness: 0,\n  },\n};\n\nexport const wavesPresets: WavesPreset[] = [defaultPreset, groovyPreset, tangledUpPreset, waveRidePreset];\n\nexport const Waves: React.FC<WavesProps> = memo(function WavesImpl({\n  // Own props\n  colorFront = defaultPreset.params.colorFront,\n  colorBack = defaultPreset.params.colorBack,\n  shape = defaultPreset.params.shape,\n  frequency = defaultPreset.params.frequency,\n  amplitude = defaultPreset.params.amplitude,\n  spacing = defaultPreset.params.spacing,\n  proportion = defaultPreset.params.proportion,\n  softness = defaultPreset.params.softness,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n\n  // Other props\n  maxPixelCount = 6016 * 3384, // Higher max resolution for this shader\n  ...props\n}: WavesProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorFront: getShaderColorFromString(colorFront),\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_shape: shape,\n    u_frequency: frequency,\n    u_amplitude: amplitude,\n    u_spacing: spacing,\n    u_proportion: proportion,\n    u_softness: softness,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies WavesUniforms;\n\n  return <ShaderMount {...props} fragmentShader={wavesFragmentShader} uniforms={uniforms} />;\n}, colorPropsAreEqual);\n"],
+  "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AA4HE;AAtHF,MAAM,gBAA6B;AAAA,EACxC,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,OAAO;AAAA,IACP,WAAW;AAAA,IACX,WAAW;AAAA,IACX,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,EACZ;AACF;AAEO,MAAM,eAA4B;AAAA,EACvC,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,OAAO;AAAA,IACP,WAAW;AAAA,IACX,WAAW;AAAA,IACX,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,EACZ;AACF;AAEO,MAAM,kBAA+B;AAAA,EAC1C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,OAAO;AAAA,IACP,WAAW;AAAA,IACX,WAAW;AAAA,IACX,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,EACZ;AACF;AAEO,MAAM,iBAA8B;AAAA,EACzC,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,OAAO;AAAA,IACP,WAAW;AAAA,IACX,WAAW;AAAA,IACX,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,EACZ;AACF;AAEO,MAAM,eAA8B,CAAC,eAAe,cAAc,iBAAiB,cAAc;AAEjG,MAAM,QAA8B,KAAK,SAAS,UAAU;AAAA;AAAA,EAEjE,aAAa,cAAc,OAAO;AAAA,EAClC,YAAY,cAAc,OAAO;AAAA,EACjC,QAAQ,cAAc,OAAO;AAAA,EAC7B,YAAY,cAAc,OAAO;AAAA,EACjC,YAAY,cAAc,OAAO;AAAA,EACjC,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,WAAW,cAAc,OAAO;AAAA;AAAA,EAGhC,MAAM,cAAc,OAAO;AAAA,EAC3B,QAAQ,cAAc,OAAO;AAAA,EAC7B,WAAW,cAAc,OAAO;AAAA,EAChC,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA;AAAA,EAGnC,gBAAgB,OAAO;AAAA;AAAA,EACvB,GAAG;AACL,GAAe;AACb,QAAM,WAAW;AAAA;AAAA,IAEf,cAAc,yBAAyB,UAAU;AAAA,IACjD,aAAa,yBAAyB,SAAS;AAAA,IAC/C,SAAS;AAAA,IACT,aAAa;AAAA,IACb,aAAa;AAAA,IACb,WAAW;AAAA,IACX,cAAc;AAAA,IACd,YAAY;AAAA;AAAA,IAGZ,OAAO,iBAAiB,GAAG;AAAA,IAC3B,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SAAO,oBAAC,eAAa,GAAG,OAAO,gBAAgB,qBAAqB,UAAoB;AAC1F,GAAG,kBAAkB;",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paper-design/shaders-react",
-  "version": "0.0.40",
+  "version": "0.0.42",
   "license": "MIT",
   "type": "module",
   "sideEffects": false,
@@ -24,7 +24,7 @@
     "type-check": "tsc --project tsconfig.json"
   },
   "dependencies": {
-    "@paper-design/shaders": "0.0.36"
+    "@paper-design/shaders": "0.0.38"
   },
   "devDependencies": {
     "@types/react": "19.1.0"