reactlib
useWindowSize.tsx
import * as React from "react";

type WindowSize = {
width?: number;
height?: number;
};

export function useWindowSize(): WindowSize {
const [windowSize, setWindowSize] = React.useState<WindowSize>({
width: undefined,
height: undefined,
});

React.useEffect(() => {
function handleResize() {
setWindowSize({
width: window.innerWidth,
height: window.innerHeight,
});
}

window.addEventListener("resize", handleResize);

handleResize();

return () => window.removeEventListener("resize", handleResize);
}, []);

return windowSize;
}

8:48 PM · Mar 26, 2024

A hook that returns the current window size.