@paper-design/shaders-react 0.0.44 → 0.0.46

package/dist/shaders/liquid-metal.js

@@ -16,6 +16,24 @@ import {
 import { jsx } from "react/jsx-runtime";
 const defaultPreset = {
   name: "Default",
+  params: {
+    ...defaultObjectSizing,
+    scale: 0.7,
+    speed: 1,
+    frame: 8e3,
+    colorBack: "#000000",
+    colorTint: "#ffffff",
+    softness: 0.3,
+    repetition: 4,
+    shiftRed: 0.3,
+    shiftBlue: 0.3,
+    distortion: 0.1,
+    contour: 1,
+    shape: "circle"
+  }
+};
+const dropsPreset = {
+  name: "Drops",
   params: {
     ...defaultObjectSizing,
     speed: 1,
@@ -31,8 +49,8 @@ const defaultPreset = {
     shape: "metaballs"
   }
 };
-const fullScreenPreset = {
-  name: "Full Screen",
+const containedPreset = {
+  name: "Contained",
   params: {
     ...defaultObjectSizing,
     speed: 1,
@@ -50,26 +68,8 @@ const fullScreenPreset = {
     worldHeight: 0
   }
 };
-const spherePreset = {
-  name: "Sphere",
-  params: {
-    ...defaultObjectSizing,
-    scale: 0.7,
-    speed: 2,
-    frame: 0,
-    colorBack: "#ffffff00",
-    colorTint: "#d1e0ff",
-    softness: 0.45,
-    repetition: 4,
-    shiftRed: 1,
-    shiftBlue: 0.3,
-    distortion: 0.1,
-    contour: 0.4,
-    shape: "circle"
-  }
-};
-const dropsPreset = {
-  name: "Drops",
+const fullScreenPreset = {
+  name: "Full Screen",
   params: {
     ...defaultObjectSizing,
     scale: 2.2,
@@ -83,10 +83,10 @@ const dropsPreset = {
     shiftBlue: -1,
     distortion: 0.1,
     contour: 1,
-    shape: "metaballs"
+    shape: "none"
   }
 };
-const liquidMetalPresets = [defaultPreset, spherePreset, dropsPreset, fullScreenPreset];
+const liquidMetalPresets = [defaultPreset, containedPreset, dropsPreset, fullScreenPreset];
 const LiquidMetal = memo(function LiquidMetalImpl({
   // Own props
   colorBack = defaultPreset.params.colorBack,
@@ -147,10 +147,10 @@ const LiquidMetal = memo(function LiquidMetalImpl({
 }, colorPropsAreEqual);
 export {
   LiquidMetal,
+  containedPreset,
   defaultPreset,
   dropsPreset,
   fullScreenPreset,
-  liquidMetalPresets,
-  spherePreset
+  liquidMetalPresets
 };
 //# sourceMappingURL=liquid-metal.js.map

package/dist/shaders/liquid-metal.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/liquid-metal.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  liquidMetalFragmentShader,\n  ShaderFitOptions,\n  type LiquidMetalUniforms,\n  type LiquidMetalParams,\n  type ShaderPreset,\n  defaultObjectSizing,\n  getShaderColorFromString,\n  LiquidMetalShapes,\n} from '@paper-design/shaders';\n\nexport interface LiquidMetalProps extends ShaderComponentProps, LiquidMetalParams {}\n\ntype LiquidMetalPreset = ShaderPreset<LiquidMetalParams>;\n\nexport const defaultPreset: LiquidMetalPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#ffffff00',\n    colorTint: '#ffffff',\n    softness: 0.3,\n    repetition: 3,\n    shiftRed: 0.3,\n    shiftBlue: 0.3,\n    distortion: 0.3,\n    contour: 0.88,\n    shape: 'metaballs',\n  },\n};\n\nexport const fullScreenPreset: LiquidMetalPreset = {\n  name: 'Full Screen',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#ffffff00',\n    colorTint: '#ffffff',\n    softness: 0.3,\n    repetition: 3,\n    shiftRed: 0.3,\n    shiftBlue: 0.3,\n    distortion: 0.07,\n    contour: 0,\n    shape: 'none',\n    worldWidth: 0,\n    worldHeight: 0,\n  },\n};\n\nexport const spherePreset: LiquidMetalPreset = {\n  name: 'Sphere',\n  params: {\n    ...defaultObjectSizing,\n    scale: 0.7,\n    speed: 2,\n    frame: 0,\n    colorBack: '#ffffff00',\n    colorTint: '#d1e0ff',\n    softness: 0.45,\n    repetition: 4,\n    shiftRed: 1,\n    shiftBlue: 0.3,\n    distortion: 0.1,\n    contour: 0.4,\n    shape: 'circle',\n  },\n};\n\nexport const dropsPreset: LiquidMetalPreset = {\n  name: 'Drops',\n  params: {\n    ...defaultObjectSizing,\n    scale: 2.2,\n    speed: 1,\n    frame: 0,\n    colorBack: '#00042e',\n    colorTint: '#5b4dc7',\n    softness: 0.45,\n    repetition: 4,\n    shiftRed: -0.5,\n    shiftBlue: -1,\n    distortion: 0.1,\n    contour: 1,\n    shape: 'metaballs',\n  },\n};\n\nexport const liquidMetalPresets: LiquidMetalPreset[] = [defaultPreset, spherePreset, dropsPreset, fullScreenPreset];\n\nexport const LiquidMetal: React.FC<LiquidMetalProps> = memo(function LiquidMetalImpl({\n  // Own props\n  colorBack = defaultPreset.params.colorBack,\n  colorTint = defaultPreset.params.colorTint,\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  softness = defaultPreset.params.softness,\n  repetition = defaultPreset.params.repetition,\n  shiftRed = defaultPreset.params.shiftRed,\n  shiftBlue = defaultPreset.params.shiftBlue,\n  distortion = defaultPreset.params.distortion,\n  contour = defaultPreset.params.contour,\n  shape = defaultPreset.params.shape,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: LiquidMetalProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colorTint: getShaderColorFromString(colorTint),\n\n    u_softness: softness,\n    u_repetition: repetition,\n    u_shiftRed: shiftRed,\n    u_shiftBlue: shiftBlue,\n    u_distortion: distortion,\n    u_contour: contour,\n    u_shape: LiquidMetalShapes[shape],\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies LiquidMetalUniforms;\n\n  return (\n    <ShaderMount\n      {...props}\n      speed={speed}\n      frame={frame}\n      fragmentShader={liquidMetalFragmentShader}\n      uniforms={uniforms}\n    />\n  );\n}, colorPropsAreEqual);\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  liquidMetalFragmentShader,\n  ShaderFitOptions,\n  type LiquidMetalUniforms,\n  type LiquidMetalParams,\n  type ShaderPreset,\n  defaultObjectSizing,\n  getShaderColorFromString,\n  LiquidMetalShapes,\n} from '@paper-design/shaders';\n\nexport interface LiquidMetalProps extends ShaderComponentProps, LiquidMetalParams {}\n\ntype LiquidMetalPreset = ShaderPreset<LiquidMetalParams>;\n\nexport const defaultPreset: LiquidMetalPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    scale: 0.7,\n    speed: 1,\n    frame: 8000,\n    colorBack: '#000000',\n    colorTint: '#ffffff',\n    softness: 0.3,\n    repetition: 4,\n    shiftRed: 0.3,\n    shiftBlue: 0.3,\n    distortion: 0.1,\n    contour: 1,\n    shape: 'circle',\n  },\n};\n\nexport const dropsPreset: LiquidMetalPreset = {\n  name: 'Drops',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#ffffff00',\n    colorTint: '#ffffff',\n    softness: 0.3,\n    repetition: 3,\n    shiftRed: 0.3,\n    shiftBlue: 0.3,\n    distortion: 0.3,\n    contour: 0.88,\n    shape: 'metaballs',\n  },\n};\n\nexport const containedPreset: LiquidMetalPreset = {\n  name: 'Contained',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colorBack: '#ffffff00',\n    colorTint: '#ffffff',\n    softness: 0.3,\n    repetition: 3,\n    shiftRed: 0.3,\n    shiftBlue: 0.3,\n    distortion: 0.07,\n    contour: 0,\n    shape: 'none',\n    worldWidth: 0,\n    worldHeight: 0,\n  },\n};\n\nexport const fullScreenPreset: LiquidMetalPreset = {\n  name: 'Full Screen',\n  params: {\n    ...defaultObjectSizing,\n    scale: 2.2,\n    speed: 1,\n    frame: 0,\n    colorBack: '#00042e',\n    colorTint: '#5b4dc7',\n    softness: 0.45,\n    repetition: 4,\n    shiftRed: -0.5,\n    shiftBlue: -1,\n    distortion: 0.1,\n    contour: 1,\n    shape: 'none',\n  },\n};\n\nexport const liquidMetalPresets: LiquidMetalPreset[] = [defaultPreset, containedPreset, dropsPreset, fullScreenPreset];\n\nexport const LiquidMetal: React.FC<LiquidMetalProps> = memo(function LiquidMetalImpl({\n  // Own props\n  colorBack = defaultPreset.params.colorBack,\n  colorTint = defaultPreset.params.colorTint,\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  softness = defaultPreset.params.softness,\n  repetition = defaultPreset.params.repetition,\n  shiftRed = defaultPreset.params.shiftRed,\n  shiftBlue = defaultPreset.params.shiftBlue,\n  distortion = defaultPreset.params.distortion,\n  contour = defaultPreset.params.contour,\n  shape = defaultPreset.params.shape,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: LiquidMetalProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colorTint: getShaderColorFromString(colorTint),\n\n    u_softness: softness,\n    u_repetition: repetition,\n    u_shiftRed: shiftRed,\n    u_shiftBlue: shiftBlue,\n    u_distortion: distortion,\n    u_contour: contour,\n    u_shape: LiquidMetalShapes[shape],\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies LiquidMetalUniforms;\n\n  return (\n    <ShaderMount\n      {...props}\n      speed={speed}\n      frame={frame}\n      fragmentShader={liquidMetalFragmentShader}\n      uniforms={uniforms}\n    />\n  );\n}, colorPropsAreEqual);\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/shaders/mesh-gradient.js

@@ -19,7 +19,7 @@ const defaultPreset = {
     ...defaultObjectSizing,
     speed: 1,
     frame: 0,
-    colors: ["#5100ff", "#00ff80", "#ffcc00", "#ea00ff"],
+    colors: ["#e0eaff", "#241d9a", "#f75092", "#9f50d3"],
     distortion: 0.8,
     swirl: 0.1
   }

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/mesh-gradient.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  meshGradientFragmentShader,\n  ShaderFitOptions,\n  type MeshGradientParams,\n  type MeshGradientUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface MeshGradientProps extends ShaderComponentProps, MeshGradientParams {}\n\ntype MeshGradientPreset = ShaderPreset<MeshGradientParams>;\n\nexport const defaultPreset: MeshGradientPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colors: ['#5100ff', '#00ff80', '#ffcc00', '#ea00ff'],\n    distortion: 0.8,\n    swirl: 0.1,\n  },\n};\n\nexport const purplePreset: MeshGradientPreset = {\n  name: 'Purple',\n  params: {\n    ...defaultObjectSizing,\n    speed: 0.6,\n    frame: 0,\n    colors: ['#aaa7d7', '#3c2b8e'],\n    distortion: 1,\n    swirl: 1,\n  },\n};\n\nexport const beachPreset: MeshGradientPreset = {\n  name: 'Beach',\n  params: {\n    ...defaultObjectSizing,\n    speed: 0.1,\n    frame: 0,\n    colors: ['#bcecf6', '#00aaff', '#00f7ff', '#ffd447'],\n    distortion: 0.8,\n    swirl: 0.35,\n  },\n};\n\nexport const inkPreset: MeshGradientPreset = {\n  name: 'Ink',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colors: ['#ffffff', '#000000'],\n    distortion: 1,\n    swirl: 0.2,\n    rotation: 90,\n  },\n};\n\nexport const meshGradientPresets: MeshGradientPreset[] = [defaultPreset, inkPreset, purplePreset, beachPreset];\n\nexport const MeshGradient: React.FC<MeshGradientProps> = memo(function MeshGradientImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colors = defaultPreset.params.colors,\n  distortion = defaultPreset.params.distortion,\n  swirl = defaultPreset.params.swirl,\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}: MeshGradientProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_distortion: distortion,\n    u_swirl: swirl,\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 MeshGradientUniforms;\n\n  return (\n    <ShaderMount\n      {...props}\n      speed={speed}\n      frame={frame}\n      fragmentShader={meshGradientFragmentShader}\n      uniforms={uniforms}\n    />\n  );\n}, colorPropsAreEqual);\n"],
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  meshGradientFragmentShader,\n  ShaderFitOptions,\n  type MeshGradientParams,\n  type MeshGradientUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface MeshGradientProps extends ShaderComponentProps, MeshGradientParams {}\n\ntype MeshGradientPreset = ShaderPreset<MeshGradientParams>;\n\nexport const defaultPreset: MeshGradientPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colors: ['#e0eaff', '#241d9a', '#f75092', '#9f50d3'],\n    distortion: 0.8,\n    swirl: 0.1,\n  },\n};\n\nexport const purplePreset: MeshGradientPreset = {\n  name: 'Purple',\n  params: {\n    ...defaultObjectSizing,\n    speed: 0.6,\n    frame: 0,\n    colors: ['#aaa7d7', '#3c2b8e'],\n    distortion: 1,\n    swirl: 1,\n  },\n};\n\nexport const beachPreset: MeshGradientPreset = {\n  name: 'Beach',\n  params: {\n    ...defaultObjectSizing,\n    speed: 0.1,\n    frame: 0,\n    colors: ['#bcecf6', '#00aaff', '#00f7ff', '#ffd447'],\n    distortion: 0.8,\n    swirl: 0.35,\n  },\n};\n\nexport const inkPreset: MeshGradientPreset = {\n  name: 'Ink',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colors: ['#ffffff', '#000000'],\n    distortion: 1,\n    swirl: 0.2,\n    rotation: 90,\n  },\n};\n\nexport const meshGradientPresets: MeshGradientPreset[] = [defaultPreset, inkPreset, purplePreset, beachPreset];\n\nexport const MeshGradient: React.FC<MeshGradientProps> = memo(function MeshGradientImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colors = defaultPreset.params.colors,\n  distortion = defaultPreset.params.distortion,\n  swirl = defaultPreset.params.swirl,\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}: MeshGradientProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_distortion: distortion,\n    u_swirl: swirl,\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 MeshGradientUniforms;\n\n  return (\n    <ShaderMount\n      {...props}\n      speed={speed}\n      frame={frame}\n      fragmentShader={meshGradientFragmentShader}\n      uniforms={uniforms}\n    />\n  );\n}, colorPropsAreEqual);\n"],
   "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AAiGH;AA3FG,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,SAAS;AAAA,IACnD,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AACF;AAEO,MAAM,eAAmC;AAAA,EAC9C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,SAAS;AAAA,IAC7B,YAAY;AAAA,IACZ,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,WAAW,SAAS;AAAA,IACnD,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AACF;AAEO,MAAM,YAAgC;AAAA,EAC3C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,SAAS;AAAA,IAC7B,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,UAAU;AAAA,EACZ;AACF;AAEO,MAAM,sBAA4C,CAAC,eAAe,WAAW,cAAc,WAAW;AAEtG,MAAM,eAA4C,KAAK,SAAS,iBAAiB;AAAA;AAAA,EAEtF,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,SAAS,cAAc,OAAO;AAAA,EAC9B,aAAa,cAAc,OAAO;AAAA,EAClC,QAAQ,cAAc,OAAO;AAAA;AAAA,EAG7B,MAAM,cAAc,OAAO;AAAA,EAC3B,WAAW,cAAc,OAAO;AAAA,EAChC,QAAQ,cAAc,OAAO;AAAA,EAC7B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAsB;AACpB,QAAM,WAAW;AAAA;AAAA,IAEf,UAAU,OAAO,IAAI,wBAAwB;AAAA,IAC7C,eAAe,OAAO;AAAA,IACtB,cAAc;AAAA,IACd,SAAS;AAAA;AAAA,IAGT,OAAO,iBAAiB,GAAG;AAAA,IAC3B,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA,gBAAgB;AAAA,MAChB;AAAA;AAAA,EACF;AAEJ,GAAG,kBAAkB;",
   "names": []
 }

