solid-glass/dist/react.js

A lightweight glass effect library for web apps, supporting React and Vue.

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),b=require("./utils-DYbhshKv.js"),v=({children:m,shadowColor:s="rgba(255, 255, 255, 0.7)",shadowBlur:u=7,shadowSpread:f=0,shadowOffset:n=0,tintColor:e="#ffffff",tintOpacity:r=.04,frostBlur:l=2,noiseFrequency:i=.008,distortionStrength:R=77,borderRadius:a=28,width:x="300px",height:E="200px",className:q="",style:G={},...L})=>{const g=t.useRef(null),c=t.useRef(null);return t.useEffect(()=>{if(g.current){const p={shadowColor:s,shadowBlur:u,shadowSpread:f,shadowOffset:n,tintColor:e.startsWith("#")?b.hexToRgb(e):e,tintOpacity:r,frostBlur:l,noiseFrequency:i,distortionStrength:R,borderRadius:a};c.current=new b.LiquidGlass(g.current,p)}return()=>{c.current&&c.current.destroy()}},[]),t.useEffect(()=>{if(c.current){const p={shadowColor:s,shadowBlur:u,shadowSpread:f,shadowOffset:n,tintColor:e.startsWith("#")?b.hexToRgb(e):e,tintOpacity:r,frostBlur:l,noiseFrequency:i,distortionStrength:R,borderRadius:a};Object.entries(p).forEach(([T,j])=>{c.current.updateOption(T,j)})}},[s,u,f,n,e,r,l,i,R,a]),t.createElement("div",{ref:g,className:`solid-glass-wrapper ${q}`,style:{width:x,height:E,...G},...L},m)};exports.LiquidGlassReact=v;