navigation
Pagination
Interactive
Import
import { Pagination } from '@connor-adams/designsystem'Usage
Page navigation for long transaction lists and search results.
<Pagination page={page} pageCount={24} onPageChange={setPage} />
Long ranges collapse to first/last with an ellipsis. siblingCount widens the window around the current page.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| page | number | 1 | |
| pageCount | number | 1 | |
| onPageChange | ((page: number) => void) | undefined | — | |
| siblingCount | number | undefined | 1 |