package/dist/shaders/metaballs.d.ts

@@ -6,7 +6,7 @@ type MetaballsPreset = ShaderPreset<MetaballsParams>;
 export declare const defaultPreset: MetaballsPreset;
 export declare const inkDropsPreset: MetaballsPreset;
 export declare const backgroundPreset: MetaballsPreset;
-export declare const metallicPreset: MetaballsPreset;
+export declare const solarPreset: MetaballsPreset;
 export declare const metaballsPresets: MetaballsPreset[];
 export declare const Metaballs: React.FC<MetaballsProps>;
 export {};

package/dist/shaders/metaballs.js

@@ -9,6 +9,7 @@ import { colorPropsAreEqual } from "../color-props-are-equal.js";
 import {
   defaultObjectSizing,
   getShaderColorFromString,
+  getShaderNoiseTexture,
   metaballsFragmentShader,
   ShaderFitOptions
 } from "@paper-design/shaders";
@@ -20,10 +21,10 @@ const defaultPreset = {
     scale: 1,
     speed: 1,
     frame: 0,
-    colorBack: "#103086",
-    colors: ["#FFC802", "#FF5601", "#FFC206"],
-    count: 7,
-    size: 0.75
+    colorBack: "#121212",
+    colors: ["#6e33cc", "#ff5500", "#ffc105", "#ffc800", "#f585ff"],
+    count: 10,
+    size: 0.83
   }
 };
 const inkDropsPreset = {
@@ -54,20 +55,20 @@ const backgroundPreset = {
     offsetX: -0.3
   }
 };
