@flikk/ui 1.0.0-beta.31 → 1.0.0-beta.32

package/dist/components/effects/FlutedGlass/FlutedGlass.js

@@ -1,80 +0,0 @@
-"use client";
-import { jsx } from 'react/jsx-runtime';
-import { useState, useMemo, useRef, useCallback } from 'react';
-import { useIsClient } from '../../../hooks/useIsClient.js';
-import 'motion/react';
-import { useDarkMode } from '../../../hooks/useDarkMode.js';
-import { cn } from '../../../utils/cn.js';
-import { ShaderCanvas } from '../shared/ShaderCanvas/ShaderCanvas.js';
-import { resolveShaderColor } from '../shared/resolveShaderColor.js';
-import { flutedGlassFragmentShader } from './FlutedGlass.shaders.js';
-import { FLUTED_GLASS_SHAPES, FLUTED_GLASS_DISTORTION_SHAPES } from './FlutedGlass.types.js';
-
-const DEFAULT_COLOR_BACK = "var(--color-surface-sunken)";
-const DEFAULT_COLOR_SHADOW = "var(--color-text-primary)";
-const DEFAULT_COLOR_HIGHLIGHT = "var(--color-background)";
-function useWebgl2Supported() {
-    return useMemo(() => {
-        if (typeof document === "undefined")
-            return false;
-        try {
-            return !!document.createElement("canvas").getContext("webgl2");
-        }
-        catch (_a) {
-            return false;
-        }
-    }, []);
-}
-/**
- * Fluted-glass image filter — refracts a source image through a directional
- * ribbed-glass grid with per-ridge highlights/shadows and a real Gaussian
- * blur. WebGL2-powered; falls back to the plain source image (via
- * `object-fit: cover`) when WebGL2 is unavailable.
- */
-const FlutedGlass = ({ image, colorBack = DEFAULT_COLOR_BACK, colorShadow = DEFAULT_COLOR_SHADOW, colorHighlight = DEFAULT_COLOR_HIGHLIGHT, shape = "lines", distortionShape = "lens", size = 0.5, angle = 0, distortion = 0.5, shift = 0, blur = 0.2, edges = 0.3, shadows = 0.4, highlights = 0.5, stretch = 0, margin = 0, marginLeft, marginRight, marginTop, marginBottom, grainMixer = 0, grainOverlay = 0, className, style, ...props }) => {
-    const isClient = useIsClient();
-    const isDark = useDarkMode();
-    const webglSupported = useWebgl2Supported();
-    const [imageAspectRatio, setImageAspectRatio] = useState(16 / 9);
-    const resolvedBack = useMemo(() => resolveShaderColor(colorBack), 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [colorBack, isDark]);
-    const resolvedShadow = useMemo(() => resolveShaderColor(colorShadow), 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [colorShadow, isDark]);
-    const resolvedHighlight = useMemo(() => resolveShaderColor(colorHighlight), 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [colorHighlight, isDark]);
-    const texturesRef = useRef({ u_image: image });
-    texturesRef.current.u_image = image;
-    const handleTextureLoad = useCallback((name, aspectRatio) => {
-        if (name === "u_image")
-            setImageAspectRatio(aspectRatio);
-    }, []);
-    const uniformsRef = useRef({});
-    uniformsRef.current.u_colorBack = resolvedBack;
-    uniformsRef.current.u_colorShadow = resolvedShadow;
-    uniformsRef.current.u_colorHighlight = resolvedHighlight;
-    uniformsRef.current.u_imageAspectRatio = imageAspectRatio;
-    uniformsRef.current.u_shape = FLUTED_GLASS_SHAPES[shape];
-    uniformsRef.current.u_distortionShape = FLUTED_GLASS_DISTORTION_SHAPES[distortionShape];
-    uniformsRef.current.u_size = size;
-    uniformsRef.current.u_angle = angle;
-    uniformsRef.current.u_distortion = distortion;
-    uniformsRef.current.u_shift = shift;
-    uniformsRef.current.u_blur = blur;
-    uniformsRef.current.u_edges = edges;
-    uniformsRef.current.u_shadows = shadows;
-    uniformsRef.current.u_highlights = highlights;
-    uniformsRef.current.u_stretch = stretch;
-    uniformsRef.current.u_marginLeft = marginLeft !== null && marginLeft !== void 0 ? marginLeft : margin;
-    uniformsRef.current.u_marginRight = marginRight !== null && marginRight !== void 0 ? marginRight : margin;
-    uniformsRef.current.u_marginTop = marginTop !== null && marginTop !== void 0 ? marginTop : margin;
-    uniformsRef.current.u_marginBottom = marginBottom !== null && marginBottom !== void 0 ? marginBottom : margin;
-    uniformsRef.current.u_grainMixer = grainMixer;
-    uniformsRef.current.u_grainOverlay = grainOverlay;
-    const imageSrc = typeof image === "string" ? image : image.src;
-    return (jsx("div", { className: cn("absolute inset-0 overflow-hidden pointer-events-none select-none", className), style: style, "aria-hidden": "true", ...props, children: isClient && webglSupported ? (jsx(ShaderCanvas, { fragmentShader: flutedGlassFragmentShader, uniformsRef: uniformsRef, texturesRef: texturesRef, onTextureLoad: handleTextureLoad })) : (jsx("img", { src: imageSrc, alt: "", className: "absolute inset-0 w-full h-full object-cover" })) }));
-};
-
-export { FlutedGlass };

