import { jsx as _jsx } from "react/jsx-runtime";
import merge from 'lodash-es/merge.js';
import { CommandBar } from './components/CommandBar.js';
import { GroupHeader } from './controls/index.js';
export function createLazyLoadingGroupHeader(props, children, columnName, columnMetadata) {
    if (!props || !columnMetadata && !columnName) {
        return null;
    }
    return /*#__PURE__*/ _jsx(GroupHeader, {
        props: props,
        columnName: columnMetadata?.name || columnName,
        lazyLoadGroups: true,
        children: children
    });
}
const defStyles = {
    root: {
        height: 36
    },
    primarySet: {
        width: '100%'
    }
};
/**
 * Creates a command bar styled to fit nicely in places like column headers.
 * @param props - the component props
 * @returns
 */ export function createDefaultCommandBar({ styles , ...props }) {
    const defaultStyles = merge(defStyles, styles);
    return /*#__PURE__*/ _jsx(CommandBar, {
        ...props,
        styles: defaultStyles
    });
}
/**
 * Creates a header command bar using the inverted style for our default table header
 * @param props - the component props
 * @param theme - the theme
 * @param far - use far mode
 * @returns
 */ export function createDefaultHeaderCommandBar({ styles , ...props }, theme, far = false) {
    const defaultStyles = merge({
        root: {
            display: 'flex',
            justifyContent: far ? 'flex-end' : 'flex-start'
        }
    }, defStyles, {}, styles);
    const { bgColor , color  } = {
        bgColor: theme.application().accent().hex(),
        color: theme.application().background().hex()
    };
    return /*#__PURE__*/ _jsx(CommandBar, {
        ...props,
        styles: defaultStyles,
        bgColor: bgColor,
        color: color
    });
}
