"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.DataTablePagination = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("@chakra-ui/react");
const bi_1 = require("react-icons/bi");
const types_1 = require("../types");
const DataTablePagination = ({ table, }) => ((0, jsx_runtime_1.jsxs)(PaginationContainer, { children: [(0, jsx_runtime_1.jsx)(PaginationButton, { "aria-label": "First Page", size: "xs", icon: (0, jsx_runtime_1.jsx)(bi_1.BiChevronsLeft, {}), onClick: () => table.setPageIndex(0), isDisabled: !table.getCanPreviousPage() }), (0, jsx_runtime_1.jsx)(PaginationButton, { "aria-label": "Previous Page", size: "xs", icon: (0, jsx_runtime_1.jsx)(bi_1.BiChevronLeft, {}), onClick: () => table.previousPage(), isDisabled: !table.getCanPreviousPage() }), (0, jsx_runtime_1.jsxs)(PageText, { children: ["Page ", table.getState().pagination.pageIndex + 1, " of ", table.getPageCount()] }), (0, jsx_runtime_1.jsx)(PaginationButton, { "aria-label": "Next Page", size: "xs", icon: (0, jsx_runtime_1.jsx)(bi_1.BiChevronRight, {}), onClick: () => table.nextPage(), isDisabled: !table.getCanNextPage() }), (0, jsx_runtime_1.jsx)(PaginationButton, { "aria-label": "Last Page", size: "xs", icon: (0, jsx_runtime_1.jsx)(bi_1.BiChevronsRight, {}), onClick: () => table.setPageIndex(table.getPageCount() - 1), isDisabled: !table.getCanNextPage() }), (0, jsx_runtime_1.jsx)(react_1.Box, { w: "20px" }), (0, jsx_runtime_1.jsx)(PageText, { children: "Page Size:" }), (0, jsx_runtime_1.jsx)(react_1.Flex, Object.assign({ maxW: "80px" }, { children: (0, jsx_runtime_1.jsx)(PageSelect, Object.assign({ size: "xs", value: table.getState().pagination.pageSize, onChange: (e) => table.setPageSize(Number(e.target.value)) }, { children: types_1.pageLimitOptions.map((value) => ((0, jsx_runtime_1.jsx)("option", Object.assign({ value: value }, { children: value }), value))) })) }))] }));
exports.DataTablePagination = DataTablePagination;
const PaginationContainer = (0, react_1.chakra)(react_1.Flex, {
    baseStyle: {
        gap: "5px",
        alignItems: "center",
    },
});
const PaginationButton = (0, react_1.chakra)(react_1.IconButton, {
    baseStyle: {
        rounded: "lg",
    },
});
const PageText = (0, react_1.chakra)(react_1.Text, {
    baseStyle: {
        fontSize: "sm",
        userSelect: "none",
    },
});
const PageSelect = (0, react_1.chakra)(react_1.Select, {
    baseStyle: {
        rounded: "lg",
    },
});
//# sourceMappingURL=DataTablePagination.js.map