import { __assign, __read, __rest, __spreadArray } from "tslib";
// @ts-nocheck
import './Pagination.css';
import React from 'react';
import { IconChevronArrowLeft } from '../../icons/IconChevronArrowLeft/IconChevronArrowLeft';
import { IconChevronArrowRight } from '../../icons/IconChevronArrowRight/IconChevronArrowRight';
import { cn } from '../../utils/bem';
import { Button } from '../Button/Button';
import { Typography } from '../Typography';
import { getPaginationInfo } from './helpers';
export var paginationSizes = ['xs', 's', 'm', 'l'];
export var paginationDefaultSize = 'm';
export var paginationTypes = ['default'];
export var paginationDefaultType = 'default';
var getDefaultLabel = function (totalPages) { return "".concat(totalPages); };
export var cnPagination = cn('Pagination');
// eslint-disable-next-line @typescript-eslint/no-redeclare
export var Pagination = React.forwardRef(function (props, ref) {
    var _a = props.currentPage, currentPage = _a === void 0 ? 1 : _a, _b = props.totalPages, totalPages = _b === void 0 ? 0 : _b, onChange = props.onChange, _c = props.getLabel, getLabel = _c === void 0 ? getDefaultLabel(totalPages) : _c, _d = props.size, size = _d === void 0 ? paginationDefaultSize : _d, 
    // type = paginationDefaultType,
    _e = props.minified, 
    // type = paginationDefaultType,
    minified = _e === void 0 ? false : _e, hideControls = props.hideControls, _f = props.hotkeys, hotkeys = _f === void 0 ? {
        nextPage: {
            values: ['Alt', 'ArrowRight']
        },
        prevPage: {
            values: ['Alt', 'ArrowLeft']
        }
    } : _f, _g = props.containerEventListener, containerEventListener = _g === void 0 ? window : _g, className = props.className, otherProps = __rest(props, ["currentPage", "totalPages", "onChange", "getLabel", "size", "minified", "hideControls", "hotkeys", "containerEventListener", "className"]);
    if (!totalPages)
        return null;
    var currPage = currentPage;
    var _h = getPaginationInfo(currPage, totalPages), prevPage = _h.prevPage, nextPage = _h.nextPage, isEmpty = _h.isEmpty;
    // eslint-disable-next-line react-hooks/rules-of-hooks
    var _j = __read(React.useState([]), 2), keys = _j[0], setKeys = _j[1];
    var changePage = function (page) {
        if (page && page !== currPage && onChange) {
            onChange(page);
        }
    };
    var handleClick = function (page) { return function (e) {
        e.preventDefault();
        changePage(page);
    }; };
    var keyUpListener = function (event) {
        var key = event.key;
        setKeys(function (prevState) { return prevState.filter(function (hotKey) { return hotKey !== key; }); });
    };
    var keyDownListener = function (event) {
        var key = event.key;
        if (hotkeys.nextPage.values.includes(key) || hotkeys.prevPage.values.includes(key)) {
            var newKeys_1 = __spreadArray(__spreadArray([], __read(keys), false), [key], false);
            if (hotkeys.nextPage.values.every(function (hotKey) { return newKeys_1.includes(hotKey); })) {
                changePage(nextPage);
            }
            else if (hotkeys.prevPage.values.every(function (hotKey) { return newKeys_1.includes(hotKey); })) {
                changePage(prevPage);
            }
            setKeys(newKeys_1);
        }
    };
    // eslint-disable-next-line react-hooks/rules-of-hooks
    React.useEffect(function () {
        containerEventListener.addEventListener('keydown', keyDownListener);
        containerEventListener.addEventListener('keyup', keyUpListener);
        return function () {
            containerEventListener.removeEventListener('keydown', keyDownListener);
            containerEventListener.removeEventListener('keyup', keyUpListener);
        };
    });
    return ((!isEmpty && (React.createElement("nav", __assign({ className: cnPagination({
            size: size
        }, [className]), ref: ref }, otherProps),
        React.createElement("div", { className: cnPagination('Pages') },
            React.createElement(Typography.Text, { size: size, weight: "bold", transform: "uppercase", className: cnPagination('Current') }, currPage.toString()),
            React.createElement(Typography.Text, { size: size, className: cnPagination('Total'), weight: "bold", transform: "uppercase" }, getLabel)),
        !hideControls && (React.createElement("div", { className: cnPagination('Controls') },
            (currPage > 1 || minified) && (React.createElement("div", { className: cnPagination('PrevPage') },
                React.createElement(Button, { className: cnPagination('ItemLeft', {
                        minified: minified,
                        show: currPage > 1
                    }), iconLeft: IconChevronArrowLeft, view: "ghost", size: size, iconSize: "xs", onClick: handleClick(prevPage) }))),
            (currPage < totalPages || minified) && (React.createElement("div", { className: cnPagination('NextPage') },
                React.createElement(Button, { className: cnPagination('ItemRight', {
                        minified: minified,
                        show: currPage < totalPages
                    }), iconRight: IconChevronArrowRight, view: "ghost", size: size, onClick: handleClick(nextPage) })))))))) ||
        null);
});
