import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Button } from "../../../components/atoms/Button";
import { Text } from "../../../components/atoms/Text";
import { cn } from "../../../utils/cn";
export const Pagination = ({ currentPage, totalPages, onPageChange, className, showPageNumbers = true, maxVisiblePages = 5, testId, }) => {
    if (totalPages <= 1)
        return null;
    const getVisiblePages = () => {
        const pages = [];
        const half = Math.floor(maxVisiblePages / 2);
        let start = Math.max(1, currentPage - half);
        let end = Math.min(totalPages, currentPage + half);
        if (currentPage <= half) {
            end = Math.min(maxVisiblePages, totalPages);
        }
        if (currentPage >= totalPages - half) {
            start = Math.max(1, totalPages - maxVisiblePages + 1);
        }
        if (start > 1) {
            pages.push(1);
            if (start > 2)
                pages.push("...");
        }
        for (let i = start; i <= end; i++) {
            pages.push(i);
        }
        if (end < totalPages) {
            if (end < totalPages - 1)
                pages.push("...");
            pages.push(totalPages);
        }
        return pages;
    };
    const visiblePages = getVisiblePages();
    return (_jsxs("nav", { className: cn("flex items-center justify-center gap-2", className), role: "navigation", "aria-label": "Pagination", "data-testid": testId, children: [_jsx(Button, { variant: "outline", size: "md", onClick: () => onPageChange(currentPage - 1), disabled: currentPage === 1, "aria-label": "Previous page", className: "px-3 py-2 min-w-[40px] h-10", testId: testId ? `${testId}.prevButton` : undefined, children: _jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }) }), showPageNumbers &&
                visiblePages.map((page, index) => {
                    if (page === "...") {
                        return (_jsx("span", { className: "px-2 text-neutral-500 dark:text-neutral-400 text-base", children: "..." }, `ellipsis-${index}`));
                    }
                    const pageNum = page;
                    const isActive = pageNum === currentPage;
                    return (_jsx(Button, { variant: isActive ? "primary" : "outline", size: "md", onClick: () => onPageChange(pageNum), "aria-label": `Page ${pageNum}`, "aria-current": isActive ? "page" : undefined, className: "px-4 py-2 min-w-[40px] h-10 text-base", testId: testId ? `${testId}.page.${pageNum}` : undefined, children: pageNum }, pageNum));
                }), _jsx(Button, { variant: "outline", size: "md", onClick: () => onPageChange(currentPage + 1), disabled: currentPage === totalPages, "aria-label": "Next page", className: "px-3 py-2 min-w-[40px] h-10", testId: testId ? `${testId}.nextButton` : undefined, children: _jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) }) }), _jsxs(Text, { variant: "body", className: "ml-4 text-base text-neutral-600 dark:text-neutral-400", testId: testId ? `${testId}.info` : undefined, children: ["Page ", currentPage, " of ", totalPages] })] }));
};
export default Pagination;
