Pagination
NavigationStable
Pagination controls for navigating through pages of content. Active page uses the outline button variant.
Quick Import
import { Pagination } from "@cohere-ai/waypoint-ui/pagination";Live Preview
Loading Pagination...
Props
| Name | Type | Default | Description |
|---|---|---|---|
isActive (PaginationLink) | boolean | - | Marks as current page (uses outline variant) |
size (PaginationLink) | Button size | 'icon' | Button size |
Examples
Basic Pagination
Pagination with previous, pages, ellipsis, and next
1 import { 2 Pagination, PaginationContent, PaginationItem, 3 PaginationLink, PaginationPrevious, PaginationNext, PaginationEllipsis, 4 } from '@cohere-ai/waypoint-ui/pagination'; 5 6 <Pagination> 7 <PaginationContent> 8 <PaginationItem><PaginationPrevious href="#" /></PaginationItem> 9 <PaginationItem><PaginationLink href="#">1</PaginationLink></PaginationItem> 10 <PaginationItem><PaginationLink href="#" isActive>2</PaginationLink></PaginationItem> 11 <PaginationItem><PaginationEllipsis /></PaginationItem> 12 <PaginationItem><PaginationNext href="#" /></PaginationItem> 13 </PaginationContent> 14 </Pagination>
Additional Resources
Found an Issue?
If you've encountered a bug or have feedback about the Pagination component, please report it to our team. Your feedback helps us improve Waypoint.
Available for all users • Issue will be created in Linear
Was this page helpful?
Your feedback helps us improve our documentation.
Need Help?
Check out the Whitelabeling Playground to explore customization options or visit the Developer Guide for integration help.