@paper-design/shaders-react 0.0.45 → 0.0.47

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.
Files changed (67) hide show
  1. package/README.md +2 -1
  2. package/dist/index.d.ts +12 -0
  3. package/dist/index.js +14 -0
  4. package/dist/index.js.map +2 -2
  5. package/dist/shaders/color-panels.js +12 -11
  6. package/dist/shaders/color-panels.js.map +2 -2
  7. package/dist/shaders/dithering.d.ts +1 -1
  8. package/dist/shaders/dithering.js +12 -11
  9. package/dist/shaders/dithering.js.map +2 -2
  10. package/dist/shaders/dot-grid.js +8 -8
  11. package/dist/shaders/dot-grid.js.map +1 -1
  12. package/dist/shaders/dot-orbit.js +8 -6
  13. package/dist/shaders/dot-orbit.js.map +2 -2
  14. package/dist/shaders/fluted-glass.d.ts +12 -0
  15. package/dist/shaders/fluted-glass.js +181 -0
  16. package/dist/shaders/fluted-glass.js.map +7 -0
  17. package/dist/shaders/god-rays.js +15 -13
  18. package/dist/shaders/god-rays.js.map +2 -2
  19. package/dist/shaders/grain-gradient.d.ts +2 -2
  20. package/dist/shaders/grain-gradient.js +32 -34
  21. package/dist/shaders/grain-gradient.js.map +2 -2
  22. package/dist/shaders/image-dithering.d.ts +12 -0
  23. package/dist/shaders/image-dithering.js +148 -0
  24. package/dist/shaders/image-dithering.js.map +7 -0
  25. package/dist/shaders/liquid-metal.d.ts +2 -2
  26. package/dist/shaders/liquid-metal.js +26 -26
  27. package/dist/shaders/liquid-metal.js.map +2 -2
  28. package/dist/shaders/mesh-gradient.js +1 -1
  29. package/dist/shaders/mesh-gradient.js.map +1 -1
  30. package/dist/shaders/metaballs.d.ts +1 -1
  31. package/dist/shaders/metaballs.js +16 -14
  32. package/dist/shaders/metaballs.js.map +2 -2
  33. package/dist/shaders/neuro-noise.js +3 -3
  34. package/dist/shaders/neuro-noise.js.map +1 -1
  35. package/dist/shaders/paper-texture.d.ts +12 -0
  36. package/dist/shaders/paper-texture.js +197 -0
  37. package/dist/shaders/paper-texture.js.map +7 -0
  38. package/dist/shaders/perlin-noise.js +4 -4
  39. package/dist/shaders/perlin-noise.js.map +1 -1
  40. package/dist/shaders/pulsing-border.js +28 -28
  41. package/dist/shaders/pulsing-border.js.map +2 -2
  42. package/dist/shaders/simplex-noise.js +3 -3
  43. package/dist/shaders/simplex-noise.js.map +1 -1
  44. package/dist/shaders/smoke-ring.d.ts +1 -1
  45. package/dist/shaders/smoke-ring.js +23 -20
  46. package/dist/shaders/smoke-ring.js.map +2 -2
  47. package/dist/shaders/spiral.d.ts +1 -1
  48. package/dist/shaders/spiral.js +18 -18
  49. package/dist/shaders/spiral.js.map +2 -2
  50. package/dist/shaders/static-mesh-gradient.d.ts +1 -1
  51. package/dist/shaders/static-mesh-gradient.js +21 -19
  52. package/dist/shaders/static-mesh-gradient.js.map +2 -2
  53. package/dist/shaders/static-radial-gradient.d.ts +1 -1
  54. package/dist/shaders/static-radial-gradient.js +18 -16
  55. package/dist/shaders/static-radial-gradient.js.map +2 -2
  56. package/dist/shaders/swirl.js +29 -20
  57. package/dist/shaders/swirl.js.map +2 -2
  58. package/dist/shaders/voronoi.js +8 -7
  59. package/dist/shaders/voronoi.js.map +2 -2
  60. package/dist/shaders/warp.js +3 -1
  61. package/dist/shaders/warp.js.map +2 -2
  62. package/dist/shaders/water.d.ts +12 -0
  63. package/dist/shaders/water.js +149 -0
  64. package/dist/shaders/water.js.map +7 -0
  65. package/dist/shaders/waves.js +6 -6
  66. package/dist/shaders/waves.js.map +1 -1
  67. package/package.json +3 -3
@@ -18,21 +18,21 @@ const defaultPreset = {
18
18
  name: "Default",
19
19
  params: {
20
20
  ...defaultObjectSizing,
21
- scale: 0.55,
21
+ scale: 0.6,
22
22
  speed: 1,
23
23
  frame: 0,
24
24
  colorBack: "#000000",
25
- colors: ["#f2244f", "#4da6e6", "#379590"],
26
- roundness: 0.35,
27
- thickness: 0.05,
25
+ colors: ["#0dc1fd", "#d915ef", "#ff3f2ecc"],
26
+ roundness: 0.25,
27
+ thickness: 0.2,
28
28
  softness: 0.75,
29
- intensity: 0.3,
30
- bloom: 0.5,
29
+ intensity: 0.2,
30
+ bloom: 0.45,
31
31
  spots: 3,
32
- spotSize: 0.3,
33
- pulse: 0,
32
+ spotSize: 0.4,
33
+ pulse: 0.5,
34
34
  smoke: 0.35,
35
- smokeSize: 0.63
35
+ smokeSize: 0.6
36
36
  }
37
37
  };
38
38
  const circlePreset = {
@@ -44,18 +44,18 @@ const circlePreset = {
44
44
  scale: 0.6,
45
45
  speed: 1,
46
46
  frame: 0,
47
- colorBack: "#110222",
48
- colors: ["#ffdd33", "#ff0000", "#00ffff"],
47
+ colorBack: "#000000",
48
+ colors: ["#0dc1fd", "#d915ef", "#ff3f2ecc"],
49
49
  roundness: 1,
50
- thickness: 0.4,
51
- softness: 1,
52
- intensity: 0.8,
53
- bloom: 0.8,
54
- spots: 2,
55
- spotSize: 0.45,
56
- pulse: 0,
57
- smoke: 0.25,
58
- smokeSize: 0.62
50
+ thickness: 0.05,
51
+ softness: 0.75,
52
+ intensity: 0.2,
53
+ bloom: 0.45,
54
+ spots: 3,
55
+ spotSize: 0.4,
56
+ pulse: 0.5,
57
+ smoke: 0.35,
58
+ smokeSize: 0.6
59
59
  }
60
60
  };
