Pagination
Page list with smart ellipses and sibling count, or a compact simple variant. `pageRange()` is exported for custom UIs.
3 files · 128 locdeps: clsx, tailwind-merge
Installation
With the shadcn CLI, pointing at this platform’s registry:
npx shadcn@latest add https://opusui.131199999.xyz/r/pagination.jsonOr offline, straight from your opus55 checkout (copies every file it needs):
node ../tailwind_component/opus55/scripts/add.mjs paginationUsage
import { Pagination } from "@/components/opus/ui/pagination";
<Pagination total={20} page={page} onPageChange={setPage} />API
| Prop | Type | Default | Description |
|---|---|---|---|
| total | number | — | Page count. |
| page / defaultPage / onPageChange | number | — | Current page (1-based). |
| siblings | number | 1 | Pages beside the current one. |
| variant / size | "numbers" | "simple" / "sm" | "md" | — | Presentation. |