@wener/console/lib/daisy/Pagination/Pagination.js

Base console UI toolkit

import React from "react";
import { HiChevronLeft, HiChevronRight } from "react-icons/hi2";
import classNames from "clsx";
import { Button } from "../Button/Button.js";
export const Pagination = ({ pageIndex = 0, onPageIndexChange, pageCount, href, pageOptions = buildPageOptions(pageIndex, pageCount) }) => {
    const pageNumber = pageIndex + 1;
    const canNextPage = pageNumber < pageCount;
    const canPreviousPage = pageNumber > 1;
    // const previousPage = () => onPageIndexChange?.(pageIndex - 1);
    // const nextPage = () => onPageIndexChange?.(pageIndex + 1);
    // let firstPage = () => onPageIndexChange(0);
    // let lastPage = () => onPageIndexChange(pageCount - 1);
    return /*#__PURE__*/ React.createElement("div", {
        className: "flex items-center gap-1"
    }, canPreviousPage && /*#__PURE__*/ React.createElement(Button, {
        href: href?.(pageIndex - 1),
        onClick: () => onPageIndexChange?.(pageIndex - 1),
        className: "btn btn-xs p-1"
    }, /*#__PURE__*/ React.createElement(HiChevronLeft, {
        className: "h-4 w-4"
    })), !canPreviousPage && /*#__PURE__*/ React.createElement("button", {
        disabled: true,
        className: "btn btn-xs p-1"
    }, /*#__PURE__*/ React.createElement(HiChevronLeft, {
        className: "h-4 w-4"
    })), /*#__PURE__*/ React.createElement("div", {
        className: "flex items-center gap-1"
    }, !pageOptions && /*#__PURE__*/ React.createElement("button", {
        className: "btn btn-xs"
    }, pageNumber, "/", pageCount), pageOptions?.map((v, i) => {
        let n = v;
        switch (v) {
            case -1:
                n = pageIndex - 5;
                break;
            case -2:
                n = pageIndex + 5;
                break;
        }
        return /*#__PURE__*/ React.createElement(Button, {
            key: v > 0 ? v : -i,
            className: classNames("btn btn-ghost btn-xs bg-transparent font-mono", v === pageIndex && "btn-active"),
            href: href?.(n),
            onClick: () => onPageIndexChange?.(n),
            // disabled={v === pageIndex || v < 0}
            title: `第${n + 1}页`
        }, /*#__PURE__*/ React.createElement("span", {
            className: "min-w-[2ch]"
        }, v >= 0 ? v + 1 : "..."));
    })), canNextPage && /*#__PURE__*/ React.createElement(Button, {
        href: href?.(pageIndex + 1),
        onClick: () => onPageIndexChange?.(pageIndex + 1),
        className: "btn btn-xs p-1"
    }, /*#__PURE__*/ React.createElement(HiChevronRight, {
        className: "h-4 w-4"
    })), !canNextPage && /*#__PURE__*/ React.createElement("button", {
        type: "button",
        disabled: true,
        className: "btn btn-xs p-1"
    }, /*#__PURE__*/ React.createElement(HiChevronRight, {
        className: "h-4 w-4"
    })));
};
const clamp = (value, min, max) => Math.min(Math.max(value, min), max);
export function buildPageOptions(pageIndex, pageCount) {
    let ops = [];
    // 默认显示 5 个 - 包含最前最后就是7个
    if (pageCount <= 7) {
        ops = new Array(pageCount).fill(null).map((_, i) => i);
    }
    else {
        let min = clamp(pageIndex - 2, 0, pageCount - 1);
        let max = clamp(pageIndex + 2, 0, pageCount - 1);
        // 处理不够补齐情况
        const maxPad = Math.abs(pageIndex - 2 - min);
        const minPad = Math.abs(pageIndex + 2 - max);
        max += maxPad;
        min -= minPad;
        if (min !== 0) {
            ops.push(0);
            if (min !== 1) {
                ops.push(-1);
            }
        }
        for (let i = min; i < pageIndex; i++) {
            ops.push(i);
        }
        ops.push(pageIndex);
        for (let i = pageIndex + 1; i <= max; i++) {
            ops.push(i);
        }
        if (max < pageCount - 1) {
            if (max !== pageCount - 2) {
                ops.push(-2);
            }
            ops.push(pageCount - 1);
        }
    }
    return ops;
}
//# sourceMappingURL=Pagination.js.map