@react-hookz/web/cjs/useWindowSize/useWindowSize.js

React hooks done right, for browser and SSR.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useWindowSize = void 0;
var react_1 = require("react");
var __1 = require("..");
var const_1 = require("../util/const");
var listeners = new Set();
var callAllListeners = function () {
    listeners.forEach(function (l) {
        l({
            width: window.innerWidth,
            height: window.innerHeight,
        });
    });
};
/**
 * Tracks window inner dimensions.
 *
 * @param stateHook State hook that will be used internally. Default: `useRafState`.
 * @param measureOnMount Perform size fetch during mount effect stage or synchronously with render.
 */
function useWindowSize(stateHook, measureOnMount) {
    if (stateHook === void 0) { stateHook = __1.useRafState; }
    var isFirstMount = (0, __1.useFirstMountState)();
    var _a = stateHook({
        width: isFirstMount && const_1.isBrowser && !measureOnMount ? window.innerWidth : 0,
        height: isFirstMount && const_1.isBrowser && !measureOnMount ? window.innerHeight : 0,
    }), size = _a[0], setSize = _a[1];
    (0, __1.useMountEffect)(function () {
        if (measureOnMount) {
            setSize({
                width: window.innerWidth,
                height: window.innerHeight,
            });
        }
    });
    (0, react_1.useEffect)(function () {
        if (listeners.size === 0) {
            window.addEventListener('resize', callAllListeners, { passive: true });
        }
        listeners.add(setSize);
        return function () {
            listeners.delete(setSize);
            if (listeners.size === 0) {
                window.removeEventListener('resize', callAllListeners);
            }
        };
    }, [setSize]);
    return size;
}
exports.useWindowSize = useWindowSize;