@paper-design/shaders 0.0.80 → 0.0.81

package/dist/shaders/gem-smoke.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/gem-smoke.ts"],
-  "sourcesContent": ["import type { vec4 } from '../types.js';\nimport type { ShaderMotionParams } from '../shader-mount.js';\nimport type { ShaderSizingParams, ShaderSizingUniforms } from '../shader-sizing.js';\nimport { rotation2, declarePI } from '../shader-utils.js';\n\nexport const gemSmokeMeta = {\n  maxColorCount: 6,\n} as const;\n\n/**\n * Animated color fields placed over uploaded logo shape; gives the illusion of smoky noise\n * behind the glassy shape.\n *\n * Fragment shader uniforms:\n * - u_time (float): Animation time\n * - u_resolution (vec2): Canvas resolution in pixels\n * - u_image (sampler2D): Pre-processed source image texture (R = edge gradient, G = alpha)\n * - u_imageAspectRatio (float): Aspect ratio of the source image\n * - u_colors (vec4[]): Up to 6 smoke colors in RGBA\n * - u_colorsCount (float): Number of active colors\n * - u_colorBack (vec4): Background color in RGBA\n * - u_innerDistortion (float): Power of smoke distortion inside the input shape (0 to 1)\n * - u_outerDistortion (float): Power of smoke distortion outside the input shape (0 to 1)\n * - u_outerGlow (float): Visibility of smoke shape outside the input shape (0 to 1)\n * - u_innerGlow (float): Visibility of smoke shape inside the input shape (0 to 1)\n * - u_colorInner (vec4): Additional color inside the input shape, mixing with smoke (RGBA)\n * - u_offset (float): Vertical offset of smoke inside the shape (-1 to 1)\n * - u_angle (float): Smoke direction in degrees (0 to 360)\n * - u_size (float): Size of smoke shape relative to the image box (0 to 1)\n *\n * Vertex shader outputs (used in fragment shader):\n * - v_imageUV (vec2): UV coordinates for sampling the source image, with fit, scale, rotation, and offset applied\n * - v_objectUV (vec2): Normalized UV coordinates with scale, rotation, and offset applied\n *\n * Vertex shader uniforms:\n * - u_resolution (vec2): Canvas resolution in pixels\n * - u_pixelRatio (float): Device pixel ratio\n * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)\n * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)\n * - u_worldWidth (float): Virtual width of the graphic before it's scaled to fit the canvas\n * - u_worldHeight (float): Virtual height of the graphic before it's scaled to fit the canvas\n * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)\n * - u_scale (float): Overall zoom level of the graphics (0.01 to 4)\n * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)\n * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)\n * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)\n * - u_imageAspectRatio (float): Aspect ratio of the source image\n *\n */\n\n// language=GLSL\nexport const gemSmokeFragmentShader: string = `#version 300 es\nprecision mediump float;\n\nin mediump vec2 v_imageUV;\nin mediump vec2 v_objectUV;\nin mediump vec2 v_responsiveUV;\nin mediump vec2 v_responsiveBoxGivenSize;\nout vec4 fragColor;\n\n// Image\nuniform sampler2D u_image;\nuniform float u_imageAspectRatio;\n\n// Canvas\nuniform vec2 u_resolution;\nuniform float u_time;\n\n// Colors\nuniform vec4 u_colors[${gemSmokeMeta.maxColorCount}];\nuniform float u_colorsCount;\nuniform vec4 u_colorBack;\nuniform vec4 u_colorInner;\n\n// Effect controls\nuniform float u_innerDistortion;\nuniform float u_outerDistortion;\nuniform float u_outerGlow;\nuniform float u_innerGlow;\nuniform float u_offset;\nuniform float u_angle;\nuniform float u_size;\n\n// Shape controls\nuniform float u_shape;\nuniform bool u_isImage;\n\n${ declarePI }\n${ rotation2 }\n\n// 9x9 Gaussian blur on R and G channels\nvec2 gaussBlur9x9RG(sampler2D tex, vec2 uv, vec2 dudx, vec2 dudy, float radius) {\n  vec2 texel = 1.0 / vec2(textureSize(tex, 0));\n  vec2 r = max(radius, 0.0) * texel;\n  // Pascal's row 8: sum = 256, 2D norm = 65536\n  const float k[9] = float[9](1.0, 8.0, 28.0, 56.0, 70.0, 56.0, 28.0, 8.0, 1.0);\n  vec2 sum = vec2(0.0);\n\n  for (int j = -4; j <= 4; ++j) {\n    float wy = k[j + 4];\n    for (int i = -4; i <= 4; ++i) {\n      float w = k[i + 4] * wy;\n      vec2 off = vec2(float(i) * r.x, float(j) * r.y);\n      sum += w * texture(tex, uv + off).rg;\n    }\n  }\n\n  return sum / 65536.0;\n}\n\nfloat sst(float a, float b, float x) {\n  return smoothstep(a, b, x);\n}\n\nvoid main() {\n  float time = u_time;\n\n  float roundness = 0.;\n  float imgAlpha = 0.;\n\n  if (u_isImage == true) {\n    // Image sampling (UV scaled inward to account for padding)\n    vec2 imageUV = v_imageUV;\n    imageUV -= .5;\n    imageUV *= .95;\n    imageUV += .5;\n\n    vec2 dudx = dFdx(v_imageUV);\n    vec2 dudy = dFdy(v_imageUV);\n\n    // Blurred image: x = roundness, y = alpha\n    vec2 blurred = gaussBlur9x9RG(u_image, imageUV, dudx, dudy, 10.);\n    roundness = 1. - blurred.x;\n    vec2 texelA = 1.0 / vec2(textureSize(u_image, 0));\n    const float k3[3] = float[3](1.0, 2.0, 1.0);\n    for (int j = -1; j <= 1; ++j) {\n      for (int i = -1; i <= 1; ++i) {\n        imgAlpha += k3[i + 1] * k3[j + 1] * texture(u_image, imageUV + vec2(float(i) * texelA.x, float(j) * texelA.y)).g;\n      }\n    }\n    imgAlpha /= 16.0;\n  } else {\n    vec2 uv = v_objectUV + .5;\n    uv.y = 1. - uv.y;\n    float edge = 0.;\n\n    if (u_shape < 1.) {\n      // full-fill on canvas\n      vec2 borderUV = v_responsiveUV + .5;\n      vec2 mask = min(borderUV, 1. - borderUV);\n      vec2 pixel_thickness = min(250. / v_responsiveBoxGivenSize, vec2(.5));\n      float maskX = smoothstep(0.0, pixel_thickness.x, mask.x);\n      float maskY = smoothstep(0.0, pixel_thickness.y, mask.y);\n      maskX = pow(maskX, .25);\n      maskY = pow(maskY, .25);\n      edge = clamp(1. - maskX * maskY, 0., 1.);\n    } else if (u_shape < 2.) {\n      // circle\n      vec2 shapeUV = uv - .5;\n      shapeUV *= .67;\n      edge = pow(clamp(3. * length(shapeUV), 0., 1.), 18.);\n    } else if (u_shape < 3.) {\n      // daisy\n      vec2 shapeUV = uv - .5;\n      shapeUV *= 1.68;\n\n      float r = length(shapeUV) * 2.;\n      float a = atan(shapeUV.y, shapeUV.x) + .2;\n      r *= (1. + .05 * sin(3. * a + 2. * time));\n      float f = abs(cos(a * 3.));\n      edge = smoothstep(f, f + .7, r);\n      edge *= edge;\n    } else if (u_shape < 4.) {\n      // diamond\n      vec2 shapeUV = uv - .5;\n      shapeUV = rotate(shapeUV, .25 * PI);\n      shapeUV *= 1.42;\n      shapeUV += .5;\n      vec2 mask = min(shapeUV, 1. - shapeUV);\n      vec2 pixel_thickness = vec2(.15);\n      float maskX = smoothstep(0.0, pixel_thickness.x, mask.x);\n      float maskY = smoothstep(0.0, pixel_thickness.y, mask.y);\n      maskX = pow(maskX, .25);\n      maskY = pow(maskY, .25);\n      edge = clamp(1. - maskX * maskY, 0., 1.);\n    } else if (u_shape < 5.) {\n      // metaballs\n      vec2 shapeUV = uv - .5;\n      shapeUV *= 1.3;\n      edge = 0.;\n      for (int i = 0; i < 5; i++) {\n        float fi = float(i);\n        float speed = 1.5 + 2./3. * sin(fi * 12.345);\n        float angle = -fi * 1.5;\n        vec2 dir1 = vec2(cos(angle), sin(angle));\n        vec2 dir2 = vec2(cos(angle + 1.57), sin(angle + 1.));\n        vec2 traj = .4 * (dir1 * sin(time * speed + fi * 1.23) + dir2 * cos(time * (speed * 0.7) + fi * 2.17));\n        float d = length(shapeUV + traj);\n        edge += pow(1.0 - clamp(d, 0.0, 1.0), 4.0);\n      }\n      edge = 1. - smoothstep(.65, .9, edge);\n      edge = pow(edge, 4.);\n    }\n\n    imgAlpha = 1. - smoothstep(.9 - 2. * fwidth(edge), .9, edge);\n    roundness = 1. - edge;\n  }\n\n// Smoke UV setup\n  vec2 smokeUV = v_objectUV;\n  smokeUV = rotate(smokeUV, u_angle * PI / 180.);\n  smokeUV *= mix(4., 1., u_size);\n\n  // Two swirl paths: inner (shape-masked) and outer (free), each with independent distortion\n  vec2 innerUV = smokeUV;\n  vec2 outerUV = smokeUV;\n\n  // Vertical displacement \u2014 applied independently to inner and outer\n  innerUV.y += u_innerDistortion * (1. - sst(0., 1., length(.4 * innerUV)));\n  innerUV.y -= .4 * u_innerDistortion;\n  innerUV.y += .7 * u_offset * roundness;\n\n  outerUV.y += u_outerDistortion * (1. - sst(0., 1., length(.4 * outerUV)));\n  outerUV.y -= .4 * u_outerDistortion;\n\n  float innerSwirl = u_innerDistortion * roundness;\n  float outerSwirl = u_outerDistortion;\n\n  for (int i = 1; i < 5; i++) {\n    float fi = float(i);\n\n    float stretchIn = max(length(dFdx(innerUV)), length(dFdy(innerUV)));\n    float dampenIn = 1. / (1. + stretchIn * 8.);\n    float sIn = innerSwirl * dampenIn;\n    innerUV.x += sIn / fi * cos(time + fi * 2.9 * innerUV.y);\n    innerUV.y += sIn / fi * cos(time + fi * 1.5 * innerUV.x);\n\n    float stretchOut = max(length(dFdx(outerUV)), length(dFdy(outerUV)));\n    float dampenOut = 1. / (1. + stretchOut * 8.);\n    float sOut = outerSwirl * dampenOut;\n    outerUV.x += sOut / fi * cos(time + fi * 2.9 * outerUV.y);\n    outerUV.y += sOut / fi * cos(time + fi * 1.5 * outerUV.x);\n  }\n\n  // Smoke shapes from swirl fields\n  float innerShape = exp(-1.5 * dot(innerUV, innerUV));\n  float outerShape = exp(-1.5 * dot(outerUV, outerUV));\n\n  // Visibility masks\n  float outerMask = pow(u_outerGlow, 2.) * (1. - imgAlpha);\n  float innerMask = (.01 + .99 * u_innerGlow) * imgAlpha;\n\n  innerShape *= innerMask;\n  outerShape *= outerMask;\n\n  // Color gradient\n  float mixer = (innerShape + outerShape) * u_colorsCount;\n  vec4 gradient = u_colors[0];\n  gradient.rgb *= gradient.a;\n\n  float smokeMask = 0.;\n  for (int i = 1; i < ${gemSmokeMeta.maxColorCount + 1}; i++) {\n    if (i > int(u_colorsCount)) break;\n\n    float m = sst(0., 1., clamp(mixer - float(i - 1), 0., 1.));\n    if (i == 1) smokeMask = m;\n\n    vec4 c = u_colors[i - 1];\n    c.rgb *= c.a;\n    gradient = mix(gradient, c, m);\n  }\n\n  // Compositing (premultiplied alpha, front-to-back)\n  vec3 color = gradient.rgb * smokeMask;\n  float opacity = gradient.a * smokeMask;\n\n  float innerOpacity = u_colorInner.a * imgAlpha;\n  vec3 innerColor = u_colorInner.rgb * innerOpacity;\n  color += innerColor * (1.0 - opacity);\n  opacity += innerOpacity * (1.0 - opacity);\n\n  vec3 backColor = u_colorBack.rgb * u_colorBack.a;\n  color += backColor * (1.0 - opacity);\n  opacity += u_colorBack.a * (1.0 - opacity);\n\n  fragColor = vec4(color, opacity);\n}\n`;\n\n// Configuration for Poisson solver\nexport const POISSON_CONFIG_OPTIMIZED = {\n  measurePerformance: false, // Set to true to see performance metrics\n  workingSize: 512, // Size to solve Poisson at (will upscale to original size)\n  iterations: 32, // SOR converges ~2-20x faster than standard Gauss-Seidel\n};\n\n// Precomputed pixel data for sparse processing\ninterface SparsePixelData {\n  interiorPixels: Uint32Array; // Indices of interior pixels\n  boundaryPixels: Uint32Array; // Indices of boundary pixels\n  pixelCount: number;\n  // Neighbor indices for each interior pixel (4 neighbors per pixel)\n  // Layout: [east, west, north, south] for each pixel\n  neighborIndices: Int32Array;\n}\n\nexport function toProcessedGemSmoke(file: File | string): Promise<{ imageData: ImageData; pngBlob: Blob }> {\n  const canvas = document.createElement('canvas');\n  const ctx = canvas.getContext('2d');\n  const isBlob = typeof file === 'string' && file.startsWith('blob:');\n\n  return new Promise((resolve, reject) => {\n    if (!file || !ctx) {\n      reject(new Error('Invalid file or canvas context'));\n      return;\n    }\n\n    const blobContentTypePromise = isBlob && fetch(file).then((res) => res.headers.get('Content-Type'));\n    const img = new Image();\n    img.crossOrigin = 'anonymous';\n    const totalStartTime = performance.now();\n\n    img.onload = async () => {\n      // Force SVG to load at a high fidelity size if it's an SVG\n      let isSVG;\n\n      const blobContentType = await blobContentTypePromise;\n\n      if (blobContentType) {\n        isSVG = blobContentType === 'image/svg+xml';\n      } else if (typeof file === 'string') {\n        isSVG = file.endsWith('.svg') || file.startsWith('data:image/svg+xml');\n      } else {\n        isSVG = file.type === 'image/svg+xml';\n      }\n\n      let originalWidth = img.width || img.naturalWidth;\n      let originalHeight = img.height || img.naturalHeight;\n\n      if (isSVG) {\n        // Scale SVG to max dimension while preserving aspect ratio\n        const svgMaxSize = 4096;\n        const aspectRatio = originalWidth / originalHeight;\n\n        if (originalWidth > originalHeight) {\n          originalWidth = svgMaxSize;\n          originalHeight = svgMaxSize / aspectRatio;\n        } else {\n          originalHeight = svgMaxSize;\n          originalWidth = svgMaxSize * aspectRatio;\n        }\n\n        img.width = originalWidth;\n        img.height = originalHeight;\n      }\n\n      // Always scale to working resolution for consistency\n      const minDimension = Math.min(originalWidth, originalHeight);\n      const targetSize = POISSON_CONFIG_OPTIMIZED.workingSize;\n\n      // Calculate scale to fit within workingSize\n      const scaleFactor = targetSize / minDimension;\n      const width = Math.round(originalWidth * scaleFactor);\n      const height = Math.round(originalHeight * scaleFactor);\n\n      if (POISSON_CONFIG_OPTIMIZED.measurePerformance) {\n        console.log(`[Processing Mode]`);\n        console.log(`  Original: ${originalWidth}\u00D7${originalHeight}`);\n        console.log(`  Working: ${width}\u00D7${height} (${(scaleFactor * 100).toFixed(1)}% scale)`);\n        if (scaleFactor < 1) {\n          console.log(`  Speedup: ~${Math.round(1 / (scaleFactor * scaleFactor))}\u00D7`);\n        }\n      }\n\n      canvas.width = originalWidth;\n      canvas.height = originalHeight;\n\n      const paddingSize = 0.025;\n      const padX = Math.ceil(width * paddingSize);\n      const padY = Math.ceil(height * paddingSize);\n      const imgW = width - 2 * padX;\n      const imgH = height - 2 * padY;\n\n      // \u2500\u2500 1. Shape canvas (working res): image centered with padding \u2500\u2500\n      const shapeCanvas = document.createElement('canvas');\n      shapeCanvas.width = width;\n      shapeCanvas.height = height;\n\n      const shapeCtx = shapeCanvas.getContext('2d')!;\n      shapeCtx.drawImage(img, padX, padY, imgW, imgH);\n\n      // 1) Build optimized masks using TypedArrays\n      const startMask = performance.now();\n\n      const shapeImageData = shapeCtx.getImageData(0, 0, width, height);\n      const data = shapeImageData.data;\n\n      // Use Uint8Array for masks (1 byte per pixel vs 8+ bytes for boolean array)\n      const shapeMask = new Uint8Array(width * height);\n      const boundaryMask = new Uint8Array(width * height);\n\n      // First pass: identify shape pixels\n      let shapePixelCount = 0;\n      for (let i = 0, idx = 0; i < data.length; i += 4, idx++) {\n        const a = data[i + 3];\n        const isShape = a === 0 ? 0 : 1;\n        shapeMask[idx] = isShape;\n        shapePixelCount += isShape;\n      }\n\n      // 2) Optimized boundary detection using sparse approach\n      // Only check shape pixels, not all pixels\n      const boundaryIndices: number[] = [];\n      const interiorIndices: number[] = [];\n\n      for (let y = 0; y < height; y++) {\n        for (let x = 0; x < width; x++) {\n          const idx = y * width + x;\n          if (!shapeMask[idx]) continue;\n\n          // Check if pixel is on boundary (optimized: early exit)\n          let isBoundary = false;\n\n          // Check 4-connected neighbors first (most common case)\n          if (x === 0 || x === width - 1 || y === 0 || y === height - 1) {\n            isBoundary = true;\n          } else {\n            // Check all 8 neighbors (including diagonals) for comprehensive boundary detection\n            isBoundary =\n              !shapeMask[idx - 1] || // left\n              !shapeMask[idx + 1] || // right\n              !shapeMask[idx - width] || // top\n              !shapeMask[idx + width] || // bottom\n              !shapeMask[idx - width - 1] || // top-left\n              !shapeMask[idx - width + 1] || // top-right\n              !shapeMask[idx + width - 1] || // bottom-left\n              !shapeMask[idx + width + 1]; // bottom-right\n          }\n\n          if (isBoundary) {\n            boundaryMask[idx] = 1;\n            boundaryIndices.push(idx);\n          } else {\n            interiorIndices.push(idx);\n          }\n        }\n      }\n\n      if (POISSON_CONFIG_OPTIMIZED.measurePerformance) {\n        console.log(`[Mask Building] Time: ${(performance.now() - startMask).toFixed(2)}ms`);\n        console.log(\n          `  Shape pixels: ${shapePixelCount} / ${width * height} (${((shapePixelCount / (width * height)) * 100).toFixed(1)}%)`\n        );\n        console.log(`  Interior pixels: ${interiorIndices.length}`);\n        console.log(`  Boundary pixels: ${boundaryIndices.length}`);\n      }\n\n      // 3) Precompute sparse data structure for solver\n      const sparseData = buildSparseData(\n        shapeMask,\n        boundaryMask,\n        new Uint32Array(interiorIndices),\n        new Uint32Array(boundaryIndices),\n        width,\n        height\n      );\n\n      // 4) Solve Poisson equation with optimized sparse solver\n      const startSolve = performance.now();\n      const u = solvePoissonSparse(sparseData, shapeMask, boundaryMask, width, height);\n\n      if (POISSON_CONFIG_OPTIMIZED.measurePerformance) {\n        console.log(`[Poisson Solve] Time: ${(performance.now() - startSolve).toFixed(2)}ms`);\n      }\n\n      // 5) Generate output image\n      let maxVal = 0;\n      let finalImageData: ImageData;\n\n      // Only check shape pixels for max value\n      for (let i = 0; i < interiorIndices.length; i++) {\n        const idx = interiorIndices[i]!;\n        if (u[idx]! > maxVal) maxVal = u[idx]!;\n      }\n\n      // Create roundness image at working resolution\n      const tempCanvas = document.createElement('canvas');\n      tempCanvas.width = width;\n      tempCanvas.height = height;\n      const tempCtx = tempCanvas.getContext('2d')!;\n\n      const tempImg = tempCtx.createImageData(width, height);\n      for (let y = 0; y < height; y++) {\n        for (let x = 0; x < width; x++) {\n          const idx = y * width + x;\n          const px = idx * 4;\n\n          if (!shapeMask[idx]) {\n            tempImg.data[px] = 255;\n            tempImg.data[px + 1] = 255;\n            tempImg.data[px + 2] = 255;\n            tempImg.data[px + 3] = 0; // Alpha = 0 for background\n          } else {\n            const poissonRatio = u[idx]! / maxVal;\n            let gray = 255 * (1 - poissonRatio);\n            tempImg.data[px] = gray;\n            tempImg.data[px + 1] = gray;\n            tempImg.data[px + 2] = gray;\n            tempImg.data[px + 3] = 255; // Alpha = 255 for shape\n          }\n        }\n      }\n      tempCtx.putImageData(tempImg, 0, 0);\n\n      // Upscale to original resolution with smooth interpolation\n      ctx.imageSmoothingEnabled = true;\n      ctx.imageSmoothingQuality = 'high';\n      ctx.drawImage(tempCanvas, 0, 0, width, height, 0, 0, originalWidth, originalHeight);\n\n      // Now get the upscaled image data for final output\n      const outImg = ctx.getImageData(0, 0, originalWidth, originalHeight);\n\n      // Re-apply edges from original resolution with anti-aliasing\n      // This ensures edges are pixel-perfect while roundness is smooth\n      const origPadX = Math.ceil(originalWidth * paddingSize);\n      const origPadY = Math.ceil(originalHeight * paddingSize);\n      const originalCanvas = document.createElement('canvas');\n      originalCanvas.width = originalWidth;\n      originalCanvas.height = originalHeight;\n      const originalCtx = originalCanvas.getContext('2d')!;\n      originalCtx.drawImage(img, origPadX, origPadY, originalWidth - 2 * origPadX, originalHeight - 2 * origPadY);\n      const originalData = originalCtx.getImageData(0, 0, originalWidth, originalHeight);\n\n      // Process each pixel: Red channel = roundness, Alpha channel = original alpha\n      for (let i = 0; i < outImg.data.length; i += 4) {\n        const a = originalData.data[i + 3]!;\n        // Use only alpha to determine background vs shape\n        const upscaledAlpha = outImg.data[i + 3]!;\n        if (a === 0) {\n          // Background pixel\n          outImg.data[i] = 255;\n          outImg.data[i + 1] = 0;\n        } else {\n          // Red channel carries the roundness\n          // Check if upscale missed this pixel by looking at alpha channel\n          // If upscaled alpha is 0, the low-res version thought this was background\n          outImg.data[i] = upscaledAlpha === 0 ? 0 : outImg.data[i]!; // roundness or 0\n          outImg.data[i + 1] = a; // original alpha\n        }\n\n        // Unused channels fixed\n        outImg.data[i + 2] = 255;\n        outImg.data[i + 3] = 255;\n      }\n\n      ctx.putImageData(outImg, 0, 0);\n      finalImageData = outImg;\n      canvas.toBlob((blob) => {\n        if (!blob) {\n          reject(new Error('Failed to create PNG blob'));\n          return;\n        }\n\n        if (POISSON_CONFIG_OPTIMIZED.measurePerformance) {\n          const totalTime = performance.now() - totalStartTime;\n          console.log(`[Total Processing Time] ${totalTime.toFixed(2)}ms`);\n          if (scaleFactor < 1) {\n            const estimatedFullResTime = totalTime * Math.pow((originalWidth * originalHeight) / (width * height), 1.5);\n            console.log(`[Estimated time at full resolution] ~${estimatedFullResTime.toFixed(0)}ms`);\n            console.log(\n              `[Time saved] ~${(estimatedFullResTime - totalTime).toFixed(0)}ms (${Math.round(estimatedFullResTime / totalTime)}\u00D7 faster)`\n            );\n          }\n        }\n\n        resolve({\n          imageData: finalImageData,\n          pngBlob: blob,\n        });\n      }, 'image/png');\n    };\n\n    img.onerror = () => reject(new Error('Failed to load image'));\n    img.src = typeof file === 'string' ? file : URL.createObjectURL(file);\n  });\n}\n\nfunction buildSparseData(\n  shapeMask: Uint8Array,\n  boundaryMask: Uint8Array,\n  interiorPixels: Uint32Array,\n  boundaryPixels: Uint32Array,\n  width: number,\n  height: number\n): SparsePixelData {\n  const pixelCount = interiorPixels.length;\n\n  // Build neighbor indices for sparse processing\n  // For each interior pixel, store indices of its 4 neighbors\n  // Use -1 for out-of-bounds or non-shape neighbors\n  const neighborIndices = new Int32Array(pixelCount * 4);\n\n  for (let i = 0; i < pixelCount; i++) {\n    const idx = interiorPixels[i]!;\n    const x = idx % width;\n    const y = Math.floor(idx / width);\n\n    // East neighbor\n    neighborIndices[i * 4 + 0] = x < width - 1 && shapeMask[idx + 1] ? idx + 1 : -1;\n    // West neighbor\n    neighborIndices[i * 4 + 1] = x > 0 && shapeMask[idx - 1] ? idx - 1 : -1;\n    // North neighbor\n    neighborIndices[i * 4 + 2] = y > 0 && shapeMask[idx - width] ? idx - width : -1;\n    // South neighbor\n    neighborIndices[i * 4 + 3] = y < height - 1 && shapeMask[idx + width] ? idx + width : -1;\n  }\n\n  return {\n    interiorPixels,\n    boundaryPixels,\n    pixelCount,\n    neighborIndices,\n  };\n}\n\nfunction solvePoissonSparse(\n  sparseData: SparsePixelData,\n  shapeMask: Uint8Array,\n  boundaryMask: Uint8Array,\n  width: number,\n  height: number\n): Float32Array {\n  // This controls how smooth the falloff roundness will be and extend into the shape\n  const ITERATIONS = POISSON_CONFIG_OPTIMIZED.iterations;\n\n  // Keep C constant - only iterations control roundness spread\n  const C = 0.01;\n\n  const u = new Float32Array(width * height);\n  const { interiorPixels, neighborIndices, pixelCount } = sparseData;\n\n  // Performance tracking\n  const startTime = performance.now();\n\n  // Red-Black SOR for better symmetry with fewer iterations\n  // omega between 1.8-1.95 typically gives best convergence for Poisson\n  const omega = 1.9;\n\n  // Pre-classify pixels as red or black for efficient processing\n  const redPixels: number[] = [];\n  const blackPixels: number[] = [];\n\n  for (let i = 0; i < pixelCount; i++) {\n    const idx = interiorPixels[i]!;\n    const x = idx % width;\n    const y = Math.floor(idx / width);\n\n    if ((x + y) % 2 === 0) {\n      redPixels.push(i);\n    } else {\n      blackPixels.push(i);\n    }\n  }\n\n  for (let iter = 0; iter < ITERATIONS; iter++) {\n    // Red pass: update red pixels\n    for (const i of redPixels) {\n      const idx = interiorPixels[i]!;\n\n      // Get precomputed neighbor indices\n      const eastIdx = neighborIndices[i * 4 + 0]!;\n      const westIdx = neighborIndices[i * 4 + 1]!;\n      const northIdx = neighborIndices[i * 4 + 2]!;\n      const southIdx = neighborIndices[i * 4 + 3]!;\n\n      // Sum neighbors (use 0 for out-of-bounds)\n      let sumN = 0;\n      if (eastIdx >= 0) sumN += u[eastIdx]!;\n      if (westIdx >= 0) sumN += u[westIdx]!;\n      if (northIdx >= 0) sumN += u[northIdx]!;\n      if (southIdx >= 0) sumN += u[southIdx]!;\n\n      // SOR update: blend new value with old value\n      const newValue = (C + sumN) / 4;\n      u[idx] = omega * newValue + (1 - omega) * u[idx]!;\n    }\n\n    // Black pass: update black pixels\n    for (const i of blackPixels) {\n      const idx = interiorPixels[i]!;\n\n      // Get precomputed neighbor indices\n      const eastIdx = neighborIndices[i * 4 + 0]!;\n      const westIdx = neighborIndices[i * 4 + 1]!;\n      const northIdx = neighborIndices[i * 4 + 2]!;\n      const southIdx = neighborIndices[i * 4 + 3]!;\n\n      // Sum neighbors (use 0 for out-of-bounds)\n      let sumN = 0;\n      if (eastIdx >= 0) sumN += u[eastIdx]!;\n      if (westIdx >= 0) sumN += u[westIdx]!;\n      if (northIdx >= 0) sumN += u[northIdx]!;\n      if (southIdx >= 0) sumN += u[southIdx]!;\n\n      // SOR update: blend new value with old value\n      const newValue = (C + sumN) / 4;\n      u[idx] = omega * newValue + (1 - omega) * u[idx]!;\n    }\n  }\n\n  // Jacobi smoothing passes to remove Red-Black checkerboard artifacts\n  const tmp = new Float32Array(width * height);\n  for (let smooth = 0; smooth < 3; smooth++) {\n    tmp.set(u);\n    for (let i = 0; i < pixelCount; i++) {\n      const idx = interiorPixels[i]!;\n      const eastIdx = neighborIndices[i * 4 + 0]!;\n      const westIdx = neighborIndices[i * 4 + 1]!;\n      const northIdx = neighborIndices[i * 4 + 2]!;\n      const southIdx = neighborIndices[i * 4 + 3]!;\n\n      let sum = 0;\n      let count = 0;\n      if (eastIdx >= 0) { sum += tmp[eastIdx]!; count++; }\n      if (westIdx >= 0) { sum += tmp[westIdx]!; count++; }\n      if (northIdx >= 0) { sum += tmp[northIdx]!; count++; }\n      if (southIdx >= 0) { sum += tmp[southIdx]!; count++; }\n\n      u[idx] = count > 0 ? (tmp[idx]! + sum / count) * 0.5 : tmp[idx]!;\n    }\n  }\n\n  if (POISSON_CONFIG_OPTIMIZED.measurePerformance) {\n    const elapsed = performance.now() - startTime;\n\n    console.log(`[Optimized Poisson Solver (SOR \u03C9=${omega})]`);\n    console.log(`  Working size: ${width}\u00D7${height}`);\n    console.log(`  Iterations: ${ITERATIONS}`);\n    console.log(`  Time: ${elapsed.toFixed(2)}ms`);\n    console.log(`  Interior pixels processed: ${pixelCount}`);\n    console.log(`  Speed: ${((ITERATIONS * pixelCount) / (elapsed * 1000)).toFixed(2)} Mpixels/sec`);\n  }\n\n  return u;\n}\n\nexport interface GemSmokeUniforms extends ShaderSizingUniforms {\n  u_colorBack: [number, number, number, number];\n  u_colors: vec4[];\n  u_colorsCount: number;\n  u_image: HTMLImageElement | string | undefined;\n  u_innerDistortion: number;\n  u_outerDistortion: number;\n  u_outerGlow: number;\n  u_innerGlow: number;\n  u_colorInner: [number, number, number, number];\n  u_offset: number;\n  u_angle: number;\n  u_size: number;\n  u_shape: (typeof GemSmokeShapes)[GemSmokeShape];\n  u_isImage: boolean;\n}\n\nexport interface GemSmokeParams extends ShaderSizingParams, ShaderMotionParams {\n  colors?: string[];\n  colorBack?: string;\n  image?: HTMLImageElement | string | undefined;\n  innerDistortion?: number;\n  outerDistortion?: number;\n  outerGlow?: number;\n  innerGlow?: number;\n  colorInner?: string;\n  offset?: number;\n  angle?: number;\n  size?: number;\n  shape?: GemSmokeShape;\n}\n\nexport const GemSmokeShapes = {\n  none: 0,\n  circle: 1,\n  daisy: 2,\n  diamond: 3,\n  metaballs: 4,\n} as const;\n\nexport type GemSmokeShape = keyof typeof GemSmokeShapes;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import type { vec4 } from '../types.js';\nimport type { ShaderMotionParams } from '../shader-mount.js';\nimport type { ShaderSizingParams, ShaderSizingUniforms } from '../shader-sizing.js';\nimport { rotation2, declarePI } from '../shader-utils.js';\n\nexport const gemSmokeMeta = {\n  maxColorCount: 6,\n} as const;\n\n/**\n * Animated color fields placed over uploaded logo shape; gives the illusion of smoky noise\n * behind the glassy shape.\n *\n * Fragment shader uniforms:\n * - u_time (float): Animation time\n * - u_image (sampler2D): Pre-processed source image texture (R = edge gradient, G = alpha)\n * - u_colors (vec4[]): Up to 6 smoke colors in RGBA\n * - u_colorsCount (float): Number of active colors\n * - u_colorBack (vec4): Background color in RGBA\n * - u_innerDistortion (float): Power of smoke distortion inside the input shape, needs innerGlow > 0 (0 to 1)\n * - u_outerDistortion (float): Power of smoke distortion outside the input shape, needs outerGlow > 0 (0 to 1)\n * - u_outerGlow (float): Visibility of smoke shape outside the input shape (0 to 1)\n * - u_innerGlow (float): Visibility of smoke shape inside the input shape (0 to 1)\n * - u_colorInner (vec4): Additional color inside the input shape, mixing with smoke (RGBA)\n * - u_offset (float): Vertical offset of smoke inside the shape, needs innerGlow > 0 (-1 to 1)\n * - u_angle (float): Smoke direction in degrees (0 to 360)\n * - u_size (float): Size of smoke shape relative to the image box (0 to 1)\n * - u_shape (float): Predefined shape mask, needs no image (0 = none, 1 = circle, 2 = daisy, 3 = diamond, 4 = metaballs)\n * - u_isImage (bool): Whether an image mask is provided; when true, u_shape is ignored\n *\n * Vertex shader outputs (used in fragment shader):\n * - v_imageUV (vec2): UV coordinates for sampling the source image, with fit, scale, rotation, and offset applied\n * - v_objectUV (vec2): Normalized UV coordinates with scale, rotation, and offset applied\n * - v_responsiveUV (vec2): Responsive UV coordinates that adapt to canvas aspect ratio (used by the 'none' shape)\n * - v_responsiveBoxGivenSize (vec2): Given size of the responsive bounding box (used by the 'none' shape)\n *\n * Vertex shader uniforms:\n * - u_resolution (vec2): Canvas resolution in pixels\n * - u_pixelRatio (float): Device pixel ratio\n * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)\n * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)\n * - u_worldWidth (float): Virtual width of the graphic before it's scaled to fit the canvas\n * - u_worldHeight (float): Virtual height of the graphic before it's scaled to fit the canvas\n * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)\n * - u_scale (float): Overall zoom level of the graphics (0.1 to 4)\n * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)\n * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)\n * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)\n * - u_imageAspectRatio (float): Aspect ratio of the source image\n *\n */\n\n// language=GLSL\nexport const gemSmokeFragmentShader: string = `#version 300 es\nprecision mediump float;\n\nin mediump vec2 v_imageUV;\nin mediump vec2 v_objectUV;\nin mediump vec2 v_responsiveUV;\nin mediump vec2 v_responsiveBoxGivenSize;\n                                               \nout vec4 fragColor;\n\nuniform sampler2D u_image;\nuniform float u_shape;\nuniform bool u_isImage;\n\nuniform float u_time;\nuniform vec4 u_colors[${gemSmokeMeta.maxColorCount}];\nuniform float u_colorsCount;\nuniform vec4 u_colorBack;\nuniform vec4 u_colorInner;\nuniform float u_innerDistortion;\nuniform float u_outerDistortion;\nuniform float u_outerGlow;\nuniform float u_innerGlow;\nuniform float u_offset;\nuniform float u_angle;\nuniform float u_size;\n\n${declarePI}\n${rotation2}\n\n// 9x9 Gaussian blur on R and G channels\nvec2 gaussBlur9x9RG(sampler2D tex, vec2 uv, float radius) {\n  vec2 texel = 1.0 / vec2(textureSize(tex, 0));\n  vec2 r = max(radius, 0.0) * texel;\n  // Pascal's row 8: sum = 256, 2D norm = 65536\n  const float k[9] = float[9](1.0, 8.0, 28.0, 56.0, 70.0, 56.0, 28.0, 8.0, 1.0);\n  vec2 sum = vec2(0.0);\n\n  for (int j = -4; j <= 4; ++j) {\n    float wy = k[j + 4];\n    for (int i = -4; i <= 4; ++i) {\n      float w = k[i + 4] * wy;\n      vec2 off = vec2(float(i) * r.x, float(j) * r.y);\n      sum += w * texture(tex, uv + off).rg;\n    }\n  }\n\n  return sum / 65536.0;\n}\n\nfloat sst(float a, float b, float x) {\n  return smoothstep(a, b, x);\n}\n\nvoid main() {\n  float time = u_time;\n\n  float roundness = 0.;\n  float imgAlpha = 0.;\n\n  if (u_isImage == true) {\n    // Image sampling (UV scaled inward to account for padding)\n    vec2 imageUV = v_imageUV;\n    imageUV -= .5;\n    imageUV *= .95;\n    imageUV += .5;\n\n    // Blurred image: x = roundness, y = alpha\n    vec2 blurred = gaussBlur9x9RG(u_image, imageUV, 10.);\n    roundness = 1. - blurred.x;\n    vec2 texelA = 1.0 / vec2(textureSize(u_image, 0));\n    const float k3[3] = float[3](1.0, 2.0, 1.0);\n    for (int j = -1; j <= 1; ++j) {\n      for (int i = -1; i <= 1; ++i) {\n        imgAlpha += k3[i + 1] * k3[j + 1] * texture(u_image, imageUV + vec2(float(i) * texelA.x, float(j) * texelA.y)).g;\n      }\n    }\n    imgAlpha /= 16.0;\n  } else {\n    vec2 uv = v_objectUV + .5;\n    uv.y = 1. - uv.y;\n    float edge = 0.;\n\n    if (u_shape < 1.) {\n      // full-fill on canvas\n      vec2 borderUV = v_responsiveUV + .5;\n      vec2 mask = min(borderUV, 1. - borderUV);\n      vec2 pixel_thickness = min(250. / v_responsiveBoxGivenSize, vec2(.5));\n      float maskX = smoothstep(0.0, pixel_thickness.x, mask.x);\n      float maskY = smoothstep(0.0, pixel_thickness.y, mask.y);\n      maskX = pow(maskX, .25);\n      maskY = pow(maskY, .25);\n      edge = clamp(1. - maskX * maskY, 0., 1.);\n    } else if (u_shape < 2.) {\n      // circle\n      vec2 shapeUV = uv - .5;\n      shapeUV *= .67;\n      edge = pow(clamp(3. * length(shapeUV), 0., 1.), 18.);\n    } else if (u_shape < 3.) {\n      // daisy\n      vec2 shapeUV = uv - .5;\n      shapeUV *= 1.68;\n\n      float r = length(shapeUV) * 2.;\n      float a = atan(shapeUV.y, shapeUV.x) + .2;\n      r *= (1. + .05 * sin(3. * a + 2. * time));\n      float f = abs(cos(a * 3.));\n      edge = smoothstep(f, f + .7, r);\n      edge *= edge;\n    } else if (u_shape < 4.) {\n      // diamond\n      vec2 shapeUV = uv - .5;\n      shapeUV = rotate(shapeUV, .25 * PI);\n      shapeUV *= 1.42;\n      shapeUV += .5;\n      vec2 mask = min(shapeUV, 1. - shapeUV);\n      vec2 pixel_thickness = vec2(.15);\n      float maskX = smoothstep(0.0, pixel_thickness.x, mask.x);\n      float maskY = smoothstep(0.0, pixel_thickness.y, mask.y);\n      maskX = pow(maskX, .25);\n      maskY = pow(maskY, .25);\n      edge = clamp(1. - maskX * maskY, 0., 1.);\n    } else if (u_shape < 5.) {\n      // metaballs\n      vec2 shapeUV = uv - .5;\n      shapeUV *= 1.3;\n      edge = 0.;\n      for (int i = 0; i < 5; i++) {\n        float fi = float(i);\n        float speed = 1.5 + 2./3. * sin(fi * 12.345);\n        float angle = -fi * 1.5;\n        vec2 dir1 = vec2(cos(angle), sin(angle));\n        vec2 dir2 = vec2(cos(angle + 1.57), sin(angle + 1.));\n        vec2 traj = .4 * (dir1 * sin(time * speed + fi * 1.23) + dir2 * cos(time * (speed * 0.7) + fi * 2.17));\n        float d = length(shapeUV + traj);\n        edge += pow(1.0 - clamp(d, 0.0, 1.0), 4.0);\n      }\n      edge = 1. - smoothstep(.65, .9, edge);\n      edge = pow(edge, 4.);\n    }\n\n    imgAlpha = 1. - smoothstep(.9 - 2. * fwidth(edge), .9, edge);\n    roundness = 1. - edge;\n  }\n\n// Smoke UV setup\n  vec2 smokeUV = v_objectUV;\n  smokeUV = rotate(smokeUV, u_angle * PI / 180.);\n  smokeUV *= mix(4., 1., u_size);\n\n  // Two swirl paths: inner (shape-masked) and outer (free), each with independent distortion\n  vec2 innerUV = smokeUV;\n  vec2 outerUV = smokeUV;\n\n  // Vertical displacement \u2014 applied independently to inner and outer\n  innerUV.y += u_innerDistortion * (1. - sst(0., 1., length(.4 * innerUV)));\n  innerUV.y -= .4 * u_innerDistortion;\n  innerUV.y += .7 * u_offset * roundness;\n\n  outerUV.y += u_outerDistortion * (1. - sst(0., 1., length(.4 * outerUV)));\n  outerUV.y -= .4 * u_outerDistortion;\n\n  float innerSwirl = u_innerDistortion * roundness;\n  float outerSwirl = u_outerDistortion;\n\n  for (int i = 1; i < 5; i++) {\n    float fi = float(i);\n\n    float stretchIn = max(length(dFdx(innerUV)), length(dFdy(innerUV)));\n    float dampenIn = 1. / (1. + stretchIn * 8.);\n    float sIn = innerSwirl * dampenIn;\n    innerUV.x += sIn / fi * cos(time + fi * 2.9 * innerUV.y);\n    innerUV.y += sIn / fi * cos(time + fi * 1.5 * innerUV.x);\n\n    float stretchOut = max(length(dFdx(outerUV)), length(dFdy(outerUV)));\n    float dampenOut = 1. / (1. + stretchOut * 8.);\n    float sOut = outerSwirl * dampenOut;\n    outerUV.x += sOut / fi * cos(time + fi * 2.9 * outerUV.y);\n    outerUV.y += sOut / fi * cos(time + fi * 1.5 * outerUV.x);\n  }\n\n  // Smoke shapes from swirl fields\n  float innerShape = exp(-1.5 * dot(innerUV, innerUV));\n  float outerShape = exp(-1.5 * dot(outerUV, outerUV));\n\n  // Visibility masks\n  float outerMask = pow(u_outerGlow, 2.) * (1. - imgAlpha);\n  float innerMask = (.01 + .99 * u_innerGlow) * imgAlpha;\n\n  innerShape *= innerMask;\n  outerShape *= outerMask;\n\n  // Color gradient\n  float mixer = (innerShape + outerShape) * u_colorsCount;\n  vec4 gradient = u_colors[0];\n  gradient.rgb *= gradient.a;\n\n  float smokeMask = 0.;\n  for (int i = 1; i < ${gemSmokeMeta.maxColorCount + 1}; i++) {\n    if (i > int(u_colorsCount)) break;\n\n    float m = sst(0., 1., clamp(mixer - float(i - 1), 0., 1.));\n    if (i == 1) smokeMask = m;\n\n    vec4 c = u_colors[i - 1];\n    c.rgb *= c.a;\n    gradient = mix(gradient, c, m);\n  }\n\n  // Compositing (premultiplied alpha, front-to-back)\n  vec3 color = gradient.rgb * smokeMask;\n  float opacity = gradient.a * smokeMask;\n\n  float innerOpacity = u_colorInner.a * imgAlpha;\n  vec3 innerColor = u_colorInner.rgb * innerOpacity;\n  color += innerColor * (1.0 - opacity);\n  opacity += innerOpacity * (1.0 - opacity);\n\n  vec3 backColor = u_colorBack.rgb * u_colorBack.a;\n  color += backColor * (1.0 - opacity);\n  opacity += u_colorBack.a * (1.0 - opacity);\n\n  fragColor = vec4(color, opacity);\n}\n`;\n\n// Configuration for Poisson solver\nexport const POISSON_CONFIG_OPTIMIZED = {\n  measurePerformance: false, // Set to true to see performance metrics\n  workingSize: 512, // Size to solve Poisson at (will upscale to original size)\n  iterations: 32, // SOR converges ~2-20x faster than standard Gauss-Seidel\n};\n\n// Precomputed pixel data for sparse processing\ninterface SparsePixelData {\n  interiorPixels: Uint32Array; // Indices of interior pixels\n  boundaryPixels: Uint32Array; // Indices of boundary pixels\n  pixelCount: number;\n  // Neighbor indices for each interior pixel (4 neighbors per pixel)\n  // Layout: [east, west, north, south] for each pixel\n  neighborIndices: Int32Array;\n}\n\nexport function toProcessedGemSmoke(file: File | string): Promise<{ imageData: ImageData; pngBlob: Blob }> {\n  const canvas = document.createElement('canvas');\n  const ctx = canvas.getContext('2d');\n  const isBlob = typeof file === 'string' && file.startsWith('blob:');\n\n  return new Promise((resolve, reject) => {\n    if (!file || !ctx) {\n      reject(new Error('Invalid file or canvas context'));\n      return;\n    }\n\n    const blobContentTypePromise = isBlob && fetch(file).then((res) => res.headers.get('Content-Type'));\n    const img = new Image();\n    img.crossOrigin = 'anonymous';\n    const totalStartTime = performance.now();\n\n    img.onload = async () => {\n      // Force SVG to load at a high fidelity size if it's an SVG\n      let isSVG;\n\n      const blobContentType = await blobContentTypePromise;\n\n      if (blobContentType) {\n        isSVG = blobContentType === 'image/svg+xml';\n      } else if (typeof file === 'string') {\n        isSVG = file.endsWith('.svg') || file.startsWith('data:image/svg+xml');\n      } else {\n        isSVG = file.type === 'image/svg+xml';\n      }\n\n      let originalWidth = img.width || img.naturalWidth;\n      let originalHeight = img.height || img.naturalHeight;\n\n      if (isSVG) {\n        // Scale SVG to max dimension while preserving aspect ratio\n        const svgMaxSize = 4096;\n        const aspectRatio = originalWidth / originalHeight;\n\n        if (originalWidth > originalHeight) {\n          originalWidth = svgMaxSize;\n          originalHeight = svgMaxSize / aspectRatio;\n        } else {\n          originalHeight = svgMaxSize;\n          originalWidth = svgMaxSize * aspectRatio;\n        }\n\n        img.width = originalWidth;\n        img.height = originalHeight;\n      }\n\n      // Always scale to working resolution for consistency\n      const minDimension = Math.min(originalWidth, originalHeight);\n      const targetSize = POISSON_CONFIG_OPTIMIZED.workingSize;\n\n      // Calculate scale to fit within workingSize\n      const scaleFactor = targetSize / minDimension;\n      const width = Math.round(originalWidth * scaleFactor);\n      const height = Math.round(originalHeight * scaleFactor);\n\n      if (POISSON_CONFIG_OPTIMIZED.measurePerformance) {\n        console.log(`[Processing Mode]`);\n        console.log(`  Original: ${originalWidth}\u00D7${originalHeight}`);\n        console.log(`  Working: ${width}\u00D7${height} (${(scaleFactor * 100).toFixed(1)}% scale)`);\n        if (scaleFactor < 1) {\n          console.log(`  Speedup: ~${Math.round(1 / (scaleFactor * scaleFactor))}\u00D7`);\n        }\n      }\n\n      canvas.width = originalWidth;\n      canvas.height = originalHeight;\n\n      const paddingSize = 0.025;\n      const padX = Math.ceil(width * paddingSize);\n      const padY = Math.ceil(height * paddingSize);\n      const imgW = width - 2 * padX;\n      const imgH = height - 2 * padY;\n\n      // \u2500\u2500 1. Shape canvas (working res): image centered with padding \u2500\u2500\n      const shapeCanvas = document.createElement('canvas');\n      shapeCanvas.width = width;\n      shapeCanvas.height = height;\n\n      const shapeCtx = shapeCanvas.getContext('2d')!;\n      shapeCtx.drawImage(img, padX, padY, imgW, imgH);\n\n      // 1) Build optimized masks using TypedArrays\n      const startMask = performance.now();\n\n      const shapeImageData = shapeCtx.getImageData(0, 0, width, height);\n      const data = shapeImageData.data;\n\n      // Use Uint8Array for masks (1 byte per pixel vs 8+ bytes for boolean array)\n      const shapeMask = new Uint8Array(width * height);\n      const boundaryMask = new Uint8Array(width * height);\n\n      // First pass: identify shape pixels\n      let shapePixelCount = 0;\n      for (let i = 0, idx = 0; i < data.length; i += 4, idx++) {\n        const a = data[i + 3];\n        const isShape = a === 0 ? 0 : 1;\n        shapeMask[idx] = isShape;\n        shapePixelCount += isShape;\n      }\n\n      // 2) Optimized boundary detection using sparse approach\n      // Only check shape pixels, not all pixels\n      const boundaryIndices: number[] = [];\n      const interiorIndices: number[] = [];\n\n      for (let y = 0; y < height; y++) {\n        for (let x = 0; x < width; x++) {\n          const idx = y * width + x;\n          if (!shapeMask[idx]) continue;\n\n          // Check if pixel is on boundary (optimized: early exit)\n          let isBoundary = false;\n\n          // Check 4-connected neighbors first (most common case)\n          if (x === 0 || x === width - 1 || y === 0 || y === height - 1) {\n            isBoundary = true;\n          } else {\n            // Check all 8 neighbors (including diagonals) for comprehensive boundary detection\n            isBoundary =\n              !shapeMask[idx - 1] || // left\n              !shapeMask[idx + 1] || // right\n              !shapeMask[idx - width] || // top\n              !shapeMask[idx + width] || // bottom\n              !shapeMask[idx - width - 1] || // top-left\n              !shapeMask[idx - width + 1] || // top-right\n              !shapeMask[idx + width - 1] || // bottom-left\n              !shapeMask[idx + width + 1]; // bottom-right\n          }\n\n          if (isBoundary) {\n            boundaryMask[idx] = 1;\n            boundaryIndices.push(idx);\n          } else {\n            interiorIndices.push(idx);\n          }\n        }\n      }\n\n      if (POISSON_CONFIG_OPTIMIZED.measurePerformance) {\n        console.log(`[Mask Building] Time: ${(performance.now() - startMask).toFixed(2)}ms`);\n        console.log(\n          `  Shape pixels: ${shapePixelCount} / ${width * height} (${((shapePixelCount / (width * height)) * 100).toFixed(1)}%)`\n        );\n        console.log(`  Interior pixels: ${interiorIndices.length}`);\n        console.log(`  Boundary pixels: ${boundaryIndices.length}`);\n      }\n\n      // 3) Precompute sparse data structure for solver\n      const sparseData = buildSparseData(\n        shapeMask,\n        boundaryMask,\n        new Uint32Array(interiorIndices),\n        new Uint32Array(boundaryIndices),\n        width,\n        height\n      );\n\n      // 4) Solve Poisson equation with optimized sparse solver\n      const startSolve = performance.now();\n      const u = solvePoissonSparse(sparseData, shapeMask, boundaryMask, width, height);\n\n      if (POISSON_CONFIG_OPTIMIZED.measurePerformance) {\n        console.log(`[Poisson Solve] Time: ${(performance.now() - startSolve).toFixed(2)}ms`);\n      }\n\n      // 5) Generate output image\n      let maxVal = 0;\n      let finalImageData: ImageData;\n\n      // Only check shape pixels for max value\n      for (let i = 0; i < interiorIndices.length; i++) {\n        const idx = interiorIndices[i]!;\n        if (u[idx]! > maxVal) maxVal = u[idx]!;\n      }\n\n      // Create roundness image at working resolution\n      const tempCanvas = document.createElement('canvas');\n      tempCanvas.width = width;\n      tempCanvas.height = height;\n      const tempCtx = tempCanvas.getContext('2d')!;\n\n      const tempImg = tempCtx.createImageData(width, height);\n      for (let y = 0; y < height; y++) {\n        for (let x = 0; x < width; x++) {\n          const idx = y * width + x;\n          const px = idx * 4;\n\n          if (!shapeMask[idx]) {\n            tempImg.data[px] = 255;\n            tempImg.data[px + 1] = 255;\n            tempImg.data[px + 2] = 255;\n            tempImg.data[px + 3] = 0; // Alpha = 0 for background\n          } else {\n            const poissonRatio = u[idx]! / maxVal;\n            let gray = 255 * (1 - poissonRatio);\n            tempImg.data[px] = gray;\n            tempImg.data[px + 1] = gray;\n            tempImg.data[px + 2] = gray;\n            tempImg.data[px + 3] = 255; // Alpha = 255 for shape\n          }\n        }\n      }\n      tempCtx.putImageData(tempImg, 0, 0);\n\n      // Upscale to original resolution with smooth interpolation\n      ctx.imageSmoothingEnabled = true;\n      ctx.imageSmoothingQuality = 'high';\n      ctx.drawImage(tempCanvas, 0, 0, width, height, 0, 0, originalWidth, originalHeight);\n\n      // Now get the upscaled image data for final output\n      const outImg = ctx.getImageData(0, 0, originalWidth, originalHeight);\n\n      // Re-apply edges from original resolution with anti-aliasing\n      // This ensures edges are pixel-perfect while roundness is smooth\n      const origPadX = Math.ceil(originalWidth * paddingSize);\n      const origPadY = Math.ceil(originalHeight * paddingSize);\n      const originalCanvas = document.createElement('canvas');\n      originalCanvas.width = originalWidth;\n      originalCanvas.height = originalHeight;\n      const originalCtx = originalCanvas.getContext('2d')!;\n      originalCtx.drawImage(img, origPadX, origPadY, originalWidth - 2 * origPadX, originalHeight - 2 * origPadY);\n      const originalData = originalCtx.getImageData(0, 0, originalWidth, originalHeight);\n\n      // Process each pixel: Red channel = roundness, Alpha channel = original alpha\n      for (let i = 0; i < outImg.data.length; i += 4) {\n        const a = originalData.data[i + 3]!;\n        // Use only alpha to determine background vs shape\n        const upscaledAlpha = outImg.data[i + 3]!;\n        if (a === 0) {\n          // Background pixel\n          outImg.data[i] = 255;\n          outImg.data[i + 1] = 0;\n        } else {\n          // Red channel carries the roundness\n          // Check if upscale missed this pixel by looking at alpha channel\n          // If upscaled alpha is 0, the low-res version thought this was background\n          outImg.data[i] = upscaledAlpha === 0 ? 0 : outImg.data[i]!; // roundness or 0\n          outImg.data[i + 1] = a; // original alpha\n        }\n\n        // Unused channels fixed\n        outImg.data[i + 2] = 255;\n        outImg.data[i + 3] = 255;\n      }\n\n      ctx.putImageData(outImg, 0, 0);\n      finalImageData = outImg;\n      canvas.toBlob((blob) => {\n        if (!blob) {\n          reject(new Error('Failed to create PNG blob'));\n          return;\n        }\n\n        if (POISSON_CONFIG_OPTIMIZED.measurePerformance) {\n          const totalTime = performance.now() - totalStartTime;\n          console.log(`[Total Processing Time] ${totalTime.toFixed(2)}ms`);\n          if (scaleFactor < 1) {\n            const estimatedFullResTime = totalTime * Math.pow((originalWidth * originalHeight) / (width * height), 1.5);\n            console.log(`[Estimated time at full resolution] ~${estimatedFullResTime.toFixed(0)}ms`);\n            console.log(\n              `[Time saved] ~${(estimatedFullResTime - totalTime).toFixed(0)}ms (${Math.round(estimatedFullResTime / totalTime)}\u00D7 faster)`\n            );\n          }\n        }\n\n        resolve({\n          imageData: finalImageData,\n          pngBlob: blob,\n        });\n      }, 'image/png');\n    };\n\n    img.onerror = () => reject(new Error('Failed to load image'));\n    img.src = typeof file === 'string' ? file : URL.createObjectURL(file);\n  });\n}\n\nfunction buildSparseData(\n  shapeMask: Uint8Array,\n  boundaryMask: Uint8Array,\n  interiorPixels: Uint32Array,\n  boundaryPixels: Uint32Array,\n  width: number,\n  height: number\n): SparsePixelData {\n  const pixelCount = interiorPixels.length;\n\n  // Build neighbor indices for sparse processing\n  // For each interior pixel, store indices of its 4 neighbors\n  // Use -1 for out-of-bounds or non-shape neighbors\n  const neighborIndices = new Int32Array(pixelCount * 4);\n\n  for (let i = 0; i < pixelCount; i++) {\n    const idx = interiorPixels[i]!;\n    const x = idx % width;\n    const y = Math.floor(idx / width);\n\n    // East neighbor\n    neighborIndices[i * 4 + 0] = x < width - 1 && shapeMask[idx + 1] ? idx + 1 : -1;\n    // West neighbor\n    neighborIndices[i * 4 + 1] = x > 0 && shapeMask[idx - 1] ? idx - 1 : -1;\n    // North neighbor\n    neighborIndices[i * 4 + 2] = y > 0 && shapeMask[idx - width] ? idx - width : -1;\n    // South neighbor\n    neighborIndices[i * 4 + 3] = y < height - 1 && shapeMask[idx + width] ? idx + width : -1;\n  }\n\n  return {\n    interiorPixels,\n    boundaryPixels,\n    pixelCount,\n    neighborIndices,\n  };\n}\n\nfunction solvePoissonSparse(\n  sparseData: SparsePixelData,\n  shapeMask: Uint8Array,\n  boundaryMask: Uint8Array,\n  width: number,\n  height: number\n): Float32Array {\n  // This controls how smooth the falloff roundness will be and extend into the shape\n  const ITERATIONS = POISSON_CONFIG_OPTIMIZED.iterations;\n\n  // Keep C constant - only iterations control roundness spread\n  const C = 0.01;\n\n  const u = new Float32Array(width * height);\n  const { interiorPixels, neighborIndices, pixelCount } = sparseData;\n\n  // Performance tracking\n  const startTime = performance.now();\n\n  // Red-Black SOR for better symmetry with fewer iterations\n  // omega between 1.8-1.95 typically gives best convergence for Poisson\n  const omega = 1.9;\n\n  // Pre-classify pixels as red or black for efficient processing\n  const redPixels: number[] = [];\n  const blackPixels: number[] = [];\n\n  for (let i = 0; i < pixelCount; i++) {\n    const idx = interiorPixels[i]!;\n    const x = idx % width;\n    const y = Math.floor(idx / width);\n\n    if ((x + y) % 2 === 0) {\n      redPixels.push(i);\n    } else {\n      blackPixels.push(i);\n    }\n  }\n\n  for (let iter = 0; iter < ITERATIONS; iter++) {\n    // Red pass: update red pixels\n    for (const i of redPixels) {\n      const idx = interiorPixels[i]!;\n\n      // Get precomputed neighbor indices\n      const eastIdx = neighborIndices[i * 4 + 0]!;\n      const westIdx = neighborIndices[i * 4 + 1]!;\n      const northIdx = neighborIndices[i * 4 + 2]!;\n      const southIdx = neighborIndices[i * 4 + 3]!;\n\n      // Sum neighbors (use 0 for out-of-bounds)\n      let sumN = 0;\n      if (eastIdx >= 0) sumN += u[eastIdx]!;\n      if (westIdx >= 0) sumN += u[westIdx]!;\n      if (northIdx >= 0) sumN += u[northIdx]!;\n      if (southIdx >= 0) sumN += u[southIdx]!;\n\n      // SOR update: blend new value with old value\n      const newValue = (C + sumN) / 4;\n      u[idx] = omega * newValue + (1 - omega) * u[idx]!;\n    }\n\n    // Black pass: update black pixels\n    for (const i of blackPixels) {\n      const idx = interiorPixels[i]!;\n\n      // Get precomputed neighbor indices\n      const eastIdx = neighborIndices[i * 4 + 0]!;\n      const westIdx = neighborIndices[i * 4 + 1]!;\n      const northIdx = neighborIndices[i * 4 + 2]!;\n      const southIdx = neighborIndices[i * 4 + 3]!;\n\n      // Sum neighbors (use 0 for out-of-bounds)\n      let sumN = 0;\n      if (eastIdx >= 0) sumN += u[eastIdx]!;\n      if (westIdx >= 0) sumN += u[westIdx]!;\n      if (northIdx >= 0) sumN += u[northIdx]!;\n      if (southIdx >= 0) sumN += u[southIdx]!;\n\n      // SOR update: blend new value with old value\n      const newValue = (C + sumN) / 4;\n      u[idx] = omega * newValue + (1 - omega) * u[idx]!;\n    }\n  }\n\n  // Jacobi smoothing passes to remove Red-Black checkerboard artifacts\n  const tmp = new Float32Array(width * height);\n  for (let smooth = 0; smooth < 3; smooth++) {\n    tmp.set(u);\n    for (let i = 0; i < pixelCount; i++) {\n      const idx = interiorPixels[i]!;\n      const eastIdx = neighborIndices[i * 4 + 0]!;\n      const westIdx = neighborIndices[i * 4 + 1]!;\n      const northIdx = neighborIndices[i * 4 + 2]!;\n      const southIdx = neighborIndices[i * 4 + 3]!;\n\n      let sum = 0;\n      let count = 0;\n      if (eastIdx >= 0) { sum += tmp[eastIdx]!; count++; }\n      if (westIdx >= 0) { sum += tmp[westIdx]!; count++; }\n      if (northIdx >= 0) { sum += tmp[northIdx]!; count++; }\n      if (southIdx >= 0) { sum += tmp[southIdx]!; count++; }\n\n      u[idx] = count > 0 ? (tmp[idx]! + sum / count) * 0.5 : tmp[idx]!;\n    }\n  }\n\n  if (POISSON_CONFIG_OPTIMIZED.measurePerformance) {\n    const elapsed = performance.now() - startTime;\n\n    console.log(`[Optimized Poisson Solver (SOR \u03C9=${omega})]`);\n    console.log(`  Working size: ${width}\u00D7${height}`);\n    console.log(`  Iterations: ${ITERATIONS}`);\n    console.log(`  Time: ${elapsed.toFixed(2)}ms`);\n    console.log(`  Interior pixels processed: ${pixelCount}`);\n    console.log(`  Speed: ${((ITERATIONS * pixelCount) / (elapsed * 1000)).toFixed(2)} Mpixels/sec`);\n  }\n\n  return u;\n}\n\nexport interface GemSmokeUniforms extends ShaderSizingUniforms {\n  u_colorBack: [number, number, number, number];\n  u_colors: vec4[];\n  u_colorsCount: number;\n  u_image: HTMLImageElement | string | undefined;\n  u_innerDistortion: number;\n  u_outerDistortion: number;\n  u_outerGlow: number;\n  u_innerGlow: number;\n  u_colorInner: [number, number, number, number];\n  u_offset: number;\n  u_angle: number;\n  u_size: number;\n  u_shape: (typeof GemSmokeShapes)[GemSmokeShape];\n  u_isImage: boolean;\n}\n\nexport interface GemSmokeParams extends ShaderSizingParams, ShaderMotionParams {\n  colors?: string[];\n  colorBack?: string;\n  image?: HTMLImageElement | string | undefined;\n  innerDistortion?: number;\n  outerDistortion?: number;\n  outerGlow?: number;\n  innerGlow?: number;\n  colorInner?: string;\n  offset?: number;\n  angle?: number;\n  size?: number;\n  shape?: GemSmokeShape;\n}\n\nexport const GemSmokeShapes = {\n  none: 0,\n  circle: 1,\n  daisy: 2,\n  diamond: 3,\n  metaballs: 4,\n} as const;\n\nexport type GemSmokeShape = keyof typeof GemSmokeShapes;\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/shaders/god-rays.d.ts

@@ -10,15 +10,15 @@ export declare const godRaysMeta: {
  * Fragment shader uniforms:
  * - u_time (float): Animation time
  * - u_colorBack (vec4): Background color in RGBA
- * - u_colorBloom (vec4): Color overlay blended with the rays in RGBA
+ * - u_colorBloom (vec4): Color overlay blended with the rays in RGBA, needs bloom > 0
  * - u_colors (vec4[]): Up to 5 ray colors in RGBA
  * - u_colorsCount (float): Number of active colors
  * - u_bloom (float): Strength of the bloom/overlay effect, 0 = alpha blend, 1 = additive blend (0 to 1)
  * - u_intensity (float): Visibility/strength of the rays (0 to 1)
  * - u_density (float): The number of rays (0 to 1)
  * - u_spotty (float): The length of the rays, higher = more spots/shorter rays (0 to 1)
- * - u_midSize (float): Size of the circular glow shape in the center (0 to 1)
- * - u_midIntensity (float): Brightness/intensity of the central glow (0 to 1)
+ * - u_midSize (float): Size of the circular glow shape in the center, needs midIntensity > 0 (0 to 1)
+ * - u_midIntensity (float): Brightness/intensity of the central glow, needs midSize > 0 (0 to 1)
  * - u_noiseTexture (sampler2D): Pre-computed randomizer source texture
  *
  * Vertex shader outputs (used in fragment shader):

package/dist/shaders/god-rays.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/god-rays.ts"],
-  "sourcesContent": ["import type { vec4 } from '../types.js';\nimport type { ShaderMotionParams } from '../shader-mount.js';\nimport { type ShaderSizingParams, type ShaderSizingUniforms } from '../shader-sizing.js';\nimport { declarePI, rotation2, textureRandomizerR, colorBandingFix, proceduralHash11 } from '../shader-utils.js';\n\nexport const godRaysMeta = {\n  maxColorCount: 5,\n} as const;\n\n/**\n * Animated rays of light radiating from the center, blended with up to 5 colors.\n *\n * Fragment shader uniforms:\n * - u_time (float): Animation time\n * - u_colorBack (vec4): Background color in RGBA\n * - u_colorBloom (vec4): Color overlay blended with the rays in RGBA\n * - u_colors (vec4[]): Up to 5 ray colors in RGBA\n * - u_colorsCount (float): Number of active colors\n * - u_bloom (float): Strength of the bloom/overlay effect, 0 = alpha blend, 1 = additive blend (0 to 1)\n * - u_intensity (float): Visibility/strength of the rays (0 to 1)\n * - u_density (float): The number of rays (0 to 1)\n * - u_spotty (float): The length of the rays, higher = more spots/shorter rays (0 to 1)\n * - u_midSize (float): Size of the circular glow shape in the center (0 to 1)\n * - u_midIntensity (float): Brightness/intensity of the central glow (0 to 1)\n * - u_noiseTexture (sampler2D): Pre-computed randomizer source texture\n *\n * Vertex shader outputs (used in fragment shader):\n * - v_objectUV (vec2): Object box UV coordinates with global sizing (scale, rotation, offsets, etc) applied\n *\n * The rays are adjustable by size, density, brightness and center glow.\n *\n * Vertex shader uniforms:\n * - u_resolution (vec2): Canvas resolution in pixels\n * - u_pixelRatio (float): Device pixel ratio\n * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)\n * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)\n * - u_worldWidth (float): Virtual width of the graphic before it's scaled to fit the canvas\n * - u_worldHeight (float): Virtual height of the graphic before it's scaled to fit the canvas\n * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)\n * - u_scale (float): Overall zoom level of the graphics (0.01 to 4)\n * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)\n * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)\n * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)\n *\n */\n\n// language=GLSL\nexport const godRaysFragmentShader: string = `#version 300 es\nprecision mediump float;\n\nuniform float u_time;\n\nuniform sampler2D u_noiseTexture;\n\nuniform vec4 u_colorBack;\nuniform vec4 u_colorBloom;\nuniform vec4 u_colors[${ godRaysMeta.maxColorCount }];\nuniform float u_colorsCount;\n\nuniform float u_density;\nuniform float u_spotty;\nuniform float u_midSize;\nuniform float u_midIntensity;\nuniform float u_intensity;\nuniform float u_bloom;\n\nin vec2 v_objectUV;\n\nout vec4 fragColor;\n\n${ declarePI }\n${ rotation2 }\n${ textureRandomizerR }\nfloat valueNoise(vec2 st) {\n  vec2 i = floor(st);\n  vec2 f = fract(st);\n  float a = randomR(i);\n  float b = randomR(i + vec2(1.0, 0.0));\n  float c = randomR(i + vec2(0.0, 1.0));\n  float d = randomR(i + vec2(1.0, 1.0));\n  vec2 u = f * f * (3.0 - 2.0 * f);\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\n${ proceduralHash11 }\n\nfloat raysShape(vec2 uv, float r, float freq, float intensity, float radius) {\n  float a = atan(uv.y, uv.x);\n  vec2 left = vec2(a * freq, r);\n  vec2 right = vec2(fract(a / TWO_PI) * TWO_PI * freq, r);\n  float n_left = pow(valueNoise(left), intensity);\n  float n_right = pow(valueNoise(right), intensity);\n  float shape = mix(n_right, n_left, smoothstep(-.15, .15, uv.x));\n  return shape;\n}\n\nvoid main() {\n  vec2 shape_uv = v_objectUV;\n\n  float t = .2 * u_time;\n\n  float radius = length(shape_uv);\n  float spots = 6.5 * abs(u_spotty);\n\n  float intensity = 4. - 3. * clamp(u_intensity, 0., 1.);\n\n  float delta = 1. - smoothstep(0., 1., radius);\n\n  float midSize = 10. * abs(u_midSize);\n  float ms_lo = 0.02 * midSize;\n  float ms_hi = max(midSize, 1e-6);\n  float middleShape = pow(u_midIntensity, 0.3) * (1. - smoothstep(ms_lo, ms_hi, 3.0 * radius));\n  middleShape = pow(middleShape, 5.0);\n\n  vec3 accumColor = vec3(0.0);\n  float accumAlpha = 0.0;\n\n  for (int i = 0; i < ${ godRaysMeta.maxColorCount }; i++) {\n    if (i >= int(u_colorsCount)) break;\n\n    vec2 rotatedUV = rotate(shape_uv, float(i) + 1.0);\n\n    float r1 = radius * (1.0 + 0.4 * float(i)) - 3.0 * t;\n    float r2 = 0.5 * radius * (1.0 + spots) - 2.0 * t;\n    float density = 6. * u_density + step(.5, u_density) * pow(4.5 * (u_density - .5), 4.);\n    float f = mix(1.0, 3.0 + 0.5 * float(i), hash11(float(i) * 15.)) * density;\n\n    float ray = raysShape(rotatedUV, r1, 5.0 * f, intensity, radius);\n    ray *= raysShape(rotatedUV, r2, 4.0 * f, intensity, radius);\n    ray += (1. + 4. * ray) * middleShape;\n    ray = clamp(ray, 0.0, 1.0);\n\n    float srcAlpha = u_colors[i].a * ray;\n    vec3 srcColor = u_colors[i].rgb * srcAlpha;\n\n    vec3 alphaBlendColor = accumColor + (1.0 - accumAlpha) * srcColor;\n    float alphaBlendAlpha = accumAlpha + (1.0 - accumAlpha) * srcAlpha;\n\n    vec3 addBlendColor = accumColor + srcColor;\n    float addBlendAlpha = accumAlpha + srcAlpha;\n\n    accumColor = mix(alphaBlendColor, addBlendColor, u_bloom);\n    accumAlpha = mix(alphaBlendAlpha, addBlendAlpha, u_bloom);\n  }\n\n  float overlayAlpha = u_colorBloom.a;\n  vec3 overlayColor = u_colorBloom.rgb * overlayAlpha;\n\n  vec3 colorWithOverlay = accumColor + accumAlpha * overlayColor;\n  accumColor = mix(accumColor, colorWithOverlay, u_bloom);\n\n  vec3 bgColor = u_colorBack.rgb * u_colorBack.a;\n\n  vec3 color = accumColor + (1. - accumAlpha) * bgColor;\n  float opacity = accumAlpha + (1. - accumAlpha) * u_colorBack.a;\n  color = clamp(color, 0., 1.);\n  opacity = clamp(opacity, 0., 1.);\n\n  ${ colorBandingFix }\n\n  fragColor = vec4(color, opacity);\n}\n`;\n\nexport interface GodRaysUniforms extends ShaderSizingUniforms {\n  u_colorBack: [number, number, number, number];\n  u_colorBloom: [number, number, number, number];\n  u_colors: vec4[];\n  u_colorsCount: number;\n  u_spotty: number;\n  u_midSize: number;\n  u_midIntensity: number;\n  u_density: number;\n  u_intensity: number;\n  u_bloom: number;\n  u_noiseTexture?: HTMLImageElement;\n}\n\nexport interface GodRaysParams extends ShaderSizingParams, ShaderMotionParams {\n  colorBack?: string;\n  colorBloom?: string;\n  colors?: string[];\n  spotty?: number;\n  midSize?: number;\n  midIntensity?: number;\n  density?: number;\n  intensity?: number;\n  bloom?: number;\n}\n"],
+  "sourcesContent": ["import type { vec4 } from '../types.js';\nimport type { ShaderMotionParams } from '../shader-mount.js';\nimport { type ShaderSizingParams, type ShaderSizingUniforms } from '../shader-sizing.js';\nimport { declarePI, rotation2, textureRandomizerR, colorBandingFix, proceduralHash11 } from '../shader-utils.js';\n\nexport const godRaysMeta = {\n  maxColorCount: 5,\n} as const;\n\n/**\n * Animated rays of light radiating from the center, blended with up to 5 colors.\n *\n * Fragment shader uniforms:\n * - u_time (float): Animation time\n * - u_colorBack (vec4): Background color in RGBA\n * - u_colorBloom (vec4): Color overlay blended with the rays in RGBA, needs bloom > 0\n * - u_colors (vec4[]): Up to 5 ray colors in RGBA\n * - u_colorsCount (float): Number of active colors\n * - u_bloom (float): Strength of the bloom/overlay effect, 0 = alpha blend, 1 = additive blend (0 to 1)\n * - u_intensity (float): Visibility/strength of the rays (0 to 1)\n * - u_density (float): The number of rays (0 to 1)\n * - u_spotty (float): The length of the rays, higher = more spots/shorter rays (0 to 1)\n * - u_midSize (float): Size of the circular glow shape in the center, needs midIntensity > 0 (0 to 1)\n * - u_midIntensity (float): Brightness/intensity of the central glow, needs midSize > 0 (0 to 1)\n * - u_noiseTexture (sampler2D): Pre-computed randomizer source texture\n *\n * Vertex shader outputs (used in fragment shader):\n * - v_objectUV (vec2): Object box UV coordinates with global sizing (scale, rotation, offsets, etc) applied\n *\n * The rays are adjustable by size, density, brightness and center glow.\n *\n * Vertex shader uniforms:\n * - u_resolution (vec2): Canvas resolution in pixels\n * - u_pixelRatio (float): Device pixel ratio\n * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)\n * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)\n * - u_worldWidth (float): Virtual width of the graphic before it's scaled to fit the canvas\n * - u_worldHeight (float): Virtual height of the graphic before it's scaled to fit the canvas\n * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)\n * - u_scale (float): Overall zoom level of the graphics (0.01 to 4)\n * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)\n * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)\n * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)\n *\n */\n\n// language=GLSL\nexport const godRaysFragmentShader: string = `#version 300 es\nprecision mediump float;\n\nuniform float u_time;\n\nuniform sampler2D u_noiseTexture;\n\nuniform vec4 u_colorBack;\nuniform vec4 u_colorBloom;\nuniform vec4 u_colors[${ godRaysMeta.maxColorCount }];\nuniform float u_colorsCount;\n\nuniform float u_density;\nuniform float u_spotty;\nuniform float u_midSize;\nuniform float u_midIntensity;\nuniform float u_intensity;\nuniform float u_bloom;\n\nin vec2 v_objectUV;\n\nout vec4 fragColor;\n\n${ declarePI }\n${ rotation2 }\n${ textureRandomizerR }\nfloat valueNoise(vec2 st) {\n  vec2 i = floor(st);\n  vec2 f = fract(st);\n  float a = randomR(i);\n  float b = randomR(i + vec2(1.0, 0.0));\n  float c = randomR(i + vec2(0.0, 1.0));\n  float d = randomR(i + vec2(1.0, 1.0));\n  vec2 u = f * f * (3.0 - 2.0 * f);\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\n${ proceduralHash11 }\n\nfloat raysShape(vec2 uv, float r, float freq, float intensity, float radius) {\n  float a = atan(uv.y, uv.x);\n  vec2 left = vec2(a * freq, r);\n  vec2 right = vec2(fract(a / TWO_PI) * TWO_PI * freq, r);\n  float n_left = pow(valueNoise(left), intensity);\n  float n_right = pow(valueNoise(right), intensity);\n  float shape = mix(n_right, n_left, smoothstep(-.15, .15, uv.x));\n  return shape;\n}\n\nvoid main() {\n  vec2 shape_uv = v_objectUV;\n\n  float t = .2 * u_time;\n\n  float radius = length(shape_uv);\n  float spots = 6.5 * abs(u_spotty);\n\n  float intensity = 4. - 3. * clamp(u_intensity, 0., 1.);\n\n  float delta = 1. - smoothstep(0., 1., radius);\n\n  float midSize = 10. * abs(u_midSize);\n  float ms_lo = 0.02 * midSize;\n  float ms_hi = max(midSize, 1e-6);\n  float middleShape = pow(u_midIntensity, 0.3) * (1. - smoothstep(ms_lo, ms_hi, 3.0 * radius));\n  middleShape = pow(middleShape, 5.0);\n\n  vec3 accumColor = vec3(0.0);\n  float accumAlpha = 0.0;\n\n  for (int i = 0; i < ${ godRaysMeta.maxColorCount }; i++) {\n    if (i >= int(u_colorsCount)) break;\n\n    vec2 rotatedUV = rotate(shape_uv, float(i) + 1.0);\n\n    float r1 = radius * (1.0 + 0.4 * float(i)) - 3.0 * t;\n    float r2 = 0.5 * radius * (1.0 + spots) - 2.0 * t;\n    float density = 6. * u_density + step(.5, u_density) * pow(4.5 * (u_density - .5), 4.);\n    float f = mix(1.0, 3.0 + 0.5 * float(i), hash11(float(i) * 15.)) * density;\n\n    float ray = raysShape(rotatedUV, r1, 5.0 * f, intensity, radius);\n    ray *= raysShape(rotatedUV, r2, 4.0 * f, intensity, radius);\n    ray += (1. + 4. * ray) * middleShape;\n    ray = clamp(ray, 0.0, 1.0);\n\n    float srcAlpha = u_colors[i].a * ray;\n    vec3 srcColor = u_colors[i].rgb * srcAlpha;\n\n    vec3 alphaBlendColor = accumColor + (1.0 - accumAlpha) * srcColor;\n    float alphaBlendAlpha = accumAlpha + (1.0 - accumAlpha) * srcAlpha;\n\n    vec3 addBlendColor = accumColor + srcColor;\n    float addBlendAlpha = accumAlpha + srcAlpha;\n\n    accumColor = mix(alphaBlendColor, addBlendColor, u_bloom);\n    accumAlpha = mix(alphaBlendAlpha, addBlendAlpha, u_bloom);\n  }\n\n  float overlayAlpha = u_colorBloom.a;\n  vec3 overlayColor = u_colorBloom.rgb * overlayAlpha;\n\n  vec3 colorWithOverlay = accumColor + accumAlpha * overlayColor;\n  accumColor = mix(accumColor, colorWithOverlay, u_bloom);\n\n  vec3 bgColor = u_colorBack.rgb * u_colorBack.a;\n\n  vec3 color = accumColor + (1. - accumAlpha) * bgColor;\n  float opacity = accumAlpha + (1. - accumAlpha) * u_colorBack.a;\n  color = clamp(color, 0., 1.);\n  opacity = clamp(opacity, 0., 1.);\n\n  ${ colorBandingFix }\n\n  fragColor = vec4(color, opacity);\n}\n`;\n\nexport interface GodRaysUniforms extends ShaderSizingUniforms {\n  u_colorBack: [number, number, number, number];\n  u_colorBloom: [number, number, number, number];\n  u_colors: vec4[];\n  u_colorsCount: number;\n  u_spotty: number;\n  u_midSize: number;\n  u_midIntensity: number;\n  u_density: number;\n  u_intensity: number;\n  u_bloom: number;\n  u_noiseTexture?: HTMLImageElement;\n}\n\nexport interface GodRaysParams extends ShaderSizingParams, ShaderMotionParams {\n  colorBack?: string;\n  colorBloom?: string;\n  colors?: string[];\n  spotty?: number;\n  midSize?: number;\n  midIntensity?: number;\n  density?: number;\n  intensity?: number;\n  bloom?: number;\n}\n"],
   "mappings": ";;;;;AAEA,eAAmE;AACnE,SAAS,WAAW,WAAW,oBAAoB,iBAAiB,wBAAwB;AAErF,MAAM,cAAc;AAAA,EACzB,eAAe;AACjB;AAwCO,MAAM,wBAAgC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASpB,YAAY,aAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAchD,SAAU;AAAA,EACV,SAAU;AAAA,EACV,kBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAcnB,gBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAiCK,YAAY,aAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAyC9C,eAAgB;AAAA;AAAA;AAAA;AAAA;",
   "names": []
 }

package/dist/shaders/grain-gradient.d.ts

@@ -13,8 +13,6 @@ export declare const grainGradientMeta: {
  * - u_time (float): Animation time
  * - u_resolution (vec2): Canvas resolution in pixels
  * - u_pixelRatio (float): Device pixel ratio
- * - u_originX (float): Reference point for positioning (0 to 1)
- * - u_originY (float): Reference point for positioning (0 to 1)
  * - u_worldWidth (float): Virtual width of the graphic
  * - u_worldHeight (float): Virtual height of the graphic
  * - u_fit (float): Fit mode (0 = none, 1 = contain, 2 = cover)

package/dist/shaders/grain-gradient.js

@@ -32,8 +32,6 @@ uniform float u_intensity;
 uniform float u_noise;
 uniform float u_shape;
 
-uniform mediump float u_originX;
-uniform mediump float u_originY;
 uniform mediump float u_worldWidth;
 uniform mediump float u_worldHeight;
 uniform mediump float u_fit;

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/grain-gradient.ts"],
-  "sourcesContent": ["import type { vec4 } from '../types.js';\nimport type { ShaderMotionParams } from '../shader-mount.js';\nimport {\n  type ShaderSizingParams,\n  type ShaderSizingUniforms,\n} from '../shader-sizing.js';\nimport {\n  simplexNoise,\n  declarePI,\n  rotation2,\n  textureRandomizerR,\n  proceduralHash11,\n} from '../shader-utils.js';\n\nexport const grainGradientMeta = {\n  maxColorCount: 7,\n} as const;\n\n/**\n * Multi-color gradients with grainy, noise-textured distortion available in 7 animated abstract forms.\n *\n * Note: grains are calculated using gl_FragCoord & u_resolution, meaning grains don't react to scaling and fit\n *\n * Fragment shader uniforms:\n * - u_time (float): Animation time\n * - u_resolution (vec2): Canvas resolution in pixels\n * - u_pixelRatio (float): Device pixel ratio\n * - u_originX (float): Reference point for positioning (0 to 1)\n * - u_originY (float): Reference point for positioning (0 to 1)\n * - u_worldWidth (float): Virtual width of the graphic\n * - u_worldHeight (float): Virtual height of the graphic\n * - u_fit (float): Fit mode (0 = none, 1 = contain, 2 = cover)\n * - u_scale (float): Overall zoom level (0.01 to 4)\n * - u_rotation (float): Rotation angle in degrees (0 to 360)\n * - u_offsetX (float): Horizontal offset (-1 to 1)\n * - u_offsetY (float): Vertical offset (-1 to 1)\n * - u_colorBack (vec4): Background color in RGBA\n * - u_colors (vec4[]): Up to 7 gradient colors in RGBA\n * - u_colorsCount (float): Number of active colors\n * - u_softness (float): Color transition sharpness, 0 = hard edge, 1 = smooth gradient (0 to 1)\n * - u_intensity (float): Distortion between color bands (0 to 1)\n * - u_noise (float): Grainy noise overlay (0 to 1)\n * - u_shape (float): Shape type (1 = wave, 2 = dots, 3 = truchet, 4 = corners, 5 = ripple, 6 = blob, 7 = sphere)\n * - u_noiseTexture (sampler2D): Pre-computed randomizer source texture\n *\n * Vertex shader outputs (used in fragment shader):\n * - v_objectUV (vec2): Object box UV coordinates with global sizing (scale, rotation, offsets, etc) applied (used for shapes 4-7)\n * - v_objectBoxSize (vec2): Size of the object bounding box in pixels\n * - v_patternUV (vec2): UV coordinates for pattern with global sizing (rotation, scale, offset, etc) applied (used for shapes 1-3)\n * - v_patternBoxSize (vec2): Size of the pattern bounding box in pixels\n *\n * Vertex shader uniforms:\n * - u_resolution (vec2): Canvas resolution in pixels\n * - u_pixelRatio (float): Device pixel ratio\n * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)\n * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)\n * - u_worldWidth (float): Virtual width of the graphic before it's scaled to fit the canvas\n * - u_worldHeight (float): Virtual height of the graphic before it's scaled to fit the canvas\n * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)\n * - u_scale (float): Overall zoom level of the graphics (0.01 to 4)\n * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)\n * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)\n * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)\n *\n */\n\n// language=GLSL\nexport const grainGradientFragmentShader: string = `#version 300 es\nprecision lowp float;\n\nuniform mediump float u_time;\nuniform mediump vec2 u_resolution;\nuniform mediump float u_pixelRatio;\n\nuniform sampler2D u_noiseTexture;\n\nuniform vec4 u_colorBack;\nuniform vec4 u_colors[${ grainGradientMeta.maxColorCount }];\nuniform float u_colorsCount;\nuniform float u_softness;\nuniform float u_intensity;\nuniform float u_noise;\nuniform float u_shape;\n\nuniform mediump float u_originX;\nuniform mediump float u_originY;\nuniform mediump float u_worldWidth;\nuniform mediump float u_worldHeight;\nuniform mediump float u_fit;\n\nuniform mediump float u_scale;\nuniform mediump float u_rotation;\nuniform mediump float u_offsetX;\nuniform mediump float u_offsetY;\n\nin vec2 v_objectUV;\nin vec2 v_patternUV;\nin vec2 v_objectBoxSize;\nin vec2 v_patternBoxSize;\n\nout vec4 fragColor;\n\n${ declarePI }\n${ simplexNoise }\n${ rotation2 }\n${ textureRandomizerR }\n\nfloat valueNoiseR(vec2 st) {\n  vec2 i = floor(st);\n  vec2 f = fract(st);\n  float a = randomR(i);\n  float b = randomR(i + vec2(1.0, 0.0));\n  float c = randomR(i + vec2(0.0, 1.0));\n  float d = randomR(i + vec2(1.0, 1.0));\n  vec2 u = f * f * (3.0 - 2.0 * f);\n  float x1 = mix(a, b, u.x);\n  float x2 = mix(c, d, u.x);\n  return mix(x1, x2, u.y);\n}\nvec4 fbmR(vec2 n0, vec2 n1, vec2 n2, vec2 n3) {\n  float amplitude = 0.2;\n  vec4 total = vec4(0.);\n  for (int i = 0; i < 3; i++) {\n    n0 = rotate(n0, 0.3);\n    n1 = rotate(n1, 0.3);\n    n2 = rotate(n2, 0.3);\n    n3 = rotate(n3, 0.3);\n    total.x += valueNoiseR(n0) * amplitude;\n    total.y += valueNoiseR(n1) * amplitude;\n    total.z += valueNoiseR(n2) * amplitude;\n    total.z += valueNoiseR(n3) * amplitude;\n    n0 *= 1.99;\n    n1 *= 1.99;\n    n2 *= 1.99;\n    n3 *= 1.99;\n    amplitude *= 0.6;\n  }\n  return total;\n}\n\n${ proceduralHash11 }\n\nvec2 truchet(vec2 uv, float idx){\n  idx = fract(((idx - .5) * 2.));\n  if (idx > 0.75) {\n    uv = vec2(1.0) - uv;\n  } else if (idx > 0.5) {\n    uv = vec2(1.0 - uv.x, uv.y);\n  } else if (idx > 0.25) {\n    uv = 1.0 - vec2(1.0 - uv.x, uv.y);\n  }\n  return uv;\n}\n\nvoid main() {\n\n  const float firstFrameOffset = 7.;\n  float t = .1 * (u_time + firstFrameOffset);\n\n  vec2 shape_uv = vec2(0.);\n  vec2 grain_uv = vec2(0.);\n\n  float r = u_rotation * PI / 180.;\n  float cr = cos(r);\n  float sr = sin(r);\n  mat2 graphicRotation = mat2(cr, sr, -sr, cr);\n  vec2 graphicOffset = vec2(-u_offsetX, u_offsetY);\n\n  if (u_shape > 3.5) {\n    shape_uv = v_objectUV;\n    grain_uv = shape_uv;\n\n    // apply inverse transform to grain_uv so it respects the originXY\n    grain_uv = transpose(graphicRotation) * grain_uv;\n    grain_uv *= u_scale;\n    grain_uv -= graphicOffset;\n    grain_uv *= v_objectBoxSize;\n    grain_uv *= .7;\n  } else {\n    shape_uv = .5 * v_patternUV;\n    grain_uv = 100. * v_patternUV;\n\n    // apply inverse transform to grain_uv so it respects the originXY\n    grain_uv = transpose(graphicRotation) * grain_uv;\n    grain_uv *= u_scale;\n    if (u_fit > 0.) {\n      vec2 givenBoxSize = vec2(u_worldWidth, u_worldHeight);\n      givenBoxSize = max(givenBoxSize, vec2(1.)) * u_pixelRatio;\n      float patternBoxRatio = givenBoxSize.x / givenBoxSize.y;\n      vec2 patternBoxGivenSize = vec2(\n      (u_worldWidth == 0.) ? u_resolution.x : givenBoxSize.x,\n      (u_worldHeight == 0.) ? u_resolution.y : givenBoxSize.y\n      );\n      patternBoxRatio = patternBoxGivenSize.x / patternBoxGivenSize.y;\n      float patternBoxNoFitBoxWidth = patternBoxRatio * min(patternBoxGivenSize.x / patternBoxRatio, patternBoxGivenSize.y);\n      grain_uv /= (patternBoxNoFitBoxWidth / v_patternBoxSize.x);\n    }\n    vec2 patternBoxScale = u_resolution.xy / v_patternBoxSize;\n    grain_uv -= graphicOffset / patternBoxScale;\n    grain_uv *= 1.6;\n  }\n\n\n  float shape = 0.;\n\n  if (u_shape < 1.5) {\n    // Sine wave\n\n    float wave = cos(.5 * shape_uv.x - 4. * t) * sin(1.5 * shape_uv.x + 2. * t) * (.75 + .25 * cos(6. * t));\n    shape = 1. - smoothstep(-1., 1., shape_uv.y + wave);\n\n  } else if (u_shape < 2.5) {\n    // Grid (dots)\n\n    float stripeIdx = floor(2. * shape_uv.x / TWO_PI);\n    float rand = hash11(stripeIdx * 100.);\n    rand = sign(rand - .5) * pow(4. * abs(rand), .3);\n    shape = sin(shape_uv.x) * cos(shape_uv.y - 5. * rand * t);\n    shape = pow(abs(shape), 4.);\n\n  } else if (u_shape < 3.5) {\n    // Truchet pattern\n\n    float n2 = valueNoiseR(shape_uv * .4 - 3.75 * t);\n    shape_uv.x += 10.;\n    shape_uv *= .6;\n\n    vec2 tile = truchet(fract(shape_uv), randomR(floor(shape_uv)));\n\n    float distance1 = length(tile);\n    float distance2 = length(tile - vec2(1.));\n\n    n2 -= .5;\n    n2 *= .1;\n    shape = smoothstep(.2, .55, distance1 + n2) * (1. - smoothstep(.45, .8, distance1 - n2));\n    shape += smoothstep(.2, .55, distance2 + n2) * (1. - smoothstep(.45, .8, distance2 - n2));\n\n    shape = pow(shape, 1.5);\n\n  } else if (u_shape < 4.5) {\n    // Corners\n\n    shape_uv *= .6;\n    vec2 outer = vec2(.5);\n\n    vec2 bl = smoothstep(vec2(0.), outer, shape_uv + vec2(.1 + .1 * sin(3. * t), .2 - .1 * sin(5.25 * t)));\n    vec2 tr = smoothstep(vec2(0.), outer, 1. - shape_uv);\n    shape = 1. - bl.x * bl.y * tr.x * tr.y;\n\n    shape_uv = -shape_uv;\n    bl = smoothstep(vec2(0.), outer, shape_uv + vec2(.1 + .1 * sin(3. * t), .2 - .1 * cos(5.25 * t)));\n    tr = smoothstep(vec2(0.), outer, 1. - shape_uv);\n    shape -= bl.x * bl.y * tr.x * tr.y;\n\n    shape = 1. - smoothstep(0., 1., shape);\n\n  } else if (u_shape < 5.5) {\n    // Ripple\n\n    shape_uv *= 2.;\n    float dist = length(.4 * shape_uv);\n    float waves = sin(pow(dist, 1.2) * 5. - 3. * t) * .5 + .5;\n    shape = waves;\n\n  } else if (u_shape < 6.5) {\n    // Blob\n\n    t *= 2.;\n\n    vec2 f1_traj = .25 * vec2(1.3 * sin(t), .2 + 1.3 * cos(.6 * t + 4.));\n    vec2 f2_traj = .2 * vec2(1.2 * sin(-t), 1.3 * sin(1.6 * t));\n    vec2 f3_traj = .25 * vec2(1.7 * cos(-.6 * t), cos(-1.6 * t));\n    vec2 f4_traj = .3 * vec2(1.4 * cos(.8 * t), 1.2 * sin(-.6 * t - 3.));\n\n    shape = .5 * pow(1. - clamp(0., 1., length(shape_uv + f1_traj)), 5.);\n    shape += .5 * pow(1. - clamp(0., 1., length(shape_uv + f2_traj)), 5.);\n    shape += .5 * pow(1. - clamp(0., 1., length(shape_uv + f3_traj)), 5.);\n    shape += .5 * pow(1. - clamp(0., 1., length(shape_uv + f4_traj)), 5.);\n\n    shape = smoothstep(.0, .9, shape);\n    float edge = smoothstep(.25, .3, shape);\n    shape = mix(.0, shape, edge);\n\n  } else {\n    // Sphere\n\n    shape_uv *= 2.;\n    float d = 1. - pow(length(shape_uv), 2.);\n    vec3 pos = vec3(shape_uv, sqrt(max(d, 0.)));\n    vec3 lightPos = normalize(vec3(cos(1.5 * t), .8, sin(1.25 * t)));\n    shape = .5 + .5 * dot(lightPos, pos);\n    shape *= step(0., d);\n  }\n\n  float baseNoise = snoise(grain_uv * .5);\n  vec4 fbmVals = fbmR(\n  .002 * grain_uv + 10.,\n  .003 * grain_uv,\n  .001 * grain_uv,\n  rotate(.4 * grain_uv, 2.)\n  );\n  float grainDist = baseNoise * snoise(grain_uv * .2) - fbmVals.x - fbmVals.y;\n  float rawNoise = .75 * baseNoise - fbmVals.w - fbmVals.z;\n  float noise = clamp(rawNoise, 0., 1.);\n\n  shape += u_intensity * 2. / u_colorsCount * (grainDist + .5);\n  shape += u_noise * 10. / u_colorsCount * noise;\n\n  float aa = fwidth(shape);\n\n  shape = clamp(shape - .5 / u_colorsCount, 0., 1.);\n  float totalShape = smoothstep(0., u_softness + 2. * aa, clamp(shape * u_colorsCount, 0., 1.));\n  float mixer = shape * (u_colorsCount - 1.);\n\n  int cntStop = int(u_colorsCount) - 1;\n  vec4 gradient = u_colors[0];\n  gradient.rgb *= gradient.a;\n  for (int i = 1; i < ${ grainGradientMeta.maxColorCount }; i++) {\n    if (i > cntStop) break;\n\n    float localT = clamp(mixer - float(i - 1), 0., 1.);\n    localT = smoothstep(.5 - .5 * u_softness - aa, .5 + .5 * u_softness + aa, localT);\n\n    vec4 c = u_colors[i];\n    c.rgb *= c.a;\n    gradient = mix(gradient, c, localT);\n  }\n\n  vec3 color = gradient.rgb * totalShape;\n  float opacity = gradient.a * totalShape;\n\n  vec3 bgColor = u_colorBack.rgb * u_colorBack.a;\n  color = color + bgColor * (1.0 - opacity);\n  opacity = opacity + u_colorBack.a * (1.0 - opacity);\n\n  fragColor = vec4(color, opacity);\n}\n`;\n\nexport interface GrainGradientUniforms extends ShaderSizingUniforms {\n  u_colorBack: [number, number, number, number];\n  u_colors: vec4[];\n  u_colorsCount: number;\n  u_softness: number;\n  u_intensity: number;\n  u_noise: number;\n  u_shape: (typeof GrainGradientShapes)[GrainGradientShape];\n  u_noiseTexture?: HTMLImageElement;\n}\n\nexport interface GrainGradientParams extends ShaderSizingParams, ShaderMotionParams {\n  colorBack?: string;\n  colors?: string[];\n  softness?: number;\n  intensity?: number;\n  noise?: number;\n  shape?: GrainGradientShape;\n}\n\nexport const GrainGradientShapes = {\n  wave: 1,\n  dots: 2,\n  truchet: 3,\n  corners: 4,\n  ripple: 5,\n  blob: 6,\n  sphere: 7,\n};\n\nexport type GrainGradientShape = keyof typeof GrainGradientShapes;\n"],
-  "mappings": ";;;;;AAEA;AAAA,OAGO;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,MAAM,oBAAoB;AAAA,EAC/B,eAAe;AACjB;AAmDO,MAAM,8BAAsC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAU1B,kBAAkB,aAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAyBtD,SAAU;AAAA,EACV,YAAa;AAAA,EACb,SAAU;AAAA,EACV,kBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAmCnB,gBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAiLK,kBAAkB,aAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0ClD,MAAM,sBAAsB;AAAA,EACjC,MAAM;AAAA,EACN,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,QAAQ;AACV;",
+  "sourcesContent": ["import type { vec4 } from '../types.js';\nimport type { ShaderMotionParams } from '../shader-mount.js';\nimport {\n  type ShaderSizingParams,\n  type ShaderSizingUniforms,\n} from '../shader-sizing.js';\nimport {\n  simplexNoise,\n  declarePI,\n  rotation2,\n  textureRandomizerR,\n  proceduralHash11,\n} from '../shader-utils.js';\n\nexport const grainGradientMeta = {\n  maxColorCount: 7,\n} as const;\n\n/**\n * Multi-color gradients with grainy, noise-textured distortion available in 7 animated abstract forms.\n *\n * Note: grains are calculated using gl_FragCoord & u_resolution, meaning grains don't react to scaling and fit\n *\n * Fragment shader uniforms:\n * - u_time (float): Animation time\n * - u_resolution (vec2): Canvas resolution in pixels\n * - u_pixelRatio (float): Device pixel ratio\n * - u_worldWidth (float): Virtual width of the graphic\n * - u_worldHeight (float): Virtual height of the graphic\n * - u_fit (float): Fit mode (0 = none, 1 = contain, 2 = cover)\n * - u_scale (float): Overall zoom level (0.01 to 4)\n * - u_rotation (float): Rotation angle in degrees (0 to 360)\n * - u_offsetX (float): Horizontal offset (-1 to 1)\n * - u_offsetY (float): Vertical offset (-1 to 1)\n * - u_colorBack (vec4): Background color in RGBA\n * - u_colors (vec4[]): Up to 7 gradient colors in RGBA\n * - u_colorsCount (float): Number of active colors\n * - u_softness (float): Color transition sharpness, 0 = hard edge, 1 = smooth gradient (0 to 1)\n * - u_intensity (float): Distortion between color bands (0 to 1)\n * - u_noise (float): Grainy noise overlay (0 to 1)\n * - u_shape (float): Shape type (1 = wave, 2 = dots, 3 = truchet, 4 = corners, 5 = ripple, 6 = blob, 7 = sphere)\n * - u_noiseTexture (sampler2D): Pre-computed randomizer source texture\n *\n * Vertex shader outputs (used in fragment shader):\n * - v_objectUV (vec2): Object box UV coordinates with global sizing (scale, rotation, offsets, etc) applied (used for shapes 4-7)\n * - v_objectBoxSize (vec2): Size of the object bounding box in pixels\n * - v_patternUV (vec2): UV coordinates for pattern with global sizing (rotation, scale, offset, etc) applied (used for shapes 1-3)\n * - v_patternBoxSize (vec2): Size of the pattern bounding box in pixels\n *\n * Vertex shader uniforms:\n * - u_resolution (vec2): Canvas resolution in pixels\n * - u_pixelRatio (float): Device pixel ratio\n * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)\n * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)\n * - u_worldWidth (float): Virtual width of the graphic before it's scaled to fit the canvas\n * - u_worldHeight (float): Virtual height of the graphic before it's scaled to fit the canvas\n * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)\n * - u_scale (float): Overall zoom level of the graphics (0.01 to 4)\n * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)\n * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)\n * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)\n *\n */\n\n// language=GLSL\nexport const grainGradientFragmentShader: string = `#version 300 es\nprecision lowp float;\n\nuniform mediump float u_time;\nuniform mediump vec2 u_resolution;\nuniform mediump float u_pixelRatio;\n\nuniform sampler2D u_noiseTexture;\n\nuniform vec4 u_colorBack;\nuniform vec4 u_colors[${ grainGradientMeta.maxColorCount }];\nuniform float u_colorsCount;\nuniform float u_softness;\nuniform float u_intensity;\nuniform float u_noise;\nuniform float u_shape;\n\nuniform mediump float u_worldWidth;\nuniform mediump float u_worldHeight;\nuniform mediump float u_fit;\n\nuniform mediump float u_scale;\nuniform mediump float u_rotation;\nuniform mediump float u_offsetX;\nuniform mediump float u_offsetY;\n\nin vec2 v_objectUV;\nin vec2 v_patternUV;\nin vec2 v_objectBoxSize;\nin vec2 v_patternBoxSize;\n\nout vec4 fragColor;\n\n${ declarePI }\n${ simplexNoise }\n${ rotation2 }\n${ textureRandomizerR }\n\nfloat valueNoiseR(vec2 st) {\n  vec2 i = floor(st);\n  vec2 f = fract(st);\n  float a = randomR(i);\n  float b = randomR(i + vec2(1.0, 0.0));\n  float c = randomR(i + vec2(0.0, 1.0));\n  float d = randomR(i + vec2(1.0, 1.0));\n  vec2 u = f * f * (3.0 - 2.0 * f);\n  float x1 = mix(a, b, u.x);\n  float x2 = mix(c, d, u.x);\n  return mix(x1, x2, u.y);\n}\nvec4 fbmR(vec2 n0, vec2 n1, vec2 n2, vec2 n3) {\n  float amplitude = 0.2;\n  vec4 total = vec4(0.);\n  for (int i = 0; i < 3; i++) {\n    n0 = rotate(n0, 0.3);\n    n1 = rotate(n1, 0.3);\n    n2 = rotate(n2, 0.3);\n    n3 = rotate(n3, 0.3);\n    total.x += valueNoiseR(n0) * amplitude;\n    total.y += valueNoiseR(n1) * amplitude;\n    total.z += valueNoiseR(n2) * amplitude;\n    total.z += valueNoiseR(n3) * amplitude;\n    n0 *= 1.99;\n    n1 *= 1.99;\n    n2 *= 1.99;\n    n3 *= 1.99;\n    amplitude *= 0.6;\n  }\n  return total;\n}\n\n${ proceduralHash11 }\n\nvec2 truchet(vec2 uv, float idx){\n  idx = fract(((idx - .5) * 2.));\n  if (idx > 0.75) {\n    uv = vec2(1.0) - uv;\n  } else if (idx > 0.5) {\n    uv = vec2(1.0 - uv.x, uv.y);\n  } else if (idx > 0.25) {\n    uv = 1.0 - vec2(1.0 - uv.x, uv.y);\n  }\n  return uv;\n}\n\nvoid main() {\n\n  const float firstFrameOffset = 7.;\n  float t = .1 * (u_time + firstFrameOffset);\n\n  vec2 shape_uv = vec2(0.);\n  vec2 grain_uv = vec2(0.);\n\n  float r = u_rotation * PI / 180.;\n  float cr = cos(r);\n  float sr = sin(r);\n  mat2 graphicRotation = mat2(cr, sr, -sr, cr);\n  vec2 graphicOffset = vec2(-u_offsetX, u_offsetY);\n\n  if (u_shape > 3.5) {\n    shape_uv = v_objectUV;\n    grain_uv = shape_uv;\n\n    // apply inverse transform to grain_uv so it respects the originXY\n    grain_uv = transpose(graphicRotation) * grain_uv;\n    grain_uv *= u_scale;\n    grain_uv -= graphicOffset;\n    grain_uv *= v_objectBoxSize;\n    grain_uv *= .7;\n  } else {\n    shape_uv = .5 * v_patternUV;\n    grain_uv = 100. * v_patternUV;\n\n    // apply inverse transform to grain_uv so it respects the originXY\n    grain_uv = transpose(graphicRotation) * grain_uv;\n    grain_uv *= u_scale;\n    if (u_fit > 0.) {\n      vec2 givenBoxSize = vec2(u_worldWidth, u_worldHeight);\n      givenBoxSize = max(givenBoxSize, vec2(1.)) * u_pixelRatio;\n      float patternBoxRatio = givenBoxSize.x / givenBoxSize.y;\n      vec2 patternBoxGivenSize = vec2(\n      (u_worldWidth == 0.) ? u_resolution.x : givenBoxSize.x,\n      (u_worldHeight == 0.) ? u_resolution.y : givenBoxSize.y\n      );\n      patternBoxRatio = patternBoxGivenSize.x / patternBoxGivenSize.y;\n      float patternBoxNoFitBoxWidth = patternBoxRatio * min(patternBoxGivenSize.x / patternBoxRatio, patternBoxGivenSize.y);\n      grain_uv /= (patternBoxNoFitBoxWidth / v_patternBoxSize.x);\n    }\n    vec2 patternBoxScale = u_resolution.xy / v_patternBoxSize;\n    grain_uv -= graphicOffset / patternBoxScale;\n    grain_uv *= 1.6;\n  }\n\n\n  float shape = 0.;\n\n  if (u_shape < 1.5) {\n    // Sine wave\n\n    float wave = cos(.5 * shape_uv.x - 4. * t) * sin(1.5 * shape_uv.x + 2. * t) * (.75 + .25 * cos(6. * t));\n    shape = 1. - smoothstep(-1., 1., shape_uv.y + wave);\n\n  } else if (u_shape < 2.5) {\n    // Grid (dots)\n\n    float stripeIdx = floor(2. * shape_uv.x / TWO_PI);\n    float rand = hash11(stripeIdx * 100.);\n    rand = sign(rand - .5) * pow(4. * abs(rand), .3);\n    shape = sin(shape_uv.x) * cos(shape_uv.y - 5. * rand * t);\n    shape = pow(abs(shape), 4.);\n\n  } else if (u_shape < 3.5) {\n    // Truchet pattern\n\n    float n2 = valueNoiseR(shape_uv * .4 - 3.75 * t);\n    shape_uv.x += 10.;\n    shape_uv *= .6;\n\n    vec2 tile = truchet(fract(shape_uv), randomR(floor(shape_uv)));\n\n    float distance1 = length(tile);\n    float distance2 = length(tile - vec2(1.));\n\n    n2 -= .5;\n    n2 *= .1;\n    shape = smoothstep(.2, .55, distance1 + n2) * (1. - smoothstep(.45, .8, distance1 - n2));\n    shape += smoothstep(.2, .55, distance2 + n2) * (1. - smoothstep(.45, .8, distance2 - n2));\n\n    shape = pow(shape, 1.5);\n\n  } else if (u_shape < 4.5) {\n    // Corners\n\n    shape_uv *= .6;\n    vec2 outer = vec2(.5);\n\n    vec2 bl = smoothstep(vec2(0.), outer, shape_uv + vec2(.1 + .1 * sin(3. * t), .2 - .1 * sin(5.25 * t)));\n    vec2 tr = smoothstep(vec2(0.), outer, 1. - shape_uv);\n    shape = 1. - bl.x * bl.y * tr.x * tr.y;\n\n    shape_uv = -shape_uv;\n    bl = smoothstep(vec2(0.), outer, shape_uv + vec2(.1 + .1 * sin(3. * t), .2 - .1 * cos(5.25 * t)));\n    tr = smoothstep(vec2(0.), outer, 1. - shape_uv);\n    shape -= bl.x * bl.y * tr.x * tr.y;\n\n    shape = 1. - smoothstep(0., 1., shape);\n\n  } else if (u_shape < 5.5) {\n    // Ripple\n\n    shape_uv *= 2.;\n    float dist = length(.4 * shape_uv);\n    float waves = sin(pow(dist, 1.2) * 5. - 3. * t) * .5 + .5;\n    shape = waves;\n\n  } else if (u_shape < 6.5) {\n    // Blob\n\n    t *= 2.;\n\n    vec2 f1_traj = .25 * vec2(1.3 * sin(t), .2 + 1.3 * cos(.6 * t + 4.));\n    vec2 f2_traj = .2 * vec2(1.2 * sin(-t), 1.3 * sin(1.6 * t));\n    vec2 f3_traj = .25 * vec2(1.7 * cos(-.6 * t), cos(-1.6 * t));\n    vec2 f4_traj = .3 * vec2(1.4 * cos(.8 * t), 1.2 * sin(-.6 * t - 3.));\n\n    shape = .5 * pow(1. - clamp(0., 1., length(shape_uv + f1_traj)), 5.);\n    shape += .5 * pow(1. - clamp(0., 1., length(shape_uv + f2_traj)), 5.);\n    shape += .5 * pow(1. - clamp(0., 1., length(shape_uv + f3_traj)), 5.);\n    shape += .5 * pow(1. - clamp(0., 1., length(shape_uv + f4_traj)), 5.);\n\n    shape = smoothstep(.0, .9, shape);\n    float edge = smoothstep(.25, .3, shape);\n    shape = mix(.0, shape, edge);\n\n  } else {\n    // Sphere\n\n    shape_uv *= 2.;\n    float d = 1. - pow(length(shape_uv), 2.);\n    vec3 pos = vec3(shape_uv, sqrt(max(d, 0.)));\n    vec3 lightPos = normalize(vec3(cos(1.5 * t), .8, sin(1.25 * t)));\n    shape = .5 + .5 * dot(lightPos, pos);\n    shape *= step(0., d);\n  }\n\n  float baseNoise = snoise(grain_uv * .5);\n  vec4 fbmVals = fbmR(\n  .002 * grain_uv + 10.,\n  .003 * grain_uv,\n  .001 * grain_uv,\n  rotate(.4 * grain_uv, 2.)\n  );\n  float grainDist = baseNoise * snoise(grain_uv * .2) - fbmVals.x - fbmVals.y;\n  float rawNoise = .75 * baseNoise - fbmVals.w - fbmVals.z;\n  float noise = clamp(rawNoise, 0., 1.);\n\n  shape += u_intensity * 2. / u_colorsCount * (grainDist + .5);\n  shape += u_noise * 10. / u_colorsCount * noise;\n\n  float aa = fwidth(shape);\n\n  shape = clamp(shape - .5 / u_colorsCount, 0., 1.);\n  float totalShape = smoothstep(0., u_softness + 2. * aa, clamp(shape * u_colorsCount, 0., 1.));\n  float mixer = shape * (u_colorsCount - 1.);\n\n  int cntStop = int(u_colorsCount) - 1;\n  vec4 gradient = u_colors[0];\n  gradient.rgb *= gradient.a;\n  for (int i = 1; i < ${ grainGradientMeta.maxColorCount }; i++) {\n    if (i > cntStop) break;\n\n    float localT = clamp(mixer - float(i - 1), 0., 1.);\n    localT = smoothstep(.5 - .5 * u_softness - aa, .5 + .5 * u_softness + aa, localT);\n\n    vec4 c = u_colors[i];\n    c.rgb *= c.a;\n    gradient = mix(gradient, c, localT);\n  }\n\n  vec3 color = gradient.rgb * totalShape;\n  float opacity = gradient.a * totalShape;\n\n  vec3 bgColor = u_colorBack.rgb * u_colorBack.a;\n  color = color + bgColor * (1.0 - opacity);\n  opacity = opacity + u_colorBack.a * (1.0 - opacity);\n\n  fragColor = vec4(color, opacity);\n}\n`;\n\nexport interface GrainGradientUniforms extends ShaderSizingUniforms {\n  u_colorBack: [number, number, number, number];\n  u_colors: vec4[];\n  u_colorsCount: number;\n  u_softness: number;\n  u_intensity: number;\n  u_noise: number;\n  u_shape: (typeof GrainGradientShapes)[GrainGradientShape];\n  u_noiseTexture?: HTMLImageElement;\n}\n\nexport interface GrainGradientParams extends ShaderSizingParams, ShaderMotionParams {\n  colorBack?: string;\n  colors?: string[];\n  softness?: number;\n  intensity?: number;\n  noise?: number;\n  shape?: GrainGradientShape;\n}\n\nexport const GrainGradientShapes = {\n  wave: 1,\n  dots: 2,\n  truchet: 3,\n  corners: 4,\n  ripple: 5,\n  blob: 6,\n  sphere: 7,\n};\n\nexport type GrainGradientShape = keyof typeof GrainGradientShapes;\n"],
+  "mappings": ";;;;;AAEA;AAAA,OAGO;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,MAAM,oBAAoB;AAAA,EAC/B,eAAe;AACjB;AAiDO,MAAM,8BAAsC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAU1B,kBAAkB,aAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAuBtD,SAAU;AAAA,EACV,YAAa;AAAA,EACb,SAAU;AAAA,EACV,kBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAmCnB,gBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAiLK,kBAAkB,aAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0ClD,MAAM,sBAAsB;AAAA,EACjC,MAAM;AAAA,EACN,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,QAAQ;AACV;",
   "names": []
 }

package/dist/shaders/halftone-cmyk.d.ts

@@ -13,21 +13,20 @@ import { type ShaderSizingParams, type ShaderSizingUniforms } from '../shader-si
  * - u_colorY (vec4): Yellow ink color in RGBA
  * - u_colorK (vec4): Black ink color in RGBA
  * - u_size (float): Halftone cell size (0 to 1)
- * - u_minDot (float): Minimum dot thickness (0 to 1)
  * - u_contrast (float): Image contrast adjustment (0 to 2)
  * - u_softness (float): Edge softness of dots (0 to 1)
- * - u_grainSize (float): Size of grain overlay texture (0 to 1)
+ * - u_grainSize (float): Size of grain texture, applied to both grain and overlay, needs grainMixer or grainOverlay > 0 (0 to 1)
  * - u_grainMixer (float): Strength of grain affecting dot size (0 to 1)
  * - u_grainOverlay (float): Strength of grain overlay on final output (0 to 1)
- * - u_gridNoise (float): Strength of smooth noise applied to both dot positions and color sampling (0 to 1)
- * - u_floodC (float): Flat cyan dot size adjustment applied uniformly (-1 to 1)
- * - u_floodM (float): Flat magenta dot size adjustment applied uniformly (-1 to 1)
- * - u_floodY (float): Flat yellow dot size adjustment applied uniformly (-1 to 1)
- * - u_floodK (float): Flat black dot size adjustment applied uniformly (-1 to 1)
- * - u_gainC (float): Proportional cyan dot size gain (enhances existing dots, -1 to 1)
- * - u_gainM (float): Proportional magenta dot size gain (enhances existing dots, -1 to 1)
- * - u_gainY (float): Proportional yellow dot size gain (enhances existing dots, -1 to 1)
- * - u_gainK (float): Proportional black dot size gain (enhances existing dots, -1 to 1)
+ * - u_gridNoise (float): Strength of smooth noise applied to both dot positions and color sampling, positions only with sharp type (0 to 1)
+ * - u_floodC (float): Flat cyan dot size adjustment applied uniformly, needs colorC alpha > 0 (0 to 1)
+ * - u_floodM (float): Flat magenta dot size adjustment applied uniformly, needs colorM alpha > 0 (0 to 1)
+ * - u_floodY (float): Flat yellow dot size adjustment applied uniformly, needs colorY alpha > 0 (0 to 1)
+ * - u_floodK (float): Flat black dot size adjustment applied uniformly, needs colorK alpha > 0 (0 to 1)
+ * - u_gainC (float): Proportional cyan dot size gain, needs colorC alpha > 0 (enhances existing dots, -1 to 1)
+ * - u_gainM (float): Proportional magenta dot size gain, needs colorM alpha > 0 (enhances existing dots, -1 to 1)
+ * - u_gainY (float): Proportional yellow dot size gain, needs colorY alpha > 0 (enhances existing dots, -1 to 1)
+ * - u_gainK (float): Proportional black dot size gain, needs colorK alpha > 0 (enhances existing dots, -1 to 1)
  * - u_type (float): Dot shape style (0 = dots, 1 = ink, 2 = sharp)
  * - u_noiseTexture (sampler2D): Pre-computed randomizer source texture
  *
@@ -40,7 +39,7 @@ import { type ShaderSizingParams, type ShaderSizingUniforms } from '../shader-si
  * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)
  * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)
  * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)
