import classNames from "clsx";
import { mergeDeep } from "../../helpers/mergeDeep";
import { useTheme } from "../Flowbite";
import { createMemo, mergeProps, splitProps, } from "solid-js";
const AvatarGroup = p => {
    const defaultProps = {
        theme: {},
    };
    const [local, props] = splitProps(mergeProps(defaultProps, p), ["children", "class", "theme"]);
    const themeCtx = useTheme();
    const theme = createMemo(() => {
        return mergeDeep(themeCtx.theme.avatarGroup, local.theme);
    });
    return (<div data-testid="avatar-group-element" class={classNames(theme().root.base, local.class)} {...props}>
      {local.children}
    </div>);
};
export default AvatarGroup;