'use client';

import { cn } from "../../utils/cn.mjs";
import { Button, ButtonColor, ButtonSize, ButtonVariant } from "../Button/Button.mjs";
import { useItemSelector } from "../../hooks/useItemSelector.mjs";
import { ChevronLeft, ChevronRight, MoreHorizontal } from "lucide-react";
import { useEffect, useRef } from "react";
import { cva } from "class-variance-authority";
import { jsx, jsxs } from "react/jsx-runtime";

//#region src/components/Pagination/Pagination.tsx
const paginationVariants = cva("flex items-center justify-center gap-1", {
	variants: {
		size: {
			sm: "gap-1",
			md: "gap-2",
			lg: "gap-3"
		},
		color: {
			text: "background-text",
			primary: "background-primary",
			secondary: "background-secondary",
			neutral: "background-neutral",
			destructive: "background-destructive"
		},
		variant: {
			default: "",
			bordered: "rounded-lg border border-border p-2",
			ghost: "bg-transparent"
		}
	},
	defaultVariants: {
		size: "md",
		variant: "default"
	}
});
let PaginationSize = /* @__PURE__ */ function(PaginationSize$1) {
	PaginationSize$1["SM"] = "sm";
	PaginationSize$1["MD"] = "md";
	PaginationSize$1["LG"] = "lg";
	return PaginationSize$1;
}({});
let PaginationVariant = /* @__PURE__ */ function(PaginationVariant$1) {
	PaginationVariant$1["DEFAULT"] = "default";
	PaginationVariant$1["BORDERED"] = "bordered";
	PaginationVariant$1["GHOST"] = "ghost";
	return PaginationVariant$1;
}({});
const generatePageNumbers = (currentPage, totalPages, maxVisiblePages) => {
	if (totalPages <= maxVisiblePages) return Array.from({ length: totalPages }, (_, i) => i + 1);
	const pages = [];
	const halfVisible = Math.floor(maxVisiblePages / 2);
	pages.push(1);
	if (currentPage <= halfVisible + 2) {
		for (let i = 2; i <= Math.min(maxVisiblePages - 1, totalPages - 1); i++) pages.push(i);
		if (totalPages > maxVisiblePages) pages.push("ellipsis");
		if (totalPages > 1) pages.push(totalPages);
	} else if (currentPage >= totalPages - halfVisible - 1) {
		if (totalPages > maxVisiblePages) pages.push("ellipsis");
		for (let i = Math.max(2, totalPages - maxVisiblePages + 2); i <= totalPages; i++) pages.push(i);
	} else {
		pages.push("ellipsis");
		const start = currentPage - halfVisible;
		const end = currentPage + halfVisible;
		for (let i = start; i <= end; i++) pages.push(i);
		pages.push("ellipsis");
		pages.push(totalPages);
	}
	return pages;
};
const selector = (option) => option?.getAttribute("aria-current") === "true";
const getButtonSize = (size) => {
	if (size === PaginationSize.SM) return ButtonSize.ICON_SM;
	else if (size === PaginationSize.LG) return ButtonSize.ICON_LG;
	else return ButtonSize.ICON_MD;
};
const InputIndicator = (props) => /* @__PURE__ */ jsx("div", {
	className: "absolute top-0 z-0 h-full w-auto rounded-xl bg-text/20 ring-4 ring-text/10 transition-[left,width] duration-300 ease-in-out [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl motion-reduce:transition-none",
	...props
});
const Pagination = ({ currentPage, totalPages, onPageChange, showFirstLast = false, showPrevNext = true, maxVisiblePages = 5, disabled = false, size = PaginationSize.MD, variant = PaginationVariant.DEFAULT, color = ButtonColor.TEXT, className, ...props }) => {
	const pageNumbers = generatePageNumbers(currentPage, totalPages, maxVisiblePages);
	const buttonSize = getButtonSize(size);
	const isFirstPage = currentPage === 1;
	const isLastPage = currentPage === totalPages;
	const optionsRefs = useRef([]);
	const indicatorRef = useRef(null);
	const { choiceIndicatorPosition, calculatePosition } = useItemSelector(optionsRefs, {
		selector,
		isHoverable: true
	});
	useEffect(() => {
		const timer = setTimeout(() => {
			calculatePosition();
		}, 300);
		return () => clearTimeout(timer);
	}, [currentPage, calculatePosition]);
	if (totalPages <= 1) return null;
	const handlePageChange = (page) => {
		if (!disabled && page >= 1 && page <= totalPages && page !== currentPage) onPageChange(page);
	};
	return /* @__PURE__ */ jsx("div", {
		className: cn(paginationVariants({
			size,
			variant
		}), className),
		...props,
		children: /* @__PURE__ */ jsxs("div", {
			className: "relative flex items-center gap-1",
			children: [
				choiceIndicatorPosition && /* @__PURE__ */ jsx(InputIndicator, {
					style: choiceIndicatorPosition,
					ref: indicatorRef
				}),
				showPrevNext && /* @__PURE__ */ jsx(Button, {
					variant: ButtonVariant.OUTLINE,
					size: buttonSize,
					color: ButtonColor.TEXT,
					onClick: () => handlePageChange(currentPage - 1),
					disabled: disabled || isFirstPage,
					label: "Go to previous page",
					Icon: ChevronLeft,
					ref: (el) => {
						if (el) optionsRefs.current[0] = el;
					},
					className: "min-w-0 px-2"
				}),
				/* @__PURE__ */ jsx("div", {
					className: "flex items-center gap-1 max-md:gap-0.5",
					children: pageNumbers.map((page, index) => {
						if (page === "ellipsis") return /* @__PURE__ */ jsx("div", {
							className: "flex h-8 min-w-8 items-center justify-center px-1",
							children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4 text-muted-foreground" })
						}, `ellipsis-${page}-${index}`);
						const isActive = page === currentPage;
						const refIndex = (showPrevNext ? 1 : 0) + pageNumbers.slice(0, index).filter((p) => p !== "ellipsis").length;
						return /* @__PURE__ */ jsx(Button, {
							variant: isActive ? ButtonVariant.DEFAULT : ButtonVariant.OUTLINE,
							size: buttonSize,
							color: ButtonColor.TEXT,
							onClick: () => handlePageChange(page),
							disabled,
							label: `Go to page ${page}`,
							"aria-current": isActive ? "true" : "false",
							ref: (el) => {
								if (el) optionsRefs.current[refIndex] = el;
							},
							className: cn("flex aspect-square h-8 w-8 min-w-0 items-center justify-center p-0 text-sm", size === "sm" && "h-6 w-6 text-xs", size === "lg" && "h-10 w-10 text-base", isActive && "font-semibold"),
							children: page
						}, page);
					})
				}),
				showPrevNext && /* @__PURE__ */ jsx(Button, {
					variant: ButtonVariant.OUTLINE,
					size: buttonSize,
					color: ButtonColor.TEXT,
					onClick: () => handlePageChange(currentPage + 1),
					disabled: disabled || isLastPage,
					label: "Go to next page",
					Icon: ChevronRight,
					ref: (el) => {
						const lastRefIndex = (showPrevNext ? 1 : 0) + pageNumbers.filter((p) => p !== "ellipsis").length;
						if (el) optionsRefs.current[lastRefIndex] = el;
					},
					className: "min-w-0 px-2"
				})
			]
		})
	});
};

//#endregion
export { Pagination, PaginationSize, PaginationVariant, paginationVariants };
//# sourceMappingURL=Pagination.mjs.map