with-custom-cursor
Version:
A Higher-Order Component (HOC) library for React that enables you to easily add a custom cursor to any component.
24 lines (23 loc) • 7.45 kB
JavaScript
(function(p,_){typeof exports=="object"&&typeof module<"u"?_(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],_):(p=typeof globalThis<"u"?globalThis:p||self,_(p.WithCustomCursor={},p.React))})(this,function(p,_){"use strict";var M=document.createElement("style");M.textContent=`._wrapper_ebjkc_1{display:contents}._cursor_ebjkc_5{position:absolute;pointer-events:none;opacity:0}
/*$vite$:1*/`,document.head.appendChild(M);var w={exports:{}},h={};/**
* @license React
* react-jsx-runtime.production.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/var I;function q(){if(I)return h;I=1;var u=Symbol.for("react.transitional.element"),R=Symbol.for("react.fragment");function T(i,n,s){var l=null;if(s!==void 0&&(l=""+s),n.key!==void 0&&(l=""+n.key),"key"in n){s={};for(var E in n)E!=="key"&&(s[E]=n[E])}else s=n;return n=s.ref,{$$typeof:u,type:i,key:l,ref:n!==void 0?n:null,props:s}}return h.Fragment=R,h.jsx=T,h.jsxs=T,h}var j={};/**
* @license React
* react-jsx-runtime.development.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/var W;function G(){return W||(W=1,process.env.NODE_ENV!=="production"&&function(){function u(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===se?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case v:return"Fragment";case Q:return"Profiler";case Z:return"StrictMode";case te:return"Suspense";case ne:return"SuspenseList";case ae:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case O:return"Portal";case ee:return(e.displayName||"Context")+".Provider";case K:return(e._context.displayName||"Context")+".Consumer";case re:var r=e.render;return e=e.displayName,e||(e=r.displayName||r.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case oe:return r=e.displayName||null,r!==null?r:u(e.type)||"Memo";case $:r=e._payload,e=e._init;try{return u(e(r))}catch{}}return null}function R(e){return""+e}function T(e){try{R(e);var r=!1}catch{r=!0}if(r){r=console;var t=r.error,o=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return t.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",o),R(e)}}function i(e){if(e===v)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===$)return"<...>";try{var r=u(e);return r?"<"+r+">":"<...>"}catch{return"<...>"}}function n(){var e=P.A;return e===null?null:e.getOwner()}function s(){return Error("react-stack-top-frame")}function l(e){if(L.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function E(e,r){function t(){U||(U=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",r))}t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}function S(){var e=u(this.type);return J[e]||(J[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function A(e,r,t,o,m,c,C,N){return t=c.ref,e={$$typeof:k,type:e,key:r,props:c,_owner:m},(t!==void 0?t:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:S}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:C}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:N}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function f(e,r,t,o,m,c,C,N){var a=r.children;if(a!==void 0)if(o)if(ce(a)){for(o=0;o<a.length;o++)b(a[o]);Object.freeze&&Object.freeze(a)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else b(a);if(L.call(r,"key")){a=u(e);var x=Object.keys(r).filter(function(ue){return ue!=="key"});o=0<x.length?"{key: someKey, "+x.join(": ..., ")+": ...}":"{key: someKey}",X[a+o]||(x=0<x.length?"{"+x.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
let props = %s;
<%s {...props} />
React keys must be passed directly to JSX without using spread:
let props = %s;
<%s key={someKey} {...props} />`,o,a,x,a),X[a+o]=!0)}if(a=null,t!==void 0&&(T(t),a=""+t),l(r)&&(T(r.key),a=""+r.key),"key"in r){t={};for(var Y in r)Y!=="key"&&(t[Y]=r[Y])}else t=r;return a&&E(t,typeof e=="function"?e.displayName||e.name||"Unknown":e),A(e,a,c,m,n(),t,C,N)}function b(e){typeof e=="object"&&e!==null&&e.$$typeof===k&&e._store&&(e._store.validated=1)}var d=_,k=Symbol.for("react.transitional.element"),O=Symbol.for("react.portal"),v=Symbol.for("react.fragment"),Z=Symbol.for("react.strict_mode"),Q=Symbol.for("react.profiler"),K=Symbol.for("react.consumer"),ee=Symbol.for("react.context"),re=Symbol.for("react.forward_ref"),te=Symbol.for("react.suspense"),ne=Symbol.for("react.suspense_list"),oe=Symbol.for("react.memo"),$=Symbol.for("react.lazy"),ae=Symbol.for("react.activity"),se=Symbol.for("react.client.reference"),P=d.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,L=Object.prototype.hasOwnProperty,ce=Array.isArray,g=console.createTask?console.createTask:function(){return null};d={"react-stack-bottom-frame":function(e){return e()}};var U,J={},V=d["react-stack-bottom-frame"].bind(d,s)(),z=g(i(s)),X={};j.Fragment=v,j.jsx=function(e,r,t,o,m){var c=1e4>P.recentlyCreatedOwnerStacks++;return f(e,r,t,!1,o,m,c?Error("react-stack-top-frame"):V,c?g(i(e)):z)},j.jsxs=function(e,r,t,o,m){var c=1e4>P.recentlyCreatedOwnerStacks++;return f(e,r,t,!0,o,m,c?Error("react-stack-top-frame"):V,c?g(i(e)):z)}}()),j}var F;function B(){return F||(F=1,process.env.NODE_ENV==="production"?w.exports=q():w.exports=G()),w.exports}var y=B();const D={wrapper:"_wrapper_ebjkc_1",cursor:"_cursor_ebjkc_5"},H=(u,R)=>function(i){const n=_.useRef(null),[s,l]=_.useState(!1),E=f=>{const b=f.currentTarget.getBoundingClientRect(),d=f.clientX-b.left,k=f.clientY-b.top;if(n&&n.current){const{x:O,y:v}=S(n.current.clientWidth,n.current.clientHeight,d,k);n.current.style.transform=`translate3d(${O}px, ${v}px, 0)`}},S=(f,b,d,k)=>{const O=d-f/2,v=k-b/2;return{x:O,y:v}},A={ref:n,...i};return y.jsxs("div",{className:D.wrapper,onMouseEnter:()=>l(!0),onMouseLeave:()=>l(!1),children:[y.jsx("div",{className:D.cursor,style:{opacity:s?1:0,pointerEvents:"none"},children:y.jsx(R,{...A})}),y.jsx("div",{onMouseMove:E,style:{cursor:"none"},children:y.jsx(u,{...i})})]})};p.WithCustomCursor=H,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})});