@onesy/ui-react/useResize/useResize.js

UI for React

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _utils = require("@onesy/utils");
const useResize = () => {
  const [width, setWidth] = _react.default.useState(() => {
    if ((0, _utils.isEnvironment)('browser')) return window.innerWidth;
    return 0;
  });
  const refs = {
    width: _react.default.useRef(width)
  };
  refs.width.current = width;
  _react.default.useEffect(() => {
    const onResize = () => {
      const newWidth = window.innerWidth;
      if (refs.width.current === newWidth) return;
      setWidth(newWidth);
    };
    if ((0, _utils.isEnvironment)('browser')) {
      const newWidth_0 = window.innerWidth;
      if (refs.width.current !== newWidth_0) setWidth(newWidth_0);
      window.addEventListener('resize', onResize);
      return () => window.removeEventListener('resize', onResize);
    }
  }, []);
  return width;
};
var _default = exports.default = useResize;