---
interface Crumb {
  href?: string;
  label: string;
}

interface Props {
  items: Crumb[];
}

const { items } = Astro.props;
const last = items.length - 1;
---

<nav aria-label="Breadcrumb">
  <ol class="breadcrumbs">
    {
      items.map((item, index) => (
        <li>
          {item.href && index !== last ? (
            <a href={item.href}>{item.label}</a>
          ) : (
            <span aria-current={index === last ? 'page' : undefined}>{item.label}</span>
          )}
        </li>
      ))
    }
  </ol>
</nav>
