@paper-design/shaders-react 0.0.21 → 0.0.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +1 -1
- package/dist/index.js.map +3 -3
- package/dist/shader-mount.d.ts +10 -1
- package/dist/shaders/dots-grid.d.ts +1 -0
- package/dist/shaders/perlin-noise.d.ts +6 -6
- package/dist/shaders/spiral.d.ts +1 -1
- package/dist/shaders/voronoi.d.ts +2 -2
- package/dist/shaders/waves.d.ts +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/***** Paper Shaders: https://github.com/paper-design/shaders *****/
|
|
2
|
-
import{useEffect as k,useRef as B}from"react";import{ShaderMount as Y}from"@paper-design/shaders";import{jsx as V}from"react/jsx-runtime";var o=({ref:e,fragmentShader:r,style:E,uniforms:M={},webGlContextAttributes:v,speed:R=1,seed:N=0})=>{let D=e??B(null),P=B(null);return k(()=>(D.current&&(P.current=new Y(D.current,r,M,v,R,N)),()=>{P.current?.dispose()}),[r,v]),k(()=>{P.current?.setUniforms(M)},[M]),k(()=>{P.current?.setSpeed(R)},[R]),k(()=>{P.current?.setSeed(N)},[N]),V("canvas",{ref:D,style:E})};import{useMemo as T}from"react";import{getShaderColorFromString as X,grainCloudsFragmentShader as J}from"@paper-design/shaders";import{jsx as K}from"react/jsx-runtime";var f={name:"Default",params:{scale:1,speed:.3,seed:0,color1:"hsla(0, 0%, 0%, 1)",color2:"hsla(0, 0%, 100%, 1)",grainAmount:1}},A={name:"Sky",params:{scale:1,speed:.3,seed:0,color1:"hsla(218, 100%, 73%, 1)",color2:"hsla(0, 0%, 100%, 1)",grainAmount:0}},L=[f,A],H=e=>{let r=T(()=>({u_scale:e.scale??f.params.scale,u_color1:X(e.color1,f.params.color1),u_color2:X(e.color2,f.params.color2),u_grainAmount:e.grainAmount??f.params.grainAmount}),[e.scale,e.color1,e.color2,e.grainAmount]);return K(o,{...e,fragmentShader:J,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as Z}from"react";import{getShaderColorFromString as C,meshGradientFragmentShader as Q}from"@paper-design/shaders";import{jsx as oe}from"react/jsx-runtime";var g={name:"Default",params:{speed:.15,seed:0,color1:"hsla(259, 29%, 73%, 1)",color2:"hsla(263, 57%, 39%, 1)",color3:"hsla(48, 73%, 84%, 1)",color4:"hsla(295, 32%, 70%, 1)"}},$={name:"Beach",params:{speed:.1,seed:0,color1:"hsla(186, 81%, 83%, 1)",color2:"hsla(198, 55%, 68%, 1)",color3:"hsla(53, 67%, 88%, 1)",color4:"hsla(45, 93%, 73%, 1)"}},j={name:"Faded",params:{speed:-.3,seed:0,color1:"hsla(186, 41%, 90%, 1)",color2:"hsla(208, 71%, 85%, 1)",color3:"hsla(183, 51%, 92%, 1)",color4:"hsla(201, 72%, 90%, 1)"}},ee=[g,$,j],re=e=>{let r=Z(()=>({u_color1:C(e.color1,g.params.color1),u_color2:C(e.color2,g.params.color2),u_color3:C(e.color3,g.params.color3),u_color4:C(e.color4,g.params.color4)}),[e.color1,e.color2,e.color3,e.color4]);return oe(o,{...e,fragmentShader:Q,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as se}from"react";import{getShaderColorFromString as z,smokeRingFragmentShader as ae}from"@paper-design/shaders";import{jsx as de}from"react/jsx-runtime";var h={name:"Default",params:{scale:1,speed:1,seed:0,colorBack:"hsla(208, 54%, 7%, 1)",colorInner:"hsla(0, 0%, 100%, 1)",colorOuter:"hsla(211, 100%, 64%, 1)",noiseScale:1.4,thickness:.33}},te={name:"Cloud",params:{scale:1,speed:1,seed:0,colorBack:"hsla(218, 100%, 62%, 1)",colorInner:"hsla(0, 0%, 100%, 1)",colorOuter:"hsla(0, 0%, 100%, 1)",noiseScale:1.8,thickness:.7}},le={name:"Fire",params:{scale:1,speed:4,seed:0,colorBack:"hsla(20, 100%, 5%, 1)",colorInner:"hsla(40, 100%, 50%, 1)",colorOuter:"hsla(0, 100%, 50%, 1)",noiseScale:1.4,thickness:.35}},ne={name:"Electric",params:{scale:1,speed:-2.5,seed:0,colorBack:"hsla(47, 50%, 7%, 1)",colorInner:"hsla(47, 100%, 64%, 1)",colorOuter:"hsla(47, 100%, 64%, 1)",noiseScale:1.8,thickness:.1}},ie={name:"Poison",params:{scale:1,speed:3,seed:0,colorBack:"hsla(120, 100%, 3%, 1)",colorInner:"hsla(120, 100%, 3%, 1)",colorOuter:"hsla(120, 100%, 66%, 1)",noiseScale:5,thickness:.6}},ce=[h,te,le,ne,ie],me=e=>{let r=se(()=>({u_scale:e.scale??h.params.scale,u_colorBack:z(e.colorBack,h.params.colorBack),u_colorInner:z(e.colorInner,h.params.colorInner),u_colorOuter:z(e.colorOuter,h.params.colorOuter),u_noiseScale:e.noiseScale??h.params.noiseScale,u_thickness:e.thickness??h.params.thickness}),[e.scale,e.colorBack,e.colorInner,e.colorOuter,e.noiseScale,e.thickness]);return de(o,{...e,fragmentShader:ae,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as pe}from"react";import{getShaderColorFromString as q,neuroNoiseFragmentShader as ue}from"@paper-design/shaders";import{jsx as fe}from"react/jsx-runtime";var y={name:"Default",params:{scale:1,speed:1,seed:0,colorFront:"hsla(261, 100%, 82%, 1)",colorBack:"hsla(0, 0%, 0%, 1)",brightness:1.3}},he={name:"Marble",params:{scale:.4,speed:0,seed:0,colorFront:"hsla(230, 24%, 15%, 1)",colorBack:"hsla(0, 0%, 97%, 1)",brightness:1.1}},Se=[y,he],Pe=e=>{let r=pe(()=>({u_scale:e.scale??y.params.scale,u_colorFront:q(e.colorFront,y.params.colorFront),u_colorBack:q(e.colorBack,y.params.colorBack),u_brightness:e.brightness??y.params.brightness}),[e.scale,e.colorFront,e.colorBack,e.brightness]);return fe(o,{...e,fragmentShader:ue,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as ge}from"react";import{getShaderColorFromString as G,dotsOrbitFragmentShader as ye}from"@paper-design/shaders";import{jsx as ke}from"react/jsx-runtime";var m={name:"Default",params:{scale:1,speed:2,seed:0,color1:"hsla(358, 66%, 49%, 1)",color2:"hsla(145, 30%, 33%, 1)",color3:"hsla(39, 88%, 52%, 1)",color4:"hsla(274, 30%, 35%, 1)",dotSize:.7,dotSizeRange:.4,spreading:1}},be=[m],xe=e=>{let r=ge(()=>({u_scale:e.scale??m.params.scale,u_color1:G(e.color1,m.params.color1),u_color2:G(e.color2,m.params.color2),u_color3:G(e.color3,m.params.color3),u_color4:G(e.color4,m.params.color4),u_dotSize:e.dotSize??m.params.dotSize,u_dotSizeRange:e.dotSizeRange??m.params.dotSizeRange,u_spreading:e.spreading??m.params.spreading}),[e.scale,e.color1,e.color2,e.color3,e.color4,e.dotSize,e.dotSizeRange,e.spreading]);return ke(o,{...e,fragmentShader:ye,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as Ce}from"react";import{dotsGridFragmentShader as Ge,getShaderColorFromString as W,DotsGridShapes as p}from"@paper-design/shaders";import{jsx as ve}from"react/jsx-runtime";var n={name:"Default",params:{colorBack:"hsla(358, 66%, 49%, 0)",colorFill:"hsla(145, 30%, 10%, 1)",colorStroke:"hsla(39, 88%, 52%, 1)",dotSize:2,gridSpacingX:50,gridSpacingY:50,strokeWidth:0,sizeRange:0,opacityRange:0,shape:p.Circle}},_e={name:"Triangles",params:{colorBack:"hsla(0, 0%, 100%, 1)",colorFill:"hsla(0, 0%, 100%, 1)",colorStroke:"hsla(0, 0%, 0%, .5)",dotSize:5,gridSpacingX:32,gridSpacingY:32,strokeWidth:1,sizeRange:0,opacityRange:0,shape:p.Triangle}},Me={name:"Bubbles",params:{colorBack:"hsla(234, 100%, 31%, .5)",colorFill:"hsla(100, 30%, 100%, 1)",colorStroke:"hsla(0, 100%, 0%, 1)",dotSize:28,gridSpacingX:60,gridSpacingY:60,strokeWidth:12,sizeRange:.7,opacityRange:1.3,shape:p.Circle}},Re={name:"Tree line",params:{colorBack:"hsla(100, 100%, 36%, .05)",colorFill:"hsla(150, 80%, 10%, 1)",colorStroke:"hsla(0, 0%, 0%, 1)",dotSize:8,gridSpacingX:20,gridSpacingY:90,strokeWidth:0,sizeRange:1,opacityRange:.6,shape:p.Circle}},Ne={name:"Diamonds",params:{colorBack:"hsla(0, 0%, 0%, 0)",colorFill:"hsla(0, 100%, 50%, 1)",colorStroke:"hsla(0, 0%, 0%, 1)",dotSize:15,gridSpacingX:30,gridSpacingY:30,strokeWidth:0,sizeRange:0,opacityRange:2,shape:p.Diamond}},De={name:"Wallpaper",params:{colorBack:"hsla(154, 33%, 19%, 1)",colorFill:"hsla(0, 0%, 0%, 0)",colorStroke:"hsla(36, 48%, 58%, 1)",dotSize:9,gridSpacingX:32,gridSpacingY:32,strokeWidth:1,sizeRange:0,opacityRange:0,shape:p.Diamond}},ze={name:"Enter the Matrix",params:{colorBack:"hsla(0, 100%, 0%, 1)",colorFill:"hsla(182, 100%, 64%, 1)",colorStroke:"hsla(0, 100%, 100%, 0)",dotSize:2,gridSpacingX:10,gridSpacingY:10,strokeWidth:.5,sizeRange:.25,opacityRange:1,shape:p.Triangle}},We={name:"Waveform",params:{colorBack:"hsla(0, 100%, 100%, 1)",colorFill:"hsla(227, 93%, 38%, 1)",colorStroke:"hsla(0, 0%, 0%, 0)",dotSize:100,gridSpacingX:2,gridSpacingY:215,strokeWidth:0,sizeRange:1,opacityRange:0,shape:p.Square}},Fe=[n,_e,Me,Re,Ne,De,ze,We],we=e=>{let r=Ce(()=>({u_colorBack:W(e.colorBack,n.params.colorBack),u_colorFill:W(e.colorFill,n.params.colorStroke),u_colorStroke:W(e.colorStroke,n.params.colorStroke),u_dotSize:e.dotSize??n.params.dotSize,u_gridSpacingX:e.gridSpacingX??n.params.gridSpacingX,u_gridSpacingY:e.gridSpacingY??n.params.gridSpacingY,u_strokeWidth:e.strokeWidth??n.params.strokeWidth,u_sizeRange:e.sizeRange??n.params.sizeRange,u_opacityRange:e.opacityRange??n.params.opacityRange,u_shape:e.shape??n.params.shape}),[e.colorBack,e.colorFill,e.colorStroke,e.dotSize,e.gridSpacingX,e.gridSpacingY,e.strokeWidth,e.sizeRange,e.opacityRange,e.shape]);return ve(o,{...e,fragmentShader:Ge,uniforms:r})};import{DotsGridShapes as ra}from"@paper-design/shaders";import{useMemo as Be}from"react";import{getShaderColorFromString as b,steppedSimplexNoiseFragmentShader as Xe}from"@paper-design/shaders";import{jsx as Ye}from"react/jsx-runtime";var u={name:"Default",params:{scale:1,speed:.15,seed:0,color1:"hsla(208, 25%, 45%, 1)",color2:"hsla(94, 38%, 59%, 1)",color3:"hsla(359, 94%, 62%, 1)",color4:"hsla(42, 93%, 64%, 1)",color5:"hsla(0, 0%, 100%, 1)",stepsNumber:13}},qe={name:"Magma",params:{scale:.3,speed:.2,seed:0,color1:"hsla(0, 100%, 36%, 1)",color2:"hsla(0, 95%, 44%, 1)",color3:"hsla(20, 100%, 49%, 1)",color4:"hsla(45, 100%, 45%, 1)",color5:"hsla(31, 100%, 94%, 1)",stepsNumber:8}},Ue={name:"Blood cell",params:{scale:1.2,speed:.22,seed:0,color1:"hsla(302, 43%, 13%, 1)",color2:"hsla(325, 93%, 17%, 1)",color3:"hsla(338, 80%, 25%, 1)",color4:"hsla(338, 80%, 25%, 1)",color5:"hsla(2, 85%, 72%, 1)",stepsNumber:29}},Oe={name:"First contact",params:{scale:1.2,speed:-.1,seed:0,color1:"hsla(300, 43%, 82%, 1)",color2:"hsla(266, 70%, 9%, 1)",color3:"hsla(289, 36%, 26%, 1)",color4:"hsla(0, 41%, 78%, 1)",color5:"hsla(0, 100%, 96%, 1)",stepsNumber:40}},Ie=[u,qe,Ue,Oe],Ee=e=>{let r=Be(()=>({u_scale:e.scale??u.params.scale,u_color1:b(e.color1,u.params.color1),u_color2:b(e.color2,u.params.color2),u_color3:b(e.color3,u.params.color3),u_color4:b(e.color4,u.params.color4),u_color5:b(e.color5,u.params.color5),u_steps_number:e.stepsNumber??u.params.stepsNumber}),[e.scale,e.color1,e.color2,e.color3,e.color4,e.color5,e.stepsNumber]);return Ye(o,{...e,fragmentShader:Xe,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as Ve}from"react";import{getShaderColorFromString as F,metaballsFragmentShader as Te}from"@paper-design/shaders";import{jsx as Le}from"react/jsx-runtime";var S={name:"Default",params:{scale:1,speed:.6,seed:0,color1:"hsla(350, 90%, 55%, 1)",color2:"hsla(350, 80%, 60%, 1)",color3:"hsla(20, 85%, 70%, 1)",ballSize:1,visibilityRange:.4}},Je=[S],Ae=e=>{let r=Ve(()=>({u_scale:e.scale??S.params.scale,u_color1:F(e.color1,S.params.color1),u_color2:F(e.color2,S.params.color2),u_color3:F(e.color3,S.params.color3),u_ballSize:e.ballSize??S.params.ballSize,u_visibilityRange:e.visibilityRange??S.params.visibilityRange}),[e.scale,e.color1,e.color2,e.color3,e.ballSize,e.visibilityRange]);return Le(o,{...e,fragmentShader:Te,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as He}from"react";import{getShaderColorFromString as U,wavesFragmentShader as Ke}from"@paper-design/shaders";import{jsx as sr}from"react/jsx-runtime";var i={name:"Default",params:{scale:1,rotation:0,color1:"hsla(48, 100%, 74%, 1)",color2:"hsla(204, 47%, 45%, 1)",shape:1,frequency:.5,amplitude:.5,spacing:.75,dutyCycle:.2,edgeBlur:0}},Ze={name:"Spikes",params:{scale:2.3,rotation:0,color1:"hsla(65, 100%, 95%, 1)",color2:"hsla(290, 52%, 15%, 1)",shape:0,frequency:.5,amplitude:.9,spacing:.37,dutyCycle:.93,edgeBlur:.15}},Qe={name:"Groovy",params:{scale:.5,rotation:1,color1:"hsla(60, 100%, 97%, 1)",color2:"hsla(20, 100%, 71%, 1)",shape:2.37,frequency:.2,amplitude:.67,spacing:1.17,dutyCycle:.57,edgeBlur:0}},$e={name:"Tangled up",params:{scale:3.04,rotation:1,color1:"hsla(198.7, 66.7%, 14.1%, 1)",color2:"hsla(85.5, 35.7%, 78%, 1)",shape:3,frequency:.44,amplitude:.57,spacing:1.05,dutyCycle:.97,edgeBlur:0}},je={name:"Zig zag",params:{scale:2.7,rotation:1,color1:"hsla(0, 0%, 0%, 1)",color2:"hsla(0, 0%, 90%, 1)",shape:0,frequency:.6,amplitude:.8,spacing:.5,dutyCycle:1,edgeBlur:.5}},er={name:"Ride the wave",params:{scale:.84,rotation:0,color1:"hsla(65, 100%, 95%, 1)",color2:"hsla(0, 0%, 12%, 1)",shape:2.23,frequency:.1,amplitude:.6,spacing:.41,dutyCycle:.99,edgeBlur:0}},rr=[i,Ze,Qe,$e,je,er],or=e=>{let r=He(()=>({u_scale:e.scale??i.params.scale,u_rotation:e.rotation??i.params.rotation,u_color1:U(e.color1,i.params.color1),u_color2:U(e.color2,i.params.color2),u_shape:e.shape??i.params.shape,u_frequency:e.frequency??i.params.frequency,u_amplitude:e.amplitude??i.params.amplitude,u_spacing:e.spacing??i.params.spacing,u_dutyCycle:e.dutyCycle??i.params.dutyCycle,u_edgeBlur:e.edgeBlur??i.params.edgeBlur}),[e.scale,e.rotation,e.color1,e.color2,e.shape,e.frequency,e.amplitude,e.spacing,e.dutyCycle,e.edgeBlur]);return sr(o,{...e,fragmentShader:Ke,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as ar}from"react";import{getShaderColorFromString as O,perlinNoiseFragmentShader as tr}from"@paper-design/shaders";import{jsx as ur}from"react/jsx-runtime";var d={name:"Default",params:{scale:1,speed:.5,seed:0,color1:"hsla(0, 0%, 15%, 1)",color2:"hsla(203, 100%, 87%, 1)",proportion:.34,contour:.9,octaveCount:2,persistence:1,lacunarity:1.5}},lr={name:"Nintendo Water",params:{scale:.2,speed:.5,seed:0,color1:"hsla(220, 66%, 50%, 1)",color2:"hsla(155, 66%, 80%, 1)",proportion:.42,contour:1,octaveCount:2,persistence:.55,lacunarity:1.8}},nr={name:"Colony",params:{scale:.15,speed:0,seed:0,color1:"hsla(56, 86%, 81%, 1)",color2:"hsla(230, 80%, 20%, 1)",octaveCount:6,persistence:1,lacunarity:2.55,proportion:.65,contour:.65}},ir={name:"Phosphenes",params:{scale:.03,speed:.15,seed:0,color1:"hsla(350, 80%, 70%, 1)",color2:"hsla(150, 50%, 60%, 1)",proportion:.45,contour:.55,octaveCount:6,persistence:.3,lacunarity:3}},cr={name:"Moss",params:{scale:.15,speed:.02,seed:0,color1:"hsla(137, 100%, 51%, 1)",color2:"hsla(0, 0%, 15%, 1)",proportion:.65,contour:.65,octaveCount:6,persistence:1,lacunarity:2.55}},mr={name:"Worms",params:{scale:2,speed:0,seed:0,color1:"hsla(0, 100%, 100%, 1)",color2:"hsla(0, 0%, 35%, 1)",proportion:.5,contour:1,octaveCount:1,persistence:1,lacunarity:1.5}},dr=[d,lr,nr,ir,cr,mr],pr=e=>{let r=ar(()=>({u_scale:e.scale??d.params.scale,u_color1:O(e.color1,d.params.color1),u_color2:O(e.color2,d.params.color2),u_proportion:e.proportion??d.params.proportion,u_contour:e.contour??d.params.contour,u_octaveCount:e.octaveCount??d.params.octaveCount,u_persistence:e.persistence??d.params.persistence,u_lacunarity:e.lacunarity??d.params.lacunarity}),[e.scale,e.color1,e.color2,e.proportion,e.contour,e.octaveCount,e.persistence,e.lacunarity]);return ur(o,{...e,fragmentShader:tr,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as hr}from"react";import{getShaderColorFromString as x,voronoiFragmentShader as Sr}from"@paper-design/shaders";import{jsx as _r}from"react/jsx-runtime";var a={name:"Default",params:{scale:1.5,speed:.5,seed:0,colorCell1:"hsla(15, 80%, 50%, 1)",colorCell2:"hsla(180, 80%, 50%, 1)",colorCell3:"hsla(200, 80%, 50%, 1)",colorEdges:"hsla(30, 90%, 10%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorGradient:.5,distance:.25,edgesSize:.15,edgesSharpness:.01,middleSize:0,middleSharpness:0}},Pr={name:"Classic",params:{scale:3,speed:.8,seed:0,colorCell1:"hsla(0, 100%, 100%, 1)",colorCell2:"hsla(0, 0%, 100%, 1)",colorCell3:"hsla(0, 100%, 0%, 1)",colorEdges:"hsla(0, 0%, 0%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorGradient:1,distance:.45,edgesSize:.02,edgesSharpness:.07,middleSize:0,middleSharpness:0}},fr={name:"Giraffe",params:{scale:1,speed:.6,seed:0,colorCell1:"hsla(32, 100%, 18%, 1)",colorCell2:"hsla(42, 93%, 35%, 1)",colorCell3:"hsla(32, 100%, 18%, 1)",colorEdges:"hsla(45, 100%, 96%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorGradient:1,distance:.25,edgesSize:.2,edgesSharpness:.01,middleSize:0,middleSharpness:.3}},gr={name:"Eyes",params:{scale:1.6,speed:.6,seed:0,colorCell1:"hsla(79, 84%, 60%, 1)",colorCell2:"hsla(207, 53%, 41%, 1)",colorCell3:"hsla(207, 80%, 65%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorEdges:"hsla(0, 100%, 100%, 1)",colorGradient:1,distance:.25,edgesSize:.62,edgesSharpness:.01,middleSize:.1,middleSharpness:1}},yr={name:"Bubbles",params:{scale:2,speed:.5,seed:0,colorCell1:"hsla(0, 100%, 50%, 1)",colorCell2:"hsla(169, 100%, 66%, 1)",colorCell3:"hsla(50, 100%, 66%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorEdges:"hsla(0, 0%, 0%, 1)",colorGradient:1,distance:.5,edgesSize:.81,edgesSharpness:0,middleSize:0,middleSharpness:.45}},br={name:"Cells",params:{scale:2,speed:1,seed:0,colorCell1:"hsla(0, 0%, 100%, 1)",colorCell2:"hsla(0, 0%, 100%, 1)",colorCell3:"hsla(0, 0%, 100%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorEdges:"hsla(200, 50%, 15%, 1)",colorGradient:1,distance:.38,edgesSize:.1,edgesSharpness:.02,middleSize:0,middleSharpness:0}},xr={name:"Glow",params:{scale:1.2,speed:.8,seed:0,colorCell1:"hsla(40, 100%, 50%, 1)",colorCell2:"hsla(311, 100%, 59%, 1)",colorCell3:"hsla(180, 100%, 65%, 1)",colorEdges:"hsla(0, 100%, 0%, 1)",colorMid:"hsla(0, 0%, 100%, 1)",colorGradient:1,distance:.25,edgesSize:.15,edgesSharpness:.01,middleSize:.7,middleSharpness:0}},kr={name:"Tiles",params:{scale:1.3,speed:1,seed:0,colorCell1:"hsla(80, 50%, 50%, 1)",colorCell2:"hsla(0, 50%, 100%, 1)",colorCell3:"hsla(200, 50%, 50%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorEdges:"hsla(200, 50%, 10%, 1)",colorGradient:0,distance:.05,edgesSize:.25,edgesSharpness:.02,middleSize:0,middleSharpness:0}},Cr=[a,Pr,fr,gr,yr,br,xr,kr],Gr=e=>{let r=hr(()=>({u_scale:e.scale??a.params.scale,u_colorCell1:x(e.colorCell1,a.params.colorCell1),u_colorCell2:x(e.colorCell2,a.params.colorCell2),u_colorCell3:x(e.colorCell3,a.params.colorCell3),u_colorMid:x(e.colorMid,a.params.colorMid),u_colorEdges:x(e.colorEdges,a.params.colorEdges),u_colorGradient:e.colorGradient??a.params.colorGradient,u_distance:e.distance??a.params.distance,u_edgesSize:e.edgesSize??a.params.edgesSize,u_edgesSharpness:e.edgesSharpness??a.params.edgesSharpness,u_middleSize:e.middleSize??a.params.middleSize,u_middleSharpness:e.middleSharpness??a.params.middleSharpness}),[e.scale,e.colorCell1,e.colorCell3,e.colorCell2,e.colorMid,e.colorEdges,e.colorGradient,e.distance,e.edgesSize,e.edgesSharpness,e.middleSize,e.middleSharpness]);return _r(o,{...e,fragmentShader:Sr,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as Mr}from"react";import{getShaderColorFromString as w,warpFragmentShader as Rr,PatternShapes as c}from"@paper-design/shaders";import{jsx as Ir}from"react/jsx-runtime";var t={name:"Default",params:{scale:1,rotation:0,speed:.1,seed:0,color1:"hsla(0, 0%, 15%, 1)",color2:"hsla(203, 80%, 70%, 1)",color3:"hsla(0, 0%, 100%, 1)",proportion:.35,softness:1,distortion:.25,swirl:.8,swirlIterations:10,shapeScale:.1,shape:c.Checks}},Nr={name:"Cauldron Pot",params:{scale:1.1,rotation:1.62,speed:1,seed:0,color1:"hsla(100, 51%, 75%, 1)",color2:"hsla(220, 39%, 32%, 1)",color3:"hsla(129.2, 41.9%, 6.1%, 1)",proportion:.64,softness:.95,distortion:.2,swirl:.86,swirlIterations:7,shapeScale:0,shape:c.Edge}},Dr={name:"Silk",params:{scale:.26,rotation:0,speed:.5,seed:0,color1:"hsla(0, 9%, 7%, 1)",color2:"hsla(8, 13%, 34%, 1)",color3:"hsla(5, 8%, 71%, 1)",proportion:0,softness:1,distortion:.3,swirl:.6,swirlIterations:11,shapeScale:.05,shape:c.Stripes}},zr={name:"Passion",params:{scale:.25,rotation:1.35,speed:.3,seed:0,color1:"hsla(0, 44.7%, 14.9%, 1)",color2:"hsla(353.4, 34%, 42.2%, 1)",color3:"hsla(29, 100%, 76.1%, 1)",proportion:.5,softness:1,distortion:.09,swirl:.9,swirlIterations:6,shapeScale:.25,shape:c.Checks}},Wr={name:"Phantom",params:{scale:.68,rotation:1.8,speed:1.25,seed:0,color1:"hsla(242.2, 44.3%, 12%, 1)",color2:"hsla(236.1, 80.4%, 70%, 1)",color3:"hsla(0, 0%, 100%, 1)",proportion:.45,softness:1,distortion:.16,swirl:.3,swirlIterations:7,shapeScale:.1,shape:c.Checks}},Fr={name:"The Abyss",params:{scale:.1,rotation:2,speed:.06,seed:0,color1:"hsla(242.2, 44.3%, 12%, 1)",color2:"hsla(236.1, 80.4%, 70%, 1)",color3:"hsla(0, 0%, 100%, 1)",proportion:0,softness:1,distortion:.09,swirl:.48,swirlIterations:4,shapeScale:.1,shape:c.Edge}},wr={name:"Live Ink",params:{scale:.7,rotation:1.5,speed:.25,seed:0,color1:"hsla(210, 11.1%, 7.1%, 1)",color2:"hsla(165, 9%, 65.1%, 1)",color3:"hsla(84, 100%, 97.1%, 1)",proportion:.35,softness:0,distortion:.25,swirl:.8,swirlIterations:10,shapeScale:.26,shape:c.Checks}},vr={name:"Iceberg",params:{scale:1.1,rotation:2,speed:.05,seed:0,color1:"hsla(0, 0%, 100%, 1)",color2:"hsla(220, 38.7%, 32%, 1)",color3:"hsla(129.2, 41.9%, 6.1%, 1)",proportion:.3,softness:1,distortion:.2,swirl:.86,swirlIterations:7,shapeScale:0,shape:c.Checks}},Br={name:"Nectar",params:{scale:.24,rotation:0,speed:.42,seed:0,color1:"hsla(37.5, 22.2%, 7.1%, 1)",color2:"hsla(38.5, 59.1%, 63.1%, 1)",color3:"hsla(37.6, 30%, 95.2%, 1)",proportion:.24,softness:1,distortion:.21,swirl:.57,swirlIterations:10,shapeScale:.32,shape:c.Edge}},Xr={name:"Filtered Light",params:{scale:2,rotation:.44,speed:.32,seed:0,color1:"hsla(60.2, 7.8%, 8.3%, 1)",color2:"hsla(64.4, 27.8%, 81%, 1)",color3:"hsla(60, 100%, 93.9%, 1)",proportion:.25,softness:1,distortion:.06,swirl:0,swirlIterations:0,shapeScale:0,shape:c.Stripes}},qr={name:"Kelp",params:{scale:.38,rotation:.6,speed:2,seed:0,color1:"hsla(79.3, 100%, 78%, 1)",color2:"hsla(112, 10.5%, 28%, 1)",color3:"hsla(203.3, 50%, 7.1%, 1)",proportion:1,softness:0,distortion:0,swirl:.15,swirlIterations:0,shapeScale:.74,shape:c.Stripes}},Ur=[t,Fr,Nr,Xr,vr,wr,qr,Br,zr,Wr,Dr],Or=e=>{let r=Mr(()=>({u_scale:e.scale??t.params.scale,u_rotation:e.rotation??t.params.rotation,u_color1:w(e.color1,t.params.color1),u_color2:w(e.color2,t.params.color2),u_color3:w(e.color3,t.params.color2),u_proportion:e.proportion??t.params.proportion,u_softness:e.softness??t.params.softness,u_distortion:e.distortion??t.params.distortion,u_swirl:e.swirl??t.params.swirl,u_swirlIterations:e.swirlIterations??t.params.swirlIterations,u_shapeScale:e.shapeScale??t.params.shapeScale,u_shape:e.shape??t.params.shape}),[e.scale,e.rotation,e.color1,e.color2,e.color3,e.proportion,e.softness,e.distortion,e.swirl,e.swirlIterations,e.shapeScale,e.shape]);return Ir(o,{...e,fragmentShader:Rr,uniforms:r})};import{PatternShapes as Ma}from"@paper-design/shaders";import{useMemo as Er}from"react";import{getShaderColorFromString as _,godRaysFragmentShader as Yr}from"@paper-design/shaders";import{jsx as Kr}from"react/jsx-runtime";var l={name:"Default",params:{colorBack:"hsla(215, 100%, 11%, 1)",color1:"hsla(45, 100%, 70%, 1)",color2:"hsla(10, 100%, 80%, 1)",color3:"hsla(178, 100%, 83%, 1)",offsetX:-.6,offsetY:-.6,frequency:6,spotty:.28,midIntensity:.97,midSize:2,density:.3,blending:0,speed:1,seed:0}},Vr={name:"Aurora",params:{colorBack:"hsla(0, 0%, 25%, 1)",color1:"hsla(239, 100%, 70%, 1)",color2:"hsla(150, 100%, 70%, 1)",color3:"hsla(200, 100%, 70%, 1)",offsetX:0,offsetY:1,frequency:2.4,spotty:.9,midIntensity:.8,midSize:2.1,density:.5,blending:1,speed:.5,seed:0}},Tr={name:"Warp",params:{colorBack:"hsla(0, 0%, 0%, 1)",color1:"hsla(317, 100%, 50%, 1)",color2:"hsla(25, 100%, 50%, 1)",color3:"hsla(0, 0%, 100%, 1)",offsetX:0,offsetY:0,frequency:1.2,spotty:.15,midIntensity:0,midSize:0,density:.79,blending:.4,speed:2,seed:0}},Jr={name:"Linear",params:{colorBack:"hsla(0, 0%, 0%, 1)",color1:"hsl(0 0% 100% / 12%)",color2:"hsl(0 0% 100% / 24%)",color3:"hsl(0 0% 100% / 16%)",offsetX:.2,offsetY:-.7,frequency:1.2,spotty:.25,midSize:1.1,midIntensity:.75,density:.79,blending:1,speed:.5,seed:0}},Ar={name:"Ether",params:{colorBack:"hsl(226.7 50% 7.1% / 100%)",color1:"hsl(215 100% 53.9% / 65.1%)",color2:"hsl(214.4 85.9% 86.1% / 74.9%)",color3:"hsl(225 31.4% 20% / 100%)",offsetX:-.6,offsetY:0,frequency:.3,spotty:.77,midSize:1.1,midIntensity:.5,density:.6,blending:.6,speed:1,seed:0}},Lr=[l,Vr,Tr,Jr,Ar],Hr=e=>{let r=Er(()=>({u_colorBack:_(e.colorBack,l.params.colorBack),u_color1:_(e.color1,l.params.color1),u_color2:_(e.color2,l.params.color2),u_color3:_(e.color3,l.params.color3),u_offsetX:e.offsetX??l.params.offsetX,u_offsetY:e.offsetY??l.params.offsetY,u_frequency:e.frequency??l.params.frequency,u_spotty:e.spotty??l.params.spotty,u_midIntensity:e.midIntensity??l.params.midIntensity,u_midSize:e.midSize??l.params.midSize,u_density:e.density??l.params.density,u_blending:e.blending??l.params.blending}),[e.colorBack,e.color1,e.color2,e.color3,e.offsetX,e.offsetY,e.frequency,e.spotty,e.midIntensity,e.midSize,e.density,e.blending]);return Kr(o,{...e,fragmentShader:Yr,uniforms:r})};import{}from"@paper-design/shaders";import{useMemo as Zr}from"react";import{getShaderColorFromString as I,spiralFragmentShader as Qr}from"@paper-design/shaders";import{jsx as lo}from"react/jsx-runtime";var s={name:"Default",params:{color1:"hsla(0, 0%, 90%, 1)",color2:"hsla(0, 0%, 25%, 1)",scale:1,offsetX:0,offsetY:0,spiralDensity:0,spiralDistortion:0,strokeWidth:.5,strokeTaper:0,strokeCap:0,noiseFreq:0,noisePower:0,blur:.01,speed:1,seed:0}},$r={name:"Noisy",params:{color1:"hsla(87, 77%, 53%, 1)",color2:"hsla(109, 70%, 31%, 1)",scale:1.3,offsetX:0,offsetY:0,spiralDensity:.5,spiralDistortion:0,strokeWidth:.5,strokeTaper:0,strokeCap:.5,noiseFreq:.1,noisePower:1,blur:0,speed:1,seed:0}},jr={name:"Droplet",params:{color1:"hsla(320, 50%, 50%, 1)",color2:"hsla(190, 50%, 95%, 1)",scale:.65,offsetX:0,offsetY:0,spiralDensity:0,spiralDistortion:0,strokeWidth:.05,strokeTaper:0,strokeCap:1,noiseFreq:0,noisePower:0,blur:0,speed:1,seed:0}},eo={name:"Sand",params:{color1:"hsla(45, 25%, 50%, 1)",color2:"hsla(0, 0%, 87%, 1)",scale:3,offsetX:0,offsetY:0,spiralDensity:0,spiralDistortion:0,strokeWidth:.15,strokeTaper:0,strokeCap:0,noiseFreq:30,noisePower:1,blur:.2,speed:0,seed:0}},ro={name:"Swirl",params:{color1:"hsla(160, 50%, 80%, 1)",color2:"hsla(220, 50%, 20%, 1)",scale:4,offsetX:0,offsetY:0,spiralDensity:.8,spiralDistortion:0,strokeWidth:.5,strokeTaper:0,strokeCap:0,noiseFreq:0,noisePower:0,blur:.5,speed:1,seed:0}},oo={name:"Hook",params:{color1:"hsla(0, 0%, 0%, 1)",color2:"hsla(200, 50%, 70%, 1)",scale:.8,offsetX:0,offsetY:0,spiralDensity:0,spiralDistortion:0,strokeWidth:.5,strokeTaper:.5,strokeCap:0,noiseFreq:0,noisePower:0,blur:.02,speed:3,seed:0}},so={name:"Vinyl",params:{color1:"hsla(0, 0%, 15%, 1)",color2:"hsla(320, 5%, 75%, 1)",scale:1,offsetX:0,offsetY:0,spiralDensity:0,spiralDistortion:.3,strokeWidth:.95,strokeTaper:0,strokeCap:1,noiseFreq:0,noisePower:0,blur:.11,speed:1,seed:0}},ao=[s,$r,jr,ro,eo,oo,so],to=e=>{let r=Zr(()=>({u_color1:I(e.color1,s.params.color1),u_color2:I(e.color2,s.params.color2),u_scale:e.scale??s.params.scale,u_offsetX:e.offsetX??s.params.offsetX,u_offsetY:e.offsetY??s.params.offsetY,u_spiralDensity:e.spiralDensity??s.params.spiralDensity,u_spiralDistortion:e.spiralDistortion??s.params.spiralDistortion,u_strokeWidth:e.strokeWidth??s.params.strokeWidth,u_strokeTaper:e.strokeTaper??s.params.strokeTaper,u_strokeCap:e.strokeCap??s.params.strokeCap,u_noiseFreq:e.noiseFreq??s.params.noiseFreq,u_noisePower:e.noisePower??s.params.noisePower,u_blur:e.blur??s.params.blur}),[e.color1,e.color2,e.scale,e.offsetX,e.offsetY,e.spiralDensity,e.spiralDistortion,e.strokeWidth,e.strokeTaper,e.strokeCap,e.noiseFreq,e.noisePower,e.blur]);return lo(o,{...e,fragmentShader:Qr,uniforms:r})};import{}from"@paper-design/shaders";import{getShaderColorFromString as Xa}from"@paper-design/shaders";export{we as DotsGrid,ra as DotsGridShapes,xe as DotsOrbit,Hr as GodRays,H as GrainClouds,re as MeshGradient,Ae as Metaballs,Pe as NeuroNoise,Ma as PatternShapes,pr as PerlinNoise,o as ShaderMount,me as SmokeRing,to as Spiral,Ee as SteppedSimplexNoise,Gr as Voronoi,Or as Warp,or as Waves,Fe as dotsGridPresets,be as dotsOrbitPresets,Xa as getShaderColorFromString,Lr as godRaysPresets,L as grainCloudsPresets,ee as meshGradientPresets,Je as metaballsPresets,Se as neuroNoisePresets,dr as perlinNoisePresets,ce as smokeRingPresets,ao as spiralPresets,Ie as steppedSimplexNoisePresets,Cr as voronoiPresets,Ur as warpPresets,rr as wavesPresets};
|
|
2
|
+
import{useEffect as D,useRef as O}from"react";import{ShaderMount as J}from"@paper-design/shaders";import{jsx as L}from"react/jsx-runtime";var B=e=>{let o={},R=[],b=a=>{try{return a.startsWith("/")||new URL(a),!0}catch{return!1}},N=a=>{try{return a.startsWith("/")?!1:new URL(a,window.location.origin).origin!==window.location.origin}catch{return!1}};return Object.entries(e).forEach(([a,i])=>{if(typeof i=="string"){if(!b(i)){console.warn(`Uniform "${a}" has invalid URL "${i}". Skipping image loading.`);return}let x=new Promise((p,F)=>{let u=new Image;N(i)&&(u.crossOrigin="anonymous"),u.onload=()=>{o[a]=u,p()},u.onerror=()=>{console.error(`Could not set uniforms. Failed to load image at ${i}`),F()},u.src=i});R.push(x)}else o[a]=i}),Promise.all(R).then(()=>o)},r=({ref:e,fragmentShader:o,style:R,uniforms:b={},webGlContextAttributes:N,speed:a=1,seed:i=0})=>{let x=e??O(null),p=O(null);return D(()=>((async()=>{let u=await B(b);x.current&&!p.current&&(p.current=new J(x.current,o,u,N,a,i))})(),()=>{p.current?.dispose(),p.current=null}),[o,N]),D(()=>{(async()=>{let u=await B(b);p.current?.setUniforms(u)})()},[b]),D(()=>{p.current?.setSpeed(a)},[a]),D(()=>{p.current?.setSeed(i)},[i]),L("canvas",{ref:x,style:R})};import{useMemo as A}from"react";import{getShaderColorFromString as I,grainCloudsFragmentShader as H}from"@paper-design/shaders";import{jsx as Q}from"react/jsx-runtime";var k={name:"Default",params:{scale:1,speed:.3,seed:0,color1:"hsla(0, 0%, 0%, 1)",color2:"hsla(0, 0%, 100%, 1)",grainAmount:1}},$={name:"Sky",params:{scale:1,speed:.3,seed:0,color1:"hsla(218, 100%, 73%, 1)",color2:"hsla(0, 0%, 100%, 1)",grainAmount:0}},K=[k,$],Z=e=>{let o=A(()=>({u_scale:e.scale??k.params.scale,u_color1:I(e.color1,k.params.color1),u_color2:I(e.color2,k.params.color2),u_grainAmount:e.grainAmount??k.params.grainAmount}),[e.scale,e.color1,e.color2,e.grainAmount]);return Q(r,{...e,fragmentShader:H,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as j}from"react";import{getShaderColorFromString as z,meshGradientFragmentShader as ee}from"@paper-design/shaders";import{jsx as te}from"react/jsx-runtime";var C={name:"Default",params:{speed:.15,seed:0,color1:"hsla(259, 29%, 73%, 1)",color2:"hsla(263, 57%, 39%, 1)",color3:"hsla(48, 73%, 84%, 1)",color4:"hsla(295, 32%, 70%, 1)"}},oe={name:"Beach",params:{speed:.1,seed:0,color1:"hsla(186, 81%, 83%, 1)",color2:"hsla(198, 55%, 68%, 1)",color3:"hsla(53, 67%, 88%, 1)",color4:"hsla(45, 93%, 73%, 1)"}},re={name:"Faded",params:{speed:-.3,seed:0,color1:"hsla(186, 41%, 90%, 1)",color2:"hsla(208, 71%, 85%, 1)",color3:"hsla(183, 51%, 92%, 1)",color4:"hsla(201, 72%, 90%, 1)"}},se=[C,oe,re],ae=e=>{let o=j(()=>({u_color1:z(e.color1,C.params.color1),u_color2:z(e.color2,C.params.color2),u_color3:z(e.color3,C.params.color3),u_color4:z(e.color4,C.params.color4)}),[e.color1,e.color2,e.color3,e.color4]);return te(r,{...e,fragmentShader:ee,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as le}from"react";import{getShaderColorFromString as U,smokeRingFragmentShader as ne}from"@paper-design/shaders";import{jsx as he}from"react/jsx-runtime";var g={name:"Default",params:{scale:1,speed:1,seed:0,colorBack:"hsla(208, 54%, 7%, 1)",colorInner:"hsla(0, 0%, 100%, 1)",colorOuter:"hsla(211, 100%, 64%, 1)",noiseScale:1.4,thickness:.33}},ie={name:"Cloud",params:{scale:1,speed:1,seed:0,colorBack:"hsla(218, 100%, 62%, 1)",colorInner:"hsla(0, 0%, 100%, 1)",colorOuter:"hsla(0, 0%, 100%, 1)",noiseScale:1.8,thickness:.7}},ce={name:"Fire",params:{scale:1,speed:4,seed:0,colorBack:"hsla(20, 100%, 5%, 1)",colorInner:"hsla(40, 100%, 50%, 1)",colorOuter:"hsla(0, 100%, 50%, 1)",noiseScale:1.4,thickness:.35}},me={name:"Electric",params:{scale:1,speed:-2.5,seed:0,colorBack:"hsla(47, 50%, 7%, 1)",colorInner:"hsla(47, 100%, 64%, 1)",colorOuter:"hsla(47, 100%, 64%, 1)",noiseScale:1.8,thickness:.1}},de={name:"Poison",params:{scale:1,speed:3,seed:0,colorBack:"hsla(120, 100%, 3%, 1)",colorInner:"hsla(120, 100%, 3%, 1)",colorOuter:"hsla(120, 100%, 66%, 1)",noiseScale:5,thickness:.6}},pe=[g,ie,ce,me,de],ue=e=>{let o=le(()=>({u_scale:e.scale??g.params.scale,u_colorBack:U(e.colorBack,g.params.colorBack),u_colorInner:U(e.colorInner,g.params.colorInner),u_colorOuter:U(e.colorOuter,g.params.colorOuter),u_noiseScale:e.noiseScale??g.params.noiseScale,u_thickness:e.thickness??g.params.thickness}),[e.scale,e.colorBack,e.colorInner,e.colorOuter,e.noiseScale,e.thickness]);return he(r,{...e,fragmentShader:ne,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as fe}from"react";import{getShaderColorFromString as E,neuroNoiseFragmentShader as Se}from"@paper-design/shaders";import{jsx as be}from"react/jsx-runtime";var G={name:"Default",params:{scale:1,speed:1,seed:0,colorFront:"hsla(261, 100%, 82%, 1)",colorBack:"hsla(0, 0%, 0%, 1)",brightness:1.3}},Pe={name:"Marble",params:{scale:.4,speed:0,seed:0,colorFront:"hsla(230, 24%, 15%, 1)",colorBack:"hsla(0, 0%, 97%, 1)",brightness:1.1}},ge=[G,Pe],ye=e=>{let o=fe(()=>({u_scale:e.scale??G.params.scale,u_colorFront:E(e.colorFront,G.params.colorFront),u_colorBack:E(e.colorBack,G.params.colorBack),u_brightness:e.brightness??G.params.brightness}),[e.scale,e.colorFront,e.colorBack,e.brightness]);return be(r,{...e,fragmentShader:Se,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as xe}from"react";import{getShaderColorFromString as W,dotsOrbitFragmentShader as ke}from"@paper-design/shaders";import{jsx as Me}from"react/jsx-runtime";var h={name:"Default",params:{scale:1,speed:2,seed:0,color1:"hsla(358, 66%, 49%, 1)",color2:"hsla(145, 30%, 33%, 1)",color3:"hsla(39, 88%, 52%, 1)",color4:"hsla(274, 30%, 35%, 1)",dotSize:.7,dotSizeRange:.4,spreading:1}},Ce=[h],Ge=e=>{let o=xe(()=>({u_scale:e.scale??h.params.scale,u_color1:W(e.color1,h.params.color1),u_color2:W(e.color2,h.params.color2),u_color3:W(e.color3,h.params.color3),u_color4:W(e.color4,h.params.color4),u_dotSize:e.dotSize??h.params.dotSize,u_dotSizeRange:e.dotSizeRange??h.params.dotSizeRange,u_spreading:e.spreading??h.params.spreading}),[e.scale,e.color1,e.color2,e.color3,e.color4,e.dotSize,e.dotSizeRange,e.spreading]);return Me(r,{...e,fragmentShader:ke,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as _e}from"react";import{dotsGridFragmentShader as Re,getShaderColorFromString as v,DotsGridShapes as f}from"@paper-design/shaders";import{jsx as Oe}from"react/jsx-runtime";var c={name:"Default",params:{colorBack:"hsla(358, 66%, 49%, 0)",colorFill:"hsla(145, 30%, 10%, 1)",colorStroke:"hsla(39, 88%, 52%, 1)",dotSize:2,gridSpacingX:50,gridSpacingY:50,strokeWidth:0,sizeRange:0,opacityRange:0,shape:f.Circle}},Ne={name:"Macrodata",params:{colorBack:"hsla(211, 37%, 13%, 1)",colorFill:"hsla(218, 100%, 67%, 1)",colorStroke:"hsla(0, 0%, 0%, 1)",dotSize:3,gridSpacingX:25,gridSpacingY:25,strokeWidth:0,sizeRange:.25,opacityRange:.9,shape:f.Circle}},De={name:"Triangles",params:{colorBack:"hsla(0, 0%, 100%, 1)",colorFill:"hsla(0, 0%, 100%, 1)",colorStroke:"hsla(0, 0%, 0%, .5)",dotSize:5,gridSpacingX:32,gridSpacingY:32,strokeWidth:1,sizeRange:0,opacityRange:0,shape:f.Triangle}},ze={name:"Bubbles",params:{colorBack:"hsla(234, 100%, 31%, .5)",colorFill:"hsla(100, 30%, 100%, 1)",colorStroke:"hsla(0, 100%, 0%, 1)",dotSize:28,gridSpacingX:60,gridSpacingY:60,strokeWidth:12,sizeRange:.7,opacityRange:1.3,shape:f.Circle}},We={name:"Tree line",params:{colorBack:"hsla(100, 100%, 36%, .05)",colorFill:"hsla(150, 80%, 10%, 1)",colorStroke:"hsla(0, 0%, 0%, 1)",dotSize:8,gridSpacingX:20,gridSpacingY:90,strokeWidth:0,sizeRange:1,opacityRange:.6,shape:f.Circle}},we={name:"Diamonds",params:{colorBack:"hsla(0, 0%, 0%, 0)",colorFill:"hsla(0, 100%, 50%, 1)",colorStroke:"hsla(0, 0%, 0%, 1)",dotSize:15,gridSpacingX:30,gridSpacingY:30,strokeWidth:0,sizeRange:0,opacityRange:2,shape:f.Diamond}},Fe={name:"Wallpaper",params:{colorBack:"hsla(154, 33%, 19%, 1)",colorFill:"hsla(0, 0%, 0%, 0)",colorStroke:"hsla(36, 48%, 58%, 1)",dotSize:9,gridSpacingX:32,gridSpacingY:32,strokeWidth:1,sizeRange:0,opacityRange:0,shape:f.Diamond}},Ue={name:"Enter the Matrix",params:{colorBack:"hsla(0, 100%, 0%, 1)",colorFill:"hsla(182, 100%, 64%, 1)",colorStroke:"hsla(0, 100%, 100%, 0)",dotSize:2,gridSpacingX:10,gridSpacingY:10,strokeWidth:.5,sizeRange:.25,opacityRange:1,shape:f.Triangle}},ve={name:"Waveform",params:{colorBack:"hsla(0, 100%, 100%, 1)",colorFill:"hsla(227, 93%, 38%, 1)",colorStroke:"hsla(0, 0%, 0%, 0)",dotSize:100,gridSpacingX:2,gridSpacingY:215,strokeWidth:0,sizeRange:1,opacityRange:0,shape:f.Square}},Xe=[c,Ne,De,ze,We,we,Fe,Ue,ve],qe=e=>{let o=_e(()=>({u_colorBack:v(e.colorBack,c.params.colorBack),u_colorFill:v(e.colorFill,c.params.colorStroke),u_colorStroke:v(e.colorStroke,c.params.colorStroke),u_dotSize:e.dotSize??c.params.dotSize,u_gridSpacingX:e.gridSpacingX??c.params.gridSpacingX,u_gridSpacingY:e.gridSpacingY??c.params.gridSpacingY,u_strokeWidth:e.strokeWidth??c.params.strokeWidth,u_sizeRange:e.sizeRange??c.params.sizeRange,u_opacityRange:e.opacityRange??c.params.opacityRange,u_shape:e.shape??c.params.shape}),[e.colorBack,e.colorFill,e.colorStroke,e.dotSize,e.gridSpacingX,e.gridSpacingY,e.strokeWidth,e.sizeRange,e.opacityRange,e.shape]);return Oe(r,{...e,fragmentShader:Re,uniforms:o})};import{DotsGridShapes as ta}from"@paper-design/shaders";import{useMemo as Be}from"react";import{getShaderColorFromString as M,steppedSimplexNoiseFragmentShader as Ie}from"@paper-design/shaders";import{jsx as Le}from"react/jsx-runtime";var P={name:"Default",params:{scale:1,speed:.15,seed:0,color1:"hsla(208, 25%, 45%, 1)",color2:"hsla(94, 38%, 59%, 1)",color3:"hsla(359, 94%, 62%, 1)",color4:"hsla(42, 93%, 64%, 1)",color5:"hsla(0, 0%, 100%, 1)",stepsNumber:13}},Ee={name:"Magma",params:{scale:.3,speed:.2,seed:0,color1:"hsla(0, 100%, 36%, 1)",color2:"hsla(0, 95%, 44%, 1)",color3:"hsla(20, 100%, 49%, 1)",color4:"hsla(45, 100%, 45%, 1)",color5:"hsla(31, 100%, 94%, 1)",stepsNumber:8}},Ye={name:"Blood cell",params:{scale:1.2,speed:.22,seed:0,color1:"hsla(302, 43%, 13%, 1)",color2:"hsla(325, 93%, 17%, 1)",color3:"hsla(338, 80%, 25%, 1)",color4:"hsla(338, 80%, 25%, 1)",color5:"hsla(2, 85%, 72%, 1)",stepsNumber:29}},Ve={name:"First contact",params:{scale:1.2,speed:-.1,seed:0,color1:"hsla(300, 43%, 82%, 1)",color2:"hsla(266, 70%, 9%, 1)",color3:"hsla(289, 36%, 26%, 1)",color4:"hsla(0, 41%, 78%, 1)",color5:"hsla(0, 100%, 96%, 1)",stepsNumber:40}},Te=[P,Ee,Ye,Ve],Je=e=>{let o=Be(()=>({u_scale:e.scale??P.params.scale,u_color1:M(e.color1,P.params.color1),u_color2:M(e.color2,P.params.color2),u_color3:M(e.color3,P.params.color3),u_color4:M(e.color4,P.params.color4),u_color5:M(e.color5,P.params.color5),u_steps_number:e.stepsNumber??P.params.stepsNumber}),[e.scale,e.color1,e.color2,e.color3,e.color4,e.color5,e.stepsNumber]);return Le(r,{...e,fragmentShader:Ie,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as Ae}from"react";import{getShaderColorFromString as X,metaballsFragmentShader as He}from"@paper-design/shaders";import{jsx as Ze}from"react/jsx-runtime";var y={name:"Default",params:{scale:1,speed:.6,seed:0,color1:"hsla(350, 90%, 55%, 1)",color2:"hsla(350, 80%, 60%, 1)",color3:"hsla(20, 85%, 70%, 1)",ballSize:1,visibilityRange:.4}},$e=[y],Ke=e=>{let o=Ae(()=>({u_scale:e.scale??y.params.scale,u_color1:X(e.color1,y.params.color1),u_color2:X(e.color2,y.params.color2),u_color3:X(e.color3,y.params.color3),u_ballSize:e.ballSize??y.params.ballSize,u_visibilityRange:e.visibilityRange??y.params.visibilityRange}),[e.scale,e.color1,e.color2,e.color3,e.ballSize,e.visibilityRange]);return Ze(r,{...e,fragmentShader:He,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as Qe}from"react";import{getShaderColorFromString as Y,wavesFragmentShader as je}from"@paper-design/shaders";import{jsx as no}from"react/jsx-runtime";var m={name:"Default",params:{scale:1,rotation:0,color1:"hsla(48, 100%, 74%, 1)",color2:"hsla(204, 47%, 45%, 1)",shape:1,frequency:.5,amplitude:.5,spacing:.75,dutyCycle:.2,softness:0}},eo={name:"Spikes",params:{scale:2.3,rotation:0,color1:"hsla(65, 100%, 95%, 1)",color2:"hsla(290, 52%, 15%, 1)",shape:0,frequency:.5,amplitude:.9,spacing:.37,dutyCycle:.93,softness:.15}},oo={name:"Groovy",params:{scale:.5,rotation:1,color1:"hsla(60, 100%, 97%, 1)",color2:"hsla(20, 100%, 71%, 1)",shape:2.37,frequency:.2,amplitude:.67,spacing:1.17,dutyCycle:.57,softness:0}},ro={name:"Tangled up",params:{scale:3.04,rotation:1,color1:"hsla(198.7, 66.7%, 14.1%, 1)",color2:"hsla(85.5, 35.7%, 78%, 1)",shape:3,frequency:.44,amplitude:.57,spacing:1.05,dutyCycle:.97,softness:0}},so={name:"Zig zag",params:{scale:2.7,rotation:1,color1:"hsla(0, 0%, 0%, 1)",color2:"hsla(0, 0%, 90%, 1)",shape:0,frequency:.6,amplitude:.8,spacing:.5,dutyCycle:1,softness:.5}},ao={name:"Ride the wave",params:{scale:.84,rotation:0,color1:"hsla(65, 100%, 95%, 1)",color2:"hsla(0, 0%, 12%, 1)",shape:2.23,frequency:.1,amplitude:.6,spacing:.41,dutyCycle:.99,softness:0}},to=[m,eo,oo,ro,so,ao],lo=e=>{let o=Qe(()=>({u_scale:e.scale??m.params.scale,u_rotation:e.rotation??m.params.rotation,u_color1:Y(e.color1,m.params.color1),u_color2:Y(e.color2,m.params.color2),u_shape:e.shape??m.params.shape,u_frequency:e.frequency??m.params.frequency,u_amplitude:e.amplitude??m.params.amplitude,u_spacing:e.spacing??m.params.spacing,u_dutyCycle:e.dutyCycle??m.params.dutyCycle,u_softness:e.softness??m.params.softness}),[e.scale,e.rotation,e.color1,e.color2,e.shape,e.frequency,e.amplitude,e.spacing,e.dutyCycle,e.softness]);return no(r,{...e,fragmentShader:je,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as io}from"react";import{getShaderColorFromString as V,perlinNoiseFragmentShader as co}from"@paper-design/shaders";import{jsx as go}from"react/jsx-runtime";var S={name:"Default",params:{scale:1,speed:.5,seed:0,color1:"hsla(0, 0%, 15%, 1)",color2:"hsla(203, 100%, 87%, 1)",proportion:.34,softness:.1,octaveCount:2,persistence:1,lacunarity:1.5}},mo={name:"Nintendo Water",params:{scale:.2,speed:.4,seed:0,color1:"hsla(220, 66%, 50%, 1)",color2:"hsla(200, 66%, 90%, 1)",proportion:.42,softness:0,octaveCount:2,persistence:.55,lacunarity:1.8}},po={name:"Colony",params:{scale:.15,speed:0,seed:0,color1:"hsla(56, 86%, 81%, 1)",color2:"hsla(230, 80%, 20%, 1)",octaveCount:6,persistence:1,lacunarity:2.55,proportion:.65,softness:.35}},uo={name:"Phosphenes",params:{scale:.03,speed:.15,seed:0,color1:"hsla(350, 80%, 70%, 1)",color2:"hsla(150, 50%, 60%, 1)",proportion:.45,softness:.45,octaveCount:6,persistence:.3,lacunarity:3}},ho={name:"Moss",params:{scale:.15,speed:.02,seed:0,color1:"hsla(137, 100%, 51%, 1)",color2:"hsla(0, 0%, 15%, 1)",proportion:.65,softness:.35,octaveCount:6,persistence:1,lacunarity:2.55}},fo={name:"Worms",params:{scale:2,speed:0,seed:0,color1:"hsla(0, 100%, 100%, 1)",color2:"hsla(0, 0%, 35%, 1)",proportion:.5,softness:0,octaveCount:1,persistence:1,lacunarity:1.5}},So=[S,mo,po,uo,ho,fo],Po=e=>{let o=io(()=>({u_scale:e.scale??S.params.scale,u_color1:V(e.color1,S.params.color1),u_color2:V(e.color2,S.params.color2),u_proportion:e.proportion??S.params.proportion,u_softness:e.softness??S.params.softness,u_octaveCount:e.octaveCount??S.params.octaveCount,u_persistence:e.persistence??S.params.persistence,u_lacunarity:e.lacunarity??S.params.lacunarity}),[e.scale,e.color1,e.color2,e.proportion,e.softness,e.octaveCount,e.persistence,e.lacunarity]);return go(r,{...e,fragmentShader:co,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as yo}from"react";import{getShaderColorFromString as _,voronoiFragmentShader as bo}from"@paper-design/shaders";import{jsx as zo}from"react/jsx-runtime";var t={name:"Default",params:{scale:1.5,speed:.5,seed:0,colorCell1:"hsla(15, 80%, 50%, 1)",colorCell2:"hsla(180, 80%, 50%, 1)",colorCell3:"hsla(200, 80%, 50%, 1)",colorEdges:"hsla(30, 90%, 10%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorGradient:.5,distance:.25,edgesSize:.15,edgesSoftness:.01,middleSize:0,middleSoftness:0}},xo={name:"Classic",params:{scale:3,speed:.8,seed:0,colorCell1:"hsla(0, 100%, 100%, 1)",colorCell2:"hsla(0, 0%, 100%, 1)",colorCell3:"hsla(0, 100%, 0%, 1)",colorEdges:"hsla(0, 0%, 0%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorGradient:1,distance:.45,edgesSize:.02,edgesSoftness:.07,middleSize:0,middleSoftness:0}},ko={name:"Giraffe",params:{scale:1,speed:.6,seed:0,colorCell1:"hsla(32, 100%, 18%, 1)",colorCell2:"hsla(42, 93%, 35%, 1)",colorCell3:"hsla(32, 100%, 18%, 1)",colorEdges:"hsla(45, 100%, 96%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorGradient:1,distance:.25,edgesSize:.2,edgesSoftness:.01,middleSize:0,middleSoftness:0}},Co={name:"Eyes",params:{scale:1.6,speed:.6,seed:0,colorCell1:"hsla(79, 84%, 60%, 1)",colorCell2:"hsla(207, 53%, 41%, 1)",colorCell3:"hsla(207, 80%, 65%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorEdges:"hsla(0, 100%, 100%, 1)",colorGradient:1,distance:.25,edgesSize:.62,edgesSoftness:.01,middleSize:.1,middleSoftness:0}},Go={name:"Bubbles",params:{scale:2,speed:.5,seed:0,colorCell1:"hsla(0, 100%, 50%, 1)",colorCell2:"hsla(169, 100%, 66%, 1)",colorCell3:"hsla(50, 100%, 66%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorEdges:"hsla(0, 0%, 0%, 1)",colorGradient:1,distance:.5,edgesSize:.81,edgesSoftness:0,middleSize:0,middleSoftness:0}},Mo={name:"Cells",params:{scale:2,speed:1,seed:0,colorCell1:"hsla(0, 0%, 100%, 1)",colorCell2:"hsla(0, 0%, 100%, 1)",colorCell3:"hsla(0, 0%, 100%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorEdges:"hsla(200, 50%, 15%, 1)",colorGradient:1,distance:.38,edgesSize:.1,edgesSoftness:.02,middleSize:0,middleSoftness:0}},_o={name:"Glow",params:{scale:1.2,speed:.8,seed:0,colorCell1:"hsla(40, 100%, 50%, 1)",colorCell2:"hsla(311, 100%, 59%, 1)",colorCell3:"hsla(180, 100%, 65%, 1)",colorEdges:"hsla(0, 100%, 0%, 1)",colorMid:"hsla(0, 0%, 100%, 1)",colorGradient:1,distance:.25,edgesSize:.15,edgesSoftness:.01,middleSize:.7,middleSoftness:1}},Ro={name:"Tiles",params:{scale:1.3,speed:1,seed:0,colorCell1:"hsla(80, 50%, 50%, 1)",colorCell2:"hsla(0, 50%, 100%, 1)",colorCell3:"hsla(200, 50%, 50%, 1)",colorMid:"hsla(0, 0%, 0%, 1)",colorEdges:"hsla(200, 50%, 10%, 1)",colorGradient:0,distance:.05,edgesSize:.25,edgesSoftness:.02,middleSize:0,middleSoftness:0}},No=[t,xo,ko,Co,Go,Mo,_o,Ro],Do=e=>{let o=yo(()=>({u_scale:e.scale??t.params.scale,u_colorCell1:_(e.colorCell1,t.params.colorCell1),u_colorCell2:_(e.colorCell2,t.params.colorCell2),u_colorCell3:_(e.colorCell3,t.params.colorCell3),u_colorMid:_(e.colorMid,t.params.colorMid),u_colorEdges:_(e.colorEdges,t.params.colorEdges),u_colorGradient:e.colorGradient??t.params.colorGradient,u_distance:e.distance??t.params.distance,u_edgesSize:e.edgesSize??t.params.edgesSize,u_edgesSoftness:e.edgesSoftness??t.params.edgesSoftness,u_middleSize:e.middleSize??t.params.middleSize,u_middleSoftness:e.middleSoftness??t.params.middleSoftness}),[e.scale,e.colorCell1,e.colorCell3,e.colorCell2,e.colorMid,e.colorEdges,e.colorGradient,e.distance,e.edgesSize,e.edgesSoftness,e.middleSize,e.middleSoftness]);return zo(r,{...e,fragmentShader:bo,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as Wo}from"react";import{getShaderColorFromString as q,warpFragmentShader as wo,PatternShapes as d}from"@paper-design/shaders";import{jsx as Jo}from"react/jsx-runtime";var l={name:"Default",params:{scale:1,rotation:0,speed:.1,seed:0,color1:"hsla(0, 0%, 15%, 1)",color2:"hsla(203, 80%, 70%, 1)",color3:"hsla(0, 0%, 100%, 1)",proportion:.35,softness:1,distortion:.25,swirl:.8,swirlIterations:10,shapeScale:.1,shape:d.Checks}},Fo={name:"Cauldron Pot",params:{scale:1.1,rotation:1.62,speed:1,seed:0,color1:"hsla(100, 51%, 75%, 1)",color2:"hsla(220, 39%, 32%, 1)",color3:"hsla(129.2, 41.9%, 6.1%, 1)",proportion:.64,softness:.95,distortion:.2,swirl:.86,swirlIterations:7,shapeScale:0,shape:d.Edge}},Uo={name:"Silk",params:{scale:.26,rotation:0,speed:.5,seed:0,color1:"hsla(0, 9%, 7%, 1)",color2:"hsla(8, 13%, 34%, 1)",color3:"hsla(5, 8%, 71%, 1)",proportion:0,softness:1,distortion:.3,swirl:.6,swirlIterations:11,shapeScale:.05,shape:d.Stripes}},vo={name:"Passion",params:{scale:.25,rotation:1.35,speed:.3,seed:0,color1:"hsla(0, 44.7%, 14.9%, 1)",color2:"hsla(353.4, 34%, 42.2%, 1)",color3:"hsla(29, 100%, 76.1%, 1)",proportion:.5,softness:1,distortion:.09,swirl:.9,swirlIterations:6,shapeScale:.25,shape:d.Checks}},Xo={name:"Phantom",params:{scale:.68,rotation:1.8,speed:1.25,seed:0,color1:"hsla(242.2, 44.3%, 12%, 1)",color2:"hsla(236.1, 80.4%, 70%, 1)",color3:"hsla(0, 0%, 100%, 1)",proportion:.45,softness:1,distortion:.16,swirl:.3,swirlIterations:7,shapeScale:.1,shape:d.Checks}},qo={name:"The Abyss",params:{scale:.1,rotation:2,speed:.06,seed:0,color1:"hsla(242.2, 44.3%, 12%, 1)",color2:"hsla(236.1, 80.4%, 70%, 1)",color3:"hsla(0, 0%, 100%, 1)",proportion:0,softness:1,distortion:.09,swirl:.48,swirlIterations:4,shapeScale:.1,shape:d.Edge}},Oo={name:"Live Ink",params:{scale:.7,rotation:1.5,speed:.25,seed:0,color1:"hsla(210, 11.1%, 7.1%, 1)",color2:"hsla(165, 9%, 65.1%, 1)",color3:"hsla(84, 100%, 97.1%, 1)",proportion:.35,softness:0,distortion:.25,swirl:.8,swirlIterations:10,shapeScale:.26,shape:d.Checks}},Bo={name:"Iceberg",params:{scale:1.1,rotation:2,speed:.05,seed:0,color1:"hsla(0, 0%, 100%, 1)",color2:"hsla(220, 38.7%, 32%, 1)",color3:"hsla(129.2, 41.9%, 6.1%, 1)",proportion:.3,softness:1,distortion:.2,swirl:.86,swirlIterations:7,shapeScale:0,shape:d.Checks}},Io={name:"Nectar",params:{scale:.24,rotation:0,speed:.42,seed:0,color1:"hsla(37.5, 22.2%, 7.1%, 1)",color2:"hsla(38.5, 59.1%, 63.1%, 1)",color3:"hsla(37.6, 30%, 95.2%, 1)",proportion:.24,softness:1,distortion:.21,swirl:.57,swirlIterations:10,shapeScale:.32,shape:d.Edge}},Eo={name:"Filtered Light",params:{scale:2,rotation:.44,speed:.32,seed:0,color1:"hsla(60.2, 7.8%, 8.3%, 1)",color2:"hsla(64.4, 27.8%, 81%, 1)",color3:"hsla(60, 100%, 93.9%, 1)",proportion:.25,softness:1,distortion:.06,swirl:0,swirlIterations:0,shapeScale:0,shape:d.Stripes}},Yo={name:"Kelp",params:{scale:.38,rotation:.6,speed:2,seed:0,color1:"hsla(79.3, 100%, 78%, 1)",color2:"hsla(112, 10.5%, 28%, 1)",color3:"hsla(203.3, 50%, 7.1%, 1)",proportion:1,softness:0,distortion:0,swirl:.15,swirlIterations:0,shapeScale:.74,shape:d.Stripes}},Vo=[l,qo,Fo,Eo,Bo,Oo,Yo,Io,vo,Xo,Uo],To=e=>{let o=Wo(()=>({u_scale:e.scale??l.params.scale,u_rotation:e.rotation??l.params.rotation,u_color1:q(e.color1,l.params.color1),u_color2:q(e.color2,l.params.color2),u_color3:q(e.color3,l.params.color2),u_proportion:e.proportion??l.params.proportion,u_softness:e.softness??l.params.softness,u_distortion:e.distortion??l.params.distortion,u_swirl:e.swirl??l.params.swirl,u_swirlIterations:e.swirlIterations??l.params.swirlIterations,u_shapeScale:e.shapeScale??l.params.shapeScale,u_shape:e.shape??l.params.shape}),[e.scale,e.rotation,e.color1,e.color2,e.color3,e.proportion,e.softness,e.distortion,e.swirl,e.swirlIterations,e.shapeScale,e.shape]);return Jo(r,{...e,fragmentShader:wo,uniforms:o})};import{PatternShapes as za}from"@paper-design/shaders";import{useMemo as Lo}from"react";import{getShaderColorFromString as w,godRaysFragmentShader as Ao}from"@paper-design/shaders";import{jsx as er}from"react/jsx-runtime";var n={name:"Default",params:{colorBack:"hsla(215, 100%, 11%, 1)",color1:"hsla(45, 100%, 70%, 1)",color2:"hsla(10, 100%, 80%, 1)",color3:"hsla(178, 100%, 83%, 1)",offsetX:-.6,offsetY:-.6,frequency:6,spotty:.28,midIntensity:.97,midSize:2,density:.3,blending:0,speed:1,seed:0}},Ho={name:"Aurora",params:{colorBack:"hsla(0, 0%, 25%, 1)",color1:"hsla(239, 100%, 70%, 1)",color2:"hsla(150, 100%, 70%, 1)",color3:"hsla(200, 100%, 70%, 1)",offsetX:0,offsetY:1,frequency:2.4,spotty:.9,midIntensity:.8,midSize:2.1,density:.5,blending:1,speed:.5,seed:0}},$o={name:"Warp",params:{colorBack:"hsla(0, 0%, 0%, 1)",color1:"hsla(317, 100%, 50%, 1)",color2:"hsla(25, 100%, 50%, 1)",color3:"hsla(0, 0%, 100%, 1)",offsetX:0,offsetY:0,frequency:1.2,spotty:.15,midIntensity:0,midSize:0,density:.79,blending:.4,speed:2,seed:0}},Ko={name:"Linear",params:{colorBack:"hsla(0, 0%, 0%, 1)",color1:"hsl(0 0% 100% / 12%)",color2:"hsl(0 0% 100% / 24%)",color3:"hsl(0 0% 100% / 16%)",offsetX:.2,offsetY:-.7,frequency:1.2,spotty:.25,midSize:1.1,midIntensity:.75,density:.79,blending:1,speed:.5,seed:0}},Zo={name:"Ether",params:{colorBack:"hsl(226.7 50% 7.1% / 100%)",color1:"hsl(215 100% 53.9% / 65.1%)",color2:"hsl(214.4 85.9% 86.1% / 74.9%)",color3:"hsl(225 31.4% 20% / 100%)",offsetX:-.6,offsetY:0,frequency:.3,spotty:.77,midSize:1.1,midIntensity:.5,density:.6,blending:.6,speed:1,seed:0}},Qo=[n,Ho,$o,Ko,Zo],jo=e=>{let o=Lo(()=>({u_colorBack:w(e.colorBack,n.params.colorBack),u_color1:w(e.color1,n.params.color1),u_color2:w(e.color2,n.params.color2),u_color3:w(e.color3,n.params.color3),u_offsetX:e.offsetX??n.params.offsetX,u_offsetY:e.offsetY??n.params.offsetY,u_frequency:e.frequency??n.params.frequency,u_spotty:e.spotty??n.params.spotty,u_midIntensity:e.midIntensity??n.params.midIntensity,u_midSize:e.midSize??n.params.midSize,u_density:e.density??n.params.density,u_blending:e.blending??n.params.blending}),[e.colorBack,e.color1,e.color2,e.color3,e.offsetX,e.offsetY,e.frequency,e.spotty,e.midIntensity,e.midSize,e.density,e.blending]);return er(r,{...e,fragmentShader:Ao,uniforms:o})};import{}from"@paper-design/shaders";import{useMemo as or}from"react";import{getShaderColorFromString as T,spiralFragmentShader as rr}from"@paper-design/shaders";import{jsx as dr}from"react/jsx-runtime";var s={name:"Default",params:{color1:"hsla(0, 0%, 90%, 1)",color2:"hsla(0, 0%, 25%, 1)",scale:1,offsetX:0,offsetY:0,spiralDensity:0,spiralDistortion:0,strokeWidth:.5,strokeTaper:0,strokeCap:0,noiseFreq:0,noisePower:0,softness:.01,speed:1,seed:0}},sr={name:"Noisy",params:{color1:"hsla(87, 77%, 53%, 1)",color2:"hsla(109, 70%, 31%, 1)",scale:1.3,offsetX:0,offsetY:0,spiralDensity:.5,spiralDistortion:0,strokeWidth:.5,strokeTaper:0,strokeCap:.5,noiseFreq:.1,noisePower:1,softness:0,speed:1,seed:0}},ar={name:"Droplet",params:{color1:"hsla(320, 50%, 50%, 1)",color2:"hsla(190, 50%, 95%, 1)",scale:.65,offsetX:0,offsetY:0,spiralDensity:0,spiralDistortion:0,strokeWidth:.05,strokeTaper:0,strokeCap:1,noiseFreq:0,noisePower:0,softness:0,speed:1,seed:0}},tr={name:"Sand",params:{color1:"hsla(45, 25%, 50%, 1)",color2:"hsla(0, 0%, 87%, 1)",scale:3,offsetX:0,offsetY:0,spiralDensity:0,spiralDistortion:0,strokeWidth:.15,strokeTaper:0,strokeCap:0,noiseFreq:30,noisePower:1,softness:.2,speed:0,seed:0}},lr={name:"Swirl",params:{color1:"hsla(160, 50%, 80%, 1)",color2:"hsla(220, 50%, 20%, 1)",scale:4,offsetX:0,offsetY:0,spiralDensity:.8,spiralDistortion:0,strokeWidth:.5,strokeTaper:0,strokeCap:0,noiseFreq:0,noisePower:0,softness:.5,speed:1,seed:0}},nr={name:"Hook",params:{color1:"hsla(0, 0%, 0%, 1)",color2:"hsla(200, 50%, 70%, 1)",scale:.8,offsetX:0,offsetY:0,spiralDensity:0,spiralDistortion:0,strokeWidth:.5,strokeTaper:.5,strokeCap:0,noiseFreq:0,noisePower:0,softness:.02,speed:3,seed:0}},ir={name:"Vinyl",params:{color1:"hsla(0, 0%, 15%, 1)",color2:"hsla(320, 5%, 75%, 1)",scale:1,offsetX:0,offsetY:0,spiralDensity:0,spiralDistortion:.3,strokeWidth:.95,strokeTaper:0,strokeCap:1,noiseFreq:0,noisePower:0,softness:.11,speed:1,seed:0}},cr=[s,sr,ar,lr,tr,nr,ir],mr=e=>{let o=or(()=>({u_color1:T(e.color1,s.params.color1),u_color2:T(e.color2,s.params.color2),u_scale:e.scale??s.params.scale,u_offsetX:e.offsetX??s.params.offsetX,u_offsetY:e.offsetY??s.params.offsetY,u_spiralDensity:e.spiralDensity??s.params.spiralDensity,u_spiralDistortion:e.spiralDistortion??s.params.spiralDistortion,u_strokeWidth:e.strokeWidth??s.params.strokeWidth,u_strokeTaper:e.strokeTaper??s.params.strokeTaper,u_strokeCap:e.strokeCap??s.params.strokeCap,u_noiseFreq:e.noiseFreq??s.params.noiseFreq,u_noisePower:e.noisePower??s.params.noisePower,u_softness:e.softness??s.params.softness}),[e.color1,e.color2,e.scale,e.offsetX,e.offsetY,e.spiralDensity,e.spiralDistortion,e.strokeWidth,e.strokeTaper,e.strokeCap,e.noiseFreq,e.noisePower,e.softness]);return dr(r,{...e,fragmentShader:rr,uniforms:o})};import{}from"@paper-design/shaders";import{getShaderColorFromString as Ia}from"@paper-design/shaders";export{qe as DotsGrid,ta as DotsGridShapes,Ge as DotsOrbit,jo as GodRays,Z as GrainClouds,ae as MeshGradient,Ke as Metaballs,ye as NeuroNoise,za as PatternShapes,Po as PerlinNoise,r as ShaderMount,ue as SmokeRing,mr as Spiral,Je as SteppedSimplexNoise,Do as Voronoi,To as Warp,lo as Waves,Xe as dotsGridPresets,Ce as dotsOrbitPresets,Ia as getShaderColorFromString,Qo as godRaysPresets,K as grainCloudsPresets,se as meshGradientPresets,$e as metaballsPresets,ge as neuroNoisePresets,So as perlinNoisePresets,pe as smokeRingPresets,cr as spiralPresets,Te as steppedSimplexNoisePresets,No as voronoiPresets,Vo as warpPresets,to as wavesPresets};
|
|
3
3
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/shader-mount.tsx", "../src/shaders/grain-clouds.tsx", "../src/index.ts", "../src/shaders/mesh-gradient.tsx", "../src/shaders/smoke-ring.tsx", "../src/shaders/neuro-noise.tsx", "../src/shaders/dots-orbit.tsx", "../src/shaders/dots-grid.tsx", "../src/shaders/stepped-simplex-noise.tsx", "../src/shaders/metaballs.tsx", "../src/shaders/waves.tsx", "../src/shaders/perlin-noise.tsx", "../src/shaders/voronoi.tsx", "../src/shaders/warp.tsx", "../src/shaders/god-rays.tsx", "../src/shaders/spiral.tsx"],
|
|
4
|
-
"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 speed?: number;\n seed?: number;\n}\n\n/** Params that every shader can set as part of their controls */\nexport type GlobalParams = Pick<ShaderMountProps, 'speed' | 'seed'>;\n\nexport const ShaderMount: React.FC<ShaderMountProps> = ({\n ref,\n fragmentShader,\n style,\n uniforms = {},\n webGlContextAttributes,\n speed = 1,\n seed = 0,\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 speed,\n seed\n );\n }\n\n return () => {\n shaderMountRef.current?.dispose();\n };\n }, [fragmentShader, webGlContextAttributes]);\n\n useEffect(() => {\n shaderMountRef.current?.setUniforms(uniforms);\n }, [uniforms]);\n\n useEffect(() => {\n shaderMountRef.current?.setSpeed(speed);\n }, [speed]);\n\n useEffect(() => {\n shaderMountRef.current?.setSeed(seed);\n }, [seed]);\n\n return <canvas ref={canvasRef} style={style} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, grainCloudsFragmentShader, type GrainCloudsUniforms } from '@paper-design/shaders';\n\nexport type GrainCloudsParams = {\n scale?: number;\n color1?: string;\n color2?: string;\n grainAmount?: number;\n} & GlobalParams;\n\nexport type GrainCloudsProps = Omit<ShaderMountProps, 'fragmentShader'> & GrainCloudsParams;\n\ntype GrainCloudsPreset = { name: string; params: Required<GrainCloudsParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: GrainCloudsPreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 0.3,\n seed: 0,\n color1: 'hsla(0, 0%, 0%, 1)',\n color2: 'hsla(0, 0%, 100%, 1)',\n grainAmount: 1,\n },\n};\n\nexport const skyPreset: GrainCloudsPreset = {\n name: 'Sky',\n params: {\n scale: 1,\n speed: 0.3,\n seed: 0,\n color1: 'hsla(218, 100%, 73%, 1)',\n color2: 'hsla(0, 0%, 100%, 1)',\n grainAmount: 0,\n },\n};\n\nexport const grainCloudsPresets: GrainCloudsPreset[] = [defaultPreset, skyPreset];\n\nexport const GrainClouds = (props: GrainCloudsProps): JSX.Element => {\n const uniforms: GrainCloudsUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_grainAmount: props.grainAmount ?? defaultPreset.params.grainAmount,\n };\n }, [props.scale, props.color1, props.color2, 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, grainCloudsPresets } from './shaders/grain-clouds';\nexport { type GrainCloudsProps } from './shaders/grain-clouds';\nexport { type GrainCloudsParams } from './shaders/grain-clouds';\nexport { type GrainCloudsUniforms } from '@paper-design/shaders';\n\n// Mesh gradient\nexport { MeshGradient, meshGradientPresets } from './shaders/mesh-gradient';\nexport { type MeshGradientProps } from './shaders/mesh-gradient';\nexport { type MeshGradientParams } from './shaders/mesh-gradient';\nexport { type MeshGradientUniforms } from '@paper-design/shaders';\n\n// Smoke ring\nexport { SmokeRing, smokeRingPresets } from './shaders/smoke-ring';\nexport { type SmokeRingProps } from './shaders/smoke-ring';\nexport { type SmokeRingParams } from './shaders/smoke-ring';\nexport { type SmokeRingUniforms } from '@paper-design/shaders';\n\n// Neuro noise\nexport { NeuroNoise, neuroNoisePresets } from './shaders/neuro-noise';\nexport { type NeuroNoiseProps } from './shaders/neuro-noise';\nexport { type NeuroNoiseParams } from './shaders/neuro-noise';\nexport { type NeuroNoiseUniforms } from '@paper-design/shaders';\n\n// Animated dots pattern: orbit type of animation\nexport { DotsOrbit, dotsOrbitPresets } from './shaders/dots-orbit';\nexport { type DotsOrbitProps } from './shaders/dots-orbit';\nexport { type DotsOrbitParams } from './shaders/dots-orbit';\nexport { type DotsOrbitUniforms } from '@paper-design/shaders';\n\n// Dot Grid\nexport { DotsGrid, dotsGridPresets } from './shaders/dots-grid';\nexport { type DotsGridProps } from './shaders/dots-grid';\nexport { type DotsGridParams } from './shaders/dots-grid';\nexport { type DotsGridUniforms, DotsGridShapes, type DotsGridShape } from '@paper-design/shaders';\n\n// Stepped simplex noise\nexport { SteppedSimplexNoise, steppedSimplexNoisePresets } from './shaders/stepped-simplex-noise';\nexport { type SteppedSimplexNoiseProps } from './shaders/stepped-simplex-noise';\nexport { type SteppedSimplexNoiseParams } from './shaders/stepped-simplex-noise';\nexport { type SteppedSimplexNoiseUniforms } from '@paper-design/shaders';\n\n// Metaballs\nexport { Metaballs, metaballsPresets } from './shaders/metaballs';\nexport { type MetaballsProps } from './shaders/metaballs';\nexport { type MetaballsParams } from './shaders/metaballs';\nexport { type MetaballsUniforms } from '@paper-design/shaders';\n\n// Waves\nexport { Waves, wavesPresets } from './shaders/waves';\nexport { type WavesProps } from './shaders/waves';\nexport { type WavesParams } from './shaders/waves';\nexport { type WavesUniforms } from '@paper-design/shaders';\n\n// Perlin noise\nexport { PerlinNoise, perlinNoisePresets } from './shaders/perlin-noise';\nexport { type PerlinNoiseProps } from './shaders/perlin-noise';\nexport { type PerlinNoiseParams } from './shaders/perlin-noise';\nexport { type PerlinNoiseUniforms } from '@paper-design/shaders';\n\n// Voronoi diagram\nexport { Voronoi, voronoiPresets } from './shaders/voronoi';\nexport { type VoronoiProps } from './shaders/voronoi';\nexport { type VoronoiParams } from './shaders/voronoi';\nexport { type VoronoiUniforms } from '@paper-design/shaders';\n\n// Warping distortion\nexport { Warp, warpPresets } from './shaders/warp';\nexport { type WarpProps } from './shaders/warp';\nexport { type WarpParams } from './shaders/warp';\nexport { type WarpUniforms, PatternShapes, type PatternShape } from '@paper-design/shaders';\n\n// God Rays effect\nexport { GodRays, godRaysPresets } from './shaders/god-rays';\nexport { type GodRaysProps } from './shaders/god-rays';\nexport { type GodRaysParams } from './shaders/god-rays';\nexport { type GodRaysUniforms } from '@paper-design/shaders';\n\n// Single-colored spiral shape\nexport { Spiral, spiralPresets } from './shaders/spiral';\nexport { type SpiralProps } from './shaders/spiral';\nexport { type SpiralParams } from './shaders/spiral';\nexport { type SpiralUniforms } from '@paper-design/shaders';\n\n// ----- Uniform conversion utils ----- //\nexport { getShaderColorFromString } from '@paper-design/shaders';\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, meshGradientFragmentShader, type MeshGradientUniforms } from '@paper-design/shaders';\n\nexport type MeshGradientParams = {\n color1?: string;\n color2?: string;\n color3?: string;\n color4?: string;\n} & GlobalParams;\n\nexport type MeshGradientProps = Omit<ShaderMountProps, 'fragmentShader'> & MeshGradientParams;\n\ntype MeshGradientPreset = { name: string; params: Required<MeshGradientParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: MeshGradientPreset = {\n name: 'Default',\n params: {\n speed: 0.15,\n seed: 0,\n color1: 'hsla(259, 29%, 73%, 1)',\n color2: 'hsla(263, 57%, 39%, 1)',\n color3: 'hsla(48, 73%, 84%, 1)',\n color4: 'hsla(295, 32%, 70%, 1)',\n },\n} as const;\n\nexport const beachPreset: MeshGradientPreset = {\n name: 'Beach',\n params: {\n speed: 0.1,\n seed: 0,\n color1: 'hsla(186, 81%, 83%, 1)',\n color2: 'hsla(198, 55%, 68%, 1)',\n color3: 'hsla(53, 67%, 88%, 1)',\n color4: 'hsla(45, 93%, 73%, 1)',\n },\n};\n\nexport const fadedPreset: MeshGradientPreset = {\n name: 'Faded',\n params: {\n speed: -0.3,\n seed: 0,\n color1: 'hsla(186, 41%, 90%, 1)',\n color2: 'hsla(208, 71%, 85%, 1)',\n color3: 'hsla(183, 51%, 92%, 1)',\n color4: 'hsla(201, 72%, 90%, 1)',\n },\n};\n\nexport const meshGradientPresets: MeshGradientPreset[] = [defaultPreset, beachPreset, fadedPreset];\n\nexport const MeshGradient = (props: MeshGradientProps): JSX.Element => {\n const uniforms: MeshGradientUniforms = useMemo(() => {\n return {\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color3),\n u_color4: getShaderColorFromString(props.color4, defaultPreset.params.color4),\n };\n }, [props.color1, props.color2, props.color3, props.color4]);\n\n return <ShaderMount {...props} fragmentShader={meshGradientFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, smokeRingFragmentShader, type SmokeRingUniforms } from '@paper-design/shaders';\n\nexport type SmokeRingParams = {\n colorBack?: string;\n colorInner?: string;\n colorOuter?: string;\n scale?: number;\n noiseScale?: number;\n thickness?: number;\n} & GlobalParams;\n\nexport type SmokeRingProps = Omit<ShaderMountProps, 'fragmentShader'> & SmokeRingParams;\n\ntype SmokeRingPreset = { name: string; params: Required<SmokeRingParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: SmokeRingPreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 1,\n seed: 0,\n colorBack: 'hsla(208, 54%, 7%, 1)',\n colorInner: 'hsla(0, 0%, 100%, 1)',\n colorOuter: 'hsla(211, 100%, 64%, 1)',\n noiseScale: 1.4,\n thickness: 0.33,\n },\n} as const;\n\nexport const cloudPreset: SmokeRingPreset = {\n name: 'Cloud',\n params: {\n scale: 1,\n speed: 1,\n seed: 0,\n colorBack: 'hsla(218, 100%, 62%, 1)',\n colorInner: 'hsla(0, 0%, 100%, 1)',\n colorOuter: 'hsla(0, 0%, 100%, 1)',\n noiseScale: 1.8,\n thickness: 0.7,\n },\n};\n\nexport const firePreset: SmokeRingPreset = {\n name: 'Fire',\n params: {\n scale: 1,\n speed: 4,\n seed: 0,\n colorBack: 'hsla(20, 100%, 5%, 1)',\n colorInner: 'hsla(40, 100%, 50%, 1)',\n colorOuter: 'hsla(0, 100%, 50%, 1)',\n noiseScale: 1.4,\n thickness: 0.35,\n },\n};\n\nexport const electricPreset: SmokeRingPreset = {\n name: 'Electric',\n params: {\n scale: 1,\n speed: -2.5,\n seed: 0,\n colorBack: 'hsla(47, 50%, 7%, 1)',\n colorInner: 'hsla(47, 100%, 64%, 1)',\n colorOuter: 'hsla(47, 100%, 64%, 1)',\n noiseScale: 1.8,\n thickness: 0.1,\n },\n};\n\nexport const poisonPreset: SmokeRingPreset = {\n name: 'Poison',\n params: {\n scale: 1,\n speed: 3,\n seed: 0,\n colorBack: 'hsla(120, 100%, 3%, 1)',\n colorInner: 'hsla(120, 100%, 3%, 1)',\n colorOuter: 'hsla(120, 100%, 66%, 1)',\n noiseScale: 5,\n thickness: 0.6,\n },\n};\n\nexport const smokeRingPresets: SmokeRingPreset[] = [\n defaultPreset,\n cloudPreset,\n firePreset,\n electricPreset,\n poisonPreset,\n];\n\nexport const SmokeRing = (props: SmokeRingProps): JSX.Element => {\n const uniforms: SmokeRingUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_colorBack: getShaderColorFromString(props.colorBack, defaultPreset.params.colorBack),\n u_colorInner: getShaderColorFromString(props.colorInner, defaultPreset.params.colorInner),\n u_colorOuter: getShaderColorFromString(props.colorOuter, defaultPreset.params.colorOuter),\n u_noiseScale: props.noiseScale ?? defaultPreset.params.noiseScale,\n u_thickness: props.thickness ?? defaultPreset.params.thickness,\n };\n }, [props.scale, props.colorBack, props.colorInner, props.colorOuter, props.noiseScale, props.thickness]);\n\n return <ShaderMount {...props} fragmentShader={smokeRingFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, neuroNoiseFragmentShader, type NeuroNoiseUniforms } from '@paper-design/shaders';\n\nexport type NeuroNoiseParams = {\n scale?: number;\n colorFront?: string;\n colorBack?: string;\n brightness?: number;\n} & GlobalParams;\n\nexport type NeuroNoiseProps = Omit<ShaderMountProps, 'fragmentShader'> & NeuroNoiseParams;\n\ntype NeuroNoisePreset = { name: string; params: Required<NeuroNoiseParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: NeuroNoisePreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 1,\n seed: 0,\n colorFront: 'hsla(261, 100%, 82%, 1)',\n colorBack: 'hsla(0, 0%, 0%, 1)',\n brightness: 1.3,\n },\n} as const;\n\nconst marblePreset: NeuroNoisePreset = {\n name: 'Marble',\n params: {\n scale: 0.4,\n speed: 0,\n seed: 0,\n colorFront: 'hsla(230, 24%, 15%, 1)',\n colorBack: 'hsla(0, 0%, 97%, 1)',\n brightness: 1.1,\n },\n} as const;\n\nexport const neuroNoisePresets: NeuroNoisePreset[] = [defaultPreset, marblePreset] as const;\n\nexport const NeuroNoise = (props: NeuroNoiseProps): JSX.Element => {\n const uniforms: NeuroNoiseUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_colorFront: getShaderColorFromString(props.colorFront, defaultPreset.params.colorFront),\n u_colorBack: getShaderColorFromString(props.colorBack, defaultPreset.params.colorBack),\n u_brightness: props.brightness ?? defaultPreset.params.brightness,\n };\n }, [props.scale, props.colorFront, props.colorBack, props.brightness]);\n\n return <ShaderMount {...props} fragmentShader={neuroNoiseFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, dotsOrbitFragmentShader, type DotsOrbitUniforms } from '@paper-design/shaders';\n\nexport type DotsOrbitParams = {\n scale?: number;\n color1?: string;\n color2?: string;\n color3?: string;\n color4?: string;\n dotSize?: number;\n dotSizeRange?: number;\n spreading?: number;\n} & GlobalParams;\n\nexport type DotsOrbitProps = Omit<ShaderMountProps, 'fragmentShader'> & DotsOrbitParams;\n\ntype DotsOrbitPreset = { name: string; params: Required<DotsOrbitParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: DotsOrbitPreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 2,\n seed: 0,\n color1: 'hsla(358, 66%, 49%, 1)',\n color2: 'hsla(145, 30%, 33%, 1)',\n color3: 'hsla(39, 88%, 52%, 1)',\n color4: 'hsla(274, 30%, 35%, 1)',\n dotSize: 0.7,\n dotSizeRange: 0.4,\n spreading: 1,\n },\n} as const;\n\nexport const dotsOrbitPresets: DotsOrbitPreset[] = [defaultPreset];\n\nexport const DotsOrbit = (props: DotsOrbitProps): JSX.Element => {\n const uniforms: DotsOrbitUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color3),\n u_color4: getShaderColorFromString(props.color4, defaultPreset.params.color4),\n u_dotSize: props.dotSize ?? defaultPreset.params.dotSize,\n u_dotSizeRange: props.dotSizeRange ?? defaultPreset.params.dotSizeRange,\n u_spreading: props.spreading ?? defaultPreset.params.spreading,\n };\n }, [\n props.scale,\n props.color1,\n props.color2,\n props.color3,\n props.color4,\n props.dotSize,\n props.dotSizeRange,\n props.spreading,\n ]);\n\n return <ShaderMount {...props} fragmentShader={dotsOrbitFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type ShaderMountProps } from '../shader-mount';\nimport {\n dotsGridFragmentShader,\n getShaderColorFromString,\n type DotsGridUniforms,\n type DotsGridShape,\n DotsGridShapes,\n} from '@paper-design/shaders';\n\nexport type DotsGridParams = {\n colorBack?: string;\n colorFill?: string;\n colorStroke?: string;\n dotSize?: number;\n gridSpacingX?: number;\n gridSpacingY?: number;\n strokeWidth?: number;\n sizeRange?: number;\n opacityRange?: number;\n shape?: DotsGridShape;\n};\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport type DotsGridProps = Omit<ShaderMountProps, 'fragmentShader'> & DotsGridParams;\n\ntype DotsGridPreset = { name: string; params: Required<DotsGridParams> };\n\nexport const defaultPreset: DotsGridPreset = {\n name: 'Default',\n params: {\n colorBack: 'hsla(358, 66%, 49%, 0)',\n colorFill: 'hsla(145, 30%, 10%, 1)',\n colorStroke: 'hsla(39, 88%, 52%, 1)',\n dotSize: 2,\n gridSpacingX: 50,\n gridSpacingY: 50,\n strokeWidth: 0,\n sizeRange: 0,\n opacityRange: 0,\n shape: DotsGridShapes.Circle,\n },\n} as const;\n\nconst trianglesPreset: DotsGridPreset = {\n name: 'Triangles',\n params: {\n colorBack: 'hsla(0, 0%, 100%, 1)',\n colorFill: 'hsla(0, 0%, 100%, 1)',\n colorStroke: 'hsla(0, 0%, 0%, .5)',\n dotSize: 5,\n gridSpacingX: 32,\n gridSpacingY: 32,\n strokeWidth: 1,\n sizeRange: 0,\n opacityRange: 0,\n shape: DotsGridShapes.Triangle,\n },\n} as const;\n\nconst bubblesPreset: DotsGridPreset = {\n name: 'Bubbles',\n params: {\n colorBack: 'hsla(234, 100%, 31%, .5)',\n colorFill: 'hsla(100, 30%, 100%, 1)',\n colorStroke: 'hsla(0, 100%, 0%, 1)',\n dotSize: 28,\n gridSpacingX: 60,\n gridSpacingY: 60,\n strokeWidth: 12,\n sizeRange: 0.7,\n opacityRange: 1.3,\n shape: DotsGridShapes.Circle,\n },\n} as const;\n\nconst treeLinePreset: DotsGridPreset = {\n name: 'Tree line',\n params: {\n colorBack: 'hsla(100, 100%, 36%, .05)',\n colorFill: 'hsla(150, 80%, 10%, 1)',\n colorStroke: 'hsla(0, 0%, 0%, 1)',\n dotSize: 8,\n gridSpacingX: 20,\n gridSpacingY: 90,\n strokeWidth: 0,\n sizeRange: 1,\n opacityRange: 0.6,\n shape: DotsGridShapes.Circle,\n },\n} as const;\n\nconst diamondsPreset: DotsGridPreset = {\n name: 'Diamonds',\n params: {\n colorBack: 'hsla(0, 0%, 0%, 0)',\n colorFill: 'hsla(0, 100%, 50%, 1)',\n colorStroke: 'hsla(0, 0%, 0%, 1)',\n dotSize: 15,\n gridSpacingX: 30,\n gridSpacingY: 30,\n strokeWidth: 0,\n sizeRange: 0,\n opacityRange: 2,\n shape: DotsGridShapes.Diamond,\n },\n} as const;\n\nconst wallpaperPreset: DotsGridPreset = {\n name: 'Wallpaper',\n params: {\n colorBack: 'hsla(154, 33%, 19%, 1)',\n colorFill: 'hsla(0, 0%, 0%, 0)',\n colorStroke: 'hsla(36, 48%, 58%, 1)',\n dotSize: 9,\n gridSpacingX: 32,\n gridSpacingY: 32,\n strokeWidth: 1,\n sizeRange: 0,\n opacityRange: 0,\n shape: DotsGridShapes.Diamond,\n },\n} as const;\n\nconst matrixPreset: DotsGridPreset = {\n name: 'Enter the Matrix',\n params: {\n colorBack: 'hsla(0, 100%, 0%, 1)',\n colorFill: 'hsla(182, 100%, 64%, 1)',\n colorStroke: 'hsla(0, 100%, 100%, 0)',\n dotSize: 2,\n gridSpacingX: 10,\n gridSpacingY: 10,\n strokeWidth: 0.5,\n sizeRange: 0.25,\n opacityRange: 1,\n shape: DotsGridShapes.Triangle,\n },\n} as const;\n\nconst waveformPreset: DotsGridPreset = {\n name: 'Waveform',\n params: {\n colorBack: 'hsla(0, 100%, 100%, 1)',\n colorFill: 'hsla(227, 93%, 38%, 1)',\n colorStroke: 'hsla(0, 0%, 0%, 0)',\n dotSize: 100,\n gridSpacingX: 2,\n gridSpacingY: 215,\n strokeWidth: 0,\n sizeRange: 1,\n opacityRange: 0,\n shape: DotsGridShapes.Square,\n },\n} as const;\n\nexport const dotsGridPresets: DotsGridPreset[] = [\n defaultPreset,\n trianglesPreset,\n bubblesPreset,\n treeLinePreset,\n diamondsPreset,\n wallpaperPreset,\n matrixPreset,\n waveformPreset,\n];\n\nexport const DotsGrid = (props: DotsGridProps): JSX.Element => {\n const uniforms: DotsGridUniforms = useMemo(() => {\n return {\n u_colorBack: getShaderColorFromString(props.colorBack, defaultPreset.params.colorBack),\n u_colorFill: getShaderColorFromString(props.colorFill, defaultPreset.params.colorStroke),\n u_colorStroke: getShaderColorFromString(props.colorStroke, defaultPreset.params.colorStroke),\n u_dotSize: props.dotSize ?? defaultPreset.params.dotSize,\n u_gridSpacingX: props.gridSpacingX ?? defaultPreset.params.gridSpacingX,\n u_gridSpacingY: props.gridSpacingY ?? defaultPreset.params.gridSpacingY,\n u_strokeWidth: props.strokeWidth ?? defaultPreset.params.strokeWidth,\n u_sizeRange: props.sizeRange ?? defaultPreset.params.sizeRange,\n u_opacityRange: props.opacityRange ?? defaultPreset.params.opacityRange,\n u_shape: props.shape ?? defaultPreset.params.shape,\n };\n }, [\n props.colorBack,\n props.colorFill,\n props.colorStroke,\n props.dotSize,\n props.gridSpacingX,\n props.gridSpacingY,\n props.strokeWidth,\n props.sizeRange,\n props.opacityRange,\n props.shape,\n ]);\n\n return <ShaderMount {...props} fragmentShader={dotsGridFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport {\n getShaderColorFromString,\n steppedSimplexNoiseFragmentShader,\n type SteppedSimplexNoiseUniforms,\n} from '@paper-design/shaders';\n\nexport type SteppedSimplexNoiseParams = {\n scale?: number;\n color1?: string;\n color2?: string;\n color3?: string;\n color4?: string;\n color5?: string;\n stepsNumber?: number;\n} & GlobalParams;\n\nexport type SteppedSimplexNoiseProps = Omit<ShaderMountProps, 'fragmentShader'> & SteppedSimplexNoiseParams;\n\ntype SteppedSimplexNoisePreset = { name: string; params: Required<SteppedSimplexNoiseParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: SteppedSimplexNoisePreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 0.15,\n seed: 0,\n color1: 'hsla(208, 25%, 45%, 1)',\n color2: 'hsla(94, 38%, 59%, 1)',\n color3: 'hsla(359, 94%, 62%, 1)',\n color4: 'hsla(42, 93%, 64%, 1)',\n color5: 'hsla(0, 0%, 100%, 1)',\n stepsNumber: 13,\n },\n} as const;\n\nconst magmaPreset: SteppedSimplexNoisePreset = {\n name: 'Magma',\n params: {\n scale: 0.3,\n speed: 0.2,\n seed: 0,\n color1: 'hsla(0, 100%, 36%, 1)',\n color2: 'hsla(0, 95%, 44%, 1)',\n color3: 'hsla(20, 100%, 49%, 1)',\n color4: 'hsla(45, 100%, 45%, 1)',\n color5: 'hsla(31, 100%, 94%, 1)',\n stepsNumber: 8,\n },\n};\n\nconst bloodCellPreset: SteppedSimplexNoisePreset = {\n name: 'Blood cell',\n params: {\n scale: 1.2,\n speed: 0.22,\n seed: 0,\n color1: 'hsla(302, 43%, 13%, 1)',\n color2: 'hsla(325, 93%, 17%, 1)',\n color3: 'hsla(338, 80%, 25%, 1)',\n color4: 'hsla(338, 80%, 25%, 1)',\n color5: 'hsla(2, 85%, 72%, 1)',\n stepsNumber: 29,\n },\n};\n\nconst firstContactPreset: SteppedSimplexNoisePreset = {\n name: 'First contact',\n params: {\n scale: 1.2,\n speed: -0.1,\n seed: 0,\n color1: 'hsla(300, 43%, 82%, 1)',\n color2: 'hsla(266, 70%, 9%, 1)',\n color3: 'hsla(289, 36%, 26%, 1)',\n color4: 'hsla(0, 41%, 78%, 1)',\n color5: 'hsla(0, 100%, 96%, 1)',\n stepsNumber: 40,\n },\n};\n\nexport const steppedSimplexNoisePresets: SteppedSimplexNoisePreset[] = [\n defaultPreset,\n magmaPreset,\n bloodCellPreset,\n firstContactPreset,\n];\n\nexport const SteppedSimplexNoise = (props: SteppedSimplexNoiseProps): JSX.Element => {\n const uniforms: SteppedSimplexNoiseUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color3),\n u_color4: getShaderColorFromString(props.color4, defaultPreset.params.color4),\n u_color5: getShaderColorFromString(props.color5, defaultPreset.params.color5),\n u_steps_number: props.stepsNumber ?? defaultPreset.params.stepsNumber,\n };\n }, [props.scale, props.color1, props.color2, props.color3, props.color4, props.color5, props.stepsNumber]);\n\n return <ShaderMount {...props} fragmentShader={steppedSimplexNoiseFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, metaballsFragmentShader, type MetaballsUniforms } from '@paper-design/shaders';\n\nexport type MetaballsParams = {\n scale?: number;\n color1?: string;\n color2?: string;\n color3?: string;\n ballSize?: number;\n visibilityRange?: number;\n} & GlobalParams;\n\nexport type MetaballsProps = Omit<ShaderMountProps, 'fragmentShader'> & MetaballsParams;\n\ntype MetaballsPreset = { name: string; params: Required<MetaballsParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: MetaballsPreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 0.6,\n seed: 0,\n color1: 'hsla(350, 90%, 55%, 1)',\n color2: 'hsla(350, 80%, 60%, 1)',\n color3: 'hsla(20, 85%, 70%, 1)',\n ballSize: 1,\n visibilityRange: 0.4,\n },\n} as const;\n\nexport const metaballsPresets: MetaballsPreset[] = [defaultPreset];\n\nexport const Metaballs = (props: MetaballsProps): JSX.Element => {\n const uniforms: MetaballsUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color3),\n u_ballSize: props.ballSize ?? defaultPreset.params.ballSize,\n u_visibilityRange: props.visibilityRange ?? defaultPreset.params.visibilityRange,\n };\n }, [props.scale, props.color1, props.color2, props.color3, props.ballSize, props.visibilityRange]);\n\n return <ShaderMount {...props} fragmentShader={metaballsFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, wavesFragmentShader, type WavesUniforms } from '@paper-design/shaders';\n\nexport type WavesParams = {\n scale?: number;\n rotation?: number;\n color1?: string;\n color2?: string;\n shape?: number;\n frequency?: number;\n amplitude?: number;\n spacing?: number;\n dutyCycle?: number;\n edgeBlur?: number;\n};\n\nexport type WavesProps = Omit<ShaderMountProps, 'fragmentShader'> & WavesParams;\n\ntype WavesPreset = { name: string; params: Required<WavesParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: WavesPreset = {\n name: 'Default',\n params: {\n scale: 1,\n rotation: 0,\n color1: 'hsla(48, 100%, 74%, 1)',\n color2: 'hsla(204, 47%, 45%, 1)',\n shape: 1,\n frequency: 0.5,\n amplitude: 0.5,\n spacing: 0.75,\n dutyCycle: 0.2,\n edgeBlur: 0,\n },\n} as const;\n\nexport const spikesPreset: WavesPreset = {\n name: 'Spikes',\n params: {\n scale: 2.3,\n rotation: 0,\n color1: 'hsla(65, 100%, 95%, 1)',\n color2: 'hsla(290, 52%, 15%, 1)',\n shape: 0,\n frequency: 0.5,\n amplitude: 0.9,\n spacing: 0.37,\n dutyCycle: 0.93,\n edgeBlur: 0.15,\n },\n} as const;\n\nexport const groovyPreset: WavesPreset = {\n name: 'Groovy',\n params: {\n scale: 0.5,\n rotation: 1,\n color1: 'hsla(60, 100%, 97%, 1)',\n color2: 'hsla(20, 100%, 71%, 1)',\n shape: 2.37,\n frequency: 0.2,\n amplitude: 0.67,\n spacing: 1.17,\n dutyCycle: 0.57,\n edgeBlur: 0,\n },\n} as const;\n\nexport const tangledUpPreset: WavesPreset = {\n name: 'Tangled up',\n params: {\n scale: 3.04,\n rotation: 1,\n color1: 'hsla(198.7, 66.7%, 14.1%, 1)',\n color2: 'hsla(85.5, 35.7%, 78%, 1)',\n shape: 3,\n frequency: 0.44,\n amplitude: 0.57,\n spacing: 1.05,\n dutyCycle: 0.97,\n edgeBlur: 0,\n },\n} as const;\n\nexport const zigZagPreset: WavesPreset = {\n name: 'Zig zag',\n params: {\n scale: 2.7,\n rotation: 1,\n color1: 'hsla(0, 0%, 0%, 1)',\n color2: 'hsla(0, 0%, 90%, 1)',\n shape: 0,\n frequency: 0.6,\n amplitude: 0.8,\n spacing: 0.5,\n dutyCycle: 1,\n edgeBlur: 0.5,\n },\n} as const;\n\nexport const waveRidePreset: WavesPreset = {\n name: 'Ride the wave',\n params: {\n scale: 0.84,\n rotation: 0,\n color1: 'hsla(65, 100%, 95%, 1)',\n color2: 'hsla(0, 0%, 12%, 1)',\n shape: 2.23,\n frequency: 0.1,\n amplitude: 0.6,\n spacing: 0.41,\n dutyCycle: 0.99,\n edgeBlur: 0,\n },\n} as const;\n\nexport const wavesPresets: WavesPreset[] = [\n defaultPreset,\n spikesPreset,\n groovyPreset,\n tangledUpPreset,\n zigZagPreset,\n waveRidePreset,\n];\n\nexport const Waves = (props: WavesProps): JSX.Element => {\n const uniforms: WavesUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_rotation: props.rotation ?? defaultPreset.params.rotation,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_shape: props.shape ?? defaultPreset.params.shape,\n u_frequency: props.frequency ?? defaultPreset.params.frequency,\n u_amplitude: props.amplitude ?? defaultPreset.params.amplitude,\n u_spacing: props.spacing ?? defaultPreset.params.spacing,\n u_dutyCycle: props.dutyCycle ?? defaultPreset.params.dutyCycle,\n u_edgeBlur: props.edgeBlur ?? defaultPreset.params.edgeBlur,\n };\n }, [\n props.scale,\n props.rotation,\n props.color1,\n props.color2,\n props.shape,\n props.frequency,\n props.amplitude,\n props.spacing,\n props.dutyCycle,\n props.edgeBlur,\n ]);\n\n return <ShaderMount {...props} fragmentShader={wavesFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, perlinNoiseFragmentShader, type PerlinNoiseUniforms } from '@paper-design/shaders';\n\nexport type PerlinNoiseParams = {\n scale?: number;\n color1?: string;\n color2?: string;\n proportion?: number;\n contour?: number;\n octaveCount?: number;\n persistence?: number;\n lacunarity?: number;\n} & GlobalParams;\n\nexport type PerlinNoiseProps = Omit<ShaderMountProps, 'fragmentShader'> & PerlinNoiseParams;\n\ntype PerlinNoisePreset = { name: string; params: Required<PerlinNoiseParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: PerlinNoisePreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 0.5,\n seed: 0,\n color1: 'hsla(0, 0%, 15%, 1)',\n color2: 'hsla(203, 100%, 87%, 1)',\n proportion: 0.34,\n contour: 0.9,\n octaveCount: 2,\n persistence: 1,\n lacunarity: 1.5,\n },\n};\n\nexport const preset1: PerlinNoisePreset = {\n name: 'Nintendo Water',\n params: {\n scale: 0.2,\n speed: 0.5,\n seed: 0,\n color1: 'hsla(220, 66%, 50%, 1)',\n color2: 'hsla(155, 66%, 80%, 1)',\n proportion: 0.42,\n contour: 1,\n octaveCount: 2,\n persistence: 0.55,\n lacunarity: 1.8,\n },\n};\n\nexport const preset2: PerlinNoisePreset = {\n name: 'Colony',\n params: {\n scale: 0.15,\n speed: 0,\n seed: 0,\n color1: 'hsla(56, 86%, 81%, 1)',\n color2: 'hsla(230, 80%, 20%, 1)',\n octaveCount: 6,\n persistence: 1,\n lacunarity: 2.55,\n proportion: 0.65,\n contour: 0.65,\n },\n};\n\nexport const preset3: PerlinNoisePreset = {\n name: 'Phosphenes',\n params: {\n scale: 0.03,\n speed: 0.15,\n seed: 0,\n color1: 'hsla(350, 80%, 70%, 1)',\n color2: 'hsla(150, 50%, 60%, 1)',\n proportion: 0.45,\n contour: 0.55,\n octaveCount: 6,\n persistence: 0.3,\n lacunarity: 3,\n },\n} as const;\n\nexport const preset4: PerlinNoisePreset = {\n name: 'Moss',\n params: {\n scale: 0.15,\n speed: 0.02,\n seed: 0,\n color1: 'hsla(137, 100%, 51%, 1)',\n color2: 'hsla(0, 0%, 15%, 1)',\n proportion: 0.65,\n contour: 0.65,\n octaveCount: 6,\n persistence: 1,\n lacunarity: 2.55,\n },\n} as const;\n\nexport const preset5: PerlinNoisePreset = {\n name: 'Worms',\n params: {\n scale: 2,\n speed: 0,\n seed: 0,\n color1: 'hsla(0, 100%, 100%, 1)',\n color2: 'hsla(0, 0%, 35%, 1)',\n proportion: 0.5,\n contour: 1,\n octaveCount: 1,\n persistence: 1,\n lacunarity: 1.5,\n },\n} as const;\n\nexport const perlinNoisePresets: PerlinNoisePreset[] = [defaultPreset, preset1, preset2, preset3, preset4, preset5];\n\nexport const PerlinNoise = (props: PerlinNoiseProps): JSX.Element => {\n const uniforms: PerlinNoiseUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_proportion: props.proportion ?? defaultPreset.params.proportion,\n u_contour: props.contour ?? defaultPreset.params.contour,\n u_octaveCount: props.octaveCount ?? defaultPreset.params.octaveCount,\n u_persistence: props.persistence ?? defaultPreset.params.persistence,\n u_lacunarity: props.lacunarity ?? defaultPreset.params.lacunarity,\n };\n }, [\n props.scale,\n props.color1,\n props.color2,\n props.proportion,\n props.contour,\n props.octaveCount,\n props.persistence,\n props.lacunarity,\n ]);\n\n return <ShaderMount {...props} fragmentShader={perlinNoiseFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, voronoiFragmentShader, type VoronoiUniforms } from '@paper-design/shaders';\n\nexport type VoronoiParams = {\n scale?: number;\n colorCell1?: string;\n colorCell2?: string;\n colorCell3?: string;\n colorMid?: string;\n colorEdges?: string;\n colorGradient?: number;\n distance?: number;\n edgesSize?: number;\n edgesSharpness?: number;\n middleSize?: number;\n middleSharpness?: number;\n} & GlobalParams;\n\nexport type VoronoiProps = Omit<ShaderMountProps, 'fragmentShader'> & VoronoiParams;\n\ntype VoronoiPreset = { name: string; params: Required<VoronoiParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: VoronoiPreset = {\n name: 'Default',\n params: {\n scale: 1.5,\n speed: 0.5,\n seed: 0,\n colorCell1: 'hsla(15, 80%, 50%, 1)',\n colorCell2: 'hsla(180, 80%, 50%, 1)',\n colorCell3: 'hsla(200, 80%, 50%, 1)',\n colorEdges: 'hsla(30, 90%, 10%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorGradient: 0.5,\n distance: 0.25,\n edgesSize: 0.15,\n edgesSharpness: 0.01,\n middleSize: 0,\n middleSharpness: 0,\n },\n} as const;\n\nexport const classicPreset: VoronoiPreset = {\n name: 'Classic',\n params: {\n scale: 3,\n speed: 0.8,\n seed: 0,\n colorCell1: 'hsla(0, 100%, 100%, 1)',\n colorCell2: 'hsla(0, 0%, 100%, 1)',\n colorCell3: 'hsla(0, 100%, 0%, 1)',\n colorEdges: 'hsla(0, 0%, 0%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorGradient: 1,\n distance: 0.45,\n edgesSize: 0.02,\n edgesSharpness: 0.07,\n middleSize: 0,\n middleSharpness: 0,\n },\n} as const;\n\nexport const giraffePreset: VoronoiPreset = {\n name: 'Giraffe',\n params: {\n scale: 1,\n speed: 0.6,\n seed: 0,\n colorCell1: 'hsla(32, 100%, 18%, 1)',\n colorCell2: 'hsla(42, 93%, 35%, 1)',\n colorCell3: 'hsla(32, 100%, 18%, 1)',\n colorEdges: 'hsla(45, 100%, 96%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorGradient: 1,\n distance: 0.25,\n edgesSize: 0.2,\n edgesSharpness: 0.01,\n middleSize: 0,\n middleSharpness: 0.3,\n },\n} as const;\n\nexport const eyesPreset: VoronoiPreset = {\n name: 'Eyes',\n params: {\n scale: 1.6,\n speed: 0.6,\n seed: 0,\n colorCell1: 'hsla(79, 84%, 60%, 1)',\n colorCell2: 'hsla(207, 53%, 41%, 1)',\n colorCell3: 'hsla(207, 80%, 65%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorEdges: 'hsla(0, 100%, 100%, 1)',\n colorGradient: 1,\n distance: 0.25,\n edgesSize: 0.62,\n edgesSharpness: 0.01,\n middleSize: 0.1,\n middleSharpness: 1,\n },\n} as const;\n\nexport const bubblesPreset: VoronoiPreset = {\n name: 'Bubbles',\n params: {\n scale: 2,\n speed: 0.5,\n seed: 0,\n colorCell1: 'hsla(0, 100%, 50%, 1)',\n colorCell2: 'hsla(169, 100%, 66%, 1)',\n colorCell3: 'hsla(50, 100%, 66%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorEdges: 'hsla(0, 0%, 0%, 1)',\n colorGradient: 1,\n distance: 0.5,\n edgesSize: 0.81,\n edgesSharpness: 0.0,\n middleSize: 0,\n middleSharpness: 0.45,\n },\n} as const;\n\nexport const cellsPreset: VoronoiPreset = {\n name: 'Cells',\n params: {\n scale: 2,\n speed: 1,\n seed: 0,\n colorCell1: 'hsla(0, 0%, 100%, 1)',\n colorCell2: 'hsla(0, 0%, 100%, 1)',\n colorCell3: 'hsla(0, 0%, 100%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorEdges: 'hsla(200, 50%, 15%, 1)',\n colorGradient: 1,\n distance: 0.38,\n edgesSize: 0.1,\n edgesSharpness: 0.02,\n middleSize: 0,\n middleSharpness: 0,\n },\n} as const;\n\nexport const glowPreset: VoronoiPreset = {\n name: 'Glow',\n params: {\n scale: 1.2,\n speed: 0.8,\n seed: 0,\n colorCell1: 'hsla(40, 100%, 50%, 1)',\n colorCell2: 'hsla(311, 100%, 59%, 1)',\n colorCell3: 'hsla(180, 100%, 65%, 1)',\n colorEdges: 'hsla(0, 100%, 0%, 1)',\n colorMid: 'hsla(0, 0%, 100%, 1)',\n colorGradient: 1,\n distance: 0.25,\n edgesSize: 0.15,\n edgesSharpness: 0.01,\n middleSize: 0.7,\n middleSharpness: 0,\n },\n} as const;\n\nexport const tilesPreset: VoronoiPreset = {\n name: 'Tiles',\n params: {\n scale: 1.3,\n speed: 1,\n seed: 0,\n colorCell1: 'hsla(80, 50%, 50%, 1)',\n colorCell2: 'hsla(0, 50%, 100%, 1)',\n colorCell3: 'hsla(200, 50%, 50%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorEdges: 'hsla(200, 50%, 10%, 1)',\n colorGradient: 0,\n distance: 0.05,\n edgesSize: 0.25,\n edgesSharpness: 0.02,\n middleSize: 0,\n middleSharpness: 0,\n },\n} as const;\n\nexport const voronoiPresets: VoronoiPreset[] = [\n defaultPreset,\n classicPreset,\n giraffePreset,\n eyesPreset,\n bubblesPreset,\n cellsPreset,\n glowPreset,\n tilesPreset,\n];\n\nexport const Voronoi = (props: VoronoiProps): JSX.Element => {\n const uniforms: VoronoiUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_colorCell1: getShaderColorFromString(props.colorCell1, defaultPreset.params.colorCell1),\n u_colorCell2: getShaderColorFromString(props.colorCell2, defaultPreset.params.colorCell2),\n u_colorCell3: getShaderColorFromString(props.colorCell3, defaultPreset.params.colorCell3),\n u_colorMid: getShaderColorFromString(props.colorMid, defaultPreset.params.colorMid),\n u_colorEdges: getShaderColorFromString(props.colorEdges, defaultPreset.params.colorEdges),\n u_colorGradient: props.colorGradient ?? defaultPreset.params.colorGradient,\n u_distance: props.distance ?? defaultPreset.params.distance,\n u_edgesSize: props.edgesSize ?? defaultPreset.params.edgesSize,\n u_edgesSharpness: props.edgesSharpness ?? defaultPreset.params.edgesSharpness,\n u_middleSize: props.middleSize ?? defaultPreset.params.middleSize,\n u_middleSharpness: props.middleSharpness ?? defaultPreset.params.middleSharpness,\n };\n }, [\n props.scale,\n props.colorCell1,\n props.colorCell3,\n props.colorCell2,\n props.colorMid,\n props.colorEdges,\n props.colorGradient,\n props.distance,\n props.edgesSize,\n props.edgesSharpness,\n props.middleSize,\n props.middleSharpness,\n ]);\n\n return <ShaderMount {...props} fragmentShader={voronoiFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport {\n getShaderColorFromString,\n warpFragmentShader,\n type WarpUniforms,\n type PatternShape,\n PatternShapes,\n} from '@paper-design/shaders';\n\nexport type WarpParams = {\n scale?: number;\n rotation?: number;\n color1?: string;\n color2?: string;\n color3?: string;\n proportion?: number;\n softness?: number;\n distortion?: number;\n swirl?: number;\n swirlIterations?: number;\n shapeScale?: number;\n shape?: PatternShape;\n} & GlobalParams;\n\nexport type WarpProps = Omit<ShaderMountProps, 'fragmentShader'> & WarpParams;\n\ntype WarpPreset = { name: string; params: Required<WarpParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: WarpPreset = {\n name: 'Default',\n params: {\n scale: 1,\n rotation: 0,\n speed: 0.1,\n seed: 0,\n color1: 'hsla(0, 0%, 15%, 1)',\n color2: 'hsla(203, 80%, 70%, 1)',\n color3: 'hsla(0, 0%, 100%, 1)',\n proportion: 0.35,\n softness: 1,\n distortion: 0.25,\n swirl: 0.8,\n swirlIterations: 10,\n shapeScale: 0.1,\n shape: PatternShapes.Checks,\n },\n};\n\nexport const presetCauldron: WarpPreset = {\n name: 'Cauldron Pot',\n params: {\n scale: 1.1,\n rotation: 1.62,\n speed: 1,\n seed: 0,\n color1: 'hsla(100, 51%, 75%, 1)',\n color2: 'hsla(220, 39%, 32%, 1)',\n color3: 'hsla(129.2, 41.9%, 6.1%, 1)',\n proportion: 0.64,\n softness: 0.95,\n distortion: 0.2,\n swirl: 0.86,\n swirlIterations: 7,\n shapeScale: 0,\n shape: PatternShapes.Edge,\n },\n};\n\nexport const presetSilk: WarpPreset = {\n name: 'Silk',\n params: {\n scale: 0.26,\n rotation: 0,\n speed: 0.5,\n seed: 0,\n color1: 'hsla(0, 9%, 7%, 1)',\n color2: 'hsla(8, 13%, 34%, 1)',\n color3: 'hsla(5, 8%, 71%, 1)',\n proportion: 0,\n softness: 1,\n distortion: 0.3,\n swirl: 0.6,\n swirlIterations: 11,\n shapeScale: 0.05,\n shape: PatternShapes.Stripes,\n },\n};\n\nexport const presetPassion: WarpPreset = {\n name: 'Passion',\n params: {\n scale: 0.25,\n rotation: 1.35,\n speed: 0.3,\n seed: 0,\n color1: 'hsla(0, 44.7%, 14.9%, 1)',\n color2: 'hsla(353.4, 34%, 42.2%, 1)',\n color3: 'hsla(29, 100%, 76.1%, 1)',\n proportion: 0.5,\n softness: 1,\n distortion: 0.09,\n swirl: 0.9,\n swirlIterations: 6,\n shapeScale: 0.25,\n shape: PatternShapes.Checks,\n },\n};\n\nexport const presetPhantom: WarpPreset = {\n name: 'Phantom',\n params: {\n scale: 0.68,\n rotation: 1.8,\n speed: 1.25,\n seed: 0,\n color1: 'hsla(242.2, 44.3%, 12%, 1)',\n color2: 'hsla(236.1, 80.4%, 70%, 1)',\n color3: 'hsla(0, 0%, 100%, 1)',\n proportion: 0.45,\n softness: 1,\n distortion: 0.16,\n swirl: 0.3,\n swirlIterations: 7,\n shapeScale: 0.1,\n shape: PatternShapes.Checks,\n },\n};\n\nexport const presetAbyss: WarpPreset = {\n name: 'The Abyss',\n params: {\n scale: 0.1,\n rotation: 2,\n speed: 0.06,\n seed: 0,\n color1: 'hsla(242.2, 44.3%, 12%, 1)',\n color2: 'hsla(236.1, 80.4%, 70%, 1)',\n color3: 'hsla(0, 0%, 100%, 1)',\n proportion: 0,\n softness: 1,\n distortion: 0.09,\n swirl: 0.48,\n swirlIterations: 4,\n shapeScale: 0.1,\n shape: PatternShapes.Edge,\n },\n};\n\nexport const presetInk: WarpPreset = {\n name: 'Live Ink',\n params: {\n scale: 0.7,\n rotation: 1.5,\n speed: 0.25,\n seed: 0,\n color1: 'hsla(210, 11.1%, 7.1%, 1)',\n color2: 'hsla(165, 9%, 65.1%, 1)',\n color3: 'hsla(84, 100%, 97.1%, 1)',\n proportion: 0.35,\n softness: 0,\n distortion: 0.25,\n swirl: 0.8,\n swirlIterations: 10,\n shapeScale: 0.26,\n shape: PatternShapes.Checks,\n },\n};\n\nexport const presetIceberg: WarpPreset = {\n name: 'Iceberg',\n params: {\n scale: 1.1,\n rotation: 2,\n speed: 0.05,\n seed: 0,\n color1: 'hsla(0, 0%, 100%, 1)',\n color2: 'hsla(220, 38.7%, 32%, 1)',\n color3: 'hsla(129.2, 41.9%, 6.1%, 1)',\n proportion: 0.3,\n softness: 1,\n distortion: 0.2,\n swirl: 0.86,\n swirlIterations: 7,\n shapeScale: 0,\n shape: PatternShapes.Checks,\n },\n};\n\nexport const presetNectar: WarpPreset = {\n name: 'Nectar',\n params: {\n scale: 0.24,\n rotation: 0,\n speed: 0.42,\n seed: 0,\n color1: 'hsla(37.5, 22.2%, 7.1%, 1)',\n color2: 'hsla(38.5, 59.1%, 63.1%, 1)',\n color3: 'hsla(37.6, 30%, 95.2%, 1)',\n proportion: 0.24,\n softness: 1,\n distortion: 0.21,\n swirl: 0.57,\n swirlIterations: 10,\n shapeScale: 0.32,\n shape: PatternShapes.Edge,\n },\n};\n\nexport const presetFilteredLight: WarpPreset = {\n name: 'Filtered Light',\n params: {\n scale: 2,\n rotation: 0.44,\n speed: 0.32,\n seed: 0,\n color1: 'hsla(60.2, 7.8%, 8.3%, 1)',\n color2: 'hsla(64.4, 27.8%, 81%, 1)',\n color3: 'hsla(60, 100%, 93.9%, 1)',\n proportion: 0.25,\n softness: 1,\n distortion: 0.06,\n swirl: 0,\n swirlIterations: 0,\n shapeScale: 0,\n shape: PatternShapes.Stripes,\n },\n};\n\nexport const presetKelp: WarpPreset = {\n name: 'Kelp',\n params: {\n scale: 0.38,\n rotation: 0.6,\n speed: 2,\n seed: 0,\n color1: 'hsla(79.3, 100%, 78%, 1)',\n color2: 'hsla(112, 10.5%, 28%, 1)',\n color3: 'hsla(203.3, 50%, 7.1%, 1)',\n proportion: 1,\n softness: 0,\n distortion: 0,\n swirl: 0.15,\n swirlIterations: 0,\n shapeScale: 0.74,\n shape: PatternShapes.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 = (props: WarpProps): JSX.Element => {\n const uniforms: WarpUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_rotation: props.rotation ?? defaultPreset.params.rotation,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color2),\n u_proportion: props.proportion ?? defaultPreset.params.proportion,\n u_softness: props.softness ?? defaultPreset.params.softness,\n u_distortion: props.distortion ?? defaultPreset.params.distortion,\n u_swirl: props.swirl ?? defaultPreset.params.swirl,\n u_swirlIterations: props.swirlIterations ?? defaultPreset.params.swirlIterations,\n u_shapeScale: props.shapeScale ?? defaultPreset.params.shapeScale,\n u_shape: props.shape ?? defaultPreset.params.shape,\n };\n }, [\n props.scale,\n props.rotation,\n props.color1,\n props.color2,\n props.color3,\n props.proportion,\n props.softness,\n props.distortion,\n props.swirl,\n props.swirlIterations,\n props.shapeScale,\n props.shape,\n ]);\n\n return <ShaderMount {...props} fragmentShader={warpFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, godRaysFragmentShader, type GodRaysUniforms } from '@paper-design/shaders';\n\nexport type GodRaysParams = {\n colorBack?: string;\n color1?: string;\n color2?: string;\n color3?: string;\n offsetX?: number;\n offsetY?: number;\n frequency?: number;\n spotty?: number;\n midIntensity?: number;\n midSize?: number;\n density?: number;\n blending?: number;\n} & GlobalParams;\n\nexport type GodRaysProps = Omit<ShaderMountProps, 'fragmentShader'> & GodRaysParams;\n\ntype GodRaysPreset = { name: string; params: Required<GodRaysParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highmidIntensity bug)\n\nexport const defaultPreset: GodRaysPreset = {\n name: 'Default',\n params: {\n colorBack: 'hsla(215, 100%, 11%, 1)',\n color1: 'hsla(45, 100%, 70%, 1)',\n color2: 'hsla(10, 100%, 80%, 1)',\n color3: 'hsla(178, 100%, 83%, 1)',\n offsetX: -0.6,\n offsetY: -0.6,\n frequency: 6,\n spotty: 0.28,\n midIntensity: 0.97,\n midSize: 2,\n density: 0.3,\n blending: 0,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const auroraPreset: GodRaysPreset = {\n name: 'Aurora',\n params: {\n colorBack: 'hsla(0, 0%, 25%, 1)',\n color1: 'hsla(239, 100%, 70%, 1)',\n color2: 'hsla(150, 100%, 70%, 1)',\n color3: 'hsla(200, 100%, 70%, 1)',\n offsetX: 0,\n offsetY: 1,\n frequency: 2.4,\n spotty: 0.9,\n midIntensity: 0.8,\n midSize: 2.1,\n density: 0.5,\n blending: 1,\n speed: 0.5,\n seed: 0,\n },\n} as const;\n\nexport const warpPreset: GodRaysPreset = {\n name: 'Warp',\n params: {\n colorBack: 'hsla(0, 0%, 0%, 1)',\n color1: 'hsla(317, 100%, 50%, 1)',\n color2: 'hsla(25, 100%, 50%, 1)',\n color3: 'hsla(0, 0%, 100%, 1)',\n offsetX: 0,\n offsetY: 0,\n frequency: 1.2,\n spotty: 0.15,\n midIntensity: 0,\n midSize: 0,\n density: 0.79,\n blending: 0.4,\n speed: 2,\n seed: 0,\n },\n} as const;\n\nexport const linearPreset: GodRaysPreset = {\n name: 'Linear',\n params: {\n colorBack: 'hsla(0, 0%, 0%, 1)',\n color1: 'hsl(0 0% 100% / 12%)',\n color2: 'hsl(0 0% 100% / 24%)',\n color3: 'hsl(0 0% 100% / 16%)',\n offsetX: 0.2,\n offsetY: -0.7,\n frequency: 1.2,\n spotty: 0.25,\n midSize: 1.1,\n midIntensity: 0.75,\n density: 0.79,\n blending: 1,\n speed: 0.5,\n seed: 0,\n },\n} as const;\n\nexport const etherPreset: GodRaysPreset = {\n name: 'Ether',\n params: {\n colorBack: 'hsl(226.7 50% 7.1% / 100%)',\n color1: 'hsl(215 100% 53.9% / 65.1%)',\n color2: 'hsl(214.4 85.9% 86.1% / 74.9%)',\n color3: 'hsl(225 31.4% 20% / 100%)',\n offsetX: -0.6,\n offsetY: 0,\n frequency: 0.3,\n spotty: 0.77,\n midSize: 1.1,\n midIntensity: 0.5,\n density: 0.6,\n blending: 0.6,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const godRaysPresets: GodRaysPreset[] = [defaultPreset, auroraPreset, warpPreset, linearPreset, etherPreset];\n\nexport const GodRays = (props: GodRaysProps): JSX.Element => {\n const uniforms: GodRaysUniforms = useMemo(() => {\n return {\n u_colorBack: getShaderColorFromString(props.colorBack, defaultPreset.params.colorBack),\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color3),\n u_offsetX: props.offsetX ?? defaultPreset.params.offsetX,\n u_offsetY: props.offsetY ?? defaultPreset.params.offsetY,\n u_frequency: props.frequency ?? defaultPreset.params.frequency,\n u_spotty: props.spotty ?? defaultPreset.params.spotty,\n u_midIntensity: props.midIntensity ?? defaultPreset.params.midIntensity,\n u_midSize: props.midSize ?? defaultPreset.params.midSize,\n u_density: props.density ?? defaultPreset.params.density,\n u_blending: props.blending ?? defaultPreset.params.blending,\n };\n }, [\n props.colorBack,\n props.color1,\n props.color2,\n props.color3,\n props.offsetX,\n props.offsetY,\n props.frequency,\n props.spotty,\n props.midIntensity,\n props.midSize,\n props.density,\n props.blending,\n ]);\n\n return <ShaderMount {...props} fragmentShader={godRaysFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, spiralFragmentShader, type SpiralUniforms } from '@paper-design/shaders';\n\nexport type SpiralParams = {\n color1?: string;\n color2?: string;\n scale?: number;\n offsetX?: number;\n offsetY?: number;\n spiralDensity?: number;\n spiralDistortion?: number;\n strokeWidth?: number;\n strokeTaper?: number;\n strokeCap?: number;\n noiseFreq?: number;\n noisePower?: number;\n blur?: number;\n} & GlobalParams;\n\nexport type SpiralProps = Omit<ShaderMountProps, 'fragmentShader'> & SpiralParams;\n\ntype SpiralPreset = { name: string; params: Required<SpiralParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highmidIntensity bug)\n\nexport const defaultPreset: SpiralPreset = {\n name: 'Default',\n params: {\n color1: 'hsla(0, 0%, 90%, 1)',\n color2: 'hsla(0, 0%, 25%, 1)',\n scale: 1,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0,\n spiralDistortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0,\n noiseFreq: 0,\n noisePower: 0,\n blur: 0.01,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const noisyPreset: SpiralPreset = {\n name: 'Noisy',\n params: {\n color1: 'hsla(87, 77%, 53%, 1)',\n color2: 'hsla(109, 70%, 31%, 1)',\n scale: 1.3,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0.5,\n spiralDistortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0.5,\n noiseFreq: 0.1,\n noisePower: 1,\n blur: 0,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const dropletPreset: SpiralPreset = {\n name: 'Droplet',\n params: {\n color1: 'hsla(320, 50%, 50%, 1)',\n color2: 'hsla(190, 50%, 95%, 1)',\n scale: 0.65,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0,\n spiralDistortion: 0,\n strokeWidth: 0.05,\n strokeTaper: 0,\n strokeCap: 1,\n noiseFreq: 0,\n noisePower: 0,\n blur: 0,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const sandPreset: SpiralPreset = {\n name: 'Sand',\n params: {\n color1: 'hsla(45, 25%, 50%, 1)',\n color2: 'hsla(0, 0%, 87%, 1)',\n scale: 3,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0,\n spiralDistortion: 0,\n strokeWidth: 0.15,\n strokeTaper: 0,\n strokeCap: 0,\n noiseFreq: 30,\n noisePower: 1,\n blur: 0.2,\n speed: 0,\n seed: 0,\n },\n} as const;\n\nexport const swirlPreset: SpiralPreset = {\n name: 'Swirl',\n params: {\n color1: 'hsla(160, 50%, 80%, 1)',\n color2: 'hsla(220, 50%, 20%, 1)',\n scale: 4,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0.8,\n spiralDistortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0,\n noiseFreq: 0,\n noisePower: 0,\n blur: 0.5,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const hookPreset: SpiralPreset = {\n name: 'Hook',\n params: {\n color1: 'hsla(0, 0%, 0%, 1)',\n color2: 'hsla(200, 50%, 70%, 1)',\n scale: 0.8,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0,\n spiralDistortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0.5,\n strokeCap: 0,\n noiseFreq: 0,\n noisePower: 0,\n blur: 0.02,\n speed: 3,\n seed: 0,\n },\n} as const;\n\nexport const vinylPreset: SpiralPreset = {\n name: 'Vinyl',\n params: {\n color1: 'hsla(0, 0%, 15%, 1)',\n color2: 'hsla(320, 5%, 75%, 1)',\n scale: 1,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0,\n spiralDistortion: 0.3,\n strokeWidth: 0.95,\n strokeTaper: 0,\n strokeCap: 1,\n noiseFreq: 0,\n noisePower: 0,\n blur: 0.11,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const spiralPresets: SpiralPreset[] = [\n defaultPreset,\n noisyPreset,\n dropletPreset,\n swirlPreset,\n sandPreset,\n hookPreset,\n vinylPreset,\n];\n\nexport const Spiral = (props: SpiralProps): JSX.Element => {\n const uniforms: SpiralUniforms = useMemo(() => {\n return {\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_offsetX: props.offsetX ?? defaultPreset.params.offsetX,\n u_offsetY: props.offsetY ?? defaultPreset.params.offsetY,\n u_spiralDensity: props.spiralDensity ?? defaultPreset.params.spiralDensity,\n u_spiralDistortion: props.spiralDistortion ?? defaultPreset.params.spiralDistortion,\n u_strokeWidth: props.strokeWidth ?? defaultPreset.params.strokeWidth,\n u_strokeTaper: props.strokeTaper ?? defaultPreset.params.strokeTaper,\n u_strokeCap: props.strokeCap ?? defaultPreset.params.strokeCap,\n u_noiseFreq: props.noiseFreq ?? defaultPreset.params.noiseFreq,\n u_noisePower: props.noisePower ?? defaultPreset.params.noisePower,\n u_blur: props.blur ?? defaultPreset.params.blur,\n };\n }, [\n props.color1,\n props.color2,\n props.scale,\n props.offsetX,\n props.offsetY,\n props.spiralDensity,\n props.spiralDistortion,\n props.strokeWidth,\n props.strokeTaper,\n props.strokeCap,\n props.noiseFreq,\n props.noisePower,\n props.blur,\n ]);\n\n return <ShaderMount {...props} fragmentShader={spiralFragmentShader} uniforms={uniforms} />;\n};\n"],
|
|
5
|
-
"mappings": "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",
|
|
6
|
-
"names": ["useEffect", "useRef", "ShaderMountVanilla", "jsx", "ShaderMount", "ref", "fragmentShader", "style", "
|
|
4
|
+
"sourcesContent": ["import React, { useEffect, useRef } from 'react';\nimport { ShaderMount as ShaderMountVanilla, type ShaderMountUniforms } from '@paper-design/shaders';\n\n/** The React ShaderMount can also accept strings as uniform values, which will assumed to be URLs and loaded as images */\nexport type ShaderMountUniformsReact = { [key: string]: ShaderMountUniforms[keyof ShaderMountUniforms] | string };\n\nexport interface ShaderMountProps {\n ref?: React.RefObject<HTMLCanvasElement>;\n fragmentShader: string;\n style?: React.CSSProperties;\n uniforms?: ShaderMountUniformsReact;\n webGlContextAttributes?: WebGLContextAttributes;\n speed?: number;\n seed?: number;\n}\n\n/** Params that every shader can set as part of their controls */\nexport type GlobalParams = Pick<ShaderMountProps, 'speed' | 'seed'>;\n\n/** Parse the provided uniforms, turning URL strings into loaded images */\nconst processUniforms = (uniforms: ShaderMountUniformsReact): Promise<ShaderMountUniforms> => {\n const processedUniforms: 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(uniforms).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 return Promise.all(imageLoadPromises).then(() => 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> = ({\n ref,\n fragmentShader,\n style,\n uniforms = {},\n webGlContextAttributes,\n speed = 1,\n seed = 0,\n}) => {\n const canvasRef = ref ?? useRef<HTMLCanvasElement>(null);\n const shaderMountRef = useRef<ShaderMountVanilla | null>(null);\n\n useEffect(() => {\n const initShader = async () => {\n const processedUniforms = await processUniforms(uniforms);\n\n if (canvasRef.current && !shaderMountRef.current) {\n shaderMountRef.current = new ShaderMountVanilla(\n canvasRef.current,\n fragmentShader,\n processedUniforms,\n webGlContextAttributes,\n speed,\n seed\n );\n }\n };\n\n initShader();\n\n return () => {\n shaderMountRef.current?.dispose();\n shaderMountRef.current = null;\n };\n }, [fragmentShader, webGlContextAttributes]);\n\n useEffect(() => {\n const updateUniforms = async () => {\n const processedUniforms = await processUniforms(uniforms);\n shaderMountRef.current?.setUniforms(processedUniforms);\n };\n\n updateUniforms();\n }, [uniforms]);\n\n useEffect(() => {\n shaderMountRef.current?.setSpeed(speed);\n }, [speed]);\n\n useEffect(() => {\n shaderMountRef.current?.setSeed(seed);\n }, [seed]);\n\n return <canvas ref={canvasRef} style={style} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, grainCloudsFragmentShader, type GrainCloudsUniforms } from '@paper-design/shaders';\n\nexport type GrainCloudsParams = {\n scale?: number;\n color1?: string;\n color2?: string;\n grainAmount?: number;\n} & GlobalParams;\n\nexport type GrainCloudsProps = Omit<ShaderMountProps, 'fragmentShader'> & GrainCloudsParams;\n\ntype GrainCloudsPreset = { name: string; params: Required<GrainCloudsParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: GrainCloudsPreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 0.3,\n seed: 0,\n color1: 'hsla(0, 0%, 0%, 1)',\n color2: 'hsla(0, 0%, 100%, 1)',\n grainAmount: 1,\n },\n};\n\nexport const skyPreset: GrainCloudsPreset = {\n name: 'Sky',\n params: {\n scale: 1,\n speed: 0.3,\n seed: 0,\n color1: 'hsla(218, 100%, 73%, 1)',\n color2: 'hsla(0, 0%, 100%, 1)',\n grainAmount: 0,\n },\n};\n\nexport const grainCloudsPresets: GrainCloudsPreset[] = [defaultPreset, skyPreset];\n\nexport const GrainClouds = (props: GrainCloudsProps): JSX.Element => {\n const uniforms: GrainCloudsUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_grainAmount: props.grainAmount ?? defaultPreset.params.grainAmount,\n };\n }, [props.scale, props.color1, props.color2, 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, grainCloudsPresets } from './shaders/grain-clouds';\nexport { type GrainCloudsProps } from './shaders/grain-clouds';\nexport { type GrainCloudsParams } from './shaders/grain-clouds';\nexport { type GrainCloudsUniforms } from '@paper-design/shaders';\n\n// Mesh gradient\nexport { MeshGradient, meshGradientPresets } from './shaders/mesh-gradient';\nexport { type MeshGradientProps } from './shaders/mesh-gradient';\nexport { type MeshGradientParams } from './shaders/mesh-gradient';\nexport { type MeshGradientUniforms } from '@paper-design/shaders';\n\n// Smoke ring\nexport { SmokeRing, smokeRingPresets } from './shaders/smoke-ring';\nexport { type SmokeRingProps } from './shaders/smoke-ring';\nexport { type SmokeRingParams } from './shaders/smoke-ring';\nexport { type SmokeRingUniforms } from '@paper-design/shaders';\n\n// Neuro noise\nexport { NeuroNoise, neuroNoisePresets } from './shaders/neuro-noise';\nexport { type NeuroNoiseProps } from './shaders/neuro-noise';\nexport { type NeuroNoiseParams } from './shaders/neuro-noise';\nexport { type NeuroNoiseUniforms } from '@paper-design/shaders';\n\n// Animated dots pattern: orbit type of animation\nexport { DotsOrbit, dotsOrbitPresets } from './shaders/dots-orbit';\nexport { type DotsOrbitProps } from './shaders/dots-orbit';\nexport { type DotsOrbitParams } from './shaders/dots-orbit';\nexport { type DotsOrbitUniforms } from '@paper-design/shaders';\n\n// Dot Grid\nexport { DotsGrid, dotsGridPresets } from './shaders/dots-grid';\nexport { type DotsGridProps } from './shaders/dots-grid';\nexport { type DotsGridParams } from './shaders/dots-grid';\nexport { type DotsGridUniforms, DotsGridShapes, type DotsGridShape } from '@paper-design/shaders';\n\n// Stepped simplex noise\nexport { SteppedSimplexNoise, steppedSimplexNoisePresets } from './shaders/stepped-simplex-noise';\nexport { type SteppedSimplexNoiseProps } from './shaders/stepped-simplex-noise';\nexport { type SteppedSimplexNoiseParams } from './shaders/stepped-simplex-noise';\nexport { type SteppedSimplexNoiseUniforms } from '@paper-design/shaders';\n\n// Metaballs\nexport { Metaballs, metaballsPresets } from './shaders/metaballs';\nexport { type MetaballsProps } from './shaders/metaballs';\nexport { type MetaballsParams } from './shaders/metaballs';\nexport { type MetaballsUniforms } from '@paper-design/shaders';\n\n// Waves\nexport { Waves, wavesPresets } from './shaders/waves';\nexport { type WavesProps } from './shaders/waves';\nexport { type WavesParams } from './shaders/waves';\nexport { type WavesUniforms } from '@paper-design/shaders';\n\n// Perlin noise\nexport { PerlinNoise, perlinNoisePresets } from './shaders/perlin-noise';\nexport { type PerlinNoiseProps } from './shaders/perlin-noise';\nexport { type PerlinNoiseParams } from './shaders/perlin-noise';\nexport { type PerlinNoiseUniforms } from '@paper-design/shaders';\n\n// Voronoi diagram\nexport { Voronoi, voronoiPresets } from './shaders/voronoi';\nexport { type VoronoiProps } from './shaders/voronoi';\nexport { type VoronoiParams } from './shaders/voronoi';\nexport { type VoronoiUniforms } from '@paper-design/shaders';\n\n// Warping distortion\nexport { Warp, warpPresets } from './shaders/warp';\nexport { type WarpProps } from './shaders/warp';\nexport { type WarpParams } from './shaders/warp';\nexport { type WarpUniforms, PatternShapes, type PatternShape } from '@paper-design/shaders';\n\n// God Rays effect\nexport { GodRays, godRaysPresets } from './shaders/god-rays';\nexport { type GodRaysProps } from './shaders/god-rays';\nexport { type GodRaysParams } from './shaders/god-rays';\nexport { type GodRaysUniforms } from '@paper-design/shaders';\n\n// Single-colored spiral shape\nexport { Spiral, spiralPresets } from './shaders/spiral';\nexport { type SpiralProps } from './shaders/spiral';\nexport { type SpiralParams } from './shaders/spiral';\nexport { type SpiralUniforms } from '@paper-design/shaders';\n\n// ----- Uniform conversion utils ----- //\nexport { getShaderColorFromString } from '@paper-design/shaders';\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, meshGradientFragmentShader, type MeshGradientUniforms } from '@paper-design/shaders';\n\nexport type MeshGradientParams = {\n color1?: string;\n color2?: string;\n color3?: string;\n color4?: string;\n} & GlobalParams;\n\nexport type MeshGradientProps = Omit<ShaderMountProps, 'fragmentShader'> & MeshGradientParams;\n\ntype MeshGradientPreset = { name: string; params: Required<MeshGradientParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: MeshGradientPreset = {\n name: 'Default',\n params: {\n speed: 0.15,\n seed: 0,\n color1: 'hsla(259, 29%, 73%, 1)',\n color2: 'hsla(263, 57%, 39%, 1)',\n color3: 'hsla(48, 73%, 84%, 1)',\n color4: 'hsla(295, 32%, 70%, 1)',\n },\n} as const;\n\nexport const beachPreset: MeshGradientPreset = {\n name: 'Beach',\n params: {\n speed: 0.1,\n seed: 0,\n color1: 'hsla(186, 81%, 83%, 1)',\n color2: 'hsla(198, 55%, 68%, 1)',\n color3: 'hsla(53, 67%, 88%, 1)',\n color4: 'hsla(45, 93%, 73%, 1)',\n },\n};\n\nexport const fadedPreset: MeshGradientPreset = {\n name: 'Faded',\n params: {\n speed: -0.3,\n seed: 0,\n color1: 'hsla(186, 41%, 90%, 1)',\n color2: 'hsla(208, 71%, 85%, 1)',\n color3: 'hsla(183, 51%, 92%, 1)',\n color4: 'hsla(201, 72%, 90%, 1)',\n },\n};\n\nexport const meshGradientPresets: MeshGradientPreset[] = [defaultPreset, beachPreset, fadedPreset];\n\nexport const MeshGradient = (props: MeshGradientProps): JSX.Element => {\n const uniforms: MeshGradientUniforms = useMemo(() => {\n return {\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color3),\n u_color4: getShaderColorFromString(props.color4, defaultPreset.params.color4),\n };\n }, [props.color1, props.color2, props.color3, props.color4]);\n\n return <ShaderMount {...props} fragmentShader={meshGradientFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, smokeRingFragmentShader, type SmokeRingUniforms } from '@paper-design/shaders';\n\nexport type SmokeRingParams = {\n colorBack?: string;\n colorInner?: string;\n colorOuter?: string;\n scale?: number;\n noiseScale?: number;\n thickness?: number;\n} & GlobalParams;\n\nexport type SmokeRingProps = Omit<ShaderMountProps, 'fragmentShader'> & SmokeRingParams;\n\ntype SmokeRingPreset = { name: string; params: Required<SmokeRingParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: SmokeRingPreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 1,\n seed: 0,\n colorBack: 'hsla(208, 54%, 7%, 1)',\n colorInner: 'hsla(0, 0%, 100%, 1)',\n colorOuter: 'hsla(211, 100%, 64%, 1)',\n noiseScale: 1.4,\n thickness: 0.33,\n },\n} as const;\n\nexport const cloudPreset: SmokeRingPreset = {\n name: 'Cloud',\n params: {\n scale: 1,\n speed: 1,\n seed: 0,\n colorBack: 'hsla(218, 100%, 62%, 1)',\n colorInner: 'hsla(0, 0%, 100%, 1)',\n colorOuter: 'hsla(0, 0%, 100%, 1)',\n noiseScale: 1.8,\n thickness: 0.7,\n },\n};\n\nexport const firePreset: SmokeRingPreset = {\n name: 'Fire',\n params: {\n scale: 1,\n speed: 4,\n seed: 0,\n colorBack: 'hsla(20, 100%, 5%, 1)',\n colorInner: 'hsla(40, 100%, 50%, 1)',\n colorOuter: 'hsla(0, 100%, 50%, 1)',\n noiseScale: 1.4,\n thickness: 0.35,\n },\n};\n\nexport const electricPreset: SmokeRingPreset = {\n name: 'Electric',\n params: {\n scale: 1,\n speed: -2.5,\n seed: 0,\n colorBack: 'hsla(47, 50%, 7%, 1)',\n colorInner: 'hsla(47, 100%, 64%, 1)',\n colorOuter: 'hsla(47, 100%, 64%, 1)',\n noiseScale: 1.8,\n thickness: 0.1,\n },\n};\n\nexport const poisonPreset: SmokeRingPreset = {\n name: 'Poison',\n params: {\n scale: 1,\n speed: 3,\n seed: 0,\n colorBack: 'hsla(120, 100%, 3%, 1)',\n colorInner: 'hsla(120, 100%, 3%, 1)',\n colorOuter: 'hsla(120, 100%, 66%, 1)',\n noiseScale: 5,\n thickness: 0.6,\n },\n};\n\nexport const smokeRingPresets: SmokeRingPreset[] = [\n defaultPreset,\n cloudPreset,\n firePreset,\n electricPreset,\n poisonPreset,\n];\n\nexport const SmokeRing = (props: SmokeRingProps): JSX.Element => {\n const uniforms: SmokeRingUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_colorBack: getShaderColorFromString(props.colorBack, defaultPreset.params.colorBack),\n u_colorInner: getShaderColorFromString(props.colorInner, defaultPreset.params.colorInner),\n u_colorOuter: getShaderColorFromString(props.colorOuter, defaultPreset.params.colorOuter),\n u_noiseScale: props.noiseScale ?? defaultPreset.params.noiseScale,\n u_thickness: props.thickness ?? defaultPreset.params.thickness,\n };\n }, [props.scale, props.colorBack, props.colorInner, props.colorOuter, props.noiseScale, props.thickness]);\n\n return <ShaderMount {...props} fragmentShader={smokeRingFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, neuroNoiseFragmentShader, type NeuroNoiseUniforms } from '@paper-design/shaders';\n\nexport type NeuroNoiseParams = {\n scale?: number;\n colorFront?: string;\n colorBack?: string;\n brightness?: number;\n} & GlobalParams;\n\nexport type NeuroNoiseProps = Omit<ShaderMountProps, 'fragmentShader'> & NeuroNoiseParams;\n\ntype NeuroNoisePreset = { name: string; params: Required<NeuroNoiseParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: NeuroNoisePreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 1,\n seed: 0,\n colorFront: 'hsla(261, 100%, 82%, 1)',\n colorBack: 'hsla(0, 0%, 0%, 1)',\n brightness: 1.3,\n },\n} as const;\n\nconst marblePreset: NeuroNoisePreset = {\n name: 'Marble',\n params: {\n scale: 0.4,\n speed: 0,\n seed: 0,\n colorFront: 'hsla(230, 24%, 15%, 1)',\n colorBack: 'hsla(0, 0%, 97%, 1)',\n brightness: 1.1,\n },\n} as const;\n\nexport const neuroNoisePresets: NeuroNoisePreset[] = [defaultPreset, marblePreset] as const;\n\nexport const NeuroNoise = (props: NeuroNoiseProps): JSX.Element => {\n const uniforms: NeuroNoiseUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_colorFront: getShaderColorFromString(props.colorFront, defaultPreset.params.colorFront),\n u_colorBack: getShaderColorFromString(props.colorBack, defaultPreset.params.colorBack),\n u_brightness: props.brightness ?? defaultPreset.params.brightness,\n };\n }, [props.scale, props.colorFront, props.colorBack, props.brightness]);\n\n return <ShaderMount {...props} fragmentShader={neuroNoiseFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, dotsOrbitFragmentShader, type DotsOrbitUniforms } from '@paper-design/shaders';\n\nexport type DotsOrbitParams = {\n scale?: number;\n color1?: string;\n color2?: string;\n color3?: string;\n color4?: string;\n dotSize?: number;\n dotSizeRange?: number;\n spreading?: number;\n} & GlobalParams;\n\nexport type DotsOrbitProps = Omit<ShaderMountProps, 'fragmentShader'> & DotsOrbitParams;\n\ntype DotsOrbitPreset = { name: string; params: Required<DotsOrbitParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: DotsOrbitPreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 2,\n seed: 0,\n color1: 'hsla(358, 66%, 49%, 1)',\n color2: 'hsla(145, 30%, 33%, 1)',\n color3: 'hsla(39, 88%, 52%, 1)',\n color4: 'hsla(274, 30%, 35%, 1)',\n dotSize: 0.7,\n dotSizeRange: 0.4,\n spreading: 1,\n },\n} as const;\n\nexport const dotsOrbitPresets: DotsOrbitPreset[] = [defaultPreset];\n\nexport const DotsOrbit = (props: DotsOrbitProps): JSX.Element => {\n const uniforms: DotsOrbitUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color3),\n u_color4: getShaderColorFromString(props.color4, defaultPreset.params.color4),\n u_dotSize: props.dotSize ?? defaultPreset.params.dotSize,\n u_dotSizeRange: props.dotSizeRange ?? defaultPreset.params.dotSizeRange,\n u_spreading: props.spreading ?? defaultPreset.params.spreading,\n };\n }, [\n props.scale,\n props.color1,\n props.color2,\n props.color3,\n props.color4,\n props.dotSize,\n props.dotSizeRange,\n props.spreading,\n ]);\n\n return <ShaderMount {...props} fragmentShader={dotsOrbitFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type ShaderMountProps } from '../shader-mount';\nimport {\n dotsGridFragmentShader,\n getShaderColorFromString,\n type DotsGridUniforms,\n type DotsGridShape,\n DotsGridShapes,\n} from '@paper-design/shaders';\n\nexport type DotsGridParams = {\n colorBack?: string;\n colorFill?: string;\n colorStroke?: string;\n dotSize?: number;\n gridSpacingX?: number;\n gridSpacingY?: number;\n strokeWidth?: number;\n sizeRange?: number;\n opacityRange?: number;\n shape?: DotsGridShape;\n};\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport type DotsGridProps = Omit<ShaderMountProps, 'fragmentShader'> & DotsGridParams;\n\ntype DotsGridPreset = { name: string; params: Required<DotsGridParams> };\n\nexport const defaultPreset: DotsGridPreset = {\n name: 'Default',\n params: {\n colorBack: 'hsla(358, 66%, 49%, 0)',\n colorFill: 'hsla(145, 30%, 10%, 1)',\n colorStroke: 'hsla(39, 88%, 52%, 1)',\n dotSize: 2,\n gridSpacingX: 50,\n gridSpacingY: 50,\n strokeWidth: 0,\n sizeRange: 0,\n opacityRange: 0,\n shape: DotsGridShapes.Circle,\n },\n} as const;\n\nexport const macrodataPreset: DotsGridPreset = {\n name: 'Macrodata',\n params: {\n colorBack: 'hsla(211, 37%, 13%, 1)',\n colorFill: 'hsla(218, 100%, 67%, 1)',\n colorStroke: 'hsla(0, 0%, 0%, 1)',\n dotSize: 3,\n gridSpacingX: 25,\n gridSpacingY: 25,\n strokeWidth: 0,\n sizeRange: 0.25,\n opacityRange: 0.9,\n shape: DotsGridShapes.Circle,\n },\n};\n\nconst trianglesPreset: DotsGridPreset = {\n name: 'Triangles',\n params: {\n colorBack: 'hsla(0, 0%, 100%, 1)',\n colorFill: 'hsla(0, 0%, 100%, 1)',\n colorStroke: 'hsla(0, 0%, 0%, .5)',\n dotSize: 5,\n gridSpacingX: 32,\n gridSpacingY: 32,\n strokeWidth: 1,\n sizeRange: 0,\n opacityRange: 0,\n shape: DotsGridShapes.Triangle,\n },\n} as const;\n\nconst bubblesPreset: DotsGridPreset = {\n name: 'Bubbles',\n params: {\n colorBack: 'hsla(234, 100%, 31%, .5)',\n colorFill: 'hsla(100, 30%, 100%, 1)',\n colorStroke: 'hsla(0, 100%, 0%, 1)',\n dotSize: 28,\n gridSpacingX: 60,\n gridSpacingY: 60,\n strokeWidth: 12,\n sizeRange: 0.7,\n opacityRange: 1.3,\n shape: DotsGridShapes.Circle,\n },\n} as const;\n\nconst treeLinePreset: DotsGridPreset = {\n name: 'Tree line',\n params: {\n colorBack: 'hsla(100, 100%, 36%, .05)',\n colorFill: 'hsla(150, 80%, 10%, 1)',\n colorStroke: 'hsla(0, 0%, 0%, 1)',\n dotSize: 8,\n gridSpacingX: 20,\n gridSpacingY: 90,\n strokeWidth: 0,\n sizeRange: 1,\n opacityRange: 0.6,\n shape: DotsGridShapes.Circle,\n },\n} as const;\n\nconst diamondsPreset: DotsGridPreset = {\n name: 'Diamonds',\n params: {\n colorBack: 'hsla(0, 0%, 0%, 0)',\n colorFill: 'hsla(0, 100%, 50%, 1)',\n colorStroke: 'hsla(0, 0%, 0%, 1)',\n dotSize: 15,\n gridSpacingX: 30,\n gridSpacingY: 30,\n strokeWidth: 0,\n sizeRange: 0,\n opacityRange: 2,\n shape: DotsGridShapes.Diamond,\n },\n} as const;\n\nconst wallpaperPreset: DotsGridPreset = {\n name: 'Wallpaper',\n params: {\n colorBack: 'hsla(154, 33%, 19%, 1)',\n colorFill: 'hsla(0, 0%, 0%, 0)',\n colorStroke: 'hsla(36, 48%, 58%, 1)',\n dotSize: 9,\n gridSpacingX: 32,\n gridSpacingY: 32,\n strokeWidth: 1,\n sizeRange: 0,\n opacityRange: 0,\n shape: DotsGridShapes.Diamond,\n },\n} as const;\n\nconst matrixPreset: DotsGridPreset = {\n name: 'Enter the Matrix',\n params: {\n colorBack: 'hsla(0, 100%, 0%, 1)',\n colorFill: 'hsla(182, 100%, 64%, 1)',\n colorStroke: 'hsla(0, 100%, 100%, 0)',\n dotSize: 2,\n gridSpacingX: 10,\n gridSpacingY: 10,\n strokeWidth: 0.5,\n sizeRange: 0.25,\n opacityRange: 1,\n shape: DotsGridShapes.Triangle,\n },\n} as const;\n\nconst waveformPreset: DotsGridPreset = {\n name: 'Waveform',\n params: {\n colorBack: 'hsla(0, 100%, 100%, 1)',\n colorFill: 'hsla(227, 93%, 38%, 1)',\n colorStroke: 'hsla(0, 0%, 0%, 0)',\n dotSize: 100,\n gridSpacingX: 2,\n gridSpacingY: 215,\n strokeWidth: 0,\n sizeRange: 1,\n opacityRange: 0,\n shape: DotsGridShapes.Square,\n },\n} as const;\n\nexport const dotsGridPresets: DotsGridPreset[] = [\n defaultPreset,\n macrodataPreset,\n trianglesPreset,\n bubblesPreset,\n treeLinePreset,\n diamondsPreset,\n wallpaperPreset,\n matrixPreset,\n waveformPreset,\n];\n\nexport const DotsGrid = (props: DotsGridProps): JSX.Element => {\n const uniforms: DotsGridUniforms = useMemo(() => {\n return {\n u_colorBack: getShaderColorFromString(props.colorBack, defaultPreset.params.colorBack),\n u_colorFill: getShaderColorFromString(props.colorFill, defaultPreset.params.colorStroke),\n u_colorStroke: getShaderColorFromString(props.colorStroke, defaultPreset.params.colorStroke),\n u_dotSize: props.dotSize ?? defaultPreset.params.dotSize,\n u_gridSpacingX: props.gridSpacingX ?? defaultPreset.params.gridSpacingX,\n u_gridSpacingY: props.gridSpacingY ?? defaultPreset.params.gridSpacingY,\n u_strokeWidth: props.strokeWidth ?? defaultPreset.params.strokeWidth,\n u_sizeRange: props.sizeRange ?? defaultPreset.params.sizeRange,\n u_opacityRange: props.opacityRange ?? defaultPreset.params.opacityRange,\n u_shape: props.shape ?? defaultPreset.params.shape,\n };\n }, [\n props.colorBack,\n props.colorFill,\n props.colorStroke,\n props.dotSize,\n props.gridSpacingX,\n props.gridSpacingY,\n props.strokeWidth,\n props.sizeRange,\n props.opacityRange,\n props.shape,\n ]);\n\n return <ShaderMount {...props} fragmentShader={dotsGridFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport {\n getShaderColorFromString,\n steppedSimplexNoiseFragmentShader,\n type SteppedSimplexNoiseUniforms,\n} from '@paper-design/shaders';\n\nexport type SteppedSimplexNoiseParams = {\n scale?: number;\n color1?: string;\n color2?: string;\n color3?: string;\n color4?: string;\n color5?: string;\n stepsNumber?: number;\n} & GlobalParams;\n\nexport type SteppedSimplexNoiseProps = Omit<ShaderMountProps, 'fragmentShader'> & SteppedSimplexNoiseParams;\n\ntype SteppedSimplexNoisePreset = { name: string; params: Required<SteppedSimplexNoiseParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: SteppedSimplexNoisePreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 0.15,\n seed: 0,\n color1: 'hsla(208, 25%, 45%, 1)',\n color2: 'hsla(94, 38%, 59%, 1)',\n color3: 'hsla(359, 94%, 62%, 1)',\n color4: 'hsla(42, 93%, 64%, 1)',\n color5: 'hsla(0, 0%, 100%, 1)',\n stepsNumber: 13,\n },\n} as const;\n\nconst magmaPreset: SteppedSimplexNoisePreset = {\n name: 'Magma',\n params: {\n scale: 0.3,\n speed: 0.2,\n seed: 0,\n color1: 'hsla(0, 100%, 36%, 1)',\n color2: 'hsla(0, 95%, 44%, 1)',\n color3: 'hsla(20, 100%, 49%, 1)',\n color4: 'hsla(45, 100%, 45%, 1)',\n color5: 'hsla(31, 100%, 94%, 1)',\n stepsNumber: 8,\n },\n};\n\nconst bloodCellPreset: SteppedSimplexNoisePreset = {\n name: 'Blood cell',\n params: {\n scale: 1.2,\n speed: 0.22,\n seed: 0,\n color1: 'hsla(302, 43%, 13%, 1)',\n color2: 'hsla(325, 93%, 17%, 1)',\n color3: 'hsla(338, 80%, 25%, 1)',\n color4: 'hsla(338, 80%, 25%, 1)',\n color5: 'hsla(2, 85%, 72%, 1)',\n stepsNumber: 29,\n },\n};\n\nconst firstContactPreset: SteppedSimplexNoisePreset = {\n name: 'First contact',\n params: {\n scale: 1.2,\n speed: -0.1,\n seed: 0,\n color1: 'hsla(300, 43%, 82%, 1)',\n color2: 'hsla(266, 70%, 9%, 1)',\n color3: 'hsla(289, 36%, 26%, 1)',\n color4: 'hsla(0, 41%, 78%, 1)',\n color5: 'hsla(0, 100%, 96%, 1)',\n stepsNumber: 40,\n },\n};\n\nexport const steppedSimplexNoisePresets: SteppedSimplexNoisePreset[] = [\n defaultPreset,\n magmaPreset,\n bloodCellPreset,\n firstContactPreset,\n];\n\nexport const SteppedSimplexNoise = (props: SteppedSimplexNoiseProps): JSX.Element => {\n const uniforms: SteppedSimplexNoiseUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color3),\n u_color4: getShaderColorFromString(props.color4, defaultPreset.params.color4),\n u_color5: getShaderColorFromString(props.color5, defaultPreset.params.color5),\n u_steps_number: props.stepsNumber ?? defaultPreset.params.stepsNumber,\n };\n }, [props.scale, props.color1, props.color2, props.color3, props.color4, props.color5, props.stepsNumber]);\n\n return <ShaderMount {...props} fragmentShader={steppedSimplexNoiseFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, metaballsFragmentShader, type MetaballsUniforms } from '@paper-design/shaders';\n\nexport type MetaballsParams = {\n scale?: number;\n color1?: string;\n color2?: string;\n color3?: string;\n ballSize?: number;\n visibilityRange?: number;\n} & GlobalParams;\n\nexport type MetaballsProps = Omit<ShaderMountProps, 'fragmentShader'> & MetaballsParams;\n\ntype MetaballsPreset = { name: string; params: Required<MetaballsParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: MetaballsPreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 0.6,\n seed: 0,\n color1: 'hsla(350, 90%, 55%, 1)',\n color2: 'hsla(350, 80%, 60%, 1)',\n color3: 'hsla(20, 85%, 70%, 1)',\n ballSize: 1,\n visibilityRange: 0.4,\n },\n} as const;\n\nexport const metaballsPresets: MetaballsPreset[] = [defaultPreset];\n\nexport const Metaballs = (props: MetaballsProps): JSX.Element => {\n const uniforms: MetaballsUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color3),\n u_ballSize: props.ballSize ?? defaultPreset.params.ballSize,\n u_visibilityRange: props.visibilityRange ?? defaultPreset.params.visibilityRange,\n };\n }, [props.scale, props.color1, props.color2, props.color3, props.ballSize, props.visibilityRange]);\n\n return <ShaderMount {...props} fragmentShader={metaballsFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, wavesFragmentShader, type WavesUniforms } from '@paper-design/shaders';\n\nexport type WavesParams = {\n scale?: number;\n rotation?: number;\n color1?: string;\n color2?: string;\n shape?: number;\n frequency?: number;\n amplitude?: number;\n spacing?: number;\n dutyCycle?: number;\n softness?: number;\n};\n\nexport type WavesProps = Omit<ShaderMountProps, 'fragmentShader'> & WavesParams;\n\ntype WavesPreset = { name: string; params: Required<WavesParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: WavesPreset = {\n name: 'Default',\n params: {\n scale: 1,\n rotation: 0,\n color1: 'hsla(48, 100%, 74%, 1)',\n color2: 'hsla(204, 47%, 45%, 1)',\n shape: 1,\n frequency: 0.5,\n amplitude: 0.5,\n spacing: 0.75,\n dutyCycle: 0.2,\n softness: 0,\n },\n} as const;\n\nexport const spikesPreset: WavesPreset = {\n name: 'Spikes',\n params: {\n scale: 2.3,\n rotation: 0,\n color1: 'hsla(65, 100%, 95%, 1)',\n color2: 'hsla(290, 52%, 15%, 1)',\n shape: 0,\n frequency: 0.5,\n amplitude: 0.9,\n spacing: 0.37,\n dutyCycle: 0.93,\n softness: 0.15,\n },\n} as const;\n\nexport const groovyPreset: WavesPreset = {\n name: 'Groovy',\n params: {\n scale: 0.5,\n rotation: 1,\n color1: 'hsla(60, 100%, 97%, 1)',\n color2: 'hsla(20, 100%, 71%, 1)',\n shape: 2.37,\n frequency: 0.2,\n amplitude: 0.67,\n spacing: 1.17,\n dutyCycle: 0.57,\n softness: 0,\n },\n} as const;\n\nexport const tangledUpPreset: WavesPreset = {\n name: 'Tangled up',\n params: {\n scale: 3.04,\n rotation: 1,\n color1: 'hsla(198.7, 66.7%, 14.1%, 1)',\n color2: 'hsla(85.5, 35.7%, 78%, 1)',\n shape: 3,\n frequency: 0.44,\n amplitude: 0.57,\n spacing: 1.05,\n dutyCycle: 0.97,\n softness: 0,\n },\n} as const;\n\nexport const zigZagPreset: WavesPreset = {\n name: 'Zig zag',\n params: {\n scale: 2.7,\n rotation: 1,\n color1: 'hsla(0, 0%, 0%, 1)',\n color2: 'hsla(0, 0%, 90%, 1)',\n shape: 0,\n frequency: 0.6,\n amplitude: 0.8,\n spacing: 0.5,\n dutyCycle: 1,\n softness: 0.5,\n },\n} as const;\n\nexport const waveRidePreset: WavesPreset = {\n name: 'Ride the wave',\n params: {\n scale: 0.84,\n rotation: 0,\n color1: 'hsla(65, 100%, 95%, 1)',\n color2: 'hsla(0, 0%, 12%, 1)',\n shape: 2.23,\n frequency: 0.1,\n amplitude: 0.6,\n spacing: 0.41,\n dutyCycle: 0.99,\n softness: 0,\n },\n} as const;\n\nexport const wavesPresets: WavesPreset[] = [\n defaultPreset,\n spikesPreset,\n groovyPreset,\n tangledUpPreset,\n zigZagPreset,\n waveRidePreset,\n];\n\nexport const Waves = (props: WavesProps): JSX.Element => {\n const uniforms: WavesUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_rotation: props.rotation ?? defaultPreset.params.rotation,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_shape: props.shape ?? defaultPreset.params.shape,\n u_frequency: props.frequency ?? defaultPreset.params.frequency,\n u_amplitude: props.amplitude ?? defaultPreset.params.amplitude,\n u_spacing: props.spacing ?? defaultPreset.params.spacing,\n u_dutyCycle: props.dutyCycle ?? defaultPreset.params.dutyCycle,\n u_softness: props.softness ?? defaultPreset.params.softness,\n };\n }, [\n props.scale,\n props.rotation,\n props.color1,\n props.color2,\n props.shape,\n props.frequency,\n props.amplitude,\n props.spacing,\n props.dutyCycle,\n props.softness,\n ]);\n\n return <ShaderMount {...props} fragmentShader={wavesFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, perlinNoiseFragmentShader, type PerlinNoiseUniforms } from '@paper-design/shaders';\n\nexport type PerlinNoiseParams = {\n scale?: number;\n color1?: string;\n color2?: string;\n proportion?: number;\n softness?: number;\n octaveCount?: number;\n persistence?: number;\n lacunarity?: number;\n} & GlobalParams;\n\nexport type PerlinNoiseProps = Omit<ShaderMountProps, 'fragmentShader'> & PerlinNoiseParams;\n\ntype PerlinNoisePreset = { name: string; params: Required<PerlinNoiseParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: PerlinNoisePreset = {\n name: 'Default',\n params: {\n scale: 1,\n speed: 0.5,\n seed: 0,\n color1: 'hsla(0, 0%, 15%, 1)',\n color2: 'hsla(203, 100%, 87%, 1)',\n proportion: 0.34,\n softness: 0.1,\n octaveCount: 2,\n persistence: 1,\n lacunarity: 1.5,\n },\n};\n\nexport const nintendoWaterPreset: PerlinNoisePreset = {\n name: 'Nintendo Water',\n params: {\n scale: 0.2,\n speed: 0.4,\n seed: 0,\n color1: 'hsla(220, 66%, 50%, 1)',\n color2: 'hsla(200, 66%, 90%, 1)',\n proportion: 0.42,\n softness: 0,\n octaveCount: 2,\n persistence: 0.55,\n lacunarity: 1.8,\n },\n};\n\nexport const colonyPreset: PerlinNoisePreset = {\n name: 'Colony',\n params: {\n scale: 0.15,\n speed: 0,\n seed: 0,\n color1: 'hsla(56, 86%, 81%, 1)',\n color2: 'hsla(230, 80%, 20%, 1)',\n octaveCount: 6,\n persistence: 1,\n lacunarity: 2.55,\n proportion: 0.65,\n softness: 0.35,\n },\n};\n\nexport const phosphenesPreset: PerlinNoisePreset = {\n name: 'Phosphenes',\n params: {\n scale: 0.03,\n speed: 0.15,\n seed: 0,\n color1: 'hsla(350, 80%, 70%, 1)',\n color2: 'hsla(150, 50%, 60%, 1)',\n proportion: 0.45,\n softness: 0.45,\n octaveCount: 6,\n persistence: 0.3,\n lacunarity: 3,\n },\n} as const;\n\nexport const mossPreset: PerlinNoisePreset = {\n name: 'Moss',\n params: {\n scale: 0.15,\n speed: 0.02,\n seed: 0,\n color1: 'hsla(137, 100%, 51%, 1)',\n color2: 'hsla(0, 0%, 15%, 1)',\n proportion: 0.65,\n softness: 0.35,\n octaveCount: 6,\n persistence: 1,\n lacunarity: 2.55,\n },\n} as const;\n\nexport const wormsPreset: PerlinNoisePreset = {\n name: 'Worms',\n params: {\n scale: 2,\n speed: 0,\n seed: 0,\n color1: 'hsla(0, 100%, 100%, 1)',\n color2: 'hsla(0, 0%, 35%, 1)',\n proportion: 0.5,\n softness: 0,\n octaveCount: 1,\n persistence: 1,\n lacunarity: 1.5,\n },\n} as const;\n\nexport const perlinNoisePresets: PerlinNoisePreset[] = [\n defaultPreset,\n nintendoWaterPreset,\n colonyPreset,\n phosphenesPreset,\n mossPreset,\n wormsPreset,\n];\n\nexport const PerlinNoise = (props: PerlinNoiseProps): JSX.Element => {\n const uniforms: PerlinNoiseUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_proportion: props.proportion ?? defaultPreset.params.proportion,\n u_softness: props.softness ?? defaultPreset.params.softness,\n u_octaveCount: props.octaveCount ?? defaultPreset.params.octaveCount,\n u_persistence: props.persistence ?? defaultPreset.params.persistence,\n u_lacunarity: props.lacunarity ?? defaultPreset.params.lacunarity,\n };\n }, [\n props.scale,\n props.color1,\n props.color2,\n props.proportion,\n props.softness,\n props.octaveCount,\n props.persistence,\n props.lacunarity,\n ]);\n\n return <ShaderMount {...props} fragmentShader={perlinNoiseFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, voronoiFragmentShader, type VoronoiUniforms } from '@paper-design/shaders';\n\nexport type VoronoiParams = {\n scale?: number;\n colorCell1?: string;\n colorCell2?: string;\n colorCell3?: string;\n colorMid?: string;\n colorEdges?: string;\n colorGradient?: number;\n distance?: number;\n edgesSize?: number;\n edgesSoftness?: number;\n middleSize?: number;\n middleSoftness?: number;\n} & GlobalParams;\n\nexport type VoronoiProps = Omit<ShaderMountProps, 'fragmentShader'> & VoronoiParams;\n\ntype VoronoiPreset = { name: string; params: Required<VoronoiParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: VoronoiPreset = {\n name: 'Default',\n params: {\n scale: 1.5,\n speed: 0.5,\n seed: 0,\n colorCell1: 'hsla(15, 80%, 50%, 1)',\n colorCell2: 'hsla(180, 80%, 50%, 1)',\n colorCell3: 'hsla(200, 80%, 50%, 1)',\n colorEdges: 'hsla(30, 90%, 10%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorGradient: 0.5,\n distance: 0.25,\n edgesSize: 0.15,\n edgesSoftness: 0.01,\n middleSize: 0,\n middleSoftness: 0,\n },\n} as const;\n\nexport const classicPreset: VoronoiPreset = {\n name: 'Classic',\n params: {\n scale: 3,\n speed: 0.8,\n seed: 0,\n colorCell1: 'hsla(0, 100%, 100%, 1)',\n colorCell2: 'hsla(0, 0%, 100%, 1)',\n colorCell3: 'hsla(0, 100%, 0%, 1)',\n colorEdges: 'hsla(0, 0%, 0%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorGradient: 1,\n distance: 0.45,\n edgesSize: 0.02,\n edgesSoftness: 0.07,\n middleSize: 0,\n middleSoftness: 0,\n },\n} as const;\n\nexport const giraffePreset: VoronoiPreset = {\n name: 'Giraffe',\n params: {\n scale: 1,\n speed: 0.6,\n seed: 0,\n colorCell1: 'hsla(32, 100%, 18%, 1)',\n colorCell2: 'hsla(42, 93%, 35%, 1)',\n colorCell3: 'hsla(32, 100%, 18%, 1)',\n colorEdges: 'hsla(45, 100%, 96%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorGradient: 1,\n distance: 0.25,\n edgesSize: 0.2,\n edgesSoftness: 0.01,\n middleSize: 0,\n middleSoftness: 0,\n },\n} as const;\n\nexport const eyesPreset: VoronoiPreset = {\n name: 'Eyes',\n params: {\n scale: 1.6,\n speed: 0.6,\n seed: 0,\n colorCell1: 'hsla(79, 84%, 60%, 1)',\n colorCell2: 'hsla(207, 53%, 41%, 1)',\n colorCell3: 'hsla(207, 80%, 65%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorEdges: 'hsla(0, 100%, 100%, 1)',\n colorGradient: 1,\n distance: 0.25,\n edgesSize: 0.62,\n edgesSoftness: 0.01,\n middleSize: 0.1,\n middleSoftness: 0,\n },\n} as const;\n\nexport const bubblesPreset: VoronoiPreset = {\n name: 'Bubbles',\n params: {\n scale: 2,\n speed: 0.5,\n seed: 0,\n colorCell1: 'hsla(0, 100%, 50%, 1)',\n colorCell2: 'hsla(169, 100%, 66%, 1)',\n colorCell3: 'hsla(50, 100%, 66%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorEdges: 'hsla(0, 0%, 0%, 1)',\n colorGradient: 1,\n distance: 0.5,\n edgesSize: 0.81,\n edgesSoftness: 0.0,\n middleSize: 0,\n middleSoftness: 0,\n },\n} as const;\n\nexport const cellsPreset: VoronoiPreset = {\n name: 'Cells',\n params: {\n scale: 2,\n speed: 1,\n seed: 0,\n colorCell1: 'hsla(0, 0%, 100%, 1)',\n colorCell2: 'hsla(0, 0%, 100%, 1)',\n colorCell3: 'hsla(0, 0%, 100%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorEdges: 'hsla(200, 50%, 15%, 1)',\n colorGradient: 1,\n distance: 0.38,\n edgesSize: 0.1,\n edgesSoftness: 0.02,\n middleSize: 0,\n middleSoftness: 0,\n },\n} as const;\n\nexport const glowPreset: VoronoiPreset = {\n name: 'Glow',\n params: {\n scale: 1.2,\n speed: 0.8,\n seed: 0,\n colorCell1: 'hsla(40, 100%, 50%, 1)',\n colorCell2: 'hsla(311, 100%, 59%, 1)',\n colorCell3: 'hsla(180, 100%, 65%, 1)',\n colorEdges: 'hsla(0, 100%, 0%, 1)',\n colorMid: 'hsla(0, 0%, 100%, 1)',\n colorGradient: 1,\n distance: 0.25,\n edgesSize: 0.15,\n edgesSoftness: 0.01,\n middleSize: 0.7,\n middleSoftness: 1,\n },\n} as const;\n\nexport const tilesPreset: VoronoiPreset = {\n name: 'Tiles',\n params: {\n scale: 1.3,\n speed: 1,\n seed: 0,\n colorCell1: 'hsla(80, 50%, 50%, 1)',\n colorCell2: 'hsla(0, 50%, 100%, 1)',\n colorCell3: 'hsla(200, 50%, 50%, 1)',\n colorMid: 'hsla(0, 0%, 0%, 1)',\n colorEdges: 'hsla(200, 50%, 10%, 1)',\n colorGradient: 0,\n distance: 0.05,\n edgesSize: 0.25,\n edgesSoftness: 0.02,\n middleSize: 0,\n middleSoftness: 0,\n },\n} as const;\n\nexport const voronoiPresets: VoronoiPreset[] = [\n defaultPreset,\n classicPreset,\n giraffePreset,\n eyesPreset,\n bubblesPreset,\n cellsPreset,\n glowPreset,\n tilesPreset,\n];\n\nexport const Voronoi = (props: VoronoiProps): JSX.Element => {\n const uniforms: VoronoiUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_colorCell1: getShaderColorFromString(props.colorCell1, defaultPreset.params.colorCell1),\n u_colorCell2: getShaderColorFromString(props.colorCell2, defaultPreset.params.colorCell2),\n u_colorCell3: getShaderColorFromString(props.colorCell3, defaultPreset.params.colorCell3),\n u_colorMid: getShaderColorFromString(props.colorMid, defaultPreset.params.colorMid),\n u_colorEdges: getShaderColorFromString(props.colorEdges, defaultPreset.params.colorEdges),\n u_colorGradient: props.colorGradient ?? defaultPreset.params.colorGradient,\n u_distance: props.distance ?? defaultPreset.params.distance,\n u_edgesSize: props.edgesSize ?? defaultPreset.params.edgesSize,\n u_edgesSoftness: props.edgesSoftness ?? defaultPreset.params.edgesSoftness,\n u_middleSize: props.middleSize ?? defaultPreset.params.middleSize,\n u_middleSoftness: props.middleSoftness ?? defaultPreset.params.middleSoftness,\n };\n }, [\n props.scale,\n props.colorCell1,\n props.colorCell3,\n props.colorCell2,\n props.colorMid,\n props.colorEdges,\n props.colorGradient,\n props.distance,\n props.edgesSize,\n props.edgesSoftness,\n props.middleSize,\n props.middleSoftness,\n ]);\n\n return <ShaderMount {...props} fragmentShader={voronoiFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport {\n getShaderColorFromString,\n warpFragmentShader,\n type WarpUniforms,\n type PatternShape,\n PatternShapes,\n} from '@paper-design/shaders';\n\nexport type WarpParams = {\n scale?: number;\n rotation?: number;\n color1?: string;\n color2?: string;\n color3?: string;\n proportion?: number;\n softness?: number;\n distortion?: number;\n swirl?: number;\n swirlIterations?: number;\n shapeScale?: number;\n shape?: PatternShape;\n} & GlobalParams;\n\nexport type WarpProps = Omit<ShaderMountProps, 'fragmentShader'> & WarpParams;\n\ntype WarpPreset = { name: string; params: Required<WarpParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: WarpPreset = {\n name: 'Default',\n params: {\n scale: 1,\n rotation: 0,\n speed: 0.1,\n seed: 0,\n color1: 'hsla(0, 0%, 15%, 1)',\n color2: 'hsla(203, 80%, 70%, 1)',\n color3: 'hsla(0, 0%, 100%, 1)',\n proportion: 0.35,\n softness: 1,\n distortion: 0.25,\n swirl: 0.8,\n swirlIterations: 10,\n shapeScale: 0.1,\n shape: PatternShapes.Checks,\n },\n};\n\nexport const presetCauldron: WarpPreset = {\n name: 'Cauldron Pot',\n params: {\n scale: 1.1,\n rotation: 1.62,\n speed: 1,\n seed: 0,\n color1: 'hsla(100, 51%, 75%, 1)',\n color2: 'hsla(220, 39%, 32%, 1)',\n color3: 'hsla(129.2, 41.9%, 6.1%, 1)',\n proportion: 0.64,\n softness: 0.95,\n distortion: 0.2,\n swirl: 0.86,\n swirlIterations: 7,\n shapeScale: 0,\n shape: PatternShapes.Edge,\n },\n};\n\nexport const presetSilk: WarpPreset = {\n name: 'Silk',\n params: {\n scale: 0.26,\n rotation: 0,\n speed: 0.5,\n seed: 0,\n color1: 'hsla(0, 9%, 7%, 1)',\n color2: 'hsla(8, 13%, 34%, 1)',\n color3: 'hsla(5, 8%, 71%, 1)',\n proportion: 0,\n softness: 1,\n distortion: 0.3,\n swirl: 0.6,\n swirlIterations: 11,\n shapeScale: 0.05,\n shape: PatternShapes.Stripes,\n },\n};\n\nexport const presetPassion: WarpPreset = {\n name: 'Passion',\n params: {\n scale: 0.25,\n rotation: 1.35,\n speed: 0.3,\n seed: 0,\n color1: 'hsla(0, 44.7%, 14.9%, 1)',\n color2: 'hsla(353.4, 34%, 42.2%, 1)',\n color3: 'hsla(29, 100%, 76.1%, 1)',\n proportion: 0.5,\n softness: 1,\n distortion: 0.09,\n swirl: 0.9,\n swirlIterations: 6,\n shapeScale: 0.25,\n shape: PatternShapes.Checks,\n },\n};\n\nexport const presetPhantom: WarpPreset = {\n name: 'Phantom',\n params: {\n scale: 0.68,\n rotation: 1.8,\n speed: 1.25,\n seed: 0,\n color1: 'hsla(242.2, 44.3%, 12%, 1)',\n color2: 'hsla(236.1, 80.4%, 70%, 1)',\n color3: 'hsla(0, 0%, 100%, 1)',\n proportion: 0.45,\n softness: 1,\n distortion: 0.16,\n swirl: 0.3,\n swirlIterations: 7,\n shapeScale: 0.1,\n shape: PatternShapes.Checks,\n },\n};\n\nexport const presetAbyss: WarpPreset = {\n name: 'The Abyss',\n params: {\n scale: 0.1,\n rotation: 2,\n speed: 0.06,\n seed: 0,\n color1: 'hsla(242.2, 44.3%, 12%, 1)',\n color2: 'hsla(236.1, 80.4%, 70%, 1)',\n color3: 'hsla(0, 0%, 100%, 1)',\n proportion: 0,\n softness: 1,\n distortion: 0.09,\n swirl: 0.48,\n swirlIterations: 4,\n shapeScale: 0.1,\n shape: PatternShapes.Edge,\n },\n};\n\nexport const presetInk: WarpPreset = {\n name: 'Live Ink',\n params: {\n scale: 0.7,\n rotation: 1.5,\n speed: 0.25,\n seed: 0,\n color1: 'hsla(210, 11.1%, 7.1%, 1)',\n color2: 'hsla(165, 9%, 65.1%, 1)',\n color3: 'hsla(84, 100%, 97.1%, 1)',\n proportion: 0.35,\n softness: 0,\n distortion: 0.25,\n swirl: 0.8,\n swirlIterations: 10,\n shapeScale: 0.26,\n shape: PatternShapes.Checks,\n },\n};\n\nexport const presetIceberg: WarpPreset = {\n name: 'Iceberg',\n params: {\n scale: 1.1,\n rotation: 2,\n speed: 0.05,\n seed: 0,\n color1: 'hsla(0, 0%, 100%, 1)',\n color2: 'hsla(220, 38.7%, 32%, 1)',\n color3: 'hsla(129.2, 41.9%, 6.1%, 1)',\n proportion: 0.3,\n softness: 1,\n distortion: 0.2,\n swirl: 0.86,\n swirlIterations: 7,\n shapeScale: 0,\n shape: PatternShapes.Checks,\n },\n};\n\nexport const presetNectar: WarpPreset = {\n name: 'Nectar',\n params: {\n scale: 0.24,\n rotation: 0,\n speed: 0.42,\n seed: 0,\n color1: 'hsla(37.5, 22.2%, 7.1%, 1)',\n color2: 'hsla(38.5, 59.1%, 63.1%, 1)',\n color3: 'hsla(37.6, 30%, 95.2%, 1)',\n proportion: 0.24,\n softness: 1,\n distortion: 0.21,\n swirl: 0.57,\n swirlIterations: 10,\n shapeScale: 0.32,\n shape: PatternShapes.Edge,\n },\n};\n\nexport const presetFilteredLight: WarpPreset = {\n name: 'Filtered Light',\n params: {\n scale: 2,\n rotation: 0.44,\n speed: 0.32,\n seed: 0,\n color1: 'hsla(60.2, 7.8%, 8.3%, 1)',\n color2: 'hsla(64.4, 27.8%, 81%, 1)',\n color3: 'hsla(60, 100%, 93.9%, 1)',\n proportion: 0.25,\n softness: 1,\n distortion: 0.06,\n swirl: 0,\n swirlIterations: 0,\n shapeScale: 0,\n shape: PatternShapes.Stripes,\n },\n};\n\nexport const presetKelp: WarpPreset = {\n name: 'Kelp',\n params: {\n scale: 0.38,\n rotation: 0.6,\n speed: 2,\n seed: 0,\n color1: 'hsla(79.3, 100%, 78%, 1)',\n color2: 'hsla(112, 10.5%, 28%, 1)',\n color3: 'hsla(203.3, 50%, 7.1%, 1)',\n proportion: 1,\n softness: 0,\n distortion: 0,\n swirl: 0.15,\n swirlIterations: 0,\n shapeScale: 0.74,\n shape: PatternShapes.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 = (props: WarpProps): JSX.Element => {\n const uniforms: WarpUniforms = useMemo(() => {\n return {\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_rotation: props.rotation ?? defaultPreset.params.rotation,\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color2),\n u_proportion: props.proportion ?? defaultPreset.params.proportion,\n u_softness: props.softness ?? defaultPreset.params.softness,\n u_distortion: props.distortion ?? defaultPreset.params.distortion,\n u_swirl: props.swirl ?? defaultPreset.params.swirl,\n u_swirlIterations: props.swirlIterations ?? defaultPreset.params.swirlIterations,\n u_shapeScale: props.shapeScale ?? defaultPreset.params.shapeScale,\n u_shape: props.shape ?? defaultPreset.params.shape,\n };\n }, [\n props.scale,\n props.rotation,\n props.color1,\n props.color2,\n props.color3,\n props.proportion,\n props.softness,\n props.distortion,\n props.swirl,\n props.swirlIterations,\n props.shapeScale,\n props.shape,\n ]);\n\n return <ShaderMount {...props} fragmentShader={warpFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, godRaysFragmentShader, type GodRaysUniforms } from '@paper-design/shaders';\n\nexport type GodRaysParams = {\n colorBack?: string;\n color1?: string;\n color2?: string;\n color3?: string;\n offsetX?: number;\n offsetY?: number;\n frequency?: number;\n spotty?: number;\n midIntensity?: number;\n midSize?: number;\n density?: number;\n blending?: number;\n} & GlobalParams;\n\nexport type GodRaysProps = Omit<ShaderMountProps, 'fragmentShader'> & GodRaysParams;\n\ntype GodRaysPreset = { name: string; params: Required<GodRaysParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highmidIntensity bug)\n\nexport const defaultPreset: GodRaysPreset = {\n name: 'Default',\n params: {\n colorBack: 'hsla(215, 100%, 11%, 1)',\n color1: 'hsla(45, 100%, 70%, 1)',\n color2: 'hsla(10, 100%, 80%, 1)',\n color3: 'hsla(178, 100%, 83%, 1)',\n offsetX: -0.6,\n offsetY: -0.6,\n frequency: 6,\n spotty: 0.28,\n midIntensity: 0.97,\n midSize: 2,\n density: 0.3,\n blending: 0,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const auroraPreset: GodRaysPreset = {\n name: 'Aurora',\n params: {\n colorBack: 'hsla(0, 0%, 25%, 1)',\n color1: 'hsla(239, 100%, 70%, 1)',\n color2: 'hsla(150, 100%, 70%, 1)',\n color3: 'hsla(200, 100%, 70%, 1)',\n offsetX: 0,\n offsetY: 1,\n frequency: 2.4,\n spotty: 0.9,\n midIntensity: 0.8,\n midSize: 2.1,\n density: 0.5,\n blending: 1,\n speed: 0.5,\n seed: 0,\n },\n} as const;\n\nexport const warpPreset: GodRaysPreset = {\n name: 'Warp',\n params: {\n colorBack: 'hsla(0, 0%, 0%, 1)',\n color1: 'hsla(317, 100%, 50%, 1)',\n color2: 'hsla(25, 100%, 50%, 1)',\n color3: 'hsla(0, 0%, 100%, 1)',\n offsetX: 0,\n offsetY: 0,\n frequency: 1.2,\n spotty: 0.15,\n midIntensity: 0,\n midSize: 0,\n density: 0.79,\n blending: 0.4,\n speed: 2,\n seed: 0,\n },\n} as const;\n\nexport const linearPreset: GodRaysPreset = {\n name: 'Linear',\n params: {\n colorBack: 'hsla(0, 0%, 0%, 1)',\n color1: 'hsl(0 0% 100% / 12%)',\n color2: 'hsl(0 0% 100% / 24%)',\n color3: 'hsl(0 0% 100% / 16%)',\n offsetX: 0.2,\n offsetY: -0.7,\n frequency: 1.2,\n spotty: 0.25,\n midSize: 1.1,\n midIntensity: 0.75,\n density: 0.79,\n blending: 1,\n speed: 0.5,\n seed: 0,\n },\n} as const;\n\nexport const etherPreset: GodRaysPreset = {\n name: 'Ether',\n params: {\n colorBack: 'hsl(226.7 50% 7.1% / 100%)',\n color1: 'hsl(215 100% 53.9% / 65.1%)',\n color2: 'hsl(214.4 85.9% 86.1% / 74.9%)',\n color3: 'hsl(225 31.4% 20% / 100%)',\n offsetX: -0.6,\n offsetY: 0,\n frequency: 0.3,\n spotty: 0.77,\n midSize: 1.1,\n midIntensity: 0.5,\n density: 0.6,\n blending: 0.6,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const godRaysPresets: GodRaysPreset[] = [defaultPreset, auroraPreset, warpPreset, linearPreset, etherPreset];\n\nexport const GodRays = (props: GodRaysProps): JSX.Element => {\n const uniforms: GodRaysUniforms = useMemo(() => {\n return {\n u_colorBack: getShaderColorFromString(props.colorBack, defaultPreset.params.colorBack),\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_color3: getShaderColorFromString(props.color3, defaultPreset.params.color3),\n u_offsetX: props.offsetX ?? defaultPreset.params.offsetX,\n u_offsetY: props.offsetY ?? defaultPreset.params.offsetY,\n u_frequency: props.frequency ?? defaultPreset.params.frequency,\n u_spotty: props.spotty ?? defaultPreset.params.spotty,\n u_midIntensity: props.midIntensity ?? defaultPreset.params.midIntensity,\n u_midSize: props.midSize ?? defaultPreset.params.midSize,\n u_density: props.density ?? defaultPreset.params.density,\n u_blending: props.blending ?? defaultPreset.params.blending,\n };\n }, [\n props.colorBack,\n props.color1,\n props.color2,\n props.color3,\n props.offsetX,\n props.offsetY,\n props.frequency,\n props.spotty,\n props.midIntensity,\n props.midSize,\n props.density,\n props.blending,\n ]);\n\n return <ShaderMount {...props} fragmentShader={godRaysFragmentShader} uniforms={uniforms} />;\n};\n", "import { useMemo } from 'react';\nimport { ShaderMount, type GlobalParams, type ShaderMountProps } from '../shader-mount';\nimport { getShaderColorFromString, spiralFragmentShader, type SpiralUniforms } from '@paper-design/shaders';\n\nexport type SpiralParams = {\n color1?: string;\n color2?: string;\n scale?: number;\n offsetX?: number;\n offsetY?: number;\n spiralDensity?: number;\n spiralDistortion?: number;\n strokeWidth?: number;\n strokeTaper?: number;\n strokeCap?: number;\n noiseFreq?: number;\n noisePower?: number;\n softness?: number;\n} & GlobalParams;\n\nexport type SpiralProps = Omit<ShaderMountProps, 'fragmentShader'> & SpiralParams;\n\ntype SpiralPreset = { name: string; params: Required<SpiralParams> };\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highmidIntensity bug)\n\nexport const defaultPreset: SpiralPreset = {\n name: 'Default',\n params: {\n color1: 'hsla(0, 0%, 90%, 1)',\n color2: 'hsla(0, 0%, 25%, 1)',\n scale: 1,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0,\n spiralDistortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0,\n noiseFreq: 0,\n noisePower: 0,\n softness: 0.01,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const noisyPreset: SpiralPreset = {\n name: 'Noisy',\n params: {\n color1: 'hsla(87, 77%, 53%, 1)',\n color2: 'hsla(109, 70%, 31%, 1)',\n scale: 1.3,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0.5,\n spiralDistortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0.5,\n noiseFreq: 0.1,\n noisePower: 1,\n softness: 0,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const dropletPreset: SpiralPreset = {\n name: 'Droplet',\n params: {\n color1: 'hsla(320, 50%, 50%, 1)',\n color2: 'hsla(190, 50%, 95%, 1)',\n scale: 0.65,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0,\n spiralDistortion: 0,\n strokeWidth: 0.05,\n strokeTaper: 0,\n strokeCap: 1,\n noiseFreq: 0,\n noisePower: 0,\n softness: 0,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const sandPreset: SpiralPreset = {\n name: 'Sand',\n params: {\n color1: 'hsla(45, 25%, 50%, 1)',\n color2: 'hsla(0, 0%, 87%, 1)',\n scale: 3,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0,\n spiralDistortion: 0,\n strokeWidth: 0.15,\n strokeTaper: 0,\n strokeCap: 0,\n noiseFreq: 30,\n noisePower: 1,\n softness: 0.2,\n speed: 0,\n seed: 0,\n },\n} as const;\n\nexport const swirlPreset: SpiralPreset = {\n name: 'Swirl',\n params: {\n color1: 'hsla(160, 50%, 80%, 1)',\n color2: 'hsla(220, 50%, 20%, 1)',\n scale: 4,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0.8,\n spiralDistortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0,\n noiseFreq: 0,\n noisePower: 0,\n softness: 0.5,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const hookPreset: SpiralPreset = {\n name: 'Hook',\n params: {\n color1: 'hsla(0, 0%, 0%, 1)',\n color2: 'hsla(200, 50%, 70%, 1)',\n scale: 0.8,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0,\n spiralDistortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0.5,\n strokeCap: 0,\n noiseFreq: 0,\n noisePower: 0,\n softness: 0.02,\n speed: 3,\n seed: 0,\n },\n} as const;\n\nexport const vinylPreset: SpiralPreset = {\n name: 'Vinyl',\n params: {\n color1: 'hsla(0, 0%, 15%, 1)',\n color2: 'hsla(320, 5%, 75%, 1)',\n scale: 1,\n offsetX: 0,\n offsetY: 0,\n spiralDensity: 0,\n spiralDistortion: 0.3,\n strokeWidth: 0.95,\n strokeTaper: 0,\n strokeCap: 1,\n noiseFreq: 0,\n noisePower: 0,\n softness: 0.11,\n speed: 1,\n seed: 0,\n },\n} as const;\n\nexport const spiralPresets: SpiralPreset[] = [\n defaultPreset,\n noisyPreset,\n dropletPreset,\n swirlPreset,\n sandPreset,\n hookPreset,\n vinylPreset,\n];\n\nexport const Spiral = (props: SpiralProps): JSX.Element => {\n const uniforms: SpiralUniforms = useMemo(() => {\n return {\n u_color1: getShaderColorFromString(props.color1, defaultPreset.params.color1),\n u_color2: getShaderColorFromString(props.color2, defaultPreset.params.color2),\n u_scale: props.scale ?? defaultPreset.params.scale,\n u_offsetX: props.offsetX ?? defaultPreset.params.offsetX,\n u_offsetY: props.offsetY ?? defaultPreset.params.offsetY,\n u_spiralDensity: props.spiralDensity ?? defaultPreset.params.spiralDensity,\n u_spiralDistortion: props.spiralDistortion ?? defaultPreset.params.spiralDistortion,\n u_strokeWidth: props.strokeWidth ?? defaultPreset.params.strokeWidth,\n u_strokeTaper: props.strokeTaper ?? defaultPreset.params.strokeTaper,\n u_strokeCap: props.strokeCap ?? defaultPreset.params.strokeCap,\n u_noiseFreq: props.noiseFreq ?? defaultPreset.params.noiseFreq,\n u_noisePower: props.noisePower ?? defaultPreset.params.noisePower,\n u_softness: props.softness ?? defaultPreset.params.softness,\n };\n }, [\n props.color1,\n props.color2,\n props.scale,\n props.offsetX,\n props.offsetY,\n props.spiralDensity,\n props.spiralDistortion,\n props.strokeWidth,\n props.strokeTaper,\n props.strokeCap,\n props.noiseFreq,\n props.noisePower,\n props.softness,\n ]);\n\n return <ShaderMount {...props} fragmentShader={spiralFragmentShader} uniforms={uniforms} />;\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["useEffect", "useRef", "ShaderMountVanilla", "jsx", "processUniforms", "uniforms", "processedUniforms", "imageLoadPromises", "isValidUrl", "url", "isExternalUrl", "key", "value", "imagePromise", "resolve", "reject", "img", "ShaderMount", "ref", "fragmentShader", "style", "webGlContextAttributes", "speed", "seed", "canvasRef", "shaderMountRef", "useMemo", "getShaderColorFromString", "grainCloudsFragmentShader", "jsx", "defaultPreset", "skyPreset", "grainCloudsPresets", "GrainClouds", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "meshGradientFragmentShader", "jsx", "defaultPreset", "beachPreset", "fadedPreset", "meshGradientPresets", "MeshGradient", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "smokeRingFragmentShader", "jsx", "defaultPreset", "cloudPreset", "firePreset", "electricPreset", "poisonPreset", "smokeRingPresets", "SmokeRing", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "neuroNoiseFragmentShader", "jsx", "defaultPreset", "marblePreset", "neuroNoisePresets", "NeuroNoise", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "dotsOrbitFragmentShader", "jsx", "defaultPreset", "dotsOrbitPresets", "DotsOrbit", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "dotsGridFragmentShader", "getShaderColorFromString", "DotsGridShapes", "jsx", "defaultPreset", "macrodataPreset", "trianglesPreset", "bubblesPreset", "treeLinePreset", "diamondsPreset", "wallpaperPreset", "matrixPreset", "waveformPreset", "dotsGridPresets", "DotsGrid", "props", "uniforms", "useMemo", "ShaderMount", "DotsGridShapes", "useMemo", "getShaderColorFromString", "steppedSimplexNoiseFragmentShader", "jsx", "defaultPreset", "magmaPreset", "bloodCellPreset", "firstContactPreset", "steppedSimplexNoisePresets", "SteppedSimplexNoise", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "metaballsFragmentShader", "jsx", "defaultPreset", "metaballsPresets", "Metaballs", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "wavesFragmentShader", "jsx", "defaultPreset", "spikesPreset", "groovyPreset", "tangledUpPreset", "zigZagPreset", "waveRidePreset", "wavesPresets", "Waves", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "perlinNoiseFragmentShader", "jsx", "defaultPreset", "nintendoWaterPreset", "colonyPreset", "phosphenesPreset", "mossPreset", "wormsPreset", "perlinNoisePresets", "PerlinNoise", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "voronoiFragmentShader", "jsx", "defaultPreset", "classicPreset", "giraffePreset", "eyesPreset", "bubblesPreset", "cellsPreset", "glowPreset", "tilesPreset", "voronoiPresets", "Voronoi", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "warpFragmentShader", "PatternShapes", "jsx", "defaultPreset", "presetCauldron", "presetSilk", "presetPassion", "presetPhantom", "presetAbyss", "presetInk", "presetIceberg", "presetNectar", "presetFilteredLight", "presetKelp", "warpPresets", "Warp", "props", "uniforms", "useMemo", "ShaderMount", "PatternShapes", "useMemo", "getShaderColorFromString", "godRaysFragmentShader", "jsx", "defaultPreset", "auroraPreset", "warpPreset", "linearPreset", "etherPreset", "godRaysPresets", "GodRays", "props", "uniforms", "useMemo", "ShaderMount", "useMemo", "getShaderColorFromString", "spiralFragmentShader", "jsx", "defaultPreset", "noisyPreset", "dropletPreset", "sandPreset", "swirlPreset", "hookPreset", "vinylPreset", "spiralPresets", "Spiral", "props", "uniforms", "useMemo", "ShaderMount", "getShaderColorFromString"]
|
|
7
7
|
}
|
package/dist/shader-mount.d.ts
CHANGED
|
@@ -1,13 +1,22 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { type ShaderMountUniforms } from '@paper-design/shaders';
|
|
3
|
+
/** The React ShaderMount can also accept strings as uniform values, which will assumed to be URLs and loaded as images */
|
|
4
|
+
export type ShaderMountUniformsReact = {
|
|
5
|
+
[key: string]: ShaderMountUniforms[keyof ShaderMountUniforms] | string;
|
|
6
|
+
};
|
|
2
7
|
export interface ShaderMountProps {
|
|
3
8
|
ref?: React.RefObject<HTMLCanvasElement>;
|
|
4
9
|
fragmentShader: string;
|
|
5
10
|
style?: React.CSSProperties;
|
|
6
|
-
uniforms?:
|
|
11
|
+
uniforms?: ShaderMountUniformsReact;
|
|
7
12
|
webGlContextAttributes?: WebGLContextAttributes;
|
|
8
13
|
speed?: number;
|
|
9
14
|
seed?: number;
|
|
10
15
|
}
|
|
11
16
|
/** Params that every shader can set as part of their controls */
|
|
12
17
|
export type GlobalParams = Pick<ShaderMountProps, 'speed' | 'seed'>;
|
|
18
|
+
/**
|
|
19
|
+
* A React component that mounts a shader and updates its uniforms as the component's props change
|
|
20
|
+
* 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
|
|
21
|
+
*/
|
|
13
22
|
export declare const ShaderMount: React.FC<ShaderMountProps>;
|
|
@@ -18,6 +18,7 @@ type DotsGridPreset = {
|
|
|
18
18
|
params: Required<DotsGridParams>;
|
|
19
19
|
};
|
|
20
20
|
export declare const defaultPreset: DotsGridPreset;
|
|
21
|
+
export declare const macrodataPreset: DotsGridPreset;
|
|
21
22
|
export declare const dotsGridPresets: DotsGridPreset[];
|
|
22
23
|
export declare const DotsGrid: (props: DotsGridProps) => JSX.Element;
|
|
23
24
|
export {};
|
|
@@ -4,7 +4,7 @@ export type PerlinNoiseParams = {
|
|
|
4
4
|
color1?: string;
|
|
5
5
|
color2?: string;
|
|
6
6
|
proportion?: number;
|
|
7
|
-
|
|
7
|
+
softness?: number;
|
|
8
8
|
octaveCount?: number;
|
|
9
9
|
persistence?: number;
|
|
10
10
|
lacunarity?: number;
|
|
@@ -15,11 +15,11 @@ type PerlinNoisePreset = {
|
|
|
15
15
|
params: Required<PerlinNoiseParams>;
|
|
16
16
|
};
|
|
17
17
|
export declare const defaultPreset: PerlinNoisePreset;
|
|
18
|
-
export declare const
|
|
19
|
-
export declare const
|
|
20
|
-
export declare const
|
|
21
|
-
export declare const
|
|
22
|
-
export declare const
|
|
18
|
+
export declare const nintendoWaterPreset: PerlinNoisePreset;
|
|
19
|
+
export declare const colonyPreset: PerlinNoisePreset;
|
|
20
|
+
export declare const phosphenesPreset: PerlinNoisePreset;
|
|
21
|
+
export declare const mossPreset: PerlinNoisePreset;
|
|
22
|
+
export declare const wormsPreset: PerlinNoisePreset;
|
|
23
23
|
export declare const perlinNoisePresets: PerlinNoisePreset[];
|
|
24
24
|
export declare const PerlinNoise: (props: PerlinNoiseProps) => JSX.Element;
|
|
25
25
|
export {};
|
package/dist/shaders/spiral.d.ts
CHANGED
|
@@ -12,7 +12,7 @@ export type SpiralParams = {
|
|
|
12
12
|
strokeCap?: number;
|
|
13
13
|
noiseFreq?: number;
|
|
14
14
|
noisePower?: number;
|
|
15
|
-
|
|
15
|
+
softness?: number;
|
|
16
16
|
} & GlobalParams;
|
|
17
17
|
export type SpiralProps = Omit<ShaderMountProps, 'fragmentShader'> & SpiralParams;
|
|
18
18
|
type SpiralPreset = {
|
|
@@ -9,9 +9,9 @@ export type VoronoiParams = {
|
|
|
9
9
|
colorGradient?: number;
|
|
10
10
|
distance?: number;
|
|
11
11
|
edgesSize?: number;
|
|
12
|
-
|
|
12
|
+
edgesSoftness?: number;
|
|
13
13
|
middleSize?: number;
|
|
14
|
-
|
|
14
|
+
middleSoftness?: number;
|
|
15
15
|
} & GlobalParams;
|
|
16
16
|
export type VoronoiProps = Omit<ShaderMountProps, 'fragmentShader'> & VoronoiParams;
|
|
17
17
|
type VoronoiPreset = {
|
package/dist/shaders/waves.d.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@paper-design/shaders-react",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.23",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"publishConfig": {
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"type-check": "tsc --project tsconfig.json"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@paper-design/shaders": "0.0.
|
|
26
|
+
"@paper-design/shaders": "0.0.20",
|
|
27
27
|
"react": ">=18"
|
|
28
28
|
},
|
|
29
29
|
"devDependencies": {
|