28 lines
712 B
TypeScript
28 lines
712 B
TypeScript
import { useEffect, useState, type RefObject } from 'react';
|
|
|
|
export function useElementHeight(ref: RefObject<HTMLElement | null>, initial = 0): number {
|
|
const [height, setHeight] = useState(initial);
|
|
|
|
useEffect(() => {
|
|
const el = ref.current;
|
|
if (!el) return;
|
|
|
|
const update = () => {
|
|
setHeight(el.getBoundingClientRect().height);
|
|
};
|
|
|
|
update();
|
|
|
|
if (typeof ResizeObserver === 'undefined') {
|
|
window.addEventListener('resize', update);
|
|
return () => window.removeEventListener('resize', update);
|
|
}
|
|
|
|
const resizeObserver = new ResizeObserver(update);
|
|
resizeObserver.observe(el);
|
|
return () => resizeObserver.disconnect();
|
|
}, [ref]);
|
|
|
|
return height;
|
|
}
|