webrix
webrix copied to clipboard
useDimensions: Support a custom callback
https://github.com/open-amdocs/webrix/blob/master/src/hooks/useDimensions/useDimensions.js
For devs who need to use a resizeObserver (without caring for the return value of the hook):
export default (ref, callback) => {
const [dimensions, setDimensions] = useState({width: 0, height: 0});
const observer = useRef(new ResizeObserver(entries => {
callback?.(entries);
setDimensions(readResizeObserverEntry(entries[0]));
}));
useEffect(() => {
const {current: obs} = observer;
obs.observe(ref.current);
return () => obs.disconnect();
}, [ref]);
return dimensions;
};
This would allow using this same hook for other purposes also (as it already handling its own cleanup)