61
61
  const northernLightsPreset = {
@@ -65,7 +65,7 @@ const northernLightsPreset = {
65
65
  speed: 0.18,
66
66
  frame: 0,
67
67
  colors: ["#3426f2", "#156ba8", "#126964", "#0affba", "#4733cc"],
68
- colorBack: "#002942",
68
+ colorBack: "#0c182c",
69
69
  roundness: 0,
70
70
  thickness: 1,
71
71
  softness: 1,
@@ -82,20 +82,20 @@ const solidLinePreset = {
82
82
  name: "Solid line",
83
83
  params: {
84
84
  ...defaultObjectSizing,
85
- speed: 2,
85
+ speed: 1,
86
86
  frame: 0,
87
- colors: ["#759717", "#ff0073", "#00ffb3"],
88
- colorBack: "#000000",
89
- roundness: 0.05,
90
- thickness: 0.03,
87
+ colors: ["#ffade4", "#e13381", "#fa389f"],
88
+ colorBack: "#00000000",
89
+ roundness: 0,
90
+ thickness: 0.1,
91
91
  softness: 0,
92
92
  intensity: 0,
93
93
  bloom: 0.15,
94
94
  spots: 4,
95
- spotSize: 0.28,
95
+ spotSize: 0.5,
96
96
  pulse: 0,
97
97
  smoke: 0,
98
- smokeSize: 0.63
98
+ smokeSize: 0
99
99
  }
100
100
  };
101
101
  const pulsingBorderPresets = [
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/shaders/pulsing-border.tsx"],
4
- "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n defaultObjectSizing,\n getShaderColorFromString,\n getShaderNoiseTexture,\n pulsingBorderFragmentShader,\n ShaderFitOptions,\n type PulsingBorderParams,\n type PulsingBorderUniforms,\n type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface PulsingBorderProps extends ShaderComponentProps, PulsingBorderParams {}\n\ntype PulsingBorderPreset = ShaderPreset<PulsingBorderParams>;\n\nexport const defaultPreset: PulsingBorderPreset = {\n name: 'Default',\n params: {\n ...defaultObjectSizing,\n scale: 0.55,\n speed: 1,\n frame: 0,\n colorBack: '#000000',\n colors: ['#f2244f', '#4da6e6', '#379590'],\n roundness: 0.35,\n thickness: 0.05,\n softness: 0.75,\n intensity: 0.3,\n bloom: 0.5,\n spots: 3,\n spotSize: 0.3,\n pulse: 0,\n smoke: 0.35,\n smokeSize: 0.63,\n },\n};\n\nexport const circlePreset: PulsingBorderPreset = {\n name: 'Circle',\n params: {\n ...defaultObjectSizing,\n worldWidth: 400,\n worldHeight: 400,\n scale: 0.6,\n speed: 1,\n frame: 0,\n colorBack: '#110222',\n colors: ['#ffdd33', '#ff0000', '#00ffff'],\n roundness: 1,\n thickness: 0.4,\n softness: 1,\n intensity: 0.8,\n bloom: 0.8,\n spots: 2,\n spotSize: 0.45,\n pulse: 0,\n smoke: 0.25,\n smokeSize: 0.62,\n },\n};\n\nexport const northernLightsPreset: PulsingBorderPreset = {\n name: 'Northern lights',\n params: {\n ...defaultObjectSizing,\n speed: 0.18,\n frame: 0,\n colors: ['#3426f2', '#156ba8', '#126964', '#0affba', '#4733cc'],\n colorBack: '#002942',\n roundness: 0,\n thickness: 1,\n softness: 1,\n intensity: 0,\n bloom: 0.5,\n spots: 4,\n spotSize: 0,\n pulse: 0,\n smoke: 0.7,\n smokeSize: 0.7,\n },\n};\n\nexport const solidLinePreset: PulsingBorderPreset = {\n name: 'Solid line',\n params: {\n ...defaultObjectSizing,\n speed: 2,\n frame: 0,\n colors: ['#759717', '#ff0073', '#00ffb3'],\n colorBack: '#000000',\n roundness: 0.05,\n thickness: 0.03,\n softness: 0.0,\n intensity: 0.0,\n bloom: 0.15,\n spots: 4,\n spotSize: 0.28,\n pulse: 0.0,\n smoke: 0,\n smokeSize: 0.63,\n },\n};\n\nexport const pulsingBorderPresets: PulsingBorderPreset[] = [\n defaultPreset,\n circlePreset,\n northernLightsPreset,\n solidLinePreset,\n];\n\nexport const PulsingBorder: React.FC<PulsingBorderProps> = memo(function PulsingBorderImpl({\n // Own props\n speed = defaultPreset.params.speed,\n frame = defaultPreset.params.frame,\n colors = defaultPreset.params.colors,\n colorBack = defaultPreset.params.colorBack,\n roundness = defaultPreset.params.roundness,\n thickness = defaultPreset.params.thickness,\n softness = defaultPreset.params.softness,\n bloom = defaultPreset.params.bloom,\n intensity = defaultPreset.params.intensity,\n spots = defaultPreset.params.spots,\n spotSize = defaultPreset.params.spotSize,\n pulse = defaultPreset.params.pulse,\n smoke = defaultPreset.params.smoke,\n smokeSize = defaultPreset.params.smokeSize,\n\n // Sizing props\n fit = defaultPreset.params.fit,\n rotation = defaultPreset.params.rotation,\n scale = defaultPreset.params.scale,\n originX = defaultPreset.params.originX,\n originY = defaultPreset.params.originY,\n offsetX = defaultPreset.params.offsetX,\n offsetY = defaultPreset.params.offsetY,\n worldWidth = defaultPreset.params.worldWidth,\n worldHeight = defaultPreset.params.worldHeight,\n ...props\n}: PulsingBorderProps) {\n const uniforms = {\n // Own uniforms\n u_colorBack: getShaderColorFromString(colorBack),\n u_colors: colors.map(getShaderColorFromString),\n u_colorsCount: colors.length,\n u_roundness: roundness,\n u_thickness: thickness,\n u_softness: softness,\n u_intensity: intensity,\n u_bloom: bloom,\n u_spots: spots,\n u_spotSize: spotSize,\n u_pulse: pulse,\n u_smoke: smoke,\n u_smokeSize: smokeSize,\n u_noiseTexture: getShaderNoiseTexture(),\n\n // Sizing uniforms\n u_fit: ShaderFitOptions[fit],\n u_rotation: rotation,\n u_scale: scale,\n u_offsetX: offsetX,\n u_offsetY: offsetY,\n u_originX: originX,\n u_originY: originY,\n u_worldWidth: worldWidth,\n u_worldHeight: worldHeight,\n } satisfies PulsingBorderUniforms;\n\n return (\n <ShaderMount\n {...props}\n speed={speed}\n frame={frame}\n fragmentShader={pulsingBorderFragmentShader}\n uniforms={uniforms}\n />\n );\n}, colorPropsAreEqual);\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n defaultObjectSizing,\n getShaderColorFromString,\n getShaderNoiseTexture,\n pulsingBorderFragmentShader,\n ShaderFitOptions,\n type PulsingBorderParams,\n type PulsingBorderUniforms,\n type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface PulsingBorderProps extends ShaderComponentProps, PulsingBorderParams {}\n\ntype PulsingBorderPreset = ShaderPreset<PulsingBorderParams>;\n\nexport const defaultPreset: PulsingBorderPreset = {\n name: 'Default',\n params: {\n ...defaultObjectSizing,\n scale: 0.6,\n speed: 1,\n frame: 0,\n colorBack: '#000000',\n colors: ['#0dc1fd', '#d915ef', '#ff3f2ecc'],\n roundness: 0.25,\n thickness: 0.2,\n softness: 0.75,\n intensity: 0.2,\n bloom: 0.45,\n spots: 3,\n spotSize: 0.4,\n pulse: 0.5,\n smoke: 0.35,\n smokeSize: 0.6,\n },\n};\n\nexport const circlePreset: PulsingBorderPreset = {\n name: 'Circle',\n params: {\n ...defaultObjectSizing,\n worldWidth: 400,\n worldHeight: 400,\n scale: 0.6,\n speed: 1,\n frame: 0,\n colorBack: '#000000',\n colors: ['#0dc1fd', '#d915ef', '#ff3f2ecc'],\n roundness: 1,\n thickness: 0.05,\n softness: 0.75,\n intensity: 0.2,\n bloom: 0.45,\n spots: 3,\n spotSize: 0.4,\n pulse: 0.5,\n smoke: 0.35,\n smokeSize: 0.6,\n },\n};\n\nexport const northernLightsPreset: PulsingBorderPreset = {\n name: 'Northern lights',\n params: {\n ...defaultObjectSizing,\n speed: 0.18,\n frame: 0,\n colors: ['#3426f2', '#156ba8', '#126964', '#0affba', '#4733cc'],\n colorBack: '#0c182c',\n roundness: 0,\n thickness: 1,\n softness: 1,\n intensity: 0,\n bloom: 0.5,\n spots: 4,\n spotSize: 0,\n pulse: 0,\n smoke: 0.7,\n smokeSize: 0.7,\n },\n};\n\nexport const solidLinePreset: PulsingBorderPreset = {\n name: 'Solid line',\n params: {\n ...defaultObjectSizing,\n speed: 1,\n frame: 0,\n colors: ['#ffade4', '#e13381', '#fa389f'],\n colorBack: '#00000000',\n roundness: 0,\n thickness: 0.1,\n softness: 0.0,\n intensity: 0.0,\n bloom: 0.15,\n spots: 4,\n spotSize: 0.5,\n pulse: 0,\n smoke: 0,\n smokeSize: 0,\n },\n};\n\nexport const pulsingBorderPresets: PulsingBorderPreset[] = [\n defaultPreset,\n circlePreset,\n northernLightsPreset,\n solidLinePreset,\n];\n\nexport const PulsingBorder: React.FC<PulsingBorderProps> = memo(function PulsingBorderImpl({\n // Own props\n speed = defaultPreset.params.speed,\n frame = defaultPreset.params.frame,\n colors = defaultPreset.params.colors,\n colorBack = defaultPreset.params.colorBack,\n roundness = defaultPreset.params.roundness,\n thickness = defaultPreset.params.thickness,\n softness = defaultPreset.params.softness,\n bloom = defaultPreset.params.bloom,\n intensity = defaultPreset.params.intensity,\n spots = defaultPreset.params.spots,\n spotSize = defaultPreset.params.spotSize,\n pulse = defaultPreset.params.pulse,\n smoke = defaultPreset.params.smoke,\n smokeSize = defaultPreset.params.smokeSize,\n\n // Sizing props\n fit = defaultPreset.params.fit,\n rotation = defaultPreset.params.rotation,\n scale = defaultPreset.params.scale,\n originX = defaultPreset.params.originX,\n originY = defaultPreset.params.originY,\n offsetX = defaultPreset.params.offsetX,\n offsetY = defaultPreset.params.offsetY,\n worldWidth = defaultPreset.params.worldWidth,\n worldHeight = defaultPreset.params.worldHeight,\n ...props\n}: PulsingBorderProps) {\n const uniforms = {\n // Own uniforms\n u_colorBack: getShaderColorFromString(colorBack),\n u_colors: colors.map(getShaderColorFromString),\n u_colorsCount: colors.length,\n u_roundness: roundness,\n u_thickness: thickness,\n u_softness: softness,\n u_intensity: intensity,\n u_bloom: bloom,\n u_spots: spots,\n u_spotSize: spotSize,\n u_pulse: pulse,\n u_smoke: smoke,\n u_smokeSize: smokeSize,\n u_noiseTexture: getShaderNoiseTexture(),\n\n // Sizing uniforms\n u_fit: ShaderFitOptions[fit],\n u_rotation: rotation,\n u_scale: scale,\n u_offsetX: offsetX,\n u_offsetY: offsetY,\n u_originX: originX,\n u_originY: originY,\n u_worldWidth: worldWidth,\n u_worldHeight: worldHeight,\n } satisfies PulsingBorderUniforms;\n\n return (\n <ShaderMount\n {...props}\n speed={speed}\n frame={frame}\n fragmentShader={pulsingBorderFragmentShader}\n uniforms={uniforms}\n />\n );\n}, colorPropsAreEqual);\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -17,10 +17,10 @@ const defaultPreset = {
17
17
  name: "Default",
18
18
  params: {
19
19
  ...defaultPatternSizing,
20
- speed: 1,
20
+ speed: 0.5,
21
21
  frame: 0,
22
- colors: ["#5F7F99", "#A5C977", "#F94C4C", "#F9C94C", "#FFFFFF"],
23
- stepsPerColor: 3,
22
+ colors: ["#4449CF", "#FFD1E0", "#F94446", "#FFD36B", "#FFFFFF"],
23
+ stepsPerColor: 2,
24
24
  softness: 0
25
25
  }
26
26
  };
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/shaders/simplex-noise.tsx"],
4
- "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n getShaderColorFromString,\n simplexNoiseFragmentShader,\n ShaderFitOptions,\n type SimplexNoiseUniforms,\n type SimplexNoiseParams,\n type ShaderPreset,\n defaultPatternSizing,\n} from '@paper-design/shaders';\n\nexport interface SimplexNoiseProps extends ShaderComponentProps, SimplexNoiseParams {}\n\ntype SimplexNoisePreset = ShaderPreset<SimplexNoiseParams>;\n\nexport const defaultPreset: SimplexNoisePreset = {\n name: 'Default',\n params: {\n ...defaultPatternSizing,\n speed: 1,\n frame: 0,\n colors: ['#5F7F99', '#A5C977', '#F94C4C', '#F9C94C', '#FFFFFF'],\n stepsPerColor: 3,\n softness: 0,\n },\n};\n\nexport const bubblegumPreset: SimplexNoisePreset = {\n name: 'Bubblegum',\n params: {\n ...defaultPatternSizing,\n speed: 2,\n frame: 0,\n colors: ['#ffffff', '#ff9e9e', '#5f57ff', '#00f7ff'],\n stepsPerColor: 1,\n softness: 1.0,\n scale: 1.6,\n },\n};\n\nexport const spotsPreset: SimplexNoisePreset = {\n name: 'Spots',\n params: {\n ...defaultPatternSizing,\n speed: 0.6,\n frame: 0,\n colors: ['#ff7b00', '#f9ffeb', '#320d82'],\n stepsPerColor: 1,\n softness: 0.0,\n scale: 1.0,\n },\n};\n\nexport const firstContactPreset: SimplexNoisePreset = {\n name: 'First contact',\n params: {\n ...defaultPatternSizing,\n speed: 2,\n frame: 0,\n colors: ['#e8cce6', '#120d22', '#442c44', '#e6baba', '#fff5f5'],\n stepsPerColor: 2,\n softness: 0.0,\n scale: 0.2,\n },\n};\n\nexport const simplexNoisePresets: SimplexNoisePreset[] = [\n defaultPreset,\n spotsPreset,\n firstContactPreset,\n bubblegumPreset,\n];\n\nexport const SimplexNoise: React.FC<SimplexNoiseProps> = memo(function SimplexNoiseImpl({\n // Own props\n speed = defaultPreset.params.speed,\n frame = defaultPreset.params.frame,\n colors = defaultPreset.params.colors,\n stepsPerColor = defaultPreset.params.stepsPerColor,\n softness = defaultPreset.params.softness,\n\n // Sizing props\n fit = defaultPreset.params.fit,\n scale = defaultPreset.params.scale,\n rotation = defaultPreset.params.rotation,\n originX = defaultPreset.params.originX,\n originY = defaultPreset.params.originY,\n offsetX = defaultPreset.params.offsetX,\n offsetY = defaultPreset.params.offsetY,\n worldWidth = defaultPreset.params.worldWidth,\n worldHeight = defaultPreset.params.worldHeight,\n ...props\n}: SimplexNoiseProps) {\n const uniforms = {\n // Own uniforms\n u_colors: colors.map(getShaderColorFromString),\n u_colorsCount: colors.length,\n u_stepsPerColor: stepsPerColor,\n u_softness: softness,\n\n // Sizing uniforms\n u_fit: ShaderFitOptions[fit],\n u_scale: scale,\n u_rotation: rotation,\n u_offsetX: offsetX,\n u_offsetY: offsetY,\n u_originX: originX,\n u_originY: originY,\n u_worldWidth: worldWidth,\n u_worldHeight: worldHeight,\n } satisfies SimplexNoiseUniforms;\n\n return (\n <ShaderMount\n {...props}\n speed={speed}\n frame={frame}\n fragmentShader={simplexNoiseFragmentShader}\n uniforms={uniforms}\n />\n );\n}, colorPropsAreEqual);\n"],
4
+ "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n getShaderColorFromString,\n simplexNoiseFragmentShader,\n ShaderFitOptions,\n type SimplexNoiseUniforms,\n type SimplexNoiseParams,\n type ShaderPreset,\n defaultPatternSizing,\n} from '@paper-design/shaders';\n\nexport interface SimplexNoiseProps extends ShaderComponentProps, SimplexNoiseParams {}\n\ntype SimplexNoisePreset = ShaderPreset<SimplexNoiseParams>;\n\nexport const defaultPreset: SimplexNoisePreset = {\n name: 'Default',\n params: {\n ...defaultPatternSizing,\n speed: 0.5,\n frame: 0,\n colors: ['#4449CF', '#FFD1E0', '#F94446', '#FFD36B', '#FFFFFF'],\n stepsPerColor: 2,\n softness: 0,\n },\n};\n\nexport const bubblegumPreset: SimplexNoisePreset = {\n name: 'Bubblegum',\n params: {\n ...defaultPatternSizing,\n speed: 2,\n frame: 0,\n colors: ['#ffffff', '#ff9e9e', '#5f57ff', '#00f7ff'],\n stepsPerColor: 1,\n softness: 1.0,\n scale: 1.6,\n },\n};\n\nexport const spotsPreset: SimplexNoisePreset = {\n name: 'Spots',\n params: {\n ...defaultPatternSizing,\n speed: 0.6,\n frame: 0,\n colors: ['#ff7b00', '#f9ffeb', '#320d82'],\n stepsPerColor: 1,\n softness: 0.0,\n scale: 1.0,\n },\n};\n\nexport const firstContactPreset: SimplexNoisePreset = {\n name: 'First contact',\n params: {\n ...defaultPatternSizing,\n speed: 2,\n frame: 0,\n colors: ['#e8cce6', '#120d22', '#442c44', '#e6baba', '#fff5f5'],\n stepsPerColor: 2,\n softness: 0.0,\n scale: 0.2,\n },\n};\n\nexport const simplexNoisePresets: SimplexNoisePreset[] = [\n defaultPreset,\n spotsPreset,\n firstContactPreset,\n bubblegumPreset,\n];\n\nexport const SimplexNoise: React.FC<SimplexNoiseProps> = memo(function SimplexNoiseImpl({\n // Own props\n speed = defaultPreset.params.speed,\n frame = defaultPreset.params.frame,\n colors = defaultPreset.params.colors,\n stepsPerColor = defaultPreset.params.stepsPerColor,\n softness = defaultPreset.params.softness,\n\n // Sizing props\n fit = defaultPreset.params.fit,\n scale = defaultPreset.params.scale,\n rotation = defaultPreset.params.rotation,\n originX = defaultPreset.params.originX,\n originY = defaultPreset.params.originY,\n offsetX = defaultPreset.params.offsetX,\n offsetY = defaultPreset.params.offsetY,\n worldWidth = defaultPreset.params.worldWidth,\n worldHeight = defaultPreset.params.worldHeight,\n ...props\n}: SimplexNoiseProps) {\n const uniforms = {\n // Own uniforms\n u_colors: colors.map(getShaderColorFromString),\n u_colorsCount: colors.length,\n u_stepsPerColor: stepsPerColor,\n u_softness: softness,\n\n // Sizing uniforms\n u_fit: ShaderFitOptions[fit],\n u_scale: scale,\n u_rotation: rotation,\n u_offsetX: offsetX,\n u_offsetY: offsetY,\n u_originX: originX,\n u_originY: originY,\n u_worldWidth: worldWidth,\n u_worldHeight: worldHeight,\n } satisfies SimplexNoiseUniforms;\n\n return (\n <ShaderMount\n {...props}\n speed={speed}\n frame={frame}\n fragmentShader={simplexNoiseFragmentShader}\n uniforms={uniforms}\n />\n );\n}, colorPropsAreEqual);\n"],
5
5
  "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EAIA;AAAA,OACK;AAwGH;AAlGG,MAAM,gBAAoC;AAAA,EAC/C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,WAAW,WAAW,WAAW,SAAS;AAAA,IAC9D,eAAe;AAAA,IACf,UAAU;AAAA,EACZ;AACF;AAEO,MAAM,kBAAsC;AAAA,EACjD,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,WAAW,WAAW,SAAS;AAAA,IACnD,eAAe;AAAA,IACf,UAAU;AAAA,IACV,OAAO;AAAA,EACT;AACF;AAEO,MAAM,cAAkC;AAAA,EAC7C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,IACxC,eAAe;AAAA,IACf,UAAU;AAAA,IACV,OAAO;AAAA,EACT;AACF;AAEO,MAAM,qBAAyC;AAAA,EACpD,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,WAAW,WAAW,WAAW,SAAS;AAAA,IAC9D,eAAe;AAAA,IACf,UAAU;AAAA,IACV,OAAO;AAAA,EACT;AACF;AAEO,MAAM,sBAA4C;AAAA,EACvD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEO,MAAM,eAA4C,KAAK,SAAS,iBAAiB;AAAA;AAAA,EAEtF,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,SAAS,cAAc,OAAO;AAAA,EAC9B,gBAAgB,cAAc,OAAO;AAAA,EACrC,WAAW,cAAc,OAAO;AAAA;AAAA,EAGhC,MAAM,cAAc,OAAO;AAAA,EAC3B,QAAQ,cAAc,OAAO;AAAA,EAC7B,WAAW,cAAc,OAAO;AAAA,EAChC,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAsB;AACpB,QAAM,WAAW;AAAA;AAAA,IAEf,UAAU,OAAO,IAAI,wBAAwB;AAAA,IAC7C,eAAe,OAAO;AAAA,IACtB,iBAAiB;AAAA,IACjB,YAAY;AAAA;AAAA,IAGZ,OAAO,iBAAiB,GAAG;AAAA,IAC3B,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA,gBAAgB;AAAA,MAChB;AAAA;AAAA,EACF;AAEJ,GAAG,kBAAkB;",
