// (C) 2024-2026 GoodData Corporation
import { useLayoutEffect, useRef, useState } from "react";
/**
 * @internal
 */
export function useElementSize(deps) {
    const ref = useRef(null);
    const [height, setHeight] = useState(0);
    const [width, setWidth] = useState(0);
    useLayoutEffect(() => {
        const resizeObserver = new ResizeObserver((entries) => {
            const [entry] = entries;
            if (entry) {
                setHeight(entry.contentRect.height);
                setWidth(entry.contentRect.width);
            }
        });
        if (ref.current) {
            resizeObserver.observe(ref.current);
            setHeight(ref.current.offsetHeight);
            setWidth(ref.current.offsetWidth);
        }
        return () => {
            if (resizeObserver) {
                resizeObserver.disconnect();
                setHeight(0);
                setWidth(0);
            }
        };
        // eslint-disable-next-line react-hooks/exhaustive-deps
    }, deps ?? []);
    return {
        ref,
        height,
        width,
    };
}
