Pagination
Standalone pagination component. Works with any data source — not coupled to react-table.
Usage
import { Pagination, PaginationProps } from "@desk/ui/components/pagination";Best practices
Drive it as a controlled control — pass
page+totalPagesand update state inonPageChange; it holds no internal page state.It is data-source agnostic (not coupled to react-table); for grid paging use the DataGrid's own pagination parts instead.
Signal an in-flight jump with
loadingPage={n}so only that button spins; leave a11y labels to the component (each control is pre-labelled).
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| className | string | Additional className for the nav wrapper | |
| disabled | boolean | Disable all controls | |
| loadingPage | number | Page button to render in loading state | |
| onPageChange | (page: number) => void | Called when page changes | |
| page | number | Current page (1-indexed) | |
| size | ResponsiveSize | "sm" | Button size — a single token or a per-breakpoint object like
|
| totalPages | number | Total number of pages |
Also exports
- interface
PaginationProps
Composition
Builds on