package/dist/components/effects/FlutedGlass/FlutedGlass.shaders.d.ts

@@ -1,12 +0,0 @@
-/**
- * FlutedGlass fragment shader — adapted from paper-design/shaders'
- * `fluted-glass.ts` (https://github.com/paper-design/shaders, Apache
- * License 2.0). An image filter: refracts a source image through a
- * directional fluted/ribbed glass grid, with a real per-pixel Gaussian blur.
- *
- * Simplified from the original: image UV computed via the shared
- * `getImageCoverUV` cover-fit helper (see shared/imageUV.glsl.ts) instead of
- * paper-design's ShaderSizingParams fit engine; pure-hash GLSL instead of
- * pre-generated noise-texture sampling.
- */
-export declare const flutedGlassFragmentShader = "#version 300 es\nprecision mediump float;\n\nuniform vec2 iResolution;\n\nuniform vec4 u_colorBack;\nuniform vec4 u_colorShadow;\nuniform vec4 u_colorHighlight;\n\nuniform sampler2D u_image;\nuniform float u_imageAspectRatio;\n\nuniform float u_size;\nuniform float u_shadows;\nuniform float u_angle;\nuniform float u_stretch;\nuniform float u_shape;\nuniform float u_distortion;\nuniform float u_highlights;\nuniform float u_distortionShape;\nuniform float u_shift;\nuniform float u_blur;\nuniform float u_edges;\nuniform float u_marginLeft;\nuniform float u_marginRight;\nuniform float u_marginTop;\nuniform float u_marginBottom;\nuniform float u_grainMixer;\nuniform float u_grainOverlay;\n\nout vec4 fragColor;\n\n\nconst float PI = 3.14159265359;\nconst float TWO_PI = 6.28318530718;\n\n\nvec2 rotate(vec2 v, float angle) {\n  float s = sin(angle);\n  float c = cos(angle);\n  return mat2(c, -s, s, c) * v;\n}\n\n\nfloat randomR(vec2 st) {\n  return fract(sin(dot(st, vec2(12.9898, 78.233))) * 43758.5453123);\n}\n\n\nvec2 getImageCoverUV(vec2 fragUV, vec2 resolution, float imageAspectRatio) {\n  float containerAspect = resolution.x / resolution.y;\n  // Container wider (relative to its height) than the image: sample a\n  // narrower vertical slice of the image (crop top/bottom) so it fills the\n  // container width with no letterboxing. Container narrower/taller than\n  // the image: sample a narrower horizontal slice (crop left/right) instead.\n  vec2 scale = containerAspect > imageAspectRatio\n    ? vec2(1.0, imageAspectRatio / containerAspect)\n    : vec2(containerAspect / imageAspectRatio, 1.0);\n  return (fragUV - 0.5) * scale + 0.5;\n}\n\n\nfloat hash21(vec2 p) {\n  return randomR(p);\n}\n\nfloat valueNoise(vec2 st) {\n  vec2 i = floor(st);\n  vec2 f = fract(st);\n  float a = hash21(i);\n  float b = hash21(i + vec2(1.0, 0.0));\n  float c = hash21(i + vec2(0.0, 1.0));\n  float d = hash21(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\nfloat getUvFrame(vec2 uv, float softness) {\n  float aax = 2. * fwidth(uv.x);\n  float aay = 2. * fwidth(uv.y);\n  float left = smoothstep(0., aax + softness, uv.x);\n  float right = 1. - smoothstep(1. - softness - aax, 1., uv.x);\n  float bottom = smoothstep(0., aay + softness, uv.y);\n  float top = 1. - smoothstep(1. - softness - aay, 1., uv.y);\n  return left * right * bottom * top;\n}\n\nconst int MAX_RADIUS = 50;\nvec4 samplePremultiplied(sampler2D tex, vec2 uv) {\n  vec4 c = texture(tex, uv);\n  c.rgb *= c.a;\n  return c;\n}\n\nvec4 getBlur(sampler2D tex, vec2 uv, vec2 texelSize, vec2 dir, float sigma) {\n  if (sigma <= .5) return texture(tex, uv);\n  int radius = int(min(float(MAX_RADIUS), ceil(3.0 * sigma)));\n\n  float twoSigma2 = 2.0 * sigma * sigma;\n  float gaussianNorm = 1.0 / sqrt(TWO_PI * sigma * sigma);\n\n  vec4 sum = samplePremultiplied(tex, uv) * gaussianNorm;\n  float weightSum = gaussianNorm;\n\n  for (int i = 1; i <= MAX_RADIUS; i++) {\n    if (i > radius) break;\n\n    float x = float(i);\n    float w = exp(-(x * x) / twoSigma2) * gaussianNorm;\n\n    vec2 offset = dir * texelSize * x;\n    vec4 s1 = samplePremultiplied(tex, uv + offset);\n    vec4 s2 = samplePremultiplied(tex, uv - offset);\n\n    sum += (s1 + s2) * w;\n    weightSum += 2.0 * w;\n  }\n\n  vec4 result = sum / weightSum;\n  if (result.a > 0.) {\n    result.rgb /= result.a;\n  }\n\n  return result;\n}\n\nvec2 rotateAspect(vec2 p, float a, float aspect) {\n  p.x *= aspect;\n  p = rotate(p, a);\n  p.x /= aspect;\n  return p;\n}\n\nfloat smoothFract(float x) {\n  float f = fract(x);\n  float w = fwidth(x);\n  float edge = abs(f - 0.5) - 0.5;\n  float band = smoothstep(-w, w, edge);\n  return mix(f, 1.0 - f, band);\n}\n\nvoid main() {\n  float patternRotation = -u_angle * PI / 180.;\n  float patternSize = mix(200., 5., u_size);\n\n  vec2 fragUV = gl_FragCoord.xy / iResolution.xy;\n  vec2 imageUV0 = getImageCoverUV(fragUV, iResolution, u_imageAspectRatio);\n  vec2 uv = imageUV0;\n\n  vec2 uvMask = fragUV;\n  vec2 sw = vec2(.005);\n  vec4 margins = vec4(u_marginLeft, u_marginTop, u_marginRight, u_marginBottom);\n  float mask =\n    smoothstep(margins[0], margins[0] + sw.x, uvMask.x + sw.x) *\n    smoothstep(margins[2], margins[2] + sw.x, 1.0 - uvMask.x + sw.x) *\n    smoothstep(margins[1], margins[1] + sw.y, uvMask.y + sw.y) *\n    smoothstep(margins[3], margins[3] + sw.y, 1.0 - uvMask.y + sw.y);\n  float maskOuter =\n    smoothstep(margins[0] - sw.x, margins[0], uvMask.x + sw.x) *\n    smoothstep(margins[2] - sw.x, margins[2], 1.0 - uvMask.x + sw.x) *\n    smoothstep(margins[1] - sw.y, margins[1], uvMask.y + sw.y) *\n    smoothstep(margins[3] - sw.y, margins[3], 1.0 - uvMask.y + sw.y);\n  float maskStroke = maskOuter - mask;\n  float maskInner =\n    smoothstep(margins[0] - 2. * sw.x, margins[0], uvMask.x) *\n    smoothstep(margins[2] - 2. * sw.x, margins[2], 1.0 - uvMask.x) *\n    smoothstep(margins[1] - 2. * sw.y, margins[1], uvMask.y) *\n    smoothstep(margins[3] - 2. * sw.y, margins[3], 1.0 - uvMask.y);\n  float maskStrokeInner = maskInner - mask;\n\n  uv -= .5;\n  uv *= patternSize;\n  uv = rotateAspect(uv, patternRotation, u_imageAspectRatio);\n\n  float curve = 0.;\n  float patternY = uv.y / u_imageAspectRatio;\n  if (u_shape > 4.5) {\n    curve = .5 + .5 * sin(.5 * PI * uv.x) * cos(.5 * PI * patternY);\n  } else if (u_shape > 3.5) {\n    curve = 10. * abs(fract(.1 * patternY) - .5);\n  } else if (u_shape > 2.5) {\n    curve = 4. * sin(.23 * patternY);\n  } else if (u_shape > 1.5) {\n    curve = .5 + .5 * sin(.5 * uv.x) * sin(1.7 * uv.x);\n  }\n\n  vec2 UvToFract = uv + curve;\n  vec2 fractOrigUV = fract(uv);\n  vec2 floorOrigUV = floor(uv);\n\n  float x = smoothFract(UvToFract.x);\n  float xNonSmooth = fract(UvToFract.x) + .0001;\n\n  float highlightsWidth = 2. * max(.001, fwidth(UvToFract.x));\n  highlightsWidth += 2. * maskStrokeInner;\n  float highlights = smoothstep(0., highlightsWidth, xNonSmooth);\n  highlights *= smoothstep(1., 1. - highlightsWidth, xNonSmooth);\n  highlights = 1. - highlights;\n  highlights *= u_highlights;\n  highlights = clamp(highlights, 0., 1.);\n  highlights *= mask;\n\n  float shadows = pow(x, 1.3);\n  float distortion = 0.;\n  float fadeX = 1.;\n  float frameFade = 0.;\n\n  float aa = fwidth(xNonSmooth);\n  aa = max(aa, fwidth(uv.x));\n  aa = max(aa, fwidth(UvToFract.x));\n  aa = max(aa, .0001);\n\n  if (u_distortionShape == 1.) {\n    distortion = -pow(1.5 * x, 3.);\n    distortion += (.5 - u_shift);\n    frameFade = pow(1.5 * x, 3.);\n    aa = max(.2, aa);\n    aa += mix(.2, 0., u_size);\n    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);\n    distortion = mix(.5, distortion, fadeX);\n  } else if (u_distortionShape == 2.) {\n    distortion = 2. * pow(x, 2.);\n    distortion -= (.5 + u_shift);\n    frameFade = pow(abs(x - .5), 4.);\n    aa = max(.2, aa);\n    aa += mix(.2, 0., u_size);\n    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);\n    distortion = mix(.5, distortion, fadeX);\n    frameFade = mix(1., frameFade, .5 * fadeX);\n  } else if (u_distortionShape == 3.) {\n    distortion = pow(2. * (xNonSmooth - .5), 6.);\n    distortion -= .25;\n    distortion -= u_shift;\n    frameFade = 1. - 2. * pow(abs(x - .4), 2.);\n    aa = .15;\n    aa += mix(.1, 0., u_size);\n    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);\n    frameFade = mix(1., frameFade, fadeX);\n  } else if (u_distortionShape == 4.) {\n    x = xNonSmooth;\n    distortion = sin((x + .25) * TWO_PI);\n    shadows = .5 + .5 * asin(distortion) / (.5 * PI);\n    distortion *= .5;\n    distortion -= u_shift;\n    frameFade = .5 + .5 * sin(x * TWO_PI);\n  } else if (u_distortionShape == 5.) {\n    distortion -= pow(abs(x), .2) * x;\n    distortion += .33;\n    distortion -= 3. * u_shift;\n    distortion *= .33;\n    frameFade = .3 * (smoothstep(.0, 1., x));\n    shadows = pow(x, 2.5);\n    aa = max(.1, aa);\n    aa += mix(.1, 0., u_size);\n    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);\n    distortion *= fadeX;\n  }\n\n  vec2 dudx = dFdx(imageUV0);\n  vec2 dudy = dFdy(imageUV0);\n  vec2 grainUV = imageUV0 - .5;\n  grainUV *= (.8 / vec2(length(dudx), length(dudy)));\n  grainUV += .5;\n  float grain = valueNoise(grainUV);\n  grain = smoothstep(.4, .7, grain);\n  grain *= u_grainMixer;\n  distortion = mix(distortion, 0., grain);\n\n  shadows = min(shadows, 1.);\n  shadows += maskStrokeInner;\n  shadows *= mask;\n  shadows = min(shadows, 1.);\n  shadows *= pow(u_shadows, 2.);\n  shadows = clamp(shadows, 0., 1.);\n\n  distortion *= 3. * u_distortion;\n  frameFade *= u_distortion;\n\n  fractOrigUV.x += distortion;\n  floorOrigUV = rotateAspect(floorOrigUV, -patternRotation, u_imageAspectRatio);\n  fractOrigUV = rotateAspect(fractOrigUV, -patternRotation, u_imageAspectRatio);\n\n  uv = (floorOrigUV + fractOrigUV) / patternSize;\n  uv += pow(maskStroke, 4.);\n  uv += vec2(.5);\n\n  uv = mix(imageUV0, uv, smoothstep(0., .7, mask));\n  float blur = mix(0., 50., u_blur);\n  blur = mix(0., blur, smoothstep(.5, 1., mask));\n\n  float edgeDistortion = mix(.0, .04, u_edges);\n  edgeDistortion += .06 * frameFade * u_edges;\n  edgeDistortion *= mask;\n  float frame = getUvFrame(uv, edgeDistortion);\n\n  float stretch = 1. - smoothstep(0., .5, xNonSmooth) * smoothstep(1., 1. - .5, xNonSmooth);\n  stretch = pow(stretch, 2.);\n  stretch *= mask;\n  stretch *= getUvFrame(uv, .1 + .05 * mask * frameFade);\n  uv.y = mix(uv.y, .5, u_stretch * stretch);\n\n  vec4 image = getBlur(u_image, uv, 1. / iResolution, vec2(0., 1.), blur);\n  image.rgb *= image.a;\n  vec4 backColor = u_colorBack;\n  backColor.rgb *= backColor.a;\n  vec4 highlightColor = u_colorHighlight;\n  highlightColor.rgb *= highlightColor.a;\n  vec4 shadowColor = u_colorShadow;\n\n  vec3 color = highlightColor.rgb * highlights;\n  float opacity = highlightColor.a * highlights;\n\n  shadows = mix(shadows * shadowColor.a, 0., highlights);\n  color = mix(color, shadowColor.rgb * shadowColor.a, .5 * shadows);\n  color += .5 * pow(shadows, .5) * shadowColor.rgb;\n  opacity += shadows;\n  color = clamp(color, vec3(0.), vec3(1.));\n  opacity = clamp(opacity, 0., 1.);\n\n  color += image.rgb * (1. - opacity) * frame;\n  opacity += image.a * (1. - opacity) * frame;\n\n  color += backColor.rgb * (1. - opacity);\n  opacity += backColor.a * (1. - opacity);\n\n  float grainOverlay = valueNoise(rotate(grainUV, 1.) + vec2(3.));\n  grainOverlay = mix(grainOverlay, valueNoise(rotate(grainUV, 2.) + vec2(-1.)), .5);\n  grainOverlay = pow(grainOverlay, 1.3);\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  grainOverlayStrength *= mask;\n  color = mix(color, grainOverlayColor, .35 * grainOverlayStrength);\n  opacity += .5 * grainOverlayStrength;\n  opacity = clamp(opacity, 0., 1.);\n\n  fragColor = vec4(color, opacity);\n}\n";