- * - u_scale (float): Overall zoom level of the graphics (0.01 to 4)
+ * - u_scale (float): Overall zoom level of the graphics (0.1 to 4)
  * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)
  * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)
  * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)

package/dist/shaders/halftone-cmyk.js

@@ -17,7 +17,6 @@ uniform vec4 u_colorM;
 uniform vec4 u_colorY;
 uniform vec4 u_colorK;
 uniform float u_size;
-uniform float u_minDot;
 uniform float u_contrast;
 uniform float u_grainSize;
 uniform float u_grainMixer;
@@ -179,7 +178,11 @@ void main() {
 
   vec2 grainSize = mix(2000., 200., u_grainSize) * vec2(1., 1. / u_imageAspectRatio);
   vec2 grainUV = (v_imageUV - .5) * grainSize + .5;
-  vec3 noiseValues = valueNoise3(grainUV);
+  // shared by the grain mixer and the grain overlay, skip it when neither is on
+  vec3 noiseValues = vec3(0.);
+  if (u_grainMixer > 0. || u_grainOverlay > 0.) {
+    noiseValues = valueNoise3(grainUV);
+  }
   float grain = sst(.55, 1., noiseValues.r);
   grain *= u_grainMixer;
 

package/dist/shaders/halftone-cmyk.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shaders/halftone-cmyk.ts"],
-  "sourcesContent": ["import type { ShaderMotionParams } from '../shader-mount.js';\nimport { type ShaderSizingParams, type ShaderSizingUniforms } from '../shader-sizing.js';\nimport { declarePI } from '../shader-utils.js';\n\n/**\n * CMYK halftone printing effect applied to images with customizable dot patterns\n * and ink colors for each channel (Cyan, Magenta, Yellow, Black).\n *\n * Fragment shader uniforms:\n * - u_image (sampler2D): Source image texture\n * - u_imageAspectRatio (float): Aspect ratio of the source image\n * - u_colorBack (vec4): Background (paper) color in RGBA\n * - u_colorC (vec4): Cyan ink color in RGBA\n * - u_colorM (vec4): Magenta ink color in RGBA\n * - u_colorY (vec4): Yellow ink color in RGBA\n * - u_colorK (vec4): Black ink color in RGBA\n * - u_size (float): Halftone cell size (0 to 1)\n * - u_minDot (float): Minimum dot thickness (0 to 1)\n * - u_contrast (float): Image contrast adjustment (0 to 2)\n * - u_softness (float): Edge softness of dots (0 to 1)\n * - u_grainSize (float): Size of grain overlay texture (0 to 1)\n * - u_grainMixer (float): Strength of grain affecting dot size (0 to 1)\n * - u_grainOverlay (float): Strength of grain overlay on final output (0 to 1)\n * - u_gridNoise (float): Strength of smooth noise applied to both dot positions and color sampling (0 to 1)\n * - u_floodC (float): Flat cyan dot size adjustment applied uniformly (-1 to 1)\n * - u_floodM (float): Flat magenta dot size adjustment applied uniformly (-1 to 1)\n * - u_floodY (float): Flat yellow dot size adjustment applied uniformly (-1 to 1)\n * - u_floodK (float): Flat black dot size adjustment applied uniformly (-1 to 1)\n * - u_gainC (float): Proportional cyan dot size gain (enhances existing dots, -1 to 1)\n * - u_gainM (float): Proportional magenta dot size gain (enhances existing dots, -1 to 1)\n * - u_gainY (float): Proportional yellow dot size gain (enhances existing dots, -1 to 1)\n * - u_gainK (float): Proportional black dot size gain (enhances existing dots, -1 to 1)\n * - u_type (float): Dot shape style (0 = dots, 1 = ink, 2 = sharp)\n * - u_noiseTexture (sampler2D): Pre-computed randomizer source texture\n *\n * Vertex shader outputs (used in fragment shader):\n * - v_imageUV (vec2): UV coordinates for sampling the source image, with fit, scale, rotation, and offset applied\n *\n * Vertex shader uniforms:\n * - u_resolution (vec2): Canvas resolution in pixels\n * - u_pixelRatio (float): Device pixel ratio\n * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)\n * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)\n * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)\n * - u_scale (float): Overall zoom level of the graphics (0.01 to 4)\n * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)\n * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)\n * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)\n * - u_imageAspectRatio (float): Aspect ratio of the source image\n *\n */\n\n// language=GLSL\nexport const halftoneCmykFragmentShader: string = `#version 300 es\nprecision mediump float;\n\nuniform sampler2D u_image;\nuniform float u_imageAspectRatio;\n\nuniform vec4 u_colorBack;\nuniform vec4 u_colorC;\nuniform vec4 u_colorM;\nuniform vec4 u_colorY;\nuniform vec4 u_colorK;\nuniform float u_size;\nuniform float u_minDot;\nuniform float u_contrast;\nuniform float u_grainSize;\nuniform float u_grainMixer;\nuniform float u_grainOverlay;\nuniform float u_gridNoise;\nuniform float u_softness;\nuniform float u_floodC;\nuniform float u_floodM;\nuniform float u_floodY;\nuniform float u_floodK;\nuniform float u_gainC;\nuniform float u_gainM;\nuniform float u_gainY;\nuniform float u_gainK;\nuniform float u_type;\nuniform sampler2D u_noiseTexture;\n\nin vec2 v_imageUV;\nout vec4 fragColor;\n\nconst float shiftC = -.5;\nconst float shiftM = -.25;\nconst float shiftY = .2;\nconst float shiftK = 0.;\n\n// Precomputed sin/cos for rotation angles (15\u00B0, 75\u00B0, 0\u00B0, 45\u00B0)\nconst float cosC = 0.9659258;  const float sinC = 0.2588190;   // 15\u00B0\nconst float cosM = 0.2588190;  const float sinM = 0.9659258;   // 75\u00B0\nconst float cosY = 1.0;        const float sinY = 0.0;         // 0\u00B0\nconst float cosK = 0.7071068;  const float sinK = 0.7071068;   // 45\u00B0\n\n${ declarePI }\n\nvec2 randomRG(vec2 p) {\n  vec2 uv = floor(p) / 100. + .5;\n  return texture(u_noiseTexture, fract(uv)).rg;\n}\nvec3 hash23(vec2 p) {\n  vec3 p3 = fract(vec3(p.xyx) * vec3(0.3183099, 0.3678794, 0.3141592)) + 0.1;\n  p3 += dot(p3, p3.yzx + 19.19);\n  return fract(vec3(p3.x * p3.y, p3.y * p3.z, p3.z * p3.x));\n}\n\nfloat sst(float edge0, float edge1, float x) {\n  return smoothstep(edge0, edge1, x);\n}\n\nvec3 valueNoise3(vec2 st) {\n  vec2 i = floor(st);\n  vec2 f = fract(st);\n  vec3 a = hash23(i);\n  vec3 b = hash23(i + vec2(1.0, 0.0));\n  vec3 c = hash23(i + vec2(0.0, 1.0));\n  vec3 d = hash23(i + vec2(1.0, 1.0));\n  vec2 u = f * f * (3.0 - 2.0 * f);\n  vec3 x1 = mix(a, b, u.x);\n  vec3 x2 = mix(c, d, u.x);\n  return mix(x1, x2, u.y);\n}\n\nfloat getUvFrame(vec2 uv, vec2 pad) {\n  float left   = smoothstep(-pad.x, 0., uv.x);\n  float right  = smoothstep(1. + pad.x, 1., uv.x);\n  float bottom = smoothstep(-pad.y, 0., uv.y);\n  float top    = smoothstep(1. + pad.y, 1., uv.y);\n\n  return left * right * bottom * top;\n}\n\nvec4 RGBAtoCMYK(vec4 rgba) {\n  float k = 1. - max(max(rgba.r, rgba.g), rgba.b);\n  float denom = 1. - k;\n  vec3 cmy = vec3(0.);\n  if (denom > 1e-5) {\n    cmy = (1. - rgba.rgb - vec3(k)) / denom;\n  }\n  return vec4(cmy, k) * rgba.a;\n}\n\nvec3 applyContrast(vec3 rgb) {\n  return clamp((rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0);\n}\n\n// Single-component CMYK extractors with contrast built-in, alpha-aware\nfloat getCyan(vec4 rgba) {\n  vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0);\n  float maxRGB = max(max(c.r, c.g), c.b);\n  return (maxRGB > 1e-5 ? (maxRGB - c.r) / maxRGB : 0.) * rgba.a;\n}\nfloat getMagenta(vec4 rgba) {\n  vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0);\n  float maxRGB = max(max(c.r, c.g), c.b);\n  return (maxRGB > 1e-5 ? (maxRGB - c.g) / maxRGB : 0.) * rgba.a;\n}\nfloat getYellow(vec4 rgba) {\n  vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0);\n  float maxRGB = max(max(c.r, c.g), c.b);\n  return (maxRGB > 1e-5 ? (maxRGB - c.b) / maxRGB : 0.) * rgba.a;\n}\nfloat getBlack(vec4 rgba) {\n  vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0);\n  return (1. - max(max(c.r, c.g), c.b)) * rgba.a;\n}\n\nvec2 cellCenterPos(vec2 uv, vec2 cellOffset, float channelIdx) {\n  vec2 cellCenter = floor(uv) + .5 + cellOffset;\n  return cellCenter + (randomRG(cellCenter + channelIdx * 50.) - .5) * u_gridNoise;\n}\n\nvec2 gridToImageUV(vec2 cellCenter, float cosA, float sinA, float shift, vec2 pad) {\n  vec2 uvGrid = mat2(cosA, -sinA, sinA, cosA) * (cellCenter - shift);\n  return uvGrid * pad + 0.5;\n}\n\nvoid colorMask(vec2 pos, vec2 cellCenter, float rad, float transparency, float grain, float channelAddon, float channelgain, float generalComp, bool isJoined, inout float outMask) {\n  float dist = length(pos - cellCenter);\n\n  float radius = rad;\n  radius *= (1. + generalComp);\n  radius += (.15 + channelgain * radius);\n  radius = max(0., radius);\n  radius = mix(0., radius, transparency);\n  radius += channelAddon;\n  radius *= (1. - grain);\n\n  float mask = 1. - sst(0., radius, dist);\n  if (isJoined) {\n    // ink or sharp (joined)\n    mask = pow(mask, 1.2);\n  } else {\n    // dots (separate)\n    mask = sst(.5 - .5 * u_softness, .51 + .49 * u_softness, mask);\n  }\n\n  mask *= mix(1., mix(.5, 1., 1.5 * radius), u_softness);\n  outMask += mask;\n}\n\nvec3 applyInk(vec3 paper, vec3 inkColor, float cov) {\n  vec3 inkEffect = mix(vec3(1.0), inkColor, clamp(cov, 0.0, 1.0));\n  return paper * inkEffect;\n}\n\nvoid main() {\n  vec2 uv = v_imageUV;\n\n  float cellsPerSide = mix(400.0, 7.0, pow(u_size, 0.7));\n  float cellSizeY = 1.0 / cellsPerSide;\n  vec2 pad = cellSizeY * vec2(1.0 / u_imageAspectRatio, 1.0);\n  vec2 uvGrid = (uv - .5) / pad;\n  float insideImageBox = getUvFrame(uv, pad);\n\n  float generalComp = .1 * u_softness + .1 * u_gridNoise + .1 * (1. - step(0.5, u_type)) * (1.5 - u_softness);\n\n  vec2 uvC = mat2(cosC, sinC, -sinC, cosC) * uvGrid + shiftC;\n  vec2 uvM = mat2(cosM, sinM, -sinM, cosM) * uvGrid + shiftM;\n  vec2 uvY = mat2(cosY, sinY, -sinY, cosY) * uvGrid + shiftY;\n  vec2 uvK = mat2(cosK, sinK, -sinK, cosK) * uvGrid + shiftK;\n\n  vec2 grainSize = mix(2000., 200., u_grainSize) * vec2(1., 1. / u_imageAspectRatio);\n  vec2 grainUV = (v_imageUV - .5) * grainSize + .5;\n  vec3 noiseValues = valueNoise3(grainUV);\n  float grain = sst(.55, 1., noiseValues.r);\n  grain *= u_grainMixer;\n\n  vec4 outMask = vec4(0.);\n  bool isJoined = u_type > 0.5;\n\n  if (u_type < 1.5) {\n    // dots or ink: per-cell color sampling\n    for (int dy = -1; dy <= 1; dy++) {\n      for (int dx = -1; dx <= 1; dx++) {\n        vec2 cellOffset = vec2(float(dx), float(dy));\n\n        vec2 cellCenterC = cellCenterPos(uvC, cellOffset, 0.);\n        vec4 texC = texture(u_image, gridToImageUV(cellCenterC, cosC, sinC, shiftC, pad));\n        colorMask(uvC, cellCenterC, getCyan(texC), insideImageBox * texC.a, grain, u_floodC, u_gainC, generalComp, isJoined, outMask[0]);\n\n        vec2 cellCenterM = cellCenterPos(uvM, cellOffset, 1.);\n        vec4 texM = texture(u_image, gridToImageUV(cellCenterM, cosM, sinM, shiftM, pad));\n        colorMask(uvM, cellCenterM, getMagenta(texM), insideImageBox * texM.a, grain, u_floodM, u_gainM, generalComp, isJoined, outMask[1]);\n\n        vec2 cellCenterY = cellCenterPos(uvY, cellOffset, 2.);\n        vec4 texY = texture(u_image, gridToImageUV(cellCenterY, cosY, sinY, shiftY, pad));\n        colorMask(uvY, cellCenterY, getYellow(texY), insideImageBox * texY.a, grain, u_floodY, u_gainY, generalComp, isJoined, outMask[2]);\n\n        vec2 cellCenterK = cellCenterPos(uvK, cellOffset, 3.);\n        vec4 texK = texture(u_image, gridToImageUV(cellCenterK, cosK, sinK, shiftK, pad));\n        colorMask(uvK, cellCenterK, getBlack(texK), insideImageBox * texK.a, grain, u_floodK, u_gainK, generalComp, isJoined, outMask[3]);\n      }\n    }\n  } else {\n    // sharp: direct px color sampling\n    vec4 tex = texture(u_image, uv);\n    tex.rgb = applyContrast(tex.rgb);\n    insideImageBox *= tex.a;\n    vec4 cmykOriginal = RGBAtoCMYK(tex);\n    for (int dy = -1; dy <= 1; dy++) {\n      for (int dx = -1; dx <= 1; dx++) {\n        vec2 cellOffset = vec2(float(dx), float(dy));\n\n        colorMask(uvC, cellCenterPos(uvC, cellOffset, 0.), cmykOriginal.x, insideImageBox, grain, u_floodC, u_gainC, generalComp, isJoined, outMask[0]);\n        colorMask(uvM, cellCenterPos(uvM, cellOffset, 1.), cmykOriginal.y, insideImageBox, grain, u_floodM, u_gainM, generalComp, isJoined, outMask[1]);\n        colorMask(uvY, cellCenterPos(uvY, cellOffset, 2.), cmykOriginal.z, insideImageBox, grain, u_floodY, u_gainY, generalComp, isJoined, outMask[2]);\n        colorMask(uvK, cellCenterPos(uvK, cellOffset, 3.), cmykOriginal.w, insideImageBox, grain, u_floodK, u_gainK, generalComp, isJoined, outMask[3]);\n      }\n    }\n  }\n\n  float shape;\n\n  float C = outMask[0];\n  float M = outMask[1];\n  float Y = outMask[2];\n  float K = outMask[3];\n\n  if (isJoined) {\n    // ink or sharp: apply threshold for joined dots\n    float th = .5;\n    float sLeft = th * u_softness;\n    float sRight = (1. - th) * u_softness + .01;\n    C = smoothstep(th - sLeft - fwidth(C), th + sRight, C);\n    M = smoothstep(th - sLeft - fwidth(M), th + sRight, M);\n    Y = smoothstep(th - sLeft - fwidth(Y), th + sRight, Y);\n    K = smoothstep(th - sLeft - fwidth(K), th + sRight, K);\n  }\n\n  C *= u_colorC.a;\n  M *= u_colorM.a;\n  Y *= u_colorY.a;\n  K *= u_colorK.a;\n\n  vec3 ink = vec3(1.);\n  ink = applyInk(ink, u_colorK.rgb, K);\n  ink = applyInk(ink, u_colorC.rgb, C);\n  ink = applyInk(ink, u_colorM.rgb, M);\n  ink = applyInk(ink, u_colorY.rgb, Y);\n\n  shape = clamp(max(max(C, M), max(Y, K)), 0., 1.);\n\n  vec3 color = u_colorBack.rgb * u_colorBack.a;\n\n  float opacity = u_colorBack.a;\n  color = mix(color, ink, shape);\n  opacity += shape;\n  opacity = clamp(opacity, 0., 1.);\n\n  float grainOverlay = mix(noiseValues.g, noiseValues.b, .5);\n  grainOverlay = pow(grainOverlay, 1.3);\n\n  float grainOverlayV = grainOverlay * 2. - 1.;\n  vec3 grainOverlayColor = vec3(step(0., grainOverlayV));\n  float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV);\n  grainOverlayStrength = pow(grainOverlayStrength, .8);\n  color = mix(color, grainOverlayColor, .5 * grainOverlayStrength);\n\n  opacity += .5 * grainOverlayStrength;\n  opacity = clamp(opacity, 0., 1.);\n\n  fragColor = vec4(color, opacity);\n}\n`;\n\nexport interface HalftoneCmykUniforms extends ShaderSizingUniforms {\n  u_image: HTMLImageElement | string | undefined;\n  u_noiseTexture?: HTMLImageElement;\n  u_colorBack: [number, number, number, number];\n  u_colorC: [number, number, number, number];\n  u_colorM: [number, number, number, number];\n  u_colorY: [number, number, number, number];\n  u_colorK: [number, number, number, number];\n  u_size: number;\n  u_contrast: number;\n  u_softness: number;\n  u_grainSize: number;\n  u_grainMixer: number;\n  u_grainOverlay: number;\n  u_gridNoise: number;\n  u_floodC: number;\n  u_floodM: number;\n  u_floodY: number;\n  u_floodK: number;\n  u_gainC: number;\n  u_gainM: number;\n  u_gainY: number;\n  u_gainK: number;\n  u_type: (typeof HalftoneCmykTypes)[HalftoneCmykType];\n}\n\nexport interface HalftoneCmykParams extends ShaderSizingParams, ShaderMotionParams {\n  image?: HTMLImageElement | string;\n  colorBack?: string;\n  colorC?: string;\n  colorM?: string;\n  colorY?: string;\n  colorK?: string;\n  size?: number;\n  contrast?: number;\n  softness?: number;\n  grainSize?: number;\n  grainMixer?: number;\n  grainOverlay?: number;\n  gridNoise?: number;\n  floodC?: number;\n  floodM?: number;\n  floodY?: number;\n  floodK?: number;\n  gainC?: number;\n  gainM?: number;\n  gainY?: number;\n  gainK?: number;\n  type?: HalftoneCmykType;\n}\n\nexport const HalftoneCmykTypes = {\n  dots: 0,\n  ink: 1,\n  sharp: 2,\n} as const;\n\nexport type HalftoneCmykType = keyof typeof HalftoneCmykTypes;\n\n"],
-  "mappings": ";;;;;AACA,eAAmE;AACnE,SAAS,iBAAiB;AAmDnB,MAAM,6BAAqC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA4C/C,SAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA2RN,MAAM,oBAAoB;AAAA,EAC/B,MAAM;AAAA,EACN,KAAK;AAAA,EACL,OAAO;AACT;",
+  "sourcesContent": ["import type { ShaderMotionParams } from '../shader-mount.js';\nimport { type ShaderSizingParams, type ShaderSizingUniforms } from '../shader-sizing.js';\nimport { declarePI } from '../shader-utils.js';\n\n/**\n * CMYK halftone printing effect applied to images with customizable dot patterns\n * and ink colors for each channel (Cyan, Magenta, Yellow, Black).\n *\n * Fragment shader uniforms:\n * - u_image (sampler2D): Source image texture\n * - u_imageAspectRatio (float): Aspect ratio of the source image\n * - u_colorBack (vec4): Background (paper) color in RGBA\n * - u_colorC (vec4): Cyan ink color in RGBA\n * - u_colorM (vec4): Magenta ink color in RGBA\n * - u_colorY (vec4): Yellow ink color in RGBA\n * - u_colorK (vec4): Black ink color in RGBA\n * - u_size (float): Halftone cell size (0 to 1)\n * - u_contrast (float): Image contrast adjustment (0 to 2)\n * - u_softness (float): Edge softness of dots (0 to 1)\n * - u_grainSize (float): Size of grain texture, applied to both grain and overlay, needs grainMixer or grainOverlay > 0 (0 to 1)\n * - u_grainMixer (float): Strength of grain affecting dot size (0 to 1)\n * - u_grainOverlay (float): Strength of grain overlay on final output (0 to 1)\n * - u_gridNoise (float): Strength of smooth noise applied to both dot positions and color sampling, positions only with sharp type (0 to 1)\n * - u_floodC (float): Flat cyan dot size adjustment applied uniformly, needs colorC alpha > 0 (0 to 1)\n * - u_floodM (float): Flat magenta dot size adjustment applied uniformly, needs colorM alpha > 0 (0 to 1)\n * - u_floodY (float): Flat yellow dot size adjustment applied uniformly, needs colorY alpha > 0 (0 to 1)\n * - u_floodK (float): Flat black dot size adjustment applied uniformly, needs colorK alpha > 0 (0 to 1)\n * - u_gainC (float): Proportional cyan dot size gain, needs colorC alpha > 0 (enhances existing dots, -1 to 1)\n * - u_gainM (float): Proportional magenta dot size gain, needs colorM alpha > 0 (enhances existing dots, -1 to 1)\n * - u_gainY (float): Proportional yellow dot size gain, needs colorY alpha > 0 (enhances existing dots, -1 to 1)\n * - u_gainK (float): Proportional black dot size gain, needs colorK alpha > 0 (enhances existing dots, -1 to 1)\n * - u_type (float): Dot shape style (0 = dots, 1 = ink, 2 = sharp)\n * - u_noiseTexture (sampler2D): Pre-computed randomizer source texture\n *\n * Vertex shader outputs (used in fragment shader):\n * - v_imageUV (vec2): UV coordinates for sampling the source image, with fit, scale, rotation, and offset applied\n *\n * Vertex shader uniforms:\n * - u_resolution (vec2): Canvas resolution in pixels\n * - u_pixelRatio (float): Device pixel ratio\n * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)\n * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)\n * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)\n * - u_scale (float): Overall zoom level of the graphics (0.1 to 4)\n * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)\n * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)\n * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)\n * - u_imageAspectRatio (float): Aspect ratio of the source image\n *\n */\n\n// language=GLSL\nexport const halftoneCmykFragmentShader: string = `#version 300 es\nprecision mediump float;\n\nuniform sampler2D u_image;\nuniform float u_imageAspectRatio;\n\nuniform vec4 u_colorBack;\nuniform vec4 u_colorC;\nuniform vec4 u_colorM;\nuniform vec4 u_colorY;\nuniform vec4 u_colorK;\nuniform float u_size;\nuniform float u_contrast;\nuniform float u_grainSize;\nuniform float u_grainMixer;\nuniform float u_grainOverlay;\nuniform float u_gridNoise;\nuniform float u_softness;\nuniform float u_floodC;\nuniform float u_floodM;\nuniform float u_floodY;\nuniform float u_floodK;\nuniform float u_gainC;\nuniform float u_gainM;\nuniform float u_gainY;\nuniform float u_gainK;\nuniform float u_type;\nuniform sampler2D u_noiseTexture;\n\nin vec2 v_imageUV;\nout vec4 fragColor;\n\nconst float shiftC = -.5;\nconst float shiftM = -.25;\nconst float shiftY = .2;\nconst float shiftK = 0.;\n\n// Precomputed sin/cos for rotation angles (15\u00B0, 75\u00B0, 0\u00B0, 45\u00B0)\nconst float cosC = 0.9659258;  const float sinC = 0.2588190;   // 15\u00B0\nconst float cosM = 0.2588190;  const float sinM = 0.9659258;   // 75\u00B0\nconst float cosY = 1.0;        const float sinY = 0.0;         // 0\u00B0\nconst float cosK = 0.7071068;  const float sinK = 0.7071068;   // 45\u00B0\n\n${ declarePI }\n\nvec2 randomRG(vec2 p) {\n  vec2 uv = floor(p) / 100. + .5;\n  return texture(u_noiseTexture, fract(uv)).rg;\n}\nvec3 hash23(vec2 p) {\n  vec3 p3 = fract(vec3(p.xyx) * vec3(0.3183099, 0.3678794, 0.3141592)) + 0.1;\n  p3 += dot(p3, p3.yzx + 19.19);\n  return fract(vec3(p3.x * p3.y, p3.y * p3.z, p3.z * p3.x));\n}\n\nfloat sst(float edge0, float edge1, float x) {\n  return smoothstep(edge0, edge1, x);\n}\n\nvec3 valueNoise3(vec2 st) {\n  vec2 i = floor(st);\n  vec2 f = fract(st);\n  vec3 a = hash23(i);\n  vec3 b = hash23(i + vec2(1.0, 0.0));\n  vec3 c = hash23(i + vec2(0.0, 1.0));\n  vec3 d = hash23(i + vec2(1.0, 1.0));\n  vec2 u = f * f * (3.0 - 2.0 * f);\n  vec3 x1 = mix(a, b, u.x);\n  vec3 x2 = mix(c, d, u.x);\n  return mix(x1, x2, u.y);\n}\n\nfloat getUvFrame(vec2 uv, vec2 pad) {\n  float left   = smoothstep(-pad.x, 0., uv.x);\n  float right  = smoothstep(1. + pad.x, 1., uv.x);\n  float bottom = smoothstep(-pad.y, 0., uv.y);\n  float top    = smoothstep(1. + pad.y, 1., uv.y);\n\n  return left * right * bottom * top;\n}\n\nvec4 RGBAtoCMYK(vec4 rgba) {\n  float k = 1. - max(max(rgba.r, rgba.g), rgba.b);\n  float denom = 1. - k;\n  vec3 cmy = vec3(0.);\n  if (denom > 1e-5) {\n    cmy = (1. - rgba.rgb - vec3(k)) / denom;\n  }\n  return vec4(cmy, k) * rgba.a;\n}\n\nvec3 applyContrast(vec3 rgb) {\n  return clamp((rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0);\n}\n\n// Single-component CMYK extractors with contrast built-in, alpha-aware\nfloat getCyan(vec4 rgba) {\n  vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0);\n  float maxRGB = max(max(c.r, c.g), c.b);\n  return (maxRGB > 1e-5 ? (maxRGB - c.r) / maxRGB : 0.) * rgba.a;\n}\nfloat getMagenta(vec4 rgba) {\n  vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0);\n  float maxRGB = max(max(c.r, c.g), c.b);\n  return (maxRGB > 1e-5 ? (maxRGB - c.g) / maxRGB : 0.) * rgba.a;\n}\nfloat getYellow(vec4 rgba) {\n  vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0);\n  float maxRGB = max(max(c.r, c.g), c.b);\n  return (maxRGB > 1e-5 ? (maxRGB - c.b) / maxRGB : 0.) * rgba.a;\n}\nfloat getBlack(vec4 rgba) {\n  vec3 c = clamp((rgba.rgb - 0.5) * u_contrast + 0.5, 0.0, 1.0);\n  return (1. - max(max(c.r, c.g), c.b)) * rgba.a;\n}\n\nvec2 cellCenterPos(vec2 uv, vec2 cellOffset, float channelIdx) {\n  vec2 cellCenter = floor(uv) + .5 + cellOffset;\n  return cellCenter + (randomRG(cellCenter + channelIdx * 50.) - .5) * u_gridNoise;\n}\n\nvec2 gridToImageUV(vec2 cellCenter, float cosA, float sinA, float shift, vec2 pad) {\n  vec2 uvGrid = mat2(cosA, -sinA, sinA, cosA) * (cellCenter - shift);\n  return uvGrid * pad + 0.5;\n}\n\nvoid colorMask(vec2 pos, vec2 cellCenter, float rad, float transparency, float grain, float channelAddon, float channelgain, float generalComp, bool isJoined, inout float outMask) {\n  float dist = length(pos - cellCenter);\n\n  float radius = rad;\n  radius *= (1. + generalComp);\n  radius += (.15 + channelgain * radius);\n  radius = max(0., radius);\n  radius = mix(0., radius, transparency);\n  radius += channelAddon;\n  radius *= (1. - grain);\n\n  float mask = 1. - sst(0., radius, dist);\n  if (isJoined) {\n    // ink or sharp (joined)\n    mask = pow(mask, 1.2);\n  } else {\n    // dots (separate)\n    mask = sst(.5 - .5 * u_softness, .51 + .49 * u_softness, mask);\n  }\n\n  mask *= mix(1., mix(.5, 1., 1.5 * radius), u_softness);\n  outMask += mask;\n}\n\nvec3 applyInk(vec3 paper, vec3 inkColor, float cov) {\n  vec3 inkEffect = mix(vec3(1.0), inkColor, clamp(cov, 0.0, 1.0));\n  return paper * inkEffect;\n}\n\nvoid main() {\n  vec2 uv = v_imageUV;\n\n  float cellsPerSide = mix(400.0, 7.0, pow(u_size, 0.7));\n  float cellSizeY = 1.0 / cellsPerSide;\n  vec2 pad = cellSizeY * vec2(1.0 / u_imageAspectRatio, 1.0);\n  vec2 uvGrid = (uv - .5) / pad;\n  float insideImageBox = getUvFrame(uv, pad);\n\n  float generalComp = .1 * u_softness + .1 * u_gridNoise + .1 * (1. - step(0.5, u_type)) * (1.5 - u_softness);\n\n  vec2 uvC = mat2(cosC, sinC, -sinC, cosC) * uvGrid + shiftC;\n  vec2 uvM = mat2(cosM, sinM, -sinM, cosM) * uvGrid + shiftM;\n  vec2 uvY = mat2(cosY, sinY, -sinY, cosY) * uvGrid + shiftY;\n  vec2 uvK = mat2(cosK, sinK, -sinK, cosK) * uvGrid + shiftK;\n\n  vec2 grainSize = mix(2000., 200., u_grainSize) * vec2(1., 1. / u_imageAspectRatio);\n  vec2 grainUV = (v_imageUV - .5) * grainSize + .5;\n  // shared by the grain mixer and the grain overlay, skip it when neither is on\n  vec3 noiseValues = vec3(0.);\n  if (u_grainMixer > 0. || u_grainOverlay > 0.) {\n    noiseValues = valueNoise3(grainUV);\n  }\n  float grain = sst(.55, 1., noiseValues.r);\n  grain *= u_grainMixer;\n\n  vec4 outMask = vec4(0.);\n  bool isJoined = u_type > 0.5;\n\n  if (u_type < 1.5) {\n    // dots or ink: per-cell color sampling\n    for (int dy = -1; dy <= 1; dy++) {\n      for (int dx = -1; dx <= 1; dx++) {\n        vec2 cellOffset = vec2(float(dx), float(dy));\n\n        vec2 cellCenterC = cellCenterPos(uvC, cellOffset, 0.);\n        vec4 texC = texture(u_image, gridToImageUV(cellCenterC, cosC, sinC, shiftC, pad));\n        colorMask(uvC, cellCenterC, getCyan(texC), insideImageBox * texC.a, grain, u_floodC, u_gainC, generalComp, isJoined, outMask[0]);\n\n        vec2 cellCenterM = cellCenterPos(uvM, cellOffset, 1.);\n        vec4 texM = texture(u_image, gridToImageUV(cellCenterM, cosM, sinM, shiftM, pad));\n        colorMask(uvM, cellCenterM, getMagenta(texM), insideImageBox * texM.a, grain, u_floodM, u_gainM, generalComp, isJoined, outMask[1]);\n\n        vec2 cellCenterY = cellCenterPos(uvY, cellOffset, 2.);\n        vec4 texY = texture(u_image, gridToImageUV(cellCenterY, cosY, sinY, shiftY, pad));\n        colorMask(uvY, cellCenterY, getYellow(texY), insideImageBox * texY.a, grain, u_floodY, u_gainY, generalComp, isJoined, outMask[2]);\n\n        vec2 cellCenterK = cellCenterPos(uvK, cellOffset, 3.);\n        vec4 texK = texture(u_image, gridToImageUV(cellCenterK, cosK, sinK, shiftK, pad));\n        colorMask(uvK, cellCenterK, getBlack(texK), insideImageBox * texK.a, grain, u_floodK, u_gainK, generalComp, isJoined, outMask[3]);\n      }\n    }\n  } else {\n    // sharp: direct px color sampling\n    vec4 tex = texture(u_image, uv);\n    tex.rgb = applyContrast(tex.rgb);\n    insideImageBox *= tex.a;\n    vec4 cmykOriginal = RGBAtoCMYK(tex);\n    for (int dy = -1; dy <= 1; dy++) {\n      for (int dx = -1; dx <= 1; dx++) {\n        vec2 cellOffset = vec2(float(dx), float(dy));\n\n        colorMask(uvC, cellCenterPos(uvC, cellOffset, 0.), cmykOriginal.x, insideImageBox, grain, u_floodC, u_gainC, generalComp, isJoined, outMask[0]);\n        colorMask(uvM, cellCenterPos(uvM, cellOffset, 1.), cmykOriginal.y, insideImageBox, grain, u_floodM, u_gainM, generalComp, isJoined, outMask[1]);\n        colorMask(uvY, cellCenterPos(uvY, cellOffset, 2.), cmykOriginal.z, insideImageBox, grain, u_floodY, u_gainY, generalComp, isJoined, outMask[2]);\n        colorMask(uvK, cellCenterPos(uvK, cellOffset, 3.), cmykOriginal.w, insideImageBox, grain, u_floodK, u_gainK, generalComp, isJoined, outMask[3]);\n      }\n    }\n  }\n\n  float shape;\n\n  float C = outMask[0];\n  float M = outMask[1];\n  float Y = outMask[2];\n  float K = outMask[3];\n\n  if (isJoined) {\n    // ink or sharp: apply threshold for joined dots\n    float th = .5;\n    float sLeft = th * u_softness;\n    float sRight = (1. - th) * u_softness + .01;\n    C = smoothstep(th - sLeft - fwidth(C), th + sRight, C);\n    M = smoothstep(th - sLeft - fwidth(M), th + sRight, M);\n    Y = smoothstep(th - sLeft - fwidth(Y), th + sRight, Y);\n    K = smoothstep(th - sLeft - fwidth(K), th + sRight, K);\n  }\n\n  C *= u_colorC.a;\n  M *= u_colorM.a;\n  Y *= u_colorY.a;\n  K *= u_colorK.a;\n\n  vec3 ink = vec3(1.);\n  ink = applyInk(ink, u_colorK.rgb, K);\n  ink = applyInk(ink, u_colorC.rgb, C);\n  ink = applyInk(ink, u_colorM.rgb, M);\n  ink = applyInk(ink, u_colorY.rgb, Y);\n\n  shape = clamp(max(max(C, M), max(Y, K)), 0., 1.);\n\n  vec3 color = u_colorBack.rgb * u_colorBack.a;\n\n  float opacity = u_colorBack.a;\n  color = mix(color, ink, shape);\n  opacity += shape;\n  opacity = clamp(opacity, 0., 1.);\n\n  float grainOverlay = mix(noiseValues.g, noiseValues.b, .5);\n  grainOverlay = pow(grainOverlay, 1.3);\n\n  float grainOverlayV = grainOverlay * 2. - 1.;\n  vec3 grainOverlayColor = vec3(step(0., grainOverlayV));\n  float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV);\n  grainOverlayStrength = pow(grainOverlayStrength, .8);\n  color = mix(color, grainOverlayColor, .5 * grainOverlayStrength);\n\n  opacity += .5 * grainOverlayStrength;\n  opacity = clamp(opacity, 0., 1.);\n\n  fragColor = vec4(color, opacity);\n}\n`;\n\nexport interface HalftoneCmykUniforms extends ShaderSizingUniforms {\n  u_image: HTMLImageElement | string | undefined;\n  u_noiseTexture?: HTMLImageElement;\n  u_colorBack: [number, number, number, number];\n  u_colorC: [number, number, number, number];\n  u_colorM: [number, number, number, number];\n  u_colorY: [number, number, number, number];\n  u_colorK: [number, number, number, number];\n  u_size: number;\n  u_contrast: number;\n  u_softness: number;\n  u_grainSize: number;\n  u_grainMixer: number;\n  u_grainOverlay: number;\n  u_gridNoise: number;\n  u_floodC: number;\n  u_floodM: number;\n  u_floodY: number;\n  u_floodK: number;\n  u_gainC: number;\n  u_gainM: number;\n  u_gainY: number;\n  u_gainK: number;\n  u_type: (typeof HalftoneCmykTypes)[HalftoneCmykType];\n}\n\nexport interface HalftoneCmykParams extends ShaderSizingParams, ShaderMotionParams {\n  image?: HTMLImageElement | string;\n  colorBack?: string;\n  colorC?: string;\n  colorM?: string;\n  colorY?: string;\n  colorK?: string;\n  size?: number;\n  contrast?: number;\n  softness?: number;\n  grainSize?: number;\n  grainMixer?: number;\n  grainOverlay?: number;\n  gridNoise?: number;\n  floodC?: number;\n  floodM?: number;\n  floodY?: number;\n  floodK?: number;\n  gainC?: number;\n  gainM?: number;\n  gainY?: number;\n  gainK?: number;\n  type?: HalftoneCmykType;\n}\n\nexport const HalftoneCmykTypes = {\n  dots: 0,\n  ink: 1,\n  sharp: 2,\n} as const;\n\nexport type HalftoneCmykType = keyof typeof HalftoneCmykTypes;\n\n"],
+  "mappings": ";;;;;AACA,eAAmE;AACnE,SAAS,iBAAiB;AAkDnB,MAAM,6BAAqC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA2C/C,SAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA+RN,MAAM,oBAAoB;AAAA,EAC/B,MAAM;AAAA,EACN,KAAK;AAAA,EACL,OAAO;AACT;",
   "names": []
 }

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

