import { cn } from "./index3.js";
import { Button } from "./index6.js";
import { Separator } from "./index7.js";
import { Avatar } from "./index15.js";
import { Kbd } from "./index83.js";
import { BreadcrumbCompound, BreadcrumbEllipsis, BreadcrumbHomeLink, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from "./index401.js";
import { cva } from "class-variance-authority";
import { ArrowLeft, Search } from "lucide-react";
import * as React from "react";
import { jsx, jsxs } from "react/jsx-runtime";
//#region src/components/organisms/layout/PageHeader/PageHeader.tsx
var pageHeaderVariants = cva("flex flex-col w-full", {
	variants: { variant: {
		simple: "gap-5",
		avatar: "gap-5",
		"banner-avatar": "gap-0",
		"banner-simple": "gap-0",
		"banner-avatar-centered": "gap-0",
		"banner-simple-centered": "gap-0"
	} },
	defaultVariants: { variant: "simple" }
});
var contentVariants = cva("flex flex-wrap items-start w-full", {
	variants: { variant: {
		simple: "gap-4",
		avatar: "gap-4 md:gap-5",
		"banner-avatar": "gap-4 md:gap-6",
		"banner-simple": "gap-4 md:gap-6",
		"banner-avatar-centered": "flex-col items-center text-center gap-4 md:gap-6",
		"banner-simple-centered": "flex-col items-center text-center gap-4 md:gap-6"
	} },
	defaultVariants: { variant: "simple" }
});
var bannerVariants = cva("relative w-full overflow-hidden bg-gradient-to-br from-secondary to-muted", {
	variants: { variant: {
		default: "h-40 md:h-60",
		centered: "h-40 md:h-60"
	} },
	defaultVariants: { variant: "default" }
});
var PageHeader = React.forwardRef(({ variant = "simple", title, supportingText, breadcrumbs, actions, searchPlaceholder, searchShortcut = "⌘K", onSearch, showDivider = true, avatarSrc, avatarFallback, avatarStatusIcon = "verified", onBackClick, backLabel = "Back", className }, ref) => {
	const searchId = React.useId();
	const isBanner = variant?.startsWith("banner");
	const isCentered = variant?.includes("centered");
	const hasAvatar = variant?.includes("avatar");
	const renderBreadcrumbs = () => {
		if (!breadcrumbs || breadcrumbs.length === 0) return null;
		return /* @__PURE__ */ jsx(BreadcrumbCompound, {
			className: "hidden md:flex delight-fade-in motion-reduce:!animate-none",
			children: /* @__PURE__ */ jsxs(BreadcrumbList, { children: [/* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbHomeLink, { href: "/" }) }), breadcrumbs.map((item, index) => {
				const isLast = index === breadcrumbs.length - 1;
				const hasEllipsis = breadcrumbs.length > 3;
				if (hasEllipsis && index === 1) return /* @__PURE__ */ jsxs(React.Fragment, { children: [/* @__PURE__ */ jsx(BreadcrumbSeparator, {}), /* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbEllipsis, {}) })] }, `ellipsis-${index}`);
				if (hasEllipsis && index > 1 && !isLast) return null;
				return /* @__PURE__ */ jsxs(React.Fragment, { children: [/* @__PURE__ */ jsx(BreadcrumbSeparator, {}), /* @__PURE__ */ jsx(BreadcrumbItem, { children: isLast || item.isCurrent ? /* @__PURE__ */ jsx(BreadcrumbPage, { children: item.label }) : /* @__PURE__ */ jsx(BreadcrumbLink, {
					href: item.href,
					children: item.label
				}) })] }, item.label);
			})] })
		});
	};
	const renderBackButton = () => {
		if (!onBackClick || !breadcrumbs || breadcrumbs.length === 0) return null;
		return /* @__PURE__ */ jsx(Button, {
			appearance: "link",
			variant: "primary",
			size: "sm",
			startIcon: /* @__PURE__ */ jsx(ArrowLeft, { className: "size-5" }),
			onClick: onBackClick,
			"aria-label": `Go back: ${backLabel}`,
			className: "md:hidden text-secondary-foreground px-0 hover:no-underline",
			children: backLabel
		});
	};
	const renderActions = () => {
		if (!actions || actions.length === 0) return null;
		return /* @__PURE__ */ jsx("div", {
			className: "flex items-center gap-3 delight-stagger motion-reduce:!animate-none",
			style: { "--delight-delay": "120ms" },
			children: actions.map((action, index) => /* @__PURE__ */ jsx(Button, {
				variant: action.variant ?? (index === actions.length - 1 ? "primary" : "secondary"),
				onClick: action.onClick,
				...action.buttonProps,
				children: action.label
			}, action.label))
		});
	};
	const renderSearch = () => {
		if (!searchPlaceholder) return null;
		return /* @__PURE__ */ jsx("search", {
			className: "relative flex-1 min-w-0 max-w-xs delight-stagger motion-reduce:!animate-none",
			style: { "--delight-delay": "180ms" },
			children: /* @__PURE__ */ jsxs("div", {
				className: "group/search relative",
				children: [
					/* @__PURE__ */ jsx(Search, {
						className: "absolute start-3 top-1/2 -translate-y-1/2 size-5 text-quaternary-foreground pointer-events-none transition-colors duration-150 group-focus-within/search:text-primary motion-reduce:transition-none",
						"aria-hidden": "true"
					}),
					/* @__PURE__ */ jsx("input", {
						id: searchId,
						type: "text",
						placeholder: searchPlaceholder,
						"aria-label": searchPlaceholder,
						onChange: (e) => onSearch?.(e.target.value),
						className: cn("peer w-full rounded-lg border border-border bg-background py-2.5 pe-10 ps-10", "text-base text-foreground placeholder:text-muted-foreground", "shadow-xs transition-[border-color,box-shadow] duration-150 motion-reduce:transition-none", "focus-visible:border-primary focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-primary")
					}),
					searchShortcut && /* @__PURE__ */ jsx(Kbd, {
						variant: "outline",
						size: "xs",
						className: "absolute end-3 top-1/2 -translate-y-1/2 transition-opacity duration-150 peer-focus-visible:opacity-0 motion-reduce:transition-none",
						"aria-hidden": "true",
						children: searchShortcut
					})
				]
			})
		});
	};
	const renderAvatar = () => {
		if (!hasAvatar) return null;
		if (isBanner) {
			const getInitials = (name) => {
				if (!name) return "";
				const words = name.split(" ").filter(Boolean);
				if (words.length >= 2) return `${words[0][0]}${words[1][0]}`.toUpperCase();
				return name.slice(0, 2).toUpperCase();
			};
			return /* @__PURE__ */ jsxs("div", {
				className: cn("relative shrink-0 rounded-full ring-4 ring-bg-primary shadow-lg", "size-24 md:size-40", "delight-fade-in motion-reduce:!animate-none"),
				children: [avatarSrc ? /* @__PURE__ */ jsx("img", {
					src: avatarSrc,
					alt: avatarFallback || "",
					className: "size-full rounded-full object-cover"
				}) : /* @__PURE__ */ jsx("div", {
					className: "flex size-full items-center justify-center rounded-full bg-accent text-2xl font-semibold text-muted-foreground md:text-4xl",
					children: getInitials(avatarFallback)
				}), avatarStatusIcon === "verified" && /* @__PURE__ */ jsx("div", {
					className: "absolute bottom-0 end-0 flex size-6 items-center justify-center rounded-full border-2 border-bg-primary bg-primary/10 md:size-10",
					children: /* @__PURE__ */ jsxs("svg", {
						className: "size-3 text-primary md:size-5",
						fill: "currentColor",
						viewBox: "0 0 20 20",
						"aria-hidden": "true",
						children: [/* @__PURE__ */ jsx("title", { children: "Verified" }), /* @__PURE__ */ jsx("path", {
							fillRule: "evenodd",
							d: "M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z",
							clipRule: "evenodd"
						})]
					})
				})]
			});
		}
		return /* @__PURE__ */ jsx(Avatar, {
			src: avatarSrc,
			fallback: avatarFallback,
			alt: avatarFallback,
			size: "xl",
			indicator: avatarStatusIcon
		});
	};
	const renderTextContent = () => /* @__PURE__ */ jsxs("div", {
		className: cn("flex flex-col min-w-0", isCentered ? "items-center" : "flex-1"),
		children: [/* @__PURE__ */ jsx("h1", {
			className: "text-xl font-semibold text-foreground leading-relaxed delight-stagger motion-reduce:!animate-none",
			style: { "--delight-delay": "0ms" },
			children: title
		}), supportingText && /* @__PURE__ */ jsx("p", {
			className: "text-base text-muted-foreground leading-6 max-w-prose delight-stagger motion-reduce:!animate-none",
			style: { "--delight-delay": "60ms" },
			children: supportingText
		})]
	});
	if (isBanner) return /* @__PURE__ */ jsxs("header", {
		ref,
		"data-slot": "page-header",
		className: cn(pageHeaderVariants({ variant }), className),
		children: [
			/* @__PURE__ */ jsxs("div", {
				className: "relative",
				children: [/* @__PURE__ */ jsx("div", {
					className: bannerVariants({ variant: isCentered ? "centered" : "default" }),
					"aria-hidden": "true"
				}), hasAvatar && /* @__PURE__ */ jsx("div", {
					className: cn("absolute inset-x-0 px-4 md:px-8", "-bottom-12 md:-bottom-20", isCentered && "flex justify-center"),
					children: renderAvatar()
				})]
			}),
			/* @__PURE__ */ jsxs("div", {
				className: cn("px-4 md:px-8", hasAvatar ? "pt-16 md:pt-24" : "pt-6", isCentered && "flex flex-col items-center"),
				children: [
					/* @__PURE__ */ jsx("div", {
						className: "md:hidden mb-4",
						children: renderBackButton()
					}),
					!isCentered && /* @__PURE__ */ jsx("div", {
						className: "hidden md:block",
						children: renderBreadcrumbs()
					}),
					/* @__PURE__ */ jsxs("div", {
						className: cn(contentVariants({ variant }), "mt-4 md:mt-6"),
						children: [
							renderTextContent(),
							renderActions(),
							renderSearch()
						]
					})
				]
			}),
			showDivider && /* @__PURE__ */ jsx(Separator, { className: "mt-5 delight-connector-fill motion-reduce:!animate-none" })
		]
	});
	return /* @__PURE__ */ jsxs("header", {
		ref,
		"data-slot": "page-header",
		className: cn(pageHeaderVariants({ variant }), className),
		children: [
			breadcrumbs && breadcrumbs.length > 0 && /* @__PURE__ */ jsxs("div", { children: [renderBreadcrumbs(), renderBackButton()] }),
			/* @__PURE__ */ jsxs("div", {
				className: cn(contentVariants({ variant })),
				children: [
					/* @__PURE__ */ jsxs("div", {
						className: cn("flex gap-4 items-center flex-1 min-w-0", hasAvatar && "flex-row"),
						children: [renderAvatar(), renderTextContent()]
					}),
					renderActions(),
					renderSearch()
				]
			}),
			showDivider && /* @__PURE__ */ jsx(Separator, { className: "delight-connector-fill motion-reduce:!animate-none" })
		]
	});
});
PageHeader.displayName = "PageHeader";
//#endregion
export { PageHeader, bannerVariants, contentVariants, pageHeaderVariants };

//# sourceMappingURL=index458.js.map