@razorpay/blade/build/lib/web/production/utils/useWindowSize.js

The Design System that powers Razorpay

import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import React__default from 'react';

function useWindowSize() {
  // Initialize state with undefined width/height so server and client renders match
  // Learn more here: https://joshwcomeau.com/react/the-perils-of-rehydration/
  var _React$useState = React__default.useState({
      width: 0,
      height: 0
    }),
    _React$useState2 = _slicedToArray(_React$useState, 2),
    windowSize = _React$useState2[0],
    setWindowSize = _React$useState2[1];
  React__default.useEffect(function () {
    // Handler to call on window resize
    function handleResize() {
      // Set window width/height to state
      setWindowSize({
        width: window.innerWidth,
        height: window.innerHeight
      });
    }
    // Add event listener
    window.addEventListener('resize', handleResize);
    // Call handler right away so state gets updated with initial window size
    handleResize();
    // Remove event listener on cleanup
    return function () {
      return window.removeEventListener('resize', handleResize);
    };
  }, []); // Empty array ensures that effect is only run on mount
  return windowSize;
}

export { useWindowSize };
//# sourceMappingURL=useWindowSize.js.map