@paper-design/shaders-react 0.0.14 → 0.0.16

package/dist/index.d.ts

@@ -1,6 +1,11 @@
-export { ShaderMount } from "./shader-mount";
-export { GrainClouds } from "./shaders/grain-clouds";
-export { type GrainCloudsUniforms } from "@paper-design/shaders";
-export { MeshGradient } from "./shaders/mesh-gradient";
-export { type MeshGradientUniforms } from "@paper-design/shaders";
-export { getShaderColorFromString } from "@paper-design/shaders";
+export { ShaderMount } from './shader-mount';
+export { GrainClouds, grainCloudsDefaults } from './shaders/grain-clouds';
+export { type GrainCloudsProps } from './shaders/grain-clouds';
+export { type GrainCloudsUniforms } from '@paper-design/shaders';
+export { MeshGradient, meshGradientDefaults } from './shaders/mesh-gradient';
+export { type MeshGradientProps } from './shaders/mesh-gradient';
+export { type MeshGradientUniforms } from '@paper-design/shaders';
+export { NeuroNoise, neuroNoiseDefaults } from './shaders/neuro-noise';
+export { type NeuroNoiseProps } from './shaders/neuro-noise';
+export { type NeuroNoiseUniforms } from '@paper-design/shaders';
+export { getShaderColorFromString } from '@paper-design/shaders';

package/dist/index.js