@@ -4,22 +4,20 @@ import { type ShaderSizingParams, type ShaderSizingUniforms } from '../shader-si
  * A halftone-dot image filter featuring customizable grids, color palettes, and dot styles.
  *
  * Fragment shader uniforms:
- * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)
- * - u_time (float): Animation time
  * - u_image (sampler2D): Source image texture
  * - u_imageAspectRatio (float): Aspect ratio of the source image
- * - u_colorFront (vec4): Foreground color in RGBA
+ * - u_colorFront (vec4): Foreground color in RGBA, needs originalColors off
  * - u_colorBack (vec4): Background color in RGBA
  * - u_originalColors (bool): Use sampled image's original colors instead of colorFront
  * - u_type (float): Dot style (0 = classic, 1 = gooey, 2 = holes, 3 = soft)
- * - u_inverted (bool): Inverts the image luminance, doesn't affect the color scheme; not effective at zero contrast
+ * - u_inverted (bool): Inverts the image luminance, doesn't affect the color scheme, needs contrast > 0
  * - u_grid (float): Grid type (0 = square, 1 = hex)
  * - u_size (float): Grid size relative to the image box (0 to 1)
  * - u_radius (float): Maximum dot size relative to grid cell (0 to 2)
- * - u_contrast (float): Contrast applied to the sampled image (0 to 1)
+ * - u_contrast (float): Contrast applied to the sampled image, at 0 the luminance is flat so all the dots get equal size (0 to 1)
  * - u_grainMixer (float): Strength of grain distortion applied to shape edges (0 to 1)
  * - u_grainOverlay (float): Post-processing black/white grain overlay (0 to 1)