-const metallicPreset = {
-  name: "Metallic",
+const solarPreset = {
+  name: "Solar",
   params: {
     ...defaultObjectSizing,
-    speed: 2,
+    speed: 1,
     frame: 0,
-    colors: ["#000000bb", "#00000000", "#33ffaa54"],
-    colorBack: "#003e6b",
-    count: 10,
-    size: 0.81,
-    scale: 1.7
+    colors: ["#ffc800", "#ff5500", "#ffc105"],
+    colorBack: "#102f84",
+    count: 7,
+    size: 0.75,
+    scale: 1
   }
 };
-const metaballsPresets = [defaultPreset, inkDropsPreset, metallicPreset, backgroundPreset];
+const metaballsPresets = [defaultPreset, inkDropsPreset, solarPreset, backgroundPreset];
 const Metaballs = memo(function MetaballsImpl({
   // Own props
   speed = defaultPreset.params.speed,
@@ -95,6 +96,7 @@ const Metaballs = memo(function MetaballsImpl({
     u_colorsCount: colors.length,
     u_size: size,
     u_count: count,
+    u_noiseTexture: getShaderNoiseTexture(),
     // Sizing uniforms
     u_fit: ShaderFitOptions[fit],
     u_rotation: rotation,
@@ -114,6 +116,6 @@ export {
   defaultPreset,
   inkDropsPreset,
   metaballsPresets,
-  metallicPreset
+  solarPreset
 };
 //# sourceMappingURL=metaballs.js.map

package/dist/shaders/metaballs.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/metaballs.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  metaballsFragmentShader,\n  ShaderFitOptions,\n  type MetaballsParams,\n  type MetaballsUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface MetaballsProps extends ShaderComponentProps, MetaballsParams {}\n\ntype MetaballsPreset = ShaderPreset<MetaballsParams>;\n\nexport const defaultPreset: MetaballsPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    scale: 1,\n    speed: 1,\n    frame: 0,\n    colorBack: '#103086',\n    colors: ['#FFC802', '#FF5601', '#FFC206'],\n    count: 7,\n    size: 0.75,\n  },\n};\n\nexport const inkDropsPreset: MetaballsPreset = {\n  name: 'Ink Drops',\n  params: {\n    ...defaultObjectSizing,\n    scale: 1,\n    speed: 2,\n    frame: 0,\n    colorBack: '#ffffff00',\n    colors: ['#000000'],\n    count: 18,\n    size: 0.1,\n  },\n};\n\nexport const backgroundPreset: MetaballsPreset = {\n  name: 'Background',\n  params: {\n    ...defaultObjectSizing,\n    speed: 0.5,\n    frame: 0,\n    colors: ['#ae00ff', '#00ff95', '#ffc105'],\n    colorBack: '#2a273f',\n    count: 13,\n    size: 0.81,\n    scale: 4.0,\n    rotation: 0,\n    offsetX: -0.3,\n  },\n};\n\nexport const metallicPreset: MetaballsPreset = {\n  name: 'Metallic',\n  params: {\n    ...defaultObjectSizing,\n    speed: 2.0,\n    frame: 0,\n    colors: ['#000000bb', '#00000000', '#33ffaa54'],\n    colorBack: '#003e6b',\n    count: 10,\n    size: 0.81,\n    scale: 1.7,\n  },\n};\n\nexport const metaballsPresets: MetaballsPreset[] = [defaultPreset, inkDropsPreset, metallicPreset, backgroundPreset];\n\nexport const Metaballs: React.FC<MetaballsProps> = memo(function MetaballsImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  size = defaultPreset.params.size,\n  count = defaultPreset.params.count,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  rotation = defaultPreset.params.rotation,\n  scale = defaultPreset.params.scale,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: MetaballsProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_size: size,\n    u_count: count,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_rotation: rotation,\n    u_scale: scale,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies MetaballsUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={metaballsFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
-  "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AA4GH;AAtGG,MAAM,gBAAiC;AAAA,EAC5C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,WAAW;AAAA,IACX,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,IACxC,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AACF;AAEO,MAAM,iBAAkC;AAAA,EAC7C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,WAAW;AAAA,IACX,QAAQ,CAAC,SAAS;AAAA,IAClB,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AACF;AAEO,MAAM,mBAAoC;AAAA,EAC/C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,IACxC,WAAW;AAAA,IACX,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,IACP,UAAU;AAAA,IACV,SAAS;AAAA,EACX;AACF;AAEO,MAAM,iBAAkC;AAAA,EAC7C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,aAAa,aAAa,WAAW;AAAA,IAC9C,WAAW;AAAA,IACX,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AACF;AAEO,MAAM,mBAAsC,CAAC,eAAe,gBAAgB,gBAAgB,gBAAgB;AAE5G,MAAM,YAAsC,KAAK,SAAS,cAAc;AAAA;AAAA,EAE7E,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,YAAY,cAAc,OAAO;AAAA,EACjC,SAAS,cAAc,OAAO;AAAA,EAC9B,OAAO,cAAc,OAAO;AAAA,EAC5B,QAAQ,cAAc,OAAO;AAAA;AAAA,EAG7B,MAAM,cAAc,OAAO;AAAA,EAC3B,WAAW,cAAc,OAAO;AAAA,EAChC,QAAQ,cAAc,OAAO;AAAA,EAC7B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAmB;AACjB,QAAM,WAAW;AAAA;AAAA,IAEf,aAAa,yBAAyB,SAAS;AAAA,IAC/C,UAAU,OAAO,IAAI,wBAAwB;AAAA,IAC7C,eAAe,OAAO;AAAA,IACtB,QAAQ;AAAA,IACR,SAAS;AAAA;AAAA,IAGT,OAAO,iBAAiB,GAAG;AAAA,IAC3B,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE,oBAAC,eAAa,GAAG,OAAO,OAAc,OAAc,gBAAgB,yBAAyB,UAAoB;AAErH,GAAG,kBAAkB;",
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  getShaderNoiseTexture,\n  metaballsFragmentShader,\n  ShaderFitOptions,\n  type MetaballsParams,\n  type MetaballsUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface MetaballsProps extends ShaderComponentProps, MetaballsParams {}\n\ntype MetaballsPreset = ShaderPreset<MetaballsParams>;\n\nexport const defaultPreset: MetaballsPreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    scale: 1,\n    speed: 1,\n    frame: 0,\n    colorBack: '#121212',\n    colors: ['#6e33cc', '#ff5500', '#ffc105', '#ffc800', '#f585ff'],\n    count: 10,\n    size: 0.83,\n  },\n};\n\nexport const inkDropsPreset: MetaballsPreset = {\n  name: 'Ink Drops',\n  params: {\n    ...defaultObjectSizing,\n    scale: 1,\n    speed: 2,\n    frame: 0,\n    colorBack: '#ffffff00',\n    colors: ['#000000'],\n    count: 18,\n    size: 0.1,\n  },\n};\n\nexport const backgroundPreset: MetaballsPreset = {\n  name: 'Background',\n  params: {\n    ...defaultObjectSizing,\n    speed: 0.5,\n    frame: 0,\n    colors: ['#ae00ff', '#00ff95', '#ffc105'],\n    colorBack: '#2a273f',\n    count: 13,\n    size: 0.81,\n    scale: 4.0,\n    rotation: 0,\n    offsetX: -0.3,\n  },\n};\n\nexport const solarPreset: MetaballsPreset = {\n  name: 'Solar',\n  params: {\n    ...defaultObjectSizing,\n    speed: 1,\n    frame: 0,\n    colors: ['#ffc800', '#ff5500', '#ffc105'],\n    colorBack: '#102f84',\n    count: 7,\n    size: 0.75,\n    scale: 1,\n  },\n};\n\nexport const metaballsPresets: MetaballsPreset[] = [defaultPreset, inkDropsPreset, solarPreset, backgroundPreset];\n\nexport const Metaballs: React.FC<MetaballsProps> = memo(function MetaballsImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorBack = defaultPreset.params.colorBack,\n  colors = defaultPreset.params.colors,\n  size = defaultPreset.params.size,\n  count = defaultPreset.params.count,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  rotation = defaultPreset.params.rotation,\n  scale = defaultPreset.params.scale,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: MetaballsProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_size: size,\n    u_count: count,\n    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 MetaballsUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={metaballsFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
+  "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AA6GH;AAvGG,MAAM,gBAAiC;AAAA,EAC5C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,WAAW;AAAA,IACX,QAAQ,CAAC,WAAW,WAAW,WAAW,WAAW,SAAS;AAAA,IAC9D,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AACF;AAEO,MAAM,iBAAkC;AAAA,EAC7C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,WAAW;AAAA,IACX,QAAQ,CAAC,SAAS;AAAA,IAClB,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AACF;AAEO,MAAM,mBAAoC;AAAA,EAC/C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,IACxC,WAAW;AAAA,IACX,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,IACP,UAAU;AAAA,IACV,SAAS;AAAA,EACX;AACF;AAEO,MAAM,cAA+B;AAAA,EAC1C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,IACxC,WAAW;AAAA,IACX,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AACF;AAEO,MAAM,mBAAsC,CAAC,eAAe,gBAAgB,aAAa,gBAAgB;AAEzG,MAAM,YAAsC,KAAK,SAAS,cAAc;AAAA;AAAA,EAE7E,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,YAAY,cAAc,OAAO;AAAA,EACjC,SAAS,cAAc,OAAO;AAAA,EAC9B,OAAO,cAAc,OAAO;AAAA,EAC5B,QAAQ,cAAc,OAAO;AAAA;AAAA,EAG7B,MAAM,cAAc,OAAO;AAAA,EAC3B,WAAW,cAAc,OAAO;AAAA,EAChC,QAAQ,cAAc,OAAO;AAAA,EAC7B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAmB;AACjB,QAAM,WAAW;AAAA;AAAA,IAEf,aAAa,yBAAyB,SAAS;AAAA,IAC/C,UAAU,OAAO,IAAI,wBAAwB;AAAA,IAC7C,eAAe,OAAO;AAAA,IACtB,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,gBAAgB,sBAAsB;AAAA;AAAA,IAGtC,OAAO,iBAAiB,GAAG;AAAA,IAC3B,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE,oBAAC,eAAa,GAAG,OAAO,OAAc,OAAc,gBAAgB,yBAAyB,UAAoB;AAErH,GAAG,kBAAkB;",
   "names": []
 }

package/dist/shaders/neuro-noise.js

@@ -20,10 +20,10 @@ const defaultPreset = {
     speed: 1,
     frame: 0,
     colorFront: "#ffffff",
-    colorMid: "#bf9eff",
+    colorMid: "#00a2ff",
     colorBack: "#000000",
-    brightness: 0.15,
-    contrast: 0.6
+    brightness: 0.05,
+    contrast: 0.3
   }
 };
 const sensationPreset = {

package/dist/shaders/neuro-noise.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/neuro-noise.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  neuroNoiseFragmentShader,\n  ShaderFitOptions,\n  type NeuroNoiseParams,\n  type NeuroNoiseUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface NeuroNoiseProps extends ShaderComponentProps, NeuroNoiseParams {}\n\ntype NeuroNoisePreset = ShaderPreset<NeuroNoiseParams>;\n\nexport const defaultPreset: NeuroNoisePreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorFront: '#ffffff',\n    colorMid: '#bf9eff',\n    colorBack: '#000000',\n    brightness: 0.15,\n    contrast: 0.6,\n  },\n};\n\nexport const sensationPreset: NeuroNoisePreset = {\n  name: 'Sensation',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorFront: '#00c8ff',\n    colorMid: '#fbff00',\n    colorBack: '#8b42ff',\n    brightness: 0.19,\n    contrast: 0.12,\n    scale: 3,\n  },\n};\n\nexport const bloodstreamPreset: NeuroNoisePreset = {\n  name: 'Bloodstream',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorFront: '#ff0000',\n    colorMid: '#ff0000',\n    colorBack: '#ffffff',\n    brightness: 0.24,\n    contrast: 0.17,\n    scale: 0.7,\n  },\n};\n\nexport const ghostPreset: NeuroNoisePreset = {\n  name: 'Ghost',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorFront: '#ffffff',\n    colorMid: '#000000',\n    colorBack: '#ffffff',\n    brightness: 0.0,\n    contrast: 1.0,\n    scale: 0.55,\n  },\n};\n\nexport const neuroNoisePresets: NeuroNoisePreset[] = [\n  defaultPreset,\n  sensationPreset,\n  bloodstreamPreset,\n  ghostPreset,\n] as const;\n\nexport const NeuroNoise: React.FC<NeuroNoiseProps> = memo(function NeuroNoiseImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorFront = defaultPreset.params.colorFront,\n  colorMid = defaultPreset.params.colorMid,\n  colorBack = defaultPreset.params.colorBack,\n  brightness = defaultPreset.params.brightness,\n  contrast = defaultPreset.params.contrast,\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}: NeuroNoiseProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorFront: getShaderColorFromString(colorFront),\n    u_colorMid: getShaderColorFromString(colorMid),\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_brightness: brightness,\n    u_contrast: contrast,\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 NeuroNoiseUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={neuroNoiseFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  neuroNoiseFragmentShader,\n  ShaderFitOptions,\n  type NeuroNoiseParams,\n  type NeuroNoiseUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface NeuroNoiseProps extends ShaderComponentProps, NeuroNoiseParams {}\n\ntype NeuroNoisePreset = ShaderPreset<NeuroNoiseParams>;\n\nexport const defaultPreset: NeuroNoisePreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorFront: '#ffffff',\n    colorMid: '#00a2ff',\n    colorBack: '#000000',\n    brightness: 0.05,\n    contrast: 0.3,\n  },\n};\n\nexport const sensationPreset: NeuroNoisePreset = {\n  name: 'Sensation',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorFront: '#00c8ff',\n    colorMid: '#fbff00',\n    colorBack: '#8b42ff',\n    brightness: 0.19,\n    contrast: 0.12,\n    scale: 3,\n  },\n};\n\nexport const bloodstreamPreset: NeuroNoisePreset = {\n  name: 'Bloodstream',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorFront: '#ff0000',\n    colorMid: '#ff0000',\n    colorBack: '#ffffff',\n    brightness: 0.24,\n    contrast: 0.17,\n    scale: 0.7,\n  },\n};\n\nexport const ghostPreset: NeuroNoisePreset = {\n  name: 'Ghost',\n  params: {\n    ...defaultPatternSizing,\n    speed: 1,\n    frame: 0,\n    colorFront: '#ffffff',\n    colorMid: '#000000',\n    colorBack: '#ffffff',\n    brightness: 0.0,\n    contrast: 1.0,\n    scale: 0.55,\n  },\n};\n\nexport const neuroNoisePresets: NeuroNoisePreset[] = [\n  defaultPreset,\n  sensationPreset,\n  bloodstreamPreset,\n  ghostPreset,\n] as const;\n\nexport const NeuroNoise: React.FC<NeuroNoiseProps> = memo(function NeuroNoiseImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorFront = defaultPreset.params.colorFront,\n  colorMid = defaultPreset.params.colorMid,\n  colorBack = defaultPreset.params.colorBack,\n  brightness = defaultPreset.params.brightness,\n  contrast = defaultPreset.params.contrast,\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}: NeuroNoiseProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorFront: getShaderColorFromString(colorFront),\n    u_colorMid: getShaderColorFromString(colorMid),\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_brightness: brightness,\n    u_contrast: contrast,\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 NeuroNoiseUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={neuroNoiseFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
   "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AAmHH;AA7GG,MAAM,gBAAkC;AAAA,EAC7C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,UAAU;AAAA,EACZ;AACF;AAEO,MAAM,kBAAoC;AAAA,EAC/C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,OAAO;AAAA,EACT;AACF;AAEO,MAAM,oBAAsC;AAAA,EACjD,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,OAAO;AAAA,EACT;AACF;AAEO,MAAM,cAAgC;AAAA,EAC3C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,OAAO;AAAA,EACT;AACF;AAEO,MAAM,oBAAwC;AAAA,EACnD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEO,MAAM,aAAwC,KAAK,SAAS,eAAe;AAAA;AAAA,EAEhF,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,aAAa,cAAc,OAAO;AAAA,EAClC,WAAW,cAAc,OAAO;AAAA,EAChC,YAAY,cAAc,OAAO;AAAA,EACjC,aAAa,cAAc,OAAO;AAAA,EAClC,WAAW,cAAc,OAAO;AAAA;AAAA,EAGhC,MAAM,cAAc,OAAO;AAAA,EAC3B,QAAQ,cAAc,OAAO;AAAA,EAC7B,WAAW,cAAc,OAAO;AAAA,EAChC,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAoB;AAClB,QAAM,WAAW;AAAA;AAAA,IAEf,cAAc,yBAAyB,UAAU;AAAA,IACjD,YAAY,yBAAyB,QAAQ;AAAA,IAC7C,aAAa,yBAAyB,SAAS;AAAA,IAC/C,cAAc;AAAA,IACd,YAAY;AAAA;AAAA,IAGZ,OAAO,iBAAiB,GAAG;AAAA,IAC3B,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE,oBAAC,eAAa,GAAG,OAAO,OAAc,OAAc,gBAAgB,0BAA0B,UAAoB;AAEtH,GAAG,kBAAkB;",
   "names": []
 }

