import React, { useRef, useEffect } from "react";
import { useList } from "../../../charts";
const deffered = callback => {
    if (window.requestIdleCallback) {
        const id = requestIdleCallback(callback);
        return () => cancelIdleCallback(id);
    }
    const id = requestAnimationFrame(callback);
    return () => cancelAnimationFrame(id);
};
const Wrapper = ({ children, style, id }) => {
    const list = useList();
    const ref = useRef();
    useEffect(() => {
        const animationId = requestAnimationFrame(() => list.measure(id));
        return () => cancelAnimationFrame(animationId);
    }, [id]);
    const prevHeightRef = useRef();
    useEffect(() => {
        let timeoutId;
        let cancelDeffered;
        const resize = () => {
            timeoutId = setTimeout(() => {
                cancelDeffered = deffered(() => {
                    var _a;
                    if (!prevHeightRef.current ||
                        (prevHeightRef.current &&
                            ref.current &&
                            Math.abs(prevHeightRef.current - ref.current.firstChild.clientHeight) > 10)) {
                        list.resize(id);
                    }
                    prevHeightRef.current = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.firstChild.clientHeight;
                    resize();
                });
            }, 400);
        };
        resize();
        return () => {
            var _a;
            (_a = cancelDeffered) === null || _a === void 0 ? void 0 : _a();
            clearTimeout(timeoutId);
        };
    }, [id]);
    return (React.createElement("div", { ref: ref, style: { ...style, paddingRight: "232px" } }, children));
};
export default Wrapper;
//# sourceMappingURL=cellMeasurerWrapper.js.map