Pagination
Page numbers in fixed slots, so the control never changes width.
$149 once · every Pro piece
Customize
One raised square slides to the current page, and when the window shifts the numerals roll to their new values.
Install
npx shadcn@latest add @obsyde/paginationNeeds your licence key · Get Pro
Usage
Import it from where the CLI puts it, or copy the files below by hand.
import { Pagination } from '@/components/obsyde/ember/pagination/Pagination';
export function Example() {
return (
<Pagination page={5} total={20} />
);
}
Files
What you get with Pro: plain React, TypeScript and CSS, with no dependencies.
ember/pagination/Pagination.tsxcomponentember/pagination/pagination.cssstylesember/pagination/PaginationDemo.tsxdemoember/nav-kit/icons.tsxsharedember/nav-kit/motion.tssharedember/shared/spring.tssharedember/shared/accent.tssharedember/shared/ember.cssshared
API
| Prop | Type | Default |
|---|---|---|
accentAccent | 'ember' | 'volt' | 'arc' | 'ember' |
pagePage | number | 5 |
totalPages | number | 20 |
siblingsSiblings | number | 1 |