UNPKG

react-move-element

Version:

Rotating element that track the mouse in React (compatible React v17 and higher)

3 lines (2 loc) 1.85 kB
Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),n=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,r=function(){return(r=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e}).apply(this,arguments)},o=function(e,t,n){n.current.style.transform="rotate("+(Math.atan2(e,t)*(180/Math.PI)*-1+180)+"deg)"};exports.RotatingElement=function(e){function i(e){var t,n;e&&(n=(t=s).current.getBoundingClientRect(),n=(t={centerX:(t=function(e){for(var t=0,n=0;e&&!isNaN(e.offsetLeft)&&!isNaN(e.offsetTop);)t+=e.offsetLeft-e.scrollLeft,n+=e.offsetTop-e.scrollTop,e=e.offsetParent;return{top:n,left:t}}(t.current)).left+n.width/2,centerY:t.top+n.height/2}).centerX,t=t.centerY,u||(n-=window.pageXOffset,t-=window.pageYOffset),n=e.clientX-n,e=e.clientY-t,d.current=n,p.current=e,o(n,e,s))}function l(e){var t,n,r;e&&(t=null==(t=null==e?void 0:e.target)?void 0:t.scrollingElement.scrollLeft,e=null==(e=null==e?void 0:e.target)?void 0:e.scrollingElement.scrollTop,n=t-f.current,r=e-a.current,f.current=t,a.current=e,o(d.current+n,p.current+r,s),d.current=d.current+n,p.current=p.current+r)}var c=e.children,e=e.isFixed,u=void 0!==e&&e,s=t.useRef(),f=t.useRef(0),a=t.useRef(0),d=t.useRef(0),p=t.useRef(0);return t.useEffect(function(){return s.current&&(window.addEventListener("mousemove",i,{passive:!0,capture:!1}),u||window.addEventListener("scroll",l,{passive:!0,capture:!1})),function(){window.removeEventListener("mousemove",i,!1),u||window.removeEventListener("scroll",l,!1)}},[]),n.createElement(n.Fragment,null,(e=c,c=s,n.isValidElement(e)?n.cloneElement(e,{ref:c,style:r(r({},e.props.style),{display:"inline-block",margin:"0",padding:"0"})}):"Unique children element is needed"))}; //# sourceMappingURL=index.js.map