Table pagination
Pagination:
- pagination elements now have an aria-label: "Page x , Current Page" for current page, "Go to page y" for other pages
- current pagination page has aria-current=true
- refactor Pagination into its own component, use it in List and Table components
- apply accessibility fixes in the Pagination component
- remove tabindex from
<li>
, make<a>
tags focusable by adding an href - on click of
<a>
prevent default and delegate click to parent<li>
(bcs that's the element where the click event is attached) - apply aria-label, aria-current to the
<a>
tags accordingly - make previous and next buttons into
<a>
tags, fix their interactivity - expose ref to pagination
<nav>
wrapper - pagination can be customized with the
pagination.itemRender
prop, which takes a function same asitemRender
from antd (demo in stories)
- remove tabindex from
Other fixes:
- "Select all" checkbox on top of the table in UserList should display correctly (intermediate state was buggy)
Test notes:
- check that pagination is working fine in Lists and Tables (check in stories, also in Discover, Dashboard, UserList in the app)
- test keyboard interaction (tab through the pages, activate with Enter)