@premieroctet/next-admin
Version:
Next-Admin provides a customizable and turnkey admin dashboard for applications built with Next.js and powered by the Prisma ORM. It aims to simplify the development process by providing a turnkey admin system that can be easily integrated into your proje
93 lines (92 loc) • 5.05 kB
JavaScript
import { jsx, jsxs } from "react/jsx-runtime";
import { ChevronLeftIcon, ChevronRightIcon } from "@heroicons/react/20/solid";
const MAX_SHOWN_PAGES = 5;
function getShownPagesPagination(pagesTotalNumber, currentPageIndex, separator, maxShownPages) {
const currentPage = currentPageIndex + 1;
if (pagesTotalNumber <= maxShownPages) return Array.from({
length: pagesTotalNumber
}, (_, i)=>i + 1);
if (1 === currentPage || 2 === currentPage) return [
1,
2,
3,
separator,
pagesTotalNumber
];
if (currentPage === pagesTotalNumber || currentPage === pagesTotalNumber - 1) return [
1,
separator,
pagesTotalNumber - 2,
pagesTotalNumber - 1,
pagesTotalNumber
];
return [
1,
separator,
currentPage - 1,
currentPage,
currentPage + 1,
separator,
pagesTotalNumber
];
}
function Pagination({ currentPageIndex, totalPageCount, onPageChange }) {
const getCanNextPage = ()=>currentPageIndex < totalPageCount - 1;
const getCanPreviousPage = ()=>currentPageIndex > 0;
return /*#__PURE__*/ jsx("div", {
className: "bg-nextadmin-background-default dark:bg-dark-nextadmin-background-subtle flex items-center justify-end space-x-2 rounded-md",
children: /*#__PURE__*/ jsxs("nav", {
className: "isolate inline-flex -space-x-px rounded-md shadow-sm",
"aria-label": "Pagination",
children: [
/*#__PURE__*/ jsxs("button", {
type: "button",
disabled: !getCanPreviousPage(),
onClick: ()=>{
onPageChange(currentPageIndex - 1);
},
className: "text-nextadmin-content-default dark:text-dark-nextadmin-content-default ring-nextadmin-border-strong dark:ring-dark-nextadmin-border-strong/50 hover:bg-nextadmin-background-subtle dark:hover:bg-dark-nextadmin-background-muted relative inline-flex items-center rounded-l-md px-2 py-2 ring-1 ring-inset focus:z-20 focus:outline-offset-0 disabled:cursor-not-allowed disabled:opacity-50",
children: [
/*#__PURE__*/ jsx("span", {
className: "sr-only",
children: "Previous"
}),
/*#__PURE__*/ jsx(ChevronLeftIcon, {
className: "h-5 w-5",
"aria-hidden": "true"
})
]
}),
getShownPagesPagination(totalPageCount, currentPageIndex, "\u2026", MAX_SHOWN_PAGES).map((pageNumber, index)=>/*#__PURE__*/ jsx("button", {
type: "button",
"aria-current": "page",
onClick: ()=>{
if (isNaN(Number(pageNumber))) return;
onPageChange(Number(pageNumber) - 1);
},
className: pageNumber === currentPageIndex + 1 ? "bg-nextadmin-brand-default dark:bg-dark-nextadmin-background-muted ring-nextadmin-border-strong dark:ring-dark-nextadmin-border-strong/50 text-nextadmin-brand-inverted dark:text-dark-nextadmin-brand-inverted relative z-10 inline-flex items-center px-4 py-2 text-sm font-semibold focus:z-20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 dark:ring-1 dark:ring-inset" : "ring-nextadmin-border-strong dark:ring-dark-nextadmin-border-strong/5 relative hidden items-center px-4 py-2 text-sm font-semibold text-gray-900 ring-1 ring-inset hover:bg-gray-50 focus:z-20 focus:outline-offset-0 md:inline-flex dark:text-white dark:hover:bg-slate-500",
children: pageNumber
}, index)),
/*#__PURE__*/ jsxs("button", {
disabled: !getCanNextPage(),
type: "button",
onClick: ()=>{
onPageChange(currentPageIndex + 1);
},
className: "text-nextadmin-content-default dark:text-dark-nextadmin-content-default ring-nextadmin-border-strong dark:ring-dark-nextadmin-border-strong/50 hover:bg-nextadmin-background-subtle dark:hover:bg-dark-nextadmin-background-muted relative inline-flex items-center rounded-r-md px-2 py-2 ring-1 ring-inset focus:z-20 focus:outline-offset-0 disabled:cursor-not-allowed disabled:opacity-50",
children: [
/*#__PURE__*/ jsx("span", {
className: "sr-only",
children: "Next"
}),
/*#__PURE__*/ jsx(ChevronRightIcon, {
className: "h-5 w-5",
"aria-hidden": "true"
})
]
})
]
})
});
}
export { Pagination };