@izhann/react-cursor-fx
Version:
Interactive cursor effects for React and Next.js applications — zero runtime dependencies
4 lines (3 loc) • 32.2 kB
JavaScript
"use client";
"use strict";var e=require("react/jsx-runtime"),t=require("react");let r=0,n=0,o=!1;const s=new Set;const i={get x(){return r},get y(){return n},subscribe:e=>(o||"undefined"==typeof window||(o=!0,window.addEventListener("mousemove",(e=>{r=e.clientX,n=e.clientY,s.size>0&&s.forEach((e=>e(r,n)))}),{passive:!0})),s.add(e),()=>{s.delete(e)})},a={default:{width:24,height:24,scale:1,shape:"circle",color:"rgba(255, 255, 255, 0.8)",opacity:1,borderColor:"rgba(0, 0, 0, 0)",borderWidth:0,borderStyle:"solid",label:"",fontSize:"12px",fontWeight:"bold",labelColor:"#000",transition:{stiffness:800,damping:80,mass:1}}},l=t.createContext({cursorState:Object.assign(Object.assign({},a.default),{variant:"default"}),setCursorVariant:()=>{},config:a,mousePosition:{x:0,y:0},resetCursorToDefault:()=>{},setGlobalCursorVariant:()=>{},clearGlobalCursorVariant:()=>{}}),c=()=>t.useContext(l);function u(e,t,r,n,o,s,i){const a=(-n*(e-r)-o*t)/s;return[e+t*i+.5*a*i*i,t+a*i]}"function"==typeof SuppressedError&&SuppressedError;const d=({variant:e,onEnter:r,onLeave:n})=>{const{setCursorVariant:o}=c(),s=t.useRef(!1);return{onMouseEnter(){s.current||(s.current=!0,o(e,"push")),null==r||r()},onMouseLeave(){s.current&&(s.current=!1,o("","pop")),null==n||n()},onFocus(){s.current||(s.current=!0,o(e,"push")),null==r||r()},onBlur(){s.current&&(s.current=!1,o("","pop")),null==n||n()},"data-cursor-target":!0}};const h=2*Math.PI,f=["#ff6b6b","#ffd93d","#6bcb77","#4d96ff","#c77dff","#ff9a3c"];exports.Cursor=({zIndex:r=9999,showOnTouch:n=!1,trailLength:o=10,elongate:s=!1})=>{const{cursorState:a}=c(),[l,d]=t.useState(!1),[h,f]=t.useState(!1),[p,g]=t.useState(!1),b=t.useRef(null),m=t.useRef([]),x=t.useRef({x:0,y:0,vx:0,vy:0}),v=t.useRef({x:0,y:0}),w=t.useRef(null),y=t.useRef(null),C=t.useRef({stiffness:800,damping:80,mass:1}),M=t.useRef(!1),E=t.useRef(s),S=t.useRef(0),k=t.useRef({shape:a.shape,label:a.label}),R=t.useRef([]);if(t.useEffect((()=>{var e,t,r,n,o,s;C.current={stiffness:null!==(t=null===(e=a.transition)||void 0===e?void 0:e.stiffness)&&void 0!==t?t:800,damping:null!==(n=null===(r=a.transition)||void 0===r?void 0:r.damping)&&void 0!==n?n:80,mass:null!==(s=null===(o=a.transition)||void 0===o?void 0:o.mass)&&void 0!==s?s:1}}),[a.transition]),t.useEffect((()=>{E.current=s}),[s]),t.useEffect((()=>{k.current={shape:a.shape,label:a.label}}),[a.shape,a.label]),t.useEffect((()=>i.subscribe(((e,t)=>{v.current={x:e,y:t},m.current=[{x:e,y:t},...m.current.slice(0,o-1)]}))),[o]),t.useEffect((()=>{const e=t=>{if(null!==y.current)if(M.current){const{x:e,y:t}=v.current;x.current={x:e,y:t,vx:0,vy:0},b.current&&(b.current.style.transform=`translate(${e}px, ${t}px)`)}else{const e=Math.min((t-y.current)/1e3,.064),{stiffness:r,damping:n,mass:o}=C.current,{x:s,y:i,vx:a,vy:l}=x.current,{x:c,y:d}=v.current,h=.008,f=Math.max(1,Math.ceil(e/h)),p=e/f;let g=s,w=a,M=i,A=l;for(let e=0;e<f;e++)[g,w]=u(g,w,c,r,n,o,p),[M,A]=u(M,A,d,r,n,o,p);if(x.current={x:g,y:M,vx:w,vy:A},b.current){if(E.current&&"square"!==k.current.shape&&!k.current.label){const e=Math.sqrt(w*w+A*A),t=Math.min(1+e/800,1.35),r=1/Math.sqrt(t);e>30&&(S.current=Math.atan2(A,w)*(180/Math.PI)),b.current.style.transform=`translate(${g}px, ${M}px) rotate(${S.current}deg) scaleX(${t}) scaleY(${r})`}else b.current.style.transform=`translate(${g}px, ${M}px)`}const W=R.current;if(W.length>0){const e=v.current;for(let t=0;t<W.length;t++){const r=W[t];if(!r)continue;const n=m.current[Math.min(t+1,m.current.length-1)]||e,o=.5*-(e.x-n.x),s=.5*-(e.y-n.y);r.style.transform=`translate(calc(-50% + ${o}px), calc(-50% + ${s}px))`}}}y.current=t,w.current=requestAnimationFrame(e)};return w.current=requestAnimationFrame(e),()=>{null!==w.current&&cancelAnimationFrame(w.current)}}),[]),t.useEffect((()=>{const e=window.matchMedia("(pointer: coarse)");f(e.matches);const t=window.matchMedia("(prefers-reduced-motion: reduce)");M.current=t.matches,g(t.matches);const r=e=>{M.current=e.matches,g(e.matches)};t.addEventListener("change",r);const n=setTimeout((()=>d(!0)),50);return()=>{t.removeEventListener("change",r),clearTimeout(n)}}),[]),h&&!n)return null;const{width:A=24,height:W=24,scale:q=1,shape:z="circle",color:L="rgba(255, 255, 255, 0.8)",opacity:I=1,borderColor:j="rgba(0, 0, 0, 0)",borderWidth:P=0,borderStyle:T="solid",mixBlendMode:$="normal",label:F,fontSize:O="12px",fontWeight:V="bold",labelColor:B="#000",customElement:X,innerElements:Y,borderRadius:G}=a,D="circle"===z?"50%":"square"===z?`${null!=G?G:0}px`:"0",H="custom"===z?"transparent":L,J=p?"none":"width 0.2s ease, height 0.2s ease, border-radius 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease, transform 0.15s ease";return R.current=Y?R.current.slice(0,Y.length):[],e.jsx("div",{ref:b,"aria-hidden":"true",style:{position:"fixed",left:0,top:0,zIndex:r,pointerEvents:"none",opacity:l?1:0,willChange:"transform",mixBlendMode:$,transformOrigin:"0 0"},children:e.jsxs("div",{style:{width:A,height:W,borderRadius:D,backgroundColor:H,opacity:I,borderColor:j,borderWidth:P,borderStyle:T,display:"flex",justifyContent:"center",alignItems:"center",transform:`translate(-50%, -50%) scale(${q})`,transition:J,willChange:"width, height, background-color, transform"},children:["custom"===z&&X,F&&e.jsx("div",{style:{fontSize:O,fontWeight:V,color:B,textAlign:"center",userSelect:"none",whiteSpace:"nowrap",pointerEvents:"none"},children:F}),null==Y?void 0:Y.map(((t,r)=>e.jsx("div",{ref:e=>{R.current[r]=e},style:{position:"absolute",left:"50%",top:"50%",transform:"translate(-50%, -50%)",transition:p?"none":"transform 0.12s ease"},children:t.element},`inner-${r}`)))]})})},exports.CursorClickEffect=({size:r=50,duration:n=600,color:o="rgba(255, 255, 255, 0.8)",strokeWidth:s=2,zIndex:i=9997,type:a="ripple",particleCount:l=12,palette:c})=>{const u=t.useRef(null),d=t.useRef([]),p=t.useRef(0),g=t.useRef(null);return t.useEffect((()=>{const e=u.current;if(!e)return;const t=e.getContext("2d");if(!t)return;const i=()=>{e.width=window.innerWidth,e.height=window.innerHeight};i(),window.addEventListener("resize",i,{passive:!0});const b=null!=c?c:f,m=i=>{t.clearRect(0,0,e.width,e.height),d.current=d.current.filter((e=>{const l=Math.max(0,i-e.startTime);if(l>=n)return!1;const c=l/n;return"ripple"===a?function(e,t,r,n,o,s){const i=Math.max(n/2*(1-Math.pow(1-r,3)),.5);e.beginPath(),e.arc(t.x,t.y,i,0,h),e.strokeStyle=o,e.globalAlpha=1-r,e.lineWidth=s,e.stroke()}(t,e,c,r,o,s):"burst"===a?function(e,t,r,n,o,s){const i=1-Math.pow(1-r,2);e.fillStyle=o,t.particles.forEach((o=>{const a=i*(n/2)*o.speedMult,l=t.x+Math.cos(o.angle)*a,c=t.y+Math.sin(o.angle)*a;e.beginPath(),e.arc(l,c,Math.max((1-r)*s*2.5,.5),0,h),e.globalAlpha=.9*(1-r),e.fill()}))}(t,e,c,r,o,s):"sparkle"===a?function(e,t,r,n,o,s){const i=1-Math.pow(1-r,2);e.strokeStyle=o,e.lineCap="round",t.particles.forEach((o=>{const a=t.x+Math.cos(o.angle)*i*(n/2)*.25,l=t.y+Math.sin(o.angle)*i*(n/2)*.25,c=t.x+Math.cos(o.angle)*i*(n/2)*o.speedMult,u=t.y+Math.sin(o.angle)*i*(n/2)*o.speedMult;e.beginPath(),e.moveTo(a,l),e.lineTo(c,u),e.globalAlpha=.85*(1-r),e.lineWidth=Math.max(s*(1-.5*r),.5),e.stroke()})),e.beginPath(),e.arc(t.x,t.y,Math.max(3*(1-r),.5),0,h),e.fillStyle=o,e.globalAlpha=1-r,e.fill()}(t,e,c,r,o,s):"shockwave"===a?function(e,t,r,n,o,s,i){const a=r/n;e.beginPath(),e.arc(t.x,t.y,Math.max(o/2*(1-Math.pow(1-a,3)),.5),0,h),e.strokeStyle=s,e.globalAlpha=.85*(1-a),e.lineWidth=1.5*i,e.stroke();const l=.15;if(r>n*l){const s=Math.min((r-n*l)/(n*(1-l)),1);e.beginPath(),e.arc(t.x,t.y,Math.max(o/2*.65*(1-Math.pow(1-s,3)),.5),0,h),e.globalAlpha=.5*(1-s),e.lineWidth=i,e.stroke()}}(t,e,l,n,r,o,s):"confetti"===a?function(e,t,r,n,o){const s=r/1e3;t.particles.forEach((i=>{const a=4*o+3.5*o*i.speedMult,l=Math.cos(i.angle)*a,c=Math.sin(i.angle)*a*.5-7.5*o,u=Math.exp(-1.5*s),d=t.x+l*s*u,h=t.y+c*s+450*s*s,f=Math.max(0,1-Math.pow(r/n,1.5)),p=i.rotSpeed*s;e.save(),e.translate(d,h),e.rotate(p),e.fillStyle=i.confettiColor,e.globalAlpha=f,e.fillRect(-i.pw/2,-i.ph/2,i.pw,i.ph),e.restore()}))}(t,e,l,n,r):"implode"===a&&function(e,t,r,n,o,s){const i=.3,a=n/2;if(r<i){const n=r/i,l=n*n;e.fillStyle=o,t.particles.forEach((r=>{const n=a*(1-l)*r.speedMult,o=t.x+Math.cos(r.angle)*n,i=t.y+Math.sin(r.angle)*n;e.beginPath(),e.arc(o,i,Math.max(2*s,.5),0,h),e.globalAlpha=.7+.3*l,e.fill()})),e.beginPath(),e.arc(t.x,t.y,Math.max(6*l,.5),0,h),e.globalAlpha=l,e.fill()}else{const n=(r-i)/(1-i),l=1-Math.pow(1-n,2);e.fillStyle=o,t.particles.forEach((r=>{const o=l*a*r.speedMult,i=t.x+Math.cos(r.angle)*o,c=t.y+Math.sin(r.angle)*o;e.beginPath(),e.arc(i,c,Math.max((1-n)*s*2.5,.5),0,h),e.globalAlpha=.9*(1-n),e.fill()}))}}(t,e,c,r,o,s),t.globalAlpha=1,!0})),d.current.length>0?g.current=requestAnimationFrame(m):g.current=null},x=(e,t)=>{const r=Array.from({length:l},((e,t)=>({angle:t/l*h+(Math.random()-.5)*(h/l),speedMult:.6+.4*Math.random(),confettiColor:b[t%b.length],rotSpeed:18*(Math.random()-.5),pw:8+10*Math.random(),ph:4+6*Math.random()})));d.current.push({x:e,y:t,startTime:performance.now(),id:p.current++,particles:r}),null===g.current&&(g.current=requestAnimationFrame(m))},v=e=>x(e.clientX,e.clientY),w=e=>{const{x:t,y:r}=e.detail;x(t,r)};return window.addEventListener("click",v),window.addEventListener("cursor:click",w),()=>{window.removeEventListener("resize",i),window.removeEventListener("click",v),window.removeEventListener("cursor:click",w),null!==g.current&&cancelAnimationFrame(g.current)}}),[o,n,c,l,r,s,a]),e.jsx("canvas",{ref:u,"aria-hidden":"true",style:{position:"fixed",top:0,left:0,pointerEvents:"none",zIndex:i}})},exports.CursorDraw=({color:r="rgba(255,255,255,0.85)",width:n=2,zIndex:o=9996,fadeTime:s=0,enabled:a=!0,eraseWidth:l=20,onStroke:c})=>{const u=t.useRef(null),d=t.useRef([]),h=t.useRef(null),f=t.useRef(!1),p=t.useRef(!1),g=t.useRef(null),b=t.useRef(a);return t.useEffect((()=>{b.current=a,a||(f.current=!1,h.current&&h.current.length>1&&d.current.push({points:h.current,color:r,width:n,createdAt:performance.now(),erase:!1}),h.current=null)}),[a,r,n]),t.useEffect((()=>{const e=u.current;if(!e)return;const t=e.getContext("2d");if(!t)return;const o=()=>{e.width=window.innerWidth,e.height=window.innerHeight};o(),window.addEventListener("resize",o,{passive:!0});const a=(e,r,n,o)=>{if(!(e.length<2)){t.beginPath(),t.moveTo(e[0].x,e[0].y);for(let r=1;r<e.length-1;r++){const n=(e[r].x+e[r+1].x)/2,o=(e[r].y+e[r+1].y)/2;t.quadraticCurveTo(e[r].x,e[r].y,n,o)}t.lineTo(e[e.length-1].x,e[e.length-1].y),t.strokeStyle=n,t.globalAlpha=o,t.lineWidth=r,t.lineCap="round",t.lineJoin="round",t.stroke()}},m=o=>{t.clearRect(0,0,e.width,e.height);const i=window.scrollX,c=window.scrollY;if(t.save(),t.translate(-i,-c),s>0&&(d.current=d.current.filter((e=>o-e.createdAt<s+800))),d.current.forEach((e=>{const r=s>0?Math.max(0,o-e.createdAt-s):0,n=s>0?Math.max(0,1-r/800):1;e.erase?(t.globalCompositeOperation="destination-out",a(e.points,e.width,"rgba(0,0,0,1)",n||1),t.globalCompositeOperation="source-over"):a(e.points,e.width,e.color,n)})),h.current&&h.current.length>0)if(p.current){t.globalCompositeOperation="destination-out",a(h.current,l,"rgba(0,0,0,1)",1),t.globalCompositeOperation="source-over";const e=h.current[h.current.length-1];t.beginPath(),t.arc(e.x,e.y,l/2,0,2*Math.PI),t.setLineDash([3,3]),t.strokeStyle="rgba(255,255,255,0.5)",t.lineWidth=1,t.globalAlpha=.7,t.stroke(),t.setLineDash([])}else a(h.current,n,r,1);t.restore(),t.globalAlpha=1;const u=null!==h.current,f=s>0&&d.current.length>0;g.current=u||f?requestAnimationFrame(m):null},x=()=>{(d.current.length>0||null!==h.current)&&null===g.current&&(g.current=requestAnimationFrame(m))},v=e=>{b.current&&(0!==e.button&&2!==e.button||(p.current=2===e.button,f.current=!0,document.body.style.userSelect="none",document.body.style.webkitUserSelect="none",h.current=[{x:e.clientX+window.scrollX,y:e.clientY+window.scrollY}],null===g.current&&(g.current=requestAnimationFrame(m))))},w=e=>{if((0===e.button||2===e.button)&&(document.body.style.userSelect="",document.body.style.webkitUserSelect="",f.current&&h.current)){if(f.current=!1,h.current.length>1){const e={points:h.current,color:r,width:p.current?l:n,createdAt:performance.now(),erase:p.current};d.current.push(e),p.current||null==c||c(e.points),s>0&&null===g.current&&(g.current=requestAnimationFrame(m))}h.current=null,p.current=!1}},y=()=>{b.current&&(d.current=[],h.current=null,f.current=!1,t.clearRect(0,0,e.width,e.height),null!==g.current&&(cancelAnimationFrame(g.current),g.current=null))},C=e=>{b.current&&e.preventDefault()},M=i.subscribe(((e,t)=>{b.current&&f.current&&h.current&&h.current.push({x:e+window.scrollX,y:t+window.scrollY})}));return window.addEventListener("mousedown",v),window.addEventListener("mouseup",w),window.addEventListener("dblclick",y),window.addEventListener("contextmenu",C),window.addEventListener("scroll",x,{passive:!0}),()=>{window.removeEventListener("resize",o),window.removeEventListener("mousedown",v),window.removeEventListener("mouseup",w),window.removeEventListener("dblclick",y),window.removeEventListener("contextmenu",C),window.removeEventListener("scroll",x),document.body.style.userSelect="",document.body.style.webkitUserSelect="",M(),null!==g.current&&cancelAnimationFrame(g.current)}}),[r,l,s,n]),e.jsx("canvas",{ref:u,"aria-hidden":"true",style:{position:"fixed",top:0,left:0,pointerEvents:"none",zIndex:o}})},exports.CursorLens=({size:r=140,scale:n=2.2,border:o="1.5px solid rgba(255,255,255,0.25)",zIndex:s=9995,children:a})=>{const l=t.useRef(null),c=t.useRef(null),u=t.useRef(null);return t.useEffect((()=>{const e=l.current,t=c.current,o=u.current;if(!e||!t||!o)return;const s=i.subscribe(((s,i)=>{const a=e.getBoundingClientRect();if(s<a.left||s>a.right||i<a.top||i>a.bottom)return void(t.style.opacity="0");const l=s-a.left,c=i-a.top;t.style.left=`${s}px`,t.style.top=`${i}px`,t.style.opacity="1",o.style.width=`${a.width}px`,o.style.height=`${a.height}px`,o.style.left=r/2-l*n+"px",o.style.top=r/2-c*n+"px"})),a=()=>{t.style.opacity="0"};return document.addEventListener("mouseleave",a),()=>{s(),document.removeEventListener("mouseleave",a)}}),[r,n]),e.jsxs(e.Fragment,{children:[e.jsx("div",{ref:l,style:{position:"relative"},children:a}),e.jsxs("div",{ref:c,"aria-hidden":"true",style:{position:"fixed",width:r,height:r,borderRadius:"50%",border:o,boxShadow:"0 0 0 1px rgba(255,255,255,0.06) inset, 0 8px 32px rgba(0,0,0,0.4), 0 2px 8px rgba(0,0,0,0.3)",overflow:"hidden",pointerEvents:"none",zIndex:s,opacity:0,transform:"translate(-50%, -50%)",transition:"opacity 0.14s ease"},children:[e.jsx("div",{ref:u,"aria-hidden":"true",style:{position:"absolute",transformOrigin:"0 0",transform:`scale(${n})`,pointerEvents:"none"},children:a}),e.jsx("div",{style:{position:"absolute",inset:0,borderRadius:"50%",background:"radial-gradient(ellipse at 35% 30%, rgba(255,255,255,0.07) 0%, transparent 60%)",pointerEvents:"none"}}),e.jsx("div",{style:{position:"absolute",top:"50%",left:0,right:0,height:1,background:"rgba(255,255,255,0.12)",transform:"translateY(-0.5px)",pointerEvents:"none"}}),e.jsx("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,background:"rgba(255,255,255,0.12)",transform:"translateX(-0.5px)",pointerEvents:"none"}}),e.jsxs("div",{style:{position:"absolute",bottom:8,right:10,fontSize:9,fontFamily:"monospace",color:"rgba(255,255,255,0.35)",letterSpacing:"0.08em",pointerEvents:"none"},children:[n,"×"]})]})]})},exports.CursorProvider=({children:r,config:n=a,hideNativeCursor:o=!0})=>{const[s,c]=t.useState(["default"]),[u,d]=t.useState(null),h=t.useCallback(((e,t="push")=>{c("reset"===t?["default"]:"push"===t?t=>[...t,e]:e=>{const t=e.slice(0,-1);return t.length?t:["default"]})}),[]),f=t.useCallback((()=>{c(["default"])}),[]),p=t.useCallback((e=>{d(e)}),[]),g=t.useCallback((()=>{d(null)}),[]);t.useEffect((()=>{if(!o)return;const e=document.createElement("style");return e.textContent='body,a,button,[role="button"],*{cursor:none!important}',document.head.appendChild(e),()=>{document.head.removeChild(e)}}),[o]);const b=t.useMemo((()=>{var e;const t=null!=u?u:s[s.length-1],r=null!==(e=n[t])&&void 0!==e?e:n.default;return{cursorState:Object.assign(Object.assign({},r),{variant:t}),setCursorVariant:h,resetCursorToDefault:f,config:n,mousePosition:{x:i.x,y:i.y},setGlobalCursorVariant:p,clearGlobalCursorVariant:g}}),[s,u,n,h,f,p,g]);return e.jsx(l.Provider,{value:b,children:r})},exports.CursorReveal=({children:r,size:n=180,overlay:o="rgba(9,9,11,0.92)",blur:s=0,className:i,style:a})=>{const l=t.useRef(null),c=t.useRef(null);return t.useEffect((()=>{const e=l.current,t=c.current;if(!e||!t)return;const r=n/2,o=n=>{const o=e.getBoundingClientRect(),s=n.clientX-o.left,i=n.clientY-o.top,a=`radial-gradient(circle ${r}px at ${s}px ${i}px, transparent 0%, black ${r}px)`;t.style.maskImage=a,t.style.webkitMaskImage=a},s=()=>{t.style.maskImage="",t.style.webkitMaskImage=""};return e.addEventListener("mousemove",o,{passive:!0}),e.addEventListener("mouseleave",s),()=>{e.removeEventListener("mousemove",o),e.removeEventListener("mouseleave",s)}}),[n]),e.jsxs("div",{ref:l,className:i,style:Object.assign({position:"relative",overflow:"hidden"},a),children:[r,e.jsx("div",{ref:c,"aria-hidden":"true",style:{position:"absolute",inset:0,background:o,backdropFilter:s?`blur(${s}px)`:void 0,WebkitBackdropFilter:s?`blur(${s}px)`:void 0,pointerEvents:"none"}})]})},exports.CursorSpotlight=({color:r="rgba(255,255,255,0.06)",size:n=400,zIndex:o=0,blend:s="normal"})=>{const a=t.useRef(null);return t.useEffect((()=>{const e=a.current;if(!e)return;const t=n/2;return i.subscribe(((n,o)=>{e.style.background=`radial-gradient(circle at ${n}px ${o}px, ${r} 0px, transparent ${t}px)`}))}),[r,n]),e.jsx("div",{ref:a,"aria-hidden":"true",style:{position:"fixed",inset:0,pointerEvents:"none",zIndex:o,mixBlendMode:s,willChange:"background"}})},exports.CursorTarget=function(t){var{as:r,children:n,variant:o,onEnter:s,onLeave:i}=t,a=function(e,t){var r={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(r[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(n=Object.getOwnPropertySymbols(e);o<n.length;o++)t.indexOf(n[o])<0&&Object.prototype.propertyIsEnumerable.call(e,n[o])&&(r[n[o]]=e[n[o]])}return r}(t,["as","children","variant","onEnter","onLeave"]);const l=null!=r?r:"div",c=d({variant:o,onEnter:s,onLeave:i});return e.jsx(l,Object.assign({},a,c,{"data-cursor-variant":o,children:n}))},exports.CursorTrail=({count:r=12,color:n="rgba(255,255,255,0.6)",size:o=8,zIndex:s=9998,type:a="dots",fadeTime:l=1800,spread:c=60})=>{const u=t.useRef(null),d=t.useRef([]),h=t.useRef(null);return t.useEffect((()=>{const e=u.current;if(!e)return;const t=e.getContext("2d");if(!t)return;const s=()=>{e.width=window.innerWidth,e.height=window.innerHeight};let f;if(s(),window.addEventListener("resize",s,{passive:!0}),"dots"===a||"line"===a||"glow"===a){let s=!1;const l=()=>{if(s){t.clearRect(0,0,e.width,e.height);const r=d.current;r.length>0&&("dots"===a?function(e,t,r,n){for(let o=0;o<t.length;o++){const s=1-o/t.length;e.beginPath(),e.arc(t[o].x,t[o].y,Math.max(n*s*.5,.5),0,2*Math.PI),e.fillStyle=r,e.globalAlpha=s,e.fill()}e.globalAlpha=1}(t,r,n,o):"line"===a?function(e,t,r,n){if(t.length<2)return;for(let o=0;o<t.length-1;o++){const s=1-o/t.length;if(e.beginPath(),e.moveTo(t[o].x,t[o].y),o<t.length-2){const r=(t[o+1].x+t[o+2].x)/2,n=(t[o+1].y+t[o+2].y)/2;e.quadraticCurveTo(t[o+1].x,t[o+1].y,r,n)}else e.lineTo(t[o+1].x,t[o+1].y);e.strokeStyle=r,e.globalAlpha=s,e.lineWidth=Math.max(n*s,.5),e.lineCap="round",e.lineJoin="round",e.stroke()}e.globalAlpha=1}(t,r,n,o):function(e,t,r,n){for(let o=0;o<t.length;o++){const s=1-o/t.length,i=Math.max(n*s*2,.5),{x:a,y:l}=t[o],c=e.createRadialGradient(a,l,0,a,l,i);c.addColorStop(0,r),c.addColorStop(1,"rgba(0,0,0,0)"),e.beginPath(),e.arc(a,l,i,0,2*Math.PI),e.fillStyle=c,e.globalAlpha=s,e.fill()}e.globalAlpha=1}(t,r,n,o)),s=!1,h.current=requestAnimationFrame(l)}else h.current=null},c=i.subscribe(((e,t)=>{d.current=[{x:e,y:t},...d.current.slice(0,r-1)],s=!0,null===h.current&&(h.current=requestAnimationFrame(l))}));f=c}if("ink"===a){const r=[],s=i=>{for(t.clearRect(0,0,e.width,e.height);r.length&&i-r[0].born>l;)r.shift();if(r.length>=2){t.lineCap="round",t.lineJoin="round";const e=80;let s=0;for(let a=1;a<=r.length;a++){const c=a===r.length,u=!c&&r[a].born-r[a-1].born>e;if(c||u){const e=r.slice(s,a);if(e.length>=2){const r=i-e[0].born,s=Math.pow(Math.max(0,1-r/l),1.5);t.beginPath(),t.moveTo(e[0].x,e[0].y);for(let r=1;r<e.length-1;r++){const n=(e[r].x+e[r+1].x)/2,o=(e[r].y+e[r+1].y)/2;t.quadraticCurveTo(e[r].x,e[r].y,n,o)}t.lineTo(e[e.length-1].x,e[e.length-1].y),t.strokeStyle=n,t.lineWidth=Math.max(.85*o,1),t.globalAlpha=s,t.stroke()}s=a}}}t.globalAlpha=1,r.length>0?h.current=requestAnimationFrame(s):h.current=null},a=i.subscribe(((e,t)=>{r.push({x:e,y:t,born:performance.now()}),null===h.current&&(h.current=requestAnimationFrame(s))}));f=a}if("spark"===a){const r=[];let s=performance.now();const a=l,u=120,d=i=>{const l=Math.min((i-s)/1e3,.05);s=i,t.clearRect(0,0,e.width,e.height);for(let e=r.length-1;e>=0;e--){const s=r[e],c=i-s.born;if(c>a){r.splice(e,1);continue}s.x+=s.vx*l,s.y+=s.vy*l,s.vy+=u*l;const d=1-c/a,h=Math.max(o*d*.45,.5);t.beginPath(),t.arc(s.x,s.y,h,0,2*Math.PI),t.fillStyle=n,t.globalAlpha=d,t.fill()}t.globalAlpha=1,r.length>0?h.current=requestAnimationFrame(d):h.current=null},p=i.subscribe(((e,t)=>{const n=Math.random()*Math.PI*2;r.push({x:e,y:t,vx:Math.cos(n)*c*(.5+Math.random()),vy:Math.sin(n)*c*(.5+Math.random())-.4*c,born:performance.now()}),null===h.current&&(h.current=requestAnimationFrame(d))}));f=p}return()=>{window.removeEventListener("resize",s),null==f||f(),null!==h.current&&cancelAnimationFrame(h.current)}}),[n,r,o,a,l,c]),e.jsx("canvas",{ref:u,"aria-hidden":"true",style:{position:"fixed",top:0,left:0,pointerEvents:"none",zIndex:s}})},exports.emitCursorEvent=function(e,t={}){var r,n;if("undefined"==typeof window)return;const o=null!==(r=t.x)&&void 0!==r?r:window.innerWidth/2,s=null!==(n=t.y)&&void 0!==n?n:window.innerHeight/2;window.dispatchEvent(new CustomEvent("cursor:click",{detail:{x:o,y:s}}))},exports.mouseStore=i,exports.themes={minimal:{default:{width:6,height:6,shape:"circle",color:"rgba(255,255,255,0.9)",transition:{stiffness:1100,damping:95,mass:.6}},link:{width:36,height:36,shape:"circle",color:"transparent",borderColor:"rgba(255,255,255,0.45)",borderWidth:1,transition:{stiffness:440,damping:40,mass:.9}},button:{width:46,height:46,shape:"circle",color:"transparent",borderColor:"rgba(255,255,255,0.35)",borderWidth:1,label:"click",fontSize:"9px",labelColor:"rgba(255,255,255,0.55)",transition:{stiffness:440,damping:40,mass:.9}},text:{width:1.5,height:24,shape:"square",borderRadius:1,color:"rgba(255,255,255,0.75)",transition:{stiffness:1400,damping:110,mass:.5}},view:{width:68,height:68,shape:"circle",color:"transparent",borderColor:"rgba(255,255,255,0.25)",borderWidth:1,label:"view",fontSize:"10px",labelColor:"rgba(255,255,255,0.5)",transition:{stiffness:200,damping:24,mass:1.6}},drag:{width:56,height:56,shape:"circle",color:"transparent",borderColor:"rgba(255,255,255,0.35)",borderWidth:1,label:"drag",fontSize:"9px",labelColor:"rgba(255,255,255,0.5)",transition:{stiffness:280,damping:30,mass:1.2}},close:{width:36,height:36,shape:"circle",color:"transparent",borderColor:"rgba(255,255,255,0.4)",borderWidth:1,label:"✕",fontSize:"12px",labelColor:"rgba(255,255,255,0.6)",transition:{stiffness:700,damping:55,mass:.8}},spot:{width:110,height:110,shape:"circle",color:"rgba(255,255,255,0.03)",borderColor:"rgba(255,255,255,0.08)",borderWidth:1,transition:{stiffness:100,damping:16,mass:2.5}}},neon:{default:{width:10,height:10,shape:"circle",color:"#00ffff",opacity:.9,transition:{stiffness:900,damping:80,mass:.7}},link:{width:48,height:48,shape:"circle",color:"rgba(0,255,255,0.06)",borderColor:"#00ffff",borderWidth:1.5,transition:{stiffness:360,damping:36,mass:1}},button:{width:56,height:56,shape:"circle",color:"rgba(255,0,255,0.08)",borderColor:"#ff00ff",borderWidth:1.5,label:"click",fontSize:"10px",labelColor:"#ff00ff",transition:{stiffness:380,damping:38,mass:1}},text:{width:2,height:28,shape:"square",color:"#00ffff",transition:{stiffness:1400,damping:110,mass:.5}},view:{width:80,height:80,shape:"circle",color:"rgba(0,255,255,0.04)",borderColor:"rgba(0,255,255,0.6)",borderWidth:1.5,label:"view",fontSize:"11px",labelColor:"#00ffff",transition:{stiffness:200,damping:24,mass:1.8}},drag:{width:58,height:58,shape:"circle",color:"rgba(0,255,128,0.08)",borderColor:"#00ff80",borderWidth:1.5,label:"drag",fontSize:"10px",labelColor:"#00ff80",transition:{stiffness:280,damping:30,mass:1.2}},close:{width:48,height:48,shape:"circle",color:"rgba(255,0,80,0.12)",borderColor:"#ff0050",borderWidth:1.5,label:"✕",fontSize:"14px",labelColor:"#ff0050",transition:{stiffness:650,damping:52,mass:.8}},invert:{width:56,height:56,shape:"circle",color:"rgba(255,0,255,1)",mixBlendMode:"difference",transition:{stiffness:520,damping:46,mass:.8}},spot:{width:130,height:130,shape:"circle",color:"rgba(0,255,255,0.04)",borderColor:"rgba(0,255,255,0.1)",borderWidth:1,transition:{stiffness:100,damping:14,mass:2.8}},square:{width:38,height:38,shape:"square",borderRadius:4,color:"rgba(255,255,0,0.15)",borderColor:"#ffff00",borderWidth:1.5,transition:{stiffness:520,damping:46,mass:.8}}},glassmorphism:{default:{width:14,height:14,shape:"circle",color:"rgba(255,255,255,0.55)",borderColor:"rgba(255,255,255,0.35)",borderWidth:1,transition:{stiffness:780,damping:72,mass:.85}},link:{width:52,height:52,shape:"circle",color:"rgba(255,255,255,0.08)",borderColor:"rgba(255,255,255,0.38)",borderWidth:1,transition:{stiffness:320,damping:32,mass:1.3}},button:{width:64,height:64,shape:"circle",color:"rgba(255,255,255,0.1)",borderColor:"rgba(255,255,255,0.42)",borderWidth:1,label:"click",fontSize:"10px",labelColor:"rgba(255,255,255,0.65)",transition:{stiffness:340,damping:34,mass:1.3}},text:{width:2,height:28,shape:"square",color:"rgba(255,255,255,0.65)",transition:{stiffness:1400,damping:110,mass:.5}},view:{width:82,height:82,shape:"circle",color:"rgba(255,255,255,0.06)",borderColor:"rgba(255,255,255,0.28)",borderWidth:1,label:"view",fontSize:"11px",labelColor:"rgba(255,255,255,0.58)",transition:{stiffness:190,damping:22,mass:1.9}},drag:{width:62,height:62,shape:"circle",color:"rgba(255,255,255,0.08)",borderColor:"rgba(255,255,255,0.32)",borderWidth:1,label:"drag",fontSize:"10px",labelColor:"rgba(255,255,255,0.6)",transition:{stiffness:270,damping:28,mass:1.3}},close:{width:46,height:46,shape:"circle",color:"rgba(255,120,120,0.1)",borderColor:"rgba(255,120,120,0.45)",borderWidth:1,label:"✕",fontSize:"14px",labelColor:"rgba(255,120,120,0.85)",transition:{stiffness:650,damping:52,mass:.8}},invert:{width:58,height:58,shape:"circle",color:"rgba(255,255,255,1)",mixBlendMode:"difference",transition:{stiffness:500,damping:44,mass:.9}},spot:{width:130,height:130,shape:"circle",color:"rgba(255,255,255,0.04)",borderColor:"rgba(255,255,255,0.1)",borderWidth:1,transition:{stiffness:110,damping:16,mass:2.6}},square:{width:40,height:40,shape:"square",borderRadius:8,color:"rgba(255,255,255,0.1)",borderColor:"rgba(255,255,255,0.35)",borderWidth:1,transition:{stiffness:500,damping:44,mass:.9}}},brutalist:{default:{width:8,height:8,shape:"square",color:"#ffffff",transition:{stiffness:2200,damping:160,mass:.45}},link:{width:40,height:40,shape:"square",color:"#ffffff",mixBlendMode:"difference",transition:{stiffness:1400,damping:100,mass:.6}},button:{width:72,height:10,shape:"square",color:"#ffffff",label:"CLICK",fontSize:"8px",fontWeight:"900",labelColor:"#000000",transition:{stiffness:1400,damping:100,mass:.6}},text:{width:2,height:24,shape:"square",color:"#ffffff",transition:{stiffness:2200,damping:160,mass:.4}},view:{width:64,height:64,shape:"square",color:"transparent",borderColor:"#ffffff",borderWidth:2,label:"VIEW",fontSize:"9px",fontWeight:"800",labelColor:"#ffffff",transition:{stiffness:1e3,damping:75,mass:.8}},drag:{width:12,height:52,shape:"square",color:"#00ff00",transition:{stiffness:1400,damping:100,mass:.6}},close:{width:36,height:36,shape:"square",color:"#ff0000",label:"✕",fontSize:"16px",fontWeight:"900",labelColor:"#ffffff",transition:{stiffness:1400,damping:100,mass:.6}},spot:{width:100,height:100,shape:"square",color:"transparent",borderColor:"rgba(255,255,255,0.2)",borderWidth:2,transition:{stiffness:120,damping:18,mass:2.5}},square:{width:38,height:38,shape:"square",color:"#ffff00",transition:{stiffness:1400,damping:100,mass:.6}},invert:{width:48,height:48,shape:"square",color:"#ffffff",mixBlendMode:"difference",transition:{stiffness:1400,damping:100,mass:.6}}}},exports.useCursor=d,exports.useCursorIdle=({timeout:e=2e3,variant:r="spot",onIdle:n,onWake:o}={})=>{const{setCursorVariant:s}=c(),a=t.useRef(null),l=t.useRef(!1),u=t.useRef(n),d=t.useRef(o);t.useEffect((()=>{u.current=n}),[n]),t.useEffect((()=>{d.current=o}),[o]),t.useEffect((()=>{const t=()=>{var t;a.current&&clearTimeout(a.current),l.current&&(l.current=!1,s("","pop"),null===(t=d.current)||void 0===t||t.call(d)),a.current=setTimeout((()=>{var e;l.current=!0,s(r,"push"),null===(e=u.current)||void 0===e||e.call(u)}),e)},n=i.subscribe(t);return t(),()=>{n(),a.current&&clearTimeout(a.current),l.current&&(l.current=!1,s("","pop"))}}),[e,r,s])},exports.useCursorVariant=()=>{const{setCursorVariant:e,resetCursorToDefault:r,setGlobalCursorVariant:n,clearGlobalCursorVariant:o}=c();return{setVariant:t.useCallback((t=>{e(t,"push")}),[e]),resetVariant:t.useCallback((()=>{r()}),[r]),setGlobalVariant:t.useCallback((e=>{null==n||n(e)}),[n]),clearGlobalVariant:t.useCallback((()=>{null==o||o()}),[o])}},exports.useCursorZone=function({variant:e,threshold:r=.5}){const n=t.useRef(null),{setCursorVariant:o}=c(),s=t.useRef(!1);return t.useEffect((()=>{const t=n.current;if(!t)return;const i=new IntersectionObserver((([t])=>{t.isIntersecting&&!s.current?(s.current=!0,o(e,"push")):!t.isIntersecting&&s.current&&(s.current=!1,o("","pop"))}),{threshold:r});return i.observe(t),()=>{i.disconnect(),s.current&&(s.current=!1,o("","pop"))}}),[e,r,o]),n},exports.useMagnetic=function({strength:e=.35,distance:r=80}={}){const n=t.useRef(null);return t.useEffect((()=>{const t=n.current;if(!t)return;const o=i.subscribe(((n,o)=>{const s=t.getBoundingClientRect(),i=n-(s.left+s.width/2),a=o-(s.top+s.height/2),l=Math.sqrt(i*i+a*a);if(l<r){const n=(1-l/r)*e;t.style.transform=`translate(${i*n}px, ${a*n}px)`,t.style.transition="transform 0.08s linear"}else t.style.transform="translate(0px, 0px)",t.style.transition="transform 0.4s ease"}));return()=>{o(),n.current&&(n.current.style.transform="",n.current.style.transition="")}}),[e,r]),n},exports.useMousePosition=()=>{const[e,r]=t.useState({x:0,y:0}),n=t.useRef(null);return t.useEffect((()=>i.subscribe((()=>{null===n.current&&(n.current=requestAnimationFrame((()=>{r({x:i.x,y:i.y}),n.current=null})))}))),[]),"undefined"!=typeof window?e:{x:0,y:0}},exports.useVelocityCursor=function({idleThreshold:e=50}={}){const[r,n]=t.useState({speed:0,angle:0,vx:0,vy:0,isMoving:!1}),o=t.useRef({vx:0,vy:0,lastX:0,lastY:0,lastTime:0}),s=t.useRef({vx:0,vy:0}),a=t.useRef(0);return t.useEffect((()=>{o.current.lastTime=performance.now();let t=0;const r=()=>{performance.now()-o.current.lastTime>60&&(o.current.vx*=.8,o.current.vy*=.8);const i=s.current;i.vx+=.12*(o.current.vx-i.vx),i.vy+=.12*(o.current.vy-i.vy);const l=Math.sqrt(i.vx*i.vx+i.vy*i.vy),c=l>1?Math.atan2(i.vy,i.vx)*(180/Math.PI):0;if(n((t=>{const r=l>e;return Math.abs(t.speed-l)<1&&t.isMoving===r?t:{speed:Math.round(l),angle:Math.round(c),vx:Math.round(i.vx),vy:Math.round(i.vy),isMoving:r}})),l<1){if(t++,t>=180)return void(a.current=0)}else t=0;a.current=requestAnimationFrame(r)},l=i.subscribe(((e,n)=>{const s=performance.now(),i=Math.max((s-o.current.lastTime)/1e3,.001);o.current.vx=(e-o.current.lastX)/i,o.current.vy=(n-o.current.lastY)/i,o.current.lastX=e,o.current.lastY=n,o.current.lastTime=s,0===a.current&&(t=0,a.current=requestAnimationFrame(r))}));return a.current=requestAnimationFrame(r),()=>{l(),0!==a.current&&cancelAnimationFrame(a.current)}}),[e]),r};
//# sourceMappingURL=index.cjs.map