import React__default, { useEffect } from 'react';
import { D as DataListItems } from './DataListItems-es.js';
import { u as useDataListContext } from './DataListContext-es.js';
import { u as useActiveLayout } from './useActiveLayout-es.js';

function DataListLayout({ children, size = "xs", }) {
    const { registerLayout, loadingState } = useDataListContext();
    const { activeBreakpoint } = useActiveLayout();
    useEffect(() => {
        registerLayout(size, children);
    }, [size, children]);
    const shouldRenderList = size === activeBreakpoint;
    if (loadingState !== "initial" && shouldRenderList) {
        return React__default.createElement(DataListItems, { size: size });
    }
    return null;
}

export { DataListLayout as D };