package/dist/shaders/paper-texture.d.ts

@@ -0,0 +1,12 @@
+import { type ShaderComponentProps } from '../shader-mount.js';
+import { type PaperTextureParams, type ShaderPreset } from '@paper-design/shaders';
+export interface PaperTextureProps extends ShaderComponentProps, PaperTextureParams {
+}
+type PaperTexturePreset = ShaderPreset<PaperTextureParams>;
+export declare const defaultPreset: PaperTexturePreset;
+export declare const abstractPreset: PaperTexturePreset;
+export declare const cardboardPreset: PaperTexturePreset;
+export declare const detailsPreset: PaperTexturePreset;
+export declare const paperTexturePresets: PaperTexturePreset[];
+export declare const PaperTexture: React.FC<PaperTextureProps>;
+export {};

package/dist/shaders/paper-texture.js

@@ -0,0 +1,195 @@
+/* * * * * * * * * * * * * * * * * * * * * * * * * * * *
+ *                    Paper Shaders                    *
+ *       https://github.com/paper-design/shaders       *
+ * * * * * * * * * * * * * * * * * * * * * * * * * * * */
+
+import { memo } from "react";
+import { ShaderMount } from "../shader-mount.js";
+import { colorPropsAreEqual } from "../color-props-are-equal.js";
+import {
+  defaultObjectSizing,
+  getShaderColorFromString,
+  getShaderNoiseTexture,
+  paperTextureFragmentShader,
+  ShaderFitOptions
+} from "@paper-design/shaders";
+import { jsx } from "react/jsx-runtime";
+const defaultPreset = {
+  name: "Default",
+  params: {
+    ...defaultObjectSizing,
+    // fit: 'cover',
+    scale: 0.6,
+    speed: 0,
+    frame: 0,
+    colorFront: "#9fadbc",
+    colorBack: "#ffffff",
+    image: "/images/image-filters/0018.webp",
+    contrast: 0.3,
+    roughness: 0.4,
+    fiber: 0.3,
+    fiberScale: 1,
+    crumples: 0.3,
+    crumplesScale: 0.6,
+    folds: 0.65,
+    foldsNumber: 5,
+    blur: 0,
+    drops: 0.2,
+    seed: 5.8
+  }
+};
+const abstractPreset = {
+  name: "Abstract",
+  params: {
+    ...defaultObjectSizing,
+    speed: 0,
+    frame: 0,
+    scale: 0.6,
+    colorFront: "#00eeff",
+    colorBack: "#ff0a81",
+    image: "/images/image-filters/0018.webp",
+    contrast: 0.85,
+    roughness: 0,
+    fiber: 0.1,
+    fiberScale: 1,
+    crumples: 0,
+    crumplesScale: 1,
+    folds: 1,
+    foldsNumber: 3,
+    blur: 0,
+    drops: 0.2,
+    seed: 2.2
+  }
+};
+const cardboardPreset = {
+  name: "Cardboard",
+  params: {
+    ...defaultObjectSizing,
+    speed: 0,
+    frame: 0,
+    scale: 0.6,
+    colorFront: "#c98e26",
+    colorBack: "#573b0a",
+    image: "/images/image-filters/0018.webp",
+    contrast: 0.4,
+    roughness: 0,
+    fiber: 0.35,
+    fiberScale: 2,
+    crumples: 0.7,
+    crumplesScale: 0.6,
+    folds: 0,
+    foldsNumber: 1,
+    blur: 0,
+    drops: 0.1,
+    seed: 1.6
+  }
+};
+const detailsPreset = {
+  name: "Details",
+  params: {
+    ...defaultObjectSizing,
+    speed: 0,
+    frame: 0,
+    fit: "cover",
+    scale: 3,
+    colorFront: "#00000000",
+    colorBack: "#ffffff",
+    image: "/images/image-filters/0018.webp",
+    contrast: 0,
+    roughness: 1,
+    fiber: 0.27,
+    fiberScale: 2,
+    crumples: 1,
+    crumplesScale: 3,
+    folds: 1,
+    foldsNumber: 15,
+    blur: 0,
+    drops: 0,
+    seed: 6
+  }
+};
+const paperTexturePresets = [
+  defaultPreset,
+  cardboardPreset,
+  abstractPreset,
+  detailsPreset
+];
+const PaperTexture = memo(function PaperTextureImpl({
+  // Own props
+  speed = defaultPreset.params.speed,
+  frame = defaultPreset.params.frame,
+  colorFront = defaultPreset.params.colorFront,
+  colorBack = defaultPreset.params.colorBack,
+  image = defaultPreset.params.image,
+  contrast = defaultPreset.params.contrast,
+  roughness = defaultPreset.params.roughness,
+  fiber = defaultPreset.params.fiber,
+  fiberScale = defaultPreset.params.fiberScale,
+  crumples = defaultPreset.params.crumples,
+  crumplesScale = defaultPreset.params.crumplesScale,
+  foldsNumber = defaultPreset.params.foldsNumber,
+  folds = defaultPreset.params.folds,
+  blur = defaultPreset.params.blur,
+  drops = defaultPreset.params.drops,
+  seed = defaultPreset.params.seed,
+  // Sizing props
+  fit = defaultPreset.params.fit,
+  scale = defaultPreset.params.scale,
+  rotation = defaultPreset.params.rotation,
+  originX = defaultPreset.params.originX,
+  originY = defaultPreset.params.originY,
+  offsetX = defaultPreset.params.offsetX,
+  offsetY = defaultPreset.params.offsetY,
+  worldWidth = defaultPreset.params.worldWidth,
+  worldHeight = defaultPreset.params.worldHeight,
+  ...props
+}) {
+  const noiseTexture = typeof window !== "undefined" && { u_noiseTexture: getShaderNoiseTexture() };
+  const uniforms = {
+    // Own uniforms
+    u_image: image,
+    u_colorFront: getShaderColorFromString(colorFront),
+    u_colorBack: getShaderColorFromString(colorBack),
+    u_contrast: contrast,
+    u_roughness: roughness,
+    u_fiber: fiber,
+    u_fiberScale: fiberScale,
+    u_crumples: crumples,
+    u_crumplesScale: crumplesScale,
+    u_foldsNumber: foldsNumber,
+    u_folds: folds,
+    u_blur: blur,
+    u_drops: drops,
+    u_seed: seed,
+    ...noiseTexture,
+    // Sizing uniforms
+    u_fit: ShaderFitOptions[fit],
+    u_scale: scale,
+    u_rotation: rotation,
+    u_offsetX: offsetX,
+    u_offsetY: offsetY,
+    u_originX: originX,
+    u_originY: originY,
+    u_worldWidth: worldWidth,
+    u_worldHeight: worldHeight
+  };
+  return /* @__PURE__ */ jsx(
+    ShaderMount,
+    {
+      ...props,
+      speed,
+      frame,
+      fragmentShader: paperTextureFragmentShader,
+      uniforms
+    }
+  );
+}, colorPropsAreEqual);
+export {
+  PaperTexture,
+  abstractPreset,
+  cardboardPreset,
+  defaultPreset,
+  detailsPreset,
+  paperTexturePresets
+};
+//# sourceMappingURL=paper-texture.js.map

