UNPKG

react-visibility-tracking-hooks

Version:
3 lines (2 loc) 2.86 kB
"use strict";var t=require("react");function e(t,e,o,r){var n=t.right-t.left>0&&t.bottom-t.top>0,i={top:t.top,left:t.left,bottom:t.bottom,right:t.right};o&&(i.top+=o.top||0,i.left+=o.left||0,i.bottom-=o.bottom||0,i.right-=o.right||0);var l={top:i.top>=e.top,left:i.left>=e.left,bottom:i.bottom<=e.bottom,right:i.right<=e.right};return r?!0===r?Object.values(l).some(function(t){return t}):l[r]:n&&l.top&&l.left&&l.bottom&&l.right}function o(t,e){if(t.left>e.right||t.right<e.left||t.top>e.bottom||t.bottom<e.top)return{horizontalPercent:0,verticalPercent:0,overallPercent:0};var o=t.right-t.left,r=t.bottom-t.top,n=Math.min(e.right-e.left,e.right-t.left,t.right-e.left,t.right-t.left),i=Math.min(e.bottom-e.top,e.bottom-t.top,t.bottom-e.top,t.bottom-t.top);return{horizontalPercent:n/o,verticalPercent:i/r,overallPercent:n*i/(o*r)}}exports.checkIsVisible=e,exports.computePercentVisible=o,exports.default=function(r){var n=void 0===r?{}:r,i=n.onVisibilityChange,l=n.partiallyVisible,u=void 0!==l&&l,c=n.scrollCheck,f=void 0===c||c,a=n.scrollThrottleLimit,h=void 0===a?250:a,m=n.resizeCheck,s=void 0!==m&&m,v=n.resizeThrottleLimit,g=void 0===v?250:v,b=n.minElementOffset,p=void 0===b?{top:0,left:0,bottom:0,right:0}:b,d=t.useState(!1),w=d[0],M=d[1],T=t.useState({horizontalPercent:0,verticalPercent:0,overallPercent:0}),P=T[0],L=T[1],C=t.useRef(null),E=t.useRef(null),k=t.useCallback(function(){var t=C&&C.current?C.current.getBoundingClientRect():null;if(t){var r=function(t){return t instanceof DOMRect?{top:Math.floor(t.y),left:Math.floor(t.x),bottom:Math.floor(t.y+t.height),right:Math.floor(t.x+t.width)}:{top:Math.floor(t.top),left:Math.floor(t.left),bottom:Math.floor(t.bottom),right:Math.floor(t.right)}}(t),n={top:0,left:0,bottom:window.innerHeight||document.documentElement.clientHeight,right:window.innerWidth||document.documentElement.clientWidth},l=e(r,n,p,u),c=o(r,n);M(l),L(c),i&&i(l,c)}},[p,i,u]),z=t.useCallback(function(t,e){E.current||(E.current={});var o,r=E.current,n=function(){o=null,k()},i={eventListenerFn:function(){null!==o&&(o=setTimeout(n,e<0?0:e))},getTimeout:function(){return o}};return window.addEventListener(t,i.eventListenerFn),r[t]=i,function(){null!==o&&clearTimeout(o)}},[k]),V=t.useCallback(function(t){if(null!==t)C.current=t,f&&z("scroll",h),s&&z("resize",g);else{var e=E.current;for(var o in e){var r=e[o];void 0!==r&&(null!==r.getTimeout()&&clearTimeout(r.getTimeout()),window.removeEventListener(o,r.eventListenerFn))}}},[f,s,z,h,g]);return t.useEffect(function(){return function(){var t=E.current;for(var e in t){var o=t[e];void 0!==o&&(null!==o.getTimeout()&&clearTimeout(o.getTimeout()),window.removeEventListener(e,o.eventListenerFn))}}},[]),[V,{rect:C&&C.current&&C.current.getBoundingClientRect(),isVisible:w,percentVisible:P}]}; //# sourceMappingURL=react-visibility-tracking-hooks.cjs.production.min.js.map