react-window-size-listener
Version:
Minimalistic React hook for listening to window resize events with built-in debouncing.
3 lines (2 loc) • 1.4 kB
JavaScript
var i=require("react"),e="undefined"!=typeof window;function n(){return e?{width:window.innerWidth,height:window.innerHeight}:{width:0,height:0}}function t(){return e?window.visualViewport?{width:window.visualViewport.width,height:window.visualViewport.height}:{width:window.innerWidth,height:window.innerHeight}:{width:0,height:0}}exports.useViewportSize=function(n){void 0===n&&(n={});var o=n.debounceTime,w=void 0===o?100:o,r=i.useState(t),u=r[0],d=r[1],s=i.useCallback(function(){d(t())},[]);return i.useEffect(function(){if(e){s();var i=null,n=function(){i&&window.clearTimeout(i),i=window.setTimeout(s,w)},t=window.visualViewport||window;return t.addEventListener("resize",n,{passive:!0}),window.visualViewport&&window.visualViewport.addEventListener("scroll",n,{passive:!0}),function(){t.removeEventListener("resize",n),window.visualViewport&&window.visualViewport.removeEventListener("scroll",n),i&&window.clearTimeout(i)}}},[w,s]),u},exports.useWindowSize=function(t){void 0===t&&(t={});var o=t.debounceTime,w=void 0===o?100:o,r=i.useState(n),u=r[0],d=r[1],s=i.useCallback(function(){d(n())},[]);return i.useEffect(function(){if(e){s();var i=null,n=function(){i&&window.clearTimeout(i),i=window.setTimeout(s,w)};return window.addEventListener("resize",n,{passive:!0}),function(){window.removeEventListener("resize",n),i&&window.clearTimeout(i)}}},[w,s]),u};
//# sourceMappingURL=index.js.map