import classNames from "clsx";
import { mergeDeep } from "../../helpers/mergeDeep";
import { useTheme } from "../Flowbite";
import BreadcrumbItem from "./BreadcrumbItem";
import { createMemo, mergeProps, splitProps } from "solid-js";
const BreadcrumbComponent = p => {
    const defaultProps = { theme: {} };
    const [local, props] = splitProps(mergeProps(defaultProps, p), ["children", "class", "theme"]);
    const theme = createMemo(() => {
        return mergeDeep(useTheme().theme.breadcrumb.root, local.theme);
    });
    return (<nav aria-label="Breadcrumb" class={classNames(theme().base, local.class)} {...props}>
      <ol class={theme().list}>{local.children}</ol>
    </nav>);
};
export const Breadcrumb = Object.assign(BreadcrumbComponent, {
    Item: BreadcrumbItem,
});