@coinmeca/ui
Version:
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
28 lines • 1.26 kB
JSX
'use client';
import { createContext, useLayoutEffect, useState } from 'react';
export const WindowSizeContext = createContext({});
export default function WindowSize({ children }) {
const [windowWidth, setWindowWidth] = useState((typeof window !== 'undefined' ? window : global)?.innerWidth || 1920);
const [windowHeight, setWindowHeight] = useState((typeof window !== 'undefined' ? window : global)?.innerHeight || 1080);
const [windowSize, setWindowSize] = useState({
width: windowWidth,
height: windowHeight,
});
function windowResize() {
if (windowWidth !== window?.innerWidth)
setWindowWidth(window?.innerWidth);
if (windowHeight !== window?.innerHeight)
setWindowHeight(window?.innerHeight);
setWindowSize({
width: window?.innerWidth,
height: window?.innerHeight,
});
}
useLayoutEffect(() => {
window.addEventListener('resize', windowResize);
windowResize();
return () => window.removeEventListener('resize', windowResize);
}, []);
return <WindowSizeContext.Provider value={{ windowSize, windowWidth, windowHeight }}>{children}</WindowSizeContext.Provider>;
}
//# sourceMappingURL=WindowSize.jsx.map