https://ssicevs.com/assets/MouseTrailSignalCTA-BM5ZY1Pz.js

1import{r as x,j as s}from"./metal-fx-C6GZ_SKA.js";import{e as U,i as k,A as V}from"./shared-OtDZU4QY.js";import W from"./ShineBorder-CiWSnsue.js";import{fm as X}from"./index-D1yBc__G.js";import"./motion-BHwmuFpx.js";const H=600,L=140,J=28;function K({label:O="Start your free trial",href:_="#",className:q="",onClick:G}){const R=x.useRef(null),w=x.useRef(null),C=x.useRef(null),S=x.useRef(null),j=X()??!1;return x.useEffect(()=>{if(j)return;const i=R.current,u=w.current,g=C.current,M=S.current;if(!i||!u||!g)return;const o=u.getContext("2d");if(!o)return;let a=0,v=!1,m=!0,N=0,d=0;const l=[],f=Math.min(window.devicePixelRatio||1,2),$=()=>{const t=i.getBoundingClientRect();u.width=Math.max(1,Math.round(t.width*f)),u.height=Math.max(1,Math.round(t.height*f))};$();const A=new ResizeObserver($);A.observe(i);const Y=()=>{const t=i.getBoundingClientRect(),r=g.getBoundingClientRect();return{x:r.left-t.left+r.width/2,y:r.top-t.top+r.height/2,rx:r.width/2}},D=()=>{const[t,r,h]=V,n=d,c=Math.round(255+(t-255)*n),e=Math.round(255+(r-255)*n),b=Math.round(255+(h-255)*n);g.style.borderColor=`rgba(${c},${e},${b},${.4+.5*n})`,g.style.boxShadow=n>.02?`0 0 ${22*n}px ${k(.34*n)}`:"none",M&&(M.style.opacity=String(.35+.65*n),M.style.filter=`saturate(${1+n}) brightness(${1+.5*n})`)},E=t=>{a=0;const r=u.width/f,h=u.height/f;o.setTransform(f,0,0,f,0,0),o.clearRect(0,0,r,h),o.globalCompositeOperation="lighter";const n=Y();for(let c=l.length-1;c>=0;c--){const e=l[c],b=(t-e.born)/H;if(b>=1){l.splice(c,1);continue}const I=n.x-e.x,B=n.y-e.y,p=Math.hypot(I,B);if(p<L&&p>1){const T=(1-p/L)*.9;e.vx+=I/p*T,e.vy+=B/p*T}if(p<n.rx+10){d=Math.min(1,d+.08),l.splice(c,1);continue}e.vx*=.92,e.vy*=.92,e.x+=e.vx,e.y+=e.vy;const y=1-b;o.beginPath(),o.arc(e.x,e.y,e.size*2.4,0,Math.PI*2),o.fillStyle=k(.16*y),o.fill(),o.beginPath(),o.arc(e.x,e.y,e.size*.75,0,Math.PI*2),o.fillStyle=`rgba(${Math.round(160+95*y)},${Math.round(200+55*y)},255,${.85*y})`,o.fill()}o.globalCompositeOperation="source-over",d=Math.max(0,d-.012),D(),m&&(l.length>0||d>.01)?a=requestAnimationFrame(E):v=!1},z=()=>{!v&&m&&(v=!0,a=requestAnimationFrame(E))},P=t=>{const r=performance.now();if(r-N<J)return;N=r;const h=i.getBoundingClientRect();l.push({x:t.clientX-h.left+(Math.random()-.5)*6,y:t.clientY-h.top+(Math.random()-.5)*6,vx:(Math.random()-.5)*.4,vy:(Math.random()-.5)*.4,born:r,size:Math.random()<.5?1:2}),l.length>80&&l.shift(),z()},F=new IntersectionObserver(([t])=>{m=t.isIntersecting,!m&&a?(cancelAnimationFrame(a),a=0,v=!1):m&&z()});return F.observe(i),i.addEventListener("pointermove",P),()=>{i.removeEventListener("pointermove",P),F.disconnect(),A.disconnect(),a&&cancelAnimationFrame(a)}},[j]),s.jsxs("div",{ref:R,className:`relative flex items-center justify-center overflow-hidden rounded-lg border border-foreground

1/[0.04] ${q}`,style:{background:U},children:[s.jsx("canvas",{ref:w,className:"pointer-events-none absolute inset-0 h-full w-full","aria-hidden":!0}),s.jsx("div",{className:"pointer-events-none absolute inset-0",style:{boxShadow:"inset 0 0 70px 12px color-mix(in srgb, var(--background) 85%, transparent)"}}),s.jsxs("div",{className:"relative",children:[s.jsx("div",{ref:S,className:"pointer-events-none absolute -inset-px z-0",style:{opacity:.35},children:s.jsx(W,{radius:60,className:"h-full w-full"})}),s.jsxs("a",{ref:C,href:_,onClick:G,className:"group relative z-10 inline-flex overflow-hidden rounded-[60px] border border-foreground/40 px-6 py-3 font-display text-[15px] font-semibold text-foreground transition-colors",children:[s.jsx("span",{className:"absolute inset-0 origin-bottom scale-y-0 bg-foreground transition-transform duration-300 ease-out group-hover:scale-y-100"}),s.jsx("span",{className:"relative transition-colors duration-300 group-hover:text-ink",children:O})]})]})]})}function oe(){return s.jsx(K,{className:"h-[240px] w-full"})}export{oe as Demo,K as default};