Component · C-028

Pagination

Controlled navigation between numbered pages. It compresses the range with an ellipsis, announces the current page and disables the ends.

Install

Install koten-theme first when the project has no Koten tokens yet.

npx shadcn@latest add https://koten.codehive.com.co/r/pagination.json

Accessibility

• navLabel names the navigation and pageLabel names each page button.
• The current page uses aria-current="page", plus its own background and weight.
• Previous and next are disabled at the ends and their icons are decorative.
• Ellipses are aria-hidden; the buttons keep focus and tab order.

Read the whole page

• Markdown page
• Agent index (llms.txt)
• Full documentation (llms-full.txt)

Koten UI · llms.txt · llms-full.txt · Markdown