daedalOS/hooks/useResizeObserver.ts
2021-12-30 10:36:58 -08:00

28 lines
700 B
TypeScript

import { useEffect, useState } from "react";
const useResizeObserver = (
componentWindow?: HTMLElement | null,
callback?: ResizeObserverCallback
): void => {
const [resizeObserver, setResizeObserver] = useState<ResizeObserver>();
useEffect(() => {
if (callback) {
setResizeObserver(new ResizeObserver(callback));
}
}, [callback]);
useEffect(() => {
if (componentWindow instanceof HTMLElement) {
resizeObserver?.observe(componentWindow);
}
return () => {
if (componentWindow instanceof HTMLElement) {
resizeObserver?.unobserve(componentWindow);
}
};
}, [componentWindow, resizeObserver]);
};
export default useResizeObserver;