Components › Navigation
Pagination
Move through pages of results, with gaps for long ranges.
Installation
npx plankui@latest add paginationUsage
import { Pagination } from "@/components/ui/pagination";
<Pagination page={page} pageCount={20} onPageChange={setPage} />API reference
| Prop | Type | Default | Description |
|---|---|---|---|
| page | number | required | Current page, from 1. |
| pageCount | number | required | Total pages. |
| onPageChange | (page: number) => void | required | Called on navigation. |
| siblings | number | 1 | Pages shown either side of the current one. |