animated-cursor - npm Package Compare versions

Comparing version 1.0.3 to 1.0.4

dist/index.esm.js

@@ -1,2 +0,2 @@
-function e(e,r,t){return(1-t)*e+t*r}function r(e,r){e=e.replace("#","");var t=parseInt(3==e.length?e.slice(0,1).repeat(2):e.slice(0,2),16),n=parseInt(3==e.length?e.slice(1,2).repeat(2):e.slice(2,4),16),o=parseInt(3==e.length?e.slice(2,3).repeat(2):e.slice(4,6),16);return 0===r?"rgba("+t+", "+n+", "+o+", 0)":r?"rgba("+t+", "+n+", "+o+", "+r+")":"rgb("+t+", "+n+", "+o+")"}function t(e,r){var t=document.querySelector(e);for(var n in r)t.style[n]=r[n]}var n={cursorInnerSelector:"#cursor-inner",cursorOuterSelector:"#cursor-outer",hasRequiredStyles:!0,color:"#D3245C",outerAlpha:.3,outerBorderSize:0,size:{inner:8,outer:40},hoverScale:{inner:.75,outer:1.5},clickScale:{inner:1.5,outer:.13},trailingSpeed:.2,clickables:["a",'input[type="text"]','input[type="email"]','input[type="number"]','input[type="submit"]','input[type="image"]',"label[for]","select","textarea","button",".link"]};function o(o){var s=Object.assign({},n,o),i={cursorInner:document.querySelector(s.cursorInnerSelector),cursorOuter:document.querySelector(s.cursorOuterSelector),hasRequiredStyles:s.hasRequiredStyles,targetPos:{x:.5,y:.5},cursorPos:{x:.5,y:.5},endX:window.innerWidth/2,endY:window.innerHeight/2,raf:requestAnimationFrame(u),cursorVisible:!0,isScaled:!1,isClicking:!1};function c(e){var r;i.isVisible=!0,a(),i.targetPos.x=e.clientX,i.targetPos.y=e.clientY,r=e.clientX,i.cursorInner.style.top=e.clientY+"px",i.cursorInner.style.left=r+"px",i.raf||(i.raf=requestAnimationFrame(u))}function u(){if(i.cursorPos.x=e(i.cursorPos.x,i.targetPos.x,s.trailingSpeed),i.cursorPos.y=e(i.cursorPos.y,i.targetPos.y,s.trailingSpeed),i.cursorOuter.style.top=i.cursorPos.y+"px",i.cursorOuter.style.left=i.cursorPos.x+"px",Math.sqrt(Math.pow(i.targetPos.x-i.cursorPos.x,2)+Math.pow(i.targetPos.y-i.cursorPos.y,2))<.001)return window.cancelAnimationFrame(i.raf),void(i.raf=null);i.raf=requestAnimationFrame(u)}function a(){i.isVisible?(i.cursorInner.style.opacity=1,i.cursorOuter.style.opacity=1):(i.cursorInner.style.opacity=0,i.cursorOuter.style.opacity=0)}function l(){i.isClicking?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.clickScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.clickScale.outer+")"):i.isScaled?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.hoverScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.hoverScale.outer+")"):(i.cursorInner.style.transform="translate(-50%, -50%) scale(1)",i.cursorOuter.style.transform="translate(-50%, -50%) scale(1)")}return{init:function(){var e,n,o;window.addEventListener("mousemove",c),document.querySelectorAll(s.clickables.join(",")).forEach(function(e){return function(e){e.style.cursor="none",e.addEventListener("mouseover",function(){i.isScaled=!0,l()}),e.addEventListener("mouseout",function(){i.isScaled=!1,l()})}(e)}),document.addEventListener("mousedown",function(){i.isClicking=!0,l()}),document.addEventListener("mouseup",function(){i.isScaled=!1,i.isClicking=!1,l()}),document.addEventListener("mouseleave",function(e){var r;((r=e).clientY<=0||r.clientX<=0||r.clientX>=window.innerWidth||r.clientY>=window.innerHeight)&&(i.isVisible=!1,a())}),i.isVisible=!1,a(),s.hasRequiredStyles&&(t(s.cursorInnerSelector,e={"pointer-events":"none",position:"fixed","border-radius":"50%",opacity:0,transform:"translate(-50%, -50%)",transition:"opacity 0.25s ease-in-out, transform 0.25s ease-in-out"}),t(s.cursorOuterSelector,e)),s.outerBorderSize>0&&i.cursorOuter.style.setProperty("border",s.outerBorderSize+"px solid "+s.color),n=r(s.color),o=r(s.color,s.outerAlpha),i.cursorInner.style.setProperty("background-color",n),i.cursorOuter.style.setProperty("background-color",o),i.cursorInner.style.setProperty("width",s.size.inner+"px"),i.cursorInner.style.setProperty("height",s.size.inner+"px"),i.cursorOuter.style.setProperty("width",s.size.outer+"px"),i.cursorOuter.style.setProperty("height",s.size.outer+"px")}}}o.options=n;export{o as default};
+function e(e,r,t){return(1-t)*e+t*r}function r(e,r){e=e.replace("#","");var t=parseInt(3==e.length?e.slice(0,1).repeat(2):e.slice(0,2),16),o=parseInt(3==e.length?e.slice(1,2).repeat(2):e.slice(2,4),16),n=parseInt(3==e.length?e.slice(2,3).repeat(2):e.slice(4,6),16);return 0===r?"rgba("+t+", "+o+", "+n+", 0)":r?"rgba("+t+", "+o+", "+n+", "+r+")":"rgb("+t+", "+o+", "+n+")"}function t(e,r){var t=document.querySelector(e);for(var o in r)t.style[o]=r[o]}var o={cursorInnerSelector:"#cursor-inner",cursorOuterSelector:"#cursor-outer",hasRequiredStyles:!0,hideNativeCursor:!0,color:"#D3245C",outerAlpha:.3,outerBorderSize:0,size:{inner:8,outer:40},hoverScale:{inner:.75,outer:1.5},clickScale:{inner:1.5,outer:.13},trailingSpeed:.2,clickables:["a",'input[type="text"]','input[type="email"]','input[type="number"]','input[type="submit"]','input[type="image"]',"label[for]","select","textarea","button",".link"]};function n(n){var s=Object.assign({},o,n),i={cursorInner:document.querySelector(s.cursorInnerSelector),cursorOuter:document.querySelector(s.cursorOuterSelector),hasRequiredStyles:s.hasRequiredStyles,targetPos:{x:.5,y:.5},cursorPos:{x:.5,y:.5},endX:window.innerWidth/2,endY:window.innerHeight/2,raf:requestAnimationFrame(u),cursorVisible:!0,isScaled:!1,isClicking:!1};function c(e){var r;i.isVisible=!0,a(),i.targetPos.x=e.clientX,i.targetPos.y=e.clientY,r=e.clientX,i.cursorInner.style.top=e.clientY+"px",i.cursorInner.style.left=r+"px",i.raf||(i.raf=requestAnimationFrame(u))}function u(){if(i.cursorPos.x=e(i.cursorPos.x,i.targetPos.x,s.trailingSpeed),i.cursorPos.y=e(i.cursorPos.y,i.targetPos.y,s.trailingSpeed),i.cursorOuter.style.top=i.cursorPos.y+"px",i.cursorOuter.style.left=i.cursorPos.x+"px",Math.sqrt(Math.pow(i.targetPos.x-i.cursorPos.x,2)+Math.pow(i.targetPos.y-i.cursorPos.y,2))<.001)return window.cancelAnimationFrame(i.raf),void(i.raf=null);i.raf=requestAnimationFrame(u)}function a(){i.isVisible?(i.cursorInner.style.opacity=1,i.cursorOuter.style.opacity=1):(i.cursorInner.style.opacity=0,i.cursorOuter.style.opacity=0)}function l(){i.isClicking?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.clickScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.clickScale.outer+")"):i.isScaled?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.hoverScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.hoverScale.outer+")"):(i.cursorInner.style.transform="translate(-50%, -50%) scale(1)",i.cursorOuter.style.transform="translate(-50%, -50%) scale(1)")}return{init:function(){var e,o,n;"undefined"!=typeof window&&("ontouchstart"in window||window.DocumentTouch&&"undefined"!=typeof document&&document instanceof window.DocumentTouch)||"undefined"!=typeof navigator&&(navigator.maxTouchPoints||navigator.msMaxTouchPoints)||(window.addEventListener("mousemove",c),document.querySelectorAll(s.clickables.join(",")).forEach(function(e){return function(e){e.style.cursor="none",e.addEventListener("mouseover",function(){i.isScaled=!0,l()}),e.addEventListener("mouseout",function(){i.isScaled=!1,l()})}(e)}),document.addEventListener("mousedown",function(){i.isClicking=!0,l()}),document.addEventListener("mouseup",function(){i.isScaled=!1,i.isClicking=!1,l()}),document.addEventListener("mouseleave",function(e){var r;((r=e).clientY<=0||r.clientX<=0||r.clientX>=window.innerWidth||r.clientY>=window.innerHeight)&&(i.isVisible=!1,a())}),i.isVisible=!1,a(),e=r(s.color),o=r(s.color,s.outerAlpha),i.cursorInner.style.setProperty("background-color",e),i.cursorOuter.style.setProperty("background-color",o),i.cursorInner.style.setProperty("width",s.size.inner+"px"),i.cursorInner.style.setProperty("height",s.size.inner+"px"),i.cursorOuter.style.setProperty("width",s.size.outer+"px"),i.cursorOuter.style.setProperty("height",s.size.outer+"px"),s.hideNativeCursor&&(document.querySelector("body").style.cursor="none",document.querySelector("html").style.cursor="none"),s.hasRequiredStyles&&(t(s.cursorInnerSelector,n={"pointer-events":"none",position:"fixed","border-radius":"50%",opacity:0,transform:"translate(-50%, -50%)",transition:"opacity 0.25s ease-in-out, transform 0.25s ease-in-out"}),t(s.cursorOuterSelector,n)),s.outerBorderSize>0&&i.cursorOuter.style.setProperty("border",s.outerBorderSize+"px solid "+s.color))}}}n.options=o;export{n as default};
 //# sourceMappingURL=index.esm.js.map

