@scriptedpixels/liquid-glass-vue 0.0.2 → 0.0.4

package/dist/index.umd.cjs

@@ -0,0 +1,26 @@
+(function(T,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(T=typeof globalThis<"u"?globalThis:T||self,e(T.LiquidGlassVue={},T.Vue))})(this,function(T,e){"use strict";const z="data:image/jpeg;base64,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cUAUAkEkziomgGgkoxZGgxZFQFQlYnQHRdPfj/10KCSCKESCNiVkViPSLpD0h6I0Q0I0A2IoBWBIJIBKBIJoJIJ2R2J0JWBUJ0JUB0XTv479dFZDYiglYigkhEgjZFQjRFQjRFQjQigFYigHYigmgEgmglYlYnQlQlYlQHQlQnQ9P/kf1yVkNiNCNkNiVENiNiViNEViNkVCVgKCViViViSCViSCVgdCViVCViVCdgVCVCdD1D+U/XBWQ2I0I2Q2JUQ2I0JWQ0I2JUQ2JUI2JUI2J0JWJWJWA2R0BWJ0I2JUJ2BUJUJ0P//EABkQAQEBAQEBAAAAAAAAAAAAAAECABEDEP/aAAgBAQABAgB1atWrVq1atWrVq1atWrVq1atWrVq1atWrVq+OrVq1atWrVq1atWrVq1atWrVq1atWrVq1atXxVppppppdWrVq1atWrVq1NNNNNNNNNNNPVWmmmmms6tWrVq1atWpppppppppppppp6q0000uc51atWrVq1ammmmmmmmmmmmmt1Vpppc5znVq1atWrVqaaaaaaaaaaaaaeqtNLnOc51atWrVq1ammmmmmmmmmmmmnqrS5znOc6tWrVq16222mmmmmmlVppp6tKuc5znOrVq1a9TbbbbTTTTTSq000qtLnOc5zq1atWrW0222200000qqqtKqrnOc5zq1atTbbbbbbbbTTTSqqqqqq5znOc6tTTTbbbbbbbbTTTSqqqqrlVznOctNNNtttttttttNNNNKqqqrqznKqrTTTTbbbbbbbbbTTTSqqqqrqznOc5aaaabbbbbbbbbaaaaVVVVVdWc5znVq1NNttttttttttNNKqqqqudWc5znVq16tbbbbbbbbbbTTSqqqq5XVnOc6tWrVrb1tttttttttNNKqqqqrWrK5VWmmm2230bbbbbbaaaXOc5zlVa1KuVVppptttt9G22222mmlzlVznK6tWVVWmmmm2222222222mlznOc5znLWppVVWmmm22222229bTWrOc5znOcq1qaaVpWmm222222229erVqznOc5znKtatStK0rTbTTbbbberXr1as5znOc5aVpppppWlabaabbbb1ta9WrVnOc5znU0rTTTTTTTTTbTTbbbTWvVq1as5znOdTTStNNNNNNNNNtNNtttN6tWvVq1ZznOrU00rTTTTTTTTTTTTTbTWvVq1atWrOc6tTTTStNNNNNNNNNNtNNtNa9WrVq1Z1Z1NNNNNK1q1NNNNNNNNNNNtNatWrVq1atWrU00000rWrVq1atWrVq1alaaa1atWrVq1NNNammmmla1atWrVq1aterVq16tWrVnVqa1NK1qaaaVX/xAAWEAADAAAAAAAAAAAAAAAAAAAhgJD/2gAIAQEAAz8AaExf/8QAGhEBAQEBAQEBAAAAAAAAAAAAAQISEQADEP/aAAgBAgEBAgDx48ePHjx48ePHjx48ePHjx48ePHjx48ePHj86IiIiIiInjx48ePHjx48IiIiIj0oooooooooRERER73ve60UUUUUUVrWiiiiiihERERER73ve97ooooorRWiiiiihKERERER73ve973RRRRWtFFFFFFCIiIiIiPe973ve60UUVrRRRRRRQiIlCIiI973ve973pRRWiiiiiiiiiiiiiiihEe973ve973RRWtFFFFFFFFFFFFFFFFFFa13ve973WitaKKKKKKKKKKKKKKKKKK1rWtd1rutFa1oooooooooooosssooorWta1rWta1rRRRRRRRRRRZZZZZZZZZWta1rWta1rRRRRRRRRZZZZZZZZZZZZe9a1rWta1rWitaKLLLLLLLLLLLLLLLLL3rWta1rWtFbLLLLLLLLLLLLLLLLLLLL3vWta1rWita1ssssssss+hZZZZZZZZe961rWta0Vre97LLLLLLLLLLLPoWWWWWXrWta1oorWta3ssss+hZZZZ9Cyyyyyyyyiita1orWta1ve9llllllllllllllllFFa0VorWta1ve9llllllllllllllllllFFFaK1rWta1rWiyyyyyyyyyyyyiiiiiiitFFa1rWta1oosoosssssoooosoooorRRRWta1rWta0UUUUUWUUUUUUUUUUUVoooorWta1rWtaKKKKKKmiiiiiiiiiiiiiiitd73ve61oSiiipoqaKKKKKKKKKK0UUUVrve973vREREZoSihEooooorRRRRWtd73ve9EREREREoSiiiiitFllllla73ve9ERERERESiiiiiitH0PoWWWWVrXe96IiIiMoiJRRRRRRWjwlFFllllFFd6IiIiIlCUUUUUUUUUePHjx48ePCIiIiIiIiUUUUUUUUUUUePHjx48ePHjx48ePHjx48IiUUUUUUJRRRX//xAAWEQADAAAAAAAAAAAAAAAAAAABYJD/2gAIAQIBAz8AtEV7/8QAFxEBAQEBAAAAAAAAAAAAAAAAAAECEP/aAAgBAwEBAgCtNNNNNNNNNNNNNNNNNNNNNNNNNNNNNcrTTTTTTTTTTTTTTTTTTTTTTTTTTTTTXKrTTTTTTTU000000000000000000001FVpppppqampqaaaaaaaaaaaaaaaaaaaa5Vaaaaampqampqammmmmmmmmmmlaaaaaaiq0001NTU1NTU1NTTTTTTTTTTSqqtNNNcqtNNSyzU1LNTU1NTTTTTTTTTSqqq001ytNLLLLNTU1NTU1NTbbbTTTTTSqqq001ytNLLLLLNTU1NTU3NttttNNNNNKqq001KrSyyyyyzU1NTU3Nzc02220000qqqqrSqqyyyyyzU1NTU3Nzc3NttttNNNKqqqqqqssssss1NTU3Nzc3NzbbbbTTTSqqqqqqrLLLLLNTU1Nzc3Nzc22220000qqqqqqqqssss1NTU3Nzc3NzbbbbbTTSqqqqqqqqqqzU1NTc3Nzc3Nzbc22000qqqqqqqqqqqtTU3Nzc3Nzc3NtzbTTSqqqqrKqqqqqtNNzc23Nzc3Nzc3NTU1KqqqrKqqqqqtNNNNttzc3Nzc3NzU1NLLLLLKqqqqqqqq0022223Nzc3NzU1NSyyyyyyqqqqqqqrTTbbbbc3Nzc3NTU1LLLLLLKsqqqqqqrTTTTbbbc3Nzc1NTUsssssssqqqqqqrTTTTTbbbTc3NTU1NTUsssssqqqqqqqq0000222023NTU1NTUsssssqqqqqqqq000000003NTU1NTU1LLLLLNKrTSqqqqtNNNNNNtNNTU1NSzUssss00qq0qqqqrTTTTTTTTTU1NTUs1LLLNNNKrTTTSqqq00000000001NTU1LNTU0000qtNNNKqqqtNNNNNNNNTU1NTUs1NNNNNKss1NNNK00qtK0000001NNTU0s000000qq000001NKrStNNNNK1NNNNStNNNNNKqtNNNNNNNK0000000rU0000rTTTTTSq00000rTTTTTTTTTTTTTTTTStNNNNKr/xAAUEQEAAAAAAAAAAAAAAAAAAACg/9oACAEDAQM/AAAf/9k=",v=["id"],Q=["offset"],W=["id"],F=["href"],D={in:"EDGE_INTENSITY",result:"EDGE_MASK"},w=["tableValues"],P=["scale"],Z=["scale"],O=["scale"],k=["stdDeviation"],V=e.defineComponent({__name:"GlassFilter",props:{id:{},displacementScale:{},aberrationIntensity:{},width:{},height:{}},setup(p){const t=p,r=e.computed(()=>Math.max(30,80-t.aberrationIntensity*2)),o=e.computed(()=>t.displacementScale*-1),c=e.computed(()=>t.displacementScale*(-1-t.aberrationIntensity*.05)),l=e.computed(()=>t.displacementScale*(-1-t.aberrationIntensity*.1)),b=e.computed(()=>Math.max(.1,.5-t.aberrationIntensity*.1)),E=e.computed(()=>`0 ${t.aberrationIntensity*.05} 1`);return(d,a)=>(e.openBlock(),e.createElementBlock("svg",{style:e.normalizeStyle({position:"absolute",width:t.width+"px",height:t.height+"px"}),"aria-hidden":"true"},[e.createElementVNode("defs",null,[e.createElementVNode("radialGradient",{id:`${t.id}-edge-mask`,cx:"50%",cy:"50%",r:"50%"},[a[0]||(a[0]=e.createElementVNode("stop",{offset:"0%","stop-color":"black","stop-opacity":"0"},null,-1)),e.createElementVNode("stop",{offset:`${r.value}%`,"stop-color":"black","stop-opacity":"0"},null,8,Q),a[1]||(a[1]=e.createElementVNode("stop",{offset:"100%","stop-color":"white","stop-opacity":"1"},null,-1))],8,v),e.createElementVNode("filter",{id:t.id,x:"-35%",y:"-35%",width:"170%",height:"170%","color-interpolation-filters":"sRGB"},[e.createElementVNode("feImage",{id:"feimage",x:"0",y:"0",width:"100%",height:"100%",result:"DISPLACEMENT_MAP",href:e.unref(z),preserveAspectRatio:"xMidYMid slice"},null,8,F),a[2]||(a[2]=e.createElementVNode("feColorMatrix",{in:"DISPLACEMENT_MAP",type:"matrix",values:`0.3 0.3 0.3 0 0
+                 0.3 0.3 0.3 0 0
+                 0.3 0.3 0.3 0 0
+                 0 0 0 1 0`,result:"EDGE_INTENSITY"},null,-1)),e.createElementVNode("feComponentTransfer",D,[e.createElementVNode("feFuncA",{type:"discrete",tableValues:E.value},null,8,w)]),a[3]||(a[3]=e.createElementVNode("feOffset",{in:"SourceGraphic",dx:"0",dy:"0",result:"CENTER_ORIGINAL"},null,-1)),e.createElementVNode("feDisplacementMap",{in:"SourceGraphic",in2:"DISPLACEMENT_MAP",scale:o.value,xChannelSelector:"R",yChannelSelector:"B",result:"RED_DISPLACED"},null,8,P),a[4]||(a[4]=e.createElementVNode("feColorMatrix",{in:"RED_DISPLACED",type:"matrix",values:`1 0 0 0 0
+                 0 0 0 0 0
+                 0 0 0 0 0
+                 0 0 0 1 0`,result:"RED_CHANNEL"},null,-1)),e.createElementVNode("feDisplacementMap",{in:"SourceGraphic",in2:"DISPLACEMENT_MAP",scale:c.value,xChannelSelector:"R",yChannelSelector:"B",result:"GREEN_DISPLACED"},null,8,Z),a[5]||(a[5]=e.createElementVNode("feColorMatrix",{in:"GREEN_DISPLACED",type:"matrix",values:`0 0 0 0 0
+                 0 1 0 0 0
+                 0 0 0 0 0
+                 0 0 0 1 0`,result:"GREEN_CHANNEL"},null,-1)),e.createElementVNode("feDisplacementMap",{in:"SourceGraphic",in2:"DISPLACEMENT_MAP",scale:l.value,xChannelSelector:"R",yChannelSelector:"B",result:"BLUE_DISPLACED"},null,8,O),a[6]||(a[6]=e.createElementVNode("feColorMatrix",{in:"BLUE_DISPLACED",type:"matrix",values:`0 0 0 0 0
+                 0 0 0 0 0
+                 0 0 1 0 0
+                 0 0 0 1 0`,result:"BLUE_CHANNEL"},null,-1)),a[7]||(a[7]=e.createElementVNode("feBlend",{in:"GREEN_CHANNEL",in2:"BLUE_CHANNEL",mode:"screen",result:"GB_COMBINED"},null,-1)),a[8]||(a[8]=e.createElementVNode("feBlend",{in:"RED_CHANNEL",in2:"GB_COMBINED",mode:"screen",result:"RGB_COMBINED"},null,-1)),e.createElementVNode("feGaussianBlur",{in:"RGB_COMBINED",stdDeviation:b.value,result:"ABERRATED_BLURRED"},null,8,k),a[9]||(a[9]=e.createStaticVNode('<feComposite in="ABERRATED_BLURRED" in2="EDGE_MASK" operator="in" result="EDGE_ABERRATION"></feComposite><feComponentTransfer in="EDGE_MASK" result="INVERTED_MASK"><feFuncA type="table" tableValues="1 0"></feFuncA></feComponentTransfer><feComposite in="CENTER_ORIGINAL" in2="INVERTED_MASK" operator="in" result="CENTER_CLEAN"></feComposite><feComposite in="EDGE_ABERRATION" in2="CENTER_CLEAN" operator="over"></feComposite>',4))],8,W)])],4))}}),J=((p,t)=>{const r=p.__vccOpts||p;for(const[o,c]of t)r[o]=c;return r})(e.defineComponent({__name:"GlassContainer",props:{className:{default:""},style:{default:()=>({})},displacementScale:{default:25},blurAmount:{default:12},saturation:{default:180},aberrationIntensity:{default:2},mouseOffset:{default:()=>({x:0,y:0})},active:{type:Boolean,default:!1},overLight:{type:Boolean,default:!1},cornerRadius:{default:999},padding:{default:"24px 32px"},glassSize:{default:()=>({width:270,height:69})},onClick:{}},emits:["mouse-enter","mouse-leave","mouse-down","mouse-up","click"],setup(p,{expose:t,emit:r}){const o=p,c=r,l=`glass-filter-${Math.random().toString(36).substr(2,9)}`,b=e.computed(()=>({filter:`url(#${l})`,backdropFilter:`blur(${(o.overLight?20:4)+o.blurAmount*32}px) saturate(${o.saturation}%)`})),E=e.ref(null);return t({glassContainerRef:E}),(d,a)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"glassContainerRef",ref:E,class:e.normalizeClass(`relative ${o.className} ${o.active?"active":""} ${o.onClick?"cursor-pointer":""}`),style:e.normalizeStyle(o.style),onClick:a[4]||(a[4]=f=>o.onClick&&o.onClick())},[e.createVNode(V,{id:l,displacementScale:o.displacementScale,aberrationIntensity:o.aberrationIntensity,width:o.glassSize.width,height:o.glassSize.height},null,8,["displacementScale","aberrationIntensity","width","height"]),e.createElementVNode("div",{class:"glass",style:e.normalizeStyle({borderRadius:`${o.cornerRadius}px`,position:"relative",display:"inline-flex",alignItems:"center",gap:"24px",padding:o.padding,overflow:"hidden",transition:"all 0.2s ease-in-out",boxShadow:o.overLight?"0px 16px 70px rgba(0, 0, 0, 0.75)":"0px 12px 40px rgba(0, 0, 0, 0.25)"}),onMouseenter:a[0]||(a[0]=f=>c("mouse-enter")),onMouseleave:a[1]||(a[1]=f=>c("mouse-leave")),onMousedown:a[2]||(a[2]=f=>c("mouse-down")),onMouseup:a[3]||(a[3]=f=>c("mouse-up"))},[e.createElementVNode("span",{class:"glass__warp",style:e.normalizeStyle({...b.value,position:"absolute",inset:"0"})},null,4),e.createElementVNode("div",{class:"transition-all duration-150 ease-in-out text-white",style:e.normalizeStyle({position:"relative",zIndex:1,font:"500 20px/1 system-ui",textShadow:o.overLight?"0px 2px 12px rgba(0, 0, 0, 0)":"0px 2px 12px rgba(0, 0, 0, 0.4)"})},[e.renderSlot(d.$slots,"default",{},void 0,!0)],4)],36)],6))}}),[["__scopeId","data-v-689fee6a"]]),Y=e.defineComponent({__name:"LiquidGlass",props:{displacementScale:{default:70},blurAmount:{default:.0625},saturation:{default:140},aberrationIntensity:{default:2},elasticity:{default:.15},cornerRadius:{default:999},globalMousePos:{default:void 0},mouseOffset:{default:void 0},mouseContainer:{default:null},className:{default:""},padding:{default:"24px 32px"},style:{},overLight:{type:Boolean,default:!1},onClick:{type:Function,default:()=>({})}},setup(p){const t=p,r=e.ref(null),o=e.ref(!1),c=e.ref(!1),l=e.ref({width:400,height:400}),b=e.ref({x:0,y:0}),E=e.ref({x:0,y:0}),d=e.computed(()=>t.globalMousePos||b.value),a=e.computed(()=>t.mouseOffset||E.value),f=i=>{var A;const n=t.mouseContainer||((A=r.value)==null?void 0:A.glassContainerRef);if(!n)return;const s=n.getBoundingClientRect(),N=s.left+s.width/2,m=s.top+s.height/2;E.value={x:(i.clientX-N)/s.width*100,y:(i.clientY-m)/s.height*100},b.value={x:i.clientX,y:i.clientY}};e.onMounted(()=>{const i=()=>{var n;if((n=r.value)!=null&&n.glassContainerRef){const s=r.value.glassContainerRef.getBoundingClientRect();l.value={width:s.width,height:s.height}}};return i(),window.addEventListener("resize",i),()=>window.removeEventListener("resize",i)}),e.watch([()=>t.globalMousePos,()=>t.mouseOffset,r],([i,n])=>{var N;if(i&&n)return;const s=t.mouseContainer||((N=r.value)==null?void 0:N.glassContainerRef);s&&s.addEventListener("mousemove",f)},{immediate:!0}),e.onUnmounted(()=>{});const H=e.computed(()=>{var R;if(!d.value.x||!d.value.y||!((R=r.value)!=null&&R.glassContainerRef))return 0;const i=r.value.glassContainerRef.getBoundingClientRect(),n=i.left+i.width/2,s=i.top+i.height/2,N=l.value.width,m=l.value.height,A=Math.max(0,Math.abs(d.value.x-n)-N/2),g=Math.max(0,Math.abs(d.value.y-s)-m/2),h=Math.sqrt(A*A+g*g),U=200;return h>U?0:1-h/U}),B=e.computed(()=>{var m;if(!((m=r.value)!=null&&m.glassContainerRef))return{x:0,y:0};const i=H.value,n=r.value.glassContainerRef.getBoundingClientRect(),s=n.left+n.width/2,N=n.top+n.height/2;return{x:(d.value.x-s)*t.elasticity*.1*i,y:(d.value.y-N)*t.elasticity*.1*i}}),j=e.computed(()=>{var K;if(!d.value.x||!d.value.y||!((K=r.value)!=null&&K.glassContainerRef))return"scale(1)";const i=r.value.glassContainerRef.getBoundingClientRect(),n=i.left+i.width/2,s=i.top+i.height/2,N=l.value.width,m=l.value.height,A=d.value.x-n,g=d.value.y-s,h=Math.max(0,Math.abs(A)-N/2),U=Math.max(0,Math.abs(g)-m/2),R=Math.sqrt(h*h+U*U),M=200;if(R>M)return"scale(1)";const G=1-R/M,x=Math.sqrt(A*A+g*g);if(x===0)return"scale(1)";const S=A/x,I=g/x,C=Math.min(x/300,1)*t.elasticity*G,_=1+Math.abs(S)*C*.3-Math.abs(I)*C*.15,$=1+Math.abs(I)*C*.3-Math.abs(S)*C*.15;return`scaleX(${Math.max(.8,_)}) scaleY(${Math.max(.8,$)})`}),q=e.computed(()=>`translate(calc(-50% + ${B.value.x}px), calc(-50% + ${B.value.y}px)) ${c.value&&t.onClick?"scale(0.96)":j.value}`),y=e.computed(()=>({...t.style,transform:q.value,transition:"all ease-out 0.2s"})),u=e.computed(()=>{var i,n,s;return{position:((i=t.style)==null?void 0:i.position)||"relative",top:((n=t.style)==null?void 0:n.top)||"50%",left:((s=t.style)==null?void 0:s.left)||"50%"}});return(i,n)=>{var s,N;return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createVNode(V,{id:`liquid-glass-filter-${((N=(s=r.value)==null?void 0:s.glassContainerRef)==null?void 0:N.id)||"default"}`,displacementScale:t.overLight?t.displacementScale*.5:t.displacementScale,aberrationIntensity:t.aberrationIntensity,width:l.value.width,height:l.value.height},null,8,["id","displacementScale","aberrationIntensity","width","height"]),e.createElementVNode("div",{class:e.normalizeClass(`bg-black transition-all duration-150 ease-in-out pointer-events-none ${t.overLight?"opacity-20":"opacity-0"}`),style:e.normalizeStyle({...u.value,height:l.value.height+"px",width:l.value.width+"px",borderRadius:`${t.cornerRadius}px`,transform:q.value,transition:y.value.transition})},null,6),e.createElementVNode("div",{class:e.normalizeClass(`bg-black transition-all duration-150 ease-in-out pointer-events-none mix-blend-overlay ${t.overLight?"opacity-100":"opacity-0"}`),style:e.normalizeStyle({...u.value,height:l.value.height+"px",width:l.value.width+"px",borderRadius:`${t.cornerRadius}px`,transform:q.value,transition:y.value.transition})},null,6),e.createVNode(J,{ref_key:"glassRef",ref:r,class:e.normalizeClass(t.className),style:e.normalizeStyle(y.value),cornerRadius:t.cornerRadius,displacementScale:t.overLight?t.displacementScale*.5:t.displacementScale,blurAmount:t.blurAmount,saturation:t.saturation,aberrationIntensity:t.aberrationIntensity,glassSize:l.value,padding:t.padding,mouseOffset:a.value,onMouseEnter:n[0]||(n[0]=m=>o.value=!0),onMouseLeave:n[1]||(n[1]=m=>o.value=!1),onMouseDown:n[2]||(n[2]=m=>c.value=!0),onMouseUp:n[3]||(n[3]=m=>c.value=!1),active:c.value,overLight:t.overLight,onClick:n[4]||(n[4]=m=>t.onClick&&t.onClick())},{default:e.withCtx(()=>[e.renderSlot(i.$slots,"default")]),_:3},8,["class","style","cornerRadius","displacementScale","blurAmount","saturation","aberrationIntensity","glassSize","padding","mouseOffset","active","overLight"]),e.createElementVNode("span",{style:e.normalizeStyle({...u.value,height:l.value.height+"px",width:l.value.width+"px",borderRadius:`${t.cornerRadius}px`,transform:q.value,transition:y.value.transition,pointerEvents:"none",mixBlendMode:"screen",opacity:.2,padding:"1.5px",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",WebkitMaskComposite:"xor",maskComposite:"exclude",boxShadow:"0 0 0 0.5px rgba(255, 255, 255, 0.5) inset, 0 1px 3px rgba(255, 255, 255, 0.25) inset, 0 1px 4px rgba(0, 0, 0, 0.35)",background:`linear-gradient(
+        ${135+a.value.x*1.2}deg,
+        rgba(255, 255, 255, 0.0) 0%,
+        rgba(255, 255, 255, ${.12+Math.abs(a.value.x)*.008}) ${Math.max(10,33+a.value.y*.3)}%,
+        rgba(255, 255, 255, ${.4+Math.abs(a.value.x)*.012}) ${Math.min(90,66+a.value.y*.4)}%,
+        rgba(255, 255, 255, 0.0) 100%
+      )`})},null,4),e.createElementVNode("span",{style:e.normalizeStyle({...u.value,height:l.value.height+"px",width:l.value.width+"px",borderRadius:`${t.cornerRadius}px`,transform:q.value,transition:y.value.transition,pointerEvents:"none",mixBlendMode:"overlay",padding:"1.5px",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",WebkitMaskComposite:"xor",maskComposite:"exclude",boxShadow:"0 0 0 0.5px rgba(255, 255, 255, 0.5) inset, 0 1px 3px rgba(255, 255, 255, 0.25) inset, 0 1px 4px rgba(0, 0, 0, 0.35)",background:`linear-gradient(
+        ${135+a.value.x*1.2}deg,
+        rgba(255, 255, 255, 0.0) 0%,
+        rgba(255, 255, 255, ${.32+Math.abs(a.value.x)*.008}) ${Math.max(10,33+a.value.y*.3)}%,
+        rgba(255, 255, 255, ${.6+Math.abs(a.value.x)*.012}) ${Math.min(90,66+a.value.y*.4)}%,
+        rgba(255, 255, 255, 0.0) 100%
+      )`})},null,4),t.onClick?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("div",{style:e.normalizeStyle({...u.value,height:l.value.height+"px",width:l.value.width+1+"px",borderRadius:`${t.cornerRadius}px`,transform:q.value,pointerEvents:"none",transition:"all 0.2s ease-out",opacity:o.value||c.value?.5:0,backgroundImage:"radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 50%)",mixBlendMode:"overlay"})},null,4),e.createElementVNode("div",{style:e.normalizeStyle({...u.value,height:l.value.height+"px",width:l.value.width+1+"px",borderRadius:`${t.cornerRadius}px`,transform:q.value,pointerEvents:"none",transition:"all 0.2s ease-out",opacity:c.value?.5:0,backgroundImage:"radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 80%)",mixBlendMode:"overlay"})},null,4),e.createElementVNode("div",{style:e.normalizeStyle({...y.value,height:l.value.height+"px",width:l.value.width+1+"px",borderRadius:`${t.cornerRadius}px`,position:u.value.position,top:u.value.top,left:u.value.left,pointerEvents:"none",transition:"all 0.2s ease-out",opacity:o.value?.4:c.value?.8:0,backgroundImage:"radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%)",mixBlendMode:"overlay"})},null,4)],64)):e.createCommentVNode("",!0)],64)}}}),L=e.defineComponent({__name:"App",setup(p){return(t,r)=>(e.openBlock(),e.createBlock(Y))}});e.createApp(L).mount("#app"),T.App=L,Object.defineProperty(T,Symbol.toStringTag,{value:"Module"})});
+//# sourceMappingURL=index.umd.cjs.map

package/dist/index.umd.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.umd.cjs","sources":["../src/assets/ts/utils.ts","../src/components/GlassFilter.vue","../src/components/GlassContainer.vue","../src/components/LiquidGlass.vue","../src/App.vue","../src/main.ts"],"sourcesContent":["export const displacementMap =\n  \"data:image/jpeg;base64,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cUAUAkEkziomgGgkoxZGgxZFQFQlYnQHRdPfj/10KCSCKESCNiVkViPSLpD0h6I0Q0I0A2IoBWBIJIBKBIJoJIJ2R2J0JWBUJ0JUB0XTv479dFZDYiglYigkhEgjZFQjRFQjRFQjQigFYigHYigmgEgmglYlYnQlQlYlQHQlQnQ9P/kf1yVkNiNCNkNiVENiNiViNEViNkVCVgKCViViViSCViSCVgdCViVCViVCdgVCVCdD1D+U/XBWQ2I0I2Q2JUQ2I0JWQ0I2JUQ2JUI2JUI2J0JWJWJWA2R0BWJ0I2JUJ2BUJUJ0P//EABkQAQEBAQEBAAAAAAAAAAAAAAECABEDEP/aAAgBAQABAgB1atWrVq1atWrVq1atWrVq1atWrVq1atWrVq+OrVq1atWrVq1atWrVq1atWrVq1atWrVq1atXxVppppppdWrVq1atWrVq1NNNNNNNNNNNPVWmmmmms6tWrVq1atWpppppppppppppp6q0000uc51atWrVq1ammmmmmmmmmmmmt1Vpppc5znVq1atWrVqaaaaaaaaaaaaaeqtNLnOc51atWrVq1ammmmmmmmmmmmmnqrS5znOc6tWrVq16222mmmmmmlVppp6tKuc5znOrVq1a9TbbbbTTTTTSq000qtLnOc5zq1atWrW0222200000qqqtKqrnOc5zq1atTbbbbbbbbTTTSqqqqqq5znOc6tTTTbbbbbbbbTTTSqqqqrlVznOctNNNtttttttttNNNNKqqqrqznKqrTTTTbbbbbbbbbTTTSqqqqrqznOc5aaaabbbbbbbbbaaaaVVVVVdWc5znVq1NNttttttttttNNKqqqqudWc5znVq16tbbbbbbbbbbTTSqqqq5XVnOc6tWrVrb1tttttttttNNKqqqqrWrK5VWmmm2230bbbbbbaaaXOc5zlVa1KuVVppptttt9G22222mmlzlVznK6tWVVWmmmm2222222222mlznOc5znLWppVVWmmm22222229bTWrOc5znOcq1qaaVpWmm222222229erVqznOc5znKtatStK0rTbTTbbbberXr1as5znOc5aVpppppWlabaabbbb1ta9WrVnOc5znU0rTTTTTTTTTbTTbbbTWvVq1as5znOdTTStNNNNNNNNNtNNtttN6tWvVq1ZznOrU00rTTTTTTTTTTTTTbTWvVq1atWrOc6tTTTStNNNNNNNNNNtNNtNa9WrVq1Z1Z1NNNNNK1q1NNNNNNNNNNNtNatWrVq1atWrU00000rWrVq1atWrVq1alaaa1atWrVq1NNNammmmla1atWrVq1aterVq16tWrVnVqa1NK1qaaaVX/xAAWEAADAAAAAAAAAAAAAAAAAAAhgJD/2gAIAQEAAz8AaExf/8QAGhEBAQEBAQEBAAAAAAAAAAAAAQISEQADEP/aAAgBAgEBAgDx48ePHjx48ePHjx48ePHjx48ePHjx48ePHj86IiIiIiInjx48ePHjx48IiIiIj0oooooooooRERER73ve60UUUUUUVrWiiiiiihERERER73ve97ooooorRWiiiiihKERERER73ve973RRRRWtFFFFFFCIiIiIiPe973ve60UUVrRRRRRRQiIlCIiI973ve973pRRWiiiiiiiiiiiiiiihEe973ve973RRWtFFFFFFFFFFFFFFFFFFa13ve973WitaKKKKKKKKKKKKKKKKKK1rWtd1rutFa1oooooooooooosssooorWta1rWta1rRRRRRRRRRRZZZZZZZZZWta1rWta1rRRRRRRRRZZZZZZZZZZZZe9a1rWta1rWitaKLLLLLLLLLLLLLLLLL3rWta1rWtFbLLLLLLLLLLLLLLLLLLLL3vWta1rWita1ssssssss+hZZZZZZZZe961rWta0Vre97LLLLLLLLLLLPoWWWWWXrWta1oorWta3ssss+hZZZZ9Cyyyyyyyyiita1orWta1ve9llllllllllllllllFFa0VorWta1ve9llllllllllllllllllFFFaK1rWta1rWiyyyyyyyyyyyyiiiiiiitFFa1rWta1oosoosssssoooosoooorRRRWta1rWta0UUUUUWUUUUUUUUUUUVoooorWta1rWtaKKKKKKmiiiiiiiiiiiiiiitd73ve61oSiiipoqaKKKKKKKKKK0UUUVrve973vREREZoSihEooooorRRRRWtd73ve9EREREREoSiiiiitFllllla73ve9ERERERESiiiiiitH0PoWWWWVrXe96IiIiMoiJRRRRRRWjwlFFllllFFd6IiIiIlCUUUUUUUUUePHjx48ePCIiIiIiIiUUUUUUUUUUUePHjx48ePHjx48ePHjx48IiUUUUUUJRRRX//xAAWEQADAAAAAAAAAAAAAAAAAAABYJD/2gAIAQIBAz8AtEV7/8QAFxEBAQEBAAAAAAAAAAAAAAAAAAECEP/aAAgBAwEBAgCtNNNNNNNNNNNNNNNNNNNNNNNNNNNNNcrTTTTTTTTTTTTTTTTTTTTTTTTTTTTTXKrTTTTTTTU000000000000000000001FVpppppqampqaaaaaaaaaaaaaaaaaaaa5Vaaaaampqampqammmmmmmmmmmlaaaaaaiq0001NTU1NTU1NTTTTTTTTTTSqqtNNNcqtNNSyzU1LNTU1NTTTTTTTTTSqqq001ytNLLLLNTU1NTU1NTbbbTTTTTSqqq001ytNLLLLLNTU1NTU3NttttNNNNNKqq001KrSyyyyyzU1NTU3Nzc02220000qqqqrSqqyyyyyzU1NTU3Nzc3NttttNNNKqqqqqqssssss1NTU3Nzc3NzbbbbTTTSqqqqqqrLLLLLNTU1Nzc3Nzc22220000qqqqqqqqssss1NTU3Nzc3NzbbbbbTTSqqqqqqqqqqzU1NTc3Nzc3Nzbc22000qqqqqqqqqqqtTU3Nzc3Nzc3NtzbTTSqqqqrKqqqqqtNNzc23Nzc3Nzc3NTU1KqqqrKqqqqqtNNNNttzc3Nzc3NzU1NLLLLLKqqqqqqqq0022223Nzc3NzU1NSyyyyyyqqqqqqqrTTbbbbc3Nzc3NTU1LLLLLLKsqqqqqqrTTTTbbbc3Nzc1NTUsssssssqqqqqqrTTTTTbbbTc3NTU1NTUsssssqqqqqqqq0000222023NTU1NTUsssssqqqqqqqq000000003NTU1NTU1LLLLLNKrTSqqqqtNNNNNNtNNTU1NSzUssss00qq0qqqqrTTTTTTTTTU1NTUs1LLLNNNKrTTTSqqq00000000001NTU1LNTU0000qtNNNKqqqtNNNNNNNNTU1NTUs1NNNNNKss1NNNK00qtK0000001NNTU0s000000qq000001NKrStNNNNK1NNNNStNNNNNKqtNNNNNNNK0000000rU0000rTTTTTSq00000rTTTTTTTTTTTTTTTTStNNNNKr/xAAUEQEAAAAAAAAAAAAAAAAAAACg/9oACAEDAQM/AAAf/9k=\"\n","<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { displacementMap } from '../assets/ts/utils';\n\nconst props = defineProps<{\n  id: string;\n  displacementScale: number;\n  aberrationIntensity: number;\n  width: number;\n  height: number;\n}>();\n\nconst edgeMaskOffset = computed(() => {\n  return Math.max(30, 80 - props.aberrationIntensity * 2);\n});\n\nconst redDisplacementScale = computed(() => {\n  return props.displacementScale * -1;\n});\n\nconst greenDisplacementScale = computed(() => {\n  return props.displacementScale * (-1 - props.aberrationIntensity * 0.05);\n});\n\nconst blueDisplacementScale = computed(() => {\n  return props.displacementScale * (-1 - props.aberrationIntensity * 0.1);\n});\n\nconst gaussianBlurStdDeviation = computed(() => {\n  return Math.max(0.1, 0.5 - props.aberrationIntensity * 0.1);\n});\n\nconst feFuncATableValues = computed(() => {\n  return `0 ${props.aberrationIntensity * 0.05} 1`;\n});\n\n</script>\n\n<template>\n  <svg :style=\"{ position: 'absolute', width: props.width + 'px', height: props.height + 'px' }\" aria-hidden=\"true\">\n    <defs>\n      <radialGradient :id=\"`${props.id}-edge-mask`\" cx=\"50%\" cy=\"50%\" r=\"50%\">\n        <stop offset=\"0%\" stop-color=\"black\" stop-opacity=\"0\" />\n        <stop :offset=\"`${edgeMaskOffset}%`\" stop-color=\"black\" stop-opacity=\"0\" />\n        <stop offset=\"100%\" stop-color=\"white\" stop-opacity=\"1\" />\n      </radialGradient>\n      <filter :id=\"props.id\" x=\"-35%\" y=\"-35%\" width=\"170%\" height=\"170%\" color-interpolation-filters=\"sRGB\">\n        <feImage id=\"feimage\" x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" result=\"DISPLACEMENT_MAP\" :href=\"displacementMap\" preserveAspectRatio=\"xMidYMid slice\" />\n\n        <!-- Create edge mask using the displacement map itself -->\n        <feColorMatrix\n          in=\"DISPLACEMENT_MAP\"\n          type=\"matrix\"\n          values=\"0.3 0.3 0.3 0 0\n                 0.3 0.3 0.3 0 0\n                 0.3 0.3 0.3 0 0\n                 0 0 0 1 0\"\n          result=\"EDGE_INTENSITY\"\n        />\n        <feComponentTransfer in=\"EDGE_INTENSITY\" result=\"EDGE_MASK\">\n          <feFuncA type=\"discrete\" :tableValues=\"feFuncATableValues\" />\n        </feComponentTransfer>\n\n        <!-- Original undisplaced image for center -->\n        <feOffset in=\"SourceGraphic\" dx=\"0\" dy=\"0\" result=\"CENTER_ORIGINAL\" />\n\n        <!-- Red channel displacement with slight offset -->\n        <feDisplacementMap in=\"SourceGraphic\" in2=\"DISPLACEMENT_MAP\" :scale=\"redDisplacementScale\" xChannelSelector=\"R\" yChannelSelector=\"B\" result=\"RED_DISPLACED\" />\n        <feColorMatrix\n          in=\"RED_DISPLACED\"\n          type=\"matrix\"\n          values=\"1 0 0 0 0\n                 0 0 0 0 0\n                 0 0 0 0 0\n                 0 0 0 1 0\"\n          result=\"RED_CHANNEL\"\n        />\n\n        <!-- Green channel displacement -->\n        <feDisplacementMap in=\"SourceGraphic\" in2=\"DISPLACEMENT_MAP\" :scale=\"greenDisplacementScale\" xChannelSelector=\"R\" yChannelSelector=\"B\" result=\"GREEN_DISPLACED\" />\n        <feColorMatrix\n          in=\"GREEN_DISPLACED\"\n          type=\"matrix\"\n          values=\"0 0 0 0 0\n                 0 1 0 0 0\n                 0 0 0 0 0\n                 0 0 0 1 0\"\n          result=\"GREEN_CHANNEL\"\n        />\n\n        <!-- Blue channel displacement with slight offset -->\n        <feDisplacementMap in=\"SourceGraphic\" in2=\"DISPLACEMENT_MAP\" :scale=\"blueDisplacementScale\" xChannelSelector=\"R\" yChannelSelector=\"B\" result=\"BLUE_DISPLACED\" />\n        <feColorMatrix\n          in=\"BLUE_DISPLACED\"\n          type=\"matrix\"\n          values=\"0 0 0 0 0\n                 0 0 0 0 0\n                 0 0 1 0 0\n                 0 0 0 1 0\"\n          result=\"BLUE_CHANNEL\"\n        />\n\n        <!-- Combine all channels with screen blend mode for chromatic aberration -->\n        <feBlend in=\"GREEN_CHANNEL\" in2=\"BLUE_CHANNEL\" mode=\"screen\" result=\"GB_COMBINED\" />\n        <feBlend in=\"RED_CHANNEL\" in2=\"GB_COMBINED\" mode=\"screen\" result=\"RGB_COMBINED\" />\n\n        <!-- Add slight blur to soften the aberration effect -->\n        <feGaussianBlur in=\"RGB_COMBINED\" :stdDeviation=\"gaussianBlurStdDeviation\" result=\"ABERRATED_BLURRED\" />\n\n        <!-- Apply edge mask to aberration effect -->\n        <feComposite in=\"ABERRATED_BLURRED\" in2=\"EDGE_MASK\" operator=\"in\" result=\"EDGE_ABERRATION\" />\n\n        <!-- Create inverted mask for center -->\n        <feComponentTransfer in=\"EDGE_MASK\" result=\"INVERTED_MASK\">\n          <feFuncA type=\"table\" tableValues=\"1 0\" />\n        </feComponentTransfer>\n        <feComposite in=\"CENTER_ORIGINAL\" in2=\"INVERTED_MASK\" operator=\"in\" result=\"CENTER_CLEAN\" />\n\n        <!-- Combine edge aberration with clean center -->\n        <feComposite in=\"EDGE_ABERRATION\" in2=\"CENTER_CLEAN\" operator=\"over\" />\n      </filter>\n    </defs>\n  </svg>\n</template>\n","<script setup lang=\"ts\">\nimport { ref, computed } from 'vue';\nimport GlassFilter from './GlassFilter.vue';\n\ninterface GlassContainerProps {\n  className?: string;\n  style?: Record<string, any>;\n  displacementScale?: number;\n  blurAmount?: number;\n  saturation?: number;\n  aberrationIntensity?: number;\n  mouseOffset?: { x: number; y: number };\n  active?: boolean;\n  overLight?: boolean;\n  cornerRadius?: number;\n  padding?: string;\n  glassSize?: { width: number; height: number };\n  onClick?: () => void;\n}\n\nconst props = withDefaults(defineProps<GlassContainerProps>(), {\n  className: '',\n  style: () => ({}),\n  displacementScale: 25,\n  blurAmount: 12,\n  saturation: 180,\n  aberrationIntensity: 2,\n  mouseOffset: () => ({ x: 0, y: 0 }),\n  active: false,\n  overLight: false,\n  cornerRadius: 999,\n  padding: '24px 32px',\n  glassSize: () => ({ width: 270, height: 69 }),\n});\n\nconst emit = defineEmits<{\n  (e: 'mouse-enter'): void;\n  (e: 'mouse-leave'): void;\n  (e: 'mouse-down'): void;\n  (e: 'mouse-up'): void;\n  (e: 'click'): void;\n}>();\n\nconst filterId = `glass-filter-${Math.random().toString(36).substr(2, 9)}`;\n\nconst backdropStyle = computed(() => ({\n  filter: `url(#${filterId})`,\n  backdropFilter: `blur(${(props.overLight ? 20 : 4) + props.blurAmount * 32}px) saturate(${props.saturation}%)`,\n}));\n\n// Expose the ref for parent components to access\nconst glassContainerRef = ref<HTMLDivElement | null>(null);\ndefineExpose({ glassContainerRef });\n</script>\n\n<template>\n  <div\n    ref=\"glassContainerRef\"\n    :class=\"`relative ${props.className} ${props.active ? 'active' : ''} ${Boolean(props.onClick) ? 'cursor-pointer' : ''}`\"\n    :style=\"props.style\"\n    @click=\"props.onClick && props.onClick()\"\n  >\n    <GlassFilter\n      :id=\"filterId\"\n      :displacementScale=\"props.displacementScale\"\n      :aberrationIntensity=\"props.aberrationIntensity\"\n      :width=\"props.glassSize.width\"\n      :height=\"props.glassSize.height\"\n    />\n\n    <div\n      class=\"glass\"\n      :style=\"{\n        borderRadius: `${props.cornerRadius}px`,\n        position: 'relative',\n        display: 'inline-flex',\n        alignItems: 'center',\n        gap: '24px',\n        padding: props.padding,\n        overflow: 'hidden',\n        transition: 'all 0.2s ease-in-out',\n        boxShadow: props.overLight ? '0px 16px 70px rgba(0, 0, 0, 0.75)' : '0px 12px 40px rgba(0, 0, 0, 0.25)',\n      }\"\n      @mouseenter=\"emit('mouse-enter')\"\n      @mouseleave=\"emit('mouse-leave')\"\n      @mousedown=\"emit('mouse-down')\"\n      @mouseup=\"emit('mouse-up')\"\n    >\n      <!-- backdrop layer that gets wiggly -->\n      <span\n        class=\"glass__warp\"\n        :style=\"{\n          ...backdropStyle,\n          position: 'absolute',\n          inset: '0',\n        }\"\n      />\n\n      <!-- user content stays sharp -->\n      <div\n        class=\"transition-all duration-150 ease-in-out text-white\"\n        :style=\"{\n          position: 'relative',\n          zIndex: 1,\n          font: '500 20px/1 system-ui',\n          textShadow: props.overLight ? '0px 2px 12px rgba(0, 0, 0, 0)' : '0px 2px 12px rgba(0, 0, 0, 0.4)',\n        }\"\n      >\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n\n<style scoped>\n/* Add any specific styles for this component here if needed */\n</style> ","<script setup lang=\"ts\">\nimport { ref, computed, watch, onMounted, onUnmounted } from 'vue';\nimport GlassContainer from './GlassContainer.vue';\nimport GlassFilter from './GlassFilter.vue';\n\ninterface LiquidGlassProps {\n  displacementScale?: number;\n  blurAmount?: number;\n  saturation?: number;\n  aberrationIntensity?: number;\n  elasticity?: number;\n  cornerRadius?: number;\n  globalMousePos?: { x: number; y: number };\n  mouseOffset?: { x: number; y: number };\n  mouseContainer?: HTMLElement | null;\n  className?: string;\n  padding?: string;\n  style?: Record<string, any>;\n  overLight?: boolean;\n  onClick?: () => void;\n}\n\nconst props = withDefaults(defineProps<LiquidGlassProps>(), {\n  displacementScale: 70,\n  blurAmount: 0.0625,\n  saturation: 140,\n  aberrationIntensity: 2,\n  elasticity: 0.15,\n  cornerRadius: 999,\n  globalMousePos: undefined,\n  mouseOffset: undefined,\n  mouseContainer: null,\n  className: '',\n  padding: '24px 32px',\n  overLight: false,\n  onClick: () => ({}),\n});\n\nconst glassRef = ref<InstanceType<typeof GlassContainer> | null>(null);\nconst isHovered = ref(false);\nconst isActive = ref(false);\nconst glassSize = ref({ width: 400, height: 400 });\nconst internalGlobalMousePos = ref({ x: 0, y: 0 });\nconst internalMouseOffset = ref({ x: 0, y: 0 });\n\nconst globalMousePos = computed(() => props.globalMousePos || internalGlobalMousePos.value);\nconst mouseOffset = computed(() => props.mouseOffset || internalMouseOffset.value);\n\nconst handleMouseMove = (e: MouseEvent) => {\n  const container = props.mouseContainer || glassRef.value?.glassContainerRef;\n  if (!container) return;\n\n  const rect = container.getBoundingClientRect();\n  const centerX = rect.left + rect.width / 2;\n  const centerY = rect.top + rect.height / 2;\n\n  internalMouseOffset.value = {\n    x: ((e.clientX - centerX) / rect.width) * 100,\n    y: ((e.clientY - centerY) / rect.height) * 100,\n  };\n\n  internalGlobalMousePos.value = {\n    x: e.clientX,\n    y: e.clientY,\n  };\n};\n\nonMounted(() => {\n  const updateGlassSize = () => {\n    if (glassRef.value?.glassContainerRef) {\n      const rect = glassRef.value.glassContainerRef.getBoundingClientRect();\n      glassSize.value = { width: rect.width, height: rect.height };\n    }\n  };\n\n  updateGlassSize();\n  window.addEventListener('resize', updateGlassSize);\n\n  return () => window.removeEventListener('resize', updateGlassSize);\n});\n\nwatch([() => props.globalMousePos, () => props.mouseOffset, glassRef], ([newGlobalMousePos, newMouseOffset]) => {\n  if (newGlobalMousePos && newMouseOffset) {\n    return;\n  }\n\n  const container = props.mouseContainer || glassRef.value?.glassContainerRef;\n  if (!container) return;\n\n  container.addEventListener('mousemove', handleMouseMove);\n\n}, { immediate: true });\n\nonUnmounted(() => {\n  // container.removeEventListener('mousemove', handleMouseMove);\n});\n\nconst calculateFadeInFactor = computed(() => {\n  if (!globalMousePos.value.x || !globalMousePos.value.y || !glassRef.value?.glassContainerRef) {\n    return 0;\n  }\n\n  const rect = glassRef.value.glassContainerRef.getBoundingClientRect();\n  const pillCenterX = rect.left + rect.width / 2;\n  const pillCenterY = rect.top + rect.height / 2;\n  const pillWidth = glassSize.value.width;\n  const pillHeight = glassSize.value.height;\n\n  const edgeDistanceX = Math.max(0, Math.abs(globalMousePos.value.x - pillCenterX) - pillWidth / 2);\n  const edgeDistanceY = Math.max(0, Math.abs(globalMousePos.value.y - pillCenterY) - pillHeight / 2);\n  const edgeDistance = Math.sqrt(edgeDistanceX * edgeDistanceX + edgeDistanceY * edgeDistanceY);\n\n  const activationZone = 200;\n  return edgeDistance > activationZone ? 0 : 1 - edgeDistance / activationZone;\n});\n\nconst calculateElasticTranslation = computed(() => {\n  if (!glassRef.value?.glassContainerRef) {\n    return { x: 0, y: 0 };\n  }\n\n  const fadeInFactor = calculateFadeInFactor.value;\n  const rect = glassRef.value.glassContainerRef.getBoundingClientRect();\n  const pillCenterX = rect.left + rect.width / 2;\n  const pillCenterY = rect.top + rect.height / 2;\n\n  return {\n    x: (globalMousePos.value.x - pillCenterX) * props.elasticity * 0.1 * fadeInFactor,\n    y: (globalMousePos.value.y - pillCenterY) * props.elasticity * 0.1 * fadeInFactor,\n  };\n});\n\nconst calculateDirectionalScale = computed(() => {\n  if (!globalMousePos.value.x || !globalMousePos.value.y || !glassRef.value?.glassContainerRef) {\n    return \"scale(1)\";\n  }\n\n  const rect = glassRef.value.glassContainerRef.getBoundingClientRect();\n  const pillCenterX = rect.left + rect.width / 2;\n  const pillCenterY = rect.top + rect.height / 2;\n  const pillWidth = glassSize.value.width;\n  const pillHeight = glassSize.value.height;\n\n  const deltaX = globalMousePos.value.x - pillCenterX;\n  const deltaY = globalMousePos.value.y - pillCenterY;\n\n  const edgeDistanceX = Math.max(0, Math.abs(deltaX) - pillWidth / 2);\n  const edgeDistanceY = Math.max(0, Math.abs(deltaY) - pillHeight / 2);\n  const edgeDistance = Math.sqrt(edgeDistanceX * edgeDistanceX + edgeDistanceY * edgeDistanceY);\n\n  const activationZone = 200;\n\n  if (edgeDistance > activationZone) {\n    return \"scale(1)\";\n  }\n\n  const fadeInFactor = 1 - edgeDistance / activationZone;\n\n  const centerDistance = Math.sqrt(deltaX * deltaX + deltaY * deltaY);\n  if (centerDistance === 0) {\n    return \"scale(1)\";\n  }\n\n  const normalizedX = deltaX / centerDistance;\n  const normalizedY = deltaY / centerDistance;\n\n  const stretchIntensity = Math.min(centerDistance / 300, 1) * props.elasticity * fadeInFactor;\n\n  const scaleX = 1 + Math.abs(normalizedX) * stretchIntensity * 0.3 - Math.abs(normalizedY) * stretchIntensity * 0.15;\n\n  const scaleY = 1 + Math.abs(normalizedY) * stretchIntensity * 0.3 - Math.abs(normalizedX) * stretchIntensity * 0.15;\n\n  return `scaleX(${Math.max(0.8, scaleX)}) scaleY(${Math.max(0.8, scaleY)})`;\n});\n\nconst transformStyle = computed(() => {\n  return `translate(calc(-50% + ${calculateElasticTranslation.value.x}px), calc(-50% + ${calculateElasticTranslation.value.y}px)) ${(isActive.value && Boolean(props.onClick)) ? \"scale(0.96)\" : calculateDirectionalScale.value}`;\n});\n\nconst baseStyle = computed(() => ({\n  ...props.style,\n  transform: transformStyle.value,\n  transition: \"all ease-out 0.2s\",\n}));\n\nconst positionStyles = computed(() => ({\n  position: props.style?.position || \"relative\",\n  top: props.style?.top || \"50%\",\n  left: props.style?.left || \"50%\",\n}));\n</script>\n\n<template>\n  <GlassFilter\n    :id=\"`liquid-glass-filter-${glassRef?.glassContainerRef?.id || 'default'}`\"\n    :displacementScale=\"props.overLight ? props.displacementScale * 0.5 : props.displacementScale\"\n    :aberrationIntensity=\"props.aberrationIntensity\"\n    :width=\"glassSize.width\"\n    :height=\"glassSize.height\"\n  /> \n  <!-- Over light effect -->\n  <div\n    :class=\"`bg-black transition-all duration-150 ease-in-out pointer-events-none ${props.overLight ? 'opacity-20' : 'opacity-0'}`\"\n    :style=\"{\n      ...positionStyles,\n      height: glassSize.height + 'px',\n      width: glassSize.width + 'px',\n      borderRadius: `${props.cornerRadius}px`,\n      transform: transformStyle,\n      transition: baseStyle.transition,\n    }\"\n  />\n  <div\n    :class=\"`bg-black transition-all duration-150 ease-in-out pointer-events-none mix-blend-overlay ${props.overLight ? 'opacity-100' : 'opacity-0'}`\"\n    :style=\"{\n      ...positionStyles,\n      height: glassSize.height + 'px',\n      width: glassSize.width + 'px',\n      borderRadius: `${props.cornerRadius}px`,\n      transform: transformStyle,\n      transition: baseStyle.transition,\n    }\"\n  />\n\n  <GlassContainer\n    ref=\"glassRef\"\n    :class=\"props.className\"\n    :style=\"baseStyle\"\n    :cornerRadius=\"props.cornerRadius\"\n    :displacementScale=\"props.overLight ? props.displacementScale * 0.5 : props.displacementScale\"\n    :blurAmount=\"props.blurAmount\"\n    :saturation=\"props.saturation\"\n    :aberrationIntensity=\"props.aberrationIntensity\"\n    :glassSize=\"glassSize\"\n    :padding=\"props.padding\"\n    :mouseOffset=\"mouseOffset\"\n    @mouse-enter=\"isHovered = true\"\n    @mouse-leave=\"isHovered = false\"\n    @mouse-down=\"isActive = true\"\n    @mouse-up=\"isActive = false\"\n    :active=\"isActive\"\n    :overLight=\"props.overLight\"\n    @click=\"props.onClick && props.onClick()\"\n  >\n    <slot />\n  </GlassContainer>\n\n  <!-- Border layer 1 - extracted from glass container -->\n  <span\n    :style=\"{\n      ...positionStyles,\n      height: glassSize.height + 'px',\n      width: glassSize.width + 'px',\n      borderRadius: `${props.cornerRadius}px`,\n      transform: transformStyle,\n      transition: baseStyle.transition,\n      pointerEvents: 'none',\n      mixBlendMode: 'screen',\n      opacity: 0.2,\n      padding: '1.5px',\n      WebkitMask: 'linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)',\n      WebkitMaskComposite: 'xor',\n      maskComposite: 'exclude',\n      boxShadow: '0 0 0 0.5px rgba(255, 255, 255, 0.5) inset, 0 1px 3px rgba(255, 255, 255, 0.25) inset, 0 1px 4px rgba(0, 0, 0, 0.35)',\n      background: `linear-gradient(\n        ${135 + mouseOffset.x * 1.2}deg,\n        rgba(255, 255, 255, 0.0) 0%,\n        rgba(255, 255, 255, ${0.12 + Math.abs(mouseOffset.x) * 0.008}) ${Math.max(10, 33 + mouseOffset.y * 0.3)}%,\n        rgba(255, 255, 255, ${0.4 + Math.abs(mouseOffset.x) * 0.012}) ${Math.min(90, 66 + mouseOffset.y * 0.4)}%,\n        rgba(255, 255, 255, 0.0) 100%\n      )`,\n    }\"\n  />\n\n  <!-- Border layer 2 - duplicate with mix-blend-overlay -->\n  <span\n    :style=\"{\n      ...positionStyles,\n      height: glassSize.height + 'px',\n      width: glassSize.width + 'px',\n      borderRadius: `${props.cornerRadius}px`,\n      transform: transformStyle,\n      transition: baseStyle.transition,\n      pointerEvents: 'none',\n      mixBlendMode: 'overlay',\n      padding: '1.5px',\n      WebkitMask: 'linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)',\n      WebkitMaskComposite: 'xor',\n      maskComposite: 'exclude',\n      boxShadow: '0 0 0 0.5px rgba(255, 255, 255, 0.5) inset, 0 1px 3px rgba(255, 255, 255, 0.25) inset, 0 1px 4px rgba(0, 0, 0, 0.35)',\n      background: `linear-gradient(\n        ${135 + mouseOffset.x * 1.2}deg,\n        rgba(255, 255, 255, 0.0) 0%,\n        rgba(255, 255, 255, ${0.32 + Math.abs(mouseOffset.x) * 0.008}) ${Math.max(10, 33 + mouseOffset.y * 0.3)}%,\n        rgba(255, 255, 255, ${0.6 + Math.abs(mouseOffset.x) * 0.012}) ${Math.min(90, 66 + mouseOffset.y * 0.4)}%,\n        rgba(255, 255, 255, 0.0) 100%\n      )`,\n    }\"\n  />\n\n  <!-- Hover effects -->\n  <template v-if=\"Boolean(props.onClick)\">\n    <div\n      :style=\"{\n        ...positionStyles,\n        height: glassSize.height + 'px',\n        width: glassSize.width + 1 + 'px',\n        borderRadius: `${props.cornerRadius}px`,\n        transform: transformStyle,\n        pointerEvents: 'none',\n        transition: 'all 0.2s ease-out',\n        opacity: isHovered || isActive ? 0.5 : 0,\n        backgroundImage: 'radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 50%)',\n        mixBlendMode: 'overlay',\n      }\"\n    />\n    <div\n      :style=\"{\n        ...positionStyles,\n        height: glassSize.height + 'px',\n        width: glassSize.width + 1 + 'px',\n        borderRadius: `${props.cornerRadius}px`,\n        transform: transformStyle,\n        pointerEvents: 'none',\n        transition: 'all 0.2s ease-out',\n        opacity: isActive ? 0.5 : 0,\n        backgroundImage: 'radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 80%)',\n        mixBlendMode: 'overlay',\n      }\"\n    />\n    <div\n      :style=\"{\n        ...baseStyle,\n        height: glassSize.height + 'px',\n        width: glassSize.width + 1 + 'px',\n        borderRadius: `${props.cornerRadius}px`,\n        position: positionStyles.position,\n        top: positionStyles.top,\n        left: positionStyles.left,\n        pointerEvents: 'none',\n        transition: 'all 0.2s ease-out',\n        opacity: isHovered ? 0.4 : isActive ? 0.8 : 0,\n        backgroundImage: 'radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%)',\n        mixBlendMode: 'overlay',\n      }\"\n    />\n  </template>\n</template>","<script setup lang=\"ts\">\nimport LiquidGlass from '@/components/LiquidGlass.vue';\n</script>\n\n<template>\n  <LiquidGlass />\n</template>\n","export { default as App } from '@/App.vue'\n\nimport { createApp } from 'vue';\nimport App from '@/App.vue';\n\ncreateApp(App).mount('#app'); "],"names":["displacementMap","props","__props","edgeMaskOffset","computed","redDisplacementScale","greenDisplacementScale","blueDisplacementScale","gaussianBlurStdDeviation","feFuncATableValues","_createElementBlock","_createElementVNode","_unref","_hoisted_5","emit","__emit","filterId","backdropStyle","glassContainerRef","ref","__expose","_normalizeClass","_normalizeStyle","_createVNode","GlassFilter","_renderSlot","_ctx","glassRef","isHovered","isActive","glassSize","internalGlobalMousePos","internalMouseOffset","globalMousePos","mouseOffset","handleMouseMove","e","container","_a","rect","centerX","centerY","onMounted","updateGlassSize","watch","newGlobalMousePos","newMouseOffset","onUnmounted","calculateFadeInFactor","pillCenterX","pillCenterY","pillWidth","pillHeight","edgeDistanceX","edgeDistanceY","edgeDistance","activationZone","calculateElasticTranslation","fadeInFactor","calculateDirectionalScale","deltaX","deltaY","centerDistance","normalizedX","normalizedY","stretchIntensity","scaleX","scaleY","transformStyle","baseStyle","positionStyles","_b","_c","GlassContainer","_Fragment","_createBlock","LiquidGlass","createApp","App"],"mappings":"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"}

package/dist/types/App.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/types/assets/ts/utils.d.ts

@@ -0,0 +1 @@
+export declare const displacementMap = "data:image/jpeg;base64,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cUAUAkEkziomgGgkoxZGgxZFQFQlYnQHRdPfj/10KCSCKESCNiVkViPSLpD0h6I0Q0I0A2IoBWBIJIBKBIJoJIJ2R2J0JWBUJ0JUB0XTv479dFZDYiglYigkhEgjZFQjRFQjRFQjQigFYigHYigmgEgmglYlYnQlQlYlQHQlQnQ9P/kf1yVkNiNCNkNiVENiNiViNEViNkVCVgKCViViViSCViSCVgdCViVCViVCdgVCVCdD1D+U/XBWQ2I0I2Q2JUQ2I0JWQ0I2JUQ2JUI2JUI2J0JWJWJWA2R0BWJ0I2JUJ2BUJUJ0P//EABkQAQEBAQEBAAAAAAAAAAAAAAECABEDEP/aAAgBAQABAgB1atWrVq1atWrVq1atWrVq1atWrVq1atWrVq+OrVq1atWrVq1atWrVq1atWrVq1atWrVq1atXxVppppppdWrVq1atWrVq1NNNNNNNNNNNPVWmmmmms6tWrVq1atWpppppppppppppp6q0000uc51atWrVq1ammmmmmmmmmmmmt1Vpppc5znVq1atWrVqaaaaaaaaaaaaaeqtNLnOc51atWrVq1ammmmmmmmmmmmmnqrS5znOc6tWrVq16222mmmmmmlVppp6tKuc5znOrVq1a9TbbbbTTTTTSq000qtLnOc5zq1atWrW0222200000qqqtKqrnOc5zq1atTbbbbbbbbTTTSqqqqqq5znOc6tTTTbbbbbbbbTTTSqqqqrlVznOctNNNtttttttttNNNNKqqqrqznKqrTTTTbbbbbbbbbTTTSqqqqrqznOc5aaaabbbbbbbbbaaaaVVVVVdWc5znVq1NNttttttttttNNKqqqqudWc5znVq16tbbbbbbbbbbTTSqqqq5XVnOc6tWrVrb1tttttttttNNKqqqqrWrK5VWmmm2230bbbbbbaaaXOc5zlVa1KuVVppptttt9G22222mmlzlVznK6tWVVWmmmm2222222222mlznOc5znLWppVVWmmm22222229bTWrOc5znOcq1qaaVpWmm222222229erVqznOc5znKtatStK0rTbTTbbbberXr1as5znOc5aVpppppWlabaabbbb1ta9WrVnOc5znU0rTTTTTTTTTbTTbbbTWvVq1as5znOdTTStNNNNNNNNNtNNtttN6tWvVq1ZznOrU00rTTTTTTTTTTTTTbTWvVq1atWrOc6tTTTStNNNNNNNNNNtNNtNa9WrVq1Z1Z1NNNNNK1q1NNNNNNNNNNNtNatWrVq1atWrU00000rWrVq1atWrVq1alaaa1atWrVq1NNNammmmla1atWrVq1aterVq16tWrVnVqa1NK1qaaaVX/xAAWEAADAAAAAAAAAAAAAAAAAAAhgJD/2gAIAQEAAz8AaExf/8QAGhEBAQEBAQEBAAAAAAAAAAAAAQISEQADEP/aAAgBAgEBAgDx48ePHjx48ePHjx48ePHjx48ePHjx48ePHj86IiIiIiInjx48ePHjx48IiIiIj0oooooooooRERER73ve60UUUUUUVrWiiiiiihERERER73ve97ooooorRWiiiiihKERERER73ve973RRRRWtFFFFFFCIiIiIiPe973ve60UUVrRRRRRRQiIlCIiI973ve973pRRWiiiiiiiiiiiiiiihEe973ve973RRWtFFFFFFFFFFFFFFFFFFa13ve973WitaKKKKKKKKKKKKKKKKKK1rWtd1rutFa1oooooooooooosssooorWta1rWta1rRRRRRRRRRRZZZZZZZZZWta1rWta1rRRRRRRRRZZZZZZZZZZZZe9a1rWta1rWitaKLLLLLLLLLLLLLLLLL3rWta1rWtFbLLLLLLLLLLLLLLLLLLLL3vWta1rWita1ssssssss+hZZZZZZZZe961rWta0Vre97LLLLLLLLLLLPoWWWWWXrWta1oorWta3ssss+hZZZZ9Cyyyyyyyyiita1orWta1ve9llllllllllllllllFFa0VorWta1ve9llllllllllllllllllFFFaK1rWta1rWiyyyyyyyyyyyyiiiiiiitFFa1rWta1oosoosssssoooosoooorRRRWta1rWta0UUUUUWUUUUUUUUUUUVoooorWta1rWtaKKKKKKmiiiiiiiiiiiiiiitd73ve61oSiiipoqaKKKKKKKKKK0UUUVrve973vREREZoSihEooooorRRRRWtd73ve9EREREREoSiiiiitFllllla73ve9ERERERESiiiiiitH0PoWWWWVrXe96IiIiMoiJRRRRRRWjwlFFllllFFd6IiIiIlCUUUUUUUUUePHjx48ePCIiIiIiIiUUUUUUUUUUUePHjx48ePHjx48ePHjx48IiUUUUUUJRRRX//xAAWEQADAAAAAAAAAAAAAAAAAAABYJD/2gAIAQIBAz8AtEV7/8QAFxEBAQEBAAAAAAAAAAAAAAAAAAECEP/aAAgBAwEBAgCtNNNNNNNNNNNNNNNNNNNNNNNNNNNNNcrTTTTTTTTTTTTTTTTTTTTTTTTTTTTTXKrTTTTTTTU000000000000000000001FVpppppqampqaaaaaaaaaaaaaaaaaaaa5Vaaaaampqampqammmmmmmmmmmlaaaaaaiq0001NTU1NTU1NTTTTTTTTTTSqqtNNNcqtNNSyzU1LNTU1NTTTTTTTTTSqqq001ytNLLLLNTU1NTU1NTbbbTTTTTSqqq001ytNLLLLLNTU1NTU3NttttNNNNNKqq001KrSyyyyyzU1NTU3Nzc02220000qqqqrSqqyyyyyzU1NTU3Nzc3NttttNNNKqqqqqqssssss1NTU3Nzc3NzbbbbTTTSqqqqqqrLLLLLNTU1Nzc3Nzc22220000qqqqqqqqssss1NTU3Nzc3NzbbbbbTTSqqqqqqqqqqzU1NTc3Nzc3Nzbc22000qqqqqqqqqqqtTU3Nzc3Nzc3NtzbTTSqqqqrKqqqqqtNNzc23Nzc3Nzc3NTU1KqqqrKqqqqqtNNNNttzc3Nzc3NzU1NLLLLLKqqqqqqqq0022223Nzc3NzU1NSyyyyyyqqqqqqqrTTbbbbc3Nzc3NTU1LLLLLLKsqqqqqqrTTTTbbbc3Nzc1NTUsssssssqqqqqqrTTTTTbbbTc3NTU1NTUsssssqqqqqqqq0000222023NTU1NTUsssssqqqqqqqq000000003NTU1NTU1LLLLLNKrTSqqqqtNNNNNNtNNTU1NSzUssss00qq0qqqqrTTTTTTTTTU1NTUs1LLLNNNKrTTTSqqq00000000001NTU1LNTU0000qtNNNKqqqtNNNNNNNNTU1NTUs1NNNNNKss1NNNK00qtK0000001NNTU0s000000qq000001NKrStNNNNK1NNNNStNNNNNKqtNNNNNNNK0000000rU0000rTTTTTSq00000rTTTTTTTTTTTTTTTTStNNNNKr/xAAUEQEAAAAAAAAAAAAAAAAAAACg/9oACAEDAQM/AAAf/9k=";

package/dist/types/components/GlassContainer.vue.d.ts

@@ -0,0 +1,66 @@
+interface GlassContainerProps {
+    className?: string;
+    style?: Record<string, any>;
+    displacementScale?: number;
+    blurAmount?: number;
+    saturation?: number;
+    aberrationIntensity?: number;
+    mouseOffset?: {
+        x: number;
+        y: number;
+    };
+    active?: boolean;
+    overLight?: boolean;
+    cornerRadius?: number;
+    padding?: string;
+    glassSize?: {
+        width: number;
+        height: number;
+    };
+    onClick?: () => void;
+}
+declare var __VLS_4: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_4) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<GlassContainerProps, {
+    glassContainerRef: import("vue").Ref<HTMLDivElement | null, HTMLDivElement | null>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    click: () => any;
+    "mouse-enter": () => any;
+    "mouse-leave": () => any;
+    "mouse-down": () => any;
+    "mouse-up": () => any;
+}, string, import("vue").PublicProps, Readonly<GlassContainerProps> & Readonly<{
+    onClick?: (() => any) | undefined;
+    "onMouse-enter"?: (() => any) | undefined;
+    "onMouse-leave"?: (() => any) | undefined;
+    "onMouse-down"?: (() => any) | undefined;
+    "onMouse-up"?: (() => any) | undefined;
+}>, {
+    displacementScale: number;
+    aberrationIntensity: number;
+    style: Record<string, any>;
+    className: string;
+    blurAmount: number;
+    saturation: number;
+    mouseOffset: {
+        x: number;
+        y: number;
+    };
+    active: boolean;
+    overLight: boolean;
+    cornerRadius: number;
+    padding: string;
+    glassSize: {
+        width: number;
+        height: number;
+    };
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/GlassFilter.vue.d.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    id: string;
+    displacementScale: number;
+    aberrationIntensity: number;
+    width: number;
+    height: number;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/types/components/LiquidGlass.vue.d.ts

@@ -0,0 +1,54 @@
+interface LiquidGlassProps {
+    displacementScale?: number;
+    blurAmount?: number;
+    saturation?: number;
+    aberrationIntensity?: number;
+    elasticity?: number;
+    cornerRadius?: number;
+    globalMousePos?: {
+        x: number;
+        y: number;
+    };
+    mouseOffset?: {
+        x: number;
+        y: number;
+    };
+    mouseContainer?: HTMLElement | null;
+    className?: string;
+    padding?: string;
+    style?: Record<string, any>;
+    overLight?: boolean;
+    onClick?: () => void;
+}
+declare var __VLS_17: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_17) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<LiquidGlassProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LiquidGlassProps> & Readonly<{}>, {
+    displacementScale: number;
+    aberrationIntensity: number;
+    onClick: () => void;
+    className: string;
+    blurAmount: number;
+    saturation: number;
+    mouseOffset: {
+        x: number;
+        y: number;
+    };
+    overLight: boolean;
+    cornerRadius: number;
+    padding: string;
+    elasticity: number;
+    globalMousePos: {
+        x: number;
+        y: number;
+    };
+    mouseContainer: HTMLElement | null;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/main.d.ts

@@ -0,0 +1 @@
+export { default as App } from '@/App.vue';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scriptedpixels/liquid-glass-vue",
-  "version": "0.0.2",
+  "version": "0.0.4",
   "description": "Apple's Liquid Glass effect for Vue",
   "keywords": [
     "vue",
@@ -10,11 +10,10 @@
     "liquid-glass",
     "effect"
   ],
-  "main": "dist/liquid-glass-vue.umd.cjs",
-  "module": "dist/liquid-glass-vue.js",
-  "files": [
-    "dist"
-  ],
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/types/index.d.ts",
+  "files": ["dist"],
   "author": "Scripted Pixels: Kam Banwait",
   "license": "MIT",
   "repository": {
@@ -26,7 +25,9 @@
   "scripts": {
     "dev": "vite",
     "build": "vue-tsc && vite build --outDir dist",
-    "preview": "vite preview"
+    "build:types": "vue-tsc --emitDeclarationOnly --declaration --declarationDir dist/types",
+    "preview": "vite preview",
+    "prepublishOnly": "npm run build && npm run build:types"
   },
   "dependencies": {
     "vue": "^3.5.16"

package/dist/liquid-glass-vue.css

@@ -1,2 +0,0 @@
-
-/* Add any specific styles for this component here if needed */