/components/breadcrumb/breadcrumb

import { breadcrumb, crumb } from "@hedia/hexui/components/breadcrumb";
import { span } from "@hedia/html/elements";
import { homeBoldIcon } from "@hedia/iconly/bold";
import { computerCaseOutlineIcon, documentOutlineIcon, folderOutlineIcon } from "@hedia/iconly/outline";

export function Default() {
  return [breadcrumb(crumb({ href: "#" }, "My Drive"), crumb({ href: "#" }, "Documents"), crumb("Report.pdf"))];
}

export function SingleCrumbWithIcon() {
  return [breadcrumb(crumb({ icon: homeBoldIcon() }, "Home"))];
}

export function WithColorIcons() {
  return [
    breadcrumb(
      crumb({ href: "#", icon: span({ class: "text-yellow" }, computerCaseOutlineIcon()) }, "My Drive"),
      crumb({ href: "#", icon: span({ class: "text-blue" }, folderOutlineIcon()) }, "Documents"),
      crumb({ icon: span({ class: "text-green" }, documentOutlineIcon()) }, "Report.pdf"),
    ),
  ];
}