@paper-design/shaders-react 0.0.29 → 0.0.31

package/dist/shaders/voronoi.js

@@ -0,0 +1,102 @@
+/* * * * * * * * * * * * * * * * * * * * * * * * * * * *
+ *                    Paper Shaders                    *
+ *       https://github.com/paper-design/shaders       *
+ * * * * * * * * * * * * * * * * * * * * * * * * * * * */
+
+import { memo } from "react";
+import { ShaderMount } from "../shader-mount";
+import { colorPropsAreEqual } from "../color-props-are-equal";
+import {
+  defaultPatternSizing,
+  getShaderColorFromString,
+  getShaderNoiseTexture,
+  voronoiFragmentShader,
+  ShaderFitOptions
+} from "@paper-design/shaders";
+import { jsx } from "react/jsx-runtime";
+const defaultPreset = {
+  name: "Default",
+  params: {
+    ...defaultPatternSizing,
+    speed: 0.5,
+    frame: 0,
+    colors: ["hsla(15, 80%, 50%, 1)", "hsla(50, 80%, 50%, 1)", "hsla(200, 80%, 50%, 1)"],
+    stepsPerColor: 1,
+    colorGlow: "hsla(266, 100%, 50%, 1)",
+    colorBack: "hsla(0, 0%, 100%, 1)",
+    distortion: 0.42,
+    gap: 0.06,
+    innerGlow: 0
+  }
+};
+const shadowPreset = {
+  name: "Shadow",
+  params: {
+    ...defaultPatternSizing,
+    speed: 0.5,
+    frame: 0,
+    colors: ["hsla(259, 29%, 98%, 1)", "hsla(48, 73%, 98%, 1)", "hsla(295, 32%, 98%, 1)"],
+    stepsPerColor: 1,
+    colorGlow: "hsla(290, 18%, 42%, 1)",
+    colorBack: "hsla(0, 0%, 100%, 1)",
+    distortion: 0.23,
+    gap: 0,
+    innerGlow: 0.8
+  }
+};
+const voronoiPresets = [defaultPreset, shadowPreset];
+const Voronoi = memo(function VoronoiImpl({
+  // Own props
+  speed = defaultPreset.params.speed,
+  frame = defaultPreset.params.frame,
+  colors = defaultPreset.params.colors,
+  stepsPerColor = defaultPreset.params.stepsPerColor,
+  colorGlow = defaultPreset.params.colorGlow,
+  colorBack = defaultPreset.params.colorBack,
+  distortion = defaultPreset.params.distortion,
+  gap = defaultPreset.params.gap,
+  innerGlow = defaultPreset.params.innerGlow,
+  // 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_colors: colors.map(getShaderColorFromString),
+    u_colorsCount: colors.length,
+    u_stepsPerColor: stepsPerColor,
+    u_colorGlow: getShaderColorFromString(colorGlow),
+    u_colorBack: getShaderColorFromString(colorBack),
+    u_distortion: distortion,
+    u_gap: gap,
+    u_innerGlow: innerGlow,
+    ...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: voronoiFragmentShader, uniforms });
+}, colorPropsAreEqual);
+export {
+  Voronoi,
+  defaultPreset,
+  shadowPreset,
+  voronoiPresets
+};
+//# sourceMappingURL=voronoi.js.map

