spb/ai-atlas

1import { SITE_URL } from '@/lib/site';23/** schema.org BreadcrumbList JSON-LD for the pages D3 owns (server component; absolute URLs). */4export function BreadcrumbLd({ items }: { items: { name: string; href: string }[] }) {5  const ld = {6    '@context': 'https://schema.org',7    '@type': 'BreadcrumbList',8    itemListElement: items.map((it, i) => ({ '@type': 'ListItem', position: i + 1, name: it.name, item: `${SITE_URL}${it.href}` })),9  };10  return <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(ld) }} />;11}1213/** Visible breadcrumb trail matching the JSON-LD (last item is the current page). */14export function Breadcrumbs({ items }: { items: { name: string; href: string }[] }) {15  return (16    <nav aria-label="Breadcrumb" className="pt-5 text-xs text-ink-3">17      <ol className="flex flex-wrap items-center gap-1.5">18        {items.map((it, i) => (19          <li key={it.href} className="flex items-center gap-1.5">20            {i > 0 && <span aria-hidden>/</span>}21            {i === items.length - 1 ? (22              <span className="text-ink-2" aria-current="page">23                {it.name}24              </span>25            ) : (26              <a href={it.href} className="hover:text-ink">27                {it.name}28              </a>29            )}30          </li>31        ))}32      </ol>33    </nav>34  );35}36