@kubit-ui-web/react-components/dist/esm/hooks/useDeviceHeight/useDeviceHeight.js

Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience

import { useEffect, useRef } from 'react';
export const useDeviceHeight = () => {
    const timeout = useRef(null);
    const setVh = () => {
        let vh;
        if (!window.CSS.supports) {
            vh = `${window.innerHeight}px`;
        }
        else {
            const supportSvh = window.CSS.supports('height: 100svh') || window.CSS.supports('max-height: 100svh');
            vh = supportSvh ? '100svh' : `${window.innerHeight}px`;
        }
        document.documentElement.style.setProperty('--100svh', vh);
    };
    const debounceHeight = () => {
        if (timeout.current) {
            clearTimeout(timeout.current);
        }
        timeout.current = setTimeout(() => {
            setVh();
        }, 250);
    };
    useEffect(() => {
        setVh();
        window.addEventListener('resize', debounceHeight);
        return () => {
            window.removeEventListener('resize', debounceHeight);
            if (timeout.current) {
                clearTimeout(timeout.current);
            }
        };
    }, []);
};
//# sourceMappingURL=useDeviceHeight.js.map