@mirawision/reactive-hooks/use-screen-size.js

A comprehensive collection of 50+ React hooks for state management, UI interactions, device APIs, async operations, drag & drop, audio/speech, and more. Full TypeScript support with SSR safety.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useScreenSize = useScreenSize;
const react_1 = require("react");
const initialState = {
    width: 0,
    height: 0,
};
/**
 * Hook that tracks window dimensions
 * Updates on window resize events
 *
 * @returns Object with current width and height
 */
function useScreenSize() {
    const [size, setSize] = (0, react_1.useState)(initialState);
    const updateSize = (0, react_1.useCallback)(() => {
        setSize({
            width: document.body.clientWidth || window.innerWidth,
            height: document.body.clientHeight || window.innerHeight,
        });
    }, []);
    (0, react_1.useEffect)(() => {
        window.addEventListener('resize', updateSize);
        updateSize();
        return () => window.removeEventListener('resize', updateSize);
    }, [updateSize]);
    return size;
}