@figliolia/size-observer/dist/mjs/useSizeObserver.js

Resize Observers simplified

import { useLayoutEffect, useRef } from "react";
import { SizeObserver } from "./SizeObserver.js";
export const useSizeObserver = (options) => {
    const node = useRef(null);
    const stableOptions = useRef(options);
    stableOptions.current = options;
    const observer = useRef(null);
    if (observer.current) {
        observer.current.options = stableOptions.current;
    }
    useLayoutEffect(() => {
        if (!node.current) {
            return;
        }
        observer.current = new SizeObserver(node.current, stableOptions.current);
        return () => {
            observer.current?.destroy();
        };
    }, []);
    return node;
};