package/dist/components/effects/FlutedGlass/FlutedGlass.shaders.js

@@ -1,335 +0,0 @@
-import 'react/jsx-runtime';
-import 'react';
-import { glslDeclarePI, glslRotate2, glslHashFloat } from '../shared/shaderNoise.glsl.js';
-import { glslImageCoverUV } from '../shared/imageUV.glsl.js';
-
-/**
- * FlutedGlass fragment shader — adapted from paper-design/shaders'
- * `fluted-glass.ts` (https://github.com/paper-design/shaders, Apache
- * License 2.0). An image filter: refracts a source image through a
- * directional fluted/ribbed glass grid, with a real per-pixel Gaussian blur.
- *
- * Simplified from the original: image UV computed via the shared
- * `getImageCoverUV` cover-fit helper (see shared/imageUV.glsl.ts) instead of
- * paper-design's ShaderSizingParams fit engine; pure-hash GLSL instead of
- * pre-generated noise-texture sampling.
- */
-const flutedGlassFragmentShader = `#version 300 es
-precision mediump float;
-
-uniform vec2 iResolution;
-
-uniform vec4 u_colorBack;
-uniform vec4 u_colorShadow;
-uniform vec4 u_colorHighlight;
-
-uniform sampler2D u_image;
-uniform float u_imageAspectRatio;
-
-uniform float u_size;
-uniform float u_shadows;
-uniform float u_angle;
-uniform float u_stretch;
-uniform float u_shape;
-uniform float u_distortion;
-uniform float u_highlights;
-uniform float u_distortionShape;
-uniform float u_shift;
-uniform float u_blur;
-uniform float u_edges;
-uniform float u_marginLeft;
-uniform float u_marginRight;
-uniform float u_marginTop;
-uniform float u_marginBottom;
-uniform float u_grainMixer;
-uniform float u_grainOverlay;
-
-out vec4 fragColor;
-
-${glslDeclarePI}
-${glslRotate2}
-${glslHashFloat}
-${glslImageCoverUV}
-
-float hash21(vec2 p) {
-  return randomR(p);
-}
-
-float valueNoise(vec2 st) {
-  vec2 i = floor(st);
-  vec2 f = fract(st);
-  float a = hash21(i);
-  float b = hash21(i + vec2(1.0, 0.0));
-  float c = hash21(i + vec2(0.0, 1.0));
-  float d = hash21(i + vec2(1.0, 1.0));
-  vec2 u = f * f * (3.0 - 2.0 * f);
-  float x1 = mix(a, b, u.x);
-  float x2 = mix(c, d, u.x);
-  return mix(x1, x2, u.y);
-}
-
-float getUvFrame(vec2 uv, float softness) {
-  float aax = 2. * fwidth(uv.x);
-  float aay = 2. * fwidth(uv.y);
-  float left = smoothstep(0., aax + softness, uv.x);
-  float right = 1. - smoothstep(1. - softness - aax, 1., uv.x);
-  float bottom = smoothstep(0., aay + softness, uv.y);
-  float top = 1. - smoothstep(1. - softness - aay, 1., uv.y);
-  return left * right * bottom * top;
-}
-
-const int MAX_RADIUS = 50;
-vec4 samplePremultiplied(sampler2D tex, vec2 uv) {
-  vec4 c = texture(tex, uv);
-  c.rgb *= c.a;
-  return c;
-}
-
-vec4 getBlur(sampler2D tex, vec2 uv, vec2 texelSize, vec2 dir, float sigma) {
-  if (sigma <= .5) return texture(tex, uv);
-  int radius = int(min(float(MAX_RADIUS), ceil(3.0 * sigma)));
-
-  float twoSigma2 = 2.0 * sigma * sigma;
-  float gaussianNorm = 1.0 / sqrt(TWO_PI * sigma * sigma);
-
-  vec4 sum = samplePremultiplied(tex, uv) * gaussianNorm;
-  float weightSum = gaussianNorm;
-
-  for (int i = 1; i <= MAX_RADIUS; i++) {
-    if (i > radius) break;
-
-    float x = float(i);
-    float w = exp(-(x * x) / twoSigma2) * gaussianNorm;
-
-    vec2 offset = dir * texelSize * x;
-    vec4 s1 = samplePremultiplied(tex, uv + offset);
-    vec4 s2 = samplePremultiplied(tex, uv - offset);
-
-    sum += (s1 + s2) * w;
-    weightSum += 2.0 * w;
-  }
-
-  vec4 result = sum / weightSum;
-  if (result.a > 0.) {
-    result.rgb /= result.a;
-  }
-
-  return result;
-}
-
-vec2 rotateAspect(vec2 p, float a, float aspect) {
-  p.x *= aspect;
-  p = rotate(p, a);
-  p.x /= aspect;
-  return p;
-}
-
-float smoothFract(float x) {
-  float f = fract(x);
-  float w = fwidth(x);
-  float edge = abs(f - 0.5) - 0.5;
-  float band = smoothstep(-w, w, edge);
-  return mix(f, 1.0 - f, band);
-}
-
-void main() {
-  float patternRotation = -u_angle * PI / 180.;
-  float patternSize = mix(200., 5., u_size);
-
-  vec2 fragUV = gl_FragCoord.xy / iResolution.xy;
-  vec2 imageUV0 = getImageCoverUV(fragUV, iResolution, u_imageAspectRatio);
-  vec2 uv = imageUV0;
-
-  vec2 uvMask = fragUV;
-  vec2 sw = vec2(.005);
-  vec4 margins = vec4(u_marginLeft, u_marginTop, u_marginRight, u_marginBottom);
-  float mask =
-    smoothstep(margins[0], margins[0] + sw.x, uvMask.x + sw.x) *
-    smoothstep(margins[2], margins[2] + sw.x, 1.0 - uvMask.x + sw.x) *
-    smoothstep(margins[1], margins[1] + sw.y, uvMask.y + sw.y) *
-    smoothstep(margins[3], margins[3] + sw.y, 1.0 - uvMask.y + sw.y);
-  float maskOuter =
-    smoothstep(margins[0] - sw.x, margins[0], uvMask.x + sw.x) *
-    smoothstep(margins[2] - sw.x, margins[2], 1.0 - uvMask.x + sw.x) *
-    smoothstep(margins[1] - sw.y, margins[1], uvMask.y + sw.y) *
-    smoothstep(margins[3] - sw.y, margins[3], 1.0 - uvMask.y + sw.y);
-  float maskStroke = maskOuter - mask;
-  float maskInner =
-    smoothstep(margins[0] - 2. * sw.x, margins[0], uvMask.x) *
-    smoothstep(margins[2] - 2. * sw.x, margins[2], 1.0 - uvMask.x) *
-    smoothstep(margins[1] - 2. * sw.y, margins[1], uvMask.y) *
-    smoothstep(margins[3] - 2. * sw.y, margins[3], 1.0 - uvMask.y);
-  float maskStrokeInner = maskInner - mask;
-
-  uv -= .5;
-  uv *= patternSize;
-  uv = rotateAspect(uv, patternRotation, u_imageAspectRatio);
-
-  float curve = 0.;
-  float patternY = uv.y / u_imageAspectRatio;
-  if (u_shape > 4.5) {
-    curve = .5 + .5 * sin(.5 * PI * uv.x) * cos(.5 * PI * patternY);
-  } else if (u_shape > 3.5) {
-    curve = 10. * abs(fract(.1 * patternY) - .5);
-  } else if (u_shape > 2.5) {
-    curve = 4. * sin(.23 * patternY);
-  } else if (u_shape > 1.5) {
-    curve = .5 + .5 * sin(.5 * uv.x) * sin(1.7 * uv.x);
-  }
-
-  vec2 UvToFract = uv + curve;
-  vec2 fractOrigUV = fract(uv);
-  vec2 floorOrigUV = floor(uv);
-
-  float x = smoothFract(UvToFract.x);
-  float xNonSmooth = fract(UvToFract.x) + .0001;
-
-  float highlightsWidth = 2. * max(.001, fwidth(UvToFract.x));
-  highlightsWidth += 2. * maskStrokeInner;
-  float highlights = smoothstep(0., highlightsWidth, xNonSmooth);
-  highlights *= smoothstep(1., 1. - highlightsWidth, xNonSmooth);
-  highlights = 1. - highlights;
-  highlights *= u_highlights;
-  highlights = clamp(highlights, 0., 1.);
-  highlights *= mask;
-
-  float shadows = pow(x, 1.3);
-  float distortion = 0.;
-  float fadeX = 1.;
-  float frameFade = 0.;
-
-  float aa = fwidth(xNonSmooth);
-  aa = max(aa, fwidth(uv.x));
-  aa = max(aa, fwidth(UvToFract.x));
-  aa = max(aa, .0001);
-
-  if (u_distortionShape == 1.) {
-    distortion = -pow(1.5 * x, 3.);
-    distortion += (.5 - u_shift);
-    frameFade = pow(1.5 * x, 3.);
-    aa = max(.2, aa);
-    aa += mix(.2, 0., u_size);
-    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);
-    distortion = mix(.5, distortion, fadeX);
-  } else if (u_distortionShape == 2.) {
-    distortion = 2. * pow(x, 2.);
-    distortion -= (.5 + u_shift);
-    frameFade = pow(abs(x - .5), 4.);
-    aa = max(.2, aa);
-    aa += mix(.2, 0., u_size);
-    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);
-    distortion = mix(.5, distortion, fadeX);
-    frameFade = mix(1., frameFade, .5 * fadeX);
-  } else if (u_distortionShape == 3.) {
-    distortion = pow(2. * (xNonSmooth - .5), 6.);
-    distortion -= .25;
-    distortion -= u_shift;
-    frameFade = 1. - 2. * pow(abs(x - .4), 2.);
-    aa = .15;
-    aa += mix(.1, 0., u_size);
-    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);
-    frameFade = mix(1., frameFade, fadeX);
-  } else if (u_distortionShape == 4.) {
-    x = xNonSmooth;
-    distortion = sin((x + .25) * TWO_PI);
-    shadows = .5 + .5 * asin(distortion) / (.5 * PI);
-    distortion *= .5;
-    distortion -= u_shift;
-    frameFade = .5 + .5 * sin(x * TWO_PI);
-  } else if (u_distortionShape == 5.) {
-    distortion -= pow(abs(x), .2) * x;
-    distortion += .33;
-    distortion -= 3. * u_shift;
-    distortion *= .33;
-    frameFade = .3 * (smoothstep(.0, 1., x));
-    shadows = pow(x, 2.5);
-    aa = max(.1, aa);
-    aa += mix(.1, 0., u_size);
-    fadeX = smoothstep(0., aa, xNonSmooth) * smoothstep(1., 1. - aa, xNonSmooth);
-    distortion *= fadeX;
-  }
-
-  vec2 dudx = dFdx(imageUV0);
-  vec2 dudy = dFdy(imageUV0);
-  vec2 grainUV = imageUV0 - .5;
-  grainUV *= (.8 / vec2(length(dudx), length(dudy)));
-  grainUV += .5;
-  float grain = valueNoise(grainUV);
-  grain = smoothstep(.4, .7, grain);
-  grain *= u_grainMixer;
-  distortion = mix(distortion, 0., grain);
-
-  shadows = min(shadows, 1.);
-  shadows += maskStrokeInner;
-  shadows *= mask;
-  shadows = min(shadows, 1.);
-  shadows *= pow(u_shadows, 2.);
-  shadows = clamp(shadows, 0., 1.);
-
-  distortion *= 3. * u_distortion;
-  frameFade *= u_distortion;
-
-  fractOrigUV.x += distortion;
-  floorOrigUV = rotateAspect(floorOrigUV, -patternRotation, u_imageAspectRatio);
-  fractOrigUV = rotateAspect(fractOrigUV, -patternRotation, u_imageAspectRatio);
-
-  uv = (floorOrigUV + fractOrigUV) / patternSize;
-  uv += pow(maskStroke, 4.);
-  uv += vec2(.5);
-
-  uv = mix(imageUV0, uv, smoothstep(0., .7, mask));
-  float blur = mix(0., 50., u_blur);
-  blur = mix(0., blur, smoothstep(.5, 1., mask));
-
-  float edgeDistortion = mix(.0, .04, u_edges);
-  edgeDistortion += .06 * frameFade * u_edges;
-  edgeDistortion *= mask;
-  float frame = getUvFrame(uv, edgeDistortion);
-
-  float stretch = 1. - smoothstep(0., .5, xNonSmooth) * smoothstep(1., 1. - .5, xNonSmooth);
-  stretch = pow(stretch, 2.);
-  stretch *= mask;
-  stretch *= getUvFrame(uv, .1 + .05 * mask * frameFade);
-  uv.y = mix(uv.y, .5, u_stretch * stretch);
-
-  vec4 image = getBlur(u_image, uv, 1. / iResolution, vec2(0., 1.), blur);
-  image.rgb *= image.a;
-  vec4 backColor = u_colorBack;
-  backColor.rgb *= backColor.a;
-  vec4 highlightColor = u_colorHighlight;
-  highlightColor.rgb *= highlightColor.a;
-  vec4 shadowColor = u_colorShadow;
-
-  vec3 color = highlightColor.rgb * highlights;
-  float opacity = highlightColor.a * highlights;
-
-  shadows = mix(shadows * shadowColor.a, 0., highlights);
-  color = mix(color, shadowColor.rgb * shadowColor.a, .5 * shadows);
-  color += .5 * pow(shadows, .5) * shadowColor.rgb;
-  opacity += shadows;
-  color = clamp(color, vec3(0.), vec3(1.));
-  opacity = clamp(opacity, 0., 1.);
-
-  color += image.rgb * (1. - opacity) * frame;
-  opacity += image.a * (1. - opacity) * frame;
-
-  color += backColor.rgb * (1. - opacity);
-  opacity += backColor.a * (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);
-  float grainOverlayV = grainOverlay * 2. - 1.;
-  vec3 grainOverlayColor = vec3(step(0., grainOverlayV));
-  float grainOverlayStrength = u_grainOverlay * abs(grainOverlayV);
-  grainOverlayStrength = pow(grainOverlayStrength, .8);
-  grainOverlayStrength *= mask;
-  color = mix(color, grainOverlayColor, .35 * grainOverlayStrength);
-  opacity += .5 * grainOverlayStrength;
-  opacity = clamp(opacity, 0., 1.);
-
-  fragColor = vec4(color, opacity);
-}
-`;
-
-export { flutedGlassFragmentShader };

