@paper-design/shaders 0.0.19 → 0.0.21

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

@@ -3,7 +3,7 @@ export type PerlinNoiseUniforms = {
     u_color1: [number, number, number, number];
     u_color2: [number, number, number, number];
     u_proportion: number;
-    u_contour: number;
+    u_softness: number;
     u_octaveCount: number;
     u_persistence: number;
     u_lacunarity: number;
@@ -17,7 +17,7 @@ export type PerlinNoiseUniforms = {
  * u_color1 - the first mixed color
  * u_color2 - the second mixed color
  * u_proportion (0 .. 1) - the proportion between u_color1 and u_color2;
- * u_contour - the sharpness of the transition between u_color1 and u_color2 in the noise output
+ * u_softness - the sharpness of the transition between u_color1 and u_color2 in the noise output
  * u_octaveCount - the number of octaves for Perlin noise;
  *    higher values increase the complexity of the noise
  * u_persistence (0 .. 1) - the amplitude of each successive octave of the noise;
@@ -25,4 +25,4 @@ export type PerlinNoiseUniforms = {
  * u_lacunarity - the frequency of each successive octave of the noise;
  *    higher values increase the detail
  */
-export declare const perlinNoiseFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform float u_time;\nuniform float u_pixelRatio;\nuniform vec2 u_resolution;\n\nuniform float u_scale;\nuniform vec4 u_color1;\nuniform vec4 u_color2;\nuniform float u_proportion;\nuniform float u_contour;\nuniform float u_octaveCount;\nuniform float u_persistence;\nuniform float u_lacunarity;\n\nout vec4 fragColor;\n\n#define TWO_PI 6.28318530718\n\nuint hash(uint x, uint seed) {\n  const uint m = 0x5bd1e995U;\n  uint hash = seed;\n    // process input\n    uint k = x;\n    k *= m;\n    k ^= k >> 24;\n    k *= m;\n    hash *= m;\n    hash ^= k;\n    // some final mixing\n    hash ^= hash >> 13;\n    hash *= m;\n    hash ^= hash >> 15;\n    return hash;\n}\n\nuint hash(uvec3 x, uint seed){\n    const uint m = 0x5bd1e995U;\n    uint hash = seed;\n    // process first vector element\n    uint k = x.x; \n    k *= m;\n    k ^= k >> 24;\n    k *= m;\n    hash *= m;\n    hash ^= k;\n    // process second vector element\n    k = x.y; \n    k *= m;\n    k ^= k >> 24;\n    k *= m;\n    hash *= m;\n    hash ^= k;\n    // process third vector element\n    k = x.z; \n    k *= m;\n    k ^= k >> 24;\n    k *= m;\n    hash *= m;\n    hash ^= k;\n    // some final mixing\n    hash ^= hash >> 13;\n    hash *= m;\n    hash ^= hash >> 15;\n    return hash;\n}\n\n\nvec3 gradientdy(uint hash) {\n    switch (int(hash) & 15) { // look at the last four bits to pick a gradient dy\n    case 0:\n        return vec3(1, 1, 0);\n    case 1:\n        return vec3(-1, 1, 0);\n    case 2:\n        return vec3(1, -1, 0);\n    case 3:\n        return vec3(-1, -1, 0);\n    case 4:\n        return vec3(1, 0, 1);\n    case 5:\n        return vec3(-1, 0, 1);\n    case 6:\n        return vec3(1, 0, -1);\n    case 7:\n        return vec3(-1, 0, -1);\n    case 8:\n        return vec3(0, 1, 1);\n    case 9:\n        return vec3(0, -1, 1);\n    case 10:\n        return vec3(0, 1, -1);\n    case 11:\n        return vec3(0, -1, -1);\n    case 12:\n        return vec3(1, 1, 0);\n    case 13:\n        return vec3(-1, 1, 0);\n    case 14:\n        return vec3(0, -1, 1);\n    case 15:\n        return vec3(0, -1, -1);\n    }\n}\n\nfloat interpolate(float value1, float value2, float value3, float value4, float value5, float value6, float value7, float value8, vec3 t) {\n    return mix(\n        mix(mix(value1, value2, t.x), mix(value3, value4, t.x), t.y),\n        mix(mix(value5, value6, t.x), mix(value7, value8, t.x), t.y),\n        t.z\n    );\n}\n\nvec3 fade(vec3 t) {\n    return t * t * t * (t * (t * 6.0 - 15.0) + 10.0);\n}\n\nfloat perlinNoise(vec3 position, uint seed) {\n    position += 1e+4;\n    vec3 floorPosition = floor(position);\n    vec3 fractPosition = fract(position);\n    uvec3 cellCoordinates = uvec3(floorPosition);\n    float value1 = dot(gradientdy(hash(cellCoordinates, seed)), fractPosition);\n    float value2 = dot(gradientdy(hash((cellCoordinates + uvec3(1, 0, 0)), seed)), fractPosition - vec3(1, 0, 0));\n    float value3 = dot(gradientdy(hash((cellCoordinates + uvec3(0, 1, 0)), seed)), fractPosition - vec3(0, 1, 0));\n    float value4 = dot(gradientdy(hash((cellCoordinates + uvec3(1, 1, 0)), seed)), fractPosition - vec3(1, 1, 0));\n    float value5 = dot(gradientdy(hash((cellCoordinates + uvec3(0, 0, 1)), seed)), fractPosition - vec3(0, 0, 1));\n    float value6 = dot(gradientdy(hash((cellCoordinates + uvec3(1, 0, 1)), seed)), fractPosition - vec3(1, 0, 1));\n    float value7 = dot(gradientdy(hash((cellCoordinates + uvec3(0, 1, 1)), seed)), fractPosition - vec3(0, 1, 1));\n    float value8 = dot(gradientdy(hash((cellCoordinates + uvec3(1, 1, 1)), seed)), fractPosition - vec3(1, 1, 1));\n    return interpolate(value1, value2, value3, value4, value5, value6, value7, value8, fade(fractPosition));\n}\n\nfloat p_noise(vec3 position, int octaveCount, float persistence, float lacunarity) {\n    float value = 0.0;\n    float amplitude = 1.0;\n    float currentFrequency = 10.;\n    uint currentSeed = uint(0);\n    for (int i = 0; i < octaveCount; i++) {\n        currentSeed = hash(currentSeed, 0x0U);\n        value += perlinNoise(position * currentFrequency, currentSeed) * amplitude;\n        amplitude *= persistence;\n        currentFrequency *= lacunarity;\n    }\n    return value;\n}\n\nfloat get_max_amp(float persistence, float octaveCount) {\n    persistence *= .999;\n    return (1. - pow(persistence, octaveCount)) / (1. - persistence);\n}\n\nvoid main() {\n\n    vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n    float t = .2 * u_time;\n\n    uv -= .5;\n    uv *= (.004 * u_scale * u_resolution);\n    uv /= u_pixelRatio;\n    uv += .5;\n        \n    vec3 p = vec3(uv, t);\n    \n    float oct_count = max(0., floor(u_octaveCount));\n    float persistence = clamp(u_persistence, 0., 1.);\n    float noise = p_noise(p, int(oct_count), persistence, u_lacunarity);\n    \n    float max_amp = get_max_amp(persistence, oct_count);\n    float noise_normalized = (noise + max_amp) / (2. * max_amp) + (u_proportion - .5);\n    float sharpness = clamp(1. - u_contour, 0., 1.);\n    float smooth_w = 0.5 * fwidth(noise_normalized);\n    float sharp_noise = smoothstep(\n        .5 - .5 * sharpness - smooth_w, \n        .5 + .5 * sharpness + smooth_w, \n        noise_normalized\n    );\n\n    vec3 color = mix(u_color1.rgb * u_color1.a, u_color2.rgb * u_color2.a, sharp_noise);\n    float opacity = mix(u_color1.a, u_color2.a, sharp_noise);\n\n    fragColor = vec4(color, opacity);\n}\n";
+export declare const perlinNoiseFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform float u_time;\nuniform float u_pixelRatio;\nuniform vec2 u_resolution;\n\nuniform float u_scale;\nuniform vec4 u_color1;\nuniform vec4 u_color2;\nuniform float u_proportion;\nuniform float u_softness;\nuniform float u_octaveCount;\nuniform float u_persistence;\nuniform float u_lacunarity;\n\nout vec4 fragColor;\n\n#define TWO_PI 6.28318530718\n\nuint hash(uint x, uint seed) {\n  const uint m = 0x5bd1e995U;\n  uint hash = seed;\n    // process input\n    uint k = x;\n    k *= m;\n    k ^= k >> 24;\n    k *= m;\n    hash *= m;\n    hash ^= k;\n    // some final mixing\n    hash ^= hash >> 13;\n    hash *= m;\n    hash ^= hash >> 15;\n    return hash;\n}\n\nuint hash(uvec3 x, uint seed){\n    const uint m = 0x5bd1e995U;\n    uint hash = seed;\n    // process first vector element\n    uint k = x.x; \n    k *= m;\n    k ^= k >> 24;\n    k *= m;\n    hash *= m;\n    hash ^= k;\n    // process second vector element\n    k = x.y; \n    k *= m;\n    k ^= k >> 24;\n    k *= m;\n    hash *= m;\n    hash ^= k;\n    // process third vector element\n    k = x.z; \n    k *= m;\n    k ^= k >> 24;\n    k *= m;\n    hash *= m;\n    hash ^= k;\n    // some final mixing\n    hash ^= hash >> 13;\n    hash *= m;\n    hash ^= hash >> 15;\n    return hash;\n}\n\n\nvec3 gradientdy(uint hash) {\n    switch (int(hash) & 15) { // look at the last four bits to pick a gradient dy\n    case 0:\n        return vec3(1, 1, 0);\n    case 1:\n        return vec3(-1, 1, 0);\n    case 2:\n        return vec3(1, -1, 0);\n    case 3:\n        return vec3(-1, -1, 0);\n    case 4:\n        return vec3(1, 0, 1);\n    case 5:\n        return vec3(-1, 0, 1);\n    case 6:\n        return vec3(1, 0, -1);\n    case 7:\n        return vec3(-1, 0, -1);\n    case 8:\n        return vec3(0, 1, 1);\n    case 9:\n        return vec3(0, -1, 1);\n    case 10:\n        return vec3(0, 1, -1);\n    case 11:\n        return vec3(0, -1, -1);\n    case 12:\n        return vec3(1, 1, 0);\n    case 13:\n        return vec3(-1, 1, 0);\n    case 14:\n        return vec3(0, -1, 1);\n    case 15:\n        return vec3(0, -1, -1);\n    }\n}\n\nfloat interpolate(float value1, float value2, float value3, float value4, float value5, float value6, float value7, float value8, vec3 t) {\n    return mix(\n        mix(mix(value1, value2, t.x), mix(value3, value4, t.x), t.y),\n        mix(mix(value5, value6, t.x), mix(value7, value8, t.x), t.y),\n        t.z\n    );\n}\n\nvec3 fade(vec3 t) {\n    return t * t * t * (t * (t * 6.0 - 15.0) + 10.0);\n}\n\nfloat perlinNoise(vec3 position, uint seed) {\n    position += 1e+4;\n    vec3 floorPosition = floor(position);\n    vec3 fractPosition = fract(position);\n    uvec3 cellCoordinates = uvec3(floorPosition);\n    float value1 = dot(gradientdy(hash(cellCoordinates, seed)), fractPosition);\n    float value2 = dot(gradientdy(hash((cellCoordinates + uvec3(1, 0, 0)), seed)), fractPosition - vec3(1, 0, 0));\n    float value3 = dot(gradientdy(hash((cellCoordinates + uvec3(0, 1, 0)), seed)), fractPosition - vec3(0, 1, 0));\n    float value4 = dot(gradientdy(hash((cellCoordinates + uvec3(1, 1, 0)), seed)), fractPosition - vec3(1, 1, 0));\n    float value5 = dot(gradientdy(hash((cellCoordinates + uvec3(0, 0, 1)), seed)), fractPosition - vec3(0, 0, 1));\n    float value6 = dot(gradientdy(hash((cellCoordinates + uvec3(1, 0, 1)), seed)), fractPosition - vec3(1, 0, 1));\n    float value7 = dot(gradientdy(hash((cellCoordinates + uvec3(0, 1, 1)), seed)), fractPosition - vec3(0, 1, 1));\n    float value8 = dot(gradientdy(hash((cellCoordinates + uvec3(1, 1, 1)), seed)), fractPosition - vec3(1, 1, 1));\n    return interpolate(value1, value2, value3, value4, value5, value6, value7, value8, fade(fractPosition));\n}\n\nfloat p_noise(vec3 position, int octaveCount, float persistence, float lacunarity) {\n    float value = 0.0;\n    float amplitude = 1.0;\n    float currentFrequency = 10.;\n    uint currentSeed = uint(0);\n    for (int i = 0; i < octaveCount; i++) {\n        currentSeed = hash(currentSeed, 0x0U);\n        value += perlinNoise(position * currentFrequency, currentSeed) * amplitude;\n        amplitude *= persistence;\n        currentFrequency *= lacunarity;\n    }\n    return value;\n}\n\nfloat get_max_amp(float persistence, float octaveCount) {\n    persistence *= .999;\n    return (1. - pow(persistence, octaveCount)) / (1. - persistence);\n}\n\nvoid main() {\n\n    vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n    float t = .2 * u_time;\n\n    uv -= .5;\n    uv *= (.004 * u_scale * u_resolution);\n    uv /= u_pixelRatio;\n    uv += .5;\n        \n    vec3 p = vec3(uv, t);\n    \n    float oct_count = max(0., floor(u_octaveCount));\n    float persistence = clamp(u_persistence, 0., 1.);\n    float noise = p_noise(p, int(oct_count), persistence, u_lacunarity);\n    \n    float max_amp = get_max_amp(persistence, oct_count);\n    float noise_normalized = (noise + max_amp) / (2. * max_amp) + (u_proportion - .5);\n    float sharpness = clamp(u_softness, 0., 1.);\n    float smooth_w = 0.5 * fwidth(noise_normalized);\n    float sharp_noise = smoothstep(\n        .5 - .5 * sharpness - smooth_w, \n        .5 + .5 * sharpness + smooth_w, \n        noise_normalized\n    );\n\n    vec3 color = mix(u_color1.rgb * u_color1.a, u_color2.rgb * u_color2.a, sharp_noise);\n    float opacity = mix(u_color1.a, u_color2.a, sharp_noise);\n\n    fragColor = vec4(color, opacity);\n}\n";

package/dist/shaders/smoke-ring.d.ts

@@ -19,4 +19,4 @@ export type SmokeRingUniforms = {
  * u_noiseScale - the resolution of noise texture
  * u_thickness - the thickness of the ring
  */
-export declare const smokeRingFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform float u_pixelRatio;\nuniform vec2 u_resolution;\nuniform float u_time;\n\nuniform float u_scale;\n\nuniform vec4 u_colorBack;\nuniform vec4 u_colorInner;\nuniform vec4 u_colorOuter;\nuniform float u_noiseScale;\nuniform float u_thickness;\n\nout vec4 fragColor;\n\n#define TWO_PI 6.28318530718\n#define PI 3.14159265358979323846\n\nfloat random(in vec2 st) {\n  return fract(sin(dot(st.xy, vec2(12.9898, 78.233))) * 43758.5453123);\n}\nfloat noise(in vec2 st) {\n  vec2 i = floor(st);\n  vec2 f = fract(st);\n  float a = random(i);\n  float b = random(i + vec2(1.0, 0.0));\n  float c = random(i + vec2(0.0, 1.0));\n  float d = random(i + vec2(1.0, 1.0));\n  vec2 u = f * f * (3.0 - 2.0 * f);\n  return mix(a, b, u.x) + (c - a) * u.y * (1.0 - u.x) + (d - b) * u.x * u.y;\n}\nfloat fbm(in vec2 n) {\n  float total = 0.0, amplitude = .4;\n  for (int i = 0; i < 12; i++) {\n    total += noise(n) * amplitude;\n    n += n;\n    amplitude *= 0.6;\n  }\n  return total;\n}\n\nfloat get_ring_shape(vec2 uv, float innerRadius, float outerRadius) {\n  float distance = length(uv);\n  float line_width = outerRadius - innerRadius;\n  float ringValue = smoothstep(innerRadius, innerRadius + .8 * line_width, distance);\n  ringValue -= smoothstep(outerRadius, outerRadius + 1.2 * line_width, distance);\n  return clamp(ringValue, 0., 1.);\n}\n\nvoid main() {\n  vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n  float ratio = u_resolution.x / u_resolution.y;\n\n  uv -= .5;\n  uv /= u_pixelRatio;\n  float scale = .5 * u_scale + 1e-4;\n  uv *= (1. - step(1. - scale, 1.) / scale);\n  uv *= 3.;\n  uv.x *= ratio;\n\n  float t = u_time;\n\n  float atg = atan(uv.y, uv.x);\n  float angle = (atg + PI) / TWO_PI;\n\n  vec2 polar_uv = vec2(atg, .1 * t - (.5 * length(uv)) + 1. / pow(length(uv), .5));\n  polar_uv *= u_noiseScale;\n\n  float noise_left = fbm(polar_uv + .05 * t);\n  polar_uv.x = mod(polar_uv.x, u_noiseScale * TWO_PI);\n  float noise_right = fbm(polar_uv + .05 * t);\n  float noise = mix(noise_right, noise_left, smoothstep(-.2, .2, uv.x));\n\n  float center_shape = 1. - pow(smoothstep(2., .0, length(uv)), 50.);\n\n  float radius = .4 - .25 * u_thickness;\n  float thickness = u_thickness;\n  thickness = pow(thickness, 2.);\n\n  float ring_shape = get_ring_shape(uv * (.5 + .6 * noise), radius - .2 * thickness, radius + .5 * thickness);\n\n  float ring_shape_outer = 1. - pow(ring_shape, 7.);\n  ring_shape_outer *= ring_shape;\n\n  float ring_shape_inner = ring_shape - ring_shape_outer;\n  ring_shape_inner *= ring_shape;\n\n  float background = u_colorBack.a;\n\n  float opacity = ring_shape_outer * u_colorOuter.a;\n  opacity += ring_shape_inner * u_colorInner.a;\n  opacity += background * (1. - ring_shape_inner * u_colorInner.a - ring_shape_outer * u_colorOuter.a);\n\n  vec3 color = u_colorBack.rgb * (1. - ring_shape) * background;\n  color += u_colorOuter.rgb * ring_shape_outer * u_colorOuter.a;\n  color += u_colorInner.rgb * ring_shape_inner * u_colorInner.a;\n\n  color += u_colorBack.rgb * ring_shape_inner * (1. - u_colorInner.a) * background;\n  color += u_colorBack.rgb * ring_shape_outer * (1. - u_colorOuter.a) * background;\n\n  fragColor = vec4(color, opacity);\n}\n";
+export declare const smokeRingFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform float u_pixelRatio;\nuniform vec2 u_resolution;\nuniform float u_time;\n\nuniform float u_scale;\n\nuniform vec4 u_colorBack;\nuniform vec4 u_colorInner;\nuniform vec4 u_colorOuter;\nuniform float u_noiseScale;\nuniform float u_thickness;\n\nout vec4 fragColor;\n\n#define TWO_PI 6.28318530718\n#define PI 3.14159265358979323846\n\nfloat random(in vec2 st) {\n  return fract(sin(dot(st.xy, vec2(12.9898, 78.233))) * 43758.5453123);\n}\nfloat noise(vec2 st) {\n  vec2 i = floor(st);\n  vec2 f = fract(st);\n  float a = random(i);\n  float b = random(i + vec2(1.0, 0.0));\n  float c = random(i + vec2(0.0, 1.0));\n  float d = random(i + vec2(1.0, 1.0));\n\n  // Smoothstep for interpolation\n  vec2 u = f * f * (3.0 - 2.0 * f);\n\n  // Do the interpolation as two nested mix operations\n  // If you try to do this in one big operation, there's enough precision loss to be off by 1px at cell boundaries\n  float x1 = mix(a, b, u.x);\n  float x2 = mix(c, d, u.x);\n  return mix(x1, x2, u.y);\n\n}\nfloat fbm(in vec2 n) {\n  float total = 0.0, amplitude = .4;\n  for (int i = 0; i < 12; i++) {\n    total += noise(n) * amplitude;\n    n += n;\n    amplitude *= 0.6;\n  }\n  return total;\n}\n\nfloat get_ring_shape(vec2 uv, float innerRadius, float outerRadius) {\n  float distance = length(uv);\n  float line_width = outerRadius - innerRadius;\n  float ringValue = smoothstep(innerRadius, innerRadius + .8 * line_width, distance);\n  ringValue -= smoothstep(outerRadius, outerRadius + 1.2 * line_width, distance);\n  return clamp(ringValue, 0., 1.);\n}\n\nvoid main() {\n  vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n  float ratio = u_resolution.x / u_resolution.y;\n\n  uv -= .5;\n  float scale = .5 * u_scale + 1e-4;\n  uv *= (1. - step(1. - scale, 1.) / scale);\n  uv *= 1.5;\n  uv.x *= ratio;\n\n  float t = u_time;\n\n  float atg = atan(uv.y, uv.x);\n  float angle = (atg + PI) / TWO_PI;\n\n  vec2 polar_uv = vec2(atg, .1 * t - (.5 * length(uv)) + 1. / pow(length(uv), .5));\n  polar_uv *= u_noiseScale;\n\n  float noise_left = fbm(polar_uv + mod(.05 * t, 35.));\n  polar_uv.x = mod(polar_uv.x, u_noiseScale * TWO_PI);\n  float noise_right = fbm(polar_uv + mod(.05 * t, 35.));\n  float noise = mix(noise_right, noise_left, smoothstep(-.2, .2, uv.x));\n\n  float center_shape = 1. - pow(smoothstep(2., .0, length(uv)), 50.);\n\n  float radius = .4 - .25 * u_thickness;\n  float thickness = u_thickness;\n  thickness = pow(thickness, 2.);\n\n  float ring_shape = get_ring_shape(uv * (.5 + .6 * noise), radius - .2 * thickness, radius + .5 * thickness);\n\n  float ring_shape_outer = 1. - pow(ring_shape, 7.);\n  ring_shape_outer *= ring_shape;\n\n  float ring_shape_inner = ring_shape - ring_shape_outer;\n  ring_shape_inner *= ring_shape;\n\n  float background = u_colorBack.a;\n\n  float opacity = ring_shape_outer * u_colorOuter.a;\n  opacity += ring_shape_inner * u_colorInner.a;\n  opacity += background * (1. - ring_shape_inner * u_colorInner.a - ring_shape_outer * u_colorOuter.a);\n\n  vec3 color = u_colorBack.rgb * (1. - ring_shape) * background;\n  color += u_colorOuter.rgb * ring_shape_outer * u_colorOuter.a;\n  color += u_colorInner.rgb * ring_shape_inner * u_colorInner.a;\n\n  color += u_colorBack.rgb * ring_shape_inner * (1. - u_colorInner.a) * background;\n  color += u_colorBack.rgb * ring_shape_outer * (1. - u_colorOuter.a) * background;\n\n  fragColor = vec4(color, opacity);\n}\n";

package/dist/shaders/spiral.d.ts

@@ -11,7 +11,7 @@ export type SpiralUniforms = {
     u_strokeCap: number;
     u_noiseFreq: number;
     u_noisePower: number;
-    u_blur: number;
+    u_softness: number;
 };
 /**
  * Spiral shape
@@ -32,6 +32,6 @@ export type SpiralUniforms = {
  * u_strokeTaper (0 .. 1) - controls the tapering effect along the spiral arms.
  * u_noiseFreq - frequency of the noise applied to the spiral.
  * u_noisePower (0 .. 1) - strength of the noise effect.
- * u_blur - softens the edges of the spiral for a smoother appearance.
+ * u_softness - softens the edges of the spiral for a smoother appearance.
  */
-export declare const spiralFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform float u_scale;\nuniform float u_offsetX;\nuniform float u_offsetY;\n\nuniform vec4 u_color1;\nuniform vec4 u_color2;\nuniform float u_spiralDensity;\nuniform float u_spiralDistortion;\nuniform float u_strokeWidth;\nuniform float u_strokeCap;\nuniform float u_strokeTaper;\n\nuniform float u_noiseFreq;\nuniform float u_noisePower;\nuniform float u_blur;\n\nuniform float u_time;\nuniform float u_pixelRatio;\nuniform vec2 u_resolution;\n\n#define TWO_PI 6.28318530718\n#define PI 3.14159265358979323846\n\nout vec4 fragColor;\n\nvec3 permute(vec3 x) { return mod(((x * 34.0) + 1.0) * x, 289.0); }\n\nfloat snoise(vec2 v) {\n  const vec4 C = vec4(0.211324865405187, 0.366025403784439,\n    -0.577350269189626, 0.024390243902439);\n  vec2 i = floor(v + dot(v, C.yy));\n  vec2 x0 = v - i + dot(i, C.xx);\n  vec2 i1;\n  i1 = (x0.x > x0.y) ? vec2(1.0, 0.0) : vec2(0.0, 1.0);\n  vec4 x12 = x0.xyxy + C.xxzz;\n  x12.xy -= i1;\n  i = mod(i, 289.0);\n  vec3 p = permute(permute(i.y + vec3(0.0, i1.y, 1.0))\n    + i.x + vec3(0.0, i1.x, 1.0));\n  vec3 m = max(0.5 - vec3(dot(x0, x0), dot(x12.xy, x12.xy),\n      dot(x12.zw, x12.zw)), 0.0);\n  m = m * m;\n  m = m * m;\n  vec3 x = 2.0 * fract(p * C.www) - 1.0;\n  vec3 h = abs(x) - 0.5;\n  vec3 ox = floor(x + 0.5);\n  vec3 a0 = x - ox;\n  m *= 1.79284291400159 - 0.85373472095314 * (a0 * a0 + h * h);\n  vec3 g;\n  g.x = a0.x * x0.x + h.x * x0.y;\n  g.yz = a0.yz * x12.xz + h.yz * x12.yw;\n  return 130.0 * dot(m, g);\n}\n\nvoid main() {\n  vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n  float ratio = u_resolution.x / u_resolution.y;\n\n  uv -= .5;\n  uv += vec2(-u_offsetX, u_offsetY);\n\n  uv *= (.4 + 30. * u_scale);\n  uv /= u_pixelRatio;\n  uv.x *= ratio;\n\n  float t = u_time;\n\n  float l = length(uv);\n  float angle = atan(uv.y, uv.x) - 2. * t;\n  float angle_norm = angle / TWO_PI;  \n\n  angle_norm += .125 * u_noisePower * snoise(.5 * u_noiseFreq * uv);\n\n  float offset = pow(l, 1. - clamp(0., 1., u_spiralDensity)) + angle_norm;\n  \n  float stripe_map = fract(offset);\n  stripe_map -= .5 * u_strokeTaper * l;\n  \n  stripe_map += .25 * u_noisePower * snoise(u_noiseFreq * uv);\n\n  float shape = 2. * abs(stripe_map - .5);\n  \n  shape *= (1. + u_spiralDistortion * sin(4. * l - t) * cos(PI + l + t));\n    \n  float stroke_width = clamp(u_strokeWidth, fwidth(l), 1. - fwidth(l));\n\n  float edge_width = min(fwidth(l), fwidth(offset));\n\n  float mid = 1. - smoothstep(.0, .9, l);\n  mid = pow(mid, 2.);\n  shape -= .5 * u_strokeCap * mid;\n  \n  shape = smoothstep(stroke_width - edge_width - u_blur, stroke_width + edge_width + u_blur, shape);\n\n  vec3 color = mix(u_color1.rgb * u_color1.a, u_color2.rgb * u_color2.a, shape);\n  float opacity = mix(u_color1.a, u_color2.a, shape);\n\n  fragColor = vec4(color, opacity);\n}\n";
+export declare const spiralFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform float u_scale;\nuniform float u_offsetX;\nuniform float u_offsetY;\n\nuniform vec4 u_color1;\nuniform vec4 u_color2;\nuniform float u_spiralDensity;\nuniform float u_spiralDistortion;\nuniform float u_strokeWidth;\nuniform float u_strokeCap;\nuniform float u_strokeTaper;\n\nuniform float u_noiseFreq;\nuniform float u_noisePower;\nuniform float u_softness;\n\nuniform float u_time;\nuniform float u_pixelRatio;\nuniform vec2 u_resolution;\n\n#define TWO_PI 6.28318530718\n#define PI 3.14159265358979323846\n\nout vec4 fragColor;\n\nvec3 permute(vec3 x) { return mod(((x * 34.0) + 1.0) * x, 289.0); }\n\nfloat snoise(vec2 v) {\n  const vec4 C = vec4(0.211324865405187, 0.366025403784439,\n    -0.577350269189626, 0.024390243902439);\n  vec2 i = floor(v + dot(v, C.yy));\n  vec2 x0 = v - i + dot(i, C.xx);\n  vec2 i1;\n  i1 = (x0.x > x0.y) ? vec2(1.0, 0.0) : vec2(0.0, 1.0);\n  vec4 x12 = x0.xyxy + C.xxzz;\n  x12.xy -= i1;\n  i = mod(i, 289.0);\n  vec3 p = permute(permute(i.y + vec3(0.0, i1.y, 1.0))\n    + i.x + vec3(0.0, i1.x, 1.0));\n  vec3 m = max(0.5 - vec3(dot(x0, x0), dot(x12.xy, x12.xy),\n      dot(x12.zw, x12.zw)), 0.0);\n  m = m * m;\n  m = m * m;\n  vec3 x = 2.0 * fract(p * C.www) - 1.0;\n  vec3 h = abs(x) - 0.5;\n  vec3 ox = floor(x + 0.5);\n  vec3 a0 = x - ox;\n  m *= 1.79284291400159 - 0.85373472095314 * (a0 * a0 + h * h);\n  vec3 g;\n  g.x = a0.x * x0.x + h.x * x0.y;\n  g.yz = a0.yz * x12.xz + h.yz * x12.yw;\n  return 130.0 * dot(m, g);\n}\n\nvoid main() {\n  vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n  float ratio = u_resolution.x / u_resolution.y;\n\n  uv -= .5;\n  uv += vec2(-u_offsetX, u_offsetY);\n\n  uv *= (.4 + 15. * u_scale);\n  uv.x *= ratio;\n\n  float t = u_time;\n\n  float l = length(uv);\n  float angle = atan(uv.y, uv.x) - 2. * t;\n  float angle_norm = angle / TWO_PI;  \n\n  angle_norm += .125 * u_noisePower * snoise(.5 * u_noiseFreq * uv);\n\n  float offset = pow(l, 1. - clamp(u_spiralDensity, 0., 1.)) + angle_norm;\n  \n  float stripe_map = fract(offset);\n  stripe_map -= .5 * u_strokeTaper * l;\n  \n  stripe_map += .25 * u_noisePower * snoise(u_noiseFreq * uv);\n\n  float shape = 2. * abs(stripe_map - .5);\n  \n  shape *= (1. + u_spiralDistortion * sin(4. * l - t) * cos(PI + l + t));\n    \n  float stroke_width = clamp(u_strokeWidth, fwidth(l), 1. - fwidth(l));\n\n  float edge_width = min(fwidth(l), fwidth(offset));\n\n  float mid = 1. - smoothstep(.0, .9, l);\n  mid = pow(mid, 2.);\n  shape -= .5 * u_strokeCap * mid;\n  \n  shape = smoothstep(stroke_width - edge_width - u_softness, stroke_width + edge_width + u_softness, shape);\n\n  vec3 color = mix(u_color1.rgb * u_color1.a, u_color2.rgb * u_color2.a, shape);\n  float opacity = mix(u_color1.a, u_color2.a, shape);\n\n  fragColor = vec4(color, opacity);\n}\n";

package/dist/shaders/voronoi.d.ts

@@ -8,9 +8,9 @@ export type VoronoiUniforms = {
     u_colorGradient: number;
     u_distance: number;
     u_edgesSize: number;
-    u_edgesSharpness: number;
+    u_edgesSoftness: number;
     u_middleSize: number;
-    u_middleSharpness: number;
+    u_middleSoftness: number;
 };
 /**
  * Voronoi pattern
@@ -28,9 +28,9 @@ export type VoronoiUniforms = {
  * u_distance (0 ... 0.5) - how far the cell center can move from regular square grid
  * u_edgesSize (0 .. 1) - the size of borders
  *   (can be set to zero but the edge may get glitchy due to nature of Voronoi diagram)
- * u_edgesSharpness (0 .. 1) - the blur/sharp for cell border
+ * u_edgesSoftness (0 .. 1) - the blur/sharp for cell border
  * u_middleSize (0 .. 1) - the size of shape in the center of each cell
- * u_middleSharpness (0 .. 1) - the smoothness of shape in the center of each cell
+ * u_middleSoftness (0 .. 1) - the smoothness of shape in the center of each cell
  *   (vary from cell color gradient to sharp dot in the middle)
  */
-export declare const voronoiFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform float u_time;\nuniform float u_pixelRatio;\nuniform vec2 u_resolution;\n\nuniform float u_scale;\n\nuniform vec4 u_colorCell1;\nuniform vec4 u_colorCell2;\nuniform vec4 u_colorCell3;\nuniform vec4 u_colorEdges;\nuniform vec4 u_colorMid;\n\nuniform float u_colorGradient;\nuniform float u_distance;\nuniform float u_edgesSize;\nuniform float u_edgesSharpness;\nuniform float u_middleSize;\nuniform float u_middleSharpness;\n\n#define TWO_PI 6.28318530718\n\nout vec4 fragColor;\n\nvec2 hash(vec2 p) {\n  p = vec2(dot(p, vec2(127.1, 311.7)), dot(p, vec2(269.5, 183.3)));\n  return fract(sin(p) * 18.5453);\n}\n\nfloat smin(float angle, float b, float k) {\n  float h = clamp(.5 + .5 * (b - angle) / k, 0., 1.);\n  return mix(b, angle, h) - k * h * (1. - h);\n}\n\nvec4 blend_colors(vec4 c1, vec4 c2, vec4 c3, vec2 randomizer) {\n    vec3 color1 = c1.rgb * c1.a;\n    vec3 color2 = c2.rgb * c2.a;\n    vec3 color3 = c3.rgb * c3.a;\n\n    float mixer = clamp(u_colorGradient, 0., 1.);\n    float r1 = smoothstep(.5 - .5 * mixer, .5 + .5 * mixer, randomizer[0]);\n    float r2 = smoothstep(.6 - .6 * mixer, .6 + .4 * mixer, randomizer[1]);\n    vec3 blended_color_2 = mix(color1, color2, r1);\n    float blended_opacity_2 = mix(c1.a, c2.a, r1);\n    vec3 c = mix(blended_color_2, color3, r2);\n    float o = mix(blended_opacity_2, c3.a, r2);\n    \n    return vec4(c, o);\n}\n\nvoid main() {\n  vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n  float t = u_time;\n  uv -= .5;\n  uv *= (.01 * u_scale * u_resolution);\n  uv /= u_pixelRatio;\n  uv += .5;\n\n  vec2 i_uv = floor(uv);\n  vec2 f_uv = fract(uv);\n\n  vec2 randomizer = vec2(0.);\n  vec3 distance = vec3(1.);\n\n  for (int y = -1; y <= 1; y++) {\n    for (int x = -1; x <= 1; x++) {\n      vec2 tile_offset = vec2(float(x), float(y));\n      vec2 o = hash(i_uv + tile_offset);\n      tile_offset += (.5 + clamp(u_distance, 0., .5) * sin(t + TWO_PI * o)) - f_uv;\n\n      float dist = dot(tile_offset, tile_offset);\n      float old_min_dist = distance.x;\n\n      distance.z = max(distance.x, max(distance.y, min(distance.z, dist)));\n      distance.y = max(distance.x, min(distance.y, dist));\n      distance.x = min(distance.x, dist);\n\n      if (old_min_dist > distance.x) {\n        randomizer = o;\n      }\n    }\n  }\n\n  distance = sqrt(distance);\n\n  distance = sqrt(distance);\n  float cell_shape = min(smin(distance.z, distance.y, .1) - distance.x, 1.);\n\n  float dot_shape = pow(distance.x, 2.) / (2. * clamp(u_middleSize, 0., 1.) + 1e-4);\n  float dot_edge_width = fwidth(dot_shape);\n  float dotSharp = clamp(u_middleSharpness, 0., 1.);\n  dot_shape = 1. - smoothstep(.5 * dotSharp - dot_edge_width, 1. - .5 * dotSharp, dot_shape);\n\n  float cell_edge_width = fwidth(distance.x);\n  float w = .7 * (clamp(u_edgesSize, 0., 1.) - .1);\n  float edgeSharp = clamp(u_edgesSharpness, 0., 1.);\n  cell_shape = smoothstep(w - cell_edge_width, w + edgeSharp, cell_shape);\n\n  dot_shape *= cell_shape;\n\n  vec4 cell_mix = blend_colors(u_colorCell1, u_colorCell2, u_colorCell3, randomizer);\n  \n  vec4 edges = vec4(u_colorEdges.rgb * u_colorEdges.a, u_colorEdges.a);\n\n  vec3 color = mix(edges.rgb, cell_mix.rgb, cell_shape);\n  float opacity = mix(edges.a, cell_mix.a, cell_shape);\n\n  color = mix(color, u_colorMid.rgb * u_colorMid.a, dot_shape);\n  opacity = mix(opacity, u_colorMid.a, dot_shape);\n\n  fragColor = vec4(color, opacity);\n}\n";
+export declare const voronoiFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform float u_time;\nuniform float u_pixelRatio;\nuniform vec2 u_resolution;\n\nuniform float u_scale;\n\nuniform vec4 u_colorCell1;\nuniform vec4 u_colorCell2;\nuniform vec4 u_colorCell3;\nuniform vec4 u_colorEdges;\nuniform vec4 u_colorMid;\n\nuniform float u_colorGradient;\nuniform float u_distance;\nuniform float u_edgesSize;\nuniform float u_edgesSoftness;\nuniform float u_middleSize;\nuniform float u_middleSoftness;\n\n#define TWO_PI 6.28318530718\n\nout vec4 fragColor;\n\nvec2 hash(vec2 p) {\n  p = vec2(dot(p, vec2(127.1, 311.7)), dot(p, vec2(269.5, 183.3)));\n  return fract(sin(p) * 18.5453);\n}\n\nfloat smin(float angle, float b, float k) {\n  float h = clamp(.5 + .5 * (b - angle) / k, 0., 1.);\n  return mix(b, angle, h) - k * h * (1. - h);\n}\n\nvec4 blend_colors(vec4 c1, vec4 c2, vec4 c3, vec2 randomizer) {\n    vec3 color1 = c1.rgb * c1.a;\n    vec3 color2 = c2.rgb * c2.a;\n    vec3 color3 = c3.rgb * c3.a;\n\n    float mixer = clamp(u_colorGradient, 0., 1.);\n    float r1 = smoothstep(.5 - .5 * mixer, .5 + .5 * mixer, randomizer[0]);\n    float r2 = smoothstep(.6 - .6 * mixer, .6 + .4 * mixer, randomizer[1]);\n    vec3 blended_color_2 = mix(color1, color2, r1);\n    float blended_opacity_2 = mix(c1.a, c2.a, r1);\n    vec3 c = mix(blended_color_2, color3, r2);\n    float o = mix(blended_opacity_2, c3.a, r2);\n    \n    return vec4(c, o);\n}\n\nvoid main() {\n  vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n  float t = u_time;\n  uv -= .5;\n  uv *= (.01 * u_scale * u_resolution);\n  uv /= u_pixelRatio;\n  uv += .5;\n\n  vec2 i_uv = floor(uv);\n  vec2 f_uv = fract(uv);\n\n  vec2 randomizer = vec2(0.);\n  vec3 distance = vec3(1.);\n\n  for (int y = -1; y <= 1; y++) {\n    for (int x = -1; x <= 1; x++) {\n      vec2 tile_offset = vec2(float(x), float(y));\n      vec2 o = hash(i_uv + tile_offset);\n      tile_offset += (.5 + clamp(u_distance, 0., .5) * sin(t + TWO_PI * o)) - f_uv;\n\n      float dist = dot(tile_offset, tile_offset);\n      float old_min_dist = distance.x;\n\n      distance.z = max(distance.x, max(distance.y, min(distance.z, dist)));\n      distance.y = max(distance.x, min(distance.y, dist));\n      distance.x = min(distance.x, dist);\n\n      if (old_min_dist > distance.x) {\n        randomizer = o;\n      }\n    }\n  }\n\n  distance = sqrt(distance);\n\n  distance = sqrt(distance);\n  float cell_shape = min(smin(distance.z, distance.y, .1) - distance.x, 1.);\n\n  float dot_shape = pow(distance.x, 2.) / (2. * clamp(u_middleSize, 0., 1.) + 1e-4);\n  float dot_edge_width = fwidth(dot_shape);\n  float dotSharp = clamp(1. - u_middleSoftness, 0., 1.);\n  dot_shape = 1. - smoothstep(.5 * dotSharp - dot_edge_width, 1. - .5 * dotSharp, dot_shape);\n\n  float cell_edge_width = fwidth(distance.x);\n  float w = .7 * (clamp(u_edgesSize, 0., 1.) - .1);\n  float edgeSharp = clamp(u_edgesSoftness, 0., 1.);\n  cell_shape = smoothstep(w - cell_edge_width, w + edgeSharp, cell_shape);\n\n  dot_shape *= cell_shape;\n\n  vec4 cell_mix = blend_colors(u_colorCell1, u_colorCell2, u_colorCell3, randomizer);\n  \n  vec4 edges = vec4(u_colorEdges.rgb * u_colorEdges.a, u_colorEdges.a);\n\n  vec3 color = mix(edges.rgb, cell_mix.rgb, cell_shape);\n  float opacity = mix(edges.a, cell_mix.a, cell_shape);\n\n  color = mix(color, u_colorMid.rgb * u_colorMid.a, dot_shape);\n  opacity = mix(opacity, u_colorMid.a, dot_shape);\n\n  fragColor = vec4(color, opacity);\n}\n";

package/dist/shaders/waves.d.ts

@@ -8,7 +8,7 @@ export type WavesUniforms = {
     u_amplitude: number;
     u_spacing: number;
     u_dutyCycle: number;
-    u_edgeBlur: number;
+    u_softness: number;
 };
 /**
  * Stepped Simplex Noise by Ksenia Kondrashova
@@ -29,6 +29,6 @@ export type WavesUniforms = {
  * u_amplitude - the wave amplitude
  * u_spacing - the density of pattern lines
  * u_dutyCycle (0 ... 1) - the proportion of stroke width to the pattern step
- * u_edgeBlur (0 ... 1) - the blur applied to the lines edges
+ * u_softness (0 ... 1) - the blur applied to the lines edges
  */
-export declare const wavesFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform float u_pixelRatio;\nuniform vec2 u_resolution;\n\nuniform float u_scale;\nuniform float u_rotation;\n\nuniform vec4 u_color1;\nuniform vec4 u_color2;\nuniform float u_shape;\nuniform float u_frequency;\nuniform float u_amplitude;\nuniform float u_spacing;\nuniform float u_dutyCycle;\nuniform float u_edgeBlur;\n\n#define TWO_PI 6.28318530718\n#define PI 3.14159265358979323846\n\nout vec4 fragColor;\n\nvec2 rotate(vec2 uv, float th) {\n  return mat2(cos(th), sin(th), -sin(th), cos(th)) * uv;\n}\n\nvoid main() {\n  vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n\n  uv -= .5;\n  uv *= (.02 * max(0., u_scale) * u_resolution);\n  uv = rotate(uv, u_rotation * .5 * PI);\n  uv /= u_pixelRatio;\n  uv += .5;\n\n  float wave = .5 * cos(uv.x * u_frequency * TWO_PI);\n  float zigzag = 2. * abs(fract(uv.x * u_frequency) - .5);\n  float irregular = sin(uv.x * .25 * u_frequency * TWO_PI) * cos(uv.x * u_frequency * TWO_PI);\n  float irregular2 = .75 * (sin(uv.x * u_frequency * TWO_PI) + .5 * cos(uv.x * .5 * u_frequency * TWO_PI));\n\n  float offset = mix(zigzag, wave, smoothstep(0., 1., u_shape));\n  offset = mix(offset, irregular, smoothstep(1., 2., u_shape));\n  offset = mix(offset, irregular2, smoothstep(2., 3., u_shape));\n  offset *= 2. * u_amplitude;\n  \n  float spacing = .02 + .98 * u_spacing;\n  float shape = .5 + .5 * sin((uv.y + offset) * PI / spacing);\n  \n  float edge_width = .02 / (1. + abs(shape)) * (.001 + u_scale);\n  edge_width += .5 * max(0., u_edgeBlur);\n  float dc = clamp(u_dutyCycle, 0., 1.);\n  float t = smoothstep(dc - edge_width, dc + edge_width, shape);\n\n  vec3 color = mix(u_color1.rgb * u_color1.a, u_color2.rgb * u_color2.a, t);\n  float opacity = mix(u_color1.a, u_color2.a, t);\n  \n  fragColor = vec4(color, opacity);\n}\n";
+export declare const wavesFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform float u_pixelRatio;\nuniform vec2 u_resolution;\n\nuniform float u_scale;\nuniform float u_rotation;\n\nuniform vec4 u_color1;\nuniform vec4 u_color2;\nuniform float u_shape;\nuniform float u_frequency;\nuniform float u_amplitude;\nuniform float u_spacing;\nuniform float u_dutyCycle;\nuniform float u_softness;\n\n#define TWO_PI 6.28318530718\n#define PI 3.14159265358979323846\n\nout vec4 fragColor;\n\nvec2 rotate(vec2 uv, float th) {\n  return mat2(cos(th), sin(th), -sin(th), cos(th)) * uv;\n}\n\nvoid main() {\n  vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n\n  uv -= .5;\n  uv *= (.02 * max(0., u_scale) * u_resolution);\n  uv = rotate(uv, u_rotation * .5 * PI);\n  uv /= u_pixelRatio;\n  uv += .5;\n\n  float wave = .5 * cos(uv.x * u_frequency * TWO_PI);\n  float zigzag = 2. * abs(fract(uv.x * u_frequency) - .5);\n  float irregular = sin(uv.x * .25 * u_frequency * TWO_PI) * cos(uv.x * u_frequency * TWO_PI);\n  float irregular2 = .75 * (sin(uv.x * u_frequency * TWO_PI) + .5 * cos(uv.x * .5 * u_frequency * TWO_PI));\n\n  float offset = mix(zigzag, wave, smoothstep(0., 1., u_shape));\n  offset = mix(offset, irregular, smoothstep(1., 2., u_shape));\n  offset = mix(offset, irregular2, smoothstep(2., 3., u_shape));\n  offset *= 2. * u_amplitude;\n  \n  float spacing = .02 + .98 * u_spacing;\n  float shape = .5 + .5 * sin((uv.y + offset) * PI / spacing);\n  \n  float edge_width = .02 / (1. + abs(shape)) * (.001 + u_scale);\n  edge_width += .5 * max(0., u_softness);\n  float dc = clamp(u_dutyCycle, 0., 1.);\n  float t = smoothstep(dc - edge_width, dc + edge_width, shape);\n\n  vec3 color = mix(u_color1.rgb * u_color1.a, u_color2.rgb * u_color2.a, t);\n  float opacity = mix(u_color1.a, u_color2.a, t);\n  \n  fragColor = vec4(color, opacity);\n}\n";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paper-design/shaders",
-  "version": "0.0.19",
+  "version": "0.0.21",
   "license": "MIT",
   "type": "module",
   "publishConfig": {

package/dist/shaders/dots-grid.d.ts

@@ -1,37 +0,0 @@
-/** Possible values for the shape uniform */
-export declare const DotsGridShapes: {
-    readonly Circle: 0;
-    readonly Diamond: 1;
-    readonly Square: 2;
-    readonly Triangle: 3;
-};
-export type DotsGridShape = (typeof DotsGridShapes)[keyof typeof DotsGridShapes];
-export type DotsGridUniforms = {
-    u_colorBack: [number, number, number, number];
-    u_colorFill: [number, number, number, number];
-    u_colorStroke: [number, number, number, number];
-    u_dotSize: number;
-    u_gridSpacingX: number;
-    u_gridSpacingY: number;
-    u_strokeWidth: number;
-    u_sizeRange: number;
-    u_opacityRange: number;
-    u_shape: DotsGridShape;
-};
-/**
- * Dot Grid Pattern
- * (the size parameters are set in pixels)
- *
- * Uniforms include:
- * u_colorBack - the background color
- * u_colorFill - the dots fill color
- * u_colorStroke - the dots stroke color
- * u_dotSize (px) - the base dot radius
- * u_strokeWidth (px) - the stroke (to be subtracted from u_dotSize)
- * u_gridSpacingX (px) - horizontal grid spacing
- * u_gridSpacingY (px) - xertical grid spacing
- * u_sizeRange (0 .. 1) - variety of dot size
- * u_opacityRange(0 .. 1) - variety of dot opacity to be applied equally to fill and stroke
- * u_shape - shape code (0 - circle, 1 - diamond, 2 - square, 3 - triangle)
- */
-export declare const dotsGridFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform vec2 u_resolution;\nuniform float u_pixelRatio;\n\nuniform vec4 u_colorBack;\nuniform vec4 u_colorFill;\nuniform vec4 u_colorStroke;\nuniform float u_dotSize;\nuniform float u_gridSpacingX;\nuniform float u_gridSpacingY;\nuniform float u_strokeWidth;\nuniform float u_sizeRange;\nuniform float u_opacityRange;\nuniform float u_shape;\n\nout vec4 fragColor;\n\n#define TWO_PI 6.28318530718\n#define PI 3.14159265358979323846\n\nfloat hash(vec2 st) {\n    return fract(sin(dot(st.xy, vec2(12.9898, 78.233))) * 43758.5453123);\n}\n\nvec3 permute(vec3 x) { return mod(((x*34.0)+1.0)*x, 289.0); }\n\n  float snoise(vec2 v) {\n    const vec4 C = vec4(0.211324865405187, 0.366025403784439,\n                        -0.577350269189626, 0.024390243902439);\n    vec2 i  = floor(v + dot(v, C.yy));\n    vec2 x0 = v -   i + dot(i, C.xx);\n    vec2 i1;\n    i1 = (x0.x > x0.y) ? vec2(1.0, 0.0) : vec2(0.0, 1.0);\n    vec4 x12 = x0.xyxy + C.xxzz;\n    x12.xy -= i1;\n    i = mod(i, 289.0);\n    vec3 p = permute( permute( i.y + vec3(0.0, i1.y, 1.0))\n    + i.x + vec3(0.0, i1.x, 1.0));\n    vec3 m = max(0.5 - vec3(dot(x0,x0), dot(x12.xy,x12.xy),\n      dot(x12.zw,x12.zw)), 0.0);\n    m = m*m ;\n    m = m*m ;\n    vec3 x = 2.0 * fract(p * C.www) - 1.0;\n    vec3 h = abs(x) - 0.5;\n    vec3 ox = floor(x + 0.5);\n    vec3 a0 = x - ox;\n    m *= 1.79284291400159 - 0.85373472095314 * (a0*a0 + h*h);\n    vec3 g;\n    g.x = a0.x * x0.x + h.x * x0.y;\n    g.yz = a0.yz * x12.xz + h.yz * x12.yw;\n    return 130.0 * dot(m, g);\n  }\nfloat polygon(vec2 p, float N, float rot) {\n    float a = atan(p.x, p.y) + rot;\n    float r = TWO_PI / float(N);\n\n    return cos(floor(.5 + a/r) * r - a) * length(p);\n}\n\nvoid main() {\n    vec2 uv = gl_FragCoord.xy;\n    uv.y = u_resolution.y - uv.y;\n\n    uv /= u_pixelRatio;\n\n    vec2 grid = fract(uv / vec2(u_gridSpacingX, u_gridSpacingY)) + 1e-4;\n    vec2 grid_idx = floor(uv / vec2(u_gridSpacingX, u_gridSpacingY));\n    float size_randomizer = .5 + .5 * snoise(2. * vec2(grid_idx.x * 100., grid_idx.y));\n    float opacity_randomizer = .5 + .5 * snoise(2. * vec2(grid_idx.y, grid_idx.x));\n\n    vec2 center = vec2(0.5) - 1e-3;\n    vec2 p = (grid - center) * vec2(u_gridSpacingX, u_gridSpacingY);\n\n    float base_size = u_dotSize * (1. - size_randomizer * clamp(u_sizeRange, 0., 1.));\n    float stroke_width = u_strokeWidth;\n\n    float dist;\n    if (u_shape < 0.5) {\n        // Circle\n        dist = length(p);\n    } else if (u_shape < 1.5) {\n        // Diamond\n        dist = polygon(1.5 * p, 4., .25 * PI);\n    } else if (u_shape < 2.5) {\n        // Square\n        dist = polygon(1.5 * p, 4., 1e-3);\n    } else {\n        // Triangle\n        p = p * 2. - 1.;\n        p.y -= .75 * base_size;\n        stroke_width *= 2.;\n        dist = polygon(p, 3., 1e-3);\n    }\n\n    float edge_width = fwidth(dist);\n    float shape_outer = smoothstep(base_size + edge_width, base_size - edge_width, dist);\n    float shape_inner = smoothstep(base_size - u_strokeWidth + edge_width, base_size - u_strokeWidth - edge_width, dist);\n    float stroke = clamp(shape_outer - shape_inner, 0., 1.);\n\n    float dot_opacity = max(0., 1. - opacity_randomizer * clamp(u_opacityRange, 0., 1.));\n\n    vec3 color = u_colorBack.rgb * u_colorBack.a;\n    color = mix(color, u_colorFill.rgb, u_colorFill.a * dot_opacity * shape_inner);\n    color = mix(color, u_colorStroke.rgb, u_colorStroke.a * dot_opacity * stroke);\n\n    float opacity = u_colorBack.a;\n    opacity += u_colorFill.a * shape_inner * dot_opacity;\n    opacity += u_colorStroke.a * stroke * dot_opacity;\n\n    fragColor = vec4(color, opacity);\n}\n";

package/dist/shaders/dots-orbit.d.ts

@@ -1,26 +0,0 @@
-export type DotsOrbitUniforms = {
-    u_scale: number;
-    u_color1: [number, number, number, number];
-    u_color2: [number, number, number, number];
-    u_color3: [number, number, number, number];
-    u_color4: [number, number, number, number];
-    u_dotSize: number;
-    u_dotSizeRange: number;
-    u_spreading: number;
-};
-/**
- * Dots Pattern with dots moving around their grid position
- * The artwork by Ksenia Kondrashova
- * Renders a dot pattern with dots placed in the center of each cell of animated Voronoi diagram
- *
- * Uniforms include:
- * u_scale - the scale applied to user space
- * u_color1 - the first dots color
- * u_color2 - the second dots color
- * u_color3 - the third dots color
- * u_color4 - the fourth dots color
- * u_dotSize (0 .. 1) - the base dot radius (relative to cell size)
- * u_dotSizeRange (0 .. 1) - the dot radius to vary between the cells
- * u_spreading (0 .. 1) - the distance each dot can move around the regular grid
- */
-export declare const dotsOrbitFragmentShader = "#version 300 es\nprecision highp float;\n\nuniform float u_time;\nuniform float u_pixelRatio;\nuniform vec2 u_resolution;\n\nuniform float u_scale;\nuniform vec4 u_color1;\nuniform vec4 u_color2;\nuniform vec4 u_color3;\nuniform vec4 u_color4;\nuniform float u_dotSize;\nuniform float u_dotSizeRange;\nuniform float u_spreading;\n\nout vec4 fragColor;\n\n#define TWO_PI 6.28318530718\n\nfloat random(in vec2 st) {\n  return fract(sin(dot(st.xy, vec2(12.9898, 78.233))) * 43758.5453123);\n}\nvec2 random2(vec2 p) {\n  return vec2(random(p), random(200. * p));\n}\n\nvec3 get_voronoi_shape(vec2 _uv, float time) {\n  vec2 i_uv = floor(_uv);\n  vec2 f_uv = fract(_uv);\n\n  float min_dist = 1.;\n  vec2 cell_randomizer = vec2(0.);\n  for (int y = -1; y <= 1; y++) {\n    for (int x = -1; x <= 1; x++) {\n      vec2 tile_offset = vec2(float(x), float(y));\n      vec2 rand = random2(i_uv + tile_offset);\n      vec2 cell_center = .5 + 1e-4 + .25 * clamp(u_spreading, 0., 1.) * sin(time + TWO_PI * rand);\n      float dist = length(tile_offset + cell_center - f_uv);\n      if (dist < min_dist) {\n        min_dist = dist;\n        cell_randomizer = rand;\n      }\n      min_dist = min(min_dist, dist);\n    }\n  }\n\n  return vec3(min_dist, cell_randomizer);\n}\n\nvoid main() {\n  vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n\n  uv -= .5;\n  float scale = .5 * u_scale + 1e-4;\n  uv *= (.02 * (1. - step(1. - scale, 1.) / scale));\n  uv *= u_resolution;\n  uv /= u_pixelRatio;\n  uv += .5;\n\n  float t = u_time;\n\n  vec3 voronoi = get_voronoi_shape(uv, t) + 1e-4;\n\n  float radius = .25 * clamp(u_dotSize, 0., 1.) - .5 * clamp(u_dotSizeRange, 0., 1.) * voronoi[2];\n  float dist = voronoi[0];\n  float edge_width = fwidth(dist);\n  float shape = smoothstep(radius + edge_width, radius - edge_width, dist);\n\n  float color_randomizer = voronoi[1];\n\n  float opacity =\n    u_color1.a * step(0.0, color_randomizer) * step(color_randomizer, 0.25) +\n    u_color2.a * step(0.25, color_randomizer) * step(color_randomizer, 0.5) +\n    u_color3.a * step(0.5, color_randomizer) * step(color_randomizer, 0.75) +\n    u_color4.a * step(0.75, color_randomizer) * step(color_randomizer, 1.0);\n\n  opacity *= shape;\n\n  vec3 color =\n    u_color1.rgb * step(0.0, color_randomizer) * step(color_randomizer, 0.25) +\n    u_color2.rgb * step(0.25, color_randomizer) * step(color_randomizer, 0.5) +\n    u_color3.rgb * step(0.5, color_randomizer) * step(color_randomizer, 0.75) +\n    u_color4.rgb * step(0.75, color_randomizer) * step(color_randomizer, 1.0);\n\n  fragColor = vec4(color * opacity, opacity);\n}\n";