import React, { forwardRef, useMemo, useRef } from "react";
import { IconBrokenArrowLeft2, IconBrokenArrowRight3 } from "@greenatom/icons";
import P1 from "../typography/P1";
import useForkRef from "../hooks/useForkRef";
import usePagination from "./hooks/usePagination";
import { PaginationContainer, StyledPages, StyledIcons, Elems, StyledEllipses } from "./style";
var Pagination = forwardRef(function (_a, ref) {
    var _b = _a.iconNext, iconNext = _b === void 0 ? React.createElement(IconBrokenArrowRight3, null) : _b, _c = _a.iconPrev, iconPrev = _c === void 0 ? React.createElement(IconBrokenArrowLeft2, null) : _c, generalPages = _a.generalPages, className = _a.className, switcherTextPrev = _a.switcherTextPrev, switcherTextNext = _a.switcherTextNext, isShowSwitchers = _a.isShowSwitchers, _d = _a.currentPage, currentPage = _d === void 0 ? 1 : _d, isMinimized = _a.isMinimized, onPageChange = _a.onPageChange, width = _a.width, isDisabled = _a.isDisabled, isFill = _a.isFill;
    var containerRef = useRef(null);
    var forkRef = useForkRef([ref, containerRef]);
    var hasMinified = useMemo(function () { return isMinimized || generalPages === 1; }, [isMinimized, generalPages]);
    var _e = usePagination({
        contentPerPage: 1,
        count: generalPages,
        currentPage: currentPage,
        isMinimized: hasMinified,
        ref: containerRef
    }), nextPage = _e.nextPage, prevPage = _e.prevPage, currPage = _e.currPage, gaps = _e.gaps, setPage = _e.setPage, totalPages = _e.totalPages;
    var changePage = function (page) {
        setPage(page);
        onPageChange === null || onPageChange === void 0 ? void 0 : onPageChange(page);
    };
    var handleClickNextPage = function () {
        nextPage();
        onPageChange === null || onPageChange === void 0 ? void 0 : onPageChange(currPage + 1);
    };
    var handleClickPrevPage = function () {
        prevPage();
        onPageChange === null || onPageChange === void 0 ? void 0 : onPageChange(currPage - 1);
    };
    var renderPrev = useMemo(function () {
        if (isShowSwitchers) {
            return (React.createElement(StyledIcons, { viewType: "ghost", size: "s", onClick: handleClickPrevPage, isDisabled: !currentPage || currPage === 1 || isDisabled }, switcherTextPrev ? switcherTextPrev : iconPrev));
        }
        return null;
    }, [isShowSwitchers, iconPrev, switcherTextPrev, currPage, isDisabled]);
    var renderNext = useMemo(function () {
        if (isShowSwitchers) {
            return (React.createElement(StyledIcons, { viewType: "ghost", size: "s", onClick: handleClickNextPage, isDisabled: currPage === totalPages || isDisabled }, switcherTextNext ? switcherTextNext : iconNext));
        }
        return null;
    }, [isShowSwitchers, iconNext, switcherTextNext, currPage, isDisabled]);
    if (totalPages) {
        return (React.createElement(PaginationContainer, { isFill: isFill, isDisabled: isDisabled, className: className, ref: forkRef, width: width },
            renderPrev,
            React.createElement(Elems, { isMinimized: hasMinified || generalPages < 6 },
                hasMinified ? null : (React.createElement(StyledPages, { forwardedAs: "li", size: "s", isDisabled: isDisabled, viewType: "ghost", onClick: function () { return changePage(1); }, isActive: currPage === 1 },
                    React.createElement(P1, { type: "phoenix" }, "1"))),
                !hasMinified && gaps.before ? (React.createElement(StyledEllipses, { isDisabled: isDisabled },
                    React.createElement(P1, { type: "phoenix" }, "..."))) : null,
                gaps.paginationGroup.map(function (el) { return (React.createElement(StyledPages, { forwardedAs: "li", viewType: "ghost", size: "s", isDisabled: isDisabled, onClick: function () { return changePage(el); }, isActive: currPage === el, key: el },
                    React.createElement(P1, { type: "phoenix" }, el))); }),
                !hasMinified && gaps.after && (React.createElement(StyledEllipses, { isDisabled: isDisabled },
                    React.createElement(P1, { type: "phoenix" }, "..."))),
                hasMinified ? null : (React.createElement(StyledPages, { forwardedAs: "li", size: "s", isDisabled: isDisabled, viewType: "ghost", isActive: currPage === totalPages, onClick: function () { return changePage(totalPages); } },
                    React.createElement(P1, { type: "phoenix" }, totalPages)))),
            renderNext));
    }
    return null;
});
Pagination.displayName = "Pagination";
export default Pagination;