6
6
  "names": []
7
7
  }
@@ -4,7 +4,7 @@ export interface SmokeRingProps extends ShaderComponentProps, SmokeRingParams {
4
4
  }
5
5
  type SmokeRingPreset = ShaderPreset<SmokeRingParams>;
6
6
  export declare const defaultPreset: SmokeRingPreset;
7
- export declare const poisonPreset: SmokeRingPreset;
7
+ export declare const solarPreset: SmokeRingPreset;
8
8
  export declare const linePreset: SmokeRingPreset;
9
9
  export declare const cloudPreset: SmokeRingPreset;
10
10
  export declare const smokeRingPresets: SmokeRingPreset[];
@@ -20,28 +20,31 @@ const defaultPreset = {
20
20
  ...defaultObjectSizing,
21
21
  speed: 0.4,
22
22
  frame: 0,
23
- colorBack: "#ffffff",
24
- colors: ["#136c5e", "#0f0224"],
25
- noiseScale: 5,
26
- noiseIterations: 10,
27
- radius: 0.5,
28
- thickness: 0.25,
29
- innerShape: 1.2
23
+ colorBack: "#000000",
24
+ colors: ["#ffffff"],
25
+ noiseScale: 3,
26
+ noiseIterations: 8,
27
+ radius: 0.25,
28
+ thickness: 0.65,
29
+ innerShape: 0.7,
30
+ scale: 0.8
30
31
  }
