mirror of
https://github.com/luxfi/explore.git
synced 2026-09-24 00:28:18 +00:00
tom goriunovandGitHub
f6725649da
* first version of the pack * single entry point * add custom components to the package * move form components to toolkit * add more utils and hooks to the package * minor fixes * add CI workflow * update readme and package.json * fix ts * fix build of env-validator * fix docker build * fix icons size * test fixes * more test fixes
23 lines
707 B
TypeScript
23 lines
707 B
TypeScript
import { debounce } from 'es-toolkit';
|
|
import { useEffect, useState } from 'react';
|
|
|
|
export function useViewportSize(debounceTime = 100) {
|
|
const [ viewportSize, setViewportSize ] = useState({ width: 0, height: 0 });
|
|
|
|
useEffect(() => {
|
|
setViewportSize({ width: window.innerWidth, height: window.innerHeight });
|
|
|
|
const resizeHandler = debounce(() => {
|
|
setViewportSize({ width: window.innerWidth, height: window.innerHeight });
|
|
}, debounceTime);
|
|
const resizeObserver = new ResizeObserver(resizeHandler);
|
|
|
|
resizeObserver.observe(document.body);
|
|
return function cleanup() {
|
|
resizeObserver.unobserve(document.body);
|
|
};
|
|
}, [ debounceTime ]);
|
|
|
|
return viewportSize;
|
|
}
|