@@ -1,2 +1,3 @@
-import{useEffect as s,useRef as l}from"react";import{ShaderMount as f}from"@paper-design/shaders";import{jsx as S}from"react/jsx-runtime";var n=({ref:r,fragmentShader:o,style:d,uniforms:a={},webGlContextAttributes:m,animated:i=!0})=>{let u=r??l(null),e=l(null);return s(()=>(u.current&&(e.current=new f(u.current,o,a,m,i)),()=>{e.current&&e.current.dispose()}),[o,m]),s(()=>{e.current&&e.current.setUniforms(a)},[a]),s(()=>{e.current&&(i?e.current.startAnimating():e.current.stopAnimating())},[i]),S("canvas",{ref:u,style:d})};import{useMemo as h}from"react";import{getShaderColorFromString as c,grainCloudsFragmentShader as g}from"@paper-design/shaders";import{jsx as C}from"react/jsx-runtime";var M=r=>{let o=h(()=>({u_color1:c(r.color1,[0,0,0]),u_color2:c(r.color2,[255,255,255]),u_noiseScale:r.noiseScale??1,u_noiseSpeed:r.noiseSpeed??.3,u_grainAmount:r.grainAmount??.05}),[r.color1,r.color2,r.noiseScale,r.noiseSpeed,r.grainAmount]);return C(n,{...r,fragmentShader:g,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as G}from"react";import{getShaderColorFromString as t,meshGradientFragmentShader as P}from"@paper-design/shaders";import{jsx as y}from"react/jsx-runtime";var b=r=>{let o=G(()=>({u_color1:t(r.color1,[.957,.804,.623]),u_color2:t(r.color2,[.192,.384,.933]),u_color3:t(r.color3,[.91,.51,.8]),u_color4:t(r.color4,[.35,.71,.953]),u_speed:r.speed??.1}),[r.color1,r.color2,r.color3,r.color4,r.speed]);return y(n,{...r,fragmentShader:P,uniforms:o})};import{}from"@paper-design/shaders";import{getShaderColorFromString as D}from"@paper-design/shaders";export{M as GrainClouds,b as MeshGradient,n as ShaderMount,D as getShaderColorFromString};
+/***** Paper Shaders: https://github.com/paper-design/shaders *****/
+import{useEffect as m,useRef as f}from"react";import{ShaderMount as M}from"@paper-design/shaders";import{jsx as p}from"react/jsx-runtime";var t=({ref:o,fragmentShader:r,style:g,uniforms:u={},webGlContextAttributes:d,animated:l=!0})=>{let c=o??f(null),e=f(null);return m(()=>(c.current&&(e.current=new M(c.current,r,u,d,l)),()=>{e.current&&e.current.dispose()}),[r,d]),m(()=>{e.current&&e.current.setUniforms(u)},[u]),m(()=>{e.current&&(l?e.current.startAnimating():e.current.stopAnimating())},[l]),p("canvas",{ref:c,style:g})};import{useMemo as b}from"react";import{getShaderColorFromString as S,grainCloudsFragmentShader as C}from"@paper-design/shaders";import{jsx as x}from"react/jsx-runtime";var n={color1:"#000000",color2:"#ffffff",noiseScale:1,noiseSpeed:.3,grainAmount:.05},G=o=>{let r=b(()=>({u_color1:S(o.color1,n.color1),u_color2:S(o.color2,n.color2),u_noiseScale:o.noiseScale??n.noiseScale,u_noiseSpeed:o.noiseSpeed??n.noiseSpeed,u_grainAmount:o.grainAmount??n.grainAmount}),[o.color1,o.color2,o.noiseScale,o.noiseSpeed,o.grainAmount]);return x(t,{...o,fragmentShader:C,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as N}from"react";import{getShaderColorFromString as i,meshGradientFragmentShader as P}from"@paper-design/shaders";import{jsx as _}from"react/jsx-runtime";var s={color1:"#6a5496",color2:"#9b8ab8",color3:"#f5d03b",color4:"#e48b97",speed:.1},y=o=>{let r=N(()=>({u_color1:i(o.color1,s.color1),u_color2:i(o.color2,s.color2),u_color3:i(o.color3,s.color3),u_color4:i(o.color4,s.color4),u_speed:o.speed??s.speed}),[o.color1,o.color2,o.color3,o.color4,o.speed]);return _(t,{...o,fragmentShader:P,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as F}from"react";import{getShaderColorFromString as h,neuroNoiseFragmentShader as U}from"@paper-design/shaders";import{jsx as R}from"react/jsx-runtime";var a={colorFront:"#c3a3ff",colorBack:"#000000",scale:1,speed:1,brightness:1.3},A=o=>{let r=F(()=>({u_colorFront:h(o.colorFront,a.colorFront),u_colorBack:h(o.colorBack,a.colorBack),u_scale:o.scale??a.scale,u_speed:o.speed??a.speed,u_brightness:o.brightness??a.brightness}),[o.colorFront,o.colorBack,o.scale,o.speed,o.brightness]);return R(t,{...o,fragmentShader:U,uniforms:r})};import{}from"@paper-design/shaders";import{getShaderColorFromString as lo}from"@paper-design/shaders";export{G as GrainClouds,y as MeshGradient,A as NeuroNoise,t as ShaderMount,lo as getShaderColorFromString,n as grainCloudsDefaults,s as meshGradientDefaults,a as neuroNoiseDefaults};
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/shader-mount.tsx", "../src/shaders/grain-clouds.tsx", "../src/index.ts", "../src/shaders/mesh-gradient.tsx"],
-  "sourcesContent": ["import React, { useEffect, useRef } from 'react';\nimport { ShaderMount as ShaderMountVanilla } from '@paper-design/shaders';\n\nexport interface ShaderMountProps {\n  ref?: React.RefObject<HTMLCanvasElement>;\n  fragmentShader: string;\n  style?: React.CSSProperties;\n  uniforms?: Record<string, number | number[]>;\n  webGlContextAttributes?: WebGLContextAttributes;\n  animated?: boolean;\n}\n\nexport const ShaderMount: React.FC<ShaderMountProps> = ({\n  ref,\n  fragmentShader,\n  style,\n  uniforms = {},\n  webGlContextAttributes,\n  animated = true,\n}) => {\n  const canvasRef = ref ?? useRef<HTMLCanvasElement>(null);\n  const shaderMountRef = useRef<ShaderMountVanilla | null>(null);\n\n  useEffect(() => {\n    if (canvasRef.current) {\n      shaderMountRef.current = new ShaderMountVanilla(\n        canvasRef.current,\n        fragmentShader,\n        uniforms,\n        webGlContextAttributes,\n        animated\n      );\n    }\n\n    return () => {\n      if (shaderMountRef.current) {\n        shaderMountRef.current.dispose();\n      }\n    };\n  }, [fragmentShader, webGlContextAttributes]);\n\n  useEffect(() => {\n    if (shaderMountRef.current) {\n      shaderMountRef.current.setUniforms(uniforms);\n    }\n  }, [uniforms]);\n\n  useEffect(() => {\n    if (shaderMountRef.current) {\n      if (animated) {\n        shaderMountRef.current.startAnimating();\n      } else {\n        shaderMountRef.current.stopAnimating();\n      }\n    }\n  }, [animated]);\n\n  return <canvas ref={canvasRef} style={style} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, grainCloudsFragmentShader, type GrainCloudsUniforms } from '@paper-design/shaders';\n\ntype GrainCloudsProps = Omit<ShaderMountProps, 'fragmentShader'> & {\n  color1?: string;\n  color2?: string;\n  noiseScale?: number;\n  noiseSpeed?: number;\n  grainAmount?: number;\n};\n\nexport const GrainClouds = (props: GrainCloudsProps): JSX.Element => {\n  const uniforms: GrainCloudsUniforms = useMemo(() => {\n    return {\n      u_color1: getShaderColorFromString(props.color1, [0, 0, 0]),\n      u_color2: getShaderColorFromString(props.color2, [255, 255, 255]),\n      u_noiseScale: props.noiseScale ?? 1,\n      u_noiseSpeed: props.noiseSpeed ?? 0.3,\n      u_grainAmount: props.grainAmount ?? 0.05,\n    };\n  }, [props.color1, props.color2, props.noiseScale, props.noiseSpeed, props.grainAmount]);\n\n  return <ShaderMount {...props} fragmentShader={grainCloudsFragmentShader} uniforms={uniforms} />;\n};\n", "// ----- ShaderMount ----- //\nexport { ShaderMount } from \"./shader-mount\";\n\n// ----- Fragment shaders ----- //\nexport { GrainClouds } from \"./shaders/grain-clouds\";\nexport { type GrainCloudsUniforms } from \"@paper-design/shaders\";\nexport { MeshGradient } from \"./shaders/mesh-gradient\";\nexport { type MeshGradientUniforms } from \"@paper-design/shaders\";\n\n// ----- Uniform conversion utils ----- //\nexport { getShaderColorFromString } from \"@paper-design/shaders\";\n", "import { useMemo } from 'react';\nimport { ShaderMount, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, meshGradientFragmentShader, type MeshGradientUniforms } from '@paper-design/shaders';\n\ntype MeshGradientProps = Omit<ShaderMountProps, 'fragmentShader'> & {\n  color1?: string;\n  color2?: string;\n  color3?: string;\n  color4?: string;\n  speed?: number;\n};\n\nexport const MeshGradient = (props: MeshGradientProps): JSX.Element => {\n  const uniforms: MeshGradientUniforms = useMemo(() => {\n    return {\n      u_color1: getShaderColorFromString(props.color1, [0.957, 0.804, 0.623]),\n      u_color2: getShaderColorFromString(props.color2, [0.192, 0.384, 0.933]),\n      u_color3: getShaderColorFromString(props.color3, [0.91, 0.51, 0.8]),\n      u_color4: getShaderColorFromString(props.color4, [0.35, 0.71, 0.953]),\n      u_speed: props.speed ?? 0.1,\n    };\n  }, [props.color1, props.color2, props.color3, props.color4, props.speed]);\n\n  return <ShaderMount {...props} fragmentShader={meshGradientFragmentShader} uniforms={uniforms} />;\n};\n"],
-  "mappings": "AAAA,OAAgB,aAAAA,EAAW,UAAAC,MAAc,QACzC,OAAS,eAAeC,MAA0B,wBAwDzC,cAAAC,MAAA,oBA7CF,IAAMC,EAA0C,CAAC,CACtD,IAAAC,EACA,eAAAC,EACA,MAAAC,EACA,SAAAC,EAAW,CAAC,EACZ,uBAAAC,EACA,SAAAC,EAAW,EACb,IAAM,CACJ,IAAMC,EAAYN,GAAOJ,EAA0B,IAAI,EACjDW,EAAiBX,EAAkC,IAAI,EAE7D,OAAAD,EAAU,KACJW,EAAU,UACZC,EAAe,QAAU,IAAIV,EAC3BS,EAAU,QACVL,EACAE,EACAC,EACAC,CACF,GAGK,IAAM,CACPE,EAAe,SACjBA,EAAe,QAAQ,QAAQ,CAEnC,GACC,CAACN,EAAgBG,CAAsB,CAAC,EAE3CT,EAAU,IAAM,CACVY,EAAe,SACjBA,EAAe,QAAQ,YAAYJ,CAAQ,CAE/C,EAAG,CAACA,CAAQ,CAAC,EAEbR,EAAU,IAAM,CACVY,EAAe,UACbF,EACFE,EAAe,QAAQ,eAAe,EAEtCA,EAAe,QAAQ,cAAc,EAG3C,EAAG,CAACF,CAAQ,CAAC,EAENP,EAAC,UAAO,IAAKQ,EAAW,MAAOJ,EAAO,CAC/C,EC1DA,OAAS,WAAAM,MAAe,QAExB,OAAS,4BAAAC,EAA0B,6BAAAC,MAA2D,wBAqBrF,cAAAC,MAAA,oBAXF,IAAMC,EAAeC,GAAyC,CACnE,IAAMC,EAAgCC,EAAQ,KACrC,CACL,SAAUN,EAAyBI,EAAM,OAAQ,CAAC,EAAG,EAAG,CAAC,CAAC,EAC1D,SAAUJ,EAAyBI,EAAM,OAAQ,CAAC,IAAK,IAAK,GAAG,CAAC,EAChE,aAAcA,EAAM,YAAc,EAClC,aAAcA,EAAM,YAAc,GAClC,cAAeA,EAAM,aAAe,GACtC,GACC,CAACA,EAAM,OAAQA,EAAM,OAAQA,EAAM,WAAYA,EAAM,WAAYA,EAAM,WAAW,CAAC,EAEtF,OAAOF,EAACK,EAAA,CAAa,GAAGH,EAAO,eAAgBH,EAA2B,SAAUI,EAAU,CAChG,ECnBA,YAAyC,wBCLzC,OAAS,WAAAG,MAAe,QAExB,OAAS,4BAAAC,EAA0B,8BAAAC,MAA6D,wBAqBvF,cAAAC,MAAA,oBAXF,IAAMC,EAAgBC,GAA0C,CACrE,IAAMC,EAAiCC,EAAQ,KACtC,CACL,SAAUN,EAAyBI,EAAM,OAAQ,CAAC,KAAO,KAAO,IAAK,CAAC,EACtE,SAAUJ,EAAyBI,EAAM,OAAQ,CAAC,KAAO,KAAO,IAAK,CAAC,EACtE,SAAUJ,EAAyBI,EAAM,OAAQ,CAAC,IAAM,IAAM,EAAG,CAAC,EAClE,SAAUJ,EAAyBI,EAAM,OAAQ,CAAC,IAAM,IAAM,IAAK,CAAC,EACpE,QAASA,EAAM,OAAS,EAC1B,GACC,CAACA,EAAM,OAAQA,EAAM,OAAQA,EAAM,OAAQA,EAAM,OAAQA,EAAM,KAAK,CAAC,EAExE,OAAOF,EAACK,EAAA,CAAa,GAAGH,EAAO,eAAgBH,EAA4B,SAAUI,EAAU,CACjG,EDjBA,YAA0C,wBAG1C,OAAS,4BAAAG,MAAgC",
-  "names": ["useEffect", "useRef", "ShaderMountVanilla", "jsx", "ShaderMount", "ref", "fragmentShader", "style", "uniforms", "webGlContextAttributes", "animated", "canvasRef", "shaderMountRef", "useMemo", "getShaderColorFromString", "grainCloudsFragmentShader", "jsx", "GrainClouds", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "meshGradientFragmentShader", "jsx", "MeshGradient", "props", "uniforms", "useMemo", "ShaderMount", "getShaderColorFromString"]
+  "sources": ["../src/shader-mount.tsx", "../src/shaders/grain-clouds.tsx", "../src/index.ts", "../src/shaders/mesh-gradient.tsx", "../src/shaders/neuro-noise.tsx"],
+  "sourcesContent": ["import React, { useEffect, useRef } from 'react';\nimport { ShaderMount as ShaderMountVanilla } from '@paper-design/shaders';\n\nexport interface ShaderMountProps {\n  ref?: React.RefObject<HTMLCanvasElement>;\n  fragmentShader: string;\n  style?: React.CSSProperties;\n  uniforms?: Record<string, number | number[]>;\n  webGlContextAttributes?: WebGLContextAttributes;\n  animated?: boolean;\n}\n\nexport const ShaderMount: React.FC<ShaderMountProps> = ({\n  ref,\n  fragmentShader,\n  style,\n  uniforms = {},\n  webGlContextAttributes,\n  animated = true,\n}) => {\n  const canvasRef = ref ?? useRef<HTMLCanvasElement>(null);\n  const shaderMountRef = useRef<ShaderMountVanilla | null>(null);\n\n  useEffect(() => {\n    if (canvasRef.current) {\n      shaderMountRef.current = new ShaderMountVanilla(\n        canvasRef.current,\n        fragmentShader,\n        uniforms,\n        webGlContextAttributes,\n        animated\n      );\n    }\n\n    return () => {\n      if (shaderMountRef.current) {\n        shaderMountRef.current.dispose();\n      }\n    };\n  }, [fragmentShader, webGlContextAttributes]);\n\n  useEffect(() => {\n    if (shaderMountRef.current) {\n      shaderMountRef.current.setUniforms(uniforms);\n    }\n  }, [uniforms]);\n\n  useEffect(() => {\n    if (shaderMountRef.current) {\n      if (animated) {\n        shaderMountRef.current.startAnimating();\n      } else {\n        shaderMountRef.current.stopAnimating();\n      }\n    }\n  }, [animated]);\n\n  return <canvas ref={canvasRef} style={style} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, grainCloudsFragmentShader, type GrainCloudsUniforms } from '@paper-design/shaders';\n\nexport type GrainCloudsProps = Omit<ShaderMountProps, 'fragmentShader'> & {\n  color1?: string;\n  color2?: string;\n  noiseScale?: number;\n  noiseSpeed?: number;\n  grainAmount?: number;\n};\n\n/** Some default values for the shader props */\nexport const grainCloudsDefaults = {\n  color1: '#000000',\n  color2: '#ffffff',\n  noiseScale: 1,\n  noiseSpeed: 0.3,\n  grainAmount: 0.05,\n} as const;\n\nexport const GrainClouds = (props: GrainCloudsProps): JSX.Element => {\n  const uniforms: GrainCloudsUniforms = useMemo(() => {\n    return {\n      u_color1: getShaderColorFromString(props.color1, grainCloudsDefaults.color1),\n      u_color2: getShaderColorFromString(props.color2, grainCloudsDefaults.color2),\n      u_noiseScale: props.noiseScale ?? grainCloudsDefaults.noiseScale,\n      u_noiseSpeed: props.noiseSpeed ?? grainCloudsDefaults.noiseSpeed,\n      u_grainAmount: props.grainAmount ?? grainCloudsDefaults.grainAmount,\n    };\n  }, [props.color1, props.color2, props.noiseScale, props.noiseSpeed, props.grainAmount]);\n\n  return <ShaderMount {...props} fragmentShader={grainCloudsFragmentShader} uniforms={uniforms} />;\n};\n", "// ----- ShaderMount ----- //\nexport { ShaderMount } from './shader-mount';\n\n// ----- Fragment shaders ----- //\n\n// Grain clouds\nexport { GrainClouds, grainCloudsDefaults } from './shaders/grain-clouds';\nexport { type GrainCloudsProps } from './shaders/grain-clouds';\nexport { type GrainCloudsUniforms } from '@paper-design/shaders';\n\n// Mesh gradient\nexport { MeshGradient, meshGradientDefaults } from './shaders/mesh-gradient';\nexport { type MeshGradientProps } from './shaders/mesh-gradient';\nexport { type MeshGradientUniforms } from '@paper-design/shaders';\n\n// Neuro noise\nexport { NeuroNoise, neuroNoiseDefaults } from './shaders/neuro-noise';\nexport { type NeuroNoiseProps } from './shaders/neuro-noise';\nexport { type NeuroNoiseUniforms } from '@paper-design/shaders';\n\n// ----- Uniform conversion utils ----- //\nexport { getShaderColorFromString } from '@paper-design/shaders';\n", "import { useMemo } from 'react';\nimport { ShaderMount, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, meshGradientFragmentShader, type MeshGradientUniforms } from '@paper-design/shaders';\n\nexport type MeshGradientProps = Omit<ShaderMountProps, 'fragmentShader'> & {\n  color1?: string;\n  color2?: string;\n  color3?: string;\n  color4?: string;\n  speed?: number;\n};\n\n/** Some default values for the shader props */\nexport const meshGradientDefaults = {\n  color1: '#6a5496',\n  color2: '#9b8ab8',\n  color3: '#f5d03b',\n  color4: '#e48b97',\n  speed: 0.1,\n} as const;\n\nexport const MeshGradient = (props: MeshGradientProps): JSX.Element => {\n  const uniforms: MeshGradientUniforms = useMemo(() => {\n    return {\n      u_color1: getShaderColorFromString(props.color1, meshGradientDefaults.color1),\n      u_color2: getShaderColorFromString(props.color2, meshGradientDefaults.color2),\n      u_color3: getShaderColorFromString(props.color3, meshGradientDefaults.color3),\n      u_color4: getShaderColorFromString(props.color4, meshGradientDefaults.color4),\n      u_speed: props.speed ?? meshGradientDefaults.speed,\n    };\n  }, [props.color1, props.color2, props.color3, props.color4, props.speed]);\n\n  return <ShaderMount {...props} fragmentShader={meshGradientFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, neuroNoiseFragmentShader, type NeuroNoiseUniforms } from '@paper-design/shaders';\n\nexport type NeuroNoiseProps = Omit<ShaderMountProps, 'fragmentShader'> & {\n  colorFront?: string;\n  colorBack?: string;\n  scale?: number;\n  speed?: number;\n  brightness?: number;\n};\n\n/** Some default values for the shader props */\nexport const neuroNoiseDefaults = {\n  colorFront: '#c3a3ff',\n  colorBack: '#000000',\n  scale: 1,\n  speed: 1,\n  brightness: 1.3,\n} as const;\n\nexport const NeuroNoise = (props: NeuroNoiseProps): JSX.Element => {\n  const uniforms: NeuroNoiseUniforms = useMemo(() => {\n    return {\n      u_colorFront: getShaderColorFromString(props.colorFront, neuroNoiseDefaults.colorFront),\n      u_colorBack: getShaderColorFromString(props.colorBack, neuroNoiseDefaults.colorBack),\n      u_scale: props.scale ?? neuroNoiseDefaults.scale,\n      u_speed: props.speed ?? neuroNoiseDefaults.speed,\n      u_brightness: props.brightness ?? neuroNoiseDefaults.brightness,\n    };\n  }, [props.colorFront, props.colorBack, props.scale, props.speed, props.brightness]);\n\n  return <ShaderMount {...props} fragmentShader={neuroNoiseFragmentShader} uniforms={uniforms} />;\n};\n"],
+  "mappings": "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",
+  "names": ["useEffect", "useRef", "ShaderMountVanilla", "jsx", "ShaderMount", "ref", "fragmentShader", "style", "uniforms", "webGlContextAttributes", "animated", "canvasRef", "shaderMountRef", "useMemo", "getShaderColorFromString", "grainCloudsFragmentShader", "jsx", "grainCloudsDefaults", "GrainClouds", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "meshGradientFragmentShader", "jsx", "meshGradientDefaults", "MeshGradient", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "neuroNoiseFragmentShader", "jsx", "neuroNoiseDefaults", "NeuroNoise", "props", "uniforms", "useMemo", "ShaderMount", "getShaderColorFromString"]
 }

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

@@ -1,10 +1,17 @@
 import { type ShaderMountProps } from '../shader-mount';
-type GrainCloudsProps = Omit<ShaderMountProps, 'fragmentShader'> & {
+export type GrainCloudsProps = Omit<ShaderMountProps, 'fragmentShader'> & {
     color1?: string;
     color2?: string;
     noiseScale?: number;
     noiseSpeed?: number;
     grainAmount?: number;
 };
+/** Some default values for the shader props */
+export declare const grainCloudsDefaults: {
+    readonly color1: "#000000";
+    readonly color2: "#ffffff";
+    readonly noiseScale: 1;
+    readonly noiseSpeed: 0.3;
+    readonly grainAmount: 0.05;
+};
 export declare const GrainClouds: (props: GrainCloudsProps) => JSX.Element;
-export {};

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

@@ -1,10 +1,17 @@
 import { type ShaderMountProps } from '../shader-mount';
-type MeshGradientProps = Omit<ShaderMountProps, 'fragmentShader'> & {
+export type MeshGradientProps = Omit<ShaderMountProps, 'fragmentShader'> & {
     color1?: string;
     color2?: string;
     color3?: string;
     color4?: string;
     speed?: number;
 };
+/** Some default values for the shader props */
+export declare const meshGradientDefaults: {
+    readonly color1: "#6a5496";
+    readonly color2: "#9b8ab8";
+    readonly color3: "#f5d03b";
+    readonly color4: "#e48b97";
+    readonly speed: 0.1;
+};
 export declare const MeshGradient: (props: MeshGradientProps) => JSX.Element;
-export {};

package/dist/shaders/neuro-noise.d.ts

@@ -0,0 +1,17 @@
+import { type ShaderMountProps } from '../shader-mount';
+export type NeuroNoiseProps = Omit<ShaderMountProps, 'fragmentShader'> & {
+    colorFront?: string;
+    colorBack?: string;
+    scale?: number;
+    speed?: number;
+    brightness?: number;
+};
+/** Some default values for the shader props */
+export declare const neuroNoiseDefaults: {
+    readonly colorFront: "#c3a3ff";
+    readonly colorBack: "#000000";
+    readonly scale: 1;
+    readonly speed: 1;
+    readonly brightness: 1.3;
+};
+export declare const NeuroNoise: (props: NeuroNoiseProps) => JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paper-design/shaders-react",
-  "version": "0.0.14",
+  "version": "0.0.16",
   "license": "MIT",
   "type": "module",
   "publishConfig": {
@@ -23,7 +23,7 @@
     "type-check": "tsc --project tsconfig.json"
   },
   "dependencies": {
-    "@paper-design/shaders": "0.0.12",
+    "@paper-design/shaders": "0.0.14",
     "react": ">=18"
   },
   "devDependencies": {