Breadcrumb

import { Breadcrumb } from "@/components/ui/cn/breadcrumb/Breadcrumb";

export function BreadcrumbExample() {
  return (
    <Breadcrumb
      items={[
        { label: "Início", href: "/" },
        { label: "Componentes", href: "/cn" },
        { label: "Breadcrumb" },
      ]}
    />
  );
}

// muitos itens colapsam num "…" clicável (abre dropdown com os itens ocultos)
export function BreadcrumbEllipsisExample() {
  return (
    <Breadcrumb
      items={[
        { label: "Início", href: "/" },
        { label: "Componentes", href: "/cn" },
        { label: "Display", href: "/cn/display" },
        { label: "Overlays", href: "/cn/overlays" },
        { label: "Inputs", href: "/cn/inputs" },
        { label: "Breadcrumb" },
      ]}
      maxItems={4}
    />
  );
}