package/dist/shaders/voronoi.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/shaders/voronoi.tsx"],
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount';\nimport { colorPropsAreEqual } from '../color-props-are-equal';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  getShaderNoiseTexture,\n  voronoiFragmentShader,\n  ShaderFitOptions,\n  type VoronoiParams,\n  type VoronoiUniforms,\n  type ShaderPreset,\n} from '@paper-design/shaders';\n\nexport interface VoronoiProps extends ShaderComponentProps, VoronoiParams {}\n\ntype VoronoiPreset = ShaderPreset<VoronoiParams>;\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: VoronoiPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    speed: 0.5,\n    frame: 0,\n    colors: ['hsla(15, 80%, 50%, 1)', 'hsla(50, 80%, 50%, 1)', 'hsla(200, 80%, 50%, 1)'],\n    stepsPerColor: 1,\n    colorGlow: 'hsla(266, 100%, 50%, 1)',\n    colorBack: 'hsla(0, 0%, 100%, 1)',\n    distortion: 0.42,\n    gap: 0.06,\n    innerGlow: 0,\n  },\n};\n\nexport const shadowPreset: VoronoiPreset = {\n  name: 'Shadow',\n  params: {\n    ...defaultPatternSizing,\n    speed: 0.5,\n    frame: 0,\n    colors: ['hsla(259, 29%, 98%, 1)', 'hsla(48, 73%, 98%, 1)', 'hsla(295, 32%, 98%, 1)'],\n    stepsPerColor: 1,\n    colorGlow: 'hsla(290, 18%, 42%, 1)',\n    colorBack: 'hsla(0, 0%, 100%, 1)',\n    distortion: 0.23,\n    gap: 0,\n    innerGlow: 0.8,\n  },\n};\n\nexport const voronoiPresets: VoronoiPreset[] = [defaultPreset, shadowPreset];\n\nexport const Voronoi: React.FC<VoronoiProps> = memo(function VoronoiImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colors = defaultPreset.params.colors,\n  stepsPerColor = defaultPreset.params.stepsPerColor,\n  colorGlow = defaultPreset.params.colorGlow,\n  colorBack = defaultPreset.params.colorBack,\n  distortion = defaultPreset.params.distortion,\n  gap = defaultPreset.params.gap,\n  innerGlow = defaultPreset.params.innerGlow,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: VoronoiProps) {\n  const noiseTexture = typeof window !== 'undefined' && { u_noiseTexture: getShaderNoiseTexture() };\n\n  const uniforms = {\n    // Own uniforms\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_stepsPerColor: stepsPerColor,\n    u_colorGlow: getShaderColorFromString(colorGlow),\n    u_colorBack: getShaderColorFromString(colorBack),\n    u_distortion: distortion,\n    u_gap: gap,\n    u_innerGlow: innerGlow,\n    ...noiseTexture,\n\n    // Sizing uniforms\n    u_fit: ShaderFitOptions[fit],\n    u_scale: scale,\n    u_rotation: rotation,\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies VoronoiUniforms;\n\n  return (\n    <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={voronoiFragmentShader} uniforms={uniforms} />\n  );\n}, colorPropsAreEqual);\n"],
+  "mappings": ";;;;;AAAA,SAAS,YAAY;AACrB,SAAS,mBAA8C;AACvD,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AA+FH;AArFG,MAAM,gBAA+B;AAAA,EAC1C,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,yBAAyB,yBAAyB,wBAAwB;AAAA,IACnF,eAAe;AAAA,IACf,WAAW;AAAA,IACX,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,KAAK;AAAA,IACL,WAAW;AAAA,EACb;AACF;AAEO,MAAM,eAA8B;AAAA,EACzC,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ,CAAC,0BAA0B,yBAAyB,wBAAwB;AAAA,IACpF,eAAe;AAAA,IACf,WAAW;AAAA,IACX,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,KAAK;AAAA,IACL,WAAW;AAAA,EACb;AACF;AAEO,MAAM,iBAAkC,CAAC,eAAe,YAAY;AAEpE,MAAM,UAAkC,KAAK,SAAS,YAAY;AAAA;AAAA,EAEvE,QAAQ,cAAc,OAAO;AAAA,EAC7B,QAAQ,cAAc,OAAO;AAAA,EAC7B,SAAS,cAAc,OAAO;AAAA,EAC9B,gBAAgB,cAAc,OAAO;AAAA,EACrC,YAAY,cAAc,OAAO;AAAA,EACjC,YAAY,cAAc,OAAO;AAAA,EACjC,aAAa,cAAc,OAAO;AAAA,EAClC,MAAM,cAAc,OAAO;AAAA,EAC3B,YAAY,cAAc,OAAO;AAAA;AAAA,EAGjC,MAAM,cAAc,OAAO;AAAA,EAC3B,QAAQ,cAAc,OAAO;AAAA,EAC7B,WAAW,cAAc,OAAO;AAAA,EAChC,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,UAAU,cAAc,OAAO;AAAA,EAC/B,aAAa,cAAc,OAAO;AAAA,EAClC,cAAc,cAAc,OAAO;AAAA,EACnC,GAAG;AACL,GAAiB;AACf,QAAM,eAAe,OAAO,WAAW,eAAe,EAAE,gBAAgB,sBAAsB,EAAE;AAEhG,QAAM,WAAW;AAAA;AAAA,IAEf,UAAU,OAAO,IAAI,wBAAwB;AAAA,IAC7C,eAAe,OAAO;AAAA,IACtB,iBAAiB;AAAA,IACjB,aAAa,yBAAyB,SAAS;AAAA,IAC/C,aAAa,yBAAyB,SAAS;AAAA,IAC/C,cAAc;AAAA,IACd,OAAO;AAAA,IACP,aAAa;AAAA,IACb,GAAG;AAAA;AAAA,IAGH,OAAO,iBAAiB,GAAG;AAAA,IAC3B,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,eAAe;AAAA,EACjB;AAEA,SACE,oBAAC,eAAa,GAAG,OAAO,OAAc,OAAc,gBAAgB,uBAAuB,UAAoB;AAEnH,GAAG,kBAAkB;",
+  "names": []
+}