31
32
  };
32
- const poisonPreset = {
33
- name: "Poison",
33
+ const solarPreset = {
34
+ name: "Solar",
34
35
  params: {
35
36
  ...defaultObjectSizing,
36
37
  speed: 1,
37
38
  frame: 0,
38
- colorBack: "#003d00",
39
- colors: ["#d4ff00", "#077d52", "#aaff00"],
40
- noiseScale: 3.3,
39
+ colorBack: "#000000",
40
+ colors: ["#ffffff", "#ffca0a", "#fc6203", "#fc620366"],
41
+ noiseScale: 2,
41
42
  noiseIterations: 3,
42
43
  radius: 0.4,
43
- thickness: 0.2,
44
- innerShape: 4
44
+ thickness: 0.8,
45
+ innerShape: 4,
46
+ scale: 2,
47
+ offsetY: 1
45
48
  }
46
49
  };
47
50
  const linePreset = {
@@ -50,7 +53,7 @@ const linePreset = {
50
53
  ...defaultObjectSizing,
51
54
  frame: 0,
52
55
  colorBack: "#000000",
53
- colors: ["#1fe8ff", "#4540a4"],
56
+ colors: ["#4540a4", "#1fe8ff"],
54
57
  noiseScale: 1.1,
55
58
  noiseIterations: 2,
56
59
  radius: 0.38,
@@ -64,7 +67,7 @@ const cloudPreset = {
64
67
  params: {
65
68
  ...defaultObjectSizing,
66
69
  frame: 0,
67
- colorBack: "#3b9bff",
70
+ colorBack: "#81ADEC",
68
71
  colors: ["#ffffff"],
69
72
  noiseScale: 3,
70
73
  noiseIterations: 10,
@@ -72,10 +75,10 @@ const cloudPreset = {
72
75
  thickness: 0.65,
73
76
  innerShape: 0.85,
74
77
  speed: 0.5,
75
- scale: 0.8
78
+ scale: 2.5
76
79
  }
77
80
  };
78
- const smokeRingPresets = [defaultPreset, linePreset, poisonPreset, cloudPreset];
81
+ const smokeRingPresets = [defaultPreset, linePreset, solarPreset, cloudPreset];
79
82
  const SmokeRing = memo(function SmokeRingImpl({
80
83
  // Own props
81
84
  speed = defaultPreset.params.speed,
@@ -128,7 +131,7 @@ export {
128
131
  cloudPreset,
129
132
  defaultPreset,
130
133
  linePreset,
131
- poisonPreset,
132
- smokeRingPresets
134
+ smokeRingPresets,
135
+ solarPreset
133
136
  };
134
137
  //# sourceMappingURL=smoke-ring.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/shaders/smoke-ring.tsx"],
4
- "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n defaultObjectSizing,\n getShaderColorFromString,\n getShaderNoiseTexture,\n smokeRingFragmentShader,\n ShaderFitOptions,\n type ShaderPreset,\n type SmokeRingParams,\n type SmokeRingUniforms,\n} from '@paper-design/shaders';\n\nexport interface SmokeRingProps extends ShaderComponentProps, SmokeRingParams {}\n\ntype SmokeRingPreset = ShaderPreset<SmokeRingParams>;\n\nexport const defaultPreset: SmokeRingPreset = {\n name: 'Default',\n params: {\n ...defaultObjectSizing,\n speed: 0.4,\n frame: 0,\n colorBack: '#ffffff',\n colors: ['#136c5e', '#0f0224'],\n noiseScale: 5,\n noiseIterations: 10,\n radius: 0.5,\n thickness: 0.25,\n innerShape: 1.2,\n },\n};\n\nexport const poisonPreset: SmokeRingPreset = {\n name: 'Poison',\n params: {\n ...defaultObjectSizing,\n speed: 1,\n frame: 0,\n colorBack: '#003d00',\n colors: ['#d4ff00', '#077d52', '#aaff00'],\n noiseScale: 3.3,\n noiseIterations: 3,\n radius: 0.4,\n thickness: 0.2,\n innerShape: 4,\n },\n};\n\nexport const linePreset: SmokeRingPreset = {\n name: 'Line',\n params: {\n ...defaultObjectSizing,\n frame: 0,\n colorBack: '#000000',\n colors: ['#1fe8ff', '#4540a4'],\n noiseScale: 1.1,\n noiseIterations: 2,\n radius: 0.38,\n thickness: 0.01,\n innerShape: 0.88,\n speed: 4,\n },\n};\n\nexport const cloudPreset: SmokeRingPreset = {\n name: 'Cloud',\n params: {\n ...defaultObjectSizing,\n frame: 0,\n colorBack: '#3b9bff',\n colors: ['#ffffff'],\n noiseScale: 3,\n noiseIterations: 10,\n radius: 0.5,\n thickness: 0.65,\n innerShape: 0.85,\n speed: 0.5,\n scale: 0.8,\n },\n};\n\nexport const smokeRingPresets: SmokeRingPreset[] = [defaultPreset, linePreset, poisonPreset, cloudPreset];\n\nexport const SmokeRing: React.FC<SmokeRingProps> = memo(function SmokeRingImpl({\n // Own props\n speed = defaultPreset.params.speed,\n frame = defaultPreset.params.frame,\n colorBack = defaultPreset.params.colorBack,\n colors = defaultPreset.params.colors,\n noiseScale = defaultPreset.params.noiseScale,\n thickness = defaultPreset.params.thickness,\n radius = defaultPreset.params.radius,\n innerShape = defaultPreset.params.innerShape,\n noiseIterations = defaultPreset.params.noiseIterations,\n\n // Sizing props\n fit = defaultPreset.params.fit,\n scale = defaultPreset.params.scale,\n rotation = defaultPreset.params.rotation,\n originX = defaultPreset.params.originX,\n originY = defaultPreset.params.originY,\n offsetX = defaultPreset.params.offsetX,\n offsetY = defaultPreset.params.offsetY,\n worldWidth = defaultPreset.params.worldWidth,\n worldHeight = defaultPreset.params.worldHeight,\n ...props\n}: SmokeRingProps) {\n const uniforms = {\n // Own uniforms\n u_colorBack: getShaderColorFromString(colorBack),\n u_colors: colors.map(getShaderColorFromString),\n u_colorsCount: colors.length,\n u_noiseScale: noiseScale,\n u_thickness: thickness,\n u_radius: radius,\n u_innerShape: innerShape,\n u_noiseIterations: noiseIterations,\n u_noiseTexture: getShaderNoiseTexture(),\n\n // Sizing uniforms\n u_fit: ShaderFitOptions[fit],\n u_scale: scale,\n u_rotation: rotation,\n u_offsetX: offsetX,\n u_offsetY: offsetY,\n u_originX: originX,\n u_originY: originY,\n u_worldWidth: worldWidth,\n u_worldHeight: worldHeight,\n } satisfies SmokeRingUniforms;\n\n return (\n <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={smokeRingFragmentShader} uniforms={uniforms} />\n );\n}, colorPropsAreEqual);\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n defaultObjectSizing,\n getShaderColorFromString,\n getShaderNoiseTexture,\n smokeRingFragmentShader,\n ShaderFitOptions,\n type ShaderPreset,\n type SmokeRingParams,\n type SmokeRingUniforms,\n} from '@paper-design/shaders';\n\nexport interface SmokeRingProps extends ShaderComponentProps, SmokeRingParams {}\n\ntype SmokeRingPreset = ShaderPreset<SmokeRingParams>;\n\nexport const defaultPreset: SmokeRingPreset = {\n name: 'Default',\n params: {\n ...defaultObjectSizing,\n speed: 0.4,\n frame: 0,\n colorBack: '#000000',\n colors: ['#ffffff'],\n noiseScale: 3,\n noiseIterations: 8,\n radius: 0.25,\n thickness: 0.65,\n innerShape: 0.7,\n scale: 0.8,\n },\n};\n\nexport const solarPreset: SmokeRingPreset = {\n name: 'Solar',\n params: {\n ...defaultObjectSizing,\n speed: 1,\n frame: 0,\n colorBack: '#000000',\n colors: ['#ffffff', '#ffca0a', '#fc6203', '#fc620366'],\n noiseScale: 2,\n noiseIterations: 3,\n radius: 0.4,\n thickness: 0.8,\n innerShape: 4,\n scale: 2,\n offsetY: 1,\n },\n};\n\nexport const linePreset: SmokeRingPreset = {\n name: 'Line',\n params: {\n ...defaultObjectSizing,\n frame: 0,\n colorBack: '#000000',\n colors: ['#4540a4', '#1fe8ff'],\n noiseScale: 1.1,\n noiseIterations: 2,\n radius: 0.38,\n thickness: 0.01,\n innerShape: 0.88,\n speed: 4,\n },\n};\n\nexport const cloudPreset: SmokeRingPreset = {\n name: 'Cloud',\n params: {\n ...defaultObjectSizing,\n frame: 0,\n colorBack: '#81ADEC',\n colors: ['#ffffff'],\n noiseScale: 3,\n noiseIterations: 10,\n radius: 0.5,\n thickness: 0.65,\n innerShape: 0.85,\n speed: 0.5,\n scale: 2.5,\n },\n};\n\nexport const smokeRingPresets: SmokeRingPreset[] = [defaultPreset, linePreset, solarPreset, cloudPreset];\n\nexport const SmokeRing: React.FC<SmokeRingProps> = memo(function SmokeRingImpl({\n // Own props\n speed = defaultPreset.params.speed,\n frame = defaultPreset.params.frame,\n colorBack = defaultPreset.params.colorBack,\n colors = defaultPreset.params.colors,\n noiseScale = defaultPreset.params.noiseScale,\n thickness = defaultPreset.params.thickness,\n radius = defaultPreset.params.radius,\n innerShape = defaultPreset.params.innerShape,\n noiseIterations = defaultPreset.params.noiseIterations,\n\n // Sizing props\n fit = defaultPreset.params.fit,\n scale = defaultPreset.params.scale,\n rotation = defaultPreset.params.rotation,\n originX = defaultPreset.params.originX,\n originY = defaultPreset.params.originY,\n offsetX = defaultPreset.params.offsetX,\n offsetY = defaultPreset.params.offsetY,\n worldWidth = defaultPreset.params.worldWidth,\n worldHeight = defaultPreset.params.worldHeight,\n ...props\n}: SmokeRingProps) {\n const uniforms = {\n // Own uniforms\n u_colorBack: getShaderColorFromString(colorBack),\n u_colors: colors.map(getShaderColorFromString),\n u_colorsCount: colors.length,\n u_noiseScale: noiseScale,\n u_thickness: thickness,\n u_radius: radius,\n u_innerShape: innerShape,\n u_noiseIterations: noiseIterations,\n u_noiseTexture: getShaderNoiseTexture(),\n\n // Sizing uniforms\n u_fit: ShaderFitOptions[fit],\n u_scale: scale,\n u_rotation: rotation,\n u_offsetX: offsetX,\n u_offsetY: offsetY,\n u_originX: originX,\n u_originY: originY,\n u_worldWidth: worldWidth,\n u_worldHeight: worldHeight,\n } satisfies SmokeRingUniforms;\n\n return (\n <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={smokeRingFragmentShader} uniforms={uniforms} />\n );\n}, colorPropsAreEqual);\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -5,7 +5,7 @@ export interface SpiralProps extends ShaderComponentProps, SpiralParams {
5
5
  type SpiralPreset = ShaderPreset<SpiralParams>;
6
6
  export declare const defaultPreset: SpiralPreset;
7
7
  export declare const dropletPreset: SpiralPreset;
8
- export declare const sandPreset: SpiralPreset;
8
+ export declare const junglePreset: SpiralPreset;
9
9
  export declare const swirlPreset: SpiralPreset;
10
10
  export declare const spiralPresets: SpiralPreset[];
11
11
  export declare const Spiral: React.FC<SpiralProps>;
@@ -18,17 +18,17 @@ const defaultPreset = {
18
18
  params: {
19
19
  ...defaultPatternSizing,
20
20
  scale: 1.3,
21
- colorBack: "#a1ef2a",
22
- colorFront: "#288918",
23
- density: 0.5,
21
+ colorBack: "#001429",
22
+ colorFront: "#79D1FF",
23
+ density: 1,
24
24
  distortion: 0,
25
25
  strokeWidth: 0.5,
26
26
  strokeTaper: 0,
27
27
  strokeCap: 0,
28
- noise: 1,
29
- noiseFrequency: 0.25,
28
+ noise: 0,
29
+ noiseFrequency: 0,
30
30
  softness: 0,
31
- speed: 0.75,
31
+ speed: 1,
32
32
  frame: 0
33
33
  }
34
34
  };
@@ -40,7 +40,7 @@ const dropletPreset = {
40
40
  colorFront: "#bf40a0",
41
41
  density: 0.9,
42
42
  distortion: 0,
43
- strokeWidth: 0.25,
43
+ strokeWidth: 0.75,
44
44
  strokeTaper: 0.18,
45
45
  strokeCap: 1,
46
46
  noise: 0.74,
@@ -50,22 +50,22 @@ const dropletPreset = {
50
50
  frame: 0
51
51
  }
52
52
  };
53
- const sandPreset = {
54
- name: "Sand",
53
+ const junglePreset = {
54
+ name: "Jungle",
55
55
  params: {
56
56
  ...defaultPatternSizing,
57
- scale: 0.7,
58
- colorBack: "#ffffff",
59
- colorFront: "#a09560",
60
- density: 1,
57
+ scale: 1.3,
58
+ density: 0.5,
59
+ colorBack: "#a0ef2a",
60
+ colorFront: "#288b18",
61
61
  distortion: 0,
62
62
  strokeWidth: 0.5,
63
63
  strokeTaper: 0,
64
64
  strokeCap: 0,
65
65
  noise: 1,
66
- noiseFrequency: 1,
67
- softness: 1,
68
- speed: 0,
66
+ noiseFrequency: 0.25,
67
+ softness: 0,
68
+ speed: 0.75,
69
69
  frame: 0
70
70
  }
71
71
  };
@@ -88,7 +88,7 @@ const swirlPreset = {
88
88
  frame: 0
89
89
  }
90
90
  };
91
- const spiralPresets = [defaultPreset, sandPreset, dropletPreset, swirlPreset];
91
+ const spiralPresets = [defaultPreset, junglePreset, dropletPreset, swirlPreset];
92
92
  const Spiral = memo(function SpiralImpl({
93
93
  // Own props
94
94
  speed = defaultPreset.params.speed,
@@ -144,7 +144,7 @@ export {
144
144
  Spiral,
145
145
  defaultPreset,
146
146
  dropletPreset,
147
- sandPreset,
147
+ junglePreset,
148
148
  spiralPresets,
149
149
  swirlPreset
150
150
  };
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/shaders/spiral.tsx"],
4
- "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n defaultPatternSizing,\n getShaderColorFromString,\n ShaderFitOptions,\n spiralFragmentShader,\n type ShaderPreset,\n type SpiralParams,\n type SpiralUniforms,\n} from '@paper-design/shaders';\n\nexport interface SpiralProps extends ShaderComponentProps, SpiralParams {}\n\ntype SpiralPreset = ShaderPreset<SpiralParams>;\n\nexport const defaultPreset: SpiralPreset = {\n name: 'Default',\n params: {\n ...defaultPatternSizing,\n scale: 1.3,\n colorBack: '#a1ef2a',\n colorFront: '#288918',\n density: 0.5,\n distortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0,\n noise: 1,\n noiseFrequency: 0.25,\n softness: 0,\n speed: 0.75,\n frame: 0,\n },\n};\n\nexport const dropletPreset: SpiralPreset = {\n name: 'Droplet',\n params: {\n ...defaultPatternSizing,\n colorBack: '#effafe',\n colorFront: '#bf40a0',\n density: 0.9,\n distortion: 0,\n strokeWidth: 0.25,\n strokeTaper: 0.18,\n strokeCap: 1,\n noise: 0.74,\n noiseFrequency: 0.33,\n softness: 0.02,\n speed: 1,\n frame: 0,\n },\n};\n\nexport const sandPreset: SpiralPreset = {\n name: 'Sand',\n params: {\n ...defaultPatternSizing,\n scale: 0.7,\n colorBack: '#ffffff',\n colorFront: '#a09560',\n density: 1,\n distortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0,\n noise: 1,\n noiseFrequency: 1,\n softness: 1,\n speed: 0,\n frame: 0,\n },\n};\n\nexport const swirlPreset: SpiralPreset = {\n name: 'Swirl',\n params: {\n ...defaultPatternSizing,\n scale: 0.45,\n colorBack: '#b3e6d9',\n colorFront: '#1a2b4d',\n density: 0.2,\n distortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0,\n noise: 0,\n noiseFrequency: 0.3,\n softness: 0.5,\n speed: 1,\n frame: 0,\n },\n};\n\nexport const spiralPresets: SpiralPreset[] = [defaultPreset, sandPreset, dropletPreset, swirlPreset];\n\nexport const Spiral: React.FC<SpiralProps> = memo(function SpiralImpl({\n // Own props\n speed = defaultPreset.params.speed,\n frame = defaultPreset.params.frame,\n colorBack = defaultPreset.params.colorBack,\n colorFront = defaultPreset.params.colorFront,\n density = defaultPreset.params.density,\n distortion = defaultPreset.params.distortion,\n strokeWidth = defaultPreset.params.strokeWidth,\n strokeTaper = defaultPreset.params.strokeTaper,\n strokeCap = defaultPreset.params.strokeCap,\n noiseFrequency = defaultPreset.params.noiseFrequency,\n noise = defaultPreset.params.noise,\n softness = defaultPreset.params.softness,\n\n // Sizing props\n fit = defaultPreset.params.fit,\n rotation = defaultPreset.params.rotation,\n scale = defaultPreset.params.scale,\n originX = defaultPreset.params.originX,\n originY = defaultPreset.params.originY,\n offsetX = defaultPreset.params.offsetX,\n offsetY = defaultPreset.params.offsetY,\n worldWidth = defaultPreset.params.worldWidth,\n worldHeight = defaultPreset.params.worldHeight,\n ...props\n}: SpiralProps) {\n const uniforms = {\n // Own uniforms\n u_colorBack: getShaderColorFromString(colorBack),\n u_colorFront: getShaderColorFromString(colorFront),\n u_density: density,\n u_distortion: distortion,\n u_strokeWidth: strokeWidth,\n u_strokeTaper: strokeTaper,\n u_strokeCap: strokeCap,\n u_noiseFrequency: noiseFrequency,\n u_noise: noise,\n u_softness: softness,\n\n // Sizing uniforms\n u_fit: ShaderFitOptions[fit],\n u_scale: scale,\n u_rotation: rotation,\n u_offsetX: offsetX,\n u_offsetY: offsetY,\n u_originX: originX,\n u_originY: originY,\n u_worldWidth: worldWidth,\n u_worldHeight: worldHeight,\n } satisfies SpiralUniforms;\n\n return (\n <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={spiralFragmentShader} uniforms={uniforms} />\n );\n}, colorPropsAreEqual);\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n defaultPatternSizing,\n getShaderColorFromString,\n ShaderFitOptions,\n spiralFragmentShader,\n type ShaderPreset,\n type SpiralParams,\n type SpiralUniforms,\n} from '@paper-design/shaders';\n\nexport interface SpiralProps extends ShaderComponentProps, SpiralParams {}\n\ntype SpiralPreset = ShaderPreset<SpiralParams>;\n\nexport const defaultPreset: SpiralPreset = {\n name: 'Default',\n params: {\n ...defaultPatternSizing,\n scale: 1.3,\n colorBack: '#001429',\n colorFront: '#79D1FF',\n density: 1,\n distortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0,\n noise: 0,\n noiseFrequency: 0,\n softness: 0,\n speed: 1,\n frame: 0,\n },\n};\n\nexport const dropletPreset: SpiralPreset = {\n name: 'Droplet',\n params: {\n ...defaultPatternSizing,\n colorBack: '#effafe',\n colorFront: '#bf40a0',\n density: 0.9,\n distortion: 0,\n strokeWidth: 0.75,\n strokeTaper: 0.18,\n strokeCap: 1,\n noise: 0.74,\n noiseFrequency: 0.33,\n softness: 0.02,\n speed: 1,\n frame: 0,\n },\n};\n\nexport const junglePreset: SpiralPreset = {\n name: 'Jungle',\n params: {\n ...defaultPatternSizing,\n scale: 1.3,\n density: 0.5,\n colorBack: '#a0ef2a',\n colorFront: '#288b18',\n distortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0,\n noise: 1,\n noiseFrequency: 0.25,\n softness: 0,\n speed: 0.75,\n frame: 0,\n },\n};\n\nexport const swirlPreset: SpiralPreset = {\n name: 'Swirl',\n params: {\n ...defaultPatternSizing,\n scale: 0.45,\n colorBack: '#b3e6d9',\n colorFront: '#1a2b4d',\n density: 0.2,\n distortion: 0,\n strokeWidth: 0.5,\n strokeTaper: 0,\n strokeCap: 0,\n noise: 0,\n noiseFrequency: 0.3,\n softness: 0.5,\n speed: 1,\n frame: 0,\n },\n};\n\nexport const spiralPresets: SpiralPreset[] = [defaultPreset, junglePreset, dropletPreset, swirlPreset];\n\nexport const Spiral: React.FC<SpiralProps> = memo(function SpiralImpl({\n // Own props\n speed = defaultPreset.params.speed,\n frame = defaultPreset.params.frame,\n colorBack = defaultPreset.params.colorBack,\n colorFront = defaultPreset.params.colorFront,\n density = defaultPreset.params.density,\n distortion = defaultPreset.params.distortion,\n strokeWidth = defaultPreset.params.strokeWidth,\n strokeTaper = defaultPreset.params.strokeTaper,\n strokeCap = defaultPreset.params.strokeCap,\n noiseFrequency = defaultPreset.params.noiseFrequency,\n noise = defaultPreset.params.noise,\n softness = defaultPreset.params.softness,\n\n // Sizing props\n fit = defaultPreset.params.fit,\n rotation = defaultPreset.params.rotation,\n scale = defaultPreset.params.scale,\n originX = defaultPreset.params.originX,\n originY = defaultPreset.params.originY,\n offsetX = defaultPreset.params.offsetX,\n offsetY = defaultPreset.params.offsetY,\n worldWidth = defaultPreset.params.worldWidth,\n worldHeight = defaultPreset.params.worldHeight,\n ...props\n}: SpiralProps) {\n const uniforms = {\n // Own uniforms\n u_colorBack: getShaderColorFromString(colorBack),\n u_colorFront: getShaderColorFromString(colorFront),\n u_density: density,\n u_distortion: distortion,\n u_strokeWidth: strokeWidth,\n u_strokeTaper: strokeTaper,\n u_strokeCap: strokeCap,\n u_noiseFrequency: noiseFrequency,\n u_noise: noise,\n u_softness: softness,\n\n // Sizing uniforms\n u_fit: ShaderFitOptions[fit],\n u_scale: scale,\n u_rotation: rotation,\n u_offsetX: offsetX,\n u_offsetY: offsetY,\n u_originX: originX,\n u_originY: originY,\n u_worldWidth: worldWidth,\n u_worldHeight: worldHeight,\n } satisfies SpiralUniforms;\n\n return (\n <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={spiralFragmentShader} uniforms={uniforms} />\n );\n}, colorPropsAreEqual);\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -6,7 +6,7 @@ type StaticMeshGradientPreset = ShaderPreset<StaticMeshGradientParams>;
6
6
  export declare const defaultPreset: StaticMeshGradientPreset;
7
7
  export declare const seaPreset: StaticMeshGradientPreset;
8
8
  export declare const sixtiesPreset: StaticMeshGradientPreset;
9
- export declare const impressionismPreset: StaticMeshGradientPreset;
9
+ export declare const sunsetPreset: StaticMeshGradientPreset;
10
10
  export declare const staticMeshGradientPresets: StaticMeshGradientPreset[];
11
11
  export declare const StaticMeshGradient: React.FC<StaticMeshGradientProps>;
12
12
  export {};
@@ -9,6 +9,7 @@ import { colorPropsAreEqual } from "../color-props-are-equal.js";
9
9
  import {
10
10
  defaultObjectSizing,
11
11
  getShaderColorFromString,
12
+ getShaderNoiseTexture,
12
13
  staticMeshGradientFragmentShader,
13
14
  ShaderFitOptions
14
15
  } from "@paper-design/shaders";
@@ -19,13 +20,13 @@ const defaultPreset = {
19
20
  ...defaultObjectSizing,
20
21
  speed: 0,
21
22
  frame: 0,
22
- colors: ["#264653", "#9c2b2b", "#f4a261", "#ffffff"],
23
- positions: 0,
24
- waveX: 0.6,
25
- waveXShift: 0.7,
26
- waveY: 0.7,
27
- waveYShift: 0.7,
28
- mixing: 0.5,
23
+ colors: ["#ffad0a", "#6200ff", "#e2a3ff", "#ff99fd"],
24
+ positions: 2,
25
+ waveX: 1,
26
+ waveXShift: 0.6,
27
+ waveY: 1,
28
+ waveYShift: 0.21,
29
+ mixing: 0.93,
29
30
  grainMixer: 0,
30
31
  grainOverlay: 0
31
32
  }
@@ -64,19 +65,19 @@ const sixtiesPreset = {
64
65
  grainOverlay: 0.78
65
66
  }
66
67
  };
67
- const impressionismPreset = {
68
- name: "Impressionism",
68
+ const sunsetPreset = {
69
+ name: "Sunset",
69
70
  params: {
70
71
  ...defaultObjectSizing,
71
72
  speed: 0,
72
73
  frame: 0,
73
- colors: ["#ffad0a", "#6200ff", "#e2a3ff", "#ff99fd"],
74
- positions: 2,
75
- waveX: 1,
76
- waveXShift: 0.6,
77
- waveY: 1,
78
- waveYShift: 0.21,
79
- mixing: 0.93,
74
+ colors: ["#264653", "#9c2b2b", "#f4a261", "#ffffff"],
75
+ positions: 0,
76
+ waveX: 0.6,
77
+ waveXShift: 0.7,
78
+ waveY: 0.7,
79
+ waveYShift: 0.7,
80
+ mixing: 0.5,
80
81
  grainMixer: 0,
81
82
  grainOverlay: 0
82
83
  }
@@ -84,7 +85,7 @@ const impressionismPreset = {
84
85
  const staticMeshGradientPresets = [
85
86
  defaultPreset,
86
87
  sixtiesPreset,
87
- impressionismPreset,
88
+ sunsetPreset,
88
89
  seaPreset
89
90
  ];
90
91
  const StaticMeshGradient = memo(function StaticMeshGradientImpl({
@@ -124,6 +125,7 @@ const StaticMeshGradient = memo(function StaticMeshGradientImpl({
124
125
  u_mixing: mixing,
125
126
  u_grainMixer: grainMixer,
126
127
  u_grainOverlay: grainOverlay,
128
+ u_noiseTexture: getShaderNoiseTexture(),
127
129
  // Sizing uniforms
128
130
  u_fit: ShaderFitOptions[fit],
129
131
  u_rotation: rotation,
@@ -149,9 +151,9 @@ const StaticMeshGradient = memo(function StaticMeshGradientImpl({
149
151
  export {
150
152
  StaticMeshGradient,
151
153
  defaultPreset,
152
- impressionismPreset,
153
154
  seaPreset,
154
155
  sixtiesPreset,
155
- staticMeshGradientPresets
156
+ staticMeshGradientPresets,
157
+ sunsetPreset
156
158
  };
157
159
  //# sourceMappingURL=static-mesh-gradient.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/shaders/static-mesh-gradient.tsx"],
4
- "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n defaultObjectSizing,\n getShaderColorFromString,\n staticMeshGradientFragmentShader,\n ShaderFitOptions,\n type StaticMeshGradientParams,\n type StaticMeshGradientUniforms,\n type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface StaticMeshGradientProps extends ShaderComponentProps, StaticMeshGradientParams {}\n\ntype StaticMeshGradientPreset = ShaderPreset<StaticMeshGradientParams>;\n\nexport const defaultPreset: StaticMeshGradientPreset = {\n name: 'Default',\n params: {\n ...defaultObjectSizing,\n speed: 0,\n frame: 0,\n colors: ['#264653', '#9c2b2b', '#f4a261', '#ffffff'],\n positions: 0,\n waveX: 0.6,\n waveXShift: 0.7,\n waveY: 0.7,\n waveYShift: 0.7,\n mixing: 0.5,\n grainMixer: 0,\n grainOverlay: 0,\n },\n};\n\nexport const seaPreset: StaticMeshGradientPreset = {\n name: 'Sea',\n params: {\n ...defaultObjectSizing,\n speed: 0,\n frame: 0,\n colors: ['#013b65', '#03738c', '#a3d3ff', '#f2faef'],\n positions: 0,\n waveX: 0.53,\n waveXShift: 0.0,\n waveY: 0.95,\n waveYShift: 0.64,\n mixing: 0.5,\n grainMixer: 0.0,\n grainOverlay: 0.0,\n },\n};\n\nexport const sixtiesPreset: StaticMeshGradientPreset = {\n name: '1960s',\n params: {\n ...defaultObjectSizing,\n speed: 0,\n frame: 0,\n colors: ['#000000', '#082400', '#b1aa91', '#8e8c15'],\n positions: 42,\n waveX: 0.45,\n waveXShift: 0.0,\n waveY: 1.0,\n waveYShift: 0.0,\n mixing: 0.0,\n grainMixer: 0.37,\n grainOverlay: 0.78,\n },\n};\n\nexport const impressionismPreset: StaticMeshGradientPreset = {\n name: 'Impressionism',\n params: {\n ...defaultObjectSizing,\n speed: 0,\n frame: 0,\n colors: ['#ffad0a', '#6200ff', '#e2a3ff', '#ff99fd'],\n positions: 2,\n waveX: 1.0,\n waveXShift: 0.6,\n waveY: 1.0,\n waveYShift: 0.21,\n mixing: 0.93,\n grainMixer: 0.0,\n grainOverlay: 0.0,\n },\n};\n\nexport const staticMeshGradientPresets: StaticMeshGradientPreset[] = [\n defaultPreset,\n sixtiesPreset,\n impressionismPreset,\n seaPreset,\n];\n\nexport const StaticMeshGradient: React.FC<StaticMeshGradientProps> = memo(function StaticMeshGradientImpl({\n // Own props\n speed = defaultPreset.params.speed,\n frame = defaultPreset.params.frame,\n colors = defaultPreset.params.colors,\n positions = defaultPreset.params.positions,\n waveX = defaultPreset.params.waveX,\n waveXShift = defaultPreset.params.waveXShift,\n waveY = defaultPreset.params.waveY,\n waveYShift = defaultPreset.params.waveYShift,\n mixing = defaultPreset.params.mixing,\n grainMixer = defaultPreset.params.grainMixer,\n grainOverlay = defaultPreset.params.grainOverlay,\n\n // Sizing props\n fit = defaultPreset.params.fit,\n rotation = defaultPreset.params.rotation,\n scale = defaultPreset.params.scale,\n originX = defaultPreset.params.originX,\n originY = defaultPreset.params.originY,\n offsetX = defaultPreset.params.offsetX,\n offsetY = defaultPreset.params.offsetY,\n worldWidth = defaultPreset.params.worldWidth,\n worldHeight = defaultPreset.params.worldHeight,\n ...props\n}: StaticMeshGradientProps) {\n const uniforms = {\n // Own uniforms\n u_colors: colors.map(getShaderColorFromString),\n u_colorsCount: colors.length,\n u_positions: positions,\n u_waveX: waveX,\n u_waveXShift: waveXShift,\n u_waveY: waveY,\n u_waveYShift: waveYShift,\n u_mixing: mixing,\n u_grainMixer: grainMixer,\n u_grainOverlay: grainOverlay,\n\n // Sizing uniforms\n u_fit: ShaderFitOptions[fit],\n u_rotation: rotation,\n u_scale: scale,\n u_offsetX: offsetX,\n u_offsetY: offsetY,\n u_originX: originX,\n u_originY: originY,\n u_worldWidth: worldWidth,\n u_worldHeight: worldHeight,\n } satisfies StaticMeshGradientUniforms;\n\n return (\n <ShaderMount\n {...props}\n speed={speed}\n frame={frame}\n fragmentShader={staticMeshGradientFragmentShader}\n uniforms={uniforms}\n />\n );\n}, colorPropsAreEqual);\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n defaultObjectSizing,\n getShaderColorFromString,\n getShaderNoiseTexture,\n staticMeshGradientFragmentShader,\n ShaderFitOptions,\n type StaticMeshGradientParams,\n type StaticMeshGradientUniforms,\n type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface StaticMeshGradientProps extends ShaderComponentProps, StaticMeshGradientParams {}\n\ntype StaticMeshGradientPreset = ShaderPreset<StaticMeshGradientParams>;\n\nexport const defaultPreset: StaticMeshGradientPreset = {\n name: 'Default',\n params: {\n ...defaultObjectSizing,\n speed: 0,\n frame: 0,\n colors: ['#ffad0a', '#6200ff', '#e2a3ff', '#ff99fd'],\n positions: 2,\n waveX: 1.0,\n waveXShift: 0.6,\n waveY: 1.0,\n waveYShift: 0.21,\n mixing: 0.93,\n grainMixer: 0.0,\n grainOverlay: 0.0,\n },\n};\n\nexport const seaPreset: StaticMeshGradientPreset = {\n name: 'Sea',\n params: {\n ...defaultObjectSizing,\n speed: 0,\n frame: 0,\n colors: ['#013b65', '#03738c', '#a3d3ff', '#f2faef'],\n positions: 0,\n waveX: 0.53,\n waveXShift: 0.0,\n waveY: 0.95,\n waveYShift: 0.64,\n mixing: 0.5,\n grainMixer: 0.0,\n grainOverlay: 0.0,\n },\n};\n\nexport const sixtiesPreset: StaticMeshGradientPreset = {\n name: '1960s',\n params: {\n ...defaultObjectSizing,\n speed: 0,\n frame: 0,\n colors: ['#000000', '#082400', '#b1aa91', '#8e8c15'],\n positions: 42,\n waveX: 0.45,\n waveXShift: 0.0,\n waveY: 1.0,\n waveYShift: 0.0,\n mixing: 0.0,\n grainMixer: 0.37,\n grainOverlay: 0.78,\n },\n};\n\nexport const sunsetPreset: StaticMeshGradientPreset = {\n name: 'Sunset',\n params: {\n ...defaultObjectSizing,\n speed: 0,\n frame: 0,\n colors: ['#264653', '#9c2b2b', '#f4a261', '#ffffff'],\n positions: 0,\n waveX: 0.6,\n waveXShift: 0.7,\n waveY: 0.7,\n waveYShift: 0.7,\n mixing: 0.5,\n grainMixer: 0,\n grainOverlay: 0,\n },\n};\n\nexport const staticMeshGradientPresets: StaticMeshGradientPreset[] = [\n defaultPreset,\n sixtiesPreset,\n sunsetPreset,\n seaPreset,\n];\n\nexport const StaticMeshGradient: React.FC<StaticMeshGradientProps> = memo(function StaticMeshGradientImpl({\n // Own props\n speed = defaultPreset.params.speed,\n frame = defaultPreset.params.frame,\n colors = defaultPreset.params.colors,\n positions = defaultPreset.params.positions,\n waveX = defaultPreset.params.waveX,\n waveXShift = defaultPreset.params.waveXShift,\n waveY = defaultPreset.params.waveY,\n waveYShift = defaultPreset.params.waveYShift,\n mixing = defaultPreset.params.mixing,\n grainMixer = defaultPreset.params.grainMixer,\n grainOverlay = defaultPreset.params.grainOverlay,\n\n // Sizing props\n fit = defaultPreset.params.fit,\n rotation = defaultPreset.params.rotation,\n scale = defaultPreset.params.scale,\n originX = defaultPreset.params.originX,\n originY = defaultPreset.params.originY,\n offsetX = defaultPreset.params.offsetX,\n offsetY = defaultPreset.params.offsetY,\n worldWidth = defaultPreset.params.worldWidth,\n worldHeight = defaultPreset.params.worldHeight,\n ...props\n}: StaticMeshGradientProps) {\n const uniforms = {\n // Own uniforms\n u_colors: colors.map(getShaderColorFromString),\n u_colorsCount: colors.length,\n u_positions: positions,\n u_waveX: waveX,\n u_waveXShift: waveXShift,\n u_waveY: waveY,\n u_waveYShift: waveYShift,\n u_mixing: mixing,\n u_grainMixer: grainMixer,\n u_grainOverlay: grainOverlay,\n u_noiseTexture: getShaderNoiseTexture(),\n\n // Sizing uniforms\n u_fit: ShaderFitOptions[fit],\n u_rotation: rotation,\n u_scale: scale,\n u_offsetX: offsetX,\n u_offsetY: offsetY,\n u_originX: originX,\n u_originY: originY,\n u_worldWidth: worldWidth,\n u_worldHeight: worldHeight,\n } satisfies StaticMeshGradientUniforms;\n\n return (\n <ShaderMount\n {...props}\n speed={speed}\n frame={frame}\n fragmentShader={staticMeshGradientFragmentShader}\n uniforms={uniforms}\n />\n );\n}, colorPropsAreEqual);\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -5,7 +5,7 @@ export interface StaticRadialGradientProps extends ShaderComponentProps, StaticR
5
5
  type StaticRadialGradientPreset = ShaderPreset<StaticRadialGradientParams>;
6
6
  export declare const defaultPreset: StaticRadialGradientPreset;
7
7
  export declare const crossSectionPreset: StaticRadialGradientPreset;
8
- export declare const glowPreset: StaticRadialGradientPreset;
8
+ export declare const radialPreset: StaticRadialGradientPreset;
9
9
  export declare const loFiPreset: StaticRadialGradientPreset;
10
10
  export declare const staticRadialGradientPresets: StaticRadialGradientPreset[];
11
11
  export declare const StaticRadialGradient: React.FC<StaticRadialGradientProps>;