package/dist/components/effects/FlutedGlass/FlutedGlass.types.d.ts

@@ -1,61 +0,0 @@
-import type React from "react";
-import type { ShaderTextureSource } from "../shared";
-export declare const FLUTED_GLASS_SHAPES: {
-    readonly lines: 1;
-    readonly linesIrregular: 2;
-    readonly wave: 3;
-    readonly zigzag: 4;
-    readonly pattern: 5;
-};
-export type FlutedGlassShape = keyof typeof FLUTED_GLASS_SHAPES;
-export declare const FLUTED_GLASS_DISTORTION_SHAPES: {
-    readonly prism: 1;
-    readonly lens: 2;
-    readonly contour: 3;
-    readonly cascade: 4;
-    readonly flat: 5;
-};
-export type FlutedGlassDistortionShape = keyof typeof FLUTED_GLASS_DISTORTION_SHAPES;
-export interface FlutedGlassProps extends React.HTMLAttributes<HTMLDivElement> {
-    /** Source image (URL or an existing HTMLImageElement). Required. */
-    image: ShaderTextureSource;
-    /** Background CSS color shown outside the margin. Default: 'var(--color-surface-sunken)'. */
-    colorBack?: string;
-    /** Ridge shadow color. Default: 'var(--color-text-primary)'. */
-    colorShadow?: string;
-    /** Ridge highlight color. Default: 'var(--color-background)'. */
-    colorHighlight?: string;
-    /** Directional grid pattern. Default: 'lines'. */
-    shape?: FlutedGlassShape;
-    /** Per-ridge refraction profile. Default: 'lens'. */
-    distortionShape?: FlutedGlassDistortionShape;
-    /** Ridge frequency/size. Default: 0.5. */
-    size?: number;
-    /** Grid rotation, degrees. Default: 0. */
-    angle?: number;
-    /** Refraction strength, 0-1. Default: 0.5. */
-    distortion?: number;
-    /** Refraction phase shift. Default: 0. */
-    shift?: number;
-    /** Blur applied through the glass, 0-1. Default: 0.2. */
-    blur?: number;
-    /** Edge highlight strength, 0-1. Default: 0.3. */
-    edges?: number;
-    /** Shadow strength, 0-1. Default: 0.4. */
-    shadows?: number;
-    /** Ridge highlight strength, 0-1. Default: 0.5. */
-    highlights?: number;
-    /** Vertical stretch at ridge centers, 0-1. Default: 0. */
-    stretch?: number;
-    /** Inset margin on all sides, 0-1 (overridable per-side). Default: 0. */
-    margin?: number;
-    marginLeft?: number;
-    marginRight?: number;
-    marginTop?: number;
-    marginBottom?: number;
-    /** Grain influence on the distortion, 0-1. Default: 0. */
-    grainMixer?: number;
-    /** Post-composite grain overlay strength, 0-1. Default: 0. */
-    grainOverlay?: number;
-    className?: string;
-}