package/dist/shaders/warp.d.ts

@@ -1,25 +1,8 @@
-import { type GlobalParams, type ShaderMountProps } from '../shader-mount';
-import { type PatternShape } from '@paper-design/shaders';
-export type WarpParams = {
-    scale?: number;
-    rotation?: number;
-    color1?: string;
-    color2?: string;
-    color3?: string;
-    proportion?: number;
-    softness?: number;
-    distortion?: number;
-    swirl?: number;
-    swirlIterations?: number;
-    shapeScale?: number;
-    shape?: PatternShape;
-} & GlobalParams;
-export type WarpProps = Omit<ShaderMountProps, 'fragmentShader'> & WarpParams;
-type WarpPreset = {
-    name: string;
-    params: Required<WarpParams>;
-    style?: React.CSSProperties;
-};
+import { type ShaderComponentProps } from '../shader-mount';
+import { type WarpParams, type ShaderPreset } from '@paper-design/shaders';
+export interface WarpProps extends ShaderComponentProps, WarpParams {
+}
+type WarpPreset = ShaderPreset<WarpParams>;
 export declare const defaultPreset: WarpPreset;
 export declare const presetCauldron: WarpPreset;
 export declare const presetSilk: WarpPreset;
@@ -32,5 +15,5 @@ export declare const presetNectar: WarpPreset;
 export declare const presetFilteredLight: WarpPreset;
 export declare const presetKelp: WarpPreset;
 export declare const warpPresets: WarpPreset[];
-export declare const Warp: ({ scale, rotation, color1, color2, color3, proportion, softness, distortion, swirl, swirlIterations, shapeScale, shape, ...props }: WarpProps) => React.ReactElement;
+export declare const Warp: React.FC<WarpProps>;
 export {};

package/dist/shaders/warp.js

