mirror of
https://github.com/laurent22/joplin.git
synced 2024-12-18 09:35:20 +02:00
24 lines
679 B
TypeScript
24 lines
679 B
TypeScript
|
import { useEffect, useState } from 'react';
|
||
|
|
|
||
|
|
// This uses a ResizeObserver -- be careful to prevent infinite loops (should be stopped
|
||
|
|
// early and print a warning). See https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver#observation_errors
|
||
|
|
const useElementHeight = (container: HTMLElement|null) => {
|
||
|
|
const [height, setHeight] = useState(container?.clientHeight ?? 0);
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
if (!container) return () => {};
|
||
|
|
const observer = new ResizeObserver(() => {
|
||
|
|
setHeight(container.clientHeight);
|
||
|
|
});
|
||
|
|
observer.observe(container);
|
||
|
|
|
||
|
|
return () => {
|
||
|
|
observer.disconnect();
|
||
|
|
};
|
||
|
|
}, [container]);
|
||
|
|
|
||
|
|
return height;
|
||
|
|
};
|
||
|
|
|
||
|
|
export default useElementHeight;
|