import { Link } from 'react-router-dom';
import { ChevronRight } from 'lucide-react';
export default function Breadcrumbs({ items }) {
  return <nav aria-label="Breadcrumb" className="mb-4 flex flex-wrap items-center gap-1 text-sm text-slate-500">
    {items.map((it, i) => {
      const last = i === items.length - 1;
      return <span key={i} className="flex items-center gap-1">{it.to && !last ? <Link to={it.to} className="text-slate-400 hover:text-violet-300">{it.label}</Link> : <span className={last ? 'font-medium text-violet-300' : ''}>{it.label}</span>}{!last && <ChevronRight className="h-3.5 w-3.5 text-slate-600" />}</span>;
    })}
  </nav>;
}