Pagination
Server pagination with totals: “51–100 of 1,284”, a 25 / 50 / 100 page size, page and size in the URL, jump to page, and “Load more” for append-only logs.
Covers: pagination primitive, pagination designer. Exports: Pagination.
Anatomy
The component as it sits in the product: English, compact, real data shapes.
States
8 states, left to right, top to bottom. A mock poll never finishes, so each state is drawn on purpose.
Density
The phone shell is always comfortable (POWERUPS #15): 44px tap targets, 16px inputs. Compact exists on desktop only; see the desktop page.
English · 中文
Staff pick en or cn (T001 Q25). Labels arrive localised; CJK falls back to PingFang SC / Noto Sans SC.
Long string · permission denied
The long-string case (PL-063) and what a role without the permission sees (the server decides; T003).
Contract
The @rj/admin-kit API for this family. Mirrored in CONTRACT.md.
- Export
Pagination·@rj/admin-kit- Props
page·perPage25|50|100 ·total·lastPage·modepages|loadMore- States
- first · middle · last · loading · empty
- shadcn / Radix
- Select (page size) · Button
- Package underneath
- nuqs (page, per_page)
- Accessibility
- nav aria-label=Pagination; disabled arrows are aria-disabled, not removed
- API operations
- any list with page / per_page (69 GETs), e.g. admin.api-request-logs.index
- Phone variant
- “Load 25 more” button under the cards