@@ -0,0 +1,290 @@
+/* * * * * * * * * * * * * * * * * * * * * * * * * * * *
+ *                    Paper Shaders                    *
+ *       https://github.com/paper-design/shaders       *
+ * * * * * * * * * * * * * * * * * * * * * * * * * * * */
+
+import { memo } from "react";
+import { ShaderMount } from "../shader-mount";
+import { colorPropsAreEqual } from "../color-props-are-equal";
+import {
+  defaultPatternSizing,
+  getShaderColorFromString,
+  warpFragmentShader,
+  ShaderFitOptions,
+  WarpPatterns
+} from "@paper-design/shaders";
+import { jsx } from "react/jsx-runtime";
+const defaultPreset = {
+  name: "Default",
+  params: {
+    ...defaultPatternSizing,
+    rotation: 0,
+    speed: 1,
+    frame: 0,
+    colors: ["hsla(0, 0%, 15%, 1)", "hsla(203, 80%, 70%, 1)", "hsla(0, 0%, 100%, 1)"],
+    proportion: 0.35,
+    softness: 1,
+    distortion: 0.25,
+    swirl: 0.8,
+    swirlIterations: 10,
+    shapeScale: 0.1,
+    shape: "edge"
+  }
+};
+const presetCauldron = {
+  name: "Cauldron Pot",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 1.1,
+    rotation: 1.62,
+    speed: 10,
+    frame: 0,
+    colors: ["hsla(100, 51%, 75%, 1)", "hsla(220, 39%, 32%, 1)", "hsla(129.2, 41.9%, 6.1%, 1)"],
+    proportion: 0.64,
+    softness: 0.95,
+    distortion: 0.2,
+    swirl: 0.86,
+    swirlIterations: 7,
+    shapeScale: 0,
+    shape: "edge"
+  }
+};
+const presetSilk = {
+  name: "Silk",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 0.26,
+    rotation: 0,
+    speed: 5,
+    frame: 0,
+    colors: ["hsla(0, 9%, 7%, 1)", "hsla(8, 13%, 34%, 1)", "hsla(5, 8%, 71%, 1)"],
+    proportion: 0,
+    softness: 1,
+    distortion: 0.3,
+    swirl: 0.6,
+    swirlIterations: 11,
+    shapeScale: 0.05,
+    shape: "stripes"
+  }
+};
+const presetPassion = {
+  name: "Passion",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 0.25,
+    rotation: 1.35,
+    speed: 3,
+    frame: 0,
+    colors: ["hsla(0, 44.7%, 14.9%, 1)", "hsla(353.4, 34%, 42.2%, 1)", "hsla(29, 100%, 76.1%, 1)"],
+    proportion: 0.5,
+    softness: 1,
+    distortion: 0.09,
+    swirl: 0.9,
+    swirlIterations: 6,
+    shapeScale: 0.25,
+    shape: "checks"
+  }
+};
+const presetPhantom = {
+  name: "Phantom",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 0.68,
+    rotation: 1.8,
+    speed: 12,
+    frame: 0,
+    colors: ["hsla(242.2, 44.3%, 12%, 1)", "hsla(236.1, 80.4%, 70%, 1)", "hsla(0, 0%, 100%, 1)"],
+    proportion: 0.45,
+    softness: 1,
+    distortion: 0.16,
+    swirl: 0.3,
+    swirlIterations: 7,
+    shapeScale: 0.1,
+    shape: "checks"
+  }
+};
+const presetAbyss = {
+  name: "The Abyss",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 0.1,
+    rotation: 2,
+    speed: 0.6,
+    frame: 0,
+    colors: ["hsla(242.2, 44.3%, 12%, 1)", "hsla(236.1, 80.4%, 70%, 1)", "hsla(0, 0%, 100%, 1)"],
+    proportion: 0,
+    softness: 1,
+    distortion: 0.09,
+    swirl: 0.48,
+    swirlIterations: 4,
+    shapeScale: 0.1,
+    shape: "edge"
+  }
+};
+const presetInk = {
+  name: "Live Ink",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 0.7,
+    rotation: 1.5,
+    speed: 2.5,
+    frame: 0,
+    colors: ["hsla(210, 11.1%, 7.1%, 1)", "hsla(165, 9%, 65.1%, 1)", "hsla(84, 100%, 97.1%, 1)"],
+    proportion: 0.35,
+    softness: 0,
+    distortion: 0.25,
+    swirl: 0.8,
+    swirlIterations: 10,
+    shapeScale: 0.26,
+    shape: "checks"
+  }
+};
+const presetIceberg = {
+  name: "Iceberg",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 1.1,
+    rotation: 2,
+    speed: 0.5,
+    frame: 0,
+    colors: ["hsla(0, 0%, 100%, 1)", "hsla(220, 38.7%, 32%, 1)", "hsla(129.2, 41.9%, 6.1%, 1)"],
+    proportion: 0.3,
+    softness: 1,
+    distortion: 0.2,
+    swirl: 0.86,
+    swirlIterations: 7,
+    shapeScale: 0,
+    shape: "checks"
+  }
+};
+const presetNectar = {
+  name: "Nectar",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 0.24,
+    rotation: 0,
+    speed: 4.2,
+    frame: 0,
+    colors: ["hsla(37.5, 22.2%, 7.1%, 1)", "hsla(38.5, 59.1%, 63.1%, 1)", "hsla(37.6, 30%, 95.2%, 1)"],
+    proportion: 0.24,
+    softness: 1,
+    distortion: 0.21,
+    swirl: 0.57,
+    swirlIterations: 10,
+    shapeScale: 0.32,
+    shape: "edge"
+  }
+};
+const presetFilteredLight = {
+  name: "Filtered Light",
+  params: {
+    ...defaultPatternSizing,
+    scale: 2,
+    rotation: 0.44,
+    speed: 3.2,
+    frame: 0,
+    colors: ["hsla(60.2, 7.8%, 8.3%, 1)", "hsla(64.4, 27.8%, 81%, 1)", "hsla(60, 100%, 93.9%, 1)"],
+    proportion: 0.25,
+    softness: 1,
+    distortion: 0.06,
+    swirl: 0,
+    swirlIterations: 0,
+    shapeScale: 0,
+    shape: "stripes"
+  }
+};
+const presetKelp = {
+  name: "Kelp",
+  params: {
+    ...defaultPatternSizing,
+    scale: 0.38,
+    rotation: 0.6,
+    speed: 20,
+    frame: 0,
+    colors: ["hsla(79.3, 100%, 78%, 1)", "hsla(112, 10.5%, 28%, 1)", "hsla(203.3, 50%, 7.1%, 1)"],
+    proportion: 1,
+    softness: 0,
+    distortion: 0,
+    swirl: 0.15,
+    swirlIterations: 0,
+    shapeScale: 0.74,
+    shape: "stripes"
+  }
+};
+const warpPresets = [
+  defaultPreset,
+  presetAbyss,
+  presetCauldron,
+  presetFilteredLight,
+  presetIceberg,
+  presetInk,
+  presetKelp,
+  presetNectar,
+  presetPassion,
+  presetPhantom,
+  presetSilk
+];
+const Warp = memo(function WarpImpl({
+  // Own props
+  speed = defaultPreset.params.speed,
+  frame = defaultPreset.params.frame,
+  colors = defaultPreset.params.colors,
+  proportion = defaultPreset.params.proportion,
+  softness = defaultPreset.params.softness,
+  distortion = defaultPreset.params.distortion,
+  swirl = defaultPreset.params.swirl,
+  swirlIterations = defaultPreset.params.swirlIterations,
+  shapeScale = defaultPreset.params.shapeScale,
+  shape = defaultPreset.params.shape,
+  // 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 uniforms = {
+    // Own uniforms
+    u_colors: colors.map(getShaderColorFromString),
+    u_colorsCount: colors.length,
+    u_proportion: proportion,
+    u_softness: softness,
+    u_distortion: distortion,
+    u_swirl: swirl,
+    u_swirlIterations: swirlIterations,
+    u_shapeScale: shapeScale,
+    u_shape: WarpPatterns[shape],
+    // Sizing uniforms
+    u_scale: scale,
+    u_rotation: rotation,
+    u_fit: ShaderFitOptions[fit],
+    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: warpFragmentShader, uniforms });
+}, colorPropsAreEqual);
+export {
+  Warp,
+  defaultPreset,
+  presetAbyss,
+  presetCauldron,
+  presetFilteredLight,
+  presetIceberg,
+  presetInk,
+  presetKelp,
+  presetNectar,
+  presetPassion,
+  presetPhantom,
+  presetSilk,
+  warpPresets
+};
+//# sourceMappingURL=warp.js.map