package/dist/components/effects/FlutedGlass/FlutedGlass.types.js

@@ -1,16 +0,0 @@
-const FLUTED_GLASS_SHAPES = {
-    lines: 1,
-    linesIrregular: 2,
-    wave: 3,
-    zigzag: 4,
-    pattern: 5,
-};
-const FLUTED_GLASS_DISTORTION_SHAPES = {
-    prism: 1,
-    lens: 2,
-    contour: 3,
-    cascade: 4,
-    flat: 5,
-};
-
-export { FLUTED_GLASS_DISTORTION_SHAPES, FLUTED_GLASS_SHAPES };

package/dist/components/effects/FlutedGlass/index.d.ts

@@ -1,3 +0,0 @@
-export { FlutedGlass } from "./FlutedGlass";
-export type { FlutedGlassProps, FlutedGlassShape, FlutedGlassDistortionShape, } from "./FlutedGlass.types";
-export { FLUTED_GLASS_SHAPES, FLUTED_GLASS_DISTORTION_SHAPES } from "./FlutedGlass.types";

package/dist/components/effects/GlassEffect/GlassEffect.d.ts

@@ -1,15 +0,0 @@
-import React from 'react';
-import { GlassEffectProps } from './GlassEffect.types';
-/**
- * GlassEffect component creates a layered glass morphism effect
- * Uses hardcoded gradients for consistent visibility on light backgrounds
- *
- * @example
- * ```tsx
- * <div className="relative overflow-hidden bg-blue-500 rounded-lg">
- *   <GlassEffect rounded="var(--button-radius)" />
- *   <span className="relative z-10">Content</span>
- * </div>
- * ```
- */
-export declare const GlassEffect: React.FC<GlassEffectProps>;