package/dist/shaders/paper-texture.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/shaders/paper-texture.tsx"],
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultObjectSizing,\n  getShaderColorFromString,\n  getShaderNoiseTexture,\n  paperTextureFragmentShader,\n  ShaderFitOptions,\n  type PaperTextureParams,\n  type PaperTextureUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface PaperTextureProps extends ShaderComponentProps, PaperTextureParams {}\n\ntype PaperTexturePreset = ShaderPreset<PaperTextureParams>;\n\nexport const defaultPreset: PaperTexturePreset = {\n  name: 'Default',\n  params: {\n    ...defaultObjectSizing,\n    // fit: 'cover',\n    scale: 0.6,\n    speed: 0,\n    frame: 0,\n    colorFront: '#9fadbc',\n    colorBack: '#ffffff',\n    image: '/images/image-filters/0018.webp',\n    contrast: 0.3,\n    roughness: 0.4,\n    fiber: 0.3,\n    fiberScale: 1,\n    crumples: 0.3,\n    crumplesScale: 0.6,\n    folds: 0.65,\n    foldsNumber: 5,\n    blur: 0,\n    drops: 0.2,\n    seed: 5.8,\n  },\n};\n\nexport const abstractPreset: PaperTexturePreset = {\n  name: 'Abstract',\n  params: {\n    ...defaultObjectSizing,\n    speed: 0,\n    frame: 0,\n    scale: 0.6,\n    colorFront: '#00eeff',\n    colorBack: '#ff0a81',\n    image: '/images/image-filters/0018.webp',\n    contrast: 0.85,\n    roughness: 0,\n    fiber: 0.1,\n    fiberScale: 1,\n    crumples: 0,\n    crumplesScale: 1,\n    folds: 1,\n    foldsNumber: 3,\n    blur: 0,\n    drops: 0.2,\n    seed: 2.2,\n  },\n};\n\nexport const cardboardPreset: PaperTexturePreset = {\n  name: 'Cardboard',\n  params: {\n    ...defaultObjectSizing,\n    speed: 0,\n    frame: 0,\n    scale: 0.6,\n    colorFront: '#c98e26',\n    colorBack: '#573b0a',\n    image: '/images/image-filters/0018.webp',\n    contrast: 0.4,\n    roughness: 0,\n    fiber: 0.35,\n    fiberScale: 2,\n    crumples: 0.7,\n    crumplesScale: 0.6,\n    folds: 0,\n    foldsNumber: 1,\n    blur: 0,\n    drops: 0.1,\n    seed: 1.6,\n  },\n};\n\nexport const detailsPreset: PaperTexturePreset = {\n  name: 'Details',\n  params: {\n    ...defaultObjectSizing,\n    speed: 0,\n    frame: 0,\n    fit: 'cover',\n    scale: 3,\n    colorFront: '#00000000',\n    colorBack: '#ffffff',\n    image: '/images/image-filters/0018.webp',\n    contrast: 0,\n    roughness: 1,\n    fiber: 0.27,\n    fiberScale: 2,\n    crumples: 1,\n    crumplesScale: 3,\n    folds: 1,\n    foldsNumber: 15,\n    blur: 0,\n    drops: 0,\n    seed: 6,\n  },\n};\n\nexport const paperTexturePresets: PaperTexturePreset[] = [\n  defaultPreset,\n  cardboardPreset,\n  abstractPreset,\n  detailsPreset,\n] as const;\n\nexport const PaperTexture: React.FC<PaperTextureProps> = memo(function PaperTextureImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorFront = defaultPreset.params.colorFront,\n  colorBack = defaultPreset.params.colorBack,\n  image = defaultPreset.params.image,\n  contrast = defaultPreset.params.contrast,\n  roughness = defaultPreset.params.roughness,\n  fiber = defaultPreset.params.fiber,\n  fiberScale = defaultPreset.params.fiberScale,\n  crumples = defaultPreset.params.crumples,\n  crumplesScale = defaultPreset.params.crumplesScale,\n  foldsNumber = defaultPreset.params.foldsNumber,\n  folds = defaultPreset.params.folds,\n  blur = defaultPreset.params.blur,\n  drops = defaultPreset.params.drops,\n  seed = defaultPreset.params.seed,\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}: PaperTextureProps) {\n  const noiseTexture = typeof window !== 'undefined' && { u_noiseTexture: getShaderNoiseTexture() };\n\n  const uniforms = {\n    // Own uniforms\n    u_image: image,\n    u_colorFront: getShaderColorFromString(colorFront),\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_contrast: contrast,\n    u_roughness: roughness,\n    u_fiber: fiber,\n    u_fiberScale: fiberScale,\n    u_crumples: crumples,\n    u_crumplesScale: crumplesScale,\n    u_foldsNumber: foldsNumber,\n    u_folds: folds,\n    u_blur: blur,\n    u_drops: drops,\n    u_seed: seed,\n    ...noiseTexture,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies PaperTextureUniforms;\n\n  return (\n    <ShaderMount\n      {...props}\n      speed={speed}\n      frame={frame}\n      fragmentShader={paperTextureFragmentShader}\n      uniforms={uniforms}\n    />\n  );\n}, colorPropsAreEqual);\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/shaders/perlin-noise.js

@@ -19,11 +19,11 @@ const defaultPreset = {
     ...defaultPatternSizing,
     speed: 0.5,
     frame: 0,
-    colorBack: "#262626",
-    colorFront: "#d9d9d9",
+    colorBack: "#632ad5",
+    colorFront: "#fccff7",
     proportion: 0.35,
     softness: 0.1,
-    octaveCount: 2,
+    octaveCount: 1,
     persistence: 1,
     lacunarity: 1.5
   }

package/dist/shaders/perlin-noise.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/perlin-noise.tsx"],
-  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  perlinNoiseFragmentShader,\n  ShaderFitOptions,\n  type PerlinNoiseParams,\n  type PerlinNoiseUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface PerlinNoiseProps extends ShaderComponentProps, PerlinNoiseParams {}\n\ntype PerlinNoisePreset = ShaderPreset<PerlinNoiseParams>;\n\nexport const defaultPreset: PerlinNoisePreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 0.5,\n    frame: 0,\n    colorBack: '#262626',\n    colorFront: '#d9d9d9',\n    proportion: 0.35,\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    ...defaultPatternSizing,\n    scale: 1 / 0.2,\n    speed: 0.4,\n    frame: 0,\n    colorBack: '#2d69d4',\n    colorFront: '#d1eefc',\n    proportion: 0.42,\n    softness: 0,\n    octaveCount: 2,\n    persistence: 0.55,\n    lacunarity: 1.8,\n  },\n};\n\nexport const mossPreset: PerlinNoisePreset = {\n  name: 'Moss',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 0.15,\n    speed: 0.02,\n    frame: 0,\n    colorBack: '#05ff4a',\n    colorFront: '#262626',\n    proportion: 0.65,\n    softness: 0.35,\n    octaveCount: 6,\n    persistence: 1,\n    lacunarity: 2.55,\n  },\n};\n\nexport const wormsPreset: PerlinNoisePreset = {\n  name: 'Worms',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.9,\n    speed: 0,\n    frame: 0,\n    colorBack: '#ffffff',\n    colorFront: '#595959',\n    proportion: 0.5,\n    softness: 0,\n    octaveCount: 1,\n    persistence: 1,\n    lacunarity: 1.5,\n  },\n};\n\nexport const perlinNoisePresets: PerlinNoisePreset[] = [defaultPreset, nintendoWaterPreset, mossPreset, wormsPreset];\n\nexport const PerlinNoise: React.FC<PerlinNoiseProps> = memo(function PerlinNoiseImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorFront = defaultPreset.params.colorFront,\n  colorBack = defaultPreset.params.colorBack,\n  proportion = defaultPreset.params.proportion,\n  softness = defaultPreset.params.softness,\n  octaveCount = defaultPreset.params.octaveCount,\n  persistence = defaultPreset.params.persistence,\n  lacunarity,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\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  ...props\n}: PerlinNoiseProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colorFront: getShaderColorFromString(colorFront),\n    u_proportion: proportion,\n    u_softness: softness ?? defaultPreset.params.softness,\n    u_octaveCount: octaveCount ?? defaultPreset.params.octaveCount,\n    u_persistence: persistence ?? defaultPreset.params.persistence,\n    u_lacunarity: lacunarity ?? defaultPreset.params.lacunarity,\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 PerlinNoiseUniforms;\n\n  return (\n    <ShaderMount\n      {...props}\n      speed={speed}\n      frame={frame}\n      fragmentShader={perlinNoiseFragmentShader}\n      uniforms={uniforms}\n    />\n  );\n}, colorPropsAreEqual);\n"],
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount.js';\nimport { colorPropsAreEqual } from '../color-props-are-equal.js';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  perlinNoiseFragmentShader,\n  ShaderFitOptions,\n  type PerlinNoiseParams,\n  type PerlinNoiseUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface PerlinNoiseProps extends ShaderComponentProps, PerlinNoiseParams {}\n\ntype PerlinNoisePreset = ShaderPreset<PerlinNoiseParams>;\n\nexport const defaultPreset: PerlinNoisePreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 0.5,\n    frame: 0,\n    colorBack: '#632ad5',\n    colorFront: '#fccff7',\n    proportion: 0.35,\n    softness: 0.1,\n    octaveCount: 1,\n    persistence: 1,\n    lacunarity: 1.5,\n  },\n};\n\nexport const nintendoWaterPreset: PerlinNoisePreset = {\n  name: 'Nintendo Water',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 0.2,\n    speed: 0.4,\n    frame: 0,\n    colorBack: '#2d69d4',\n    colorFront: '#d1eefc',\n    proportion: 0.42,\n    softness: 0,\n    octaveCount: 2,\n    persistence: 0.55,\n    lacunarity: 1.8,\n  },\n};\n\nexport const mossPreset: PerlinNoisePreset = {\n  name: 'Moss',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 0.15,\n    speed: 0.02,\n    frame: 0,\n    colorBack: '#05ff4a',\n    colorFront: '#262626',\n    proportion: 0.65,\n    softness: 0.35,\n    octaveCount: 6,\n    persistence: 1,\n    lacunarity: 2.55,\n  },\n};\n\nexport const wormsPreset: PerlinNoisePreset = {\n  name: 'Worms',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.9,\n    speed: 0,\n    frame: 0,\n    colorBack: '#ffffff',\n    colorFront: '#595959',\n    proportion: 0.5,\n    softness: 0,\n    octaveCount: 1,\n    persistence: 1,\n    lacunarity: 1.5,\n  },\n};\n\nexport const perlinNoisePresets: PerlinNoisePreset[] = [defaultPreset, nintendoWaterPreset, mossPreset, wormsPreset];\n\nexport const PerlinNoise: React.FC<PerlinNoiseProps> = memo(function PerlinNoiseImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colorFront = defaultPreset.params.colorFront,\n  colorBack = defaultPreset.params.colorBack,\n  proportion = defaultPreset.params.proportion,\n  softness = defaultPreset.params.softness,\n  octaveCount = defaultPreset.params.octaveCount,\n  persistence = defaultPreset.params.persistence,\n  lacunarity,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\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  ...props\n}: PerlinNoiseProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_colorFront: getShaderColorFromString(colorFront),\n    u_proportion: proportion,\n    u_softness: softness ?? defaultPreset.params.softness,\n    u_octaveCount: octaveCount ?? defaultPreset.params.octaveCount,\n    u_persistence: persistence ?? defaultPreset.params.persistence,\n    u_lacunarity: lacunarity ?? defaultPreset.params.lacunarity,\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 PerlinNoiseUniforms;\n\n  return (\n    <ShaderMount\n      {...props}\n      speed={speed}\n      frame={frame}\n      fragmentShader={perlinNoiseFragmentShader}\n      uniforms={uniforms}\n    />\n  );\n}, colorPropsAreEqual);\n"],
   "mappings": "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",
   "names": []
 }

