import{j as e}from"./jsx-runtime.D_zvdyIk.js";import{u as z}from"./useIsMounted.BP-0-XYC.js";import{u as A}from"./index.RTTH55m1.js";import{r as F}from"./index.BIRwh3HZ.js";import{n as L,c as T}from"./utils.BZbvJs_N.js";import{c as V}from"./christmas.D6_UQK5_.js";import{u as p}from"./use-motion-value.VZwO9K77.js";import{u as g}from"./use-spring.B9wz-lgt.js";import{a as X,u as c}from"./use-transform.FggEy_-h.js";import{i as h,m as u}from"./proxy.D9st1TsE.js";const f={type:"spring",damping:24};function Y(t,...i){const a=t.length;function d(){let n="";for(let r=0;r<a;r++){n+=t[r];const o=i[r];o&&(n+=h(o)?o.get():o)}return n}return X(i.filter(h),d)}const $="#ffc0cb",D=`data:image/svg+xml;utf8,${encodeURIComponent(`
<svg width="100%" height="100%" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg">
  <rect width="100" height="100" fill="#ffc0cb"/>
  <circle cx="30" cy="45" r="6" fill="#fff"/>
  <circle cx="70" cy="45" r="6" fill="#fff"/>
  <path d="M 35 65 Q 50 75 65 65" stroke="#fff" stroke-width="4" fill="none" stroke-linecap="round"/>
  <circle cx="20" cy="55" r="6" fill="#ff9eb5" opacity="0.5"/>
  <circle cx="80" cy="55" r="6" fill="#ff9eb5" opacity="0.5"/>
</svg>
`)}`;function G({friend:t,index:i}){const a=F.useRef(null),d=z(),n=A(V),r=p(0),o=p(0),x=g(c(o,[-.5,.5],[15,-15]),f),v=g(c(r,[-.5,.5],[-15,15]),f),b=c(r,[-.5,.5],["0%","100%"]),y=c(o,[-.5,.5],["0%","100%"]),w=Y`radial-gradient(
    600px circle at ${b} ${y},
    rgba(255,255,255,0.15),
    transparent 40%
  )`,j=m=>{if(!a.current)return;const s=a.current.getBoundingClientRect(),N=s.left+s.width/2,C=s.top+s.height/2,R=(m.clientX-N)/s.width,E=(m.clientY-C)/s.height;r.set(R),o.set(E)},k=()=>{r.set(0),o.set(0)},l=L(t.color||$),M=t.image||D;return e.jsx(u.a,{href:t.url,target:"_blank",ref:a,className:T("friend-card group !no-underline hover:!no-underline relative block h-[200px] w-full cursor-pointer select-none transition-transform duration-300 ease-easeOut",{"z-5":d&&n}),style:{perspective:"1000px"},transition:{duration:.5,delay:i*.05,...f},onMouseMove:j,onMouseLeave:k,children:e.jsxs(u.div,{className:"relative h-full w-full rounded-2xl bg-white p-3 shadow-xl ring-1 ring-gray-900/5 dark:bg-gray-800 dark:ring-white/10",style:{transformStyle:"preserve-3d",rotateX:x,rotateY:v},children:[e.jsxs("div",{className:"relative h-full w-full overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900",children:[e.jsx("div",{className:"absolute inset-0 h-16 w-full",style:{background:`linear-gradient(to bottom right, ${l}, ${l}80)`}}),e.jsx("div",{className:"absolute top-8 left-1/2 -translate-x-1/2",children:e.jsx("div",{className:"relative h-14 w-14 overflow-hidden rounded-full border-4 border-white bg-white shadow-lg dark:border-gray-800 dark:bg-gray-800",children:e.jsx("img",{src:M,alt:t.owner,className:"h-full w-full object-cover transition-transform duration-500 group-hover:scale-110",loading:"lazy"})})}),e.jsxs("div",{className:"mt-24 flex h-full flex-col px-2 pb-3 text-center",children:[e.jsx("p",{className:"truncate font-bold text-gray-900 text-sm transition-colors group-hover:text-(--card-color) dark:text-white",style:{"--card-color":l},children:t.owner}),e.jsx("p",{className:"mb-1 truncate font-medium text-[10px] text-gray-400 uppercase tracking-wider",children:t.site}),e.jsx("p",{className:"line-clamp-2 text-[10px] text-gray-600 dark:text-gray-300",children:t.desc})]})]}),e.jsx(u.div,{className:"pointer-events-none absolute inset-0 z-10 rounded-2xl opacity-0 transition-opacity duration-500 group-hover:opacity-100",style:{background:w}}),e.jsx("div",{className:"absolute inset-0 -z-10 rounded-2xl opacity-0 blur-xl transition-opacity duration-500 group-hover:opacity-60",style:{background:l}})]})})}export{G as F,f as m};
