stackpress/dist/view/element/Pagination.js

Incept is a content management framework.

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export default function Pagination(props) {
    const { total = 0, skip = 0, take = 50, radius = 2, paginate = () => { } } = props;
    const current = Math.floor(skip / take) + 1;
    const max = Math.ceil(total / take);
    const previous = current > 1;
    const next = current < max;
    const refresh = (page) => paginate(Math.max(page - 1, 0) * take);
    const pages = [];
    for (let i = current - 1 - radius; i < max; i++) {
        if (i >= 0 && i < current + radius) {
            pages.push(i + 1);
        }
    }
    if (total <= take)
        return null;
    return (_jsxs("div", { className: "flex items-center justify-center bg-b1 px-2 py-3", children: [previous && (_jsx("button", { onClick: () => refresh(current - 1), className: "relative border border-gray-300 bg-b2 px-4 py-2 text-sm font-medium text-t1 hover:bg-gray-600", children: _jsx("i", { className: "fas fa-chevron-left" }) })), pages.map((page, i) => (_jsx("button", { onClick: () => refresh(page), className: `relative px-z-10 inline-flex items-center border border-white px-px-10 px-py-5 text-sm font-semibold 
            ${page === current ? 'bg-gray-600 text-white border border-white px-z-10 pointer-events-none' : 'theme-tx1 hover:bg-gray-600'}`, children: page }, i))), next && (_jsx("button", { onClick: () => refresh(current + 1), className: "theme-bg-bg2 relative border border-gray-300 px-px-10 px-py-5 text-sm font-medium text-t1 hover:bg-gray-600", children: _jsx("i", { className: "fas fa-chevron-right" }) }))] }));
}
;