package/dist/shaders/pulsing-border.js

@@ -18,21 +18,21 @@ const defaultPreset = {
   name: "Default",
   params: {
     ...defaultObjectSizing,
-    scale: 0.55,
+    scale: 0.5,
     speed: 1,
     frame: 0,
     colorBack: "#000000",
-    colors: ["#f2244f", "#4da6e6", "#379590"],
-    roundness: 0.35,
-    thickness: 0.05,
+    colors: ["#f22652", "#4da6e6", "#ffa600"],
+    roundness: 0.25,
+    thickness: 0.2,
     softness: 0.75,
-    intensity: 0.3,
-    bloom: 0.5,
+    intensity: 0.2,
+    bloom: 0.45,
     spots: 3,
-    spotSize: 0.3,
-    pulse: 0,
+    spotSize: 0.4,
+    pulse: 0.2,
     smoke: 0.35,
-    smokeSize: 0.63
+    smokeSize: 0.6
   }
 };
 const circlePreset = {
@@ -132,7 +132,6 @@ const PulsingBorder = memo(function PulsingBorderImpl({
   worldHeight = defaultPreset.params.worldHeight,
   ...props
 }) {
-  const noiseTexture = typeof window !== "undefined" && { u_noiseTexture: getShaderNoiseTexture(0) };
   const uniforms = {
     // Own uniforms
     u_colorBack: getShaderColorFromString(colorBack),
@@ -148,7 +147,7 @@ const PulsingBorder = memo(function PulsingBorderImpl({
     u_pulse: pulse,
     u_smoke: smoke,
     u_smokeSize: smokeSize,
-    ...noiseTexture,
+    u_noiseTexture: getShaderNoiseTexture(),
     // Sizing uniforms
     u_fit: ShaderFitOptions[fit],
     u_rotation: rotation,