dist/index.js

@@ -1,2 +0,2 @@
-function e(e,r,t){return(1-t)*e+t*r}function r(e,r){e=e.replace("#","");var t=parseInt(3==e.length?e.slice(0,1).repeat(2):e.slice(0,2),16),o=parseInt(3==e.length?e.slice(1,2).repeat(2):e.slice(2,4),16),n=parseInt(3==e.length?e.slice(2,3).repeat(2):e.slice(4,6),16);return 0===r?"rgba("+t+", "+o+", "+n+", 0)":r?"rgba("+t+", "+o+", "+n+", "+r+")":"rgb("+t+", "+o+", "+n+")"}function t(e,r){var t=document.querySelector(e);for(var o in r)t.style[o]=r[o]}var o={cursorInnerSelector:"#cursor-inner",cursorOuterSelector:"#cursor-outer",hasRequiredStyles:!0,color:"#D3245C",outerAlpha:.3,outerBorderSize:0,size:{inner:8,outer:40},hoverScale:{inner:.75,outer:1.5},clickScale:{inner:1.5,outer:.13},trailingSpeed:.2,clickables:["a",'input[type="text"]','input[type="email"]','input[type="number"]','input[type="submit"]','input[type="image"]',"label[for]","select","textarea","button",".link"]};function n(n){var s=Object.assign({},o,n),i={cursorInner:document.querySelector(s.cursorInnerSelector),cursorOuter:document.querySelector(s.cursorOuterSelector),hasRequiredStyles:s.hasRequiredStyles,targetPos:{x:.5,y:.5},cursorPos:{x:.5,y:.5},endX:window.innerWidth/2,endY:window.innerHeight/2,raf:requestAnimationFrame(u),cursorVisible:!0,isScaled:!1,isClicking:!1};function c(e){var r;i.isVisible=!0,l(),i.targetPos.x=e.clientX,i.targetPos.y=e.clientY,r=e.clientX,i.cursorInner.style.top=e.clientY+"px",i.cursorInner.style.left=r+"px",i.raf||(i.raf=requestAnimationFrame(u))}function u(){if(i.cursorPos.x=e(i.cursorPos.x,i.targetPos.x,s.trailingSpeed),i.cursorPos.y=e(i.cursorPos.y,i.targetPos.y,s.trailingSpeed),i.cursorOuter.style.top=i.cursorPos.y+"px",i.cursorOuter.style.left=i.cursorPos.x+"px",Math.sqrt(Math.pow(i.targetPos.x-i.cursorPos.x,2)+Math.pow(i.targetPos.y-i.cursorPos.y,2))<.001)return window.cancelAnimationFrame(i.raf),void(i.raf=null);i.raf=requestAnimationFrame(u)}function l(){i.isVisible?(i.cursorInner.style.opacity=1,i.cursorOuter.style.opacity=1):(i.cursorInner.style.opacity=0,i.cursorOuter.style.opacity=0)}function a(){i.isClicking?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.clickScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.clickScale.outer+")"):i.isScaled?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.hoverScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.hoverScale.outer+")"):(i.cursorInner.style.transform="translate(-50%, -50%) scale(1)",i.cursorOuter.style.transform="translate(-50%, -50%) scale(1)")}return{init:function(){var e,o,n;window.addEventListener("mousemove",c),document.querySelectorAll(s.clickables.join(",")).forEach(function(e){return function(e){e.style.cursor="none",e.addEventListener("mouseover",function(){i.isScaled=!0,a()}),e.addEventListener("mouseout",function(){i.isScaled=!1,a()})}(e)}),document.addEventListener("mousedown",function(){i.isClicking=!0,a()}),document.addEventListener("mouseup",function(){i.isScaled=!1,i.isClicking=!1,a()}),document.addEventListener("mouseleave",function(e){var r;((r=e).clientY<=0||r.clientX<=0||r.clientX>=window.innerWidth||r.clientY>=window.innerHeight)&&(i.isVisible=!1,l())}),i.isVisible=!1,l(),s.hasRequiredStyles&&(t(s.cursorInnerSelector,e={"pointer-events":"none",position:"fixed","border-radius":"50%",opacity:0,transform:"translate(-50%, -50%)",transition:"opacity 0.25s ease-in-out, transform 0.25s ease-in-out"}),t(s.cursorOuterSelector,e)),s.outerBorderSize>0&&i.cursorOuter.style.setProperty("border",s.outerBorderSize+"px solid "+s.color),o=r(s.color),n=r(s.color,s.outerAlpha),i.cursorInner.style.setProperty("background-color",o),i.cursorOuter.style.setProperty("background-color",n),i.cursorInner.style.setProperty("width",s.size.inner+"px"),i.cursorInner.style.setProperty("height",s.size.inner+"px"),i.cursorOuter.style.setProperty("width",s.size.outer+"px"),i.cursorOuter.style.setProperty("height",s.size.outer+"px")}}}n.options=o,module.exports=n;
+function e(e,r,t){return(1-t)*e+t*r}function r(e,r){e=e.replace("#","");var t=parseInt(3==e.length?e.slice(0,1).repeat(2):e.slice(0,2),16),o=parseInt(3==e.length?e.slice(1,2).repeat(2):e.slice(2,4),16),n=parseInt(3==e.length?e.slice(2,3).repeat(2):e.slice(4,6),16);return 0===r?"rgba("+t+", "+o+", "+n+", 0)":r?"rgba("+t+", "+o+", "+n+", "+r+")":"rgb("+t+", "+o+", "+n+")"}function t(e,r){var t=document.querySelector(e);for(var o in r)t.style[o]=r[o]}var o={cursorInnerSelector:"#cursor-inner",cursorOuterSelector:"#cursor-outer",hasRequiredStyles:!0,hideNativeCursor:!0,color:"#D3245C",outerAlpha:.3,outerBorderSize:0,size:{inner:8,outer:40},hoverScale:{inner:.75,outer:1.5},clickScale:{inner:1.5,outer:.13},trailingSpeed:.2,clickables:["a",'input[type="text"]','input[type="email"]','input[type="number"]','input[type="submit"]','input[type="image"]',"label[for]","select","textarea","button",".link"]};function n(n){var s=Object.assign({},o,n),i={cursorInner:document.querySelector(s.cursorInnerSelector),cursorOuter:document.querySelector(s.cursorOuterSelector),hasRequiredStyles:s.hasRequiredStyles,targetPos:{x:.5,y:.5},cursorPos:{x:.5,y:.5},endX:window.innerWidth/2,endY:window.innerHeight/2,raf:requestAnimationFrame(u),cursorVisible:!0,isScaled:!1,isClicking:!1};function c(e){var r;i.isVisible=!0,a(),i.targetPos.x=e.clientX,i.targetPos.y=e.clientY,r=e.clientX,i.cursorInner.style.top=e.clientY+"px",i.cursorInner.style.left=r+"px",i.raf||(i.raf=requestAnimationFrame(u))}function u(){if(i.cursorPos.x=e(i.cursorPos.x,i.targetPos.x,s.trailingSpeed),i.cursorPos.y=e(i.cursorPos.y,i.targetPos.y,s.trailingSpeed),i.cursorOuter.style.top=i.cursorPos.y+"px",i.cursorOuter.style.left=i.cursorPos.x+"px",Math.sqrt(Math.pow(i.targetPos.x-i.cursorPos.x,2)+Math.pow(i.targetPos.y-i.cursorPos.y,2))<.001)return window.cancelAnimationFrame(i.raf),void(i.raf=null);i.raf=requestAnimationFrame(u)}function a(){i.isVisible?(i.cursorInner.style.opacity=1,i.cursorOuter.style.opacity=1):(i.cursorInner.style.opacity=0,i.cursorOuter.style.opacity=0)}function l(){i.isClicking?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.clickScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.clickScale.outer+")"):i.isScaled?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.hoverScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.hoverScale.outer+")"):(i.cursorInner.style.transform="translate(-50%, -50%) scale(1)",i.cursorOuter.style.transform="translate(-50%, -50%) scale(1)")}return{init:function(){var e,o,n;"undefined"!=typeof window&&("ontouchstart"in window||window.DocumentTouch&&"undefined"!=typeof document&&document instanceof window.DocumentTouch)||"undefined"!=typeof navigator&&(navigator.maxTouchPoints||navigator.msMaxTouchPoints)||(window.addEventListener("mousemove",c),document.querySelectorAll(s.clickables.join(",")).forEach(function(e){return function(e){e.style.cursor="none",e.addEventListener("mouseover",function(){i.isScaled=!0,l()}),e.addEventListener("mouseout",function(){i.isScaled=!1,l()})}(e)}),document.addEventListener("mousedown",function(){i.isClicking=!0,l()}),document.addEventListener("mouseup",function(){i.isScaled=!1,i.isClicking=!1,l()}),document.addEventListener("mouseleave",function(e){var r;((r=e).clientY<=0||r.clientX<=0||r.clientX>=window.innerWidth||r.clientY>=window.innerHeight)&&(i.isVisible=!1,a())}),i.isVisible=!1,a(),e=r(s.color),o=r(s.color,s.outerAlpha),i.cursorInner.style.setProperty("background-color",e),i.cursorOuter.style.setProperty("background-color",o),i.cursorInner.style.setProperty("width",s.size.inner+"px"),i.cursorInner.style.setProperty("height",s.size.inner+"px"),i.cursorOuter.style.setProperty("width",s.size.outer+"px"),i.cursorOuter.style.setProperty("height",s.size.outer+"px"),s.hideNativeCursor&&(document.querySelector("body").style.cursor="none",document.querySelector("html").style.cursor="none"),s.hasRequiredStyles&&(t(s.cursorInnerSelector,n={"pointer-events":"none",position:"fixed","border-radius":"50%",opacity:0,transform:"translate(-50%, -50%)",transition:"opacity 0.25s ease-in-out, transform 0.25s ease-in-out"}),t(s.cursorOuterSelector,n)),s.outerBorderSize>0&&i.cursorOuter.style.setProperty("border",s.outerBorderSize+"px solid "+s.color))}}}n.options=o,module.exports=n;
 //# sourceMappingURL=index.js.map

