'use client';

import { cn } from "../../utils/cn.mjs";
import { Button, ButtonVariant } from "../Button/Button.mjs";
import { Link, LinkColor } from "../Link/Link.mjs";
import { ChevronRightIcon } from "lucide-react";
import { Fragment, createElement } from "react";
import { cva } from "class-variance-authority";
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
import { getIntlayer } from "@intlayer/core";
import { useIntlayer } from "react-intlayer";

//#region src/components/Breadcrumb/index.tsx
/**
* Breadcrumb variant styles using class-variance-authority
*/
const breadcrumbVariants = cva("flex flex-row flex-wrap items-center text-sm", {
	variants: {
		size: {
			small: "gap-1 text-xs",
			medium: "gap-2 text-sm",
			large: "gap-3 text-base"
		},
		spacing: {
			compact: "gap-1",
			normal: "gap-2",
			loose: "gap-4"
		}
	},
	defaultVariants: {
		size: "medium",
		spacing: "normal"
	}
});
/**
* LinkLink sub-component for breadcrumb items that navigate to other pages
*/
const LinkLink = ({ href, lang, children, onClick, color, position, locale, className, ...props }) => {
	const linkLabel = getIntlayer("breadcrumb").linkLabel;
	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Link, {
		href,
		locale,
		color,
		onClick,
		itemProp: "item",
		isExternalLink: false,
		itemScope: true,
		itemType: "https://schema.org/WebPage",
		...props,
		label: `${linkLabel} ${children}`,
		itemID: href,
		size: "sm",
		children: /* @__PURE__ */ jsx("span", {
			itemProp: "name",
			children
		})
	}), /* @__PURE__ */ jsx("meta", {
		itemProp: "position",
		content: position.toString()
	})] });
};
/**
* ButtonLink sub-component for breadcrumb items with click handlers
*/
const ButtonLink = ({ children: text, onClick, color, position, className, ...props }) => {
	const { linkLabel } = useIntlayer("breadcrumb");
	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Button, {
		onClick,
		variant: ButtonVariant.LINK,
		label: `${linkLabel} ${text}`,
		color,
		itemProp: "item",
		...props,
		children: /* @__PURE__ */ jsx("span", {
			itemProp: "name",
			children: text
		})
	}), /* @__PURE__ */ jsx("meta", {
		itemProp: "position",
		content: position.toString()
	})] });
};
/**
* Span sub-component for static breadcrumb text items
*/
const Span = ({ children, position, className, ...props }) => /* @__PURE__ */ jsxs("span", {
	itemProp: "item",
	className: cn("inline-flex items-center", "font-medium text-neutral-700", "transition-colors duration-200", className),
	children: [/* @__PURE__ */ jsx("span", {
		itemProp: "name",
		...props,
		children
	}), /* @__PURE__ */ jsx("meta", {
		itemProp: "position",
		content: position.toString()
	})]
});
/**
* Breadcrumb component providing navigational context with accessibility features
*
* Features:
* - Supports links, buttons, and static text elements
* - Full keyboard navigation support
* - ARIA attributes for screen readers
* - Schema.org structured data for SEO
* - Customizable separators and styling
* - Internationalization support
* - Responsive design variants
*
* @example
* ```tsx
* <Breadcrumb
*   links={[
*     'Home',
*     { href: '/products', text: 'Products' },
*     { onClick: handleCategory, text: 'Electronics' },
*     'Smartphones'
*   ]}
*   size="medium"
*   ariaLabel="Product navigation"
* />
* ```
*/
const Breadcrumb = ({ links, className, color = LinkColor.TEXT, locale, elementType = "page", separator = /* @__PURE__ */ jsx(ChevronRightIcon, { size: 10 }), ariaLabel = "breadcrumb", includeStructuredData = true, maxItems, size, spacing, ...props }) => {
	const displayLinks = maxItems && links.length > maxItems ? [
		...links.slice(0, 1),
		"...",
		...links.slice(-(maxItems - 2))
	] : links;
	return /* @__PURE__ */ jsx("nav", {
		"aria-label": ariaLabel,
		children: /* @__PURE__ */ jsx("ol", {
			className: cn(breadcrumbVariants({
				size,
				spacing
			}), className),
			...includeStructuredData && {
				itemScope: true,
				itemType: "http://schema.org/BreadcrumbList"
			},
			...props,
			children: displayLinks.map((link, index) => {
				const isLastLink = index === displayLinks.length - 1;
				const isLink = typeof link === "object" && typeof link.href === "string";
				const isButton = typeof link === "object" && typeof link.onClick === "function";
				const isActive = index === displayLinks.length - 1;
				const ariaCurrent = isActive ? elementType : void 0;
				const isTruncated = link === "...";
				const text = link.text ?? link;
				if (isTruncated) return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("li", {
					className: "flex items-center",
					"aria-hidden": "true",
					children: /* @__PURE__ */ jsx("span", {
						className: "text-neutral-500",
						children: "…"
					})
				}), !isLastLink && /* @__PURE__ */ jsx("li", {
					"aria-hidden": "true",
					className: "flex items-center",
					children: separator
				})] }, `truncated-${text}`);
				let section = /* @__PURE__ */ jsx(Span, {
					position: index + 1,
					"aria-current": ariaCurrent,
					className: cn("transition-colors duration-200", isActive && "text-neutral-900"),
					children: text
				}, text);
				if (isLink) section = /* @__PURE__ */ jsx(LinkLink, {
					href: link.href,
					color,
					position: index + 1,
					locale,
					"aria-current": ariaCurrent,
					className: cn(isActive && "cursor-default text-neutral-900"),
					children: text
				}, text);
				else if (isButton) section = /* @__PURE__ */ jsx(ButtonLink, {
					onClick: link.onClick,
					color,
					position: index + 1,
					"aria-current": ariaCurrent,
					className: cn(isActive && "cursor-default text-neutral-900"),
					children: text
				}, text);
				const listElement = /* @__PURE__ */ createElement("li", {
					...includeStructuredData && {
						itemProp: "itemListElement",
						itemScope: true,
						itemType: "https://schema.org/ListItem"
					},
					key: text,
					className: "flex items-center"
				}, section);
				if (isLastLink) return listElement;
				return /* @__PURE__ */ jsxs(Fragment, { children: [listElement, /* @__PURE__ */ jsx("li", {
					"aria-hidden": "true",
					className: "flex items-center",
					children: separator
				})] }, text);
			})
		})
	});
};

//#endregion
export { Breadcrumb };
//# sourceMappingURL=index.mjs.map