'use client';
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import React from 'react';
import Link from 'next/link';
import { cn } from '@/lib/utils';
import { CaretRight, House } from '@phosphor-icons/react';
export function Breadcrumbs({ items, showHome = true, className }) {
    if (items.length === 0) return null;
    return /*#__PURE__*/ _jsx("nav", {
        className: cn('flex items-center text-sm', className),
        "aria-label": "Breadcrumb",
        children: /*#__PURE__*/ _jsxs("ol", {
            className: "flex items-center space-x-1",
            children: [
                showHome && /*#__PURE__*/ _jsxs(_Fragment, {
                    children: [
                        /*#__PURE__*/ _jsx("li", {
                            children: /*#__PURE__*/ _jsxs(Link, {
                                href: "/docs",
                                className: "text-muted-foreground hover:text-foreground transition-colors",
                                children: [
                                    /*#__PURE__*/ _jsx(House, {
                                        className: "h-4 w-4"
                                    }),
                                    /*#__PURE__*/ _jsx("span", {
                                        className: "sr-only",
                                        children: "Home"
                                    })
                                ]
                            })
                        }),
                        items.length > 0 && /*#__PURE__*/ _jsx("li", {
                            children: /*#__PURE__*/ _jsx(CaretRight, {
                                className: "h-4 w-4 text-muted-foreground/50"
                            })
                        })
                    ]
                }),
                items.map((item, index)=>/*#__PURE__*/ _jsxs(React.Fragment, {
                        children: [
                            /*#__PURE__*/ _jsx("li", {
                                children: index === items.length - 1 ? /*#__PURE__*/ _jsx("span", {
                                    className: "text-foreground font-medium",
                                    children: item.title
                                }) : item.href === '#' ? /*#__PURE__*/ _jsx("span", {
                                    className: "text-muted-foreground",
                                    children: item.title
                                }) : /*#__PURE__*/ _jsx(Link, {
                                    href: item.href,
                                    className: "text-muted-foreground hover:text-foreground transition-colors",
                                    children: item.title
                                })
                            }),
                            index < items.length - 1 && /*#__PURE__*/ _jsx("li", {
                                children: /*#__PURE__*/ _jsx(CaretRight, {
                                    className: "h-4 w-4 text-muted-foreground/50"
                                })
                            })
                        ]
                    }, item.href))
            ]
        })
    });
}