package/dist/components/effects/GlassEffect/GlassEffect.js

@@ -1,38 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { cn } from '../../../utils/cn.js';
-import 'react';
-
-/**
- * GlassEffect component creates a layered glass morphism effect
- * Uses hardcoded gradients for consistent visibility on light backgrounds
- *
- * @example
- * ```tsx
- * <div className="relative overflow-hidden bg-blue-500 rounded-lg">
- *   <GlassEffect rounded="var(--button-radius)" />
- *   <span className="relative z-10">Content</span>
- * </div>
- * ```
- */
-const GlassEffect = ({ rounded = 'inherit', blendModeOuter = 'normal', blendModeInner = 'normal', gradientOuter, gradientInner, classNameOuter, classNameInner, zIndex = 0, }) => {
-    // Calculate inner border radius (slightly smaller than outer)
-    const innerRoundedCalc = rounded === 'inherit'
-        ? 'inherit'
-        : `calc(${rounded} - 1.5px)`;
-    // Default gradients with visible contrast on light backgrounds
-    const defaultGradientOuter = 'linear-gradient(to bottom, #ffffff 0%, #e5e7eb 40%,  #ffffff 100%)';
-    const defaultGradientInner = 'linear-gradient(to bottom, #edeff0 0%, #ffffff 100%)';
-    return (jsx("div", { "aria-hidden": "true", className: cn("absolute inset-0 p-[1.5px] border-[1px] border-[var(--color-border)]", "pointer-events-none", // Don't block clicks
-        classNameOuter), style: {
-            borderRadius: rounded,
-            zIndex,
-            mixBlendMode: blendModeOuter,
-            background: gradientOuter || defaultGradientOuter,
-        }, children: jsx("div", { className: cn("w-full h-full", classNameInner), style: {
-                borderRadius: innerRoundedCalc,
-                mixBlendMode: blendModeInner,
-                background: gradientInner || defaultGradientInner,
-            } }) }));
-};
-
-export { GlassEffect };