dist/index.modern.js

@@ -1,2 +0,2 @@
-function e(e,r,t){return(1-t)*e+t*r}function r(e,r){e=e.replace("#","");const t=parseInt(3==e.length?e.slice(0,1).repeat(2):e.slice(0,2),16),o=parseInt(3==e.length?e.slice(1,2).repeat(2):e.slice(2,4),16),s=parseInt(3==e.length?e.slice(2,3).repeat(2):e.slice(4,6),16);return 0===r?`rgba(${t}, ${o}, ${s}, 0)`:r?`rgba(${t}, ${o}, ${s}, ${r})`:`rgb(${t}, ${o}, ${s})`}function t(e,r){var t=document.querySelector(e);for(var o in r)t.style[o]=r[o]}const o={cursorInnerSelector:"#cursor-inner",cursorOuterSelector:"#cursor-outer",hasRequiredStyles:!0,color:"#D3245C",outerAlpha:.3,outerBorderSize:0,size:{inner:8,outer:40},hoverScale:{inner:.75,outer:1.5},clickScale:{inner:1.5,outer:.13},trailingSpeed:.2,clickables:["a",'input[type="text"]','input[type="email"]','input[type="number"]','input[type="submit"]','input[type="image"]',"label[for]","select","textarea","button",".link"]};function s(s){let n=Object.assign({},o,s),i={cursorInner:document.querySelector(n.cursorInnerSelector),cursorOuter:document.querySelector(n.cursorOuterSelector),hasRequiredStyles:n.hasRequiredStyles,targetPos:{x:.5,y:.5},cursorPos:{x:.5,y:.5},endX:window.innerWidth/2,endY:window.innerHeight/2,raf:requestAnimationFrame(u),cursorVisible:!0,isScaled:!1,isClicking:!1};function c(e){var r;i.isVisible=!0,l(),i.targetPos.x=e.clientX,i.targetPos.y=e.clientY,r=e.clientX,i.cursorInner.style.top=`${e.clientY}px`,i.cursorInner.style.left=`${r}px`,i.raf||(i.raf=requestAnimationFrame(u))}function u(){if(i.cursorPos.x=e(i.cursorPos.x,i.targetPos.x,n.trailingSpeed),i.cursorPos.y=e(i.cursorPos.y,i.targetPos.y,n.trailingSpeed),i.cursorOuter.style.top=`${i.cursorPos.y}px`,i.cursorOuter.style.left=`${i.cursorPos.x}px`,Math.sqrt(Math.pow(i.targetPos.x-i.cursorPos.x,2)+Math.pow(i.targetPos.y-i.cursorPos.y,2))<.001)return window.cancelAnimationFrame(i.raf),void(i.raf=null);i.raf=requestAnimationFrame(u)}function l(){i.isVisible?(i.cursorInner.style.opacity=1,i.cursorOuter.style.opacity=1):(i.cursorInner.style.opacity=0,i.cursorOuter.style.opacity=0)}function a(){i.isClicking?(i.cursorInner.style.transform=`translate(-50%, -50%) scale(${n.clickScale.inner})`,i.cursorOuter.style.transform=`translate(-50%, -50%) scale(${n.clickScale.outer})`):i.isScaled?(i.cursorInner.style.transform=`translate(-50%, -50%) scale(${n.hoverScale.inner})`,i.cursorOuter.style.transform=`translate(-50%, -50%) scale(${n.hoverScale.outer})`):(i.cursorInner.style.transform="translate(-50%, -50%) scale(1)",i.cursorOuter.style.transform="translate(-50%, -50%) scale(1)")}return{init:function(){window.addEventListener("mousemove",c),document.querySelectorAll(n.clickables.join(",")).forEach(e=>function(e){e.style.cursor="none",e.addEventListener("mouseover",()=>{i.isScaled=!0,a()}),e.addEventListener("mouseout",()=>{i.isScaled=!1,a()})}(e)),document.addEventListener("mousedown",()=>{i.isClicking=!0,a()}),document.addEventListener("mouseup",()=>{i.isScaled=!1,i.isClicking=!1,a()}),document.addEventListener("mouseleave",e=>{var r;((r=e).clientY<=0||r.clientX<=0||r.clientX>=window.innerWidth||r.clientY>=window.innerHeight)&&(i.isVisible=!1,l())}),i.isVisible=!1,l(),n.hasRequiredStyles&&function(){const e={"pointer-events":"none",position:"fixed","border-radius":"50%",opacity:0,transform:"translate(-50%, -50%)",transition:"opacity 0.25s ease-in-out, transform 0.25s ease-in-out"};t(n.cursorInnerSelector,e),t(n.cursorOuterSelector,e)}(),n.outerBorderSize>0&&i.cursorOuter.style.setProperty("border",`${n.outerBorderSize}px solid ${n.color}`),function(){const e=r(n.color),t=r(n.color,n.outerAlpha);i.cursorInner.style.setProperty("background-color",e),i.cursorOuter.style.setProperty("background-color",t)}(),i.cursorInner.style.setProperty("width",`${n.size.inner}px`),i.cursorInner.style.setProperty("height",`${n.size.inner}px`),i.cursorOuter.style.setProperty("width",`${n.size.outer}px`),i.cursorOuter.style.setProperty("height",`${n.size.outer}px`)}}}s.options=o;export{s as default};
+function e(e,r,t){return(1-t)*e+t*r}function r(e,r){e=e.replace("#","");const t=parseInt(3==e.length?e.slice(0,1).repeat(2):e.slice(0,2),16),o=parseInt(3==e.length?e.slice(1,2).repeat(2):e.slice(2,4),16),n=parseInt(3==e.length?e.slice(2,3).repeat(2):e.slice(4,6),16);return 0===r?`rgba(${t}, ${o}, ${n}, 0)`:r?`rgba(${t}, ${o}, ${n}, ${r})`:`rgb(${t}, ${o}, ${n})`}function t(e,r){var t=document.querySelector(e);for(var o in r)t.style[o]=r[o]}const o={cursorInnerSelector:"#cursor-inner",cursorOuterSelector:"#cursor-outer",hasRequiredStyles:!0,hideNativeCursor:!0,color:"#D3245C",outerAlpha:.3,outerBorderSize:0,size:{inner:8,outer:40},hoverScale:{inner:.75,outer:1.5},clickScale:{inner:1.5,outer:.13},trailingSpeed:.2,clickables:["a",'input[type="text"]','input[type="email"]','input[type="number"]','input[type="submit"]','input[type="image"]',"label[for]","select","textarea","button",".link"]};function n(n){let s=Object.assign({},o,n),i={cursorInner:document.querySelector(s.cursorInnerSelector),cursorOuter:document.querySelector(s.cursorOuterSelector),hasRequiredStyles:s.hasRequiredStyles,targetPos:{x:.5,y:.5},cursorPos:{x:.5,y:.5},endX:window.innerWidth/2,endY:window.innerHeight/2,raf:requestAnimationFrame(u),cursorVisible:!0,isScaled:!1,isClicking:!1};function c(e){var r;i.isVisible=!0,a(),i.targetPos.x=e.clientX,i.targetPos.y=e.clientY,r=e.clientX,i.cursorInner.style.top=`${e.clientY}px`,i.cursorInner.style.left=`${r}px`,i.raf||(i.raf=requestAnimationFrame(u))}function u(){if(i.cursorPos.x=e(i.cursorPos.x,i.targetPos.x,s.trailingSpeed),i.cursorPos.y=e(i.cursorPos.y,i.targetPos.y,s.trailingSpeed),i.cursorOuter.style.top=`${i.cursorPos.y}px`,i.cursorOuter.style.left=`${i.cursorPos.x}px`,Math.sqrt(Math.pow(i.targetPos.x-i.cursorPos.x,2)+Math.pow(i.targetPos.y-i.cursorPos.y,2))<.001)return window.cancelAnimationFrame(i.raf),void(i.raf=null);i.raf=requestAnimationFrame(u)}function a(){i.isVisible?(i.cursorInner.style.opacity=1,i.cursorOuter.style.opacity=1):(i.cursorInner.style.opacity=0,i.cursorOuter.style.opacity=0)}function l(){i.isClicking?(i.cursorInner.style.transform=`translate(-50%, -50%) scale(${s.clickScale.inner})`,i.cursorOuter.style.transform=`translate(-50%, -50%) scale(${s.clickScale.outer})`):i.isScaled?(i.cursorInner.style.transform=`translate(-50%, -50%) scale(${s.hoverScale.inner})`,i.cursorOuter.style.transform=`translate(-50%, -50%) scale(${s.hoverScale.outer})`):(i.cursorInner.style.transform="translate(-50%, -50%) scale(1)",i.cursorOuter.style.transform="translate(-50%, -50%) scale(1)")}return{init:function(){"undefined"!=typeof window&&("ontouchstart"in window||window.DocumentTouch&&"undefined"!=typeof document&&document instanceof window.DocumentTouch)||"undefined"!=typeof navigator&&(navigator.maxTouchPoints||navigator.msMaxTouchPoints)||(window.addEventListener("mousemove",c),document.querySelectorAll(s.clickables.join(",")).forEach(e=>function(e){e.style.cursor="none",e.addEventListener("mouseover",()=>{i.isScaled=!0,l()}),e.addEventListener("mouseout",()=>{i.isScaled=!1,l()})}(e)),document.addEventListener("mousedown",()=>{i.isClicking=!0,l()}),document.addEventListener("mouseup",()=>{i.isScaled=!1,i.isClicking=!1,l()}),document.addEventListener("mouseleave",e=>{var r;((r=e).clientY<=0||r.clientX<=0||r.clientX>=window.innerWidth||r.clientY>=window.innerHeight)&&(i.isVisible=!1,a())}),i.isVisible=!1,a(),function(){const e=r(s.color),t=r(s.color,s.outerAlpha);i.cursorInner.style.setProperty("background-color",e),i.cursorOuter.style.setProperty("background-color",t)}(),i.cursorInner.style.setProperty("width",`${s.size.inner}px`),i.cursorInner.style.setProperty("height",`${s.size.inner}px`),i.cursorOuter.style.setProperty("width",`${s.size.outer}px`),i.cursorOuter.style.setProperty("height",`${s.size.outer}px`),s.hideNativeCursor&&(document.querySelector("body").style.cursor="none",document.querySelector("html").style.cursor="none"),s.hasRequiredStyles&&function(){const e={"pointer-events":"none",position:"fixed","border-radius":"50%",opacity:0,transform:"translate(-50%, -50%)",transition:"opacity 0.25s ease-in-out, transform 0.25s ease-in-out"};t(s.cursorInnerSelector,e),t(s.cursorOuterSelector,e)}(),s.outerBorderSize>0&&i.cursorOuter.style.setProperty("border",`${s.outerBorderSize}px solid ${s.color}`))}}}n.options=o;export{n as default};
 //# sourceMappingURL=index.modern.js.map

