29 lines
728 B
TypeScript
29 lines
728 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;
|