package/dist/components/effects/GlassEffect/GlassEffect.types.d.ts

@@ -1,19 +0,0 @@
-export type BlendMode = 'multiply' | 'overlay' | 'soft-light' | 'hard-light' | 'screen' | 'normal';
-export interface GlassEffectProps {
-    /** Border radius for the glass layers (e.g., "var(--button-radius)", "9999px", "0.5rem") */
-    rounded?: string;
-    /** Blend mode for outer layer (default: "normal") */
-    blendModeOuter?: BlendMode;
-    /** Blend mode for inner layer (default: "normal") */
-    blendModeInner?: BlendMode;
-    /** Custom gradient for outer layer (overrides default) */
-    gradientOuter?: string;
-    /** Custom gradient for inner layer (overrides default) */
-    gradientInner?: string;
-    /** Custom className for outer layer */
-    classNameOuter?: string;
-    /** Custom className for inner layer */
-    classNameInner?: string;
-    /** Z-index for the glass layers (default: 0) */
-    zIndex?: number;
-}

package/dist/components/effects/GlassEffect/index.d.ts

@@ -1,2 +0,0 @@
-export { GlassEffect } from './GlassEffect';
-export type { GlassEffectProps, BlendMode } from './GlassEffect.types';

package/dist/components/effects/GlassSurface/GlassSurface.d.ts

@@ -1,8 +0,0 @@
-import React from "react";
-import { GlassSurfaceProps } from "./GlassSurface.types";
-/**
- * GlassSurface Component
- * Creates a realistic chromatic aberration glass effect using SVG filters.
- * Works as a wrapper for any content.
- */
-export declare const GlassSurface: React.ForwardRefExoticComponent<GlassSurfaceProps & React.RefAttributes<HTMLDivElement>>;