Pagination
Cursor-style paging for the console's APIs: “Load more”, or previous and next.
function LoadMore() {
const [n, setN] = useState(50);
return <Pagination hasMore={n < 200} onLoadMore={() => setN((x) => Math.min(200, x + 50))} />;
}import { Pagination } from "@logicplanes/kaeso-ui";Props
hasMorebooleanWhether there is a next page.
hasPreviousbooleanWhether there is a previous page.
loadingbooleanShows that a page is loading.
onLoadMore(() => void)Called by the Load more button.
onNext(() => void)Called to go to the next page.
onPageChange((page: number) => void)Called with the chosen page number.
onPrevious(() => void)Called to go to the previous page.
pagenumber = 1pages:
pageCountnumber = 1The number of pages, for numbered pages.
variant"cursor" | "load-more" | "pages" = load-moreNumbered pages, previous and next by cursor, or a Load more button.