dist/index.umd.js

@@ -1,2 +0,2 @@
-!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r():"function"==typeof define&&define.amd?define(r):(e||self).animatedCursor=r()}(this,function(){function e(e,r,t){return(1-t)*e+t*r}function r(e,r){e=e.replace("#","");var t=parseInt(3==e.length?e.slice(0,1).repeat(2):e.slice(0,2),16),n=parseInt(3==e.length?e.slice(1,2).repeat(2):e.slice(2,4),16),o=parseInt(3==e.length?e.slice(2,3).repeat(2):e.slice(4,6),16);return 0===r?"rgba("+t+", "+n+", "+o+", 0)":r?"rgba("+t+", "+n+", "+o+", "+r+")":"rgb("+t+", "+n+", "+o+")"}function t(e,r){var t=document.querySelector(e);for(var n in r)t.style[n]=r[n]}var n={cursorInnerSelector:"#cursor-inner",cursorOuterSelector:"#cursor-outer",hasRequiredStyles:!0,color:"#D3245C",outerAlpha:.3,outerBorderSize:0,size:{inner:8,outer:40},hoverScale:{inner:.75,outer:1.5},clickScale:{inner:1.5,outer:.13},trailingSpeed:.2,clickables:["a",'input[type="text"]','input[type="email"]','input[type="number"]','input[type="submit"]','input[type="image"]',"label[for]","select","textarea","button",".link"]};function o(o){var s=Object.assign({},n,o),i={cursorInner:document.querySelector(s.cursorInnerSelector),cursorOuter:document.querySelector(s.cursorOuterSelector),hasRequiredStyles:s.hasRequiredStyles,targetPos:{x:.5,y:.5},cursorPos:{x:.5,y:.5},endX:window.innerWidth/2,endY:window.innerHeight/2,raf:requestAnimationFrame(u),cursorVisible:!0,isScaled:!1,isClicking:!1};function c(e){var r;i.isVisible=!0,l(),i.targetPos.x=e.clientX,i.targetPos.y=e.clientY,r=e.clientX,i.cursorInner.style.top=e.clientY+"px",i.cursorInner.style.left=r+"px",i.raf||(i.raf=requestAnimationFrame(u))}function u(){if(i.cursorPos.x=e(i.cursorPos.x,i.targetPos.x,s.trailingSpeed),i.cursorPos.y=e(i.cursorPos.y,i.targetPos.y,s.trailingSpeed),i.cursorOuter.style.top=i.cursorPos.y+"px",i.cursorOuter.style.left=i.cursorPos.x+"px",Math.sqrt(Math.pow(i.targetPos.x-i.cursorPos.x,2)+Math.pow(i.targetPos.y-i.cursorPos.y,2))<.001)return window.cancelAnimationFrame(i.raf),void(i.raf=null);i.raf=requestAnimationFrame(u)}function l(){i.isVisible?(i.cursorInner.style.opacity=1,i.cursorOuter.style.opacity=1):(i.cursorInner.style.opacity=0,i.cursorOuter.style.opacity=0)}function a(){i.isClicking?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.clickScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.clickScale.outer+")"):i.isScaled?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.hoverScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.hoverScale.outer+")"):(i.cursorInner.style.transform="translate(-50%, -50%) scale(1)",i.cursorOuter.style.transform="translate(-50%, -50%) scale(1)")}return{init:function(){var e,n,o;window.addEventListener("mousemove",c),document.querySelectorAll(s.clickables.join(",")).forEach(function(e){return function(e){e.style.cursor="none",e.addEventListener("mouseover",function(){i.isScaled=!0,a()}),e.addEventListener("mouseout",function(){i.isScaled=!1,a()})}(e)}),document.addEventListener("mousedown",function(){i.isClicking=!0,a()}),document.addEventListener("mouseup",function(){i.isScaled=!1,i.isClicking=!1,a()}),document.addEventListener("mouseleave",function(e){var r;((r=e).clientY<=0||r.clientX<=0||r.clientX>=window.innerWidth||r.clientY>=window.innerHeight)&&(i.isVisible=!1,l())}),i.isVisible=!1,l(),s.hasRequiredStyles&&(t(s.cursorInnerSelector,e={"pointer-events":"none",position:"fixed","border-radius":"50%",opacity:0,transform:"translate(-50%, -50%)",transition:"opacity 0.25s ease-in-out, transform 0.25s ease-in-out"}),t(s.cursorOuterSelector,e)),s.outerBorderSize>0&&i.cursorOuter.style.setProperty("border",s.outerBorderSize+"px solid "+s.color),n=r(s.color),o=r(s.color,s.outerAlpha),i.cursorInner.style.setProperty("background-color",n),i.cursorOuter.style.setProperty("background-color",o),i.cursorInner.style.setProperty("width",s.size.inner+"px"),i.cursorInner.style.setProperty("height",s.size.inner+"px"),i.cursorOuter.style.setProperty("width",s.size.outer+"px"),i.cursorOuter.style.setProperty("height",s.size.outer+"px")}}}return o.options=n,o});
+!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r():"function"==typeof define&&define.amd?define(r):(e||self).animatedCursor=r()}(this,function(){function e(e,r,t){return(1-t)*e+t*r}function r(e,r){e=e.replace("#","");var t=parseInt(3==e.length?e.slice(0,1).repeat(2):e.slice(0,2),16),o=parseInt(3==e.length?e.slice(1,2).repeat(2):e.slice(2,4),16),n=parseInt(3==e.length?e.slice(2,3).repeat(2):e.slice(4,6),16);return 0===r?"rgba("+t+", "+o+", "+n+", 0)":r?"rgba("+t+", "+o+", "+n+", "+r+")":"rgb("+t+", "+o+", "+n+")"}function t(e,r){var t=document.querySelector(e);for(var o in r)t.style[o]=r[o]}var o={cursorInnerSelector:"#cursor-inner",cursorOuterSelector:"#cursor-outer",hasRequiredStyles:!0,hideNativeCursor:!0,color:"#D3245C",outerAlpha:.3,outerBorderSize:0,size:{inner:8,outer:40},hoverScale:{inner:.75,outer:1.5},clickScale:{inner:1.5,outer:.13},trailingSpeed:.2,clickables:["a",'input[type="text"]','input[type="email"]','input[type="number"]','input[type="submit"]','input[type="image"]',"label[for]","select","textarea","button",".link"]};function n(n){var s=Object.assign({},o,n),i={cursorInner:document.querySelector(s.cursorInnerSelector),cursorOuter:document.querySelector(s.cursorOuterSelector),hasRequiredStyles:s.hasRequiredStyles,targetPos:{x:.5,y:.5},cursorPos:{x:.5,y:.5},endX:window.innerWidth/2,endY:window.innerHeight/2,raf:requestAnimationFrame(u),cursorVisible:!0,isScaled:!1,isClicking:!1};function c(e){var r;i.isVisible=!0,a(),i.targetPos.x=e.clientX,i.targetPos.y=e.clientY,r=e.clientX,i.cursorInner.style.top=e.clientY+"px",i.cursorInner.style.left=r+"px",i.raf||(i.raf=requestAnimationFrame(u))}function u(){if(i.cursorPos.x=e(i.cursorPos.x,i.targetPos.x,s.trailingSpeed),i.cursorPos.y=e(i.cursorPos.y,i.targetPos.y,s.trailingSpeed),i.cursorOuter.style.top=i.cursorPos.y+"px",i.cursorOuter.style.left=i.cursorPos.x+"px",Math.sqrt(Math.pow(i.targetPos.x-i.cursorPos.x,2)+Math.pow(i.targetPos.y-i.cursorPos.y,2))<.001)return window.cancelAnimationFrame(i.raf),void(i.raf=null);i.raf=requestAnimationFrame(u)}function a(){i.isVisible?(i.cursorInner.style.opacity=1,i.cursorOuter.style.opacity=1):(i.cursorInner.style.opacity=0,i.cursorOuter.style.opacity=0)}function l(){i.isClicking?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.clickScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.clickScale.outer+")"):i.isScaled?(i.cursorInner.style.transform="translate(-50%, -50%) scale("+s.hoverScale.inner+")",i.cursorOuter.style.transform="translate(-50%, -50%) scale("+s.hoverScale.outer+")"):(i.cursorInner.style.transform="translate(-50%, -50%) scale(1)",i.cursorOuter.style.transform="translate(-50%, -50%) scale(1)")}return{init:function(){var e,o,n;"undefined"!=typeof window&&("ontouchstart"in window||window.DocumentTouch&&"undefined"!=typeof document&&document instanceof window.DocumentTouch)||"undefined"!=typeof navigator&&(navigator.maxTouchPoints||navigator.msMaxTouchPoints)||(window.addEventListener("mousemove",c),document.querySelectorAll(s.clickables.join(",")).forEach(function(e){return function(e){e.style.cursor="none",e.addEventListener("mouseover",function(){i.isScaled=!0,l()}),e.addEventListener("mouseout",function(){i.isScaled=!1,l()})}(e)}),document.addEventListener("mousedown",function(){i.isClicking=!0,l()}),document.addEventListener("mouseup",function(){i.isScaled=!1,i.isClicking=!1,l()}),document.addEventListener("mouseleave",function(e){var r;((r=e).clientY<=0||r.clientX<=0||r.clientX>=window.innerWidth||r.clientY>=window.innerHeight)&&(i.isVisible=!1,a())}),i.isVisible=!1,a(),e=r(s.color),o=r(s.color,s.outerAlpha),i.cursorInner.style.setProperty("background-color",e),i.cursorOuter.style.setProperty("background-color",o),i.cursorInner.style.setProperty("width",s.size.inner+"px"),i.cursorInner.style.setProperty("height",s.size.inner+"px"),i.cursorOuter.style.setProperty("width",s.size.outer+"px"),i.cursorOuter.style.setProperty("height",s.size.outer+"px"),s.hideNativeCursor&&(document.querySelector("body").style.cursor="none",document.querySelector("html").style.cursor="none"),s.hasRequiredStyles&&(t(s.cursorInnerSelector,n={"pointer-events":"none",position:"fixed","border-radius":"50%",opacity:0,transform:"translate(-50%, -50%)",transition:"opacity 0.25s ease-in-out, transform 0.25s ease-in-out"}),t(s.cursorOuterSelector,n)),s.outerBorderSize>0&&i.cursorOuter.style.setProperty("border",s.outerBorderSize+"px solid "+s.color))}}}return n.options=o,n});
 //# sourceMappingURL=index.umd.js.map