package/dist/shaders/warp.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/shaders/warp.tsx"],
+  "sourcesContent": ["import { memo } from 'react';\nimport { ShaderMount, type ShaderComponentProps } from '../shader-mount';\nimport { colorPropsAreEqual } from '../color-props-are-equal';\nimport {\n  defaultPatternSizing,\n  getShaderColorFromString,\n  warpFragmentShader,\n  ShaderFitOptions,\n  type WarpParams,\n  type WarpUniforms,\n  type ShaderPreset,\n  WarpPatterns,\n} from '@paper-design/shaders';\n\nexport interface WarpProps extends ShaderComponentProps, WarpParams {}\n\ntype WarpPreset = ShaderPreset<WarpParams>;\n\n// Due to Leva controls limitation:\n// 1) keep default colors in HSLA format to keep alpha channel\n// 2) don't use decimal values on HSL values (to avoid button highlight bug)\n\nexport const defaultPreset: WarpPreset = {\n  name: 'Default',\n  params: {\n    ...defaultPatternSizing,\n    rotation: 0,\n    speed: 1,\n    frame: 0,\n    colors: ['hsla(0, 0%, 15%, 1)', 'hsla(203, 80%, 70%, 1)', 'hsla(0, 0%, 100%, 1)'],\n    proportion: 0.35,\n    softness: 1,\n    distortion: 0.25,\n    swirl: 0.8,\n    swirlIterations: 10,\n    shapeScale: 0.1,\n    shape: 'edge',\n  },\n};\n\nexport const presetCauldron: WarpPreset = {\n  name: 'Cauldron Pot',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 1.1,\n    rotation: 1.62,\n    speed: 10,\n    frame: 0,\n    colors: ['hsla(100, 51%, 75%, 1)', 'hsla(220, 39%, 32%, 1)', 'hsla(129.2, 41.9%, 6.1%, 1)'],\n    proportion: 0.64,\n    softness: 0.95,\n    distortion: 0.2,\n    swirl: 0.86,\n    swirlIterations: 7,\n    shapeScale: 0,\n    shape: 'edge',\n  },\n};\n\nexport const presetSilk: WarpPreset = {\n  name: 'Silk',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 0.26,\n    rotation: 0,\n    speed: 5,\n    frame: 0,\n    colors: ['hsla(0, 9%, 7%, 1)', 'hsla(8, 13%, 34%, 1)', 'hsla(5, 8%, 71%, 1)'],\n    proportion: 0,\n    softness: 1,\n    distortion: 0.3,\n    swirl: 0.6,\n    swirlIterations: 11,\n    shapeScale: 0.05,\n    shape: 'stripes',\n  },\n};\n\nexport const presetPassion: WarpPreset = {\n  name: 'Passion',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 0.25,\n    rotation: 1.35,\n    speed: 3,\n    frame: 0,\n    colors: ['hsla(0, 44.7%, 14.9%, 1)', 'hsla(353.4, 34%, 42.2%, 1)', 'hsla(29, 100%, 76.1%, 1)'],\n    proportion: 0.5,\n    softness: 1,\n    distortion: 0.09,\n    swirl: 0.9,\n    swirlIterations: 6,\n    shapeScale: 0.25,\n    shape: 'checks',\n  },\n};\n\nexport const presetPhantom: WarpPreset = {\n  name: 'Phantom',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 0.68,\n    rotation: 1.8,\n    speed: 12,\n    frame: 0,\n    colors: ['hsla(242.2, 44.3%, 12%, 1)', 'hsla(236.1, 80.4%, 70%, 1)', 'hsla(0, 0%, 100%, 1)'],\n    proportion: 0.45,\n    softness: 1,\n    distortion: 0.16,\n    swirl: 0.3,\n    swirlIterations: 7,\n    shapeScale: 0.1,\n    shape: 'checks',\n  },\n};\n\nexport const presetAbyss: WarpPreset = {\n  name: 'The Abyss',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 0.1,\n    rotation: 2,\n    speed: 0.6,\n    frame: 0,\n    colors: ['hsla(242.2, 44.3%, 12%, 1)', 'hsla(236.1, 80.4%, 70%, 1)', 'hsla(0, 0%, 100%, 1)'],\n    proportion: 0,\n    softness: 1,\n    distortion: 0.09,\n    swirl: 0.48,\n    swirlIterations: 4,\n    shapeScale: 0.1,\n    shape: 'edge',\n  },\n};\n\nexport const presetInk: WarpPreset = {\n  name: 'Live Ink',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 0.7,\n    rotation: 1.5,\n    speed: 2.5,\n    frame: 0,\n    colors: ['hsla(210, 11.1%, 7.1%, 1)', 'hsla(165, 9%, 65.1%, 1)', 'hsla(84, 100%, 97.1%, 1)'],\n    proportion: 0.35,\n    softness: 0,\n    distortion: 0.25,\n    swirl: 0.8,\n    swirlIterations: 10,\n    shapeScale: 0.26,\n    shape: 'checks',\n  },\n};\n\nexport const presetIceberg: WarpPreset = {\n  name: 'Iceberg',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 1.1,\n    rotation: 2,\n    speed: 0.5,\n    frame: 0,\n    colors: ['hsla(0, 0%, 100%, 1)', 'hsla(220, 38.7%, 32%, 1)', 'hsla(129.2, 41.9%, 6.1%, 1)'],\n    proportion: 0.3,\n    softness: 1,\n    distortion: 0.2,\n    swirl: 0.86,\n    swirlIterations: 7,\n    shapeScale: 0,\n    shape: 'checks',\n  },\n};\n\nexport const presetNectar: WarpPreset = {\n  name: 'Nectar',\n  params: {\n    ...defaultPatternSizing,\n    scale: 1 / 0.24,\n    rotation: 0,\n    speed: 4.2,\n    frame: 0,\n    colors: ['hsla(37.5, 22.2%, 7.1%, 1)', 'hsla(38.5, 59.1%, 63.1%, 1)', 'hsla(37.6, 30%, 95.2%, 1)'],\n    proportion: 0.24,\n    softness: 1,\n    distortion: 0.21,\n    swirl: 0.57,\n    swirlIterations: 10,\n    shapeScale: 0.32,\n    shape: 'edge',\n  },\n};\n\nexport const presetFilteredLight: WarpPreset = {\n  name: 'Filtered Light',\n  params: {\n    ...defaultPatternSizing,\n    scale: 2,\n    rotation: 0.44,\n    speed: 3.2,\n    frame: 0,\n    colors: ['hsla(60.2, 7.8%, 8.3%, 1)', 'hsla(64.4, 27.8%, 81%, 1)', 'hsla(60, 100%, 93.9%, 1)'],\n    proportion: 0.25,\n    softness: 1,\n    distortion: 0.06,\n    swirl: 0,\n    swirlIterations: 0,\n    shapeScale: 0,\n    shape: 'stripes',\n  },\n};\n\nexport const presetKelp: WarpPreset = {\n  name: 'Kelp',\n  params: {\n    ...defaultPatternSizing,\n    scale: 0.38,\n    rotation: 0.6,\n    speed: 20,\n    frame: 0,\n    colors: ['hsla(79.3, 100%, 78%, 1)', 'hsla(112, 10.5%, 28%, 1)', 'hsla(203.3, 50%, 7.1%, 1)'],\n    proportion: 1,\n    softness: 0,\n    distortion: 0,\n    swirl: 0.15,\n    swirlIterations: 0,\n    shapeScale: 0.74,\n    shape: 'stripes',\n  },\n};\n\nexport const warpPresets: WarpPreset[] = [\n  defaultPreset,\n  presetAbyss,\n  presetCauldron,\n  presetFilteredLight,\n  presetIceberg,\n  presetInk,\n  presetKelp,\n  presetNectar,\n  presetPassion,\n  presetPhantom,\n  presetSilk,\n];\n\nexport const Warp: React.FC<WarpProps> = memo(function WarpImpl({\n  // Own props\n  speed = defaultPreset.params.speed,\n  frame = defaultPreset.params.frame,\n  colors = defaultPreset.params.colors,\n  proportion = defaultPreset.params.proportion,\n  softness = defaultPreset.params.softness,\n  distortion = defaultPreset.params.distortion,\n  swirl = defaultPreset.params.swirl,\n  swirlIterations = defaultPreset.params.swirlIterations,\n  shapeScale = defaultPreset.params.shapeScale,\n  shape = defaultPreset.params.shape,\n\n  // Sizing props\n  fit = defaultPreset.params.fit,\n  scale = defaultPreset.params.scale,\n  rotation = defaultPreset.params.rotation,\n  originX = defaultPreset.params.originX,\n  originY = defaultPreset.params.originY,\n  offsetX = defaultPreset.params.offsetX,\n  offsetY = defaultPreset.params.offsetY,\n  worldWidth = defaultPreset.params.worldWidth,\n  worldHeight = defaultPreset.params.worldHeight,\n  ...props\n}: WarpProps) {\n  const uniforms = {\n    // Own uniforms\n    u_colors: colors.map(getShaderColorFromString),\n    u_colorsCount: colors.length,\n    u_proportion: proportion,\n    u_softness: softness,\n    u_distortion: distortion,\n    u_swirl: swirl,\n    u_swirlIterations: swirlIterations,\n    u_shapeScale: shapeScale,\n    u_shape: WarpPatterns[shape],\n\n    // Sizing uniforms\n    u_scale: scale,\n    u_rotation: rotation,\n    u_fit: ShaderFitOptions[fit],\n    u_offsetX: offsetX,\n    u_offsetY: offsetY,\n    u_originX: originX,\n    u_originY: originY,\n    u_worldWidth: worldWidth,\n    u_worldHeight: worldHeight,\n  } satisfies WarpUniforms;\n\n  return <ShaderMount {...props} speed={speed} frame={frame} fragmentShader={warpFragmentShader} uniforms={uniforms} />;\n}, colorPropsAreEqual);\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/shaders/waves.d.ts

@@ -1,21 +1,8 @@
-import { type ShaderMountProps } from '../shader-mount';
-export type WavesParams = {
-    scale?: number;
-    rotation?: number;
-    color?: string;
-    shape?: number;
-    frequency?: number;
-    amplitude?: number;
-    spacing?: number;
-    dutyCycle?: number;
-    softness?: number;
-};
-export type WavesProps = Omit<ShaderMountProps, 'fragmentShader'> & WavesParams;
-type WavesPreset = {
-    name: string;
-    params: Required<WavesParams>;
-    style?: React.CSSProperties;
-};
+import { type ShaderComponentProps } from '../shader-mount';
+import { type WavesParams, type ShaderPreset } from '@paper-design/shaders';
+export interface WavesProps extends ShaderComponentProps, WavesParams {
+}
+type WavesPreset = ShaderPreset<WavesParams>;
 export declare const defaultPreset: WavesPreset;
 export declare const spikesPreset: WavesPreset;
 export declare const groovyPreset: WavesPreset;
@@ -23,5 +10,5 @@ export declare const tangledUpPreset: WavesPreset;
 export declare const zigZagPreset: WavesPreset;
 export declare const waveRidePreset: WavesPreset;
 export declare const wavesPresets: WavesPreset[];
-export declare const Waves: ({ scale, rotation, color, shape, frequency, amplitude, spacing, dutyCycle, softness, ...props }: WavesProps) => React.ReactElement;
+export declare const Waves: React.FC<WavesProps>;
 export {};

package/dist/shaders/waves.js

@@ -0,0 +1,178 @@
+/* * * * * * * * * * * * * * * * * * * * * * * * * * * *
+ *                    Paper Shaders                    *
+ *       https://github.com/paper-design/shaders       *
+ * * * * * * * * * * * * * * * * * * * * * * * * * * * */
+
+import { memo } from "react";
+import { ShaderMount } from "../shader-mount";
+import { colorPropsAreEqual } from "../color-props-are-equal";
+import {
+  defaultPatternSizing,
+  getShaderColorFromString,
+  wavesFragmentShader,
+  ShaderFitOptions
+} from "@paper-design/shaders";
+import { jsx } from "react/jsx-runtime";
+const defaultPreset = {
+  name: "Default",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1.6,
+    rotation: 0,
+    color1: "hsla(0, 0%, 100%, 1)",
+    color2: "hsla(225, 75%, 24%, 1)",
+    shape: 0,
+    frequency: 0.5,
+    amplitude: 0.6,
+    spacing: 0.65,
+    proportion: 0.15,
+    softness: 0
+  }
+};
+const spikesPreset = {
+  name: "Spikes",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 2.3,
+    rotation: 0,
+    color1: "hsla(65, 100%, 95%, 1)",
+    color2: "hsla(290, 52%, 15%, 1)",
+    shape: 0,
+    frequency: 0.5,
+    amplitude: 0.9,
+    spacing: 0.37,
+    proportion: 0.93,
+    softness: 0.15
+  }
+};
+const groovyPreset = {
+  name: "Groovy",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 0.5,
+    rotation: 1,
+    color1: "hsla(60, 100%, 97%, 1)",
+    color2: "hsla(20, 100%, 71%, 1)",
+    shape: 2.37,
+    frequency: 0.2,
+    amplitude: 0.67,
+    spacing: 1.17,
+    proportion: 0.57,
+    softness: 0
+  }
+};
+const tangledUpPreset = {
+  name: "Tangled up",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 3.04,
+    rotation: 1,
+    color1: "hsla(198.7, 66.7%, 14.1%, 1)",
+    color2: "hsla(85.5, 35.7%, 78%, 1)",
+    shape: 3,
+    frequency: 0.44,
+    amplitude: 0.57,
+    spacing: 1.05,
+    proportion: 0.97,
+    softness: 0
+  }
+};
+const zigZagPreset = {
+  name: "Zig zag",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 2.7,
+    rotation: 1,
+    color1: "hsla(0, 0%, 0%, 1)",
+    color2: "hsla(0, 0%, 90%, 1)",
+    shape: 0,
+    frequency: 0.6,
+    amplitude: 0.8,
+    spacing: 0.5,
+    proportion: 1,
+    softness: 0.5
+  }
+};
+const waveRidePreset = {
+  name: "Ride the wave",
+  params: {
+    ...defaultPatternSizing,
+    scale: 1 / 0.84,
+    rotation: 0,
+    color1: "hsla(65, 100%, 95%, 1)",
+    color2: "hsla(0, 0%, 12%, 1)",
+    shape: 2.23,
+    frequency: 0.1,
+    amplitude: 0.6,
+    spacing: 0.41,
+    proportion: 0.99,
+    softness: 0
+  }
+};
+const wavesPresets = [
+  defaultPreset,
+  spikesPreset,
+  groovyPreset,
+  tangledUpPreset,
+  zigZagPreset,
+  waveRidePreset
+];
+const Waves = memo(function WavesImpl({
+  // Own props
+  color1 = defaultPreset.params.color1,
+  color2 = defaultPreset.params.color2,
+  shape = defaultPreset.params.shape,
+  frequency = defaultPreset.params.frequency,
+  amplitude = defaultPreset.params.amplitude,
+  spacing = defaultPreset.params.spacing,
+  proportion = defaultPreset.params.proportion,
+  softness = defaultPreset.params.softness,
+  // Sizing props
+  fit = defaultPreset.params.fit,
+  scale = defaultPreset.params.scale,
+  rotation = defaultPreset.params.rotation,
+  offsetX = defaultPreset.params.offsetX,
+  offsetY = defaultPreset.params.offsetY,
+  originX = defaultPreset.params.originX,
+  originY = defaultPreset.params.originY,
+  worldWidth = defaultPreset.params.worldWidth,
+  worldHeight = defaultPreset.params.worldHeight,
+  // Other props
+  maxPixelCount = 6016 * 3384,
+  // Higher max resolution for this shader
+  ...props
+}) {
+  const uniforms = {
+    // Own uniforms
+    u_color1: getShaderColorFromString(color1),
+    u_color2: getShaderColorFromString(color2),
+    u_shape: shape,
+    u_frequency: frequency,
+    u_amplitude: amplitude,
+    u_spacing: spacing,
+    u_proportion: proportion,
+    u_softness: softness,
+    // 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, fragmentShader: wavesFragmentShader, uniforms });
+}, colorPropsAreEqual);
+export {
+  Waves,
+  defaultPreset,
+  groovyPreset,
+  spikesPreset,
+  tangledUpPreset,
+  waveRidePreset,
+  wavesPresets,
+  zigZagPreset
+};
+//# sourceMappingURL=waves.js.map