import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import cn from "classnames";
import { t } from "ttag";
import { Container, Inner, Button, ArrowLeft, ArrowRight, PageNumbers, PageNumber, } from "./pagination.styled";
const Pagination = ({ className, pages, currentPage, disabled, setCurrentPage, handleNextPageClick, handlePrevPageClick, }) => {
    return (_jsx(Container, { className: cn(`ui-pagination__container`, className, { disabled }), children: _jsxs(Inner, { className: "ui-pagination__inner", children: [_jsxs(Button, { className: "ui-pagination__button-prev", onClick: handlePrevPageClick, children: [_jsx(ArrowLeft, {}), t `Prev`] }), _jsx(PageNumbers, { className: "ui-pagination__page-numbers", children: pages.map((page, i) => (_jsx(PageNumber, { className: `ui-pagination__page-number ${page.className} ${currentPage?.toString() === page.label ? "active" : ""}`, onClick: () => setCurrentPage(+page.label), children: page.label }, `pagination-${i}`))) }), _jsxs(Button, { className: "ui-pagination__button-next", onClick: handleNextPageClick, children: [t `Next`, _jsx(ArrowRight, {})] })] }) }));
};
export default Pagination;
//# sourceMappingURL=pagination.js.map