package.json

 {
   "name": "animated-cursor",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "Create a custom, animated cursor in pure JS.",
@@ -5,0 +5,0 @@ "repository": {

readme.md

@@ -76,2 +76,3 @@ # Animated Cursor
 | `useRequiredStyles`       | `Boolean`         | If lib should add required styles to element.                  | `true`            |
+| `hideNativeCursor`        | `Boolean`         | If native cursor should be hidden via internal method adding inline styles to `html` and `body`. | `true`            |
 | `color`                   | `String`          | Hex value of desired color.                                    | `#D3245C`       |
@@ -172,20 +173,13 @@ | `outerAlpha`              | `Number`          | Alpha transparency level of outer cursor (0 - 1).              | `0.3`       |
 
-### useRequiredStyles
+### Use `require`
 
-For the cursors to work, some styles are require for positioning, radius, pointer-events, stating opacity, and transitions.
-By default, AnimatedCursor adds these styles via JS, directly on the cursor elements. If you'd prefer, you can stop the lib from adding those inline styles in favor of css. 
-Just set `useRequiredStyles: false` and provide your own css to the inner/outer cursor selectors.
+AnimatedCursor is a hybrid npm module, so it supports both `import` and `require`. 
 
-This action would also allow you to modify the transition speed and easings of the cursors scaling (transform) animation.
+So, you can also `require` to lib like so:
 
 ```
-#cursor-inner,
-#cursor-outer {
-  pointer-events: none;
-  position: fixed;
-  border-radius: 50%;
-  opacity: 0;
-  transform: translate(-50%, -50%);
-  transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; 
-}
+const AnimatedCursor = require('animated-cursor')
+
+const cursor = AnimatedCursor(opts)
+cursor.init()
 ```
@@ -209,4 +203,34 @@
 
+[Check out the Donut Cursor Demo](https://stephenscaff.github.io/animated-cursor/donut.html)
+
 <br/>
 
+
+### useRequiredStyles
+
+For the cursors to work, some styles are require for positioning, radius, pointer-events, stating opacity, and transitions.
+By default, AnimatedCursor adds these styles via JS, directly on the cursor elements. If you'd prefer, you can stop the lib from adding those inline styles in favor of css. 
+Just set `useRequiredStyles: false` and provide your own css to the inner/outer cursor selectors.
+
+This action would also allow you to modify the transition speed and easings of the cursors scaling (transform) animation.
+
+```
+#cursor-inner,
+#cursor-outer {
+  pointer-events: none;
+  position: fixed;
+  border-radius: 50%;
+  opacity: 0;
+  transform: translate(-50%, -50%);
+  transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; 
+}
+```
+
+###  hideNativeCursor
+
+The `hideNativeCursor` option is a `bool` that determins if native cursor should be hidden by adding inline styles to the `html` and `body` tags.
+Set to `false` if you want to maintain the native cursor, or if you'd rather hide the cursor with css.
+
+<br/>
+
 ## 📅 ToDos
@@ -216,5 +240,6 @@
 - ~~Add a demo for Donut-style cursor~~
-- ~~Make clickables an option.~~dsss
+- ~~Make clickables an option.~~
 - ~~Make hybrid npm module to support `import` and `require`~~.
-- Limit to non touch or non mobile devices.
+- ~~Make hiding native cursor an option.~~.
+- ~~Limit to non touch or non mobile devices.~~
 - Provide a destory method

No alert changes

Improved metrics

Total package byte prevSize

89682

increased by8.46%

Lines of code

73

increased by7.35%

Number of lines in readme file

241

increased by11.57%

No dependency changes