import { memo, useEffect, useState } from 'react';
import { runInAction } from 'mobx';
import { observer } from 'mobx-react-lite';
const _VirtualInternalMemoItem = ({ index, rowIndex, columnIndex, renderItem, itemKey, state, style, ...timeoutProps }) => {
    const [ready, setReady] = useState(() => runInAction(() => !state.gridState.toolbar.isScrolling));
    useEffect(() => {
        if (!ready) {
            // An optimization for rendering the item lazily when scrolling fast (this is experimental and might be changed)
            const id = window.requestAnimationFrame(() => {
                setReady(true);
            });
            return () => {
                window.cancelAnimationFrame(id);
            };
        }
        return undefined;
    }, [ready]);
    return renderItem(index, {
        timeoutProps,
        style,
        itemKey: state._itemKeyRecycler,
        index2d: { rowIndex, columnIndex },
    });
};
export const VirtualInternalMemoItem = memo(observer(_VirtualInternalMemoItem), (a, b) => a.index === b.index &&
    a.in === b.in &&
    a.renderItem === b.renderItem &&
    a.itemKey === b.itemKey &&
    a.style === b.style);
//# sourceMappingURL=VirtualInternalMemoItem.js.map