Summary
Create `` to implement the PatternFly v6 Pagination component.
Page navigation controls for data views, with page/per-page controls and optional compact mode.
Prior Art
| Source |
Element |
Status |
| PFE v4 |
-- |
-- |
| cem |
-- |
-- |
| cockpit |
-- |
-- |
| chickadee |
-- |
-- |
| Red Hat |
`` |
Exists |
Requirements
- MUST implement PFv6 visual designs
- MUST provide end-user feature parity with `@patternfly/react-core` Pagination
- MAY adjust element API to leverage web platform strengths
- SHOULD maintain CSS custom property theming compatibility
- SHOULD expose useful CSS shadow parts
Element-specific considerations
- React `itemCount`, `page`, `perPage` - controlled props; map to `item-count`, `page`, `per-page` attributes
- React `onSetPage`, `onPerPageSelect`, `onFirstClick`, `onLastClick`, `onNextClick`, `onPreviousClick` - emit corresponding events (`page-change`, `per-page-change`, etc.)
- React `variant`: `top`, `bottom`, `left` - affects button arrangement; map to `variant` attribute
- React `isCompact` - compact layout; map to `compact` attribute
- React `isSticky` - CSS sticky positioning; map to `sticky` attribute
- React `isDisabled` - disables all controls
- React `perPageOptions` - array of `{ title, value }`; map to JSON attribute or `` sub-elements
- React `PaginationTitles` - i18n strings for button labels; map to `*-label` attributes
- First/last page buttons disabled at boundaries; prev/next disabled at start/end
- ARIA: each navigation button needs `aria-label`; page count is a live region if it updates
Checklist
Implementation
Demos
Tests
Reviews
Ship
Summary
Create `` to implement the PatternFly v6 Pagination component.
Page navigation controls for data views, with page/per-page controls and optional compact mode.
Prior Art
Requirements
Element-specific considerations
Checklist
Implementation
Demos
Tests
Reviews
Ship