- * - u_grainSize (float): Scale applied to both grain distortion and grain overlay (0 to 1)
+ * - u_grainSize (float): Scale applied to both grain distortion and grain overlay, needs grainMixer or grainOverlay > 0 (0 to 1)
  *
  * Vertex shader outputs (used in fragment shader):
  * - v_imageUV (vec2): Image UV coordinates with global sizing (rotation, scale, offset, etc) applied
@@ -30,7 +28,7 @@ import { type ShaderSizingParams, type ShaderSizingUniforms } from '../shader-si
  * - u_originX (float): Reference point for positioning world width in the canvas (0 to 1)
  * - u_originY (float): Reference point for positioning world height in the canvas (0 to 1)
  * - u_fit (float): How to fit the rendered shader into the canvas dimensions (0 = none, 1 = contain, 2 = cover)
- * - u_scale (float): Overall zoom level of the graphics (0.01 to 4)
+ * - u_scale (float): Overall zoom level of the graphics (0.1 to 4)
  * - u_rotation (float): Overall rotation angle of the graphics in degrees (0 to 360)
  * - u_offsetX (float): Horizontal offset of the graphics center (-1 to 1)
  * - u_offsetY (float): Vertical offset of the graphics center (-1 to 1)

package/dist/shaders/halftone-dots.js

