- Removed support for depecrated
extraAriaContext
(please useariaLabelBuilder
instead)
- Support React 18 (see: AdeleD#423)
- Excluded unnecessary files from package (see: AdeleD#410)
- Add TypeScript definition for
pageLabelBuilder
prop
- A new prop
onClick
has been added. It is a callback for any click on the component. It exposes information on the part clicked (for eg.isNext
for when next control is clicked orisBreak
for a break clicked), the next expected pagenextSelectedPage
& others. Can returnfalse
to prevent any page change or a number to override the page to jump to. Just return nothing (orundefined
) to let default behavior take place. (see: AdeleD#263) - Prevent breaks to be displayed when both
pageRangeDisplayed
andmarginPagesDisplayed
are 0
- Fix bug on
marginPagesDisplayed={0}
(see: AdeleD#396)
- Add TypeScript definitions directly in the repository (instead of community definitions from DefinitelyTyped) (see: AdeleD#394)
- Fix the indexed passed when replacing a break (containing only one page) with the actual page (see: AdeleD#395)
- Remove button role for links with an href (see: AdeleD#390)
- Add a rel attribute on previous page, current page and next page controls. They are respectivement customizable thanks to props
prevPageRel
,selectedPageRel
andnextPageRel
. To disable the rel attribute, set them tonull
. (see: AdeleD#391) - A new prop
disabledLinkClassName
has been added. It allows to add a custom class on disabledprevious
andnext
controls. Default toundefined
(no class added). tabindex
is now set to-1
on disabled controls (disable previous/next buttons; active page button). (see: AdeleD#219)- Add a warning when providing an
initialPage
prop value that is greater than the maximum page index frompageCount
prop. - Add a warning when providing a
forcePage
prop value that is greater than the maximum page index frompageCount
prop. - The
href
generated fromhrefBuilder
prop is now also set on active page control<a>
tag. (see #242) - A new prop
hrefAllControls
has been added. It allows to enablehrefBuilder
for all controls. - Fix page range of 2 when first page is selected. (see AdeleD#307)
- Fix the breaking algorithm to not create breaks for only one page (see: AdeleD#270)
- Fix the Webpack build to work for both browser and Node (see: AdeleD#389)
- Add a warning when providing both
initialPage
andforcePage
props. You should only providesforcePage
when the component is controlled. (see: AdeleD#290)
- A new prop
renderOnZeroPageCount
has been added. It allows to define what to display whenpageCount
is zero. By default, it lets the main pagination boxes be displayed (Previous / Next). To display nothing, just providesrenderOnZeroPageCount={null}
. (see: AdeleD#377) - A new prop
className
has been added, which is an alias tocontainerClassName
and is useful for integration with CSS-in-JS frameworks like styled-components. (see: AdeleD#321) - Fix the Webpack build by providing a
web
target (see: AdeleD#317) - Add a warning when a non integer is provided for
pageCount
- Remove react-hot-loader from production build.
- A new prop
pageLabelBuilder
has been added. It allows to customize pages labels of the component. By default, the page number is displayed (see: AdeleD#334).
- Add an onPageActive callback (see: AdeleD#349).
- Compatibility with React v17.0
- Add a rel attribute on previous/next buttons. Rel attributes are customizable thanks to props 'prevRel' and 'nextRel' (see: AdeleD#326).
- Upgrade devDependencies packages jest-cli and webpack-cli.
- Add a prop 'eventListener' to let users use a custom event listener on prev/next buttons, pages and break views.
- Two properties have been added to extend accessibility support (see AdeleD#164).
- nextAriaLabel: defines the aria-label html property for the 'Next page' button (default: 'Next page').
- previousAriaLabel: defines the aria-label html property for the 'Previous page' button (default: 'Previous page').
- Upgrade devDependencies packages (see: AdeleD#314).
- Bump dependency 'mixin-deep' from 1.3.1 to 1.3.2 (see: AdeleD#283).
- Handle 'forcePage' value if set from outside (see: AdeleD#272).
- Add the ariaLabelBuilder feature to customize aria-label attributes (see: AdeleD#260).
- Fix the breakLabel prop type in the BreakView component (see: AdeleD#257).
- Add the breakLinkClassName prop.
- Add aria-disabled prop to anchors for accessibility (AdeleD#254)
- Setup eslint and prettier for dev
- Implement forward/backward jump when clicking on a breakview (ellipsis).
- The 'breakLabel' prop should not receive an
<a>
tag anymore. Otherwise, a warning will appear in the JS console:validateDOMNesting(...): <a> cannot appear as a descendant of <a>.
- Tests improvements + fix package release (AdeleD#245).
- Add the activeLinkClassName property.
- Upgrade webpack dev dependencies (Fix "Cannot read property 'properties' of undefined" from webpack-cli).
- Use ES6 export in react_components/index.js (AdeleD#203).
- Add a role="button" on
<a>
tags to let screen readers know explicitly that links (without href) are intended to be interactive elements (AdeleD#212).
- Remove the useless node_modules folder from the previous release (AdeleD#208).
- Fix
disabledClassName
not used in previous and next classnames (AdeleD#204).
- Delete the dependency on
react-addons-create-fragment
. - Delete the dependency on
classnames
.
- Refactor using destructuring.
- Upgrade react-hot-loader to version 3.0.0 (dev dependency).
- Compatibility with React v16.0
- The HTML attribute
aria-label
has been added. - A new prop
extraAriaContext
allows to add some extra text to the end of thearia-label
to provide additional context to the users.
- A new prop
hrefBuilder
has been added. It allows to add customhref
attributes on<a>
tags of the component. - Packages
react
andreact-addons-create-fragment
are now dependencies (see package.json).
-
Some variable have been renamed:
clickCallback
->onPageChange
initialSelected
->initialPage
forceSelected
->forcePage
pageNum
->pageCount
-
onClick
events have been moved on<a>
tags (previously on<li>
s).
clickCallback
(onPageChange
) isn't called during initialization anymore.
HTML Structure:
<ul class="pagination">
<li class="disabled">
<a href="#"><span>«</span></a>
</li>
<li class="active"><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li>
<a href="#"><span>»</span></a>
</li>
</ul>
HTML Structure:
<ul>
<li class="disabled">
<a href="#"><span>«</span></a>
</li>
<li>
<ul>
<li class="active"><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
</li>
<li>
<a href="#"><span>»</span></a>
</li>
</ul>