@@ -8,10 +8,6 @@ import { declarePI, rotation2, proceduralHash21 } from "../shader-utils.js";
 const halftoneDotsFragmentShader = `#version 300 es
 precision mediump float;
 
-uniform float u_rotation;
-
-uniform float u_time;
-
 uniform vec4 u_colorFront;
 uniform vec4 u_colorBack;
 uniform float u_radius;
@@ -260,10 +256,12 @@ void main() {
   vec2 grainUV = v_imageUV - .5;
   grainUV *= grainSize;
   grainUV += .5;
-  float grain = valueNoise(grainUV);
-  grain = smoothstep(.55, .7 + .2 * u_grainMixer, grain);
-  grain *= u_grainMixer;
-  finalShape = mix(finalShape, 0., grain);
+  if (u_grainMixer > 0.) {
+    float grain = valueNoise(grainUV);
+    grain = smoothstep(.55, .7 + .2 * u_grainMixer, grain);
+    grain *= u_grainMixer;
+    finalShape = mix(finalShape, 0., grain);
+  }
 
   vec3 color = vec3(0.);
   float opacity = 0.;
@@ -287,17 +285,19 @@ void main() {
     opacity += bgOpacity * (1. - opacity);
   }
 
-  float grainOverlay = valueNoise(rotate(grainUV, 1.) + vec2(3.));
-  grainOverlay = mix(grainOverlay, valueNoise(rotate(grainUV, 2.) + vec2(-1.)), .5);
-  grainOverlay = pow(grainOverlay, 1.3);
+  if (u_grainOverlay > 0.) {
+    float grainOverlay = valueNoise(rotate(grainUV, 1.) + vec2(3.));
+    grainOverlay = mix(grainOverlay, valueNoise(rotate(grainUV, 2.) + vec2(-1.)), .5);
+    grainOverlay = pow(grainOverlay, 1.3);
 
-  float grainOverlayV = grainOverlay * 2. - 1.;
-  vec3 grainOverlayColor = vec3(step(0., grainOverlayV));
-  float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV);
-  grainOverlayStrength = pow(grainOverlayStrength, .8);
-  color = mix(color, grainOverlayColor, .5 * grainOverlayStrength);
+    float grainOverlayV = grainOverlay * 2. - 1.;
+    vec3 grainOverlayColor = vec3(step(0., grainOverlayV));
+    float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV);
+    grainOverlayStrength = pow(grainOverlayStrength, .8);
+    color = mix(color, grainOverlayColor, .5 * grainOverlayStrength);
 
-  opacity += .5 * grainOverlayStrength;
+    opacity += .5 * grainOverlayStrength;
+  }
   opacity = clamp(opacity, 0., 1.);
 
   fragColor = vec4(color, opacity);